/* One persistent site header and scrolling frame for learning, teaching and admin. */
.ot-chapter-list { display:grid; gap:8px; }
.ot-chapter-item { display:flex; align-items:center; gap:16px; padding:12px 14px; border:1px solid var(--line); border-radius:10px; background:var(--card); box-shadow:none; min-width:0; }
.ot-chapter-main { display:flex; align-items:center; gap:12px; flex:1; min-width:0; color:var(--ink); text-decoration:none; }
.ot-chapter-main:hover b { text-decoration:underline; }
.ot-chapter-icon { display:grid; place-items:center; width:34px; height:38px; flex:none; border-radius:6px; background:var(--green-soft); color:var(--green-d); }
.ot-chapter-icon .ic { width:18px; height:18px; }
.ot-chapter-copy { min-width:0; }
.ot-chapter-copy b { display:block; font-size:14px; line-height:1.4; overflow-wrap:anywhere; }
.ot-chapter-copy small { display:block; margin-top:3px; font-size:11px; line-height:1.5; color:var(--muted-2); }
.ot-chapter-actions { display:flex; align-items:center; gap:8px; flex:none; }
.ot-chapter-button,.ot-chapter-menu summary { display:inline-flex; align-items:center; justify-content:center; min-height:34px; padding:7px 11px; border:1px solid var(--line); border-radius:6px; font:600 12px/1.4 inherit; color:var(--ink); background:var(--card); text-decoration:none; cursor:pointer; }
.ot-chapter-button.primary { background:var(--green-d); border-color:var(--green-d); color:#fff; }
.ot-chapter-menu { position:relative; }
.ot-chapter-menu summary { list-style:none; min-width:34px; padding:7px; }
.ot-chapter-menu summary::-webkit-details-marker { display:none; }
.ot-chapter-menu-items { position:absolute; right:0; top:calc(100% + 5px); z-index:30; width:200px; padding:5px; border:1px solid var(--line); border-radius:8px; background:var(--card); box-shadow:0 8px 24px #0002; }
.ot-chapter-menu-items button { width:100%; text-align:left; padding:10px; border:0; border-radius:4px; background:none; color:var(--ink); font-size:12px; cursor:pointer; }
.ot-chapter-menu-items button:hover { background:var(--sand); }
.ot-chapter-menu-items .is-danger { color:var(--err); }
.ot-chapter-item :is(a,summary,button):focus-visible { outline:2px solid var(--green-d); outline-offset:3px; }
.edu-delete-zone { border-top:1px solid var(--line); margin-top:24px; padding-top:16px; }
.edu-delete-zone h3 { margin:0 0 6px; }
.edu-delete-zone p { color:var(--muted-2); font-size:12px; margin:0 0 12px; }
@media(max-width:640px) { .ot-chapter-item { flex-wrap:wrap; gap:10px; } .ot-chapter-main { flex-basis:100%; } .ot-chapter-actions { width:100%; justify-content:flex-end; } }
:root { --site-header-height:68px; }
.app-shell.has-workspace .app-content { width:100%;max-width:none;padding:0;margin:0;min-height:100%; }
.app-shell.has-workspace .app-scroll { background:#f7f9f8; }
.app-shell .edu-app { min-height:calc(100dvh - var(--site-header-height));font-family:"Hanken Grotesk",system-ui,sans-serif;--green:#2e7a48;--green-d:#25663c;--ot-soft:#edf5ec;--ink:#203d29;--muted-2:#667769; }
.app-shell .edu-app h1,.app-shell .edu-app h2,.app-shell .edu-app h3 { font-family:"Bricolage Grotesque","Hanken Grotesk",system-ui,sans-serif; }

.app-shell .ot-selection {top:20px;max-height:calc(100dvh - var(--site-header-height) - 40px)}
.app-shell .ot-mobile-tabs {top:8px}
.app-shell .admin-page { min-height:calc(100dvh - var(--site-header-height));font-family:"Hanken Grotesk",system-ui,sans-serif;--a-bg:#f7f9f8;--a-green:#25663c;--a-green-bg:#edf5ec;--a-text:#203d29; }
.app-shell .adm-layout {min-height:calc(100dvh - var(--site-header-height))}
.app-shell .adm-sidebar {top:0;height:calc(100dvh - var(--site-header-height))}
body.shell-active .shell-primary-nav{min-width:0}
body.shell-active .shell-nav-link{white-space:nowrap;font-size:12px;padding-inline:9px}
body.shell-active .shell-brand{flex:none;white-space:nowrap}
body.shell-active .app-topbar{isolation:isolate}
body.shell-active .app-content>.view{animation:none}
body.shell-active .shell-auth-actions{flex:none}
body.shell-active .app-topbar .shell-nav-link:focus-visible{outline-offset:-4px}
:root[data-theme=dark] .app-shell.has-workspace .app-scroll{background:#0f141a}
:root[data-theme=dark] .app-shell .edu-app{--ink:#e2eee9;--muted-2:#9aafa6;--green:#67bd98;--green-d:#85d3b0;--ot-soft:#20362b;--card:#17231e;--edu-bg:#0f141a}
:root[data-theme=dark] .app-shell .admin-page{--a-bg:#0f141a;--a-text:#e4eae7;--a-green:#8bc5a2;--a-green-bg:#263e32}
@media(max-width:1140px){
  :root{--site-header-height:105px}
  body.shell-active .app-topbar{flex-wrap:wrap;min-height:64px;padding:0 18px;gap:0 8px}
  body.shell-active .shell-primary-nav{order:5;width:100%;height:39px;flex:none;border-top:1px solid var(--line);overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
  body.shell-active .shell-primary-nav::-webkit-scrollbar{display:none}
  body.shell-active .shell-nav-link{flex:1 0 auto;min-height:39px;justify-content:center;padding-inline:10px;font-size:12px}
  body.shell-active .shell-brand{min-height:64px;margin-right:auto}
  body.shell-active .shell-nav-link::after{left:9px;right:9px}
}

@media(max-width:700px){.app-shell .adm-sidebar{position:static;height:auto}}
@media(max-width:560px){
  body.shell-active .app-topbar{padding-inline:12px}
  body.shell-active .shell-brand{font-size:16px}
  body.shell-active .shell-primary-nav{gap:0}
  body.shell-active .shell-nav-link{flex:none;font-size:11px;padding-inline:12px}
  body.shell-active .app-top-spacer{display:none}
  body.shell-active .app-topbar .top-premium-btn{font-size:10px;padding-inline:8px}
}
@media print{.app-shell .app-topbar{display:none!important}.app-shell .adm-sidebar{display:none!important}.app-shell.has-workspace,.app-shell.has-workspace .app-main,.app-shell.has-workspace .app-scroll{height:auto;overflow:visible}}
body.auth-resolving .app-topbar .shell-auth-actions{visibility:hidden}
@media(max-width:560px){
  body.shell-active .shell-brand span:last-child{display:inline}
  body.shell-active .shell-brand{gap:8px;font-size:15px}
  body.shell-active .app-topbar .app-stat{min-width:0;font-size:11px;gap:4px}
  body.shell-active .app-topbar .shell-auth-actions{margin-left:2px}
  body.shell-active .app-topbar .top-auth-btn{font-size:10px;padding-inline:9px}
}
@media(max-width:360px){body.shell-active .app-topbar .app-streak{display:none}}