@font-face{font-family:Bricolage;src:url('../assets/fonts/bricolage-grotesque.ttf') format('truetype');font-weight:200 800;font-display:swap}
@font-face{font-family:DM;src:url('../assets/fonts/dm-sans.ttf') format('truetype');font-weight:100 1000;font-display:swap}
:root{--ivory:#f7f4ed;--navy:#10243a;--ink:#30343b;--blue:#155eef;--paper:#e6edfa;--muted:#536170;color:var(--ink);background:var(--ivory);font:18px/1.5 DM,sans-serif;scrollbar-color:#536170 #f7f4ed}
*{box-sizing:border-box}body{margin:0}::selection{background:#155eef;color:white}a{color:inherit;text-underline-offset:5px}button,input,textarea{font:inherit}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}button:focus-visible,a:focus-visible,textarea:focus-visible,input:focus-visible{outline:3px solid var(--blue);outline-offset:5px}textarea{caret-color:var(--blue)}
.skip{position:absolute;top:-90px;left:20px;padding:12px;background:white;z-index:4}.skip:focus{top:12px}header{max-width:1340px;margin:auto;padding:25px 48px;display:flex;align-items:center;justify-content:space-between;gap:22px}header img{display:block;width:122px;height:auto}nav{display:flex;gap:28px;font-size:15px}main{max-width:1340px;margin:auto;padding:24px 48px 0}h1,h2,blockquote{font-family:Bricolage,sans-serif;color:var(--navy)}h1{font-size:clamp(44px,5.9vw,80px);line-height:1.02;letter-spacing:-.035em;margin:0;text-wrap:balance}h2{font-size:25px;line-height:1.2;margin:0}.title-row{display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:48px}.title-row p{font-size:14px;color:var(--muted);margin:0 0 4px;max-width:34ch}.title-row span{display:block;margin-top:12px;font-size:18px;color:var(--ink)}
.rehearsal{border-top:1px solid #aeb8c4}.scene-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0}.scene-heading p{font-size:14px;margin:0;color:var(--muted)}.stage{position:relative;min-height:330px;background:var(--navy);padding:32px 110px 36px 40px;color:var(--ivory)}.speaker{font-size:15px;color:#afcbff}.stage blockquote{font-size:clamp(29px,3.7vw,49px);line-height:1.15;letter-spacing:-.025em;color:var(--ivory);max-width:31ch;margin:23px 0;text-wrap:balance;overflow-wrap:anywhere}.stage p{color:#d4e0f0;font-size:16px;max-width:62ch;margin:24px 0 0}.stage-index{position:absolute;right:30px;bottom:28px;display:flex;align-items:baseline;gap:9px;font-family:Bricolage;color:#afcbff}.stage-index span:first-child{font-size:45px;color:var(--ivory)}.stage[data-frame="2"]{background:#17385c}.stage[data-frame="own"]{background:#123f8a}
.timeline{list-style:none;display:flex;margin:0;padding:0;border-bottom:1px solid #aeb8c4}.timeline li{flex:1}.timeline button{width:100%;min-height:65px;display:flex;align-items:center;gap:12px;padding:12px 18px;border:0;border-bottom:3px solid transparent;background:none;color:var(--muted);text-align:left;font-size:16px}.timeline button span{font-variant-numeric:tabular-nums}.timeline button[aria-current]{color:var(--blue);border-bottom-color:var(--blue);font-weight:700}.timeline button:hover{background:#e6edfa}.director{display:flex;justify-content:space-between;align-items:end;gap:26px;padding:30px 0}fieldset{border:0;padding:0;margin:0;min-width:0}legend{font-size:16px;font-weight:700;margin-bottom:12px}.choices{display:flex;gap:22px}.choices label{display:flex;align-items:center;gap:9px;font-size:16px;cursor:pointer;min-height:44px}.choices input{width:20px;height:20px;accent-color:var(--blue)}.transport{display:flex;align-items:center;gap:14px}button#next,.writing-actions button:first-child{display:flex;align-items:center;justify-content:center;gap:15px;border:0;background:var(--blue);color:white;padding:13px 20px;min-height:48px;border-radius:6px;font-weight:600;font-size:16px}button#next:hover,.writing-actions button:first-child:hover{background:#0f47ba}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;flex-shrink:0}.quiet{background:transparent;border:0;text-decoration:underline;text-underline-offset:5px;color:var(--navy);font-size:15px;min-height:44px;padding:9px 7px}.quiet:hover{color:var(--blue)}
.your-turn{display:grid;grid-template-columns:1fr 1.4fr;gap:65px;margin-top:44px;padding:42px 0;border-top:1px solid #aeb8c4}.your-turn h2{font-size:32px}.your-turn p{font-size:16px;max-width:42ch}.your-turn a{font-size:16px}.writing label{display:block;font-weight:600;font-size:16px;margin-bottom:10px}.writing textarea{width:100%;resize:vertical;min-height:120px;border:1px solid #8995a3;border-radius:6px;background:#fff;color:var(--navy);padding:16px}.writing textarea::placeholder{color:var(--muted)}.writing-actions{display:flex;gap:12px;margin-top:14px;flex-wrap:wrap}.writing p{font-size:13px;color:var(--muted);max-width:none}footer{display:flex;justify-content:space-between;gap:24px;border-top:1px solid #aeb8c4;padding:26px 0 42px;font-size:14px}footer p{margin:0;color:var(--muted);max-width:44ch}
@media(min-width:1001px){main{padding-top:6px}.title-row{margin-bottom:28px}h1{font-size:64px}.stage{min-height:270px;padding-top:26px;padding-bottom:28px}.stage blockquote{font-size:43px;margin:18px 0}.stage p{margin-top:18px}.director{padding:22px 0}}
@media(max-width:1000px){header,main{padding-left:28px;padding-right:28px}.director{display:block}.transport{margin-top:20px}.your-turn{gap:35px}.title-row{align-items:start}.title-row p{max-width:26ch}.stage{min-height:310px}}
@media(max-width:620px){header{padding:20px}header img{width:93px}nav{gap:16px;font-size:13px}main{padding:20px}.title-row{display:block;margin-bottom:28px}.title-row p{max-width:none;margin-top:20px}.title-row span{margin-top:8px}.scene-heading{display:block;padding:18px 0}.scene-heading h2{font-size:23px}.scene-heading p{margin-top:8px}.stage{padding:24px 24px 70px;min-height:360px}.stage blockquote{font-size:32px}.stage p{font-size:15px}.stage-index{right:22px;bottom:16px}.stage-index span:first-child{font-size:28px}.timeline button{padding:14px 7px;gap:6px;font-size:13px;min-height:68px;align-items:baseline}.choices{display:block}.choices label{margin-bottom:5px}.transport{justify-content:space-between;gap:8px}.your-turn{display:block;margin-top:22px;padding:30px 0}.writing{margin-top:30px}footer{display:block;padding-bottom:20px}footer p{margin-top:18px}}
@media(prefers-reduced-motion:no-preference){.stage[data-changing="yes"] blockquote{animation:rehearse .35s cubic-bezier(.16,1,.3,1)}@keyframes rehearse{from{transform:translateY(7px);opacity:.65}to{transform:translateY(0);opacity:1}}}
