/* 一同 · Creative Studio. Presentation layer; course and account data stay intact. */
:root {
  --paper: #fffcf5; --paper-deep: #f3f0e8; --paper-card: #ffffff;
  --ink: #292826; --ink-2: #59564f; --ink-3: #77736b;
  --sun: #f6d452; --sun-hover: #ebc439; --sun-wash: #fff4c6;
  --lavender: #b6a4da; --lavender-wash: #f0ebf8; --coral-wash: #fce9df;
  --line: rgba(41,40,38,.12); --line-soft: rgba(41,40,38,.07);
  --line-strong: rgba(41,40,38,.24); --accent: var(--sun);
  --point: #ae502b; --ring: 0 0 0 3px rgba(182,164,218,.35);
  --r-card: 14px; --r-2: 10px; --r-3: 18px;
  --font-display: var(--font-sans); --t-body: 16px;
  --shadow-card: 0 3px 16px -9px rgba(41,40,38,.16);
  --shadow-lift: 0 12px 28px -16px rgba(41,40,38,.25);
  --header-h: 76px; --maxw: 1360px;
}
html { scroll-padding-top: calc(var(--header-h) + 20px); }
body { background: var(--paper); }
h1,h2,h3,.h1,.h2,.h3,.hero__title,.pdp__title,.article-title,.brand__name,
.teach-panel h2,.teach-panel h3,.classroom__title { font-family: var(--font-sans); font-weight: 650; letter-spacing: -.035em; }
.wrap { max-width: 1440px; }
.section { padding-block: clamp(36px,5vw,72px); }
.section--flush { padding-block: 0; }
.section--tint { background: var(--paper-deep); }
.section__head { gap: 28px; margin-bottom: 30px; }
.eyebrow { color: var(--ink-3); letter-spacing: .06em; }
.eyebrow__dot { background: var(--sun); animation: none; width: 7px; height: 7px; }
::selection { color: var(--ink); background: var(--sun-wash); }
:focus-visible,.btn:focus-visible { outline: 3px solid var(--lavender); outline-offset: 3px; }
.site-header,.site-header.is-scrolled { background: rgba(255,252,245,.97); border-bottom: 1px solid var(--line-soft); box-shadow: none; }
.site-header__inner { gap: 28px; }
.brand { align-items: center; gap: 10px; }
.brand__mark { width: 13px; height: 13px; border-radius: 4px; transform: rotate(-8deg); background: var(--sun); }
.brand:hover .brand__mark { transform: rotate(8deg); }
.brand__name { font-size: 25px; display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.brand__abbr { font: 600 11px var(--font-num); letter-spacing: .1em; border: 0; color: var(--ink-2); }
.brand__suffix { display: none; }
.nav { gap: 4px; }
.nav__link { padding: 11px 12px; font-size: 14px; white-space: nowrap; }
.nav__link::after { background: var(--sun); height: 3px; border-radius: 3px; }
.header-actions { gap: 10px; }
.btn { border-radius: 10px; font-weight: 600; min-height: 44px; padding: 11px 20px; letter-spacing: 0; }
.btn--solid,.btn--accent { --btn-bg: var(--sun); --btn-fg: var(--ink); --btn-bd: var(--sun); background: var(--sun); color: var(--ink); border-color: var(--sun); box-shadow: none; }
.btn--solid:hover,.btn--accent:hover { --btn-bg: var(--sun-hover); --btn-fg: var(--ink); --btn-bd: var(--sun-hover); background: var(--sun-hover); border-color: var(--sun-hover); color: var(--ink); box-shadow: var(--shadow-card); }
.btn--ghost { --btn-bg: transparent; --btn-fg: var(--ink); --btn-bd: var(--line); }
.btn--ghost:hover { --btn-bg: var(--paper-deep); --btn-fg: var(--ink); --btn-bd: var(--line-strong); }
.btn--lg { min-height: 50px; padding-inline: 26px; }
.input,select.input,textarea.input { background: var(--paper-card); border-color: var(--line); border-radius: 10px; min-height: 44px; }
.input:focus { box-shadow: var(--ring); border-color: var(--lavender); }
.chip,.tag-chip { border-color: var(--line); border-radius: 8px; }
.chip[aria-pressed=true],.chip.is-on,.tag-chip.is-on,.mode-switch button[aria-pressed=true] { background: var(--sun-wash); color: var(--ink); border-color: var(--sun); }
.mode-switch { border-color: var(--line); background: white; border-radius: 10px; }
.points { color: var(--point); }
.rule--strong { border-color: var(--line); }

/* Discovery: artwork first, with a concise route into teaching. */
body[data-page=home] .hero { padding-block: 32px 24px; }
body[data-page=home] .hero__grid { grid-template-columns: minmax(0,.9fr) minmax(0,1.25fr); align-items: center; gap: 36px; }
body[data-page=home] .hero__title { font-size: clamp(34px,4vw,58px); line-height: 1.23; max-width: 13ch; }
body[data-page=home] .hero__title em { color: inherit; font-style: normal; }
body[data-page=home] .hero .lede { font-size: 16px; max-width: 34em; line-height: 1.9; margin-top: 22px; }
body[data-page=home] .hero__art { margin: 0; height: clamp(280px,29vw,420px); overflow: hidden; border-radius: 18px; background: var(--paper-deep); }
body[data-page=home] .hero__art img { width: 100%; height: 100%; object-fit: cover; }
body[data-page=home] .hero__aside { grid-column: 1/-1; display: flex; align-items: center; gap: 26px; padding-top: 12px; }
body[data-page=home] .hero__stat { border: 0; padding: 0; display: flex; align-items: center; gap: 10px; }
body[data-page=home] .hero__stat-n { font: 600 16px var(--font-sans); }
body[data-page=home] .hero__stat-l { font-size: 12px; }
body[data-page=home] .hero__aside>p { font-size: 12px; margin-left: auto!important; max-width: 30em; }
body[data-page=home] .mech-strip { display: none; }
.studio-paths { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-top: 26px; }
.studio-path { display: flex; align-items: center; gap: 14px; padding: 20px; background: white; border: 1px solid var(--line-soft); border-radius: 14px; transition: box-shadow 180ms,transform 180ms; }
.studio-path:hover { transform: translateY(-3px); box-shadow: var(--shadow-lift); }
.studio-path__icon { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border-radius: 14px; background: var(--sun-wash); }
.studio-path:nth-child(2) .studio-path__icon,.studio-path:nth-child(4) .studio-path__icon { background: var(--lavender-wash); }
.studio-path:nth-child(3) .studio-path__icon { background: var(--coral-wash); }
.studio-path b { display: block; font-size: 16px; margin-bottom: 3px; }
.studio-path small { display: block; font-size: 12px; line-height: 1.6; color: var(--ink-3); }
.studio-path__arrow { margin-left: auto; }
body[data-page=home] [data-picked] { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.cw-card { border: 1px solid var(--line-soft); background: white; border-radius: 14px; overflow: hidden; box-shadow: none; min-width: 0; }
.cw-card:hover { border-color: var(--line); box-shadow: var(--shadow-lift); }
.cw-card__cover img,.cw-card__cover svg { width: 100%; height: 100%; object-fit: cover; }
.cw-card__body { padding: 16px 18px; gap: 9px; }
.cw-card__title { font-size: 18px; line-height: 1.5; }
.cw-card__meta { font-size: 12px; }
.cw-card__desc { font-size: 13px; line-height: 1.75; }
.cw-card__foot { border-top-color: var(--line-soft); }
.seal { background: rgba(255,255,255,.94); color: var(--ink-2); border: 0; border-radius: 6px; font-size: 10px; }
.cw-card__owned { background: var(--sun); color: var(--ink); }
body[data-page=market] .market-head .split { grid-template-columns: minmax(0,1fr) minmax(280px,.55fr); }
body[data-page=market] .market-head .h1 { font-size: clamp(28px,3vw,42px); }
body[data-page=market] .market-head .lede { font-size: 14px; max-width: 58ch!important; }
body[data-page=market] .market-filters { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px 32px; padding: 22px 0; }
body[data-page=market] .filter-bar { background: var(--paper); border-block-color: var(--line-soft); }
body[data-page=market] [data-results] { display: block; columns: 4; column-gap: 22px; }
body[data-page=market] [data-results] .cw-card { break-inside: avoid; margin-bottom: 24px; display: flex; width: 100%; }
body[data-page=market] [data-results] .cw-card:nth-child(3n+1) .cw-card__cover { aspect-ratio: 4/5; }
body[data-page=market] [data-results] .cw-card:nth-child(3n+2) .cw-card__cover { aspect-ratio: 1/1; }
body[data-page=market] [data-results] .cw-card__desc { display: none; }
.studio-market-layout { display: grid; grid-template-columns: 190px minmax(0,1fr); gap: 28px; padding-top: 30px; }
.studio-market-aside { align-self: start; background: white; border: 1px solid var(--line-soft); border-radius: 12px; padding: 18px; position: sticky; top: calc(var(--header-h) + 16px); max-height: calc(100dvh - var(--header-h) - 32px); overflow-y: auto; }
.studio-market-filter-title { font-size: 15px; }
body[data-page=market] .studio-market-aside .market-filters { display: grid; grid-template-columns: 1fr; gap: 20px; padding-bottom: 0; }
.studio-market-aside .filter-group { display: block; }
.studio-market-aside .filter-group__label { display: block; margin-bottom: 10px; }
.studio-market-aside .chips { gap: 6px; }
body[data-page=market] .studio-market-aside .chip { padding: 4px 8px; font-size: 12px; }
.studio-market-results { min-width: 0; }
.studio-market-results .wrap { padding-inline: 0; width: 100%; }
.studio-market-results .filter-bar { position: static; border: 0; padding: 0; }
.studio-market-results .filter-bar__inner { padding: 0; min-height: 40px; gap: 12px; }
.studio-market-results .filter-bar .filter-group__label { display: none; }
body[data-page=market] .studio-market-results>section { padding-top: 24px!important; }
body[data-page=market] .studio-market-results [data-results] { columns: 3; }
.pdp__top { gap: 36px; grid-template-columns: minmax(0,1.08fr) minmax(0,1fr); }
.pdp__stage { border-radius: 16px; border: 1px solid var(--line-soft); }
.pdp__title { font-size: clamp(28px,3vw,42px); line-height: 1.35; }
.pdp__buy { background: white; border: 1px solid var(--line-soft); border-radius: 16px; padding: 28px; }
.pdp__facts { background: var(--paper); border-radius: 12px; }
.pdp__thumb { border-radius: 9px; }
.pdp__thumb[aria-pressed=true] { border-color: var(--sun-hover); box-shadow: 0 0 0 2px var(--sun-wash); }
.wall-card,.off-card,.board-card { border-radius: 14px; border-color: var(--line-soft); background: white; }
.wall-card__art,.wall-card__img { overflow: hidden; }
.tile,.step,.teacher-card,.card-soft { border-radius: 14px; border-color: var(--line); }
.tile:hover { background: var(--sun-wash); }
.studio-capabilities { border-top: 1px solid var(--line-soft); }
.studio-capabilities__intro { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.studio-capabilities__intro p { color: var(--ink-3); max-width: 32em; font-size: 14px; }
.studio-capabilities__grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.studio-capability { display: grid; grid-template-columns: minmax(0,1fr) 160px; min-height: 190px; gap: 24px; padding: 28px; background: white; border: 1px solid var(--line-soft); border-radius: 16px; }
.studio-capability h3 { font-size: 22px; margin-bottom: 12px; }
.studio-capability p { color: var(--ink-3); font-size: 14px; line-height: 1.8; }
.studio-capability__art { border-radius: 10px; overflow: hidden; align-self: stretch; background: var(--lavender-wash); }
.studio-capability__art img { width: 100%; height: 100%; object-fit: cover; }
.studio-capability .link-arrow { font-size: 13px; font-weight: 600; }

/* Teacher area: one persistent navigation, useful content, clear empty states. */
.studio-workspace #main { padding-left: 208px; min-height: calc(100dvh - var(--header-h)); }
.studio-sidebar { position: fixed; left: 0; top: var(--header-h); bottom: 0; width: 208px; padding: 28px 16px; border-right: 1px solid var(--line-soft); background: white; display: flex; flex-direction: column; gap: 6px; z-index: 30; overflow-y: auto; }
.studio-sidebar__label { font-size: 11px; color: var(--ink-3); letter-spacing: .08em; padding: 0 14px 15px; }
.studio-sidebar a { display: flex; gap: 12px; align-items: center; padding: 12px 14px; font-size: 14px; border-radius: 10px; }
.studio-sidebar a:hover { background: var(--paper-deep); }
.studio-sidebar a[aria-current=page] { background: var(--sun-wash); font-weight: 600; }
.studio-sidebar__bottom { margin-top: auto; padding-top: 24px; }
.studio-workspace .section { padding-block: 32px; }
.studio-workspace .h1 { font-size: clamp(26px,2.7vw,38px); }
.studio-workspace .section__head-aside .body-copy { font-size: 13px; }
.studio-workspace .lede { font-size: 15px; max-width: 44em; }
.studio-workspace .site-footer { margin-left: 208px; }
.studio-workspace .wb-block,.studio-workspace .wb-real,.wb-kpi,.wb-wallet,.teach-panel { background: white; border: 1px solid var(--line-soft); border-radius: 14px; padding: 24px; }
.studio-workspace .wb-block { margin-bottom: 20px; }
.studio-next-class { display: flex; gap: 24px; align-items: center; justify-content: space-between; padding: 28px; background: var(--sun-wash); border-radius: 16px; margin: 24px 0; }
.studio-next-class h2 { font-size: clamp(20px,2vw,28px); line-height: 1.5; margin-block: 7px; }
.studio-next-class p { font-size: 14px; color: var(--ink-2); margin: 0; }
.studio-next-class .btn { flex: none; }
body[data-page=workbench] #main>.wrap:first-child { display: none!important; }
.wb-row { padding-block: 16px; }
.teach-nav { gap: 8px; margin-block: 22px; }
.teach-nav a[aria-current=page] { background: var(--sun); color: var(--ink); border-color: var(--sun); }
.teach-grid { gap: 24px; }
.schedule-list { border: 1px solid var(--line-soft); border-radius: 14px; background: white; padding: 8px 22px; }
.schedule-row { border-color: var(--line-soft); padding-block: 22px; }
.studio-workspace .form-grid { background: white; padding: 28px; border: 1px solid var(--line-soft); border-radius: 14px; }
.form-fieldset { border-color: var(--line); border-radius: 14px; }
.rp-stats,.rp-list { background: white; border: 1px solid var(--line-soft); border-radius: 14px; padding: 24px; }
.site-footer { background: var(--paper-deep); border-color: var(--line-soft); }

/* Classroom: light studio chrome; preserve content colors, canvas and every tool. */
body.is-classroom { background: var(--paper-deep); color: var(--ink); }
.classroom { background: var(--paper-deep); color: var(--ink); grid-template-rows: 68px minmax(0,1fr); }
.classroom__bar { background: var(--paper); border-bottom-color: var(--line); gap: 14px; }
.classroom__title { font-size: 16px; }
.classroom__meta { color: var(--ink-3); }
.classroom__body { grid-template-columns: 176px minmax(0,1fr) 280px; gap: 12px; padding: 12px; }
.classroom__rail,.classroom__side { background: white; border: 1px solid var(--line-soft); border-radius: 14px; padding: 16px; }
.classroom__stage { padding: 0; gap: 12px; min-width: 0; }
.classroom .slide { border-radius: 14px; box-shadow: none; border: 1px solid var(--line); color: var(--ink); }
.classroom .stage-tools { background: white; padding: 10px; border: 1px solid var(--line-soft); border-radius: 12px; gap: 6px; }
.classroom .tool-btn,.classroom .class-code { background: white; color: var(--ink-2); border: 1px solid var(--line); border-radius: 8px; min-height: 36px; }
.classroom .tool-btn:hover,.classroom .class-code:hover { background: var(--paper-deep); color: var(--ink); border-color: var(--line-strong); }
.classroom .tool-btn--primary,.classroom .tool-btn[aria-pressed=true] { background: var(--sun); color: var(--ink); border-color: var(--sun); }
.classroom .class-code b { color: var(--ink); }
.classroom .rail__label,.classroom .side__label { color: var(--ink-3); font-size: 12px; letter-spacing: 0; font-weight: 600; }
.classroom .rail-note,.classroom .stage-pager,.classroom .side-stat,.classroom .answer-legend { color: var(--ink-3); }
.classroom .rail-item { color: var(--ink-2); padding-block: 12px; }
.classroom .rail-item:hover { background: var(--paper-deep); color: var(--ink); }
.classroom .rail-item.is-current { background: var(--sun-wash); color: var(--ink); }
.classroom .rail-item__state { color: var(--ink-3); }
.classroom .student,.classroom .side-stat b { color: var(--ink); }
.classroom .student--hand { background: var(--coral-wash); }
.classroom .question-card { background: var(--lavender-wash); border-color: var(--line-soft); color: var(--ink); }
.classroom .student__hand { color: var(--point); }
.studio-class-tabs { display: flex; gap: 4px; padding-bottom: 12px; border-bottom: 1px solid var(--line-soft); margin-bottom: 4px; }
.studio-class-tabs button { flex: 1; border: 0; background: transparent; padding: 9px 4px; cursor: pointer; border-radius: 8px; font-size: 13px; }
.studio-class-tabs button[aria-selected=true] { background: var(--sun-wash); font-weight: 600; }
.studio-class-notes { color: var(--ink-2); font-size: 14px; line-height: 1.9; white-space: pre-wrap; }
.studio-class-notes h3 { font-size: 14px; margin-bottom: 14px; }
.studio-class-notes p { padding: 16px; background: var(--paper); border-radius: 10px; }
.studio-more-tools { border: 1px solid var(--line); border-radius: 8px; position: relative; }
.studio-more-tools summary { list-style: none; padding: 7px 12px; cursor: pointer; font-size: 12px; }
.studio-more-tools summary::-webkit-details-marker { display: none; }
.studio-more-tools>div { position: absolute; bottom: calc(100% + 12px); left: 0; width: 260px; display: flex; flex-wrap: wrap; gap: 8px; padding: 14px; background: white; border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-lift); z-index: 40; }
.studio-class-brand { font-weight: 700; font-size: 19px; white-space: nowrap; padding-right: 14px; border-right: 1px solid var(--line); }
.studio-class-brand small { font: 600 9px var(--font-num); letter-spacing: .06em; margin-left: 5px; }
.classroom__rail [data-note],.classroom__rail [data-i18n="cls.note"] { display: none; }
.studio-panel-toggle { display: none!important; }
body.is-clean .classroom { grid-template-rows: minmax(0,1fr); }
body.is-clean .classroom__body { padding: 0; }
body.is-clean .classroom__stage { padding: 0; gap: 0; }
body.is-clean .studio-panel-toggle { display: none!important; }
@media(min-width:1100px) { .studio-workspace .site-header .nav__link { font-size: 13px; padding-inline: 9px; } }
@media(max-width:1200px) {
  .site-header__inner { gap: 14px; } .nav__link { padding-inline: 8px; font-size: 13px; }
  .studio-path { padding: 16px; gap: 10px; } .studio-path small { font-size: 11px; }
  body[data-page=market] [data-results] { columns: 3; }
  .studio-workspace #main { padding-left: 180px; } .studio-sidebar { width: 180px; } .studio-workspace .site-footer { margin-left: 180px; }
  .classroom__body { grid-template-columns: 140px minmax(0,1fr) 240px; }
  .classroom__bar-actions { gap: 5px; } .classroom__bar-actions .tool-btn { font-size: 11px; padding-inline: 8px; }
}
@media(max-width:960px) {
  .studio-market-layout { grid-template-columns: 160px minmax(0,1fr); gap: 18px; }
  .studio-market-aside { padding: 14px; }
  body[data-page=market] .studio-market-results [data-results] { columns: 2; }
  .studio-paths { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body[data-page=home] .hero__grid { gap: 24px; }
  body[data-page=home] .hero__aside { flex-wrap: wrap; }
  .studio-capability { grid-template-columns: minmax(0,1fr) 100px; padding: 20px; gap: 16px; }
  .studio-workspace #main { padding-left: 0; } .studio-sidebar { position: static; width: auto; flex-direction: row; gap: 4px; padding: 10px var(--gutter); border: 0; border-bottom: 1px solid var(--line-soft); overflow-x: auto; }
  .studio-sidebar a { flex: none; white-space: nowrap; font-size: 13px; padding: 9px 12px; } .studio-sidebar a svg { display: none; }
  .studio-sidebar__label,.studio-sidebar__bottom { display: none; } .studio-workspace .site-footer { margin-left: 0; }
  .classroom__body { grid-template-columns: minmax(0,1fr) 230px; } .classroom__rail { display: none; }
  .classroom__bar { flex-wrap: wrap; padding-block: 8px; } .classroom { grid-template-rows: auto minmax(0,1fr); }
  .studio-class-brand { display: none; } .classroom__bar-actions { flex-wrap: wrap; }
}
@media(max-width:720px) {
  .studio-next-class { align-items: start; flex-direction: column; padding: 20px; gap: 18px; }
  .studio-market-layout { display: block; padding-top: 16px; }
  .studio-market-aside { position: static; max-height: none; margin-bottom: 24px; }
  body[data-page=market] .studio-market-aside .market-filters { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
  .studio-market-aside .filter-group:nth-child(2) { grid-column: 1/-1; }
  .studio-market-results .mode-switch button { padding: 8px; font-size: 11px; }
  :root { --header-h: 62px; }
  .section { padding-block: 32px; } .section--flush { padding-block: 0; }
  body[data-page=home] .hero__grid { grid-template-columns: 1fr; gap: 24px; }
  body[data-page=home] .hero__title { font-size: 36px; max-width: none; }
  body[data-page=home] .hero__art { height: 260px; }
  body[data-page=home] .hero__aside { gap: 12px 22px; } body[data-page=home] .hero__aside>p { margin-left: 0!important; }
  body[data-page=home] .hero .lede { font-size: 15px; }
  .studio-paths { gap: 10px; margin-top: 20px; } .studio-path { padding: 14px 12px; gap: 9px; }
  .studio-path__icon { width: 34px; height: 34px; border-radius: 10px; } .studio-path b { font-size: 14px; } .studio-path__arrow { display: none; }
  body[data-page=home] [data-picked] { grid-template-columns: 1fr; }
  body[data-page=market] .market-head .split { grid-template-columns: 1fr; gap: 24px; }
  body[data-page=market] .market-filters { grid-template-columns: 1fr; gap: 12px; }
  body[data-page=market] [data-results] { columns: 2; column-gap: 12px; }
  body[data-page=market] [data-results] .cw-card { margin-bottom: 14px; } .cw-card__body { padding: 12px; } .cw-card__title { font-size: 15px; }
  body[data-page=market] .cw-card__seals { position: static; padding: 6px; background: white; } body[data-page=market] .cw-card__cover { aspect-ratio: auto!important; } body[data-page=market] .cw-card__cover img { aspect-ratio: 4/5; }
  .studio-capabilities__intro { display: block; } .studio-capabilities__grid { grid-template-columns: 1fr; }
  .studio-capability { min-height: 170px; grid-template-columns: minmax(0,1fr) 110px; }
  .pdp__top { grid-template-columns: 1fr; gap: 24px; } .pdp__media { position: static; } .pdp__buy { padding: 20px; }
  .studio-workspace .form-grid { padding: 18px; } .studio-workspace .wb-block,.teach-panel { padding: 18px; }
  .classroom__body { grid-template-columns: minmax(0,1fr); padding: 8px; } .classroom__side { display: none; }
  .studio-panel-toggle { display: inline-flex!important; }
  body.studio-panel-open .classroom__side { display: grid!important; position: fixed; right: 10px; bottom: 100px; top: 116px; width: min(300px,calc(100vw - 20px)); z-index: 60; box-shadow: var(--shadow-lift); }
  .classroom__bar { gap: 8px; } .classroom__bar-actions { width: 100%; margin-left: 0; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 2px; }
  .classroom__bar-actions>* { flex: none; } .classroom .stage-tools { gap: 5px; padding: 8px; } .classroom .tool-btn { font-size: 11px; padding-inline: 8px; }
  .studio-more-tools>div { left: auto; right: 0; }
}
@media(prefers-reduced-motion:reduce) { .studio-path,.cw-card,.btn { transition: none; } }

/* Inner pages: task-specific composition, using the existing functional nodes. */
.studio-inner #main { min-width:0; }
.studio-inner .section__head { align-items:start; }
.studio-inner .section__head-aside { max-width:36em; }
.studio-inner .h2 { font-size:clamp(23px,2.2vw,32px);line-height:1.35; }
.studio-inner .section__head .body-copy { font-size:14px;line-height:1.85; }
.studio-workspace #main > .section > .wrap { max-width:1280px; }
.studio-dashboard-grid { display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:20px;margin-top:24px; }
.studio-dashboard-grid .studio-overview-block { margin:0;min-width:0; }
.studio-overview-block--0 { grid-row:span 2; }
.studio-dashboard-grid .wb-table { overflow-x:auto; }
body[data-page=workbench] [data-real-dash] { margin-top:24px; }
body[data-page=workbench] #main > .section:not(:first-of-type) > .wrap { display:grid;grid-template-columns:minmax(200px,.65fr) minmax(0,1.7fr);gap:16px 40px; }
body[data-page=workbench] #main > .section:not(:first-of-type) .section__head { grid-row:span 5;display:block; }
body[data-page=workbench] #main > .section:not(:first-of-type) .section__head-aside { margin-top:18px; }
body[data-page=workbench] #main > .section:not(:first-of-type) .section__head .h2 { margin-block:10px!important; }
.studio-schedule-desk { display:grid;grid-template-columns:minmax(0,1.2fr) minmax(360px,1fr);align-items:start;gap:28px;padding:32px clamp(20px,3vw,44px);max-width:1440px;margin:auto; }
.studio-schedule-desk > .section { padding:0;background:transparent;min-width:0; }
.studio-schedule-desk .wrap { width:100%;padding:0; }
.studio-schedule-desk .section__head { display:block;margin-bottom:24px; }
.studio-schedule-desk .section__head-aside { margin-top:20px; }
.studio-schedule-desk .h1 { font-size:clamp(28px,2.5vw,38px); }
.studio-schedule-desk .lede { font-size:14px;line-height:1.85; }
.studio-schedule-desk #new { border:1px solid var(--line);border-radius:16px;background:white;padding:24px; }
.studio-schedule-desk #new .form-grid { border:0;padding:0;background:transparent;gap:18px; }
.studio-schedule-desk #new .h2 { font-size:25px; }
.studio-schedule-desk #new .section__head-aside { border-top:1px solid var(--line-soft);padding-top:14px; }
.studio-schedule-desk .schedule-row { display:flex;flex-wrap:wrap;gap:14px; }
.studio-publish-desk { display:grid!important;grid-template-columns:minmax(0,1fr) 290px;gap:28px!important; }
.studio-publish-desk .wizard { width:100%; }
.studio-publish-desk > aside { width:auto!important;min-width:0; }
.studio-publish-desk .wizard__steps { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;border:0;margin-bottom:24px; }
.studio-publish-desk .wizard__step { display:flex;align-items:center;gap:8px;padding:12px 10px;background:var(--paper-deep);border:1px solid transparent;border-radius:10px;font-size:13px; }
.studio-publish-desk .wizard__step[aria-current=step] { background:var(--sun-wash);border-color:var(--sun);color:var(--ink); }
.studio-publish-desk .form-fieldset { padding:26px;background:white;margin-bottom:18px; }
.studio-publish-desk .form-fieldset__title { font-size:23px; }
.studio-publish-desk .form-fieldset__hint { max-width:60ch;line-height:1.85; }
.studio-publish-desk .form-grid { padding:0;border:0; }
.studio-publish-desk aside .note { margin:0!important;max-width:none!important;padding:22px; }
.studio-publish-desk .upload-drop { min-height:190px;display:flex;flex-direction:column;justify-content:center;background:var(--lavender-wash);border:1px dashed var(--lavender); }
body[data-page=teaching] .teach-top { padding-bottom:26px;border-bottom:1px solid var(--line); }
body[data-page=teaching] .teach-nav { margin-block:20px 28px; }
body[data-page=teaching] .teach-grid { grid-template-columns:minmax(230px,.65fr) minmax(0,1.7fr);align-items:start; }
body[data-page=teaching] .teach-grid > .teach-panel:first-child { position:sticky;top:calc(var(--header-h) + 20px);background:var(--lavender-wash); }
body[data-page=teaching] .teach-panel h2 { font-size:22px;margin-bottom:22px; }
body[data-page=teaching] #prep-save { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px; }
body[data-page=teaching] #prep-save > label:nth-child(n+3),body[data-page=teaching] #prep-save > .teach-actions,body[data-page=teaching] #prep-save > .teach-note { grid-column:1/-1; }
body[data-page=teaching] #prep-save textarea { min-height:130px;resize:vertical; }
body[data-page=teaching] .teach-row { padding-block:20px;gap:16px;flex-wrap:wrap; }
body[data-page=teacher] .author-band { display:grid;grid-template-columns:minmax(200px,.65fr) minmax(0,1.6fr);gap:48px;align-items:center;padding:36px;background:var(--lavender-wash);border-radius:20px; }
body[data-page=teacher] .author-portrait { width:100%;height:auto;aspect-ratio:1;max-width:290px;border-radius:14px;overflow:hidden; }
body[data-page=teacher] .author-portrait svg,body[data-page=teacher] .author-portrait img { width:100%;height:100%;object-fit:cover; }
body[data-page=teacher] .wall--teacher { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px; }
body[data-page=wall] .wall-head { display:grid;grid-template-columns:1.2fr 1fr;gap:36px;align-items:end;padding-block:16px 28px;border-bottom:1px solid var(--line); }
body[data-page=wall] .wall-tools { display:flex;flex-wrap:wrap;gap:16px;align-items:center;padding:24px;background:white;border:1px solid var(--line);border-radius:14px;margin-block:24px; }
body[data-page=wall] .wall-search { flex:1 1 280px; }
body[data-page=wall] .wall-tools__row { flex:2 1 440px; }
body[data-page=courseware] .pdp__top { align-items:start; }
body[data-page=courseware] .pdp__media { position:sticky;top:calc(var(--header-h) + 20px); }
body[data-page=courseware] .pdp__buy { padding:32px; }
body[data-page=courseware] .pdp__facts { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:22px; }
body[data-page=courseware] .qa { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px; }
body[data-page=courseware] .qa__item { padding:24px;border:1px solid var(--line);border-radius:14px;background:white; }
.studio-account-nav { display:flex;gap:8px;flex-wrap:wrap;padding:0 var(--gutter) 24px;border-bottom:1px solid var(--line); }
.studio-account-nav a { padding:10px 16px;border:1px solid var(--line);border-radius:9px;background:white;font-size:14px; }
.studio-account-nav a:hover { background:var(--sun-wash); }
body[data-page=account] #main > .section:not(:first-of-type) > .wrap { display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px 36px; }
body[data-page=account] #main > .section:not(:first-of-type) .section__head { display:block;grid-row:span 8; }
body[data-page=account] #main > .section:not(:first-of-type) .section__head-aside { margin-top:18px; }
body[data-page=account] #profile .form-grid { max-width:none!important; }
body[data-page=report] #main > .wrap > section { display:grid;grid-template-columns:minmax(0,1.8fr) minmax(220px,.8fr);gap:24px;align-items:start; }
body[data-page=report] .rp-list { grid-column:1;grid-row:1; }
body[data-page=report] .rp-stats { grid-column:2;position:sticky;top:calc(var(--header-h) + 20px); }
body[data-page=report] .rp-list li { padding:18px 12px;border-bottom:1px solid var(--line-soft); }
body[data-page=report] [data-rp-empty] { grid-column:1/-1;padding:48px;background:white;border:1px solid var(--line);border-radius:14px; }
@media(max-width:1100px) {
 .studio-schedule-desk { grid-template-columns:1fr; }.studio-publish-desk { grid-template-columns:minmax(0,1fr) 240px; }
 body[data-page=teacher] .wall--teacher { grid-template-columns:repeat(2,minmax(0,1fr)); }
 body[data-page=account] #main > .section:not(:first-of-type) > .wrap { grid-template-columns:180px minmax(0,1fr);gap:24px; }
}
@media(max-width:720px) {
 .studio-dashboard-grid,.studio-publish-desk,body[data-page=teaching] .teach-grid,body[data-page=teacher] .author-band,body[data-page=wall] .wall-head,body[data-page=courseware] .qa,body[data-page=report] #main > .wrap > section { grid-template-columns:1fr; }
 .studio-overview-block--0 { grid-row:auto; }
 body[data-page=workbench] #main > .section:not(:first-of-type) > .wrap,body[data-page=account] #main > .section:not(:first-of-type) > .wrap { display:block; }
 .studio-schedule-desk { padding:24px 16px;gap:24px; }.studio-schedule-desk #new { padding:20px; }
 .studio-publish-desk > aside { position:static!important; }.studio-publish-desk .form-fieldset { padding:20px; }
 body[data-page=teaching] .teach-grid > .teach-panel:first-child,body[data-page=courseware] .pdp__media { position:static; }
 body[data-page=teaching] #prep-save { grid-template-columns:1fr; }
 body[data-page=teacher] .author-band { padding:24px;gap:24px; }.author-band .author-portrait { max-width:180px; }
 body[data-page=wall] .wall-tools { padding:16px; }.studio-account-nav { flex-wrap:nowrap;overflow-x:auto; }.studio-account-nav a { white-space:nowrap; }
 body[data-page=courseware] .pdp__buy { padding:20px; }
 body[data-page=report] .rp-stats,body[data-page=report] .rp-list { grid-column:auto;grid-row:auto;position:static; }
}
/* Supporting flows keep the same hierarchy: context, primary task, secondary help. */
.studio-schedule-desk .form-grid { align-items:start; }
.studio-schedule-desk .field { align-self:start; }
.studio-schedule-desk .select { height:46px; }
body[data-page=credits] #recharge > .wrap { display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.65fr);gap:24px 36px;align-items:start; }
body[data-page=credits] #recharge .section__head { grid-column:1/-1; }
body[data-page=credits] #recharge .split { display:flex;flex-direction:column;margin-top:0!important;gap:20px; }
body[data-page=credits] .recharge-grid { grid-template-columns:repeat(2,minmax(0,1fr));gap:16px; }
body[data-page=credits] .recharge { padding:28px;text-align:left; }
body[data-page=credits] .estimate { width:100%;background:white;padding:24px;border:1px solid var(--line);border-radius:14px; }
body[data-page=credits] #ledger > .wrap { display:grid;grid-template-columns:240px minmax(0,1fr);gap:36px;align-items:start; }
body[data-page=import] .imp-grid { display:grid;grid-template-columns:minmax(280px,.7fr) minmax(0,1.3fr);gap:28px;align-items:start; }
body[data-page=import] .imp-left { position:sticky;top:calc(var(--header-h) + 24px); }
body[data-page=import] .imp-drop { min-height:280px;background:var(--lavender-wash);border:1px dashed var(--lavender);border-radius:16px; }
body[data-page=import] .imp-right { min-height:340px;background:white;border:1px solid var(--line);border-radius:16px;padding:28px; }
body[data-page=login] .wrap--narrow,body[data-page=register] .wrap--narrow { max-width:1080px; }
body[data-page=login] [data-login-form],body[data-page=register] form { background:white;padding:28px;border:1px solid var(--line);border-radius:16px; }
body[data-page=login] .split,body[data-page=register] .split { align-items:start;gap:48px; }
body[data-page=pay] .pay-shell { display:grid;grid-template-columns:1fr 1fr;gap:20px 28px;padding:32px;background:white;border:1px solid var(--line);border-radius:16px; }
body[data-page=pay] .pay-shell[hidden] { display:none; }
body[data-page=pay] .pay-shell > .eyebrow,body[data-page=pay] .pay-shell > h1,body[data-page=pay] .pay-shell > p { grid-column:1/-1; }
body[data-page=pay] .pay-qr { grid-column:2;grid-row:4/span 2; }
body[data-page=board] #main > .wrap,body[data-page=follows] #main > .wrap { display:grid;grid-template-columns:240px minmax(0,1fr);gap:40px;align-items:start;padding-block:36px; }
body[data-page=board] #main > .wrap > header,body[data-page=follows] #main > .wrap > header { position:sticky;top:var(--header-h); }
@media(max-width:720px) {
 body[data-page=credits] #recharge > .wrap,body[data-page=credits] #ledger > .wrap,body[data-page=import] .imp-grid,body[data-page=pay] .pay-shell,body[data-page=board] #main > .wrap,body[data-page=follows] #main > .wrap { display:block; }
 body[data-page=import] .imp-left,body[data-page=board] #main > .wrap > header,body[data-page=follows] #main > .wrap > header { position:static; }
 body[data-page=import] .imp-right { margin-top:24px;padding:18px; }
 body[data-page=pay] .pay-shell > * { margin-bottom:20px; }
 body[data-page=credits] #recharge .split { margin-top:24px!important; }
}
body[data-page=studio] .studio__grid { grid-template-columns:220px minmax(0,1fr) 290px;gap:12px;padding:12px;background:var(--paper-deep); }
body[data-page=studio] .studio__tree,body[data-page=studio] .studio__inspector { background:white;border:1px solid var(--line);border-radius:12px; }
body[data-page=studio] .studio__canvas-wrap { min-width:0;background:var(--paper-deep); }
body[data-page=studio] .studio__toolbar { background:white;border-radius:12px;padding:12px; }
body[data-page=family] .teach-top { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:center;padding:28px;background:var(--lavender-wash);border-radius:16px; }
body[data-page=family] .family-metric { background:white;border:1px solid var(--line);border-radius:12px;padding:24px; }
body[data-page=family] .family-tabs { border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:28px; }
body[data-page=family] .family-tabs [aria-current=page] { background:var(--sun);color:var(--ink);border-color:var(--sun); }
@media(max-width:1100px) { body[data-page=studio] .studio__grid { grid-template-columns:180px minmax(0,1fr) 240px; } }
@media(max-width:720px) { body[data-page=studio] .studio__grid { grid-template-columns:1fr; }body[data-page=family] .teach-top { grid-template-columns:1fr;padding:20px;gap:20px; } }
/* The legacy wizard used its own two-column grid; flatten it inside the publishing desk. */
.studio-publish-desk .wizard { display:block; }
.studio-publish-desk .wizard__steps { position:static;width:100%;grid-template-columns:repeat(6,minmax(0,1fr)); }
.studio-publish-desk .wizard__step { white-space:normal;line-height:1.5; }
.studio-publish-desk .wizard__n { flex:none; }
.studio-publish-desk .form-fieldset__title { font-family:var(--font-sans);font-weight:650; }
@media(max-width:1100px) { .studio-publish-desk .wizard__steps { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:720px) { .studio-publish-desk .wizard__step { padding:10px 8px;font-size:12px; } }

/* Library: a real discovery workspace, with independent facets and an artwork canvas. */
body[data-page=wall] #main > .wrap { max-width:1600px;padding-inline:clamp(16px,3vw,48px); }
body[data-page=wall] .library-heading { display:flex;flex-direction:row;align-items:end;justify-content:space-between;text-align:left;padding-block:42px 30px;gap:32px; }
body[data-page=wall] .wall-title { justify-content:start;font-size:clamp(32px,3.6vw,50px);gap:18px; }
body[data-page=wall] .wall-count { transform:none;font-size:13px;letter-spacing:0;color:var(--ink-3);padding:7px 12px;border:1px solid var(--line);border-radius:8px; }
body[data-page=wall] .wall-lede { margin-left:0;font-size:15px;max-width:48em!important;line-height:1.85; }
.library-heading__note { flex:none;padding:20px 24px;background:var(--lavender-wash);border-radius:14px; }
.library-heading__note > span { font-size:11px;letter-spacing:.08em;color:var(--ink-3); }
.library-heading__note p { font-size:17px;line-height:1.8;margin-top:8px; }
.library-layout { display:grid;grid-template-columns:228px minmax(0,1fr);gap:30px;padding-block:28px 56px;align-items:start; }
.library-facets { position:sticky;top:calc(var(--header-h) + 20px);padding:22px;background:white;border:1px solid var(--line);border-radius:14px; }
.library-facets__head { display:flex;align-items:center;justify-content:space-between;gap:12px; }
.library-facets h2 { font-size:16px;line-height:1.5; }
.library-reset { border:0;background:none;color:var(--ink-3);font:inherit;font-size:12px;cursor:pointer;padding:10px 0; }
.library-reset:hover { color:var(--ink);text-decoration:underline; }
.library-facets__intro { font-size:12px;line-height:1.8;color:var(--ink-3);margin:8px 0 24px; }
body[data-page=wall] .library-facets .wall-filters { display:grid;grid-template-columns:1fr;gap:20px;width:100%;margin:0; }
.library-filter { display:grid;gap:8px;min-width:0; }
.library-filter > span { font-size:12px;font-weight:600;color:var(--ink-2); }
body[data-page=wall] .library-filter select { display:block;width:100%;max-width:100%;height:44px;border:1px solid var(--line);background:var(--paper);border-radius:8px;padding:0 10px;font:inherit;font-size:13px; }
.library-board-link { display:grid;gap:10px;margin-top:28px;padding-top:22px;border-top:1px solid var(--line); }
.library-board-link strong { font-size:13px; }.library-board-link span { font-size:12px;color:var(--ink-3);line-height:1.8; }
.library-results { min-width:0; }
body[data-page=wall] .library-results .wall-tools { display:flex;position:static;max-width:none;width:100%;padding:0 0 20px;margin:0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;backdrop-filter:none;gap:16px; }
body[data-page=wall] .library-results .wall-search { flex:1 1 260px;max-width:none;width:auto;margin:0;background:white;border:1px solid var(--line);border-radius:10px;min-height:48px;padding-inline:14px; }
body[data-page=wall] .library-results .wall-tools__row { flex:0 1 auto;justify-content:start;gap:12px; }
.library-view-label { font-size:12px;color:var(--ink-3); }
body[data-page=wall] .library-results .wall-view { position:static;transform:none;margin:0;padding-left:12px;border-left:1px solid var(--line); }
body[data-page=wall] .library-results .wall-tagbar { margin-block:20px 24px; }
body[data-page=wall] .library-results .wall.is-grid { columns:3;column-gap:22px; }
body[data-page=wall] .library-results .wall-card { background:white;border:1px solid var(--line-soft);border-radius:14px;overflow:hidden;margin-bottom:22px; }
body[data-page=wall] .library-results .wall-card__art { display:block;border-radius:0; }
body[data-page=wall] .library-results .wall-card__body { padding:16px;display:flex;flex-direction:column;gap:9px; }
body[data-page=wall] .library-results .wall-card__title { font-size:17px;line-height:1.55;margin:0; }
body[data-page=wall] .library-results .wall-card__meta { font-size:12px;line-height:1.8; }
body[data-page=wall] .library-results .wall-card__foot { display:flex;flex-wrap:wrap;gap:10px;align-items:center;border-top:1px solid var(--line-soft);padding-top:12px;margin-top:4px; }
.library-save-board { align-self:start;order:5;background:var(--paper);border:1px solid var(--line);border-radius:7px;padding:8px 10px;font:inherit;font-size:12px;cursor:pointer;min-height:36px; }
.library-save-board:hover { background:var(--sun-wash);border-color:var(--sun); }
body[data-page=wall] .library-results .wall-card__save { width:36px;height:36px;flex:none; }
body[data-page=wall] .library-results .wall-card__price { font-size:14px; }.library-results .wall-card__price small { font-size:11px; }
body[data-page=wall] .library-results .wall.is-list { columns:auto;display:grid;grid-template-columns:1fr;gap:16px; }
body[data-page=wall] .library-results .wall.is-list .wall-card { display:grid;grid-template-columns:190px minmax(0,1fr);margin:0; }
body[data-page=wall] .library-results .wall.is-list .wall-card__art { aspect-ratio:1!important;height:100%; }
@media(min-width:1600px) { body[data-page=wall] .library-results .wall.is-grid { columns:4; } }
@media(max-width:1100px) { .library-layout { grid-template-columns:200px minmax(0,1fr);gap:20px; }body[data-page=wall] .library-results .wall.is-grid { columns:2; }.library-heading__note { display:none; }.library-view-label { display:none; } }
@media(max-width:720px) {
 body[data-page=wall] .library-heading { padding-block:28px 22px; }.library-layout { display:block;padding-top:20px; }
 .library-facets { position:static;padding:16px;margin-bottom:24px; }.library-facets__intro { margin-bottom:16px; }
 body[data-page=wall] .library-facets .wall-filters { grid-template-columns:repeat(2,minmax(0,1fr));gap:14px; }.library-board-link { margin-top:16px;padding-top:16px; }
 body[data-page=wall] .library-results .wall-tools { display:grid;grid-template-columns:1fr; }.library-results .wall-tools__row { justify-content:space-between!important; }
 body[data-page=wall] .library-results .wall.is-grid { columns:2;column-gap:12px; }
 body[data-page=wall] .library-results .wall-card { margin-bottom:14px; }.library-results .wall-card__body { padding:12px!important; }.library-results .wall-card__title { font-size:14px!important; }
 body[data-page=wall] .library-results .wall.is-list .wall-card { grid-template-columns:115px minmax(0,1fr); }
 .library-save-board { font-size:11px; }.library-results .wall-card__seller { overflow-wrap:anywhere; }
}

/* Asset management: import belongs beside the collection, not above every result. */
.studio-assets-layout { display:grid;grid-template-columns:260px minmax(0,1fr);gap:28px;padding-bottom:48px;align-items:start; }
.studio-assets-aside { position:sticky;top:calc(var(--header-h) + 20px); }
.studio-assets-aside .as-drop { display:flex;flex-direction:column;justify-content:center;gap:18px;min-height:270px;padding:24px;text-align:left;background:var(--lavender-wash);border:1px dashed var(--lavender);border-radius:14px; }
.studio-assets-content { min-width:0; }.studio-assets-content .as-tools { margin-top:0;gap:12px;padding:16px;background:white;border:1px solid var(--line);border-radius:12px; }
.studio-assets-content .as-search { flex:1 1 180px;min-width:0; }.studio-assets-content .as-filters { flex-wrap:wrap; }
.studio-assets-content .as-grid { grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:18px; }
/* The new course directory flow is separate from the legacy publishing wizard. */
body[data-page=upload] #main.cu { padding-left:244px;max-width:1600px;padding-right:36px; }
body[data-page=upload] .cu-start { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:20px; }
body[data-page=upload] .cu-start > div { grid-column:1/-1;min-width:0;padding-bottom:14px;border-bottom:1px solid var(--line); }
body[data-page=upload] .cu-start label { min-width:0; }.cu-start input,.cu-start select { width:100%; }
body[data-page=upload] .cu-tree { position:sticky;top:calc(var(--header-h) + 20px); }
body[data-page=upload] .cu-import { padding:24px;background:var(--lavender-wash);border-radius:12px; }
body[data-page=upload] .cu-head { padding-bottom:24px;border-bottom:1px solid var(--line); }
body[data-page=upload] .cu .btn--primary { background:var(--sun);border-color:var(--sun);color:var(--ink); }
body[data-page=upload] .wizard:not(.studio-publish-desk .wizard) { display:block; }
body[data-page=upload] .wizard:not(.studio-publish-desk .wizard) .wizard__steps { display:flex;flex-wrap:wrap;gap:10px;position:static;margin-bottom:24px; }
/* Operations: navigation is a stable left rail, while active task content owns the main column. */
body[data-page=admin] #main > .wrap { display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px 32px;align-items:start;padding-bottom:48px; }
body[data-page=admin] #main > .wrap > header { grid-column:1/-1; }
body[data-page=admin] .adm-tabs { grid-column:1;grid-row:2/span 20;display:flex;flex-direction:column;align-items:stretch;gap:6px;padding:14px;background:white;border:1px solid var(--line);border-radius:14px;position:sticky;top:calc(var(--header-h) + 16px); }
body[data-page=admin] .adm-tab { text-align:left;white-space:normal;padding:12px;min-height:44px;border:0;border-radius:8px; }
body[data-page=admin] .adm-tab.is-on { background:var(--sun-wash);color:var(--ink); }
body[data-page=admin] .adm-panel { grid-column:2;min-width:0;padding:24px;background:white;border:1px solid var(--line);border-radius:14px; }
body[data-page=admin] .adm-panel[hidden] { display:none; }
body[data-page=admin] .adm-toolbar { flex-wrap:wrap;gap:12px; }.adm-table-wrap { max-width:100%;overflow:auto; }
/* Long documents: keep a readable measure and a directory alongside the text. */
body[data-page=legal] #main > .wrap { display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px 48px;max-width:1200px;padding-bottom:48px;align-items:start; }
body[data-page=legal] #main > .wrap > header { grid-column:1/-1; }
body[data-page=legal] .legal-nav { display:flex;flex-direction:column;grid-column:1;grid-row:2/span 4;position:sticky;top:calc(var(--header-h) + 24px);padding:18px;background:white;border:1px solid var(--line);border-radius:12px; }
body[data-page=legal] #main > .wrap > section { grid-column:2;padding:28px!important;background:white;border:1px solid var(--line);border-radius:14px; }
body[data-page=legal] .prose { max-width:68ch;line-height:1.95; }.prose h3 { margin-top:28px; }
body[data-page=legal] .legal-foot { grid-column:2; }
/* Proof pages: action rail and the document, with print layout left intact. */
@media screen and (min-width:961px) {
 body:is([data-page=license],[data-page=certificate]) .cert-page > .wrap { display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px 40px;align-items:start; }
 body:is([data-page=license],[data-page=certificate]) .cert-page__head { grid-column:1/-1; }
 body:is([data-page=license],[data-page=certificate]) .cert-actions { grid-column:1;grid-row:2/span 3;display:flex;flex-direction:column;align-items:stretch;position:sticky;top:calc(var(--header-h) + 24px); }
 body:is([data-page=license],[data-page=certificate]) [data-cert-host],body:is([data-page=license],[data-page=certificate]) [data-license-host],body:is([data-page=license],[data-page=certificate]) .cert-missing { grid-column:2;min-width:0; }
}
body[data-page=verify] .verify-grid { grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);align-items:start;gap:24px; }
body[data-page=verify] .verify-panel { padding:28px;background:white;border:1px solid var(--line);border-radius:14px;min-width:0; }
body[data-page=verify] .verify-panel__head { padding-bottom:18px;border-bottom:1px solid var(--line);margin-bottom:18px; }
body[data-page=verify] .verify-type { padding:20px;background:var(--lavender-wash);border-radius:12px; }
body[data-page=offline] #main > .wrap { display:grid;grid-template-columns:280px minmax(0,1fr);gap:36px;align-items:start;padding-block:36px; }
body[data-page=offline] #main > .wrap > header { position:sticky;top:calc(var(--header-h) + 20px);padding-top:0; }
body[data-page=offline] .off-toolbar { padding:18px;background:white;border:1px solid var(--line);border-radius:12px;margin-bottom:24px; }
body[data-page=offline] [data-off-empty] { padding:36px;background:white;border:1px dashed var(--line-strong);border-radius:14px;line-height:1.85; }
/* The student entrance keeps the code task dominant, with supporting copy alongside it. */
body[data-page=student] .join-card { max-width:860px;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:22px 40px;padding:40px;background:white;border:1px solid var(--line);border-radius:18px; }
body[data-page=student] .join-card > .eyebrow,body[data-page=student] .join-card > h1,body[data-page=student] .join-card > .body-copy { grid-column:1;max-width:none!important; }
body[data-page=student] .join-card .code-input { grid-column:2;grid-row:2;width:100%;min-width:0; }
body[data-page=student] .join-card [data-join] { grid-column:2;grid-row:3; }
body[data-page=student] .join-card > .small,body[data-page=student] .join-card > .form-msg { grid-column:1/-1; }
body[data-page=homework] .teach-top { display:flex;flex-wrap:wrap;padding:28px;background:var(--lavender-wash);border-radius:16px;margin-bottom:24px; }
body[data-page=homework] .teach-top > div { flex:1 1 360px; }.teach-panel img { max-width:100%;height:auto; }
.oa-body .oa { max-width:720px;padding:20px;display:grid;gap:16px; }.oa-body .oa-card { background:white;border:1px solid var(--line);border-radius:12px;padding:16px; }.oa-body .oa-controls { display:flex;flex-wrap:wrap;gap:8px; }
@media(max-width:1200px) { body[data-page=upload] #main.cu { padding-left:208px; } }
@media(max-width:960px) {
 body[data-page=upload] #main.cu { padding-left:var(--gutter);padding-right:var(--gutter); }
 body[data-page=admin] #main > .wrap { display:block; }body[data-page=admin] .adm-tabs { position:static;flex-direction:row;overflow-x:auto;margin-bottom:24px; }body[data-page=admin] .adm-tab { flex:none;white-space:nowrap; }
}
@media(max-width:720px) {
 .studio-assets-layout,body[data-page=legal] #main > .wrap,body[data-page=offline] #main > .wrap,body[data-page=verify] .verify-grid { display:block; }
 .studio-assets-aside,body[data-page=legal] .legal-nav,body[data-page=offline] #main > .wrap > header { position:static; }
 .studio-assets-aside { margin-bottom:24px; }.studio-assets-aside .as-drop { min-height:170px; }
 body[data-page=legal] .legal-nav { flex-direction:row;flex-wrap:wrap;margin-bottom:24px; }body[data-page=legal] #main > .wrap > section { margin-bottom:20px;padding:20px!important; }
 body[data-page=verify] .verify-panel { padding:20px;margin-bottom:20px; }
 body[data-page=student] .join-card { display:flex;flex-direction:column;margin:24px 16px;padding:26px;gap:20px; }body[data-page=student] .join-card .code-input { font-size:30px; }
 body[data-page=upload] .cu-start { grid-template-columns:minmax(0,1fr); }.cu-start > div { grid-column:auto; }.cu-tree { position:static!important; }
 body[data-page=homework] .teach-top { padding:20px; }body[data-page=admin] .adm-panel { padding:18px; }
}
body[data-page=student] .student-app { max-width:1040px;box-shadow:none; }
body[data-page=student] .join-card { margin:48px auto;text-align:left;justify-items:stretch; }
body[data-page=student] .join-card .code-input { max-width:none; }
@media(max-width:720px) { body[data-page=student] .join-card { margin:24px 16px; }.student-app__bar { flex-wrap:wrap; } }

/* Personal teaching: a few daily actions, with detail available on demand. */
.c2c-disclosure{border:1px solid var(--line);border-radius:var(--r-card);padding:var(--s-4);margin:var(--s-4) 0;background:var(--paper-card)}
.c2c-disclosure>summary,.c2c-nav-more>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:var(--s-2);font-weight:600;list-style:none}
.c2c-disclosure>summary::before,.c2c-nav-more>summary::before{content:'+';font-weight:400;font-size:20px;color:var(--ink-3)}
.c2c-disclosure[open]>summary::before,.c2c-nav-more[open]>summary::before{content:'−'}
.c2c-disclosure[open]>summary{margin-bottom:var(--s-4)}
.c2c-disclosure>label{display:grid;gap:var(--s-2);margin-block:var(--s-3)}
.c2c-nav-more{margin-top:var(--s-5);border-top:1px solid var(--line-soft);padding:var(--s-2) 14px;color:var(--ink-3)}
.c2c-nav-more a{padding-inline:0;color:var(--ink-2)}
.c2c-intro{margin:0 0 var(--s-5);max-width:40ch}
.c2c-daily{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-4);margin-block:var(--s-5)}
.c2c-daily__item{display:grid;gap:var(--s-3);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--s-5);background:var(--paper-card)}
.c2c-daily__item:hover{border-color:var(--ink-3);background:var(--sun-wash)}
.c2c-daily__item strong{font-family:var(--font-serif);font-size:var(--t-h3);font-weight:500}
.c2c-daily__item small{color:var(--ink-3)}
.c2c-home-actions{display:flex;gap:var(--s-3);flex-wrap:wrap;margin-bottom:var(--s-7)}
.c2c-business{margin-top:var(--s-7)}
.c2c-business>.section{padding-block:var(--s-6)}
.c2c-business .wrap{width:100%;padding-inline:0}
.c2c-business .section__head{display:block}
.c2c-business .section__head-aside{margin-top:var(--s-4)}
body[data-page=workbench] .section__head-aside[hidden]{display:none!important}
.c2c-person{display:flex;align-items:center;gap:var(--s-3);width:100%;border:0;border-bottom:1px solid var(--line-soft);padding:var(--s-4) var(--s-2);text-align:left;background:transparent;border-radius:var(--r-2);color:var(--ink);cursor:pointer;font:inherit}
.c2c-person:hover,.c2c-person[aria-current=true]{background:var(--sun-wash)}
.c2c-person__avatar{display:grid;place-items:center;background:var(--paper-deep);width:40px;height:40px;border-radius:50%;flex-shrink:0;font-family:var(--font-serif)}
.c2c-person strong,.c2c-person small{display:block;overflow-wrap:anywhere}
.c2c-person small{font-size:12px;color:var(--ink-3);margin-top:var(--s-1)}
.c2c-student-snapshot{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-5);margin-top:var(--s-6);padding-top:var(--s-5);border-top:1px solid var(--line-soft)}
.c2c-student-snapshot section{min-width:0}
.c2c-student-snapshot p{overflow-wrap:anywhere}
.c2c-students>.teach-panel{min-width:0}
.c2c-family-count{font-size:14px;color:var(--ink-3);margin-block:var(--s-3);line-height:1.8}
@media(max-width:760px){.c2c-daily,.c2c-student-snapshot{grid-template-columns:1fr}.c2c-nav-more{margin:0;padding:0 var(--s-2);border-top:0;border-left:1px solid var(--line-soft);flex-shrink:0}.c2c-nav-more[open]{min-width:160px}.c2c-nav-more>summary{font-size:13px}.c2c-home-actions{margin-bottom:var(--s-5)}.c2c-business{padding:var(--s-3)}.c2c-students .teach-actions .btn{flex:1 1 auto}.c2c-business .studio-dashboard-grid{display:block}}
/* Legacy hover overlays must not hide course information or intercept touch controls. */
body:is([data-page=wall],[data-page=teacher]) .wall-card__body { position:static;inset:auto;opacity:1;transform:none;pointer-events:auto;background:white;color:var(--ink);transition:none; }
body:is([data-page=wall],[data-page=teacher]) .wall-card:hover .wall-card__body { transform:none; }
body:is([data-page=wall],[data-page=teacher]) .wall-card__title,body:is([data-page=wall],[data-page=teacher]) .wall-card__title a,body:is([data-page=wall],[data-page=teacher]) .wall-card__price,body:is([data-page=wall],[data-page=teacher]) .wall-card__price * { color:var(--ink); }
body:is([data-page=wall],[data-page=teacher]) .wall-card__meta,body:is([data-page=wall],[data-page=teacher]) .wall-card__tags { display:block;color:var(--ink-3); }
body:is([data-page=wall],[data-page=teacher]) .wall-card__foot { display:flex; }
body:is([data-page=wall],[data-page=teacher]) .wall-card__peek { pointer-events:none; }
body:is([data-page=wall],[data-page=teacher]) .wall-card__save { color:var(--ink-2);background:var(--paper); }
body[data-page=account] #boards > .wrap { display:block!important; }
body[data-page=account] #boards .section__head:not(:first-child) { margin-top:36px; }
body[data-page=teacher] .wall-card__body { padding:16px; }
body[data-page=board] #main > .wrap > header .h1 { overflow-wrap:anywhere; }
body.studio-workspace[data-page=teaching] .teach-nav{display:none}
body[data-page=schedule] .field__hint{display:none}
body[data-page=schedule] [data-temporary-label][hidden]{display:none}
.library-filter-disclosure > summary { display:none; }
@media(max-width:720px) {
 .library-filter-disclosure > summary { display:list-item;cursor:pointer;padding:14px 0;font-size:13px;line-height:1.7; }
 .library-facets__intro,.library-facets .library-board-link { display:none; }.library-facets { margin-bottom:18px; }
 .library-filter-disclosure[open] .wall-filters { padding-top:12px; }
}
body:is([data-page=account],[data-page=board]) .wall-card__title,body:is([data-page=account],[data-page=board]) .wall-card__title a { color:var(--ink); }
@media(max-width:720px) { body[data-page=wall] .library-save-board,body[data-page=wall] .library-results .wall-card__save { min-height:44px;min-width:44px; } }
@media(max-width:760px){
 .c2c-students{display:flex;flex-direction:column;gap:var(--s-4)}
 .c2c-students>div{display:contents}
 .c2c-students>div:first-child>.teach-panel:first-child{order:0;width:100%;margin:0}
 .c2c-students>div:nth-child(2)>.teach-panel{order:1;width:100%;margin:0}
 .c2c-students>div:first-child>.teach-panel:nth-child(2){order:2;width:100%;margin:0}
 .c2c-students>div:first-child>.c2c-disclosure{order:3;width:100%;margin:0}
 .c2c-person{min-height:60px;padding-block:var(--s-2)}
}

/* Task density: a grid already owns its spacing; stacked-field margins create staggered rows. */
.studio-inner .form-grid > .field + .field { margin-top:0; }
.studio-inner .section__head-aside { justify-self:start; }
.studio-inner .section__head { padding-bottom:20px;gap:20px; }
.studio-workspace .section__head .lede { margin-top:12px!important; }
.studio-schedule-heading { max-width:1440px;padding-top:28px; }
.studio-schedule-heading .section__head { display:block;margin-bottom:0; }
.studio-schedule-heading .h1 { font-size:30px;line-height:1.35; }
.studio-schedule-heading .lede { font-size:14px;line-height:1.7; }
.studio-schedule-desk { display:flex;flex-direction:column;max-width:1440px;gap:24px;padding-top:20px; }
.studio-schedule-desk > .section,.studio-schedule-editor { width:100%; }
.studio-schedule-editor > summary { display:inline-flex;align-items:center;min-height:44px;padding:10px 18px;border:1px solid var(--sun);background:var(--sun);border-radius:9px;font-size:14px;font-weight:600;cursor:pointer;list-style:none; }
.studio-schedule-editor > summary::-webkit-details-marker { display:none; }
.studio-schedule-editor > summary::before { content:'＋';font-size:18px;margin-right:8px; }
.studio-schedule-editor[open] > summary::before { content:'−'; }
.studio-schedule-editor #new { margin-top:16px;padding:24px; }
.studio-schedule-editor #new > .wrap { max-width:none; }
.studio-schedule-editor #new .section__head { display:block;border:0;padding:0;margin-bottom:20px; }
.studio-schedule-editor #new .section__head .eyebrow,.studio-schedule-editor #new .section__head-aside { display:none; }
.studio-schedule-editor #new .h2 { font-size:20px;margin:0!important; }
.studio-schedule-editor #new .lede { font-size:13px;margin-top:6px!important; }
.studio-schedule-editor #new .form-grid { max-width:100%!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 24px; }
.studio-schedule-editor #new .field { display:flex;flex-direction:column;gap:7px;margin:0; }
.studio-schedule-editor #new .input,.studio-schedule-editor #new .select { height:44px;min-height:44px;font-size:14px; }
.studio-schedule-editor #new .eyebrow { font-size:12px;letter-spacing:0; }
.studio-schedule-editor [data-temporary-label] { display:grid;gap:7px;margin-top:8px; }
.studio-schedule-editor #new .field:has([data-form-msg]:empty) { display:none; }
.studio-schedule-editor #new .field--full:last-child { padding-top:14px;border-top:1px solid var(--line); }
.studio-schedule-desk .schedule-list { padding:0 20px; }
.studio-schedule-desk .schedule-row { display:grid;grid-template-columns:64px 76px minmax(0,1fr);gap:14px;padding-block:20px;align-items:start; }
.studio-schedule-desk .schedule-row__title { font-family:var(--font-sans);font-size:17px;line-height:1.5; }
.studio-schedule-desk .schedule-row__meta { line-height:1.8;margin-top:6px; }
.studio-schedule-desk .schedule-row__end { grid-column:3;justify-content:flex-start!important;gap:8px!important;margin-top:4px; }
.studio-schedule-desk .schedule-row__end .btn { min-height:36px;padding:7px 10px;font-size:12px; }
.studio-schedule-desk .schedule-row__end .btn--solid { order:-1; }
.studio-schedule-desk .schedule-row__end .btn--ghost { border-color:transparent;background:transparent;color:var(--ink-2); }
.studio-schedule-desk .schedule-row__end .btn--ghost:hover { background:var(--paper-deep); }
@media(max-width:960px) { .studio-schedule-editor #new .form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:720px) {
 .studio-schedule-heading { padding-top:22px; }.studio-schedule-heading .h1 { font-size:26px; }
 .studio-schedule-editor #new { padding:18px; }.studio-schedule-editor #new .form-grid { grid-template-columns:1fr;gap:16px; }
 .studio-schedule-desk .schedule-list { padding:0 14px; }.studio-schedule-desk .schedule-row { grid-template-columns:60px minmax(0,1fr);gap:10px; }
 .studio-schedule-desk .schedule-row > :nth-child(3),.studio-schedule-desk .schedule-row__end { grid-column:1/-1; }
 .studio-schedule-desk .schedule-row__end .btn { min-height:44px; }
}
.studio-inner .section__head-aside[hidden] { display:none!important; }
body[data-page=schedule] #main > .c2c-disclosure { width:calc(100% - 2 * var(--gutter));max-width:1352px;margin:0 auto 32px; }

/* Course management stays in the main workflow; business records remain optional. */
.course-management-main{margin-top:24px}.course-management-main [data-wb-courses]{max-height:620px;overflow:auto}.c2c-business .studio-dashboard-grid{grid-template-columns:1fr 1fr;align-items:start}.c2c-business .studio-overview-block{grid-column:auto;grid-row:auto;min-height:0}@media(max-width:720px){.c2c-business .studio-dashboard-grid{grid-template-columns:1fr}.course-management-main [data-wb-courses]{max-height:520px}}

/* Seven primary destinations keep their labels intact on compact headers. */
@media(min-width:901px) and (max-width:1280px){.site-header .brand__suffix,.site-header .header-search{display:none}.site-header__inner{gap:12px}.site-header .nav__link{padding-inline:7px;font-size:13px}}
@media(min-width:901px) and (max-width:1080px){.site-header .brand__abbr{display:none}.site-header .nav__link{padding-inline:5px;font-size:12px}.site-header .points-chip{display:none}}

/* Public discovery and one private workspace entry. */
.course-nav{position:relative;white-space:nowrap;font-size:14px}.course-nav summary{cursor:pointer;display:flex;align-items:center;gap:7px;padding:11px 12px;min-height:44px;list-style:none}.course-nav summary::-webkit-details-marker{display:none}.course-nav[data-current] summary{box-shadow:inset 0 -3px var(--sun);font-weight:600}.course-nav__menu{position:absolute;top:100%;left:0;min-width:180px;padding:8px;background:var(--paper-card);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow-2);z-index:130}.course-nav__menu a{display:block;padding:13px 16px;border-radius:6px}.course-nav__menu a:hover,.course-nav__menu a:focus-visible,.course-nav__menu a[aria-current]{background:var(--sun-wash)}.workspace-entry{white-space:nowrap;min-height:44px}.mobile-course-group>span{display:block;padding:16px 0 4px;font-size:13px;color:var(--ink-3)}.mobile-course-group a{padding-left:18px}.course-nav:focus-within summary{outline-offset:3px}.studio-sidebar .workspace-new{background:var(--sun);font-weight:600}
@media(min-width:901px) and (max-width:1200px){.site-header .brand__suffix{display:none}.site-header .nav{gap:0}.site-header .nav__link,.course-nav summary{padding-inline:8px;font-size:13px}.site-header__inner{gap:16px}.workspace-entry{padding-inline:14px;font-size:13px}}
@media(max-width:900px){.header-actions .workspace-entry{display:none}.studio-sidebar[data-workspace-nav]{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:4px}.studio-sidebar[data-workspace-nav] a{white-space:nowrap;padding:9px 12px;min-height:44px}}