:root{font-family:system-ui,sans-serif;color:#173652;background:#b5d6e8;font-size:16px}*{box-sizing:border-box}body{margin:0;min-height:100dvh;background:linear-gradient(#d8efff15,#082b5225),url('/assets/room-v1.webp') center/cover fixed}header{position:fixed;z-index:5;top:0;left:0;right:0;padding:12px 4%;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(#ffffffdc,#ffffff40);font-size:14px;pointer-events:none}header>*{pointer-events:auto}main{min-height:100dvh}.scene{position:fixed;inset:0;pointer-events:none}.room{position:absolute;right:5%;bottom:190px;width:380px;text-align:center;transition:right .35s,bottom .35s}.window,.room small{display:none}.avatar{width:380px;height:380px;background-image:url('/assets/expressions-v1.webp');background-size:300% 200%;background-repeat:no-repeat;filter:drop-shadow(0 12px 12px #28507a35);animation:bob 4s ease-in-out infinite}.avatar img{display:none}.avatar[data-mood="welcome"]{background-position:0% 0%}.avatar[data-mood="focused"]{background-position:50% 0%}.avatar[data-mood="smug"]{background-position:100% 0%}.avatar[data-mood="confused"]{background-position:0% 100%}.avatar[data-mood="happy"]{background-position:50% 100%}.avatar[data-mood="shy"]{background-position:100% 100%}.dialogue{position:absolute;z-index:4;bottom:24px;left:5%;right:5%;min-height:155px;padding:25px 35px 18px;background:linear-gradient(120deg,#f5fcfff5,#e5f4fff2);border:2px solid #fff;border-radius:18px;box-shadow:0 8px 35px #17365235;pointer-events:auto}.nameplate{position:absolute;top:-22px;left:30px;padding:8px 28px;border-radius:12px;background:#087caf;color:white;border:2px solid #fff;box-shadow:0 3px 12px #17365220;letter-spacing:.04em}.dialogue p{font-size:23px;line-height:1.65;margin:6px 0 12px}.workspace{position:relative;z-index:2;padding:80px 0 235px 4%;width:66%;display:grid;grid-template-columns:1fr;gap:12px}aside,.code-panel{border:1px solid #ffffffed;background:#f7fcfff2;border-radius:16px;box-shadow:0 8px 30px #17365220;padding:18px 22px}aside{display:grid;grid-template-columns:1fr auto;gap:5px 18px}aside small,h1,#task,#progress,#saved{grid-column:1}h1{font-size:22px;margin:0}p{line-height:1.6}#task{margin:5px 0}#progress{font-size:13px;color:#167ea7;margin:3px 0}#hint{grid-column:2;grid-row:1/3}#reset{grid-column:2;grid-row:3}#saved{font-size:12px;margin:3px 0}#paper,#finish{grid-column:1/-1}.paper{background:#fff5d6;padding:12px;border-radius:10px;margin:5px 0}button{font:inherit;padding:9px 17px;border:1px solid #99c9e6;border-radius:9px;background:#087caf;color:white;cursor:pointer;margin:4px 8px 4px 0;transition:background .15s,transform .15s}button:hover:not(:disabled){background:#096c98;transform:translateY(-1px)}button:disabled{opacity:.45;cursor:default}.quiet,header button{background:#eef8ff;color:#245c7b}small,#version{font-size:13px;color:#4c6e86}.toolbar{display:flex;justify-content:space-between;gap:12px;margin-bottom:10px}.editor{display:flex;background:#10283e;border-radius:10px;margin-top:10px;overflow:hidden}#numbers{margin:0;padding:14px 8px;color:#7e9aae;font:15px/1.6 monospace;user-select:none;max-height:350px;overflow:hidden}.code-stack{position:relative;flex:1;min-width:0}#highlight{position:absolute;inset:0;margin:0;padding:14px 8px;font:15px/1.6 monospace;white-space:pre;overflow:hidden;pointer-events:none;color:#e1f5ff}textarea{resize:vertical;border:0;outline:none;width:100%;min-height:185px;padding:14px 8px;font:15px/1.6 monospace;white-space:pre;tab-size:4}#code{position:relative;color:transparent;caret-color:white;background:transparent;display:block}#code::selection{background:#659abc70;color:transparent}.string{color:#ffe19a;background:#ffe19a12;border-radius:3px}.directive{color:#8bd4ee}.keyword{color:#cba6ff}.number{color:#9de4c3}label{font-size:13px}.actions{margin:8px 0}h2{font-size:14px;margin:10px 0}#output{white-space:pre-wrap;background:#10283e;color:#e1f5ff;padding:13px;min-height:65px;max-height:220px;overflow:auto;overflow-wrap:anywhere;font:14px/1.5 monospace;border-radius:8px;margin:5px 0}#details{white-space:pre-wrap;font-size:13px}summary{font-size:13px;cursor:pointer}body[data-view="story"] .room{right:calc(50% - 220px);bottom:185px;width:440px}body[data-view="story"] .avatar{width:440px;height:440px}body[data-view="story"] .workspace{width:auto;padding:0;position:fixed;right:4%;top:85px;max-width:350px}body[data-view="story"] .code-panel,body[data-view="story"] aside>*:not(#finish){display:none}body[data-view="story"] aside{display:block;background:transparent;border:0;box-shadow:none;padding:0}body[data-view="story"] #finish:empty{display:none}body[data-view="story"] #finish:not(:empty){background:#f7fcfff0;border:1px solid white;border-radius:14px;padding:16px}#choices{display:flex;flex-wrap:wrap;gap:6px}body[data-view="story"] #choices button:only-child{margin-left:auto}blockquote{margin:10px 0;padding:10px;border-left:3px solid #63b9df;background:#e8f6ff}@keyframes bob{50%{transform:translateY(-5px)}}@media(max-width:900px){.workspace{width:72%;padding-left:3%}.room{right:0;width:240px}.avatar{width:240px;height:240px}aside{display:block}#hint,#reset{font-size:13px}.dialogue{left:3%;right:3%;padding:22px;bottom:16px}.dialogue p{font-size:19px}body[data-view="story"] .room{right:calc(50% - 190px);width:380px}body[data-view="story"] .avatar{width:380px;height:380px}}@media(max-width:600px){header{padding:8px 3%}.workspace{width:100%;padding:65px 12px 320px}.room{bottom:210px;right:5%;width:130px}.avatar{width:130px;height:130px}.dialogue{min-height:170px}.dialogue p{font-size:18px}.nameplate{left:20px}body[data-view="story"] .room{width:300px;right:calc(50% - 150px);bottom:210px}body[data-view="story"] .avatar{width:300px;height:300px}body[data-view="story"] .workspace{top:65px;right:12px;max-width:230px}#finish p{font-size:13px}}@media(prefers-reduced-motion:reduce){.avatar{animation:none}.room,button{transition:none}}
body[data-view="work"] .workspace{height:calc(100dvh - 225px);overflow-y:auto;padding-top:75px;padding-bottom:15px;scrollbar-width:thin}body[data-view="work"] #finish{display:flex;flex-wrap:wrap}body[data-view="work"] #finish>*{display:none}body[data-view="work"] #finish>.inspect-toggle,body[data-view="work"] #finish>button:only-child{display:block}body[data-view="work"] #saved{display:none}body[data-view="work"] aside{padding:12px 18px}body[data-view="work"] #progress{display:none}@media(max-width:600px){body[data-view="work"] .workspace{height:calc(100dvh - 260px);padding-top:65px}}
#scene-result{position:absolute;top:85px;left:5%;width:min(380px,35%);padding:18px 22px;background:#10283eed;color:#e1f5ff;border:1px solid #9bd7ee;border-radius:14px;font:16px/1.7 monospace;white-space:pre-wrap;box-shadow:0 8px 25px #17365230;pointer-events:auto}#scene-result[hidden]{display:none}@media(max-width:600px){#scene-result{top:65px;left:12px;width:calc(100% - 24px);font-size:13px;padding:10px 14px}body[data-view="story"] .workspace{top:190px;max-height:calc(100dvh - 420px);overflow:auto}body[data-view="story"]:has(#finish:not(:empty)) #scene-result{display:none}}
body[data-pending="true"] #finish{display:none!important}
body[data-view="work"] .workspace{margin-top:75px;height:calc(100dvh - 300px);padding-top:0}@media(max-width:600px){body[data-view="work"] .workspace{margin-top:65px;height:calc(100dvh - 325px);padding-top:0}}
main{display:flow-root}body{overflow:hidden}
@media(max-width:600px){body[data-view="story"] .workspace{top:65px;left:12px;right:12px;max-width:none;max-height:260px}body[data-view="story"] #finish:not(:empty){padding:12px}body[data-view="story"] #finish p,body[data-view="story"] #finish blockquote{margin:6px 0}body[data-view="story"] #finish button{font-size:13px;padding:8px 10px}}
.quick-menu{position:fixed;z-index:7;bottom:4px;left:5%;right:5%;display:flex;justify-content:flex-end;gap:5px}.quick-menu button{font-size:12px;padding:3px 10px;margin:0;background:#edf8ffe8;color:#245c7b;border-radius:5px}.dialogue{bottom:34px}.game-menu,.title-menu{color:#173652;border:1px solid #b9dbef;border-radius:20px;background:#f4fbfff5;box-shadow:0 16px 60px #12334a60;padding:28px;width:min(700px,90vw);max-height:85dvh;overflow:auto}.game-menu::backdrop,.title-menu::backdrop{background:#0f2c4e80;backdrop-filter:blur(5px)}.title-menu{padding:48px;text-align:center}.title-menu h2{font-size:32px;margin:20px 0}.title-menu small{letter-spacing:.15em}.title-menu #title-buttons{display:flex;flex-direction:column;max-width:280px;margin:25px auto 0}.game-menu h2{font-size:24px;margin-top:0}.game-menu label{display:flex;flex-wrap:wrap;align-items:center;gap:15px;margin:25px 0;font-size:16px}.game-menu input{flex:1;min-width:100px}.history-list{max-height:55dvh;overflow:auto}.history-list p{white-space:pre-wrap;border-bottom:1px solid #cce1ed;padding:12px 0;margin:0}.ui-hidden header,.ui-hidden .dialogue,.ui-hidden .workspace,.ui-hidden #scene-result,.ui-hidden .quick-menu{visibility:hidden}.restore-ui{position:fixed;z-index:10;bottom:20px;right:20px}.restore-ui[hidden]{display:none}@media(max-width:600px){.quick-menu{left:8px;right:8px;justify-content:center;flex-wrap:wrap;bottom:3px;gap:3px}.quick-menu button{font-size:11px;padding:3px 6px}.dialogue{bottom:45px}.title-menu{padding:25px}.game-menu{padding:20px}}
@media(max-width:600px){.quick-menu{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;bottom:5px}.quick-menu button{min-height:36px;font-size:12px;padding:4px}.dialogue{bottom:88px}body[data-view="work"] .workspace{height:calc(100dvh - 370px)}body[data-view="story"] .room{bottom:250px}}
.save-slot{padding:12px 16px;margin:12px 0;border:1px solid #b9dbef;border-radius:12px;background:#fff}.save-slot p{white-space:pre-wrap;margin:0 0 8px}@media(max-width:600px){.quick-menu{grid-template-columns:repeat(6,1fr)}.quick-menu button{font-size:11px;padding:3px}}
.quick-menu button[hidden]{display:none}.operation-guide,.version-guide{grid-column:1/-1;margin:4px 0;font-size:13px}.operation-guide{color:#087caf;font-weight:700}.version-guide{background:#e3f3fc;padding:7px 10px;border-radius:8px}.history-list pre{white-space:pre-wrap;background:#10283e;color:#e1f5ff;padding:12px;border-radius:8px;font-size:13px}.game-menu>button{margin:6px}.quick-menu{justify-content:flex-end}@media(max-width:600px){.quick-menu{grid-template-columns:repeat(4,1fr)}.dialogue{bottom:49px}body[data-view="work"] .workspace{height:calc(100dvh - 330px)}body[data-view="story"] .room{bottom:215px}}
body[data-view="work"] aside{display:block}body[data-view="work"] aside small{display:none}body[data-view="work"] aside h1{font-size:18px;margin:0 0 3px}body[data-view="work"] #task{font-size:13px;line-height:1.45;margin:3px 0}body[data-view="work"] #operation-guide{display:inline-block;margin:3px 8px 3px 0}body[data-view="work"] #version-guide{display:inline-block;margin:3px 0;padding:4px 8px}body[data-view="work"] aside button{font-size:13px;padding:6px 10px}body[data-view="work"] #finish{margin:0}.actions{position:sticky;top:0;z-index:2;background:#f5fbff;padding:3px 0;margin:5px 0;border-radius:8px}