@font-face{font-family:Bricolage;src:url('../fonts/BricolageGrotesque.ttf') format('truetype');font-style:normal;font-weight:200 800;font-display:swap}
:root{--ink:#0b1224;--cream:#f8f5df;--lime:#ddf1a4;--muted:#c6cfd6;--line:#f8f5df26;--display:'Barlow Condensed','Arial Narrow',sans-serif;--body:'DM Sans',Arial,sans-serif}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--ink);color:var(--cream);font-family:var(--body)}body{height:100dvh;overflow:hidden}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button,input,textarea{font:inherit}button,a{touch-action:manipulation}button{color:inherit;background:none;border:0;cursor:pointer}a{color:inherit;text-decoration:none}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--lime);outline-offset:5px}h1,h2,p,figure{margin:0}button{min-height:40px}h1,h2{font-family:var(--display);font-weight:600;letter-spacing:-.004em;line-height:.88;text-transform:uppercase}h1{font-size:clamp(48px,5.5vw,82px)}h2{font-size:42px}p{line-height:1.6}fieldset{border:0;padding:0;margin:0}input[type=range]{width:100%;height:20px;accent-color:var(--lime);cursor:pointer;margin:8px 0 22px}input[type=range]::-webkit-slider-runnable-track{height:2px;background:#d9e8d84d}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;margin-top:-7px}input[type=range]:disabled{cursor:default}textarea,input[type=text],.story-lines input{color:var(--cream);border:0;border-bottom:1px solid #f3f0d95c;border-radius:0;background:none}textarea{resize:vertical;min-height:85px;max-height:160px;line-height:1.45}button img{pointer-events:none}[hidden]{display:none!important}.eyebrow{font-size:9px;line-height:1.5;letter-spacing:.16em;font-weight:600}.text-button{font-size:12px;padding:0;display:inline-flex;align-items:center;gap:16px;text-align:left}.text-button:hover{color:var(--lime)}.solid-button,.outline-button{display:flex;align-items:center;justify-content:space-between;gap:25px;width:100%;padding:14px 19px;min-height:49px;font-size:12px;transition:background .15s,transform .15s}.solid-button{background:var(--cream);color:var(--ink)}.solid-button:hover{background:var(--lime);transform:translateY(-1px)}.outline-button{border:1px solid #e6ebd65c;color:var(--cream)}.outline-button:hover{background:#ffffff0c}.solid-button span{font-size:19px}.segmented{display:flex;gap:2px;border:1px solid #dee8d43b;padding:3px}.segmented button{flex:1;padding:8px 10px;min-height:34px;font-size:10px;white-space:nowrap}.segmented button[aria-pressed=true]{background:#dce9d21c;color:var(--lime)}
.study-header{position:fixed;inset:0 0 auto;height:88px;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;gap:20px}.wordmark{font:650 15px var(--display);letter-spacing:.06em;white-space:nowrap}.wordmark span{color:var(--lime);font-size:24px;margin-right:8px}.study-label{font-size:8px;letter-spacing:.15em;display:flex;align-items:center;gap:13px;color:#c4d0c8}.study-label i{display:block;width:3px;height:3px;background:#dceda5;border-radius:50%}.compare-trigger{font-size:10px}.compare-trigger span{font-size:16px}.experience{position:absolute;inset:0 0 91px;overflow:hidden}.study-nav{position:fixed;inset:auto 0 0;height:91px;z-index:30;display:flex;align-items:stretch;justify-content:center;gap:0;background:#081923f5;border-top:1px solid var(--line);padding:0 4vw;backdrop-filter:blur(20px)}.nav-prefix{align-self:center;font-size:8px;letter-spacing:.14em;color:#a6b5b1;margin-right:auto;width:130px}.study-nav>a{display:flex;align-items:center;gap:12px;position:relative;font-size:13px;padding:0 22px;min-width:175px}.study-nav>a>span{font-size:8px;align-self:flex-start;margin-top:24px;color:#9caeac}.study-nav>a>small{position:absolute;bottom:19px;left:47px;font-size:7px;letter-spacing:.12em;color:#a8b8b0;opacity:0;transition:opacity .2s}.study-nav>a[aria-current]{color:var(--lime);border-top:2px solid var(--lime);background:#dceda506}.study-nav>a[aria-current]>small{opacity:1}.study-nav>a[aria-current]{padding-bottom:10px}.study-nav>a:hover{color:var(--lime)}.about-button{align-self:center;margin-left:auto;border:1px solid #e6ebd63b;border-radius:100%;width:27px;height:27px;min-height:27px;font-family:Georgia,serif;font-style:italic;font-size:14px}.source-whisper{position:absolute;bottom:21px;left:4vw;font-size:8px;color:#abbfbc}.world-view{background:#061f2d}#world-canvas{position:absolute;inset:0;width:100%;height:100%;cursor:grab;touch-action:none}#world-canvas:active{cursor:grabbing}.world-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#04131c70,transparent 42%,transparent 65%,#03151f58),linear-gradient(#05121b58,transparent 30%,transparent 50%,#05141bc2)}.world-intro{position:absolute;left:5.3vw;top:19%;pointer-events:none}.world-intro .eyebrow{margin-bottom:24px;color:var(--lime)}.world-intro h1{font-size:clamp(58px,6.8vw,100px)}.world-intro>p:last-child{font-size:13px;line-height:1.8;margin-top:26px;color:#d6e3db}.world-coordinate{position:absolute;top:18%;left:53%;display:flex;gap:10px;align-items:center;pointer-events:none}.world-coordinate>span:first-child{font-size:28px;font-weight:200}.world-coordinate>span:last-child{font-size:8px;letter-spacing:.12em;color:#d2e4dc}.world-peek{position:absolute;right:4vw;top:105px;font-size:10px}.world-peek span{font-size:21px}.world-choices{position:absolute;left:5.3vw;bottom:79px}.world-choices>.eyebrow{font-size:8px;letter-spacing:.1em;color:#ccdad2;margin-bottom:15px}.sky-options{display:flex;gap:16px}.sky-options button{padding:0;width:107px;text-align:left;position:relative}.sky-options button>span{display:block;height:62px;background-size:cover;background-position:center 35%;border:1px solid #dce9da2f;transition:transform .2s}.sky-options button>b{display:block;font-size:9px;font-weight:400;margin-top:8px}.sky-options button[aria-pressed=true]>span{outline:1px solid var(--lime);outline-offset:4px}.sky-options button[aria-pressed=true]>b{color:var(--lime)}.sky-options button:hover>span{transform:translateY(-2px)}.world-controls{position:absolute;width:264px;right:4vw;bottom:69px;padding:22px 22px 10px;border:1px solid #dce9d431;background:#041721a6;backdrop-filter:blur(14px)}.control-title{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #dce9d42b;padding-bottom:17px;margin-bottom:22px;font-size:12px}.control-title>span:last-child{font-size:23px;color:var(--lime)}.range-label{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:10px}.range-label output,.range-label>span{color:#a6bcb9;font-size:9px}.traffic legend{font-size:10px;margin-bottom:12px}.pause-line{margin:16px 0 10px;font-size:10px}.world-controls .solid-button{font-size:10px;padding:11px 12px;min-height:45px;gap:10px}.world-handoff{font-size:9px;display:flex;justify-content:space-between;width:100%;margin-top:8px}.world-handoff>span{font-size:16px}.drag-hint{position:absolute;bottom:40%;left:52%;font-size:9px;color:#dce9e0aa;pointer-events:none}.drag-hint span{display:block;font-size:23px;text-align:center}.world-view.tools-hidden .world-intro,.world-view.tools-hidden .world-controls,.world-view.tools-hidden .world-choices,.world-view.tools-hidden .world-coordinate,.world-view.tools-hidden .world-peek,.world-view.tools-hidden .drag-hint,.world-view.tools-hidden .source-whisper{display:none}.world-view.tools-hidden .world-shade{opacity:.2}#restore-tools{position:absolute;bottom:35px;left:50%;transform:translateX(-50%);width:auto;gap:40px;background:#061923c9;color:var(--cream);border:1px solid var(--line)}
.postcard-view{background:radial-gradient(ellipse at 54% 40%,#354c42 0,#152d2c 45%,#0b2028 85%)}.postcard-orbit{width:730px;height:730px;border:1px solid #e2efca10;border-radius:50%;position:absolute;left:50%;top:49%;transform:translate(-50%,-50%);pointer-events:none}.postcard-orbit:after{content:"";position:absolute;inset:60px;border:1px solid #e2efca0a;border-radius:50%}.postcard-layout{display:grid;grid-template-columns:minmax(240px,1fr) minmax(250px,1.1fr) minmax(210px,.8fr);align-items:center;gap:5vw;height:100%;padding:98px 6vw 55px}.postcard-copy>.eyebrow{color:var(--lime);margin-bottom:21px}.postcard-copy h1{font-size:clamp(44px,5.2vw,78px)}.postcard-copy>p:not(.eyebrow){margin-top:20px;font-size:12px;color:#cbdad0;line-height:1.8}.field-label{display:block;font-size:10px;margin:29px 0 12px}.postcard-copy textarea{width:100%;font:400 20px/1.4 var(--display);padding:0 0 12px;resize:none}.message-foot{display:flex;align-items:center;justify-content:space-between;gap:15px}.message-foot>span{font-size:8px;color:#a7bbb2}.message-foot>button{font-size:9px}.postcard-object{min-width:0;position:relative;justify-self:center;width:min(100%,345px)}.postcard-mat{padding:9px;background:#efe9ce;position:relative;transform:rotate(-3deg);box-shadow:12px 28px 55px #0006;transition:transform .5s}.postcard-mat:hover{transform:rotate(0)}#postcard-canvas{display:block;width:100%;aspect-ratio:2/3}.postcard-pin{position:absolute;top:-7px;right:36px;width:11px;height:11px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f4edc9,#b49156);box-shadow:1px 3px 4px #0006}.postcard-object figcaption{display:flex;justify-content:space-between;align-items:center;margin-top:24px;font-size:7px;letter-spacing:.12em}.postcard-object figcaption button{font-size:10px;letter-spacing:0}.postcard-tools>.eyebrow{font-size:8px;letter-spacing:.12em;max-width:180px;line-height:1.8}.reaction-tray{display:flex;flex-direction:column;gap:4px;margin:13px 0 24px}.reaction-tray button{display:flex;align-items:center;gap:17px;text-align:left;padding:7px 4px;border-bottom:1px solid #d8e6d421;position:relative;min-height:72px}.reaction-tray img{width:63px;height:63px;object-fit:contain}.reaction-tray button>span:last-child{font-size:11px}.reaction-tray button[aria-pressed=true]{color:var(--lime)}.reaction-tray button[aria-pressed=true]:after{content:"✓";margin-left:auto;font-size:12px}.reaction-tray .type-only{font:40px var(--display);width:63px;text-align:center}.palette-options{display:flex;gap:14px;margin:16px 0 28px;align-items:center}.palette-options button{width:27px;height:27px;min-height:27px;border-radius:50%;background:var(--swatch);border:1px solid #f1f1d449}.palette-options button[aria-pressed=true]{outline:1px solid var(--cream);outline-offset:4px}.palette-options .world-swatch{background:url('assets/aurora-sky.webp') center/cover;font-size:17px}.tool-note{font-size:9px;color:#b6c9be;line-height:1.6;margin-top:13px}.postcard-source{display:flex;align-items:center;gap:10px;margin-top:14px;padding-top:12px;border-top:1px solid #d8e6d421}.postcard-source>span{font-size:23px;color:var(--lime)}.postcard-source>p{font-size:9px;color:#c0d3c7}.postcard-source button{margin-left:auto;font-size:17px}
.scene-view{background:radial-gradient(ellipse at 35% 48%,#3e4540,#1c2b2d 63%,#0b2028)}.scene-layout{max-width:1600px;height:100%;margin:auto;padding:111px 5vw 28px;display:flex;flex-direction:column}.scene-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:27px}.scene-intro .eyebrow{color:var(--lime);margin-bottom:12px}.scene-intro h1{font-size:clamp(44px,4.7vw,66px)}.scene-intro>p{font-size:12px;line-height:1.8;max-width:300px;color:#c7d5cd}.story-workbench{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:4vw;align-items:center;flex:1;min-height:0}.story-sheet{background:#ebe5cf;padding:15px 16px 13px;box-shadow:10px 18px 65px #0004;transform:rotate(-.6deg);color:#21302b;min-width:0;width:100%;align-self:center}.sheet-title,.sheet-caption{display:flex;justify-content:space-between;gap:10px;font-size:7px;letter-spacing:.12em;padding:4px 3px 12px}.sheet-caption{padding:11px 3px 0;font-size:7px;letter-spacing:0}.sheet-title>span:first-child{font-family:var(--display);font-weight:650;letter-spacing:.08em}.story-sheet canvas{display:block;width:100%;aspect-ratio:1.8}.story-direction>.eyebrow{color:var(--lime);font-size:8px;letter-spacing:.12em}.story-direction h2{font-size:33px;margin:10px 0 15px}.ending-options{margin-bottom:21px}.ending-options>button{display:grid;grid-template-columns:24px 1fr;column-gap:8px;width:100%;text-align:left;padding:12px 0;border-bottom:1px solid var(--line);align-items:center}.ending-options>button>span{grid-row:span 2;font-size:20px}.ending-options b{font-size:11px;font-weight:500}.ending-options small{font-size:9px;color:#bac8be;margin-top:3px}.ending-options button[aria-pressed=true] b{color:var(--lime)}.ending-options button[aria-pressed=true]>span{color:var(--lime)}.story-direction input[type=range]{margin-bottom:16px}.story-direction .solid-button,.story-direction .outline-button{font-size:10px;padding:11px 14px;min-height:44px;margin-top:9px}.story-lines{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;width:calc(100% - 240px - 4vw);margin-top:21px}.story-lines label>span{display:block;font-size:7px;letter-spacing:.12em;color:#b6c8be;margin-bottom:10px}.story-lines input{width:100%;font:400 14px var(--display);padding:3px 0 10px;min-width:0}.scene-tip{font-size:8px;color:#b2c2b9;margin-top:12px}
.cinema-view{background:#07151e}.cinema-wash{position:absolute;inset:0;opacity:.15;background-size:cover;background-position:50% 55%;filter:blur(65px);transform:scale(1.2);pointer-events:none}.cinema-word{position:absolute;left:1vw;top:23%;font:800 clamp(180px,29vw,440px)/1 var(--display);color:#dfecca05;letter-spacing:-.09em;pointer-events:none}.cinema-layout{position:relative;display:grid;grid-template-columns:minmax(235px,1fr) minmax(230px,330px) minmax(220px,.9fr);gap:5vw;max-width:1550px;height:calc(100% - 114px);padding:103px 5.3vw 22px;margin:auto;align-items:center}.cinema-copy>.eyebrow{color:var(--lime);margin-bottom:22px}.cinema-copy h1{font-size:clamp(42px,5vw,72px)}.cinema-intro{font-size:12px;color:#d3ded5;line-height:1.8;margin-top:24px}.cinema-position{font-size:10px;color:#aabdb3;line-height:1.8;margin-top:14px}.film-play{display:flex;align-items:center;gap:14px;margin-top:26px;padding:0;text-align:left}.play-circle{display:grid;place-items:center;width:44px;height:44px;border:1px solid #dceda580;border-radius:50%;color:var(--lime);font-size:14px;padding-left:3px}.film-play>span:last-child{font-size:11px;line-height:1.8}.film-play small{display:block;font-size:8px;color:#aabdb3}.cinema-screen{position:relative;max-height:100%;min-height:0;justify-self:center;width:100%;max-width:295px}.cinema-screen video{display:block;width:100%;max-height:calc(100dvh - 335px);aspect-ratio:9/16;object-fit:contain;box-shadow:0 12px 50px #0009;background:#040c14}.cinema-screen figcaption{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:9px;margin-top:13px;line-height:1.5}.cinema-screen figcaption>span:last-child{font-size:6px;letter-spacing:.12em;color:#b0c1b5;white-space:nowrap}.screen-play{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);width:60px;height:60px;border:1px solid #f1f1d47d;border-radius:50%;background:#071e26ab;backdrop-filter:blur(7px);font-size:19px;padding-left:10px}.screen-play:hover{color:var(--lime);border-color:var(--lime)}.playback-controls{display:flex;align-items:center;gap:12px}.playback-controls .text-button{font-size:8px;white-space:nowrap;min-height:32px}.playback-controls input[type=range]{margin:0;min-width:40px}.film-thinking>.eyebrow{font-size:8px;color:var(--lime);letter-spacing:.1em}.film-thinking h2{font-size:clamp(28px,3.1vw,43px);line-height:1.08;margin:17px 0 20px}.film-thinking>p{font-size:12px;line-height:1.8;max-width:270px;color:#d1ded3}.film-thinking>.text-button{font-size:10px;line-height:1.6;margin-top:20px;align-items:flex-start;max-width:250px}.film-thinking>.text-button span{font-size:19px}.film-rail{position:absolute;bottom:28px;left:5.3vw;right:5.3vw;display:flex;gap:0;border-top:1px solid var(--line)}.film-rail>button{position:relative;flex:1;text-align:left;border-right:1px solid var(--line);padding:18px 15px 0;min-width:0}.film-rail>button:first-child{padding-left:0}.film-rail>button:last-child{border-right:0}.film-rail small{display:flex;justify-content:space-between;font-size:7px;color:#96ada7;letter-spacing:.08em;margin-bottom:8px}.film-rail b{font:500 clamp(17px,2vw,27px) var(--display);letter-spacing:-.025em}.film-rail>button[aria-pressed=true]{color:var(--lime)}.film-rail>button[aria-pressed=true]:before{content:"";position:absolute;top:-1px;left:0;right:0;height:2px;background:var(--lime)}.film-rail>button:hover{color:var(--lime)}
dialog{color:var(--cream);border:1px solid #dce9d43b;padding:0;max-width:calc(100vw - 40px);max-height:calc(100dvh - 40px);background:#10242c;box-shadow:0 30px 130px #000a}dialog::backdrop{background:#030e18d4;backdrop-filter:blur(15px)}.dialog-close{position:absolute;top:16px;right:20px;width:40px;height:40px;font-size:25px;color:#d8e6d2;z-index:2}.takeaway-dialog{width:830px;display:grid;grid-template-columns:1fr .9fr;gap:40px;padding:45px}.takeaway-dialog:not([open]){display:none}.takeaway-image{min-width:0;display:flex;align-items:center;justify-content:center;max-height:72vh}.takeaway-image img{max-height:72vh;max-width:100%;object-fit:contain;box-shadow:0 10px 40px #0006}.takeaway-copy{align-self:center}.takeaway-copy .eyebrow{color:var(--lime);margin-bottom:20px}.takeaway-copy h2{font-size:44px}.takeaway-copy>p:not(.eyebrow):not(.tool-note){font-size:12px;line-height:1.8;color:#cad9cb;margin:23px 0}.takeaway-copy .text-button{font-size:10px;margin-top:13px}.takeaway-dialog.landscape{width:1040px;grid-template-columns:1.4fr .8fr}.about-dialog{width:710px;padding:50px}.about-dialog>.eyebrow{font-size:8px;color:var(--lime);margin-bottom:20px}.about-dialog h2{font-size:44px}.about-dialog>p:not(.eyebrow){margin-top:24px;color:#c6d5c8;font-size:13px}.about-dialog dl{margin:30px 0}.about-dialog dt{font-size:11px;color:var(--lime);margin-top:20px}.about-dialog dd{font-size:11px;line-height:1.8;margin:7px 0;color:#c5d5c8}.toast{position:fixed;bottom:112px;left:50%;transform:translate(-50%,12px);background:var(--cream);color:var(--ink);padding:13px 23px;z-index:70;font-size:12px;box-shadow:0 8px 35px #0004;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none;max-width:90vw;text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}
@media(min-width:1500px){.world-controls{bottom:90px;width:290px}.world-choices{bottom:100px}.postcard-layout{max-width:1600px;margin:auto}.postcard-object{width:370px}.postcard-tools{max-width:250px}.story-sheet{max-width:1000px}.cinema-screen{max-width:330px}}
@media(max-height:790px) and (min-width:901px){.study-header{height:72px}.experience{bottom:78px}.study-nav{height:78px}.study-nav>a{font-size:12px}.study-nav>a>small{bottom:15px}.study-nav>a>span{margin-top:19px}.world-intro{top:18%}.world-intro h1{font-size:74px}.world-intro>p:last-child{margin-top:17px}.world-intro .eyebrow{margin-bottom:16px}.world-controls{bottom:53px;padding:15px 18px 8px;width:250px}.control-title{padding-bottom:10px;margin-bottom:14px}.world-controls input[type=range]{margin-bottom:13px}.world-choices{bottom:63px}.postcard-layout{padding-top:85px;padding-bottom:35px;gap:5vw}.postcard-object{width:min(100%,285px)}.postcard-copy h1{font-size:57px}.postcard-copy>p:not(.eyebrow){margin-top:14px}.field-label{margin-top:20px}.postcard-copy textarea{font-size:18px}.postcard-object figcaption{margin-top:18px}.reaction-tray{gap:0;margin-bottom:15px}.reaction-tray img{width:52px;height:52px}.reaction-tray button{min-height:62px}.palette-options{margin-bottom:21px}.scene-layout{padding-top:90px;padding-bottom:20px}.scene-intro{margin-bottom:15px}.scene-intro h1{font-size:49px}.story-direction h2{font-size:27px;margin:8px 0 10px}.ending-options{margin-bottom:14px}.ending-options>button{padding:9px 0}.story-direction input[type=range]{margin-bottom:10px}.story-lines{margin-top:16px}.scene-tip{margin-top:7px}.cinema-layout{padding-top:83px;gap:5vw;height:calc(100% - 100px)}.cinema-screen{max-width:254px}.cinema-screen video{max-height:calc(100dvh - 290px)}.cinema-copy h1{font-size:56px}.cinema-copy>.eyebrow{margin-bottom:17px}.cinema-intro{margin-top:17px}.film-play{margin-top:19px}.film-thinking h2{font-size:32px;margin:13px 0 14px}.film-thinking>p{font-size:11px}.film-rail{bottom:21px}.film-rail>button{padding-top:13px}}
@media(max-width:1100px) and (min-width:761px){.study-label{display:none}.study-nav{padding:0 20px}.nav-prefix{display:none}.study-nav>a{min-width:0;flex:1;font-size:12px;padding-left:15px;padding-right:10px}.study-nav>a>small{left:38px;font-size:6px}.about-button{margin-left:18px}.world-controls{right:3vw;width:240px}.world-intro{left:5vw}.world-intro h1{font-size:70px}.world-coordinate{left:51%;font-size:7px;top:25%}.drag-hint{display:none}.postcard-layout{gap:3vw;padding-left:4vw;padding-right:4vw;grid-template-columns:1fr 1.1fr .8fr}.postcard-copy h1{font-size:54px}.postcard-copy textarea{font-size:17px}.postcard-tools>.eyebrow{font-size:7px}.reaction-tray button{gap:9px}.reaction-tray button>span:last-child{font-size:10px}.reaction-tray img,.reaction-tray .type-only{width:50px}.postcard-tools .solid-button{font-size:10px;padding:12px}.story-workbench{grid-template-columns:minmax(0,1fr) 210px;gap:3vw}.story-lines{width:calc(100% - 210px - 3vw)}.cinema-layout{grid-template-columns:1fr minmax(210px,.9fr) 1fr;gap:3vw;padding-left:4vw;padding-right:4vw}.cinema-copy h1{font-size:50px}.cinema-position br{display:none}.film-thinking h2{font-size:31px}.film-thinking>p{font-size:11px}}
@media(max-width:760px){body{height:auto;min-height:100dvh;overflow:auto}.study-header{height:69px;padding:0 21px;background:linear-gradient(#091b25b9,transparent);gap:15px}.wordmark{font-size:12px}.wordmark span{font-size:19px}.study-label{display:none}.compare-trigger{font-size:8px;gap:7px;max-width:137px;line-height:1.5}.compare-trigger span{font-size:17px}.experience{position:relative;inset:auto;min-height:calc(100dvh - 77px);overflow:hidden}.study-nav{height:77px;padding:0 8px;justify-content:space-between;background:#081923fa}.nav-prefix,.about-button{display:none}.study-nav>a{display:flex;flex-direction:column;justify-content:center;gap:5px;align-items:center;min-width:0;flex:1;font-size:10px;padding:3px 3px 0;text-align:center}.study-nav>a>span{position:static;margin:0;align-self:center;font-size:7px}.study-nav>a>small{display:none}.study-nav>a[aria-current]{padding-bottom:0}.world-view{height:max(810px,calc(100dvh - 77px))}.world-intro{top:111px;left:25px}.world-intro .eyebrow{font-size:8px;margin-bottom:17px}.world-intro h1{font-size:62px}.world-intro>p:last-child{font-size:11px;margin-top:17px}.world-coordinate{top:180px;right:23px;left:auto;flex-direction:column;align-items:flex-end;gap:5px}.world-coordinate>span:last-child{font-size:6px;writing-mode:vertical-rl}.world-peek{top:76px;right:22px;font-size:9px}.world-peek span{font-size:18px}.world-choices{left:24px;bottom:320px}.world-choices>.eyebrow{font-size:7px;margin-bottom:11px}.sky-options{gap:14px}.sky-options button{width:85px}.sky-options button>span{height:46px}.sky-options button>b{font-size:8px}.world-controls{left:24px;right:24px;bottom:42px;width:auto;padding:16px 16px 12px;display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.control-title{grid-column:1/-1;margin:0 0 14px;padding:0 0 10px;font-size:11px}.control-title>span:last-child{font-size:19px}.world-controls .range-label{font-size:9px}.world-controls .range-label:first-of-type{grid-column:1;grid-row:2}.world-controls #horizon{grid-column:1;grid-row:3}.world-controls label[for=look]{grid-column:2;grid-row:2}.world-controls #look{grid-column:2;grid-row:3}.world-controls input[type=range]{margin:8px 0 14px}.world-controls .range-label output{font-size:7px}.traffic{grid-column:1/-1}.traffic legend{font-size:9px;margin-bottom:9px}.segmented button{font-size:9px}.pause-line{grid-column:1;font-size:9px;margin:5px 0;min-height:37px}.world-controls .solid-button{grid-column:1/-1;font-size:11px;min-height:42px;padding:8px 13px}.world-handoff{grid-column:2;grid-row:5;font-size:8px;gap:8px;margin:5px 0;line-height:1.5}.world-handoff>span{font-size:15px}.source-whisper{font-size:6px;left:24px;bottom:19px;max-width:90%}.drag-hint{display:none}.world-shade{background:linear-gradient(90deg,#04131c68,transparent 70%),linear-gradient(#05121b50,transparent 25%,#05141b40 58%,#05141b)}#restore-tools{bottom:70px}.postcard-view{padding-bottom:77px}.postcard-layout{display:flex;flex-direction:column;height:auto;padding:106px 25px 45px;gap:28px}.postcard-copy{width:100%;max-width:410px}.postcard-copy>.eyebrow{font-size:8px;margin-bottom:13px}.postcard-copy h1{font-size:49px;line-height:.99}.postcard-copy h1 br:nth-child(2){display:none}.postcard-copy>p:not(.eyebrow){font-size:11px;margin-top:16px}.field-label{font-size:9px;margin-top:20px}.postcard-copy textarea{font-size:19px;min-height:65px;max-height:110px}.postcard-object{width:min(76%,310px);margin:6px auto 0}.postcard-object figcaption{margin-top:19px}.postcard-tools{width:100%;max-width:410px}.postcard-tools>.eyebrow{max-width:none;font-size:7px}.reaction-tray{flex-direction:row;gap:12px;margin:11px 0 21px}.reaction-tray button{flex-direction:column;flex:1;align-items:center;text-align:center;gap:5px;padding:9px 3px;min-height:105px}.reaction-tray img{width:64px;height:64px}.reaction-tray .type-only{font-size:40px;width:auto;height:64px;display:flex;align-items:center}.reaction-tray button>span:last-child{font-size:9px}.reaction-tray button[aria-pressed=true]:after{display:none}.reaction-tray button[aria-pressed=true]{border-bottom-color:var(--lime)}.palette-label{display:inline-block}.palette-options{display:inline-flex;margin:0 0 25px 24px;vertical-align:middle;gap:17px}.tool-note{font-size:8px}.postcard-view .source-whisper{bottom:95px}.postcard-orbit{width:600px;height:600px;top:43%}.scene-view{padding-bottom:77px}.scene-layout{height:auto;padding:105px 22px 28px}.scene-intro{display:block;margin-bottom:23px}.scene-intro h1{font-size:48px}.scene-intro .eyebrow{font-size:8px;margin-bottom:15px}.scene-intro>p{font-size:11px;margin-top:17px}.story-workbench{display:flex;flex-direction:column;gap:25px;min-height:0}.story-sheet{padding:10px 10px 8px;width:100%;transform:rotate(-1deg)}.sheet-title,.sheet-caption{font-size:5px;padding-top:2px;padding-bottom:8px;gap:7px}.sheet-caption{padding-top:8px;padding-bottom:0;font-size:5px}.story-sheet canvas{aspect-ratio:1.8}.story-direction{width:100%}.story-direction .eyebrow{font-size:7px}.story-direction h2{font-size:29px;line-height:1.05;margin:10px 0 16px}.story-direction h2 br{display:none}.ending-options{display:flex;gap:16px;margin-bottom:23px}.ending-options>button{align-content:start;grid-template-columns:22px 1fr;gap:5px;padding:13px 0;flex:1}.ending-options>button>b{font-size:10px}.ending-options>button>small{font-size:8px;grid-column:2;line-height:1.6}.ending-options>button>span{font-size:20px}.story-direction .range-label{font-size:10px}.story-direction input[type=range]{margin-bottom:18px}.story-direction .outline-button,.story-direction .solid-button{font-size:11px}.story-lines{width:100%;grid-template-columns:1fr;gap:18px;margin-top:25px;order:0}.story-lines input{font-size:17px}.scene-tip{font-size:9px;line-height:1.7;margin-top:17px}.cinema-view{padding-bottom:77px}.cinema-layout{display:flex;flex-direction:column;gap:27px;padding:104px 25px 25px;height:auto}.cinema-copy{width:100%;max-width:410px}.cinema-copy>.eyebrow{font-size:8px;margin-bottom:17px}.cinema-copy h1{font-size:51px}.cinema-copy h1 br:last-child{display:none}.cinema-intro{font-size:11px;margin-top:19px}.cinema-position{font-size:10px;margin-top:12px}.cinema-position br{display:none}.film-play{margin-top:18px}.play-circle{width:37px;height:37px;font-size:12px}.film-play>span:last-child{font-size:11px}.cinema-screen{width:75%;max-width:290px;max-height:none}.cinema-screen video{max-height:none;aspect-ratio:9/16}.cinema-screen figcaption{font-size:9px}.cinema-screen figcaption>span:last-child{font-size:6px}.film-thinking{width:100%;max-width:410px}.film-thinking>.eyebrow{font-size:7px}.film-thinking h2{font-size:33px;line-height:1.1;margin:13px 0 18px}.film-thinking>p{font-size:12px;max-width:none}.film-thinking>.text-button{font-size:10px;margin-top:15px}.film-rail{position:relative;left:auto;right:auto;bottom:auto;display:grid;grid-template-columns:repeat(3,1fr);margin:10px 24px 35px;gap:15px 0}.film-rail>button{padding:15px 12px 0;min-height:70px}.film-rail>button:nth-child(4){padding-left:0}.film-rail>button:nth-child(3){border-right:0}.film-rail b{font-size:22px}.film-rail small{font-size:7px}.cinema-word{top:45%;font-size:180px;left:-5%}.takeaway-dialog,.takeaway-dialog.landscape{width:calc(100% - 20px);max-width:none;padding:50px 25px 30px;display:flex;flex-direction:column;gap:28px}.takeaway-image{max-height:45vh}.takeaway-image img{max-height:45vh}.takeaway-copy h2{font-size:38px}.takeaway-copy .eyebrow{font-size:8px;margin-bottom:15px}.takeaway-copy>p:not(.eyebrow):not(.tool-note){font-size:12px;margin:18px 0}.about-dialog{padding:45px 26px 30px;max-width:calc(100vw - 20px)}.about-dialog h2{font-size:35px}.about-dialog>.eyebrow{font-size:7px;line-height:1.8;max-width:240px}.about-dialog>p:not(.eyebrow){font-size:12px}.about-dialog dd{font-size:11px}.dialog-close{top:9px;right:13px}.toast{bottom:95px;font-size:11px;width:max-content}}
@media(max-width:360px){.world-intro h1{font-size:54px}.sky-options button{width:76px}.world-controls{left:18px;right:18px;gap:0 14px}.postcard-copy h1{font-size:43px}.palette-options{margin-left:17px;gap:13px}.study-nav>a{font-size:9px}.story-direction h2{font-size:27px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}.postcard-mat{transform:none}}
/* Give the artwork its full available height without pushing controls off-screen. */
input[type=range]{appearance:none;-webkit-appearance:none;background:transparent;border:0;outline-offset:3px}
input[type=range]::-webkit-slider-runnable-track{height:2px;background:#d9e8d84d;border:0;box-shadow:none}
input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:10px;height:10px;border:0;border-radius:50%;margin-top:-4px;background:var(--lime);box-shadow:0 0 0 4px #dceda509}
input[type=range]::-moz-range-track{height:2px;background:#d9e8d84d;border:0}
input[type=range]::-moz-range-thumb{width:10px;height:10px;border:0;border-radius:50%;background:var(--lime)}
dialog:not([open]){display:none!important}
@media(min-width:761px){
 .story-workbench{grid-template-rows:minmax(0,1fr);container-type:size}
 .story-sheet{width:min(100%,calc((100cqh - 58px)*1.8));justify-self:center}
 .cinema-screen{width:min(100%,calc((100dvh - 330px)*.5625))}
 .cinema-screen video{max-height:none}
}
@media(max-height:690px) and (min-width:761px){
 .story-direction h2{font-size:23px;margin:7px 0}
 .ending-options{margin-bottom:11px}.ending-options>button{padding:7px 0}
 .story-direction input[type=range]{margin-bottom:8px}
 .story-direction .solid-button,.story-direction .outline-button{min-height:37px;padding:8px 12px;margin-top:6px}
 .scene-intro{margin-bottom:11px}.scene-intro h1{font-size:41px}
 .scene-intro .eyebrow{margin-bottom:8px}
}
@media(max-width:760px){.world-choices{bottom:344px}.world-view{margin-bottom:77px}#world-canvas{touch-action:pan-y}}
.story-reel{min-width:0}.story-swipe{display:none}

.film-thinking>.contrast-link{font-size:9px;color:var(--lime);margin-top:12px;min-height:26px;line-height:1.7}

@media(max-width:760px){
 .story-reel{overflow-x:auto;scrollbar-width:thin;scrollbar-color:#a0ae8c #ddd8c5}
 .story-sheet .story-reel canvas{width:840px;max-width:none;height:auto}
 .story-swipe{display:flex;justify-content:space-between;font-size:8px;padding:9px 2px 0;color:#3b4c3e}
 .sheet-title{font-size:7px}.sheet-caption{font-size:6px}
 
}
@media(max-width:760px){
 .postcard-layout{gap:13px;padding-top:102px}
 .postcard-copy{display:contents}
 .postcard-copy>.eyebrow{order:0;width:100%;margin:0}
 .postcard-copy h1{order:1;width:100%;font-size:38px;line-height:1.04}
 .postcard-copy h1 br{display:none}
 .postcard-copy>p:not(.eyebrow){order:2;width:100%;margin:0 0 8px;font-size:10px}
 .postcard-copy>p:not(.eyebrow) br{display:none}
 .postcard-object{order:3;width:225px;margin:8px auto 4px}
 .postcard-object figcaption{margin-top:15px}
 .postcard-copy .field-label{order:4;width:100%;margin:6px 0 0}
 .postcard-copy textarea{order:5;width:100%;min-height:60px}
 .message-foot{order:6;width:100%;margin-top:-5px}
 .postcard-source{order:7;width:100%;margin-top:0}
 .postcard-tools{order:8;margin-top:16px}
 .story-sheet .story-reel canvas{width:780px}
}
/* Study 02: the films are the entrance; the collection is an optional invitation. */
.cinema-make{margin-top:18px;font-size:11px;color:var(--lime);border-bottom:1px solid #dceda54d;min-height:33px}
.cinema-copy .film-play{margin-top:14px}
.film-invitation{border-left:1px solid #dceda565;padding-left:14px;margin-top:20px;max-width:280px}
.film-invitation>.eyebrow{font-size:7px;color:#b0c8ad;letter-spacing:.08em}
.film-invitation>.text-button{font-family:var(--display);font-size:17px;line-height:1.2;letter-spacing:-.025em;margin:6px 0 3px;min-height:38px;align-items:center;color:var(--lime)}
.film-invitation>.text-button>span{font-size:19px;flex:none}
.film-invitation>p{font-size:9px;line-height:1.6;color:#b6c9bf}
/* How they move: two buttons, like the company choice above it. */
#world-motion{margin-top:14px}#world-motion[hidden]{display:none}
.delivery-control{display:flex;align-items:center;gap:8px;font-size:10px;line-height:1.5;margin:0 0 5px;min-height:30px;cursor:pointer}
.delivery-control input{accent-color:var(--lime);width:14px;height:14px;margin:0;cursor:pointer}
.delivery-help{font-size:8px;line-height:1.6;color:#aac0b5;margin-bottom:16px;max-width:190px}
.collection-dialog{width:1060px;padding:31px 42px 22px;background:radial-gradient(ellipse at 21% 45%,#244037,#10252d 72%);overflow:auto}
.collection-heading>.eyebrow{font-size:8px;color:var(--lime);margin-bottom:12px}
.collection-heading h2{font-size:43px;letter-spacing:-.05em}
.collection-heading>p:last-child{font-size:11px;color:#b8cec0;margin-top:11px}
.collection-tabs{display:flex;border-bottom:1px solid var(--line);margin:22px 0 18px;gap:32px}
.collection-tabs>button{padding:0 0 11px;min-height:43px;display:flex;align-items:baseline;gap:12px;border-bottom:2px solid transparent;font:500 18px var(--display);letter-spacing:-.025em}
.collection-tabs>button>span{font:8px var(--body);letter-spacing:0;color:#aabfb4}
.collection-tabs>button[aria-selected=true]{border-color:var(--lime);color:var(--lime)}
.collection-panel{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(265px,1fr);gap:48px;align-items:center;min-height:342px}
.collection-art{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;height:342px;background:radial-gradient(ellipse,#41645142,transparent 70%)}
.collection-art canvas{height:303px;width:auto;max-width:100%;object-fit:contain;box-shadow:8px 15px 30px #0004;transform:rotate(-3deg);border:6px solid #f3ecd7}
.collection-art figcaption{font-size:9px;line-height:1.7;text-align:center;color:#c0d0be;margin-top:18px;max-width:310px}
.collection-choices>.eyebrow{font-size:7px;letter-spacing:.12em;color:#b9cbbf;margin-bottom:10px}
.starter-list{display:flex;flex-direction:column}
.starter-list>button{position:relative;display:grid;grid-template-columns:1fr 20px;text-align:left;padding:10px 0;border-bottom:1px solid var(--line);min-height:51px;gap:3px}
.starter-list b{font:500 17px var(--display);letter-spacing:-.025em}
.starter-list small{font-size:8px;color:#a9bfb3;grid-column:1}
.starter-list>button>span{grid-column:2;grid-row:1/3;align-self:center;opacity:0;color:var(--lime);font-size:19px}
.starter-list>button[aria-pressed=true]{color:var(--lime)}
.starter-list>button[aria-pressed=true]>span{opacity:1}
.starter-list>button:hover{color:var(--lime)}
.starter-detail{font-size:10px;color:#c3d2c6;line-height:1.7;min-height:34px;margin:14px 0}
.collection-choices .solid-button{font-size:11px;min-height:41px;padding:10px 14px}
.collection-choices .tool-note{font-size:8px;line-height:1.65;margin-top:10px}
.collection-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);margin-top:22px;padding-top:12px}
.collection-footer>span{font-size:8px;color:#a9bfb2;line-height:1.7}
.collection-footer>.text-button{font-size:9px;min-height:30px;white-space:nowrap;color:var(--lime)}
.collection-dialog[data-kind=world] .collection-art canvas{transform:rotate(0);border:0;height:310px;box-shadow:0 15px 45px #0005}
.collection-dialog[data-kind=scene] .collection-panel{grid-template-columns:minmax(0,1.65fr) minmax(245px,.85fr);gap:30px}
.collection-dialog[data-kind=scene] .collection-art canvas{width:100%;height:auto;transform:rotate(-2deg);border:8px solid #efe9ce}
.collection-dialog[data-kind=scene] .collection-art figcaption{max-width:none}
@media(min-width:761px){
 .world-controls{padding-top:16px;bottom:44px}.world-controls .control-title{margin-bottom:15px;padding-bottom:12px}
 .world-controls input[type=range]{margin-bottom:14px}.world-controls .pause-line{margin:9px 0 8px}
 .postcard-tools .palette-options{margin-bottom:17px}
 .cinema-layout{grid-template-columns:minmax(230px,1fr) minmax(210px,.85fr) minmax(250px,1fr);gap:4vw}
 .film-thinking h2{font-size:clamp(27px,2.8vw,40px)}
 
 .film-thinking h2{margin-top:11px;margin-bottom:12px}
}
@media(max-height:790px) and (min-width:761px){
 .cinema-copy h1{font-size:53px}.cinema-copy .cinema-position{margin-top:10px}.cinema-intro{margin-top:15px}
 .cinema-make{margin-top:11px;font-size:10px}.film-invitation{margin-top:14px}
 .film-invitation>.text-button{font-size:16px;min-height:32px}.film-thinking>p{line-height:1.7}
 .collection-dialog{padding-top:25px;padding-bottom:16px}.collection-heading h2{font-size:36px}
 .collection-heading>.eyebrow{margin-bottom:9px}.collection-tabs{margin-top:17px;margin-bottom:12px}
 .collection-footer{margin-top:13px;padding-top:9px}
}
@media(max-width:760px){
 .cinema-make{font-size:11px;margin-top:17px}.cinema-copy .film-play{margin-top:13px}
 .film-invitation{margin-top:21px;max-width:none}.film-invitation>.text-button{font-size:20px;min-height:42px}
 .film-invitation>p{font-size:10px}.film-invitation>.eyebrow{font-size:7px}
 .world-view{height:max(865px,calc(100dvh - 77px))}.world-choices{bottom:401px}
 .world-controls #world-motion{grid-column:1/-1;grid-row:5;margin:4px 0 6px}
 .world-controls .pause-line{grid-row:6}.world-controls .world-handoff{grid-row:6}
 .world-controls .solid-button{grid-row:7}.world-controls{bottom:42px}
 .delivery-control{font-size:11px;margin-top:3px}.delivery-help{font-size:9px;max-width:none;margin-bottom:17px}
 .collection-dialog{width:calc(100vw - 20px);max-width:none;padding:37px 22px 19px}
 .collection-heading>.eyebrow{font-size:7px;margin-bottom:14px}.collection-heading h2{font-size:34px;max-width:270px;line-height:1.02}
 .collection-heading>p:last-child{font-size:10px;max-width:250px;margin-top:13px}
 .collection-tabs{gap:0;justify-content:space-between;margin:21px 0 15px}
 .collection-tabs>button{font-size:16px;flex-direction:column;gap:5px;align-items:flex-start;min-height:49px;padding-bottom:9px}
 .collection-tabs>button>span{font-size:7px}
 .collection-panel,.collection-dialog[data-kind=scene] .collection-panel{display:flex;flex-direction:column;gap:20px;min-height:0}
 .collection-art{height:auto;width:100%}.collection-art canvas{height:260px;border-width:5px}
 .collection-art figcaption{font-size:8px;margin-top:13px}
 .collection-dialog[data-kind=world] .collection-art canvas{height:280px}
 .collection-dialog[data-kind=scene] .collection-art canvas{width:100%;height:auto;border-width:5px}
 .collection-choices{width:100%}.starter-list>button{padding:12px 0;min-height:57px}.starter-list b{font-size:18px}
 .starter-list small{font-size:9px}.collection-choices>.eyebrow{font-size:8px}
 .starter-detail{font-size:11px;margin:17px 0}.collection-choices .tool-note{font-size:9px}
 .collection-footer{flex-direction:column;align-items:flex-start;gap:3px;margin-top:19px}
 .collection-footer>span{font-size:8px}.collection-footer>.text-button{font-size:9px}
}
#collection-motion{font-size:8px;min-height:28px;margin-top:3px;color:#aac4b5}
#world-motion button:disabled{opacity:.45;cursor:default}
.collection-art canvas{height:282px}
.collection-dialog[data-kind=world] .collection-art canvas{height:284px}
@media(max-width:760px){.collection-art canvas{height:260px}.collection-dialog[data-kind=world] .collection-art canvas{height:260px}}
.collection-dialog[data-kind=scene] .collection-art canvas{width:min(100%,490px);max-height:280px}
/* A small sound presence, with the same control in the quiet view. */
.sound-dock{display:flex;align-items:center;gap:2px;border:1px solid #e8efd62e;border-radius:30px;background:#071d27a8;backdrop-filter:blur(14px);height:39px;padding:0 4px 0 8px}
.sound-dock button{display:flex;align-items:center;justify-content:center;gap:9px;min-height:35px;padding:0 11px;font-size:10px;white-space:nowrap}
.sound-dock #sound-settings{font-size:19px;padding:0 8px;min-width:34px;border-left:1px solid #dceda526;line-height:1}
.sound-dock button:hover{color:var(--lime)}
.sound-bars{height:16px;width:18px;display:flex;align-items:center;gap:3px;color:var(--lime)}
.sound-bars i{display:block;width:2px;background:currentColor;height:5px;border-radius:1px;opacity:.65}
.sound-bars i:nth-child(2){height:12px}.sound-bars i:nth-child(3){height:16px}.sound-bars i:nth-child(4){height:8px}
.sound-dock[data-sound-state=playing] .sound-bars i{animation:sound-breathe 1.8s ease-in-out infinite alternate;opacity:1}
.sound-dock[data-sound-state=playing] .sound-bars i:nth-child(2){animation-delay:-.6s}.sound-dock[data-sound-state=playing] .sound-bars i:nth-child(3){animation-delay:-1.2s}
@keyframes sound-breathe{from{transform:scaleY(.45)}to{transform:scaleY(1)}}
#immersive-audio-hint{font-size:8px;font-weight:400;color:#adbfba}
.world-peek{gap:10px}
.sound-panel{width:480px;padding:36px 38px 25px;overflow:auto;background:radial-gradient(ellipse at 0 0,#2b463b,#10242c 80%)}
.sound-panel>.eyebrow{font-size:8px;color:var(--lime);margin-bottom:20px}
.sound-panel h2{font-size:43px;line-height:1.03}
.sound-now{font:500 15px var(--display);color:var(--lime);margin:18px 0 25px}
.sound-panel legend{font-size:10px;color:#b8cdbf;margin-bottom:13px}
.sound-mode-options{display:flex;gap:10px}
.sound-mode-options>button{flex:1;padding:13px 11px;text-align:left;border:1px solid var(--line);display:flex;flex-direction:column;gap:7px;min-height:77px;background:#081b222f}
.sound-mode-options>button>span{font:500 17px var(--display);letter-spacing:-.03em}
.sound-mode-options>button>small{font-size:8px;line-height:1.6;color:#bfd1c2}
.sound-mode-options>button[aria-pressed=true]{color:var(--lime);border-color:#dceda57a;background:#dceda510}
.sound-panel .field-label{font-size:10px;margin:22px 0 10px;color:#c6d9cb}
#sound-place{width:100%;min-height:42px;font:11px var(--body);padding:9px 12px;color:var(--cream);background:#183039;border:1px solid #dceda544;border-radius:0;margin-bottom:24px}
#sound-place option{background:#183039;color:var(--cream)}
.sound-panel .range-label{font-size:11px}.sound-panel input[type=range]{margin-bottom:18px}
.sound-panel .solid-button{min-height:44px;font-size:11px}
.sound-status{font-size:10px;line-height:1.7;color:#b9cebf;margin-top:13px}
.sound-cafe-note{font-size:12px;line-height:1.8;color:#c3d5c7;border-top:1px solid var(--line);padding-top:15px}
.sound-source{margin-top:18px;border-top:1px solid var(--line);padding-top:11px;font-size:9px;color:#9db7aa;line-height:1.75}
.sound-source summary{cursor:pointer;min-height:28px}.sound-source p{font-size:9px;margin:8px 0 0;line-height:1.75}
body.immersed{overflow:hidden;height:100dvh}
body.immersed .study-header{inset:auto 26px 27px auto;height:auto;width:auto;padding:0;background:none}
body.immersed .study-header>.wordmark,body.immersed .study-header>.compare-trigger,body.immersed .study-header>.study-label,body.immersed .study-nav{display:none!important}
body.immersed .world-view{position:fixed;inset:0;height:100dvh;min-height:0;margin:0}
body.immersed #restore-tools{left:26px;bottom:26px;transform:none;min-height:43px;font-size:10px;gap:22px;padding:10px 14px;border-radius:30px;backdrop-filter:blur(15px)}
body.immersed .world-shade{opacity:.12}
body.immersed .sound-dock{height:43px;background:#061923c9}
body.immersed .sound-dock button{min-height:39px}
@media(max-width:760px){
 .study-header{gap:10px}
 .study-header:has(.sound-dock:not([hidden])) .compare-trigger{max-width:85px;gap:6px;font-size:7px}
 .study-header:has(.sound-dock:not([hidden])) .wordmark{font-size:10px}
 .study-header:has(.sound-dock:not([hidden])) .wordmark span{margin-right:3px;font-size:17px}
 .sound-dock{height:34px;padding-left:5px;gap:0}
 .sound-dock button{min-height:31px;font-size:9px;gap:6px;padding:0 8px}
 .sound-dock #sound-settings{font-size:17px;min-width:26px;padding:0 6px}
 .sound-bars{width:14px;gap:2px;height:13px}.sound-bars i:nth-child(3){height:13px}.sound-bars i:nth-child(2){height:10px}
 #immersive-audio-hint{font-size:7px}
 .sound-panel{max-width:calc(100vw - 20px);padding:34px 26px 22px}
 .sound-panel h2{font-size:37px}.sound-panel>.eyebrow{margin-bottom:15px}
 .sound-now{margin-top:17px;margin-bottom:22px}.sound-mode-options{gap:8px}
 .sound-mode-options>button{padding:11px 9px}.sound-mode-options>button>span{font-size:17px}.sound-mode-options>button>small{font-size:8px}
 body.immersed .study-header{right:19px;bottom:24px}
 body.immersed #restore-tools{left:19px;bottom:24px;gap:13px;padding:10px 12px;font-size:9px}
 body.immersed .sound-dock{height:41px}.sound-source{font-size:9px}
}
@media(prefers-reduced-motion:reduce){.sound-dock .sound-bars i{animation:none!important}}
/* Study 04: a broader shelf of materials, with the same small tools. */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.world-choices{width:min(56vw,660px)}
.sky-options{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:11px}
.sky-options button{width:auto;min-width:0}.sky-options button b{font-size:9px}.sky-options button>span{height:60px}
.world-choices>.eyebrow{color:#d0debc}
.card-style-options{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0 18px}
.card-style-options>button{display:flex;flex-direction:column;gap:7px;text-align:center;min-width:0;align-items:center;padding:0 0 7px;border-bottom:1px solid transparent;opacity:.66}
.card-style-options>button[aria-pressed=true]{opacity:1;border-color:var(--lime);color:var(--lime)}
.card-style-options>button:hover{opacity:1}
.card-style-options b{font:400 8px/1.35 var(--body);max-width:63px}
.style-sample{width:38px;height:52px;display:grid;place-items:center;font:600 19px var(--display);box-shadow:3px 4px 8px #0003;transform:rotate(-4deg)}
.sample-note{background:#f3b1a4;color:#365044}.sample-coffee{background:#edd3ac;color:#634b38;border:4px double #a57d58;border-radius:19px 19px 0 0}
.sample-letter{background:linear-gradient(#355f5c 65%,#f1e8d1 65%);color:#eff3d1;border:3px solid #f1e8d1}
.sample-poster{background:#dcec91;color:#293b39;transform:rotate(4deg);font-size:17px}
.card-styles>.eyebrow,#reaction-heading{font-size:8px}
#card-reactions .reaction-tray{margin-top:12px;margin-bottom:14px}
#card-reactions .reaction-tray img{height:64px}
#card-palette-group .palette-label{margin-top:12px}
.postcard-view[data-style=coffee] .world-swatch,.postcard-view[data-style=poster] .world-swatch{display:none}
.collection-shortcut{font-size:10px;color:var(--lime);margin-top:19px;max-width:220px;line-height:1.6}
.story-select{display:flex;gap:25px;margin:0 0 16px;flex-shrink:0;border-bottom:1px solid var(--line)}
.story-select button{display:flex;flex-direction:column;align-items:flex-start;gap:5px;text-align:left;padding:0 0 12px;border-bottom:2px solid transparent;min-height:49px}
.story-select b{font:500 14px var(--display);letter-spacing:-.02em}.story-select small{font-size:8px;color:#a7bfb1}
.story-select button[aria-pressed=true]{color:var(--lime);border-color:var(--lime)}
.scene-intro{margin-bottom:16px}.scene-intro>p{max-width:280px;line-height:1.7}
.story-direction h2{font-size:30px;max-width:225px;line-height:1.06}
.collection-dialog .starter-list>button{min-height:45px;padding:8px 0}.collection-dialog .starter-list b{font-size:16px}
.collection-panel{min-height:375px}.collection-art{height:375px}
@media(min-width:761px){
 .postcard-layout{gap:3.2vw;grid-template-columns:minmax(220px,1fr) minmax(240px,1.05fr) minmax(230px,.9fr)}
 .postcard-tools{max-width:280px}
 .postcard-tools .delivery-help{margin-bottom:12px}
 .postcard-tools .tool-note{font-size:8px}
 .scene-layout{padding-top:100px}
 .scene-intro h1{font-size:47px}
 .story-sheet{width:min(100%,calc((100cqh - 58px)*1.8))}
}
@media(max-height:790px) and (min-width:761px){
 .scene-layout{padding-top:86px}.scene-intro h1{font-size:37px}.scene-intro{margin-bottom:12px}
 .story-select{margin-bottom:12px}.story-select button{min-height:43px;padding-bottom:8px}
 .postcard-layout{padding-top:83px;padding-bottom:25px}
 .card-style-options{margin:9px 0 12px}.style-sample{height:43px;width:33px}.card-style-options b{font-size:7px}
 #card-reactions .reaction-tray img{height:49px}.postcard-tools .palette-options{margin-bottom:11px}
 .story-direction h2{font-size:26px}.story-direction .eyebrow{font-size:7px}
}
@media(max-width:760px){
 .world-choices{left:24px;right:24px;width:auto;bottom:394px}.sky-options{grid-template-columns:repeat(3,1fr);gap:13px 14px}
 .sky-options button>span{height:48px}.sky-options button b{font-size:9px}
 .world-view{height:max(946px,calc(100dvh - 77px))}
 .postcard-copy .collection-shortcut{order:7;width:100%;margin:0;min-height:40px;max-width:none}
 .postcard-tools .card-styles{width:100%}.card-style-options{gap:15px;margin-bottom:24px}
 .style-sample{width:48px;height:64px}.card-style-options b{font-size:9px}
 #card-reactions .reaction-tray img{height:72px}.card-styles>.eyebrow,#reaction-heading{font-size:9px}
 .story-select{gap:14px;justify-content:space-between;margin-bottom:20px}.story-select button{max-width:31%;min-height:63px}
 .story-select b{font-size:14px;line-height:1.2}.story-select small{font-size:7px;line-height:1.4}
 .scene-intro{margin-bottom:24px}.scene-intro>p{margin-top:13px;font-size:12px}
 .story-direction h2{max-width:none;font-size:33px}
 .collection-panel,.collection-art{min-height:0;height:auto}
 .collection-dialog .starter-list>button{min-height:55px;padding:11px 0}
}
#card-reactions .reaction-tray{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:11px 0 18px}
#card-reactions .reaction-tray button{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;gap:6px;padding:5px 2px 9px;min-height:83px}
#card-reactions .reaction-tray button>span:last-child{font-size:9px;line-height:1.3}
#card-reactions .reaction-tray button[aria-pressed=true]{border-color:var(--lime)}
#card-reactions .reaction-tray button[aria-pressed=true]:after{display:none}
#card-reactions .reaction-tray img{height:52px;width:52px}
#card-reactions .reaction-tray .type-only{height:52px;display:flex;align-items:center;justify-content:center;font-size:31px}
@media(min-width:761px){
 .postcard-view[data-style=letter]>.source-whisper{display:none}
 .postcard-source{margin-top:10px;padding-top:8px}
 .postcard-copy .collection-shortcut{margin-top:9px}
}
@media(max-height:790px) and (min-width:761px){
 .postcard-copy h1{font-size:52px}.postcard-copy>p:not(.eyebrow){margin-top:12px}
 .postcard-copy textarea{min-height:75px;height:75px}.postcard-copy .field-label{margin-top:20px}
}

/* Shared portfolio navigation and finished takeaways. */
.skip-link{position:fixed;left:20px;top:-80px;z-index:100;background:var(--cream);color:var(--ink);padding:15px 20px}.skip-link:focus{top:10px}
.photo-film-link{display:flex;margin:14px 0 0;font-size:11px;color:var(--lime);min-height:38px}.making-contact{margin-top:20px;min-height:44px}
.movie-export{border-top:1px solid var(--line);margin-top:22px;padding-top:18px}.export-sound{display:flex;gap:10px;align-items:center;font-size:12px;min-height:42px}.export-sound input{accent-color:var(--lime);width:17px;height:17px}.movie-export .outline-button{margin:4px 0 10px}.movie-export .solid-button{margin-top:14px}.movie-export .tool-note{font-size:11px;line-height:1.65;min-height:36px}.movie-export .text-button{min-height:44px}.takeaway-image video{display:block;max-width:100%;max-height:68dvh;width:auto;height:auto}.takeaway-dialog.landscape:has(#takeaway-film:not([hidden])){grid-template-columns:minmax(0,1fr) minmax(280px,1fr)}.takeaway-dialog.landscape:has(#takeaway-film:not([hidden])) .takeaway-image{max-height:75dvh}
select:focus-visible{outline:2px solid var(--lime);outline-offset:4px}select{font:inherit}
@media(min-width:761px){.study-label{font-size:9px}.tool-note{font-size:11px}.source-whisper{font-size:9px}.study-nav a{min-height:64px}}
@media(max-width:760px){.takeaway-image video{max-height:56dvh;max-width:min(100%,300px)}.takeaway-dialog.landscape:has(#takeaway-film:not([hidden])){display:flex;flex-direction:column}.movie-export .tool-note{font-size:11px}.world-view .source-whisper{font-size:8px;line-height:1.4}.study-header .compare-trigger{font-size:10px;max-width:135px}.photo-film-link{font-size:12px}.study-nav{padding-bottom:env(safe-area-inset-bottom)}.study-nav a{min-height:54px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}
@media(max-width:760px){
 .study-header:has(.sound-dock:not([hidden])) .compare-trigger{font-size:10px;max-width:98px;gap:6px}
 .study-nav .about-button{display:flex;align-items:center;justify-content:center;flex:0 0 30px;min-height:30px;width:30px;height:30px;margin-left:3px;padding:0}
 .cinema-screen{scroll-margin-top:90px;scroll-margin-bottom:95px}
 .world-controls .range-label,.traffic legend{font-size:11px}.world-controls .range-label output{font-size:9px}.segmented button{font-size:11px;min-height:40px}
}
@media(max-width:360px){.study-header:has(.sound-dock:not([hidden])) .wordmark{font-size:10px}.study-header:has(.sound-dock:not([hidden])) #sound-toggle-label{display:none}.study-header:has(.sound-dock:not([hidden])) .sound-dock{gap:0}}
@media(max-width:760px){.postcard-copy .photo-film-link{order:9;width:100%;margin:6px 0 0;min-height:44px}}

/* Shared with the places: their display type for titles, DM Sans for words and labels, the same
   close button and a header that stays solid on phones. Bricolage remains inside the artwork
   visitors make (postcards, comics) and the samples that preview it. */
.postcard-copy textarea,.story-lines input{font-family:var(--body);letter-spacing:0}
.reaction-tray .type-only,.style-sample{font-family:Bricolage,Arial,sans-serif}
.film-rail b{font-weight:600;letter-spacing:.005em;text-transform:uppercase}
.sound-now,.story-select b,.starter-list b,.sound-mode-options>button>span,.collection-tabs>button,.film-invitation>.text-button{font-family:var(--body);letter-spacing:-.01em}
.dialog-close{border:1px solid #f8f5df66;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px;line-height:1}
.study-nav{background:#0b1224f5}
@media(max-width:760px){
 .study-header{background:#0b1224f2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
 .study-header .compare-trigger,.study-header:has(.sound-dock:not([hidden])) .compare-trigger{white-space:nowrap;max-width:none}
 #sound-toggle-label{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
@media(max-width:360px){.study-header .compare-trigger{display:none}}

/* Phone text floor: nothing a visitor reads is smaller than 12 px (checked by qa/text-floor.mjs).
   Only labels, captions and small controls are listed; titles and the artwork keep their sizes. */
@media(max-width:760px){
 :is(small,figcaption,label,output,legend,.eyebrow,.tool-note,.source-whisper,.range-label,.range-label span,.scene-tip,.story-swipe,.delivery-help,.starter-detail,#char-count){font-size:12px!important;line-height:1.4}
 :is(.study-header .wordmark,.compare-trigger,.study-nav a,.study-nav a>span,#sound-toggle-label){font-size:12px!important}
 :is(.cinema-intro,.world-intro p,.postcard-copy>p,.collection-heading p,.solid-button,.outline-button,.control-title span){font-size:12px!important}
 :is(.film-rail small span,#film-status,#film-name,#play-label,#film-contrast,#takeaway-next,#collection-caption,#collection-motion,#collection-range,#collection-notes,.collection-tabs button span){font-size:12px!important}
 :is(.cinema-screen figcaption span,.playback-controls .text-button,.postcard-object figcaption span,.postcard-object figcaption button){font-size:12px!important}
 :is(.starter-list small,.sky-options button b,.card-style-options button b,.reaction-tray button span,.story-select small,.ending-options button b,.ending-options button small,.story-lines label span,.traffic .segmented button){font-size:12px!important}
 :is(.story-sheet .sheet-title span,.story-sheet .sheet-caption span,#takeaway-note,#movie-status,#immersive-audio-hint){font-size:12px!important}
 :is(.cinema-make,#film-tool-note,#new-message,.collection-shortcut,#hide-tools,#pause-world,#world-to-postcard,.photo-film-link){font-size:12px!important}
}

/* Main actions are cream pills and second actions outlined pills, matching the site's rounded
   controls (round players, the round ×, the map and Listen pills). */
.solid-button,.outline-button{border-radius:999px}
.world-controls .solid-button,.story-direction :is(.solid-button,.outline-button),.postcard-tools .solid-button,.collection-choices .solid-button{padding-left:18px;padding-right:18px}
/* The rooms' round player, for the cutting room's films. */
.playback-controls{gap:10px;margin-top:8px}
.playback-controls .round-control{flex-shrink:0;width:36px;min-width:36px;height:36px;min-height:36px;border:1px solid #e3ead15c;border-radius:50%;display:grid;place-items:center;padding:0;font-size:12px;background:#07172533;color:var(--cream)}
.playback-controls .round-control svg{display:block;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.playback-controls output{font-size:12px;min-width:30px;font-variant-numeric:tabular-nums;color:var(--cream)}

/* Five entries in the tools bar. On a phone they hang from the top so the numbers line up, and the
   cutting room drops its "The" to fit. */
.study-nav b{font-weight:inherit}.nav-short{display:none}
@media(max-width:760px){
 .study-nav>a{justify-content:flex-start;padding-top:14px}.study-nav>a[aria-current]{padding-top:12px}
 .nav-long{display:none}.nav-short{display:inline}
}

/* Pocket worlds on a phone: "How they move" gave the controls a row, so the world thumbnails sit
   higher and the view is that much taller. The layout stays the same for every world, so nothing
   moves under a finger when a world is chosen. */
@media(max-width:760px){.world-choices{bottom:458px}.world-view{height:max(1010px,calc(100dvh - 77px))}}
@media(min-width:761px) and (max-height:790px){
 .world-controls .segmented button{min-height:30px;padding-top:6px;padding-bottom:6px}.world-controls .traffic legend{margin-bottom:8px}
 #world-motion{margin-top:10px}.world-controls .pause-line{margin:6px 0 4px}
}
/* Short screens: the two choices read on their own, so their heading is kept for screen readers only,
   and "Just be here" sits closer to the header, so the panel stays clear of it. */
@media(min-width:761px) and (max-height:720px){
 .world-controls #world-motion legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
 .world-controls .control-title{padding-bottom:8px;margin-bottom:10px}.world-controls input[type=range]{margin-bottom:9px}
 .world-peek{top:80px}
}
@media(min-width:761px) and (max-height:680px){.world-controls .control-title{display:none}.world-controls{bottom:30px}.world-peek{top:76px}}

/* The keep pop-up on a phone: a finished film gets the room it needs instead of spilling over the
   words below it. */
@media(max-width:760px){.takeaway-image:has(>video:not([hidden])){max-height:none}}