@font-face{font-family:Crusoe;src:url('/fonts/CrusoeText-Regular.woff') format('woff');font-display:swap}
@font-face{font-family:Crusoe;src:url('/fonts/CrusoeText-Bold.woff') format('woff');font-weight:700;font-display:swap}
@font-face{font-family:Marelle;src:url('/fonts/Marelle-Regular.ttf') format('truetype');font-display:swap}
@font-face{font-family:Baton;src:url('/fonts/MarelleBaton-Regular.ttf') format('truetype');font-display:swap}
:root{--paper:#f7f5ef;--ink:#30483f;--muted:#727a70;--line:#dedfd5;--green:#46634f;--lilac:#e7def5;--rose:#f4e2eb;--blue:#dfeff4;--peach:#f7ded1;--yellow:#f4e9ba}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Crusoe,Georgia,serif;font-size:18px;line-height:1.5}button,input,select{font:inherit;color:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #7a6597;outline-offset:5px}button{border:0}button,input,select{min-height:48px}button{transition:transform .16s,background .16s}button:not(:disabled):active{transform:translateY(2px)}a{color:inherit}h1,h2,h3,p{margin:0}h1,h2{font-weight:400}h1{font-size:clamp(34px,4.1vw,56px);line-height:1.18;letter-spacing:-1.3px}h2{font-size:32px}h3{font-size:23px}small{font-size:14px}input:not([type=range]),select{border:1px solid #cdd2c6;border-radius:12px;padding:10px 14px;background:#fffefa;max-width:100%}input[type=range]{accent-color:var(--green);width:100%;cursor:pointer}label{display:grid;gap:8px}header{max-width:1280px;margin:auto;padding:29px 48px;display:flex;justify-content:space-between;align-items:center;gap:20px}.brand{display:flex;gap:11px;align-items:center;font-size:20px}.brand-mark{width:36px;height:38px;display:grid;place-items:center;background:var(--green);color:#f2eccf;border-radius:16px 16px 7px 7px;font-size:25px}.date{font-size:15px;color:var(--muted)}main{max-width:1120px;margin:0 auto;padding:38px 40px 80px;min-height:calc(100vh - 180px)}.eyebrow{font-family:Baton,Arial,sans-serif;letter-spacing:1.6px;text-transform:uppercase;font-size:13px;color:var(--muted);margin-bottom:16px}.hero{text-align:center;margin:15px auto 42px;max-width:720px}.hero p:not(.eyebrow){margin-top:18px;color:var(--muted);font-size:20px}.hand{font-family:Marelle,cursive}.hero .hand{font-size:1.3em;color:var(--green)}.welcome-art{height:86px;margin:0 auto 21px;display:flex;justify-content:center;align-items:center;gap:9px;transform:rotate(-5deg)}.art-block{height:64px;width:58px;border:1px solid #bac5ac;background:#e5ead7;border-radius:14px 14px 8px 8px;display:grid;place-items:center;font-family:Marelle;font-size:37px;box-shadow:0 5px 0 #d1d9c6}.art-block:nth-child(2){background:var(--yellow);border-color:#d4c788;height:78px;transform:rotate(10deg);box-shadow:0 5px 0 #e3d69d}.art-block:nth-child(3){background:var(--lilac);border-color:#c3b4d6;transform:rotate(-3deg);box-shadow:0 5px 0 #d1c4e1}.students{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;max-width:940px;margin:0 auto}.student{min-width:245px;flex:0 1 29%;min-height:97px;display:flex;align-items:center;gap:20px;padding:18px 24px;background:#fffefa;border:1px solid var(--line);border-radius:20px;box-shadow:0 5px 0 #e7e7df;text-align:left}.student:hover{background:#f0f3e8;transform:translateY(-3px)}.student-name{font-family:Marelle;font-size:36px}.avatar{width:48px;height:48px;display:grid;place-items:center;flex-shrink:0;border-radius:50%;background:#e4eadb;font-family:Baton;font-size:24px}.student:nth-child(3n+2) .avatar{background:var(--lilac)}.student:nth-child(3n) .avatar{background:var(--peach)}.arrow{margin-left:auto;font-size:20px;color:#9aa08f}.bottom-note{text-align:center;color:var(--muted);font-size:15px;margin-top:44px}.footer{max-width:1280px;margin:0 auto;padding:16px 48px 25px;display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:14px}.teacher-entry{background:transparent;font-size:22px;color:#7f8b7c;min-width:44px;opacity:.65}.teacher-entry:hover{opacity:1}.btn{padding:12px 23px;border-radius:13px;background:var(--green);color:#fffefa;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:9px;text-decoration:none}.btn:hover{background:#36523e}.btn.secondary{background:#fffefa;color:var(--ink);border-color:var(--line)}.btn.secondary:hover{background:#efeee6}.btn.quiet{background:transparent;color:var(--muted);border-color:transparent}.btn.danger{background:#f5e5df;color:#7b4035}.student-bar{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:0 0 34px}.name-pill{border:1px solid var(--line);background:#fffefa;border-radius:40px;padding:5px 20px;display:flex;align-items:center;gap:10px;font-family:Marelle;font-size:28px}.name-pill .avatar{width:34px;height:34px;font-size:18px}.clock{font-variant-numeric:tabular-nums;display:flex;gap:10px;align-items:center;border-radius:30px;background:#e8eddf;padding:9px 18px;font-size:19px}.theme-heading{text-align:center;margin-bottom:35px}.theme-heading h1{font-size:42px}.theme-heading p{color:var(--muted);margin-top:12px}.themes{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.theme{min-height:203px;text-align:left;border-radius:24px;padding:25px 28px;background:var(--tile);border:1px solid #0000000c;box-shadow:0 5px 0 color-mix(in srgb,var(--tile),#687458 12%);position:relative;color:var(--ink);opacity:1}.theme-icon{font-family:Georgia,serif;font-size:35px;display:block;line-height:1.1;margin-bottom:24px}.theme-name{font-family:Marelle;font-size:34px;display:block;line-height:1.1}.theme-hint{display:block;font-size:14px;margin-top:9px}.soon{position:absolute;top:24px;right:22px;font-family:Baton,sans-serif;font-size:12px;letter-spacing:.4px;border:1px solid #00000015;padding:3px 8px;border-radius:12px}.lilac{--tile:var(--lilac)}.rose{--tile:var(--rose)}.blue{--tile:var(--blue)}.green{--tile:#e4eccf}.peach{--tile:var(--peach)}.yellow{--tile:var(--yellow)}.waiting{text-align:center;padding-top:35px}.waiting .hero{margin-top:22px}.waiting-icon{width:142px;height:142px;border-radius:50%;background:#e8eddf;margin:25px auto;display:grid;place-items:center;font-size:67px;color:#5b7051}.waiting-line{display:flex;justify-content:center;gap:10px;margin:30px}.waiting-line span{height:8px;width:8px;border-radius:50%;background:#b1bd9e}.waiting-line span:nth-child(2){background:#839571}.waiting-line span:nth-child(3){background:#4d694c}.ready-note{display:inline-block;border:1px solid var(--line);border-radius:14px;padding:14px 25px;background:#fffefa;font-size:16px}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap}.admin-top{margin-bottom:26px}.admin-top p{color:var(--muted);margin-top:10px}.tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);margin-bottom:30px;overflow-x:auto}.tab{padding:14px 18px;background:transparent;color:var(--muted);white-space:nowrap;border-bottom:3px solid transparent}.tab.active{border-color:var(--green);color:var(--ink)}.panel{border:1px solid var(--line);background:#fffefa;border-radius:22px;padding:28px;margin-bottom:24px}.panel p{color:var(--muted);margin:8px 0 20px}.session-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px}.timer-large{font-size:58px;font-variant-numeric:tabular-nums;letter-spacing:-2px;margin:18px 0}.button-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.list-row{display:flex;gap:18px;align-items:center;padding:15px 0;border-bottom:1px solid #ecece3}.list-row:last-child{border-bottom:0}.list-row .status{margin-left:auto;font-size:14px;color:var(--muted)}.present-dot{display:inline-block;width:8px;height:8px;background:#64835a;border-radius:50%;margin-right:6px}.empty{text-align:center;padding:38px 25px;color:var(--muted)}.empty h2{color:var(--ink);margin-bottom:14px}.form-row{display:flex;gap:12px;align-items:end;flex-wrap:wrap}.form-row label{flex:1}.level-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:25px}.level-item{background:#f7f6f0;border-radius:16px;padding:18px}.level-title{display:flex;justify-content:space-between;gap:10px;font-size:16px}.level-number{font-family:Baton;font-size:14px;border-radius:8px;background:#e4eadb;padding:2px 8px}.ticks{display:flex;justify-content:space-between;color:var(--muted);font-family:Baton;font-size:12px;padding:0 4px}.subtle{color:var(--muted);font-size:15px}.mode-row{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid #ecece3}.mode-row span{flex:1}.mode-row select{width:220px}.notice-inline{border-left:3px solid #b5bf9e;padding:8px 16px;color:var(--muted);font-size:15px;margin:18px 0 25px}.loading{text-align:center;padding-top:20vh}dialog{border:1px solid var(--line);border-radius:24px;padding:32px;max-width:470px;width:calc(100% - 32px);color:var(--ink);background:var(--paper);box-shadow:0 30px 100px #22352826}dialog::backdrop{background:#243c3559;backdrop-filter:blur(3px)}dialog h2{margin-bottom:12px}dialog p{color:var(--muted);margin-bottom:24px}dialog .button-row{margin-top:24px}.form-error{color:#923e35;font-size:15px;min-height:24px;margin-top:10px}#notice{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);border-radius:14px;background:var(--ink);color:white;max-width:90vw;padding:0;z-index:5;font-size:16px;box-shadow:0 6px 30px #0002}#notice:not(:empty){padding:13px 22px}.connection{background:#fff0cf;text-align:center;color:#715b2b;padding:12px;font-size:15px}
@media(min-width:1200px){.students{margin-top:50px}.hero{margin-top:28px}.theme{min-height:218px}}
@media(max-width:760px){header{padding:22px 22px}.date{display:none}main{padding:20px 20px 50px}.footer{padding:16px 22px}.hero{margin:15px auto 32px}.students{gap:14px}.student{min-width:0;flex:1 1 42%;padding:16px;gap:12px;min-height:85px}.student-name{font-size:31px}.avatar{width:37px;height:37px;font-size:20px}.themes{grid-template-columns:repeat(2,1fr);gap:16px}.theme{padding:22px 18px;min-height:190px}.theme-name{font-size:29px}.theme-hint{font-size:13px}.soon{right:15px;top:20px}.session-layout{grid-template-columns:1fr;gap:0}.level-grid{grid-template-columns:repeat(2,1fr)}.panel{padding:22px}.theme-heading h1{font-size:35px}.clock{font-size:16px;padding:8px 13px}.brand{font-size:18px}.tabs{gap:0}.tab{padding:12px}.mode-row{flex-wrap:wrap}.mode-row select{width:100%}.waiting{padding-top:10px}}
@media(max-width:420px){.student{flex-basis:100%}.level-grid{grid-template-columns:1fr}.theme-name{font-size:25px}.theme-hint{display:none}.theme{min-height:165px}.student-bar{align-items:start}.name-pill{font-size:24px;padding:5px 12px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Minimal interface: only names, subjects and essential state labels. */
main.student-main,main.admin-main{min-height:calc(100dvh - 85px);padding-top:65px}
.student-main .students{margin-top:35px;justify-content:flex-start;max-width:none}
.student-main .student{justify-content:center;text-align:center;min-width:190px;flex:0 1 calc(25% - 15px)}
.student-main .theme{display:flex;align-items:center;justify-content:center;text-align:center;min-height:190px}
.student-main .theme-name{font-size:38px}
.student-main .waiting{display:grid;place-items:center;min-height:45vh;padding:0}
.student-main .waiting h1{font-family:Marelle,cursive;font-size:44px;letter-spacing:0}
.footer{justify-content:flex-end}
@media(max-width:760px){main.student-main,main.admin-main{padding-top:32px}.student-main .students{margin-top:15px}.student-main .student{min-width:0;flex:1 1 42%}.student-main .theme{min-height:160px}.student-main .theme-name{font-size:30px}}

/* One screen, with subjects arranged as a ring of round bubbles. */
#app.pupil-session{height:100vh;height:100dvh;display:flex;flex-direction:column}
#app.pupil-session main.student-main{width:100%;max-width:1120px;flex:1;min-height:0;display:flex;flex-direction:column;padding:clamp(12px,3vh,28px) clamp(12px,3vw,40px) 8px}
#app.pupil-session .student-bar{flex:none;margin:0 0 clamp(8px,2vh,20px);align-items:center}
#app.pupil-session .footer{width:100%;flex:0 0 48px;min-height:48px;padding:0 20px;align-items:center}
#app.pupil-session .connection{flex:none;padding:6px 12px}
#app.pupil-session .waiting{flex:1;min-height:0}
#app.pupil-session .themes{position:relative;display:block;flex:1;min-height:0;width:100%;max-width:920px;margin:0 auto;container-type:size}
#app.pupil-session .theme{position:absolute;display:flex;align-items:center;justify-content:center;min-height:0;width:min(28cqw,28cqh);height:min(28cqw,28cqh);padding:8px;border:1px solid #00000008;border-radius:50%;box-shadow:0 4px 0 color-mix(in srgb,var(--tile),#687458 9%);transform:translate(-50%,-50%);text-align:center}
#app.pupil-session .theme-name{font-size:clamp(14px,min(4cqw,4cqh),36px);line-height:1.2;max-width:100%;overflow-wrap:normal}
#app.pupil-session .theme:nth-child(1){left:50%;top:calc(50% - min(34cqw,34cqh))}
#app.pupil-session .theme:nth-child(2){left:calc(50% + min(29.4cqw,29.4cqh));top:calc(50% - min(14cqw,14cqh))}
#app.pupil-session .theme:nth-child(3){left:calc(50% + min(29.4cqw,29.4cqh));top:calc(50% + min(14cqw,14cqh))}
#app.pupil-session .theme:nth-child(4){left:50%;top:calc(50% + min(34cqw,34cqh))}
#app.pupil-session .theme:nth-child(5){left:calc(50% - min(29.4cqw,29.4cqh));top:calc(50% + min(14cqw,14cqh))}
#app.pupil-session .theme:nth-child(6){left:calc(50% - min(29.4cqw,29.4cqh));top:calc(50% - min(14cqw,14cqh))}

/* Leave space for the ascenders and descenders of the handwritten names. */
.name-pill{display:block;width:fit-content;max-width:calc(100% - 110px);min-width:120px;min-height:80px;padding:10px 26px;font-size:28px;line-height:2.1;text-align:center;overflow-wrap:anywhere;border-radius:30px}
.name-pill .avatar{display:none}
.student-name{display:block;max-width:100%;line-height:2.1;overflow-wrap:anywhere}
.student-main .student{min-height:112px;padding:14px 26px}
@media(max-width:760px){.name-pill{font-size:26px;min-height:76px;padding:10px 22px}.student-main .student{min-height:102px;padding:12px 22px}}
@media(max-height:550px){.name-pill{font-size:23px;min-height:64px;padding:6px 22px}}

/* Wider ovals leave enough room for the long subject names. */
#app.pupil-session .theme{width:min(38cqw,38cqh);height:min(22cqw,22cqh);padding:10px 18px;border-radius:50%}
#app.pupil-session .theme-name{font-size:clamp(12px,min(2.9cqw,2.9cqh),30px);line-height:1.55;max-width:90%;word-break:normal;overflow-wrap:normal}

/* Allow the full ascenders and descenders of the handwritten Back labels. */
.calc-toolbar,.phrase-toolbar{height:auto!important;min-height:54px;overflow:visible;flex-shrink:0;line-height:1.65;padding:3px 0}.calc-toolbar .btn.quiet,.phrase-toolbar .btn.quiet{height:auto;min-height:50px;line-height:1.65;padding:5px 14px;overflow:visible} #app.pupil-session main.student-main{overflow:visible}

.pupil-help{align-self:center;flex:none;margin-bottom:8px;font-size:16px}.teacher-help{border:2px solid #c09c49}.teacher-help .btn{margin:8px}

.daily-date{min-height:55vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:24px;padding:20px}.daily-date h1{font-family:Marelle,cursive;font-size:clamp(27px,4.5vw,58px);line-height:1.8;text-decoration-line:underline;text-decoration-color:#c43a46;text-decoration-thickness:2px;text-underline-offset:12px;margin:0}.daily-date p{font-size:18px;font-style:italic;margin:0}.daily-date .btn{margin-top:10px}

button[aria-busy="true"]{position:relative;cursor:progress}
button[aria-busy="true"]::after{content:"Ouverture…";position:absolute;left:50%;bottom:4%;transform:translateX(-50%);background:#fffefa;color:#34483e;border:1px solid #cdd2c6;border-radius:16px;padding:1px 8px;font:14px/1.5 sans-serif;white-space:nowrap}
#connection-status[hidden]{display:none}

.save-status{position:fixed;bottom:.3rem;left:.6rem;color:#55685c;background:#fffdf5;padding:.2rem .55rem;border-radius:.5rem;pointer-events:none;font-size:.75rem;z-index:5}
