:root{font-family:Arial,Helvetica,sans-serif;color:#514b43;background:#303647;font-synthesis:none;--cream:#fff8e9;--gold:#a17b42;--teal:#347d70;--safe-left:max(20px,env(safe-area-inset-left));--safe-right:max(20px,env(safe-area-inset-right))}*{box-sizing:border-box}body{margin:0;min-width:320px;height:100svh;height:100dvh;display:grid;place-items:center;overflow:hidden}button,a,input{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer;color:inherit;touch-action:manipulation}button:disabled{opacity:.4;cursor:default}button,a,input{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible,canvas:focus-visible{outline:3px solid #215f61}button{transition:background .18s,box-shadow .18s,opacity .18s}button:not(:disabled):active{filter:brightness(.94)}[hidden]{display:none!important}.svg-defs{position:absolute;width:0;height:0;overflow:hidden}button svg,.brand svg,.hud svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}#app{position:relative;width:min(100vw,216dvh);aspect-ratio:2.16;max-height:100dvh;overflow:hidden;isolation:isolate;box-shadow:0 0 100px #171e3555}.sky,.sky-wash{position:absolute;inset:0;z-index:-2;pointer-events:none}.sky{background:#d9c7c3 url('assets/sky.png') center/cover}.sky-wash{z-index:-1;background:linear-gradient(0deg,#e7d7cc77,transparent 22%,transparent 75%,#e7dbd066)}.topbar{position:absolute;inset:14px var(--safe-right) auto var(--safe-left);display:flex;align-items:center;justify-content:space-between;z-index:10;pointer-events:none}.topbar>*{pointer-events:auto}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:#544c43;text-shadow:0 1px 10px #fff8e9;font:22px Georgia,serif}.brand svg{width:28px;height:34px;color:#987543}.brand small{display:block;font:7px Arial,sans-serif;letter-spacing:2.4px;margin-top:5px;color:#776d63}.top-actions{display:flex;gap:8px}.icon-button{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:44px;height:44px;border:1px solid #fff7e9a6;border-radius:50%;background:#fffaec8c;color:#776747;backdrop-filter:blur(8px);box-shadow:0 3px 18px #66514409}.icon-button:hover{background:#fff8e7}.sound-off{position:absolute;left:11px;top:21px;transform:rotate(-45deg);width:22px;height:1px;background:#776747}.icon-button[aria-pressed=true] .sound-off{display:none}.hud{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:18px}.hud>span{display:flex;align-items:center;gap:7px;color:#4f7664}.hud b{font-size:12px;font-weight:500}.hud .collected svg{filter:drop-shadow(0 0 6px #9cffe0)}body.guided #memory-status{display:none}.play-space{position:absolute;inset:0}#stage{position:absolute;inset:55px 98px 58px 140px}#game{display:block;width:100%;height:100%;touch-action:none}#loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px;font-size:12px}.loading-orbit{width:34px;height:34px;border:1px solid #ac8b5866;border-top:2px solid #ac8b58;border-radius:50%;animation:spin 2s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}.room-label,.floor-label{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;white-space:nowrap;border:1px solid #b9a37c6b;border-radius:24px;min-height:36px;padding:7px 11px;font-size:11px;background:#fff8e8eb;color:#755a35;box-shadow:0 3px 14px #49372313}.room-label.mira{color:#9e4e3e;background:#fff0e6ed;border-color:#bf847080}.room-label.seed{color:#347565;background:#eefff4ed;border-color:#6da98e80}.room-label.portal{color:#337785;background:#e9fffbed;border-color:#7ba6ac80}.room-label:before{content:'';width:4px;height:4px;margin-right:5px;display:inline-block;vertical-align:middle;border-radius:50%;background:currentColor}.floor-label{font-size:10px;padding:7px 10px;min-height:32px;border-radius:9px;background:#e0eff5}.floor-label.floor-2{background:#ffedcc}.floor-label.floor-3{background:#eee6fa}.world-tools{position:absolute;z-index:7;display:flex;align-items:center;gap:5px;transform:translate(-50%,0);white-space:nowrap;filter:drop-shadow(0 4px 12px #563e2820)}.world-action{min-height:44px;border:1px solid #b99455;background:#fff3d5;color:#765522;border-radius:25px;padding:0 19px;font-size:13px;font-weight:600;box-shadow:inset 0 1px #fffcf2}.world-action.ready{background:#387e6e;color:#fffdf0;border-color:#337260}.world-action:hover{box-shadow:0 0 0 4px #fff8de44}.rotation-controls{display:flex;gap:3px;padding:3px;border-radius:16px;background:#fff7e7e6;border:1px solid #e0cfad}.rotation-controls button{background:transparent;border:0;border-radius:11px;width:48px;min-height:44px;font-size:21px;color:#886b3e;line-height:1}.rotation-controls small{display:block;font-size:8px;margin-top:3px}.rotation-controls button:hover{background:#dfc99d55}.world-tools #rotate-again{width:44px;height:44px;font-size:22px;background:#fff4d7;border-color:#c2a475}.room-dock{position:absolute;left:var(--safe-left);top:50%;transform:translateY(-44%);width:112px;height:258px;z-index:5}.dock-caption{display:block;text-align:center;font-size:8px;letter-spacing:1.7px;color:#86715c;margin-bottom:4px}.room-dock canvas{position:absolute;top:18px;left:0;width:100%;height:240px;pointer-events:none}#offers{height:240px;display:grid;grid-template-rows:repeat(3,1fr)}.offer{position:relative;border:0;background:transparent;border-radius:50%;padding:0;color:#806747;min-height:44px}.offer:before{content:'';position:absolute;inset:13px 1px 6px;border-radius:50%;background:radial-gradient(ellipse,#fff6dd6b,transparent 70%);z-index:-1}.offer.active:after{content:'';position:absolute;inset:9px 9px 7px;border-radius:50%;border:1px solid #fff7d8bb;box-shadow:0 0 14px #fff5ce65;transform:rotate(-12deg)}.offer small{position:absolute;bottom:0;left:0;right:0;font-size:9px;text-shadow:0 1px 5px #fff6e7,0 1px 3px #fff6e7;z-index:2}.offer:disabled{opacity:.38}.offer.active{opacity:1}.floor-controls{position:absolute;right:var(--safe-right);top:50%;transform:translateY(-46%);display:flex;flex-direction:column;align-items:center;gap:4px;z-index:6}.floor-controls span{font-size:7px;letter-spacing:1.4px;margin:4px 0;color:#89745d}.floor-controls button{display:grid;place-items:center;border:1px solid #fff9e3ba;background:#fff9e396;color:#79694e;border-radius:13px;min-width:44px;min-height:44px;font-size:12px;backdrop-filter:blur(7px)}.floor-controls button.active{background:#fff9e8;border-color:#9d824f;box-shadow:0 0 0 2px #fff3d47a}.floor-controls button.floor-1{background:#d9e8ecb3}.floor-controls button.floor-2{background:#f4e5c6bd}.floor-controls button.floor-3{background:#e6dff2b3}.floor-controls button svg{width:18px;height:18px}.game-footer{position:absolute;left:var(--safe-left);right:var(--safe-right);bottom:max(12px,env(safe-area-inset-bottom));z-index:8;display:flex;align-items:center;justify-content:space-between;min-height:44px;pointer-events:none;gap:15px}.game-footer>div{pointer-events:auto;display:flex;gap:6px}.game-footer p{margin:0;text-align:center;font-size:12px;color:#675a4a;text-shadow:0 1px 6px #fffaf2,0 1px 3px #fffaf2;max-width:50%;position:absolute;left:50%;transform:translateX(-50%);width:max-content;pointer-events:none}.quiet-button{border:1px solid #fff9e3aa;background:#fff9e99e;backdrop-filter:blur(8px);border-radius:23px;min-height:44px;padding:0 15px;font-size:11px;color:#776548}.preview-wire{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.preview-wire path{fill:none;stroke-linecap:round;stroke-linejoin:round}.row-wire{stroke:#bd872f;stroke-width:1.5;opacity:.45}.ghost-wire{stroke:#a87a35;stroke-width:1.4;stroke-dasharray:4 3;opacity:.7}.walk-wire{stroke:#287f70;stroke-width:4;filter:drop-shadow(0 0 3px #effff5)}.ghost-caption{display:none}.modal{color:#574c3e;padding:28px;max-width:430px;width:calc(100% - 36px);max-height:calc(100dvh - 24px);overflow:auto;border:1px solid #fff6df;background:linear-gradient(135deg,#fff9ec,#ede0c9);border-radius:18px;box-shadow:0 20px 100px #27263d44}.modal::backdrop{background:#33364c66;backdrop-filter:blur(7px)}.modal .eyebrow{font-size:8px;letter-spacing:2px;color:#977b50}.modal h2{font:normal 29px/1.15 Georgia,serif;letter-spacing:-.6px;margin:14px 20px 15px 0;color:#685035}.modal p{font-size:12px;line-height:1.7;color:#80705d}.modal p b{font-weight:500;color:#5a685c}.modal .keyboard-note{font-size:10px}.close-modal{position:absolute;right:9px;top:8px;width:44px;height:44px;font-size:26px;background:transparent;border:0;color:#96815e}.menu-button,.primary-button{width:100%;min-height:44px;border:1px solid #bd9f683f;background:#fff7e666;border-radius:9px;padding:10px 14px;text-align:center;font-size:12px;margin:7px 0;color:#766140}.primary-button{background:#a2844d;border-color:#977743;color:#fff9e8}.menu-button:hover{background:#fff9e9}.check-row,.volume-row{display:flex;align-items:center;gap:8px;font-size:12px;min-height:44px;color:#7a674c}.volume-row{justify-content:space-between}.volume-row input{width:65%;accent-color:#a2844d}.check-row input{accent-color:#a2844d;width:18px;height:18px}.axis-tabs,.side-controls{display:flex;gap:7px}.axis-tabs button,.side-controls button{flex:1;min-height:44px;background:#fff7e6;border:1px solid #d7c5a6;border-radius:8px;font-size:12px}.axis-tabs button.active,.side-controls button.active{background:#cdb27c;color:#fffdf4}.line-select{display:flex;gap:20px;align-items:center;margin:18px 0}.line-select p{font-size:12px}.line-grid{display:grid;grid-template-columns:repeat(3,44px);gap:5px}.line-grid button{width:44px;height:44px;border:1px solid #c9b28c;border-radius:7px;background:#e8dcc6}.line-grid button.active{background:#ac8c54;box-shadow:inset 0 0 0 3px #ebd4a0}.win-modal{text-align:center}.win-modal h2{margin-right:0}.win-stats{display:flex;justify-content:center;gap:40px;margin:20px 0}.win-stats b{display:block;font:28px Georgia,serif;color:#9f7b40}.win-stats span{font-size:10px;color:#8b775d}#toast{position:absolute;left:50%;bottom:64px;transform:translate(-50%,10px);opacity:0;pointer-events:none;background:#514b42eb;color:#fff6e5;padding:10px 17px;border-radius:20px;font-size:11px;line-height:1.5;max-width:65%;text-align:center;z-index:20;transition:opacity .2s,transform .2s}#toast.show{opacity:1;transform:translate(-50%,0)}.portrait-note{display:none}
@media(min-width:1100px){.topbar{top:22px;left:34px;right:34px}.brand{font-size:27px}.brand small{font-size:8px}.room-dock{left:36px;width:150px;height:330px}.room-dock canvas,#offers{height:312px}.dock-caption{font-size:9px}.offer small{font-size:11px}#stage{inset:65px 125px 75px 185px}.floor-controls{right:34px;gap:6px}.floor-controls button{width:48px;height:48px}.game-footer{left:34px;right:34px;bottom:20px}.game-footer p{font-size:14px}.world-action{min-height:48px;font-size:14px}.room-label{font-size:12px}.world-tools{gap:7px}}
@media(max-height:430px) and (orientation:landscape){.topbar{top:8px}.brand{font-size:19px}.brand small{font-size:6px;letter-spacing:2px;margin-top:3px}.brand svg{width:23px}.top-actions{gap:6px}.hud b{font-size:11px}.room-dock{width:100px;height:222px;top:50%;transform:translateY(-43%)}.room-dock canvas,#offers{height:204px}.offer small{font-size:8px}#stage{inset:42px 86px 54px 115px}.floor-controls{gap:1px}.floor-controls span{display:none}.floor-controls button{height:44px;width:44px}.game-footer{bottom:max(6px,env(safe-area-inset-bottom))}.game-footer p{font-size:11px}.room-label{font-size:10px;min-height:32px;padding:6px 9px}.world-action{padding:0 14px;font-size:12px}.rotation-controls button{width:44px}.floor-label{font-size:8px;padding:5px 7px}.quiet-button{font-size:10px;padding:0 12px}}
@media(max-width:700px) and (orientation:landscape){.brand small{display:none}.room-dock{width:84px}.dock-caption{font-size:7px}#stage{left:95px;right:72px}.world-tools{gap:3px}.game-footer p{font-size:10px;max-width:44%}.quiet-button{font-size:9px;padding:0 9px}.rotation-controls small{font-size:7px}}
@media(orientation:portrait) and (max-width:700px){#app{width:100vw;height:100dvh;aspect-ratio:auto;max-height:none}.portrait-note{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;z-index:50;background:linear-gradient(155deg,#d0c4d3f5,#f4dcc7f5);padding:35px;color:#675445}.portrait-note>svg{width:80px;height:80px;stroke:#a48a60;stroke-width:1.7;fill:none;transform:rotate(-25deg);margin-bottom:22px}.portrait-note h1{font:29px Georgia,serif;line-height:1.2;font-weight:normal;margin:0 0 15px}.portrait-note p{font-size:13px;line-height:1.8}.portrait-note button{margin-top:25px}.portrait-ok .portrait-note{display:none}.brand{font-size:19px}.brand small{display:none}.hud{left:58%;gap:6px}.hud svg{width:15px}#memory-status{display:none}#stage{inset:90px 55px 160px 0}.room-dock{top:auto;bottom:62px;left:20px;transform:none;width:230px;height:86px}.room-dock canvas{height:70px;top:16px}#offers{height:70px;grid-template-columns:repeat(3,1fr);grid-template-rows:1fr}.dock-caption{text-align:left;padding-left:10px;font-size:7px}.floor-controls{right:9px;top:43%}.floor-controls button{min-width:40px}.game-footer{left:12px;right:12px;bottom:8px}.game-footer p{bottom:54px;font-size:10px;max-width:75%;left:55%}.extra-tools .quiet-button{padding:0 11px}.world-tools{gap:3px}.world-action{font-size:11px;padding:0 12px}.rotation-controls button{width:40px}.rotation-controls small{font-size:7px}.modal{max-height:90dvh}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}.loading-orbit{animation:none}}
@media(max-height:500px) and (orientation:landscape){#app{width:100vw;height:100dvh;aspect-ratio:auto}}
@media(orientation:portrait) and (max-width:700px){.game-footer p{display:none}}
/* One incoming room, direct selection on the castle. */
body.direct #stage{left:75px;right:95px}
body.direct .rotation-controls{background:transparent;border:0;padding:0;gap:4px}
body.direct .rotation-controls button{border:1px solid #dbc394;background:#fff6ddeb;border-radius:50%;width:44px;height:44px;box-shadow:0 2px 10px #70563712}
body.direct .rotation-controls button small{font-size:7px;margin-top:2px}
#room-access{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.room-access{position:absolute;transform:translate(-50%,-50%);width:44px;height:44px;padding:0;border:2px solid transparent;border-radius:10px;background:transparent;opacity:0;pointer-events:none}
.room-access:focus-visible{opacity:1;background:#fff4cc55;border-color:#886b36;outline:2px solid #fff7e0;pointer-events:auto}
@media(min-width:1100px){body.direct #stage{left:100px;right:130px}}
@media(max-height:430px) and (orientation:landscape){body.direct #stage{left:70px;right:85px}}
@media(max-width:700px) and (orientation:landscape){body.direct #stage{left:50px;right:72px}}
@media(orientation:portrait) and (max-width:700px){body.direct #stage{left:0;right:55px;bottom:85px}}
/* The castle carries no nameplates. Necessary actions use compact symbols. */
body.direct .world-action{display:inline-flex;align-items:center;justify-content:center;min-height:44px;width:44px;height:44px;padding:0;border-radius:50%;font-size:0}
body.direct .world-action svg{width:21px;height:21px}
body.direct .rotation-controls button{font-size:23px}
.extra-tools .world-tools{position:static;transform:none;filter:none}
.sr-only,#world-hint.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;transform:none!important}

/* Portrait is the game canvas on phones, tablets and desktop. */
body{background:radial-gradient(ellipse at 50% 35%,#686275,#33374a 80%)}
body.direct #app{width:min(100vw,56.25dvh);height:100dvh;max-height:100dvh;aspect-ratio:9/16;border-radius:0}
body.direct .topbar{inset:max(16px,env(safe-area-inset-top)) 16px auto;align-items:flex-start}
body.direct .brand{font-size:20px;gap:7px;line-height:1.1}
body.direct .brand svg{width:23px;height:31px}
body.direct .brand small{display:block;font-size:6px;letter-spacing:1.8px;margin-top:5px}
body.direct .top-actions{gap:4px}
body.direct .hud{left:0;top:49px;transform:none;gap:18px}
body.direct .hud svg{width:17px;height:17px}
body.direct .hud b{font-size:11px}
body.direct #memory-status{display:flex}
body.direct #stage{inset:94px 4px 133px}
body.direct .floor-controls{top:auto;bottom:max(69px,calc(env(safe-area-inset-bottom) + 61px));left:50%;right:auto;transform:translateX(-50%);flex-direction:row;gap:5px}
body.direct .floor-controls button{height:44px;width:44px;min-width:44px;border-radius:50%}
body.direct .floor-controls [data-floor=all]{order:-2}
body.direct .floor-controls [data-floor=path]{order:-1}
body.direct .game-footer{left:16px;right:16px;bottom:max(13px,env(safe-area-inset-bottom))}
body.direct .world-tools{gap:5px}
body.direct .rotation-controls button{width:44px;min-width:44px}
body.direct .world-tools{filter:drop-shadow(0 4px 12px #563e2820)}
body.direct .extra-tools .world-tools{filter:none}
body.direct #toast{bottom:123px;max-width:85%;width:max-content}
body.direct .sky{background-position:44% center}
body.direct .sky-wash{background:linear-gradient(0deg,#e7d7ccbb,transparent 28%,transparent 70%,#e7dbd077)}
body.direct .row-wire{opacity:.2;stroke-width:1}
body.direct .ghost-wire{stroke-width:1.5;opacity:.6}
body.direct .walk-wire{stroke-width:2.5}
@media(min-width:600px){body.direct #app{border-left:1px solid #fff4d520;border-right:1px solid #fff4d520}}
@media(max-height:600px){body.direct #app{width:min(100vw,70dvh)}body.direct .brand{font-size:15px}body.direct .brand svg{display:none}body.direct .brand small{display:none}body.direct .topbar{inset:8px 8px auto}body.direct .top-actions{gap:0}body.direct .hud{top:45px;gap:10px}body.direct #stage{top:80px;bottom:115px}body.direct .floor-controls{bottom:60px;gap:2px}body.direct .game-footer{left:8px;right:8px;bottom:8px}}

@media(max-height:600px){body.direct #stage>.world-tools{top:auto!important;left:auto!important;right:4px;bottom:-107px;transform:none}body.direct.planning #reset-camera{display:none}}

/* The world occupies the full portrait canvas; only the screen edge bounds it. */
body.direct #stage{inset:0;overflow:visible}
body.direct #labels{overflow:visible}
body.direct .sky{inset:-36px;transform:translate(var(--sky-x,0px),var(--sky-y,0px)) scale(1.05);will-change:transform}
body.direct .sky-wash{background:linear-gradient(0deg,#dce0e877,transparent 35%,transparent 70%,#d9d8e766)}
body.direct .castle-choice{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:15px}
body.direct .castle-choice button[aria-pressed=true]{border-color:#618b80;background:#e1eee2}
body.direct .world-tools{gap:8px}
body.direct .row-wire{stroke-width:1.2;opacity:.32}
@media(max-height:600px){body.direct #stage>.world-tools{bottom:8px!important;right:12px}}

html,body{overflow:hidden;overscroll-behavior:none}body{position:fixed;inset:0;width:100%;height:100dvh}body.direct #app{overflow:clip}

/* Stable, distinct actions leave the room-selection area completely clear. */
body.direct #stage>.world-tools{left:50%!important;right:auto!important;top:auto!important;bottom:max(125px,calc(env(safe-area-inset-bottom) + 121px))!important;transform:translateX(-50%);gap:14px}
body.direct .rotation-controls{gap:8px}
body.direct .rotation-controls button{display:grid;place-items:center;width:50px;height:48px;border-radius:15px;background:#fff8e7ed;border-color:#c9b385}
body.direct .rotation-controls button svg{width:32px;height:32px;stroke-width:1.5}
body.direct .world-action{width:68px;height:48px;border-radius:15px;border-width:1px;box-shadow:inset 0 -3px #245b4c44,0 4px 14px #445b4922}
body.direct .world-action svg{width:34px;height:28px;stroke-width:1.7}
body.direct .world-action.ready{background:linear-gradient(160deg,#559c84,#347c69)}
body.direct .sky{inset:-180px;transform:translate(var(--sky-x,0px),var(--sky-y,0px)) rotate(var(--sky-roll,0deg)) scale(1.12)}
@media(max-height:600px){body.direct #stage>.world-tools{bottom:111px!important}body.direct .world-action,body.direct .rotation-controls button{height:44px}body.direct .floor-controls{bottom:59px}}

/* Room manipulation owns the pointer; camera gestures stay on the background. */
#game.can-grab{cursor:grab}#game.room-dragging{cursor:grabbing}
body.dragging-room #world-tools{opacity:.3;pointer-events:none}
body.dragging-room .floor-controls,body.dragging-room .utility-tools{opacity:.45}
body.direct.planning #world-action{display:none}

/* The sunlit terrace needs no floor selector; the world keeps the full portrait. */
body.sunlit-terrace .floor-controls{display:none}
body.direct.sunlit-terrace #stage>.world-tools{bottom:max(79px,calc(env(safe-area-inset-bottom) + 76px))!important}
body.direct.sunlit-terrace .castle-choice{grid-template-columns:1fr}
body.direct.sunlit-terrace .sky-wash{background:linear-gradient(0deg,#ead0a540,transparent 45%,#ffeac635)}
body.direct.sunlit-terrace .row-wire{opacity:.14}

/* Warm illustrated depth plate behind the actual movable architecture. */
body.direct.sunlit-terrace .sky{background-image:url('assets/sunlit-world-v2.png');inset:-105px -80px;background-position:50% 55%;transform:translate(calc(var(--sky-x,0px)*.65),calc(var(--sky-y,0px)*.65)) rotate(var(--sky-roll,0deg)) scale(1.08)}
body.direct.sunlit-terrace .sky-wash{background:linear-gradient(180deg,#ffedce22,transparent 23%,transparent 76%,#dce7f226)}

.study-link{display:block;text-decoration:none}