@import url('https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@400;700&family=Noto+Sans+KR:wght@400;500;600&display=swap');
.sky{background:#fff2df38;border-radius:8px;padding:16px 20px;backdrop-filter:blur(8px)}body.night .sky{background:#25334638}@media(max-width:700px){.sky{padding:10px 12px;max-width:56%}}
:root{color-scheme:light;--ink:#413b3c;--paper:#fff7e8;--accent:#815d45}*{box-sizing:border-box}body{margin:0;background:#e2b097;color:var(--ink);font-family:'Noto Sans KR',sans-serif;font-size:13px;overflow:hidden}button,select{font:inherit;color:inherit}button{cursor:pointer;border:1px solid #66584b24;border-radius:24px;background:#fff9eddd;padding:12px 18px;transition:background .2s,transform .2s}button:hover{background:#fffaf0;transform:translateY(-2px)}button:focus-visible,select:focus-visible{outline:3px solid #966543;outline-offset:4px}button:disabled{opacity:.5;cursor:wait}#scene{position:fixed;inset:0;width:100%;height:100%;touch-action:none}header{position:fixed;top:0;left:0;width:100%;padding:28px 38px;display:flex;justify-content:space-between;align-items:center;gap:15px}.brand{display:flex;align-items:center;gap:13px;text-decoration:none;color:inherit;font-family:'Gowun Batang',serif;font-weight:700;font-size:21px;letter-spacing:1px}.brand small{display:block;font:8px sans-serif;letter-spacing:3px;margin-top:6px}.sunmark{font-size:39px;color:#875e48}.top{display:flex;align-items:center;gap:10px}#online{font-size:11px;margin-right:10px}.sky{position:fixed;top:145px;left:5%;pointer-events:none}.eyebrow{font-size:10px;letter-spacing:3px;color:#705b51}h1{font-family:'Gowun Batang',serif;font-size:30px;font-weight:400;line-height:1.4;margin:16px 0 8px}.sky p{color:#69544a;font-size:13px}.sky small{font-size:9px;opacity:.8}.skyline{height:2px;background:#69544a33;width:180px;margin:25px 0 10px;position:relative}.skyline i{position:absolute;top:-4px;width:10px;height:10px;background:#9b614a;border-radius:50%}.room{position:fixed;right:38px;top:115px;display:flex;gap:10px;align-items:center}.room label{font-size:10px}.room select{background:#fff8ea8c;border:1px solid #66584b24;border-radius:20px;padding:9px;max-width:150px}.room button{font-size:11px;padding:10px}footer{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);width:max-content;max-width:96%;text-align:center}.status{display:flex;flex-direction:column;gap:4px;margin-bottom:13px;color:#fff7e5;text-shadow:0 1px 8px #272d29;font-size:12px}#connection{font-size:9px;opacity:.8}nav{display:flex;gap:6px;padding:7px;background:#f9f2e8b8;backdrop-filter:blur(14px);border:1px solid #ffffff66;border-radius:40px}nav button{background:transparent;border:0;font-size:12px;padding:12px 16px}nav button.active{background:#685f4d;color:#fff8e8}#actions{margin-top:9px}#actions button{font-size:11px;margin:0 3px;padding:9px 15px}#toast{position:fixed;bottom:185px;left:50%;transform:translateX(-50%);background:#3d4438e8;color:#fff9eb;border-radius:20px;padding:12px 22px;opacity:0;transition:opacity .2s;pointer-events:none;text-align:center;max-width:90%;width:max-content}#toast.show{opacity:1}dialog{border:1px solid #fff7e9;border-radius:8px;background:#fff9eddc;backdrop-filter:blur(25px);color:var(--ink);padding:42px;max-width:min(90vw,470px);box-shadow:0 25px 100px #503b3e33;text-align:center}dialog::backdrop{background:#47334236;backdrop-filter:blur(5px)}dialog h2{font:700 34px 'Gowun Batang',serif;margin:12px 0 22px}dialog p{line-height:1.9}dialog .sub{color:#847369;font-size:12px;margin:24px 0}.intro-sun{color:#cc845b;font-size:62px;margin:25px 0 15px}.primary{display:block;width:100%;background:#6b735c;color:#fff9ed;padding:17px;margin:24px 0 18px}.primary:hover{background:#59644b}.primary span{float:right}dialog small{font-size:10px;color:#81766b}#guide p{text-align:left}#sand{max-width:min(95vw,800px);width:800px;padding:25px}#sand h2{font-size:24px}#drawing{width:100%;height:auto;display:block;touch-action:none;background:#d8bb8b;border-radius:6px;box-shadow:inset 0 0 30px #775d3433}.sand-tools{display:flex;justify-content:space-between;gap:10px;margin:18px 0}.sand-tools button{font-size:11px}body.night header,body.night .sky,body.night .sky p,body.night .eyebrow,body.night .room label{color:#f7ddc0}body.night .brand .sunmark{color:#f6c597}body.night .skyline{background:#f6c59766}body.night .skyline i{background:#f6c597}body.night dialog .eyebrow{color:#705b51}@media(max-width:700px){header{padding:18px}.brand{font-size:17px}.brand small{font-size:6px;letter-spacing:2px}.sunmark{font-size:30px}.top{gap:5px}.top button{padding:9px 12px;font-size:10px}#online{display:none}.sky{top:98px;left:22px}h1{font-size:23px}.sky p{font-size:11px}.skyline{margin-top:16px;width:140px}.room{top:90px;right:16px;flex-direction:column;gap:7px;align-items:flex-end}.room label{display:none}.room select{font-size:10px;max-width:130px}.room button{padding:7px 10px}footer{bottom:max(14px,env(safe-area-inset-bottom));width:96%}nav{gap:0;padding:5px;border-radius:20px;justify-content:center}nav button{font-size:10px;padding:12px 9px}.status{font-size:11px}dialog{padding:30px 24px}dialog h2{font-size:29px}#toast{bottom:190px;font-size:12px}}@media(prefers-reduced-motion:reduce){button{transition:none}}
