/* Lot D — interface « jeu, pas site web » (retours de ByZirTox : menus trop « site web »). Kit commun chargé APRÈS les styles d'index.html :
   il change l'apparence sans toucher la structure (mêmes id / classes : les tests et le code restent valables).
   DA post-apo (docs/DA.md) : tôle sombre usée, ocre / rouille, bandes de danger, rivets, texte pochoir en capitales. Jamais magenta / rose / violet.
   Le pop-up de mise à jour (#whatsnew) n'est PAS touché (« parfait » selon ByZirTox). */
:root{--ui-txt:#e6dcc4;--ui-mut:#9b927b;--ui-och:#d9a441;--ui-och2:#8a6420;--ui-edge:#4a4232;--ui-plate:#1c1a14;--ui-plate2:#25221a;--ui-red:#b5442c;--ui-grn:#7da046}

/* ---------- fond des écrans : vignette + trame de moniteur ---------- */
#stash,#skills,#bunkerui,#powers,#kitchen,#guide,#shop,#cloud,#settings,#chat,#pcard,#swap,#recap,#mp{background:radial-gradient(ellipse at 50% 45%,rgba(14,12,8,.55) 0,rgba(0,0,0,.92) 75%)!important}
#stash::before,#skills::before,#bunkerui::before,#powers::before,#kitchen::before,#guide::before,#shop::before,#cloud::before,#settings::before,#chat::before,#pcard::before,#swap::before,#recap::before,#mp::before{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 3px)}
#stash.on .st-box,#skills.on .st-box,#bunkerui.on .st-box,#powers.on .st-box,#kitchen.on .st-box,#guide.on .st-box,#shop.on .st-box,#cloud.on .st-box,#settings.on .st-box,#chat.on .st-box,#pcard.on .st-box,#swap.on .st-box,#recap.on .st-box,#mp.on .mp-card{animation:ui-in .16s ease-out}
@keyframes ui-in{from{transform:scale(.97)}to{transform:none}}   /* sans décalage vertical : le panneau reste dans l'écran pendant l'animation (test 640×360) */

/* ---------- panneau : plaque de tôle chanfreinée, liseré, rivets ---------- */
#stash .st-box,#skills .st-box,#bunkerui .st-box,#powers .st-box,#kitchen .st-box,#guide .st-box,#shop .st-box,#cloud .st-box,#settings .st-box,#chat .st-box,#pcard .st-box,#swap .st-box,#recap .st-box,#mp .mp-card{
  position:relative;width:min(780px,96vw)!important;max-height:calc(calc(100 * var(--vh, 1vh)) - 14px)!important;border:0!important;border-radius:0!important;color:var(--ui-txt);
  background:linear-gradient(180deg,#27231b 0,#1a1812 58px,#131109 100%)!important;box-shadow:inset 0 0 0 1px #5a5038,inset 0 0 0 3px #0b0a07,inset 0 0 0 4px #2f2a1f,inset 0 0 60px rgba(0,0,0,.55)!important;
  clip-path:polygon(16px 0,calc(100% - 16px) 0,100% 16px,100% calc(100% - 16px),calc(100% - 16px) 100%,16px 100%,0 calc(100% - 16px),0 16px)}
#stash .st-box::after,#skills .st-box::after,#bunkerui .st-box::after,#powers .st-box::after,#kitchen .st-box::after,#guide .st-box::after,#shop .st-box::after,#cloud .st-box::after,#settings .st-box::after,#chat .st-box::after,#pcard .st-box::after,#swap .st-box::after,#recap .st-box::after,#mp .mp-card::after{content:'';position:absolute;inset:7px;pointer-events:none;
  background:radial-gradient(circle,#8a7d5c 0 2px,#2a251b 2.5px,transparent 3.5px) 0 0/8px 8px no-repeat,radial-gradient(circle,#8a7d5c 0 2px,#2a251b 2.5px,transparent 3.5px) 100% 0/8px 8px no-repeat,
  radial-gradient(circle,#8a7d5c 0 2px,#2a251b 2.5px,transparent 3.5px) 0 100%/8px 8px no-repeat,radial-gradient(circle,#8a7d5c 0 2px,#2a251b 2.5px,transparent 3.5px) 100% 100%/8px 8px no-repeat}
#mp .mp-card{width:min(560px,96vw)!important;padding:16px 20px 18px!important}

/* ---------- en-tête : bande de danger + titre au pochoir + bouton rond ✕ ---------- */
#stash .st-h,#skills .st-h,#bunkerui .st-h,#powers .st-h,#kitchen .st-h,#guide .st-h,#shop .st-h,#cloud .st-h,#settings .st-h,#chat .st-h,#pcard .st-h,#swap .st-h,#recap .st-h{position:relative;padding:12px 16px 10px 30px!important;border-bottom:0!important;
  background:linear-gradient(180deg,rgba(255,230,170,.05),transparent);box-shadow:0 1px 0 #0b0a07,0 2px 0 #3a3426}
#stash .st-h::before,#skills .st-h::before,#bunkerui .st-h::before,#powers .st-h::before,#kitchen .st-h::before,#guide .st-h::before,#shop .st-h::before,#cloud .st-h::before,#settings .st-h::before,#chat .st-h::before,#pcard .st-h::before,#swap .st-h::before,#recap .st-h::before{content:'';position:absolute;left:12px;top:12px;bottom:10px;width:8px;
  background:repeating-linear-gradient(135deg,var(--ui-och) 0 5px,#16130c 5px 10px);box-shadow:inset 0 0 0 1px rgba(0,0,0,.5)}
.st-h b,#mp .mp-card h2{font:900 21px/1.1 system-ui,sans-serif!important;letter-spacing:.16em!important;text-transform:uppercase;color:var(--ui-och)!important;text-shadow:0 2px 0 #000,0 0 14px rgba(217,164,65,.25)}
.st-h span{font:700 11px system-ui,sans-serif!important;letter-spacing:.06em;text-transform:uppercase;color:var(--ui-mut)!important;opacity:1!important}
#st-x,#sk-x,#bu-x,#pw-x,#kc-x,#gd-x,#sh-x,#ch-x,#pc-x,#sw-x,#set-x{flex:none;width:40px;height:40px;min-height:40px!important;padding:0!important;border-radius:50%!important;font-size:0!important;color:transparent!important;
  background:radial-gradient(circle at 40% 35%,#55503f,#25221a 70%)!important;border:2px solid #0b0a07!important;box-shadow:0 0 0 1px #6b6148,inset 0 1px 0 rgba(255,240,200,.2)!important;position:relative}
#st-x::before,#sk-x::before,#bu-x::before,#pw-x::before,#kc-x::before,#gd-x::before,#sh-x::before,#ch-x::before,#pc-x::before,#sw-x::before,#set-x::before{content:'✕';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:900 17px system-ui,sans-serif;color:var(--ui-txt)}
#mp .mp-x{top:10px!important;right:12px!important;width:38px;height:38px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#55503f,#25221a 70%)!important;border:2px solid #0b0a07!important;box-shadow:0 0 0 1px #6b6148;color:var(--ui-txt)!important;font:900 16px system-ui,sans-serif!important;z-index:2}

/* ---------- boutons : métal riveté, principal ocre, danger rouille ---------- */
.st-row button,.st-f button,.sh-row button,.sh-f button,#mp .mp-b,#mp .mp-mini,.dp-no,.dp-ok,.gd-nav button{font:800 12px/1 system-ui,sans-serif!important;letter-spacing:.07em;text-transform:uppercase;color:#efe6cf!important;
  background:linear-gradient(180deg,#4b4535,#2b271d)!important;border:1px solid #6b6148!important;border-bottom-color:#14120d!important;border-radius:3px!important;
  box-shadow:inset 0 1px 0 rgba(255,240,200,.16),0 2px 0 #050504!important;min-height:38px!important;padding:8px 12px!important;white-space:nowrap}
.st-row button:active,.st-f button:active,.sh-row button:active,#mp .mp-b:active,#mp .mp-mini:active,.dp-no:active,.dp-ok:active,.gd-nav button:active{transform:translateY(1px)!important;box-shadow:inset 0 1px 0 rgba(255,240,200,.08)!important}
.st-f button,#mp .mp-b.go,#mp .mp-mini.go,.dp-ok,.st-row button.st-eqb{color:#1b1306!important;text-shadow:0 1px 0 rgba(255,230,170,.35);background:linear-gradient(180deg,#e0ad4c,#9a6c22)!important;border-color:#f2c870!important;border-bottom-color:#4a3410!important}
#mp .mp-b.danger{background:linear-gradient(180deg,#a44a30,#5e2414)!important;border-color:#c86a4a!important}
.st-row button:disabled,.st-f button:disabled,.sh-row button:disabled,#mp .mp-b:disabled{filter:grayscale(1) brightness(.6);opacity:.75!important}

/* ---------- onglets : plaques, l'actif est éclairé ---------- */
.gd-tabs button,#mp .mp-tabs button,#mp .mp-seg button{font:800 12px system-ui,sans-serif!important;letter-spacing:.08em;text-transform:uppercase;color:var(--ui-mut)!important;border-radius:2px!important;
  background:linear-gradient(180deg,#1e1b14,#14120d)!important;border:1px solid #39331f!important;border-bottom:3px solid #0b0a07!important;min-height:40px;box-shadow:none!important}
.gd-tabs button.on,#mp .mp-tabs button.on,#mp .mp-seg button.on{color:#f6e4b8!important;background:linear-gradient(180deg,#3a3322,#211d14)!important;border-color:#6b5a32!important;border-bottom-color:var(--ui-och)!important;text-shadow:0 0 10px rgba(217,164,65,.45)}
#mp .lb-chips button,#mp .mk-chips button{border-radius:2px!important;border:1px solid #39331f!important;background:#17150f!important;color:var(--ui-mut)!important}
#mp .lb-chips button.on,#mp .mk-chips button.on{border-color:var(--ui-och)!important;color:#f6e4b8!important;background:#2e281b!important;box-shadow:inset 0 -2px 0 var(--ui-och)!important}

/* ---------- lignes = cartes d'inventaire (liseré de rareté à gauche, case d'icône encadrée) ---------- */
#st-list,#pw-list,#sk-list,#bu-list{padding:8px 12px 10px!important}
#st-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:6px;align-content:start}
#st-list .st-eq,#st-list .st-empty{grid-column:1/-1}
.st-row,.sk-row,.sh-row{position:relative;flex-wrap:wrap;gap:6px 8px!important;margin:0 0 6px;padding:8px 10px 8px 64px!important;min-height:56px;box-sizing:border-box;border:1px solid #2e291e!important;border-left:3px solid var(--rar,#5a5242)!important;border-radius:2px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--rar,#5a5242) 14%,#1d1a13) 0,#17150f 46%,#141209 100%)!important;font-size:14px!important;align-content:center}
#st-list .st-row{margin:0}
.st-row .st-ico,.sk-row .st-ico{position:absolute;left:9px;top:50%;transform:translateY(-50%);width:46px!important;height:46px!important;font-size:28px!important;border-radius:3px;
  background:radial-gradient(circle at 50% 40%,#2c281e,#0e0d09 75%);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--rar,#5a5242) 70%,#000),inset 0 0 12px rgba(0,0,0,.8),0 0 10px color-mix(in srgb,var(--rar,#000) 30%,transparent)}
.st-row .st-ico img,.sk-row .st-ico img{width:84%!important;height:84%!important;filter:drop-shadow(0 2px 2px rgba(0,0,0,.7))}
#st-list .st-row .st-nm{flex:1 1 100%;font-size:14px}
#st-list .st-row .st-nm b{font-weight:800}
#st-list .st-row .st-nm i{font-style:normal;font:700 10px system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;opacity:.9}
#st-list .st-row .st-q{font:800 13px system-ui,sans-serif;color:var(--ui-txt);opacity:1}
#st-list .st-row .st-v{margin-right:auto;font:700 12px system-ui,sans-serif;color:var(--ui-och)}
#st-list .st-row .st-v::before{content:'⛁ ';opacity:.7}
.bu-row .bu-mid,.sk-row .sk-mid{flex:1 1 200px;min-width:0}
.bu-t,.sk-t{font:800 14px system-ui,sans-serif!important;color:#efe2c0!important}
.bu-n,.sk-d{font:500 12px/1.35 system-ui,sans-serif!important;color:var(--ui-mut)!important}
.sk-bar{height:7px!important;border-radius:0!important;background:#0b0a07!important;box-shadow:inset 0 0 0 1px #3a3426}
.sk-bar>*{background:linear-gradient(90deg,#8a6420,var(--ui-och))!important;border-radius:0!important;box-shadow:0 0 8px rgba(217,164,65,.5)}

/* ---------- équipement porté (armoire) : emplacements encadrés ---------- */
#st-list .st-eq{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;padding:8px!important;margin-bottom:4px;background:#0f0e0a;border:1px solid #2e291e;box-shadow:inset 0 0 20px rgba(0,0,0,.6);font-size:0!important}
#st-list .st-eq .slot{display:flex;flex-direction:column;order:0;align-items:center;gap:3px;padding:6px 4px;border:1px dashed #3d3727;background:radial-gradient(circle at 50% 35%,#211e16,#0f0e0a 75%);min-width:0}
#st-list .st-eq .slot.full{border-style:solid;border-color:color-mix(in srgb,var(--rar,#5a5242) 70%,#000);box-shadow:0 0 10px color-mix(in srgb,var(--rar,#000) 25%,transparent)}
#st-list .st-eq .slot .si{width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:26px}
#st-list .st-eq .slot .si img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 2px rgba(0,0,0,.7))}
#st-list .st-eq .slot small{font:800 9px system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--ui-mut)}
#st-list .st-eq .slot b{font:700 11px/1.15 system-ui,sans-serif;text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#st-list .st-empty{padding:18px;text-align:center;color:var(--ui-mut);border:1px dashed #3d3727}
.st-f{border-top:0!important;box-shadow:0 -1px 0 #3a3426,0 -2px 0 #0b0a07;padding:10px 14px!important;background:linear-gradient(0deg,rgba(255,230,170,.04),transparent)}

/* ---------- boutique : vitrine de cartes ---------- */
#shop .sh-t{font:900 13px system-ui,sans-serif!important;letter-spacing:.16em;text-transform:uppercase;color:var(--ui-och)!important;margin:14px 0 8px!important;display:flex;align-items:center;gap:8px}
#shop .sh-t::after{content:'';flex:1;height:2px;background:repeating-linear-gradient(90deg,#3a3426 0 6px,transparent 6px 10px)}
#shop .sh-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
#shop .sh-card{position:relative;display:flex;flex-direction:column;align-items:stretch;border:1px solid #2e291e;background:linear-gradient(180deg,#1d1a13,#121009);box-shadow:inset 0 0 0 1px #0b0a07}
#shop .sh-card.on{border-color:var(--ui-och);box-shadow:0 0 14px rgba(217,164,65,.3),inset 0 0 0 1px #0b0a07}
#shop .sh-ph{position:relative;aspect-ratio:3/4;background:radial-gradient(ellipse at 50% 30%,#2a261d,#0d0c09 70%);overflow:hidden}
#shop .sh-ph img{width:100%;height:100%;object-fit:cover;display:block}
#shop .sh-ph .tag{position:absolute;left:6px;top:6px;font:900 10px system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;padding:3px 6px;background:var(--ui-och);color:#1b1306}
#shop .sh-cb{padding:6px 8px 8px;display:flex;flex-direction:column;gap:6px}
#shop .sh-cb b{font:800 13px system-ui,sans-serif;color:#efe2c0}
#shop .sh-cb button{width:100%}
#shop .sh-row{padding-left:12px!important}
#shop .sh-row.sh-card{padding:0!important;min-height:0;border-left:1px solid #2e291e!important;background:linear-gradient(180deg,#1d1a13,#121009)!important;margin:0;flex-direction:column;flex-wrap:nowrap;gap:0!important}
#shop .sh-row.sh-card.on{border-color:var(--ui-och)!important}
#shop .sh-card .sh-cb i{display:block;text-align:center;font:900 11px system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--ui-grn);padding:11px 0;border:1px solid rgba(125,160,70,.45);background:rgba(125,160,70,.08)}
#shop .sh-card .sh-l small{font:700 10px system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--ui-mut)}
#shop .sh-note{font-size:12px!important;color:var(--ui-mut)!important}

/* ---------- panneau en ligne / marché / classements ---------- */
#mp .mp-card{font:600 14px system-ui,sans-serif!important}
#mp .mp-list li{border-bottom:1px solid #26221a!important;padding:6px 2px!important}
#mp .mp-code{color:var(--ui-och)!important;text-shadow:0 0 12px rgba(217,164,65,.35)}
#mp .mp-card input{border-radius:2px!important;border:1px solid #4a4232!important;background:#0b0a07!important;box-shadow:inset 0 2px 6px rgba(0,0,0,.6)}
#mp .av{width:38px;height:38px;border:2px solid #4a4232}
#mp .mk-list li,#mp .mp-list.lb li{background:linear-gradient(90deg,#1d1a13,#141209);border:1px solid #2e291e!important;margin:0 0 4px;padding:6px 8px!important}
#mp .mp-list.lb li.me{border-color:var(--ui-och)!important;background:linear-gradient(90deg,#3a3120,#18150e)!important}
#mp .lb-cell{background:#0f0e0a!important;border:1px solid #2e291e;border-radius:0!important}
#mp .lb-cell b{color:var(--ui-och)!important}

/* ---------- guide ---------- */
#guide .gd-t{font:900 14px system-ui,sans-serif!important;letter-spacing:.12em;text-transform:uppercase;color:var(--ui-och)!important;border-bottom:1px solid #3a3426;padding-bottom:4px;margin-bottom:6px!important}
#guide .gd-sec{background:linear-gradient(180deg,#1b1812,#131109);border:1px solid #2a251b;padding:10px 12px;margin:0 0 8px!important}
#guide .gd-sec p,#guide .gd-sec li{font-size:14px!important}

/* ---------- indicateurs des meubles interactifs (lot D, point 19) ---------- */
#markers{position:fixed;inset:0;pointer-events:none;z-index:3}
#markers .mkr{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;
  background:radial-gradient(circle at 45% 35%,rgba(60,54,40,.92),rgba(14,12,9,.92));box-shadow:0 0 0 1px rgba(217,164,65,.55),0 2px 6px rgba(0,0,0,.6);opacity:.78;transition:opacity .2s,transform .2s}
#markers .mkr img{width:74%;height:74%;object-fit:contain}
#markers .mkr::after{content:'';position:absolute;left:50%;bottom:-6px;margin-left:-4px;border:4px solid transparent;border-top-color:rgba(217,164,65,.8);border-bottom:0}
#markers .mkr.near{opacity:1;transform:scale(1.22);box-shadow:0 0 0 2px var(--ui-och),0 0 14px rgba(217,164,65,.7)}
#markers .mkr.off{opacity:0}
body.in-raid #markers{display:none}

/* ---------- cinématique de l'Histoire (lot D, point 21) ---------- */
#cine{position:fixed;inset:0;z-index:20;display:none;background:#000;overflow:hidden;user-select:none;-webkit-user-select:none;touch-action:none}#cine.on{display:block}
#cine .cn-stage{position:absolute;inset:0}
#cine .cn-img{position:absolute;inset:-4%;background:#000 center/cover no-repeat;opacity:0;transition:opacity 1.1s ease}
#cine .cn-img.on{opacity:1}
#cine .cn-img.run{animation:cn-kb 12s linear forwards}
@keyframes cn-kb{from{transform:scale(var(--z0,1.04)) translateX(var(--x0,0))}to{transform:scale(var(--z1,1.14)) translateX(var(--x1,0))}}
#cine .cn-ph{position:absolute;inset:0;display:none;align-items:center;justify-content:center;padding:12% 14%;text-align:center;font:italic 500 16px/1.5 system-ui,sans-serif;color:#9b927b;background:radial-gradient(ellipse at 50% 40%,#2a241a,#000 70%)}#cine .cn-ph.on{display:flex}
#cine::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,transparent 55%,rgba(0,0,0,.7) 100%),repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px)}
#cine .cn-bar{position:absolute;left:0;right:0;height:calc(9 * var(--vh, 1vh));background:#000;z-index:2}#cine .cn-bar.top{top:0}#cine .cn-bar.bot{bottom:0}
#cine .cn-title{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:#000;opacity:0;pointer-events:none;transition:opacity .8s}
#cine .cn-title.on{opacity:1}
#cine .cn-title b{font:900 clamp(30px,calc(9 * var(--vh, 1vh)),58px)/1 system-ui,sans-serif;letter-spacing:.3em;color:#d9a441;text-shadow:0 0 24px rgba(217,164,65,.35)}
#cine .cn-title span{font:700 13px system-ui,sans-serif;letter-spacing:.24em;text-transform:uppercase;color:#9b927b}
#cine .cn-cap{position:absolute;left:50%;bottom:calc(calc(9 * var(--vh, 1vh)) + 10px);transform:translateX(-50%);z-index:3;width:min(760px,88vw);padding:10px 16px 12px;background:linear-gradient(180deg,rgba(10,9,7,.55),rgba(10,9,7,.85));border-left:3px solid #d9a441}
#cine .cn-t{font:900 12px system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#d9a441;margin-bottom:4px}
#cine .cn-cap p{margin:0;min-height:2.9em;font:600 clamp(14px,calc(3.6 * var(--vh, 1vh)),18px)/1.45 system-ui,sans-serif;color:#efe6cf;text-shadow:0 2px 3px #000}
#cine .cn-prog{position:absolute;left:50%;top:calc(calc(9 * var(--vh, 1vh)) - 14px);transform:translateX(-50%);z-index:3;display:flex;gap:5px}
#cine .cn-prog i{width:26px;height:3px;background:rgba(239,230,207,.25)}#cine .cn-prog i.done{background:#8a6420}#cine .cn-prog i.now{background:#d9a441;box-shadow:0 0 6px #d9a441}
#cine .cn-skip{position:absolute;right:calc(env(safe-area-inset-right,0px) + 14px);top:calc(calc(9 * var(--vh, 1vh)) + 10px);z-index:5;font:800 12px system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#efe6cf;background:rgba(10,9,7,.6);border:1px solid rgba(239,230,207,.35);border-radius:2px;padding:8px 12px}
#guide .gd-cine{display:block;width:100%;margin:0 0 8px;padding:12px;font:900 14px system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#1b1306;background:linear-gradient(180deg,#e0ad4c,#9a6c22);border:1px solid #f2c870;border-bottom-color:#4a3410;border-radius:3px;box-shadow:0 2px 0 #050504}

/* ---------- réchaud / cuisine (lot E) ---------- */
#kitchen{position:fixed;inset:0;z-index:9;display:none;align-items:center;justify-content:center}#kitchen.on{display:flex}
#kitchen .st-box{display:flex;flex-direction:column}
#kc-body{overflow-y:auto;padding:8px 14px 14px;color:var(--ui-txt);font:600 14px system-ui,sans-serif}
.kc-tabs{padding:0!important;margin-bottom:8px}
.kc-active{display:flex;align-items:center;gap:10px;padding:8px 10px;margin-bottom:10px;border:1px solid #4a4232;border-left:3px solid var(--ui-grn);background:linear-gradient(90deg,rgba(125,160,70,.14),#141209)}
.kc-active.none{border-left-color:#5a5242;background:#141209;color:var(--ui-mut)}.kc-active b{display:block;color:#efe2c0}.kc-active small{color:var(--ui-mut);font-size:12px}.kc-ai{font-size:26px}
.kc-pot{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px;border:1px solid #2e291e;background:radial-gradient(ellipse at 50% 30%,#2a2419,#100e0a 70%)}
.kc-slots{display:flex;align-items:center;gap:8px}.kc-plus{color:var(--ui-och);font-size:18px}
.kc-slot{width:68px;height:68px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1px dashed #4a4232;background:#0f0e0a;color:var(--ui-mut);font:700 10px system-ui,sans-serif;text-transform:uppercase;letter-spacing:.06em;padding:0}
.kc-slot.full{border:1px solid var(--ui-och);box-shadow:0 0 10px rgba(217,164,65,.3);color:var(--ui-txt);cursor:pointer}.kc-slot .ic{width:40px;height:40px;font-size:30px;margin:0}.kc-slot .ic img{width:100%;height:100%}
.kc-hint{margin:2px 0;font-size:13px;color:var(--ui-mut);text-align:center}.kc-hint b{color:#efe2c0}
.kc-go{min-width:200px;min-height:44px;font:900 14px system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#1b1306;background:linear-gradient(180deg,#e0ad4c,#9a6c22);border:1px solid #f2c870;border-bottom-color:#4a3410;border-radius:3px;box-shadow:0 2px 0 #050504}
.kc-go:disabled{filter:grayscale(1) brightness(.55)}
.kc-cook{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:10px;align-items:stretch}
.kc-shelf{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;align-content:center}
@media (max-width:560px){.kc-cook{grid-template-columns:1fr}.kc-shelf{grid-template-columns:repeat(4,1fr)}}
.kc-ing-b{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border:1px solid #39331f;border-bottom:3px solid #0b0a07;background:linear-gradient(180deg,#221f17,#14120d);color:var(--ui-txt);font:700 12px system-ui,sans-serif;border-radius:2px}
.kc-ing-b .ic{width:38px;height:38px;font-size:28px;margin:0}.kc-ing-b .ic img{width:100%;height:100%}.kc-ing-b small{color:var(--ui-mut)}.kc-ing-b:disabled{opacity:.4}
.kc-game{display:flex;flex-direction:column;align-items:center;gap:8px;padding:10px 4px}
.kc-step{font:900 14px system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--ui-och)}
.kc-gauge{position:relative;width:min(560px,88%);height:34px;background:linear-gradient(90deg,#3a1a10,#5a2a14 30%,#2a2418 50%,#5a2a14 70%,#3a1a10);border:2px solid #0b0a07;box-shadow:0 0 0 1px #5a5038,inset 0 0 12px rgba(0,0,0,.8)}
.kc-zone{position:absolute;top:0;bottom:0;background:linear-gradient(180deg,rgba(125,200,90,.75),rgba(70,140,50,.75));box-shadow:0 0 12px rgba(125,200,90,.6)}
.kc-needle{position:absolute;top:-6px;bottom:-6px;width:4px;margin-left:-2px;background:#f6e4b8;box-shadow:0 0 8px #f6e4b8}
.kc-sc{display:flex;gap:6px;min-height:22px}.kc-sc i{font-style:normal;font-weight:900;width:24px;text-align:center}.kc-sc .ok{color:#8fd06a}.kc-sc .mid{color:var(--ui-och)}.kc-sc .ko{color:#d0573a}
.kc-press{min-width:260px;min-height:56px;font-size:18px}
.kc-res{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px;text-align:center}.kc-res b{font:900 17px system-ui,sans-serif;color:#efe2c0}.kc-res p{margin:0;color:var(--ui-och)}.kc-res small{color:var(--ui-mut)}
.kc-stars{font-size:30px;color:var(--ui-och);text-shadow:0 0 12px rgba(217,164,65,.5);letter-spacing:.1em}
.kc-book .st-row{padding-left:84px!important}.kc-book .kc-ing{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:66px;text-align:center;font-size:18px;letter-spacing:-2px}
.kc-book .unk .bu-t{color:var(--ui-mut)!important;letter-spacing:.3em}.kc-book .unk{opacity:.7}
#foodhud{position:fixed;left:calc(env(safe-area-inset-left,0px) + 12px);top:calc(env(safe-area-inset-top,0px) + 160px);z-index:4;display:none;align-items:center;gap:6px;padding:4px 10px 4px 6px;background:rgba(8,8,7,.82);border:1px solid rgba(125,160,70,.6);border-radius:14px;color:#cfe0b0;font:700 11px system-ui,sans-serif}
body.in-raid #foodhud.on{display:flex}
/* Niveau de joueur (lot F) : pastille dans la cellule seulement (sous les vies), annonce plein écran au passage d'un niveau */
#rank{display:flex;align-items:baseline;gap:0 5px;flex-wrap:wrap;width:138px;font:800 11px system-ui,sans-serif;color:#d9b45a;white-space:nowrap}
#rank #rk-t{font-size:10px;font-weight:700;color:#d6d0c0;overflow:hidden;text-overflow:ellipsis;max-width:74px}
#rank i{flex:1 0 100%;height:3px;margin-top:2px;background:rgba(214,208,192,.15);border-radius:2px;overflow:hidden}#rank s{display:block;height:100%;width:0;background:linear-gradient(90deg,#a8802e,#e6c46a);text-decoration:none}
body.in-raid #rank{display:none}
#rank #rk-b{width:14px;height:14px;align-self:center;flex:none;filter:drop-shadow(0 1px 1px rgba(0,0,0,.6))}#lvlup .lu-b{width:58px;height:58px;margin:2px 0;filter:drop-shadow(0 3px 4px rgba(0,0,0,.6))}
#lvlup{position:fixed;left:50%;top:30%;z-index:40;display:none;flex-direction:column;align-items:center;gap:2px;transform:translateX(-50%);padding:14px 34px 12px;background:rgba(8,8,7,.9);border:2px solid #d9b45a;clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px),0 12px);color:#d6d0c0;font:700 12px system-ui,sans-serif;text-align:center;pointer-events:none}
#lvlup.on{display:flex;animation:ui-in .25s ease-out}
#lvlup small{font:900 12px system-ui,sans-serif;letter-spacing:.3em;color:#d9b45a}#lvlup b{font:900 46px/1 system-ui,sans-serif;color:#e6c46a;text-shadow:0 3px 0 #000}#lvlup em{font-style:normal;font-weight:800;color:#9cf0b0;letter-spacing:.04em}

/* HUD rangé (0.26.0, demande de ByZirTox : « plus petit et discret, comme un extract classique ») */
/* profil en haut à gauche : portrait de la tenue + niveau + crédits + vies */
#profile{position:fixed;top:calc(env(safe-area-inset-top,0px) + 8px);left:calc(env(safe-area-inset-left,0px) + 10px);z-index:3;display:flex;align-items:center;gap:7px;padding:3px 9px 3px 3px;background:rgba(8,8,7,.66);border:1px solid rgba(214,208,190,.2);border-radius:9px;pointer-events:none}
#pf-av{width:36px;height:36px;border-radius:7px;object-fit:cover;object-position:50% 18%;background:#1a1916;border:1px solid rgba(217,180,90,.4);flex:none}
.pf-r{display:flex;flex-direction:column;gap:3px}.pf-l{display:flex;align-items:center;gap:9px}
#profile #credits{position:static;display:flex;gap:4px;padding:0;background:none;border:0;border-radius:0;box-shadow:none;font:800 12px system-ui,sans-serif;z-index:auto}
#profile #credits .chip{width:13px;height:13px;font-size:11px}
#profile #lives{position:static;padding:0;background:none;border:0;border-radius:0;font:700 10px system-ui,sans-serif;letter-spacing:.02em;z-index:auto}#profile #lives.out{animation:none;color:#ff8a70}
body.in-raid #cred-raid{font-size:11px;margin-left:3px}
/* besoins (lot R, QCM de ByZirTox) : anneaux de couleur qui se vident autour de l'icône + % dessous, en rangée sous la carte du profil (fini les barres au-dessus du joystick).
   Tous se lisent pareil : plein = tout va bien (toilettes : 100 % = vessie vide). En raid : la vie + les besoins critiques seulement (règle d'index.html). */
#needs{top:calc(env(safe-area-inset-top,0px) + 56px);bottom:auto;left:calc(env(safe-area-inset-left,0px) + 10px);flex-direction:row;gap:6px;padding:0;background:none;border:0;border-radius:0}
#needs .need{--c:#c8473a;flex-direction:column;align-items:center;gap:1px;padding:0;background:none;border:0;border-radius:0;box-shadow:none;animation:none}
#needs .need.th{--c:#5a93b3}#needs .need.hun{--c:#cf8a3c}#needs .need.pee{--c:#c9b24a}
#needs .ring{--p:100;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;box-shadow:0 0 0 1px rgba(0,0,0,.55),0 2px 4px rgba(0,0,0,.45);
  background:radial-gradient(circle closest-side,rgba(12,11,10,.9) 76%,transparent 78%),conic-gradient(var(--c) calc(var(--p) * 1%),rgba(255,255,255,.13) 0)}
#needs .need .ni,#needs .need.hp .ni{width:auto;font-size:12px;justify-content:center;color:var(--c)}#needs .need.hp .ni{font-size:14px;font-weight:900}#needs .ni img{width:15px;height:15px}
#needs .need b{font:800 9px/1 system-ui,sans-serif;color:#e4e0d4;text-shadow:0 1px 0 #000,0 0 3px #000;letter-spacing:.02em}
#needs .need.urgent .ring{animation:needblink 1s infinite}#needs .need.urgent b{color:#ff8a70}#needs .need.hp.urgent .ring{animation-duration:.6s}
@keyframes needblink{50%{box-shadow:0 0 0 1px rgba(0,0,0,.55),0 0 9px 2px var(--c);opacity:.55}}
/* horloge plus discrète ; en raid la mini-carte remonte sous l'horloge (les crédits sont passés dans le profil) */
#clock{padding:3px 9px;font-size:12px;border-width:1px;border-color:rgba(214,208,190,.2);border-radius:8px;box-shadow:none;background:rgba(8,8,7,.66)}
body.in-raid #minimap{top:calc(env(safe-area-inset-top,0px) + 40px);width:120px;border-width:1px;box-shadow:none}
body.in-raid #raidhud{top:calc(env(safe-area-inset-top,0px) + 102px)}   /* sous les cercles des besoins (lot R) */
/* boutons boutique / guide : à droite de la pastille « En ligne » (à gauche, ils chevauchaient le profil sur 640 px) */
#btn-guide{left:calc(50% + 104px);width:32px;height:32px;font-size:15px;border-width:1px}#btn-shop{left:calc(50% + 142px);width:32px;height:32px;font-size:14px;border-width:1px}
/* message temporaire : reste entre le profil (gauche) et l'horloge (droite), passe à la ligne au besoin */
#toast{white-space:normal;text-align:center;width:max-content;max-width:calc(100vw - 2 * (env(safe-area-inset-left,0px) + 212px));font-size:13px;padding:5px 12px;border-width:1px;box-shadow:none}
/* ÉTABLI D'ARMURIER (lot G1) : gros plan 3D sur l'arme (caméra), emplacements à gauche / à droite, stats en bas ; le HUD du jeu est masqué */
#armory{position:fixed;inset:0;z-index:9;display:none;font-family:system-ui,sans-serif;color:#d6d0c0}#armory.on{display:block}
body.armory-on>*:not(#armory):not(#gl):not(canvas):not(#toast):not(#warp):not(#fade){visibility:hidden!important}
.ar-top{position:absolute;top:calc(env(safe-area-inset-top,0px) + 8px);left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:5px 8px 5px 14px;background:rgba(14,13,11,.88);border:1px solid rgba(217,180,90,.45);clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%,0 10px)}
.ar-top b{font:900 13px system-ui,sans-serif;letter-spacing:.12em;color:#e6c36a}.ar-top span{font-size:12px;opacity:.85;white-space:nowrap}
#ar-x{font-size:0;width:30px;height:30px;border-radius:50%;border:1px solid rgba(214,208,190,.4);background:rgba(60,56,46,.9);color:#e6dcc2;position:relative}#ar-x::after{content:'✕';font:800 14px system-ui,sans-serif;position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.ar-col{position:absolute;top:calc(env(safe-area-inset-top,0px) + 56px);bottom:calc(env(safe-area-inset-bottom,0px) + 64px);display:flex;flex-direction:column;justify-content:center;gap:8px;width:clamp(150px,24vw,210px)}
.ar-l{left:calc(env(safe-area-inset-left,0px) + 10px)}.ar-r{right:calc(env(safe-area-inset-right,0px) + 10px)}
.ar-slot{display:flex;align-items:center;gap:8px;text-align:left;padding:6px 8px;background:rgba(14,13,11,.84);border:1px solid rgba(214,208,190,.25);border-left:3px solid var(--rar,transparent);border-radius:6px;color:inherit;font:inherit;min-height:46px}
.ar-slot .ic{width:26px;height:26px;font-size:20px;flex:none;margin:0}.ar-slot.on{border-color:#e6c36a;box-shadow:0 0 0 1px #e6c36a inset}.ar-slot.off{opacity:.45}
.ar-st{display:flex;flex-direction:column;min-width:0}.ar-st small{font:800 9px system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#e6c36a}.ar-st b{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ar-st i{font-style:normal;font-size:10px;opacity:.7}
#ar-pick{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom,0px) + 64px);width:min(360px,calc(100vw - 2 * clamp(150px,24vw,210px) - 40px));max-height:calc(calc(100 * var(--vh, 1vh)) - 140px);overflow-y:auto;display:none;flex-direction:column;gap:5px;padding:7px;background:rgba(14,13,11,.94);border:1px solid rgba(217,180,90,.45);border-radius:8px}#ar-pick.on{display:flex}
.ar-ph{display:flex;align-items:center;justify-content:space-between;font-size:12px;letter-spacing:.1em;color:#e6c36a}.ar-ph button{width:26px;height:26px;border-radius:50%;border:1px solid rgba(214,208,190,.4);background:rgba(60,56,46,.9);color:#e6dcc2;font:800 12px system-ui,sans-serif}
.ar-pr{position:relative;display:flex;align-items:center;gap:8px;text-align:left;padding:6px 8px;background:rgba(40,37,31,.9);border:1px solid rgba(214,208,190,.2);border-left:3px solid var(--rar,#888);border-radius:6px;color:inherit;font:inherit}
.ar-pr .ic{width:24px;height:24px;font-size:18px;flex:none;margin:0}.ar-pr b{font-size:12px}.ar-pr b i{font-style:normal;font-weight:600;font-size:10px;opacity:.75}.ar-pr small{display:block;font-size:10px;opacity:.75;line-height:1.25}
.ar-pr.try{border-color:#e6c36a}.ar-pr.cur{border-left-color:#e2705a}.ar-go{margin-left:auto;flex:none;padding:5px 10px;border-radius:6px;background:#c9a14a;color:#1a1410;font:900 11px system-ui,sans-serif}.ar-none{margin:4px;font-size:12px;opacity:.8}
#ar-stats{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom,0px) + 8px);display:flex;gap:4px;padding:5px 6px;background:rgba(14,13,11,.86);border:1px solid rgba(214,208,190,.22);border-radius:8px;max-width:calc(100vw - 20px);overflow-x:auto}
.ar-sr{display:flex;flex-direction:column;align-items:center;min-width:62px;padding:0 3px;font-size:10px}.ar-sr span{opacity:.7;letter-spacing:.04em}.ar-sr b{font-size:13px}.ar-sr b.mod{color:#e6c36a}.ar-sr em{font-style:normal;font-weight:800;font-size:10px}.ar-sr em.up{color:#8fdc7a}.ar-sr em.dn{color:#e2705a}
body.armory-on #toast{top:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 62px)}
.ar-top b{white-space:nowrap}@media (max-width:700px){.ar-top b{font-size:11px;letter-spacing:.08em}.ar-top span{font-size:11px}}
/* établi : onglets Accessoires / Peinture / Stickers (lot G2) */
.ar-tabs{position:absolute;top:calc(env(safe-area-inset-top,0px) + 52px);left:50%;transform:translateX(-50%);display:flex;gap:4px}
.ar-tabs button{padding:5px 12px;font:800 11px system-ui,sans-serif;letter-spacing:.06em;color:#d6d0c0;background:rgba(14,13,11,.86);border:1px solid rgba(214,208,190,.25);border-radius:6px}.ar-tabs button.on{color:#1a1410;background:#c9a14a;border-color:#c9a14a}
#armory .ar-col{top:calc(env(safe-area-inset-top,0px) + 86px)}
.ar-sw{width:30px;height:30px;border-radius:5px;flex:none;object-fit:cover;border:1px solid rgba(0,0,0,.6)}
.ar-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.ar-cos{padding:5px 6px}.ar-cos.lock{opacity:.62}.ar-cos.lock .ar-sw{filter:grayscale(.85) brightness(.6)}
.ar-cos b{font-size:11px}.ar-cos small{font-size:9.5px}.ar-pg{display:block;height:3px;margin-top:3px;background:rgba(255,255,255,.12);border-radius:2px;overflow:hidden}.ar-pg s{display:block;height:100%;background:#c9a14a;text-decoration:none}
#armory.cosm #ar-pick{width:min(420px,calc(100vw - clamp(150px,24vw,210px) - 40px));left:auto;right:calc(env(safe-area-inset-right,0px) + 10px);transform:none;top:calc(env(safe-area-inset-top,0px) + 86px);bottom:calc(env(safe-area-inset-bottom,0px) + 56px);max-height:none}
.ar-kills{min-width:120px}
/* réglage fin d'une pièce montée (lot G3) : grand curseur, facile au doigt */
.ar-tune{padding:6px 8px 4px;background:rgba(40,37,31,.9);border:1px solid rgba(217,180,90,.35);border-radius:6px}
.ar-tl{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.ar-tl b{font-size:12px}.ar-tl span{font:800 11px system-ui,sans-serif;color:#e6c36a}.ar-tl small{font-size:9px;opacity:.7}
#ar-tune{width:100%;height:28px;margin:2px 0;accent-color:#c9a14a;touch-action:none}
.ar-tabs button{display:flex;align-items:center;gap:5px}.ar-tabs .ic{width:18px;height:18px;font-size:13px;margin:0;flex:none}
/* défilement au doigt (calepin 3 point 55) : ces listes n'avaient pas d'overflow → sur petit écran les dernières lignes (recettes du bunker, mutations) étaient hors d'atteinte */
#sk-list,#bu-list,#pw-list{overflow-y:auto;flex:1;min-height:0}
#st-list,#sk-list,#bu-list,#pw-list,#gd-body,#kc-body,#sh-body,#ar-pick,.mp-card,.wn-list{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y}

/* lot J1 : choix de la sauvegarde (compte ou appareil) */
#cloud{position:fixed;inset:0;z-index:14;display:none;align-items:center;justify-content:center}#cloud.on{display:flex}
#cloud .st-box,#settings .st-box,#chat .st-box,#pcard .st-box,#swap .st-box,#recap .st-box{width:min(520px,94vw)}#cloud .cl-t{margin:10px 14px 4px;font-size:13px;line-height:1.35}
#cloud .cl-opts{display:flex;gap:10px;padding:8px 14px 6px}#cloud .cl-o{flex:1;display:flex;flex-direction:column;gap:6px;padding:10px;border:1px solid rgba(214,208,190,.25);border-radius:8px;background:rgba(255,255,255,.03)}
#cloud .cl-o b{color:#d9a441;font-size:12px;letter-spacing:.06em;text-transform:uppercase}#cloud .cl-o span{font-size:12px;opacity:.85}#cloud .cl-o button{margin-top:auto}
#cloud .cl-later{display:block;margin:4px auto 12px;font-size:12px;opacity:.7;background:none;border:0;color:inherit;text-decoration:underline}

/* lot K (calepin 3) : munitions façon FPS PC en bas à droite (36) + image de l'arme équipée (63) ; plus de chiffres sur les boutons */
#btn-fire .cnt,#btn-reload .cnt{display:none}
#ammo{position:fixed;right:var(--ar);bottom:calc(var(--ab) + var(--btn)*2.42);display:none;align-items:center;gap:6px;padding:3px 9px 3px 6px;background:linear-gradient(90deg,rgba(8,8,7,0),rgba(8,8,7,.72) 28%);border-right:2px solid rgba(217,164,65,.7);color:#e8e0cc;font:800 24px/1 system-ui,sans-serif;font-variant-numeric:tabular-nums;text-shadow:0 2px 3px #000;z-index:3;pointer-events:none}
body.armed #ammo{display:flex}
#ammo .am-w{width:64px;height:30px;font-size:22px;display:flex;align-items:center;justify-content:center}#ammo .am-w img{object-fit:contain}
#ammo #am-r{font-size:13px;color:#b8ae96;align-self:flex-end;margin-bottom:2px}
#ammo.low #am-n{color:#e0533f}#ammo.empty #am-n{color:#e0533f;animation:am-blink .6s steps(2) infinite}@keyframes am-blink{50%{opacity:.35}}
#btn-gun .ico{width:78%;height:78%}
/* recharge (58) : texte + barre au centre de l'écran */
#reloadhud{position:fixed;left:50%;top:60%;transform:translateX(-50%);display:none;flex-direction:column;align-items:center;gap:5px;pointer-events:none;z-index:3}
#reloadhud.on{display:flex}#reloadhud b{font:800 13px system-ui,sans-serif;letter-spacing:.18em;color:#e8d9b0;text-shadow:0 2px 3px #000}
#reloadhud i{display:block;width:130px;height:4px;background:rgba(0,0,0,.6);border:1px solid rgba(0,0,0,.8)}#reloadhud s{display:block;height:100%;width:0;background:#d9a441;text-decoration:none}
/* crédits en raid (47) : seulement le gain du raid, pas tout l'argent du joueur */
body.in-raid #cred-n{display:none}body.in-raid #profile #cred-raid{margin-left:0;font-size:12px}
/* roulette des objets rapides (51) */
#wheel{position:fixed;inset:0;z-index:12;display:none;pointer-events:none;background:radial-gradient(circle at 50% 50%,rgba(0,0,0,.55),rgba(0,0,0,.15) 60%)}#wheel.on{display:block}
#wheel .wh-ring{position:absolute;left:50%;top:50%;width:0;height:0}
#wheel .wh-i{position:absolute;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:50%;border:2px solid rgba(214,208,190,.42);background:radial-gradient(circle at 38% 30%,rgba(60,57,50,.9),rgba(14,13,11,.92) 72%);display:flex;align-items:center;justify-content:center;pointer-events:auto;padding:0;transition:transform .08s}
#wheel .wh-i .ico{width:62%;height:62%;font-size:28px;line-height:1}#wheel .wh-i b{position:absolute;bottom:-4px;right:-4px;min-width:20px;height:18px;padding:0 4px;border-radius:9px;background:#1a1410;color:#c9a14a;border:2px solid #000;font:800 11px/14px system-ui,sans-serif}
#wheel .wh-i.hl{transform:scale(1.22);border-color:rgba(217,164,65,.95);box-shadow:0 0 14px rgba(217,164,65,.7)}
#wheel .wh-c{position:absolute;left:0;top:0;transform:translate(-50%,-50%);font:800 12px system-ui,sans-serif;letter-spacing:.08em;color:#e8d9b0;text-shadow:0 2px 3px #000;white-space:nowrap;text-transform:uppercase}
/* armoire (lot L) : onglets de filtre (43) + munitions à emporter (50) */
#st-list .st-tabs{grid-column:1/-1;display:flex;gap:4px;overflow-x:auto;padding:2px 0 4px;margin-bottom:10px;-webkit-overflow-scrolling:touch;scrollbar-width:none}#st-list .st-tabs::-webkit-scrollbar{display:none}
#st-list .st-tabs button{flex:0 0 auto;padding:5px 10px;border-radius:6px;border:1px solid rgba(214,208,190,.25);background:rgba(255,255,255,.04);color:#c9c1aa;font:700 11px system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase}
#st-list .st-tabs button.on{background:rgba(217,164,65,.2);border-color:rgba(217,164,65,.8);color:#f0d9a0}
#st-list .st-row.st-on{box-shadow:inset 0 0 0 2px rgba(217,164,65,.7)}
#st-list .st-ammo{flex:1 1 100%;display:flex;align-items:center;gap:8px;padding-top:4px}#st-list .st-ammo input{flex:1;accent-color:#d9a441}#st-list .st-ammo b{min-width:34px;text-align:right;color:#f0d9a0}
#st-list .st-hint{flex:1 1 100%;font-size:11px;opacity:.65}
#st-list .st-row{align-content:flex-start}#st-list{grid-auto-rows:max-content}
@media (max-height:420px){#st-list .st-eq{padding:5px!important;gap:4px}#st-list .st-eq .slot{padding:3px 2px;gap:1px}#st-list .st-eq .slot .si{width:26px;height:26px;font-size:18px}#st-list .st-tabs button{padding:4px 8px}}
/* écran « Butin récupéré » (lot L) */
#recap{position:fixed;inset:0;z-index:13;display:none;align-items:center;justify-content:center}#recap.on{display:flex}
#recap .st-box{width:min(620px,94vw);max-height:calc(calc(100 * var(--vh, 1vh)) - 16px)}
#rc-list{overflow-y:auto;flex:1;min-height:0;padding:8px 12px;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:6px;grid-auto-rows:max-content;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y}
#rc-list .rc-row{margin:0;cursor:pointer;align-content:flex-start}#rc-list .rc-row .st-nm{flex:1 1 100%;font-size:13px}#rc-list .rc-row .st-v{margin-right:auto;font:700 12px system-ui,sans-serif;color:var(--ui-och)}#rc-list .rc-row .st-v::before{content:'⛁ ';opacity:.7}
#rc-list .rc-row input{width:20px;height:20px;accent-color:#d9a441;margin:0}#rc-list .rc-lbl{font:700 11px system-ui,sans-serif;font-style:normal;text-transform:uppercase;letter-spacing:.06em;opacity:.8}
#rc-list .rc-row.sel{box-shadow:inset 0 0 0 2px rgba(217,164,65,.75)}
#recap .st-f{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
/* social (lot M) : bulle de chat, chat global, fiche joueur + messages privés */
#btn-chat{position:fixed;top:calc(env(safe-area-inset-top,0px) + 10px);left:calc(50% - 104px);width:32px;height:32px;padding:0;z-index:4;border-radius:50%;border:1px solid rgba(214,208,190,.42);background:rgba(8,8,7,.82);display:flex;align-items:center;justify-content:center}
#btn-chat .ico{width:20px;height:20px;font-size:15px;line-height:1}#btn-chat .cnt{position:absolute;top:-5px;right:-6px;min-width:16px;height:16px;padding:0 3px;border-radius:8px;background:#c9502e;color:#fff;font:800 10px/16px system-ui,sans-serif;display:none}#btn-chat.new .cnt{display:block}
body.in-raid #btn-chat,body.armory-on #btn-chat{display:none}
#chat,#pcard{position:fixed;inset:0;z-index:12;display:none;align-items:center;justify-content:center}#chat.on,#pcard.on{display:flex}
#chat .st-box,#pcard .st-box{width:min(560px,94vw);max-height:calc(calc(100 * var(--vh, 1vh)) - 16px)}
#chat .ch-list,#pcard .pc-dm{overflow-y:auto;flex:1;min-height:90px;padding:8px 12px;display:flex;flex-direction:column;gap:4px;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y}
#chat .ch-m{font-size:13px;line-height:1.3;word-break:break-word}#chat .ch-m i{font-style:normal;font-size:10px;opacity:.5;margin-right:6px}
#chat .ch-n{background:none;border:0;padding:0;margin-right:6px;color:#d9a441;font:800 13px system-ui,sans-serif;cursor:pointer}#chat .ch-m.me .ch-n{color:#9fe0a0}
.pc-in{display:flex;gap:6px;padding:6px 12px 10px}.pc-in input{flex:1;min-width:0;padding:8px 10px;border-radius:6px;border:1px solid rgba(214,208,190,.3);background:#0f0e0a;color:#e8e0cc;font:14px system-ui,sans-serif}
#pcard .pc-body{display:flex;flex-direction:column;gap:6px;padding:8px 12px 10px;overflow-y:auto;min-height:0}
#pcard .pc-top{display:flex;align-items:center;gap:10px}#pcard .pc-top .av{width:52px;height:52px;border-radius:8px}#pcard .pc-id{display:flex;flex-direction:column;gap:2px}#pcard .pc-id b{font:800 16px system-ui,sans-serif;color:#f0d9a0}#pcard .pc-id span{font-size:12px;opacity:.85}
#pcard .pc-st.on{color:#9fe0a0}#pcard .pc-st.raid{color:#e0a64a}
#pcard .pc-sub{margin:4px 0 0;font:800 10px system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;opacity:.6}
#pcard .pc-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}#pcard .pc-stats div{display:flex;flex-direction:column;align-items:center;padding:4px;background:rgba(255,255,255,.03);border:1px solid rgba(214,208,190,.15);border-radius:6px}#pcard .pc-stats b{font:800 15px system-ui,sans-serif}#pcard .pc-stats small{font-size:10px;opacity:.7}
#pcard .pc-rk{margin:0;font-size:12px;opacity:.85}#pcard .pc-acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}#pcard .pc-acts button{flex:1 1 auto;min-width:110px}
#pcard .pc-m{align-self:flex-start;max-width:80%;padding:5px 9px;border-radius:8px;background:rgba(255,255,255,.06);font-size:13px;word-break:break-word}#pcard .pc-m.me{align-self:flex-end;background:rgba(217,164,65,.18)}#pcard .pc-m i{display:block;font-style:normal;font-size:9px;opacity:.5;text-align:right}
#pcard .pc-wait{opacity:.6;font-size:13px;text-align:center;margin:8px 0}#pcard .pc-link{align-self:flex-start;background:none;border:0;color:#d9a441;font:700 12px system-ui,sans-serif;padding:2px 0}
#mp .mp-card-btn{background:none;border:0;color:inherit;font:inherit;padding:0;display:flex;align-items:center;gap:6px;cursor:pointer;text-align:left}#mp .mp-un{font-style:normal;min-width:16px;height:16px;border-radius:8px;background:#c9502e;color:#fff;font:800 10px/16px system-ui,sans-serif;text-align:center;padding:0 4px}
/* Paramètres (lot M) */
#btn-set{position:fixed;top:calc(env(safe-area-inset-top,0px) + 10px);left:calc(50% + 66px);width:32px;height:32px;padding:0;z-index:4;border-radius:50%;border:1px solid rgba(214,208,190,.42);background:rgba(8,8,7,.82);display:flex;align-items:center;justify-content:center}
#btn-set .ico{width:20px;height:20px;font-size:18px;line-height:20px;text-align:center;color:#d9c9a0}body.in-raid #btn-set,body.armory-on #btn-set{display:none}
#settings{position:fixed;inset:0;z-index:12;display:none;align-items:center;justify-content:center}#settings.on{display:flex}
#settings .st-box{width:min(480px,94vw);max-height:calc(calc(100 * var(--vh, 1vh)) - 16px)}#settings .set-body{padding:8px 14px 14px;overflow-y:auto;display:flex;flex-direction:column;gap:6px}
#settings .set-t{margin:6px 0 0;font:800 11px system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#d9a441}#settings .set-s{margin:0;font-size:12px;opacity:.8}
#settings .set-q{display:flex;gap:6px}#settings .set-q button{flex:1;padding:8px 4px;border-radius:6px;border:1px solid rgba(214,208,190,.3);background:rgba(255,255,255,.04);color:#d6d0c0;font:800 12px system-ui,sans-serif;text-transform:uppercase}
#settings .set-q button.on{background:rgba(217,164,65,.22);border-color:rgba(217,164,65,.85);color:#f0d9a0}
#settings .set-soc{display:flex;flex-wrap:wrap;gap:8px}#settings .set-soc button{display:flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:20px;border:1px solid rgba(214,208,190,.3);background:rgba(255,255,255,.04);color:#e8e0cc;font:700 13px system-ui,sans-serif}
#settings .set-soc b{width:24px;height:24px;border-radius:50%;background:var(--c);color:#fff;display:flex;align-items:center;justify-content:center;font:800 13px system-ui,sans-serif}

/* ---- Mode « Aménager » du bunker (lot N2) : bouton du bunker, barre du haut (titre + Terminer), barre du bas (réserve / Tourner · Ranger · Annuler · OK) */
#btn-amenage{display:none;position:fixed;top:calc(env(safe-area-inset-top,0px) + 102px);left:calc(env(safe-area-inset-left,0px) + 10px);z-index:4;align-items:center;gap:6px;padding:5px 11px 5px 6px;
  font:800 11px system-ui,sans-serif;letter-spacing:.07em;text-transform:uppercase;color:#efe6cf;background:linear-gradient(180deg,#4b4535,#2b271d);border:1px solid #6b6148;border-bottom-color:#14120d;border-radius:3px;box-shadow:inset 0 1px 0 rgba(255,240,200,.16),0 2px 0 #050504}
#btn-amenage .ico{width:20px;height:20px;font-size:15px;line-height:20px;text-align:center;display:inline-block}#btn-amenage .ico img{width:100%;height:100%}
#btn-amenage{display:flex}   /* lot S : bunker ET cellule */
body.armory-on #btn-amenage,body.bunker-edit #btn-amenage,body.in-raid #btn-amenage{display:none}
body.bunker-edit>*:not(#bedit):not(#bunkerui):not(#gl):not(canvas):not(#toast):not(#warp):not(#fade){visibility:hidden!important}
body.bunker-edit #toast{top:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 108px)}
#bedit{display:none;position:fixed;inset:0;z-index:8;touch-action:none;user-select:none;-webkit-user-select:none}#bedit.on{display:block}
#bedit .be-hit{position:absolute;inset:0;touch-action:none}
#bedit .be-top{position:absolute;top:calc(env(safe-area-inset-top,0px) + 8px);left:calc(env(safe-area-inset-left,0px) + 10px);right:calc(env(safe-area-inset-right,0px) + 10px);display:flex;align-items:center;gap:12px;pointer-events:none}
#bedit .be-top b{font:900 14px system-ui,sans-serif;letter-spacing:.16em;color:#e6c36a;padding:6px 12px 6px 22px;background:rgba(10,9,7,.82);border:1px solid rgba(214,190,120,.35);border-radius:3px;
  background-image:repeating-linear-gradient(-45deg,#c9a227 0 5px,#1a1610 5px 10px);background-size:9px 100%;background-repeat:no-repeat;background-position:6px 0}
#bedit .be-hint{flex:1;font:600 12px system-ui,sans-serif;color:#d6d0c0;text-shadow:0 1px 2px #000;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#bedit button{pointer-events:auto;font:800 12px/1 system-ui,sans-serif;letter-spacing:.07em;text-transform:uppercase;color:#efe6cf;background:linear-gradient(180deg,#4b4535,#2b271d);border:1px solid #6b6148;border-bottom-color:#14120d;border-radius:3px;
  box-shadow:inset 0 1px 0 rgba(255,240,200,.16),0 2px 0 #050504;min-height:38px;padding:8px 12px;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
#bedit button:active{transform:translateY(1px)}#bedit button:disabled{opacity:.42}
#bedit button.go,#bedit .be-done{color:#1b1306;text-shadow:0 1px 0 rgba(255,230,170,.35);background:linear-gradient(180deg,#e0ad4c,#9a6c22);border-color:#f2c870;border-bottom-color:#4a3410}
#bedit .be-bot{position:absolute;left:calc(env(safe-area-inset-left,0px) + 10px);right:calc(env(safe-area-inset-right,0px) + 10px);bottom:calc(env(safe-area-inset-bottom,0px) + 10px);display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none}
#bedit .be-row{display:flex;gap:8px;flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding:2px;pointer-events:auto;scrollbar-width:none;touch-action:pan-x}
#bedit .be-row .ico{width:22px;height:22px;font-size:16px;line-height:22px;text-align:center;display:inline-block}#bedit .be-row .ico img{width:100%;height:100%}
#bedit .be-empty{align-self:center;font:600 12px system-ui,sans-serif;color:#a69f8c;padding:0 6px}
#bedit .be-why{font:800 12px system-ui,sans-serif;letter-spacing:.05em;padding:4px 10px;border-radius:3px;background:rgba(10,9,7,.8);color:#d6d0c0}#bedit .be-why:empty{display:none}
#bedit .be-why.ok{color:#8fe08a;border:1px solid rgba(88,210,106,.45)}#bedit .be-why.bad{color:#f0806a;border:1px solid rgba(208,64,42,.55)}
#bunkerui .bu-icons button,#bunkerui .bu-colors button{font:800 11px/1 system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#efe6cf;background:linear-gradient(180deg,#4b4535,#2b271d);border:1px solid #6b6148;border-bottom-color:#14120d;border-radius:3px;min-height:38px;padding:7px 10px}
#bunkerui .bu-icons button.st-eqb,#bunkerui .bu-colors button.st-eqb{outline:2px solid #f2c870;outline-offset:1px;background:linear-gradient(180deg,#6a5a34,#3a3020)}
#bunkerui .bu-icons .st-ico{width:30px;height:30px;font-size:22px;line-height:30px;display:inline-block}#bunkerui .bu-icons .st-ico img{width:100%;height:100%}

/* ---- Navigateurs mobiles (lot Q, calepin 4 : iPhone / Safari) */
/* Safari iOS zoome sur un champ dont le texte fait moins de 16 px (et le zoom reste) : 16 px partout sur iPhone (-webkit-touch-callout n'existe que sur iOS) */
@supports (-webkit-touch-callout:none){input,textarea,select{font-size:16px!important}}
button,a,label,input,select,textarea,[data-a]{touch-action:manipulation}   /* pas de délai ni de zoom au double tap sur les commandes */
#start .start-ios{max-width:min(520px,86vw);margin:4px 0 0;padding:8px 12px;font:600 13px/1.4 system-ui,sans-serif;color:#e8dcb8;background:rgba(10,9,7,.7);border:1px solid rgba(214,190,120,.4);border-radius:6px;opacity:1}
#start .start-ios .sh{display:inline-block;padding:0 4px;border:1px solid #e8dcb8;border-radius:3px;font-size:11px}
#start .start-inst{margin-top:6px;padding:10px 18px;font:800 13px system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#1b1306;background:linear-gradient(180deg,#e0ad4c,#9a6c22);border:1px solid #f2c870;border-bottom-color:#4a3410;border-radius:3px}
/* badge d'accès (lot O) : sous l'objectif et l'alerte, en raid */
#badgehud{display:none;background:rgba(40,10,8,.75);padding:3px 9px;border-radius:7px;border:1px solid rgba(224,80,60,.6);color:#ffb0a0}#badgehud.on{display:block}
/* prime au portail (lot O2) */
.dp-bounty{display:flex;align-items:center;gap:8px;margin:0 0 12px;padding:7px 10px;border:1px solid rgba(217,180,90,.35);border-radius:9px;background:rgba(40,32,16,.6);font:700 12px system-ui,sans-serif;color:#efe2bf;text-align:left;cursor:pointer}
.dp-bounty input{width:18px;height:18px;accent-color:#d9b45a;flex:none}.dp-bounty.low{opacity:.6}
/* crochetage (lot O3) */
#lockpick{position:fixed;inset:0;z-index:40;display:none;align-items:center;justify-content:center;background:rgba(6,5,4,.55);touch-action:none}#lockpick.on{display:flex}
#lockpick .lp-box{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 16px 12px;background:linear-gradient(180deg,#2b271f,#191612);border:1px solid #6b6148;border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.6);max-height:calc(96 * var(--vh, 1vh))}
#lockpick .lp-title{font:900 14px system-ui,sans-serif;letter-spacing:.2em;color:#e6c46a}
#lockpick canvas{width:min(220px,calc(52 * var(--vh, 1vh)));height:min(220px,calc(52 * var(--vh, 1vh)))}
#lockpick .lp-picks{font:700 13px system-ui,sans-serif;color:#efe6cf}#lockpick .lp-hint{font:600 11px system-ui,sans-serif;color:#b9b09a}
#lockpick .lp-row{display:flex;gap:8px}#lockpick button{font:800 12px system-ui,sans-serif;letter-spacing:.06em;padding:8px 12px;border-radius:9px;border:1px solid #6b6148;background:linear-gradient(180deg,#4b4535,#2b271d);color:#efe6cf;touch-action:none}
#lockpick .lp-turn{background:linear-gradient(180deg,#d9b45a,#a07a2a);color:#1b1408;padding:10px 22px}
/* volumes (lot O4) */
.set-vol{display:flex;align-items:center;gap:10px;margin:4px 0;font:700 13px system-ui,sans-serif;color:#e8e2d0}.set-vol input{flex:1;accent-color:#d9b45a;height:30px}
/* vue FPS (lot P) : viseur au centre */
#crosshair{display:none;position:fixed;left:50%;top:50%;width:18px;height:18px;margin:-9px 0 0 -9px;pointer-events:none;z-index:5}
#crosshair::before,#crosshair::after{content:'';position:absolute;background:rgba(240,230,205,.85);box-shadow:0 0 2px #000}
#crosshair::before{left:8px;top:0;width:2px;height:18px}#crosshair::after{top:8px;left:0;width:18px;height:2px}
body.fps #crosshair{display:block}body.fps.in-raid #crosshair{display:block}
/* établi façon « Weapon Assembly » d'Arena Breakout (lot P) : stats en colonne à gauche, emplacements au-dessus et au-dessous de l'arme, un trait vers chaque pièce */
.ar-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
#armory.ab .ar-col{flex-direction:row;justify-content:center;align-items:stretch;width:auto;left:calc(env(safe-area-inset-left,0px) + 184px);right:calc(env(safe-area-inset-right,0px) + 10px);gap:8px}
#armory.ab .ar-l{top:calc(env(safe-area-inset-top,0px) + 86px);bottom:auto}#armory.ab .ar-r{top:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 8px)}
#armory.ab .ar-slot{flex:1 1 0;min-width:0;max-width:230px}
#armory.ab #ar-stats{left:calc(env(safe-area-inset-left,0px) + 10px);transform:none;top:calc(env(safe-area-inset-top,0px) + 86px);bottom:calc(env(safe-area-inset-bottom,0px) + 8px);flex-direction:column;justify-content:flex-start;width:152px;max-width:none;overflow-x:hidden;overflow-y:auto;gap:2px}
#armory.ab .ar-sr{flex-direction:row;flex-wrap:wrap;justify-content:space-between;align-items:baseline;min-width:0;gap:0 6px;padding:3px 4px;border-bottom:1px solid rgba(214,208,190,.08)}#armory.ab .ar-sr em{width:100%;text-align:right}
#armory.ab #ar-pick{left:calc(50% + 87px);bottom:calc(env(safe-area-inset-bottom,0px) + 66px);width:min(340px,calc(100vw - 384px));max-height:calc(calc(100 * var(--vh, 1vh)) - 236px)}
#armory.ab .ar-st i{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#armory.ab .ar-slot{max-height:54px}
#settings select.set-lang{width:100%;padding:9px 8px;border-radius:6px;border:1px solid rgba(214,208,190,.3);background:#1c1a16;color:#e8e2d0;font:inherit;font-size:15px}
/* bandeau du groupe à 5-8 joueurs (calepin 5 point 87) : avatars plus petits qui se chevauchent ; le bandeau reste entre le profil et l'horloge ; texte sur 2 lignes au plus, masqué si la place manque */
#mp-bar{max-width:min(600px,calc(100vw - 420px))}#mp-bar .mb-h{min-width:0;flex:1 1 auto;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.mb-g.many .mb-p,.mb-g.many .mb-p .av{width:28px;height:28px}.mb-g.many .mb-p+.mb-p{margin-left:-11px}.mb-g.many{gap:0}
@media (max-width:900px){#mp-bar:has(.mb-g.many) .mb-h{display:none}}
/* calepin 6 (91) : la barre ← ● → n'est plus collée en bas par-dessus le texte de la case (elle le cachait en 844×390) */
#guide .gd-nav{position:static!important;margin-top:8px}
@media (max-height:460px){#guide .gd-art{max-height:calc(24 * var(--vh, 1vh))!important}#guide .gd-cine{padding:8px!important;font-size:12px!important}#guide .gd-cap p{font-size:13px!important}}
/* calepin 6 (97) : cases à cocher dans le style du jeu (portail, butin récupéré, panneaux) au lieu du carré blanc du navigateur */
input[type=checkbox]{-webkit-appearance:none!important;appearance:none!important;flex:none;width:22px!important;height:22px!important;min-height:0!important;margin:0 8px 0 0!important;padding:0!important;position:relative;vertical-align:middle;border:2px solid #6b5a32!important;border-radius:3px!important;background:linear-gradient(180deg,#0e0c08,#1d1910)!important;box-shadow:inset 0 2px 3px rgba(0,0,0,.6)!important;cursor:pointer}
input[type=checkbox]:checked{background:linear-gradient(180deg,#e0ad4c,#9a6c22)!important;border-color:#f2c870!important}
input[type=checkbox]:checked::after{content:'';position:absolute;left:6px;top:2px;width:5px;height:10px;border:solid #1b1306;border-width:0 3px 3px 0;transform:rotate(45deg)}
label:has(>input[type=checkbox]){display:inline-flex;align-items:center;cursor:pointer}
.mp-diagrow{opacity:.75;font-size:12px}
/* calepin 6 (97) : boutons Quantité de la bourse dans le style métal (ils restaient blancs) */
.mk-qty button{font:800 12px/1 system-ui,sans-serif!important;letter-spacing:.06em;color:#efe6cf!important;background:linear-gradient(180deg,#3a3426,#211d14)!important;border:1px solid #57492c!important;border-bottom-color:#0e0c08!important;border-radius:2px!important;padding:7px 12px!important;min-height:30px}
.mk-qty button.st-eqb{color:#1b1306!important;background:linear-gradient(180deg,#e0ad4c,#9a6c22)!important;border-color:#f2c870!important}
.mk-qty span{font:800 11px system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--ui-mut)}
/* calepin 6 (96) : armoire en 2 colonnes (équipement à gauche, onglets + objets à droite) */
#stash .st-box.st-2col{display:grid!important;grid-template-columns:clamp(150px,22vw,200px) 1fr;grid-template-rows:auto auto minmax(0,1fr) auto}
#stash .st-2col>.st-h,#stash .st-2col>.st-f{grid-column:1/-1}
#stash .st-2col>#st-side{grid-column:1;grid-row:2/4;overflow-y:auto;padding:8px 0 8px 12px;min-height:0}
#stash .st-2col>#st-tabsbar{grid-column:2;grid-row:2;padding:8px 12px 0;min-width:0}
#stash .st-2col>#st-list{grid-column:2;grid-row:3;min-height:0;overflow-y:auto}
#stash #st-side .st-eq{display:flex;flex-direction:column;gap:5px;padding:6px!important;background:#0f0e0a;border:1px solid #2e291e;box-shadow:inset 0 0 20px rgba(0,0,0,.6);font-size:0!important}
#stash #st-side .slot{display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;column-gap:7px;align-items:center;padding:4px 6px;border:1px dashed #3d3727;background:radial-gradient(circle at 20% 50%,#211e16,#0f0e0a 75%);min-width:0}
#stash #st-side .slot.full{border-style:solid;border-color:color-mix(in srgb,var(--rar,#5a5242) 70%,#000)}
#stash #st-side .slot .si{grid-row:1/3;width:34px;height:34px;display:flex;align-items:center;justify-content:center;font-size:22px}
#stash #st-side .slot .si img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 2px rgba(0,0,0,.7))}
#stash #st-side .slot small{font:800 9px system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--ui-mut);align-self:end}
#stash #st-side .slot b{font:700 11px/1.15 system-ui,sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-self:start;min-width:0}
#stash #st-tabsbar .st-tabs{display:flex;gap:4px;overflow-x:auto;padding:0 0 2px;scrollbar-width:none}#stash #st-tabsbar .st-tabs::-webkit-scrollbar{display:none}
#stash #st-tabsbar .st-tabs button{flex:0 0 auto;padding:5px 9px;border-radius:3px;border:1px solid rgba(214,208,190,.25);background:rgba(255,255,255,.04);color:#c9c1aa;font:700 10.5px system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase}
#stash #st-tabsbar .st-tabs button.on{background:rgba(217,164,65,.2);border-color:rgba(217,164,65,.8);color:#f0d9a0}
#stash .st-2col #st-list{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
@media (max-height:460px){#stash .st-2col .st-f{padding:6px 12px!important}#stash .st-2col .st-f button{min-height:34px!important;padding:6px 14px!important}#stash .st-2col .st-h{padding:8px 16px 6px 30px!important}}
#stash .st-2col #st-list .st-row{min-height:50px;padding:6px 8px 6px 58px!important;gap:3px 6px!important}
#stash .st-2col #st-list .st-row .st-ico{width:40px!important;height:40px!important;left:8px}
#stash .st-2col #st-list .st-row .st-nm{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#stash .st-2col #st-list .st-row button{padding:6px 9px!important;min-height:28px!important;font-size:10.5px!important}

/* ===================== calepin 6 (100) : HUD du haut rangé =====================
   gauche = profil · centre = besoins (vie, soif, faim, vessie) · droite = menu burger (En ligne, chat, tenues, guide, paramètres, Aménager).
   L'heure et le jour sont sur le mur de la cellule (horloge 3D) : le cadran du HUD ne reste qu'en raid. */
#needs{left:50%!important;transform:translateX(-50%);top:calc(env(safe-area-inset-top,0px) + 8px)!important;gap:10px!important;padding:4px 12px 3px!important;background:linear-gradient(180deg,rgba(8,8,7,.7),rgba(8,8,7,.35))!important;border:1px solid rgba(214,208,190,.14)!important;border-radius:3px!important;clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%,0 8px)}
#needs .ring{width:34px!important;height:34px!important}
#needs .need .ni img{width:17px!important;height:17px!important}
body:not(.in-raid) #clock{display:none!important}
body.in-raid #raidhud{top:calc(env(safe-area-inset-top,0px) + 56px)!important}
#foodhud{top:calc(env(safe-area-inset-top,0px) + 112px)!important}
#toast{top:calc(env(safe-area-inset-top,0px) + 64px)!important;max-width:min(520px,calc(100vw - 2 * (env(safe-area-inset-left,0px) + 200px)))!important}
/* burger */
#btn-menu{position:fixed;top:calc(env(safe-area-inset-top,0px) + 8px);right:calc(env(safe-area-inset-right,0px) + 10px);z-index:6;width:46px;height:42px;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  background:linear-gradient(180deg,#2a251b,#15120c);border:1px solid #57492c;border-bottom-color:#0b0a07;border-radius:2px;box-shadow:0 2px 0 #050504,inset 0 1px 0 rgba(255,240,200,.08);clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
#btn-menu i{display:block;width:20px;height:3px;background:#d9a441;border-radius:1px;box-shadow:0 0 6px rgba(217,164,65,.35);transition:transform .2s,opacity .2s}
#btn-menu.on i:nth-child(1){transform:translateY(8px) rotate(45deg)}#btn-menu.on i:nth-child(2){opacity:0}#btn-menu.on i:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
#btn-menu .hm-dot{position:absolute;left:6px;top:6px;width:7px;height:7px;border-radius:50%;background:#5c574b;box-shadow:0 0 0 1px #000}
#btn-menu .hm-dot.on{background:#7bd36a;box-shadow:0 0 0 1px #000,0 0 6px #7bd36a}
#btn-menu .hm-cnt{position:absolute;right:3px;top:3px;min-width:15px;height:15px;padding:0 3px;border-radius:8px;background:#c9502e;color:#fff;font:800 10px/15px system-ui,sans-serif;text-align:center;display:none}#btn-menu .hm-cnt.on{display:block}
body.in-raid #btn-menu,body.armory-on #btn-menu,body.bunker-edit #btn-menu{display:none}
/* tiroir */
#hudmenu{position:fixed;inset:0;z-index:30;display:none;background:linear-gradient(90deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.6))}
#hudmenu.on{display:block}
#hudmenu .hm-panel{position:absolute;top:0;bottom:0;right:0;width:min(270px,70vw);padding:calc(env(safe-area-inset-top,0px) + 8px) calc(env(safe-area-inset-right,0px) + 10px) 10px 12px;box-sizing:border-box;display:flex;flex-direction:column;gap:6px;
  background:linear-gradient(180deg,#1f1b13,#110f0a);border-left:2px solid #57492c;box-shadow:-10px 0 30px rgba(0,0,0,.7);animation:hm-in .18s ease-out;overflow-y:auto}
@keyframes hm-in{from{transform:translateX(30px);opacity:.4}to{transform:none;opacity:1}}
#hudmenu .hm-h{display:flex;align-items:center;justify-content:space-between;padding:4px 2px 8px 14px;position:relative;border-bottom:1px solid #2e291e}
#hudmenu .hm-h::before{content:'';position:absolute;left:0;top:4px;bottom:10px;width:6px;background:repeating-linear-gradient(-45deg,#d9a441 0 5px,#16130d 5px 10px)}
#hudmenu .hm-h b{font:900 17px system-ui,sans-serif;letter-spacing:.24em;color:var(--ui-och,#d9a441)}
#hudmenu .hm-x{width:36px;height:36px;border-radius:50%;border:1px solid #57492c;background:linear-gradient(180deg,#2a251b,#15120c);position:relative}
#hudmenu .hm-x::before{content:'✕';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:900 15px system-ui,sans-serif;color:#efe6cf}
#hudmenu .hm-list{display:flex;flex-direction:column;gap:5px}
#hudmenu .hm-row{display:flex;align-items:center;gap:10px;padding:5px 8px 5px 5px;min-height:46px;background:linear-gradient(90deg,#2a251b,#17140e);border:1px solid #3a3322;border-left:3px solid #8a6420;cursor:pointer}
#hudmenu .hm-row:active{background:linear-gradient(90deg,#3a3322,#211d14)}
#hudmenu .hm-row>button{position:static!important;inset:auto!important;transform:none!important;flex:none;width:38px!important;height:38px!important;min-width:0!important;padding:0!important;margin:0!important;display:flex!important;align-items:center;justify-content:center;border-radius:3px!important;border:1px solid #57492c!important;background:radial-gradient(circle at 50% 40%,#2c281e,#0e0d09 75%)!important;box-shadow:none!important;font-size:18px!important;color:#d9c9a0!important;overflow:visible;opacity:1!important;visibility:visible!important}
#hudmenu .hm-row>button img{width:26px!important;height:26px!important}
#hudmenu .hm-row>button .ico{width:26px!important;height:26px!important;font-size:18px!important;line-height:26px}
#hudmenu .hm-t{display:flex;flex-direction:column;min-width:0}
#hudmenu .hm-t b{font:800 13px system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#efe6cf}
#hudmenu .hm-t small{font:600 11px system-ui,sans-serif;color:var(--ui-mut,#9b927b)}
/* « En ligne » : la pastille d'état garde son texte (En ligne / Hors ligne / Groupe) */
#hudmenu .hm-row[data-for=btn-mp]>button{width:auto!important;min-width:38px!important;padding:0 8px!important;gap:6px;font:800 11px system-ui,sans-serif!important;white-space:nowrap}
#hudmenu .hm-row[data-for=btn-amenage]>button{width:38px!important;font-size:0!important}#hudmenu .hm-row[data-for=btn-amenage]>button span:not(.ico){display:none}
#hudmenu .hm-row[data-for=btn-chat]>button .cnt{top:-6px!important;right:-6px!important}
/* ===================== calepin 6 (104) : écran de mort refait (« trop basique ») =====================
   vignette rouge + bruit de signal, bande de danger, titre qui « grésille » (robot hors-service), tracé d'électrocardiogramme qui s'aplatit,
   bilan dans une plaque, bouton métal ocre. Mêmes id qu'avant (#death, #death-sub, #death-btn). */
#death{background:radial-gradient(ellipse at 50% 50%,rgba(40,6,4,.55) 0,rgba(8,2,2,.94) 70%)!important;gap:10px!important;overflow:hidden;animation:dt-in .9s ease-out}
@keyframes dt-in{from{background-color:rgba(160,20,10,.6);opacity:.2}to{opacity:1}}
#death::before{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px);mix-blend-mode:overlay;animation:dt-scan 7s linear infinite}
@keyframes dt-scan{to{background-position:0 300px}}
#death::after{content:'';position:absolute;left:-10%;right:-10%;top:calc(50% - 58px);height:30px;transform:rotate(-3deg);pointer-events:none;opacity:.22;background:repeating-linear-gradient(-45deg,#b5452a 0 18px,#120807 18px 36px)}
#death .dt-sig{position:relative;z-index:1;font:800 11px system-ui,sans-serif;letter-spacing:.42em;color:#d9a441;text-transform:uppercase;opacity:.85;animation:dt-blink 1.2s steps(2) infinite}
@keyframes dt-blink{50%{opacity:.25}}
#death h2{position:relative;z-index:1;font:900 clamp(34px,calc(11 * var(--vh, 1vh)),66px)/1 system-ui,sans-serif!important;letter-spacing:.14em!important;color:#e0583a!important;text-shadow:0 0 18px rgba(224,88,58,.55),3px 3px 0 #000!important;animation:dt-glitch 2.6s infinite}
@keyframes dt-glitch{0%,86%,100%{text-shadow:0 0 18px rgba(224,88,58,.55),3px 3px 0 #000;transform:none}88%{text-shadow:-4px 0 #3ad0e0,4px 0 #e03a3a,3px 3px 0 #000;transform:translateX(3px) skewX(-6deg)}90%{text-shadow:4px 0 #3ad0e0,-4px 0 #e03a3a;transform:translateX(-4px)}92%{transform:none}}
#death .dt-ecg{position:relative;z-index:1;width:min(560px,80vw);height:44px;margin:-2px 0 0}
#death .dt-ecg path{fill:none;stroke:#e0583a;stroke-width:2.5;stroke-linejoin:round;filter:drop-shadow(0 0 4px rgba(224,88,58,.8));stroke-dasharray:900;stroke-dashoffset:900;animation:dt-ecg 2.2s ease-out .2s forwards}
@keyframes dt-ecg{to{stroke-dashoffset:0}}
#death p{position:relative;z-index:1;max-width:min(620px,86vw)!important;padding:8px 16px;background:linear-gradient(180deg,rgba(20,16,12,.85),rgba(12,10,8,.85));border:1px solid #3a3022;border-left:3px solid #b5452a;font:600 clamp(12px,calc(3.6 * var(--vh, 1vh)),15px)/1.45 system-ui,sans-serif!important;opacity:1!important;color:#e7ded0}
#death button{position:relative;z-index:1;margin-top:4px!important;padding:12px 30px!important;font:900 clamp(13px,calc(4 * var(--vh, 1vh)),17px) system-ui,sans-serif!important;letter-spacing:.14em;text-transform:uppercase;color:#1b1306!important;background:linear-gradient(180deg,#e0ad4c,#9a6c22)!important;border:1px solid #f2c870!important;border-bottom-color:#4a3410!important;border-radius:2px!important;box-shadow:0 3px 0 #050504,0 0 24px rgba(217,164,65,.25)!important;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
/* ===================== calepin 6 (101) : joystick et boutons d'action « plus originaux, sans perdre l'UX » =====================
   Mêmes tailles et mêmes positions (zones de toucher inchangées) : seul l'habillage change.
   Joystick = bague d'acier crantée (8 repères) + anneau de danger qui s'allume quand on pousse ; manette = caoutchouc strié, pastille ocre.
   Boutons = plaques rondes à lunette crantée (comme un bouchon de réservoir), icône dans un puits sombre ; bouton principal = lunette ocre
   et segments de danger qui tournent pendant le tir. */
#stick-base{border:0!important;background:radial-gradient(circle,rgba(16,14,11,.32) 0 55%,rgba(150,142,120,.6) 56% 58%,rgba(24,22,18,.78) 59% 70%,rgba(150,142,120,.55) 71% 73%,transparent 74%)!important;opacity:.7!important}
#stick-base::before{content:'';position:absolute;inset:0;border-radius:50%;background:repeating-conic-gradient(from -5deg,rgba(217,164,65,.85) 0 10deg,transparent 10deg 45deg);-webkit-mask:radial-gradient(circle,transparent 60%,#000 61% 68%,transparent 69%);mask:radial-gradient(circle,transparent 60%,#000 61% 68%,transparent 69%)}
#stick-base::after{content:'';position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,transparent 0 44%,rgba(217,164,65,.0) 45%);box-shadow:inset 0 0 0 1px rgba(217,164,65,.15)}
body.stick-on #stick-base{opacity:1!important;filter:drop-shadow(0 0 8px rgba(217,164,65,.35))}
#stick-knob{border:0!important;background:
  radial-gradient(circle,#d9a441 0 9%,#7a5418 10% 13%,transparent 14%),
  repeating-conic-gradient(rgba(0,0,0,.22) 0 6deg,transparent 6deg 12deg),
  radial-gradient(circle at 38% 30%,#6e6a5e,#2c2a24 62%,#141310 100%)!important;
  box-shadow:0 0 0 2px #0c0b09,0 0 0 4px rgba(150,142,120,.55),0 6px 12px rgba(0,0,0,.6)!important}
.abtn,#btn-act{border:0!important;background:
  radial-gradient(circle at 50% 42%,rgba(46,42,34,.95) 0 54%,transparent 55%),
  repeating-conic-gradient(#6d675a 0 7deg,#3a3730 7deg 15deg),
  radial-gradient(circle,#57524a,#24221d)!important;
  box-shadow:0 0 0 2px rgba(10,9,7,.9),0 4px 10px rgba(0,0,0,.6),inset 0 2px 0 rgba(255,240,210,.12)!important}
.abtn::after,#btn-act::after{content:'';position:absolute;inset:16%;border-radius:50%;box-shadow:inset 0 3px 6px rgba(0,0,0,.75),inset 0 -1px 0 rgba(255,240,210,.08);pointer-events:none}
#btn-punch,#btn-fire{background:
  radial-gradient(circle at 50% 42%,rgba(46,40,28,.96) 0 56%,transparent 57%),
  repeating-conic-gradient(#d9a441 0 10deg,#5a3e12 10deg 20deg),
  radial-gradient(circle,#8a6420,#3a2a0c)!important;box-shadow:0 0 0 2px rgba(10,9,7,.9),0 0 18px rgba(217,164,65,.25),0 4px 10px rgba(0,0,0,.6)!important}
#btn-fire.busy{animation:hb-spin .6s linear infinite;filter:brightness(1.25)}
@keyframes hb-spin{to{background-position:0 0,0 0,0 0}}
#btn-act.on{background:
  radial-gradient(circle at 50% 42%,rgba(46,40,28,.96) 0 54%,transparent 55%),
  repeating-conic-gradient(#d9a441 0 7deg,#6a4a16 7deg 15deg),radial-gradient(circle,#8a6420,#3a2a0c)!important}
.abtn .ico,#btn-act .ico{position:relative;z-index:1}
body.in-raid #hudmenu{display:none!important}
/* ===================== calepin 6 (104) : crochetage refait — gros plan plein écran, panneau latéral ===================== */
#lockpick{background:radial-gradient(ellipse at 38% 50%,rgba(18,14,10,.82) 0,rgba(0,0,0,.96) 72%)!important;gap:clamp(12px,4vw,40px);padding:0 calc(env(safe-area-inset-right,0px) + 16px) 0 calc(env(safe-area-inset-left,0px) + 16px)}
#lockpick .lp-stage{position:relative;flex:none}
#lockpick canvas{width:min(calc(92 * var(--vh, 1vh)),58vw,460px)!important;height:min(calc(92 * var(--vh, 1vh)),58vw,460px)!important;filter:drop-shadow(0 16px 30px rgba(0,0,0,.8))}
#lockpick.snap canvas{animation:lp-snap .35s}
@keyframes lp-snap{20%{transform:translate(6px,-3px) rotate(1deg)}50%{transform:translate(-5px,2px)}80%{transform:translate(2px,1px)}}
#lockpick .lp-side{display:flex;flex-direction:column;align-items:stretch;gap:9px;width:min(250px,34vw)}
#lockpick .lp-title{font:900 18px system-ui,sans-serif!important;letter-spacing:.3em!important;color:#d9a441!important;padding-left:14px;position:relative}
#lockpick .lp-title::before{content:'';position:absolute;left:0;top:2px;bottom:2px;width:6px;background:repeating-linear-gradient(-45deg,#d9a441 0 5px,#16130d 5px 10px)}
#lockpick .lp-picks{display:flex;align-items:center;gap:6px;padding:6px 8px;background:rgba(14,12,9,.8);border:1px solid #3a3022}
#lockpick .lp-pk{width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:22px;border:1px solid #4a3e28;background:radial-gradient(circle,#2a251c,#0e0c09)}
#lockpick .lp-pk img{width:92%;height:92%}#lockpick .lp-pk.off{opacity:.18;filter:grayscale(1)}
#lockpick .lp-pn{margin-left:auto;font:800 13px system-ui,sans-serif;color:#efe6cf}
#lockpick .lp-hint{font:600 12px/1.35 system-ui,sans-serif!important;color:#b9b09a!important}
#lockpick button{font:800 12px system-ui,sans-serif!important;letter-spacing:.08em;text-transform:uppercase;color:#efe6cf!important;background:linear-gradient(180deg,#3a3426,#211d14)!important;border:1px solid #57492c!important;border-bottom-color:#0e0c08!important;border-radius:2px!important;padding:10px 12px!important;display:flex;align-items:center;justify-content:center;gap:6px}
#lockpick .lp-turn{min-height:64px;font-size:16px!important;letter-spacing:.24em;color:#1b1306!important;background:linear-gradient(180deg,#e0ad4c,#9a6c22)!important;border-color:#f2c870!important;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
#lockpick .lp-turn.on{filter:brightness(1.2);transform:translateY(1px)}
#lockpick .lp-row{display:flex;gap:8px}#lockpick .lp-row button{flex:1}
#lockpick .lp-key .ic{width:20px;height:20px}#lockpick .lp-key .ic img{width:100%;height:100%}
/* calepin 6 (98) : icônes à la place des emojis */
.kc-go .ic{width:20px;height:20px;display:inline-flex;margin-right:6px;vertical-align:middle;font-size:16px}.kc-go .ic img,.kc-ai img{width:100%;height:100%;object-fit:contain}
#mp .lb-r{font-weight:900}#mp li.top1 .lb-r{color:#f2c870;text-shadow:0 0 8px rgba(242,200,112,.5)}#mp li.top2 .lb-r{color:#d6d6cc}#mp li.top3 .lb-r{color:#c98a5a}
.kc-rec .kc-ing{display:flex;flex-wrap:wrap;gap:2px;width:64px}.kc-rec .kc-ing .ic{width:26px;height:26px;font-size:18px}.kc-rec .kc-ing .ic img{width:100%;height:100%;object-fit:contain}
#mp .st-lead,#mp-bar .st-lead{color:#f2c870;font-style:normal;text-shadow:0 0 6px rgba(242,200,112,.6)}#mp .st-ok,#mp-bar .st-ok{color:#7bd36a;font-style:normal;font-weight:900}#mp .st-wait,#mp-bar .st-wait{color:#9b927b;font-style:normal}
/* calepin 6 (cycle 1) : le bandeau du groupe passe sous les besoins (il les touchait) ; les messages descendent sous le bandeau quand il est là */
#mp-bar{top:calc(env(safe-area-inset-top,0px) + 66px)!important}
body:has(#mp-bar.on) #toast{top:calc(env(safe-area-inset-top,0px) + 118px)!important}
@media (max-width:760px){body.in-raid #toast{top:calc(env(safe-area-inset-top,0px) + 112px)!important}}   /* calepin 6 (cycle 2) : en petit écran, le message du raid passait sur « Extraction la plus proche » */
#stash #st-side .slot b i{font-style:normal;font-size:10px;opacity:.85}
/* Paramètres : rapport technique (écran noir sur certains téléphones, 03/11) */
#settings .set-rep { margin: 4px 0 8px; padding: 8px 10px; max-height: 150px; overflow: auto; background: rgba(0,0,0,.35); border: 1px solid rgba(201,162,74,.25); color: #b9b3a3; font: 10px/1.45 ui-monospace, Menlo, Consolas, monospace; white-space: pre-wrap; word-break: break-word; user-select: text; -webkit-user-select: text; }
#settings #set-gfx-on { margin: 2px 0 6px; }
/* armoire en 2 colonnes : jamais plus haute que l'écran (640×360 : dépassait de 2 px en haut et en bas) */
#stash .st-box.st-2col{max-height:calc(var(--vh,1vh)*100 - 16px)!important;box-sizing:border-box;overflow:hidden}

/* échange entre amis (lot V) */
#swap{position:fixed;inset:0;z-index:13;display:none;align-items:center;justify-content:center}#swap.on{display:flex}
#swap .st-box{width:min(640px,96vw);max-height:calc(calc(100 * var(--vh, 1vh)) - 12px)}
#swap .sw-body{display:flex;flex-direction:column;gap:6px;padding:8px 12px 10px;overflow-y:auto;min-height:0;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
#swap .sw-msg{margin:10px 0;font-size:15px;text-align:center}#swap .sw-msg b{color:#f0d9a0}
#swap .sw-cols{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#swap .sw-col{display:flex;flex-direction:column;gap:3px;padding:6px;min-height:64px;background:rgba(255,255,255,.03);border:1px solid rgba(214,208,190,.18);border-radius:6px}
#swap .sw-ch{display:flex;justify-content:space-between;align-items:center;gap:6px;font:800 11px system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase}
#swap .sw-ok{font-size:9px;padding:2px 6px;border-radius:9px;background:rgba(255,255,255,.07);opacity:.75}#swap .sw-ok.on{background:#3d6b32;color:#d8f5c8;opacity:1}
#swap .sw-it{display:flex;align-items:center;gap:6px;min-height:30px;font-size:12px}#swap .sw-it .st-ico{width:26px;height:26px;flex:0 0 26px;display:flex;align-items:center;justify-content:center;font-size:18px}
#swap .sw-it .st-ico img{width:100%;height:100%;object-fit:contain}
#swap .sw-nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#swap .sw-nm i{font-style:normal;font-size:10px;opacity:.7}#swap .sw-q{font-weight:800;opacity:.9}
#swap .sw-cr b{color:#f0c840;font:800 13px system-ui,sans-serif;padding-left:4px}
#swap .sw-m{min-width:36px;padding:6px 8px;font:800 12px/1 system-ui,sans-serif;color:#efe6cf;background:linear-gradient(180deg,#4a463c,#2c2a24);border:1px solid rgba(214,208,190,.35);border-radius:5px}
#swap .sw-none{margin:4px 0;font-size:11px;opacity:.6}#swap .sw-add{border-top:1px solid rgba(214,208,190,.15);padding-top:4px}
#swap .sw-crin{display:flex;align-items:center;gap:6px;margin-top:4px}#swap .sw-crin label{display:flex;align-items:center;gap:6px;flex:1;font-size:12px}#swap .sw-crin small{opacity:.6}
#swap .sw-crin input{width:110px;padding:5px 6px;background:#14120e;color:#efe6cf;border:1px solid rgba(214,208,190,.35);border-radius:5px}
#swap .sw-foot{margin-top:4px}#swap .sw-foot button{flex:1 1 auto;min-width:110px}#swap .sw-hint{margin:0;font-size:11px;opacity:.6;text-align:center}#swap .err{color:#ff8a7a;font-size:12px;margin:2px 0}
#swap .pc-acts{display:flex;flex-wrap:wrap;gap:6px}#swap .pc-acts button{flex:1 1 auto;min-width:110px}#swap .pc-sub{margin:4px 0 2px;font:800 10px system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;opacity:.6}
@media (max-height:420px){#swap .sw-it{min-height:26px}#swap .sw-body{gap:4px;padding:6px 10px}}
/* icônes ChatGPT de la planche 11 (06/11) : badge du raid, prime du portail, titre du crochetage */
#badgehud.on{display:flex;align-items:center;gap:5px}#badgehud .ic{width:20px;height:20px;margin:0;flex:none}#badgehud .ic img{width:100%;height:100%;object-fit:contain}
#dp-bounty .ic{width:22px;height:22px;margin:0 4px 0 2px;vertical-align:middle}#dp-bounty .ic img{width:100%;height:100%;object-fit:contain}
#lockpick .lp-title{display:flex;align-items:center;gap:6px}#lockpick .lp-ic{width:26px;height:26px;margin:0;flex:none}#lockpick .lp-ic img{width:100%;height:100%;object-fit:contain}
/* ---- raid à vagues (lot W1) : chrono de l'extraction en haut au centre + bandeau d'ouverture / fermeture / horde */
#wavehud{display:none;flex-direction:column;align-items:flex-start;gap:1px;margin-bottom:3px;padding:3px 10px 4px;background:rgba(8,8,7,.8);border:1px solid rgba(160,150,120,.45);border-radius:8px;color:#d6d0c0;font:800 13px system-ui,sans-serif;pointer-events:none;white-space:nowrap}
body.in-raid #wavehud.on{display:flex}
#wavehud span{font:600 10px system-ui,sans-serif;color:#9a937f;letter-spacing:.04em}
#wavehud.open{border-color:rgba(120,235,150,.85);color:#9cf0b0}
#wavehud.horde{border-color:rgba(232,80,74,.9);color:#f08a80}
#wavebanner{position:fixed;left:0;right:0;margin:0 auto;width:max-content;top:24%;z-index:40;display:none;flex-direction:column;align-items:center;gap:2px;padding:12px 30px 10px;background:rgba(8,8,7,.9);border:2px solid #9cf0b0;clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px),0 12px);color:#d6d0c0;font:700 12px system-ui,sans-serif;text-align:center;pointer-events:none;max-width:86vw}
#wavebanner.on{display:flex;animation:ui-in .25s ease-out}
#wavebanner small{font:900 11px system-ui,sans-serif;letter-spacing:.3em;color:#8a8470}
#wavebanner b{font:900 clamp(20px,3.6vw,30px)/1.05 system-ui,sans-serif;white-space:nowrap;color:#9cf0b0;text-shadow:0 3px 0 #000}
#wavebanner em{font-style:normal;font-weight:700;color:#cfc8b6}
#wavebanner.shut{border-color:#b8b09a}#wavebanner.shut b{color:#d6d0c0}
#wavebanner.horde{border-color:#e8504a}#wavebanner.horde b{color:#f08a80}
body.in-raid #objective:empty{display:none}
/* lot W2 : kit gratuit + rappel de ce qu'on risque, dans la fenêtre du portail */
.dp-kit{display:flex;align-items:center;gap:8px;margin:0 0 6px;padding:6px 10px;border:1px solid rgba(120,200,140,.35);border-radius:9px;background:rgba(18,34,22,.6);font:700 12px system-ui,sans-serif;color:#cfe8d0;text-align:left}
.dp-kit input{width:18px;height:18px;accent-color:#7fcf7a;flex:none}.dp-kit:has(input:disabled){opacity:.6}
.dp-risk{margin:0 0 10px;font:600 11px system-ui,sans-serif;color:#d9a07a;text-align:center;line-height:1.3}
/* lot X1 : niveau d'amélioration T d'un exemplaire (armoire, établi) */
.st-up{font-style:normal;font-weight:900;color:#e6c46a;letter-spacing:.04em}
#armory .ar-up{display:flex;flex-direction:column;gap:4px;padding:10px 12px;background:rgba(8,8,7,.82);border:1px solid rgba(217,180,90,.45);border-radius:10px;color:#d6d0c0;font:600 11px system-ui,sans-serif;max-width:230px}
#armory .ar-up small{letter-spacing:.2em;text-transform:uppercase;color:#8a8470;font-weight:800}#armory .ar-up>b{font:900 34px/1 system-ui,sans-serif;color:#e6c46a}
#armory .ar-up p{margin:0}#armory .ar-up em.ok{font-style:normal;color:#9cf0b0;font-weight:800}
#armory .ar-steps{display:flex;gap:3px}#armory .ar-steps i{flex:1;min-width:14px;height:16px;border-radius:3px;background:#2a2722;color:#7a7462;font:800 9px/16px system-ui,sans-serif;text-align:center;font-style:normal}
#armory .ar-steps i.on{background:#c9a14a;color:#1a1608}#armory .ar-steps i.mk{outline:1px solid #9cf0b0}
#armory .ar-mat{display:flex;align-items:center;gap:8px;padding:5px 8px;margin:3px 0;background:rgba(255,255,255,.04);border-radius:7px;font:700 12px system-ui,sans-serif;color:#d6d0c0}
#armory .ar-mat .ic{width:22px;height:22px;flex:none}#armory .ar-mat .ic img{width:100%;height:100%;object-fit:contain}#armory .ar-mat b{margin-left:auto;color:#9cf0b0}#armory .ar-mat.lack b{color:#e87a6a}
#armory .ar-upgo{width:100%;margin-top:8px;padding:9px;border:0;border-radius:8px;background:linear-gradient(#e0b85a,#b08a3c);color:#1a1608;font:900 13px system-ui,sans-serif;letter-spacing:.04em}
#armory .ar-upgo:disabled{filter:grayscale(1) brightness(.55)}
/* icônes nommées dans les textes (planches 12-14, 06/11) : ix(nom) dans icons.js */
.ix{display:inline-flex;width:1.45em;height:1.45em;vertical-align:-.38em;margin-right:5px;flex:none}.ix img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 1px 1px rgba(0,0,0,.6))}
.dp-hd,.dp-vrow{display:flex;align-items:center;justify-content:center;gap:4px}.dp-hd .ix{width:26px;height:26px}.dp-vrow .ix{width:28px;height:28px}
#foodhud .ix{width:22px;height:22px;margin:0}
.lb-r .ix{width:18px;height:18px;margin-right:2px}.mb-p .st-lead .ix,.mp-pl .st-lead .ix{width:16px;height:16px;margin:0;vertical-align:-3px}
.be-bot button .ix,.be-top button .ix{width:18px;height:18px}
.kc-ai{display:inline-flex;width:34px;height:34px;flex:none}.kc-ai img{width:100%;height:100%;object-fit:contain}.kc-rec .bu-n .ix{width:18px;height:18px}
#mp .lb-r{display:inline-flex;align-items:center;justify-content:center;width:auto;min-width:36px;white-space:nowrap}
.st-h b .ix{width:26px;height:26px;vertical-align:-6px;margin-right:8px}
/* Écrans illustrés (images Higgsfield du 06/11) : titre / chargement, transitions, mort, extraction */
.overlay.title-bg{background:linear-gradient(180deg,rgba(6,5,4,.25) 0,rgba(6,5,4,.55) 55%,rgba(6,5,4,.92) 100%),url(ecrans/titre.webp) center/cover no-repeat,#0b0a08!important}
.logo-h{margin:0!important;line-height:0}.logo-h img{width:min(64vw,calc(62 * var(--vh, 1vh) * 1.5),560px);height:auto;filter:drop-shadow(0 6px 10px rgba(0,0,0,.7))}
#start.title-bg .logo-h img{width:min(56vw,calc(52 * var(--vh, 1vh) * 1.5),500px)}
.overlay .studio{position:absolute;right:calc(env(safe-area-inset-right,0px) + 14px);bottom:calc(env(safe-area-inset-bottom,0px) + 10px);width:clamp(70px,13vw,120px);opacity:.85}
#warp[data-k]{background-size:cover;background-position:center;background-repeat:no-repeat;transition:opacity .2s}
#warp[data-k=raid]{background-image:linear-gradient(rgba(0,0,0,.15),rgba(0,0,0,.45)),url(ecrans/raid.webp)}
#warp[data-k=bunker]{background-image:linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.4)),url(ecrans/bunker.webp)}
#warp[data-k=cell]{background-image:linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.4)),url(ecrans/cellule.webp)}
#warp[data-k=extract]{background-image:linear-gradient(rgba(0,0,0,.05),rgba(0,0,0,.35)),url(ecrans/extraction.webp)}
#death{background:radial-gradient(ellipse at 50% 50%,rgba(40,6,4,.45) 0,rgba(8,2,2,.9) 72%),url(ecrans/mort.webp) center/cover no-repeat!important}
/* Tableau des primes (06/11) */
#bboard{position:fixed;inset:0;z-index:30;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.6)}#bboard.on{display:flex}
.bb-wall{position:relative;width:min(96vw,980px);max-height:calc(94 * var(--vh, 1vh));display:flex;flex-direction:column;background:url(primes/tableau.webp) center/cover,#2a2016;border:2px solid #1a1410;box-shadow:0 10px 40px rgba(0,0,0,.8);padding:10px 14px 14px;overflow:hidden}
.bb-h{display:flex;align-items:center;gap:10px;padding:2px 2px 8px}.bb-h b{font:900 clamp(14px,2.4vw,20px)/1 system-ui,sans-serif;letter-spacing:.14em;color:#f0d08a;text-shadow:0 2px 0 #000,0 0 10px rgba(0,0,0,.8)}
.bb-s{flex:1;font:700 12px system-ui,sans-serif;color:#efe4c8;text-shadow:0 1px 2px #000}
.bb-x{font-size:0!important;width:36px;height:36px;border-radius:50%;border:2px solid rgba(240,208,138,.6);background:rgba(20,16,12,.85);color:#f0d08a;position:relative}.bb-x::before{content:'✕';font:900 16px system-ui;position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.bb-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(6px,1.4vw,14px);min-height:0}
.bb-card{position:relative;aspect-ratio:360/546;max-height:calc(38 * var(--vh, 1vh));justify-self:center;transform:rotate(-1.2deg);filter:drop-shadow(0 4px 6px rgba(0,0,0,.7))}.bb-card:nth-child(even){transform:rotate(1.4deg)}
.bb-card img{width:100%;height:100%;object-fit:contain;display:block}
.bb-n{position:absolute;left:10%;right:10%;top:3.5%;height:9%;display:flex;align-items:center;justify-content:center;text-align:center;font:900 clamp(8px,1.35vw,13px)/1 Georgia,serif;color:#3a2412;text-transform:uppercase;letter-spacing:.02em}
.bb-r{position:absolute;left:10%;right:10%;bottom:4%;height:9%;display:flex;align-items:center;justify-content:center;text-align:center;font:800 clamp(7px,1.1vw,11px)/1.05 Georgia,serif;color:#5a2a14}
.bb-card.lock{filter:grayscale(.85) brightness(.55) drop-shadow(0 4px 6px rgba(0,0,0,.7))}.bb-card.cur{outline:3px solid #f0c860;outline-offset:2px}
.bb-st{position:absolute;left:8%;right:8%;top:42%;text-align:center;transform:rotate(-14deg);font:900 clamp(12px,2.4vw,24px)/1 system-ui,sans-serif;letter-spacing:.12em;color:rgba(170,30,20,.85);border:3px solid rgba(170,30,20,.85);padding:4px 0;font-style:normal}
#dp-bic .dp-poster{width:26px;height:40px;object-fit:cover;border-radius:2px;cursor:zoom-in}#dp-bounty .ic#dp-bic{width:28px;height:42px}
/* Cadres de rareté illustrés (Higgsfield du 08/11) : armoire (lignes + emplacements équipés). Le cadre a un fond sombre plein : il remplace le fond de l'icône (jamais par-dessus) ; l'icône rétrécit pour rester dans le cadre. Établi : icônes trop petites (24 px), cadre non utilisé. */
.st-row .st-ico[data-r="0"],#st-list .st-eq .slot .si[data-r="0"],#stash #st-side .slot .si[data-r="0"]{background:url(icons/cadre-0.webp) center/100% 100% no-repeat!important}
.st-row .st-ico[data-r="1"],#st-list .st-eq .slot .si[data-r="1"],#stash #st-side .slot .si[data-r="1"]{background:url(icons/cadre-1.webp) center/100% 100% no-repeat!important}
.st-row .st-ico[data-r="2"],#st-list .st-eq .slot .si[data-r="2"],#stash #st-side .slot .si[data-r="2"]{background:url(icons/cadre-2.webp) center/100% 100% no-repeat!important}
.st-row .st-ico[data-r="3"],#st-list .st-eq .slot .si[data-r="3"],#stash #st-side .slot .si[data-r="3"]{background:url(icons/cadre-3.webp) center/100% 100% no-repeat!important}
.st-row .st-ico[data-r="4"],#st-list .st-eq .slot .si[data-r="4"],#stash #st-side .slot .si[data-r="4"]{background:url(icons/cadre-4.webp) center/100% 100% no-repeat!important}
.st-row .st-ico[data-r="5"],#st-list .st-eq .slot .si[data-r="5"],#stash #st-side .slot .si[data-r="5"]{background:url(icons/cadre-5.webp) center/100% 100% no-repeat!important}
.st-row .st-ico[data-r="inf"],#st-list .st-eq .slot .si[data-r="inf"],#stash #st-side .slot .si[data-r="inf"]{background:url(icons/cadre-inf.webp) center/100% 100% no-repeat!important}
.st-row .st-ico[data-r]{box-shadow:0 0 10px color-mix(in srgb,var(--rar,#000) 30%,transparent)!important}.st-row .st-ico[data-r] img{width:66%!important;height:66%!important}#st-list .st-eq .slot .si[data-r] img,#stash #st-side .slot .si[data-r] img{width:68%!important;height:68%!important;object-fit:contain}#stash #st-side .slot .si[data-r]{width:34px;height:34px;display:flex;align-items:center;justify-content:center}
