@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=Inter:wght@400;500;600;700&display=swap');
:root{--bg:#111813;--panel:rgba(17,25,20,.91);--line:rgba(221,232,218,.14);--gold:#c5a66b;--text:#eef2e9;--muted:#9ba99b;--green:#79a66d}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif;overflow:hidden}button{font:inherit;cursor:pointer;color:inherit}#game-shell{height:100vh;display:flex;flex-direction:column}.topbar{height:72px;flex:none;display:flex;align-items:center;gap:24px;padding:0 22px;background:#131c16;border-bottom:1px solid var(--line);z-index:5}.brand{display:flex;align-items:center;gap:11px;min-width:245px}.brand-mark{width:42px;height:42px;border:1px solid var(--gold);display:grid;place-items:center;color:var(--gold);font-family:'Barlow Condensed';font-weight:800;font-size:18px;letter-spacing:1px}.brand strong,.brand span{display:block}.brand strong{font-family:'Barlow Condensed';font-size:19px;letter-spacing:1.8px}.brand span{font-size:9px;letter-spacing:2.1px;color:var(--gold);margin-top:2px}.top-stats{display:flex;gap:clamp(15px,3vw,48px);margin-left:auto}.top-stats div{display:flex;flex-direction:column;gap:4px}.top-stats small{font-size:9px;color:var(--muted);letter-spacing:1.4px}.top-stats strong{font-size:12px;white-space:nowrap}.small-button,.close-button{background:transparent;border:1px solid var(--line);padding:9px 12px;font-size:10px;letter-spacing:1px}.small-button:hover,.close-button:hover{border-color:var(--gold)}#game-stage{position:relative;flex:1;min-height:0;overflow:hidden;background:#26372b}#scene-container{position:absolute;inset:0}#scene-container canvas{display:block;width:100%;height:100%}.panel{position:absolute;top:18px;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(10px);padding:15px;width:220px;z-index:2}.left-panel{left:18px}.right-panel{right:18px;width:205px}.panel-heading{font-family:'Barlow Condensed';font-size:14px;letter-spacing:1.5px;color:#e5e9df;margin-bottom:13px;display:flex;justify-content:space-between}.live-dot{width:7px;height:7px;border-radius:50%;background:#8fc47a;box-shadow:0 0 9px #8fc47a}.meter-row,.property-line{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);margin:10px 0 5px}.meter-row strong,.property-line strong{color:var(--text);font-weight:600}.meter{height:5px;background:#303b32;overflow:hidden}.meter i{display:block;height:100%;width:100%;transition:width .2s}.health{background:#83b879}.hunger{background:#d5ad62}.thirst{background:#69a9c5}.energy{background:#a99bd2}.panel-divider{height:1px;background:var(--line);margin:14px 0}.hint{font-size:10px;color:var(--muted);display:flex;align-items:center;gap:4px;margin:9px 0}kbd{font-size:9px;border:1px solid #526052;background:#29342b;padding:3px 5px;color:#e9eee4;border-radius:3px}.message{font-size:10px;line-height:1.6;color:#c3cebf;min-height:45px}.bottom-center{position:absolute;bottom:79px;left:50%;transform:translateX(-50%);text-align:center;pointer-events:none;text-shadow:0 1px 4px #000}.crosshair{font-size:21px;font-weight:300;line-height:20px}.bottom-center #target-label{font-size:10px;color:#e2e9dc;margin-top:7px}.bottom-bar{position:absolute;bottom:0;left:0;right:0;height:55px;display:flex;justify-content:center;gap:5px;align-items:center;background:rgba(13,19,15,.94);border-top:1px solid var(--line);z-index:3}.action-button{height:34px;padding:0 19px;background:transparent;border:1px solid transparent;color:#9eaa9d;font-size:10px;letter-spacing:1.2px}.action-button:hover,.action-button.active{color:var(--gold);border-color:rgba(197,166,107,.4);background:rgba(197,166,107,.07)}.drawer{position:absolute;z-index:4;left:50%;top:50%;transform:translate(-50%,-50%);width:min(560px,calc(100% - 32px));max-height:75%;overflow:auto;background:rgba(17,25,20,.97);border:1px solid rgba(197,166,107,.4);box-shadow:0 20px 70px #0009;padding:20px}.hidden{display:none!important}.drawer-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:15px}.drawer h2{font-family:'Barlow Condensed';font-size:25px;letter-spacing:1px;margin:0}.drawer p{font-size:12px;line-height:1.65;color:#bac6b8}.drawer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.info-card{padding:13px;background:#202c23;border:1px solid var(--line)}.info-card small{display:block;color:var(--muted);font-size:9px;letter-spacing:1px;margin-bottom:6px}.info-card strong{font-size:15px}.drawer-button{background:#344a36;border:1px solid #68805f;padding:10px 13px;font-size:10px;letter-spacing:.8px;margin:5px 5px 5px 0}.drawer-button:hover{background:#466348}.drawer-button:disabled{opacity:.4;cursor:not-allowed}.primary-button{background:var(--gold);color:#182019;border:0;padding:14px 25px;font-weight:700;letter-spacing:1.5px;font-size:11px}.primary-button:hover{background:#ddc18b}.overlay{position:absolute;inset:0;z-index:6;display:grid;place-items:center;background:linear-gradient(90deg,rgba(8,14,10,.88),rgba(8,14,10,.3)),url('https://images.unsplash.com/photo-1448375240586-882707db888b?auto=format&fit=crop&w=1800&q=85') center/cover}.start-card{width:min(580px,90%);padding:35px 38px;border-left:3px solid var(--gold);background:rgba(12,19,14,.72);backdrop-filter:blur(7px)}.eyebrow{color:var(--gold);font-size:10px;letter-spacing:3px;margin-bottom:18px}.start-card h1{font-family:'Barlow Condensed';font-size:clamp(38px,6vw,68px);line-height:.9;letter-spacing:1px;margin:0 0 18px}.start-card h1 span{font-size:.55em;letter-spacing:3px;color:var(--gold)}.start-card p{font-size:13px;color:#d0d8cc;line-height:1.7;max-width:400px;margin-bottom:25px}.start-note{font-size:9px;color:#aab5a7;letter-spacing:1px;margin-top:18px}footer{height:24px;flex:none;background:#111813;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 15px;color:#748174;font-size:8px;letter-spacing:1px}
@media(max-width:760px){.topbar{height:auto;min-height:62px;padding:9px 12px;gap:8px}.brand{min-width:0}.brand-mark{width:35px;height:35px}.brand strong{font-size:15px}.brand span{font-size:7px}.top-stats{gap:10px}.top-stats div:nth-child(3){display:none}.top-stats small{font-size:7px}.top-stats strong{font-size:9px}.small-button{font-size:8px;padding:7px}.panel{top:10px;padding:10px;width:165px}.right-panel{width:150px}.left-panel .panel-heading,.right-panel .panel-heading{font-size:11px}.meter-row,.property-line,.hint{font-size:8px}.right-panel{display:none}.bottom-bar{height:49px;gap:0}.action-button{padding:0 9px;font-size:8px}.bottom-center{bottom:65px}.start-card{padding:25px}.drawer-grid{grid-template-columns:1fr 1fr}footer span:nth-child(2){display:none}}

.equipment-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px;margin:9px 0;background:#202c23;border:1px solid var(--line)}
.equipment-row strong{font-size:12px;color:#f0f2e9}.equipment-row p{font-size:10px;margin:5px 0;color:#b7c3b4;line-height:1.45}.equipment-row small{font-size:9px;color:var(--gold);letter-spacing:.5px}.equipment-row .drawer-button{white-space:nowrap;margin:0}.equipment-note{font-size:10px;color:#9eaa9d;margin-top:14px}
@media(max-width:760px){.equipment-row{align-items:flex-start;flex-direction:column}.equipment-row .drawer-button{margin-top:7px}}
