:root{--ink:#20201f;--cream:#f1e1bd;--wood:#a65f35;--wood-dark:#573621;--sage:#77946e;--blue:#5e8ea0;--panel:#171a1d;--paper:#f6f0df;--accent:#ef9d43;--pixel:2px}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#171310;color:var(--ink);font-family:ui-monospace,"Cascadia Mono",Consolas,monospace}button{font:inherit}.app-shell{min-height:100vh;display:grid;place-items:center;padding:14px}.hud{position:fixed;z-index:30;top:22px;left:50%;transform:translateX(-50%);width:min(94vw,1180px);display:flex;justify-content:space-between;pointer-events:none}.identity,.hud-actions{pointer-events:auto;display:flex;align-items:center;gap:10px;background:#f7eedcde;border:2px solid #2e241c;border-radius:14px;padding:9px 12px;box-shadow:4px 4px 0 #2e241c55;backdrop-filter:blur(8px)}.identity strong,.identity small{display:block}.identity small{font-size:10px;opacity:.65}.status-dot{width:10px;height:10px;border-radius:50%;background:#59a65e;box-shadow:0 0 0 3px #d8ead4}.icon-button{width:34px;height:34px;border:2px solid #2e241c;border-radius:9px;background:#fff8ea;cursor:pointer}.room{position:relative;width:min(96vw,1240px);aspect-ratio:16/9;overflow:hidden;border:4px solid #2e241c;border-radius:18px;background:var(--cream);box-shadow:0 20px 70px #0009;image-rendering:pixelated}.wall{position:absolute;inset:0 0 43% 0;background:linear-gradient(#dfcda8 0 84%,#7e4d2d 84% 87%,#ac6538 87%);border-bottom:4px solid var(--wood-dark)}.floor-grid{position:absolute;inset:57% 0 0;background:repeating-linear-gradient(0deg,#9b562e 0 2px,transparent 2px 43px),repeating-linear-gradient(90deg,#0000 0 90px,#6d3d27 91px 93px),#b86d3d;transform:perspective(500px) rotateX(4deg);transform-origin:top}.window{position:absolute;left:34%;top:8%;width:34%;height:39%;background:linear-gradient(#88c5c7 0 55%,#86aa6c 56%);border:10px solid #754326;box-shadow:inset 0 0 0 5px #c07a42,7px 7px 0 #684028}.window:before,.window:after{content:"";position:absolute;background:#754326}.window:before{left:48%;width:8px;height:100%}.window:after{top:52%;height:8px;width:100%}.window span{position:absolute;bottom:0;border-radius:50% 50% 0 0;background:#5f9b58}.window span:nth-child(1){left:4%;width:28%;height:32%}.window span:nth-child(2){left:34%;width:36%;height:44%}.window span:nth-child(3){right:2%;width:29%;height:35%}.clock{position:absolute;right:8%;top:8%;padding:10px;border:5px solid #5a3927;background:#f7efd9;font-weight:900}.poster{position:absolute;left:4%;top:8%;padding:12px 15px;border:6px solid #70442b;background:#efe3c2;box-shadow:5px 5px 0 #7e4e30;font-weight:900;line-height:.9}.poster em{color:#bd5535;font-style:normal}.shelf{position:absolute;width:20%;height:11%;border:7px solid #623b27;background:#855030;display:flex;align-items:end;padding:5px;gap:4px}.shelf-a{left:3%;top:40%}.shelf-b{right:3%;top:37%}.shelf i{display:block;width:13%;height:78%;background:#436b6d;border:2px solid #2d4142}.shelf i:nth-child(2n){background:#b75b3e;height:92%}.hotspot{position:absolute;border:0;background:transparent;cursor:pointer;color:var(--paper);transition:filter .15s,transform .15s}.hotspot:focus-visible{outline:4px solid #fff;outline-offset:5px}.hotspot:hover{filter:brightness(1.12);transform:translateY(-3px)}.hotspot .label{position:absolute;left:50%;bottom:-28px;transform:translateX(-50%) scale(.9);opacity:0;padding:5px 9px;background:#1d1b19;border:2px solid #fff;border-radius:6px;white-space:nowrap;transition:.15s}.hotspot:hover .label,.hotspot:focus-visible .label{opacity:1;transform:translateX(-50%) scale(1)}.desk{left:28%;top:51%;width:36%;height:20%;background:#754326;border:5px solid #40271a;border-radius:5px;box-shadow:0 12px 0 #4f301f}.monitor{position:absolute;left:34%;top:-52%;width:34%;height:60%;display:grid;place-items:center;background:#223238;border:7px solid #34302a;border-radius:5px;color:#8dd3c5;box-shadow:0 7px 0 #27231e}.monitor b{font-size:clamp(12px,2vw,28px)}.keyboard{position:absolute;left:34%;top:20%;width:32%;height:25%;background:#d5c3a1;border:4px solid #3d3328;transform:skew(-10deg)}.mug{position:absolute;right:14%;top:10%;width:9%;aspect-ratio:1;border:4px solid #4a3628;background:#eee1c8;border-radius:3px}.board{left:20%;top:16%;width:13%;height:22%;border:8px solid #684028!important;background:#ba7c4e!important;box-shadow:5px 5px 0 #4a301f}.note{position:absolute;width:27%;height:28%;background:#f4e7bd;border:2px solid #715236}.n1{left:10%;top:12%}.n2{right:10%;top:22%;background:#bed1b5}.n3{left:32%;bottom:10%;background:#d9a998}.cabinet{right:5%;top:41%;width:14%;height:31%;background:#5c6661;border:7px solid #343d3b!important;box-shadow:7px 8px 0 #3f3429}.cabinet>span:not(.label){display:block;height:31%;margin:2%;border:4px solid #343d3b;background:#707b75}.sofa{right:17%;top:63%;width:19%;height:19%;background:#d2b68f;border:7px solid #664431!important;border-radius:18px 18px 5px 5px;box-shadow:0 9px 0 #60402e}.cushion{position:absolute;inset:18% 30%;background:#b95338;border:4px solid #6d3025}.bookshelf{left:3%;top:56%;width:16%;height:26%;background:#75452b;border:7px solid #44291d!important}.books{display:block;height:38%;margin:7%;background:repeating-linear-gradient(90deg,#315c5c 0 12%,#c46a42 12% 23%,#d2ae68 23% 32%,#533c51 32% 45%)}.plant{right:2%;top:13%;width:12%;height:25%}.leaves{display:grid;place-items:center;width:100%;height:70%;border-radius:50%;background:#4d864e;border:5px solid #315d36;color:#7cb368;font-size:42px}.pot{display:block;width:55%;height:35%;margin:-4px auto;background:#b6683d;border:5px solid #683c29;clip-path:polygon(8% 0,92% 0,78% 100%,22% 100%)}.player{position:absolute;left:50%;top:78%;width:32px;height:52px;transform:translate(-50%,-75%);z-index:780;transition:filter .2s}.player span{position:absolute;display:block}.shadow{left:2px;bottom:-3px;width:30px;height:10px;background:#38271966;border-radius:50%}.head{left:7px;top:7px;width:20px;height:20px;background:#d99b6c;border:3px solid #34261f;border-radius:7px;z-index:3}.hair{left:5px;top:2px;width:24px;height:15px;background:#3a281f;border:3px solid #261b17;border-radius:10px 10px 4px 4px;z-index:4}.body{left:5px;top:25px;width:24px;height:20px;background:#2f805e;border:3px solid #26352d;border-radius:5px;z-index:2}.legs{left:7px;top:42px;width:20px;height:10px;background:linear-gradient(90deg,#29394a 0 42%,transparent 42% 58%,#29394a 58%);z-index:1}.player.moving{animation:bob .22s steps(2) infinite}.player.facing-left{transform:translate(-50%,-75%) scaleX(-1)}@keyframes bob{50%{margin-top:-3px}}.prompt{position:absolute;z-index:1500;transform:translate(-50%,-100%);min-width:150px;padding:9px 42px 9px 12px;border:3px solid #f7e8c8;border-radius:9px;background:#202324;color:#fff;box-shadow:4px 5px 0 #0007}.prompt small,.prompt strong{display:block}.prompt small{font-size:8px;letter-spacing:.18em;color:#e5a451}.prompt kbd{position:absolute;right:9px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:27px;height:27px;background:#f7e8c8;color:#222;border-radius:5px}.controls{position:absolute;left:14px;bottom:12px;z-index:1400;padding:7px 10px;background:#1a1714bb;color:#fff;border:2px solid #ead8b5;border-radius:7px;font-size:10px}.controls kbd{color:#f3b35e}.modal-backdrop{position:fixed;z-index:2000;inset:0;display:grid;place-items:center;padding:5vw;background:#0b0c0ed4;backdrop-filter:blur(4px)}.modal-backdrop[hidden]{display:none}.game-window{width:min(920px,96vw);max-height:82vh;overflow:hidden;background:var(--panel);color:#eee;border:4px solid #d7c7a2;border-radius:10px;box-shadow:0 0 0 4px #3a3b3e,14px 18px 0 #0008}.game-window>header{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:2px solid #555;background:#25292c}.game-window h1{margin:2px 0 0;font-size:clamp(20px,3vw,36px)}.game-window small{color:#efab51;text-transform:uppercase;letter-spacing:.16em}.game-window header button{width:40px;height:40px;border:3px solid #e7d9bb;background:#9f4537;color:white;font-size:27px;cursor:pointer}.window-body{display:grid;grid-template-columns:minmax(210px,31%) 1fr;max-height:62vh}.window-body nav{padding:14px;border-right:2px solid #4a4b4d;overflow:auto}.window-body nav button{width:100%;text-align:left;margin-bottom:8px;padding:12px;border:2px solid #484a4d;background:#24282b;color:#eee;cursor:pointer}.window-body nav button.active{border-color:#f0b15d;background:#34302a}.window-body article{padding:clamp(18px,4vw,42px);overflow:auto;line-height:1.65;background:radial-gradient(circle at 90% 5%,#39444a 0,transparent 35%)}.window-body article h2{font-size:clamp(25px,4vw,48px);line-height:1.05;margin:0 0 18px}.window-body article .tag{display:inline-block;margin:0 5px 7px 0;padding:5px 8px;border:1px solid #8d8f91;border-radius:999px;font-size:11px}.window-body article a{color:#efb25f}.dark{--cream:#43372d;--ink:#eee}.dark .wall{filter:brightness(.5) saturate(.8)}.dark .floor-grid{filter:brightness(.55)}.dark .hud .identity,.dark .hud-actions{background:#1b1d1ee8;color:#eee;border-color:#d8c8a8}.dark .icon-button{background:#292b2d;color:#eee;border-color:#d8c8a8}@media(max-width:700px){.app-shell{padding:0;align-items:start}.room{width:100vw;height:100svh;aspect-ratio:auto;border:0;border-radius:0}.hud{top:10px}.identity small{display:none}.controls{display:none}.window-body{grid-template-columns:1fr}.window-body nav{display:flex;gap:8px;border-right:0;border-bottom:2px solid #4a4b4d;overflow-x:auto}.window-body nav button{min-width:180px}.game-window{max-height:90svh}.window-body{max-height:72svh}.hotspot{transform:scale(.8)}.hotspot:hover{transform:scale(.82) translateY(-2px)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}