@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600&family=Playfair+Display:ital,wght@0,400;0,500;1,400&display=swap');
:root{color-scheme:dark;font-family:Manrope,Arial,sans-serif;color:#eee4d4;background:#17171c}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;background:none;border:1px solid #e9d4b52e;border-radius:100px;padding:10px 17px}button:hover{background:#efd1a318}button:focus-visible{outline:2px solid #eec99b;outline-offset:4px}a{color:inherit;text-decoration:none}#world{position:fixed;inset:0;width:100%;height:100%;display:block}.grain{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse,transparent 45%,#0b080848);z-index:1}header{position:fixed;top:0;left:0;right:0;padding:30px 38px;display:flex;justify-content:space-between;align-items:center;z-index:3;background:linear-gradient(#100e1655,transparent)}.brand{font-family:'Playfair Display',Georgia,serif;font-size:25px}.brand span{display:block;font-family:Manrope,Arial;font-size:8px;letter-spacing:2.5px;margin-top:7px;color:#baa997}.header-right{display:flex;align-items:center;gap:16px;font-size:11px;letter-spacing:.4px}#help{padding:8px 13px}#weather{color:#c8beb3}#welcome{position:fixed;inset:0;z-index:2;display:flex;align-items:center;padding:8vw;background:linear-gradient(90deg,#121018ce 0%,#12101888 35%,transparent 70%)}.intro{max-width:460px}.eyebrow{font-size:9px;letter-spacing:3px;color:#d0b38c}h1{font-family:'Playfair Display',Georgia,serif;font-weight:400;line-height:1.06;font-size:clamp(48px,7vw,100px);margin:24px 0}h1 i{color:#e9c496}.intro p{color:#c7bcb0;font-size:14px;line-height:1.9}.primary{background:#e8c79e;color:#30271f;border:none;padding:17px 24px;border-radius:5px;margin-top:20px;min-width:245px;text-align:left}.primary:hover{background:#f3d5af}.primary span{float:right}small{display:block;color:#a79b90;line-height:1.9;font-size:10px;margin-top:22px}.intro-note{position:absolute;bottom:85px;right:40px;font-size:9px;letter-spacing:2px;color:#bdafa0}footer{position:fixed;bottom:0;width:100%;padding:23px 38px;display:flex;align-items:center;justify-content:space-between;z-index:3;background:linear-gradient(transparent,#110f1766);font-size:10px;color:#c6b9a8}footer button{border:none;padding:5px;font-size:11px}#crosshair{display:none;position:fixed;top:50%;left:50%;width:5px;height:5px;border-radius:50%;background:#f5e6c0bd;box-shadow:0 0 0 4px #fff1;z-index:3}#prompt{position:fixed;top:57%;left:50%;transform:translateX(-50%);z-index:3;font-size:12px;background:#19151fe0;border-radius:6px;padding:10px 15px;display:none;white-space:nowrap}#toast{position:fixed;bottom:105px;left:50%;transform:translateX(-50%);z-index:5;background:#262029ee;border:1px solid #e5c79833;border-radius:8px;padding:13px 20px;font-size:12px;opacity:0;transition:opacity .3s;pointer-events:none}dialog{color:#eee4d4;width:min(580px,92vw);max-height:85vh;background:#27232b;border:1px solid #dcc4a533;border-radius:14px;padding:34px;box-shadow:0 30px 100px #0008}dialog::backdrop{background:#08080c99;backdrop-filter:blur(8px)}.close{position:absolute;right:14px;top:12px;border:none;font-size:24px;padding:3px 10px}h2{font-family:'Playfair Display',Georgia,serif;font-weight:400;font-size:31px;margin:8px 0 15px}dialog p{font-size:13px;line-height:1.8;color:#bfb2a9}.eyebrow,dialog .label{font-size:9px;letter-spacing:2px;color:#d6b58c}.actions{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0}dialog button{font-size:12px}.track{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #fff1;font-size:12px}.track span{overflow:hidden;text-overflow:ellipsis}.inspect{height:280px;background:radial-gradient(#48414b,#201d25);border-radius:9px;position:relative;touch-action:none;cursor:grab}.inspect canvas{width:100%;height:100%;display:block}.reference{width:100%;max-height:290px;object-fit:contain;border-radius:7px;background:#e8e4de}.subtle{font-size:10px!important;color:#968c86!important}#mobile{display:none;position:fixed;bottom:80px;left:20px;right:20px;justify-content:space-between;align-items:flex-end;z-index:3;pointer-events:none}#mobile button{background:#211e2aaa;padding:14px;pointer-events:auto;touch-action:none}#mobile>div{text-align:center}body.playing #crosshair{display:block}body.playing #welcome{display:none}@media(pointer:coarse){body.playing #mobile{display:flex}}@media(max-width:600px){header{padding:22px}.brand{font-size:21px}.brand span{font-size:6px;letter-spacing:1.5px}.header-right{gap:7px}#weather{display:none}#sound{font-size:9px;padding:8px}.intro-note{display:none}footer{padding:20px}#footerHint{max-width:210px;line-height:1.7}#welcome{padding:30px}h1{font-size:65px}}
html,body{height:100%;overscroll-behavior:none;touch-action:none}#rotateNotice{display:none;position:fixed;top:93px;left:18px;right:18px;z-index:6;background:#292330e8;border:1px solid #e4c39a33;border-radius:8px;padding:12px 40px 12px 14px;color:#dfc5a3;font-size:11px;line-height:1.5}#dismissRotate{position:absolute;right:7px;top:4px;border:none;font-size:19px;padding:4px 8px}#joystick{position:relative;width:105px;height:105px;border:1px solid #f0d1ac55;border-radius:50%;background:#26202c66;pointer-events:auto;touch-action:none}#stick{position:absolute;left:32px;top:32px;width:39px;height:39px;border-radius:50%;background:#e6c29866;border:1px solid #e6c29899;pointer-events:none}#touchAct{min-height:61px;min-width:95px}dialog{touch-action:pan-y}dialog .inspect{touch-action:none}dialog button{min-height:44px}dialog summary{padding:12px 0;cursor:pointer}dialog input[type=range]{min-height:35px}.header-right button{min-height:38px}#mobile{bottom:calc(70px + env(safe-area-inset-bottom));left:calc(22px + env(safe-area-inset-left));right:calc(22px + env(safe-area-inset-right))}header{padding-top:calc(22px + env(safe-area-inset-top))}footer{padding-bottom:calc(20px + env(safe-area-inset-bottom))}@media(pointer:coarse) and (orientation:portrait){#rotateNotice:not(.dismissed){display:block}#welcome{padding-top:145px;padding-bottom:95px}.intro h1{font-size:58px;margin:16px 0}.intro p{font-size:13px}.intro small{font-size:10px}body.playing footer #footerHint{max-width:170px}}@media(max-height:600px) and (orientation:landscape){header{padding:12px 24px}.brand{font-size:20px}.brand span{font-size:6px}footer{padding:12px 24px}#welcome{padding:65px 7vw}.intro h1{font-size:48px;line-height:1;margin:10px 0}.intro p{font-size:11px;margin:8px 0}.intro .primary{margin-top:6px;padding:12px 18px}.intro small{margin-top:10px;font-size:9px}.eyebrow{font-size:8px}.intro-note{display:none}#mobile{bottom:48px}dialog{max-height:88vh;padding:25px}.inspect{height:220px}#joystick{width:94px;height:94px}#stick{left:27px;top:27px}}
/* Clear contextual controls for touch and mouse. */
[hidden]{display:none!important}button:disabled{opacity:.55;cursor:default}#interactionHud{display:none;position:fixed;z-index:4;bottom:75px;left:50%;transform:translateX(-50%);width:min(420px,calc(100vw - 36px));text-align:center;pointer-events:none}body.playing #interactionHud{display:flex;flex-direction:column;align-items:center;gap:7px}#objectName{max-width:100%;font-size:11px;line-height:1.5;text-shadow:0 2px 5px #000;background:#201e25b8;padding:5px 12px;border-radius:6px}#actionButton{pointer-events:auto;min-height:49px;max-width:100%;background:#f5ead7;color:#342d27;border:1px solid #fff9;box-shadow:0 5px 25px #0005;font-size:13px;font-weight:600;border-radius:12px}#actionButton:disabled{background:#27212bda;color:#e3d9ce;opacity:.8}#hands{position:fixed;z-index:4;right:24px;top:105px;max-width:350px;background:#24212bea;border:1px solid #f5ddbb55;border-radius:12px;padding:12px}#heldName{display:block;font-size:11px;margin-bottom:9px;color:#e9cca5}#hands>div{display:flex;gap:7px;flex-wrap:wrap}#hands button{padding:10px 12px;min-height:44px;font-size:11px}#sip{background:#dcc099;color:#302922}#touchAct{display:none}.setting{display:flex;flex-direction:column;gap:9px;margin:22px 0;font-size:13px}.setting select{font:inherit;background:#39323b;color:#f5e7d4;border:1px solid #ae987f;border-radius:9px;padding:13px;width:100%;min-height:48px}#world{cursor:grab}#world:active{cursor:grabbing}#toast{max-width:min(520px,90vw);bottom:180px;text-align:center;line-height:1.6}header button{min-height:44px!important}.header-right{gap:8px}#settings{font-size:11px;padding:9px 13px}#crosshair{pointer-events:none}
@media(max-width:600px){header{padding:15px}.brand{font-size:18px}.brand span{display:none}.header-right{gap:5px}#settings{padding:8px 10px}#sound{max-width:70px}#hands{top:85px;left:15px;right:15px;max-width:none;padding:9px 12px}#interactionHud{bottom:195px!important}#objectName{font-size:10px}#actionButton{font-size:12px}#toast{bottom:295px}#rotateNotice{top:155px}footer{font-size:9px}#weather{display:none}}
@media(max-height:600px) and (orientation:landscape){#interactionHud{bottom:48px!important;width:min(390px,50vw)}#objectName{font-size:9px}#actionButton{min-height:44px;font-size:11px;padding:10px 16px}#hands{top:72px;right:18px;max-width:310px;padding:8px 10px}#heldName{margin-bottom:5px;font-size:10px}#hands button{min-height:40px;font-size:10px;padding:8px 11px}#toast{bottom:150px}.brand span{display:none}}

/* Keep feedback and actions beside the scene, away from its centre. */
#toast{left:calc(18px + env(safe-area-inset-left));right:auto;top:calc(104px + env(safe-area-inset-top));bottom:auto;transform:none;width:230px;max-width:calc(100vw - 36px);padding:10px 12px;text-align:left;font-size:11px;line-height:1.5;background:#27232bd9;border-radius:9px}
#interactionHud{left:auto;right:calc(24px + env(safe-area-inset-right));bottom:76px!important;transform:none;width:min(260px,42vw);text-align:right;align-items:flex-end!important}
#objectName:empty{display:none}#objectName{font-size:10px}#actionButton{font-size:12px;white-space:normal;text-align:center}
@media(max-width:600px){#toast{top:77px;left:12px;width:210px;font-size:10px}#interactionHud{right:15px;width:min(215px,56vw);bottom:83px!important}#hands{left:auto;right:12px;top:auto;bottom:80px;width:215px;max-width:56vw;padding:9px}#hands>div{gap:5px}#hands button{padding:8px 10px;min-height:44px}#hands:not([hidden])~footer #footerHint{max-width:105px}#interactionHud:has(+ #hands:not([hidden])){bottom:240px!important}#rotateNotice{top:160px}}
@media(max-height:600px) and (orientation:landscape){#toast{top:70px;left:15px;width:190px;font-size:10px;padding:8px 10px}#interactionHud{right:20px;bottom:49px!important;width:220px;max-width:30vw}#actionButton{min-height:44px;font-size:11px}#hands{top:70px;bottom:auto;left:auto;right:18px;width:250px;max-width:34vw}#interactionHud:has(+ #hands:not([hidden])){bottom:49px!important}}
.telescopeView{width:min(100%,390px);margin:0 auto;aspect-ratio:1;border-radius:50%;background:#070b16;box-shadow:0 0 0 6px #111620,0 0 0 7px #8d8e9a33,0 15px 40px #0007;overflow:hidden}.telescopeView canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}.skyName{text-align:center;color:#e1dded!important;margin:18px 0 5px;font-family:Georgia,serif;font-size:18px!important}.skyActions{justify-content:center;margin:12px 0}.blanketMemory{font-family:Georgia,serif!important;font-style:italic;font-size:20px!important;color:#ead6bd!important;text-align:center;line-height:1.6}
dialog[open]:has(#starCanvas){width:min(620px,94vw);max-height:94vh}dialog[open]:has(#starCanvas) h2{font-size:26px;margin:8px 0 22px}@media(max-height:600px) and (orientation:landscape){dialog[open]:has(#starCanvas){display:grid;grid-template-columns:1fr;width:min(720px,94vw)}dialog[open]:has(#starCanvas) #panelContent{display:grid;grid-template-columns:min(45vw,300px) 1fr;column-gap:24px;align-items:center}.telescopeView{grid-column:1;grid-row:1/7;width:100%}dialog[open]:has(#starCanvas) .label,dialog[open]:has(#starCanvas) h2,dialog[open]:has(#starCanvas) p,dialog[open]:has(#starCanvas) .actions,dialog[open]:has(#starCanvas) #leaveSky{grid-column:2}dialog[open]:has(#starCanvas) h2{font-size:22px;margin:6px 0}dialog[open]:has(#starCanvas) p{margin:7px 0}.skyActions{gap:6px}.skyActions button{padding:7px 10px}.skyName{font-size:15px!important}}