/* Bright workspace skins. Notification palettes remain independent. */
body[data-workspace-style]{--bg:#f7faf5;--ink:#263b35;--muted:#74867e;--line:#e1eae2;--green:#16815c;--green-dark:#106a4a;--green-light:#e6f6ed;--skin-accent:#16815c;--skin-soft:#e6f6ed;--skin-border:#dbe9df;--skin-shadow:0 3px 12px #385f4210;background:var(--bg)}
body[data-workspace-style="cream"]{--bg:#fffaf4;--ink:#624733;--muted:#998271;--line:#eddfd0;--green:#ae623d;--green-dark:#8c4c30;--green-light:#fff0e2;--skin-accent:#ac5c37;--skin-soft:#ffeadc;--skin-border:#ecd5c1;--skin-shadow:0 3px 10px #9760440c}
body[data-workspace-style] .sidebar{background:#fffefa;border-color:var(--line)}
body[data-workspace-style] .brand strong{color:var(--ink)}
body[data-workspace-style] .brand-symbol{background:var(--skin-accent);box-shadow:0 3px 7px #16815c17}
body[data-workspace-style] .nav-item{color:var(--muted);font-size:14px;min-height:46px;border-radius:11px}
body[data-workspace-style] .nav-item.active{background:var(--skin-soft);color:var(--skin-accent)}
body[data-workspace-style] .topbar{height:52px;border-color:var(--line);background:#fffefa}
body[data-workspace-style] .breadcrumb strong{color:var(--ink)}
body[data-workspace-style] #main-content{max-width:1540px;padding:20px 26px 32px}
body[data-route="send"] .topbar{display:none}
body[data-route="send"] #main-content{display:flex;flex-direction:column}
body[data-route="send"] .page-heading{order:0;min-height:122px}
body[data-route="send"] #page{order:1;min-width:0}
body[data-route="send"] #stats{order:2;margin-top:24px}
body[data-route="send"] .page-footer{order:3}
body[data-workspace-style] .page-heading{position:relative;isolation:isolate;overflow:hidden;min-height:148px;padding:22px 24px;margin:0 0 16px;border:1px solid var(--skin-border);border-radius:18px;background:linear-gradient(100deg,#fffef8 35%,#f3f8ec);gap:18px;align-items:center;box-shadow:var(--skin-shadow)}
.heading-art{position:absolute;inset:0 0 0 auto;width:62%;z-index:-1;opacity:.57;pointer-events:none;mask-image:linear-gradient(90deg,transparent,#000 28%)}
.heading-art>svg{width:100%;height:100%;object-fit:cover}
.heading-copy{flex:1;min-width:0;align-self:center}
body[data-workspace-style] .page-heading h1{color:var(--skin-accent);font-size:32px;font-weight:750;letter-spacing:1px;line-height:1.4}
body[data-workspace-style] .page-heading p{font-size:14px;line-height:1.7;color:#68796b;margin-top:6px}
.heading-mascot{width:70px;height:80px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.heading-mascot>.icon{width:61px;height:61px;stroke-width:1.4;color:#22815c;transform:rotate(-12deg);filter:drop-shadow(2px 4px 0 #ffe2a0)}
.heading-mascot>svg:not(.icon){width:86px;height:86px}
body[data-workspace-style] .heading-actions{display:flex;flex-direction:column;align-items:flex-end;gap:14px;flex-shrink:0;align-self:center}
.heading-tools{display:flex;gap:8px}
.workspace-style-picker{display:flex;gap:4px;padding:4px;border-radius:12px;background:#fffef9ed;border:1px solid var(--skin-border);box-shadow:0 2px 8px #31473008}
.workspace-style-picker button{display:flex;align-items:center;gap:7px;border:0;background:transparent;padding:9px 12px;border-radius:8px;color:#7b8475;font-size:12px;min-height:38px;white-space:nowrap;cursor:pointer}
.workspace-style-picker button[aria-pressed="true"]{background:var(--skin-soft);color:var(--skin-accent);font-weight:650}
.workspace-style-picker i{width:13px;height:13px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #354f2712}
.mint-swatch{background:#43a880}.cream-swatch{background:#f3af83}
body[data-workspace-style] .button{border-radius:9px}
body[data-workspace-style] .button-primary{background:var(--green);border-color:var(--green);color:#fff}
body[data-workspace-style] .button-primary:hover{background:var(--green-dark)}
body[data-workspace-style] .button-outline{border-color:var(--skin-border);color:var(--ink)}
body[data-workspace-style] .button-light{background:#fffdf8b8;color:var(--skin-accent)}
body[data-workspace-style] .stats-grid{border:0;background:transparent;box-shadow:none;margin-bottom:15px;gap:12px}
body[data-workspace-style] .stat-card{display:flex;align-items:center;justify-content:space-between;min-height:42px;padding:8px 15px;border:1px solid var(--skin-border);border-radius:10px;background:#fffefb;gap:8px}
body[data-workspace-style] .stat-card:before{display:none}
body[data-workspace-style] .stat-card .stat-body{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%}
body[data-workspace-style] .stat-label{font-size:12px;color:var(--muted)}
body[data-workspace-style] .stat-value{font-size:18px;color:var(--skin-accent);margin:0}
body[data-workspace-style] .stat-value small{font-size:10px;color:var(--muted)}
.scenario-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:17px}
.scenario-card{display:flex;position:relative;align-items:center;justify-content:center;gap:10px;min-width:0;border:1px solid var(--skin-border);border-radius:14px;background:#fffefb;box-shadow:var(--skin-shadow);padding:9px 12px;min-height:82px;color:var(--ink);font-size:16px;font-weight:650;cursor:pointer;transition:border-color .15s,background .15s}
.scenario-card:hover{background:var(--skin-soft);border-color:var(--skin-accent)}
.scenario-card.active{border-color:var(--skin-accent);background:var(--skin-soft);box-shadow:inset 0 0 0 3px #ffffff7a,var(--skin-shadow)}
.scenario-art{width:55px;height:55px;flex-shrink:0;filter:drop-shadow(0 3px 1px #96744815)}
.scenario-art svg{width:100%;height:100%}
.scenario-check{position:absolute;right:7px;top:7px;width:17px;height:17px;border-radius:50%;display:none;align-items:center;justify-content:center;background:var(--skin-accent);color:#fff}
.scenario-check .icon{width:12px;height:12px}.scenario-card.active .scenario-check{display:flex}
body[data-workspace-style] .panel{border-color:var(--skin-border);border-radius:15px;box-shadow:var(--skin-shadow);background:#fff}
body[data-workspace-style] .panel-title{color:var(--ink);font-size:17px;font-weight:650;display:flex;align-items:center;gap:9px}
body[data-workspace-style] .panel-title>.icon{width:23px;height:23px;color:var(--skin-accent)}
body[data-workspace-style] .panel-header{padding:18px 22px;border-color:var(--line)}
body[data-workspace-style] .panel-content{padding:18px 22px}
body[data-workspace-style] .target-panel{display:flex;align-items:center;flex-wrap:wrap;gap:12px 22px;padding:12px 18px;margin-bottom:18px;background:#fffffc}
body[data-workspace-style] .target-heading{margin:0;display:flex;align-items:center;gap:18px;flex:0 1 auto}
body[data-workspace-style] .target-heading p{display:none}
body[data-workspace-style] .target-heading h2{font-size:13px;white-space:nowrap}
body[data-workspace-style] #target-count{font-size:11px;margin-left:6px;font-weight:400;color:var(--muted)}
body[data-workspace-style] .target-actions{gap:10px}
body[data-workspace-style] .room-shortcuts{display:flex;flex-wrap:wrap;gap:8px;flex:1;min-width:150px}
body[data-workspace-style] .room-shortcut{display:flex;flex-direction:row;align-items:center;gap:10px;padding:9px 12px;min-height:44px;border:1px solid var(--skin-border);border-radius:9px;background:#fff;min-width:0;max-width:100%}
body[data-workspace-style] .room-shortcut.selected{border-color:var(--skin-accent);background:var(--skin-soft)}
body[data-workspace-style] .shortcut-top{display:none}
body[data-workspace-style] .room-shortcut strong{font-size:13px;color:var(--ink);font-weight:550}
body[data-workspace-style] .shortcut-status{font-size:11px;white-space:nowrap}
body[data-workspace-style] .compose-grid{gap:20px}
body[data-workspace-style] .compose-target{margin-bottom:8px}
body[data-workspace-style] .type-switch{margin:15px 0;background:#f4f7f3;border:0;border-radius:10px;padding:4px}
body[data-workspace-style] .type-switch button{min-height:38px;font-size:13px}
body[data-workspace-style] .type-switch button.active{color:var(--skin-accent);background:var(--skin-soft);box-shadow:0 0 0 2px #fff}
body[data-workspace-style] input,body[data-workspace-style] select,body[data-workspace-style] textarea{border-color:var(--skin-border);border-radius:10px;color:var(--ink)}
body[data-workspace-style] input:focus,body[data-workspace-style] select:focus,body[data-workspace-style] textarea:focus{border-color:var(--skin-accent);box-shadow:0 0 0 3px var(--skin-soft)}
body[data-workspace-style] .textarea-wrap textarea{height:150px;font-size:16px;line-height:1.9;background:#fffefc}
body[data-workspace-style] .field-label,body[data-workspace-style] .option-title{color:var(--ink);font-size:13px;font-weight:550}
body[data-workspace-style] .choice.active{color:var(--skin-accent);border-color:var(--skin-accent);background:var(--skin-soft)}
body[data-workspace-style] .notice-theme-button.active{border-color:var(--skin-accent);box-shadow:0 0 0 2px var(--skin-soft)}
body[data-workspace-style] .selected-tick{background:var(--skin-accent)}
body[data-workspace-style] .preview-col{top:20px}
body[data-workspace-style] .preview-header{padding:18px 20px}
body[data-workspace-style] .preview-header .panel-title{font-size:17px}
body[data-workspace-style] .live-label{font-size:11px;color:#45916a;background:#eff9ef;border:1px solid #d7eddc;border-radius:20px;padding:5px 10px}
body[data-workspace-style] .preview-frame{background:#fff;border:0;padding:0 10px 10px}
.classroom-stage{position:relative;aspect-ratio:800/450;isolation:isolate;overflow:hidden;border-radius:11px;background:#f3e6ce}
.classroom-art{position:absolute;inset:0;z-index:-1}.classroom-art>svg{display:block;width:100%;height:100%}
body[data-workspace-style] .classroom-stage .screen-border{position:absolute;left:17%;top:9%;width:69%;border-radius:8px;padding:5px;background:#505d55;box-shadow:0 3px 0 #a5a792,0 6px 13px #684d3c24}
body[data-workspace-style] .classroom-stage #screen-preview{padding:18px;aspect-ratio:16/9;border-radius:3px}
.classroom-bunny{display:none;position:absolute;width:11%;bottom:18%;right:15%;pointer-events:none}
.classroom-bunny>svg{display:block;width:100%}
body[data-workspace-style] .preview-dimensions{margin:10px 7px 0;color:var(--muted)}
body[data-workspace-style] .preview-summary{border-color:var(--line);font-size:12px;color:var(--ink);padding:15px 12px;gap:15px}
body[data-workspace-style] .preview-note{font-size:11px;color:var(--muted);margin:13px 20px}
body[data-workspace-style] .preview-guidance{background:var(--skin-soft);border:1px solid var(--skin-border);border-radius:11px;padding:13px 17px;color:var(--muted)}
body[data-workspace-style] .preview-guidance strong{color:var(--skin-accent)}
body[data-workspace-style] #delivery-summary{margin-top:18px}
body[data-workspace-style] .delivery-panel{padding:18px;background:#f6fcf6}
body[data-workspace-style] .delivery-heading .panel-title{font-size:14px;flex-wrap:wrap;gap:4px 10px}
body[data-workspace-style] .delivery-heading .panel-meta{display:block;font-size:11px;color:var(--muted)}
body[data-workspace-style] .delivery-heading{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
body[data-workspace-style] .delivery-heading>.panel-title{flex:1}
.delivery-progress{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;padding-top:8px;gap:8px}
.delivery-step{display:flex;align-items:center;flex-direction:column;position:relative;color:#8f9c91;gap:5px;min-width:0}
.delivery-step:not(:last-child):after{content:'';position:absolute;left:65%;width:77%;top:11px;height:1px;background:#d7e7d6}
.delivery-step-dot{width:22px;height:22px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid #ccdcca;background:#f8fcf5;z-index:1}
.delivery-step-dot>.icon{width:14px;height:14px}.delivery-step.done .delivery-step-dot{background:#59a566;border-color:#59a566;color:white}
.delivery-step strong{font-size:12px;font-weight:550}.delivery-step.done strong{color:#486b49}.delivery-step small{font-size:10px;color:#809080;white-space:nowrap}
body[data-workspace-style] .send-button{min-height:49px;font-size:15px}
body[data-workspace-style] .text-link{color:var(--skin-accent)}
body[data-workspace-style] .field-help,body[data-workspace-style] .option-subtitle{color:var(--muted)}
body[data-workspace-style] .notice-theme-label{color:var(--ink)}
body[data-workspace-style] .page-footer{border-color:var(--line)}
body[data-workspace-style] .mobile-send-bar{display:flex;position:fixed;left:208px;right:0;bottom:0;z-index:16;align-items:center;gap:15px;padding:13px 28px max(13px,env(safe-area-inset-bottom));background:#fffefbf7;border-top:1px solid var(--skin-border);box-shadow:0 -4px 18px #52653e09;backdrop-filter:blur(12px)}
body[data-workspace-style] .mobile-target-button{display:flex;flex:1;min-width:0;flex-direction:column;gap:4px;text-align:left;background:none;border:0;padding:0;cursor:pointer}
body[data-workspace-style] .mobile-target-button strong{font-size:14px;color:var(--ink);overflow-wrap:anywhere}
body[data-workspace-style] .mobile-target-button span{font-size:11px;color:var(--muted)}
body[data-workspace-style] .mobile-send-bar>.button{min-height:46px;padding:11px 26px;font-size:14px;flex-shrink:0}
body[data-workspace-style] .compose-grid>.panel>.compose-bottom{display:none}
body[data-workspace-style] #page:has(.mobile-send-bar)~.page-footer{padding-bottom:100px}
body[data-workspace-style="cream"] .page-heading{background:linear-gradient(105deg,#fffaf2,#fff5eb);border-color:#ecd7c3}
body[data-workspace-style="cream"] .page-heading h1{color:#754d35;letter-spacing:2px}
body[data-workspace-style="cream"] .page-heading p{color:#9d7860}
body[data-workspace-style="cream"] .heading-art{opacity:.26}
body[data-workspace-style="cream"] .heading-mascot{width:86px}
body[data-workspace-style="cream"] .panel,body[data-workspace-style="cream"] .scenario-card{border-width:1.5px;border-radius:17px 14px 19px 13px;background:#fffefb}
body[data-workspace-style="cream"] .scenario-card.active{background:#ffe6d4;border-color:#efa980;box-shadow:inset 0 0 0 3px #fff8ef,0 3px 8px #bc866119}
body[data-workspace-style="cream"] .scenario-check{background:#eb9b70}
body[data-workspace-style="cream"] .nav-item.active{background:#ffe6d4;color:#8b5134}
body[data-workspace-style="cream"] .brand-symbol{background:#fff0dd;color:#966342;border:1.5px solid #d9b58f;box-shadow:none}
body[data-workspace-style="cream"] .panel-header .panel-title{position:relative;width:max-content;max-width:100%;isolation:isolate}
body[data-workspace-style="cream"] .panel-header .panel-title:after{content:'';position:absolute;left:30px;right:-3px;bottom:-1px;height:7px;background:#ffe3d2;border-radius:7px;z-index:-1}
body[data-workspace-style="cream"] .type-switch{background:#f8f1e9}
body[data-workspace-style="cream"] .classroom-art{filter:sepia(.08) saturate(.87)}
body[data-workspace-style="cream"] .classroom-stage .screen-border{background:#b7abc2;box-shadow:0 0 0 2px #9f90a7,0 4px 0 #cbb9bc,0 7px 10px #85604722}
body[data-workspace-style="cream"] .classroom-bunny{display:block}
body[data-workspace-style="cream"] .button-primary{color:#713f29;background:#ffc8a6;border-color:#e7a17a;box-shadow:inset 0 0 0 2px #ffffff65}
body[data-workspace-style="cream"] .button-primary:hover{background:#ffbb92}
body[data-workspace-style="cream"] .delivery-panel{background:#f4faee}
body[data-workspace-style="cream"] .scenario-art{transform:rotate(-3deg)}
body[data-workspace-style="cream"] .sidebar{background:#fffdf8}
body[data-workspace-style="cream"] .classroom-bunny{bottom:8%;right:5%}
@media(min-width:1200px){body[data-workspace-style] .compose-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.13fr)}body[data-workspace-style] .preview-col{position:sticky;align-self:start}}
@media(min-width:601px) and (max-width:1199px){body[data-workspace-style] #main-content{padding:18px 20px 26px}.heading-mascot{width:50px}body[data-workspace-style] .page-heading{padding:18px;gap:10px}body[data-workspace-style] .page-heading h1{font-size:28px}body[data-workspace-style] .page-heading p{font-size:12px}.heading-tools{display:none}.scenario-card{font-size:13px;padding:8px 4px;gap:3px;min-height:72px}.scenario-art{width:43px;height:43px}.scenario-strip{gap:8px}.workspace-style-picker button{padding:8px;font-size:11px}body[data-workspace-style] .stat-card{padding:8px 12px}body[data-workspace-style] .mobile-send-bar{left:80px}}
@media(min-width:601px) and (max-width:1023px), (min-width:601px) and (max-width:1199px) and (orientation:portrait){body[data-workspace-style] .preview-col{position:static}.preview-panel{max-width:none}.heading-mascot{display:none}body[data-workspace-style="cream"] .heading-mascot{display:flex;width:58px}.heading-copy{min-width:150px}body[data-workspace-style] .page-heading{flex-wrap:wrap}body[data-workspace-style] .heading-actions{margin-left:auto}.scenario-card{flex-direction:column;gap:2px}}
@media(max-width:600px){
  body[data-workspace-style] #main-content{padding:14px 12px 24px}body[data-workspace-style] .sidebar .nav-item{min-height:55px;font-size:11px;border-radius:9px 9px 0 0}
  body[data-workspace-style] .page-heading{padding:17px 15px 12px;border-radius:14px;min-height:0;flex-wrap:wrap;gap:6px 11px;margin-bottom:12px}
  body[data-route="send"] .page-heading{min-height:0}
  .heading-art{width:75%;opacity:.25}.heading-mascot{width:40px;height:52px}.heading-mascot>.icon{width:38px;height:38px}
  body[data-workspace-style="cream"] .heading-mascot{width:48px}.heading-mascot>svg:not(.icon){width:53px;height:53px}
  body[data-workspace-style] .page-heading h1{font-size:25px;letter-spacing:0}body[data-workspace-style] .page-heading p{font-size:11px;line-height:1.7;max-width:220px}
  body[data-workspace-style] .heading-actions{width:100%;align-items:stretch;margin-top:7px}.heading-tools{display:none}.workspace-style-picker{width:100%;padding:3px;border-radius:9px}.workspace-style-picker button{flex:1;justify-content:center;min-height:38px;font-size:12px;padding:7px 5px}
  body[data-workspace-style] .stats-grid{gap:6px;margin-bottom:12px}body[data-workspace-style] .stat-card{padding:8px;min-height:45px;border-radius:8px}body[data-workspace-style] .stat-card .stat-body{display:block}body[data-workspace-style] .stat-label{font-size:10px}body[data-workspace-style] .stat-value{font-size:17px;margin-top:1px}body[data-workspace-style] .stat-value small{display:none}
  .scenario-strip{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;margin-bottom:12px}.scenario-card{min-height:80px;padding:7px 1px 9px;border-radius:10px;flex-direction:column;gap:3px;font-size:10px;box-shadow:0 2px 5px #385f4208}.scenario-art{width:37px;height:37px}.scenario-check{width:12px;height:12px;right:3px;top:3px}.scenario-check .icon{width:9px;height:9px}body[data-workspace-style="cream"] .scenario-card{border-radius:11px 9px 12px 9px}
  body[data-workspace-style] .target-panel{padding:12px;gap:10px;margin-bottom:14px}body[data-workspace-style] .target-heading{width:100%;justify-content:space-between}body[data-workspace-style] .target-heading h2{display:flex;align-items:center;gap:4px}body[data-workspace-style] #target-count{display:inline;margin:0}body[data-workspace-style] .room-shortcuts{width:100%}body[data-workspace-style] .room-shortcut{flex:1;justify-content:space-between}body[data-workspace-style] .room-shortcut strong{font-size:13px}
  body[data-workspace-style] .panel-header,body[data-workspace-style] .preview-header{padding:16px}body[data-workspace-style] .panel-title,body[data-workspace-style] .preview-header .panel-title{font-size:16px}body[data-workspace-style] .panel-content{padding:16px}body[data-workspace-style] .type-switch button{font-size:14px;min-height:44px}
  body[data-workspace-style] input,body[data-workspace-style] select,body[data-workspace-style] textarea{font-size:16px}body[data-workspace-style] .textarea-wrap textarea{font-size:16px;height:150px}body[data-workspace-style] .field-label{font-size:14px}body[data-workspace-style] .compose-grid{gap:16px}body[data-workspace-style] .preview-col{position:static}
  body[data-workspace-style] .preview-frame{padding:0 7px 8px}body[data-workspace-style] .classroom-stage .screen-border{padding:3px;border-radius:5px}body[data-workspace-style] .classroom-stage #screen-preview{padding:10px}body[data-workspace-style] .live-label{padding:4px 7px;font-size:10px}body[data-workspace-style] .preview-summary{font-size:11px;padding:12px 9px;gap:9px}body[data-workspace-style] .preview-note{margin:11px 15px}body[data-workspace-style] .preview-dimensions{font-size:9px}body[data-workspace-style] .delivery-panel{padding:14px}body[data-workspace-style] .mobile-send-bar{background:#fffdf8f7;border-color:var(--skin-border)}
  body[data-workspace-style] .mobile-send-bar{left:0;gap:8px;padding-inline:12px}body[data-workspace-style] .mobile-send-bar>.button{padding:10px 14px;font-size:13px}body[data-workspace-style] .mobile-target-button strong{font-size:12px}body[data-workspace-style] .mobile-target-button span{font-size:10px}
}
@media(prefers-reduced-motion:reduce){.scenario-card{transition:none}}
@media(min-width:601px){body[data-workspace-style][data-route="send"] .page-heading{padding-block:16px;min-height:122px}body[data-route="send"] .heading-actions{gap:8px}}
@media(min-width:601px) and (max-width:1199px){.heading-tools{display:flex}.heading-tools .button{min-height:34px;padding:6px 10px}}
@media(max-width:600px){body[data-workspace-style] .heading-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:5px}.heading-tools{display:flex;gap:3px}.heading-tools .button{font-size:0;min-height:38px;min-width:33px;padding:7px;gap:0}.heading-tools .button .icon{width:17px;height:17px}.workspace-style-picker button{font-size:11px;gap:4px;padding-inline:4px}.workspace-style-picker i{width:10px;height:10px}.workspace-style-picker{min-width:0}.heading-actions .button-light{display:inline-flex}}
/* Keep the classroom monitor fixed; only the notification changes its size. */
.screen-desktop{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:3px;container-type:inline-size;background:#edf3f5}
.screen-desktop>#screen-preview{position:absolute;inset:0;width:100%;height:100%}
.preview-lesson{display:none;position:absolute;inset:0;background:linear-gradient(125deg,#e9f0f5,#fcfcf8);color:#738b97}
.screen-desktop.is-banner .preview-lesson{display:block}
.lesson-caption{position:absolute;left:6%;top:7%;font-size:2.3cqw;letter-spacing:.15em}
.lesson-center{position:absolute;left:8%;top:29%;width:42%;display:flex;flex-direction:column;gap:2cqw}
.lesson-center>span{font-size:11cqw;font-weight:650;line-height:1.2;color:#88a3af}
.lesson-center>i{display:block;width:75%;height:1cqw;border-radius:1cqw;background:#cad8de}.lesson-center>i:nth-last-child(1){width:48%}
.lesson-taskbar{position:absolute;bottom:0;inset-inline:0;height:7%;background:#dae5e9b3;display:flex;align-items:center;gap:1.6%;padding-inline:3%}
.lesson-taskbar i{width:2.5%;aspect-ratio:1;border-radius:25%;background:#95adb8}.lesson-taskbar i:nth-child(2){background:#c4ae87}.lesson-taskbar i:nth-child(3){background:#8fb4a3}
/* Match the receiver's 560 × 260 window, 25px right / 20px top on a 1280 × 720 screen. */
body[data-workspace-style] .classroom-stage #screen-preview.screen-banner{inset:2.778% 1.953% auto auto;width:43.75%;height:36.111%;aspect-ratio:auto;padding:0;border-radius:1.4cqw;border:1px solid #bccdc6;box-shadow:0 1cqw 3cqw #20352b30;overflow:hidden}
.screen-banner .notice-heading{font-size:1.65cqw;gap:.6cqw;top:13%;left:9%}
.screen-banner .heading-rule{width:.45cqw}
.screen-banner .notice-content{inset:30% 9% 25%}
.screen-banner .notice-meta{font-size:1.05cqw;bottom:9%;left:9%;right:9%;gap:1cqw;line-height:1.4}
.screen-banner .notice-brand{white-space:nowrap}
.screen-banner .notice-decor{opacity:.8}
.screen-banner .screen-message{font-size:2.2cqw}.screen-banner .screen-badge{font-size:1.7cqw}
.screen-banner.theme-cute .notice-heading{left:11%}.screen-banner.theme-cute .notice-content{inset:30% 11% 25%}
.screen-banner.theme-journal .notice-heading{font-size:1.45cqw;padding:.1em .4em}

/* Neutral: ice blue surfaces, navy type, clear blue actions. */
.neutral-swatch{background:#2878ed}
body[data-workspace-style="neutral"]{--bg:#f3f7fc;--ink:#172e51;--muted:#667a94;--line:#dfe8f3;--green:#2274e8;--green-dark:#165dcc;--green-light:#eaf3ff;--skin-accent:#2274e8;--skin-soft:#eaf3ff;--skin-border:#dde7f3;--skin-shadow:0 2px 8px #17365b05;background:var(--bg)}
body[data-workspace-style="neutral"] :is(.sidebar,.topbar){background:#fff}
body[data-workspace-style="neutral"] .brand strong{color:#10294e;letter-spacing:-.4px}
body[data-workspace-style="neutral"] .brand-symbol{background:#2274e8;border-radius:9px;box-shadow:none}
body[data-workspace-style="neutral"] .nav-item{color:#61738c;border-radius:8px}
body[data-workspace-style="neutral"] .nav-item.active{color:#1764d7;background:#eaf3ff}
body[data-workspace-style="neutral"] .page-heading{border-color:#d8e8fc;border-radius:12px;background:linear-gradient(110deg,#f8fbff 25%,#edf6ff 75%,#dfedff);box-shadow:none}
body[data-workspace-style="neutral"] .page-heading h1{color:#0e2854;letter-spacing:0;font-weight:750}
body[data-workspace-style="neutral"] .page-heading p{color:#4774ab}
body[data-workspace-style="neutral"] .heading-art{width:44%;opacity:.55;background:linear-gradient(145deg,transparent 42%,#cce4ff60 42% 61%,#fff5 61% 73%,#a9d4ff40 73%);mask-image:linear-gradient(90deg,transparent,#000)}
body[data-workspace-style="neutral"] .heading-mascot{width:52px;height:52px;background:#e2efff;border:1px solid #d1e5ff;border-radius:12px}
body[data-workspace-style="neutral"] .heading-mascot>.icon{width:31px;height:31px;color:#2274e8;filter:none;transform:none;stroke-width:1.6}
body[data-workspace-style="neutral"] .workspace-style-picker{background:#ffffffeb;box-shadow:none;border-radius:9px}
body[data-workspace-style="neutral"] .workspace-style-picker button{color:#6b7d94;border-radius:6px}
body[data-workspace-style="neutral"] .workspace-style-picker button[aria-pressed="true"]{background:#eaf3ff;color:#1764d7}
body[data-workspace-style="neutral"] .scenario-card{min-height:68px;border-radius:10px;box-shadow:none;font-size:14px;gap:12px;background:#fff}
body[data-workspace-style="neutral"] .scenario-card:hover{background:#f7faff}
body[data-workspace-style="neutral"] .scenario-card.active{background:#edf5ff;border-color:#75a8ee;box-shadow:none}
body[data-workspace-style="neutral"] .scenario-art{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:10px;background:#edf4fe;filter:none;color:#3781e3}
body[data-workspace-style="neutral"] .scenario-art>.icon{width:23px;height:23px;stroke-width:1.65}
body[data-workspace-style="neutral"] .scenario-check{background:#2274e8}
body[data-workspace-style="neutral"] :is(.panel,.target-panel,.stat-card,.table-wrap){border-color:#dde7f3;border-radius:10px;background:#fff;box-shadow:var(--skin-shadow)}
body[data-workspace-style="neutral"] :is(.panel-title,.preview-header .panel-title){font-size:16px;color:#1a3356}
body[data-workspace-style="neutral"] .panel-header{background:#fcfdff;border-color:#e7edf6;border-radius:10px 10px 0 0}
body[data-workspace-style="neutral"] .panel-header .panel-title>.icon{color:#327bdb}
body[data-workspace-style="neutral"] .type-switch{background:#f0f4fa;border:1px solid #e7edf7;border-radius:8px}
body[data-workspace-style="neutral"] .type-switch button.active{background:#fff;color:#1764d7;box-shadow:0 1px 4px #163c6c0c}
body[data-workspace-style="neutral"] :is(input,select,textarea){border-radius:7px;border-color:#d9e3f0;background:#fff}
body[data-workspace-style="neutral"] .textarea-wrap textarea{background:#fff;color:#243a56}
body[data-workspace-style="neutral"] .chip{background:#f5f8fc;border-color:#e4ebf4;color:#617898}
body[data-workspace-style="neutral"] .choice{border-radius:7px}
body[data-workspace-style="neutral"] .choice.active{background:#edf5ff;border-color:#86b2f1;color:#1764d7}
body[data-workspace-style="neutral"] :is(.button,.room-shortcut){border-radius:7px}
body[data-workspace-style="neutral"] .button-outline{border-color:#d8e4f2;color:#4b6485;background:#fff}
body[data-workspace-style="neutral"] .button-light{color:#5c7fae;background:#ffffffa8}
body[data-workspace-style="neutral"] .classroom-stage{background:#edf3fb;border:1px solid #e1e9f5;border-radius:8px}
body[data-workspace-style="neutral"] :is(.classroom-art,.classroom-bunny){display:none}
body[data-workspace-style="neutral"] .classroom-stage .screen-border{left:6%;top:6%;width:88%;padding:5px;background:#34465e;border-radius:6px;box-shadow:0 4px 12px #203b5c15}
body[data-workspace-style="neutral"] .preview-summary{color:#58708e}
body[data-workspace-style="neutral"] .preview-guidance{background:#edf5ff;border-color:#dceafb;color:#657e9f}
body[data-workspace-style="neutral"] .delivery-panel{background:#fff}
body[data-workspace-style="neutral"] .delivery-progress{padding:12px 8px;border-radius:7px;background:#f5f9ff}
body[data-workspace-style="neutral"] .stat-value{color:#236fda}
body[data-workspace-style="neutral"] .mobile-send-bar{background:#fffffff5;border-color:#dfe8f3;box-shadow:0 -2px 12px #17365b08}
body[data-workspace-style="neutral"] .badge.blue{background:#eaf3ff;color:#3579d2}
@media(min-width:601px) and (max-width:1199px){body[data-workspace-style="neutral"] .scenario-card{gap:7px;font-size:12px}body[data-workspace-style="neutral"] .scenario-art{width:31px;height:31px}.workspace-style-picker button{padding-inline:8px}}
@media(max-width:600px){
  .workspace-style-picker{gap:2px}.workspace-style-picker button{font-size:10px;gap:0;padding:7px 3px;min-width:0}.workspace-style-picker i{display:none}
  body[data-workspace-style="neutral"] .page-heading{border-radius:10px}
  body[data-workspace-style="neutral"] .heading-mascot{width:37px;height:40px;border-radius:9px}
  body[data-workspace-style="neutral"] .heading-mascot>.icon{width:24px;height:24px}
  body[data-workspace-style="neutral"] .scenario-card{min-height:72px;gap:5px;font-size:10px;padding:7px 1px;border-radius:8px}
  body[data-workspace-style="neutral"] .scenario-art{width:29px;height:29px;border-radius:8px}
  body[data-workspace-style="neutral"] .scenario-art>.icon{width:19px;height:19px}
  body[data-workspace-style="neutral"] .classroom-stage .screen-border{padding:3px}
}
/* Primary navigation and its nested tools. */
.section-tabs{display:flex;gap:8px;margin-bottom:24px;padding:5px;border:1px solid var(--line);border-radius:12px;background:var(--paper,#fff);width:fit-content;max-width:100%}
.section-tabs button{display:flex;align-items:center;justify-content:center;gap:9px;padding:11px 20px;min-height:44px;border:0;border-radius:8px;background:transparent;color:var(--muted);font:inherit;font-size:14px;cursor:pointer;white-space:nowrap}
.section-tabs button[aria-selected="true"]{background:var(--skin-soft,#e7f3ec);color:var(--skin-accent,var(--green));font-weight:600}
.section-tabs button .icon{width:18px;height:18px}.section-tabs button:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.sticker-toolbar{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px;border-bottom:1px solid var(--line)}
.sticker-toolbar label{min-width:180px;max-width:100%;flex-shrink:0}.sticker-toolbar p{margin:8px 0 0}.sticker-body{padding:24px}.sticker-workspace{overflow:visible}.sticker-body .board-editor-grid>aside{top:18px}.sticker-body .board-editor-grid{gap:28px}
dialog:has(.template-library){width:min(960px,calc(100% - 32px))}.template-library-tools{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.template-library-tools p{margin:0}.template-library .template-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.template-library .template-card{padding:22px}.template-library .template-card p{font-size:13px;line-height:1.8;overflow-wrap:anywhere}.template-tag{position:absolute;top:25px;right:20px}.template-card-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:20px}.template-card-actions .button{margin:0}.template-card-actions .text-link{min-height:40px}.template-form-actions{display:flex;justify-content:space-between;gap:12px}.template-row{flex-wrap:wrap;row-gap:10px}
@media(max-width:800px){.sticker-toolbar{align-items:flex-start;flex-direction:column;padding:20px}.sticker-toolbar label{width:100%}.sticker-body{padding:18px}.sticker-body .board-editor-grid>aside{position:static}.section-tabs{width:100%}.section-tabs button{flex:1;padding-inline:12px}}
@media(max-width:600px){.sidebar nav{grid-template-columns:repeat(5,minmax(0,1fr))}.template-library .template-grid{grid-template-columns:1fr}.template-library-tools{flex-direction:column;align-items:stretch;gap:12px}.template-form-actions{flex-wrap:wrap}.template-form-actions .button{flex:1}.template-row>.text-link{margin-left:0}}

body[data-route="stickers"] #stats{display:none}