﻿/* Requested refinements. Existing card composition (screen 4) stays untouched. */
[data-scene=cover]{isolation:isolate;background:#78b7f3;overflow:clip}
[data-scene=cover]>.cover-atmosphere{inset:-8%;z-index:0;--u:calc(100vw / 1680)}
[data-scene=cover] .composition{background:transparent;overflow:visible;z-index:1}
.cover-brand{font-weight:700}
.cover-description{position:absolute;left:19%;top:57.5%;width:62%;font-size:calc(32*var(--u));line-height:1.17;font-weight:700;text-align:center}
.learn.explore-button{top:78%;left:36%;width:28%;height:calc(72*var(--u));display:flex;gap:calc(12*var(--u));color:var(--ink);text-decoration:none;background:none;border-radius:0}
.explore-label{display:flex;align-items:center;flex:1;min-width:0;padding-inline:calc(24*var(--u));background:var(--paper);border-radius:calc(12*var(--u));box-shadow:0 0 calc(12*var(--u)) calc(2*var(--u)) var(--edge);font-size:calc(28*var(--u));text-align:left}
.learn .explore-arrow{margin:0;display:grid;place-items:center;flex:0 0 calc(72*var(--u));background:var(--ink);border-radius:calc(12*var(--u))}
.explore-arrow i{position:relative;width:calc(30*var(--u));height:calc(2*var(--u));background:var(--paper);transform:rotate(-45deg)}
.explore-arrow i:after{content:'';position:absolute;right:0;top:calc(-7*var(--u));width:calc(15*var(--u));height:calc(15*var(--u));border-top:calc(2*var(--u)) solid var(--paper);border-right:calc(2*var(--u)) solid var(--paper);transform:rotate(45deg)}
.history-card{background:var(--paper);z-index:2}
.year{z-index:2}.year:before{display:none}
.history-connector{position:absolute;width:0;border-left:calc(2.5*var(--u)) dashed var(--ink);z-index:1;pointer-events:none}
.folder-window{left:11.9048%;top:74.4208%;width:76.1905%;height:22.8916%;overflow:visible;background:var(--paper);border:1px solid var(--edge);border-radius:calc(25*var(--u));box-shadow:0 0 calc(9*var(--u)) var(--edge)}
.folder-viewport{position:absolute;inset:calc(22*var(--u)) calc(50*var(--u));overflow:clip}
.scan-star{padding:0;cursor:pointer;z-index:4}
.scan-line,.white-block,.scanner{transition:none!important}
.reading-word{position:relative;display:inline-block;white-space:nowrap}
.reading-word.is-read{color:inherit}
.word-bold{position:absolute;left:0;top:0;white-space:nowrap;font-weight:700;color:inherit;opacity:0;pointer-events:none}
.reading-word.is-read .word-bold{opacity:1}
.read-track{overflow:clip}
.read-runner{left:0;top:0;height:100%;width:5%;transform:none!important}
.lock-badge{border:0;padding:0;cursor:pointer}
.distraction-toast{position:absolute;z-index:30;width:min(370px,calc(100% - 32px));padding:20px 42px 20px 22px;background:var(--paper);border-radius:16px;box-shadow:0 0 15px 2px var(--edge);font-size:18px;line-height:1.3;color:var(--ink)}
.distraction-toast[hidden]{display:none}.toast-close{position:absolute;right:9px;top:7px;border:0;background:transparent;font-size:25px;line-height:1;cursor:pointer;padding:4px}
.dome-intro{display:contents}.dome-illustration{position:absolute;inset:0;pointer-events:none}
.dome-heading{top:25.2%}.break-button{top:35.87%}
[data-scene=slider] .scene-heading{top:18%}
.text-size-control{top:76.5%}
.collage-stars .star-badge{pointer-events:auto;padding:0;cursor:pointer}
.collage-stars[inert] .star-badge{pointer-events:none}
.floating-tooltip{position:fixed;z-index:1000;max-width:min(420px,calc(100vw - 24px));padding:20px 24px;background:var(--paper);color:var(--ink);border-radius:16px;box-shadow:0 0 14px 2px var(--edge);font-family:SkimArial,Arial,sans-serif;font-size:18px;line-height:1.3;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .18s,transform .18s,visibility .18s;pointer-events:none}
.floating-tooltip.open{opacity:1;visibility:visible;transform:none;pointer-events:auto}.floating-tooltip strong{display:block;font-size:20px}.floating-tooltip small{display:block;font-size:14px;color:#777;margin-top:9px}
@media(max-width:1000px){
 [data-scene=cover]>.cover-atmosphere{inset:-10%}
 .cover-description{left:6%;top:49%;width:88%;font-size:20px;line-height:1.18}
 .learn.explore-button{left:20%;top:77%;width:60%;height:54px;gap:10px}
 .explore-label{padding-inline:18px;font-size:19px;border-radius:10px}
 .learn .explore-arrow{flex-basis:54px;border-radius:10px}
 .explore-arrow i{width:24px;height:2px}.explore-arrow i:after{top:-6px;width:13px;height:13px;border-width:2px}
 .history-card{margin-bottom:72px}
 .folder-window{position:relative;left:auto;top:auto;width:100%;height:190px;margin-top:32px;border-radius:18px}
 .folder-viewport{inset:18px 16px}
 .scan-star{position:relative;display:grid;left:auto;top:auto;width:48px;height:48px;margin:0 auto 24px}
 .dome-intro{display:block}.dome-heading{top:auto;margin-bottom:24px}
 .break-button{position:relative;left:auto;top:auto;width:120px;height:40px;margin:0 auto}
 [data-scene=dome] .composition{min-height:0}
 .dome-illustration{position:relative;inset:auto;height:calc((100cqw + 40px)*1079/1680);margin-top:-30px}
 .dome-illustration .dome-shape,.dome-illustration .dome-symbols{inset:0 -20px;height:auto}
 .dome-illustration .outer-question{top:calc(var(--y)*100% / 1079)}
 [data-scene=slider] .scene-heading{top:auto;margin-bottom:0}
 .resize-panel{margin-top:28px}
 .text-size-control{top:auto;margin:28px auto 0}
 .floating-tooltip{padding:17px 19px;font-size:16px}.floating-tooltip strong{font-size:18px}
}
@media(prefers-reduced-motion:reduce){.floating-tooltip{transition:none}}
@media(max-width:1000px){
 [data-scene=scan] .composition{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}
 [data-scene=scan] .scene-heading,.scan-intro,.scan-caption{grid-column:1/-1;margin:0}
 .scan-panel--left{grid-column:1;grid-row:3;height:275px;margin:0}
 .scan-panel--right{grid-column:2;grid-row:3;height:275px;margin:0}
 .scan-star{grid-column:1/-1;grid-row:4;margin:0 auto}
 .scan-caption{grid-row:5}
 .scanner{width:17.8873%;height:5.0571%}
 .scan-line{height:4.5388%}
}
.distraction-toast{position:fixed}
@media(max-width:1000px){.dome-illustration{margin-top:calc(80px - (100cqw + 40px)*503/1680)}}
.learn.explore-button .explore-label{margin:0}
.word-bold{user-select:none;-webkit-user-select:none}
@media(max-width:1000px) and (max-height:600px){
 [data-scene=cover] .composition{min-height:680px}
 .cover-title{top:20%;font-size:min(29cqw,200px)}
 .definition{top:13%}
}
@media(max-width:1000px) and (max-height:600px){.cover-title{top:16%}}
/* Scroll consumes these short sticky ranges; input is never blocked. */
.scene.scene--scrub{display:block;min-height:0}
.scene.scene--scrub>.composition{position:sticky;top:var(--sticky-top,0px)}
/* Content defines vertical capacity. Only the horizontal viewport clips. */
[data-scene=folders] .composition{overflow:visible}
[data-scene=folders] .composition:before{clip-path:inset(99.07% 0 -99.07% 0)}
.folder-window{height:auto;min-height:calc(247*var(--u));padding:calc(22*var(--u)) calc(50*var(--u));overflow:visible}
.folder-viewport{position:relative;inset:auto;padding:calc(10*var(--u));overflow-x:clip;overflow-y:visible;clip-path:none;mask:none}
.folder-tape{position:relative;left:0;top:0;width:max-content;align-items:flex-start}
.folder-tape li{display:flex;flex-direction:column;align-items:center}
.folder-icon{flex:none}
@media(max-width:1000px){
 .folder-window{height:auto;min-height:190px;padding:18px 16px}
 .folder-viewport{inset:auto;padding:12px}
 .folder-tape{left:0;top:0}
}
