:root{color-scheme:dark;--bg:#191c1b;--text:#f1f1eb;--muted:#a6afa7;--line:#3c433e;--accent:#b0c7ac}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 Arial,Helvetica,sans-serif;height:100dvh;overflow:hidden}button,a,input,select{-webkit-tap-highlight-color:transparent}button,a{color:inherit}button{font:inherit;cursor:pointer}button{background:transparent;border:1px solid var(--line);border-radius:5px;padding:12px 16px;transition:background .18s,border-color .18s}button:hover{background:#ffffff0d;border-color:#aab7ad}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button:disabled{opacity:.4;cursor:wait}a{text-decoration:none}header{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 34px;border-bottom:1px solid var(--line);gap:15px}.brand{font:40px/1 Georgia,serif;white-space:nowrap}.brand span{font-size:27px;letter-spacing:5px;color:#d8dcd5}nav{display:flex;align-items:center;gap:28px}nav button{padding:6px 0;border:0;border-radius:0;font-size:14px}nav a{font-size:14px;border-left:1px solid var(--line);padding-left:25px}nav button[aria-pressed=true]{color:var(--accent)}main{height:calc(100dvh - 72px);display:grid;grid-template-columns:minmax(0,3fr) minmax(300px,1fr)}#stage{position:relative;min-height:0;overflow:hidden;background:#8caeb1}canvas{width:100%;height:100%;display:block;outline:none;touch-action:none}.intro{position:absolute;left:0;right:0;bottom:0;padding:95px 38px 38px;pointer-events:none;background:linear-gradient(transparent,rgba(9,18,15,.65))}.intro h1{margin:0;font:clamp(44px,4.6vw,76px)/1.08 Georgia,serif;letter-spacing:-2px;text-shadow:0 2px 15px #0003}.intro p{font:clamp(21px,1.8vw,29px)/1.4 Georgia,serif;margin:10px 0 18px}.intro button{pointer-events:auto}.primary{background:var(--accent);border-color:var(--accent);color:#17241e;min-width:215px;display:inline-flex;justify-content:space-between;gap:28px;padding:16px 24px;font-size:17px}.primary:hover{background:#c6d9c0}.primary span{font-size:23px;line-height:1}aside{padding:32px 22px 20px;display:flex;flex-direction:column;overflow-y:auto;border-left:1px solid var(--line)}.world-list{display:flex;flex-direction:column;gap:12px}.world-choice{display:flex;align-items:center;gap:16px;padding:11px 13px;text-align:left;min-height:95px;font:23px Georgia,serif}.world-choice img{width:90px;height:72px;object-fit:cover;border-radius:3px}.world-choice .number{font:16px Arial,sans-serif;color:var(--muted)}.world-choice.active{background:#555f50;border-color:#656e61}.invitation{margin-top:60px;padding:30px 6px 15px;border-top:1px solid var(--line)}h2{font:40px/1.17 Georgia,serif;letter-spacing:-.5px;margin:0 0 18px}.invitation p{font-size:20px;line-height:1.6;color:#d3d8d1;margin:0 0 20px}small{font-size:12px;color:var(--muted);line-height:1.6}.bottom-controls{margin-top:auto;padding-top:35px}.utility{display:flex;gap:8px}.utility button{flex:1;display:flex;align-items:center;justify-content:center;gap:12px;font-size:14px;padding:19px 8px;white-space:nowrap}.utility svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.6}.keyboard-hint{font-size:11px;text-align:center;color:var(--muted);margin-top:23px;white-space:nowrap}#loading{position:absolute;inset:0;display:grid;place-content:center;background:#191c1be0;font:24px Georgia,serif;z-index:3}#loading[hidden]{display:none}#error{position:absolute;inset:0;background:#19201f;padding:40px;z-index:5;display:flex;justify-content:center;flex-direction:column}#error[hidden]{display:none}#walk-hud{position:absolute;left:18px;right:18px;top:18px;display:flex;justify-content:space-between;align-items:center;pointer-events:none;gap:10px}#walk-hud[hidden]{display:none}#walk-hud span{font:22px Georgia,serif;text-shadow:0 1px 6px #000}#walk-hud button{pointer-events:auto;background:#111c19b8;backdrop-filter:blur(10px);border-color:#ffffff55}#crosshair{width:4px;height:4px;background:#fff9;border-radius:50%;position:absolute;left:50%;top:50%;pointer-events:none}#toast{position:absolute;top:80px;left:50%;transform:translateX(-50%);background:#14211fe8;border:1px solid #76907f;padding:9px 16px;border-radius:5px;max-width:85%;opacity:0;pointer-events:none;transition:opacity .2s;text-align:center}#toast.visible{opacity:1}#creator-panel h2{font-size:34px;margin:0 0 8px}#creator-panel>p{color:#bcc7bd;margin-bottom:25px}label{display:flex;justify-content:space-between;font-size:13px;color:#d9dfd7;margin-top:17px}input[type=range]{width:100%;accent-color:var(--accent);margin:12px 0}input[type=color]{height:37px;width:100%;border:1px solid var(--line);background:none;margin-top:8px}select{padding:10px;color:var(--text);background:#232a26;border:1px solid #4a554c;border-radius:4px;width:100%;font:14px Arial,sans-serif;margin:8px 0 2px}.creator-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:24px 0 16px}.creator-actions button{font-size:12px;padding:10px 5px}dialog{color:var(--text);background:#202723;border:1px solid #536054;border-radius:9px;max-width:540px;width:calc(100% - 36px);padding:34px;max-height:90dvh;overflow-y:auto}dialog::backdrop{background:#08130caa;backdrop-filter:blur(5px)}dialog p{color:#ced6cc;font-size:15px}.close{position:absolute;right:8px;top:5px;border:0;font-size:25px;padding:4px 12px}.small{font-size:12px;opacity:.7}#teleport{margin-top:15px;width:100%;font-size:15px}.walking .intro{display:none}.walking #stage{cursor:crosshair}.walking #touch-controls:not([hidden]){display:block}#touch-controls{position:absolute;inset:0;pointer-events:none}#joystick{position:absolute;bottom:28px;left:25px;width:115px;height:115px;border:1px solid #ffffff65;background:#15292240;border-radius:50%;pointer-events:auto;touch-action:none}#joystick span{position:absolute;left:36px;top:36px;width:42px;height:42px;border-radius:50%;background:#dfebd7a6;box-shadow:0 2px 10px #0003;pointer-events:none}.look-hint{position:absolute;right:24px;bottom:30px;color:#fffc;font-size:11px;text-shadow:0 1px 4px #000}body.walking aside{opacity:.85}@media(min-width:1800px){main{grid-template-columns:minmax(0,1fr) 420px}}@media(max-height:820px) and (min-width:901px){aside{padding-top:22px}.world-choice{min-height:74px;font-size:20px}.world-choice img{width:70px;height:54px}.invitation{margin-top:30px;padding-top:25px}h2{font-size:33px}.invitation p{font-size:17px}.bottom-controls{padding-top:15px}.utility button{padding:13px 8px}.keyboard-hint{margin-top:17px}#creator-panel h2{font-size:27px}#creator-panel>p{margin:4px 0 14px}#creator-panel label{margin-top:9px}.creator-actions{margin:15px 0 8px}}
@media(max-width:900px){header{height:62px;padding:0 18px}.brand{font-size:28px}.brand span{font-size:17px;letter-spacing:3px}nav{gap:15px}nav button{font-size:12px}nav a{font-size:0;border:0;padding:0}nav a:after{content:'↗';font-size:23px}main{height:calc(100dvh - 62px);grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}aside{padding:10px 12px 8px;border-left:0;border-top:1px solid var(--line);overflow:visible}.world-list{flex-direction:row;gap:7px}.world-choice{flex:1;min-height:57px;padding:8px;gap:8px;font-size:15px;justify-content:center}.world-choice img{width:44px;height:40px}.world-choice .number{display:none}.invitation{display:none}.bottom-controls{padding-top:6px;display:flex;align-items:center;gap:12px}.utility{margin-left:auto}.utility button{padding:6px 10px;font-size:11px}.utility svg{width:16px;height:16px}.keyboard-hint{font-size:10px;margin:0;order:-1;white-space:normal}.intro{padding:70px 23px 25px}.intro h1{font-size:47px;letter-spacing:-1px}.intro p{font-size:21px}.primary{font-size:15px;padding:13px 19px;min-width:190px}body:has(#creator-panel:not([hidden])) aside{position:absolute;right:0;top:62px;bottom:0;width:300px;background:#191e1bf7;z-index:4;overflow-y:auto;padding:22px}body:has(#creator-panel:not([hidden])) main{display:block}body:has(#creator-panel:not([hidden])) #stage{height:100%}#creator-panel h2{font-size:30px}.walking .keyboard-hint{display:none}.walking .world-choice{min-height:40px;font-size:13px}.walking .world-choice img{display:none}.walking aside{opacity:1}.walking .bottom-controls{display:none}.walking main{grid-template-rows:minmax(0,1fr) auto}}
@media(max-width:480px){.world-choice img{display:none}.world-choice{min-height:46px;font-size:14px}.keyboard-hint{max-width:140px;font-size:9px}.utility button{gap:6px}.intro h1{font-size:41px}.intro p{font-size:18px}.look-hint{max-width:130px}nav{gap:12px}.brand span{font-size:15px;letter-spacing:2px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
