/* =====================================================================
   SCHRON – HUD, sterowanie dotykowe, okna (ekwipunek, garderoba, terminal)
   ===================================================================== */
:root{ --sh-font: ui-monospace, "Cascadia Mono", "Consolas", "Courier New", monospace; --sh-red:#b8231c; --sh-bone:#d8ccb4; --sh-dim:#8a8070; --sh-panel:rgba(14,12,11,.86); --sh-edge:#3a332c; }
body.in-shelter #hud, body.in-shelter #touch, body.in-shelter #levelBanner{display:none!important}
#shelterUI{position:fixed;inset:0;pointer-events:none;z-index:30;font-family:var(--sh-font);color:var(--sh-bone);user-select:none;-webkit-user-select:none}
#shelterUI button{font-family:var(--sh-font)}
.sh-hud{position:absolute;inset:0}

/* --- życie / pancerz (jak na makiecie) --- */
.sh-vitals{position:absolute;left:calc(12px + var(--sal));top:calc(10px + var(--sat));background:var(--sh-panel);border:2px solid var(--sh-edge);box-shadow:0 0 0 1px #000,0 6px 20px #0008;padding:6px 8px;display:flex;flex-direction:column;gap:5px}
.sh-bar-row{display:flex;align-items:center;gap:6px;font-size:11px}
.sh-ico{width:14px;text-align:center;font-size:13px}.sh-ico.hp{color:#d83a2a}.sh-ico.ar{color:#8aa0b8}
.sh-bar{width:150px;height:10px;background:#1a1412;border:1px solid #000;position:relative;overflow:hidden}
.sh-fill{height:100%;transition:width .2s}.sh-fill.hp{background:linear-gradient(#e0402e,#8a1a12)}
.sh-fill.ar{background:linear-gradient(#9ab0c8,#4a6078)}
.sh-bar.seg::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 13px,#000 13px 15px)}
.sh-hpv,.sh-arv{min-width:26px;font-size:11px;color:var(--sh-dim)}

.sh-zone{position:absolute;left:50%;top:calc(10px + var(--sat));transform:translateX(-50%);font-size:13px;letter-spacing:4px;color:var(--sh-bone);text-shadow:0 2px 0 #000;padding:4px 12px;background:rgba(10,8,7,.55);border-top:1px solid #5a4a3a;border-bottom:1px solid #5a4a3a;white-space:nowrap}
.sh-zone.flash{animation:shzone 1.2s}
@keyframes shzone{0%{opacity:0;letter-spacing:10px}30%{opacity:1}100%{letter-spacing:4px}}
.sh-rangestats{position:absolute;left:50%;top:calc(40px + var(--sat));transform:translateX(-50%);font-size:11px;color:#e8d8a0;background:var(--sh-panel);border:1px solid var(--sh-edge);padding:4px 10px;display:none;white-space:nowrap}
.sh-rangestats.show{display:block}.sh-rangestats b{color:#ffd040}

.sh-topright{position:absolute;right:calc(10px + var(--sar));top:calc(10px + var(--sat));display:flex;gap:6px;align-items:flex-start}
.sh-minimap{width:140px;height:auto!important;image-rendering:pixelated;background:#0a0908;border:2px solid var(--sh-edge);box-shadow:0 0 0 1px #000;opacity:.9}
.sh-pause{pointer-events:auto;width:38px;height:38px;background:var(--sh-panel);border:2px solid var(--sh-edge);color:var(--sh-bone);padding:6px;cursor:pointer}
.sh-pause svg{width:100%;height:100%}

.sh-weapon{position:absolute;right:calc(14px + var(--sar));bottom:calc(14px + var(--sab));background:var(--sh-panel);border:2px solid var(--sh-edge);padding:6px 12px;text-align:right;min-width:150px;transition:opacity .2s}
.sh-weapon.holstered{opacity:.45}
.sh-wname{font-size:12px;letter-spacing:1px}.sh-ammo{font-size:22px;font-weight:700;color:#fff0d8}.sh-wslot{font-size:10px;color:var(--sh-dim)}
body.touchmode .sh-weapon{bottom:auto;top:calc(88px + var(--sat));right:calc(10px + var(--sar));min-width:110px;padding:4px 8px}
body.touchmode .sh-ammo{font-size:16px}

.sh-prompt{position:absolute;left:50%;bottom:calc(20% + var(--sab));transform:translateX(-50%);font-size:14px;letter-spacing:2px;background:rgba(10,8,7,.8);border:1px solid #6a5a3a;padding:6px 14px;opacity:0;transition:opacity .15s;white-space:nowrap}
.sh-prompt.show{opacity:1}
.sh-prompt .key{display:inline-block;min-width:20px;padding:1px 5px;margin-right:6px;background:#d8ccb4;color:#1a1410;font-weight:700;text-align:center}
.sh-toast{position:absolute;left:50%;top:32%;transform:translate(-50%,-10px);max-width:80vw;text-align:center;font-size:13px;background:rgba(10,8,7,.9);border:1px solid var(--sh-red);padding:8px 14px;opacity:0;transition:.25s}
.sh-toast.show{opacity:1;transform:translate(-50%,0)}

/* --- sterowanie dotykowe --- */
.tc-root{position:absolute;inset:0;display:none}
.tc-root.on{display:block}
.tc-stickzone{position:absolute;left:0;bottom:0;width:45%;height:70%;pointer-events:auto;touch-action:none}
.tc-stick{position:absolute;left:calc(40px + var(--sal));top:auto;bottom:calc(40px + var(--sab));width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(40,34,30,.35),rgba(20,16,14,.55));border:2px solid rgba(216,204,180,.25);opacity:.45;pointer-events:none;transition:opacity .15s}
.tc-stick.show{opacity:1;bottom:auto}
.tc-knob{position:absolute;left:30px;top:30px;width:60px;height:60px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#8a8070,#3a332c);border:2px solid #1a1612;box-shadow:0 3px 8px #000a}
.tc-btn{position:absolute;pointer-events:auto;touch-action:none;border-radius:50%;background:radial-gradient(circle at 35% 30%,#4a423a,#1c1814);border:2px solid #5a5044;color:#d8ccb4;padding:12px;box-shadow:0 4px 10px #000a, inset 0 0 0 2px #0006}
.tc-btn svg{width:100%;height:100%;display:block}
.tc-btn.down{transform:scale(.92);background:radial-gradient(circle at 35% 30%,#6a5a48,#2a221c)}
.tc-fire{right:calc(34px + var(--sar));bottom:calc(34px + var(--sab));width:92px;height:92px;padding:20px}
.tc-hand{right:calc(140px + var(--sar));bottom:calc(52px + var(--sab));width:60px;height:60px}
.tc-hand.hot{border-color:#e8c060;color:#ffe090;box-shadow:0 0 14px #e8c06088, inset 0 0 0 2px #0006;animation:tchot 1s infinite}
@keyframes tchot{50%{box-shadow:0 0 22px #e8c060cc, inset 0 0 0 2px #0006}}
.tc-gren{right:calc(120px + var(--sar));bottom:calc(128px + var(--sab));width:56px;height:56px}
.tc-reload{right:calc(44px + var(--sar));bottom:calc(140px + var(--sab));width:52px;height:52px}
.tc-swap{right:calc(196px + var(--sar));bottom:calc(128px + var(--sab));width:48px;height:48px}
.tc-root.unarmed .tc-fire,.tc-root.unarmed .tc-gren,.tc-root.unarmed .tc-reload,.tc-root.unarmed .tc-swap{opacity:.35}

/* --- okna --- */
.sh-modal-wrap{position:absolute;inset:0;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;pointer-events:auto;padding:10px}
.sh-modal-wrap.open{display:flex}
.sh-modal{width:min(820px,96vw);max-height:92vh;display:flex;flex-direction:column;background:linear-gradient(#1c1916,#121010);border:2px solid #4a4036;box-shadow:0 0 0 2px #000,0 20px 60px #000;position:relative}
.sh-modal::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:repeating-linear-gradient(135deg,#b8961e 0 8px,#1c1c1a 8px 16px)}
.sh-modal-head{display:flex;justify-content:space-between;align-items:center;padding:12px 14px 8px;border-bottom:1px solid #3a322a}
.sh-modal-title{font-size:15px;letter-spacing:3px;color:var(--sh-bone)}
.sh-x{background:none;border:1px solid #5a4a3a;color:var(--sh-bone);width:30px;height:30px;cursor:pointer}
.sh-modal-body{padding:12px 14px;overflow:auto}
.sh-btn{background:linear-gradient(#3a332c,#241f1a);border:1px solid #6a5a48;color:var(--sh-bone);padding:10px 16px;font-size:13px;letter-spacing:2px;cursor:pointer}
.sh-btn:hover{border-color:#b89a5a}.sh-btn.danger{border-color:var(--sh-red);color:#ffb0a0}.sh-btn.small{padding:6px 12px}
.sh-row{display:flex;gap:8px;justify-content:center;margin-top:10px}.sh-col{display:flex;flex-direction:column;gap:8px;max-width:320px;margin:0 auto}
.sh-p{text-align:center;color:var(--sh-bone);font-size:13px}.sh-hint{font-size:10px;color:var(--sh-dim);text-align:center;margin-top:14px;line-height:1.6}

/* ekwipunek */
.lo-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:12px}
.lo-slots{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.lo-slot{text-align:left;background:#1a1714;border:1px solid #4a4036;color:var(--sh-bone);padding:8px;cursor:pointer;display:flex;flex-direction:column;gap:2px}
.lo-slot small{font-size:9px;color:var(--sh-dim);letter-spacing:2px}.lo-slot b{font-size:12px}
.lo-slot.empty b{color:#5a5248}.lo-slot.sel{border-color:#e8c060;box-shadow:inset 0 0 0 1px #e8c060}
.lo-stats{margin-top:10px;display:grid;grid-template-columns:1fr 1fr;gap:3px 12px;font-size:11px;background:#0e0c0b;border:1px solid #2a241e;padding:8px}
.lo-stats div{display:flex;justify-content:space-between}.lo-stats span{color:var(--sh-dim)}
.lo-list-title,.lo-perks-title{font-size:11px;letter-spacing:2px;color:#e8c060;margin-bottom:6px}
.lo-perks-title{margin-top:10px}.lo-perks-title small{color:var(--sh-dim)}
.lo-list{display:flex;flex-direction:column;gap:4px;max-height:34vh;overflow:auto}
.lo-item{text-align:left;background:#161310;border:1px solid #3a322a;color:var(--sh-bone);padding:6px 8px;cursor:pointer}
.lo-item b{font-size:12px}.lo-item small{display:block;font-size:10px;color:var(--sh-dim);margin-top:3px}
.lo-item.on{border-color:#8ab060;background:#1c2216}
.lo-wstats{display:grid;grid-template-columns:auto 1fr auto 1fr;gap:2px 6px;align-items:center;margin-top:4px;font-size:9px;color:var(--sh-dim)}
.lo-wstats em{display:block;height:4px;background:#2a241e}.lo-wstats i{display:block;height:100%;background:#c8a040}
.lo-soon{color:#a07050;font-style:normal}
.lo-perks{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.lo-perk{text-align:left;background:#161310;border:1px solid #3a322a;color:var(--sh-bone);padding:5px 7px;cursor:pointer}
.lo-perk b{font-size:11px}.lo-perk small{display:block;font-size:9px;color:var(--sh-dim)}
.lo-perk.on{border-color:#e8c060;background:#221c10}

/* garderoba */
.wd-grid{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start}
.wd-prev{width:126px!important;height:196px!important;image-rendering:pixelated;background:radial-gradient(circle at 50% 60%,#3a2e22,#0e0c0a 70%);border:1px solid #4a4036}
.wd-parts{display:flex;flex-direction:column;gap:8px}
.wd-row{border-bottom:1px solid #2a241e;padding-bottom:6px}
.wd-label{font-size:11px;letter-spacing:2px;color:#e8c060;margin-bottom:4px}
.wd-styles{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:4px}
.wd-style{background:#161310;border:1px solid #3a322a;color:var(--sh-bone);font-size:10px;padding:3px 8px;cursor:pointer}.wd-style.on{border-color:#e8c060}
.wd-colors{display:flex;flex-wrap:wrap;gap:5px}
.wd-sw{width:26px;height:26px;border:2px solid #0a0908;box-shadow:0 0 0 1px #4a4036;cursor:pointer}.wd-sw.on{box-shadow:0 0 0 2px #e8c060}

/* terminal */
.tm{background:#050a06;border:2px solid #1a3a22;padding:8px}
.tm-tabs{display:flex;gap:4px;margin-bottom:8px;flex-wrap:wrap}
.tm-tabs button{background:#0a160c;border:1px solid #2a5a34;color:#5ac070;font-size:11px;padding:4px 10px;cursor:pointer}.tm-tabs button.on{background:#1a3a22;color:#b0ffc0}
.tm-screen pre{margin:0;color:#6ae080;font-size:12px;line-height:1.6;text-shadow:0 0 6px #40ff6066;white-space:pre-wrap;min-height:170px;background:repeating-linear-gradient(#0000 0 2px,#0003 2px 3px)}

@media (max-width: 640px){
  .lo-grid,.wd-grid{grid-template-columns:1fr}
}
@media (max-width: 640px), (max-height: 460px){
  .sh-modal-body{padding:8px 10px}.sh-modal-head{padding:8px 10px 6px}
  .lo-list{max-height:40vh}.lo-slot{padding:5px 8px}
  .sh-bar{width:100px}.sh-minimap{width:96px}
  .sh-zone{font-size:11px}
  .tc-fire{width:80px;height:80px}
}
@media (max-width: 520px){
  .sh-zone{top:calc(64px + var(--sat));font-size:10px;letter-spacing:2px}
  .sh-rangestats{top:calc(90px + var(--sat));font-size:9px}
  body.touchmode .sh-weapon{top:calc(64px + var(--sat))}
}

/* ---- telewizor (TvUI) ---- */
.tv-wrap { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.tv-canvas { width: min(512px, 100%); aspect-ratio: 128 / 80; image-rendering: pixelated; border: 6px solid #2a2a28; border-radius: 10px;
  box-shadow: 0 0 0 2px #0d0b0a, 0 0 30px rgba(90, 140, 255, 0.25) inset; background: #000; }
.tv-hint { margin: 0; text-align: center; }
.lo-kits{margin-top:8px;font-size:11px;background:#0e0c0b;border:1px solid #2a241e;padding:8px}
.lo-kits div{display:flex;justify-content:space-between}.lo-kits span{color:var(--sh-dim)}
.lo-kits small,.lo-empty{display:block;margin-top:4px;color:var(--sh-dim);font-size:10px;line-height:1.35}

/* ---- ZBROJOWNIA (ArmoryUI): postać + schowek ---- */
.ic{width:48px;height:48px;image-rendering:pixelated;display:block;flex:0 0 auto}
.ic.sm{width:24px;height:24px;display:inline-block;vertical-align:middle}
.ic.big{width:72px;height:72px}
.ar-grid{display:grid;grid-template-columns:minmax(260px,0.95fr) 1.25fr;gap:12px}
.ar-grid h3{margin:0 0 8px;font-size:11px;letter-spacing:3px;color:#e8c060;font-weight:600;border-bottom:1px solid #3a322a;padding-bottom:4px}
.ar-char,.ar-stash{background:#110f0d;border:1px solid #2e2822;padding:8px;min-width:0}
.ar-doll{display:grid;grid-template-columns:1fr auto 1fr;gap:6px;align-items:center}
.ar-col{display:flex;flex-direction:column;gap:5px}
.ar-center{display:flex;flex-direction:column;align-items:center;gap:4px}
.ar-prev{width:108px!important;height:168px!important;image-rendering:pixelated;background:radial-gradient(circle at 50% 62%,#3a2e22,#0e0c0a 72%);border:1px solid #4a4036}
.ar-rot{display:flex;gap:4px}.ar-rot .sh-btn{padding:3px 10px}
.ar-slot{display:flex;flex-direction:column;align-items:center;gap:1px;background:#1a1714;border:1px solid #4a4036;color:var(--sh-bone);padding:4px 3px;cursor:pointer;min-height:74px;text-align:center}
.ar-slot small{font-size:8.5px;color:var(--sh-dim);letter-spacing:1px}
.ar-slot b{font-size:9.5px;line-height:1.15;word-break:break-word}
.ar-slot .ic{width:36px;height:36px}
.ar-slot.empty b{color:#5a5248}.ar-ph{font-size:20px;color:#3a342c;height:36px;line-height:36px}
.ar-slot.sel{border-color:#e8c060;box-shadow:inset 0 0 0 1px #e8c060,0 0 10px #e8c06044}
.ar-perks{margin-top:8px}.ar-perks>small{font-size:9px;color:var(--sh-dim);letter-spacing:2px}
.ar-perks>div{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:3px}
.ar-perk{display:flex;align-items:center;gap:4px;background:#161310;border:1px solid #3a322a;color:var(--sh-bone);padding:3px;cursor:pointer;font-size:9px;text-align:left}
.ar-perk .ic{width:22px;height:22px}.ar-perk.empty{justify-content:center;color:#4a4238}
.ar-stats{margin-top:8px;display:grid;grid-template-columns:1fr 1fr;gap:2px 10px;font-size:10.5px;background:#0e0c0b;border:1px solid #2a241e;padding:6px}
.ar-stats div{display:flex;justify-content:space-between}.ar-stats span{color:var(--sh-dim)}
.ar-tabs{display:flex;gap:3px;margin-bottom:6px;flex-wrap:wrap}
.ar-tabs button{flex:1;background:#15120f;border:1px solid #3a322a;color:#a89c88;font:11px var(--sh-font);letter-spacing:2px;padding:7px 6px;cursor:pointer}
.ar-tabs button.on{border-color:#e8c060;color:#ffe0a0;background:#2a2216}
.ar-items{max-height:44vh;overflow:auto;padding-right:2px}
.ar-group{font-size:9.5px;letter-spacing:2px;color:#8a8070;margin:6px 0 3px}
.ar-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:4px}
.ar-tile{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;background:#161310;border:1px solid #3a322a;color:var(--sh-bone);padding:5px 3px;cursor:pointer;min-height:84px}
.ar-tile b{font-size:9.5px;text-align:center;line-height:1.15;word-break:break-word}
.ar-tile:hover{border-color:#8a7a5a}.ar-tile.sel{border-color:#e8c060}
.ar-tile.worn{background:#1c2216;border-color:#6a9a48}
.ar-tile.fits{box-shadow:inset 0 0 0 1px #e8c06088}
.ar-badge{position:absolute;top:2px;right:2px;font-style:normal;font-size:7.5px;background:#6a9a48;color:#10180a;padding:0 3px;letter-spacing:1px}
.ar-tiles.counts{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}
.ar-count{display:flex;align-items:center;gap:4px;background:#12100e;border:1px solid #2e2822;padding:3px;font-size:9.5px}
.ar-count .ic{width:28px;height:28px}.ar-count em{margin-left:auto;font-style:normal;color:#ffe0a0;font-size:11px}
.ar-none{grid-column:1/-1}
.ar-hint,.ar-none{display:block;color:var(--sh-dim);font-size:9.5px;margin-top:6px;line-height:1.35}
.ar-detail{margin-top:8px;min-height:56px;border-top:1px solid #2e2822;padding-top:6px;font-size:11px}
.ar-detail small{color:var(--sh-dim);font-size:10px;line-height:1.35;display:block}
.ar-dhead{display:flex;gap:8px;align-items:flex-start}.ar-dhead b{font-size:12px}
.ar-detail .sh-btn{margin-top:6px}
.lo-ammo{color:#c8b070!important}

/* ---- schowek materiałów / lodówka / warsztat ---- */
.stg-shelf{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:6px}
.stg.fridge .stg-shelf{background:linear-gradient(#dfe8ec10,#0000);padding:6px;border:1px solid #3a4a52}
.stg-tile{display:flex;flex-direction:column;align-items:center;gap:3px;background:#161310;border:1px solid #3a322a;padding:6px;text-align:center}
.stg-tile b{font-size:11px}.stg-tile em{font-style:normal;color:#ffe0a0;font-size:13px}
.stg-tile small{font-size:9px;color:var(--sh-dim);line-height:1.3}
.stg-tile.none{opacity:.4}
.cr{display:flex;flex-direction:column;gap:6px}
.cr-row{display:grid;grid-template-columns:1.2fr 1.6fr auto;gap:8px;align-items:center;background:#161310;border:1px solid #3a322a;padding:6px}
.cr-row.no{opacity:.6}
.cr-out{display:flex;align-items:center;gap:6px}.cr-out b{font-size:12px}.cr-out small{display:block;color:var(--sh-dim);font-size:10px}
.cr-out .ic{width:36px;height:36px}
.cr-in{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:10.5px}.cr-in .miss{color:#ff8a6a}.cr-in i{color:var(--sh-dim);font-style:normal}
.cr-row .sh-btn[disabled]{opacity:.4;cursor:not-allowed}
@media (max-width:640px){
  .ar-grid{grid-template-columns:1fr}
  .ar-items{max-height:none}
  .cr-row{grid-template-columns:1fr}
}