:root{--ink:#100e0a;--paper:#ead9ad;--gold:#c99b43;--red:#8b2721;--muted:#94866b}
*{box-sizing:border-box}
html{background:var(--ink)}
body{margin:0;min-height:100vh;color:var(--paper);font-family:"DM Sans",sans-serif;background:radial-gradient(circle at 50% -20%,#4a3620 0,transparent 38%),#100e0a}
.grain{position:fixed;inset:0;z-index:30;pointer-events:none;opacity:.13;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}
header{height:72px;display:flex;align-items:center;padding:0 clamp(18px,4vw,64px);background:#0d0c09e8;border-bottom:1px solid #c99b4333;position:relative;z-index:5}
.sigil{width:39px;height:46px;display:grid;place-items:center;background:var(--red);border:1px solid var(--gold);font:700 22px Cinzel;clip-path:polygon(0 0,100% 0,100% 82%,50% 100%,0 82%)}
.wordmark{display:flex;flex-direction:column;margin-left:13px}.wordmark strong{font:700 17px Cinzel;letter-spacing:.18em;color:#efd28a}.wordmark span{font:600 7px Cinzel;letter-spacing:.22em;color:#86785e;margin-top:4px}
.build-status{margin-left:auto;color:#96876a;border:1px solid #ffffff17;border-radius:99px;padding:8px 12px;font:600 8px Cinzel;letter-spacing:.13em}.build-status i{display:inline-block;width:6px;height:6px;margin-right:7px;border-radius:50%;background:#dfa946;box-shadow:0 0 10px #dfa946;animation:pulse 1.6s infinite}
main{width:min(1440px,100%);margin:auto}.trailer-shell{padding:clamp(12px,2vw,28px)}
.cinema{position:relative;overflow:hidden;aspect-ratio:16/9;max-height:calc(100vh - 128px);margin:auto;background:#26351e;border:1px solid #c99b4355;box-shadow:0 35px 120px #000d;isolation:isolate}
.cinema canvas{position:absolute;inset:0;width:100%;height:100%;display:block;image-rendering:pixelated}
.shade{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 52% 45%,transparent 35%,#0809057d 100%),linear-gradient(180deg,#15120b42,transparent 30%,#120e0975);z-index:2}
.letterbox{position:absolute;left:0;right:0;height:6.5%;background:#080706;z-index:8}.letterbox.top{top:0}.letterbox.bottom{bottom:0}
.loading,.title-card{position:absolute;inset:0;z-index:12;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:#0d0c09ed;transition:opacity 1.1s,visibility 1.1s}.loading.hidden,.title-card.hidden{opacity:0;visibility:hidden;pointer-events:none}
.roman-loader{width:52px;height:59px;display:grid;place-items:center;background:#7f221e;border:1px solid #d6aa53;font:700 25px Cinzel;color:#e8c46d;clip-path:polygon(0 0,100% 0,100% 82%,50% 100%,0 82%);animation:pulse 1.4s infinite}.loading strong{margin-top:17px;font:600 9px Cinzel;letter-spacing:.22em}
.opening{background:linear-gradient(#0c0b08d8,#0c0b08c4)}.title-card>span,.scene-caption span{font:600 clamp(7px,.8vw,10px) Cinzel;letter-spacing:.34em;color:#d0a34d}
.opening h1{font:800 clamp(38px,7.4vw,104px)/.9 Cinzel;letter-spacing:.12em;text-indent:.12em;margin:18px 0;color:#e7bc5b;text-shadow:0 3px 35px #000}.opening p{font-size:clamp(10px,1vw,14px);color:#b7a47e;letter-spacing:.12em}
.scene-caption{position:absolute;left:7%;bottom:15%;z-index:6;max-width:510px;opacity:0;transform:translateY(18px);transition:opacity .8s,transform .8s;text-shadow:0 2px 14px #000}.scene-caption.show{opacity:1;transform:none}.scene-caption strong{display:block;margin:8px 0 5px;font:700 clamp(20px,3.3vw,47px)/1.02 Cinzel;color:#f1e1bc}.scene-caption p{margin:0;max-width:455px;color:#c7b894;font-size:clamp(10px,1vw,14px);line-height:1.55}
.final-card{background:#0b0907e6;opacity:0;visibility:hidden}.final-card.show{opacity:1;visibility:visible}.final-card h2{font:800 clamp(42px,9vw,126px)/.8 Cinzel;letter-spacing:.12em;margin:22px 0 17px;color:#e7bc5b;text-indent:.12em;text-shadow:0 4px 45px #c27b2130}.final-card p{font:600 clamp(9px,1.1vw,14px) Cinzel;letter-spacing:.38em;color:#d7c49a}.final-card b{margin-top:25px;border:1px solid #c99b4366;padding:10px 15px;font:600 8px Cinzel;letter-spacing:.25em;color:#aa9365}
.pause-button,.sound-button,.replay-button{position:absolute;z-index:16;border:1px solid #dbc27b4a;background:#0c0b09b8;color:#d9c493;cursor:pointer;transition:.2s}.pause-button{right:18px;top:9%;width:35px;height:35px;font:600 10px Cinzel}.sound-button{right:60px;top:9%;width:35px;height:35px;font:600 13px Cinzel}.sound-button.active{color:#171108;background:#d2a64f;border-color:#f0cd7b}.replay-button{right:18px;bottom:13%;padding:10px 14px;font:600 8px Cinzel;letter-spacing:.15em}
.timeline{position:absolute;left:7%;right:7%;bottom:7.2%;z-index:10;height:2px;background:#ffffff20}.timeline i{display:block;width:0;height:100%;background:#d6a84e;box-shadow:0 0 10px #d6a84e}.corner-label{position:absolute;z-index:10;bottom:2.6%;font:600 6px Cinzel;letter-spacing:.2em;color:#81745c}.corner-label.left{left:7%}.corner-label.center{left:50%;transform:translateX(-50%);color:#b89c65}.corner-label.right{right:7%}
.manifesto{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;padding:90px clamp(22px,6vw,95px) 75px;border-bottom:1px solid #ffffff12}.eyebrow{font:600 8px Cinzel;letter-spacing:.28em;color:var(--gold)}.manifesto h2{font:700 clamp(28px,4vw,55px)/1.07 Cinzel;margin:12px 0;color:#eadbb5}.manifesto>p{margin:22px 0 0;color:#9b8e73;font-size:14px;line-height:1.8;max-width:610px}.pillars{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:15px}.pillars span{padding:17px 13px;border:1px solid #ffffff13;background:#ffffff04;font:600 8px Cinzel;letter-spacing:.12em;color:#998c73}.pillars b{color:#c69945;margin-right:10px}
footer{width:calc(100% - clamp(36px,8vw,120px));min-height:78px;margin:auto;display:flex;align-items:center;justify-content:space-between;color:#635b4c;font:600 7px Cinzel;letter-spacing:.13em}footer strong{font-size:15px;color:#a58d5e}
@keyframes pulse{50%{opacity:.42}}
@media(max-width:760px){header{height:61px}.build-status{display:none}.trailer-shell{padding:8px}.cinema{aspect-ratio:16/9;max-height:none}.cinema canvas{width:100%;height:100%;left:0;transform:none}.opening h1{font-size:34px}.opening p{padding:0 20px}.scene-caption{left:8%;right:8%;bottom:18%}.scene-caption strong{font-size:24px}.scene-caption p{display:none}.corner-label.right,.corner-label.center{display:none}.manifesto{grid-template-columns:1fr;gap:16px;padding:58px 22px}.pillars{grid-template-columns:1fr 1fr;margin-top:25px}.timeline{bottom:8%}footer{padding:25px 0;gap:9px;flex-direction:column;text-align:center}}