:root{color-scheme:dark;--night:#101826;--paper:#f3eee2;--muted:#c5cfc8;--gold:#efce8c;--line:#ffffff24;--ease-out:cubic-bezier(.23,1,.32,1)}
*{box-sizing:border-box}body{margin:0;font-family:"Malgun Gothic","Apple SD Gothic Neo",system-ui,sans-serif;color:var(--paper);background:var(--night)}button,input,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.6}[hidden]{display:none!important}button:focus-visible,a:focus-visible,select:focus-visible,#school-canvas:focus-visible{outline:3px solid #efd99e;outline-offset:5px}button{transition:transform 120ms var(--ease-out),background 160ms ease}button:active{transform:scale(.97)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.world-page{position:fixed;inset:0;overflow:hidden;overscroll-behavior:none}#school-canvas{width:100%;height:100%;display:block;touch-action:none;outline:none}#school-canvas:focus-visible{outline:2px solid #efce8c;outline-offset:-3px}.world-header{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:26px 34px;pointer-events:none;background:linear-gradient(#101826b3,transparent)}.world-header>*{pointer-events:auto}.world-brand{display:flex;align-items:center;gap:12px;color:var(--paper);font-size:21px;font-weight:700;letter-spacing:-1px;text-decoration:none;text-shadow:0 2px 14px #10182699}.world-brand small{display:block;font-size:10px;font-weight:500;color:#d0d7cb;letter-spacing:.1em;margin-top:3px}.window-mark{display:grid;grid-template-columns:repeat(2,7px);gap:4px;border:1px solid #edce9299;padding:7px;border-radius:10px 10px 3px 3px}.window-mark i{width:7px;height:11px;background:#e9c57b;border-radius:2px}.world-room{display:flex;gap:14px;align-items:center;background:#17252bd4;border:1px solid #c4cebd38;border-radius:30px;padding:6px 15px 6px 7px;box-shadow:0 4px 30px #10182614;backdrop-filter:blur(12px)}.world-room select{border:0;background:#ffffff10;color:#e9ebdf;border-radius:24px;padding:9px 10px;min-height:40px;font-size:13px}.world-room option{color:#eee;background:#243735}#presence-status{font-size:12px;color:#cbd5c9;white-space:nowrap;display:flex;align-items:center;gap:7px}#presence-status i{width:6px;height:6px;background:#aba995;border-radius:50%}#presence-status[data-connected=true] i{background:#c0dca2;box-shadow:0 0 12px #a7df8c66}
.world-welcome{position:absolute;left:7.5%;top:24%;max-width:330px;padding:28px 0;z-index:2}.world-welcome:before{content:"";position:absolute;z-index:-1;inset:-70px -90px -50px -100px;background:radial-gradient(ellipse,#101d24dc 10%,#101d24a0 40%,transparent 72%);pointer-events:none}.world-kicker{font-size:13px;color:#dac396;margin:0 0 20px}.world-welcome h1{font-size:clamp(46px,5vw,68px);font-weight:700;letter-spacing:-.075em;line-height:1.18;margin:0 0 22px}.world-welcome>p:not(.world-kicker):not(.world-fine){font-size:15px;line-height:1.85;color:#dae0d7;letter-spacing:-.03em}.outfit-picker{padding:0;border:0;display:flex;gap:10px;margin:28px 0 26px}.outfit-picker legend{font-size:11px;color:#becbc5;margin-bottom:11px}.outfit-picker label{position:relative;width:32px;height:32px;display:block}.outfit-picker input{appearance:none;width:28px;height:28px;border-radius:50%;background:var(--outfit);border:3px solid #ffffff25;margin:2px;cursor:pointer}.outfit-picker input:checked{outline:2px solid #fff3d1;outline-offset:3px}.outfit-picker span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.warm-button{border:0;border-radius:8px;background:var(--gold);color:#283b37;min-height:52px;padding:14px 26px;font-weight:700;font-size:14px;box-shadow:0 4px 20px #05171a22}.world-welcome .warm-button{width:100%}.world-fine{font-size:11px;line-height:1.8;color:#b5c3bc;margin:12px 0 0}
.world-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:14px;background:#101826;color:#e4dcc8;font-size:14px;z-index:5}.world-loading span{width:14px;height:20px;background:#e2bc73;box-shadow:0 0 22px #e2bc7355;border-radius:4px 4px 0 0}.world-error{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(450px,calc(100% - 32px));background:#263936;padding:28px;border-radius:16px;z-index:6}.world-error h2{font-size:22px}.world-error p{font-size:14px;line-height:1.8}.world-error a,.world-error button{display:block;color:#ffe0a3;margin-top:16px}.world-error button{background:none;border:1px solid #e6c58c;padding:10px 20px;border-radius:8px}
.world-tools{position:absolute;right:28px;top:50%;display:flex;flex-direction:column;gap:7px;transform:translateY(-50%)}.world-tools button{width:42px;height:42px;border-radius:50%;background:#182e30cf;border:1px solid #e1e4cd30;color:#dfe4d3;font-size:23px;display:grid;place-items:center;backdrop-filter:blur(8px)}.world-tools svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.world-nav{position:absolute;bottom:42px;left:50%;transform:translateX(-50%);display:flex;align-items:center;padding:7px;background:#1c3031ed;backdrop-filter:blur(18px);border:1px solid #cbd5ba40;border-radius:18px;box-shadow:0 12px 40px #0b182450;z-index:2}.world-nav button{border:0;background:transparent;color:#e9e8d9;display:flex;align-items:center;gap:11px;padding:13px 22px;min-height:50px;font-size:13px;border-radius:12px;white-space:nowrap}.world-nav button+button{border-left:1px solid #cbd5ba26;border-top-left-radius:0;border-bottom-left-radius:0}.world-nav svg{width:21px;height:21px;fill:none;stroke:#e0cd9f;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.control-hint{position:absolute;bottom:11px;left:50%;transform:translateX(-50%);margin:0;font-size:10px;color:#d2dbc9;text-shadow:0 1px 5px #091d22;white-space:nowrap}.control-hint span{padding:0 8px}.control-hint kbd{font-family:inherit;color:#e5e6d7}
.station-action{position:absolute;bottom:132px;left:50%;transform:translateX(-50%);z-index:2}.station-action button{display:flex;align-items:center;gap:12px;min-height:46px;padding:8px 15px;background:#f3e8cf;color:#2b453d;border:1px solid #fff6df;border-radius:9px;box-shadow:0 5px 22px #0a241e50;font-size:12px}.station-action kbd{border:1px solid #a1a98f;border-radius:4px;padding:3px 6px;font:600 11px inherit}.station-action span:last-child{color:#69795e;font-size:11px}.world-notice{position:absolute;top:96px;left:50%;transform:translateX(-50%);max-width:min(560px,calc(100% - 28px));border:1px solid #e4d5b344;background:#263c38f2;border-radius:10px;padding:11px 18px;font-size:12px;line-height:1.7;z-index:4;box-shadow:0 7px 30px #091c2940}
.world-dialog{position:fixed;inset:20px 22px 20px auto;width:min(490px,calc(100% - 32px));height:calc(100dvh - 40px);max-height:none;max-width:none;margin:0;border:1px solid #d1cbb7;border-radius:18px;padding:0;background:#f3eee2;color:#34463d;overflow:hidden;box-shadow:-12px 10px 50px #071d3140}.world-dialog::backdrop{background:#0b1e2b26;backdrop-filter:none}.world-dialog>header{display:flex;align-items:center;justify-content:space-between;padding:14px 19px;border-bottom:1px solid #d9d7c7;background:#eee8d8;height:64px}.world-dialog>header>div{display:flex;align-items:center;gap:10px}.world-dialog h2{font-size:14px;letter-spacing:-.03em;font-weight:600;margin:0}.dialog-marker{width:9px;height:12px;background:#c09a58;border-radius:4px 4px 1px 1px}.world-dialog>header>button{border:0;background:transparent;font-size:26px;color:#4b5d50;width:40px;height:40px;border-radius:10px}.world-dialog iframe{border:0;width:100%;height:calc(100% - 64px);background:#f3eee2;display:block}.help-dialog{padding:30px;border:1px solid #7e9688;border-radius:18px;background:#263d36;color:#ede9d8;width:min(430px,calc(100% - 32px))}.help-dialog::backdrop{background:#0b1e2b80;backdrop-filter:blur(4px)}.help-dialog h2{font-size:24px;letter-spacing:-.055em;margin:0 0 20px}.help-dialog p{font-size:14px;line-height:1.9;color:#ccd7c8}.help-dialog .warm-button{width:100%;margin-top:14px}
.joystick{position:absolute;left:27px;bottom:128px;width:104px;height:104px;border:1px solid #e4e5c74d;background:#f1ebcd10;border-radius:50%;touch-action:none;z-index:3;display:none;backdrop-filter:blur(3px)}.joystick span{position:absolute;left:30px;top:30px;width:42px;height:42px;border:1px solid #eddfb778;border-radius:50%;background:#e3d7ae59;pointer-events:none}
@media(hover:hover) and (pointer:fine){.world-nav button:hover,.world-tools button:hover{background:#456454}.world-dialog>header>button:hover{background:#dcdcca}.warm-button:hover{background:#f9dca0}}
@media(pointer:coarse){.joystick{display:block}.control-hint{display:none}}
@media(max-width:620px){.world-header{padding:18px 17px}.world-brand{font-size:17px;gap:9px}.world-brand small{font-size:9px}.window-mark{grid-template-columns:repeat(2,5px);gap:3px;padding:6px}.window-mark i{width:5px;height:9px}.world-room{gap:8px;padding:4px 10px 4px 4px}.world-room select{font-size:11px;padding:6px;min-height:34px}#presence-status{font-size:10px}.world-welcome{left:24px;top:auto;bottom:44px;width:calc(100% - 48px);max-width:340px;padding:0}.world-welcome:before{inset:-80px -100px -70px -70px;background:radial-gradient(ellipse,#10252ce8 20%,#10252ca8 55%,transparent 78%)}.world-welcome h1{font-size:48px;line-height:1.12;margin-bottom:12px}.world-welcome>p:not(.world-kicker):not(.world-fine){font-size:13px;margin:9px 0}.world-kicker{font-size:11px;margin:0 0 12px}.outfit-picker{margin:20px 0}.world-welcome .world-fine{font-size:10px}.world-tools{right:14px;top:39%;gap:6px}.world-tools button{width:36px;height:36px;font-size:21px}.world-nav{bottom:max(19px,env(safe-area-inset-bottom));width:calc(100% - 28px);justify-content:space-between;border-radius:16px;padding:5px}.world-nav button{flex:1;flex-direction:column;gap:6px;padding:9px 10px;font-size:10px;min-height:62px}.world-nav svg{width:22px;height:22px}.station-action{bottom:110px;left:auto;right:16px;transform:none}.station-action button{gap:8px;font-size:11px;max-width:220px}.station-action kbd{display:none}.world-notice{top:79px;font-size:11px}.world-dialog{inset:10px 10px 10px 10px;width:calc(100% - 20px);height:calc(100dvh - 20px);border-radius:16px}.world-dialog>header{height:56px}.world-dialog iframe{height:calc(100% - 56px)}.joystick{bottom:113px;width:92px;height:92px;left:22px}.joystick span{top:24px;left:24px}.control-hint{display:none}}
/* The world is the main view; controls sit at its edges and activity reads as stationery. */
.world-header{padding:25px 32px;background:linear-gradient(#111d2bb3,transparent)}
.world-brand{font-size:19px;font-weight:600;letter-spacing:-.055em}
.world-brand small{font-size:10px;letter-spacing:0;color:#bac6c3}
.world-welcome{left:6.2%;top:23%;max-width:310px}
.world-welcome h1{font-family:"Batang","AppleMyungjo",serif;font-size:64px;letter-spacing:-.075em;font-weight:400;line-height:1.3}
.world-welcome:before{inset:-70px -90px -80px -120px;background:radial-gradient(ellipse,#13202cdd 10%,#13202c91 45%,transparent 72%)}
.world-kicker{color:#e4c99c;font-size:12px}
.world-welcome .warm-button{border-radius:30px;min-height:50px}
.world-tools{top:auto;bottom:120px;transform:none;right:25px}
.world-tools button{width:35px;height:35px;font-size:19px;background:#172a30a6}
.world-nav{padding:5px;border-radius:40px;bottom:32px;background:#172b30e6;box-shadow:0 8px 30px #0b182430}
.world-nav button{padding:12px 21px;font-size:12px;min-height:48px;border-radius:28px}
.control-hint{bottom:9px;color:#c5cfc6;font-size:9px}
.world-dialog{inset:50% 28px auto auto;transform:translateY(-50%);width:min(420px,calc(100% - 32px));height:min(720px,calc(100dvh - 80px));border-radius:6px 18px 18px 6px;border:1px solid #d5ceba;box-shadow:-15px 15px 50px #071d3133}
.world-dialog::backdrop{background:transparent}
.world-dialog>header{height:56px;padding:11px 15px;background:#ede6d6}
.world-dialog h2{font-size:12px}
.world-dialog iframe{height:calc(100% - 56px)}
@media(max-width:620px){
 .world-header{padding:18px 16px}.world-brand{font-size:17px}.world-brand small{font-size:9px}
 .world-welcome{left:24px;top:auto;bottom:40px;max-width:310px}.world-welcome h1{font-size:46px;line-height:1.23;margin-bottom:12px}
 .world-tools{top:110px;bottom:auto;right:13px;gap:5px}.world-tools button{width:32px;height:32px}
 .world-nav{bottom:max(19px,env(safe-area-inset-bottom));border-radius:20px}.world-nav button{padding:9px 8px;min-height:62px;font-size:10px;border-radius:14px}
 .world-dialog{inset:auto 8px 8px 8px;transform:none;width:calc(100% - 16px);height:min(620px,76dvh);border-radius:18px 18px 8px 8px}
 .world-dialog::backdrop{background:#101e2833}.world-dialog>header{height:50px}.world-dialog iframe{height:calc(100% - 50px)}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}.world-dialog::backdrop{backdrop-filter:none}}
