:root{--ink:#233e36;--muted:#6b7870;--cream:#f6f3eb;--paper:#fffcf5;--line:#d9ded1;--green:#365e50;--mint:#dce8da;--orange:#d97743;--soft-orange:#f4e0ce;--serif:"Noto Serif TC","Songti TC","PMingLiU",serif;--sans:"Microsoft JhengHei","PingFang TC",system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--cream);font-family:var(--sans);font-size:14px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible{outline:3px solid var(--orange);outline-offset:4px}button{color:inherit}a{color:inherit}button[hidden],[hidden]{display:none!important}.masthead{height:94px;display:flex;align-items:center;justify-content:space-between;padding:0 4%;border-bottom:1px solid var(--line);background:var(--cream);position:relative;z-index:2}.brand{display:flex;gap:12px;text-decoration:none;align-items:center;font-weight:700;letter-spacing:2px;font-size:20px}.brand small{display:block;font-size:8px;font-weight:500;letter-spacing:1.8px;margin-top:5px}.brand-mark{font-family:var(--serif);background:var(--green);color:var(--cream);font-size:25px;display:grid;place-items:center;height:44px;width:44px;border-radius:11px 11px 3px 11px}.edition{font-size:11px;letter-spacing:1px;display:flex;align-items:center;gap:9px}.edition-id{border-left:1px solid #bdc6b9;padding-left:18px;margin-left:15px;font:10px monospace}.status-dot{width:6px;height:6px;border-radius:50%;background:#688e68;display:inline-block}.head-actions{display:flex;gap:18px;align-items:center}.text-button{border:0;background:none;font-size:12px}.icon-button{width:34px;height:34px;border:1px solid #cfd6c8;background:transparent;border-radius:50%;font-size:19px}.icon-button[aria-pressed=true]{background:var(--green);color:white}
#app{max-width:1800px;margin:auto;position:relative;min-height:calc(100svh - 150px)}#scene-section{position:relative;height:calc(100svh - 150px);min-height:660px;background:radial-gradient(ellipse at 55% 42%,#eaf0e0 0%,#e1e6d9 60%,#dfe5d8 100%);overflow:hidden}#scene{position:absolute;inset:0}#scene canvas{display:block;width:100%;height:100%;touch-action:pan-y;cursor:grab}#scene canvas:active{cursor:grabbing}.loading{position:absolute;left:50%;top:40%;transform:translateX(-50%);padding:24px;background:var(--paper);border-radius:15px;text-align:center;z-index:3;line-height:2}.loading span{display:block;font-size:12px;color:var(--muted)}.scene-top{position:absolute;top:25px;left:29px;right:29px;display:flex;gap:18px;align-items:center;font-size:11px;pointer-events:none}.scene-label{display:flex;gap:7px;align-items:center;padding:8px 11px;border:1px solid #bdcaba;border-radius:4px;background:#f8faf050;letter-spacing:1px}#scene-caption{color:#6e806b}.scene-controls{position:absolute;bottom:24px;left:30px;display:flex;align-items:center;gap:6px}.scene-controls button{background:#f7f9efbb;border:1px solid #c9d2be;border-radius:50%;width:34px;height:34px;font-size:20px}.scene-controls span{font-size:10px;color:#62735e;margin-left:8px}.scene-corner{position:absolute;right:30px;bottom:28px;font:10px monospace;color:#73816c;text-align:right;line-height:1.8;letter-spacing:1px}.scene-corner span{font-family:var(--sans);font-size:10px;letter-spacing:0}.intro{position:absolute;top:0;bottom:0;left:0;width:43%;padding:65px 0 45px 5%;background:linear-gradient(90deg,var(--cream) 70%,#f6f3ebdd 84%,#f6f3eb00);z-index:1;pointer-events:none}.intro>*{pointer-events:auto}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--muted)}h1{font-family:var(--serif);font-weight:700;font-size:clamp(34px,3.35vw,58px);line-height:1.5;margin:26px 0 19px;letter-spacing:1px}.underline{position:relative;white-space:nowrap}.underline:after{content:"";position:absolute;height:5px;bottom:0;left:0;right:0;background:var(--orange);opacity:.6;transform:rotate(-1deg);border-radius:100%}.lead{font-size:15px;line-height:2;color:var(--muted)}.paper{background:var(--paper);border:1px solid #dedbd1;box-shadow:4px 5px 0 #d9d5c75c;position:relative}.intro-paper{padding:23px 24px 29px;max-width:342px;margin:27px 0 30px;transform:rotate(-2deg)}.intro-paper:before{content:"";position:absolute;top:-9px;left:40%;height:20px;width:65px;background:#ccdac9a0;transform:rotate(4deg)}.paper-label{font-size:10px;letter-spacing:1px;color:#8b9185}.intro-paper p{font-family:var(--serif);font-size:22px;margin:16px 0 11px}.pencil-note{font-size:11px;color:var(--orange)}.primary{border:0;background:var(--green);color:#fffdf4;padding:15px 21px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-radius:5px;min-height:50px;font-weight:600;letter-spacing:.5px;transition:background .2s,transform .2s}.primary:hover{background:#264c3e;transform:translateY(-1px)}.primary span{font-size:20px;font-weight:400}.primary:disabled{background:#d7ded0;color:#647360;transform:none;font-size:12px}.start-button{width:285px}.intro-meta{display:flex;gap:12px;font-size:10px;color:#82877d;margin-top:18px}.intro-meta span+span:before{content:"·";margin-right:12px}#app[data-phase=intro] #scene-section{margin-left:30%;width:70%}#app[data-phase=intro] .scene-top{left:auto}#app[data-phase=intro] .scene-controls{left:22%}
#app[data-phase=explore],#app[data-phase=repair]{padding:24px 4% 0;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:20px;background:var(--cream)}#app[data-phase=explore] #scene-section,#app[data-phase=repair] #scene-section{height:calc(100svh - 292px);min-height:490px;border-radius:10px;border:1px solid #d5dece}#app[data-phase=explore] .scene-corner,#app[data-phase=repair] .scene-corner{display:none}.case-panel{padding:12px 0 0 8px}.panel-kicker{font-size:10px;letter-spacing:1px;display:flex;justify-content:space-between;align-items:center;color:var(--muted)}.small-tag{padding:5px 8px;background:#e8e8df;border-radius:4px;font-size:9px}.case-panel h2{font-family:var(--serif);font-size:30px;line-height:1.55;margin:24px 0 14px}.case-panel>p{font-size:13px;line-height:1.95;color:var(--muted)}.target-role{padding:17px 0;margin:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:auto 1fr;gap:9px 20px;align-items:center}.target-role>span{font-size:11px;color:var(--muted)}.target-role strong{font-size:14px}.target-role small{grid-column:1/-1;font-size:10px;color:var(--muted)}.tony-note{display:flex;gap:12px;align-items:flex-start}.tony-avatar{flex:0 0 35px;height:35px;background:var(--soft-orange);border:1px solid #dcb69a;border-radius:50%;display:grid;place-items:center;color:#8f502f;font-family:var(--serif);font-size:17px}.tony-note span{font-size:10px;color:#9b623d;letter-spacing:1px}.tony-note p{font-size:12px;line-height:1.9;margin:7px 0 0}.discovered{min-height:43px;display:flex;flex-wrap:wrap;gap:5px;margin:18px 0 12px;align-items:center}.discovered span{padding:5px 8px;background:#e3eadc;border-radius:3px;font-size:10px}.case-panel>.primary{width:100%}.inventory{grid-column:1/-1;display:flex;gap:25px;align-items:center;border-top:1px solid var(--line);padding:16px 0 22px}.inventory-heading{min-width:126px;display:flex;flex-direction:column;gap:9px}.inventory-heading strong{font-size:12px;font-weight:400}.inventory-items{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;flex:1}.inventory-item{border:1px dashed #c7cfbf;background:transparent;border-radius:5px;padding:13px 15px;text-align:left;font-size:12px;display:flex;gap:12px;align-items:center;color:#7d8a74}.inventory-item .num{font:12px monospace;opacity:.6}.inventory-item small{display:block;font-size:10px;margin-top:5px}.inventory-item.found{border-style:solid;border-color:#a9bd9f;background:#e9efdf;color:#3d5d39}.inventory-item:hover{background:#e0e9d9}.hotspot{position:absolute;transform:translate(-50%,-100%);display:flex;align-items:center;gap:7px;white-space:nowrap;border:1px solid #e0cead;border-radius:25px;background:#fffaf0ed;padding:8px 11px 8px 7px;font-size:11px;box-shadow:0 5px 20px #46554015;transition:background .2s,opacity .2s;z-index:2}.hotspot:after{content:"";position:absolute;top:100%;left:50%;height:17px;width:1px;background:#9ca785}.hotspot b{display:grid;place-items:center;background:#d57d46;color:white;border-radius:50%;width:23px;height:23px;font-size:10px;font-weight:500}.hotspot.complete{background:#e9f2de;border-color:#b0c99c}.hotspot.complete b{background:#517249}.hotspot:hover{background:white;box-shadow:0 7px 25px #46554030}.hotspot:disabled{opacity:.45}
.page-footer{display:flex;justify-content:space-between;align-items:center;padding:19px 4%;border-top:1px solid var(--line);font-size:10px;color:#7d8578;gap:15px}.footer-x{margin:0 9px;color:#afac9e}.prototype-tag{font:9px monospace;letter-spacing:1px}
dialog{padding:0;border:1px solid #d5d8cb;border-radius:14px;background:var(--paper);color:var(--ink);width:min(650px,94vw);max-height:89svh;box-shadow:0 30px 100px #142c3550}dialog::backdrop{background:#1c342e6b;backdrop-filter:blur(5px)}.dialog-inner{padding:32px;position:relative}.close{position:absolute;right:16px;top:15px;width:31px;height:31px;border:1px solid var(--line);background:transparent;border-radius:50%;font-size:23px;line-height:1}.dialog-eyebrow{font:10px monospace;color:var(--orange);letter-spacing:1.8px;margin-bottom:13px}.dialog-inner h2{font-family:var(--serif);font-size:29px;line-height:1.4;margin:0 35px 12px 0}.dialog-inner p{line-height:1.9;font-size:13px;color:var(--muted)}.dialog-inner .primary{margin-top:20px;width:100%}.narrative{padding:16px 18px;background:#eaf0e2;border-left:3px solid #8ca57d;border-radius:2px;line-height:1.9;font-size:13px;margin:20px 0}.narrative small{display:block;font-size:10px;color:#718763;margin-bottom:7px}.clue-label{font-size:10px;color:#7d8a70}.clue-preview{padding:20px;border:1px solid #dfddce;background:#f6f1e7;border-radius:8px;margin:20px 0}.clue-preview strong{font-family:var(--serif);font-size:23px}.clue-preview span{display:block;margin-top:10px;color:#8c846f;font-size:11px}.choice-grid{display:grid;gap:9px;margin:18px 0}.choice{border:1px solid #d9dfd1;background:#fffefa;padding:14px 16px;text-align:left;border-radius:6px;line-height:1.65;transition:background .15s,border .15s}.choice:hover{background:#edf3e5;border-color:#95ad87}.choice.selected{background:#e0ead6;border-color:#739265}.choice.correct{background:#e5efd8;border-color:#90ad7b}.choice.wrong{border-color:#ce885e;background:#f9eee1}.choice small{display:block;font-size:11px;color:var(--muted);margin-top:5px}.inline-feedback{min-height:24px;color:#90613c;font-size:12px;line-height:1.8;margin-top:10px}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}.contact-grid .choice{min-height:59px}.contact-grid .choice:disabled{opacity:.58}.contact-grid .choice.matched{border-color:#88a679;color:#5a7550}.column-label{font-size:10px;color:var(--muted);margin-bottom:7px}.order-track{display:flex;gap:6px;margin:20px 0 10px}.order-slot{flex:1;padding:14px 4px;text-align:center;border:1px dashed #becbb2;font-size:11px;border-radius:5px;background:#eef2e7;min-height:52px;display:grid;place-items:center}.order-track .filled{background:#e1ead6;border-style:solid}.order-pool{display:flex;flex-wrap:wrap;gap:8px}.order-pool .choice{font-size:12px;padding:10px 13px}.small-action{font-size:11px;text-decoration:underline;background:none;border:0;padding:8px 0}.archive-tabs{display:flex;gap:8px;margin-top:18px}.archive-tabs button{flex:1;border:1px solid #d3d6c8;background:#efeee4;border-radius:4px;padding:10px;font-size:12px}.archive-tabs button.active{background:#dce8d1;border-color:#89a577}.archive-document{min-height:165px;padding:20px 24px;margin:10px 0 18px;background:#f3efdf;border:1px solid #dfd8c6;position:relative}.archive-document h3{font-family:var(--serif);font-size:18px;margin:0 0 12px}.stamp{display:inline-block;border:1px solid #789471;color:#67845f;padding:3px 8px;font-size:11px;transform:rotate(-5deg);margin-top:8px}.success-badge{display:inline-grid;place-items:center;width:45px;height:45px;border:1px solid #93b177;background:#e6efd9;border-radius:50%;font-size:22px;color:#5b7f47;margin-bottom:17px}.evidence-result{padding:20px;background:#edf2e5;border:1px solid #cad7bb;border-radius:6px}.evidence-result h3{font-size:17px;margin:0 0 9px}.evidence-result p{margin:0}.boundary{font-size:11px!important;color:#837c69!important;border-top:1px solid var(--line);padding-top:12px;margin-top:17px!important}.selectable-cards{display:grid;grid-template-columns:1fr 1fr;gap:9px}.selectable-cards button{font-size:12px}.counter{font:11px monospace;color:#698259;float:right}.comparison{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:18px 0}.comparison>div{padding:22px;border:1px solid var(--line);background:#f3f0e6;border-radius:5px}.comparison .after{background:#e7efdd;border-color:#b9c9a9}.comparison small{font:10px monospace;color:#7d8a70;letter-spacing:1px}.comparison h3{font-family:var(--serif);font-size:19px;line-height:1.6}.comparison p{font-size:12px}.ending{padding:45px 5% 40px}.ending h2{font-family:var(--serif);font-size:38px;line-height:1.55;margin:15px 0}.ending>.eyebrow{color:var(--orange)}#app[data-phase=ending]{display:grid;grid-template-columns:46% 54%;padding:0}#app[data-phase=ending] #scene-section{height:100%;min-height:830px}#app[data-phase=ending] .scene-corner{display:none}#app[data-phase=ending] #scene-caption{display:none}.ending-lead{font-size:14px;line-height:1.9;color:var(--muted)}.ending .comparison>div{padding:16px}.ending .comparison h3{font-size:17px}.reflection{margin:23px 0;padding:18px 20px;background:#edeadf;border-radius:5px}.reflection label{font-size:13px;display:block;margin-bottom:12px}.reflection-options{display:flex;gap:7px;flex-wrap:wrap}.reflection-options button{padding:8px 11px;border:1px solid #ced2c3;border-radius:4px;background:#f9f7ef;font-size:11px}.reflection-options button.selected{background:var(--green);color:white;border-color:var(--green)}#reflection-result{font-size:12px;line-height:1.9;margin:13px 0 0;color:#5b6d56}.service-card{border-top:1px solid #cbd4c1;margin-top:24px;padding-top:20px}.service-card h3{font-family:var(--serif);font-size:21px;margin:0 0 12px}.service-card p{font-size:12px;color:var(--muted);line-height:1.9}.service-card .primary{text-decoration:none;font-size:13px}.ending-actions{display:flex;gap:20px;margin-top:17px}.ending-actions button{border:0;background:transparent;font-size:11px;padding:6px 0;border-bottom:1px solid #b5beaa}.source-note{font-size:10px;color:#87917f;line-height:1.8;margin-top:20px}.about-copy h3{font-size:15px;margin-top:24px}.about-copy ul{padding-left:20px;line-height:1.9;font-size:12px;color:var(--muted)}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);padding:12px 20px;max-width:90vw;background:#294638;color:white;border-radius:6px;box-shadow:0 5px 30px #0002;z-index:10;opacity:0;transition:.25s;pointer-events:none;font-size:12px}#toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:1550px){.intro{padding-top:85px}.case-panel{padding:25px 0 0 10px}.case-panel h2{font-size:35px}.case-panel>p{font-size:14px}}
@media(max-width:1100px){.edition{display:none}.intro{width:48%;padding-left:4%;padding-top:47px}h1{font-size:36px}.intro-paper{max-width:300px}.intro-paper p{font-size:20px}#app[data-phase=explore],#app[data-phase=repair]{grid-template-columns:minmax(0,1fr) 275px;gap:16px;padding:18px 3% 0}.case-panel h2{font-size:25px;margin-top:18px}.case-panel>p{font-size:12px}.target-role{margin:15px 0}.case-panel{padding:6px 0}.scene-top{left:18px;right:18px;gap:9px}#scene-caption{font-size:9px}.scene-controls span{display:none}.inventory{gap:15px}.inventory-item{padding:12px 8px;gap:7px}.inventory-heading{min-width:100px}.scene-corner{right:16px}.ending{padding:32px 6%}.ending h2{font-size:29px}.comparison{grid-template-columns:1fr}.comparison>div{padding:14px}.comparison h3{margin:10px 0}.ending .comparison p{margin:5px 0}}
@media(max-width:760px){.masthead{height:74px;padding:0 5%}.brand{font-size:17px}.brand-mark{width:36px;height:36px;font-size:22px}.brand small{font-size:6px}.head-actions{gap:10px}.text-button{font-size:10px}.icon-button{width:30px;height:30px}.page-footer{padding:18px 5%;font-size:9px;flex-wrap:wrap}.page-footer>span:nth-child(2){display:none}.intro{position:relative;width:auto;padding:32px 6% 30px;background:var(--cream)}#app[data-phase=intro]{display:flex;flex-direction:column}#app[data-phase=intro] #scene-section{order:2;margin:0;width:100%;height:370px;min-height:370px}#app[data-phase=intro] .scene-top{left:20px;right:auto}#app[data-phase=intro] .scene-controls{left:20px}.eyebrow{font-size:9px;letter-spacing:1px}h1{font-size:36px;line-height:1.45;margin:18px 0 12px}.lead{font-size:13px;line-height:1.85}.intro-paper{position:absolute;right:6%;top:195px;width:43%;padding:16px 13px;transform:rotate(3deg);margin:0}.intro-paper p{font-size:15px;line-height:1.7;margin:9px 0}.paper-label{font-size:8px}.pencil-note{font-size:9px}.start-button{width:43%;font-size:12px;margin-top:23px;padding:13px 15px}.intro-meta{font-size:8px;gap:7px;margin-top:19px}.intro-meta span+span:before{margin-right:7px}#app[data-phase=explore],#app[data-phase=repair]{display:flex;flex-direction:column;gap:0;padding:14px 4% 0}#app[data-phase=explore] #scene-section,#app[data-phase=repair] #scene-section{height:390px;min-height:390px;order:1}.scene-top{top:14px;left:13px;right:13px}.scene-label{font-size:9px;padding:6px 8px}#scene-caption{display:none}.scene-controls{bottom:15px;left:14px}.scene-controls button{width:30px;height:30px}.case-panel{order:0;padding:0 2px 14px;display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.panel-kicker{grid-column:1/-1;font-size:9px}.case-panel h2{font-size:23px;margin:11px 0 7px}.case-panel h2 br{display:none}.case-panel>p{grid-column:1/-1;grid-row:3;margin:0;font-size:12px;line-height:1.75}.target-role{margin:10px 0 0;display:block;padding:0;border:0;text-align:right}.target-role span{display:block;font-size:9px}.target-role strong{font-size:13px;display:block;margin-top:7px}.target-role small{display:none}.tony-note{grid-column:1/-1;grid-row:4;margin:13px 0 0;gap:9px;align-items:center}.tony-avatar{flex-basis:28px;height:28px;font-size:14px}.tony-note span{font-size:9px}.tony-note p{font-size:11px;margin:3px 0}.discovered{display:none}.case-panel>.primary{grid-column:1/-1;margin-top:12px;min-height:40px;padding:10px 14px;font-size:11px}.inventory{order:2;display:block;margin-top:16px;padding:12px 0 18px}.inventory-heading{flex-direction:row;justify-content:space-between;margin-bottom:12px}.inventory-items{gap:6px}.inventory-item{padding:10px 7px;font-size:10px;gap:6px;min-height:64px}.inventory-item small{font-size:8px;line-height:1.4}.inventory-item .num{font-size:10px}.hotspot{font-size:10px;padding:6px 9px 6px 5px;gap:5px}.hotspot b{width:20px;height:20px;font-size:9px}.dialog-inner{padding:26px 21px}.dialog-inner h2{font-size:24px}.dialog-inner p{font-size:12px}.narrative{font-size:12px}.choice{font-size:12px;padding:12px}.contact-grid{gap:8px}.contact-grid .choice{font-size:11px;padding:9px}.selectable-cards{grid-template-columns:1fr}.comparison{gap:9px}.order-slot{font-size:10px;min-height:47px}.ending h2{font-size:29px}#app[data-phase=ending]{display:flex;flex-direction:column}#app[data-phase=ending] #scene-section{height:330px;min-height:330px;order:1}#app[data-phase=ending] .ending{order:0;padding:30px 6%}.ending .comparison{grid-template-columns:1fr 1fr;gap:8px}.ending .comparison>div{padding:12px}.ending .comparison h3{font-size:15px}.ending .comparison p{font-size:11px}.ending-lead{font-size:13px}}
@media(max-width:380px){h1{font-size:31px}.intro-paper{top:190px;width:45%;right:4%}.intro-meta{font-size:7px}.intro{padding-left:5%;padding-right:5%}.brand small{letter-spacing:1px}.head-actions{gap:4px}.intro-paper p{font-size:14px}.ending .comparison{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.case-panel>p{font-size:14px}.tony-note p{font-size:13px}.dialog-inner p{font-size:14px}.choice{font-size:14px}.inline-feedback{font-size:13px}.ending .comparison p{font-size:13px}.service-card p{font-size:13px}
@media(max-width:760px){.intro-paper{position:relative;top:auto;right:auto;width:100%;max-width:none;margin:20px 0;padding:15px 19px;transform:rotate(-1deg)}.intro-paper p{font-size:19px;margin:10px 0}.paper-label{font-size:10px}.pencil-note{font-size:11px}.start-button{width:100%;margin-top:0}.intro-meta{font-size:9px;justify-content:center}.case-panel>p{font-size:12px}.tony-note p{font-size:12px}.dialog-inner p{font-size:13px}.choice{font-size:13px}.inline-feedback{font-size:12px}.ending .comparison p{font-size:12px}.service-card p{font-size:12px}.scene-corner{display:none}}

/* Case 01 revision: the unfolding resume and decisions lead the experience. */
#app[data-phase=intro]{display:grid;grid-template-columns:47% 53%;min-height:760px}
#app[data-phase=intro] .intro{position:relative;grid-column:1;grid-row:1;width:auto;padding:44px 9%;background:var(--cream)}
#app[data-phase=intro] #scene-section{grid-column:2;grid-row:1;margin:0;width:100%;height:100%;min-height:760px}
#app[data-phase=intro] .scene-controls{left:24px}
#app[data-phase=intro] .scene-top{left:24px}
h1{font-size:clamp(30px,2.7vw,48px);line-height:1.5;margin:19px 0 14px}
.intro-paper{margin:22px 0 25px;max-width:none;padding:18px 22px}
.start-button{width:100%}.intro-meta{line-height:1.8;font-size:10px;flex-wrap:wrap;margin-top:12px;gap:6px}
.lens-picker{border:0;padding:0;margin:25px 0 0;min-width:0}
.lens-picker legend{font-size:12px;margin-bottom:10px;padding:0}.lens-picker legend small{font-size:10px;color:var(--muted);margin-left:10px}
#lens-options,#dialog-lenses{display:flex;flex-wrap:wrap;gap:7px}
.lens-picker button{border:1px solid var(--line);background:var(--paper);border-radius:5px;padding:10px 12px;font-size:11px;min-height:42px}
button[aria-pressed=true]{background:var(--green)!important;color:var(--paper)!important;border-color:var(--green)!important}
.time-detail{font-size:11px;color:var(--muted);margin-top:17px;line-height:1.8}.time-detail summary{cursor:pointer;padding:5px 0}.time-detail p{max-width:360px}
.save-status{padding:12px 5%;font-size:11px;color:var(--muted);border-top:1px solid var(--line);line-height:1.6}
#app[data-phase=explore]{grid-template-columns:minmax(0,1fr) 350px;gap:18px;padding-top:0}
.inventory{grid-row:1;position:sticky;top:0;z-index:4;background:var(--cream);margin:0;padding:12px 0;border-top:0;border-bottom:1px solid var(--line)}
#app[data-phase=explore] #scene-section{grid-row:2;height:680px;min-height:550px}
.case-panel{grid-row:2;padding:0 0 20px}.case-panel h2{margin-top:15px;font-size:28px}.target-role{margin:12px 0}
.live-resume{border:1px solid #d8d5c7;background:var(--paper);padding:17px;box-shadow:3px 4px 0 #dedacf55}
.live-resume del{display:block;font-size:12px;color:var(--muted);margin-top:12px}
.live-resume p{font-size:15px;line-height:1.9;margin:9px 0 0;color:var(--green)}
.case-panel #change-lens{margin:10px 0;min-height:35px}.discovered{margin:10px 0;min-height:25px}
.station-nav{position:sticky;top:-28px;background:var(--paper);padding:0 32px 14px 0;margin:0 0 20px;display:flex;gap:6px;z-index:3;border-bottom:1px solid var(--line)}
.station-nav button{flex:1;padding:10px 5px;border:1px solid var(--line);background:#edf1e7;border-radius:5px;font-size:11px;min-height:42px;white-space:nowrap}
.close{z-index:4}.dialog-inner{padding:28px}.dialog-inner h2{font-size:27px}.dialog-inner .tony-note{margin-top:20px}
.desk-memory{display:flex;align-items:center;gap:20px;padding:20px;background:#eaf0e2;border-radius:8px;margin:20px 0}
.telephone-symbol{font-size:48px;color:var(--green)}.desk-memory small{font-size:10px;color:var(--muted)}.desk-memory p{margin:8px 0 0}
.lens-note{font-size:12px!important;border-top:1px dashed var(--line);padding-top:13px;margin-top:18px;color:#61735a!important}
.mini-comparison{display:grid;gap:10px;margin:20px 0}.mini-comparison>div{border:1px solid var(--line);padding:15px 18px;background:#f1eee6;border-radius:5px}
.mini-comparison small{font-size:11px;color:var(--muted)}.mini-comparison p{margin:7px 0 0}.mini-comparison .after{background:#e6efdc;border:1px solid #a9bc99}
.mini-comparison .after p{font-size:18px;font-family:var(--serif);color:var(--ink)}
.flow-evidence{display:flex;align-items:center;gap:6px;margin:23px 0 8px}.flow-evidence span{padding:18px 8px;background:#e6edda;border:1px solid #c6d4b7;border-radius:6px;flex:1;font-size:12px;text-align:center}
.flow-evidence b{font-weight:400;color:var(--orange)}.source-caption{font-size:10px!important}
.archive-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.archive-sketch{margin:0;background:#e9edde;padding:16px;border:1px solid #d0d8c4}
.sketch-stage{text-align:center;font-size:40px;color:#6a8163;border-bottom:1px solid #b8c7a9;padding-bottom:12px}.sketch-stage div{font-size:17px;line-height:1.8;transform:perspective(200px) rotateX(20deg)}
.archive-sketch figcaption{font-size:11px;line-height:1.7;margin-top:12px;color:var(--muted)}.archive-pair .archive-document{margin:0;padding:16px}.archive-document p{font-size:13px}
#app[data-phase=ending]{grid-template-columns:29% 71%}#app[data-phase=ending] #scene-section{position:sticky;top:0;min-height:0;height:100svh}
.ending{padding:42px 6%;max-width:1160px}.ending h2{font-size:38px}.ending .result-hero{grid-template-columns:.85fr 1.15fr;gap:16px;margin:28px 0 22px}
.ending .result-hero>div{padding:25px 23px}.ending .result-hero h3{font-size:25px;line-height:1.6}.ending .result-hero p{font-size:15px;line-height:1.9}
.ending .result-hero .after{border-top:4px solid var(--green);box-shadow:5px 6px 0 #cfdabd66}.reading-note{border-top:1px solid #bac8ac;padding-top:15px;font-size:12px!important;color:#5b7053}
.transfer-note{font-size:12px;line-height:1.9;margin:20px 0;color:var(--muted)}.reflection{margin-top:26px}.reflection h3{font-size:16px;margin:0 0 15px}.reflection>p{font-size:12px;line-height:1.8}
.reflection-options button{min-height:42px;font-size:12px}.personal-card{background:var(--paper);padding:30px;border:1px solid #cbd4c1;border-top:5px solid var(--green);box-shadow:5px 7px 0 #dedccf77}
.card-header{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px;color:var(--muted)}.personal-card h3{font-family:var(--serif);font-size:30px;margin:22px 0 8px}
.personal-card p{line-height:1.9;font-size:14px}.personal-card small{color:#9c623c;display:block;margin-top:20px}.personal-question{font-size:19px!important}.card-basis,.card-footnote{font-size:11px!important;color:var(--muted)}
.ending-actions{flex-wrap:wrap;gap:15px}.ending-actions button{min-height:44px;font-size:12px}.service-card{margin-top:35px}.service-card h3{font-size:21px}.service-card .primary{max-width:450px}
.scene-unavailable .scene-controls,.scene-unavailable #hotspots{display:none!important}
@media(max-width:1100px){#app[data-phase=intro]{grid-template-columns:52% 48%}#app[data-phase=intro] .intro{padding:35px 7%}h1{font-size:34px}#app[data-phase=ending]{grid-template-columns:23% 77%}.ending .result-hero h3{font-size:21px}}
@media(max-width:760px){
  #app[data-phase=intro]{display:flex;min-height:0}#app[data-phase=intro] .intro{padding:28px 6%}#app[data-phase=intro] #scene-section{height:360px;min-height:360px}
  h1{font-size:32px}.lead{font-size:13px}.intro-paper{margin:18px 0 21px;padding:14px 18px}.intro-meta{justify-content:flex-start;font-size:10px}.intro-meta span+span:before{margin-right:5px}
  .lens-picker{margin-top:19px}.lens-picker button{font-size:11px}.time-detail{margin-top:10px}
  #app[data-phase=explore]{display:flex;padding:0 4%;gap:0}.inventory{order:0;top:0;padding:9px 0;margin:0}.inventory-heading{margin-bottom:8px}.inventory-item{min-height:52px;padding:9px 7px;font-size:11px}.inventory-item small{font-size:9px}
  .case-panel{display:block;order:1;padding:18px 0}.case-panel h2{font-size:25px;margin:12px 0 8px}.case-panel h2 br{display:none}.target-role{display:flex;text-align:left;gap:10px;margin:12px 0}.target-role span,.target-role strong{display:inline;font-size:12px;margin:0}
  .live-resume{padding:13px 15px}.live-resume p{font-size:14px}.case-panel #change-lens{margin:7px 0}.case-panel .tony-note{margin-top:5px}.case-panel>.primary{margin-top:14px;font-size:12px;min-height:44px}
  #app[data-phase=explore] #scene-section{order:2;min-height:350px;height:350px;margin-bottom:18px}.scene-controls span{display:block;font-size:9px;margin-left:3px}
  .dialog-inner{padding:22px 18px}.dialog-inner h2{font-size:24px}.station-nav{top:-22px;padding-right:30px;margin-bottom:17px;gap:4px}.station-nav button{font-size:10px;min-height:40px}.close{right:10px;top:26px;width:27px;height:27px}
  .flow-evidence{gap:3px}.flow-evidence span{font-size:11px;padding:15px 4px}.archive-pair{gap:8px}.archive-sketch,.archive-pair .archive-document{padding:12px}.archive-document h3{font-size:16px}.archive-document p{font-size:12px}.sketch-stage{font-size:30px}.archive-sketch figcaption{font-size:10px}
  .mini-comparison .after p{font-size:17px}.desk-memory{padding:15px;gap:13px}.telephone-symbol{font-size:38px}
  #app[data-phase=ending]{display:flex}#app[data-phase=ending] .ending{padding:28px 6%;width:100%}#app[data-phase=ending] #scene-section{position:relative;height:320px;min-height:320px}
  .ending h2{font-size:30px}.ending .result-hero{grid-template-columns:1fr;gap:12px;margin:20px 0}.ending .result-hero>div{padding:18px}.ending .result-hero h3{font-size:23px;margin:13px 0}.ending .result-hero p{font-size:14px}.reading-note{padding-top:10px}
  .reflection{padding:18px 15px}.personal-card{padding:22px}.personal-card h3{font-size:27px}.personal-question{font-size:17px!important}.service-card h3{font-size:20px}.save-status{font-size:10px}
}

/* Three clue stations: keep the work scene visible beside its evidence. */
#app.clue-mode{grid-template-columns:minmax(0,1fr) 430px;align-items:start}
.clue-panel{grid-column:2;grid-row:2;padding:22px 24px;border:1px solid var(--line);border-top:3px solid var(--green);border-radius:8px;background:var(--paper);max-height:calc(100svh - 218px);overflow-y:auto;scrollbar-width:thin}
#app.clue-mode #scene-section{height:calc(100svh - 218px);min-height:550px}
.clue-panel h2{font-size:25px;line-height:1.4;margin-right:10px}
.clue-panel .desk-memory{padding:12px;margin:14px 0;gap:12px}
.clue-panel .telephone-symbol{font-size:35px}
.clue-panel .choice-grid{gap:7px;margin:14px 0}
.clue-panel .choice{padding:11px 13px;font-size:13px}
.clue-panel .mini-comparison{margin:14px 0;gap:8px}
.clue-panel .mini-comparison>div{padding:12px 15px}
.clue-panel .mini-comparison .after p{font-size:19px;line-height:1.8}
.clue-panel .tony-note{margin-top:14px}
.clue-panel .tony-note p{font-size:12px;line-height:1.8}
.clue-panel .lens-note{margin-top:14px;padding-top:10px;font-size:11px!important}
.clue-panel .primary{margin-top:14px;min-height:46px;font-size:13px}
.clue-panel .close{right:9px;top:12px;width:27px;height:27px}
.clue-status{position:absolute;left:24px;right:24px;bottom:77px;padding:13px 17px;border-left:4px solid var(--orange);background:#fffcf5ee;font-size:13px;line-height:1.7;box-shadow:0 4px 18px #29463815;pointer-events:none}
.clue-mode .hotspot.active{border:2px solid var(--orange);font-weight:600}
.clue-mode .hotspot.active.complete{background:#fff0cb;border-color:#c78024}
@media(max-width:1000px) and (min-width:761px){#app.clue-mode{grid-template-columns:minmax(0,1fr) 360px}.clue-panel{padding:20px 18px}}
@media(max-width:760px){
 #app.clue-mode{display:flex}.clue-mode .inventory{order:0}
 #app.clue-mode #scene-section{order:1;width:100%;height:340px;min-height:340px;margin:12px 0}
 .clue-panel{order:2;max-height:none;width:100%;padding:22px 20px;margin-bottom:18px;overflow:visible}
 .clue-status{left:12px;right:12px;bottom:48px;font-size:10px;padding:7px 10px}
 .clue-panel .close{top:12px}.clue-panel h2{font-size:25px}
}

.clue-mode .inventory-item[aria-current="step"]{border-style:solid;border-color:var(--green);box-shadow:inset 0 -3px var(--green)}
.clue-panel .dialog-eyebrow{padding-right:28px}
