:root{color-scheme:dark;--white:#f8f6ef;--muted:#c4d0ce;--mint:#e9b66d;--line:rgba(246,249,242,.22)}
*{box-sizing:border-box}html,body{margin:0;background:#071317;color:var(--white);font-family:Inter,"Helvetica Neue",Arial,sans-serif}button,a,input{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--mint);outline-offset:6px}a{color:inherit;text-decoration:none}button{border:0;background:none}.experience{height:100svh;min-height:760px;position:relative;isolation:isolate;overflow:hidden}.fallback,#world,.shade{position:absolute;inset:0;width:100%;height:100%;z-index:-3}.fallback{opacity:0;object-fit:cover;object-position:50% 50%}#world{z-index:-2;opacity:0;transition:none}.ready #world{opacity:1}.shade{z-index:-1;background:linear-gradient(180deg,rgba(2,10,15,.55),transparent 23%,transparent 60%,rgba(2,10,15,.86)),linear-gradient(90deg,rgba(2,10,15,.6),rgba(2,10,15,.16) 48%,transparent 78%)}.header{position:absolute;top:0;left:0;right:0;padding:32px 4.5%;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px;font-weight:600;font-size:25px;letter-spacing:-1px}.brand svg{width:35px;height:34px}.brand-domain{font-weight:400;color:#c4d6d0}.header-center{display:flex;align-items:center;gap:11px;font-size:10px;letter-spacing:2.2px;color:#e1e8e3}.live-dot,.status-dot{display:inline-block;background:var(--mint);width:5px;height:5px;border-radius:50%;box-shadow:0 0 9px #e9b66d66}.arrow{font-size:15px;color:#c5b69f;margin:0 2px}.header-actions{display:flex;align-items:center;gap:30px}.text-button{font-size:12px;padding:10px 0;color:#e3e9e4}.text-button span{margin-left:8px;color:var(--mint)}.language{font-size:12px;border:1px solid var(--line);border-radius:3px;padding:9px 13px;min-height:38px}.language:hover{background:#ffffff12}.scene-label{position:absolute;right:4.5%;top:150px;display:flex;align-items:center;gap:12px;font-size:9px;letter-spacing:1.8px;line-height:1.8;color:#cbd9d5}.coordinates{color:#a7bcb7;letter-spacing:1px}.crosshair{font-size:26px;font-weight:200;color:var(--mint)}.hero-copy{position:absolute;left:8%;bottom:29%;max-width:690px}.eyebrow{font-size:10px;font-weight:500;letter-spacing:3.1px;line-height:1.8;color:#d3dfd7;margin:0 0 25px}h1{font-weight:500;font-size:clamp(54px,6.3vw,100px);letter-spacing:-.06em;line-height:1.045;margin:0;text-shadow:0 2px 25px #00000016}h1 span{color:#f5eddb}.intro{font-size:15px;line-height:1.8;font-weight:400;color:#e0e4dc;margin:27px 0 23px;letter-spacing:.1px}.contact{display:inline-flex;align-items:center;gap:36px;border-bottom:1px solid #f1f1e888;padding:8px 0 12px;font-size:13px}.contact svg{height:21px;width:21px;transition:transform .2s}.contact:hover svg{transform:translateX(5px)}.scene-status{position:absolute;right:4.5%;bottom:225px;display:flex;align-items:center;gap:9px;color:#e1e5db;font-size:9px;letter-spacing:1.7px}.controls{position:absolute;bottom:28px;left:4.5%;right:4.5%;padding-top:22px;border-top:1px solid var(--line)}.controls-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:19px}.study-label{display:flex;align-items:center;gap:15px;font-size:10px;letter-spacing:1.9px}.study-number{color:var(--mint)}.study-divider{color:#6c807b}.study-description{letter-spacing:.3px;color:#c1cdc5;font-size:11px}.playback{display:flex;gap:22px;align-items:center}.play-button,.replay-button{display:flex;align-items:center;gap:7px;font-size:11px;padding:9px 0;min-width:57px;min-height:35px}.playback svg{width:18px;height:18px}.replay-button{color:#becfc6}.playback button:hover{color:white}.timeline{display:flex;align-items:center;gap:22px;position:relative}input[type=range]{--value:0%;width:100%;height:22px;background:transparent;appearance:none;-webkit-appearance:none;cursor:pointer;margin:0}input[type=range]::-webkit-slider-runnable-track{height:2px;background:linear-gradient(90deg,var(--mint) var(--value),#ffffff33 var(--value))}input[type=range]::-moz-range-track{height:2px;background:#ffffff33}input[type=range]::-moz-range-progress{height:2px;background:var(--mint)}input[type=range]::-webkit-slider-thumb{appearance:none;width:10px;height:10px;border-radius:50%;background:var(--white);margin-top:-4px;box-shadow:0 0 0 5px #e9b66d16}input[type=range]::-moz-range-thumb{width:10px;height:10px;border:0;background:var(--white);border-radius:50%}input[type=range]:focus-visible{outline:2px solid var(--mint);outline-offset:5px}.progress-value{font-variant-numeric:tabular-nums;font-size:9px;letter-spacing:1px;color:#d0ddd4;min-width:28px}.phase-row{display:flex;align-items:center;gap:45px;margin-top:6px}.phase{font-size:11px;color:#a7b6af;padding:10px 0;display:flex;align-items:center;gap:10px;min-height:36px;transition:color .2s}.phase span:first-child{font-size:9px;opacity:.65}.phase.active{color:#f1f7eb}.phase.active span:first-child{color:var(--mint);opacity:1}.phase:hover{color:white}.scrub-hint{margin-left:auto;margin-right:50px;font-size:8px;letter-spacing:1.7px;color:#9eafa5}.concept-panel{position:absolute;top:105px;right:4.5%;max-width:410px;padding:38px;background:#0b191cf5;backdrop-filter:blur(20px);border:1px solid #e9b66d33;z-index:5;box-shadow:0 16px 80px #0006}.concept-panel[hidden]{display:none}.concept-panel .eyebrow{font-size:9px;letter-spacing:2px;margin:0 0 23px;color:var(--mint)}.concept-panel h2{font-size:38px;line-height:1.12;letter-spacing:-1.5px;font-weight:400;margin:0 0 24px}.concept-panel p:not(.eyebrow){font-size:14px;line-height:1.8;color:#c4d2cd}.concept-note{font-size:10px;line-height:1.8;color:#8da69d;border-top:1px solid var(--line);margin-top:24px;padding-top:17px}.close-button{position:absolute;right:13px;top:9px;font-size:26px;color:#b7cac3;padding:5px 8px}.error-message{position:absolute;bottom:210px;left:4.5%;right:4.5%;font-size:12px;background:#071317e6;padding:12px;border:1px solid var(--line)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}html[lang=ja] h1{font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;font-size:clamp(40px,4.5vw,68px);line-height:1.3;letter-spacing:-.04em}html[lang=ja] .intro{font-size:14px}
@media(min-width:1800px){.hero-copy{left:10%;bottom:31%}.controls{bottom:40px}.header{padding-top:40px}}
@media(max-height:800px) and (min-width:801px){.experience{min-height:680px}.hero-copy{bottom:29%}h1{font-size:70px}.intro{margin:18px 0 13px}.eyebrow{margin-bottom:15px}.scene-label{top:120px}.scene-status{bottom:200px}.controls{bottom:17px;padding-top:12px}.controls-top{margin-bottom:10px}}
@media(max-width:800px){.experience{min-height:740px}.header{padding:25px 6%;gap:16px}.brand{font-size:22px;gap:9px}.brand svg{width:30px;height:30px}.header-center{display:none}.header-actions{gap:20px}.text-button{font-size:11px}.scene-label{right:6%;top:110px;font-size:8px}.hero-copy{left:7%;right:7%;bottom:32%}h1{font-size:clamp(48px,8.7vw,70px)}.eyebrow{font-size:8px;letter-spacing:2.1px;margin-bottom:22px}.intro{font-size:13px;margin-top:24px}.contact{font-size:12px}.controls{left:6%;right:6%;bottom:24px}.scene-status{right:6%;bottom:215px;font-size:8px}.phase-row{gap:25px}.phase{font-size:10px;gap:6px}.study-description{font-size:10px}.study-label{gap:10px;font-size:9px}.scrub-hint{display:none}.concept-panel{right:6%;left:6%;max-width:440px;top:90px}.shade{background:linear-gradient(180deg,#020a0f88,transparent 25%,transparent 48%,#020a0fe8 100%),linear-gradient(90deg,#020a0f55,transparent)}html[lang=ja] h1{font-size:clamp(32px,6.7vw,52px)}}
@media(max-width:420px){.header-actions{gap:14px}.text-button{font-size:10px}.language{padding:7px 10px}.brand{font-size:20px}.brand svg{width:27px}.phase-row{justify-content:space-between;gap:8px}.phase{font-size:9px}.playback{gap:12px}.study-label{gap:8px}.study-description{display:none}.study-divider{display:none}.hero-copy{bottom:33%}h1{font-size:46px}.intro{font-size:12px}.scene-status{bottom:210px;font-size:7px}.concept-panel{padding:30px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}

.animation-unavailable .fallback{opacity:1}

/* Use the supplied stacked lockup intact; CSS crops its outer white canvas and adapts it for the dark hero. */
.brand{display:block;flex-shrink:0}.brand-image{position:relative;display:block;width:108px;height:67.5px;overflow:hidden;mix-blend-mode:screen}.brand-image img{position:absolute;width:255.15px;height:auto;max-width:none;left:-73.845px;top:-1.0395px;filter:invert(1) brightness(1.8)}
.header{align-items:flex-start}.header-center,.header-actions{margin-top:11px}
@media(max-width:800px){.brand-image{width:100px;height:62.5px}.brand-image img{width:236.23px;left:-68.35px;top:-.96px}.header-center,.header-actions{margin-top:6px}.header-actions{gap:16px}.scene-label{top:116px}}
@media(max-width:420px){.header-actions{gap:12px}.brand-image{width:96px;height:60px}.brand-image img{width:226.8px;left:-65.64px;top:-.924px}h1{font-size:43px}}