:root{--ink:#243c35;--paper:#fbf8ef;--green:#2a664f;--lime:#deee91;--line:#d9ddce;--orange:#f6b595}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 88% 10%,#ecefcf,transparent 45%),var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}button{cursor:pointer;border:1px solid var(--line);background:white;border-radius:12px;padding:10px 16px;color:var(--ink)}button:disabled,.button[aria-disabled=true]{background:#eceee6;border-color:#d4d8cb;color:#6b7469;opacity:1;cursor:not-allowed;box-shadow:none}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #e57942;outline-offset:4px}header,footer{max-width:1320px;margin:auto;padding:32px 5%;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{font-family:Fredoka,sans-serif;font-size:25px;font-weight:500;white-space:nowrap}.brand span{color:var(--green)}.brand i{font-style:normal;margin-left:9px;color:#d78049}nav{display:flex;align-items:center;gap:30px}.button{display:inline-flex;align-items:center;justify-content:center;gap:26px;padding:17px 24px;border-radius:13px;background:var(--green);color:white;font-weight:600;border:0}.small{padding:12px 18px;font-size:14px}main{max-width:1320px;margin:auto;padding:0 5%}h1,h2,h3{font-family:Fredoka,sans-serif;font-weight:500;margin-top:0}h1{font-size:clamp(56px,6.8vw,94px);line-height:1.02;letter-spacing:-3px;margin-bottom:26px}h1 em{font-style:normal;color:var(--green);position:relative}h1 em:after{content:'';position:absolute;bottom:-5px;height:8px;background:var(--lime);left:0;right:0;transform:rotate(-3deg);z-index:-1}.hero{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:70px;padding:64px 0 90px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;margin-bottom:28px}.intro{font-size:19px;line-height:1.7;max-width:430px;margin-bottom:30px}.fine{font-size:12px;line-height:1.7;color:#637169;margin-top:18px}.preview{background:#fffef8;border:1px solid var(--line);border-radius:26px;padding:28px;transform:rotate(2deg);box-shadow:14px 16px 0 #dfe5c7;animation:arrive .7s ease-out}.preview-top{display:flex;justify-content:space-between;letter-spacing:1.5px;font-size:10px;font-weight:700}.preview h2{font-size:27px;margin:26px 0}.sample-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.sample{text-align:center;padding:22px 12px;border-radius:20px}.peach{background:#f8d2bd}.yellow{background:#f2edbc}.avatar{display:inline-grid;place-items:center;width:42px;height:42px;background:#fff9;border-radius:50%;font-weight:600}.sample h3{margin:10px 0}.sample b{font-family:Fredoka;font-size:38px;font-weight:500}.sample b span{font-size:25px}.sample p{font-size:11px}.note{margin-top:25px;font-size:14px;display:flex;justify-content:space-between;align-items:center}.note span{background:var(--lime);padding:8px 14px;border-radius:30px}.feature-strip{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:42px 0;gap:45px}.feature-strip span{font-size:10px;font-weight:700;letter-spacing:1.5px}.feature-strip h2{font-size:24px;margin:18px 0 10px}.feature-strip p{font-size:14px;line-height:1.7;color:#637169}.pricing{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:80px;padding:85px 0}.pricing h2{font-size:50px;line-height:1.08}.pricing p{line-height:1.8}.price-card{background:var(--lime);border-radius:24px;padding:35px}.price-card>p:first-child{font-size:11px;letter-spacing:1.4px;font-weight:700}.price{font-family:Fredoka;font-size:76px}.price span{font:16px 'DM Sans'}.price-card hr{border:0;border-top:1px solid #aebd77;margin:28px 0}footer{border-top:1px solid var(--line);font-size:12px;color:#637169}.workspace{padding:35px 0 70px}.workspace h1{font-size:44px;letter-spacing:-1px}.toolbar,.heading-row{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:24px}.toolbar>div{display:flex;gap:8px;flex-wrap:wrap}.tabs{background:#e7eadd;border-radius:15px;padding:5px}.tabs button{border:0;background:transparent}.tabs button[aria-pressed=true]{background:white;box-shadow:0 2px 5px #243c3515}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:16px}.student{background:#fffef9;border:1px solid var(--line);border-radius:20px;padding:20px 14px;text-align:center}.student[draggable=true]{cursor:grab}.student.dragging{opacity:.45}.student h3{margin:12px 0;font-size:21px;overflow-wrap:anywhere}.score{font-family:Fredoka;font-size:44px;margin:10px 0}.badges{height:34px;line-height:34px;font-size:28px;overflow:hidden;letter-spacing:2px}.point-actions{display:flex;gap:10px}.point-actions button{flex:1;font-size:24px;min-height:48px;padding:6px}.point-actions{gap:12px}.point-actions button:last-child{background:var(--lime);border-color:#cadd7c}.point-actions button:disabled:last-child{background:#eceee6;border-color:#d4d8cb}.student select{width:100%;margin-top:12px;padding:8px;border:1px solid var(--line);border-radius:8px;font-size:12px;background:white}.group{background:#e9edde;border-radius:22px;padding:22px;margin-bottom:24px;border:2px solid transparent}.group:nth-child(3n+2){background:#f4e6d6}.group:nth-child(3n){background:#e9e8dc}.group.over{border-color:var(--green);background:#deee91}.group h2{margin:0;font-size:25px}.group .heading-row{margin-bottom:18px}.empty{padding:24px;border:1px dashed #a9b49b;border-radius:14px;text-align:center;color:#637169}.login-card{max-width:650px;margin:70px auto 130px;background:white;border:1px solid var(--line);border-radius:24px;padding:48px}.login-card h1{font-size:44px;letter-spacing:-1px;overflow-wrap:anywhere}.login-card p{line-height:1.7}.banner{background:var(--lime);padding:18px 22px;border-radius:14px;margin-bottom:24px;line-height:1.7}.class-link{display:block;background:white;border:1px solid var(--line);padding:24px;border-radius:18px}.class-link h2{font-size:24px;margin:0 0 12px}.create-form{background:white;border:1px solid var(--line);border-radius:18px;padding:25px;max-width:600px;margin-top:30px}label{display:block;margin:15px 0 7px}input,textarea{border:1px solid var(--line);border-radius:10px;padding:12px;width:100%;background:#fffefa}textarea{min-height:160px;resize:vertical}form .button{margin-top:20px}#message{display:none;position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:var(--ink);color:white;padding:16px 24px;border-radius:14px;max-width:90%;z-index:100;box-shadow:0 10px 26px #243c3530;font-size:15px}#message.show{display:block}.button.google{background:white;color:var(--ink);border:1px solid var(--line);gap:12px;font-weight:600}.head-links{display:flex;align-items:center;gap:14px}.parent-view header nav{display:none}dialog{border:1px solid var(--line);border-radius:22px;max-width:440px;width:90%;padding:28px;color:var(--ink)}dialog::backdrop{background:#243c3577}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.dialog-actions .button{margin:0}.muted{color:#637169}@keyframes arrive{from{opacity:0;transform:translateY(15px) rotate(0)}to{opacity:1;transform:translateY(0) rotate(2deg)}}@media(max-width:760px){header,footer{padding:22px 5%;flex-wrap:wrap}.brand{font-size:21px}nav{gap:12px}nav>a:first-child{display:none}.hero{grid-template-columns:1fr;gap:45px;padding:30px 0 60px}.hero h1{font-size:64px}.preview{max-width:500px;width:96%;margin:auto}.feature-strip,.pricing{grid-template-columns:1fr;gap:25px}.pricing{padding:50px 0}.pricing h2{font-size:40px}.feature-strip{padding:30px 0}.login-card{padding:28px;margin:35px auto 65px}.workspace h1{font-size:35px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.group{padding:12px}.student{padding:15px 10px}.small{font-size:12px;padding:10px}.toolbar{align-items:stretch}.score{font-size:38px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}

.student select{appearance:none;-webkit-appearance:none;border-radius:12px;min-height:40px;padding:9px 30px 9px 12px;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 16px) 17px,calc(100% - 11px) 17px;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.status-row{display:flex;align-items:center;gap:10px;margin:-8px 0 22px;font-size:14px;color:#4c5a51}
.status-dot{width:9px;height:9px;border-radius:50%;background:var(--green)}
.status-row.ending .status-dot{background:#d78049}
.banner .button{padding:12px 18px;font-size:15px;margin:0}
.banner{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.more{position:relative}
.more>summary{list-style:none;display:inline-flex;align-items:center;min-height:44px;padding:10px 16px;border:1px solid var(--line);border-radius:12px;background:white;cursor:pointer}
.more>summary::-webkit-details-marker{display:none}
.more[open]>summary{background:#f1f3ea}
.more-menu{position:absolute;right:0;top:calc(100% + 8px);background:white;border:1px solid var(--line);border-radius:14px;padding:8px;display:grid;gap:4px;min-width:210px;box-shadow:0 14px 30px #243c3522;z-index:20}
.more-menu button,.more-menu a{width:100%;text-align:left;border:0;background:transparent;padding:11px 12px;border-radius:10px;min-height:44px;display:flex;align-items:center}
.more-menu button:hover,.more-menu a:hover{background:#f1f3ea}
.button.stage-enter{background:#1d4437;color:#fff;gap:10px}
.nav-classrooms{display:inline-flex}

/* Classroom (projector) view */
.stage-open{overflow:hidden}
.stage{position:fixed;inset:0;z-index:60;background:radial-gradient(ellipse at 50% -10%,#eaf3d2,transparent 60%),#e4eecf;color:var(--ink);display:flex;flex-direction:column;padding:20px 26px 22px}
.stage-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.stage-bar h2{flex:1 1 100%}
@media(min-width:761px){.stage-bar h2{flex:0 1 auto}}
.stage-bar .stage-actions{flex-wrap:wrap}
.stage-bar h2{font-size:clamp(22px,2.4vw,34px);margin:0;color:#1d4437;font-family:Fredoka,sans-serif;font-weight:500}
.stage-bar .stage-actions{display:flex;gap:10px;align-items:center}
.stage button{background:#fffefa;border:1px solid #c3d19b;color:#1d4437;min-height:44px;border-radius:12px;font-weight:600}
.stage button:hover{background:#fff}
.stage button[aria-pressed=true]{background:#1d4437;border-color:#1d4437;color:#fff}
.stage button:disabled{background:#dfe4d2;border-color:#cfd7bd;color:#78836f}
.stage-grid{position:relative;flex:1;display:grid;justify-content:center;align-content:normal;grid-template-columns:repeat(auto-fit,minmax(clamp(120px,10vw,200px),1fr));grid-auto-rows:minmax(0,320px);gap:clamp(6px,0.8vw,14px);overflow:auto}
.stage-card{container-type:size;position:relative;background:#fffefa;border:2px solid #3f6b50;border-radius:18px;padding:8px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center;cursor:pointer;min-height:0;box-shadow:0 4px 0 #5d7f62}
.stage-card:hover{background:#f2f8df;border-color:#27543c}
.stage-card .stage-name{font-size:clamp(15px,14cqh,40px);font-weight:600;overflow-wrap:break-word;hyphens:auto;line-height:1.15;color:#233a31;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.3em}
.stage-card .stage-score{font-family:Fredoka,sans-serif;font-size:clamp(30px,34cqh,110px);line-height:1;color:#1d4437}
.stage-card .stage-badges{height:clamp(24px,2.6vw,40px);font-size:clamp(20px,2.2vw,34px);line-height:clamp(24px,2.6vw,40px);letter-spacing:2px}
.stage-card.up{animation:bump .35s ease}
.stage-keys{position:absolute;inset:auto 0 6px 0;display:flex;justify-content:center;gap:10px;font-size:clamp(13px,9cqh,20px);color:#4c6b57}
.stage-plus{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:22px;border-radius:8px;background:#e7f0d3;border:1px solid #b9cc93}
.stage-minus{display:inline-flex;align-items:center;justify-content:center;min-width:34px;min-height:26px;border-radius:8px;background:#fff;border:1px solid #b9cc93;color:#1d4437;cursor:pointer}
.stage-minus:hover{background:#f1f5e4}

.stage-groups{display:grid;gap:clamp(6px,1vh,14px);grid-template-columns:repeat(auto-fit,minmax(240px,1fr));flex:1;overflow:auto}
.stage-group{background:#f3f8e4;border:2px solid #7d9a6a;border-radius:20px;padding:12px;display:flex;flex-direction:column;gap:8px;min-height:0}
.stage-group>.stage-grid{flex:1;min-height:0;height:auto;align-content:start;grid-auto-rows:minmax(92px,auto)}
.stage-group h3{margin:0;font-size:18px;color:#1d4437;font-family:Fredoka,sans-serif;font-weight:500}
.stage-hint{font-size:12px;color:#5d6b58;text-align:center;margin:10px 0 0}
@keyframes bump{50%{transform:scale(1.07)}}
@media(max-width:760px){.stage{padding:14px}.stage-bar h2{font-size:20px}.stage-grid{grid-template-columns:repeat(auto-fit,minmax(104px,1fr))}}
.boot-skeleton{display:none}
.app-route .boot-skeleton{display:grid;place-items:center;min-height:62vh}
.app-route main>section:not(.boot-skeleton),.app-route footer>p{display:none}
.boot-spinner{display:grid;place-items:center;gap:20px}
.boot-spinner svg{width:58px;height:58px;transform:rotate(-90deg)}
.boot-track{fill:none;stroke:#dfe5cd;stroke-width:5}
.boot-arc{fill:none;stroke:var(--green);stroke-width:5;stroke-linecap:round;stroke-dasharray:32 94;transform-origin:50% 50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.boot-arc{animation-duration:2.4s}}

.class-page main,.app-route main{max-width:none;padding:0 clamp(16px,3vw,40px)}
.class-page .grid{grid-template-columns:repeat(auto-fill,minmax(155px,1fr));grid-auto-rows:1fr}
.class-page .student{display:flex;flex-direction:column;justify-content:space-between}


@media(max-width:760px){
  .stage-grid{grid-template-columns:repeat(auto-fit,minmax(96px,1fr));grid-auto-rows:minmax(108px,1fr)}
  .stage-card .stage-name{min-height:0}
  .stage-minus{min-width:44px;min-height:44px}
  .stage-keys{gap:14px}
}
/* normal board: fit more rows above the fold on classroom pages */
.class-page .workspace h1{font-size:clamp(26px,3vw,38px);margin-bottom:10px}
.class-page .workspace{padding:18px 0 40px}
.class-page .grid{grid-auto-rows:minmax(0,192px)}
.class-page .student{padding:12px 10px}
.class-page .score{font-size:34px;margin:2px 0}
.class-page .student h3{margin:6px 0;font-size:18px}

.stage-scroll-hint{position:absolute;left:0;right:0;bottom:0;height:46px;pointer-events:none;background:linear-gradient(to bottom,transparent,#e4eecf)}
.stage{position:fixed}
.stage-body{position:relative;display:flex;flex-direction:column;flex:1;min-height:0}

.stage-hit{position:absolute;inset:0;width:100%;height:100%;padding:0;margin:0;background:transparent;border:0;border-radius:16px;cursor:pointer;z-index:0}
.stage-hit:disabled{cursor:not-allowed}
.stage-inner{position:relative;z-index:1;pointer-events:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:100%;height:100%;min-height:0}
.stage-inner>.stage-badges,.stage-inner>.stage-name,.stage-inner>.stage-score{position:relative}
.stage-inner>.stage-keys{position:static;margin-top:auto;display:flex;justify-content:center;gap:12px;inset:auto}
.stage-card .stage-badges{height:auto;min-height:0;font-size:clamp(15px,13cqh,30px);line-height:1.1}
.stage-card .stage-minus{position:static;min-width:40px;min-height:30px;font-size:clamp(14px,10cqh,22px);line-height:1;padding:0}
.stage-card .stage-plus{min-width:34px;height:auto;padding:4px 0;font-size:clamp(13px,9cqh,20px)}

@media(max-width:760px){.stage-card .stage-minus{min-width:44px;min-height:34px}}
.stage-group>.stage-grid{grid-auto-rows:minmax(110px,1fr)}

/* the + pill is decorative: never swallow a tap meant for the card */
.stage-keys{pointer-events:none}
.stage-card .stage-minus{pointer-events:auto}
.stage-card .stage-plus{pointer-events:none}
/* reserve the badge row on every card so scores share a baseline */
.stage-card .stage-badges{display:block;min-height:1em;line-height:1}
.stage-card:not(.has-badges) .stage-badges{visibility:hidden}
/* one scroll region on phones, not four nested ones */
@media(max-width:760px){
  .stage-groups{display:block;overflow-y:auto;min-height:0}
  .stage-group{margin-bottom:12px}
  .stage-group>.stage-grid{overflow:visible;grid-auto-rows:minmax(112px,auto)}
  .stage-card .stage-badges{min-height:1.2em;font-size:15px}
}
/* group panels share one type scale */
.stage-group>.stage-grid{grid-auto-rows:minmax(110px,150px);align-content:start}
/* the last 30px of board overflow is the footer, not students */
.class-page footer{display:none}

#share{max-width:520px}
.share-row{display:flex;gap:8px;align-items:stretch}
.share-row input{flex:1;min-width:0}
.share-row .button{margin:0}
.share-sub{font-size:16px;margin:22px 0 8px}
.share-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.share-list li{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;font-size:14px}
.share-list li span:first-child{flex:1;overflow-wrap:anywhere}
.share-list li button{padding:6px 10px;font-size:13px}
.shared-heading{font-size:26px;margin:36px 0 14px}

.stage-body>.stage-grid{grid-auto-rows:minmax(110px,1fr)}

/* share dialog on phones: email on its own line, full-size buttons */
.share-list li .share-email{flex:1 1 100%;overflow-wrap:anywhere;word-break:normal}
.share-list li{flex-wrap:wrap}
.share-list li .share-actions{display:flex;gap:8px;margin-left:auto}
.share-list li button{min-height:40px}
.share-list li.confirming{background:#fff6ef;border-color:#f0c9a8}
@media(max-width:760px){.share-row{flex-direction:column}.share-list li button{min-height:44px;padding:8px 14px}#share{padding:22px}}
@media(min-width:761px){.share-list li .share-email{flex:1 1 auto}}
#share-link{font-size:13px;color:#4c5a51}

.signin-buttons{display:grid;gap:10px;max-width:340px;margin-top:6px}
.signin-buttons .button{justify-content:center;width:100%}

.menu-note{font-size:12px;line-height:1.5;margin:6px 12px 4px;max-width:220px}
.shared-heading:empty{display:none}
.workspace .shared-heading:first-of-type{margin-top:24px}




/* rows stretch to fill the screen (so card height reflects the space), but a small class never gets billboard cards */
.stage-body>.stage-grid>.stage-card{max-height:320px;max-width:300px;width:100%;align-self:center;justify-self:center;height:100%}
/* phones: readable names, full-size keys */
@container (max-width:130px) or (max-height:140px){
  .stage-inner>.stage-name{font-size:clamp(14px,14cqh,18px)}
  .stage-inner .stage-minus,.stage-inner .stage-plus{min-width:44px;min-height:44px}
}

.stage-inner>.stage-keys .stage-minus{min-width:44px;min-height:44px}
.stage-inner>.stage-keys .stage-plus{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}

.legal{max-width:760px;padding:40px 5% 80px}
.legal h1{font-size:clamp(38px,5vw,56px);letter-spacing:-1.5px;margin-bottom:16px}
.legal .lede{font-size:19px;line-height:1.6;color:#3d5249;margin-bottom:34px}
.legal h2{font-size:26px;margin:40px 0 12px}
.legal h3{font-size:18px;margin:22px 0 8px;font-family:'DM Sans',sans-serif;font-weight:700}
.legal p,.legal li{line-height:1.75;font-size:16px}
.legal ul{padding-left:22px}
.legal li{margin-bottom:6px}
.legal a,footer p a{text-decoration:underline;text-underline-offset:3px}

/* breathing room under the − + row */
.stage-inner{padding-bottom:10px;box-sizing:border-box}
.stage-card .stage-name{min-height:2.2em}
.stage-card .stage-score{font-size:clamp(28px,30cqh,100px)}
@container (max-width:130px) or (max-height:140px){.stage-inner{padding-bottom:6px}}
/* same on the normal board */
.class-page .student{padding-bottom:18px}

/* Students / Groups as a real toggle */
.seg{display:inline-flex;padding:4px;gap:4px;background:#e2e8d2;border:1px solid #cdd8b3;border-radius:999px}
.seg button{border:0;background:transparent;border-radius:999px;padding:9px 18px;min-height:40px;font-weight:600;color:#4c5a51;box-shadow:none}
.seg button[aria-pressed=true]{background:#1d4437;color:#fff;box-shadow:0 2px 6px #1d443733}
.seg button:not([aria-pressed=true]):hover{background:#ffffffaa}
.stage .seg{background:#d5e3b7;border-color:#b9cc93}
.stage .seg button{background:transparent;border:0}
.stage .seg button[aria-pressed=true]{background:#1d4437;color:#fff;border:0}
.everyone{display:inline-flex;gap:8px}
/* score sits centred between the name and the − + row */
.stage-inner>.stage-score{flex:1 1 auto;display:flex;align-items:center;justify-content:center;min-height:0}
/* compact cards (phones, group panels): same stacked order as the full card, just smaller */
@container (max-width:130px) or (max-height:140px){
  .stage-inner{gap:0}
  .stage-inner>.stage-badges{min-height:0;height:auto;font-size:13px;line-height:1.1}
  .stage-card:not(.has-badges) .stage-inner>.stage-badges{display:none}
  .stage-inner>.stage-name{-webkit-line-clamp:1;min-height:0;font-size:clamp(13px,13cqh,17px)}
  .stage-inner>.stage-score{font-size:clamp(22px,24cqh,34px)}
  .stage-inner>.stage-keys{gap:10px;margin-top:2px}
  .stage-inner .stage-minus,.stage-inner .stage-plus{min-width:44px;min-height:34px;font-size:18px}
}
/* phones: rows tall enough for name, score and the − + row */
@media(max-width:760px){.stage-body>.stage-grid{grid-auto-rows:minmax(128px,1fr)}}
/* group panels: tall enough for the stacked card */
.stage-group>.stage-grid{grid-auto-rows:minmax(150px,180px)}

/* dashboard: a readable column, tighter vertical rhythm */
.workspace.dashboard{max-width:1040px;margin:0;padding:22px 0 60px}
.dashboard .eyebrow{margin-bottom:10px}
.dashboard .heading-row{margin-bottom:10px;align-items:center}
.dashboard .heading-row h1{margin:0;font-size:clamp(34px,4vw,46px)}
.dashboard .shared-heading{margin:22px 0 12px;font-size:22px}
.dashboard .grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));grid-auto-rows:auto;gap:14px}
.dashboard .grid>p{margin:6px 0 0;color:#4c5a51}
.dashboard .create-form{margin-top:22px;max-width:560px}
.dashboard .create-form h2{margin:0 0 6px;font-size:24px}
.dashboard .create-form>p{margin:0 0 4px}
/* classroom view toggle: an unmistakable two-way switch */
.stage .seg{display:inline-grid;grid-template-columns:1fr 1fr;padding:4px;gap:0;border-radius:999px;background:#c9d9a6;border:1px solid #9fb775;box-shadow:inset 0 1px 2px #1d443722}
.stage .seg button{min-height:38px;min-width:104px;border-radius:999px;border:0;background:transparent;color:#2f4a3c;font-weight:600;padding:0 16px}
.stage .seg button[aria-pressed=true]{background:#1d4437;color:#fff;box-shadow:0 2px 6px #1d443744}
.stage .seg button:not([aria-pressed=true]):hover{background:#ffffff66}

/* Ungrouped is where students wait, not a group: no panel */
.group.ungrouped{background:transparent;border:2px dashed transparent;padding:6px 0 10px}
.group.ungrouped.over{background:#f1f6df;border-color:#adc47c;padding:14px}
.group.ungrouped h2{font-size:20px;color:#4c5a51}
/* board cards grow to fit two-line names instead of spilling out */
.class-page .grid{grid-auto-rows:minmax(192px,auto)}
.class-page .student h3{line-height:1.2}
/* plan status sits with the title, sign out stays right */
.class-page .workspace>.heading-row{justify-content:flex-start;column-gap:18px}
.class-page .workspace>.heading-row .status-row{margin:0}
.class-page .workspace>.heading-row .head-links{margin-left:auto}

/* one-line names: score centred between the name and the − + row (no reserved second line) */
.stage-card .stage-name{min-height:0}
/* classroom pages: header aligned with the full-width board, much less vertical padding */
.class-page header{max-width:none;padding:14px clamp(16px,3vw,40px)}
.class-page .workspace{padding:6px 0 32px}
.class-page .workspace>.eyebrow{margin-bottom:6px}
.class-page .workspace>.heading-row{margin-bottom:12px}
.class-page .workspace>.heading-row h1{margin:0}
.class-page .toolbar{margin-bottom:16px}

/* header: signed-in teachers get Sign out where Pricing was */
.nav-signout{display:none}
.signed-in.class-page .nav-pricing,.signed-in.on-dashboard .nav-pricing{display:none}
.signed-in.class-page .nav-signout,.signed-in.on-dashboard .nav-signout{display:inline-flex;align-items:center}
.on-dashboard .nav-classrooms{display:none}
.parent-view .nav-signout{display:none}

/* dashboard: create form uses the column instead of leaving a void beside it */
.dashboard .create-form{max-width:none}
.dashboard .create-form textarea{min-height:120px}
.share-note{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:#eef5df;color:#2f4a3c;font-size:14px}
.share-note.bad{background:#fdeee4;color:#8a3f12}

.plan-line{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:4px 0 8px;font-size:15px;color:#3d5249}
.plan-line button{padding:8px 14px}
.more-menu .danger{color:#a23c12;border-top:1px solid var(--line);border-radius:0 0 10px 10px;margin-top:4px}
.more-menu .danger:hover{background:#fdeee4}
.banner.payment-failed{background:#fde3d2;border:1px solid #f0b48f}