/* Formato "tutto mappa" (bozzetto G): la mappa riempie lo schermo, i comandi sono isole sopra. */
/* Caratteri in locale (public/font, licenza SIL OFL): nessuna richiesta fuori dal Raspberry. */
@font-face{font-family:'Young Serif';font-style:normal;font-weight:400;font-display:swap;src:url(font/youngserif-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}@font-face{font-family:'Young Serif';font-style:normal;font-weight:400;font-display:swap;src:url(font/youngserif-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400 600;font-display:swap;src:url(font/figtree-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}@font-face{font-family:'Figtree';font-style:normal;font-weight:400 600;font-display:swap;src:url(font/figtree-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
:root{--dark:#14110d;--panel:#1d1913;--lift:#2e271e;--text:#f4ecdd;--dim:#a99d89;--hot:#e9813f;--onhot:#1d1913;--line:#2e271e;--ring:#6b604f;--shade:#0008}
:root[data-theme=light]{--dark:#d8d0c0;--panel:#fcf8ee;--lift:#ece4d3;--text:#221c14;--dim:#75695a;--hot:#d9641f;--onhot:#fff8ee;--line:#0000001f;--ring:#a2978a;--shade:#3a2a1030}
*{box-sizing:border-box;margin:0}html,body{height:100%}
body{overflow:hidden;-webkit-font-smoothing:antialiased;font:16px/1.35 'Figtree',sans-serif;color:var(--text);background:var(--dark)}
.isle{-webkit-user-select:none;user-select:none}.isle .entry,.isle input,.isle textarea,.pinbox p{-webkit-user-select:text;user-select:text} /* trascinare da un pannello non seleziona la pagina; il testo del manuale si copia */
button,input,select{font:inherit;color:inherit}button{background:none;border:0;cursor:pointer}ul{list-style:none;padding:0}
h1,h2{font-family:'Young Serif',serif;font-weight:400;letter-spacing:-.01em}
small{font-size:14px;color:var(--dim)}
.ic{width:20px;height:20px;flex:none}
.stage{position:fixed;inset:0}#map{width:100%;height:100%;display:block;touch-action:none}
body[data-view=player] .m,body[data-view=login] .isle{display:none!important}

.scene{position:fixed;z-index:5;left:26px;top:20px;display:flex;flex-direction:column;pointer-events:none;max-width:calc(100% - 390px)}
.scene h1{font-size:28px;line-height:1}.sceneRow{order:-1;display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;pointer-events:auto}
body[data-view=master] #sceneName{cursor:pointer}
#sceneAct{display:flex;align-items:center;gap:8px;font-size:13px}#sceneAct .btn{padding:6px 12px;font-size:13px}
#sceneAct .here{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:var(--lift);color:var(--text)}#sceneAct .here .ic{width:16px;height:16px;color:var(--hot)}
#sceneAct .ask{color:var(--text);white-space:nowrap}
#sceneAct .where{color:var(--dim);text-decoration:underline;text-underline-offset:3px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#sceneAct .where:hover{color:var(--text)}
.sheet details.adv{margin-top:14px}.sheet details.adv summary{cursor:pointer;color:var(--dim);font-size:14px}.scene small{margin-top:7px;font-size:13px;display:flex;align-items:center;gap:6px;font-family:'Young Serif',serif;color:var(--text)}.scene small img{width:18px;height:18px}
.presence{position:fixed;z-index:5;left:26px;bottom:22px;display:flex;flex-wrap:wrap;gap:15px;font-size:14px;max-width:calc(100% - 100px)}
.who{display:flex;align-items:center;gap:7px}.who i{width:8px;height:8px;border-radius:50%}
.who.off{color:var(--ring)}.who.off i{opacity:.35}

.tools,.tabs,.sheet,.theme{background:var(--panel);box-shadow:0 0 0 1px var(--line),0 8px 24px var(--shade)}
.tools{position:fixed;z-index:5;left:20px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:2px;padding:6px;border-radius:15px}
.tools button{width:42px;height:42px;display:grid;place-items:center;border-radius:7px;color:var(--dim)}
.tools button:hover{background:var(--lift);color:var(--text)}
/* Con tutti gli strumenti del master la barra non deve coprire il titolo: su schermi bassi pulsanti più bassi, e se serve scorre. */
.tools{max-height:calc(100vh - 190px);overflow-y:auto;scrollbar-width:none}
@media (max-height:1000px){.tools button{height:36px}}

:root{--pw:380px} /* larghezza unica del pannello del master: schede, pannello sotto e cartellino */
.library{position:fixed;z-index:5;right:20px;top:16px;width:var(--pw)}
.tabs{display:grid;grid-auto-flow:column;grid-auto-columns:auto;gap:2px;padding:5px;border-radius:14px}
.tabs button{display:grid;justify-items:center;gap:3px;padding:7px 3px 5px;min-width:0;white-space:nowrap;border-radius:9px;font-size:11px;color:var(--dim)}.tabs .ic{width:18px;height:18px}
.tabs button:hover{color:var(--text)}.tabs .on{background:var(--lift);color:var(--text)}
@media (max-width:420px){.tabs{gap:0;padding:4px}.tabs button{font-size:9.5px;padding-inline:1px}} /* telefono: le otto schede restano su una riga intere */
.sheet{position:fixed;z-index:5;right:20px;top:var(--under,96px);width:var(--pw);max-height:calc(100% - var(--under,96px) - 74px);overflow:auto;padding:20px 22px;border-radius:18px}
.sheet:empty{display:none}
.sheet h2{font-size:30px;line-height:1;margin-bottom:14px}
.sheet h3{font:400 14px 'Figtree',sans-serif;color:var(--dim);margin:20px 0 8px}
.row{display:flex;align-items:center;gap:8px;padding:5px 0}.row b{flex:1;font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row small{font-size:13px}.row.pick{cursor:pointer}.row.sel b{color:var(--hot)}
.dot{width:12px;height:12px;border-radius:50%;flex:none;box-shadow:0 0 0 1.5px var(--ring)}
.tag{font-size:12px;padding:1px 8px;border-radius:9px;background:var(--hot);color:var(--onhot)}
.haspw{display:flex;color:var(--dim)}.haspw .ic{width:16px;height:16px}.codeval{font-weight:600;letter-spacing:.12em;font-variant-numeric:tabular-nums}
.icon{width:32px;height:32px;display:grid;place-items:center;border-radius:7px;color:var(--dim)}.icon:hover{background:var(--lift);color:var(--text)}.icon .ic{width:17px;height:17px}
.field{display:flex;flex-direction:column;gap:4px;margin-bottom:10px;font-size:13px;color:var(--dim)}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
input[type=text],input[type=password],input[type=number],input[type=search],input[type=date],select{width:100%;background:var(--lift);border:0;border-radius:7px;padding:8px 10px;color:var(--text);font-size:15px}
input[type=file]{font-size:13px;color:var(--dim);max-width:100%}
.check input{accent-color:var(--hot)}
.check{display:flex;align-items:center;gap:8px;margin-bottom:12px;font-size:14px}
.swatches{display:flex;flex-wrap:wrap;gap:6px}.swatches button{width:26px;height:26px;border-radius:50%;box-shadow:0 0 0 1.5px var(--ring)}
.swatches .on{box-shadow:0 0 0 2.5px var(--panel),0 0 0 4.5px var(--hot)}
.btn{background:var(--hot);color:var(--onhot);padding:9px 18px;border-radius:7px;font-weight:600}
.btn.soft{background:var(--lift);color:var(--text)}
.note{font-size:13px;color:var(--dim);margin-top:8px}

.login{display:none;position:fixed;inset:0;z-index:20;place-items:center;padding:0 24px;overflow:hidden;
 --dark:#0a0806;--text:#f4ecdd;--dim:#a99d89;--lift:#2e271e;--ring:#6b604f;--hot:#e9813f;--onhot:#1d1913;background:var(--dark);color:var(--text)}
body[data-view=login] .login,.login.out{display:grid}.login.out{pointer-events:none}
.login .card{display:flex;flex-direction:column;align-items:center;text-align:center;width:min(100%,460px);position:relative}
.login h1{font-size:76px;line-height:1.08;margin-top:10px;text-shadow:0 0 44px #e9813f55;position:relative}
.login p{margin:0 0 14px;font-size:17px}
.login .who,.login .ask{margin-top:40px;width:100%;position:relative}
.login .who{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.login [data-step=code] .who,.login [data-step=who] .ask{display:none}
.login .who button,#enter{background:var(--hot);color:var(--onhot);padding:13px 26px;font-size:16px;font-weight:600;border-radius:7px}
.login .who button+button{background:none;color:var(--text);box-shadow:inset 0 0 0 1.500px var(--ring)}
.login .back{margin-left:8px;padding:13px 16px;font-size:16px;color:var(--dim)}
.login .code{width:100%;height:66px;margin-bottom:16px;background:var(--lift);border:0;border-radius:7px;padding:0 18px;font:500 30px 'Figtree',sans-serif;letter-spacing:.35em;text-align:center;text-transform:uppercase;color:var(--text)}
.login [data-by=pass] .code,.login [data-by=code] .np{display:none}
.login .np input{display:block;width:100%;height:56px;margin-bottom:12px;background:var(--lift);border:0;border-radius:7px;padding:0 18px;font:500 20px 'Figtree',sans-serif;text-align:center;color:var(--text)}
.login .alt{display:block;margin:18px auto 0;font-size:15px;color:var(--dim);text-decoration:underline;text-underline-offset:3px}.login .alt[hidden]{display:none}
.login .err{margin:14px 0 0;min-height:1.4em;font-size:15px;color:var(--hot);position:relative}
.torch{position:relative;width:132px;height:132px}.torch svg{position:relative;width:100%;height:100%;overflow:visible}
.torch .tb{fill:var(--text)}.torch .f1{fill:#e9813f}.torch .f2{fill:#f6b25c}.torch .f3{fill:#fdeabb}
.torch .fl{transform-box:fill-box;transform-origin:50% 100%;transition:transform .5s ease-in,opacity .5s ease-in}
.torch .fl path{transform-box:fill-box;transform-origin:50% 100%;animation:fiamma 1.1s ease-in-out infinite}
.torch .fl .f2{animation-duration:.8s;animation-direction:reverse}.torch .fl .f3{animation-duration:.6s}
.torch .glow{position:absolute;left:50%;top:28%;width:1100px;height:1100px;margin:-550px 0 0 -550px;border-radius:50%;pointer-events:none;
 background:radial-gradient(circle,#e9813f4d 0,#e9813f26 14%,#e9813f0f 32%,transparent 60%);animation:bagliore 2.3s linear infinite;transition:opacity .5s ease-in}
.login.out .fl{transform:scale(.2,0);opacity:0}.login.out .glow{opacity:0;animation:none}
@keyframes fiamma{0%,100%{transform:scale(1) skewX(0)}25%{transform:scale(.95,1.08) skewX(-4deg)}50%{transform:scale(1.04,.94) skewX(3deg)}75%{transform:scale(.97,1.05) skewX(-2deg)}}
@keyframes bagliore{0%,100%{opacity:.92;transform:scale(1)}18%{opacity:1;transform:scale(1.03)}33%{opacity:.84;transform:scale(.97)}52%{opacity:.97;transform:scale(1.02)}70%{opacity:.8;transform:scale(.96)}86%{opacity:.95;transform:scale(1.01)}}
.veil{position:fixed;inset:0;z-index:40;background:#000;opacity:0;pointer-events:none;transition:opacity .6s ease-out}
.veil.on{opacity:1;transition:opacity .55s ease-in .35s}
@media (prefers-reduced-motion:reduce){.torch .fl path,.torch .glow{animation:none}}
@media (max-width:600px){.login h1{font-size:52px}.torch{width:104px;height:104px}.library,.sheet{right:10px;width:calc(100% - 20px)}.scene{display:none}}

.theme{position:fixed;z-index:30;right:20px;bottom:16px;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;color:var(--text)}

/* Tappa 1b: strumenti, iniziativa, cartellino (dal bozzetto G) */
.tools hr{border:0;height:1px;background:var(--line);margin:4px 6px}
.tools .grp{display:flex;flex-direction:column;gap:4px;padding:4px;margin-bottom:8px;border-radius:10px;background:var(--lift)}
.tools .grp button{width:100%;height:42px;color:var(--text)}
.tools .grp svg{width:24px;height:24px}
.tools .grp .on,.tools .grp .on:hover{background:var(--hot);color:var(--onhot)}
.tools[data-grp=prep] [data-g=table],.tools[data-grp=table] [data-g=prep]{display:none}
@media (max-height:820px){.tools button{height:34px}}
#toolBtns{display:flex;flex-direction:column;gap:2px}
.tools .on,.tools .on:hover{background:var(--text);color:var(--dark)}
.fly{position:fixed;z-index:5;left:82px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:2px;padding:6px;border-radius:15px;max-width:170px;background:var(--panel);box-shadow:0 0 0 1px var(--line),0 8px 24px var(--shade)}
.fly button{height:40px;min-width:40px;display:grid;place-items:center;border-radius:7px;color:var(--dim)}
.fly button.txt{place-items:center start;padding:0 12px;font-size:14px;grid-auto-flow:column;justify-content:start;gap:8px}
.fly button:hover{background:var(--lift);color:var(--text)}.fly .on,.fly .on:hover{background:var(--text);color:var(--dark)}
.fly small{font-size:12px;padding:6px 6px 2px;line-height:1.3}
.init{position:fixed;z-index:5;top:16px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:4px;padding:9px 12px 7px;border-radius:16px;list-style:none;max-width:calc(100% - 720px);overflow-x:auto;background:var(--panel);box-shadow:0 0 0 1px var(--line),0 8px 24px var(--shade)}
.init li{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;width:56px;flex:none;cursor:pointer;padding-top:5px}
.init i{width:30px;height:30px;border-radius:50%;box-shadow:0 0 0 1.5px var(--ring)}
.init b{font-size:12px;font-weight:500;color:var(--dim);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.init li span{position:absolute;top:0;right:3px;padding:0 5px;border-radius:9px;background:var(--lift);font-size:11px;font-weight:600;font-variant-numeric:tabular-nums}
.init .head{width:auto;padding:0 12px 0 4px;cursor:default}.init .head span{position:static;background:none;padding:0;font-size:13px;font-weight:400;color:var(--dim)}
.init .empty{width:auto;font-size:13px;color:var(--dim);padding:0 8px;cursor:default}
.init .on i{box-shadow:0 0 0 2.5px var(--panel),0 0 0 5px var(--hot)}.init .on b{color:var(--text);font-weight:600}
.init .nextb{width:auto;padding:0 0 0 8px}
.nextb button{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--hot);color:var(--onhot)}.nextb .ic{width:15px;height:15px}
.card{top:var(--under,96px)}
body.carded #panel{display:none}
.card .close{position:absolute;top:12px;right:12px}
.card h2{font-size:40px;line-height:.95;margin:8px 0 18px}
.stats{display:flex;gap:18px}
.stat{display:flex;flex-direction:column;gap:4px;min-width:0}.stat span{font-size:13px;color:var(--dim)}
.stat b{font:500 26px/1 'Figtree',sans-serif;letter-spacing:-.02em;white-space:nowrap;font-variant-numeric:tabular-nums}
.stat input{width:62px;padding:6px 8px;font-size:18px}.stat.hp input{width:56px;padding:6px 4px;text-align:center;-moz-appearance:textfield}.stat.hp input::-webkit-inner-spin-button,.stat.hp input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.stat .pair{display:flex;align-items:center;gap:4px;color:var(--text);font-size:18px}
.conds{display:flex;flex-wrap:wrap;gap:4px}
.conds button{display:flex;align-items:center;gap:6px;padding:5px 9px 5px 6px;border-radius:7px;font-size:13px;color:var(--dim);background:var(--lift)}
.conds button .ic{width:16px;height:16px}.conds .on{background:var(--hot);color:var(--onhot)}.conds button:disabled{cursor:default}
.initrow{display:flex;gap:8px;align-items:center}.initrow input{width:80px}
.exit{right:70px}
@media (max-width:1100px){.init{max-width:calc(100% - 40px);top:auto;bottom:70px}
 body.panel[data-view=master] .init{left:90px;right:calc(var(--pw) + 40px);transform:none;max-width:none}}

/* Tappa 3a: manuale, bestiario, scheda del personaggio */
textarea{width:100%;font:inherit;font-size:15px;color:var(--text);background:var(--lift);border:0;border-radius:7px;padding:8px 10px;resize:vertical}
.btn{display:inline-flex;align-items:center;gap:6px}.btn .ic{width:16px;height:16px}.btn:disabled{opacity:.45;cursor:default}
.btn.back{padding:6px 12px 6px 8px;margin-bottom:12px;font-weight:500;font-size:14px}
.sheet p>.btn,.sheet>div>.btn.soft,#shBody>.btn{margin-top:8px}
.chips{display:flex;flex-wrap:wrap;gap:4px;margin:10px 0 6px}
.chips button,.seg button{padding:5px 10px;border-radius:7px;font-size:13px;color:var(--dim);background:var(--lift)}
.chips .on,.seg .on{background:var(--text);color:var(--dark)}
.seg{display:flex;flex-wrap:wrap;gap:4px;margin:4px 0 12px}
.hits{margin-top:6px}.hits .row{border-top:1px solid var(--line)}.hits .row:first-child{border-top:0}
.row.pick:hover b{color:var(--hot)}
.entry{margin-top:12px;font-size:14.5px;line-height:1.45}
.entry p{margin:0 0 8px}.entry h4{font:600 15px 'Figtree',sans-serif;margin:14px 0 6px}
.entry table{border-collapse:collapse;margin:0 0 10px;font-size:13px}.entry td{padding:3px 8px 3px 0;border-bottom:1px solid var(--line)}
.kv{margin:0 0 8px}.kv>span{display:block;font-size:12px;color:var(--dim)}.kv p{margin:0}.kv .kv{margin:2px 0 4px 10px}
.dots{list-style:disc;padding-left:18px}.dots li{margin:2px 0}
.abil{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin:6px 0 12px;text-align:center}
.abil>*{display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--lift);border-radius:7px;padding:6px 0}
.abil span{font-size:11px;color:var(--dim)}.abil b{font-size:18px;font-weight:600;font-variant-numeric:tabular-nums}.abil small{font-size:13px}
.abil.edit input{width:44px;padding:2px 0;text-align:center;font-size:18px;font-weight:600;background:var(--panel)}
/* Schede del manuale: dati chiave, titoli, tabelle */
.dk{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin:10px 0 6px;padding:10px 12px;background:var(--lift);border-radius:9px}
.dk>div{min-width:0}.dk .w{grid-column:1/-1}.dk dt{font-size:12px;color:var(--dim)}.dk dd{margin:0;font-size:14px;font-weight:500;overflow-wrap:anywhere}
.entry .sub{color:var(--dim);font-size:13px;margin:6px 0 0}.pg{font-size:12px;opacity:.75}
.entry h4.sez{margin:16px 0 6px;padding-bottom:3px;border-bottom:1px solid var(--line);font-size:13px;color:var(--dim);letter-spacing:.02em}
.entry .tab{margin:10px 0}.entry .cap{display:block;font-size:13px;margin-bottom:4px}.entry .scroll{overflow-x:auto}
.entry th{text-align:left;font-weight:600;font-size:12px;color:var(--dim);padding:3px 8px 3px 0;border-bottom:1px solid var(--ring);white-space:nowrap}
.entry .ins{margin:10px 0;padding:8px 10px;background:var(--lift);border-radius:8px}.entry .ins h4{margin-top:0}
.entry blockquote{margin:8px 0;padding-left:10px;border-left:2px solid var(--ring);color:var(--dim)}.entry blockquote small{display:block}
.entry .ref{margin:0 0 4px;padding-left:10px;border-left:2px solid var(--line)}
.entry .lv li{display:flex;gap:10px;margin:3px 0}.entry .lv span{flex:none;width:44px;color:var(--dim)}
input.title{background:none;border:0;padding:0;font:30px/1.1 'Young Serif',serif;color:var(--text);width:100%;margin-bottom:4px}
input.title:focus{outline:0;box-shadow:0 2px 0 var(--hot)}
.stats.wrap{flex-wrap:wrap;gap:12px 16px;margin-top:14px}
.row input[type=number]{width:56px;padding:4px 6px;font-size:15px;text-align:right;font-variant-numeric:tabular-nums}
.row input.qty{text-align:center;width:48px}
input.over{box-shadow:inset 0 -2px 0 var(--hot)}
.cols{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}
.row .pf,.row i.pf{width:13px;height:13px;flex:none;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--ring)}
.pf.p1{background:var(--text);box-shadow:none}.pf.p2{background:var(--hot);box-shadow:0 0 0 2px var(--panel),0 0 0 3.5px var(--hot)}
.skills .row{padding:2px 0}.skills b small{font-size:11px;margin-left:4px}
.link{cursor:pointer}.link:hover{color:var(--hot)}
.val{font-variant-numeric:tabular-nums;min-width:2.6em;text-align:right}
.slots .box{width:18px;height:18px;border-radius:4px;box-shadow:inset 0 0 0 1.5px var(--ring)}.slots .box.on{background:var(--hot);box-shadow:none}
.addrow{display:flex;gap:6px;align-items:center;margin:6px 0}.addrow input,.addrow select{flex:1;min-width:0;padding:6px 8px;font-size:14px}
.coins{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.coins input{width:100%;padding:6px;font-size:15px}
.steps{display:flex;gap:4px;list-style:none;padding:0;margin:10px 0 16px}.steps li{flex:1;height:4px;border-radius:2px;background:var(--lift)}
.steps .done{background:var(--ring)}.steps .on{background:var(--hot)}
.wizfoot{display:flex;gap:8px;justify-content:flex-end;margin-top:18px;position:sticky;bottom:-20px;padding:12px 0;background:var(--panel)}
.wizfoot .btn:first-child{margin-right:auto}
.abrows .row{gap:10px}.abrows .row>b{flex:0 0 40px}.abrows select,.abrows input{width:76px;padding:5px 8px}.abrows small{flex:1;font-size:13px}
.pb{display:flex;align-items:center;gap:4px}.pb b{width:28px;text-align:center;flex:none!important}.pb button{width:28px;height:28px;display:grid;place-items:center;border-radius:7px;background:var(--lift)}.pb .ic{width:14px;height:14px}
.preview{max-height:280px;overflow:auto;background:var(--lift);border-radius:9px;padding:10px 12px}
.preview h4{margin-top:0}
.sheet .note b{color:var(--text)}
.sheet p:has(>.btn.add){margin:12px 0 4px}
.btns{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 4px}#c_del{margin-top:6px}

/* Punto B: master in gioco */
.init .head{display:flex;flex-direction:column;align-items:flex-start;gap:1px}.init .head small{font-size:12px;white-space:nowrap}
.init .hid i{opacity:.5}.init .hid b{font-style:italic}
.init .nextb{display:flex;flex-direction:row;gap:6px;position:sticky;right:0;z-index:1;background:var(--panel);box-shadow:-8px 0 8px var(--panel)} /* Prossimo turno sempre in vista */.nextb button.soft{background:var(--lift);color:var(--text)}
.fly.wide{max-width:230px;width:230px;padding:10px;gap:6px}.fly.wide small{padding:0 2px 4px}.fly.wide .check{margin:0;font-size:14px}
.fly.wide .btns{margin:2px 0}.fly.wide .btn{height:auto;display:inline-flex;padding:9px 16px}.fly.wide .btn.soft,.fly .btn.soft:hover{background:var(--lift);color:var(--text)}
.fly.wide .addrow{margin:0 0 6px}.fly.wide button.txt:disabled,.fly .btn:disabled{opacity:.45;cursor:default}
.fly .check{display:flex;gap:8px;align-items:center;padding:4px 6px;font-size:14px}
.cond{display:flex;align-items:center;gap:6px;padding:4px 4px 4px 8px;border-radius:7px;font-size:13px;background:var(--hot);color:var(--onhot)}
.cond .ic{width:16px;height:16px}.cond input{width:58px;padding:3px 6px;font-size:13px;background:#0002;color:inherit}.cond input::placeholder{color:inherit;opacity:.6}
.cond small{color:inherit;font-size:12px;opacity:.8}.cond .x{width:24px;height:24px;display:grid;place-items:center;border-radius:5px;color:inherit}.cond .x .ic{width:14px;height:14px}
.addrow.hurt{margin-top:14px}.addrow.hurt input{max-width:80px}.addrow .btn{padding:7px 14px}
.dice{position:fixed;z-index:6;right:20px;bottom:70px;width:316px;padding:12px;border-radius:16px;background:var(--panel);box-shadow:0 0 0 1px var(--line),0 8px 24px var(--shade)}
.dadi3d{position:fixed;inset:0;width:100%;height:100%;z-index:6;pointer-events:none}
.dice .quick{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin:8px 0}
.dice .quick button{height:38px;border-radius:7px;background:var(--lift);font-size:13px;font-weight:600}
.dice .seg{margin:4px 0}.dice .seg button{flex:1}
.log{max-height:220px;overflow:auto;display:flex;flex-direction:column;gap:6px}
.log li{display:flex;align-items:center;gap:9px;font-size:13px}.log li>div{flex:1;min-width:0;display:flex;flex-direction:column}
.log li i{width:9px;height:9px;border-radius:50%;flex:none}.log small{font-size:12px}.log li span{color:var(--dim);overflow:hidden;text-overflow:ellipsis}
.log li b{font:600 22px/1 'Figtree',sans-serif;font-variant-numeric:tabular-nums;min-width:2ch;text-align:right}
.toast{position:fixed;z-index:6;left:50%;bottom:58px;transform:translateX(-50%);display:flex;flex-direction:column;gap:6px;width:min(420px,calc(100% - 40px));pointer-events:none}
.toast>*{pointer-events:auto;background:var(--panel);box-shadow:0 0 0 1px var(--line),0 8px 24px var(--shade);border-radius:12px;padding:9px 12px}
.toast .ask{display:flex;align-items:center;gap:10px;font-size:14px}.toast .ask span{flex:1}.toast .ask .btn{padding:7px 14px}
.toast .pause{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--dim)}
.asbar{position:fixed;z-index:7;top:16px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:8px 8px 8px 14px;border-radius:14px;background:var(--hot);color:var(--onhot);font-size:14px}
.asbar .btn{background:var(--onhot);color:var(--hot);padding:7px 14px}
body.as .init{top:70px}
@media (max-width:600px){.dice{right:10px;width:calc(100% - 20px)}}
/* Homebrew */
.hbtag{flex:none;font-size:11px;line-height:1;padding:3px 6px;border-radius:6px;border:1px solid var(--hot);color:var(--hot);margin-left:4px;vertical-align:1px}
.hbbar{margin-top:8px}.hbbar select{flex:1}.hbacts{margin:10px 0;flex-wrap:wrap}
.hbform{display:grid;grid-template-columns:repeat(6,1fr);gap:0 8px;margin-top:12px}.hbform .field{grid-column:span 6}.hbform .field.half{grid-column:span 2}
.btn.danger.sure{background:#b8452f;color:#fff}.note.err{color:#e0664a}
/* Scene raggruppate per livello (mappe vere), strumenti della scena per il master */
#scFind,#rmFind{width:100%;background:var(--lift);border:0;border-radius:7px;padding:8px 10px;color:var(--text);font-size:15px;margin-bottom:8px}
.lvlHead{display:flex;align-items:center;gap:8px;width:100%;background:none;border:0;color:var(--text);padding:7px 2px;font:inherit;cursor:pointer;text-align:left}
.lvlHead b{flex:1;font-weight:600}.lvlHead small{color:var(--dim)}.lvlHead:hover b{color:var(--hot)}.lvl ul{margin:0 0 6px 22px}
#scExtra{margin:4px 0 8px}#scExtra:empty{display:none}#scExtra h3{width:100%;margin:8px 0 0}#scExtra .note{width:100%;margin:0}
#scExtra .btn{display:inline-flex;align-items:center;gap:6px}#scExtra .btn.on{background:var(--hot);color:var(--onhot)}
.asbar .icon{color:var(--onhot)}
/* PNG: elenco con ritratto, note del master nella scheda della pedina */
#npList .face{width:30px;height:30px;border-radius:50%;flex:none;margin-right:8px}#npList .row{align-items:center}
#n_vres{margin:4px 0}#n_vid:empty{display:none}#n_img{margin-top:6px}
.npcnotes{white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.45;max-height:240px;overflow:auto;background:var(--lift);border-radius:7px;padding:8px 10px}
#rooms .room{border-top:1px solid var(--ring);padding:6px 0}#rooms summary{cursor:pointer}#rooms p{margin:6px 0 0;font-size:14px}
/* Barre di scorrimento: sottili, senza frecce, nei colori del tema */
/* Inneschi: elenco delle regole nello strumento; messaggio ai giocatori. */
.rules{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}.rules li{display:flex;flex-direction:column;gap:2px;padding:8px;border-radius:9px;background:var(--lift)}
.fly .btn:not(.soft){color:var(--onhot)}.rules li.done{opacity:.55}.rules small{padding:0}.rules .btns{display:flex;gap:6px;align-items:center;margin-top:4px}
.fly.wide textarea{width:100%;background:var(--lift);border:0;border-radius:7px;padding:8px 10px;color:var(--text);font:inherit;font-size:14px;resize:vertical}
.clockbig{font:22px/1.2 'Young Serif',serif;padding:2px 2px 4px}.btns.wrap{flex-wrap:wrap}
.showbox{position:fixed;z-index:9;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;background:#000c}
.showbox img{max-width:100%;max-height:calc(100vh - 110px);border-radius:12px;box-shadow:0 12px 40px #000a}
/* Vista per la TV: solo la mappa e il titolo. */
body.tv .isle:not(.scene),body.tv .theme{display:none!important}
/* Effetti d'ambiente: strati leggeri sopra la mappa, solo CSS. */
.fx{position:fixed;inset:0;z-index:1;pointer-events:none;display:none}
.fx.rain{display:block;background:repeating-linear-gradient(105deg,transparent 0 22px,#b8c8e022 22px 23px);background-size:120px 120px;animation:fxrain .5s linear infinite}
.fx.fog{display:block;background:radial-gradient(ellipse 60% 40% at 30% 40%,#d8d4cc30,transparent 70%),radial-gradient(ellipse 50% 35% at 70% 65%,#d8d4cc28,transparent 70%);background-size:200% 200%;animation:fxfog 40s ease-in-out infinite alternate}
.fx.flicker{display:block;background:radial-gradient(ellipse at center,transparent 40%,#1a0e0040);animation:fxflick 3s steps(12) infinite}
@keyframes fxrain{to{background-position:-30px 120px}}@keyframes fxfog{to{background-position:100% 60%}}
@keyframes fxflick{0%,100%{opacity:.6}20%{opacity:.9}35%{opacity:.5}50%{opacity:1}70%{opacity:.7}85%{opacity:.95}}
@media (prefers-reduced-motion:reduce){.fx{animation:none!important}}
.sound{right:120px}
/* Al tavolo il pulsante per tornare alla pagina personale ha la scritta Home: i pulsanti alla sua sinistra si spostano. */
.exit.lbl{width:auto;padding:0 16px 0 12px;gap:8px;display:flex;align-items:center;border-radius:21px;font-size:14px}.exit.lbl .ic{width:18px;height:18px}
body.hb .sound{right:174px}body.hb .apbtn{right:224px}.sound.wait{background:var(--hot);color:var(--onhot)}
.soundbox{position:fixed;z-index:30;right:20px;bottom:68px;width:220px;padding:12px 14px;border-radius:14px;background:var(--panel);box-shadow:0 0 0 1px var(--line),0 8px 24px var(--shade);display:flex;flex-direction:column;gap:8px}
.soundbox input[type=range],.fly input[type=range]{width:100%;accent-color:var(--hot)}
.aulist{list-style:none;margin:0;padding:0;max-height:240px;overflow:auto}.aulist button.txt{width:100%;height:auto;min-height:34px;padding:6px 10px;text-align:left}
.playing{display:grid;grid-template-columns:1fr auto;align-items:center;gap:0 8px;padding:6px 8px;border-radius:9px;background:var(--lift)}.playing small{grid-column:1/-1;padding:0}
.fly .btn.soft.on{background:var(--text);color:var(--dark)}
.notebox{position:fixed;z-index:8;top:80px;left:50%;transform:translateX(-50%);width:min(440px,calc(100vw - 32px));padding:18px 20px;border-radius:16px;background:var(--panel);box-shadow:0 0 0 1px var(--line),0 12px 32px var(--shade);display:flex;flex-direction:column;gap:12px}
.notebox p{margin:0;font-size:17px;line-height:1.45;white-space:pre-wrap}.notebox .btn{align-self:flex-end}
*{scrollbar-width:thin;scrollbar-color:var(--ring) transparent}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--ring);border-radius:8px}::-webkit-scrollbar-button{display:none}
/* Campo "scegli file": pulsante nello stile dell'app */
input[type=file]{font:inherit;font-size:14px;color:var(--dim);margin-top:6px;max-width:100%}
input[type=file]::file-selector-button{font:inherit;font-weight:600;font-size:14px;margin-right:12px;padding:8px 14px;border:0;border-radius:7px;background:var(--lift);color:var(--text);cursor:pointer}
input[type=file]::file-selector-button:hover{background:var(--ring)}
.scene #campName{font-family:'Figtree',sans-serif;color:var(--dim)}.scene #campName:not(:empty)::before{content:"·";margin-right:6px}
.scene #clockName{font-family:'Figtree',sans-serif;color:var(--dim)}.scene #clockName:not(:empty)::before{content:"·";margin:0 6px}
/* Pagina personale (home.js): intestazione e isola delle campagne a sinistra, schede e pannello a destra come al tavolo */
body[data-view=home] .isle:not(.library,#panel,#exit,.hm),body[data-view=home] .stage,body:not([data-view=home]) .hm{display:none!important}
.homehead{position:fixed;z-index:5;left:26px;top:20px;display:flex;flex-direction:column}
.homehead small{font-size:13px}.homehead h1{font-size:44px;line-height:1.05;display:flex;align-items:center;gap:12px}.homehead .dot{width:14px;height:14px}
.homeside{position:fixed;z-index:5;left:20px;top:112px;width:340px;max-height:calc(100% - 180px);overflow:auto;padding:20px 22px;border-radius:18px;background:var(--panel);box-shadow:0 0 0 1px var(--line),0 8px 24px var(--shade)}
.homeside h2{font-size:30px;line-height:1.05;margin-bottom:14px}.homeside>small{display:block;margin-bottom:4px}
.homeside .camp{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;padding:12px 0;border-top:1px solid var(--line)}
.homeside .camp b{flex:1;font-weight:500;min-width:0}.homeside .camp .btn{flex-basis:100%;justify-content:center}
.homeside>.btn{margin:4px 0;width:100%;justify-content:center}.homeside .field{margin-bottom:10px}.note.warn{color:var(--hot);margin:0 0 10px}
body[data-view=home] #panel textarea{min-height:300px}
.plan{padding:0;margin:0 0 10px}.plan .tag{white-space:nowrap}.plan li>div{flex:1;min-width:0}.plan small{display:block;margin-top:2px}
.grp{padding:12px 0;border-top:1px solid var(--line)}.grp>b{display:flex;align-items:center;gap:8px;font-weight:500}.grp dl{display:flex;gap:18px;margin:8px 0}.grp dt{font-size:12px;color:var(--dim)}.grp dd{margin:0;font-size:20px}.grp p{margin:4px 0}.grp p small{margin-right:6px}
.diary{align-items:flex-start}.diary small{flex:0 0 96px;padding-top:2px}.diary span{flex:1;min-width:0;white-space:pre-wrap}#dyText{margin-top:6px}#dyDate{flex:0 1 170px;background:var(--lift);border:0;border-radius:7px;padding:7px 10px;color:var(--text)}:root:not([data-theme=light]) #dyDate{color-scheme:dark}
a.btn{text-decoration:none}#c_down{margin-bottom:10px}
.homeside .sys{margin:14px 0 0;padding-top:10px;border-top:1px solid var(--line);font-size:12px;color:var(--dim)}
.lib{padding:10px 0;border-top:1px solid var(--line)}.lib>.row input{font-weight:600}.lib ul{margin:6px 0 0 14px}.lib .row{gap:8px}.lib li small{flex:0 0 auto}
.btn.soft.danger{margin-top:8px;color:#e0664a}
@media (max-width:900px){
 body[data-view=home]{overflow:auto}
 body[data-view=home] :is(.homehead,.homeside,.library,#panel){position:static;margin:12px;width:auto;max-height:none}
 body[data-view=home] .homehead{margin:20px 16px 0}
}
input[type=search]+select{margin-top:6px}
@media (min-width:1101px){body[data-view=master] .init{top:96px} /* sotto la testata della scena, che ha i pulsanti */
 body.panel[data-view=master] .init{left:90px;right:calc(var(--pw) + 40px);width:fit-content;margin:0 auto;transform:none;max-width:calc(100% - var(--pw) - 130px)}} /* accanto al pannello, non sotto */
.fly .lkSel{margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}.fly .lkSel .btns{margin-top:8px}.fly .hint{display:block;margin-top:8px;color:var(--dim)}
.fly input[type=color]{width:56px;height:36px;padding:3px;border:0;border-radius:7px;background:var(--lift);cursor:pointer}
.menu{position:fixed;z-index:30;min-width:180px;max-width:260px;padding:6px;border-radius:12px;background:var(--panel);box-shadow:0 0 0 1px var(--line),0 8px 24px var(--shade);display:flex;flex-direction:column}.menu small{padding:6px 10px 4px;color:var(--dim);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.menu button{text-align:left;padding:8px 10px;border-radius:7px;font-size:14px;color:var(--text)}.menu button:hover,.menu button:focus-visible{background:var(--lift)}.menu button.danger{color:#e0664a}
/* Nota sulla mappa */
.pinbox{width:290px;max-width:290px;gap:8px;padding:10px}.pinbox small{padding:0 2px}.pinbox p{margin:0 2px;white-space:pre-wrap;line-height:1.45}
.pinbox .check{font-size:14px;display:flex;gap:8px;align-items:center}.pinbox .btns{display:flex;gap:8px}.pinbox .btn{display:inline-flex;padding:8px 14px;height:auto}.pinbox .btn.danger{color:#e0664a}
/* Pannello Audio del master: pulsante in basso, pannello largo in basso che resta aperto. */
.apbtn{right:170px;width:auto;padding:0 16px 0 12px;gap:8px;display:flex;align-items:center;border-radius:21px;font-size:14px}.apbtn .ic{width:18px;height:18px}
.apbtn.on{background:var(--text);color:var(--dark)}
.audiop{position:fixed;z-index:6;left:90px;right:20px;bottom:70px;height:min(40vh,400px);display:flex;flex-direction:column;border-radius:18px;background:var(--panel);box-shadow:0 0 0 1px var(--line),0 8px 24px var(--shade);overflow:hidden}
body.panel .audiop{right:calc(var(--pw) + 40px)}
@media (min-width:601px){body.panel .dice{right:calc(var(--pw) + 40px)}} /* a pannello aperto i dadi gli stanno accanto, non sopra */
.aphead{display:flex;gap:10px 18px;align-items:center;flex-wrap:wrap;padding:12px 16px;border-bottom:1px solid var(--line)}
.apch{flex:1;min-width:190px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 8px}
.apch small,.apch b{grid-column:1/-1}.apch small{font-size:12px;color:var(--dim)}.apch b{font-weight:500;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:20px}.apch b i{color:var(--dim);font-style:normal}
.apch input[type=range]{width:100%;accent-color:var(--hot)}.apch .btn{padding:6px 12px}
.apend{display:flex;gap:6px;align-items:center}
.aptabs{display:flex;gap:4px;align-items:center;padding:8px 16px 4px;flex-wrap:wrap}
.aptabs button{height:40px;padding:0 16px;border-radius:9px;color:var(--dim);font-size:15px}.aptabs button:hover{background:var(--lift);color:var(--text)}.aptabs button.on{background:var(--text);color:var(--dark)}
.aptabs input{margin-left:auto;width:200px}
.apbody{flex:1;overflow:auto;padding:4px 16px 16px}
.apbody h3{font:500 13px 'Figtree',sans-serif;color:var(--dim);margin:14px 0 6px}
.apgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.apkey{min-height:56px;padding:8px 12px;border-radius:10px;background:var(--lift);color:var(--text);text-align:left;font-size:14px;line-height:1.25}
.apkey:hover{box-shadow:inset 0 0 0 1px var(--dim)}.apkey.on{background:var(--hot);color:var(--onhot);font-weight:600}
.apzones li{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}.apzones li>.ic{width:22px;height:22px;color:var(--dim)}.apzones li.on>.ic{color:var(--hot)}
.apzones span{flex:1;display:grid;min-width:0}.apzones small{color:var(--dim);font-size:13px}
.apform{display:grid;gap:4px;max-width:560px;padding-top:10px}.apform .field{margin-bottom:6px}.apform>.btn{justify-self:start;margin-bottom:8px}.apform .btn.on{background:var(--text);color:var(--dark)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}.chips .btn{padding:6px 10px;font-weight:500}.chips .ic{width:14px;height:14px}
/* Giorno e notte nell'intestazione: il master tocca per cambiare */
.scene #nightName{display:inline-flex;align-items:center;font-family:'Figtree',sans-serif;color:var(--dim)}.scene #nightName:not(:empty)::before{content:"·";margin:0 6px}
.scene #nightName .ic{width:15px;height:15px;margin-right:4px}
#nightBtn{pointer-events:auto;display:inline-flex;align-items:center;padding:3px 9px 3px 7px;border-radius:999px;border:1px solid var(--ring);background:var(--lift);color:var(--text);font:inherit;cursor:pointer}#nightBtn:hover{border-color:var(--hot)}#nightBtn .ic{color:var(--hot)}
.rnOut ul{margin:4px 0;padding:0;list-style:none}.rnOut .row b{white-space:normal}.rnOut .row .btn{padding:4px 10px;font-size:13px}.rnOut p{margin:4px 0}

/* Manuale del master a pagine: rimandi nelle note e finestra della pagina */
.pagref{color:var(--hot);text-decoration:underline;cursor:pointer}
.pagrefs{display:flex;flex-wrap:wrap;gap:6px}.pagrefs .btn{display:inline-flex;align-items:center;gap:6px;height:auto;padding:5px 10px;font-size:13px}.pagrefs .ic{width:15px;height:15px}
.pagbox{position:fixed;z-index:40;inset:0;display:flex;justify-content:center;background:#000a}
.pagwin{display:flex;flex-direction:column;width:min(900px,100vw);height:100%;background:var(--panel)}
.paghead{display:flex;align-items:center;gap:6px;padding:8px 10px;border-bottom:1px solid var(--line)}.paghead b{margin:0 6px;min-width:96px;text-align:center}.paghead [data-go="0"]{margin-left:auto}
.paghead .icon:disabled{opacity:.35;pointer-events:none}
.pagbody{flex:1;overflow:auto;background:var(--lift)}.pagbody img{display:block;width:100%}
