:root{--edge-left:max(18px,env(safe-area-inset-left));--edge-right:max(18px,env(safe-area-inset-right));--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}html,body{overscroll-behavior:none;height:100dvh}body{min-width:280px}#world{touch-action:none}button{min-height:44px;min-width:44px}button:active{background-color:#627b6d99}header{top:calc(18px + var(--safe-top));left:var(--edge-left);right:var(--edge-right)}.brand{font-size:21px}.brand span{font-size:8px;letter-spacing:1.5px}.demo{display:none}.header-right{gap:8px}.intro{left:var(--edge-left);right:var(--edge-right);top:auto;bottom:calc(142px + var(--safe-bottom));pointer-events:none}.intro h1{font-size:clamp(30px,8vw,40px);line-height:1.3;letter-spacing:4px;margin:12px 0}.intro .eyebrow{font-size:8px;letter-spacing:1.5px}.intro .description{font-size:11px;line-height:1.8;letter-spacing:2px;margin:8px 0}.intro .tiny{display:none}.intro .primary{pointer-events:auto;margin-top:10px;padding:13px 18px}footer{left:var(--edge-left);right:var(--edge-right);bottom:calc(8px + var(--safe-bottom));padding-top:4px}footer span{font-size:7px;letter-spacing:1px}footer div{gap:12px}footer button{padding:4px}.location{left:var(--edge-left);bottom:calc(69px + var(--safe-bottom));font-size:9px;gap:6px;letter-spacing:1px}.hint{left:var(--edge-left);right:var(--edge-right);bottom:calc(108px + var(--safe-bottom));font-size:10px;max-width:none;text-align:left;letter-spacing:1px}.compass{display:none}.actions{left:var(--edge-left);right:var(--edge-right);bottom:calc(76px + var(--safe-bottom));width:auto;transform:none;display:flex;gap:6px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;padding:4px 0}.actions button{flex:0 0 auto;padding:10px 14px;font-size:11px}body[data-scene=inside] .location{display:none}body[data-scene=inside] .hint{bottom:calc(136px + var(--safe-bottom))}#back-view{position:fixed;z-index:4;top:calc(88px + var(--safe-top));left:var(--edge-left);font-size:11px;padding:10px 14px}#drawer-controls{top:calc(88px + var(--safe-top));left:auto;right:var(--edge-right);transform:none;gap:4px;max-width:calc(100% - 128px)}#drawer-controls button{font-size:10px;padding:8px}#record-power{width:44px;height:44px}#panel{top:calc(82px + var(--safe-top));bottom:calc(66px + var(--safe-bottom));left:var(--edge-left);right:var(--edge-right);width:auto;max-width:none;padding:24px;scroll-padding-top:44px;overscroll-behavior:contain}#panel input,#panel textarea{font-size:16px!important}#panel .close{min-height:44px;min-width:44px}#toast{top:calc(82px + var(--safe-top));max-width:calc(100% - 36px);width:max-content;overflow-wrap:anywhere}#tooltip{max-width:calc(100vw - 24px)}#forest-benchmark{left:var(--edge-left);right:var(--edge-right)!important;top:calc(140px + var(--safe-top))!important;width:auto!important;max-height:55dvh!important}#forest-benchmark button{margin:4px}@media(min-width:1024px)and (min-height:501px){header{top:calc(36px + var(--safe-top));left:max(44px,env(safe-area-inset-left));right:max(44px,env(safe-area-inset-right))}.brand{font-size:25px}.brand span{font-size:9px;letter-spacing:2.5px}.demo{display:inline}.header-right{gap:26px}.intro{inset:27% auto auto 8%}.intro h1{font-size:clamp(38px,4.4vw,68px);line-height:1.4;letter-spacing:7px;margin:27px 0}.intro .eyebrow{font-size:9px;letter-spacing:3px}.intro .description{font-size:12px;line-height:2.2;letter-spacing:3px}.intro .tiny{display:block}.intro .primary{margin-top:25px;padding:16px 22px}footer{left:44px;right:44px;bottom:calc(18px + var(--safe-bottom));padding-top:8px}.location{left:44px;bottom:calc(82px + var(--safe-bottom))}.hint,body[data-scene=inside] .hint{left:auto;right:44px;bottom:calc(84px + var(--safe-bottom));text-align:right}.actions{left:50%;right:auto;transform:translate(-50%);bottom:calc(126px + var(--safe-bottom));max-width:calc(100% - 88px)}.compass{display:block;top:calc(108px + var(--safe-top))}#back-view{left:44px;top:calc(130px + var(--safe-top))}#drawer-controls{top:calc(188px + var(--safe-top));left:44px;right:auto;max-width:none}#panel{left:auto;right:max(25px,env(safe-area-inset-right));top:calc(110px + var(--safe-top));bottom:calc(110px + var(--safe-bottom));width:360px;padding:36px}}@media(max-height:500px){header{top:calc(8px + var(--safe-top))}.brand span,.intro .eyebrow,.intro .description,footer>span,.hint,.location{display:none}.brand{font-size:19px}.intro{bottom:calc(70px + var(--safe-bottom));max-width:42%}.intro h1{font-size:28px;margin:8px 0}.intro .primary{margin-top:4px;min-width:160px;letter-spacing:1px}.primary span{margin-left:18px}footer{border:0;left:auto}.actions{right:180px;bottom:calc(8px + var(--safe-bottom))}#back-view,#drawer-controls{top:calc(64px + var(--safe-top))}#panel{top:calc(60px + var(--safe-top));bottom:calc(60px + var(--safe-bottom))}}@media(max-height:700px)and (orientation:portrait){.intro .eyebrow,.intro .description{display:none}.intro h1{font-size:30px;line-height:1.3;margin:10px 0}.intro .primary{margin-top:8px}}@media(prefers-reduced-motion:reduce){button,#toast{transition:none}}#panel:has(.record-settings) .close{width:44px;height:44px;min-width:44px;min-height:44px}@media(pointer:coarse){#panel:has(.record-settings) :is(input,textarea),#panel:has(.record-settings) .record-custom input[type=file],#panel:has(.record-settings) .record-cue-entry input,#panel:has(.record-settings) #record-thought{font-size:16px!important}}@media(max-width:359px){.brand span{font-size:7px;letter-spacing:1px}.intro h1{font-size:30px}footer div{gap:8px}}@media(min-width:600px)and (max-width:767px){.intro{max-width:440px}.intro h1{font-size:38px}.actions button{padding-inline:16px}}@media(min-width:768px)and (max-width:1023px)and (min-height:501px){.intro{max-width:460px}.intro h1{font-size:42px}#panel{left:auto;width:min(480px,calc(100% - 36px))}}@media(max-width:1023px){#panel:has(.record-settings){left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));width:auto;top:calc(72px + var(--safe-top));bottom:calc(18px + var(--safe-bottom));max-height:none}#panel:has(.record-settings) .close{width:44px;height:44px;min-width:44px;min-height:44px}#panel:has(.record-settings) :is(input,textarea),#panel:has(.record-settings) .record-custom input[type=file],#panel:has(.record-settings) .record-cue-entry input,#panel:has(.record-settings) #record-thought{font-size:16px!important}#panel #record-seek{min-height:44px}body[data-near-record=true] .actions{left:var(--edge-left);right:var(--edge-right);top:auto;bottom:calc(76px + var(--safe-bottom));transform:none;flex-direction:row;max-width:none;max-height:none}.hint{font-size:11px;letter-spacing:.4px}}@media(max-height:500px){#panel:has(.record-settings){top:calc(60px + var(--safe-top));bottom:calc(12px + var(--safe-bottom))}body[data-near-record=true] .actions{right:180px;bottom:calc(8px + var(--safe-bottom))}}@media(max-width:1023px),(pointer:coarse){#panel,#panel:has(.record-settings){top:calc(var(--visual-top,0px) + 72px + var(--safe-top));bottom:auto;height:calc(var(--visual-height,100dvh) - 90px - var(--safe-top) - var(--safe-bottom));max-height:calc(min(var(--visual-height,100dvh),100dvh) - 90px - var(--safe-top) - var(--safe-bottom))}}@media(max-height:500px){#panel,#panel:has(.record-settings){top:calc(var(--visual-top,0px) + 60px + var(--safe-top));height:calc(var(--visual-height,100dvh) - 72px - var(--safe-top) - var(--safe-bottom));max-height:calc(min(var(--visual-height,100dvh),100dvh) - 72px - var(--safe-top) - var(--safe-bottom))}}@media(min-width:600px)and (max-height:500px){.record-settings{display:grid;grid-template-columns:minmax(140px,30%) minmax(0,1fr);align-items:start}.record-hero{position:sticky;top:0;padding:20px 12px}.record-body{margin-top:0;padding:0 20px 12px}#panel .record-heading{padding-right:48px}}
