/* Estilos propios del portal. Se cargan después de tokens.css y web.css (colores y tamaños: tokens.css). */
    .cls-death-knight{color:#C41E3A}.cls-demon-hunter{color:#A330C9}.cls-druid{color:#FF7C0A}
    .cls-evoker{color:#33937F}.cls-hunter{color:#AAD372}.cls-mage{color:#3FC7EB}
    .cls-monk{color:#00FF98}.cls-paladin{color:#F48CBA}.cls-priest{color:#FFFFFF}
    .cls-rogue{color:#FFF468}.cls-shaman{color:#0070DD}.cls-warlock{color:#8788EE}.cls-warrior{color:#C69B6D}
    /* Ancho del portal: el de la web, y más amplio en pantallas enormes (tablas y paneles) */
    .portal-wrap{width:var(--ancho-contenido);margin:0 auto;padding:var(--esp-6) 0;flex:1;min-width:0}
    @media(min-width:2560px){.portal-wrap{width:var(--ancho-amplio)}}
    /* Todo el portal usa rem: en pantallas grandes la letra crece un poco (16 px en portátil, hasta 21 px) */
    html{font-size:clamp(16px,calc(0.45vw + 9.5px),21px)}
    .modal-overlay{flex:none}
    /* Nada se sale de la pantalla: las tablas y contenidos anchos se desplazan dentro de su tarjeta */
    .portal-panel .card{overflow-x:auto}
    .portal-panel table{min-width:0}
    #screen-login{display:flex;align-items:center;justify-content:center;min-height:70vh}
    .login-box{background:var(--fondo-oscuro);border:1px solid var(--borde);border-radius:14px;padding:2.5rem 2rem;width:100%;max-width:380px}
    .login-box h2{font-family:'Cinzel',serif;font-size:1.2rem;color:var(--bronce-claro);text-align:center;margin-bottom:1.5rem;letter-spacing:2px}
    #screen-setup{display:flex;align-items:center;justify-content:center;min-height:70vh}
    .setup-box{background:var(--fondo-oscuro);border:1px solid var(--bronce);border-radius:14px;padding:2.5rem 2rem;width:100%;max-width:500px}
    .setup-box h2{font-family:'Cinzel',serif;font-size:1.1rem;color:var(--bronce-claro);text-align:center;margin-bottom:.4rem;letter-spacing:2px}
    .setup-subtitle{font-size:.82rem;color:var(--texto-tenue);text-align:center;margin-bottom:1.5rem;line-height:1.5}
    .screen{display:none}.screen.active{display:block}
    #screen-login.active,#screen-setup.active{display:flex}
    .form-field{margin-bottom:1rem}
    .form-field label{display:block;font-family:'Rajdhani',sans-serif;font-size:.75rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--texto-tenue);margin-bottom:.3rem}
    .form-field input,.form-field select,.form-field textarea{width:100%;padding:.6rem .9rem;background:rgba(var(--fondo-oscuro-rgb),.7);border:1px solid var(--borde);border-radius:6px;color:var(--texto);font-size:.88rem;outline:none;font-family:'Open Sans',sans-serif;transition:border-color .2s;box-sizing:border-box}
    .form-field input:focus,.form-field select:focus{border-color:var(--bronce)}
    .form-field select option{background:var(--fondo-oscuro)}
    textarea{resize:vertical;min-height:60px}
    .btn{display:inline-flex;align-items:center;gap:.4rem;padding:.55rem 1.3rem;border-radius:7px;border:1px solid transparent;font-family:'Rajdhani',sans-serif;font-size:.88rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:all .2s}
    .btn-primary{background:var(--bronce);color:var(--fondo-oscuro);border-color:var(--bronce-claro)}.btn-primary:hover{background:var(--bronce-claro)}
    .btn-danger{background:rgba(255,60,60,.15);color:#ff8080;border-color:rgba(255,60,60,.35)}.btn-danger:hover{background:rgba(255,60,60,.25)}
    .btn-ghost{background:transparent;color:var(--texto-tenue);border-color:var(--borde)}.btn-ghost:hover{color:var(--texto);border-color:var(--bronce)}
    .btn-gold{background:rgba(255,180,30,.1);color:#ffd060;border-color:rgba(255,180,30,.35)}.btn-gold:hover{background:rgba(255,180,30,.2)}
    .btn-sm{padding:.28rem .75rem;font-size:.76rem}.btn-full{width:100%;justify-content:center}.btn:disabled{opacity:.45;cursor:not-allowed}
    .alert{padding:.6rem 1rem;border-radius:6px;font-size:.84rem;margin-bottom:1rem}
    .alert-error{background:rgba(255,60,60,.1);border:1px solid rgba(255,60,60,.3);color:#ff8080}
    .alert-ok{background:rgba(100,200,80,.1);border:1px solid rgba(100,200,80,.3);color:#a0e860}
    .alert-info{background:rgba(var(--bronce-rgb),.1);border:1px solid rgba(var(--bronce-rgb),.3);color:var(--bronce-claro)}
    .portal-tabs{display:flex;gap:.4rem;margin-bottom:2rem;flex-wrap:wrap}
    .portal-tab{padding:.45rem 1.1rem;font-family:'Rajdhani',sans-serif;font-size:.83rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;border:1px solid var(--borde);border-radius:6px;background:rgba(var(--fondo-oscuro-rgb),.6);color:var(--texto-tenue);transition:all .18s}
    .portal-tab:hover{color:var(--texto);border-color:var(--bronce)}
    .portal-tab.active{background:rgba(var(--bronce-rgb),.18);color:var(--bronce-claro);border-color:var(--bronce)}
    .portal-panel{display:none}.portal-panel.active{display:block}
    .card{background:var(--fondo-oscuro);border:1px solid var(--borde);border-radius:10px;padding:1.25rem 1.5rem;margin-bottom:1.5rem}
    .card-title{font-family:'Rajdhani',sans-serif;font-size:1rem;font-weight:700;color:var(--bronce-claro);letter-spacing:1px;text-transform:uppercase;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--borde);display:flex;align-items:center;justify-content:space-between;gap:.5rem}
    .data-table{width:100%;border-collapse:collapse;font-size:.82rem}
    .data-table th{font-family:'Rajdhani',sans-serif;font-size:.72rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:.5rem .75rem;border-bottom:1px solid var(--borde);text-align:left;color:var(--texto-tenue);background:rgba(var(--fondo-oscuro-rgb),.5)}
    .data-table td{padding:.5rem .75rem;border-bottom:1px solid rgba(var(--borde-rgb),.2);vertical-align:middle;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    .data-table tr:hover td{background:rgba(var(--bronce-rgb),.04)}
    .data-table tr:last-child td{border-bottom:none}
    .table-wrap{overflow-x:auto}
    .badge{display:inline-block;padding:.1rem .45rem;border-radius:3px;font-size:.68rem;font-weight:700;letter-spacing:.5px}
    .badge-admin{background:rgba(255,180,30,.15);color:#ffd060;border:1px solid rgba(255,180,30,.3)}
    .badge-raidleader{background:rgba(255,100,30,.15);color:#ff9060;border:1px solid rgba(255,100,30,.3)}
    .badge-raider{background:rgba(var(--bronce-rgb),.15);color:var(--bronce-claro);border:1px solid rgba(var(--bronce-rgb),.3)}
    .badge-activo{background:rgba(80,200,80,.1);color:#a0e860;border:1px solid rgba(80,200,80,.25)}
    .badge-inactivo{background:rgba(255,60,60,.1);color:#ff8080;border:1px solid rgba(255,60,60,.25)}
    .sr-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
    @media(max-width:600px){.sr-grid{grid-template-columns:1fr}}
    .sr-slot{border:1px solid var(--borde);border-radius:10px;padding:1.1rem;background:rgba(var(--fondo-oscuro-rgb),.5)}
    .sr-slot.filled{border-color:var(--bronce);background:rgba(var(--bronce-rgb),.06)}
    .sr-slot-locked{border-color:rgba(220,50,50,.35)!important;background:rgba(220,50,50,.05)!important}
    .sr-slot-label{font-family:'Rajdhani',sans-serif;font-size:.85rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--bronce-claro);margin-bottom:.6rem}
    .sr-item-display{display:flex;align-items:center;gap:.75rem;margin-bottom:.6rem}
    .sr-item-img{width:44px;height:44px;border-radius:6px;border:1px solid var(--borde);object-fit:cover;background:var(--fondo-oscuro);flex-shrink:0}
    .sr-item-img-ph{width:44px;height:44px;border-radius:6px;border:1px solid var(--borde);background:var(--fondo-oscuro);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:1.3rem}
    .sr-item-name{font-family:'Rajdhani',sans-serif;font-size:.95rem;font-weight:700;color:var(--bronce-claro)}
    .sr-item-sub{font-size:.77rem;color:var(--texto-tenue)}
    .modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:200;display:none;align-items:center;justify-content:center;padding:1rem}
    .modal-overlay.open{display:flex}
    .modal-box{background:var(--fondo-oscuro);border:1px solid var(--bronce);border-radius:14px;width:100%;max-width:700px;max-height:90vh;overflow-y:auto;padding:1.75rem;position:relative}
    .modal-title{font-family:'Cinzel',serif;font-size:1.1rem;color:var(--bronce-claro);margin-bottom:1.25rem;padding-bottom:.6rem;border-bottom:1px solid var(--borde)}
    .modal-close{position:absolute;top:1rem;right:1.25rem;background:none;border:none;color:var(--texto-tenue);font-size:1.5rem;cursor:pointer;line-height:1}.modal-close:hover{color:#fff}
    .raid-section{margin-bottom:1.5rem}
    .raid-section-title{font-family:'Rajdhani',sans-serif;font-size:.88rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--bronce-claro);margin-bottom:.5rem;padding-bottom:.3rem;border-bottom:1px solid var(--borde)}
    .boss-title{font-family:'Rajdhani',sans-serif;font-size:.8rem;font-weight:700;color:var(--bronce-claro);letter-spacing:1px;margin:.6rem 0 .3rem}
    .item-btn{display:flex;align-items:center;gap:.6rem;padding:.45rem .75rem;border-radius:6px;border:1px solid var(--borde);background:rgba(var(--fondo-oscuro-rgb),.5);cursor:pointer;text-align:left;transition:all .15s;width:100%;margin-bottom:.2rem}
    .item-btn:hover{border-color:var(--bronce);background:rgba(var(--bronce-rgb),.1)}
    .item-thumb{width:32px;height:32px;border-radius:4px;object-fit:cover;background:var(--fondo-oscuro);border:1px solid var(--borde);flex-shrink:0}
    .item-thumb-ph{width:32px;height:32px;border-radius:4px;background:var(--fondo-oscuro);border:1px solid var(--borde);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:.9rem}
    .item-name{font-size:.84rem;color:var(--texto);flex:1}
    .item-slot-lbl{font-size:.7rem;color:var(--texto-tenue);font-family:'Rajdhani',sans-serif;font-weight:700;white-space:nowrap}
    .item-tipo-tier{font-size:.65rem;color:#a0e860;font-weight:700}
    .filter-bar{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:1rem}
    .filter-btn{padding:.25rem .75rem;font-family:'Rajdhani',sans-serif;font-size:.75rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;cursor:pointer;border:1px solid var(--borde);border-radius:5px;background:rgba(var(--fondo-oscuro-rgb),.5);color:var(--texto-tenue);transition:all .15s}
    .filter-btn:hover,.filter-btn.active{color:var(--bronce-claro);border-color:var(--bronce);background:rgba(var(--bronce-rgb),.12)}
    .items-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:.75rem}
    .item-card{background:rgba(var(--fondo-oscuro-rgb),.6);border:1px solid var(--borde);border-radius:8px;padding:.75rem;display:flex;align-items:center;gap:.75rem}
    .item-card img{width:48px;height:48px;border-radius:6px;object-fit:cover;border:1px solid var(--borde);flex-shrink:0}
    .item-card-ph{width:48px;height:48px;border-radius:6px;background:var(--fondo-oscuro);border:1px solid var(--borde);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:1.4rem}
    .item-card-info{flex:1;min-width:0}
    .item-card-name{font-size:.84rem;color:var(--texto);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .item-card-sub{font-size:.72rem;color:var(--texto-tenue)}
    .item-card-actions{display:flex;flex-direction:column;gap:.3rem}
    .loader{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.2);border-top-color:var(--bronce-claro);border-radius:50%;animation:spin .6s linear infinite}
    @keyframes spin{to{transform:rotate(360deg)}}
    .portal-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:2rem;flex-wrap:wrap;gap:.75rem}
    .welcome-block{line-height:1.5}
    .welcome-name{font-family:'Rajdhani',sans-serif;font-size:1.8rem;font-weight:700;letter-spacing:2px;text-transform:uppercase}
    .btn-warning{background:rgba(255,160,0,.15);color:#ffa000;border:1px solid rgba(255,160,0,.4)}
    .btn-warning:hover{background:rgba(255,160,0,.3)}
    @keyframes shake{0%,100%{transform:translateX(0)}15%{transform:translateX(-8px)}30%{transform:translateX(8px)}45%{transform:translateX(-6px)}60%{transform:translateX(6px)}75%{transform:translateX(-3px)}90%{transform:translateX(3px)}}
    .shake{animation:shake .5s ease-in-out}
    /* Discord nav button */
    .tooltip-btn{position:relative}
    .tooltip-btn::after{content:attr(title);position:absolute;bottom:calc(100% + 5px);left:50%;transform:translateX(-50%);background:var(--fondo-oscuro);color:var(--crema);font-size:.7rem;white-space:nowrap;padding:.2rem .5rem;border-radius:4px;border:1px solid rgba(var(--bronce-rgb),.4);pointer-events:none;opacity:0;transition:opacity .15s}
    .tooltip-btn:hover::after{opacity:1}
    .welcome-realm{font-size:.92rem;margin-top:.1rem;font-family:'Rajdhani',sans-serif;font-weight:600}
    .welcome-meta{font-size:.82rem;color:var(--texto-tenue);margin-top:.1rem}
    .welcome-login{font-size:.78rem;color:var(--texto-tenue);margin-top:.1rem}
    .rol-badge-inline{display:inline-block;font-family:'Rajdhani',sans-serif;font-size:.72rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:.15rem .6rem;border-radius:4px;margin-left:.5rem;vertical-align:middle}
    .hdr-actions{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
    .log-row{display:grid;grid-template-columns:150px 130px 1fr;gap:.5rem .75rem;padding:.5rem 0;border-bottom:1px solid rgba(var(--borde-rgb),.2);font-size:.8rem;align-items:start}
    .log-row:last-child{border-bottom:none}
    .log-ts{color:var(--texto-tenue);font-family:'Rajdhani',sans-serif;font-size:.72rem;line-height:1.4}
    .log-user{font-weight:700;line-height:1.4}
    .log-action-badge{display:inline-block;font-family:'Rajdhani',sans-serif;font-size:.68rem;font-weight:700;letter-spacing:.5px;padding:.1rem .4rem;border-radius:3px;margin-right:.3rem}
    .log-crear{background:rgba(80,200,80,.15);color:#a0e860;border:1px solid rgba(80,200,80,.25)}
    .log-modificar{background:rgba(255,180,30,.12);color:#ffd060;border:1px solid rgba(255,180,30,.25)}
    .log-borrar{background:rgba(255,60,60,.12);color:#ff8080;border:1px solid rgba(255,60,60,.25)}
    .two-col{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
    @media(max-width:700px){.two-col{grid-template-columns:1fr}}
    .search-input{padding:.45rem .85rem;background:rgba(var(--fondo-oscuro-rgb),.6);border:1px solid var(--borde);border-radius:6px;color:var(--texto);font-size:.84rem;outline:none}
    .search-input:focus{border-color:var(--bronce)}
    #img-preview{width:64px;height:64px;border-radius:8px;object-fit:cover;border:1px solid var(--borde);display:none;margin-top:.5rem}
    /* Faccion radios */
    .faccion-group{display:flex;gap:1rem;margin-top:.3rem}
    .faccion-opt{display:flex;align-items:center;gap:.5rem;cursor:pointer;padding:.5rem .9rem;border:1px solid var(--borde);border-radius:8px;transition:all .2s;flex:1;justify-content:center}
    .faccion-opt:hover{border-color:var(--bronce)}
    .faccion-opt.sel-alianza{border-color:#4da6ff;background:rgba(77,166,255,.1)}
    .faccion-opt.sel-horda{border-color:#cc3333;background:rgba(204,51,51,.1)}
    .faccion-opt input{display:none}
    .faccion-label{font-family:'Rajdhani',sans-serif;font-size:.85rem;font-weight:700}
    /* Faction real icons */
    .faction-icon-img{width:26px;height:26px;vertical-align:middle;flex-shrink:0}
    /* Personajes */
    .char-card{display:flex;align-items:center;gap:.75rem;padding:.65rem .85rem;border:1px solid var(--borde);border-radius:8px;background:rgba(var(--fondo-oscuro-rgb),.5);margin-bottom:.5rem;transition:border-color .15s}
    .char-card.is-main{border-color:var(--bronce-claro)}
    .char-main-badge{font-family:'Rajdhani',sans-serif;font-size:.65rem;font-weight:700;letter-spacing:1px;color:var(--bronce-claro);background:rgba(255,180,30,.12);border:1px solid rgba(255,180,30,.3);padding:.1rem .4rem;border-radius:3px;flex-shrink:0}
    .char-info{flex:1}
    .char-name{font-family:'Rajdhani',sans-serif;font-size:.95rem;font-weight:700}
    .char-sub{font-size:.75rem;color:var(--texto-tenue)}
    /* Nota hint */
    .nota-hint{font-size:.72rem;color:var(--texto-tenue);margin-top:.3rem;font-style:italic;display:flex;align-items:center;gap:.3rem}
    /* SR num en tabla — "Soft Reserve" label + número */
    .sr-num-badge{display:inline-flex;align-items:center;gap:.3rem;font-family:'Rajdhani',sans-serif;font-size:.8rem;font-weight:700;color:var(--bronce-claro)}
    .sr-num{background:rgba(var(--bronce-rgb),.2);border:1px solid rgba(var(--bronce-rgb),.4);border-radius:3px;padding:.05rem .35rem;font-size:.72rem}

/* ── Fase 3: Temporadas, Catálogo e Histórico (mismo estilo que el resto del portal) ── */
.nota-panel{color:var(--texto-tenue);font-size:.82rem;margin:-.25rem 0 1rem;line-height:1.5}
.fila-acciones{display:flex;gap:.35rem;flex-wrap:wrap;justify-content:flex-end}
.tabla-scroll{overflow-x:auto}
.badge-activa{background:rgba(80,200,80,.15);color:#80e880;border:1px solid rgba(80,200,80,.3)}
.badge-preparacion{background:rgba(255,180,30,.15);color:#ffd060;border:1px solid rgba(255,180,30,.3)}
.badge-archivada{background:rgba(150,150,170,.12);color:#b8b0c8;border:1px solid rgba(150,150,170,.3)}
.fuente{font-size:.72rem;color:var(--texto-tenue);word-break:break-word}
.cat-instancia{border:1px solid var(--borde);border-radius:8px;margin-bottom:1rem;overflow:hidden}
.cat-instancia-cab{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;padding:.6rem .9rem;background:rgba(255,255,255,.03);border-bottom:1px solid rgba(255,255,255,.05)}
.cat-instancia-nombre{font-family:'Rajdhani',sans-serif;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--crema)}
.cat-jefe{padding:.5rem .9rem;border-bottom:1px solid rgba(255,255,255,.04)}
.cat-jefe:last-child{border-bottom:none}
.cat-jefe-cab{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:.35rem}
.cat-jefe-nombre{font-weight:700;color:var(--texto)}
.cat-objeto-img{width:28px;height:28px;border-radius:4px;object-fit:cover;vertical-align:middle}
.cat-inactivo td{opacity:.5}