:root{color:#f8efd8;font-synthesis:none;text-rendering:optimizelegibility;--cream:#f8efd8;--cream-muted:#cfc3a7;--navy:#101b2f;--navy-deep:#091221;--navy-soft:#172641;--gold:#e2b651;--coral:#df7667;--green:#839d65;--line:#f8efd824;background:#091221;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{background:radial-gradient(circle at 12% 5%,#29435b7a,#0000 34rem),linear-gradient(155deg,#101b2f 0%,#091221 62%);min-width:320px;min-height:100%}body{min-width:320px;min-height:100vh;margin:0;overflow-x:hidden}body:before{z-index:-1;content:"";background-image:linear-gradient(#ffffff05 1px,#0000 1px),linear-gradient(90deg,#ffffff05 1px,#0000 1px);background-size:48px 48px;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#000,#0000 72%);mask-image:linear-gradient(#000,#0000 72%)}button,input,select{font:inherit}button,select,input[type=range]{touch-action:manipulation}button:focus-visible,select:focus-visible,input:focus-visible{outline-offset:3px;outline:3px solid #e2b651e6}button{color:inherit}.app-shell{width:min(1480px,100%);min-height:100vh;margin:0 auto;padding:24px clamp(16px,3.2vw,52px) 32px}.app-header{justify-content:space-between;align-items:flex-end;min-height:58px;margin-bottom:18px;display:flex}.app-header__eyebrow,.start-screen__eyebrow,.end-card__eyebrow{color:var(--gold);letter-spacing:.17em;text-transform:uppercase;margin:0 0 6px;font-size:.69rem;font-weight:750}.app-header__title{color:var(--cream);letter-spacing:.015em;margin:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(1.45rem,2.4vw,2.15rem);line-height:1}.app-header__status{color:var(--cream-muted);letter-spacing:.04em;align-items:center;gap:8px;font-size:.78rem;display:flex}.status-dot{background:var(--coral);border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 5px #df766721}.film-frame{background:#050a13;border:1px solid #f8efd82e;border-radius:clamp(14px,2vw,28px);position:relative;overflow:hidden;box-shadow:0 34px 80px #0000006b,0 3px 12px #0000004d,inset 0 0 0 1px #ffffff09}.film-frame:after{z-index:50;border-radius:inherit;content:"";pointer-events:none;border:1px solid #ffffff14;position:absolute;inset:0}.film-stage{isolation:isolate;aspect-ratio:16/9;background:#0a1220;width:100%;position:relative;overflow:hidden}.film-stage__backdrop{z-index:-2;background:radial-gradient(circle,#e2b6512e,#0000 35%),#0a1220;position:absolute;inset:0}.film-scene{visibility:hidden;opacity:0;background:var(--navy);margin:0;position:absolute;inset:0;overflow:hidden}.film-scene__image{object-fit:cover;-webkit-user-select:none;user-select:none;will-change:transform;width:100%;height:100%;display:block}.scene-title-card{z-index:16;border:1px solid #fff6d933;border-left:3px solid var(--gold);max-width:min(82%,880px);color:var(--cream);pointer-events:none;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);background:linear-gradient(105deg,#070f1be0,#070f1b9e);border-radius:5px 14px 14px 5px;align-items:center;gap:clamp(9px,1.1vw,15px);padding:clamp(8px,1vw,12px) clamp(12px,1.5vw,20px);display:flex;position:absolute;bottom:clamp(12px,2vw,28px);left:clamp(12px,2.4vw,36px);box-shadow:0 10px 32px #0000003d}.scene-title-card__number{color:var(--gold);letter-spacing:.12em;flex:none;font-size:clamp(.58rem,.75vw,.72rem);font-weight:800}.scene-title-card__text{text-wrap:balance;text-shadow:0 2px 12px #0000006b;margin:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(.82rem,1.55vw,1.42rem);line-height:1.14}.film-scene--message:before{z-index:6;content:"";pointer-events:none;background:linear-gradient(90deg,#07101ee0 0%,#07101eb3 34%,#07101e1f 68%,#0000 100%);position:absolute;inset:0}.film-scene__message{z-index:12;width:min(48%,660px);color:var(--cream);text-wrap:balance;text-shadow:0 3px 18px #0000007a;flex-direction:column;gap:clamp(5px,.8vw,12px);font-family:Georgia,Times New Roman,serif;font-size:clamp(1rem,2.15vw,2.3rem);line-height:1.18;display:flex;position:absolute;top:50%;left:clamp(26px,7vw,112px);transform:translateY(-50%)}.film-scene__message span:first-child{color:var(--gold);letter-spacing:.04em;margin-bottom:clamp(3px,.4vw,7px);font-size:.64em;font-style:italic}.film-scene__message span{overflow-wrap:break-word;min-width:0}.film-scene__glow{mix-blend-mode:screen;pointer-events:none;background:radial-gradient(circle at 72% 20%,#ffe59e7a,#0000 34%),linear-gradient(115deg,#ffcc671a,#0000 45%);position:absolute;inset:-18%}.film-scene--night .film-scene__glow{background:radial-gradient(circle at 76% 18%,#ffd47747,#0000 30%),linear-gradient(110deg,#0000 34%,#4d80bb29)}.film-scene__vignette{pointer-events:none;background:linear-gradient(#03080f14,#0000 22%),radial-gradient(circle at 50% 44%,#0000 52%,#03080f59 115%);position:absolute;inset:-1px}.film-scene__grain{mix-blend-mode:soft-light;opacity:.25;pointer-events:none;background-image:radial-gradient(circle at 20% 30%,#ffffff24 0 .6px,#0000 .8px),radial-gradient(circle at 70% 60%,#11192833 0 .7px,#0000 .9px);background-size:5px 5px,7px 7px;position:absolute;inset:0}.film-scene__shimmer{filter:blur(16px);mix-blend-mode:screen;opacity:0;pointer-events:none;background:linear-gradient(90deg,#0000,#ffe5a759,#0000);width:23%;position:absolute;top:-15%;bottom:-15%;left:37%;transform:skew(-16deg)}.fx-hearts{pointer-events:none;width:120px;height:100px;position:absolute;top:24%;left:50%;transform:translate(-50%)}.fx-heart{fill:#df766724;stroke:#d76558;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;opacity:0;width:clamp(14px,2vw,27px);position:absolute;overflow:visible}.fx-heart--1{bottom:8px;left:14px}.fx-heart--2{width:clamp(11px,1.6vw,21px);top:9px;left:48px}.fx-heart--3{width:clamp(9px,1.4vw,18px);bottom:24px;right:5px}.film-scene--leaves .fx-hearts{top:14%;left:42%}.fx-steam-field{pointer-events:none;position:absolute;inset:0;overflow:hidden}.fx-steam{filter:blur(8px);opacity:0;border:2px solid #0000;border-color:#fff7e142 #0000 #0000 #fff7e142;border-radius:50%;width:19%;height:28%;position:absolute;bottom:6%}.fx-steam--1{left:17%}.fx-steam--2{bottom:13%;left:36%;transform:scale(.72)}.fx-steam--3{right:25%;transform:scale(1.18)}.fx-steam--4{bottom:15%;right:8%;transform:scale(.8)}.film-scene--clouds .fx-steam{border-color:#ffe9c42e;bottom:-6%}.film-scene--table .fx-steam{width:10%;height:23%;bottom:12%;left:43%}.fx-flecks{pointer-events:none;position:absolute;inset:0;overflow:hidden}.fx-fleck{opacity:0;background:#f7cc64ad;border-radius:80% 10%;width:6px;height:12px;position:absolute;box-shadow:0 0 14px #f7cc6457}.fx-fleck--1{top:18%;left:12%}.fx-fleck--2{top:30%;left:27%;transform:scale(.6)rotate(34deg)}.fx-fleck--3{top:17%;right:20%;transform:scale(.8)rotate(-25deg)}.fx-fleck--4{top:46%;right:8%;transform:scale(.5)rotate(18deg)}.fx-fleck--5{bottom:24%;left:18%;transform:scale(.7)rotate(55deg)}.fx-fleck--6{bottom:14%;right:31%;transform:scale(.45)rotate(-48deg)}.fx-candle{aspect-ratio:.62;filter:blur(.3px);transform-origin:50% 100%;pointer-events:none;background:#ffd47a;border-radius:50% 50% 42% 42%;width:clamp(8px,.8vw,13px);position:absolute;bottom:25.5%;right:39.1%;box-shadow:0 0 14px #ffd47a,0 0 36px #ffbe4c9e}.stage-toggle{z-index:20;aspect-ratio:1;width:clamp(54px,6vw,76px);color:var(--cream);cursor:pointer;opacity:0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#070f1ba6;border:1px solid #fff6;border-radius:50%;place-items:center;transition:opacity .18s,transform .18s,background .18s;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 12px 34px #00000057}.film-stage:hover .stage-toggle,.stage-toggle:focus-visible,.stage-toggle:not(.stage-toggle--playing){opacity:1}.stage-toggle:hover{background:#0e1f34d6;transform:translate(-50%,-50%)scale(1.04)}.start-screen{z-index:40;text-align:center;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:radial-gradient(circle at 50% 38%,#e2b65130,#0000 24%),linear-gradient(145deg,#0a1424ed,#070e1afb);flex-direction:column;justify-content:center;align-items:center;padding:clamp(18px,5vw,72px);display:flex;position:absolute;inset:0}.start-screen:before{content:"";pointer-events:none;background:linear-gradient(112deg,#0000 30%,#ffffff09,#0000 67%);position:absolute;inset:0}.start-screen__sunflower{aspect-ratio:1.9;object-fit:cover;object-position:50% 48%;border:1px solid #e2b65147;border-radius:18px;width:clamp(96px,13vw,168px);margin-bottom:clamp(12px,2vw,24px);box-shadow:0 14px 40px #0000003d,0 0 34px #e2b65129}.start-screen h1{max-width:760px;color:var(--cream);letter-spacing:-.035em;margin:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(2rem,5.8vw,5.1rem);font-weight:400;line-height:1}.start-screen__meta{color:var(--cream-muted);letter-spacing:.035em;margin:clamp(10px,2vw,20px) 0 clamp(16px,3vw,30px);font-size:clamp(.74rem,1.25vw,.94rem)}.start-screen__note,.start-screen__warning{width:min(560px,100%);color:var(--cream-muted);margin:18px 0 0;font-size:.75rem;line-height:1.5}.start-screen__warning{color:#efb3a7}.start-screen__retry{flex-direction:column;align-items:center;width:min(560px,100%);display:flex}.primary-button{background:var(--gold);color:#172033;letter-spacing:.07em;text-transform:uppercase;cursor:pointer;border:1px solid #fff6d966;border-radius:999px;min-width:160px;padding:13px 24px;font-size:.82rem;font-weight:800;transition:transform .18s,filter .18s;box-shadow:0 12px 30px #e2b65129}.primary-button:hover{filter:brightness(1.07);transform:translateY(-2px)}.loader{width:min(360px,72%)}.loader__track{background:#f8efd824;border-radius:999px;height:3px;overflow:hidden}.loader__track span{border-radius:inherit;background:linear-gradient(90deg, var(--coral), var(--gold));height:100%;transition:width .24s;display:block}.loader p{color:var(--cream-muted);margin:10px 0 0;font-size:.72rem}.end-card{z-index:30;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#070e1a7a;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.player-panel{z-index:10;border:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#101b2fc2;border-radius:18px;margin:14px 0 0;padding:15px 18px 14px;position:relative;box-shadow:0 14px 42px #0000002b}.player-panel__timeline{gap:7px;display:grid}.timeline-range{--progress:0%;appearance:none;background:linear-gradient(90deg, var(--gold) 0, var(--coral) var(--progress), #f8efd826 var(--progress), #f8efd826 100%);cursor:pointer;border-radius:999px;width:100%;height:5px;margin:0}.timeline-range::-webkit-slider-thumb{appearance:none;border:2px solid var(--navy);background:var(--cream);border-radius:50%;width:15px;height:15px;box-shadow:0 0 0 1px #ffffff59}.timeline-range::-moz-range-thumb{border:2px solid var(--navy);background:var(--cream);border-radius:50%;width:12px;height:12px}.timeline-meta{color:var(--cream-muted);letter-spacing:.035em;justify-content:space-between;font-size:.68rem;display:flex}.player-panel__controls{justify-content:space-between;align-items:center;gap:16px;margin-top:13px;display:flex}.button-group{align-items:center;gap:8px;display:flex}.icon-button,.sound-button{border:1px solid var(--line);background:#ffffff0b;height:38px}.icon-button{cursor:pointer;border-radius:50%;place-items:center;width:38px;display:grid}.icon-button:hover{background:#e2b65114;border-color:#e2b6518c}.sound-button{color:#cfc3a79e;border-radius:999px;align-items:center;gap:7px;padding:0 13px;font-size:.7rem;display:flex}.sound-button:disabled{cursor:not-allowed}.sound-button:not(:disabled){color:var(--cream-muted);cursor:pointer}.sound-button:not(:disabled):hover{color:var(--cream);background:#e2b65114;border-color:#e2b6518c}.sound-button[aria-pressed=true]{color:#cfc3a7b3}.speed-control{color:var(--cream-muted);align-items:center;gap:8px;font-size:.7rem;display:flex}.speed-control select{border:1px solid var(--line);background:var(--navy-soft);height:34px;color:var(--cream);border-radius:8px;padding:0 28px 0 10px}.scene-rail{scrollbar-width:thin;grid-template-columns:repeat(55,minmax(20px,1fr));gap:5px;margin-top:13px;padding-bottom:3px;display:grid;overflow-x:auto}.scene-rail button{color:#f8efd873;cursor:pointer;background:#f8efd812;border:0;border-radius:6px;place-items:center;min-height:24px;font-size:.58rem;transition:background .15s,color .15s,transform .15s;display:grid;position:relative;overflow:hidden}.scene-rail button:after{background:var(--gold);content:"";opacity:0;height:2px;position:absolute;bottom:0;left:0;right:0}.scene-rail button:hover{color:var(--cream);background:#f8efd81f;transform:translateY(-1px)}.scene-rail button.is-current{color:var(--gold);background:#e2b65121}.scene-rail button.is-current:after{opacity:1}.keyboard-hint{color:#cfc3a78a;text-align:right;margin:12px 2px 0;font-size:.65rem}@media (width<=720px){.app-shell{padding:14px 10px 22px}.app-header{min-height:45px;margin:0 4px 12px}.app-header__eyebrow{display:none}.app-header__status{font-size:.68rem}.film-frame{border-radius:14px}.scene-title-card{border-left-width:2px;border-radius:4px 10px 10px 4px;gap:7px;max-width:calc(100% - 18px);padding:6px 9px;bottom:9px;left:9px}.scene-title-card__number{font-size:.52rem}.scene-title-card__text{font-size:clamp(.68rem,2.75vw,.88rem);line-height:1.12}.start-screen h1{font-size:clamp(1.55rem,8vw,2.5rem)}.start-screen__sunflower{width:92px;margin-bottom:9px}.start-screen__meta{margin-bottom:14px;font-size:.66rem}.start-screen__note,.start-screen__warning{display:none}.primary-button{min-width:138px;padding:10px 18px;font-size:.68rem}.player-panel{border-radius:13px;margin-top:9px;padding:12px 11px 10px}.timeline-meta span:last-child{text-overflow:ellipsis;white-space:nowrap;max-width:69%;overflow:hidden}.player-panel__controls{margin-top:11px}.sound-button{justify-content:center;width:38px;padding:0;font-size:.84rem}.sound-button__label{display:none}.scene-rail{scrollbar-width:thin;gap:5px;padding-bottom:3px;display:flex;overflow-x:auto}.scene-rail button{min-width:27px}.keyboard-hint{display:none}}@media (width<=480px) and (orientation:portrait){.app-shell{flex-direction:column;justify-content:center;min-height:100svh;display:flex}.film-stage{aspect-ratio:16/10}.film-scene__image{object-fit:cover}.film-scene__message{gap:4px;width:62%;font-size:clamp(.72rem,3.35vw,.94rem);line-height:1.12;top:14%;left:22px;transform:none}.player-panel__controls{align-items:flex-start}.speed-control>span{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important}.film-scene__grain{opacity:.16}.stage-toggle:hover,.primary-button:hover,.scene-rail button:hover{transform:none}}