:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ink:#49270f;--paper:#fff5e2;--olive:#53602e;--rust:#9a4829;--edge:#d7b58a;color:var(--ink);background:#f4e6d1;font-family:ui-rounded,Trebuchet MS,system-ui,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(at top,#fff4e1,#ead7bd);min-height:100vh;margin:0}button,select{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible,select:focus-visible{outline-offset:2px;outline:3px solid #2d526f}button:disabled{cursor:default}h1,h2,h3,p{margin:0}h1,h2{letter-spacing:-.03em;line-height:1.1}p,li{line-height:1.42}.shell{max-width:1240px;margin:auto;padding:0 20px 20px}.masthead{justify-content:space-between;align-items:center;gap:12px;min-height:64px;display:flex}.brand,.progress{background:0 0;border:0;align-items:center;gap:9px;min-height:44px;padding:6px 4px;font-weight:800;display:flex}.brand{letter-spacing:-.04em;text-align:left;font-size:1.23rem}.brand img{border-radius:10px;width:35px;height:35px}.masthead-right{align-items:center;gap:14px;display:flex}.xp-pill{color:#6e3b16;border:1px solid var(--edge);white-space:nowrap;background:#f7e4c6;border-radius:8px;padding:4px 10px;font-size:.84rem;font-weight:850}.progress{white-space:nowrap;color:var(--olive);font-size:.86rem}.stage{aspect-ratio:16/9;background:#ffe7ca 50%/100% 100%;border-radius:21px;position:relative;overflow:hidden;box-shadow:0 1px 1px #6d381947,0 15px 42px #6d381925;container-type:inline-size}.office{background-image:url(/assets/office.jpg)}.drawer{background-image:url(/assets/drawer.jpg)}.shelf{background-image:url(/assets/shelf.jpg)}.case{background-image:url(/assets/clue.jpg)}.book{background-image:url(/assets/book.jpg)}.hotspot,.folder,.spine{left:var(--x);top:var(--y);width:var(--w);height:var(--h);background:0 0;border:0;border-radius:12px;padding:0;position:absolute}.hotspot:focus-visible,.spine:focus-visible,.folder:focus-visible{outline-offset:1px;outline:2px solid #fff3c5}.hotspot .tip{visibility:hidden;color:#fff8e4;white-space:nowrap;letter-spacing:.01em;text-shadow:0 2px 4px #2a1407,0 0 8px #2a1407,0 -1px 2px #2a1407;pointer-events:none;background:0 0;padding:0;font-size:clamp(.82rem,2.1cqw,1.18rem);font-weight:900;position:absolute;bottom:4%;left:50%;translate:-50%}.hotspot[data-action=settings] .tip{bottom:-1.5em;left:auto;right:0;translate:0}.hotspot:is(:focus-visible,:hover) .tip{visibility:visible}.folder:hover{color:#2b1204;text-shadow:0 0 10px #fffdf5}.spine:hover{color:#fff;text-shadow:0 2px 6px #2a1407,0 0 10px #ffe8a3}.nav,.pill,.secondary,.answer,.jump select,.case-select{border:1px solid var(--edge);background:var(--paper);border-radius:10px;min-height:38px;padding:.42em .75em;font-weight:750}.nav{z-index:2;align-items:center;min-height:38px;font-size:clamp(.72rem,1.5cqw,.94rem);display:inline-flex;position:absolute;top:2.6%;left:2%}.nav:hover,.secondary:hover:not(:disabled),.answer:hover:not(:disabled),.pill:hover:not(:disabled){filter:brightness(.96)}.folder{color:#592d13;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1px;font-size:clamp(.58rem,1.95cqw,1.25rem);font-weight:850;line-height:1.05;display:flex}.folder small{color:var(--olive);font-size:.66em;font-weight:800}.folder.locked-folder{color:#8c6c4e;opacity:.68;cursor:default}.drawer-label{text-align:center;width:16%;font-size:1.85cqw;font-weight:900;position:absolute;top:4.5%;left:42%}.spine{color:#fff8db;text-shadow:0 2px 3px #452210;place-items:center;padding-top:4%;font-size:clamp(.55rem,1.75cqw,1.28rem);font-weight:850;line-height:1.12;display:grid}.spine.green{transform:rotate(-14deg)}.caption{color:#674c34;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin:14px 2px 0;font-size:.9rem;display:flex}.caption strong{color:var(--ink)}.mobile-nav{display:none}.case-card{flex-direction:column;gap:clamp(5px,1cqw,11px);padding:clamp(10px,1.8cqw,22px) clamp(12px,2.4cqw,30px);font-size:clamp(.74rem,1.45cqw,1.04rem);display:flex;position:absolute;inset:13.8% 7.2% 11.8% 27.6%;overflow:auto}.stage-meta{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.kicker{text-transform:uppercase;letter-spacing:.1em;color:#805431;font-size:.72em;font-weight:900}.stage-pill{color:#5a3418;white-space:nowrap;background:#f5e2c4;border:1px solid #d7b58a;border-radius:999px;padding:2px 9px;font-size:.74em;font-weight:800}.case-card h1{font-size:clamp(.98rem,2.35cqw,1.85rem)}.guiding-question{color:#6e4423;background:#f8e7cb;border:1px solid #dfc198;border-radius:8px;padding:.35em .65em;font-size:.84em;font-weight:700}.sentence-board{background:#fdf3e1;border:1px solid #dfbe93;border-radius:12px;padding:clamp(8px,1.3cqw,14px)}.sentence-tokens{flex-wrap:wrap;align-items:center;gap:6px 7px;display:flex}.word-token{background:#fffaf0;border:1.5px solid #d5b284;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;min-height:38px;padding:.32em .58em;font-size:1.02em;font-weight:800;line-height:1.15;transition:transform .12s,background-color .12s,border-color .12s;display:inline-flex;position:relative}.word-token:hover:not(:disabled){background:#fff3d6;border-color:#8c5828;transform:translateY(-1px)}.word-token.wrong-pick{color:#7f1d1d;background:#fee2e2;border-color:#dc2626}.word-token.selected-target{box-shadow:0 0 0 2px #53602e55}.word-tag{letter-spacing:.02em;text-transform:lowercase;margin-top:2px;font-size:.62em;font-weight:900;line-height:1}.phrase-bar{color:#5c3b1e;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;font-size:.82em;font-weight:750;display:flex}.selection-status{color:#6a4322}.role-av{color:#7f1d1d;background:#fee2e2;border-color:#c8372d}.role-hv{color:#7c2d12;background:#ffedd5;border-color:#d96b16}.role-lv{color:#4c1d95;background:#f3e8ff;border-color:#7e22ce}.role-s{color:#1e3a8a;background:#dbeafe;border-color:#2563eb}.role-do{color:#14532d;background:#dcfce7;border-color:#15803d}.role-io{color:#134e4a;background:#ccfbf1;border-color:#0d9488}.role-pn{color:#3b0764;background:#ede9fe;border-color:#6d28d9}.role-prep{color:#43230c;background:#efe2d3;border-color:#8b5a2b}.role-op{color:#064e3b;background:#d1fae5;border-color:#047857}.role-ap{color:#78350f;background:#fef3c7;border-color:#b45309}.role-adj{color:#713f12;background:#fef9c3;border-color:#ca8a04}.role-adv{color:#831843;background:#fce7f3;border-color:#db2777}.role-conj{color:#1e293b;background:#e2e8f0;border-color:#64748b}.role-clause{color:#49270f;background:#fff8eb;border:2px dashed #8d5b2d}.role-badge{border:1px solid;border-radius:5px;padding:1px 6px;font-size:.84em;font-weight:850;display:inline-block}.scene-line{background:#eed9b666;border-radius:9px;padding:.55em .75em;font-weight:720}.choices{flex-wrap:wrap;gap:7px;display:flex}.answer{overflow-wrap:break-word;text-align:left;flex:28%;font-size:.9em}.answer.wrong{color:#792b18;background:#f4d8c3;border-color:#bc694c}.answer.correct,.primary{background:var(--olive);color:#fff9e9;border-color:var(--olive)}.pill:disabled,.secondary:disabled{opacity:.48}.actions{flex-wrap:wrap;align-items:center;gap:7px;margin-top:auto;display:flex}.pip{object-fit:contain;object-position:center bottom;pointer-events:none;width:25%;max-height:47%;position:absolute;bottom:3.2%;left:1.6%}.bubble{z-index:1;border:1px solid var(--edge);background:#fff8eb;border-radius:16px;width:23.2%;max-height:36%;padding:.6em .72em;font-size:clamp(.66rem,1.38cqw,.96rem);position:absolute;top:14.5%;left:2.6%;overflow:auto;box-shadow:0 4px 12px #8a4f1e15}.bubble:after{content:"";background:inherit;border-right:1px solid var(--edge);border-bottom:1px solid var(--edge);width:11px;height:11px;position:absolute;bottom:-7px;left:58%;rotate:45deg}.feedback{color:#3d481f;font-size:.84em;font-weight:750}.breakdown-list{gap:4px;max-height:190px;margin:0;padding:0;font-size:.82em;list-style:none;display:grid;overflow:auto}.breakdown-item{background:#fdf4e3;border:1px solid #e5c9a1;border-radius:7px;flex-direction:column;gap:2px;padding:4px 7px;display:flex}.breakdown-sublist{flex-wrap:wrap;gap:4px 10px;margin:0;padding:2px 0 0 12px;font-size:.92em;list-style:none;display:flex}.stamp{color:var(--rust);letter-spacing:.08em;border:2px solid;border-radius:6px;align-self:flex-start;padding:.28em .5em;font-size:.82em;font-weight:900;transform:rotate(-3deg)}.pages{grid-template-columns:1fr 1fr;gap:7.5%;font-size:clamp(.7rem,1.4cqw,1rem);display:grid;position:absolute;inset:13.8% 17.6% 15.2%}.page{flex-direction:column;gap:clamp(5px,1cqw,12px);min-width:0;padding:2px;display:flex;overflow:auto}.page h1,.page h2{font-size:clamp(.95rem,2.6cqw,1.95rem)}.page-footer{flex-wrap:wrap;gap:6px;margin-top:auto;display:flex}.page .secondary,.page .pill{font-size:.86em}.jump{gap:4px;font-size:.9em;font-weight:700;display:grid}.jump select{width:100%;font-size:.95em}.badges{gap:3px;margin:0;padding:0;list-style:none;display:grid}.badge{border-bottom:1px solid #bd936d55;align-items:flex-start;gap:7px;padding:1px 0;font-size:.81em;line-height:1.28;display:flex}.badge strong,.badge small{display:block}.badge small{color:#67482e;font-size:.9em;line-height:1.25}.badge-mark{color:#755b3b;border:1px dashed #a47b54;border-radius:50%;flex:none;place-items:center;width:1.4em;height:1.4em;display:grid}.earned .badge-mark{background:var(--olive);border-color:var(--olive);color:#fff}.modal-screen{z-index:4;background:#3c241788;place-items:center;padding:16px;display:grid;position:absolute;inset:0}.modal{border:1px solid var(--edge);background:var(--paper);border-radius:16px;gap:12px;max-width:440px;padding:20px;display:grid}.modal img{border-radius:14px;width:72px}#toast{z-index:5;pointer-events:none;max-width:calc(100vw - 36px);position:fixed;bottom:18px;right:18px}#toast:not(:empty){color:#fff8e8;background:#465126;border-radius:10px;padding:10px 15px;font-weight:750;box-shadow:0 6px 20px #40241133}.large-text .case-card,.large-text .page{gap:clamp(4px,.8cqw,9px);font-size:clamp(.86rem,1.65cqw,1.14rem)}.large-text .case-card{padding:clamp(8px,1.4cqw,18px) clamp(10px,2cqw,24px)}.large-text .case-card h1,.large-text .page h1,.large-text .page h2{font-size:clamp(.95rem,2.2cqw,1.7rem)}@media (width<=700px){.shell{padding:0 10px 16px}.masthead{min-height:56px}.brand{font-size:1rem}.brand img{width:30px;height:30px}.xp-pill{padding:3px 7px;font-size:.75rem}.progress{font-size:.76rem}.stage{border-radius:14px}.caption{gap:6px 12px;margin-top:10px;font-size:.79rem}.nav,.pill,.secondary,.answer,.jump select,.case-select{min-height:44px;padding:.5em .8em}.case-select{width:100%;max-width:100%;font-size:.88rem}.office .hotspot[data-action=settings]{min-width:44px;min-height:44px;top:1.5%;left:auto;right:1.5%}.drawer .nav,.shelf .nav{padding:.4em .75em;font-size:.8rem;top:8px;left:8px}.case,.book{aspect-ratio:auto;background:#ffead1;flex-direction:column;gap:10px;min-height:430px;padding:10px;display:flex}.case{background-image:linear-gradient(#ffe7c5e8,#ffe7c5e8),url(/assets/clue.jpg)}.book{background-image:linear-gradient(#ffe7c5d6,#ffe7c5d6),url(/assets/book.jpg)}.case .nav,.book .nav{align-self:flex-start;font-size:.82rem;position:static}.case-card,.pages,.bubble,.pip{position:static}.case-card,.page{border:1px solid var(--edge);background:#fff5e3;border-radius:12px;gap:10px;padding:14px;font-size:.95rem;overflow:visible}.large-text .case-card,.large-text .page{gap:10px;padding:14px;font-size:1.06rem}.pages{grid-template-columns:1fr;gap:10px;display:grid}.case-card h1,.page h1,.page h2,.large-text .case-card h1,.large-text .page h1,.large-text .page h2{font-size:1.28rem}.word-token{min-height:44px;padding:.4em .68em;font-size:1rem}.breakdown-list{max-height:none;font-size:.88em}.choices{flex-wrap:wrap;gap:8px;display:flex}.case-card .answer{flex:100%;min-height:44px;line-height:1.25}.actions,.page-footer{gap:8px;margin-top:4px}.actions button,.page-footer button{flex:auto;min-height:44px}.page .secondary,.page .pill{min-height:44px;font-size:.92em}.guide{align-items:center;gap:8px;display:flex}.pip{flex:none;width:62px;max-height:none}.bubble{flex:1;width:auto;max-height:none;font-size:.88rem;line-height:1.38}.bubble:after{display:none}.folder{font-size:clamp(.5rem,2.4cqw,.9rem)}.spine{font-size:clamp(.48rem,2cqw,.9rem)}.mobile-nav{grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:8px;margin-top:10px;display:grid}.mobile-nav button{width:100%;min-height:44px;font-size:.84rem}.case-grid{grid-template-columns:1fr}.modal-screen{position:fixed}.stage:has(.modal-screen){overflow:visible}#toast{text-align:center;max-width:none;bottom:12px;left:12px;right:12px}}@media (prefers-reduced-motion:no-preference){.stage{animation:.18s ease-out appear}@keyframes appear{0%{opacity:.72}to{opacity:1}}}
