/* Chapter layer: keep the existing homepage and WebGL scenery intact. */
#chapter button,#inspect button{touch-action:manipulation}
#chapter [data-drag],#inspect [data-drag]{touch-action:none}
.playing header{display:none}.playing .scene{transform:scale(1.035)}#chapter{position:absolute;inset:0;display:grid;grid-template-rows:auto auto 1fr auto;gap:0;padding:22px clamp(18px,4vw,64px) 25px}
.chapter-top{display:flex;align-items:center;justify-content:space-between;gap:14px;z-index:2}
.quiet{border:1px solid #fff7e84d;background:#15332770;color:var(--paper);border-radius:99px;min-height:42px;padding:8px 17px;backdrop-filter:blur(12px);font-size:12px}
.quiet:hover{background:#294c3cd9}.chapter-tools{display:flex;gap:8px}.loop-clock{display:flex;align-items:center;gap:18px;text-shadow:0 2px 8px #17291c;font-size:12px}.loop-clock strong{font:26px Georgia,serif;letter-spacing:.06em}.loop-dots{color:#ffe5b3;font-size:10px;letter-spacing:5px}
.task-strip{display:flex;gap:14px;align-items:center;padding:18px 0;font-size:13px;text-shadow:0 2px 8px #102a21}.task-index{color:#f3dba7;font-size:11px;letter-spacing:.2em;border-left:2px solid #e6c691;padding-left:10px}#save-status{margin-left:auto;font-size:10px;opacity:.7}
.playfield{position:relative;min-height:120px;pointer-events:none}
.hotspot{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff9e9;border:0;background:transparent;pointer-events:auto;padding:8px;min-width:120px;max-width:210px;isolation:isolate}
.hotspot svg{width:90px;height:80px;filter:drop-shadow(0 6px 6px #152a2180);transition:transform .25s}.hotspot:hover svg{transform:translateY(-6px) rotate(-3deg)}
.hotspot span{font-size:12px;padding:9px 15px;background:#19392ed9;border:1px solid #f1dfaa75;border-radius:99px;white-space:nowrap;box-shadow:0 6px 25px #112b2444}
.hotspot i{position:absolute;z-index:-1;width:65px;height:18px;top:70px;background:#fbe1a63d;border-radius:50%;box-shadow:0 0 30px 12px #f9e3ad33;animation:breathe 2.3s ease-in-out infinite}
.at-plane{left:42%;top:34%;animation:plane-in 1s ease-out both}.at-paper{left:53%;top:35%}.at-folder{left:66%;top:38%}.at-stone{left:55%;top:40%}.at-person{left:74%;top:27%}.at-person svg{width:42px;height:42px;background:#21463299;border-radius:50%;padding:7px}.at-person i{top:24px}
.inventory{position:absolute;left:clamp(18px,4vw,64px);top:34%;z-index:4}.inventory-item{display:flex;align-items:center;gap:7px;color:#fff4dc;background:#234334db;border:1px solid #f4dbae66;border-radius:13px;padding:8px 14px 8px 8px;font-size:12px;touch-action:none;user-select:none}.inventory-item svg{width:42px;height:42px}
.story-panel{position:relative;grid-row:4;width:min(770px,100%);padding:22px 30px 17px;background:linear-gradient(115deg,#102a24f2,#1c342bdc);border:1px solid #fff5df38;border-radius:18px;box-shadow:0 16px 50px #0b201d33;backdrop-filter:blur(20px);outline:none}
.story-meta{display:flex;justify-content:space-between;gap:12px;font-size:11px;color:#e8d3a5;letter-spacing:.12em;margin-bottom:12px}#beat-label{color:#b5c4b7;font-size:10px;letter-spacing:.06em}.story-panel h2{font-size:clamp(20px,2vw,28px);line-height:1.45;margin:0 0 12px}.story-panel #story-text{font-size:14px;line-height:1.95;white-space:pre-line;margin:0;color:#f0eee1}.story-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:15px}.story-actions:empty{display:none}
.choice{min-height:44px;padding:10px 18px;border:1px solid #dcca9a80;background:#fff2d9;color:#293b31;border-radius:9px;font-size:13px;text-align:left;line-height:1.6}.choice:hover{background:#fffaf0;box-shadow:0 3px 16px #1f332822}.choice:disabled{opacity:.45;cursor:not-allowed}.story-actions .choice+ .choice{background:transparent;color:#f4e9d4}.interaction-hint{font-size:11px!important;color:#bdc9b8;margin:12px 0 0;line-height:1.6}.interaction-hint:empty{display:none}
#inspect{width:min(740px,calc(100% - 36px));padding:36px 32px 25px;max-height:calc(100dvh - 36px);overscroll-behavior:contain;scrollbar-width:thin}#inspect h2{padding-right:24px;font-size:25px;margin-bottom:18px}#inspect .eyebrow{margin-bottom:8px;font-size:10px}#inspect p{font-size:14px;line-height:1.85}
.inspect-actions{display:flex;flex-wrap:wrap;gap:9px;padding-top:20px}.inspect-actions .choice{background:#284b40;color:#fff5dc;border-color:#284b40}.inspect-actions .choice:hover{background:#3b6150}.paper-view{position:relative;background:linear-gradient(100deg,#f7ecd1,#fff7e2 49.5%,#e9dcc0 50%,#faf0d7 50.5%);padding:28px;border:1px solid #d9c8a7;box-shadow:0 8px 20px #65583e0d;min-height:190px}.paper-view.folded{text-align:center}.folded svg{width:140px;height:120px}.paper-label{color:#82765b;font-size:11px;letter-spacing:.14em}.handwriting{font-family:KaiTi,STKaiti,"SimSun",serif;font-size:clamp(25px,4vw,36px)!important;line-height:1.9!important;padding:16px 0;color:#454c42}.drawing{display:block;width:100%;color:#5d7c78}.blueprint{background:repeating-linear-gradient(0deg,transparent,transparent 23px,#527a7710 24px),#eef0df;border:1px solid #becabd;padding:18px 24px;color:#365953}.blueprint .drawing{max-height:210px}.blueprint p{font-size:13px!important;margin:9px 0}.blueprint strong{font-family:KaiTi,serif;font-size:18px;font-weight:400}.blueprint footer{margin-top:16px;padding-top:12px;border-top:1px solid #b6c5b4;font-size:11px}.pencil{color:#716b5e}.blue-pencil{color:#446d87}.signature{text-align:right;font-family:KaiTi,serif}.conversation{padding:14px 0;font-size:17px!important;line-height:2!important}.clue{border-bottom:1px solid #d8ceba;padding:8px 0}.clue h3{font-size:15px;font-weight:500;margin:10px 0 4px}.clue p{color:#686f62;margin:0 0 10px}
.sorting-table{display:grid;grid-template-columns:1.3fr 1fr;gap:20px;align-items:center;min-height:190px}.sheet-stack{display:flex;flex-direction:column;gap:10px}.sheet-card{background:#fffdf0;border:1px solid #d6cbb4;display:grid;grid-template-columns:90px 1fr;align-items:center;gap:4px 10px;padding:9px 12px;border-radius:5px;color:#394b3f;text-align:left;touch-action:none;user-select:none;position:relative}.sheet-card .drawing{grid-row:span 2;width:90px}.sheet-card strong{font-size:13px;font-weight:500}.sheet-card span{font-size:10px;color:#787b6c}.folder-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px 12px;border:2px dashed #8fa99a;border-radius:12px;min-height:220px;background:#dce6dc88;color:#446257;gap:10px}.folder-drop svg{width:120px}.folder-drop strong{font-size:14px}.folder-drop span{font-size:12px}.cover-choice{border:1px solid #b9c8b8;color:#365748;background:transparent;border-radius:8px;padding:12px;margin:0 8px 8px 0;min-height:44px;font:inherit;font-size:13px}.cover-choice[aria-pressed="true"]{background:#34594b;color:#fff5e5}.sorted-message{text-align:center;color:#667865;line-height:2.2!important}
.dragging{z-index:50!important;pointer-events:none;opacity:.85;transition:none!important;box-shadow:0 10px 30px #1c312544}.drop-active{outline:3px solid #e6b95e!important;outline-offset:6px;background-color:#c9d7ab55}.rewind{position:absolute;inset:0;z-index:10;background:#efe8dcee;backdrop-filter:blur(18px);color:#354b42;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:24px;padding:30px;animation:rewind-in .5s ease}.rewind span{font-size:12px;letter-spacing:.2em}.rewind strong{font:clamp(22px,3vw,36px) "SimSun",serif;line-height:1.8;font-weight:400}.rewind small{color:#788778;letter-spacing:.25em;font-size:11px}
@keyframes breathe{50%{opacity:.35;transform:scale(.8)}}@keyframes plane-in{from{opacity:0;transform:translate(-100px,-60px) rotate(-15deg)}to{opacity:1;transform:none}}@keyframes rewind-in{from{opacity:0}to{opacity:1}}
.hotspot:focus-visible{outline:none}.hotspot:focus-visible span{outline:2px solid #ffda93;outline-offset:4px}
@media(min-width:1100px){.story-panel{width:min(690px,58vw)}.at-person{top:51%;left:76%}.at-folder{top:62%;left:67%}.at-paper{top:59%;left:56%}.at-stone{top:61%}.at-plane{top:60%;left:45%}}
@media(max-width:700px){
 #chapter{padding:14px 16px 16px;grid-template-rows:auto auto minmax(130px,1fr) auto}
 .chapter-top{gap:6px}.quiet{font-size:10px;padding:6px 10px;min-height:38px}.chapter-tools{gap:5px}.loop-clock{gap:6px;flex-direction:column;font-size:10px}.loop-clock strong{font-size:23px}.loop-dots{display:none}
 .task-strip{font-size:11px;gap:9px;padding:12px 0;align-items:flex-start}.task-index{flex:none;font-size:10px}#save-status{display:none}
 .story-panel{padding:17px 18px 13px;max-height:43dvh;overflow:auto;border-radius:14px}.story-panel h2{font-size:20px;margin-bottom:8px}.story-panel #story-text{font-size:13px;line-height:1.85}.story-meta{font-size:10px;margin-bottom:8px}#beat-label{font-size:9px}.story-actions{margin-top:12px;gap:7px}.choice{font-size:12px;padding:9px 12px}.interaction-hint{font-size:10px!important}
 .at-plane{left:32%;top:40%}.at-person{left:57%;top:28%}.at-paper{left:43%;top:38%}.at-folder{left:47%;top:36%}.at-stone{left:38%;top:40%}.hotspot{min-width:100px;padding:4px}.hotspot svg{width:72px;height:63px}.hotspot span{font-size:11px;padding:8px 12px}.hotspot i{top:55px}.at-person svg{width:38px;height:38px}.at-person i{top:25px}
 .inventory{left:16px;top:29%}.inventory-item{flex-direction:column;padding:8px;font-size:10px;max-width:100px}.inventory-item svg{width:35px;height:32px}
 #inspect{padding:32px 19px 22px;width:calc(100% - 24px);max-height:calc(100dvh - 24px)}#inspect h2{font-size:21px}.paper-view{padding:20px}.blueprint{padding:15px}.sorting-table{gap:12px;grid-template-columns:1.3fr 1fr}.sheet-card{display:block;padding:10px}.sheet-card .drawing{width:100%;max-height:60px}.sheet-card strong,.sheet-card span{display:block}.sheet-card span{font-size:9px;margin-top:6px}.folder-drop{min-height:180px;padding:10px 5px}.folder-drop svg{width:80px}.cover-choice{font-size:12px;padding:10px;margin-right:5px}
}
@media(max-height:600px) and (orientation:portrait){#chapter{grid-template-rows:auto auto minmax(105px,1fr) auto}.story-panel{max-height:43dvh}.hotspot svg{height:43px}.hotspot i{top:36px}.at-plane,.at-paper,.at-folder,.at-stone{top:10%}.at-person{top:8%}}
@media(max-height:500px) and (orientation:landscape){
 #chapter{padding:10px 22px;grid-template-columns:1fr 1fr;grid-template-rows:auto auto 1fr;column-gap:20px}.chapter-top,.task-strip{grid-column:1/-1}.loop-clock strong{font-size:21px}.quiet{min-height:34px;padding:6px 12px}.task-strip{padding:8px 0}.story-panel{grid-column:1;grid-row:3;width:100%;max-height:calc(100dvh - 110px);overflow:auto;padding:15px 19px}.story-panel h2{font-size:20px}.story-panel #story-text{font-size:12px}.story-meta{margin-bottom:8px}
 .playfield{grid-column:2;grid-row:3}.at-plane,.at-paper,.at-person,.at-folder,.at-stone{left:30%;top:23%}.inventory{left:auto;right:32%;top:auto;bottom:16px}.inventory-item{padding:4px 8px}.inventory-item svg{width:30px}.hotspot svg{height:55px}#save-status{display:none}
}
/* Anchor desktop props to the actual slope instead of the changing dialogue height. */
@media(min-width:1100px) and (min-height:501px){
 .playfield{position:absolute;inset:0}.at-plane{left:60%;top:72%}.at-paper{left:63%;top:72%}.at-folder{left:72%;top:67%}.at-stone{left:64%;top:74%}.at-person{left:77%;top:51%}
}

