@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Caslon+Display&display=swap";:root{font-family:DM Sans,sans-serif;color:#f0ecd9;background:#243b2c;font-synthesis:none;color-scheme:dark}*{box-sizing:border-box}body{margin:0;overflow:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%}[hidden]{display:none!important}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{cursor:default;opacity:.55}button:focus-visible,input:focus-visible{outline:2px solid #f0d398;outline-offset:4px}#game{position:fixed;inset:0;outline:none}#game canvas{display:block;image-rendering:pixelated}#ui{position:fixed;inset:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);pointer-events:none}#ui:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#15251ff2,#17291ed9 25%,#17291e44 64%,#17291e11),linear-gradient(0deg,#15251f88,transparent 30%);transition:opacity .7s}.playing #ui:before{opacity:0}.brand{position:absolute;top:37px;left:48px;display:flex;gap:13px;align-items:center;font-family:Libre Caslon Display,Georgia,serif;font-size:39px;letter-spacing:-.7px;line-height:.9}.brand-mark{font-size:44px;color:#d2c18c}.brand small{display:block;margin-top:12px;font:9px DM Sans,sans-serif;letter-spacing:2px;color:#bebfa7}.connection{position:absolute;right:36px;top:36px;display:flex;align-items:center;gap:9px;font-size:11px;text-shadow:0 1px 4px #15251f}.status-dot{width:6px;height:6px;border-radius:100%;background:#d6c496}.playing .status-dot{background:#c3d797;box-shadow:0 0 10px #bed59366}.recovering .status-dot{background:#e1b77e;box-shadow:none}#reconnect-status{position:absolute;top:45%;left:50%;transform:translate(-50%,-50%);width:min(330px,calc(100% - 32px));padding:20px;background:#20352bf5;border:1px solid #9eac7a88;text-align:center;pointer-events:auto}#reconnect-status strong{font:24px Georgia,serif}#reconnect-status p{font-size:12px;line-height:1.6;color:#d1d7be}#cancel-reconnect{min-height:44px;padding:8px 12px}#help-button{display:none;pointer-events:auto;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;background:transparent}#help-button span{display:grid;place-items:center;width:28px;height:28px;border:1px solid #9eac7a88;border-radius:50%;background:#1c3029e8;color:#e0e3ca;font-size:15px}.playing #help-button{display:flex}#entrance{position:absolute;top:50%;left:7.5%;transform:translateY(-43%);width:min(600px,85vw);pointer-events:auto;animation:arrive .7s ease-out}.eyebrow{font-size:10px;font-weight:600;letter-spacing:2px;color:#d4c18e}h1{font-family:Libre Caslon Display,Georgia,serif;font-size:clamp(54px,6.7vw,96px);font-weight:400;line-height:.98;letter-spacing:-2px;margin:24px 0}.intro{color:#c1c7b2;font-size:14px;line-height:1.8;margin-bottom:35px}label{display:block;font-size:11px;color:#d4d3bd;margin-bottom:11px}.name-row{display:flex;width:min(495px,100%);gap:8px}input{min-width:0;width:52%;background:#192a20cc;color:#f0ecd9;border:1px solid #74826677;padding:15px;border-radius:3px;font-size:12px}input::placeholder{color:#a0ad94}button{border:1px solid #c3b17d;background:#d5c696;color:#283a2c;padding:13px 19px;border-radius:3px;font-size:12px;font-weight:600;transition:background .15s,transform .15s}button:hover:enabled{background:#ecdfb4}button:active:enabled{transform:translateY(1px)}.name-row button{flex:1;white-space:nowrap}.text-button{background:none;color:#d2c99f;border:0;padding:0;font-size:11px;font-weight:400;margin-top:8px}.text-button:hover:enabled{background:none;color:#fff2c9}.guest-note{font-size:10px;line-height:1.7;color:#b3bba4;margin-top:17px}.error{font-size:12px;line-height:1.5;color:#f4c5aa;max-width:495px;margin:10px 0 0}.error:empty{display:none}.entrance-controls{display:flex;gap:24px;margin-top:34px;color:#c3c8b1;font-size:10px}.touch-controls{display:none}kbd{font-family:DM Sans,sans-serif;font-size:9px;font-weight:600;letter-spacing:.5px}.entrance-controls kbd{display:inline-block;border:1px solid #a3ad8277;padding:5px 7px;border-radius:3px;margin-right:5px}#prototype-note{position:absolute;bottom:23px;left:48px;font-size:8px;letter-spacing:1.8px;color:#b5bba5}#prototype-note span,.location span{padding:0 9px;color:#d4c18e}.playing .brand{top:26px;left:30px;font-size:27px;gap:9px}.playing .brand-mark{font-size:30px}.playing .brand small,.playing #prototype-note{display:none}.character{position:absolute;top:82px;left:30px;width:219px;padding:15px 18px;background:#1c3029e8;border-left:2px solid #c8bb88;box-shadow:0 5px 30px #10201533}.character-heading,.meter-label{display:flex;justify-content:space-between;align-items:baseline}.character-heading strong{min-width:0;white-space:nowrap;font-family:Georgia,serif;font-size:16px;font-weight:400;overflow:hidden;text-overflow:ellipsis}#level{font-size:8px;letter-spacing:1px;color:#ddcea2;margin-left:8px;white-space:nowrap}.meter{overflow:hidden;background:#92a4782b}.meter span{display:block;height:100%;width:0;transition:width .2s ease-out}.health{height:5px;margin-top:14px}.health span{background:#b0c38a}.experience{height:2px;margin-top:12px}.experience span{background:#d5bd80}.meter-label{font-size:9px;margin-top:5px;color:#d1d9be}.subdued{color:#bdc5ae;font-size:10px}.quest{position:absolute;top:89px;right:30px;width:225px;padding:16px 18px;background:#1c3029e8;border-top:1px solid #d4c18e88}.quest .eyebrow{font-size:8px;margin:0 0 13px;letter-spacing:1.6px}h2{font-family:Libre Caslon Display,Georgia,serif;font-weight:400;margin:0 0 12px;font-size:34px}.quest h2{font-family:Georgia,serif;font-size:17px;line-height:1.3}.quest p{font-size:11px;line-height:1.6;color:#d2d8be;margin:0}#quest-progress{border-top:1px solid #afba8c33;margin-top:13px;padding-top:12px;font-size:10px;color:#e2cf9a}#notice{position:absolute;top:31px;left:50%;transform:translate(-50%,-8px);max-width:min(490px,47vw);padding:12px 20px;margin:0;background:#20332aee;border-bottom:1px solid #b7ab7d88;font-size:12px;text-align:center;line-height:1.5;opacity:0;transition:opacity .2s,transform .2s}#notice.visible{opacity:1;transform:translate(-50%)}.bottom{position:absolute;bottom:20px;left:50%;transform:translate(-50%);text-align:center;width:max-content;max-width:100%}#context{font-size:11px;text-shadow:0 2px 4px #122316;min-height:18px;color:#fff3ca}.actions{display:flex;align-items:center;background:#1c3029f0;padding:7px;border:1px solid #9eac7a66;border-radius:5px;pointer-events:auto;box-shadow:0 8px 30px #10201544}.actions button{display:flex;flex-direction:column;align-items:center;gap:7px;border:0;background:none;color:#e0e3ca;padding:9px 16px;min-width:76px;font-size:10px;font-weight:400}.actions button:hover{background:#72865a44}.actions kbd{color:#e5ce97}.action-divider{height:31px;width:1px;background:#9cab7c44;margin:0 4px}.location{font-size:7px;letter-spacing:2px;color:#e2e5c9;text-shadow:0 2px 5px #122316;margin:12px 0 0}dialog{pointer-events:auto;width:min(460px,calc(100vw - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px) - 24px));max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 24px);overflow:auto;overscroll-behavior:contain;color:#eee9d3;background:#20352b;border:1px solid #a3a77a88;padding:30px;border-radius:5px;box-shadow:0 25px 100px #09170e88}dialog::backdrop{background:#101e18aa;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}dialog[open]{animation:modal-in .18s ease-out}.dialog-heading{display:flex;justify-content:space-between;gap:20px;margin-bottom:15px}.dialog-heading .eyebrow{font-size:8px;margin:0 0 10px}.backpack-tabs{display:flex;gap:6px;margin:12px 0 18px;border-bottom:1px solid #b2bd8f33}.backpack-tabs button{flex:1;min-height:44px;padding:10px 8px;border:0;border-radius:0;background:transparent;color:#cbd1b8}.backpack-tabs button[aria-selected=true]{color:#f0d398;box-shadow:inset 0 -2px #d4c18e}.backpack-tabs kbd{margin-left:6px;font-size:10px;opacity:.7}[role=tabpanel]:focus-visible{outline:2px solid #f0d398;outline-offset:4px}.close{border:none;background:transparent;color:#d1d4b7;padding:0 2px;height:32px;font-size:28px;font-weight:400}.close:hover:enabled{background:transparent;color:#fff}dialog p{font-size:12px;line-height:1.7;color:#cbd1b8}.item{display:flex;align-items:center;gap:13px;padding:15px 0;border-bottom:1px solid #b2bd8f33}.item img{width:40px;height:40px;image-rendering:pixelated}.item div{flex:1}.item strong{font-size:12px;font-weight:500}.item small{display:block;font-size:10px;color:#bfc7ac;margin-top:5px;line-height:1.5}.item>span{color:#e7d19a;font-size:18px}.recipe h3{font:19px Georgia,serif;margin:0}.recipe p{font-size:11px}.recipe button{width:100%;margin-top:5px}#craft-hint{margin-bottom:0;color:#d9c798}.help-keys{display:grid;grid-template-columns:1fr 1.4fr;gap:13px 16px;padding-bottom:20px;border-bottom:1px solid #b2bd8f33;font-size:11px}.help-keys dt{color:#e5d29c}.help-keys dd{margin:0;color:#d1d7be}#screenshot-button{position:absolute;right:24px;bottom:20px;pointer-events:auto;padding:8px 10px;border:0;background:#20352be6;color:#d9c798;font-size:11px;min-height:44px}@media(max-width:760px){#screenshot-button{right:12px;bottom:76px}}@keyframes arrive{0%{opacity:0;margin-top:12px}to{opacity:1;margin-top:0}}@keyframes modal-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@media(max-height:760px){#entrance{transform:translateY(-40%)}h1{font-size:64px;margin:16px 0}.intro{margin-bottom:22px}.entrance-controls{margin-top:20px}.brand{top:23px}}@media(max-width:760px),(max-width:1100px)and (max-height:500px){.brand{top:20px;left:20px;font-size:29px;gap:9px}.brand-mark{font-size:32px}.brand small,.playing .brand,#prototype-note,.entrance-controls,.location,.actions kbd{display:none}.connection{top:25px;right:16px;font-size:10px}#entrance{left:20px;width:calc(100% - 40px);max-width:440px;max-height:calc(100% - 120px);overflow-y:auto;overscroll-behavior:contain;transform:translateY(-45%)}h1{font-size:clamp(38px,10vw,48px);letter-spacing:-1px;margin:16px 0}.intro{font-size:12px;line-height:1.6;margin-bottom:20px}.name-row{width:100%}.name-row input{font-size:16px;padding:11px}.name-row button{min-width:0;padding:11px;font-size:11px}.text-button{min-height:44px;margin-top:2px}.guest-note{margin:4px 0 0;font-size:11px;line-height:1.5}.touch-controls{display:block;color:#c3c8b1;font-size:11px;margin:18px 0 0}.playing .connection{left:12px;right:auto;top:98px;font-size:9px}.character{left:12px;top:12px;width:150px;padding:8px 10px}.character-heading strong{font-size:13px}#level{font-size:8px;letter-spacing:0;margin-left:6px}.health{height:4px;margin-top:8px}.experience{margin-top:6px}.meter-label{margin-top:3px;font-size:9px}.quest{top:12px;right:12px;width:min(180px,calc(100% - 186px));padding:9px 10px}.quest .eyebrow{display:none}.quest h2{font-size:13px;margin-bottom:6px}.quest p{font-size:10px;line-height:1.4}#quest-progress{font-size:10px;margin-top:6px;padding-top:6px}.bottom{bottom:10px;width:min(440px,calc(100% - 24px))}#context{display:none}.actions{padding:3px}.actions button{flex:1;min-width:44px;min-height:44px;padding:6px 4px;font-size:11px;justify-content:center}.action-divider{height:22px;margin:0 2px}#notice{top:auto;bottom:88px;max-width:min(440px,calc(100% - 32px));width:max-content;padding:8px 12px;font-size:11px}dialog{padding:18px}dialog h2{font-size:28px}.dialog-heading{margin-bottom:8px;gap:12px}.close{min-width:44px;height:44px;margin:-8px -8px 0 0}.item{padding:10px 0;gap:10px}.item img{width:32px;height:32px}.recipe button{min-height:44px}.help-keys{gap:10px 12px}}@media(max-width:1100px)and (max-height:500px){.brand{top:12px}.connection{top:18px}#entrance{top:56px;bottom:12px;max-height:none;transform:none;max-width:480px}#entrance>.eyebrow,.intro,.touch-controls{display:none}h1{font-size:36px;margin:0 0 14px}h1 br{display:none}label{margin-bottom:6px}dialog{width:min(600px,calc(100vw - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px) - 24px))}}@media(min-width:560px)and (max-width:1100px)and (max-height:500px){#inventory{padding:12px}#inventory #items{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}#inventory .dialog-heading,#equipment{margin:0}#inventory .dialog-heading .eyebrow{display:none}#inventory .dialog-heading h2{margin:0}#inventory .backpack-tabs{margin:4px 0 6px}#inventory .item{padding:8px 0}}@media(hover:none)and (pointer:coarse){.actions kbd,#context{display:none}}@media(prefers-reduced-motion:reduce){*,*:before{animation:none!important;transition:none!important}}