:root{
  color-scheme:dark;
  --bg:#0f0c08; --panel:#1a150f; --panel2:#251d13; --line:#4d3b20; --bronze:#c19a4e; --bronze2:#8a6a2c;
  --txt:#eadfc2; --muted:#9a8b6b; --accent:#4a9bff; --ok:#62c462; --bad:#e2574a; --hp:#3fae4a; --xp:#a15cf0;
  --serif:'Crimson Text',Georgia,'Times New Roman',serif; --disp:'Cinzel','Trajan Pro',Georgia,serif;
}
body.patto{--accent:#e2503d}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--txt);font-family:var(--serif);font-size:18px;line-height:1.35}
body{background:radial-gradient(1200px 700px at 50% -200px,#2a1f12 0,transparent 70%),var(--bg);min-height:100vh}
h1,h2,h3,h4{font-family:var(--disp);font-weight:700;margin:.2em 0 .5em;letter-spacing:.02em}
h2{font-size:1.25rem;color:var(--bronze)} h3{font-size:1.1rem;color:var(--bronze)} h4{font-size:.95rem;color:var(--muted);margin:1em 0 .4em}
small,.muted{color:var(--muted)}
.hidden{display:none!important}
#qdlg{position:fixed;inset:0;background:#000a;display:grid;place-items:center;z-index:45;padding:16px}
#qdlg .box{max-width:560px;width:100%;max-height:90vh;overflow:auto;background:var(--panel);border:1px solid var(--bronze2);border-radius:6px;padding:18px}
.qchoice{display:flex;gap:10px;align-items:center;border:1px solid var(--line);border-radius:6px;padding:8px 10px;margin:6px 0;cursor:pointer}
.qchoice.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
#dlg{position:fixed;inset:0;background:#000a;display:grid;place-items:center;z-index:50;padding:16px}
#dlg .box{max-width:440px;width:100%;background:var(--panel);border:1px solid var(--bronze2);border-radius:6px;padding:18px}
#dlg p{white-space:pre-line;margin:0 0 14px}
#lostdlg{position:fixed;inset:0;background:#000c;display:grid;place-items:center;z-index:60;padding:16px}#lostdlg.hidden{display:none}
#lostdlg .box{max-width:440px;width:100%;background:var(--panel);border:1px solid var(--bad);border-radius:6px;padding:18px}#lostdlg h3{color:var(--bad);margin-top:0}
#dlg .btns{justify-content:flex-end;margin:0}
button{font-family:var(--disp);cursor:pointer}
.btn{background:linear-gradient(#3a2d17,#241b0e);color:var(--txt);border:1px solid var(--bronze2);border-radius:4px;padding:.4em .9em;font-size:.82rem;transition:.12s}
.btn:hover:not(:disabled){border-color:var(--bronze);background:linear-gradient(#4b3a1d,#2d2212)}
.btn:disabled{opacity:.4;cursor:not-allowed}
.btn.big{font-size:1rem;padding:.6em 1.4em;border-color:var(--accent)}
.btn.ghost{background:transparent}
.btn.sm{padding:.2em .6em;font-size:.72rem}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:14px}
.screen{max-width:1280px;margin:0 auto;padding:16px}

.title{text-align:center;padding:26px 0 8px}
.title h1{font-size:2.4rem;color:var(--bronze);text-shadow:0 2px 0 #000,0 0 30px #c19a4e44;margin:0}
.title p{margin:.2em 0;color:var(--muted);font-style:italic}
.grid2{display:grid;grid-template-columns:minmax(260px,1fr) minmax(320px,1.6fr);gap:16px}
.crow{display:flex;gap:10px;align-items:center;padding:8px;border:1px solid var(--line);border-radius:4px;margin-bottom:8px;background:var(--panel2)}
.crow>div{flex:1}.crow .big{font-size:2rem}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{background:var(--panel2);color:var(--txt);border:1px solid var(--line);border-radius:4px;padding:.4em .8em;font-size:.82rem}
.chip.on{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);color:#fff}
.chip.off{opacity:.3;text-decoration:line-through;cursor:not-allowed}
.chip.locked{background:#0b0906;color:var(--muted);border-color:#2a2014;opacity:.55;cursor:not-allowed;filter:grayscale(.8)}
.chip[style*="--cc"].on{border-color:var(--cc);box-shadow:inset 0 0 0 1px var(--cc)}
input[type=text],input[type=number],input#cname,textarea{background:#0b0805;border:1px solid var(--line);color:var(--txt);padding:.4em .6em;border-radius:4px;font-family:var(--serif);font-size:.95rem}
input#cname{margin-right:8px}
input.sm{width:110px}input.xs{width:64px}
select{background:#0b0805;color:var(--txt);border:1px solid var(--line);border-radius:4px;padding:.25em;font-family:var(--serif)}

#hud{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;padding:6px 2px 10px}
#hud h1{font-size:1.2rem;margin:0;color:var(--bronze)}
#tip{position:fixed;z-index:1000;display:none;max-width:320px;background:#15100a;border:1px solid var(--line);border-radius:6px;padding:8px 10px;font-size:.85rem;line-height:1.35;box-shadow:0 6px 18px rgba(0,0,0,.6);pointer-events:none}
#tip .tt-n{font-weight:bold;font-size:.95rem}
#tip .tt-s,#tip .tt-m{color:var(--muted)}
#tip .tt-g{color:var(--ok)}
#tip .tt-w{color:var(--txt);font-weight:600}
#tip .tt-b{color:var(--bad)}
#tip hr{border:0;border-top:1px solid var(--line);margin:5px 0}
[data-tip]{cursor:help}
#actionbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:10px 14px;margin-bottom:12px;border-left:4px solid var(--accent);position:sticky;top:0;z-index:20;box-shadow:0 4px 10px rgba(0,0,0,.45)}
#actionbar .grow{flex:1;min-width:200px}
#actionbar.thin{padding:3px 14px;font-size:.85rem;border-left-color:var(--line)}
#actionbar .secs{font-variant-numeric:tabular-nums;min-width:4.5em;text-align:right}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:14px;align-items:start}
nav#tabs{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:10px}
nav#tabs button{background:var(--panel);color:var(--muted);border:1px solid var(--line);padding:.55em .9em;border-radius:4px 4px 0 0;font-size:.8rem}
nav#tabs button.on{color:#fff;border-bottom:3px solid var(--accent);background:var(--panel2)}
nav#tabs button:disabled{opacity:.45;cursor:not-allowed}
.bar{height:14px;background:#0a0704;border:1px solid var(--line);border-radius:7px;overflow:hidden;position:relative}
.bar>i{display:block;height:100%;width:0;background:var(--hp);transition:width .15s}
#abFill{transition:none}
.bar.xp>i{background:var(--xp)} .bar.red>i{background:var(--bad)} .bar.pr>i{background:var(--accent)} .bar.sk>i{background:var(--bronze)}
.bar.lg{height:20px}
.row{display:flex;gap:10px;align-items:center;padding:6px 8px;border-bottom:1px solid #2f2516;flex-wrap:wrap}
.row .nm{flex:1;min-width:180px}
.row .ic{width:34px;height:34px;display:grid;place-items:center;border:2px solid;border-radius:4px;background:#0b0805;font-size:1.2rem;flex:none}
.up{color:var(--ok)} .down{color:var(--bad)} .warn{color:var(--bad)}
.grid3{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.card{background:var(--panel2);border:1px solid var(--line);border-radius:4px;padding:10px}
.mg{color:#ffd25a;font-weight:600}.ms{color:#cfd8e0;font-weight:600}.mc{color:#d98d4f;font-weight:600}
.tag{font-size:.7rem;border:1px solid var(--line);border-radius:3px;padding:0 .35em;color:var(--muted);white-space:nowrap}
.tag.bad{border-color:var(--bad);color:var(--bad)}.tag.bind{border-color:#c79c6e;color:#c79c6e}

svg.map{width:100%;height:auto;max-height:74vh;border:1px solid var(--line);border-radius:6px;display:block}
svg .land{fill:#3a3020;stroke:#9c8350;stroke-width:2;stroke-linejoin:round}
svg .cont{fill:#a08a58;font-family:var(--disp);font-size:13px;letter-spacing:.3em}
svg .edge{stroke:#7a6a45;stroke-width:1.5;stroke-dasharray:3 4;opacity:.55}
svg .edge.sea{stroke:#5aa6d6;stroke-dasharray:1 5;stroke-linecap:round;opacity:.8}
svg .edge.hl{stroke:#ffd25a;opacity:1;stroke-width:2.5;stroke-dasharray:none}
svg .node{cursor:pointer}
svg .node circle{fill:#28502c;stroke:#79c47b;stroke-width:2;transition:.12s}
svg .node:hover circle{stroke:#fff}
svg .node.locked circle{fill:#302c26;stroke:#6b6455}
svg .node.adj circle{stroke:#ffd25a}
svg .node.cur circle{fill:#7a5a14;stroke:#ffd25a;stroke-width:3}
svg .node.sel circle{stroke:#fff;stroke-width:3}
svg .node text{font-family:var(--serif);text-anchor:middle;paint-order:stroke;stroke:#0b0805;stroke-width:3px;stroke-linejoin:round}
svg .node .nm{fill:#f1e6c6;font-size:10.5px;font-weight:600}
svg .node .lv{fill:#c8b98f;font-size:9.5px}
svg .node .ico{font-size:11px;stroke:none}
svg .node.locked .nm{fill:#8a8270}
svg .pulse{fill:none;stroke:#ffd25a;stroke-width:2;opacity:.8;animation:pulse 1.8s ease-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes pulse{from{transform:scale(1);opacity:.9}to{transform:scale(2.4);opacity:0}}
table.tbl th.sortable{cursor:pointer;user-select:none;white-space:nowrap}
table.tbl th.sortable:hover{color:var(--txt)}
table.tbl th.sortable::after{content:attr(data-dir);color:var(--accent)}
.picker{display:flex;gap:6px;width:100%}.picker select{min-width:0}.picker select:first-child{flex:0 0 30%}.picker select[data-pickbr]{flex:0 0 22%}.picker select[hidden]{display:none}.picker select:last-child{flex:1}
.xpgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:6px;margin-top:10px}
.xpgrid label{display:flex;flex-direction:column;gap:2px}.xpgrid input{width:100%}
.mapwrap{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:12px;align-items:start}
.zinfo{position:sticky;top:84px;margin:0}
svg .node{user-select:none}
@media (max-width:760px){.mapwrap{grid-template-columns:1fr}.zinfo{order:-1;position:static}}

.arena{position:relative;text-align:center;padding:12px;border:1px solid var(--line);border-radius:6px;background:radial-gradient(circle at 50% 60%,#33241199,#0b0805);overflow:hidden;user-select:none}
.arena .emoji{font-size:5rem;cursor:crosshair;display:inline-block;transition:transform .05s}
.arena .emoji:active{transform:scale(.92)}
.ename{font-family:var(--disp);font-size:1.1rem}
.badge{display:inline-block;min-width:18px;padding:0 5px;border-radius:9px;background:var(--bad);color:#fff;font-size:.75rem;line-height:18px;text-align:center}
.rare-tag{color:#4aa3ff;font-weight:700}
.fl{position:absolute;top:35%;font-family:var(--disp);font-weight:700;color:#ffd25a;text-shadow:0 2px 0 #000;pointer-events:none;animation:fl .8s ease-out forwards}
.fl.crit{color:#ff7a3a;font-size:1.6rem}.fl.hurt{color:var(--bad);top:60%}.fl.heal{color:var(--ok);top:60%}
@keyframes fl{to{transform:translateY(-60px);opacity:0}}
.btns{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0;align-items:center}

.doll{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:start}
.col{display:flex;flex-direction:column;gap:8px}
.slot{width:96px;min-height:74px;border:2px solid #3b2e19;border-radius:5px;background:#0b0805;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:4px;cursor:pointer;font-size:.72rem;line-height:1.05}
.slot .se{font-size:1.5rem;filter:grayscale(1) opacity(.35)}
.slot.f .se{filter:none}
.slot.broken{background:#2a0e0b}
.slot:hover{border-color:var(--bronze)}
.slot small{font-size:.66rem}
.center{text-align:center}
.portrait{font-size:5rem;line-height:1;margin:6px 0}
.weap{display:flex;gap:10px;justify-content:center;margin-top:10px}
.stats{display:grid;grid-template-columns:auto auto;gap:2px 14px;justify-content:center;text-align:left;margin-top:10px}

#card .name{font-family:var(--disp);font-size:1.1rem}
#log,#chat{height:190px;overflow:auto;font-size:.88rem;padding:6px;background:#0b0805;border:1px solid var(--line);border-radius:4px}
#log div,#chat div{padding:1px 0}
.l-good{color:var(--ok)}.l-bad{color:var(--bad)}.l-gold{color:#ffd25a}.l-xp{color:#c692ff}.l-item{color:#6fb4ff}
.ch-n{color:var(--bronze)}

.qe{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px 10px;align-items:end}
.qe label{display:flex;flex-direction:column;font-size:.75rem;color:var(--muted)}
.qe input,.qe select{width:100%}
.qe .wide{grid-column:1/-1}

@media (max-width:920px){.layout,.grid2{grid-template-columns:1fr}.slot{width:78px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---- Online: accesso, chat, admin ---- */
#auth{max-width:420px;margin:0 auto}
#auth form{display:flex;flex-direction:column;gap:8px}
#auth label{display:flex;flex-direction:column;font-size:.8rem;color:var(--muted);gap:2px}
input[type=password],input[type=search]{background:#0b0805;border:1px solid var(--line);color:var(--txt);padding:.4em .6em;border-radius:4px;font-family:var(--serif);font-size:.95rem}
#autherr,.err{color:var(--bad);min-height:1.2em;font-size:.9rem;margin:.2em 0}
.tabs2{display:flex;gap:6px;margin-bottom:10px}
#chatbox{height:220px;overflow:auto;font-size:.88rem;padding:6px;background:#0b0805;border:1px solid var(--line);border-radius:4px}
#chatbox div{padding:1px 0;word-break:break-word}
.c-global .ch-n{color:var(--bronze)}.c-zone .ch-n{color:#79c47b}.c-w{color:#e58fff}.c-system{color:#ffd25a}.c-sys{color:var(--muted);font-style:italic}
.staff{color:#ff7a3a;font-size:.7rem;border:1px solid #ff7a3a;border-radius:3px;padding:0 .25em;margin-right:3px}
.chtabs{display:flex;gap:4px;margin:4px 0}
.chtabs .chip{padding:.15em .6em;font-size:.72rem}
#conn{font-size:.75rem}
#conn.off{color:var(--bad)}#conn.on{color:var(--ok)}
.tbl{width:100%;border-collapse:collapse;font-size:.88rem}
.tbl th,.tbl td{border-bottom:1px solid #2f2516;padding:4px 6px;text-align:left;vertical-align:top}
.tbl th{color:var(--muted);font-family:var(--disp);font-size:.75rem}
.tbl .del{opacity:.4;text-decoration:line-through}
.stat{display:inline-block;min-width:110px;margin:0 8px 8px 0}.stat b{display:block;font-size:1.4rem;color:var(--bronze)}
.toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:var(--panel2);border:1px solid var(--bronze2);padding:8px 16px;border-radius:6px;z-index:60}

a.btn{text-decoration:none;display:inline-block}
/* ---- Talenti ---- */
.tsticky{position:sticky;top:0;z-index:5;display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:8px 10px;margin-bottom:10px}
.tsticky>div{display:flex;flex-direction:column;line-height:1.1}.tsticky b{font-family:var(--disp);font-size:1.1rem}
.tsticky .grow{flex:1}.tsticky select{max-width:100%}
.ttrees{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.ttree{background:var(--panel2);border:1px solid var(--line);border-radius:6px;padding:6px 5px;min-width:0;--tc:#e0a040}
.ttree[data-t="1"]{--tc:#d05a4a}.ttree[data-t="2"]{--tc:#5a9be0}
.ttree header{display:flex;align-items:center;gap:8px}.ttree h3{margin:0;color:var(--tc);font-size:1rem}
.trole{font:500 .62rem var(--disp);border:1px solid var(--line);border-radius:3px;padding:.1em .5em;color:var(--muted)}
.tpts{margin-left:auto;font-family:var(--disp)}
.tbar{height:4px;background:#0b0805;border-radius:2px;margin:6px 0 10px;overflow:hidden}.tbar i{display:block;height:100%;background:var(--tc)}
.tgrid{display:grid;grid-template-columns:16px repeat(3,minmax(0,1fr));column-gap:2px;row-gap:18px}
.trq{grid-column:1;text-align:center;font-size:0;line-height:1;color:#6b5d44;padding-top:8px}
.trq b{display:block;font:700 .95rem var(--disp)}.trq.ok{color:var(--tc)}
.tnode{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;cursor:pointer;min-width:0;user-select:none;outline:none}
.tnode:focus-visible .tic{outline:2px solid var(--accent)}
.tic{width:32px;height:32px;border-radius:6px;display:grid;place-items:center;background:var(--panel);border:2px solid var(--line);color:var(--tc);position:relative;font-size:.95rem}
.tnm{font-size:.56rem;line-height:1.05;margin-top:3px;max-width:100%;overflow-wrap:anywhere}
.tkt{font:500 .42rem var(--disp);letter-spacing:.08em;text-transform:uppercase;color:var(--tc)}
.trk{position:absolute;right:-9px;bottom:-6px;font:700 .5rem var(--disp);background:#0b0805;border:1px solid var(--line);border-radius:3px;padding:0 2px;color:var(--muted)}
.tnode.locked{opacity:.38}.tnode.locked .tic{filter:grayscale(1)}
.tnode.open .tic{border-color:var(--ok);box-shadow:0 0 8px #62c46255}.tnode.open .trk{color:var(--ok);border-color:var(--ok)}
.tnode.part .tic{border-color:var(--tc)}.tnode.part .trk{color:var(--tc);border-color:var(--tc)}
.tnode.full .tic{border-color:var(--tc);background:color-mix(in srgb,var(--tc) 22%,var(--panel))}.tnode.full .trk{background:var(--tc);color:#000;border-color:var(--tc)}
.tnode.ab .tic{border-radius:12px}.tnode.cap .tic{width:40px;height:40px;border-radius:50%}
.tminus{position:absolute;left:-8px;top:-8px;width:17px;height:17px;border-radius:50%;background:#0b0805;border:1px solid var(--bronze2);color:var(--bronze);font:700 .8rem/1 var(--disp);display:none;place-items:center;z-index:2}
.tnode:hover .tminus,.tnode:focus-within .tminus{display:grid}
@media (hover:none){.tnode.part .tminus,.tnode.full .tminus{display:grid}}
/* frecce delle dipendenze: dorate se attive, grigie tratteggiate se bloccate */
.tnode.dep::before{content:'';position:absolute;left:calc(50% - 1px);top:-17px;height:11px;border-left:2px dashed #5a4a30}
.tnode.dep::after{content:'';position:absolute;left:calc(50% - 4px);top:-7px;border:4px solid transparent;border-top:6px solid #5a4a30;border-bottom:0}
.tnode.depok::before{border-left:2px solid #e0b040}.tnode.depok::after{border-top-color:#e0b040}
.abbar{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));gap:8px}
.abchip,.abslot{background:var(--panel2);border:1px solid var(--line);border-radius:6px;padding:7px 9px;text-align:left;display:grid;gap:1px;min-width:0;color:var(--txt);font:inherit;font-size:.85rem}
.abchip.on{border-color:var(--bronze);box-shadow:inset 0 0 0 1px var(--bronze)}
.abslot{border-style:dashed;color:#6b5d44;place-items:center;min-height:56px}
.tstats{display:grid;grid-template-columns:1fr auto auto;gap:3px 10px;align-items:baseline}
.tstats b{text-align:right;font-family:var(--disp)}.tstats small{min-width:58px;text-align:right}
.abrow .abbtn{position:relative;overflow:hidden}.abbtn.cd{opacity:.55}.abbtn.gcd{opacity:.75}.abbtn::after{content:'';position:absolute;left:0;bottom:0;height:3px;width:var(--g,0%);background:var(--bronze)}.abcd{font-style:normal;color:var(--bronze)}
#potBtn.cd{opacity:.55}
.trq b{font-size:.7rem}.ttree h3{font-size:.85rem}.ttree header{gap:4px;flex-wrap:wrap}.ttree .trole{font-size:.5rem;padding:0 .3em}
@media (max-width:600px){.ttrees{grid-template-columns:1fr}.tgrid{grid-template-columns:22px repeat(3,minmax(0,1fr));row-gap:22px}.tic{width:40px;height:40px;font-size:1.15rem}.tnm{font-size:.68rem}.tnode.cap .tic{width:48px;height:48px}.trk{font-size:.6rem}}
/* ---- Dungeon ---- */
.dngcard{margin:8px 0}.dnghead{display:flex;gap:10px;align-items:center;cursor:pointer}.dnghead .grow{flex:1}
.dngmap{display:flex;align-items:center;gap:4px;overflow-x:auto;padding:6px 0;margin:6px 0}
.dngmap .dcol{display:flex;flex-direction:column;gap:4px;padding:4px;border-radius:6px;border:1px solid transparent}
.dngmap .dcol.cur{border-color:var(--bronze2);background:var(--panel2)}
.dngmap .dsep{color:var(--muted)}
.droom{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:40px;min-height:40px;border:1px solid var(--line);border-radius:6px;background:var(--panel);font-size:1.1rem;color:var(--txt);padding:2px 4px}
.droom small{font-size:.55rem;color:var(--muted)}
.droom.done{border-color:var(--ok);box-shadow:inset 0 0 0 1px var(--ok)}
.droom.pick{border-color:var(--bronze);cursor:pointer;animation:pickpulse 1.4s infinite}
.droom.t-boss,.droom.t-miniboss{border-color:#a0402a}
.dngmap.mini .droom{min-width:28px;min-height:28px;font-size:.85rem}
@keyframes pickpulse{50%{box-shadow:0 0 10px var(--bronze)}}
.dngpick{display:grid;gap:6px}.dngpick select{max-width:100%}
.dngarena .ename .tag{font-size:.7rem}
.buster{margin-top:8px;color:var(--bad)}.buster .bar i{background:var(--bad)}
.party{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:6px;margin:8px 0}
.pm{border:1px solid var(--line);border-radius:6px;padding:6px 8px;background:var(--panel2);font-size:.85rem}
.pm.me{border-color:var(--bronze)}.pm.dead{opacity:.45}
.btn.flash{animation:flash .6s infinite;border-color:var(--bad)}
@keyframes flash{50%{background:#7a2318;color:#fff}}
.meters{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:8px}
.meter h4{margin:.3em 0}.mrow{position:relative;display:grid;grid-template-columns:1fr auto;gap:0 8px;padding:3px 6px;font-size:.8rem;border-bottom:1px solid var(--line)}
.mrow small{grid-column:1/-1;color:var(--muted)}.mrow .mbar{position:absolute;left:0;top:0;bottom:0;background:#c19a4e22;z-index:0}.mrow>*:not(.mbar){position:relative}
.dlog{max-height:180px;overflow:auto;font-size:.8rem;border:1px solid var(--line);border-radius:6px;padding:6px;margin-top:8px;background:#0b0805}
.chatmenu{position:fixed;z-index:70;display:flex;flex-direction:column;gap:2px;background:var(--panel);border:1px solid var(--bronze2);border-radius:6px;padding:6px;box-shadow:0 6px 20px #000a;min-width:180px}
.chatmenu b{padding:2px 6px;color:var(--bronze)}.chatmenu button{background:none;border:0;color:var(--txt);text-align:left;padding:5px 6px;border-radius:4px;cursor:pointer;font:inherit;font-size:.85rem}
.chatmenu button:hover{background:var(--panel2)}
.ch-who{cursor:pointer;text-decoration:underline dotted}
.lootbox{border-color:var(--bronze);margin:8px 0}.warnbox{border-color:var(--bronze);margin:6px 0}
.btn.on{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
/* pannello rapido amici e gruppo (pulsante 👥 in alto a destra) */
#social{position:fixed;top:58px;right:12px;z-index:40;width:min(440px,calc(100vw - 24px));max-height:calc(100vh - 80px);overflow:auto;background:var(--panel);border:1px solid var(--bronze2);border-radius:8px;padding:10px 12px;box-shadow:0 8px 28px #000c}
#social .shead{display:flex;justify-content:space-between;align-items:center}
#social .card{margin-top:8px}#social .party{grid-template-columns:1fr 1fr}
#socialBtn{position:relative}
/* dungeon: abilità a icone quadrate e barre di durata dei buff */
.abgrid{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0;justify-content:center}
.abhelp{text-align:center}
#partybox .party{grid-template-columns:1fr;gap:6px}#partybox .pm{padding:6px 8px}#partybox .dngpick{display:flex;flex-direction:column;gap:6px}#partybox .dngpick label,#partybox select{width:100%}#partybox .row{flex-wrap:wrap}#partybox h3{margin-top:0}
.abicon{position:relative;width:58px;height:58px;border:2px solid var(--line);border-radius:8px;background:var(--panel2);color:var(--txt);display:grid;place-items:center;overflow:hidden;cursor:pointer;padding:0}
.abicon .aic{font-size:1.6rem;line-height:1}
.abicon .akey{position:absolute;left:3px;top:1px;font:700 .7rem var(--disp);color:var(--bronze)}
.abicon.k-dmg{border-color:#c08040}.abicon.k-heal{border-color:var(--ok)}.abicon.k-guard{border-color:#5a9be0}
.abicon.cd{opacity:.75}.abicon .sweep{position:absolute;left:0;right:0;bottom:0;background:#000a;pointer-events:none}
.abicon .cdn{position:absolute;inset:0;display:grid;place-items:center;font:700 1.1rem var(--disp);color:#fff;text-shadow:0 1px 3px #000}
.abicon.flash{animation:flash .6s infinite;border-color:var(--bad)}
.buffbar{position:relative;height:12px;margin-top:3px;background:#0b0805;border:1px solid #5a9be0;border-radius:3px;overflow:hidden}
.buffbar i{display:block;height:100%;background:#5a9be055}
.buffbar span{position:absolute;left:4px;top:-1px;font-size:.62rem;white-space:nowrap}

.zviews{margin:0 0 12px;border-bottom:1px solid var(--line);padding-bottom:10px}
.dnghelp{margin:6px 0}.dnghelp summary{cursor:pointer;color:var(--accent);font-size:.9rem}.dnghelp ul{margin:.3em 0;padding-left:1.2em;font-size:.88rem}
.phead{display:flex;align-items:center;justify-content:space-between;gap:8px}.phead h3{margin:0}
.abicon.gcd{opacity:.8}.abicon.k-pot{border-color:#b05ad0}.abicon:disabled{opacity:.4;cursor:not-allowed}.abicon .acount{position:absolute;right:3px;bottom:1px;font:700 .7rem var(--disp);color:var(--txt)}
.tnode.idle .tic{filter:saturate(.6)}.tnode.pend .tic{border-style:dashed;border-color:var(--ok)!important}.tnode.pend .trk{color:var(--ok)!important;border-color:var(--ok)!important;background:transparent!important}
.tnode.more .tic{box-shadow:0 0 8px #62c46255}
.btns.center-row{justify-content:center}
.mybuffs{display:flex;flex-direction:column;gap:2px;max-width:320px}.mybuffs .buffbar{height:14px}.mybuffs .buffbar span{font-size:.7rem}
.buffbar.b-crit{border-color:#e0a040}.buffbar.b-crit i{background:#e0a04055}.buffbar.b-spd{border-color:#d8d050}.buffbar.b-spd i{background:#d8d05055}
.buffbar.b-dmg{border-color:#e2574a}.buffbar.b-dmg i{background:#e2574a55}.buffbar.b-heal{border-color:var(--ok)}.buffbar.b-heal i{background:#62c46255}
.abicon.k-buff{box-shadow:0 0 6px #f0c06055}
.profsecbox{margin-top:18px;padding:10px 12px;border:1px dashed var(--line);border-radius:8px;background:#ffffff06}.profsecbox h4{margin-top:0}.profsec{opacity:.92}
.prow{display:flex;gap:10px;align-items:flex-start;padding:5px 6px;border-radius:6px;opacity:.5}.prow.on{opacity:1;background:#ffffff08}.prow .pic{font-size:1.3rem;width:28px;text-align:center}
.gbuffs{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0}.gb{width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--bronze2);border-radius:6px;background:var(--panel2);font-size:1rem;cursor:help}
.pgrid{display:flex;gap:18px;flex-wrap:wrap}.pcol{display:flex;flex-direction:column;gap:6px;align-items:flex-start}.plv{font-family:var(--disp);font-size:.8rem;color:var(--bronze)}.plv small{color:var(--muted);font-family:var(--serif)}
.psq{display:flex;gap:8px}.pico{position:relative;width:54px;height:54px;border:2px solid var(--line);border-radius:8px;background:var(--panel2);display:grid;place-items:center;font-size:1.5rem;cursor:help}
.pico.on{border-color:var(--bronze);box-shadow:0 0 8px #c19a4e44}.pico.off{opacity:.45;filter:grayscale(.7)}.pico.locked{opacity:.6;font-size:1.2rem;background:#0b0805}
.pico .prole{position:absolute;right:2px;bottom:0;font:700 .55rem var(--disp);color:var(--muted)}
.aspec{display:inline-flex;align-items:center;gap:4px;margin:6px 0;padding:2px 8px;border:1px solid var(--line);border-radius:999px;font-size:.85rem;cursor:help}.aspec.ok{border-color:var(--ok)}.aspec.no{border-color:#d8b45a}
.antiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:8px 0 14px}.antile{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:10px 12px;display:flex;flex-direction:column;gap:2px}.antile b{font-size:1.5rem;font-family:var(--disp);color:var(--txt)}.antile span{font-size:.85rem;color:var(--muted)}
.grid2an{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:12px;margin-bottom:12px}
.anchart{width:100%;height:auto;display:block}.anaxis{stroke:#4d3b20;stroke-width:1}.antick{fill:#b3a382;font-size:14px;font-family:var(--serif)}
.anlegend{display:flex;gap:14px;font-size:.8rem;color:var(--muted);margin-top:4px}.anlegend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:4px;vertical-align:middle}
.anfun{display:grid;grid-template-columns:170px 1fr 50px 44px;gap:8px;align-items:center;font-size:.85rem;margin:4px 0}.anbar{height:10px;background:#0b0805;border-radius:3px;overflow:hidden}.anbar i{display:block;height:100%;border-radius:3px}
.anlv{display:flex;align-items:flex-end;gap:1px;height:110px;border-bottom:1px solid #4d3b20}.anlv i{flex:1;min-height:0;border-radius:2px 2px 0 0}.anlvx{display:flex;justify-content:space-between;color:var(--muted)}
.antip{position:fixed;z-index:60;background:#0b0805;border:1px solid var(--bronze2);border-radius:6px;padding:4px 8px;font-size:.8rem;pointer-events:none;white-space:nowrap}
/* Personaggio > Statistiche */
.stgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.stcard{margin:0}
.stcard h3{margin:0 0 8px}
.strows{display:grid;grid-template-columns:1fr auto;gap:4px 12px;font-size:.92rem}
.strows b{text-align:right;font-variant-numeric:tabular-nums}
/* Posta: pannello in alto a destra, schede in basso (come la cassetta della posta di WoW) */
#mailbox{position:fixed;top:58px;right:12px;z-index:41;width:min(480px,calc(100vw - 24px));max-height:calc(100vh - 80px);display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--bronze2);border-radius:8px;box-shadow:0 8px 28px #000c}
#mailbox.hidden{display:none}
#mailbox .shead{display:flex;justify-content:space-between;align-items:center;padding:10px 12px 6px}
#mailBody{flex:1;overflow:auto;padding:0 12px 10px;min-height:120px}
#mailBody .mcompose{grid-template-columns:1fr}
#mailFoot{display:flex;gap:4px;padding:0 10px;border-top:1px solid var(--line)}
.mtabb{background:var(--panel2);color:var(--muted);border:1px solid var(--line);border-top:none;border-radius:0 0 8px 8px;padding:6px 14px 8px;font:inherit;cursor:pointer;margin-top:-1px}
.mtabb.on{background:var(--panel);color:var(--bronze);border-color:var(--bronze2);font-weight:600}
.mtabb:hover{color:var(--bronze)}
/* Attacca: risposta visiva al clic */
.btn[data-a="hit"]{transition:transform .06s}
.btn[data-a="hit"]:active{transform:scale(.94)}
.btn.hitfx{animation:hitbtn .28s ease-out}
@keyframes hitbtn{0%{transform:scale(.92);box-shadow:0 0 0 0 #ffb24a,inset 0 0 12px #ffb24a88;background:linear-gradient(#6b4a1c,#3a2a12)}100%{transform:scale(1);box-shadow:0 0 0 10px #ffb24a00}}
.arena .emoji.hitfx{animation:hitmob .25s ease-out}
@keyframes hitmob{0%{transform:scale(.88) rotate(-6deg);filter:brightness(1.8)}60%{transform:scale(1.04) rotate(3deg)}100%{transform:none;filter:none}}
/* Bottino: avvisi in alto al centro */
#lootbox{position:fixed;top:64px;left:50%;transform:translateX(-50%);z-index:70;display:flex;flex-direction:column;gap:6px;align-items:center;pointer-events:none;width:min(360px,calc(100vw - 32px))}
.loot{display:flex;align-items:center;gap:10px;width:100%;background:linear-gradient(#2a2012f2,#17110af2);border:1px solid var(--rc);border-left:4px solid var(--rc);border-radius:6px;padding:6px 12px;box-shadow:0 6px 20px #000b;animation:lootin .25s ease-out}
.loot .le{font-size:1.6rem;line-height:1}
.loot small{display:block;color:var(--muted);font-size:.7rem;text-transform:uppercase;letter-spacing:.06em}
.loot b{color:var(--rc)}
.loot.epic{box-shadow:0 0 18px color-mix(in srgb,var(--rc) 60%,transparent),0 6px 20px #000b}
.loot.out{opacity:0;transform:translateY(-8px);transition:.4s}
@keyframes lootin{from{opacity:0;transform:translateY(-10px) scale(.96)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.loot,.btn.hitfx,.arena .emoji.hitfx{animation:none}}