/* RoleForge · estilos de la aplicación */
/* «RF Gafas»: solo dibuja ⚯ y el rayo combinante ͛ (el nombre de EntreMuggles); el resto del texto no la usa */
@font-face{font-family:"RF Gafas";src:url("/assets/fonts/rf-gafas.woff2?v=2") format("woff2");unicode-range:U+26AF,U+035B;font-display:swap}
:root{--night:#050a14;--deep:#0a1425;--panel:#0d1b2e;--panel2:#12233a;--line:#1c3350;--bg1:#0b1a2e;--bg2:#050a14;--glow1:72,216,255;--glow2:143,108,242;--card1:#14263f;--card2:#0a1425;--input:#07101d;--input2:#0b1526;--gold:#c8aa6e;--gold2:#f0d79a;--gold3:#7a5f2e;--cream:#f0e6d2;--dim:#a09b8c;--mute:#5c6b7d;--hex:#0ac8b9;--hex2:#48d8ff;--ember:#ff9a3c;--arcane:#8f6cf2;--danger:#ff6b6b;--disp:"RF Gafas","Cinzel",Georgia,serif;--body:"RF Gafas","Wix Madefor Text","Wix Madefor Display",system-ui,-apple-system,Segoe UI,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body.app{background:var(--night);color:var(--cream);font-family:var(--body);font-size:16px;line-height:1.6;letter-spacing:-.005em;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,select,textarea{font:inherit;color:var(--cream)}
#bg{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
main.wrap,header.top,footer.foot{position:relative;z-index:1}
.wrap{width:min(1180px,calc(100% - 40px));margin:0 auto}
main.wrap{flex:1;padding:34px 0 60px}
.k{font-family:var(--disp);font-weight:600;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.k a:hover{color:var(--gold2)}
.h1{font-family:var(--disp);font-weight:600;letter-spacing:.06em;text-transform:uppercase;font-size:clamp(24px,3.2vw,36px);line-height:1.1;margin-top:6px}
.h2{font-family:var(--disp);font-weight:600;letter-spacing:.06em;text-transform:uppercase;font-size:clamp(20px,2.4vw,28px);line-height:1.15;margin:8px 0 12px}
.h3{font-family:var(--disp);font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:14px;color:var(--gold2)}
.dim{color:var(--dim)}
.lead-sm{max-width:64ch;margin-top:8px;font-size:15px}
.center{text-align:center}
.narrow{max-width:620px;margin-inline:auto}

/* cabecera */
header.top{position:sticky;top:0;z-index:20;backdrop-filter:blur(10px);background-color:color-mix(in srgb,var(--night) 85%,transparent);transition:background-color .9s ease;border-bottom:1px solid rgba(200,170,110,.22)}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;height:60px}
.logo{display:flex;align-items:center;gap:10px;font-family:var(--disp);font-weight:700;letter-spacing:.2em;font-size:15px;color:var(--gold2)}
.logo svg{width:26px;height:26px}
header.top nav{display:flex;align-items:center;gap:22px;font-family:var(--disp);font-weight:600;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
header.top nav a:hover{color:var(--gold2)}
/* menú plegado: salta en cuanto el menú no cabe en una línea, lo mida quien lo mida */
.nav-burger{display:none;flex-direction:column;justify-content:center;gap:4px;width:40px;height:34px;padding:0 9px;border:1px solid var(--gold-line);background:rgba(200,170,110,.06);clip-path:polygon(7px 0,calc(100% - 7px) 0,100% 50%,calc(100% - 7px) 100%,7px 100%,0 50%)}
.nav-burger i{display:block;height:2px;background:var(--gold2);transition:transform .2s,opacity .2s}
body.burger .nav-burger{display:flex}
body.burger .nav-burger[aria-expanded=true] i:nth-child(1){transform:translateY(6px) rotate(45deg)}
body.burger .nav-burger[aria-expanded=true] i:nth-child(2){opacity:0}
body.burger .nav-burger[aria-expanded=true] i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
body.burger header.top nav{position:absolute;right:0;top:60px;z-index:30;display:none;flex-direction:column;align-items:stretch;gap:0;min-width:min(264px,calc(100vw - 24px));padding:6px;background:linear-gradient(180deg,#101f36,#070f1c);border:1px solid var(--gold-line);clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);box-shadow:0 20px 50px rgba(0,0,0,.75)}
body.burger header.top nav.open{display:flex}
body.burger header.top nav > a{position:relative;display:flex;align-items:center;gap:10px;padding:11px 12px;border-bottom:1px solid rgba(200,170,110,.14)}
body.burger header.top nav > a .badge{position:static;margin-left:auto}
.solo-menu{display:none}
body.burger .solo-menu{display:inline}
body.burger header.top nav > a:last-child{border-bottom:0}
body.burger header.top nav .user{justify-content:flex-start}
body.burger header.top nav .user b{display:inline}
body.burger header.top .wrap{position:relative}
header.top nav .quiet{color:var(--mute)}
.user{display:flex;align-items:center;gap:8px;font-family:var(--body);text-transform:none;letter-spacing:0;font-size:14px;color:var(--cream)}
.user img{width:26px;height:26px;border-radius:50%;border:1px solid var(--gold3)}
footer.foot{border-top:1px solid rgba(200,170,110,.2);padding:22px 0;font-family:var(--body);font-weight:600;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
footer.foot .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* botones */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:min-content;padding:13px 26px;font-family:var(--disp);font-weight:600;font-size:13px;letter-spacing:.22em;text-transform:uppercase;white-space:nowrap;clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,10px 100%,0 50%);transition:transform .2s,filter .2s}
.btn:hover{transform:translateY(-1px);filter:brightness(1.12)}
.btn:focus-visible{outline:2px solid var(--hex2);outline-offset:3px}
.btn-gold{color:#1a1206;background:linear-gradient(180deg,#f0d79a 0%,#c8aa6e 55%,#8f6e34 100%);box-shadow:0 0 24px rgba(200,170,110,.2)}
.btn-line{color:var(--gold2);background:linear-gradient(180deg,rgba(200,170,110,.16),rgba(200,170,110,.05));box-shadow:inset 0 0 0 1px var(--gold)}
.btn-sm{padding:9px 18px;font-size:11.5px}
.btn[disabled]{opacity:.45;pointer-events:none}
.link{color:var(--gold);font-size:14px;text-decoration:underline dotted;text-underline-offset:3px;margin-top:8px}
.link.danger{color:var(--danger)}
.actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:18px}
.actions.end{justify-content:flex-end}.actions.between{justify-content:space-between}
.center .actions{justify-content:center}

/* paneles */
.panel{position:relative;background-color:color-mix(in srgb,var(--panel) 90%,transparent);background-image:linear-gradient(180deg,rgba(255,255,255,.035),rgba(0,0,0,.12));transition:background-color .9s ease,border-color .9s ease;border:1px solid rgba(200,170,110,.28);clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);padding:22px 24px;margin-bottom:18px}
.panel.gold-edge{border-color:rgba(200,170,110,.6);box-shadow:0 0 30px rgba(200,170,110,.08)}
.panel-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid rgba(200,170,110,.18)}
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:24px}
.page-head .actions{margin-top:0}
.flash{margin-bottom:18px;padding:12px 16px;border:1px solid rgba(72,216,255,.45);background:rgba(72,216,255,.08);color:var(--cream);font-size:15px;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.flash.err{border-color:rgba(255,107,107,.5);background:rgba(255,107,107,.08)}
.err-text{color:var(--danger);margin:10px 0}
.two-col{display:grid;grid-template-columns:1.6fr 1fr;gap:20px;align-items:start}
@media(max-width:900px){.two-col{grid-template-columns:1fr}}

/* formularios */
.form .field,.fields .field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.field>span{font-family:var(--disp);font-weight:600;font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.field>span em{font-family:var(--body);text-transform:none;letter-spacing:0;color:var(--mute);font-style:normal;font-size:12px}
.form input:not([type=radio]):not([type=checkbox]):not([type=file]),.form textarea,.form select,.fields input:not([type=checkbox]),.fields textarea,.fields select,.quick-roll input,.copy-row input,.preset-form select{background:var(--input);border:1px solid var(--line);padding:10px 12px;color:var(--cream);transition:border-color .2s;width:100%}
.form input:focus,.form textarea:focus,.form select:focus,.fields input:focus,.fields textarea:focus,.fields select:focus,.quick-roll input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 2px rgba(200,170,110,.15)}
.form input[type=file]{color:var(--dim);font-size:14px}
.form .hint{color:var(--mute);font-size:13px}
.form.compact .field{margin-bottom:10px}
.chk{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--dim);white-space:nowrap}
.chk input{accent-color:var(--gold)}
.worlds{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.world-opt{display:flex;flex-direction:column;gap:4px;padding:14px;border:1px solid var(--line);background:var(--input);cursor:pointer;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);transition:.2s}
.world-opt input{position:absolute;opacity:0}
.world-opt b{font-family:var(--disp);font-weight:600;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--cream)}
.world-opt small{color:var(--dim);font-size:13px}
.world-opt:has(input:checked){border-color:var(--gold);background:linear-gradient(180deg,rgba(200,170,110,.18),rgba(200,170,110,.06));box-shadow:0 0 18px rgba(200,170,110,.15)}
.world-opt:has(input:checked) b{color:var(--gold2)}

/* campañas */
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.camp-card{position:relative;display:block;padding:22px 24px 20px;background:linear-gradient(180deg,var(--card1),var(--card2));clip-path:polygon(0 0,100% 0,100% calc(100% - 26px),50% 100%,0 calc(100% - 26px));min-height:210px;transition:transform .25s}
.camp-card:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(200,170,110,.5),rgba(200,170,110,.12) 60%,rgba(200,170,110,.45));clip-path:inherit;z-index:-1}
.camp-card:after{content:"";position:absolute;inset:1px;background:linear-gradient(180deg,var(--card1),var(--card2));clip-path:inherit;z-index:-1}
.camp-card:hover{transform:translateY(-4px)}
.camp-card h2{font-family:var(--disp);font-weight:600;font-size:20px;letter-spacing:.06em;text-transform:uppercase;margin:10px 0 8px;line-height:1.15}
.camp-card p{color:var(--dim);font-size:14px}
.camp-top{display:flex;justify-content:space-between;gap:10px;font-family:var(--body);font-weight:600;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.role.gm{color:var(--gold)}.role.player{color:var(--hex2)}
.camp-meta{display:flex;gap:14px;margin-top:16px;font-size:13px;color:var(--mute)}
.world-escuela:after{background:linear-gradient(180deg,#1a2140,#0a1425)}.world-terror:after{background:linear-gradient(180deg,#2a1216,#0a0a10)}.world-fantasia:after{background:linear-gradient(180deg,#14261e,#0a1425)}.world-espacio:after{background:linear-gradient(180deg,#0e1f33,#050a14)}

/* personajes */
.char-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.char-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 10px 14px;text-align:center;background:var(--input);border:1px solid var(--line);clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);transition:.2s}
.char-card:hover{border-color:var(--gold);transform:translateY(-2px)}
.char-card.own{border-color:rgba(72,216,255,.5)}
.av{width:64px;height:64px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--line),var(--input)) center/cover;display:grid;place-items:center;font-family:var(--disp);font-weight:600;font-size:24px;color:var(--gold2);box-shadow:0 0 0 2px var(--gold3),0 0 0 4px #07101d}
.av.big{width:96px;height:96px;font-size:36px}
.char-card .nm{font-family:var(--disp);font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--cream)}
.char-card .by{font-size:12px;color:var(--mute)}
.mini-bar{width:100%;margin-top:4px}
.mini-bar i{display:block;height:5px;background:var(--input2);border:1px solid rgba(200,170,110,.25);position:relative}
.mini-bar i:after{content:"";position:absolute;inset:1px;width:var(--w,50%);background:linear-gradient(90deg,#7a5f2e,#c8aa6e,#f0d79a)}
.mini-bar small{font-size:11px;color:var(--mute)}

/* miembros e invitación */
.members{list-style:none;display:flex;flex-direction:column;gap:8px}
.members li{display:flex;align-items:center;gap:10px}
.members img{width:32px;height:32px;border-radius:50%;border:1px solid var(--gold3)}
.members span{display:flex;flex-direction:column;line-height:1.2;flex:1}
.members small{font-family:var(--body);font-weight:600;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.members .x{color:var(--mute);font-size:18px;padding:0 6px}
.members .x:hover{color:var(--danger)}
.copy-row{display:flex;gap:8px;margin:10px 0 4px}
.copy-row input{font-size:13px;color:var(--dim)}
details.details summary{cursor:pointer;font-family:var(--disp);font-weight:600;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);list-style:none}
details.details summary::-webkit-details-marker{display:none}
details.details[open] summary{margin-bottom:12px}

/* tiradas */
.roll-list{list-style:none;display:flex;flex-direction:column;gap:6px;max-height:320px;overflow:auto;padding-right:4px}
.roll-list li{display:flex;align-items:center;gap:10px;padding:7px 10px;background:var(--input);border:1px solid var(--line);font-size:14px}
.roll-list li b{font-family:var(--disp);font-weight:600;font-size:18px;min-width:38px;text-align:center;color:var(--gold2)}
.roll-list li span{color:var(--dim);line-height:1.3}
.roll-list li strong{color:var(--cream);font-weight:600}
.roll-list li small{color:var(--mute);font-size:12px}
.roll-list li.crit b{color:#f0d79a;text-shadow:0 0 12px rgba(240,215,154,.8)}
.roll-list li.crit{border-color:rgba(240,215,154,.6)}
.roll-list li.fumble b{color:var(--danger)}
.roll-list li.new{animation:pop .5s cubic-bezier(.2,.7,.2,1)}
@keyframes pop{from{transform:translateY(8px);opacity:0;background:rgba(72,216,255,.15)}to{opacity:1}}
.quick-roll{display:flex;gap:8px;margin-top:12px;align-items:center;flex-wrap:wrap}
.quick-roll input{flex:1;min-width:90px}
.roll-result{text-align:center;padding:18px 10px 14px;margin-bottom:8px;border:1px solid var(--line);background:#07101d}
.roll-result b{display:block;font-family:var(--disp);font-weight:600;font-size:46px;line-height:1;color:var(--cream)}
.roll-result span{display:block;font-size:13px;color:var(--mute);margin-top:6px}
.roll-result.show b{color:var(--hex2);text-shadow:0 0 18px rgba(72,216,255,.8)}
.roll-result.crit b{color:#f0d79a;text-shadow:0 0 22px rgba(240,215,154,.9)}
.roll-result.fumble b{color:var(--danger)}

/* ---------- ficha: pantalla de personaje ---------- */
.sheet.game{--gold-line:rgba(200,170,110,.35)}
.hud{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:10px 16px;margin-bottom:14px;background:color-mix(in srgb,var(--panel) 80%,transparent);border:1px solid var(--gold-line);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)}
.hud-back{font-family:var(--disp);font-weight:600;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);white-space:nowrap;padding-left:8px}
.hud-back:hover{color:var(--gold2)}
.hud-chips{display:flex;gap:8px;flex-wrap:wrap;flex:1}
.chip{display:inline-flex;flex-direction:column;padding:4px 12px;background:var(--input);border:1px solid var(--line);font-size:14px;color:var(--cream);line-height:1.2;clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 6px,100% calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,0 calc(100% - 6px),0 6px)}
.chip small{font-family:var(--body);font-weight:600;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.hud-state{font-size:13px;color:var(--mute);white-space:nowrap;padding-right:8px}
.hud-state.ok{color:var(--hex)}.hud-state.err{color:var(--danger)}.hud-state.saving{color:var(--gold)}
.screen-grid{display:grid;grid-template-columns:minmax(300px,.9fr) minmax(0,1.5fr);gap:18px;align-items:stretch;min-height:640px}
@media(max-width:900px){.screen-grid{grid-template-columns:1fr;min-height:0}}

/* escenario */
.stage-card,.tabs-card{position:relative;background-color:color-mix(in srgb,var(--panel) 90%,transparent);background-image:linear-gradient(180deg,rgba(255,255,255,.035),rgba(0,0,0,.12));transition:background-color .9s ease,border-color .9s ease;border:1px solid var(--gold-line);clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}
.stage-card{display:flex;flex-direction:column;align-items:center;padding:28px 22px 22px;text-align:center;overflow:hidden}
.stage-card:before{content:"";position:absolute;left:50%;top:150px;width:520px;height:520px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(var(--glow1),.16),transparent 60%);pointer-events:none}
.portrait{position:relative;width:200px;height:200px;display:grid;place-items:center;margin-bottom:10px}
.sigil{position:absolute;inset:-10px;border-radius:50%;border:1px dashed rgba(200,170,110,.45);animation:turn 40s linear infinite}
.sigil:before{content:"";position:absolute;inset:14px;border-radius:50%;border:1px solid rgba(200,170,110,.25)}
.sigil:after{content:"";position:absolute;inset:-14px;border-radius:50%;border:1px solid rgba(var(--glow1),.25);box-shadow:0 0 40px rgba(var(--glow1),.15) inset}
@keyframes turn{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.sigil{animation:none}}
.av.huge{width:168px;height:168px;font-size:64px;box-shadow:0 0 0 3px var(--gold3),0 0 0 6px var(--night),0 0 0 7px rgba(200,170,110,.5),0 18px 40px rgba(0,0,0,.5)}
.nameplate h1{font-family:var(--disp);font-weight:700;font-size:clamp(22px,2.4vw,30px);letter-spacing:.08em;text-transform:uppercase;line-height:1.1;color:var(--cream);text-shadow:0 2px 0 rgba(0,0,0,.5)}
.nameplate .sub{font-family:var(--disp);font-weight:600;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-top:6px}
.vitals{width:100%;margin-top:18px;display:flex;flex-direction:column;gap:8px}
.vital{display:grid;grid-template-columns:118px 1fr 56px;align-items:center;gap:10px;font-size:13px}
.vital>span{font-family:var(--disp);font-weight:600;font-size:10.5px;letter-spacing:.12em;line-height:1.2;text-transform:uppercase;color:var(--gold);text-align:right}
.vital b{font-family:var(--disp);font-weight:500;color:var(--dim);text-align:left;font-variant-numeric:tabular-nums}
.vital b em{font-style:normal;color:var(--cream);font-size:16px}
.vital.gm>span:after{content:" ◆";color:var(--arcane)}
.bar{height:12px;background:var(--input);border:1px solid rgba(200,170,110,.3);position:relative;overflow:hidden}
.bar i{position:absolute;inset:1px;width:var(--w,50%);background:linear-gradient(90deg,#7a5f2e,#c8aa6e 60%,#f0d79a);transition:width .5s cubic-bezier(.2,.7,.2,1);box-shadow:0 0 10px rgba(240,215,154,.35)}
.bar.low i{background:linear-gradient(90deg,#7a2e2e,#e0523c,#ff9a3c)}
.slots-head{width:100%;display:flex;justify-content:space-between;align-items:baseline;margin:22px 0 8px;padding-bottom:6px;border-bottom:1px solid var(--gold-line)}
.slots-head small{font-size:12px;color:var(--mute)}
.slots{width:100%}
.slots .tag-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;background:none;border:0;padding:0;min-height:0}
.slot{position:relative;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:6px;background:var(--input);border:1px solid var(--line);clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px);transition:.2s}
.tag.slot{border-color:rgba(200,170,110,.5);background:linear-gradient(180deg,var(--input2),var(--input));cursor:default}
.tag.slot:hover{border-color:var(--gold2);box-shadow:0 0 14px rgba(240,215,154,.2)}
.slot i{font-style:normal;font-size:26px;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}
.slot em{font-style:normal;font-size:11px;line-height:1.15;color:var(--dim);max-width:100%;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.slot .tag-x{position:absolute;top:4px;right:6px;color:var(--mute);font-size:14px;line-height:1;opacity:0}
.tag.slot:hover .tag-x{opacity:1}
.slot.empty{border-style:dashed;opacity:.45}
.slot.empty:before{content:"";width:22px;height:22px;border:1px solid var(--line);transform:rotate(45deg);opacity:.6}
.slot.add{border-style:dashed;border-color:var(--gold3);cursor:text}
.slot.add .tag-in{width:100%;min-width:0;height:100%;text-align:center;font-size:22px;color:var(--gold);background:transparent!important;border:0!important;padding:0!important}
.slot.add .tag-in::placeholder{color:var(--gold);opacity:.8}
.slot.add:focus-within{border-color:var(--gold2)}
.sheet-edit{margin-top:18px;width:100%}
.sheet-edit summary{list-style:none;display:inline-flex}
.sheet-edit summary::-webkit-details-marker{display:none}
.sheet-edit[open] summary{margin-bottom:10px}
.sheet-edit .form{text-align:left}

/* pestañas */
.tabs-card{display:grid;grid-template-columns:172px 1fr;min-height:100%}
@media(max-width:1100px){.tabs-card{grid-template-columns:1fr}}
.stabs{display:flex;flex-direction:column;gap:4px;padding:18px 0 18px 0;border-right:1px solid var(--gold-line);background:color-mix(in srgb,var(--night) 35%,transparent)}
@media(max-width:1100px){.stabs{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--gold-line);padding:12px}}
.stab{position:relative;text-align:left;padding:13px 16px 13px 22px;font-family:var(--disp);font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);white-space:nowrap;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%);transition:.2s}
.stab:hover{color:var(--cream);background:rgba(var(--glow1),.06)}
.stab.on{color:var(--cream);background:linear-gradient(90deg,rgba(var(--glow1),.28),rgba(var(--glow1),.05));text-shadow:0 0 12px rgba(var(--glow1),.6)}
.stab.on:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:rgb(var(--glow1));box-shadow:0 0 12px rgb(var(--glow1))}
.stab.gm{color:var(--arcane)}
.stab.dice{margin-top:auto;color:var(--gold)}
.spanes{padding:22px 24px;min-width:0}
.spane{display:none}.spane.on{display:block;animation:fadein .35s}
@keyframes fadein{from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:none}}
.spane-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid var(--gold-line)}
.spane-head h2{font-family:var(--disp);font-weight:600;font-size:16px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold2);padding-left:12px;border-left:3px solid var(--gold)}
.spane.gm-only .spane-head h2{border-color:var(--arcane)}
.gm-tag{font-family:var(--disp);font-weight:600;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--arcane)}
.fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px 16px}
.fields .field{margin:0}
.fields .field.wide,.fields .attr.wide{grid-column:1/-1}
.fields .field.gm>span:after,.attr.gm .attr-name:after{content:" ◆";color:var(--arcane)}
.fields textarea{resize:vertical;min-height:72px}

/* atributos con barra */
.attr{display:grid;grid-template-columns:120px 1fr auto;align-items:center;gap:12px}
@media(max-width:560px){.attr{grid-template-columns:1fr;gap:6px}}
.attr-name{font-family:var(--disp);font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);text-align:right}
@media(max-width:560px){.attr-name{text-align:left}}
.attr-bar{height:14px}
.stat-row{display:flex;align-items:center;gap:6px}
.stat-row input.num{width:56px;text-align:center;font-family:var(--disp);font-weight:600;font-size:18px;padding:5px 4px;color:var(--gold2)}
.stat-row input::-webkit-outer-spin-button,.stat-row input::-webkit-inner-spin-button{-webkit-appearance:none}
.stat-row input[type=number]{-moz-appearance:textfield}
.step{width:30px;height:36px;border:1px solid var(--line);background:var(--input2);color:var(--dim);font-size:16px}
.step:hover{color:var(--cream);border-color:var(--gold)}
.roll-btn{width:40px;height:36px;border:1px solid var(--gold3);background:radial-gradient(circle at 35% 30%,var(--line),var(--input));color:var(--gold2);font-size:17px;transition:.2s}
.roll-btn:hover{border-color:var(--gold2);box-shadow:0 0 14px rgba(var(--glow1),.4)}
.roll-btn.spin{animation:spin .6s}
@keyframes spin{to{transform:rotate(360deg)}}
.btn.roll-btn{width:auto;height:auto}

/* contadores dentro de pestañas */
.counter>span{display:flex;align-items:baseline;gap:8px}
.counter .cval{font-family:var(--disp);font-weight:600;font-size:20px;color:var(--gold2);letter-spacing:0}
.counter small{color:var(--mute);letter-spacing:0;font-family:var(--body);text-transform:none;display:inline-flex;align-items:center;gap:4px}
.counter .cmax{width:64px;padding:2px 6px;font-size:13px;text-align:center}
.counter-btns{display:flex;gap:4px}
.counter-btns button{flex:1;padding:6px 0;border:1px solid var(--line);background:var(--input2);color:var(--dim);font-size:13px}
.counter-btns button:hover{color:var(--cream);border-color:var(--gold)}
.field.check{flex-direction:row;align-items:center;gap:10px}
.field.check input{width:18px;height:18px;accent-color:var(--gold)}
.field.check span{color:var(--cream);text-transform:none;letter-spacing:0;font-family:var(--body);font-size:15px}

/* etiquetas como orbes (hechizos, rasgos) */
.tag-list{display:flex;flex-wrap:wrap;gap:8px;padding:8px;background:var(--input);border:1px solid var(--line);min-height:44px;align-items:center}
.tag.orb{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;background:linear-gradient(180deg,rgba(200,170,110,.18),rgba(200,170,110,.06));border:1px solid rgba(200,170,110,.45);font-size:14px;color:var(--cream);clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px)}
.tag.orb i{font-style:normal;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:12px;color:var(--gold2);background:radial-gradient(circle at 35% 30%,var(--line),var(--input));box-shadow:0 0 0 1px var(--gold3)}
.tag.orb em{font-style:normal}
.tag-x{color:var(--mute);font-size:15px;line-height:1}
.tag-x:hover{color:var(--danger)}
.tag-in{flex:1;min-width:140px;background:transparent!important;border:0!important;padding:4px!important}
[disabled]{opacity:.7}

/* resultado y aviso de tirada */
.roll-result{text-align:center;padding:18px 10px 14px;margin-bottom:8px;border:1px solid var(--line);background:var(--input)}
.roll-result b{display:block;font-family:var(--disp);font-weight:600;font-size:46px;line-height:1;color:var(--cream)}
.roll-result span{display:block;font-size:13px;color:var(--mute);margin-top:6px}
.roll-result.show b{color:rgb(var(--glow1));text-shadow:0 0 18px rgba(var(--glow1),.8)}
.roll-result.crit b{color:#f0d79a;text-shadow:0 0 22px rgba(240,215,154,.9)}
.roll-result.fumble b{color:var(--danger)}
.roll-toast{position:fixed;left:50%;bottom:34px;transform:translateX(-50%);z-index:30;display:flex;align-items:center;gap:14px;padding:12px 22px;background:color-mix(in srgb,var(--night) 92%,transparent);border:1px solid var(--gold);box-shadow:0 20px 50px rgba(0,0,0,.6),0 0 30px rgba(var(--glow1),.25);clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px),0 14px);pointer-events:none}
.roll-toast b{font-family:var(--disp);font-weight:600;font-size:34px;color:rgb(var(--glow1));text-shadow:0 0 16px rgba(var(--glow1),.8);min-width:48px;text-align:center}
.roll-toast.crit b{color:#f0d79a;text-shadow:0 0 22px rgba(240,215,154,.9)}
.roll-toast.fumble b{color:var(--danger)}
.roll-toast span{font-size:14px;color:var(--cream)}

/* editor de plantilla */
.preset-form{display:flex;gap:8px;align-items:center}
.preset-form select{width:auto;font-size:14px}
.sec-edit{padding:16px 18px}
.sec-head{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.sec-title{flex:1;background:transparent;border:0;border-bottom:1px solid rgba(200,170,110,.35);padding:6px 2px;font-family:var(--disp);font-weight:600;font-size:16px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold2)}
.sec-title:focus{outline:none;border-color:var(--gold)}
.sec-tools,.field-row{display:flex;gap:6px;align-items:center}
.field-row{padding:8px;margin-bottom:6px;background:var(--input);border:1px solid var(--line);flex-wrap:wrap}
.field-row .grip{color:var(--mute);cursor:default;font-size:13px}
.field-row input,.field-row select{background:var(--input2);border:1px solid var(--line);padding:7px 9px;color:var(--cream);font-size:14px}
.field-row input:focus,.field-row select:focus{outline:none;border-color:var(--gold)}
.f-label{flex:1;min-width:160px}
.f-type{width:170px}
.f-extra{display:flex;gap:6px;flex-wrap:wrap}
.f-extra input{width:120px}.f-extra .f-min,.f-extra .f-max{width:70px}.f-extra .f-options{width:260px}
.ico{width:28px;height:28px;border:1px solid var(--line);background:var(--input2);color:var(--dim);font-size:14px}
.ico:hover{color:var(--cream);border-color:var(--gold)}
.ico.danger:hover{color:var(--danger);border-color:var(--danger)}
.add-field{margin-top:4px}
@media(max-width:700px){.wrap{width:calc(100% - 24px)}.panel{padding:16px}.fields{grid-template-columns:1fr}.sheet-side{position:static}header.top nav{gap:12px}.user b{display:none}}

/* ---------- mundos: mismo dorado, fondos con matiz ---------- */
body.world-escuela{--night:#0a0814;--deep:#120e22;--panel:#151030;--panel2:#1c1640;--line:#2b2450;--bg1:#191330;--bg2:#0a0814;--glow1:143,108,242;--glow2:72,216,255;--card1:#1d1740;--card2:#0f0b1f;--input:#0b0818;--input2:#120e26}
body.world-fantasia{--night:#0e0b07;--deep:#1a140c;--panel:#221a10;--panel2:#2c2214;--line:#463420;--bg1:#241a10;--bg2:#0e0b07;--glow1:200,150,80;--glow2:120,150,80;--card1:#2c2214;--card2:#130e08;--input:#120d07;--input2:#1a130b}
body.world-terror{--night:#0e0607;--deep:#1a0b0d;--panel:#220e11;--panel2:#2c1216;--line:#4a1e24;--bg1:#241016;--bg2:#0e0607;--glow1:200,60,70;--glow2:120,40,90;--card1:#2c1216;--card2:#14080a;--input:#120608;--input2:#1a0a0d}
body.world-espacio{--night:#050a14;--deep:#0a1425;--panel:#0d1b2e;--panel2:#12233a;--line:#1c3350;--bg1:#0b1a2e;--bg2:#050a14;--glow1:72,216,255;--glow2:60,120,220}
body.world-otro{--night:#070e0b;--deep:#0d1a14;--panel:#10221a;--panel2:#152c22;--line:#22483a;--bg1:#12261c;--bg2:#070e0b;--glow1:80,200,140;--glow2:200,170,110;--card1:#152c22;--card2:#0a1610;--input:#08120d;--input2:#0d1a13}

/* barra de vista del máster */
.viewbar{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px;padding:12px 16px;font-size:14px;color:var(--cream);border:1px solid rgba(143,108,242,.5);background:rgba(143,108,242,.1);clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.viewbar.player{border-color:rgba(72,216,255,.5);background:rgba(72,216,255,.08)}
.viewbar b{color:var(--gold2)}
@media(max-width:480px){header.top nav{gap:10px;font-size:11px}.hud{padding:10px 12px}.hud-state{display:none}}

/* transición de ambientación (al elegir mundo) */
.form input,.form textarea,.form select,.world-opt,.chip,.slot,.roll-list li,.stabs{transition:background-color .9s ease,border-color .9s ease,box-shadow .3s ease}
body.app{transition:background-color .9s ease}
.world-opt:has(input:checked){transition:background-color .35s ease,border-color .35s ease,box-shadow .35s ease}

/* figura 3D */
.figure-btn{margin-top:14px}
.figure-modal[hidden]{display:none}
.figure-modal{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:20px;background:rgba(3,5,10,.78);backdrop-filter:blur(8px)}
.figure-box{position:relative;width:min(900px,100%);height:min(720px,calc(100vh - 40px));display:flex;flex-direction:column;background:linear-gradient(180deg,color-mix(in srgb,var(--panel2) 92%,transparent),color-mix(in srgb,var(--night) 96%,transparent));border:1px solid var(--gold);box-shadow:0 40px 100px rgba(0,0,0,.7),0 0 60px rgba(var(--glow1),.18);clip-path:polygon(22px 0,calc(100% - 22px) 0,100% 22px,100% calc(100% - 22px),calc(100% - 22px) 100%,22px 100%,0 calc(100% - 22px),0 22px)}
.figure-head{padding:18px 26px 8px;text-align:center}
.figure-head h2{font-family:var(--disp);font-weight:700;font-size:22px;letter-spacing:.14em;text-transform:uppercase;color:var(--cream)}
.figure-view{flex:1;position:relative;min-height:0}
.figure-view canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block;touch-action:none}
.figure-view:before{content:"";position:absolute;left:50%;bottom:8%;width:70%;height:30%;transform:translateX(-50%);background:radial-gradient(ellipse at center,rgba(var(--glow1),.22),transparent 65%);pointer-events:none}
.figure-hint{padding:10px;text-align:center;font-family:var(--body);font-weight:600;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.figure-close{position:absolute;right:18px;top:12px;width:36px;height:36px;font-size:24px;color:var(--dim);border:1px solid var(--line);background:var(--input);z-index:2}
.figure-close:hover{color:var(--cream);border-color:var(--gold)}

/* ---------- repaso responsive: selectores, táctil y espaciados ---------- */
.form select,.fields select,.preset-form select,.music select{appearance:none;-webkit-appearance:none;padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c8aa6e' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:16px;cursor:pointer;line-height:1.3}
.form select:focus,.fields select:focus{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f0d79a' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 15l-6-6-6 6'/%3E%3C/svg%3E")}
.form select option,.fields select option{background:#0b1526;color:#f0e6d2}
.fields input:not([type=checkbox]):not([type=number]),.fields select,.fields textarea,.form input:not([type=radio]):not([type=checkbox]):not([type=file]),.form select,.form textarea{min-height:44px}
.fields .field>span,.form .field>span{line-height:1.3;margin-bottom:2px}
.fields{gap:14px 16px}
.stat-row{flex-wrap:nowrap}
.stat-row .step,.roll-btn{min-width:40px;height:40px}
.stat-row input.num{height:40px}
.counter-btns button{min-height:38px}
.tag-in{min-height:0}
.stabs .stab{flex:none}

@media(max-width:1100px){
  .stabs{gap:6px;padding:12px 14px;scrollbar-width:thin}
  .stab{padding:11px 14px 11px 16px}
  .stab.dice{margin-top:0;margin-left:auto}
  .spanes{padding:18px 18px 22px}
}
@media(max-width:900px){
  .screen-grid{gap:14px}
  .stage-card{padding:22px 16px 18px}
  .portrait{width:170px;height:170px}
  .av.huge{width:144px;height:144px;font-size:54px}
  .hud{padding:10px 14px;gap:10px}
  .hud-chips{width:100%;order:3}
  .hud-state{margin-left:auto}
}
@media(max-width:700px){
  main.wrap{padding-top:18px}
  .fields{grid-template-columns:1fr;gap:14px}
  .fields input,.fields select,.fields textarea,.form input,.form select,.form textarea,.quick-roll input,.counter .cmax{font-size:16px}
  .attr{grid-template-columns:1fr;gap:8px}
  .attr-name{text-align:left}
  .stat-row{justify-content:flex-start}
  .stat-row input.num{flex:1;max-width:96px}
  .stat-row .roll-btn{margin-left:auto}
  .vital{grid-template-columns:1fr 54px;grid-template-areas:"lab lab" "bar val";gap:4px 10px}
  .vital>span{grid-area:lab;text-align:left;font-size:10.5px;letter-spacing:.1em}
  .vital .bar{grid-area:bar}
  .vital b{grid-area:val;text-align:right}
  .slots .tag-list{gap:6px}
  .slot em{font-size:10.5px}
  .viewbar{flex-direction:column;align-items:flex-start;font-size:13.5px}
  .viewbar .btn{width:100%}
  .spane-head{flex-direction:column;align-items:flex-start;gap:6px}
  .spane-head h2{font-size:15px}
  .counter>span{flex-wrap:wrap;row-gap:4px}
  .counter-btns button{font-size:13px;padding:8px 0}
  .quick-roll{gap:6px}
  .quick-roll .btn{padding-inline:16px}
  .roll-toast{left:12px;right:12px;transform:none;justify-content:center;bottom:16px}
  .figure-box{height:calc(100vh - 24px)}
  .figure-modal{padding:12px}
  .page-head{gap:12px}
  .page-head .actions{width:100%}
  .page-head .actions .btn{flex:1;min-width:0;padding-inline:14px}
  .two-col{gap:14px}
  .panel{padding:16px 14px}
  .cards-grid{grid-template-columns:1fr}
  .worlds{grid-template-columns:1fr 1fr}
}
@media(max-width:420px){
  .worlds{grid-template-columns:1fr}
  .slots .tag-list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .chip{font-size:13px;padding:3px 10px}
}

/* repaso 2: HUD móvil, brillo del escenario por debajo del contenido, chips acotados */
.stage-card{isolation:isolate}
.stage-card:before{z-index:-1}
.chip{max-width:220px}
.chip>small{white-space:nowrap}
.chip{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;line-height:1.25;padding-top:5px;padding-bottom:5px}
.chip small{display:block}
@media(max-width:900px){
  .hud{flex-wrap:wrap}
  .hud-back{order:1}
  .hud-state{order:2;margin-left:auto}
  .hud-chips{order:3;flex:0 0 100%;width:100%;gap:6px}
  .chip{max-width:48%;font-size:13.5px}
}
@media(max-width:480px){
  .chip{max-width:47%}
}

/* repaso 3: formulario y botones de cabecera en móvil */
.form>.dim{margin-bottom:14px}
@media(max-width:480px){
  .page-head .actions{flex-direction:column;align-items:stretch}
  .page-head .actions .btn{width:100%}
  .btn{white-space:normal;text-align:center;line-height:1.3}
}

/* repaso 4: ancho máximo del escenario en tablet */
.slots,.slots-head,.vitals{max-width:460px;margin-left:auto;margin-right:auto}
.vitals{margin-top:18px}

/* ---------- casa, escudo y color de acento ---------- */
.sheet.game{--accent:#6a4bc4;--accent-rgb:143,108,242;--accent2:#c8aa6e}
.shield-bg{position:absolute;right:-40px;top:-30px;width:300px;max-width:70%;opacity:.13;z-index:-1;pointer-events:none;filter:saturate(1.1) drop-shadow(0 0 30px rgba(var(--accent-rgb),.4))}
.stage-card:before{background:radial-gradient(circle,rgba(var(--accent-rgb),.2),transparent 60%)}
.sigil{border-color:rgba(var(--accent-rgb),.55)}
.sigil:after{border-color:rgba(var(--accent-rgb),.35);box-shadow:0 0 40px rgba(var(--accent-rgb),.2) inset}
.av.huge{box-shadow:0 0 0 3px var(--accent),0 0 0 6px var(--night),0 0 0 7px rgba(200,170,110,.6),0 18px 40px rgba(0,0,0,.5),0 0 30px rgba(var(--accent-rgb),.35)}
.house-badge{position:absolute;right:6px;bottom:6px;width:54px;height:54px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.6))}
.hud{border-color:rgba(var(--accent-rgb),.45)}
.chip.with-ico{display:inline-flex;align-items:center;gap:8px;padding-left:6px}
.chip.with-ico img{width:26px;height:26px;object-fit:contain}
.chip.with-ico>span{display:inline-flex;flex-direction:column;overflow:hidden;text-overflow:ellipsis}
.stab.on{background:linear-gradient(90deg,rgba(var(--accent-rgb),.32),rgba(var(--accent-rgb),.06));text-shadow:0 0 12px rgba(var(--accent-rgb),.6)}
.stab.on:before{background:rgb(var(--accent-rgb));box-shadow:0 0 12px rgb(var(--accent-rgb))}
.stab:hover{background:rgba(var(--accent-rgb),.08)}
.tag.slot:hover{border-color:var(--accent);box-shadow:0 0 14px rgba(var(--accent-rgb),.35)}
.spane-head h2{border-color:var(--accent)}
.roll-btn:hover{box-shadow:0 0 14px rgba(var(--accent-rgb),.45)}
.figure-box{box-shadow:0 40px 100px rgba(0,0,0,.7),0 0 60px rgba(var(--accent-rgb),.22)}
.form input[type=color]{width:64px;height:40px;padding:2px;border:1px solid var(--line);background:var(--input);cursor:pointer}

/* iconos de casa en la campaña */
.char-card{position:relative}
.char-card .house-ico{position:absolute;top:8px;right:8px;width:28px;height:28px;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}
.char-card.h-gryffindor{border-color:rgba(220,70,60,.55)}.char-card.h-hufflepuff{border-color:rgba(240,200,60,.55)}.char-card.h-ravenclaw{border-color:rgba(80,140,255,.55)}.char-card.h-slytherin{border-color:rgba(60,200,120,.55)}
.members .gm-ico{width:16px;height:16px;vertical-align:-3px;margin-right:4px}

/* ---------- pestañas con icono ---------- */
.stab{display:flex;align-items:center;gap:10px}
.stab i{font-style:normal;font-size:16px;width:22px;text-align:center;flex:none;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}
.stab.gm i{color:var(--arcane)}
.stab span{overflow:hidden;text-overflow:ellipsis}
@media(max-width:1100px){
  .stabs{display:grid;grid-template-columns:repeat(auto-fill,minmax(74px,1fr));gap:6px;padding:12px;overflow:visible;align-content:start}   /* start: si la tarjeta se estira, las filas NO crecen */
  .stab{flex-direction:column;justify-content:center;height:76px;gap:4px;padding:8px 4px;clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 6px,100% calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,0 calc(100% - 6px),0 6px);text-align:center;white-space:normal;font-size:10.5px;letter-spacing:.06em;line-height:1.15;border:1px solid var(--line);background:var(--input)}
  .stab i{font-size:20px;width:auto}
  .stab span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-height:2.4em;overflow-wrap:anywhere;hyphens:auto}
  .stab.on{border-color:var(--accent);background:linear-gradient(180deg,rgba(var(--accent-rgb),.32),rgba(var(--accent-rgb),.08))}
  .stab.on:before{display:none}
  .stab.dice{margin:0;color:var(--gold)}
}
@media(max-width:420px){.stabs{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ---------- mochila ---------- */
.pack-add{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px;align-items:stretch}
.pack-add textarea{flex:1 1 100%;resize:vertical;min-height:52px}
.pack-add input[name=name]{flex:1 1 150px}
.pack-add input[type=number]{flex:0 0 74px}
.pack-add .pi-rar{flex:1 1 118px;max-width:150px}
.pack-add .btn{flex:0 0 auto}
.pack-add input,.pack-add textarea{background:var(--input);border:1px solid var(--line);padding:10px 12px;color:var(--cream);min-height:44px}
.pack-add input:focus,.pack-add textarea:focus{outline:none;border-color:var(--gold)}
.pack-add input[type=number]{text-align:center}
.pack-hint{font-size:13px;margin:0 0 12px}
.pack-list{list-style:none;display:flex;flex-direction:column;gap:6px}
.pack-item{display:grid;grid-template-columns:40px minmax(0,1fr) auto auto;align-items:center;gap:8px;padding:8px 10px;background:var(--input);border:1px solid var(--line);transition:border-color .3s,background-color .3s}
.pack-item.quick{border-color:rgba(200,170,110,.5)}
.pack-item.flash{border-color:var(--accent);background:rgba(var(--accent-rgb),.12)}
.pack-item .ico{font-style:normal;font-size:24px;text-align:center;filter:drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.pi-main{min-width:0}
.pi-main b{display:block;font-weight:600;color:var(--cream);font-size:15px}
.pi-main small{display:block;color:var(--dim);font-size:13px;line-height:1.35;margin-top:2px}
.pi-qty{display:inline-flex;align-items:center;border:1px solid var(--line);background:var(--input2)}
.pi-qty button{width:30px;height:32px;color:var(--dim);font-size:16px}
.pi-qty button:hover{color:var(--cream)}
.pi-qty span{min-width:34px;text-align:center;font-family:var(--disp);font-weight:600;font-size:16px;color:var(--gold2);font-variant-numeric:tabular-nums}
.pi-quick,.pi-edit,.pi-del{width:32px;height:32px;border:1px solid var(--line);background:var(--input2);color:var(--mute);font-size:16px}
.pi-quick.on{color:#f0d79a;border-color:var(--gold);text-shadow:0 0 8px rgba(240,215,154,.8)}
.pi-edit:hover{color:var(--cream);border-color:var(--gold)}
.pi-del:hover{color:var(--danger);border-color:var(--danger)}
.pack-item.editing{grid-template-columns:1fr}
.pi-form{display:grid;grid-template-columns:1fr 84px;gap:8px}
.pi-form textarea{grid-column:1/-1}
.pi-form input,.pi-form textarea{background:var(--input2);border:1px solid var(--line);padding:9px 10px;color:var(--cream)}
.pi-form .btn{justify-self:start}
.pack-list .empty{padding:14px;border:1px dashed var(--line);text-align:center}
.slot b.qty{position:absolute;right:5px;bottom:5px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--gold);color:#1a1206;font-size:11px;font-weight:700;display:grid;place-items:center}
.slot.tag{cursor:pointer;color:inherit;font:inherit}
.slot.add span{font-size:22px;color:var(--gold)}
.slot.add{cursor:pointer}
@media(max-width:700px){
  .pack-add .btn{flex:1 1 100%}
  .pack-item{grid-template-columns:34px minmax(0,1fr) auto;grid-template-areas:"ico main qty" "ico acts acts";row-gap:10px}
  .pack-item .ico{grid-area:ico;align-self:start}.pi-main{grid-area:main}.pi-qty{grid-area:qty;align-self:start}
  .pi-acts{grid-area:acts;justify-self:end}
}

/* pestañas de escritorio: más anchas para que quepan los nombres */
@media(min-width:1101px){
  .tabs-card{grid-template-columns:200px 1fr}
  .stab{font-size:11.5px;letter-spacing:.1em;padding:12px 12px 12px 18px}
  .stab span{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.2}
}

/* chips del HUD uniformes */
.hud-chips{align-items:center}
.chip,.chip.with-ico{display:inline-flex;align-items:center;gap:8px;padding:5px 12px;line-height:1.2;max-width:260px;white-space:normal;overflow:visible;align-self:center}
.chip img{width:26px;height:26px;object-fit:contain;flex:none}
.chip>span{display:flex;flex-direction:column;min-width:0}
.chip small{font-family:var(--body);font-weight:600;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);white-space:nowrap}
.chip .v{font-style:normal;font-size:14px;color:var(--cream);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shield-bg{display:none}

/* escudo bajo la elección de casa */
.house-show{display:flex;align-items:center;gap:20px;padding:16px 18px;background:var(--input);border:1px solid rgba(var(--accent-rgb),.5);clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);transition:border-color .5s}
.house-show.none{border-color:var(--line);opacity:.8}
.house-show img{width:120px;height:130px;object-fit:contain;flex:none;filter:drop-shadow(0 10px 22px rgba(0,0,0,.6))}
.house-show.none img{display:none}
.house-show small{display:block;font-family:var(--disp);font-weight:600;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.house-show b{display:block;font-family:var(--disp);font-weight:600;font-size:20px;letter-spacing:.1em;text-transform:uppercase;color:var(--cream);margin:4px 0 6px}
.house-show p{font-size:14px;color:var(--dim);margin:0}
@media(max-width:560px){.house-show{flex-direction:column;text-align:center}.house-show img{width:100px;height:110px}}
.house-badge[hidden]{display:none}
.chip,.chip.with-ico{flex-direction:row}
.fields .house-show{grid-column:1/-1}

/* ---------- imagen de fondo de la campaña, velada ---------- */
.world-img{position:fixed;inset:0;z-index:0;background-size:cover;background-position:center;filter:saturate(.75) contrast(.95);pointer-events:none}
body.has-bg{--veil:.72}
body.has-bg #bg{mix-blend-mode:normal}

/* ---------- panel de administración ---------- */
.admin-link{color:var(--gold2)!important}
.flash.admin{border-color:rgba(143,108,242,.5);background:rgba(143,108,242,.1)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:18px}
.stat-tile{padding:14px 16px;background:var(--input);border:1px solid var(--line);clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.stat-tile b{display:block;font-family:var(--disp);font-weight:600;font-size:28px;color:var(--gold2);line-height:1}
.stat-tile span{font-family:var(--body);font-weight:600;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.table-wrap{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{text-align:left;font-family:var(--disp);font-weight:600;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);padding:8px 10px;border-bottom:1px solid rgba(200,170,110,.3);white-space:nowrap}
.tbl td{padding:10px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl tr.blocked td{opacity:.55}
.tbl .strong{font-weight:600;color:var(--cream)}
.tbl .strong:hover{color:var(--gold2)}
.ucell{display:flex;align-items:center;gap:10px}
.ucell img{width:34px;height:34px;border-radius:50%;border:1px solid var(--gold3)}
.ucell b{display:block;color:var(--cream)}
.ucell small{color:var(--mute);font-size:12px}
.role-pill{display:inline-block;padding:3px 9px;font-family:var(--body);font-weight:600;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;border:1px solid;clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 6px,100% calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,0 calc(100% - 6px),0 6px)}
.role-pill.admin{color:var(--gold2);border-color:var(--gold)}
.role-pill.master{color:var(--arcane);border-color:rgba(143,108,242,.7)}
.role-pill.player{color:var(--hex2);border-color:rgba(72,216,255,.6)}
.role-pill.off{color:var(--danger);border-color:rgba(255,107,107,.6)}
.acts{white-space:nowrap}
.acts form,.inline{display:inline-flex;gap:4px;align-items:center;vertical-align:middle}
.mini{width:30px;height:30px;border:1px solid var(--line);background:var(--input2);color:var(--dim);font-size:14px}
.mini:hover{color:var(--cream);border-color:var(--gold)}
.mini.danger:hover{color:var(--danger);border-color:var(--danger)}
.inline select{background:var(--input);border:1px solid var(--line);color:var(--cream);padding:5px 28px 5px 8px;font-size:13px;max-width:150px;min-height:30px;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c8aa6e' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;background-size:12px}

/* invitaciones y cesión del máster */
.badge{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--gold);color:#1a1206;font:700 10px/1 var(--body);vertical-align:2px;margin-left:4px}
.invites{list-style:none;display:flex;flex-direction:column;gap:10px}
.invites li{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding:12px 14px;background:var(--input);border:1px solid rgba(200,170,110,.35)}
.invites li b{display:block;font-family:var(--disp);font-weight:600;font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--cream)}
.invites li small{color:var(--dim);font-size:13.5px}
.invites .actions{margin:0}
.members .x.crown{font-size:15px;opacity:.7}
.members .x.crown:hover{opacity:1;color:var(--gold2)}
.members.pending li{opacity:.75}
.copy-row select{flex:1;min-width:0;background:var(--input);border:1px solid var(--line);color:var(--cream);padding:8px 34px 8px 10px;font-size:14px;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c8aa6e' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:14px}

/* ---------- perfil ---------- */
a.user:hover b{color:var(--gold2)}
.profile-card{display:flex;gap:22px;align-items:flex-start}
.pavatar{width:112px;height:112px;border-radius:50%;flex:none;box-shadow:0 0 0 3px var(--gold3),0 0 0 6px var(--night),0 0 0 7px rgba(200,170,110,.5)}
.pname{font-family:var(--disp);font-weight:700;font-size:24px;letter-spacing:.08em;text-transform:uppercase;color:var(--cream);line-height:1.1}
.pmeta{color:var(--mute);font-size:13.5px;margin-top:4px}
.pbadges{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 14px}
.pdata{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px 16px}
.pdata dt{font-family:var(--body);font-weight:600;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.pdata dd{color:var(--cream);font-size:15px;margin:2px 0 0}
.plist{list-style:none;display:flex;flex-direction:column;gap:6px}
.plist a{display:block;padding:9px 12px;background:var(--input);border:1px solid var(--line);transition:.2s}
.plist a:hover{border-color:var(--gold)}
.plist b{display:block;font-family:var(--disp);font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--cream)}
.plist small{color:var(--mute);font-size:13px}
@media(max-width:560px){.profile-card{flex-direction:column;align-items:center;text-align:center}.pbadges{justify-content:center}}

/* ---------- ficha de jugador (perfil) ---------- */
.player-card{position:relative;overflow:hidden;margin-bottom:18px;background:linear-gradient(160deg,var(--card1),var(--card2));border:1px solid var(--line);clip-path:polygon(18px 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%,0 18px)}
.player-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,transparent,var(--pa),transparent);z-index:2}
.pc-banner{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.3;filter:saturate(.65)}
.pc-banner:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--card2) 6%,rgba(10,20,37,.62) 55%,rgba(10,20,37,.9))}
.pc-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(58% 120% at 12% 0%,rgba(var(--pa-rgb),.2),transparent 62%)}
.pc-body{position:relative;z-index:1;display:flex;gap:26px;padding:26px 28px}
.pc-portrait{flex:none;width:150px;text-align:center}
.pc-portrait img{width:132px;height:132px;border-radius:50%;box-shadow:0 0 0 3px var(--night),0 0 0 5px var(--pa),0 0 30px rgba(var(--pa-rgb),.4)}
.pc-rank{display:block;margin-top:14px;padding:5px 6px;font-family:var(--body);font-weight:600;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold2);background:rgba(var(--pa-rgb),.12);border:1px solid rgba(var(--pa-rgb),.5);clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px)}
.pc-id{flex:1;min-width:0}
.pc-bio{color:var(--dim);font-size:15px;max-width:70ch;margin-bottom:16px}
.pc-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(86px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:14px}
.pc-stats div{background:rgba(7,16,29,.78);padding:10px 12px}
.pc-stats b{display:block;font-family:var(--disp);font-weight:600;font-size:22px;line-height:1;color:var(--gold2)}
.pc-stats span{font-family:var(--body);font-weight:600;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.pc-stats .crit b{color:var(--hex)}
.pc-stats .fum b{color:var(--danger)}
.pc-foot{display:flex;flex-wrap:wrap;gap:4px 18px;font-size:13px;color:var(--mute)}

/* bloque editable */
.edit-block{padding:0;margin-bottom:20px}
.edit-block>summary{display:flex;align-items:center;gap:12px;padding:15px 20px;cursor:pointer;list-style:none}
.edit-block>summary::-webkit-details-marker{display:none}
.edit-block>summary b{font-family:var(--disp);font-weight:600;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold2)}
.edit-block>summary:hover b{color:var(--cream)}
.edit-block[open]>summary{border-bottom:1px solid var(--line)}
.edit-block>form{padding:20px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.check-line{flex-direction:row!important;align-items:center;gap:8px!important;margin-top:26px}
.check-line span{color:var(--dim);font-size:14px}
.swatches{display:flex;gap:9px;flex-wrap:wrap;padding:4px 0}
.sw{cursor:pointer;line-height:0}
.sw input{position:absolute;width:0;height:0;opacity:0}
.sw i{display:block;width:26px;height:26px;background:var(--s);border:1px solid rgba(255,255,255,.16);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);transition:transform .2s,box-shadow .2s}
.sw:hover i{transform:scale(1.12)}
.sw input:checked+i{box-shadow:0 0 0 2px var(--night),0 0 0 4px var(--gold),0 0 16px var(--s)}

/* registro de tiradas del jugador */
.rlog{list-style:none;display:flex;flex-direction:column;gap:6px}
.rlog li{display:grid;grid-template-columns:52px 1fr auto auto;gap:12px;align-items:center;padding:8px 12px;background:var(--input);border:1px solid var(--line);border-left:2px solid var(--line)}
.rlog li.crit{border-left-color:var(--hex)}
.rlog li.fumble{border-left-color:var(--danger)}
.rlog .tot{font-family:var(--disp);font-weight:600;font-size:22px;color:var(--gold2);text-align:center}
.rlog .who{min-width:0}
.rlog .who b{display:block;font-size:14px;color:var(--cream);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rlog .who small{color:var(--mute);font-size:13px}
.rlog .who a:hover{color:var(--gold2)}
.rlog .det{font-size:13px;color:var(--dim)}
.rlog .det b.c{color:var(--hex)}
.rlog .det b.f{color:var(--danger)}
.rlog .ago{font-size:12.5px;color:var(--mute);white-space:nowrap}

@media(max-width:760px){
  .pc-body{flex-direction:column;align-items:center;text-align:center;gap:16px;padding:22px 16px}
  .pc-portrait{width:auto}
  .pc-portrait img{width:104px;height:104px}
  .pc-id .pbadges,.pc-foot{justify-content:center}
  .pc-bio{margin-inline:auto}
  .grid-2{grid-template-columns:1fr}
  .check-line{margin-top:0;margin-bottom:14px}
  .rlog li{grid-template-columns:46px 1fr;gap:2px 10px}
  .rlog .det,.rlog .ago{grid-column:2}
}

/* tarjetas de personaje: pertenencia y alta */
.char-card .tag{margin-top:2px;padding:2px 8px;font-family:var(--body);font-weight:600;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);border:1px solid var(--line)}
.char-card .tag.gm{color:var(--arcane);border-color:rgba(143,108,242,.45)}
.char-card.new{border-style:dashed;border-color:rgba(200,170,110,.35);justify-content:center}
.char-card.new .av{background:none;box-shadow:0 0 0 2px rgba(200,170,110,.4);font-size:30px;color:var(--gold)}
.char-card.new:hover{border-style:solid}

/* elegir mesa al crear personaje */
.pick-list{display:grid;gap:8px}
.pick{position:relative;cursor:pointer}
.pick input{position:absolute;opacity:0;width:0;height:0}
.pick .pk{display:block;padding:12px 14px;background:var(--input);border:1px solid var(--line);border-left:3px solid var(--line);transition:.2s}
.pick:hover .pk{border-color:rgba(200,170,110,.5)}
.pick input:checked+.pk{border-color:var(--gold);border-left-color:var(--gold2);background:linear-gradient(90deg,rgba(200,170,110,.1),var(--input) 60%);box-shadow:0 0 0 1px rgba(200,170,110,.25)}
.pick b{display:block;font-family:var(--disp);font-weight:600;font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--cream)}
.pick small{color:var(--mute);font-size:13px}
.pick input:checked+.pk b{color:var(--gold2)}

/* zona peligrosa: borrar campaña / dejar la mesa */
.btn-danger{color:#ffd9d9;background:linear-gradient(180deg,rgba(255,107,107,.22),rgba(140,30,30,.5));border:1px solid rgba(255,107,107,.55)}
.btn-danger:hover{filter:brightness(1.2)}
.danger-zone{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,107,107,.28)}
.danger-zone .k{color:var(--danger)}
.danger-zone p{font-size:13.5px;margin:6px 0 12px}
.danger-zone .field b{color:var(--gold2);font-family:var(--disp);font-weight:600;letter-spacing:.06em}

/* PNJ e invitación */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.char-card.npc{border-color:rgba(143,108,242,.45);background:linear-gradient(180deg,rgba(143,108,242,.08),var(--input))}
.npc-chk{display:flex;gap:10px;align-items:flex-start;margin:2px 0 16px;padding:12px 14px;background:rgba(143,108,242,.08);border:1px solid rgba(143,108,242,.3)}
.npc-chk input{margin-top:3px;flex:none}
.npc-chk span{font-size:13.5px;color:var(--dim);line-height:1.5}
.npc-chk b{color:var(--arcane);font-family:var(--disp);font-weight:600;font-size:13px;letter-spacing:.1em;text-transform:uppercase}
.npc-badge{display:inline-block;vertical-align:middle;margin-left:8px;padding:3px 8px;font-family:var(--body);font-weight:600;font-size:10.5px;letter-spacing:.1em;color:var(--arcane);border:1px solid rgba(143,108,242,.6);background:rgba(143,108,242,.1)}

/* puerta de entrada por invitación */
.btn-big{padding:16px 34px;font-size:14px}
.join-card{position:relative;overflow:hidden;max-width:720px;margin-inline:auto}
.join-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.22}
.join-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,10,20,.6),var(--panel) 88%)}
.join-in{position:relative}
.join-meta{display:flex;align-items:center;gap:12px;margin:16px 0}
.join-meta img{width:46px;height:46px;border-radius:50%;border:1px solid var(--gold3)}
.join-meta b{display:block;font-family:var(--disp);font-weight:600;font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--cream)}
.join-meta small{color:var(--mute);font-size:13.5px}
.join-desc{color:var(--dim);font-size:15px;margin-bottom:20px}
.join-steps{list-style:none;counter-reset:s;display:grid;gap:10px;margin:0 0 22px}
.join-steps li{counter-increment:s;position:relative;padding:12px 14px 12px 52px;background:var(--input);border:1px solid var(--line)}
.join-steps li:before{content:counter(s);position:absolute;left:13px;top:11px;width:26px;height:26px;display:grid;place-items:center;font-family:var(--disp);font-weight:600;font-size:13px;color:var(--gold2);background:linear-gradient(180deg,rgba(200,170,110,.3),rgba(200,170,110,.12));clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.join-steps b{display:block;font-family:var(--disp);font-weight:600;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--cream)}
.join-steps span{font-size:14px;color:var(--mute)}
.join-foot{font-size:13px;text-align:center;margin-top:14px}

/* ======================================================================
   Capa de acabado: luz, cristal, bisel y marcos dorados
   ====================================================================== */
:root{
  --hi:rgba(255,255,255,.14);          /* filo de luz superior */
  --sink:rgba(0,0,0,.55);              /* hueco hundido */
  --gold-soft:rgba(200,170,110,.5);
  --glass:blur(14px) saturate(1.15);
}

/* --- cristal en paneles y tarjetas -------------------------------- */
.panel,.stage-card,.tabs-card,.hud,.player-card,.join-card{
  -webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);
  background-image:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.018) 26%,rgba(0,0,0,.16));
  box-shadow:inset 0 1px 0 var(--hi),inset 0 -60px 90px -70px rgba(0,0,0,.9);
}
.panel.gold-edge{box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 0 0 1px rgba(200,170,110,.16),inset 0 -60px 90px -70px rgba(0,0,0,.9);filter:drop-shadow(0 0 22px rgba(200,170,110,.10))}
.panel:hover{border-color:rgba(200,170,110,.4)}

/* --- marco dorado de esquinas (estilo Arcane) --------------------- */
.ornate:after{
  content:"";position:absolute;inset:7px;pointer-events:none;z-index:3;opacity:.75;
  --c:var(--gold-soft);--l:20px;
  background:
    linear-gradient(var(--c),var(--c)) 0 0/var(--l) 1px no-repeat,
    linear-gradient(var(--c),var(--c)) 0 0/1px var(--l) no-repeat,
    linear-gradient(var(--c),var(--c)) 100% 0/var(--l) 1px no-repeat,
    linear-gradient(var(--c),var(--c)) 100% 0/1px var(--l) no-repeat,
    linear-gradient(var(--c),var(--c)) 0 100%/var(--l) 1px no-repeat,
    linear-gradient(var(--c),var(--c)) 0 100%/1px var(--l) no-repeat,
    linear-gradient(var(--c),var(--c)) 100% 100%/var(--l) 1px no-repeat,
    linear-gradient(var(--c),var(--c)) 100% 100%/1px var(--l) no-repeat;
}
.stage-card,.player-card,.join-card,.panel.gold-edge{position:relative}
.stage-card:after,.player-card:after,.join-card:after,.panel.gold-edge:after{
  content:"";position:absolute;inset:7px;pointer-events:none;z-index:3;opacity:.6;
  --c:var(--gold-soft);--l:22px;
  background:
    linear-gradient(var(--c),var(--c)) 0 0/var(--l) 1px no-repeat,
    linear-gradient(var(--c),var(--c)) 0 0/1px var(--l) no-repeat,
    linear-gradient(var(--c),var(--c)) 100% 0/var(--l) 1px no-repeat,
    linear-gradient(var(--c),var(--c)) 100% 0/1px var(--l) no-repeat,
    linear-gradient(var(--c),var(--c)) 0 100%/var(--l) 1px no-repeat,
    linear-gradient(var(--c),var(--c)) 0 100%/1px var(--l) no-repeat,
    linear-gradient(var(--c),var(--c)) 100% 100%/var(--l) 1px no-repeat,
    linear-gradient(var(--c),var(--c)) 100% 100%/1px var(--l) no-repeat;
}

/* --- botones con volumen, brillo y pulsación ---------------------- */
.btn{overflow:hidden;transition:transform .15s,filter .2s,box-shadow .2s}
.btn:before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 35%,rgba(255,255,255,.5) 48%,transparent 62%);transform:translateX(-130%);transition:transform .55s ease;pointer-events:none}
.btn:hover:before{transform:translateX(130%)}
.btn-gold{background:linear-gradient(180deg,#fbeec2 0%,#e6ca8d 18%,#c8aa6e 52%,#a2813f 78%,#7d5f2a 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.75),inset 0 -2px 4px rgba(0,0,0,.35);filter:drop-shadow(0 3px 12px rgba(200,170,110,.28))}
.btn-gold:hover{filter:drop-shadow(0 4px 20px rgba(240,215,154,.5)) brightness(1.06)}
.btn-line{background:linear-gradient(180deg,rgba(200,170,110,.2),rgba(200,170,110,.04));box-shadow:inset 0 0 0 1px var(--gold),inset 0 1px 0 rgba(255,255,255,.16)}
.btn-line:hover{background:linear-gradient(180deg,rgba(200,170,110,.34),rgba(200,170,110,.1));filter:drop-shadow(0 0 16px rgba(200,170,110,.35))}
.btn-danger:hover{filter:drop-shadow(0 0 16px rgba(255,107,107,.4)) brightness(1.15)}
.btn:active{transform:translateY(1px) scale(.995);filter:brightness(.94)}
.btn[disabled]{filter:grayscale(.7) brightness(.7);box-shadow:none}

/* --- huecos de objeto: nicho hundido con reflejo ------------------- */
.slot{background:linear-gradient(180deg,#0b1626 0%,#060d19 60%,#08111e 100%);box-shadow:inset 0 2px 7px rgba(0,0,0,.75),inset 0 0 0 1px rgba(255,255,255,.045),inset 0 -8px 14px -10px rgba(72,216,255,.25)}
.slot:before{content:"";position:absolute;left:6%;right:6%;top:4%;height:34%;border-radius:50%;background:linear-gradient(180deg,rgba(255,255,255,.09),transparent);pointer-events:none}
.slot.tag:hover{border-color:var(--gold);box-shadow:inset 0 2px 7px rgba(0,0,0,.6),inset 0 0 0 1px rgba(200,170,110,.5),0 0 0 0 transparent;filter:drop-shadow(0 0 14px rgba(200,170,110,.35));transform:translateY(-1px)}
.slot.empty{background:linear-gradient(180deg,rgba(10,20,37,.5),rgba(5,10,20,.6));box-shadow:inset 0 2px 6px rgba(0,0,0,.5)}
.slot.empty:before{display:none}
.slot .qty{position:absolute;right:4px;bottom:4px;padding:1px 5px;font-family:var(--body);font-weight:700;font-size:11px;color:var(--night);background:linear-gradient(180deg,#f0d79a,#c8aa6e);border-radius:2px}

/* --- rareza: marcos de color como en los juegos ------------------- */
.slot.r-poco{border-color:rgba(120,220,140,.65)}
.slot.r-poco:before{background:linear-gradient(180deg,rgba(120,220,140,.16),transparent)}
.slot.r-rara{border-color:rgba(90,170,255,.7)}
.slot.r-rara:before{background:linear-gradient(180deg,rgba(90,170,255,.2),transparent)}
.slot.r-legend{border-color:rgba(240,200,110,.85)}
.slot.r-legend:before{background:linear-gradient(180deg,rgba(240,200,110,.25),transparent)}
.slot.r-legend{box-shadow:inset 0 2px 7px rgba(0,0,0,.7),inset 0 0 0 1px rgba(240,215,154,.55),inset 0 0 18px rgba(200,170,110,.28)}
.slot.r-rara{box-shadow:inset 0 2px 7px rgba(0,0,0,.7),inset 0 0 16px rgba(90,170,255,.22)}
.slot.r-poco{box-shadow:inset 0 2px 7px rgba(0,0,0,.7),inset 0 0 16px rgba(120,220,140,.18)}
.pack-item.r-poco{border-left:3px solid rgba(120,220,140,.7)}
.pack-item.r-rara{border-left:3px solid rgba(90,170,255,.75)}
.pack-item.r-legend{border-left:3px solid rgba(240,200,110,.9);background-image:linear-gradient(90deg,rgba(200,170,110,.10),transparent 45%)}
.pi-rar{background:var(--input);border:1px solid var(--line);color:var(--cream);padding:0 8px;min-height:44px}



/* --- barras de estado con brillo ---------------------------------- */
.vital .bar,.mini-bar i{box-shadow:inset 0 1px 3px rgba(0,0,0,.7)}
.vital .bar i:after,.mini-bar i:after{box-shadow:inset 0 1px 0 rgba(255,255,255,.45)}

/* --- pestañas de la ficha ----------------------------------------- */
.stab{transition:background .2s,color .2s,box-shadow .2s}
.stab.on{background:linear-gradient(90deg,rgba(var(--glow1),.34),rgba(var(--glow1),.06));box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.stabs .stab:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}

/* --- campos: hundidos, con foco dorado ---------------------------- */
.form input:not([type=file]),.form textarea,.fields input,.fields textarea,.pack-add input,.pack-add textarea,.quick-roll input,.copy-row input{
  background-image:linear-gradient(180deg,rgba(0,0,0,.35),rgba(255,255,255,.03));
  box-shadow:inset 0 2px 5px rgba(0,0,0,.5)
}
select,.pi-rar{box-shadow:inset 0 2px 5px rgba(0,0,0,.45)}   /* la flecha va en background-image: no lo tocamos */
.form input:focus,.form textarea:focus,.form select:focus,.fields input:focus,.fields textarea:focus,.fields select:focus,.pack-add input:focus,.pack-add textarea:focus,.quick-roll input:focus{
  box-shadow:inset 0 2px 5px rgba(0,0,0,.4),0 0 0 2px rgba(200,170,110,.22),0 0 18px rgba(200,170,110,.18)
}

/* --- tarjetas de personaje y campaña ------------------------------ */
.char-card,.camp-card{transition:transform .2s,border-color .2s,filter .25s}
.char-card:hover,.camp-card:hover{filter:drop-shadow(0 8px 22px rgba(0,0,0,.55)) drop-shadow(0 0 14px rgba(200,170,110,.16))}
.char-card .av,.pc-portrait img,.pavatar{box-shadow:0 0 0 2px var(--gold3),0 0 0 4px #07101d,0 6px 18px rgba(0,0,0,.6)}

/* --- barras de desplazamiento ------------------------------------- */
*{scrollbar-width:thin;scrollbar-color:rgba(200,170,110,.45) transparent}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:rgba(0,0,0,.25)}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(200,170,110,.55),rgba(122,95,46,.55));border:2px solid transparent;background-clip:padding-box;border-radius:8px}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,rgba(240,215,154,.8),rgba(200,170,110,.6));background-clip:padding-box}

@media (prefers-reduced-motion:reduce){.btn:before{display:none}}
@media(max-width:700px){.panel,.stage-card,.tabs-card,.hud,.player-card,.join-card{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}}

/* ======================================================================
   Marcos gruesos: bisel metálico en las cajas grandes y en los huecos
   ====================================================================== */
:root{--bevel-hi:rgba(255,246,222,.55);--bevel-lo:rgba(3,7,14,.9);--bevel:rgba(200,170,110,.55)}

/* --- cajas grandes: línea negra + bisel dorado + luz arriba -------- */
.panel,.stage-card,.tabs-card,.player-card,.join-card,.hud{
  border:1px solid var(--bevel);
  box-shadow:
    inset 0 0 0 1px rgba(3,7,14,.55),                /* filo oscuro bajo el metal */
    inset 0 1px 0 1px rgba(255,255,255,.07),         /* luz que resbala por arriba */
    inset 0 -14px 26px -18px rgba(0,0,0,.9),         /* peso abajo */
    inset 0 1px 0 var(--hi);
}
.panel:hover{border-color:rgba(220,190,130,.7)}
.panel.gold-edge{border-color:rgba(240,215,154,.8);filter:drop-shadow(0 0 26px rgba(200,170,110,.16))}
.stage-card,.tabs-card{border-color:rgba(200,170,110,.5)}
.hud{border-color:rgba(200,170,110,.5)}
.flash{border-width:1px}
.panel-head{border-bottom:1px solid rgba(200,170,110,.3);box-shadow:0 1px 0 rgba(255,255,255,.05)}

/* --- huecos: barra rápida de juego -------------------------------- */
.slot{
  border:2px solid rgba(140,178,224,.45);
  box-shadow:
    inset 0 0 0 1px rgba(0,0,0,.85),
    inset 0 3px 9px rgba(0,0,0,.8),
    inset 0 -16px 22px -18px rgba(72,216,255,.5),
    inset 0 1px 0 rgba(255,255,255,.07);
}
.slot.tag:hover{border-color:rgba(255,246,222,.9);background:linear-gradient(180deg,#2b4a72 0%,#16304f 55%,#0d1e34 100%);box-shadow:inset 0 0 0 1px rgba(0,0,0,.8),inset 0 2px 8px rgba(0,0,0,.5),inset 0 -14px 24px -14px rgba(120,200,255,.55),inset 0 1px 0 rgba(255,255,255,.22);filter:drop-shadow(0 0 16px rgba(140,200,255,.35))}
.slot.empty{border-color:rgba(126,164,214,.16);border-style:dashed}
.slot.add{border-width:2px}
.slot.r-poco{border-color:rgba(120,220,140,.75)}
.slot.r-rara{border-color:rgba(90,170,255,.8)}
.slot.r-legend{border-color:rgba(240,215,154,.95);filter:drop-shadow(0 0 10px rgba(200,170,110,.28))}

/* --- tarjetas de personaje y campaña: mismo bisel ------------------ */
.char-card,.camp-card,.pack-item,.rlog li,.plist a,.stat-tile,.pick .pk,.world-opt{
  border-width:1px;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.07),inset 0 -12px 20px -16px rgba(0,0,0,.9);
}
.char-card:hover,.camp-card:hover{border-color:rgba(240,215,154,.8)}
.char-card.own{border-color:rgba(72,216,255,.55)}

/* --- separadores y filos de la ficha ------------------------------- */
.sheet.game{--gold-line:rgba(200,170,110,.5)}
.stabs{border-right-width:1px}
@media(max-width:1100px){.stabs{border-right-width:0;border-bottom-width:1px}}
.stab.on{box-shadow:inset 0 0 0 1px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.16)}
@media(max-width:1100px){.stab{border-width:2px}.stab.on{border-color:var(--accent);box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 0 0 16px rgba(var(--accent-rgb),.35)}}

/* --- interruptores y casillas con marco metálico ------------------- */
.chk input[type=checkbox],.check-line input[type=checkbox],.fields input[type=checkbox]{
  appearance:none;-webkit-appearance:none;width:20px;height:20px;flex:none;cursor:pointer;
  background:linear-gradient(180deg,#0b1626,#060d19);
  border:2px solid rgba(200,170,110,.5);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.85),inset 0 2px 5px rgba(0,0,0,.7);
  display:inline-grid;place-items:center;transition:.15s
}
.chk input[type=checkbox]:hover,.check-line input[type=checkbox]:hover,.fields input[type=checkbox]:hover{border-color:var(--gold2)}
.chk input[type=checkbox]:checked,.check-line input[type=checkbox]:checked,.fields input[type=checkbox]:checked{
  background:linear-gradient(180deg,#f0d79a,#c8aa6e 55%,#8f6e34);border-color:rgba(255,246,222,.8)
}
.chk input[type=checkbox]:checked:after,.check-line input[type=checkbox]:checked:after,.fields input[type=checkbox]:checked:after{
  content:"";width:10px;height:6px;border-left:2.5px solid #1a1206;border-bottom:2.5px solid #1a1206;transform:rotate(-45deg) translate(1px,-1px)
}

/* hueco vacío: aro visible y marca interior punteada (como la barra rápida) */
.slot.empty{border-style:solid;border-color:rgba(140,178,224,.26);opacity:1;background:linear-gradient(180deg,rgba(11,22,38,.75),rgba(5,10,20,.85))}
.slot.empty:before{display:block;content:"";position:absolute;left:24%;right:24%;top:24%;bottom:24%;height:auto;border-radius:0;border:1px dashed rgba(140,178,224,.28);background:none}
.slot.empty:after{content:none}
.slot.add{border-style:dashed;border-color:rgba(200,170,110,.6)}
.slot.add:hover{border-color:var(--gold2);filter:drop-shadow(0 0 14px rgba(200,170,110,.35))}

/* nombre de personaje siempre en dos líneas: nombre arriba, apellido abajo */
.char-card .nm{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.4em;line-height:1.2;align-self:stretch;text-align:center}
.char-card .nm span{display:block}
.char-card.new .nm{min-height:0}

/* ======================================================================
   Filo continuo en las piezas romboidales: el trazo dorado recorre
   también las diagonales (clip-path recorta bordes y sombras, así que el
   contorno se dibuja como un anillo con hueco dentro del propio recorte)
   ====================================================================== */
.btn:after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:2;
  clip-path:polygon(
    10px 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 10px 100%, 0 50%, 10px 0,
    11.6px 1.5px, 1.8px 50%, 11.6px calc(100% - 1.5px), calc(100% - 11.6px) calc(100% - 1.5px), calc(100% - 1.8px) 50%, calc(100% - 11.6px) 1.5px, 11.6px 1.5px
  );
}
.btn-line:after{background:var(--gold)}
.btn-line:hover:after{background:var(--gold2)}
.btn-gold:after{background:rgba(255,246,214,.6)}
.btn-danger:after{background:rgba(255,107,107,.75)}
.btn:active:after{filter:brightness(.9)}

/* la barra superior de la ficha es la misma forma, con corte de 12 px */
.hud{position:relative}
.hud:after{
  content:"";position:absolute;inset:0;pointer-events:none;background:var(--gold-line);
  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, 12px 0,
    12.9px 1.3px, 1.3px 12.9px, 1.3px calc(100% - 12.9px), 12.9px calc(100% - 1.3px), calc(100% - 12.9px) calc(100% - 1.3px), calc(100% - 1.3px) calc(100% - 12.9px), calc(100% - 1.3px) 12.9px, calc(100% - 12.9px) 1.3px, 12.9px 1.3px
  );
}
.hud{border-color:transparent}

/* el atributo hidden manda: si no, los display:flex/grid lo pisan
   (el aviso de tirada se quedaba flotando vacío en la ficha) */
[hidden]{display:none!important}

/* campos de texto de la ficha: varias líneas, nada de texto perdido a la derecha */
.fields textarea{resize:vertical;min-height:66px;line-height:1.5;overflow-y:auto;font-size:15px}
.fields textarea.grow{min-height:66px;max-height:200px}
.fields textarea.grow.big{min-height:150px;max-height:420px}
.fields .field>span{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.fields .field .cnt{font-family:var(--body);font-weight:600;font-size:11px;letter-spacing:.04em;text-transform:none;color:var(--mute)}
.fields .field .cnt.low{color:var(--ember)}

/* los campos que crecen lo hacen con suavidad al abrir una pestaña */
.fields textarea.grow{transition:height .18s ease}
@media (prefers-reduced-motion:reduce){.fields textarea.grow{transition:none}}

/* ---------- pantalla de inicio: mis mesas ---------- */
.hello{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:22px}
.hello-av{width:72px;height:72px;border-radius:50%;flex:none;box-shadow:0 0 0 2px var(--gold3),0 0 0 4px var(--night),0 6px 18px rgba(0,0,0,.6)}
.hello>div:nth-child(2){flex:1;min-width:220px}
.hello .actions{margin-top:0}
.page-head.sec{align-items:baseline;margin:26px 0 14px}
.page-head.sec .h2{margin:6px 0 0}
.mesas{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px}
.mesa{position:relative;overflow:hidden;background:linear-gradient(160deg,var(--card1),var(--card2));border:1px solid var(--bevel);clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px);box-shadow:inset 0 0 0 1px rgba(3,7,14,.55),inset 0 1px 0 1px rgba(255,255,255,.07),inset 0 -40px 60px -50px rgba(0,0,0,.9);transition:border-color .2s,filter .25s}
.mesa:hover{border-color:rgba(240,215,154,.75);filter:drop-shadow(0 10px 26px rgba(0,0,0,.5))}
.mesa-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.16}
.mesa-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,20,37,.55),var(--card2) 82%)}
.mesa-in{position:relative;padding:18px 20px 20px}
.mesa-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.mesa-top .world{font-family:var(--body);font-size:12px;color:var(--mute)}
.mesa h3{font-family:var(--disp);font-weight:600;font-size:19px;letter-spacing:.05em;text-transform:uppercase;color:var(--cream);line-height:1.15}
.mesa h3 a:hover{color:var(--gold2)}
.mesa-desc{color:var(--dim);font-size:13.5px;margin-top:6px}
.mesa-team{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:14px 0 12px}
.mesa-team .lead{display:flex;align-items:center;gap:8px}
.mesa-team .lead img{width:30px;height:30px;border-radius:50%;border:1px solid var(--gold3)}
.mesa-team small{color:var(--mute);font-size:12px}
.mesa-team b{color:var(--cream);font-weight:600}
.faces{display:flex;align-items:center;margin-left:auto}
.faces img{width:26px;height:26px;border-radius:50%;border:2px solid var(--card2);margin-left:-8px}
.faces i{font-style:normal;font-size:11px;color:var(--mute);margin-left:6px}
.mychar{display:flex;align-items:center;gap:12px;padding:10px 12px;background:var(--input);border:1px solid var(--line);transition:.2s}
.mychar:hover{border-color:var(--gold)}
.mychar .av{width:44px;height:44px;font-size:18px;flex:none}
.mychar small{display:block;font-size:11px;color:var(--mute)}
.mychar b{font-family:var(--disp);font-size:13.5px;letter-spacing:.05em;color:var(--cream)}
.mychar .house-ico{width:26px;height:26px;margin-left:auto;object-fit:contain}
.mychar.empty{border-style:dashed;border-color:rgba(200,170,110,.4)}
.mychar.empty .av{background:none;box-shadow:0 0 0 2px rgba(200,170,110,.4);color:var(--gold)}
.mesa-meta{display:flex;flex-wrap:wrap;gap:4px 14px;margin:12px 0 0;font-size:12px;color:var(--mute)}
.mesa .actions{margin-top:14px}
@media(max-width:560px){.hello{gap:14px}.hello-av{width:56px;height:56px}.mesas{grid-template-columns:1fr}}

/* carta pública de un compañero */
.charcard .big-av{width:132px;height:132px;font-size:44px}
.cardfields{margin-top:14px}
.cardfields .wide{grid-column:1/-1}
.cardnote{font-size:12.5px;margin-top:14px}

/* ---------- monedero ---------- */
.purse{margin-bottom:16px;padding:14px 16px;background:linear-gradient(180deg,rgba(200,170,110,.10),rgba(0,0,0,.18));border:1px solid rgba(200,170,110,.4);clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
.purse.gm{border-color:rgba(143,108,242,.5)}
.purse-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px}
.purse-total{font-family:var(--body);font-weight:600;font-size:13px;color:var(--gold2)}
.purse-coins{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px}
.coin{display:grid;grid-template-columns:34px minmax(0,1fr);grid-template-areas:"face name" "row row";gap:8px 10px;align-items:center;padding:10px 12px 12px;min-width:0;background:var(--input);border:1px solid var(--line)}
.coin-face{grid-area:face;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;font-family:var(--disp);font-weight:700;font-size:15px;color:#2a2008;background:linear-gradient(160deg,#f6e3ac,#d8b45a 55%,#9a7828);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 2px 6px rgba(0,0,0,.5)}
.coin-s .coin-face{background:linear-gradient(160deg,#eef2f6,#b8c2cc 55%,#7d8894);color:#1b2026}
.coin-k .coin-face{background:linear-gradient(160deg,#e0b48a,#b87333 55%,#7a4a1e);color:#2a1608}
.coin-name{grid-area:name;font-family:var(--disp);font-weight:600;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.coin-row{grid-area:row;display:grid;grid-template-columns:32px minmax(0,1fr) 32px;gap:6px;min-width:0}
.coin-row input{width:100%;min-width:0;font-variant-numeric:tabular-nums;background:var(--input2);border:1px solid var(--line);color:var(--cream);padding:4px 6px;text-align:center;font-family:var(--body);font-weight:600;font-size:15px;min-height:34px}
.coin-row input:focus{outline:none;border-color:var(--gold)}
.coin-row button{width:32px;height:34px;border:1px solid var(--line);background:var(--input2);color:var(--gold2);font-size:16px;line-height:1}
.coin-row button:hover{border-color:var(--gold);background:rgba(200,170,110,.14)}
.purse-acts{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:12px}
.purse-quick{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.purse-quick input{width:74px;background:var(--input2);border:1px solid var(--line);color:var(--cream);padding:6px 8px;text-align:center;min-height:36px}
.purse-quick select{background:var(--input2);border:1px solid var(--line);color:var(--cream);padding:6px 8px;min-height:36px}
.purse-tidy{margin:0}
.purse-note{font-size:12px;margin-top:8px}
@media(max-width:560px){.purse-acts{flex-direction:column;align-items:stretch}.purse-quick input{flex:1}}

/* acciones del objeto: un grupo de botones cuadrados, a la derecha */
.pi-acts{display:inline-flex;gap:6px;justify-self:end}
.pi-quick,.pi-edit,.pi-del{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);background:linear-gradient(180deg,var(--input2),var(--input));color:var(--mute);font-size:16px;line-height:1;box-shadow:inset 0 1px 0 rgba(255,255,255,.06);transition:color .15s,border-color .15s,background .15s}
.pi-quick:hover{color:var(--gold2);border-color:var(--gold)}
.pi-quick.on{color:#1a1206;background:linear-gradient(180deg,#f0d79a,#c8aa6e 60%,#8f6e34);border-color:rgba(255,246,222,.7);text-shadow:none}

/* figura 3D: por encima de todo y con salida clara en móvil */
.figure-modal{z-index:200}
.figure-close{width:44px;height:44px;font-size:26px;color:var(--cream);border-color:var(--gold3);background:rgba(7,16,29,.85)}
.figure-foot{display:none;padding:0 20px 18px;justify-content:center}
@media(max-width:700px){
  .figure-modal{padding:10px}
  .figure-box{height:calc(100dvh - 20px)}
  .figure-foot{display:flex}
  .figure-foot .btn{width:100%}
}

/* vista previa de la tarjeta al compartir */
.og-preview{margin:14px 0 6px}
.og-preview img{display:block;width:100%;aspect-ratio:1200/630;object-fit:cover;border:1px solid var(--gold3);box-shadow:0 8px 22px rgba(0,0,0,.5)}
.og-preview figcaption{margin-top:6px;font-size:12px;color:var(--mute)}

/* ---------- mensajería / lechucería ---------- */
.mailbell{position:relative;display:inline-flex;align-items:center;font-size:18px;color:var(--gold2)!important;animation:bellpulse 2.4s ease-in-out infinite}
.mailbell .badge{position:absolute;top:-8px;right:-12px}
@keyframes bellpulse{0%,100%{transform:none}8%{transform:rotate(-12deg)}16%{transform:rotate(10deg)}24%{transform:none}}
@media (prefers-reduced-motion:reduce){.mailbell{animation:none}}
.mail-card{display:flex;align-items:center;gap:14px;text-decoration:none}
.mail-card b{display:block;font-family:var(--body);font-weight:600;font-size:14px;color:var(--cream);margin-top:3px}
.mail-ico{position:relative;flex:none;width:46px;height:46px;display:grid;place-items:center;font-size:24px;color:var(--gold2);background:rgba(200,170,110,.1);border:1px solid rgba(200,170,110,.4);clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px)}
.mail-ico b{position:absolute;top:2px;right:2px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:var(--danger);color:#fff;font:700 11px/18px var(--body);text-align:center}
.mail-card.has-new{border-color:rgba(240,215,154,.8)}
.mail-card.has-new .mail-ico{animation:bellpulse 2.4s ease-in-out infinite}
.mesa-mail{display:block;margin-top:12px;padding:8px 12px;font-size:13px;font-weight:600;color:var(--gold2);background:rgba(200,170,110,.1);border:1px solid rgba(200,170,110,.45)}
.kind-pick{display:flex;gap:8px;flex-wrap:wrap}
.kind-pick label{cursor:pointer}
.kind-pick input{position:absolute;opacity:0;width:0;height:0}
.kind-pick span{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;background:var(--input);border:1px solid var(--line);font-weight:600;font-size:14px;color:var(--dim)}
.kind-pick i{font-style:normal;font-size:18px}
.kind-pick input:checked+span{border-color:var(--gold);color:var(--cream);background:linear-gradient(180deg,rgba(200,170,110,.18),var(--input))}
.to-all{display:flex!important;flex-direction:row!important;align-items:center;gap:8px;margin-bottom:8px;cursor:pointer}
.to-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.to{display:flex;align-items:center;gap:10px;padding:8px 10px;background:var(--input);border:1px solid var(--line);cursor:pointer}
.to:has(input:checked){border-color:var(--gold);background:linear-gradient(90deg,rgba(200,170,110,.14),var(--input))}
.to .av{width:34px;height:34px;font-size:14px;flex:none}
.to b{display:block;font-size:13.5px;color:var(--cream)}.to small{font-size:11.5px;color:var(--mute)}
.sent{list-style:none;display:flex;flex-direction:column;gap:8px}
.sent>li{display:grid;grid-template-columns:22px minmax(0,1fr) auto;grid-template-areas:"sel main act" "sel recs recs";gap:8px 12px;align-items:center;padding:10px 12px;background:var(--input);border:1px solid var(--line)}
.sent>li.off{opacity:.55}
.sent .sel{grid-area:sel}.sent-main{grid-area:main;display:flex;align-items:center;gap:10px;min-width:0}.sent-act{grid-area:act}.recs{grid-area:recs;display:flex;flex-wrap:wrap;gap:6px}
.sent-main i{font-style:normal;font-size:22px}
.sent-main b{display:block;color:var(--cream);font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sent-main small{font-size:12px;color:var(--mute)}
.rec{display:inline-flex;align-items:center;gap:6px;padding:3px 4px 3px 10px;font-size:12.5px;border:1px solid var(--line);background:var(--input2)}
.rec.read{color:var(--hex)}.rec.new{color:var(--gold2)}.rec.off{color:var(--mute);text-decoration:line-through}
.rec button{width:22px;height:22px;display:grid;place-items:center;color:var(--mute);border:1px solid transparent}
.rec button:hover{color:var(--danger);border-color:var(--danger)}
.sent-act .link{margin:0}
.inbox{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.env{position:relative;display:flex;flex-direction:column;gap:10px;padding:14px;background:var(--input);border:1px solid var(--line);text-decoration:none;transition:transform .2s,border-color .2s}
.env:hover{transform:translateY(-2px);border-color:var(--gold)}
.env-art{position:relative;height:96px;background:linear-gradient(180deg,#e9dcb9,#cdb98c);border-radius:3px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(90,70,40,.35),0 6px 14px rgba(0,0,0,.45)}
.env-flap{position:absolute;inset:0 0 auto 0;height:62%;background:linear-gradient(180deg,#d9c79b,#bea773);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;transition:transform .35s}
.env.open .env-flap{transform:scaleY(-1) translateY(12%);opacity:.8}
.env-seal{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-size:16px;background:radial-gradient(circle at 35% 30%,#c0392b,#7a1717 70%);box-shadow:0 2px 6px rgba(0,0,0,.5),inset 0 0 0 3px rgba(0,0,0,.18)}
.env.open .env-seal{opacity:.35;filter:grayscale(.6)}
.world-escuela .env-seal{background:radial-gradient(circle at 35% 30%,#8f6cf2,#4b2a8f 70%)}
.env-txt b{display:block;color:var(--cream);font-size:14px}
.env-txt small{font-size:12px;color:var(--mute)}
.env.new{border-color:rgba(240,215,154,.7);box-shadow:0 0 0 1px rgba(240,215,154,.2),0 0 22px rgba(200,170,110,.15)}
.env-badge{position:absolute;top:10px;right:10px;padding:2px 8px;font:700 10.5px var(--body);letter-spacing:.06em;text-transform:uppercase;color:#1a1206;background:linear-gradient(180deg,#f0d79a,#c8aa6e)}
.letter{position:relative;max-width:720px;margin:0 auto 30px;padding:48px 52px 38px;color:#2c2216;background:
  radial-gradient(ellipse at 20% 10%,rgba(255,255,255,.35),transparent 45%),radial-gradient(ellipse at 85% 90%,rgba(120,90,50,.22),transparent 50%),linear-gradient(180deg,#efe3c4,#e0cfa4);
  box-shadow:0 30px 70px rgba(0,0,0,.6),inset 0 0 60px rgba(120,90,50,.28);border-radius:2px;font-family:Georgia,'Times New Roman',serif}
.letter.k-nota{max-width:520px;padding:36px 38px 30px;transform:rotate(-.6deg)}
.letter-seal{position:absolute;top:-22px;left:50%;transform:translateX(-50%);width:54px;height:54px;border-radius:50%;display:grid;place-items:center;font-size:22px;background:radial-gradient(circle at 35% 30%,#c0392b,#6d1414 70%);box-shadow:0 6px 14px rgba(0,0,0,.5),inset 0 0 0 4px rgba(0,0,0,.18)}
.world-escuela .letter-seal{background:radial-gradient(circle at 35% 30%,#8f6cf2,#3f2380 70%)}
.letter-to{font-style:italic;color:#6b5634;margin-bottom:10px}
.letter-title{font-family:var(--disp);font-weight:700;font-size:24px;letter-spacing:.04em;color:#3a2a14;margin-bottom:16px}
.letter-body{font-size:17px;line-height:1.7}
.letter-img{margin:0 0 18px}.letter-img img{display:block;width:100%;border:8px solid #fbf6e8;box-shadow:0 8px 20px rgba(0,0,0,.35)}
.letter.k-imagen .letter-img img{transform:rotate(-1deg)}
.letter-sign{margin-top:26px;text-align:right;font-style:italic;font-size:19px;color:#3a2a14}
.letter-date{margin-top:18px;font-family:var(--body);font-size:12px;color:#7d6844;text-align:right}
@media(max-width:560px){.letter{padding:40px 22px 28px}.letter-body{font-size:16px}.sent>li{grid-template-columns:22px minmax(0,1fr);grid-template-areas:"sel main" "sel recs" "sel act"}}

/* Mis mesas: "diriges" y "juegas" lado a lado desde tablet vertical */
@media(min-width:720px){
  .mesas-cols.dos{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 clamp(18px,3vw,32px);align-items:start}
  .mesas-cols.dos .mesas{align-content:start}   /* cada tarjeta con su altura: estirar la única de una columna la hacía gigante */
  .mesas-cols.dos .mesas{grid-template-columns:1fr}
}
.mesas-col .page-head.sec{margin-top:26px}

/* ---------- iconos propios ---------- */
.ico{width:1em;height:1em;display:inline-block;vertical-align:-.15em;flex:none}
.mailbell .ico{width:22px;height:22px}
.mail-ico .ico{width:26px;height:26px}
.mesa-mail .ico{width:18px;height:18px;vertical-align:-4px}
.kind-pick .ico{width:19px;height:19px;color:var(--gold)}
.kind-pick input:checked+span .ico{color:var(--gold2)}
.env-seal .ico{width:18px;height:18px;color:#f6e7bf}
.letter-seal .ico{width:24px;height:24px;color:#f6e7bf}

/* ---------- lista de enviados: casilla | icono | texto | acción; destinatarios bajo el texto ---------- */
.sent>li{grid-template-columns:24px minmax(0,1fr) auto;grid-template-areas:"sel main act" ". recs recs";align-items:start;gap:10px 12px;padding:12px 14px}
.sent .sel{margin-top:10px}
.sent-main{align-items:flex-start;gap:12px}
.sent-ico{flex:none;width:38px;height:38px;display:grid;place-items:center;color:var(--gold2);background:rgba(200,170,110,.08);border:1px solid rgba(200,170,110,.35)}
.sent-ico .ico{width:20px;height:20px}
.sent-main>span:last-child{min-width:0;padding-top:1px}
.recs{padding-left:50px}
.sent-act{align-self:center}
.sent-act .link{white-space:nowrap;font-size:13px}
.sent input.sel{appearance:none;-webkit-appearance:none;width:20px;height:20px;cursor:pointer;background:linear-gradient(180deg,#0b1626,#060d19);border:2px solid rgba(200,170,110,.5);box-shadow:inset 0 0 0 1px rgba(0,0,0,.85),inset 0 2px 5px rgba(0,0,0,.7);display:grid;place-items:center}
.sent input.sel:checked{background:linear-gradient(180deg,#f0d79a,#c8aa6e 55%,#8f6e34);border-color:rgba(255,246,222,.8)}
.sent input.sel:checked:after{content:"";width:10px;height:6px;border-left:2.5px solid #1a1206;border-bottom:2.5px solid #1a1206;transform:rotate(-45deg) translate(1px,-1px)}
.rec{padding:4px 4px 4px 10px;gap:8px}
.rec span{white-space:nowrap}

/* ---------- lechucería en móvil ---------- */
@media(max-width:700px){
  .post-gm{gap:0}
  .kind-pick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .kind-pick span{justify-content:center;padding:10px 6px;font-size:13px}
  .to-list{grid-template-columns:1fr}
  .sent>li{grid-template-columns:24px minmax(0,1fr);grid-template-areas:"sel main" ". recs" ". act";padding:12px}
  .recs{padding-left:0}
  .sent-act{justify-self:start}
  .inbox{grid-template-columns:1fr}
  .env{flex-direction:row;align-items:center}
  .env-art{flex:none;width:92px;height:62px}
  .env-seal{width:30px;height:30px}
  .env-badge{top:8px;right:8px}
  .mail-card{padding:14px 16px}
  .letter{margin-top:34px}
  .page-head .actions .btn{width:100%}
}

/* casillas doradas también al elegir destinatarios */
.to input,.to-all input{appearance:none;-webkit-appearance:none;width:20px;height:20px;flex:none;cursor:pointer;margin:0;background:linear-gradient(180deg,#0b1626,#060d19);border:2px solid rgba(200,170,110,.5);box-shadow:inset 0 0 0 1px rgba(0,0,0,.85),inset 0 2px 5px rgba(0,0,0,.7);display:inline-grid;place-items:center}
.to input:checked,.to-all input:checked{background:linear-gradient(180deg,#f0d79a,#c8aa6e 55%,#8f6e34);border-color:rgba(255,246,222,.8)}
.to input:checked:after,.to-all input:checked:after{content:"";width:10px;height:6px;border-left:2.5px solid #1a1206;border-bottom:2.5px solid #1a1206;transform:rotate(-45deg) translate(1px,-1px)}

/* ---------- lechucería: respuestas, espera y cierre ---------- */
.owl-wait{margin:0 0 14px;padding:10px 14px;font-size:14px;color:var(--gold2);background:rgba(200,170,110,.1);border:1px solid rgba(200,170,110,.45)}
.owl-closed{display:flex;align-items:center;gap:16px}
.owl-closed>span{font-size:34px}
.owl-closed b{font-family:var(--disp);letter-spacing:.08em;text-transform:uppercase;color:var(--gold2)}
.owl-toggle{display:flex;gap:10px;align-items:flex-start;margin:6px 0 14px}
.owl-toggle span{display:block}
.owl-toggle b{display:block;font-size:14px;color:var(--cream)}
.owl-toggle small{display:block;font-size:12px;color:var(--mute);line-height:1.45}
.to-list.one{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.to input[type=radio]{border-radius:50%}
.to input[type=radio]:checked:after{width:8px;height:8px;border:0;border-radius:50%;background:#1a1206;transform:none}
.letter-meta{max-width:720px;margin:0 auto 28px;font-size:13px;color:var(--mute);text-align:center}
.letter-meta b{color:var(--cream);font-weight:600}
.letter-parent{display:block;margin:-6px 0 14px;font-family:var(--body);font-size:13px;color:#7d6844;text-decoration:underline dotted;text-underline-offset:3px}
.reply{max-width:720px;margin:0 auto 30px}
.post-gm aside .inbox{grid-template-columns:1fr}
.post-gm aside .env{flex-direction:row;align-items:center}
.post-gm aside .env-art{flex:none;width:86px;height:58px}
.post-gm aside .env-seal{width:28px;height:28px}

/* adjuntar imagen en la respuesta */
.reply-img{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:-2px 0 14px}
.reply-pick{cursor:pointer}
.reply-pick .ico{width:16px;height:16px}
.reply-thumb{position:relative;display:inline-block}
.reply-thumb img{display:block;height:64px;max-width:120px;object-fit:cover;border:3px solid #fbf6e8;box-shadow:0 4px 12px rgba(0,0,0,.45)}
.reply-drop{position:absolute;top:-8px;right:-8px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:14px;color:#fff;background:var(--danger)}
.reply-img small{font-size:12px}

/* ---------- selector de archivos propio ---------- */
.filepick{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 12px;background:rgba(7,16,29,.55);border:1px dashed rgba(200,170,110,.45);transition:border-color .2s,background .2s}
.filepick:hover{border-color:rgba(200,170,110,.7)}
.filepick.drag{border-style:solid;border-color:var(--gold2);background:rgba(200,170,110,.12)}
.filepick.has{border-style:solid;border-color:rgba(200,170,110,.6);background:linear-gradient(90deg,rgba(200,170,110,.10),rgba(7,16,29,.55) 60%)}
.fp-btn{flex:none}
.fp-btn .ico{width:16px;height:16px}
.fp-info{flex:1;min-width:0;font-size:13px;color:var(--mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.filepick.has .fp-info{color:var(--cream);font-weight:600}
.fp-thumb{flex:none;width:52px;height:52px;object-fit:cover;border:2px solid #fbf6e8;box-shadow:0 3px 10px rgba(0,0,0,.45)}
.fp-clear{flex:none;width:28px;height:28px;display:grid;place-items:center;font-size:17px;color:var(--mute);border:1px solid var(--line);background:var(--input2)}
.fp-clear:hover{color:var(--danger);border-color:var(--danger)}
/* reserva por si el JS no llega: al menos el botón no es el del sistema */
input[type=file]::file-selector-button{margin-right:12px;padding:8px 16px;font:600 12px var(--disp);letter-spacing:.14em;text-transform:uppercase;color:var(--gold2);background:linear-gradient(180deg,rgba(200,170,110,.2),rgba(200,170,110,.05));border:1px solid var(--gold);cursor:pointer}
@media(max-width:560px){.fp-info{flex-basis:100%;order:3}}

/* los iconos van a pelo sobre su fondo: sin el marco de la vieja regla .ico (que es de botoncitos) */
svg.ico{border:0;background:none;padding:0;box-shadow:none;color:inherit}   /* el icono toma el color del texto: en los botones dorados sale oscuro */
.pack-item .ico{width:auto;height:auto;border:0;background:none;padding:0}

/* ---------- material gráfico propio ---------- */
/* iconos dorados de las pestañas de la ficha */
.stab i img{display:block;width:22px;height:26px;object-fit:contain;opacity:.72;transition:opacity .2s,filter .2s}
.stab:hover i img{opacity:.95}
.stab.on i img{opacity:1;filter:drop-shadow(0 0 6px rgba(240,215,154,.55))}
@media(max-width:1100px){.stab i img{width:26px;height:30px}}
/* lacre morado en cartas y sobres */
img.letter-seal{top:-38px;width:78px;height:auto;background:none;border-radius:0;box-shadow:none;filter:drop-shadow(0 6px 10px rgba(0,0,0,.45))}
img.env-seal{width:40px;height:auto;background:none;border-radius:0;box-shadow:none;filter:drop-shadow(0 2px 4px rgba(0,0,0,.45))}
.world-escuela img.env-seal,.world-escuela img.letter-seal{background:none}
.env.open img.env-seal{opacity:.45;filter:grayscale(.5) drop-shadow(0 2px 4px rgba(0,0,0,.4))}
@media(max-width:700px){img.env-seal{width:32px}.post-gm aside img.env-seal{width:30px}}
.post-gm aside img.env-seal{width:32px}
/* el lacre asoma 38 px por encima de la carta: que no pise el texto de arriba */
.letter{margin-top:52px}
.letter-meta{margin-bottom:0}

/* ---------- rendimiento: sin desenfoque en vivo sobre el fondo animado ----------
   El fondo cambia en cada fotograma y cada panel con backdrop-filter obligaba a
   volver a desenfocarlo. El aspecto de cristal (translúcido, filo de luz, bordes) se mantiene. */
header.top,.panel,.stage-card,.tabs-card,.hud,.player-card,.join-card,.figure-modal{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
header.top{background-color:color-mix(in srgb,var(--night) 95%,transparent)}
#bg{width:100%;height:100%}

/* cabecera en tablet (iPad vertical): una sola línea, sin desbordar */
header.top .wrap{gap:14px}
header.top nav{white-space:nowrap;min-width:0}
header.top .user b{max-width:16ch;overflow:hidden;text-overflow:ellipsis}
@media(max-width:1100px){header.top nav{gap:16px;letter-spacing:.14em}header.top .user b{display:none}}
@media(max-width:820px){header.top nav{gap:14px}}

/* ---------- mesa de dados: bocadillo junto al atributo y mesa fija en la pestaña Dados ---------- */
.roll-btn{display:inline-grid;place-items:center}
.roll-btn svg.ico{width:21px;height:21px}
.btn.roll-btn{display:inline-flex}
.btn.roll-btn svg.ico{width:17px;height:17px}
.roll-btn.on{border-color:var(--gold2);color:var(--gold2);box-shadow:0 0 16px rgba(240,215,154,.35)}
.dt{position:absolute;z-index:60;width:352px;max-width:calc(100vw - 24px);padding:18px 18px 16px;color:var(--cream);text-align:left;
  background:radial-gradient(120% 70% at 50% 0%,rgba(72,216,255,.11),transparent 62%),linear-gradient(180deg,#14294a 0%,#0b1729 55%,#070f1c 100%);
  border:1px solid rgba(200,170,110,.6);
  box-shadow:inset 0 0 0 4px rgba(5,10,20,.85),inset 0 0 0 5px rgba(200,170,110,.24),0 26px 60px rgba(0,0,0,.6),0 0 44px rgba(72,216,255,.08);
  animation:dt-in .22s cubic-bezier(.2,.7,.2,1)}
.dt:before{content:"";position:absolute;left:calc(var(--ax,50%) - 7px);top:-8px;width:14px;height:14px;background:#14294a;border:1px solid rgba(200,170,110,.6);border-right:0;border-bottom:0;transform:rotate(45deg)}
.dt.up:before{top:auto;bottom:-8px;background:#070f1c;transform:rotate(225deg)}
.dt-cn{position:absolute;width:9px;height:9px;background:var(--night);border:1px solid var(--gold);transform:rotate(45deg);box-shadow:0 0 8px rgba(200,170,110,.35)}
.dt-cn.tl{top:-5px;left:-5px}.dt-cn.tr{top:-5px;right:-5px}.dt-cn.bl{bottom:-5px;left:-5px}.dt-cn.br{bottom:-5px;right:-5px}
.dt-head{display:flex;align-items:center;gap:10px;padding:0 2px 11px;margin-bottom:12px;border-bottom:1px solid rgba(200,170,110,.2)}
.dt-head small{font-family:var(--disp);font-weight:600;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);white-space:nowrap}
.dt-title{flex:1;min-width:0;font-family:var(--disp);font-weight:700;font-size:15px;letter-spacing:.06em;color:var(--cream);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dt-x{width:28px;height:28px;margin:-4px -4px -4px 0;font-size:20px;line-height:1;color:var(--gold2);opacity:.8}
.dt-x:hover{opacity:1}
.dt svg path{fill:none;stroke:currentColor;stroke-width:4;stroke-linejoin:round}
.dt svg path.f{stroke-width:2.6;opacity:.55}
.dt-dice{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.dt-die{display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 0 5px;color:var(--dim);border:1px solid transparent;transition:color .2s,background .2s,border-color .2s}
.dt-die svg{width:26px;height:26px;transition:filter .2s,transform .2s}
.dt-die span{font-family:var(--disp);font-weight:600;font-size:10.5px;letter-spacing:.06em}
.dt-die:hover{color:var(--gold2)}
.dt-die:hover svg{transform:translateY(-1px)}
.dt-die.on{color:var(--gold2);border-color:rgba(200,170,110,.5);background:radial-gradient(circle at 50% 35%,rgba(200,170,110,.2),rgba(200,170,110,.04) 70%)}
.dt-die.on svg{filter:drop-shadow(0 0 7px rgba(240,215,154,.6))}
.dt-stage{display:grid;grid-template-columns:116px minmax(0,1fr);align-items:center;gap:16px;margin:14px 0 12px;padding:12px;border:1px solid rgba(200,170,110,.16);
  background:radial-gradient(circle at 22% 50%,rgba(72,216,255,.14),transparent 62%),rgba(5,10,20,.55)}
.dt-big{position:relative;width:116px;height:116px;display:grid;place-items:center}
.dt-big svg{position:absolute;inset:0;width:100%;height:100%;color:var(--gold);filter:drop-shadow(0 0 16px rgba(72,216,255,.5))}
.dt-big svg path{stroke-width:2.2}
.dt-big svg path:first-child{fill:rgba(13,27,46,.92)}
.dt-big svg path.f{stroke-width:1.6}
.dt-big b{position:relative;font-family:var(--disp);font-weight:700;font-size:34px;line-height:1;color:var(--cream);text-shadow:0 0 16px rgba(72,216,255,.9)}
.dt-big b.long{font-size:25px}
.dt-big[data-s="4"] b{margin-top:26px;font-size:26px}
.dt-big b.pop{animation:dt-pop .45s cubic-bezier(.2,.7,.2,1)}
.dt-out{min-width:0}
.dt-formula{display:block;font-size:13px;line-height:1.35;color:var(--dim);overflow-wrap:anywhere}
.dt-total{display:block;font-family:var(--disp);font-weight:700;font-size:42px;line-height:1.05;color:var(--gold2);text-shadow:0 0 18px rgba(240,215,154,.35)}
.dt-total:empty,.dt-verdict:empty{display:none}
.dt-verdict{display:block;margin-top:2px;font-style:normal;font-family:var(--disp);font-weight:600;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.dt.rolling .dt-formula{opacity:.5}
.dt.crit .dt-verdict{color:#f0d79a;text-shadow:0 0 12px rgba(240,215,154,.7)}
.dt.crit .dt-big svg{color:#f0d79a;filter:drop-shadow(0 0 24px rgba(240,215,154,.9))}
.dt.crit .dt-big{animation:dt-crit .7s ease-out}
.dt.fumble .dt-verdict{color:var(--danger)}
.dt.fumble .dt-big svg{filter:drop-shadow(0 0 18px rgba(255,107,107,.7))}
.dt.fumble .dt-total{color:var(--danger);text-shadow:none}
.dt.ok .dt-verdict{color:var(--hex2)}
.dt.ko .dt-verdict{color:var(--mute)}
.dt-mods{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px}
.dt-step{display:grid;grid-template-columns:28px 40px 28px;text-align:center}
.dt-step small{grid-column:1/-1;margin-bottom:4px;font-family:var(--disp);font-weight:600;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute)}
.dt-step button{height:30px;border:1px solid rgba(200,170,110,.35);background:rgba(5,10,20,.6);color:var(--gold2);font-size:16px;line-height:1;transition:background .2s}
.dt-step button:hover{background:rgba(200,170,110,.14)}
.dt-step output{display:grid;place-items:center;height:30px;border-top:1px solid rgba(200,170,110,.35);border-bottom:1px solid rgba(200,170,110,.35);background:var(--input);font-family:var(--disp);font-weight:700;font-size:14px}
.dt-skill{flex:1;min-width:110px;display:flex;align-items:center;justify-content:space-between;gap:8px;height:30px;padding:0 11px;font-size:13px;color:var(--dim);border:1px solid rgba(72,216,255,.3);background:rgba(72,216,255,.04);transition:.2s}
.dt-skill span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dt-skill b{font-family:var(--disp);font-weight:700;color:var(--hex2)}
.dt-skill.on{color:var(--cream);border-color:rgba(72,216,255,.7);background:rgba(72,216,255,.13);box-shadow:0 0 14px rgba(72,216,255,.16)}
.dt-skill:not(.on) b{color:var(--mute);text-decoration:line-through}
.dt-foot{display:flex;align-items:center;gap:12px;margin-top:14px}
.dt-go{flex:1}
.dt-priv{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--arcane);cursor:pointer;white-space:nowrap}
.dt.dt-sheet{position:fixed;left:12px;right:12px;bottom:12px;top:auto;width:auto;max-width:none;animation:dt-up .28s cubic-bezier(.2,.7,.2,1);
  box-shadow:inset 0 0 0 4px rgba(5,10,20,.85),inset 0 0 0 5px rgba(200,170,110,.24),0 0 0 100vmax rgba(3,6,12,.55)}
.dt.dt-sheet:before,.dt.dt-inline:before{display:none}
.dt.dt-inline{position:relative;z-index:auto;width:auto;max-width:560px;margin:0 auto 18px;animation:none}
.dt-inline .dt-stage{grid-template-columns:140px minmax(0,1fr)}
.dt-inline .dt-big{width:140px;height:140px}
.dt-inline .dt-big b{font-size:42px}
.dt-inline .dt-big b.long{font-size:30px}
.dt-inline .dt-die svg{width:30px;height:30px}
@media(max-width:560px){.dt-inline .dt-stage{grid-template-columns:112px minmax(0,1fr)}.dt-inline .dt-big{width:112px;height:112px}.dt-inline .dt-big b{font-size:34px}}
.free-formula{max-width:560px;margin:0 auto 16px}
.free-formula summary{cursor:pointer;font-family:var(--disp);font-weight:600;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.free-formula .quick-roll{margin-top:10px}
@keyframes dt-in{from{opacity:0;transform:translateY(6px) scale(.98)}}
@keyframes dt-up{from{opacity:0;transform:translateY(24px)}}
@keyframes dt-pop{0%{transform:scale(.55);opacity:.2}60%{transform:scale(1.16);opacity:1}100%{transform:scale(1)}}
@keyframes dt-crit{0%,100%{transform:scale(1)}35%{transform:scale(1.1)}}
@media(prefers-reduced-motion:reduce){.dt,.dt-big,.dt-big b.pop{animation:none!important}.dt-big svg{transition:none!important}}

/* tiradas ocultas: solo las ve el máster, y se nota */
.roll-list li.priv{border-style:dashed;border-color:rgba(143,108,242,.6);background:linear-gradient(90deg,rgba(143,108,242,.12),rgba(143,108,242,.03))}
.roll-list li.priv b{color:#c9b6ff}
.roll-priv{display:inline-flex;align-items:center;gap:4px;margin-left:6px;padding:1px 7px 1px 5px;vertical-align:middle;font-style:normal;font-family:var(--disp);font-weight:600;font-size:10px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;color:#c9b6ff;border:1px solid rgba(143,108,242,.55);background:rgba(143,108,242,.12)}
.roll-priv svg.ico{width:13px;height:13px}
.dt-note{display:block;margin-top:5px;font-size:12px;color:#c9b6ff}
.dt-note:empty{display:none}

/* Discord: tiradas que llegan del bot Rol Master y panel de vinculación */
.dc-ico{width:14px;height:14px;flex:none}
.roll-src{display:inline-flex;align-items:center;gap:4px;margin-left:6px;padding:1px 7px 1px 5px;vertical-align:middle;font-style:normal;font-family:var(--disp);font-weight:600;font-size:10px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;color:#aab4ff;border:1px solid rgba(88,101,242,.55);background:rgba(88,101,242,.14)}
.roll-src .dc-ico{width:12px;height:12px}
.roll-linked{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#aab4ff}
.discord-panel .k{display:flex;align-items:center;gap:8px}
.discord-panel .k .dc-ico{width:17px;height:17px;color:#8c9eff}
.discord-panel p.dim{margin:8px 0 12px}
.dc-linked{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:12px 0 4px}
.dc-linked b{font-family:var(--disp);font-weight:700;font-size:18px;letter-spacing:.04em;color:var(--cream)}
.dc-linked small{font-size:12px;color:var(--mute)}
.dc-steps{margin:12px 0 12px 20px;font-size:14px;color:var(--dim)}
.dc-steps b{color:var(--cream)}
.copy-row input.dc-code{font-family:var(--disp);font-weight:700;font-size:20px;letter-spacing:.2em;text-align:center;color:var(--gold2)}
.dc-foot{margin-top:8px!important}
.dc-foot a{color:var(--gold2);text-decoration:underline;text-underline-offset:3px}
.quick-roll input[type=checkbox]{flex:none;min-width:0;width:16px;height:16px;padding:0;border:0;background:none;box-shadow:none;accent-color:var(--arcane)}
.quick-roll .chk{display:inline-flex;align-items:center;gap:6px}
.rolls-reset{display:flex;justify-content:flex-end;margin-top:8px}
.rolls-reset .link{font-size:12px;color:var(--mute)}
.rolls-reset .link:hover{color:var(--danger)}

/* ---------- la mesa del máster: pestañas ---------- */
.ctabs{position:relative;display:flex;align-items:flex-end;gap:2px;margin:6px 0 24px;border-bottom:1px solid rgba(200,170,110,.28);overflow-x:auto;scrollbar-width:none}
.ctabs::-webkit-scrollbar{display:none}
.ctab{position:relative;display:inline-flex;align-items:center;gap:9px;flex:none;padding:14px 18px 13px;font-family:var(--disp);font-weight:600;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);white-space:nowrap;transition:color .2s,background .2s}
.ctab svg.ico{width:19px;height:19px;transition:filter .2s,color .2s}
.ctab:hover{color:var(--gold2);background:linear-gradient(180deg,transparent,rgba(200,170,110,.06))}
.ctab.on{color:var(--cream);background:linear-gradient(180deg,transparent,rgba(200,170,110,.11))}
.ctab.on svg.ico{color:var(--gold2);filter:drop-shadow(0 0 6px rgba(240,215,154,.65))}
.ctab.on:after{content:"";position:absolute;left:8px;right:8px;bottom:-1px;height:2px;background:linear-gradient(90deg,transparent,var(--gold2) 20%,var(--gold2) 80%,transparent);box-shadow:0 0 12px rgba(240,215,154,.7)}
.ctab .n{font-family:var(--body);font-style:normal;font-weight:600;font-size:11px;letter-spacing:0;min-width:20px;padding:1px 6px;text-align:center;color:var(--gold2);background:rgba(200,170,110,.14);border:1px solid rgba(200,170,110,.3)}
.ctab.soon{color:var(--mute)}
.ctab .soon-tag{font-style:normal;font-size:9px;letter-spacing:.14em;padding:1px 5px;color:#b9a6ff;border:1px solid rgba(143,108,242,.45)}
.ctab.end{margin-left:auto}
@media(max-width:700px){.ctab{padding:12px 12px 11px;font-size:11px;letter-spacing:.13em;gap:7px}.ctab.end{margin-left:0}}
.cpane{animation:cpane-in .25s ease-out}
@keyframes cpane-in{from{opacity:0;transform:translateY(4px)}}
@media(prefers-reduced-motion:reduce){.cpane{animation:none}}
.pane-bar{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px 24px;margin-bottom:20px}
.pane-bar p.dim{margin-top:4px;font-size:14px;max-width:62ch}
.pane-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.pane-tools input[type=search]{width:220px;max-width:100%;padding:9px 12px;background:var(--input);border:1px solid var(--line);color:var(--cream)}
.pane-tools input[type=search]:focus{outline:none;border-color:var(--gold)}
.ph-link{color:var(--gold2);text-decoration:underline;text-underline-offset:3px}

/* PNJ en grupos */
.npc-group{margin-bottom:28px}
.npc-group-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:14px;padding-bottom:9px;border-bottom:1px solid rgba(200,170,110,.18)}
.npc-group-head h3{font-family:var(--disp);font-weight:700;font-size:14.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.npc-group-head .n{min-width:22px;padding:0 6px;font-size:11.5px;text-align:center;color:var(--gold2);border:1px solid rgba(200,170,110,.3)}
.npc-group-acts{display:flex;align-items:center;gap:16px;margin-left:auto;font-size:12.5px}
.npc-group-acts .link,.npc-group-acts a{font-size:12.5px;color:var(--dim)}
.npc-group-acts a:hover,.npc-group-acts .link:hover{color:var(--gold2)}
.npc-item{display:flex;flex-direction:column;gap:7px;min-width:0}
.npc-item>.char-card{flex:1}
.npc-board .org-only{display:none!important}
.npc-board.organizing .org-only{display:block!important}
.npc-board.organizing .npc-group-acts form.org-only{display:inline-block!important}
.npc-board.organizing .npc-item>.char-card{outline:1px dashed rgba(200,170,110,.4);outline-offset:3px}
.npc-move select{width:100%;padding:7px 9px;font-size:12.5px;color:var(--cream);background:var(--input);border:1px dashed rgba(200,170,110,.5)}
.npc-hint{margin:-6px 0 18px;font-size:13px}

/* Materiales: lo enviado por la lechucería */
.mat-filter{display:inline-flex;border:1px solid rgba(200,170,110,.32)}
.mat-filter button{padding:8px 12px;font-family:var(--disp);font-weight:600;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);transition:color .2s,background .2s}
.mat-filter button+button{border-left:1px solid rgba(200,170,110,.2)}
.mat-filter button:hover{color:var(--gold2)}
.mat-filter button.on{color:#1a1206;background:linear-gradient(180deg,#f0d79a,#c8aa6e)}
.mat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}
.mat-card{position:relative;display:flex;flex-direction:column;min-width:0;background:linear-gradient(180deg,var(--card1),var(--card2));border:1px solid rgba(200,170,110,.24);transition:transform .2s,border-color .2s,box-shadow .2s}
.mat-card:hover{transform:translateY(-2px);border-color:rgba(200,170,110,.6);box-shadow:0 14px 30px rgba(0,0,0,.45),0 0 18px rgba(200,170,110,.12)}
.mat-media{position:relative;display:block;height:150px;overflow:hidden;background:radial-gradient(circle at 50% 30%,#132541,#070f1c)}
.mat-media>img.mat-img{width:100%;height:100%;object-fit:cover}
.mat-paper{position:absolute;left:16px;right:16px;top:14px;bottom:-6px;padding:14px 14px 0;background:linear-gradient(180deg,#f2e5c7,#dac59a);box-shadow:0 8px 18px rgba(0,0,0,.5);color:#4a3a22;font-size:12.5px;line-height:1.5;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,#000 62%,transparent);mask-image:linear-gradient(180deg,#000 62%,transparent);transform:rotate(-1deg)}
.k-nota .mat-paper{background:repeating-linear-gradient(180deg,#f4ecd4 0 20px,#dccfae 20px 21px);transform:rotate(1.4deg)}
.mat-paper i{display:block;font-style:normal}
.mat-seal{position:absolute;right:12px;bottom:8px;width:48px;height:48px;filter:drop-shadow(0 3px 6px rgba(0,0,0,.55))}
.mat-body{display:flex;flex-direction:column;gap:4px;padding:12px 14px 14px}
.mat-kind{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--mute)}
.mat-kind svg.ico{width:15px;height:15px;color:var(--gold)}
.mat-body b{font-family:var(--disp);font-weight:700;font-size:15px;line-height:1.3;color:var(--cream);overflow-wrap:anywhere}
.mat-meta{font-size:12px;color:var(--dim)}
.mat-card.out{opacity:.55}
.mat-card.out .mat-meta{color:var(--danger)}

/* Pestañas que llegan pronto */
.soon-pane{max-width:660px;margin:8px auto;padding:42px 34px;text-align:center}
.soon-ico{display:inline-grid;place-items:center;width:76px;height:76px;margin:6px 0 18px;color:var(--gold2);border:1px solid rgba(200,170,110,.5);background:radial-gradient(circle,rgba(200,170,110,.14),transparent 70%);transform:rotate(45deg)}
.soon-ico svg.ico{width:34px;height:34px;transform:rotate(-45deg);filter:drop-shadow(0 0 10px rgba(240,215,154,.5))}
.soon-pane h2{margin:6px 0 12px;font-family:var(--disp);font-weight:700;font-size:26px;letter-spacing:.08em;color:var(--cream)}
.soon-pane>p{max-width:52ch;margin:0 auto;font-size:15px}
.soon-list{list-style:none;display:inline-flex;flex-direction:column;gap:8px;margin:18px 0 4px;text-align:left;color:var(--cream);font-size:14.5px}
.soon-list li{display:flex;gap:10px;align-items:flex-start}
.soon-list li:before{content:"";flex:none;width:7px;height:7px;margin-top:8px;background:var(--gold);transform:rotate(45deg)}
.soon-pane .actions{justify-content:center;margin-top:22px}

/* Ajustes */
.set-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;align-items:start}
.set-col{display:flex;flex-direction:column;gap:22px;min-width:0}
.set-col>.panel{margin:0}
@media(max-width:900px){.set-grid{grid-template-columns:1fr}}
.tool-row{display:flex;align-items:center;gap:14px;padding:13px 6px;border-top:1px solid rgba(200,170,110,.14);transition:background .2s}
.tool-row:first-of-type{margin-top:12px}
.tool-row:hover{background:rgba(200,170,110,.06)}
.tool-row svg.ico{flex:none;width:24px;height:24px;color:var(--gold2)}
.tool-row b{display:block;font-family:var(--disp);font-weight:700;font-size:14px;letter-spacing:.06em;color:var(--cream)}
.tool-row small{display:block;font-size:12.5px;color:var(--dim)}
.tool-row .go{margin-left:auto;color:var(--gold);font-size:18px}
.danger-panel{border-color:rgba(255,107,107,.35)!important}
.danger-panel .danger-zone{margin:0;padding:0;border:0}
.set-col>.panel>.k{margin-bottom:14px}
.set-col>.panel>.k+.tool-row{margin-top:0}
@media(max-width:700px){.ctabs{-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}}

/* pestañas de la mesa, más claras (a la manera de las de la portada) */
.ctabs{align-items:stretch;gap:4px;padding:6px;margin:8px 0 26px;border:1px solid rgba(200,170,110,.38);background:linear-gradient(180deg,rgba(20,38,63,.94),rgba(9,18,33,.94));box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 12px 28px rgba(0,0,0,.35)}
.ctab{padding:12px 18px;font-size:13px;letter-spacing:.18em;color:#c4bead;border:1px solid transparent;transition:color .2s,background .2s,border-color .2s,box-shadow .2s}
.ctab svg.ico{width:20px;height:20px;color:var(--gold)}
.ctab:hover{color:var(--cream);background:rgba(72,216,255,.07);border-color:rgba(72,216,255,.2)}
.ctab.on{color:#fff;background:linear-gradient(180deg,rgba(72,216,255,.32),rgba(72,216,255,.08));border-color:rgba(72,216,255,.6);text-shadow:0 0 14px rgba(72,216,255,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 22px rgba(72,216,255,.2)}
.ctab.on svg.ico{color:var(--hex2);filter:drop-shadow(0 0 7px rgba(72,216,255,.85))}
.ctab.on:after{left:-1px;right:-1px;bottom:-1px;height:3px;background:var(--hex2);box-shadow:0 0 14px var(--hex2),0 0 4px var(--hex2)}
.ctab.on .n{color:#fff;background:rgba(72,216,255,.25);border-color:rgba(72,216,255,.6)}
.ctab.soon{color:#7d8795}
.ctab.soon svg.ico{color:#7d8795}
.ctab.soon.on{color:#fff}
.ctab.soon.on svg.ico{color:var(--hex2)}
.ctab:focus{outline:none}
.ctab:focus-visible{outline:1px solid var(--gold2);outline-offset:2px}
@media(max-width:700px){.ctabs{padding:5px;gap:3px}.ctab{padding:11px 13px;font-size:11.5px;letter-spacing:.14em}}

/* ---------- objetos de la partida (pestaña del máster) ---------- */
.it-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:18px}
.it-card{--rc:rgba(200,170,110,.35);--rg:rgba(200,170,110,.08);position:relative;display:flex;flex-direction:column;gap:10px;min-width:0;padding:16px;background:linear-gradient(180deg,var(--card1),var(--card2));border:1px solid rgba(200,170,110,.22);border-top:2px solid var(--rc);box-shadow:inset 0 30px 40px -30px var(--rg);transition:border-color .2s,box-shadow .2s,transform .2s}
.it-card:hover{transform:translateY(-2px);box-shadow:inset 0 30px 40px -30px var(--rg),0 14px 30px rgba(0,0,0,.4)}
.r-poco{--rc:rgba(120,220,140,.75);--rg:rgba(120,220,140,.16)}
.r-rara{--rc:rgba(90,170,255,.8);--rg:rgba(90,170,255,.18)}
.r-legend{--rc:rgba(240,200,110,.95);--rg:rgba(240,200,110,.22)}
.it-top{display:flex;align-items:center;gap:13px}
.it-face{display:grid;place-items:center;flex:none;width:58px;height:58px;overflow:hidden;font-size:32px;line-height:1;font-style:normal;background:radial-gradient(circle at 50% 35%,rgba(255,255,255,.08),rgba(0,0,0,.35));border:1px solid var(--rc,rgba(200,170,110,.4));box-shadow:inset 0 0 14px var(--rg,transparent),0 0 12px var(--rg,transparent)}
.it-face img{width:100%;height:100%;object-fit:cover}
.it-head{min-width:0}
.it-head b{display:block;font-family:var(--disp);font-weight:700;font-size:16px;letter-spacing:.03em;line-height:1.25;color:var(--cream);overflow-wrap:anywhere}
.it-head small{font-size:12px;color:var(--mute)}
.it-head .rar{color:var(--rc)}
.it-card.r-comun .it-head .rar{color:var(--dim)}
.it-desc{font-size:13.5px;line-height:1.45;color:var(--dim);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.it-eff{font-size:13px;color:var(--gold2)}
.it-badges{display:flex;flex-wrap:wrap;gap:6px}
.bdg{padding:2px 8px;font-size:11.5px;border:1px solid rgba(200,170,110,.3);color:var(--dim);background:rgba(0,0,0,.2)}
.bdg.cons{color:#ffcf9a;border-color:rgba(255,154,60,.45)}
.bdg.roll{color:#aee9ff;border-color:rgba(72,216,255,.45)}
.it-note{font-size:12.5px;color:#c9b6ff;padding:6px 9px;background:rgba(143,108,242,.1);border-left:2px solid rgba(143,108,242,.6)}
.it-holders{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:auto;padding-top:10px;border-top:1px solid rgba(200,170,110,.14)}
.it-holders>small{font-size:11.5px;color:var(--mute);margin-right:2px}
.hold{display:inline-flex;align-items:center;gap:2px;padding:1px 2px 1px 8px;font-size:12px;color:var(--cream);background:rgba(72,216,255,.08);border:1px solid rgba(72,216,255,.3)}
.hold .x{width:20px;height:20px;font-size:14px;line-height:1;color:var(--mute)}
.hold .x:hover{color:var(--danger)}
.it-acts{display:flex;align-items:center;gap:8px}
.it-acts form{margin-left:auto}
.it-del{font-size:12.5px;color:var(--mute)}
.it-del:hover{color:var(--danger)}

/* diálogos con marco dorado */
.rf-dialog{width:min(860px,calc(100vw - 24px));max-height:calc(100dvh - 32px);padding:0;overflow:auto;color:var(--cream);border:1px solid rgba(200,170,110,.6);background:linear-gradient(180deg,#142a48 0%,#0b1729 55%,#070f1c 100%);box-shadow:inset 0 0 0 4px rgba(5,10,20,.85),inset 0 0 0 5px rgba(200,170,110,.22),0 30px 80px rgba(0,0,0,.7)}
.rf-dialog::backdrop{background:rgba(3,6,12,.72)}
.rf-dialog[open]{animation:dt-in .22s cubic-bezier(.2,.7,.2,1)}
.dlg-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:20px 24px 14px;border-bottom:1px solid rgba(200,170,110,.2)}
.dlg-head h2{margin-top:2px;font-family:var(--disp);font-weight:700;font-size:22px;letter-spacing:.05em}
.dlg-x{width:34px;height:34px;font-size:24px;line-height:1;color:var(--gold2)}
.dlg-foot{display:flex;justify-content:flex-end;gap:10px;padding:14px 24px 20px;border-top:1px solid rgba(200,170,110,.16)}
.it-cols{display:grid;grid-template-columns:230px minmax(0,1fr);gap:24px;padding:18px 24px}
@media(max-width:720px){.it-cols{grid-template-columns:1fr}}
.it-side{display:flex;flex-direction:column;gap:12px}
.it-preview{display:flex;flex-direction:column;align-items:center;gap:8px;padding:20px 12px 16px;text-align:center;background:radial-gradient(circle at 50% 30%,var(--rg,rgba(200,170,110,.08)),transparent 70%),rgba(5,10,20,.5);border:1px solid rgba(200,170,110,.2);border-top:2px solid var(--rc,rgba(200,170,110,.35))}
.it-preview .it-face{width:96px;height:96px;font-size:54px}
.it-preview b{font-family:var(--disp);font-weight:700;font-size:15px;overflow-wrap:anywhere}
.it-preview small{font-size:12px;color:var(--rc,var(--dim))}
.it-preview.r-comun small{color:var(--dim)}
.emoji-pal{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}
.emoji-pal button{height:34px;font-size:19px;line-height:1;border:1px solid transparent;background:rgba(0,0,0,.2);transition:border-color .15s,background .15s}
.emoji-pal button:hover{border-color:rgba(200,170,110,.5);background:rgba(200,170,110,.1)}
.it-main{display:flex;flex-direction:column;gap:12px;min-width:0}
.it-main .field{margin:0}
.it-row2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
@media(max-width:480px){.it-row2{grid-template-columns:1fr}}
.rar-pick{display:flex;flex-wrap:wrap;gap:6px}
.rar-pick label{cursor:pointer}
.rar-pick input{position:absolute;opacity:0;pointer-events:none}
.rar-pick span{display:inline-block;padding:6px 12px;font-size:12.5px;color:var(--dim);border:1px solid rgba(200,170,110,.25);background:rgba(0,0,0,.2);transition:.15s}
.rar-pick label.r-comun{--rc:rgba(200,190,170,.7)}
.rar-pick input:checked+span{color:#fff;border-color:var(--rc);background:var(--rg,rgba(200,170,110,.14));box-shadow:0 0 12px var(--rg,transparent)}
.rar-pick input:focus-visible+span{outline:1px solid var(--gold2);outline-offset:2px}
.it-box{display:flex;flex-direction:column;gap:10px;padding:12px;border:1px solid rgba(200,170,110,.16);background:rgba(0,0,0,.18)}
.it-uses input{max-width:120px}
.it-sign{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13.5px}
.give-dialog{width:min(560px,calc(100vw - 24px))}
.give-who{display:flex;align-items:center;gap:14px}
.give-who .it-face{width:52px;height:52px;font-size:28px}
.give-body{display:flex;flex-direction:column;gap:12px;padding:16px 24px}
.give-all{font-size:14px}
.give-list{list-style:none;display:flex;flex-direction:column;gap:6px}
.give-list li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border:1px solid rgba(200,170,110,.16);background:rgba(0,0,0,.18);transition:border-color .15s,background .15s}
.give-list li.on{border-color:rgba(72,216,255,.5);background:rgba(72,216,255,.08)}
.give-list label{display:flex;align-items:center;gap:10px;min-width:0;cursor:pointer}
.give-list label b{display:block;font-size:14.5px}
.give-list label small{display:block;font-size:12px;color:var(--mute)}
.give-list input[type=number]{width:70px;padding:6px 8px;text-align:center}
.give-list input[type=number]:disabled{opacity:.35}
.give-av{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;background:#10213a center/cover;border:1px solid rgba(200,170,110,.45);font-family:var(--disp);font-weight:700;color:var(--gold2)}
.give-npcs summary{cursor:pointer;font-size:13.5px;color:var(--gold2)}
.give-npcs .give-list{margin-top:8px}
.give-notify{font-size:13.5px}

/* mochila: objetos que vienen de la mesa */
.pack-item .ico img,.slot i img{display:block;width:100%;height:100%;object-fit:cover}
.pack-item.gear .ico{width:40px;height:40px;display:grid;place-items:center;overflow:hidden;font-size:24px;border:1px solid var(--rc,rgba(200,170,110,.4));background:radial-gradient(circle at 50% 35%,rgba(255,255,255,.07),rgba(0,0,0,.3))}
.slot i:has(img){width:34px;height:34px;overflow:hidden}
.pi-tags{display:flex;flex-wrap:wrap;gap:5px;margin:3px 0 2px}
.pi-tags i{font-style:normal;font-size:10.5px;padding:0 6px;border:1px solid rgba(200,170,110,.3);color:var(--dim)}
.pi-tags .pi-seal{color:var(--gold2);border-color:rgba(200,170,110,.5);background:rgba(200,170,110,.1);letter-spacing:.06em;text-transform:uppercase;font-family:var(--disp);font-weight:600}
.pi-tags .pi-cons{color:#ffcf9a;border-color:rgba(255,154,60,.45)}
.pi-tags .pi-roll{color:#aee9ff;border-color:rgba(72,216,255,.45)}
.pi-main small.pi-eff{color:var(--gold2)}
.pi-use{height:36px;padding:0 14px;font-family:var(--disp);font-weight:700;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#1a1206;background:linear-gradient(180deg,#9ff0ff,#48d8ff 55%,#1c8fb5);border:1px solid rgba(200,245,255,.7);box-shadow:0 0 14px rgba(72,216,255,.3)}
.pi-use:hover{filter:brightness(1.08)}
.pi-use:disabled{opacity:.5}
.pack-toast{margin:0 0 10px;padding:10px 14px;font-size:14px;color:var(--cream);background:linear-gradient(90deg,rgba(72,216,255,.2),rgba(72,216,255,.05));border:1px solid rgba(72,216,255,.45);opacity:0;transform:translateY(-4px);transition:opacity .3s,transform .3s;pointer-events:none}
.pack-toast.show{opacity:1;transform:none}
.pack-toast:not(.show){height:0;margin:0;padding:0;border:0;overflow:hidden}
.rf-dialog{margin:auto}
.give-list input[type=number]{flex:none;width:72px!important}
.give-list label{flex:1}

/* icono del objeto: emoji · librería · imagen recortada 1:1 */
.icon-tabs{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid rgba(200,170,110,.32)}
.icon-tabs button{padding:8px 4px;font-family:var(--disp);font-weight:600;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);transition:color .2s,background .2s}
.icon-tabs button+button{border-left:1px solid rgba(200,170,110,.2)}
.icon-tabs button:hover{color:var(--gold2)}
.icon-tabs button.on{color:#fff;background:linear-gradient(180deg,rgba(72,216,255,.3),rgba(72,216,255,.08));text-shadow:0 0 10px rgba(72,216,255,.6)}
.icon-pane{display:flex;flex-direction:column;gap:10px}
.lib-pal{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;max-height:236px;overflow:auto;padding-right:2px}
.lib-pal button{display:grid;place-items:center;aspect-ratio:1;padding:5px;border:1px solid rgba(200,170,110,.18);background:radial-gradient(circle at 50% 35%,rgba(255,255,255,.06),rgba(0,0,0,.3));transition:border-color .15s,box-shadow .15s}
.lib-pal button img{width:100%;height:100%}
.lib-pal button:hover{border-color:rgba(200,170,110,.6)}
.lib-pal button.on{border-color:var(--hex2);box-shadow:0 0 12px rgba(72,216,255,.4),inset 0 0 10px rgba(72,216,255,.2)}
.it-face canvas{width:100%;height:100%}
.crop{display:flex;flex-direction:column;gap:8px}
.crop-box{position:relative;width:100%;aspect-ratio:1;overflow:hidden;cursor:grab;touch-action:none;border:1px solid var(--gold);background:repeating-conic-gradient(#1a2638 0 25%,#111b2b 0 50%) 0 0/18px 18px}
.crop-box.dragging{cursor:grabbing}
.crop-box img{position:absolute;left:0;top:0;max-width:none;user-select:none;pointer-events:none;transform-origin:0 0}
.crop-grid{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent calc(33.33% - .5px),rgba(255,255,255,.22) 0,rgba(255,255,255,.22) calc(33.33% + .5px),transparent 0,transparent calc(66.66% - .5px),rgba(255,255,255,.22) 0,rgba(255,255,255,.22) calc(66.66% + .5px),transparent 0),linear-gradient(180deg,transparent calc(33.33% - .5px),rgba(255,255,255,.22) 0,rgba(255,255,255,.22) calc(33.33% + .5px),transparent 0,transparent calc(66.66% - .5px),rgba(255,255,255,.22) 0,rgba(255,255,255,.22) calc(66.66% + .5px),transparent 0);box-shadow:inset 0 0 0 1px rgba(240,215,154,.5)}
.crop-zoom{display:flex;align-items:center;gap:8px;color:var(--gold2)}
.crop-zoom input{flex:1;accent-color:var(--gold)}
.crop-hint{font-size:12px;line-height:1.45}

/* librería de objetos genéricos */
.lib-dialog{width:min(980px,calc(100vw - 24px))}
.lib-body{display:flex;flex-direction:column;gap:14px;padding:16px 24px 22px}
.lib-cats{display:flex;flex-wrap:wrap;gap:6px}
.lib-cats button{padding:6px 11px;font-size:12.5px;color:var(--dim);border:1px solid rgba(200,170,110,.25);background:rgba(0,0,0,.2);transition:.15s}
.lib-cats button:hover{color:var(--gold2)}
.lib-cats button.on{color:#1a1206;background:linear-gradient(180deg,#f0d79a,#c8aa6e);border-color:transparent}
.lib-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:10px}
.lib-item{--rc:rgba(200,170,110,.35);display:flex;flex-direction:column;align-items:center;gap:7px;padding:14px 8px 12px;text-align:center;background:linear-gradient(180deg,var(--card1),var(--card2));border:1px solid rgba(200,170,110,.2);border-top:2px solid var(--rc);transition:transform .15s,border-color .15s,box-shadow .15s}
.lib-item:hover{transform:translateY(-2px);border-color:rgba(200,170,110,.6);box-shadow:0 10px 24px rgba(0,0,0,.4),0 0 16px var(--rg,rgba(200,170,110,.1))}
.lib-item .it-face{width:72px;height:72px}
.lib-item .it-face img{object-fit:cover}
.lib-item b{font-family:var(--disp);font-weight:700;font-size:13px;line-height:1.25;color:var(--cream)}
.lib-item small{font-size:11px;color:var(--mute)}


/* ---------- mochila con ilustraciones: huecos, filas resumidas y ficha del objeto ---------- */
.slot.has-img{padding:0;justify-content:flex-end;overflow:hidden}
.slot .slot-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}
.slot.has-img:before{display:none}
.slot.has-img em{position:relative;width:100%;margin:0;padding:14px 5px 4px;font-size:10px;line-height:1.1;color:var(--cream);text-shadow:0 1px 2px #000;background:linear-gradient(180deg,transparent,rgba(5,10,20,.92));-webkit-line-clamp:1}
.slot.has-img .qty{z-index:1}
.slot.has-img.r-legend{box-shadow:inset 0 0 0 1px rgba(240,215,154,.7),0 0 14px rgba(240,215,154,.35)}
.slot.has-img.r-rara{box-shadow:inset 0 0 0 1px rgba(90,170,255,.7),0 0 12px rgba(90,170,255,.25)}
.slot.has-img.r-poco{box-shadow:inset 0 0 0 1px rgba(120,220,140,.6)}
.pack-item{cursor:pointer;grid-template-columns:44px minmax(0,1fr) auto auto}
.pack-item:hover{border-color:rgba(200,170,110,.55)}
.pack-item .ico.has-img{width:44px;height:44px;display:grid;overflow:hidden;border:1px solid var(--rc,rgba(200,170,110,.4));background:#0b1729;padding:0}
.pack-item .ico.has-img img{width:100%;height:100%;object-fit:cover;display:block}
.pack-item .ico{width:44px;height:44px;display:grid;place-items:center;font-size:24px}
.pi-tags{margin:2px 0 0}
.pi-tags .pi-desc,.pi-tags .pi-eff{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:0;padding:0;font-size:12px;letter-spacing:0;text-transform:none}
.pi-tags .pi-eff{color:var(--gold2)}
.pi-tags .pi-desc{color:var(--dim)}
.pi-tags .pi-rar-poco{color:#9fe4ab;border-color:rgba(120,220,140,.5)}
.pi-tags .pi-rar-rara{color:#a9cfff;border-color:rgba(90,170,255,.55)}
.pi-tags .pi-rar-legend{color:#f0d79a;border-color:rgba(240,215,154,.6)}
.pi-more{width:36px;height:36px;display:grid;place-items:center;font-size:20px;line-height:1;color:var(--gold);border:1px solid var(--line);background:linear-gradient(180deg,var(--input2),var(--input))}
.pi-pick{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;overflow:hidden;color:var(--gold);font-size:18px;background:var(--input);border:1px dashed rgba(200,170,110,.55)}
.pi-pick img{width:100%;height:100%;object-fit:cover;display:block}
.pi-pick.on{border-style:solid;border-color:var(--gold2)}
.pi-pick:hover{border-color:var(--gold2)}
/* ficha del objeto */
.item-detail{width:min(620px,calc(100vw - 24px))}
.idt{position:relative;display:grid;grid-template-columns:150px minmax(0,1fr);gap:22px;padding:26px 28px 24px}
@media(max-width:560px){.idt{grid-template-columns:1fr;justify-items:center;text-align:center;padding:22px 18px}.idt-acts{justify-content:center}}
.it-face.xl{width:150px;height:150px;font-size:74px}
.idt-main{display:flex;flex-direction:column;gap:8px;min-width:0}
.idt-main h2{font-family:var(--disp);font-weight:700;font-size:22px;letter-spacing:.05em;line-height:1.2;color:var(--cream)}
.idt-tags{display:flex;flex-wrap:wrap;gap:6px}
.idt-tags i{padding:2px 8px;font-style:normal;font-size:11.5px;color:var(--dim);border:1px solid rgba(200,170,110,.3);background:rgba(0,0,0,.2)}
.idt-tags i.cons{color:#ffcf9a;border-color:rgba(255,154,60,.45)}
.idt-tags i.roll{color:#aee9ff;border-color:rgba(72,216,255,.45)}
.idt-tags i.r-poco{color:#9fe4ab;border-color:rgba(120,220,140,.5)}
.idt-tags i.r-rara{color:#a9cfff;border-color:rgba(90,170,255,.55)}
.idt-tags i.r-legend{color:#f0d79a;border-color:rgba(240,215,154,.6)}
.idt-desc{font-size:14.5px;line-height:1.5;color:var(--cream)}
.idt-desc:empty,.idt .it-eff:empty{display:none}
.idt-acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:6px}
.idt-acts .it-del{margin-left:auto}
.item-detail.editing .idt-acts,.item-detail.editing .idt-desc,.item-detail.editing .idt-tags{display:none}
.idt-edit{display:grid;grid-template-columns:44px minmax(0,1fr) 80px;gap:8px;margin-top:4px}
.idt-edit input,.idt-edit select,.idt-edit textarea{padding:9px 10px;color:var(--cream);background:var(--input);border:1px solid rgba(200,170,110,.35);font:inherit;min-width:0}
.idt-edit select{grid-column:1/-1}.idt-edit textarea{grid-column:1/-1;resize:vertical}.idt-edit .actions{grid-column:1/-1;margin:0}
.idt .dlg-x{position:absolute;top:10px;right:10px}
/* elegir ilustración */
.icon-pick{width:min(760px,calc(100vw - 24px))}
.ip-body{display:flex;flex-direction:column;gap:12px;padding:14px 20px 20px}
.ip-body input[type=search]{padding:10px 12px;color:var(--cream);background:var(--input);border:1px solid rgba(200,170,110,.35);font:inherit}
.ip-body input[type=search]:focus{outline:none;border-color:var(--gold2)}
.ip-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;max-height:min(58vh,520px);overflow:auto;padding-right:2px}
.ip-it{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 4px;color:var(--cream);background:linear-gradient(180deg,var(--card1),var(--card2));border:1px solid rgba(200,170,110,.2);transition:border-color .15s,transform .15s}
.ip-it:hover{border-color:var(--gold2);transform:translateY(-2px)}
.ip-it .it-face{width:64px;height:64px;font-size:30px}
.ip-it b{font-size:11.5px;line-height:1.2;text-align:center;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ip-it.none{color:var(--dim)}
.bdg.lock,.idt-tags i.lock{color:#c9b6ff;border-color:rgba(143,108,242,.55)}
/* huecos con imagen: sin texto encima, el nombre sale como tooltip (fuera del hueco: el recorte octogonal lo taparía) */
.slot.has-img em{display:none}
.slots{position:relative}
.slot-tip{position:absolute;z-index:5;transform:translate(-50%,calc(-100% + 4px));max-width:240px;padding:6px 10px;font-size:12.5px;line-height:1.3;color:var(--cream);white-space:nowrap;background:rgba(9,18,33,.97);border:1px solid rgba(200,170,110,.6);box-shadow:0 8px 20px rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .15s,transform .15s}
.slot-tip:after{content:"";position:absolute;left:50%;top:100%;width:8px;height:8px;margin-left:-4px;margin-top:-4px;background:rgba(9,18,33,.97);border-right:1px solid rgba(200,170,110,.6);border-bottom:1px solid rgba(200,170,110,.6);transform:rotate(45deg)}
.slot-tip.on{opacity:1;transform:translate(-50%,-100%)}

/* ---------- mapas de la partida ---------- */
.map-new{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;margin-top:10px}
.map-new input,.map-new select{padding:10px 12px;color:var(--cream);background:var(--input);border:1px solid rgba(200,170,110,.35);font:inherit}
@media(max-width:700px){.map-new{grid-template-columns:1fr}}
.map-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px;margin-top:18px}
.map-card{display:flex;flex-direction:column;background:linear-gradient(180deg,var(--card1),var(--card2));border:1px solid rgba(200,170,110,.24)}
.map-thumb{position:relative;display:grid;place-items:center;height:130px;font-family:var(--disp);font-weight:700;font-size:14px;letter-spacing:.1em;color:var(--gold2);background:radial-gradient(circle at 50% 40%,#22385c,#0b1729);border-bottom:1px solid rgba(200,170,110,.2)}
.map-thumb.l-day{background:radial-gradient(circle at 50% 40%,#6f8db8,#2d4468)}
.map-thumb.l-dusk{background:radial-gradient(circle at 50% 40%,#8a5a3a,#2a1d2e)}
.map-thumb.o-forest{background-image:radial-gradient(circle at 30% 60%,rgba(60,120,70,.6),transparent 40%),radial-gradient(circle at 70% 40%,rgba(50,110,60,.6),transparent 40%),radial-gradient(circle at 50% 40%,#22385c,#0b1729)}
.map-thumb span{position:relative;padding:4px 10px;background:rgba(5,10,20,.6);border:1px solid rgba(200,170,110,.4)}
.map-body{display:flex;flex-direction:column;gap:6px;padding:12px 14px 14px}
.map-body b{font-family:var(--disp);font-weight:700;font-size:16px;color:var(--cream)}
.map-body small{font-size:12px;color:var(--mute)}
.map-body .actions{margin-top:6px;gap:8px}
.map-body form{margin-left:auto}

/* ---------- la Taberna y los candidatos ---------- */
.tav-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px;margin-top:14px}
.tav-card{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--card1),var(--card2));border:1px solid rgba(200,170,110,.24)}
.tav-card.pick{border-color:var(--gold2);box-shadow:0 0 0 1px rgba(240,215,154,.4),0 0 22px rgba(240,215,154,.25)}
.tav-bg{position:absolute;inset:0;background:center/cover;opacity:.22;filter:saturate(.8)}
.tav-in{position:relative;display:flex;flex-direction:column;gap:8px;padding:16px}
.tav-in h3{font-family:var(--disp);font-weight:700;font-size:18px;letter-spacing:.05em;color:var(--cream)}
.tav-gm{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--dim)}
.tav-gm img{width:26px;height:26px;border-radius:50%;border:1px solid rgba(200,170,110,.45)}
.tav-gm b{color:var(--cream)}
.tav-in p.dim{font-size:13.5px;line-height:1.45}
.tav-seats{display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--dim)}
.tav-seats i{display:block;height:6px;background:rgba(0,0,0,.45);border:1px solid rgba(200,170,110,.25);position:relative}
.tav-seats i:after{content:"";position:absolute;inset:0;width:var(--p);background:linear-gradient(90deg,#8f6e34,#f0d79a)}
.tav-wait{font-size:13px;color:var(--hex2)}
.tav-cerrada{padding:9px 11px;border:1px solid rgba(255,154,60,.35);background:rgba(255,154,60,.07)}
.tav-cerrada b{display:block;font-family:var(--disp);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ember)}
.tav-cerrada small{display:block;margin-top:3px;font-size:12.5px;color:var(--dim);line-height:1.45}
.mesa-cerrada{margin-top:8px;padding:9px 11px;font-size:13px;color:var(--dim);border:1px solid rgba(255,154,60,.35);background:rgba(255,154,60,.07)}
.mesa-cerrada b{color:var(--ember)}
.mesa-cita.jugada{color:var(--ember)}
.mesa-pase{color:var(--hex2)}
.mesa-pase.jugada{color:var(--gold)}
.role.vet{color:var(--gold);border-color:rgba(200,170,110,.5)}
.vet-flash{border-color:rgba(200,170,110,.5)}
.vets-head{display:flex;align-items:baseline;gap:8px;margin:14px 0 6px;padding-top:12px;border-top:1px solid var(--line)}
.vets-head .k{margin:0}
.members.vets li{opacity:.75}
.members.vets img{width:34px;height:34px}
.pase-list{list-style:none;display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.pase-list li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:center;padding:10px 12px;background:rgba(200,170,110,.05);border:1px solid rgba(200,170,110,.22)}
.pase-n{font-family:var(--disp);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);white-space:nowrap}
.ya-jugo{display:inline-block;margin-left:6px;padding:1px 6px;font-family:var(--disp);font-weight:600;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(200,170,110,.4)}
.vet-cola{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px}
.vet-cola small{font-size:12.5px}

/* ---------- PNJ ligeros: hexágono de esquinas redondeadas y ficha corta ---------- */
.hexav{display:inline-grid;place-items:center;box-sizing:border-box;width:76px;height:88px;padding:2px;clip-path:url(#rf-hex);background:linear-gradient(180deg,rgba(240,215,154,.95),rgba(122,95,46,.85));flex:none}
.hexav.big{width:124px;height:143px}
.hexav-in{display:grid;place-items:center;width:100%;height:100%;clip-path:url(#rf-hex);background:#10213a center/cover;font-family:var(--disp);font-weight:700;font-size:30px;color:var(--gold2)}
.hexav.big .hexav-in{font-size:44px}
.tipo-pick{display:grid;gap:10px;margin-top:6px}
.tipo-opt{cursor:pointer}
.tipo-opt input{position:absolute;opacity:0;pointer-events:none}
.tipo-in{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:14px;align-items:center;padding:14px 16px;background:var(--input);border:1px solid var(--line);clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);transition:.2s}
.tipo-in b{font-size:15px;color:var(--cream);align-self:end}
.tipo-in small{font-size:13px;color:var(--dim);line-height:1.5;align-self:start}
.tipo-hex{grid-row:1/3;width:30px;height:35px;clip-path:url(#rf-hex);background:linear-gradient(180deg,rgba(200,170,110,.45),rgba(200,170,110,.12))}
.tipo-hex.lleno{background:linear-gradient(180deg,var(--gold2),var(--gold3))}
.tipo-hex.pj{background:linear-gradient(180deg,rgba(72,216,255,.75),rgba(72,216,255,.2))}
.tipo-opt input:checked + .tipo-in{border-color:var(--gold);background:rgba(200,170,110,.08);box-shadow:inset 0 0 0 1px rgba(200,170,110,.35)}
.tipo-opt:hover .tipo-in{border-color:rgba(200,170,110,.55)}
.av-pick{display:flex;align-items:center;gap:14px;flex-wrap:wrap;cursor:pointer;margin-top:6px}
.av-pick input[type=file],.lig-face input[type=file]{display:none}
.av-pick i,.lig-face i{font-style:normal}
.chr-new:has(#tipoLigero:checked) .npc-vis,.chr-new:has(#tipoCompleto:checked) .npc-vis{display:flex}
.chr-new .solo-ligero,.chr-new:has(#tipoPj:checked) .npc-vis{display:none}
.chr-new:has(#tipoLigero:checked) .solo-ligero{display:block}
.lig-top{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap;margin-bottom:6px}
.lig-face{display:grid;justify-items:center;gap:6px;cursor:pointer}
.lig-face i{font-style:normal}
.lig-face:hover i{color:var(--gold)}
.lig-main{flex:1;min-width:260px;display:grid;gap:12px}
.lig-vida{padding:12px 14px;background:var(--input);border:1px solid var(--line)}
.lv-head{display:flex;justify-content:space-between;align-items:baseline}
.lv-head b{font-family:var(--disp);font-size:17px;color:var(--gold2)}
.lv-bar{height:7px;margin:8px 0 10px;background:rgba(0,0,0,.45);border:1px solid rgba(200,170,110,.25);overflow:hidden}
.lv-bar i{display:block;height:100%;background:linear-gradient(90deg,#8f2f2f,#d64545)}
.lv-nums{display:flex;gap:12px}
.lv-nums label{display:grid;gap:3px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.lv-nums input{width:92px}
.lig-mas .actions{display:flex;gap:10px;flex-wrap:wrap}
.lblock{display:block}
.lrow{display:grid;grid-template-columns:minmax(120px,1.1fr) 90px minmax(140px,1.6fr) 74px 32px;gap:8px;align-items:center;margin-bottom:6px}
.lrow.head{margin-bottom:4px}
.lrow.head i{font-style:normal;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.form .lrow input{min-height:38px;padding:7px 10px}
.lrow-roll{padding:7px 12px;font-family:var(--disp);font-weight:600;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold2);background:rgba(200,170,110,.12);border:1px solid var(--gold-line);cursor:pointer}
.lrow-roll:hover{background:rgba(200,170,110,.24)}
.lrow-roll.off{background:none;border:0;cursor:default}
.lrow-del{width:30px;height:30px;font-size:17px;line-height:1;color:var(--mute);background:none;border:1px solid var(--line);cursor:pointer}
.lrow-del:hover{color:var(--danger);border-color:rgba(255,107,107,.5)}
.lrow-add{display:inline-flex;width:auto;align-self:start;justify-self:start;margin:2px 0 6px}
.lblock small.dim{display:block;margin-top:2px}
.lig-eco{margin:10px 0 0;padding:10px 14px;background:rgba(200,170,110,.08);border:1px solid var(--gold-line);color:var(--cream)}
.lig-eco b{font-family:var(--disp);font-size:22px;color:var(--gold2);margin-right:8px}
.lig-eco small{color:var(--mute);margin-left:8px}
.col-pick{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.col-opt input{position:absolute;opacity:0;pointer-events:none}
.col-opt span{display:block;width:30px;height:35px;clip-path:url(#rf-hex);background:repeating-linear-gradient(45deg,#1c3350,#1c3350 4px,#0b1526 4px,#0b1526 8px);cursor:pointer;transition:.15s}
.col-opt input:checked + span{transform:scale(1.12)}
.col-opt{display:grid;justify-items:center;gap:4px}
.col-opt::after{content:"";width:6px;height:6px;border-radius:50%;background:transparent;transition:.15s}
.col-opt:has(input:checked)::after{background:var(--gold2)}
@media(max-width:700px){.lrow{grid-template-columns:1fr 1fr;gap:6px}.lrow.head{display:none}.lrow input:nth-child(3){grid-column:1/-1}}
/* ---------- páginas legales y aviso de cookies ---------- */
.legal-nav{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px}
.legal-nav a{padding:8px 14px;font-family:var(--disp);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);border:1px solid var(--line);background:var(--input)}
.legal-nav a:hover{color:var(--gold2);border-color:var(--gold-line)}
.legal-nav a.on{color:#1a1206;background:linear-gradient(180deg,#f0d79a,#c8aa6e);border-color:var(--gold)}
.legal h2{margin:22px 0 8px;font-family:var(--disp);font-size:18px;color:var(--gold2)}
.legal h2:first-child{margin-top:0}
.legal p,.legal li{font-size:15px;line-height:1.7;color:var(--dim)}
.legal p{margin-bottom:10px}
.legal ul{margin:0 0 12px 18px;display:flex;flex-direction:column;gap:6px}
.legal b{color:var(--cream)}
.legal code{padding:1px 6px;font-size:13px;color:var(--gold2);background:var(--input);border:1px solid var(--line)}
.legal-tbl{width:100%;border-collapse:collapse;margin:8px 0 14px;font-size:14px}
.legal-tbl th{text-align:left;font-family:var(--disp);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);padding:6px 10px;border-bottom:1px solid var(--line)}
.legal-tbl td{padding:8px 10px;color:var(--dim);border-bottom:1px solid rgba(200,170,110,.12)}
.legal-pie{font-size:13.5px;text-align:center;margin-bottom:24px}
.foot-legal a{color:var(--mute)}
.foot-legal a:hover{color:var(--gold2)}
.ck-bar{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:space-between;max-width:900px;margin:0 auto;padding:14px 18px;background:color-mix(in srgb,var(--panel) 96%,transparent);border:1px solid var(--gold-line);clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);box-shadow:0 12px 40px rgba(0,0,0,.6)}
.ck-bar p{margin:0;flex:1;min-width:260px;font-size:13.5px;line-height:1.6;color:var(--dim)}
.ck-bar a{color:var(--gold2)}
@media(max-width:600px){.ck-bar{left:8px;right:8px;bottom:8px;padding:12px 14px}}
.npc-lig{display:inline-block;margin-left:6px;padding:1px 6px;font-family:var(--disp);font-weight:600;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);border:1px solid var(--line)}
.cal-card.jugada .k{color:var(--ember)}
.tav-ask summary{list-style:none;cursor:pointer}
.tav-ask summary::-webkit-details-marker{display:none}
.tav-ask form{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.tav-ask textarea{padding:9px 10px;color:var(--cream);background:var(--input);border:1px solid rgba(200,170,110,.35);font:inherit;resize:vertical}
.tav-people{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px;margin-top:10px}
.tav-people li{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid rgba(200,170,110,.14);background:rgba(0,0,0,.18)}
.tav-people img{width:34px;height:34px;border-radius:50%;border:1px solid rgba(200,170,110,.4)}
.tav-people b{display:block;font-size:14px;color:var(--cream)}
.tav-people small{display:block;font-size:11.5px;color:var(--mute)}
.cands{list-style:none;display:flex;flex-direction:column;gap:12px;margin-top:10px}
.cands>li{padding:12px;border:1px solid rgba(200,170,110,.2);background:rgba(0,0,0,.18)}
.cand-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cand-head img{width:36px;height:36px;border-radius:50%;border:1px solid rgba(200,170,110,.45)}
.cand-head b{display:block;font-size:15px;color:var(--cream)}
.cand-head small{display:block;font-size:12px;color:var(--mute)}
.cand-acts{display:flex;align-items:center;gap:10px;margin-left:auto}
.cand-note{margin:8px 0 0;font-size:13.5px;color:var(--dim);font-style:italic}
.cand-msgs{list-style:none;display:flex;flex-direction:column;gap:6px;margin:10px 0 0}
.cand-msgs li{max-width:85%;padding:7px 10px;font-size:13.5px;line-height:1.4;color:var(--cream);background:rgba(200,170,110,.08);border:1px solid rgba(200,170,110,.2)}
.cand-msgs li.me{align-self:flex-end;background:rgba(72,216,255,.08);border-color:rgba(72,216,255,.3)}
.cand-msgs li small{display:block;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);margin-bottom:2px}
.cands .copy-row{margin-top:10px}
.field .seats{display:block;padding:10px 0;font-size:14px;color:var(--gold2)}
.tool-row.tool-form{flex-wrap:wrap}
.tool-row.tool-form input{flex:1 1 140px;min-width:0;padding:7px 9px;color:var(--cream);background:var(--input);border:1px solid rgba(200,170,110,.3);font:inherit;font-size:13px}
.join-warn{margin:14px auto 0;max-width:52ch;padding:10px 14px;font-size:14px;color:#ffcf9a;border:1px solid rgba(255,154,60,.45);background:rgba(255,154,60,.08)}
.members li.unconfirmed{opacity:.75}.members li.unconfirmed img{filter:grayscale(.6)}.wait-tag{font-style:normal;color:#ffcf9a}.members li form+form{margin-left:6px}
.mesa .role.admin{color:var(--arcane)}
.mesa-wait{flex-basis:100%;color:#ffcf9a}.move-form{display:inline-flex;gap:4px;align-items:center}.move-form select{padding:5px 6px;font-size:12px;color:var(--cream);background:var(--input);border:1px solid rgba(200,170,110,.3);max-width:150px}
.members li.is-gm{background:linear-gradient(90deg,rgba(200,170,110,.16),transparent);border:1px solid rgba(200,170,110,.45);border-left:3px solid var(--gold2);margin-bottom:6px}.members li.is-gm img{border-color:var(--gold2);box-shadow:0 0 12px rgba(240,215,154,.4)}.members li.is-gm b{color:var(--gold2)}

/* ---- La mesa: máster destacado + plazas con check ---- */
.table-panel .panel-head{margin-bottom:14px}
.seats-pill{font-family:var(--disp);font-weight:600;font-size:13px;letter-spacing:.08em;color:var(--gold2);padding:3px 10px;border:1px solid rgba(200,170,110,.35);background:rgba(200,170,110,.08);border-radius:999px}
.seats-pill i{font-style:normal;color:var(--gold3);margin:0 2px}
.seats-pill.full{color:#ffcf9a;border-color:rgba(255,154,60,.45);background:rgba(255,154,60,.1)}
.gm-seat{position:relative;display:flex;align-items:center;gap:16px;padding:14px 16px;margin-bottom:16px;border:1px solid rgba(200,170,110,.45);background:linear-gradient(100deg,rgba(200,170,110,.18),rgba(200,170,110,.05) 55%,transparent);clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.gm-seat:before{content:"";position:absolute;inset:0;background:radial-gradient(120px 80px at 8% 50%,rgba(240,215,154,.16),transparent 70%);pointer-events:none}
.gm-av{width:64px;height:64px;border-radius:50%;flex:none;border:2px solid var(--gold2);box-shadow:0 0 0 4px var(--night),0 0 0 5px rgba(200,170,110,.55),0 0 22px rgba(240,215,154,.35);object-fit:cover}
.gm-info{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.gm-k{display:inline-flex;align-items:center;gap:6px;font-family:var(--disp);font-weight:600;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:4px}
.gm-k .gm-ico{width:16px;height:16px}
.gm-name{font-family:var(--disp);font-weight:600;font-size:19px;letter-spacing:.04em;color:var(--gold2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gm-info small{margin-top:4px;font-size:12.5px;color:var(--dim);font-family:var(--body);text-transform:none;letter-spacing:0}
.seats-line{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;margin-bottom:12px;font-size:12.5px;color:var(--dim)}
.seats-line .wait{color:#ffcf9a}
.seats-line .hint{margin-left:auto;color:var(--mute);font-size:12px}
.members.seats{gap:10px}
.members.seats li{position:relative;display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"av main chk" "av tools tools";column-gap:12px;row-gap:0;align-items:center;padding:10px 12px 10px 14px;border:1px solid rgba(200,170,110,.18);background:rgba(255,255,255,.025);transition:background .25s,border-color .25s}
.members.seats li:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:rgba(200,170,110,.25);transition:background .25s}
.members.seats li img{grid-area:av;width:40px;height:40px;border-radius:50%;border:1px solid var(--gold3);align-self:start;transition:filter .25s,border-color .25s}
.members.seats .mb-main{grid-area:main;display:flex;flex-direction:column;line-height:1.25;min-width:0}
.members.seats .mb-main b{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.members.seats .mb-main small{margin-top:3px;font-size:10.5px}
.members.seats li.confirmed{border-color:rgba(72,216,255,.35);background:linear-gradient(90deg,rgba(72,216,255,.16),rgba(143,108,242,.14) 55%,rgba(143,108,242,.04));box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.members.seats li.confirmed:before{background:linear-gradient(180deg,var(--hex2),var(--arcane));box-shadow:0 0 10px rgba(72,216,255,.55)}
.members.seats li.confirmed img{border-color:rgba(72,216,255,.7)}
.members.seats li.confirmed small{color:#9fdcf0}
.members.seats li.waiting img{filter:grayscale(.7) brightness(.85)}
.members.seats li.waiting .mb-main b{color:var(--dim)}
.wait-tag{font-style:normal;color:#ffcf9a}
.chk-form{grid-area:chk;display:flex}
.seat-chk{grid-area:chk;width:32px;height:32px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:transparent;border:1.5px solid rgba(200,170,110,.45);background:rgba(0,0,0,.25);transition:all .2s;flex:none}
.seat-chk svg{width:16px;height:16px}
.seat-chk:hover:not(:disabled){border-color:var(--hex2);color:rgba(72,216,255,.6)}
.seat-chk.on{color:#fff;border-color:transparent;background:linear-gradient(135deg,var(--hex2),var(--arcane));box-shadow:0 0 14px rgba(72,216,255,.45),0 0 0 1px rgba(255,255,255,.15) inset}
.seat-chk.on:hover:not(:disabled){box-shadow:0 0 14px rgba(255,107,107,.4);background:linear-gradient(135deg,#7a8fb0,#5c6b7d);color:rgba(255,255,255,.85)}
.seat-chk:disabled{opacity:.35;cursor:not-allowed}
.seat-chk.static{cursor:default}
.mb-tools{grid-area:tools;display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;margin-top:8px;padding-top:8px;border-top:1px dashed rgba(200,170,110,.18)}
.mb-tools form{display:inline-flex}
.mb-tools .tl{font-family:var(--body);font-size:12px;color:var(--mute);padding:2px 0;transition:color .2s}
.mb-tools .tl:hover{color:var(--gold2)}
.mb-tools .tl.danger:hover{color:var(--danger)}
.mb-tools .move-form select{-webkit-appearance:none;appearance:none;padding:2px 18px 2px 0;font:inherit;font-size:12px;color:var(--mute);background:transparent url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 10 6%27%3E%3Cpath d=%27M1 1l4 4 4-4%27 fill=%27none%27 stroke=%27%23a09b8c%27 stroke-width=%271.5%27/%3E%3C/svg%3E") no-repeat right 4px center/9px;border:0;border-radius:0;max-width:170px;cursor:pointer}
.mb-tools .move-form select:hover{color:var(--gold2)}
@media(max-width:480px){.gm-av{width:54px;height:54px}.gm-name{font-size:17px}.seats-line .hint{display:none}}

/* ---- ficha de usuario (admin) ---- */
.tav-people li.is-link{cursor:pointer;transition:border-color .2s,background .2s}
.tav-people li.is-link:hover{border-color:rgba(200,170,110,.5);background:rgba(200,170,110,.08)}
.au-head{display:flex;align-items:flex-start;gap:22px;flex-wrap:wrap}
.au-av{width:96px;height:96px;border-radius:50%;flex:none;border:2px solid var(--gold2);box-shadow:0 0 0 4px var(--night),0 0 0 5px rgba(200,170,110,.5),0 0 26px rgba(240,215,154,.3);object-fit:cover}
.au-id{flex:1 1 320px;min-width:0}
.au-name{font-family:var(--disp);font-weight:600;font-size:clamp(22px,3vw,30px);letter-spacing:.04em;color:var(--gold2);line-height:1.1}
.au-handle{margin-top:4px;font-size:13px;color:var(--mute)}
.au-pills{margin-top:10px;display:flex;gap:6px;flex-wrap:wrap}
.au-bio{margin-top:12px;font-size:14px;color:var(--dim);max-width:60ch}
.au-meta{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:12px;font-size:12.5px;color:var(--mute)}
.au-meta b{color:var(--cream);font-weight:600}
.au-acts{display:flex;flex-direction:column;gap:8px;flex:none}
.au-acts .btn{width:100%;justify-content:center}
.au-stats{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}
.au-stats .stat-tile b i{font-style:normal;font-family:var(--body);font-size:11px;color:#ffcf9a;margin-left:6px;vertical-align:middle}
.au-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}
@media(max-width:900px){.au-grid{grid-template-columns:1fr}}
.au-tables,.au-rolls{list-style:none;display:flex;flex-direction:column;gap:8px}
.au-tables li{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid rgba(200,170,110,.16);background:rgba(0,0,0,.18);border-left:3px solid rgba(200,170,110,.3)}
.au-tables li.gm{border-left-color:var(--gold2);background:linear-gradient(90deg,rgba(200,170,110,.14),rgba(0,0,0,.18) 60%)}
.au-tables li.ok{border-left-color:var(--hex2);background:linear-gradient(90deg,rgba(72,216,255,.12),rgba(143,108,242,.08) 55%,rgba(0,0,0,.18))}
.au-tables li.wait{border-left-color:#ffcf9a}
.au-tables li.ask{border-left-color:var(--arcane)}
.au-st{width:26px;height:26px;flex:none;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(0,0,0,.3);font-size:13px;color:var(--gold2)}
.au-st img{width:16px;height:16px}
li.ok .au-st{color:#fff;background:linear-gradient(135deg,var(--hex2),var(--arcane))}
.au-tmain{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.3}
.au-tmain .strong{color:var(--cream);font-weight:600}
.au-tmain .strong:hover{color:var(--gold2)}
.au-tmain small{font-size:12px;color:var(--mute)}
.au-tnum{font-family:var(--disp);font-weight:600;font-size:16px;color:var(--gold2);flex:none}
.au-tnum small{font-family:var(--body);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.au-rolls li{display:flex;align-items:center;gap:12px;padding:8px 12px;border:1px solid rgba(200,170,110,.14);background:rgba(0,0,0,.18)}
.au-rolls b{font-family:var(--disp);font-weight:600;font-size:20px;color:var(--gold2);min-width:36px;text-align:center}
.au-rolls b.crit-max{color:var(--hex2)}.au-rolls b.crit-min{color:var(--danger)}
.au-rolls span{display:flex;flex-direction:column;line-height:1.3;font-size:14px;min-width:0}
.au-rolls span small{font-size:11.5px;color:var(--mute)}
.au-chars{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
.au-char{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid rgba(200,170,110,.18);background:rgba(0,0,0,.18);border-left:3px solid var(--pa);transition:border-color .2s,background .2s}
.au-char:hover{border-color:rgba(200,170,110,.5);background:rgba(200,170,110,.06)}
.au-char.npc{opacity:.8}
.au-char .av{width:46px;height:46px;flex:none;border-radius:50%;background:var(--input) center/cover;border:1px solid var(--pa);display:inline-flex;align-items:center;justify-content:center;font-family:var(--disp);font-weight:600;color:var(--gold2)}
.au-cmain{display:flex;flex-direction:column;min-width:0;line-height:1.3;flex:1}
.au-cmain b{font-size:15px;color:var(--cream);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.au-cmain b .tag{font-style:normal;margin-left:6px}
.au-cmain > small{font-size:11.5px;color:var(--mute)}
.au-cmain .mini-bar{margin-top:6px}

/* ---- invitación dentro de La mesa ---- */
.invite-box{margin-top:16px;border-top:1px solid rgba(200,170,110,.2);padding-top:12px}
.invite-box summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.invite-box summary::-webkit-details-marker{display:none}
.invite-box summary:before{content:"›";color:var(--gold);font-family:var(--disp);font-size:16px;line-height:1;transition:transform .2s;display:inline-block;transform:translateY(1px)}
.invite-box[open] summary:before{transform:rotate(90deg) translateX(1px)}
.invite-box summary small{font-size:12px}
.invite-body{margin-top:12px}
.invite-body > p.dim{font-size:13px;margin-bottom:8px}
.invite-body .og-preview{margin:12px 0 4px}
.invite-body .copy-row{margin-top:6px}

/* ---- avisos ---- */
header.top nav .bell{position:relative;display:inline-flex;align-items:center;color:var(--dim)}
header.top nav .bell .ico{width:20px;height:20px}
header.top nav .bell:hover{color:var(--gold2)}
header.top nav .bell.has-new{color:var(--gold2)}
header.top nav .bell .badge{position:absolute;top:-8px;right:-11px;margin:0}
.notices{list-style:none;display:flex;flex-direction:column;gap:8px}
.notices li{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid rgba(200,170,110,.16);background:rgba(0,0,0,.18)}
.notices li.new{border-color:rgba(72,216,255,.35);background:linear-gradient(90deg,rgba(72,216,255,.1),rgba(143,108,242,.06) 55%,rgba(0,0,0,.18))}
.nt-dot{width:8px;height:8px;border-radius:50%;flex:none;background:rgba(200,170,110,.25)}
li.new .nt-dot{background:var(--hex2);box-shadow:0 0 8px var(--hex2)}
.nt-main{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.35}
.nt-main b{color:var(--cream);font-size:15px}
.nt-body{font-size:13.5px;color:var(--dim);margin-top:2px}
.nt-main small{font-size:11.5px;color:var(--mute);margin-top:4px}
.dm-line{margin-top:6px!important}
.dm-line span{font-size:13px}
@media(max-width:640px){.notices li{flex-wrap:wrap}.notices li .btn{margin-left:20px}}

.nt-del{display:flex;flex:none}
.nt-del .x{color:var(--mute);font-size:20px;line-height:1;padding:4px 6px;transition:color .2s}
.nt-del .x:hover{color:var(--danger)}

/* ---- instrucciones de la mesa y clones ---- */
.stage-btns{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.clone-line{margin-top:6px;font-size:12.5px;color:var(--dim)}
.clone-line a{color:var(--gold2);border-bottom:1px dotted rgba(240,215,154,.5)}
.clone-form{display:flex;gap:6px;align-items:center;margin:8px 0 4px}
.clone-form select{flex:1;min-width:0;padding:6px 8px;font-size:13px;color:var(--cream);background:var(--input);border:1px solid rgba(200,170,110,.3)}
.help-dialog{width:min(760px,calc(100vw - 24px))}
.help-head{position:relative;padding:22px 26px 12px;border-bottom:1px solid rgba(200,170,110,.25)}
.help-head .h2{margin:4px 0 0}
.help-head .x{position:absolute;top:14px;right:16px;font-size:26px;line-height:1;color:var(--mute);padding:4px 8px}
.help-head .x:hover{color:var(--gold2)}
.help-body{padding:16px 26px 26px;font-size:15px;line-height:1.55;color:var(--cream)}
.help-body h4{font-family:var(--disp);font-weight:600;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold2);margin:18px 0 8px;padding-bottom:6px;border-bottom:1px solid rgba(200,170,110,.2)}
.help-body h4:first-child{margin-top:0}
.help-body ul{margin:0 0 6px;padding-left:20px}
.help-body li{margin:4px 0}
.help-body li::marker{color:var(--gold)}
.help-body p{margin:0 0 10px}
.help-body b{color:var(--gold2);font-weight:600}
.help-empty{font-style:italic}
.help-panel details summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.help-panel details summary::-webkit-details-marker{display:none}
.help-panel details summary:after{content:"›";margin-left:auto;color:var(--gold);font-family:var(--disp);font-size:18px;transition:transform .2s}
.help-panel details[open] summary:after{transform:rotate(90deg)}
.help-panel .help-body{padding:14px 0 0}
.clone-panel .dim{font-size:14px;margin:6px 0 12px}
.clone-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.clone-card{width:100%;display:flex;align-items:center;gap:12px;padding:10px 12px;text-align:left;border:1px solid rgba(200,170,110,.25);background:rgba(0,0,0,.2);transition:border-color .2s,background .2s}
.clone-card:hover{border-color:var(--gold2);background:rgba(200,170,110,.08)}
.clone-card .av{width:44px;height:44px;flex:none;border-radius:50%;background:var(--input) center/cover;border:1px solid var(--gold3);display:inline-flex;align-items:center;justify-content:center;font-family:var(--disp);font-weight:600;color:var(--gold2)}
.clone-card > span:not(.av){flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.3}
.clone-card b{color:var(--cream);font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.clone-card small{font-size:12px;color:var(--mute)}
.clone-card i{font-style:normal;font-size:12px;color:var(--gold);white-space:nowrap}

.au-cwrap{position:relative}
.au-cwrap .au-char{padding-right:40px}
.au-cdel{position:absolute;top:8px;right:8px}
.au-cdel .x{color:var(--mute);font-size:20px;line-height:1;padding:4px 8px;transition:color .2s}
.au-cdel .x:hover{color:var(--danger)}

.map-list{list-style:none;display:flex;flex-direction:column;gap:8px;margin-top:10px}
.map-list li{display:flex;align-items:center;gap:12px;padding:8px 12px;border:1px solid rgba(200,170,110,.16);background:rgba(0,0,0,.18)}
.map-list .mb-main{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.3}
.map-list .mb-main b{font-size:14px;color:var(--cream)}
.map-list .mb-main small{font-size:11.5px;color:var(--mute)}
.map-mini{width:44px;height:30px;flex:none;border:1px solid rgba(200,170,110,.4);background:radial-gradient(circle at 50% 40%,#2b3d62,#0b1426)}
.map-mini.l-day{background:radial-gradient(circle at 50% 40%,#6f8db8,#2d4468)}
.map-mini.l-dusk{background:radial-gradient(circle at 50% 40%,#8a5a3a,#2a1d2e)}
.map-mini.o-forest,.map-mini.o-grass{background-image:radial-gradient(circle at 30% 60%,rgba(60,120,70,.7),transparent 45%),radial-gradient(circle at 50% 40%,#2b3d62,#0b1426)}
#t-mapa .map-new{display:flex;gap:8px;flex-wrap:wrap}
#t-mapa .map-new input{flex:1 1 220px;min-width:0;padding:8px 10px;color:var(--cream);background:var(--input);border:1px solid rgba(200,170,110,.3);font:inherit;font-size:14px}
#t-mapa .map-new select{padding:8px;color:var(--cream);background:var(--input);border:1px solid rgba(200,170,110,.3);font:inherit;font-size:13px}

.sc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px;margin-top:18px}
.sc-thumb{position:relative;height:140px;background:#0b1426 center/cover;border-bottom:1px solid rgba(200,170,110,.25)}
.sc-thumb.text{display:grid;place-items:center;padding:14px;background:radial-gradient(circle at 50% 30%,#182c4a,#0b1729);font-size:13px;color:var(--dim);text-align:center;font-style:italic}
.sc-card .map-body .actions{flex-wrap:wrap;align-items:center}
.sc-edit{flex-basis:100%}
.sc-edit summary{list-style:none;display:inline-flex;cursor:pointer}
.sc-edit summary::-webkit-details-marker{display:none}
.sc-edit[open] summary{margin-bottom:8px}
.sc-edit .form{width:100%}
#t-escenas .sc-new .it-row2{align-items:end}

/* ---- responsive: pasada general ---- */
.chk{white-space:normal;align-items:flex-start;line-height:1.35}
.chk input{margin-top:2px;flex:none}
@media(max-width:760px){.two-col{grid-template-columns:1fr}.grid-2{grid-template-columns:1fr}.it-row2{grid-template-columns:1fr}.copy-row{flex-wrap:wrap}.copy-row input,.copy-row select{flex:1 1 100%;min-width:0}}
.desk-note{display:none;margin:0 0 16px;padding:10px 14px;font-size:13px;color:#ffcf9a;border:1px solid rgba(255,154,60,.45);background:rgba(255,154,60,.08)}
.desk-note b{color:var(--cream)}
@media(max-width:820px){.desk-note{display:block}}
@media(max-width:700px){.ctab span{font-size:10.5px}.members.seats li{grid-template-columns:auto 1fr auto}.mb-tools{gap:4px 10px}.gm-seat{padding:12px}.map-grid,.sc-grid{grid-template-columns:1fr}.au-head{gap:14px}.au-acts{flex-direction:row;flex-wrap:wrap}.au-acts .btn{width:auto}}
.lore-card .mail-ico{color:var(--gold2)}
.lore-card .mail-ico .ico{width:24px;height:24px}
/* escenas: acciones alineadas en fila */
.sc-card .map-body .actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.sc-card .map-body .actions form{margin-left:0}
.sc-card .map-body .actions form:last-child{margin-left:auto}
.sc-card .map-body .actions .btn{padding:8px 16px;font-size:11px;letter-spacing:.12em;white-space:nowrap}
.sc-edit{flex-basis:auto}
.sc-edit[open]{flex-basis:100%}
.sc-edit[open] summary{margin-bottom:10px}
/* alineado de botones */
.stage-btns{margin-top:14px}.stage-btns .figure-btn{margin-top:0}
.mesa .actions .btn{padding:9px 18px;font-size:11.5px;line-height:1.4}
.mesa{display:flex;flex-direction:column}.mesa-in{display:flex;flex-direction:column;flex:1}.mesa-in .actions{margin-top:auto;padding-top:14px}
.tav-mode{display:inline-block;margin-left:6px;padding:1px 7px;font-size:9px;letter-spacing:.14em;border:1px solid rgba(200,170,110,.4);border-radius:2px;color:var(--gold);vertical-align:middle}
.tav-mode.open{border-color:rgba(72,216,255,.45);color:var(--hex2)}
.tav-signup{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}.tav-signup small{font-size:12px}
.mode-opt{align-items:flex-start;margin-top:8px}.mode-opt input{margin-top:3px}
/* personajes de la lista de espera: en pequeño, bajo los que tienen plaza */
.char-wait{margin-top:16px;padding-top:12px;border-top:1px dashed rgba(200,170,110,.25)}
.char-wait .k{margin-bottom:10px}
.char-grid.sm{grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px}
.char-grid.sm .char-card{padding:10px 6px 9px;gap:4px;opacity:.7;filter:saturate(.6);border-style:dashed}
.char-grid.sm .char-card:hover{opacity:1;filter:none}
.char-grid.sm .char-card .av{width:40px;height:40px;font-size:15px}
.char-grid.sm .char-card .nm{font-size:10.5px;letter-spacing:.05em}
.char-grid.sm .char-card .by{font-size:10.5px}
.char-grid.sm .char-card .mini-bar{display:none}
.char-grid.sm .char-card .house-ico{width:18px;height:18px;top:5px;right:5px}
/* ---------- línea de progreso de la ficha y sello «Ficha completa» ---------- */
.sheet-prog{position:relative;width:100%;max-width:460px;margin:18px auto 0;padding:6px 0 2px}
.sheet-prog .prog-line{position:absolute;left:18px;right:18px;top:19px;height:2px;background:rgba(200,170,110,.18)}
.sheet-prog .prog-line i{display:block;height:100%;width:var(--p,0%);background:linear-gradient(90deg,var(--accent2,#c8aa6e),var(--gold2));box-shadow:0 0 8px rgba(240,215,154,.5);transition:width .5s ease}
.prog-nodes{position:relative;display:flex;justify-content:space-between;align-items:flex-start;gap:4px;margin:0;padding:0;list-style:none}
.prog-nodes li{flex:1;display:flex;justify-content:center;min-width:0}
.pnode{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0;padding:0;background:none;border:0;color:var(--mute);cursor:pointer;font:inherit}
.pnode i{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#0d1a30;border:2px solid rgba(200,170,110,.35);font-size:13px;font-style:normal;color:#0d1a30;transition:.25s}
.pnode.part i{border-color:var(--gold);background:radial-gradient(circle,rgba(200,170,110,.35) 0 38%,#0d1a30 40%)}
.pnode.ok i{border-color:var(--gold2);background:linear-gradient(180deg,var(--gold2),var(--gold));color:#1a1206;box-shadow:0 0 10px rgba(240,215,154,.55)}
.pnode small{font-family:var(--disp);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pnode em{font-size:10px;font-style:normal;color:var(--mute);margin-top:-3px}
.pnode.ok small{color:var(--gold2)}.pnode:hover small{color:var(--cream)}
.prog-nodes .seal-li{flex:0 0 auto}
.pseal{display:flex;flex-direction:column;align-items:center;gap:5px;color:var(--mute)}
.pseal svg{width:26px;height:26px;padding:5px;border-radius:50%;background:#0d1a30;border:2px dashed rgba(200,170,110,.35);color:transparent;transition:.3s}
.pseal b{font-family:var(--disp);font-weight:600;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.sheet-prog.complete .pseal svg{border:2px solid var(--gold2);background:linear-gradient(180deg,var(--gold2),var(--gold));color:#1a1206;box-shadow:0 0 0 3px rgba(5,10,20,.9),0 0 0 4px rgba(200,170,110,.5),0 0 18px rgba(240,215,154,.6)}
.sheet-prog.complete .pseal b{color:var(--gold2)}
.sheet-prog.pop .pseal svg{animation:seal-pop .9s cubic-bezier(.2,1.4,.4,1)}
@keyframes seal-pop{0%{transform:scale(.6) rotate(-12deg)}60%{transform:scale(1.25) rotate(4deg)}100%{transform:none}}
@media(max-width:480px){.pnode small{display:none}.pseal b{font-size:8.5px}}
/* sello de ficha en las tarjetas de personaje: pastilla mínima con check o anillo de progreso */
.sheet-badge{display:inline-flex;align-items:center;gap:5px;margin-top:3px;padding:2px 9px 2px 5px;font-family:var(--body);font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;color:var(--mute);background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:999px}
.sheet-badge i{width:12px;height:12px;border-radius:50%;background:conic-gradient(var(--gold) var(--p,0deg),rgba(200,170,110,.16) 0);position:relative}
.sheet-badge i:after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--input)}
.sheet-badge.ok{gap:4px;padding:2px 10px 2px 4px;color:var(--gold2);background:linear-gradient(180deg,rgba(240,215,154,.14),rgba(200,170,110,.06));border-color:rgba(240,215,154,.5);box-shadow:0 0 12px rgba(240,215,154,.18),inset 0 1px 0 rgba(255,255,255,.08)}
.sheet-badge.ok svg{width:14px;height:14px;padding:2.5px;border-radius:50%;background:linear-gradient(180deg,var(--gold2),var(--gold));color:#1a1206;box-shadow:0 1px 3px rgba(0,0,0,.45)}
.char-card:hover .sheet-badge.ok{box-shadow:0 0 16px rgba(240,215,154,.34),inset 0 1px 0 rgba(255,255,255,.1)}
.char-grid.sm .sheet-badge{margin-top:2px;padding:1px 7px 1px 3px;font-size:8.5px;gap:3px}
.char-grid.sm .sheet-badge i{width:10px;height:10px}.char-grid.sm .sheet-badge i:after{inset:2.5px}
.char-grid.sm .sheet-badge.ok svg{width:11px;height:11px;padding:2px}
/* nodos compactos: el nombre de la sección sale como etiqueta flotante al pasar el ratón */
.prog-nodes li{position:relative}
.pnode{position:relative}
.pnode small{position:absolute;top:-22px;left:50%;transform:translateX(-50%);padding:2px 7px;background:#0d1a30;border:1px solid rgba(200,170,110,.4);border-radius:2px;color:var(--cream);opacity:0;pointer-events:none;transition:.2s;z-index:3;overflow:visible;max-width:none}
.pnode:hover small,.pnode:focus-visible small{opacity:1;top:-26px}
.pnode.ok small{color:var(--gold2)}
.pnode em{margin-top:0;font-size:10.5px}
.pnode.ok em{color:var(--gold)}
@media(max-width:480px){.pnode small{display:block}}
/* ---------- calendario de partidas ---------- */
.cal-card em.cal-when{display:block;margin-top:2px;font-style:normal;font-size:12px;color:var(--gold)}
.cal-card.soon{border-color:rgba(240,215,154,.5);box-shadow:0 0 18px rgba(240,215,154,.14)}
.next-session{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.next-session .ns-ico{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:rgba(200,170,110,.1);border:1px solid rgba(200,170,110,.35);color:var(--gold2)}
.next-session .ns-ico svg{width:24px;height:24px}
.ns-main{flex:1;min-width:200px;display:flex;flex-direction:column;gap:2px}
.ns-main b{font-family:var(--disp);font-size:19px;letter-spacing:.04em;color:var(--cream)}
.ns-main em{font-style:normal;font-size:13px;color:var(--gold)}
.ns-main p{margin:4px 0 0;font-size:13px}
.ns-count{flex:none;padding:6px 14px;font-family:var(--disp);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold2);border:1px solid rgba(200,170,110,.4);border-radius:999px}
.next-session.soon{border-color:rgba(240,215,154,.5)}
.next-session.soon .ns-count{color:#1a1206;background:linear-gradient(180deg,var(--gold2),var(--gold));border-color:var(--gold2)}
.cal-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.cal-head h2{flex:1;margin:0;text-align:center}
.cal-nav{display:grid;place-items:center;width:30px;height:30px;font-size:18px;color:var(--gold);border:1px solid var(--line);border-radius:3px}
.cal-nav:hover{border-color:var(--gold);color:var(--gold2)}
.cal-today{font-size:12px;color:var(--hex2)}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.cal-dow{padding-bottom:4px;text-align:center;font-family:var(--disp);font-size:10px;letter-spacing:.16em;color:var(--mute)}
.cal-cell{position:relative;min-height:76px;padding:4px;background:var(--input);border:1px solid var(--line);border-radius:3px;display:flex;flex-direction:column;gap:3px}
.cal-cell.out{background:none;border:0;min-height:0}
.cal-cell.past{opacity:.55}
.cal-cell[data-pick]{cursor:pointer}
.cal-cell[data-pick]:hover{border-color:var(--gold);box-shadow:inset 0 0 0 1px rgba(200,170,110,.25)}
.cal-cell .cal-n{font-family:var(--disp);font-size:12px;color:var(--dim);text-align:right}
.cal-cell.today{border-color:rgba(72,216,255,.55)}
.cal-cell.today .cal-n{color:var(--hex2);font-weight:700}
.cal-cell.has{background:linear-gradient(180deg,rgba(200,170,110,.12),var(--input));border-color:rgba(200,170,110,.45)}
.cal-chip{display:block;padding:2px 5px;background:linear-gradient(180deg,var(--gold2),var(--gold));color:#1a1206;border-radius:2px;font-size:10px;line-height:1.25;overflow:hidden}
.cal-chip i{font-style:normal;font-weight:700;letter-spacing:.04em}
.cal-chip small{display:block;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-chip.off{background:rgba(255,255,255,.07);color:var(--mute);text-decoration:line-through}
.cal-foot{margin-top:12px;font-size:12.5px}
.cal-cols>aside{display:flex;flex-direction:column;gap:16px}
.cal-fields{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:10px}
.cal-form .field{margin-bottom:10px}
.cal-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.cal-list li{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;padding-bottom:10px;border-bottom:1px solid rgba(200,170,110,.14)}
.cal-list li:last-child{border-bottom:0;padding-bottom:0}
.cal-list li.off .cl-main b{text-decoration:line-through;color:var(--mute)}
.cl-date{display:grid;place-items:center;width:44px;padding:4px 0;background:rgba(200,170,110,.1);border:1px solid rgba(200,170,110,.3);border-radius:3px}
.cl-date b{font-family:var(--disp);font-size:17px;color:var(--gold2);line-height:1}
.cl-date small{font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.cl-main{display:flex;flex-direction:column;gap:2px;min-width:0}
.cl-main b{font-size:14px;color:var(--cream)}
.cl-main small{font-size:12px;color:var(--mute)}
.cl-main em{font-style:normal;font-size:12.5px;color:var(--dim)}
.cal-list .cl-edit{grid-column:1/-1}
.cal-list .cl-edit summary{font-size:12px;cursor:pointer;list-style:none}
.cal-list .cl-edit summary::-webkit-details-marker{display:none}
.cl-ops{display:flex;gap:14px;flex-wrap:wrap;margin-top:6px}
.cal-list.past li{opacity:.7}
.cl-faces{display:flex;align-items:center;margin-top:5px;padding-left:8px}
.cl-faces img{width:28px;height:28px;border-radius:50%;object-fit:cover;border:2px solid var(--card2);margin-left:-8px;background:var(--input)}
.cl-faces i{font-style:normal;font-size:11px;color:var(--mute);margin-left:8px}
@media(max-width:700px){.cal-cell{min-height:58px}.cal-chip small{display:none}.cal-fields{grid-template-columns:1fr 1fr}.ns-count{width:100%;text-align:center}}
/* el formulario de convocar vive en una columna estrecha: día arriba, hora y duración debajo */
.cal-cols aside .cal-fields{grid-template-columns:1fr 1fr}
.cal-cols aside .cal-fields label:first-child{grid-column:1/-1}
.cal-form input[type=date],.cal-form input[type=time]{width:100%}
/* ---------- lista de espera arrastrable ---------- */
.members.seats li.waiting .wait-grip{grid-area:av;position:absolute;left:-2px;top:50%;transform:translate(-100%,-50%);display:grid;place-items:center;width:22px;height:36px;padding:0;background:none;border:0;cursor:grab;touch-action:none;color:var(--mute)}
.members.seats li.waiting{margin-left:22px}
.wait-grip span,.wait-grip span:before,.wait-grip span:after{display:block;width:10px;height:2px;border-radius:1px;background:currentColor;box-shadow:0 0 0 0 transparent}
.wait-grip span{position:relative}
.wait-grip span:before,.wait-grip span:after{content:"";position:absolute;left:0}
.wait-grip span:before{top:-5px}.wait-grip span:after{top:5px}
.wait-grip:hover,.wait-grip:focus-visible{color:var(--gold2);outline:none}
.members.seats li.waiting.dragging{z-index:5;border-color:var(--gold);box-shadow:0 10px 26px rgba(0,0,0,.55),0 0 0 1px rgba(240,215,154,.4);transform:scale(1.02);background:linear-gradient(90deg,rgba(200,170,110,.16),rgba(200,170,110,.04))}
.members.seats li.waiting.dragging .wait-grip{cursor:grabbing;color:var(--gold2)}
.members.seats.sorting{user-select:none}
.members.seats li{transition:transform .15s,box-shadow .15s,border-color .15s}
.wait-pos{display:inline-block;min-width:22px;margin-right:4px;padding:0 5px;font-style:normal;font-weight:700;color:#1a1206;background:linear-gradient(180deg,var(--gold2),var(--gold));border-radius:2px;text-align:center}
.members.seats.saved li.waiting .wait-pos{box-shadow:0 0 10px rgba(240,215,154,.8)}
.members.seats.saving{opacity:.85}
/* ---------- vetados y baneados ---------- */
.ban-list,.ban-rows{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ban-list li,.ban-row{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:10px 12px;background:var(--input);border:1px solid rgba(255,90,90,.28);border-left:3px solid rgba(255,90,90,.6)}
.ban-list img,.ban-row img{width:38px;height:38px;border-radius:50%;filter:grayscale(.8);border:1px solid rgba(255,90,90,.4)}
.bl-main,.br-main{display:flex;flex-direction:column;gap:2px;min-width:0}
.bl-main b,.br-main b{font-size:14px;color:var(--cream)}
.br-main b a{color:inherit}
.bl-main small,.br-main small{font-size:12px;color:var(--mute)}
.bl-main em,.br-main em{font-size:12.5px;color:var(--dim)}
.ban-row.gm{border-color:rgba(255,154,60,.3);border-left-color:rgba(255,154,60,.7)}
.ban-row.gm img{border-color:rgba(255,154,60,.45)}
.ban-rows.past .ban-row{opacity:.65;border-left-color:rgba(200,170,110,.35);border-color:var(--line)}
.ban-rows.past .ban-row img{filter:grayscale(.3)}
.br-main small.lifted{color:#9fdcf0}
.ban-link{margin-bottom:16px}
.ban-link .mail-ico{font-size:20px}
.bans-cols>aside{display:flex;flex-direction:column;gap:16px}
@media(max-width:560px){.ban-list li,.ban-row{grid-template-columns:auto 1fr}.ban-list form,.ban-row form{grid-column:1/-1}}
/* añadir a mano (admin) */
.manual-seat{display:flex;flex-direction:column;gap:8px;margin-top:14px;padding:12px;border:1px dashed rgba(200,170,110,.35);background:rgba(200,170,110,.05)}
.ms-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.ms-head small{font-size:11.5px;color:var(--mute)}
.manual-seat select,.manual-seat .ms-find{width:100%}
.ms-row{display:flex;align-items:center;gap:6px 14px;flex-wrap:wrap}
.ms-opt{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--dim);cursor:pointer}
.ms-opt em{font-style:normal;color:var(--mute);font-size:11.5px}
.ms-row .btn{margin-left:auto}
.manual-seat .ms-find,.manual-seat select{height:38px;padding:0 12px;font:inherit;font-size:14px;color:var(--cream);background:var(--input);border:1px solid var(--line);border-radius:2px;outline:none;-webkit-appearance:none;appearance:none}
.manual-seat select{padding-right:32px;background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);background-position:calc(100% - 17px) 16px,calc(100% - 12px) 16px;background-size:5px 5px;background-repeat:no-repeat}
.manual-seat .ms-find::placeholder{color:var(--mute)}
.manual-seat .ms-find:focus,.manual-seat select:focus{border-color:var(--gold)}
.manual-seat select option{background:#0d1a30;color:var(--cream)}
.ms-opt input{accent-color:var(--gold)}
/* tarjetas de mapa: título con papelera y tres acciones iguales */
.map-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.map-head b{line-height:1.25;padding-top:3px}
.map-body .map-head form{margin-left:0;flex:none}
.map-del{display:grid;place-items:center;width:28px;height:28px;color:var(--mute);border:1px solid transparent;background:none;cursor:pointer;transition:color .2s,border-color .2s,background .2s}
.map-del:hover{color:#ff8a8a;border-color:rgba(255,90,90,.4);background:rgba(255,90,90,.08)}
.map-acts{display:grid;grid-template-columns:1.15fr .85fr 1.3fr;gap:6px;margin-top:10px;align-items:stretch}
.map-body .map-acts form{margin-left:0;display:flex}
.map-acts .btn{width:100%;padding:9px 6px;font-size:10.5px;letter-spacing:.14em}
/* herramientas de cada plaza: una sola línea con iconos de línea dorados */
.members.seats li{grid-template-areas:"av main chk" "tools tools tools"}
.members.seats li.waiting .wait-grip{grid-area:auto}
.mb-tools{flex-wrap:nowrap;justify-content:space-between;gap:6px;white-space:nowrap}
.mb-tools .tl{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;line-height:1;color:var(--dim);background:none;border:0;padding:3px 0;cursor:pointer}
.mb-tools .tl .ico{width:15px;height:15px;flex:none;color:var(--gold);transition:color .2s}
.mb-tools .tl:hover,.mb-tools .tl:hover .ico{color:var(--gold2)}
.mb-tools .tl.danger .ico{color:rgba(255,138,138,.75)}
.mb-tools .tl.danger:hover,.mb-tools .tl.danger:hover .ico{color:#ff8a8a}
.mb-tools .mv-sel select{max-width:78px;padding:0 14px 0 0;font-size:11.5px;color:var(--dim);background-position:right 2px center}
.mb-tools .mv-sel:hover select{color:var(--gold2)}
@media(max-width:380px){.mb-tools{flex-wrap:wrap;justify-content:flex-start;gap:6px 12px}}
.mb-tools{gap:4px}
.mb-tools .tl{gap:4px;font-size:11px}
.mb-tools .mv-sel select{max-width:62px;font-size:11px}
/* diálogo de doble confirmación para acciones sobre jugadores */
.act-dialog{width:min(460px,calc(100vw - 24px))}
.act-in{position:relative;display:flex;flex-direction:column;gap:14px;padding:26px 24px 22px}
.act-ico{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--gold2);border:1px solid rgba(200,170,110,.45);background:rgba(200,170,110,.08)}
.act-ico .ico{width:22px;height:22px}
.act-dialog.danger .act-ico{color:#ff8a8a;border-color:rgba(255,90,90,.45);background:rgba(255,90,90,.08)}
.act-in h2{margin:0;font-family:var(--disp);font-weight:700;font-size:20px;letter-spacing:.04em;color:var(--cream)}
.act-body{margin:0;padding:0 0 0 18px;display:flex;flex-direction:column;gap:6px;font-size:14px;line-height:1.45;color:var(--dim)}
.act-body li::marker{color:var(--gold)}
.act-dialog.danger .act-body li::marker{color:#ff8a8a}
.act-check{display:flex;align-items:flex-start;gap:10px;padding:11px 12px;font-size:13.5px;line-height:1.35;color:var(--cream);cursor:pointer;border:1px dashed rgba(200,170,110,.4);background:rgba(200,170,110,.05)}
.act-check input{margin-top:2px;width:16px;height:16px;flex:none;accent-color:#c8aa6e}
.act-dialog.danger .act-check{border-color:rgba(255,90,90,.4);background:rgba(255,90,90,.05)}
.act-dialog.danger .act-check input{accent-color:#e06060}
.act-btns{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.act-btns .btn:disabled{opacity:.35;cursor:not-allowed;filter:grayscale(.6)}
.act-dialog.danger #actOk{color:#fff;background:linear-gradient(180deg,#c24a4a,#8a2a2a)}
.act-ico [data-ic]{display:grid;place-items:center}
.act-ico [data-ic][hidden]{display:none}
.act-dialog .field{display:flex;flex-direction:column;gap:6px;margin:0}
.act-dialog .field span{font-family:var(--disp);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.act-dialog .field em{font-family:var(--body);font-style:normal;letter-spacing:0;text-transform:none;color:var(--mute)}
.act-dialog textarea{width:100%;box-sizing:border-box;padding:9px 11px;font:inherit;font-size:14px;color:var(--cream);background:var(--input);border:1px solid rgba(200,170,110,.3);resize:vertical}
.act-dialog textarea:focus{outline:none;border-color:var(--gold)}
.viewbar .vb-acts{display:inline-flex;gap:8px;flex-wrap:wrap}
/* convocar partida: el botón necesita aire dentro del panel */
.cal-form .cal-send{margin-top:16px;margin-bottom:0}
.cal-form .cal-send .btn{padding-left:22px;padding-right:22px}
.cal-form .cal-note{margin-top:14px;font-size:12.5px;line-height:1.5}
.cal-cols aside .panel{padding-bottom:20px}
/* el máster pide una tirada: aviso en la ficha */
.ask-banner{display:flex;align-items:center;gap:14px;margin:0 0 16px;padding:12px 16px;border:1px solid rgba(240,215,154,.5);background:linear-gradient(90deg,rgba(200,170,110,.16),rgba(200,170,110,.05));animation:ask-in .3s ease}
@keyframes ask-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.ask-banner .ask-ico{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:50%;color:var(--gold2);border:1px solid rgba(200,170,110,.45);background:rgba(5,10,20,.5)}
.ask-banner .ask-ico .ico{width:20px;height:20px}
.ask-txt{flex:1;display:flex;flex-direction:column;min-width:0}
.ask-txt b{font-size:14.5px;color:var(--cream)}
.ask-txt small{font-size:12.5px;color:var(--dim)}
@media(max-width:560px){.ask-banner{flex-wrap:wrap}.ask-banner .btn{width:100%}}
.rolls-reset{align-items:center;gap:14px}
.rolls-reset .rr-dc{font-size:12px;color:var(--mute)}
.rolls-reset .rr-dc input{accent-color:#c8aa6e}
.btn-gold svg.ico,.btn-gold .ico{color:#1a1206}
.btn-gold:hover svg.ico{color:#1a1206}
/* PNJ ocultos para la mesa: marca en la tarjeta e interruptor del ojo */
.char-card .tag.oculto{background:linear-gradient(180deg,#8f6cf2,#5c3fb0);color:#fff;border-color:transparent}
.npc-eye{margin:6px 0 0}
.npc-eye button{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;padding:6px 8px;font-family:var(--disp);font-weight:600;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--hex2);background:rgba(72,216,255,.08);border:1px solid rgba(72,216,255,.35);cursor:pointer;transition:.2s}
.npc-eye button svg.ico{width:15px;height:15px}
.npc-eye button:hover{background:rgba(72,216,255,.16)}
.npc-eye button.off{color:#c3b0ff;background:rgba(143,108,242,.12);border-color:rgba(143,108,242,.5)}
.npc-eye button.off:hover{background:rgba(143,108,242,.22)}
.npc-bulk{display:inline-block}
.npc-bulk .btn svg.ico{width:15px;height:15px;margin-right:2px}
.npc-vis{margin-top:10px}
/* tamaño del PNJ en el tablero */
.npc-size{margin:6px 0 0}
.npc-size label{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:8px}
.npc-size span{font-family:var(--disp);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.npc-size select{width:100%;padding:5px 8px;font-size:12px;color:var(--cream);background:var(--input);border:1px solid rgba(200,170,110,.3)}
/* puerta de la beta: solicitudes para dirigir y estado en la comunidad */
.quiero-dirigir .qd-form{margin-top:12px}
.quiero-dirigir .qd-form .field{margin-bottom:10px}
.gm-reqs{list-style:none;display:flex;flex-direction:column;gap:10px}
.gm-reqs li{display:grid;grid-template-columns:44px minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:12px 14px;background:rgba(200,170,110,.06);border:1px solid rgba(200,170,110,.28)}
.gm-reqs img{width:44px;height:44px;border-radius:50%}
.gr-main b{display:block;font-size:15px;color:var(--cream)}
.gr-main small{display:block;font-size:12px;color:var(--mute)}
.gr-main em{display:block;margin-top:4px;font-size:13.5px;color:var(--dim)}
.com-pill{display:inline-block;padding:2px 8px;font-family:var(--disp);font-weight:600;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;border:1px solid}
.com-pill.on{color:var(--hex2);border-color:rgba(72,216,255,.45);background:rgba(72,216,255,.08)}
.com-pill.off{color:var(--ember);border-color:rgba(255,154,60,.4);background:rgba(255,154,60,.08)}
.com-pill.wait{color:var(--mute);border-color:var(--line)}
@media(max-width:700px){.gm-reqs li{grid-template-columns:44px minmax(0,1fr);gap:8px}.gm-reqs form{grid-column:2}}