* { box-sizing: border-box; }
body { --nav-h:68px; --bg:#fff; --nav-bg:#fff; --text:#0f172a; --mute:#64748b; --border:#e2e8f0; --sheet:#f8fafc; margin:0; background:var(--bg); color:var(--text); font:16px/1.6 Inter,system-ui,Arial,sans-serif; transition:background .3s,color .3s; }
body[data-theme=dark] { color-scheme:dark; --bg:#0b0f1a; --nav-bg:#050b1f; --text:#f1f5f9; --mute:#94a3b8; --border:#1e293b; --sheet:#171c27; }
button,input,select { font:inherit; } button { cursor:pointer; } button:disabled { cursor:not-allowed; } a { color:inherit; text-decoration:none; }
[hidden] { display:none!important; }
.ms { font-family:"Material Symbols Outlined"; font-style:normal; font-weight:normal; font-size:24px; line-height:1; letter-spacing:normal; white-space:nowrap; text-transform:none; display:inline-block; vertical-align:middle; font-feature-settings:"liga"; -webkit-font-smoothing:antialiased; }
.container,.nav-container { width:100%; max-width:1200px; padding-inline:24px; margin-inline:auto; }
.sr-only,.skip:not(:focus) { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.skip:focus { position:fixed; top:5px; left:8px; z-index:150; background:white; color:#14233a; padding:8px; }
:focus-visible { outline:3px solid #71aaff; outline-offset:3px; }
.navbar { position:sticky; top:0; z-index:20; height:var(--nav-h); background:var(--nav-bg); border-bottom:1px solid var(--border); }
.nav-container { display:flex; align-items:center; gap:32px; height:100%; }
.brand { display:flex; gap:8px; align-items:center; flex-shrink:0; font-size:1.3rem; font-weight:800; letter-spacing:-.5px; }
.brand img { width:36px; height:36px; object-fit:contain; }
#site-nav { display:flex; align-items:center; }
#site-nav a { font-weight:500; font-size:.9rem; color:var(--mute); padding:8px 15px; border-radius:999px; white-space:nowrap; }
#site-nav a:hover { background:#3b82f616; color:#5298ff; }
.nav-actions { margin-left:auto; display:flex; align-items:center; }
.nav-actions button,.zoom-controls button { background:transparent; color:var(--mute); border:0; width:38px; height:38px; display:grid; place-items:center; border-radius:50%; }
.nav-actions button:hover,.zoom-controls button:hover { background:#7486a122; color:var(--text); }
.nav-actions .ms { font-size:21px; } #menu { display:none; }
.page-hero { position:relative; overflow:hidden; text-align:center; border-bottom:1px solid var(--border); background:linear-gradient(135deg,#f8faff,#f0f4ff); }
body[data-theme=dark] .page-hero { background:linear-gradient(135deg,#050b1f,#0a1128); }
.page-hero::before { content:""; position:absolute; inset:0; background:radial-gradient(ellipse at center,#3b82f615,transparent 70%); pointer-events:none; }
.page-hero-inner { position:relative; max-width:800px; margin:auto; padding:60px 24px; }
.page-hero h1 { font-size:2.8rem; line-height:1.1; font-weight:900; letter-spacing:-.04em; margin:0 0 16px; }
.page-hero h1 span { color:#4a91fa; background:linear-gradient(135deg,#3b82f6,#60a5fa); background-clip:text; -webkit-text-fill-color:transparent; }
.page-hero p { color:var(--mute); font-size:1.1rem; margin:0; }
.setup { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; margin:-2px 0 13px; }
.grades { display:flex; align-items:center; gap:5px; }
.grades button,.sample-select select { min-height:34px; padding:4px 10px; border:1px solid var(--cd-border-strong); border-radius:8px; background:var(--cd-surface-2); color:var(--cd-text-soft); font-size:.78rem; font-weight:600; }
.grades button[aria-pressed=true] { color:#2563eb; border-color:#3b82f6; background:#3b82f61c; }
body[data-theme=dark] .grades button[aria-pressed=true] { color:#90bdff; }
.sample-select select { cursor:pointer; max-width:100%; } .sample-select option { background:var(--sheet); color:var(--text); }
.period-row {display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 15px;font-size:.78rem;color:var(--cd-text-soft);}
.period-row label {font-weight:650;color:var(--cd-text);}
.period-row select {cursor:pointer;background:var(--sheet);border:1px solid var(--cd-border-strong);border-radius:8px;padding:5px 8px;font-size:.77rem;color:var(--text);}
.day-group {margin-top:10px;border:1px solid var(--cd-border);border-radius:10px;padding:0 10px;}
.day-summary {cursor:pointer;padding:9px 2px;font-size:.85rem;}
.day-summary span {margin-left:12px;color:var(--mute);font-size:.8rem;}
.day-group[open] .day-slots {padding-bottom:11px;}
.cd-container { --cd-nav-h:var(--nav-h); }
.cd-branch.invalid,.tie { border-color:#e67655; }
.tie { margin:0 0 14px; padding:14px; border:1px solid var(--cd-border-strong); background:var(--cd-surface); border-radius:12px; }
.tie h2 { margin:0 0 4px; font-size:.95rem; } .tie p { color:var(--mute); font-size:.82rem; margin:0 0 8px; }
.tie label { display:inline-flex; align-items:center; gap:6px; margin-right:14px; font-size:.84rem; } .tie input { accent-color:#377ff1; }
.proto-foot { font-size:.77rem; color:var(--mute); padding:15px 0 33px; margin:0; }
.text-btn { border:0; background:transparent; padding:0; font:inherit; cursor:pointer; }
.cd-detail-back.text-btn { font-size:.8rem; font-weight:600; }
.cd-result-ready { animation:appear .36s cubic-bezier(.22,1,.36,1) both; } .cd-benefits { list-style:none; }
.cd-benefits li .ms { font-size:16px; }
.cd-detail-hero h1:focus:not(:focus-visible) { outline:none; }
.document-box { max-width:1000px; margin:0 auto 23px; padding:8px; background:var(--cd-surface); border:1px solid var(--cd-border); border-radius:16px; box-shadow:var(--cd-shadow); }
.document-box:has(.pdf-status:only-child) { min-height:160px; }
.pdf-status { color:var(--mute); padding:12px; text-align:center; font-size:.85rem; }
.pdf-status:empty { display:none; }
.pdf-page { position:relative; width:100%; margin:0 auto; background:white; border-radius:9px; overflow:hidden; }
.pdf-page + .pdf-page { margin-top:10px; } .pdf-page canvas { display:block; width:100%; height:auto; }
.pdf-layer { position:absolute; inset:0; pointer-events:none; }
.pdf-link,.pdf-tick { position:absolute; display:block; pointer-events:auto; border:0; margin:0; }
.pdf-link { border-radius:2px; } .pdf-link:hover,.pdf-link:focus-visible { background:#ffffff19; box-shadow:inset 0 0 0 2px #83b8ff; }
.pdf-tick { padding:0; cursor:pointer; accent-color:#2069de; color-scheme:light; }
.cd-detail-actions .cd-btn { cursor:pointer; } .cd-detail-actions [aria-disabled=true] { opacity:.55; pointer-events:none; }
.inline-status { max-width:900px; margin:0 auto 12px; text-align:center; font-size:.82rem; color:var(--mute); } .inline-status:empty { display:none; }
.native-action { text-align:center; font-size:.8rem; color:var(--mute); margin:-8px auto 18px; } .native-action .ms {font-size:15px;} .native-action a:hover {color:#60a5fa;}
.detail-section { max-width:900px; margin:30px auto 0; border-top:1px solid var(--cd-border); padding-top:22px; }
.cd-pi-card { cursor:pointer; } .cd-pi-card small { font-size:.74rem; color:var(--mute); }
.cd-pi-card .camp-label { color:#3b82f6; font-size:.74rem; font-weight:650; } body[data-theme=dark] .camp-label {color:#89b9ff;}
#day-details>summary { font-size:.9rem; font-weight:650; cursor:pointer; width:fit-content; }
.day-group h3 { margin:20px 0 8px;font-size:1rem; }
.day-slots { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.day-slot { padding:13px 15px; background:var(--cd-surface); border:1px solid var(--cd-border); border-radius:12px; font-size:.84rem; }
.slot-head,.topic-link { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.slot-head { color:var(--mute); font-size:.78rem; } .slot-head input { width:16px;height:16px;accent-color:#3b82f6; }
.day-slot h4 { margin:8px 0 1px; font-size:.81rem; font-weight:650; color:var(--mute); }
.topic-link { color:#397ee6; font-weight:650; } body[data-theme=dark] .topic-link {color:#83b7ff;}
.topic-link time { white-space:nowrap; font-size:.78rem; } .day-slot p { margin:0; }
.native-fallback { display:block; width:100%; aspect-ratio:16/9; border:0; }
#zoom-dialog { box-sizing:border-box; width:min(98vw,1680px); max-width:98vw; max-height:94vh; padding:0; overflow:hidden; border:1px solid var(--border); border-radius:15px; background:var(--bg); color:var(--text); }
#zoom-dialog::backdrop { background:#020816cc; }
.zoom-head { display:flex; justify-content:space-between; align-items:center; gap:8px; padding:9px 15px; border-bottom:1px solid var(--border); }
.zoom-head strong { font-size:.95rem; } .zoom-controls { display:flex; align-items:center; gap:3px; }
.zoom-controls button { font-size:1.35rem; font-weight:600; color:var(--text); } .zoom-controls output { min-width:40px; text-align:center; font-size:.81rem; }
.zoom-scroll { max-height:calc(94vh - 65px); overflow:auto; padding:8px; } #zoom-pages { margin:auto; }
footer { border-top:1px solid var(--border); color:var(--mute); font-size:.78rem; }
footer>.container { display:flex; align-items:center; justify-content:space-between; padding-block:18px; }
@keyframes appear { from { opacity:0;transform:translateY(6px) } to { opacity:1;transform:translateY(0) } }
@media(max-width:1050px) { #site-nav a { padding-inline:8px; }.nav-container{gap:16px} }
@media(max-width:800px) {
  #site-nav { display:none; } #site-nav.open { display:grid; position:absolute; top:var(--nav-h); left:0; right:0; padding:8px 16px; background:var(--nav-bg); border-bottom:1px solid var(--border); }
  #menu {display:grid;} .page-hero-inner {padding:38px 16px;}
  .page-hero h1 {font-size:2.25rem;} .page-hero p {font-size:1rem;}
}
@media(max-width:640px) {
  .cd-branch:not(.cd-branch-muted) .cd-branch-name small {display:block;}
  body {--nav-h:60px;} .container,.nav-container {padding-inline:15px;}
  .brand {font-size:1.15rem;} .brand img {width:32px;height:32px;}
  .page-hero-inner {padding:26px 16px;} .page-hero h1{font-size:1.95rem;margin-bottom:10px;}
  .page-hero p {font-size:.9rem;} .cd-panel{min-width:0;} .cd-form,.cd-result{min-width:0;}
  .grades button,.sample-select select {min-height:40px;} .setup {gap:6px;}
  .document-box {padding:3px;border-radius:9px;} .pdf-page{border-radius:6px;}
  .cd-detail-actions {margin-bottom:24px;} .day-slots {grid-template-columns:1fr;}
  .zoom-controls button {width:34px;height:38px;} .zoom-head{padding:6px 9px;}
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation-duration:.01ms!important; animation-iteration-count:1!important; } }
.rank-panel { margin:16px 0; padding:13px 14px 8px; border:1px solid var(--cd-border); border-radius:14px; background:var(--cd-surface-2); }
.rank-panel h3,.detail-rank-title { margin:0 0 7px; font-size:.94rem; color:var(--cd-text); }
.rank-list { list-style:none; margin:0; padding:0; }
.rank-list li { display:grid; grid-template-columns:25px 1fr auto; align-items:center; gap:9px; min-height:33px; padding:3px 0; }
.rank-list li+li { border-top:1px solid var(--cd-border); }
.rank-num { display:grid; place-items:center; width:22px; height:22px; border-radius:7px; border-left:3px solid var(--cd-tone); background:var(--cd-tone-soft); color:var(--cd-text); font-size:.73rem; font-weight:750; }
.rank-name { font-size:.84rem; font-weight:600; }
.rank-score { font-size:.8rem; color:var(--cd-text); font-variant-numeric:tabular-nums; white-space:nowrap; }
.mobile-ranking { display:none; }
.detail-rank-title { margin:8px auto; font-size:.88rem; font-weight:650; color:var(--cd-text-soft); }
.paper-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; max-width:1000px; margin:0 auto 9px; }
.paper-toolbar h2 { margin:0; font-size:1.06rem; }
.paper-toolbar small { display:inline-block; margin-left:5px; padding:2px 6px; border-radius:6px; background:var(--cd-surface-2); border:1px solid var(--cd-border); color:var(--cd-text-soft); font-size:.68rem; font-weight:600; vertical-align:middle; }
.paper-actions { display:flex; gap:6px; }
.paper-actions .cd-btn { min-height:38px; width:auto; margin:0; padding:7px 12px; font-size:.84rem; cursor:pointer; }
.paper-actions .cd-btn+.cd-btn { margin-top:0; }
.paper-actions [aria-disabled=true] { pointer-events:none; opacity:.55; }
.document-box { background:var(--cd-surface-2); }
.document-box .pdf-page { max-width:calc((100vh - 120px) * var(--paper-ratio)); max-width:calc((100svh - 120px) * var(--paper-ratio)); }
.rest-slot { display:grid; place-items:center; min-height:62px; margin:0; border:1px dashed var(--cd-border-strong); border-radius:12px; background:var(--cd-surface-2); color:var(--cd-text-soft); font-size:.83rem; font-weight:650; }
@media (max-width:980px) { .mobile-ranking:not([hidden]) {display:block;} .cd-result-ready .rank-panel {display:none;} }
@media (max-width:640px) { .paper-actions .cd-btn {min-height:43px;} .paper-toolbar{margin-top:6px;} }
