/* ═══════════════════════════════════════════════════════════
   SoulsGuides — Elden Ring · Planificador «La Panoplia»
   ═══════════════════════════════════════════════════════════
   Piel Muro del planificador (hermana de Enotria/Wukong/Lies of P):
   barra de mando + panoplia de slots (seis armas —tres por mano—
   con infusión y forja por slot +
   4 piezas de armadura + 4 talismanes) + panel pegajoso con AR real,
   escalado, requisitos, defensas, resistencias, carga de equipo y
   coste de runas + modal selector.
   El tema oro llega de .page-eldenring.muro (eldenring.css), que
   remapea --crim/--amber a oro. Requiere: muro-base.css + muro-fx.js.
   ═══════════════════════════════════════════════════════════ */

/* Tokens de daño elemental locales (no existen en muro-base) */
body.muro .panoplia,
body.muro .drawer{
  --fx-magic:#5aa0d8;
  --fx-fire:#d4703a;
  --fx-lght:#e8c94a;
  --fx-holy:#e8d9a0;
}

/* ══════════ BARRA DE MANDO (extensiones sobre .command) ══════════ */
.cmd-name{display:flex;align-items:center;gap:10px;flex:1;min-width:220px;max-width:380px}
.cmd-name svg{color:var(--crim-d);flex:none}
.cmd-name input{width:100%;background:rgba(var(--bg3-rgb),.5);border:1px solid rgba(var(--crim-rgb),.2);color:var(--muro-white);
  font-family:var(--ff-muro);font-size:13px;font-weight:600;letter-spacing:.05em;padding:10px 13px;outline:none;transition:border-color .3s,box-shadow .3s}
.cmd-name input:focus{border-color:rgba(var(--crim-rgb),.55);box-shadow:0 0 22px rgba(var(--crim-rgb),.14)}
.cmd-act{margin-left:auto;display:flex;gap:9px}
.cbtn{font-family:var(--ff-muro);font-size:9.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;padding:11px 16px;cursor:pointer;transition:all .3s;background:transparent}
.cbtn.ghost{color:var(--muro-text);border:1px solid rgba(var(--muro-text-rgb),.24)}
.cbtn.ghost:hover{color:var(--muro-white);border-color:var(--crim)}
.cbtn.solid{color:var(--muro-white);background:rgba(var(--crim-rgb),.18);border:1px solid var(--crim)}
.cbtn.solid:hover{background:rgba(var(--crim-rgb),.34);box-shadow:0 0 20px rgba(var(--crim-rgb),.35)}

/* ══════════ PANOPLIA (layout principal) ══════════ */
.panoplia{width:min(1420px,100% - clamp(2.5rem,10vw,10rem));margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) 392px;gap:26px;padding:34px 0 90px;align-items:start}
.doll-grid{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:22px;align-items:start}
.doll-col{display:flex;flex-direction:column;gap:11px}
.col-h{display:flex;align-items:center;gap:9px;font-size:9px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:var(--muro-text);margin-bottom:2px;width:100%}
.col-h::before{content:'';width:6px;height:6px;background:var(--crim);transform:rotate(45deg);flex:none}
.col-h::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(var(--crim-rgb),.3),transparent)}
.col-cnt{flex:none;font-size:8px;font-weight:700;letter-spacing:.14em;color:var(--amber-l);border:1px solid rgba(var(--amber-rgb),.4);padding:3px 8px}
/* subcabecera de mano (armamento: derecha / izquierda) */
.hand-h{font-size:8px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--muro-text);margin:4px 0 -3px;padding-left:2px}
.hand-h:first-of-type{margin-top:0}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.armed-h .armed-dot{width:6px;height:6px;transform:rotate(45deg);border:1px solid rgba(var(--muro-text-rgb),.4);flex:none;transition:all .4s var(--muro-ease)}
.doll.armed .armed-h .armed-dot{background:var(--amber-l);border-color:var(--amber);box-shadow:0 0 10px rgba(var(--amber-l-rgb),.9);animation:bldDotPulse 2.4s var(--muro-ease) infinite}
@keyframes bldDotPulse{0%,100%{box-shadow:0 0 6px rgba(var(--amber-l-rgb),.4)}50%{box-shadow:0 0 15px rgba(var(--amber-l-rgb),1)}}
@keyframes bldSlotPop{0%{box-shadow:0 0 0 rgba(var(--amber-rgb),0)}35%{box-shadow:0 0 22px rgba(var(--amber-rgb),.5);border-color:var(--amber-l)}100%{box-shadow:0 0 0 rgba(var(--amber-rgb),0)}}
.slot.pop{animation:bldSlotPop .6s var(--muro-ease)}

/* ── slots ── */
.slot{position:relative;width:100%;display:grid;grid-template-columns:44px 1fr auto;gap:13px;align-items:center;text-align:left;font-family:var(--ff-muro);
  border:1px solid rgba(var(--muro-text-rgb),.16);background:linear-gradient(90deg,rgba(var(--bg2-rgb),.6),rgba(var(--bg-rgb),.3));padding:13px 15px;cursor:pointer;transition:border-color .3s,background .3s,transform .3s var(--muro-ease)}
.slot:hover{border-color:rgba(var(--crim-rgb),.5);background:rgba(var(--crim-rgb),.07);transform:translateX(3px)}
.slot.filled{border-color:rgba(var(--amber-rgb),.35)}
.slot-ic{position:relative;width:38px;height:38px;display:grid;place-items:center}
.slot-ic::before{content:'';position:absolute;inset:2px;border:1px solid rgba(var(--muro-text-rgb),.3);transform:rotate(45deg);transition:all .3s}
.slot.filled .slot-ic::before{border-color:var(--amber);background:rgba(var(--amber-rgb),.1)}
.slot-ic i{position:relative;font-style:normal;font-family:var(--ff-muro-d);font-weight:700;font-size:14px;color:var(--muro-text-l)}
.slot.filled .slot-ic i{color:var(--amber-l)}
.slot-ic img{position:relative;width:30px;height:30px;object-fit:contain;filter:drop-shadow(0 0 6px rgba(var(--amber-rgb),.35))}
.slot-tx{min-width:0}
.slot-tx .lb{display:block;font-size:8.5px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--muro-text);margin-bottom:3px}
.slot-tx .vl{display:block;font-weight:700;font-size:13px;color:var(--muro-white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.slot-tx .vl.empty{color:var(--muro-text);font-weight:400;font-style:italic}
.slot-tx .st{display:block;font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:var(--amber-l);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.slot-go{font-size:8.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muro-text);border:1px solid rgba(var(--muro-text-rgb),.24);padding:6px 10px;white-space:nowrap;flex-shrink:0;transition:all .3s}
.slot:hover .slot-go{color:var(--muro-white);border-color:var(--crim)}
.slot.weapon{grid-template-columns:52px 1fr auto;padding:16px}
.slot.weapon .slot-ic{width:46px;height:46px}
.slot.weapon .slot-ic i{font-size:18px}
.slot.weapon .slot-ic img{width:38px;height:38px}
.slot.weapon .vl{font-size:15px}
.slot.weapon .slot-ic::before{border-color:rgba(var(--crim-rgb),.4)}
.slot.weapon.filled .slot-ic::before{border-color:var(--crim-l);background:rgba(var(--crim-rgb),.12)}

/* ══════════ PANEL (stats en vivo) ══════════ */
.panel{position:sticky;top:76px;border:1px solid rgba(var(--crim-rgb),.28);background:linear-gradient(180deg,rgba(var(--bg3-rgb),.55),rgba(var(--bg-rgb),.65));padding:22px 20px;max-height:calc(100svh - 88px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--crim-d) transparent}
.panel-h{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:2px}
.panel h2{font-family:var(--ff-muro-d);font-weight:700;font-size:16px;letter-spacing:.05em;color:var(--muro-white)}
.panel .plvl{font-size:9.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--amber-l)}
.panel .psub{font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--crim-l);margin-bottom:18px}
.psec{margin-bottom:18px}
.psec-h{display:flex;align-items:center;gap:9px;font-size:9px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--muro-text-l);margin-bottom:10px}
.psec-h::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(var(--muro-text-rgb),.25),transparent)}
.psec-h .cnt{color:var(--crim-l);letter-spacing:.1em}

/* ── AR total (destacado) ── */
.ar-total{display:flex;align-items:baseline;justify-content:space-between;gap:10px;border:1px solid rgba(var(--amber-rgb),.35);background:rgba(var(--amber-rgb),.06);padding:12px 15px;margin-bottom:16px}
.ar-total .art-l{font-size:9px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--muro-text-l)}
.ar-total .art-v{font-family:var(--ff-muro-d);font-weight:900;font-size:30px;line-height:1;color:var(--muro-white)}
@keyframes bldCoFlash{0%{color:var(--muro-text-l)}30%{color:var(--amber-l);text-shadow:0 0 14px rgba(var(--amber-l-rgb),.9)}100%{text-shadow:none}}
.ar-total .art-v.flash{animation:bldCoFlash .7s var(--muro-ease)}

/* ── constantes vitales del panel (PV · PC · Resistencia, espejo de la charbar) ── */
.numgrid.vitals{margin-bottom:16px}
.numgrid.vitals .num b{font-size:16px}

/* ── barras de daño del arma (5 tipos) ── */
.atk{display:flex;flex-direction:column;gap:7px}
.atk-row{display:grid;grid-template-columns:64px 1fr 46px;gap:10px;align-items:center}
.atk-row[hidden]{display:none}
.atk-row .al{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muro-text)}
.atk-row .av{font-family:var(--ff-muro-d);font-weight:700;font-size:12px;color:var(--muro-text-l);text-align:right}
.atk-row.live .av{color:var(--muro-white)}
.abar{height:6px;background:rgba(var(--muro-text-rgb),.12);overflow:hidden}
.abar i{display:block;height:100%;width:0;transition:width .55s var(--muro-ease)}
.abar.phys i{background:linear-gradient(90deg,var(--crim-d),var(--crim-l));box-shadow:0 0 8px rgba(var(--crim-rgb),.45)}
.abar.magic i{background:linear-gradient(90deg,color-mix(in srgb,var(--fx-magic) 55%,var(--bg)),var(--fx-magic));box-shadow:0 0 8px rgba(90,160,216,.4)}
.abar.fire i{background:linear-gradient(90deg,color-mix(in srgb,var(--fx-fire) 55%,var(--bg)),var(--fx-fire));box-shadow:0 0 8px rgba(212,112,58,.4)}
.abar.lght i{background:linear-gradient(90deg,color-mix(in srgb,var(--fx-lght) 55%,var(--bg)),var(--fx-lght));box-shadow:0 0 8px rgba(232,201,74,.4)}
.abar.holy i{background:linear-gradient(90deg,color-mix(in srgb,var(--fx-holy) 55%,var(--bg)),var(--fx-holy));box-shadow:0 0 8px rgba(232,217,160,.4)}
@keyframes bldNumFlash{0%{color:var(--muro-text-l)}30%{color:var(--amber-l);text-shadow:0 0 12px rgba(var(--amber-l-rgb),.95)}100%{text-shadow:none}}
.atk-row.flash .av{animation:bldNumFlash .8s var(--muro-ease)}
@keyframes bldCellFlash{0%{box-shadow:0 0 0 rgba(var(--amber-rgb),0)}30%{box-shadow:0 0 14px rgba(var(--amber-rgb),.6);border-color:rgba(var(--amber-rgb),.6)}100%{box-shadow:0 0 0 rgba(var(--amber-rgb),0)}}
.num.flash{animation:bldCellFlash .8s var(--muro-ease)}

/* ── rejillas numéricas (escalado, requisitos, defensas, resistencias) ── */
.numgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.numgrid.g2{grid-template-columns:repeat(2,1fr)}
.numgrid.g5{grid-template-columns:repeat(5,1fr)}
.num{border:1px solid rgba(var(--muro-text-rgb),.13);background:rgba(var(--bg-rgb),.4);padding:8px 5px;text-align:center;transition:border-color .3s}
.num.live{border-color:rgba(var(--amber-rgb),.3)}
.num.req-no{border-color:rgba(var(--crim-rgb),.5);background:rgba(var(--crim-rgb),.07)}
.num b{display:block;font-family:var(--ff-muro-d);font-weight:700;font-size:13px;color:var(--muro-white)}
.num.req-no b{color:var(--crim-l)}
.num span{font-size:7.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muro-text)}
.num em{font-style:normal;font-size:9px;font-weight:700;color:var(--amber-l);margin-left:2px}

/* ── atributos asignables (stepper: 8 stats en la charbar) ── */
.stat-list{display:flex;flex-direction:column;gap:8px}
.stat-row{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid rgba(var(--muro-text-rgb),.13);background:rgba(var(--bg-rgb),.4);padding:8px 11px;transition:border-color .3s,background .3s}
.stat-row.req-unmet{border-color:rgba(var(--crim-rgb),.45);background:rgba(var(--crim-rgb),.05)}
.stat-row .sr-lb{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muro-text-l)}
.stat-row .sr-lb .sr-req{font-size:8.5px;color:var(--muro-text);margin-left:5px;letter-spacing:.04em}
.stat-row.req-unmet .sr-lb .sr-req{color:var(--crim-l)}
.stat-row.req-unmet .sr-lb{color:var(--muro-white)}
.vr-step{display:flex;align-items:center;gap:0;flex:none}
.vr-btn{width:26px;height:26px;display:grid;place-items:center;font-family:var(--ff-muro-d);font-size:16px;font-weight:700;line-height:1;color:var(--muro-text-l);background:rgba(var(--bg3-rgb),.6);border:1px solid rgba(var(--crim-rgb),.24);cursor:pointer;transition:all .22s;-webkit-user-select:none;user-select:none}
.vr-btn:hover{color:var(--muro-white);border-color:var(--crim);background:rgba(var(--crim-rgb),.2)}
.vr-btn:active{transform:scale(.9)}
.vr-btn[data-d="-1"]{border-right:0}
.vr-btn[data-d="1"]{border-left:0}
.vr-val{min-width:40px;height:26px;display:grid;place-items:center;font-family:var(--ff-muro-d);font-weight:900;font-size:15px;color:var(--muro-white);background:rgba(var(--bg-rgb),.5);border-top:1px solid rgba(var(--crim-rgb),.24);border-bottom:1px solid rgba(var(--crim-rgb),.24);text-align:center;padding:0;outline:none;-moz-appearance:textfield}
.vr-val::-webkit-outer-spin-button,.vr-val::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.stat-hint{font-size:10px;line-height:1.5;color:var(--muro-text);margin:-2px 0 11px}

/* ── barra de carga de equipo ── */
.load{border:1px solid rgba(var(--muro-text-rgb),.13);background:rgba(var(--bg-rgb),.4);padding:11px 13px}
.load-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:8px}
.load-top .lt-v{font-family:var(--ff-muro-d);font-weight:700;font-size:13px;color:var(--muro-white)}
.load-top .lt-tag{font-size:8.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:3px 8px;border:1px solid}
.lt-tag.light{color:#7fd08a;border-color:rgba(127,208,138,.45)}
.lt-tag.medium{color:var(--amber-l);border-color:rgba(var(--amber-rgb),.45)}
.lt-tag.heavy{color:var(--fx-fire);border-color:rgba(212,112,58,.5)}
.lt-tag.over{color:var(--crim-l);border-color:rgba(var(--crim-rgb),.5)}
.loadbar{height:8px;background:rgba(var(--muro-text-rgb),.12);overflow:hidden;position:relative}
.loadbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--crim-d),var(--amber-l));transition:width .5s var(--muro-ease),background .4s}
.loadbar.medium i{background:linear-gradient(90deg,var(--amber),var(--amber-l))}
.loadbar.heavy i{background:linear-gradient(90deg,var(--fx-fire),var(--amber))}
.loadbar.over i{background:linear-gradient(90deg,var(--crim-d),var(--crim-l))}
.load-marks{display:flex;justify-content:space-between;margin-top:5px;font-size:8px;font-weight:700;letter-spacing:.06em;color:var(--muro-text)}

/* ── coste de runas ── */
.runes{border:1px solid rgba(var(--muro-text-rgb),.13);background:rgba(var(--bg-rgb),.4);padding:12px 13px}
.runes-in{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}
.rune-f{display:flex;flex-direction:column;gap:4px}
.rune-f label{font-size:8px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muro-text)}
.rune-f input{width:74px;background:rgba(var(--bg3-rgb),.6);border:1px solid rgba(var(--crim-rgb),.24);color:var(--muro-white);font-family:var(--ff-muro-d);font-weight:700;font-size:14px;padding:7px 9px;outline:none;text-align:center;-moz-appearance:textfield}
.rune-f input::-webkit-outer-spin-button,.rune-f input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.rune-f input:focus{border-color:rgba(var(--crim-rgb),.55)}
.rune-out{margin-top:11px;display:flex;flex-direction:column;gap:6px}
.rune-line{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:11px}
.rune-line .rl-l{color:var(--muro-text);letter-spacing:.04em}
.rune-line .rl-v{font-family:var(--ff-muro-d);font-weight:700;color:var(--muro-white)}
.rune-line.big .rl-v{font-size:16px;color:var(--amber-l)}

/* ── tarjetas (talismán / infusión) ── */
.card-note{padding:13px 14px;border:1px solid rgba(var(--muro-text-rgb),.14);background:rgba(var(--bg-rgb),.35)}
.card-note + .card-note{margin-top:8px}
.card-note .cn-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}
.card-note .cn-h b{font-family:var(--ff-muro);font-weight:700;font-size:13px;color:var(--muro-white)}
.card-note .cn-tag{font-size:7.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--crim-l);border:1px solid rgba(var(--crim-rgb),.4);padding:2px 7px;white-space:nowrap}
.card-note p{font-size:11.5px;line-height:1.6;color:var(--muro-text);white-space:pre-line}
.talis-card{border:1px solid rgba(var(--amber-rgb),.28);background:rgba(var(--amber-rgb),.05);padding:11px 13px}
.talis-card + .talis-card{margin-top:8px}
.talis-card .tc-h{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:5px}
.talis-card .tc-h b{font-family:var(--ff-muro);font-weight:700;font-size:12.5px;color:var(--muro-white)}
.talis-card .tc-w{flex:none;font-size:8px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--amber-l)}
.talis-card p{font-size:10.5px;line-height:1.55;color:var(--muro-text)}
.fx-list{display:flex;flex-direction:column;gap:8px}
.fx-empty{font-size:12px;font-style:italic;color:var(--muro-text)}
.share{display:block;width:100%;margin-top:6px;font-family:var(--ff-muro);font-weight:700;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muro-white);background:rgba(var(--crim-rgb),.18);border:1px solid var(--crim);padding:13px;cursor:pointer;transition:all .3s}
.share:hover{background:rgba(var(--crim-rgb),.34);box-shadow:0 0 20px rgba(var(--crim-rgb),.4)}

/* ── calcbar (infusión + nivel de forja) ── */
.calcbar{border:1px solid rgba(var(--crim-rgb),.28);background:linear-gradient(180deg,rgba(var(--bg3-rgb),.55),rgba(var(--bg-rgb),.65));padding:14px 16px 16px;margin-bottom:22px;display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap}
.calcbar[hidden]{display:none}
.cb-h{flex-basis:100%;display:flex;align-items:center;gap:9px;font-size:9px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--muro-text-l)}
.cb-h::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(var(--muro-text-rgb),.25),transparent)}
.cb-fields{display:grid;gap:9px;flex:1;min-width:170px;grid-template-columns:minmax(140px,1.1fr) minmax(130px,1fr) minmax(120px,170px)}
.calc-f{display:flex;flex-direction:column;gap:4px;min-width:0}
.calc-f.grow{flex:1}
.calc-f label{font-size:8px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muro-text)}
.calc-f select{background:rgba(var(--bg3-rgb),.6);border:1px solid rgba(var(--crim-rgb),.2);color:var(--muro-white);font-family:var(--ff-muro);font-size:11px;font-weight:700;padding:8px 9px;outline:none;width:100%}
.calc-f select option{background:var(--bg2);color:var(--muro-white)}
.calc-f select:focus{border-color:rgba(var(--crim-rgb),.55)}
.cb-lvl{display:flex;align-items:center;gap:10px}
.cb-lvl input[type=range]{flex:1;accent-color:var(--crim)}
.cb-lvl .lv-v{font-family:var(--ff-muro-d);font-weight:900;font-size:18px;color:var(--muro-white);min-width:42px;text-align:center}
.calc-note{font-size:9px;color:var(--muro-text);letter-spacing:.06em;flex-basis:100%}

/* ── empuñadura a dos manos (Fuerza ×1.5) ── */
.cb-two{flex-basis:100%;display:flex;align-items:center;gap:9px;cursor:pointer;user-select:none;margin-top:2px}
.cb-two input{position:absolute;opacity:0;width:0;height:0}
.cb-two-box{flex:none;width:16px;height:16px;border:1px solid rgba(var(--crim-rgb),.45);background:rgba(var(--bg3-rgb),.6);position:relative;transition:all .25s}
.cb-two input:checked+.cb-two-box{background:var(--crim);border-color:var(--crim);box-shadow:0 0 10px rgba(var(--crim-rgb),.5)}
.cb-two input:checked+.cb-two-box::after{content:'';position:absolute;left:5px;top:1px;width:4px;height:9px;border:solid var(--muro-white);border-width:0 2px 2px 0;transform:rotate(45deg)}
.cb-two input:focus-visible+.cb-two-box{outline:2px solid var(--amber-l);outline-offset:2px}
.cb-two-t{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muro-text-l)}
.cb-two-t em{font-style:normal;color:var(--amber-l);letter-spacing:.06em}
.cb-two input:checked~.cb-two-t{color:var(--muro-white)}

/* ══════════ TU PERSONAJE (charbar: clase + nivel + derivadas + 8 atributos) ══════════ */
.charbar{border:1px solid rgba(var(--amber-rgb),.3);background:linear-gradient(180deg,rgba(var(--bg3-rgb),.55),rgba(var(--bg-rgb),.65));padding:14px 16px 16px;margin-bottom:22px}
.charbar .cb-h{margin-bottom:12px}
.char-top{display:flex;align-items:stretch;gap:14px;flex-wrap:wrap;margin-bottom:13px}
.char-class{flex:1;min-width:180px;max-width:280px;justify-content:center}
.char-lvl{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;border:1px solid rgba(var(--amber-rgb),.4);background:rgba(var(--amber-rgb),.07);padding:6px 18px}
.char-lvl span{font-size:8px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--muro-text)}
.char-lvl b{font-family:var(--ff-muro-d);font-weight:900;font-size:26px;line-height:1;color:var(--amber-l)}
.char-derived{flex:2;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;min-width:260px}
.dnum{display:flex;flex-direction:column;justify-content:center;gap:3px;border:1px solid rgba(var(--muro-text-rgb),.13);background:rgba(var(--bg-rgb),.4);padding:7px 5px;text-align:center}
.dnum b{font-family:var(--ff-muro-d);font-weight:700;font-size:15px;line-height:1;color:var(--muro-white)}
.dnum span{font-size:7.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muro-text)}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.stat-grid .stat-row{min-width:0}
.stat-grid .sr-lb{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ══════════ PESTAÑAS DEL PANEL (Ofensiva / Defensa / Runas) ══════════ */
.ptabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:16px}
.ptab{font-family:var(--ff-muro);font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muro-text);background:rgba(var(--bg-rgb),.4);border:1px solid rgba(var(--muro-text-rgb),.2);padding:9px 6px;cursor:pointer;transition:all .25s}
.ptab:hover{color:var(--muro-white);border-color:var(--crim)}
.ptab.on{color:var(--muro-white);background:rgba(var(--crim-rgb),.18);border-color:var(--crim)}
.tabpane{display:none}
.tabpane.on{display:block;animation:bldPaneIn .35s var(--muro-ease)}
@keyframes bldPaneIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.load-note{font-size:9px;color:var(--muro-text);letter-spacing:.05em;line-height:1.5;margin-top:7px}

/* ══════════ MODAL SELECTOR ══════════ */
.drawer{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:24px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .35s var(--muro-ease),visibility .35s}
.drawer.on{opacity:1;visibility:visible;pointer-events:auto}
.drawer-back{position:absolute;inset:0;background:rgba(var(--bg-rgb),.78);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.drawer-in{position:relative;width:min(880px,94vw);max-height:min(80vh,780px);display:flex;flex-direction:column;border:1px solid rgba(var(--crim-rgb),.4);background:linear-gradient(180deg,var(--bg2),var(--bg));box-shadow:0 30px 80px rgba(0,0,0,.6);transform:translateY(16px) scale(.98);transition:transform .4s var(--muro-ease)}
.drawer.on .drawer-in{transform:none}
.drawer-h{display:flex;align-items:center;gap:14px;padding:16px 20px;border-bottom:1px solid rgba(var(--crim-rgb),.2);flex-wrap:wrap}
.drawer-h h3{font-family:var(--ff-muro-d);font-weight:700;font-size:16px;color:var(--muro-white);white-space:nowrap}
.drawer-h h3 i{font-style:normal;color:var(--crim-l)}
.dw-search{position:relative;flex:1;min-width:140px;max-width:300px}
.dw-search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--crim-d)}
.dw-search input{width:100%;background:rgba(var(--bg3-rgb),.5);border:1px solid rgba(var(--crim-rgb),.2);color:var(--muro-white);font-family:var(--ff-muro);font-size:12px;padding:9px 11px 9px 34px;outline:none}
.dw-filters{display:flex;gap:6px;flex-wrap:wrap;flex-basis:100%;margin-top:2px}
.dw-filters[hidden]{display:none}
.dw-pill{font-family:var(--ff-muro);font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muro-text);background:rgba(var(--bg-rgb),.4);border:1px solid rgba(var(--muro-text-rgb),.2);padding:6px 11px;cursor:pointer;transition:all .25s}
.dw-pill:hover{color:var(--muro-white);border-color:var(--crim)}
.dw-pill.on{color:var(--muro-white);background:rgba(var(--crim-rgb),.18);border-color:var(--crim)}
.dw-clear{font-family:var(--ff-muro);font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muro-text);background:none;border:1px solid rgba(var(--muro-text-rgb),.24);padding:8px 12px;cursor:pointer;transition:all .3s}
.dw-clear:hover{color:var(--crim-l);border-color:var(--crim)}
.dw-x{margin-left:auto;width:36px;height:36px;display:grid;place-items:center;background:none;border:1px solid rgba(var(--crim-rgb),.3);color:var(--muro-text-l);cursor:pointer;transition:all .3s}
.dw-x:hover{background:var(--crim);color:var(--muro-white);transform:rotate(90deg)}
.drawer-list{flex:1;min-height:0;overflow-y:auto;padding:14px 20px 26px;scrollbar-width:thin;scrollbar-color:var(--crim-d) transparent;overscroll-behavior:contain}
.pick{display:grid;grid-template-columns:44px 1fr auto;gap:14px;align-items:center;padding:11px 15px;border:1px solid rgba(var(--muro-text-rgb),.14);margin-bottom:8px;cursor:pointer;transition:all .25s;background:rgba(var(--bg-rgb),.3)}
.pick:hover{border-color:var(--crim);background:rgba(var(--crim-rgb),.08);transform:translateX(4px)}
.pick.sel{border-color:var(--amber);background:rgba(var(--amber-rgb),.08)}
.pick .pimg{width:44px;height:44px;display:grid;place-items:center}
.pick .pimg img{width:40px;height:40px;object-fit:contain}
.pick .pimg svg{color:var(--muro-text);opacity:.5}
.pick .nm{font-weight:700;color:var(--muro-white);font-size:13px}
.pick .nm .eqmark{color:var(--amber-l);font-size:11px}
.pick .mt{font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--amber-l);margin-top:3px}
.pick .fx-t{font-size:11px;color:var(--muro-text);margin-top:4px;line-height:1.5;max-width:54ch}
.pick .pv{text-align:right;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muro-text-l);display:flex;flex-direction:column;gap:4px;align-items:flex-end}
.pick .pv b{font-family:var(--ff-muro-d);font-size:13px;color:var(--crim-l)}
.pick .pv .eq{color:var(--amber-l)}
.dw-empty{text-align:center;padding:40px 0;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muro-text)}

/* ══════════ GUÍA RÁPIDA (desplegable, encima del builder) ══════════ */
.build-guide{width:min(1420px,100% - clamp(2.5rem,10vw,10rem));margin:22px auto 4px;border:1px solid rgba(var(--crim-rgb),.22);background:linear-gradient(180deg,rgba(var(--bg3-rgb),.5),rgba(var(--bg-rgb),.55))}
.build-guide summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:14px 18px;font-family:var(--ff-muro-d);font-weight:700;font-size:14.5px;letter-spacing:.03em;color:var(--muro-white);transition:background .3s}
.build-guide summary::-webkit-details-marker{display:none}
.build-guide summary:hover{background:rgba(var(--crim-rgb),.07)}
.build-guide summary:focus-visible{outline:1px solid rgba(var(--crim-rgb),.55);outline-offset:-3px}
.build-guide .bg-t em{font-style:normal;color:var(--crim-l)}
.build-guide .bg-chev{margin-left:auto;flex:none;color:var(--crim-l);transition:transform .35s var(--muro-ease)}
.build-guide[open] .bg-chev{transform:rotate(180deg)}
.build-guide[open] summary{border-bottom:1px solid rgba(var(--crim-rgb),.16)}
.build-guide .bg-body{padding:6px 18px 18px}
.build-guide .bg-body p{font-size:13.5px;line-height:1.75;color:var(--muro-text);margin:12px 0 0}
.build-guide .bg-body p strong{color:var(--muro-text-l);font-weight:600}

/* ══════════ TOAST ══════════ */
.bld-toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,80px);z-index:10000;font-family:var(--ff-muro);font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--muro-white);background:rgba(var(--bg3-rgb),.95);border:1px solid var(--amber);padding:12px 22px;transition:transform .45s var(--muro-ease);pointer-events:none}
.bld-toast.on{transform:translate(-50%,0)}

/* ══════════ RESPONSIVE ══════════ */
@media(max-width:1080px){
  .panoplia{grid-template-columns:1fr}
  .panel{position:static;max-height:none}
}
@media(max-width:760px){
  .doll-grid{grid-template-columns:1fr}
  .cmd-act{margin-left:0;width:100%}
  .cmd-act .cbtn{flex:1}
  .drawer{padding:12px}
  .drawer-in{max-height:88vh}
  .cb-fields{grid-template-columns:1fr}
  .stat-grid{grid-template-columns:repeat(2,1fr)}
  .char-class{max-width:none}
  .char-derived{min-width:0;flex-basis:100%}
}
@media(max-width:480px){.grid2{grid-template-columns:1fr}.numgrid.g5{grid-template-columns:repeat(3,1fr)}.stat-grid{grid-template-columns:1fr}.char-derived{grid-template-columns:repeat(2,1fr)}}

@media(prefers-reduced-motion:reduce){
  .slot,.pick,.drawer,.drawer-in,.abar i,.loadbar i{transition:none}
  .slot.pop,.atk-row.flash .av,.num.flash,.doll.armed .armed-h .armed-dot,.ar-total .art-v.flash,.tabpane.on{animation:none}
}
