:root{--ink:#111619;--cream:#f4f0e8;--gold:#c4a373;--muted:#c1c4c1;--line:rgba(255,255,255,.2)}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--ink);color:var(--cream);font-family:Arial,Helvetica,sans-serif}body{font-size:16px}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{opacity:.45;cursor:default}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:5px}#app{position:relative;min-height:100svh;overflow:hidden;isolation:isolate;display:flex;flex-direction:column}#backdrop,.veil{position:absolute;inset:0;z-index:-2}#backdrop{background:center 46%/cover no-repeat url('assets/street.webp');transition:background-image .8s,opacity 1s,transform 3s;opacity:.7;animation:breathe 22s infinite alternate}.veil{z-index:-1;background:linear-gradient(180deg,rgba(11,17,20,.45),rgba(11,17,20,.12) 25%,rgba(11,17,20,.8) 63%,#111619 100%)}header{display:flex;justify-content:space-between;align-items:center;padding:24px 6vw;gap:20px}.brand{display:block;background:#fff;padding:9px 12px;width:128px;line-height:0}.brand img{width:100%;height:auto}.icon-btn{border:1px solid var(--line);border-radius:100px;color:var(--cream);padding:12px 15px;background:#11161990;font-size:14px;min-height:44px}.icon-btn[aria-pressed=true]{border-color:var(--gold)}main{width:min(100%,650px);padding:24px 28px 30px;margin:auto;flex:1;display:flex;flex-direction:column;justify-content:flex-end;outline:0;min-height:590px}main>*{animation:arrive .75s both}main h1{font-size:clamp(48px,12.7vw,78px);font-weight:500;letter-spacing:-.055em;line-height:.97;margin:24px 0}main h2{font-size:clamp(32px,8vw,50px);font-weight:400;letter-spacing:-.04em;line-height:1.12;margin:18px 0 24px}main p{font-size:18px;line-height:1.6;max-width:500px}.eyebrow{font-size:12px!important;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}.credit{font-size:12px!important;line-height:1.5;color:#e5ded2;max-width:240px}.intro-copy{position:relative;min-height:115px;margin:18px 0 25px}.intro-copy p{margin:0;position:absolute;inset:0;opacity:0;animation:intro 4s forwards}.intro-copy p:nth-child(2){animation-delay:4s}.intro-copy p:nth-child(3){animation-delay:8s;animation-name:introLast}.primary,.secondary,.choice{width:100%;min-height:58px;padding:17px 22px;text-align:left;border:0;border-radius:2px;line-height:1.4}.primary{background:var(--cream);color:var(--ink);font-size:14px;letter-spacing:.06em;font-weight:600;display:flex;justify-content:space-between;align-items:center}.primary .mark{width:19px;height:19px;border:1px solid #6e6454;border-radius:50%;display:block;position:relative}.primary .mark:before{content:'';position:absolute;width:4px;height:4px;background:#6e6454;border-radius:50%;top:6px;left:6px}.secondary{margin-top:12px;background:transparent;color:var(--cream);border:1px solid var(--line);font-size:14px}.choice{margin:6px 0;background:#111619b8;border:1px solid #ffffff4d;color:var(--cream);display:flex;gap:16px;align-items:center;backdrop-filter:blur(12px)}.choice:hover{border-color:var(--gold);background:#272723}.choice .letter{color:var(--gold);font-size:13px;min-width:20px}.choice.selected{border-color:var(--gold);background:#403526}.choice.correct{border-color:#b8c8b4}.choice.wrong{border-color:#c6a38e}.hint,.small{font-size:13px!important;color:var(--muted);line-height:1.6!important}.small-link{font-size:13px;color:var(--gold);background:none;border:0;padding:14px 0;min-height:44px}.large-quote{font-family:Georgia,'Times New Roman',serif;font-size:clamp(32px,8vw,47px)!important;font-weight:400;line-height:1.3!important}.rule{height:1px;width:48px;background:var(--gold);margin:28px 0}.center{text-align:center;justify-content:center}.center p{margin-left:auto;margin-right:auto}.scene-copy{min-height:130px}.scene-1 main{justify-content:center}.scene-1 #backdrop{animation:lower 4s forwards,breathe 22s 4s infinite alternate}.scene-6 #backdrop{opacity:0}.scene-7 #backdrop{animation:rise 4s forwards}.scene-3 #backdrop{animation:hesitate 12s infinite alternate}.scene-4 #backdrop{filter:sepia(.12);animation:heat 8s infinite alternate}.flash #backdrop{opacity:0!important}.black{background:#090c0e}.black .veil{background:#090c0e}.black #backdrop{opacity:0}.quiz #backdrop,.success #backdrop,.form #backdrop,.exports #backdrop{opacity:.12}.quiz main{justify-content:center}.quiz h2{font-size:30px;line-height:1.28}.feedback{padding:16px 20px;border-left:2px solid var(--gold);background:#ffffff08;margin:18px 0;font-size:16px!important}.score{font-size:60px;letter-spacing:-.08em;margin:22px 0;color:var(--gold)}.score small{font-size:18px;letter-spacing:0;color:var(--muted)}footer{padding:0 28px 22px;width:min(100%,650px);margin:0 auto}#progress{height:2px;background:#ffffff20;position:relative}#progress:before{content:'';position:absolute;inset:0 auto 0 0;width:var(--progress,0%);background:var(--gold);transition:width 1s}.footer-line{display:flex;align-items:center;gap:16px;margin-top:14px}#chapter{font-size:10px;letter-spacing:.13em;color:var(--muted);margin-right:auto}.text-btn{border:0;background:none;color:var(--muted);font-size:12px;padding:10px 0;min-height:44px}.field{margin:12px 0 20px}label{display:block;font-size:14px;margin-bottom:8px}input{width:100%;background:#ffffff08;border:1px solid var(--line);border-radius:2px;font:inherit;font-size:18px;color:var(--cream);padding:16px;min-height:56px}canvas.preview{width:100%;height:auto;border:1px solid var(--gold);display:block;margin:24px 0}.story-preview{max-width:250px;margin:24px auto!important}.tabs{display:flex;border-bottom:1px solid var(--line);gap:24px}.tabs button{border:0;background:none;color:var(--muted);padding:16px 0;font-size:14px}.tabs button.active{border-bottom:2px solid var(--gold);color:var(--cream)}dialog{background:var(--cream);color:var(--ink);border:0;padding:35px;max-width:520px;width:calc(100% - 32px);max-height:85svh;overflow:auto}dialog::backdrop{background:#000a}dialog p{font-size:16px;line-height:1.6}dialog a{display:block;padding:12px 0}dialog .small{color:#555}dialog .young{width:110px;height:auto}.close{float:right;border:0;background:transparent;font-size:30px;min-width:44px;min-height:44px}.status{font-size:14px;line-height:1.5;color:var(--gold);min-height:22px}#artifacts{display:none}@keyframes arrive{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes intro{0%{opacity:0;transform:translateY(10px)}15%,85%{opacity:1;transform:translateY(0)}100%{opacity:0}}@keyframes introLast{0%{opacity:0;transform:translateY(10px)}15%,100%{opacity:1;transform:translateY(0)}}@keyframes breathe{from{transform:scale(1.02)}to{transform:scale(1.09) translateX(-1%)}}@keyframes lower{from{transform:scale(1.3) translateY(13%);background-position:50% 0}to{transform:scale(1);background-position:50% 75%}}@keyframes rise{from{transform:scale(1);background-position:50% 75%}to{transform:scale(1.16) translateY(5%);background-position:50% 20%}}@keyframes hesitate{from{transform:scale(1.01) translateX(-.6%)}to{transform:scale(1.06) translateX(.6%)}}@keyframes heat{from{transform:scale(1.02);filter:sepia(.1)}to{transform:scale(1.08);filter:sepia(.2) brightness(1.1)}}@media(min-width:800px){#app{min-height:100vh}header{padding:30px 45px}main{margin-left:8vw;max-width:620px;padding:30px 0}footer{margin-left:8vw;padding:0 0 20px;max-width:620px}#backdrop{background-position:70% 50%;background-size:cover}.veil{background:linear-gradient(90deg,#111619f2,rgba(17,22,25,.65) 45%,rgba(17,22,25,.12)),linear-gradient(0deg,#111619,transparent 60%)}.center{text-align:left}.center p{margin-left:0}.exports main{max-width:750px;width:70%}}@media(max-height:720px){main{min-height:480px;padding-top:10px}main h1{font-size:50px}.intro-copy{min-height:100px}header{padding-top:16px;padding-bottom:8px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.intro-copy{position:static;min-height:0}.intro-copy p{position:static;opacity:1;margin-bottom:12px}}@media print{body>*{display:none!important}body>#print-art{display:block!important;width:100%}}
.fear{animation-delay:2s!important}.paused *{animation-play-state:paused!important}