:root{font-family:DM Sans,Arial,sans-serif;color:#272b29;background:#f8f9f7;font-synthesis:none;--ink:#272b29;--muted:#6c736e;--line:#dce0da}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,input,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #597d91;outline-offset:6px}button{border:0;background:none}button:disabled{cursor:wait;opacity:.5}#app{height:100svh;min-height:480px;isolation:isolate}canvas{display:block;position:absolute;inset:0;width:100%;height:100%;touch-action:none}header{position:absolute;inset:0 0 auto;z-index:6;display:flex;justify-content:space-between;align-items:center;padding:32px 42px;pointer-events:none}.brand{font-family:Georgia,serif;font-size:30px;letter-spacing:-1.8px;pointer-events:auto}nav{display:flex;align-items:center;gap:25px;pointer-events:auto}nav button{font-size:13px;padding:8px 0}.nav-dot{height:4px;width:4px;border-radius:50%;background:#969d96}#sound{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:9px;border-radius:50%;opacity:.75;transition:opacity .2s}#sound:hover,#sound[aria-pressed=true]{opacity:1}.sound-icon{width:22px;height:22px}#sound .sound-waves{display:none}#sound[aria-pressed=true] .sound-waves{display:inline}#sound[aria-pressed=true] .sound-mute{display:none}#intro{position:absolute;left:8.3%;top:21%;z-index:2;pointer-events:none}h1{font-family:Georgia,serif;font-size:clamp(48px,5.5vw,86px);line-height:1.04;font-weight:400;letter-spacing:-4px;margin:24px 0}#mood-zone{position:absolute;left:43%;top:19%;width:50%;height:56%;z-index:3;cursor:grab;touch-action:none;border-radius:50%}#mood-zone:active{cursor:grabbing}#mood-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}#mood-zone:has(:focus-visible){outline:2px solid #597d91;outline-offset:12px}.mood-actions{position:absolute;left:48%;width:40%;bottom:17%;display:flex;align-items:center;flex-direction:column;z-index:5;gap:17px}.gesture{display:flex;align-items:center;gap:13px;font-size:12px;color:#68746f}.gesture:before,.gesture:after{content:"";width:28px;height:1px;background:#bac2b9}.primary{display:flex;align-items:center;gap:24px;background:#2c332d;color:#fafcf8;border-radius:40px;padding:16px 25px;font-size:13px;transition:background .2s,transform .2s}.primary:hover{background:#475147;transform:translateY(-2px)}.primary svg{width:17px;height:17px}.ticks{display:flex;gap:6px;align-items:center;height:15px}.ticks i{height:4px;width:4px;border-radius:3px;background:#bfc6bd;transition:height .3s,background .3s}.ticks i.active{height:14px;background:#626e60}#dock{position:absolute;bottom:0;left:50%;transform:translate(-50%);width:160px;height:95px;z-index:7;border-radius:90px 90px 0 0;background:linear-gradient(180deg,#fff5,#fff0);border:1px solid #d1d8cf;border-bottom:0}#study{position:absolute;inset:0;overflow:hidden;background:#141b19;z-index:0}#study-image{position:absolute;left:50%;top:50%;width:max(100vw,100svh);height:max(100vw,100svh);transform:translate(-50%,-50%);background-size:500% 300%;filter:brightness(.77);transition:background-position .2s}#study:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0005,transparent 30%,transparent 50%,#0009)}.scene-mode header{color:#fff}.scene-mode nav button{color:#fff}.scene-mode #dock{border-color:#ffffff50;background:#ffffff15}#zoom-hint{position:absolute;bottom:40px;left:50%;transform:translate(-50%);font-size:11px;color:#738073;z-index:4;white-space:nowrap}.scene-mode #zoom-hint{bottom:26px;color:#eceee7;left:42px;transform:none}#status{position:absolute;top:105px;left:50%;transform:translate(-50%);z-index:15;background:#f8f9f7;color:#37403a;padding:12px 22px;border-radius:30px;font-size:13px;box-shadow:0 4px 20px #0001;max-width:85vw;text-align:center}dialog{border:1px solid #dce0da;border-radius:5px;background:#f8f9f7;color:#272b29;padding:36px;width:min(460px,90vw);box-shadow:0 20px 100px #0002}dialog::backdrop{background:#edf0ecbb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}dialog h2{font:400 35px Georgia,serif;margin:0 0 20px}dialog p{font-size:14px;line-height:1.7;color:#626d64}dialog .close{position:absolute;right:16px;top:12px;font-size:23px}.key{font-size:11px;border:1px solid #c5cec5;padding:2px 6px;border-radius:4px}#place-list{max-height:50vh;overflow:auto;display:flex;flex-direction:column;gap:4px}#place-list button{text-align:left;padding:12px;border-bottom:1px solid #e0e5dc;font-size:14px}#place-list button:hover{background:#e9eee6}#fallback{position:absolute;inset:150px 30px auto;z-index:20;text-align:center;background:#f8f9f7;padding:25px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}[hidden]{display:none!important}@media(max-width:700px){header{padding:24px}.brand{font-size:26px}nav{gap:16px}nav button{font-size:12px}.nav-dot{display:none}#intro{left:26px;top:15%}h1{font-size:47px;letter-spacing:-2px;margin:17px 0}#mood-zone{left:18%;top:36%;width:76%;height:37%}.mood-actions{left:26%;width:68%;bottom:14%;gap:13px}.primary{padding:14px 20px}#dock{width:130px;height:80px}#zoom-hint{bottom:100px}.scene-mode #zoom-hint{left:24px;bottom:24px;max-width:170px;white-space:normal}#status{top:125px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}#zoom-hint{bottom:112px}.scene-mode #zoom-hint{bottom:28px}@media(max-width:700px){.scene-mode #zoom-hint{bottom:26px;font-size:10px;max-width:105px}}#walk-controls{position:absolute;z-index:7;left:42px;bottom:72px;display:flex;flex-direction:column-reverse;align-items:center;gap:8px}#walk-pad{display:flex;flex-direction:column;align-items:center;gap:4px}#walk-pad>div{display:flex;gap:4px}#walk-controls #walk-toggle{width:40px;height:40px;border:0;background:none;color:inherit;border-radius:50%;padding:9px;opacity:.75;transition:opacity .2s}#walk-controls #walk-toggle:hover,#walk-controls #walk-toggle[aria-expanded=true]{opacity:1}#walk-toggle svg{width:22px;height:22px}#walk-controls button{width:38px;height:36px;border:1px solid #ccd4c9;border-radius:9px;background:#f8f9f7bb;color:#556051;touch-action:none;font-size:18px}#walk-controls button:active{background:#dce4d7}@media(max-width:700px){#walk-controls{left:24px;bottom:75px}#walk-controls button{width:32px;height:32px}#zoom-hint{bottom:120px;left:auto;right:24px;transform:none;max-width:130px;text-align:right;white-space:normal}.scene-mode #zoom-hint{text-align:left}}.mood-actions{left:50%;width:270px;transform:translate(-50%);bottom:9%}#mood-zone{left:53%;top:24%;width:44%;height:47%}#intro{top:17%}@media(max-width:700px){.mood-actions{left:50%;width:240px;bottom:13%}#mood-zone{left:51%;top:39%;width:47%;height:30%}#intro{top:14%}.brand{font-size:24px}nav{gap:14px}}#intro{top:118px;left:4.86%}#intro h1{font-size:clamp(40px,4.4vw,64px);line-height:1.02;letter-spacing:-.06em;margin:0}#enter{min-width:112px;justify-content:center}@media(max-width:700px){#intro{top:105px;left:26px}#intro h1{font-size:40px}}.brand{font-family:EB Garamond,Georgia,serif;font-weight:400;letter-spacing:-.025em}#dock{width:calc(11.22vh + 24px);height:calc(10.11vh + 12px);border-radius:calc(5.61vh + 12px) calc(5.61vh + 12px) 0 0}#app:not(.scene-mode) #zoom-hint{bottom:calc(10.11vh + 30px)}.quick-picker{--picker-width:min(560px,94vw)}.quick-picker #mood-zone{left:calc(50% - var(--picker-width)*.05);top:auto;bottom:calc(var(--picker-width)*.02);width:calc(var(--picker-width)*.52);height:calc(var(--picker-width)*.49);border-radius:45%;z-index:8}.quick-picker #mood-zone:focus-within{outline:none}.quick-picker #mood-zone:has(:focus-visible){outline:2px solid #597d91;outline-offset:0}.portal-transition #dock,.portal-transition #walk-controls,.portal-transition #zoom-hint{visibility:hidden;pointer-events:none}h1,#intro h1{font-family:EB Garamond,Georgia,serif;letter-spacing:-.035em}.scene-mode #walk-controls #walk-toggle{color:#fff}#intro h1{font-size:clamp(26px,2.5vw,36px);line-height:1.12;letter-spacing:-.02em;color:#4a524c}@media(max-width:700px){#intro h1{font-size:26px}}.brand{transition:font-size .45s ease}.mood-mode .brand{font-size:40px}.mood-mode #intro h1{font-size:clamp(30px,min(3.3vw,5vh),48px)}@media(max-width:700px){.mood-mode .brand{font-size:31px}.mood-mode #intro h1{font-size:33px}}#intro{left:50%;transform:translate(-50%);text-align:center;white-space:nowrap;top:auto}#zoom-hint{padding:8px 16px;border-radius:11px}.hint-ring{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.hint-ring rect{fill:none;stroke-opacity:var(--callout-strength,1);stroke-width:2.2;stroke-linecap:butt;stroke-dasharray:1;stroke-dashoffset:1;opacity:0}#zoom-hint.callout{animation:hint-backing 4.5s ease forwards}#zoom-hint.callout .hint-ring rect,#about.callout .hint-ring rect{animation:hint-draw 2.2s linear forwards}@keyframes hint-backing{0%{background:#fff0}6%{background:rgba(255,255,255,calc(.77*var(--callout-strength,1)))}82%{background:rgba(255,255,255,calc(.77*var(--callout-strength,1)))}to{background:#fff0}}@keyframes hint-draw{0%{opacity:0;stroke-dashoffset:1}13%{opacity:1;stroke-dashoffset:1;animation-timing-function:cubic-bezier(.45,0,.25,1)}62%{opacity:1;stroke-dashoffset:0}82%{opacity:1;stroke-dashoffset:0}to{opacity:0;stroke-dashoffset:0}}#about{position:relative}#about .hint-ring{inset:50% auto auto 50%;width:32px;height:32px;transform:translate(-50%,-50%)}#about:before{content:"";position:absolute;left:50%;top:50%;width:32px;height:32px;border-radius:50%;transform:translate(-50%,-50%);z-index:-1}#about.callout:before{animation:hint-backing 4.5s ease forwards}@media(prefers-reduced-motion:reduce){#zoom-hint.callout .hint-ring rect,#about.callout .hint-ring rect{animation:none;opacity:0}}#status:empty{opacity:0;pointer-events:none}#credit{position:absolute;right:24px;bottom:28px;z-index:4;font-size:11px;line-height:1.45;color:#eceee7;opacity:.7;text-decoration:none;max-width:min(30vw,260px);text-align:right;transition:opacity .2s}#credit span{display:block}#credit:hover{opacity:1;text-decoration:underline}@media(max-width:700px){#credit{bottom:26px;font-size:10px;max-width:45vw}}