/* Shared screen-only visual layer. Keep visibility, ordering, lesson states,
   embedded/fullscreen geometry, and printed learning materials in original CSS. */
@media screen {
  :root {
    --ui-ink: #233638;
    --ui-muted: #68766d;
    --ui-canvas: #f5f6f2;
    --ui-paper: #ffffff;
    --ui-line: #dfe5dc;
    --ui-forest: #203d3b;
    --ui-green: #355f52;
    --ui-sage: #e7ede2;
    --ui-orange: #bf5927;
    --ui-orange-light: #fff1e5;
    --ui-shadow: 0 4px 18px rgba(35,54,56,.045);
  }
  body[data-studio-page] {
    background: var(--ui-canvas);
    color: var(--ui-ink);
    font-family: "Segoe UI", "Microsoft YaHei", sans-serif;
  }
  body[data-studio-page] button,
  body[data-studio-page] input,
  body[data-studio-page] select,
  body[data-studio-page] textarea { font-family: inherit; }
  body[data-studio-page] :is(button,a,input,select,textarea,[tabindex]):focus-visible {
    outline: 3px solid #b97439;
    outline-offset: 3px;
  }
  body[data-studio-page] :is(button,input,select,textarea):disabled { cursor: not-allowed; }

  /* Console: keep all four roles and the existing responsive navigation. */
  [data-studio-page="console"] :is(.console,.con-main,.pc-main) { background: var(--ui-canvas); }
  [data-studio-page="console"] .con-top {
    background: var(--ui-forest); border-radius: 0 0 16px 16px; box-shadow: none;
  }
  [data-studio-page="console"] .con-top .av { background: #e7c49d; border-radius: 12px; }
  [data-studio-page="console"] .con-top .who b { font-weight: 600; }
  [data-studio-page="console"] .pc-layout { box-shadow: var(--ui-shadow); border-radius: 14px; }
  [data-studio-page="console"] .pc-side { background: var(--ui-forest); }
  [data-studio-page="console"] .pc-side-title { color: #e0e9df; font-weight: 500; }
  [data-studio-page="console"] .pc-menu .pm { font-size: 14px; line-height: 1.6; }
  [data-studio-page="console"] .pc-menu .pm.on { background: #3c5750; border-left-color: #e7bb87; font-weight: 600; }
  [data-studio-page="console"] .pc-main-title { font-size: 21px; font-weight: 650; color: var(--ui-ink); }
  [data-studio-page="console"] :is(.con-sec,.rev-card,.menu-card,.m-card,.modal,.sheet,.tbl-wrap) {
    border-color: var(--ui-line); box-shadow: none; border-radius: 12px;
  }
  [data-studio-page="console"] .pc-main .con-sec { padding: 20px; }
  [data-studio-page="console"] :is(.sec-t,.sub-t,.modal-title,.sheet-t) { color: var(--ui-ink); font-weight: 650; }
  [data-studio-page="console"] :is(.sec-sub,.sub-inline,.ftip,.fl,.fold-m,.hint,.td-empty) { color: var(--ui-muted); }
  [data-studio-page="console"] .sec-sub { line-height: 1.8; }
  [data-studio-page="console"] .ftip { line-height: 1.8; font-size: 12px; }
  [data-studio-page="console"] :is(.pc-main .row,.con-list .row) {
    background: #fafbf7; border: 1px solid #edf0e8; border-radius: 10px;
  }
  [data-studio-page="console"] .row .nm { line-height: 1.7; }
  [data-studio-page="console"] .mini { border-color: var(--ui-line); border-radius: 7px; color: var(--ui-green); }
  [data-studio-page="console"] .mini.primary { background: var(--ui-green); border-color: var(--ui-green); color: #fff; }
  [data-studio-page="console"] .mini.on { background: var(--ui-green); color: #fff; }
  [data-studio-page="console"] .mini.danger { color: var(--red); }
  [data-studio-page="console"] .mini.ok { color: #fff; }
  [data-studio-page="console"] .tab { border-radius: 8px; border-color: var(--ui-line); color: var(--ui-muted); }
  [data-studio-page="console"] .tab.on { background: var(--ui-green); border-color: var(--ui-green); color: #fff; }
  [data-studio-page="console"] :is(.con-sec,.fl,.form-grid,.row) :is(input,select,textarea) {
    background: #fff; border-color: var(--ui-line); border-radius: 7px; color: var(--ui-ink);
  }
  [data-studio-page="console"] .tbl th { background: #edf2e9; color: #4e6853; font-weight: 600; }
  [data-studio-page="console"] .tbl td { border-bottom-color: #eef0e9; }
  [data-studio-page="console"] .tbl tbody tr:hover { background: #f8faf4; }
  [data-studio-page="console"] .hint { background: #f3f6ed; border-color: var(--ui-line); }
  [data-studio-page="console"] .login-wrap { background: radial-gradient(ellipse at 80% 15%, #3d6154, transparent 55%), var(--ui-forest); }
  [data-studio-page="console"] .login-av { background: #e7c49d; border-color: #ffffff40; box-shadow: none; }
  [data-studio-page="console"] .login-sub { color: #eef2e8; font-size: 18px; font-weight: 500; }
  [data-studio-page="console"] .login-inputs { margin-top: 23px; }
  [data-studio-page="console"] .li { background: #fafbf7; border-color: #dce4d7; border-radius: 9px; }
  [data-studio-page="console"] .li:focus-within { outline: 3px solid #d8ac79; outline-offset: 2px; }
  [data-studio-page="console"] .login-btn { background: var(--ui-orange); border-radius: 9px; box-shadow: none; font-weight: 600; }
  [data-studio-page="console"] .login-tip { color: #d2ded4; }
  .teaching-studio-frame { width:100%;height:calc(100vh - 190px);min-height:620px;border:1px solid var(--ui-line);border-radius:12px;background:var(--ui-canvas); }
  .teaching-access-hint { color:var(--ui-muted);font-size:14px;line-height:1.8;margin-bottom:20px; }
  .teaching-access-control { display:flex;align-items:center;gap:12px;padding:18px;background:var(--ui-sage);border-radius:10px;font-size:16px;color:var(--ui-ink); }
  .teaching-access-control input { width:20px;height:20px;accent-color:var(--ui-green); }
  .teaching-access-state { color:var(--ui-muted);font-size:12px;margin:14px 0; }

  /* Word learning: the pedagogic colour states and responsive dimensions remain authoritative. */
  [data-studio-page="memory"] .vtest-wrap { background: var(--ui-canvas); }
  [data-studio-page="memory"] .home-wrap { background: var(--ui-sage); }
  [data-studio-page="memory"] .home-brand { color: var(--ui-ink); }
  [data-studio-page="memory"] .home-brand .hb-name { font-weight: 650; }
  [data-studio-page="memory"] .home-brand .hb-grade { background: #fff; color: var(--ui-green); border-radius: 6px; }
  [data-studio-page="memory"] .home-brand .hi { color: #586f5c; }
  [data-studio-page="memory"] .hb-swap { background: #fff; color: var(--ui-green); border-color: #cad7c4; border-radius: 7px; }
  [data-studio-page="memory"] .hb-swap-hint { color: #5d725e; }
  [data-studio-page="memory"] .home-ring-num { color: var(--ui-ink); font-weight: 600; }
  [data-studio-page="memory"] .home-ring-lb { color: #5b715c; }
  [data-studio-page="memory"] .home-prog-svg .prog-bg { stroke: #cedbc7; }
  [data-studio-page="memory"] .hstat { border: 1px solid #dce5d5; border-radius: 12px; box-shadow: none; background: #fff; }
  [data-studio-page="memory"] .hstat span { color: #697963; }
  [data-studio-page="memory"] .hstat b { font-weight: 650; }
  [data-studio-page="memory"] .hbtn { border-radius: 10px; font-weight: 600; box-shadow: none; letter-spacing: .5px; }
  [data-studio-page="memory"] .hbtn-main { background: var(--ui-orange); }
  [data-studio-page="memory"] .hbtn-orange { background: #a45634; }
  [data-studio-page="memory"] .hbtn-green { background: var(--ui-green); }
  [data-studio-page="memory"] .home-mini { background: #f9fbf5; color: var(--ui-green); border-radius: 8px; }
  [data-studio-page="memory"] .home-foot .ver { background: #f7faf2; color: #5f745d; border-radius: 8px; }
  [data-studio-page="memory"] .topbar { background: var(--ui-forest); box-shadow: none; }
  [data-studio-page="memory"] .topbar .title { font-weight: 600; }
  [data-studio-page="memory"] .topbar .side-btn { background: #f5f8f0; color: var(--ui-green); border-radius: 8px; }
  [data-studio-page="memory"] :is(.wrow,.brow,.bx-wordcard,.rp-card,.anti-item,.anti-sum,.rep-card,.box-modal) {
    box-shadow: none;
  }
  [data-studio-page="memory"] .wrow { border-radius: 12px; }
  [data-studio-page="memory"] .wrow .phon { color: #657569; }
  [data-studio-page="memory"] .wrow .mean { color: #697666; }
  [data-studio-page="memory"] :is(.lf-num,.vtest-hint,.rp-date,.rp-info-row span,.rep-empty) { color: var(--ui-muted); }
  [data-studio-page="memory"] :is(.list-foot,.vtest-foot,.rv-foot) { background: linear-gradient(transparent,var(--ui-canvas) 22%); }
  [data-studio-page="memory"] .btn-pill { border-radius: 9px; }
  [data-studio-page="memory"] .btn-pill.next { background: var(--ui-orange); box-shadow: none; }
  [data-studio-page="memory"] .btn-pill.prev:not(.dis):not(:disabled) { background: #e5edde; color: var(--ui-green); }
  [data-studio-page="memory"] .btn-speak { background: var(--ui-green); border-radius: 9px; box-shadow: none; }
  [data-studio-page="memory"] .box-wrap { background: #e7ede2; }
  [data-studio-page="memory"] .rp-banner { background: var(--ui-green); }
  [data-studio-page="memory"] .rp-card { border-color: var(--ui-line); }
  [data-studio-page="memory"] .rp-item { border-radius: 9px; }

  /* Training records: status badges retain their six existing colours. */
  [data-studio-page="training"] .tr-hero { background: var(--ui-forest); border-radius: 0 0 16px 16px; }
  [data-studio-page="training"] :is(.tr-card,.tr-card-item,.tr-entry) { box-shadow: none; border-radius: 12px; border: 1px solid var(--ui-line); }
  [data-studio-page="training"] .tr-card.blue { background: #e9eff3; color: #395c70; }
  [data-studio-page="training"] .tr-card.green { background: #e7eee0; color: #45683e; }
  [data-studio-page="training"] :is(.trci-name,.tr-sec-t,.tr-rec-title) { font-weight: 650; }
  [data-studio-page="training"] :is(.trci-k,.tr-foot,.tr-empty) { color: var(--ui-muted); }
  [data-studio-page="training"] .tr-btn { border-radius: 8px; font-weight: 600; }
  [data-studio-page="training"] .tr-btn.primary { background: var(--ui-green); box-shadow: none; }
  [data-studio-page="training"] .tr-btn.ghost { border-color: var(--ui-line); color: var(--ui-muted); }
  [data-studio-page="training"] .tr-tab { border-radius: 8px; }

  /* Printing: screen chrome only; no change to paper, columns or print media. */
  [data-studio-page="print"] .pr-bar { border: 1px solid var(--ui-line); box-shadow: none; border-radius: 12px; }
  [data-studio-page="print"] .pr-bar-t { color: var(--ui-ink); font-weight: 650; }
  [data-studio-page="print"] :is(.pr-back,.pr-btn.ghost) { background: #f2f5ec; color: var(--ui-green); border-color: var(--ui-line); }
  [data-studio-page="print"] .pr-mode { border-color: var(--ui-line); background: #f8faf5; color: #5e725d; }
  [data-studio-page="print"] .pr-mode.on { background: var(--ui-green); border-color: var(--ui-green); color: #fff; box-shadow: none; }
  [data-studio-page="print"] .pr-btn.primary { background: var(--ui-orange); }

  @media (min-width: 700px) {
    [data-studio-page="console"] .pc-main { padding: 26px; }
  }
  @media (max-width: 700px) {
    [data-studio-page="console"] .pc-main .con-sec { padding: 16px; }
  }
}

.teaching-host{display:flex;flex-direction:column;min-height:80vh;background:#f5f6f2}.teaching-host-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;gap:12px;background:white;border:1px solid #dfe5dc}.teaching-host .teaching-studio-frame{width:100%;flex:1;border:0;min-height:75vh}.teaching-host.teaching-host-full{position:fixed;inset:0;z-index:10000;height:100dvh;min-height:0}.teaching-host-full .teaching-studio-frame{min-height:0;height:0;border-radius:0}