:root{color-scheme:dark;--bg:#111514;--panel:#191e1b;--panel2:#1e2420;--line:#30382e;--text:#e7e5d9;--muted:#9aab9f;--gold:#d4b474;--ember:#d88f54;--green:#9dbca0;--danger:#e6a58f;--serif:Georgia,'Times New Roman',serif;--sans:'Segoe UI',system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.55 var(--sans)}button,input,select{font:inherit}button,a,input,select,summary{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:4px}[hidden]{display:none!important}a{color:var(--gold)}button{color:inherit}.topbar{height:88px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 4.5vw;gap:24px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text);font-size:23px;letter-spacing:5px;font-weight:600}.brand small{font-size:8px;letter-spacing:2.4px;display:block;color:var(--muted);margin-top:-2px}.topbar nav{display:flex;height:100%;gap:30px}.nav{background:none;border:0;border-bottom:2px solid transparent;color:var(--muted);padding:0 5px}.nav.active{border-color:var(--gold);color:var(--gold)}.top-actions{display:flex;align-items:center;gap:24px}.connection{font-size:12px;color:var(--muted)}i{display:inline-block}.connection i,.scene-tag i{width:6px;height:6px;border-radius:50%;background:var(--green);margin-right:8px}.icon-button{background:transparent;border:1px solid var(--line);width:36px;height:36px;border-radius:50%;font-size:21px;display:inline-grid;place-items:center}.icon-button:hover{border-color:var(--gold);color:var(--gold)}main{max-width:1440px;margin:auto;padding:38px 4.5vw 30px}.campaign-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px;gap:20px}.eyebrow{font-size:9px;font-weight:600;letter-spacing:2.4px;color:var(--gold)}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:var(--serif);font-weight:400}h1{font-size:38px;margin:8px 0 0;line-height:1.15;letter-spacing:-.8px}h1 span{color:var(--gold)}h2{font-size:25px;line-height:1.25;margin:8px 0 20px}h3{font-size:21px;margin-bottom:12px}.campaign-meta{display:flex;flex-direction:column;align-items:flex-end;gap:8px;font-size:11px;color:var(--muted)}.pill{border:1px solid #49513c;border-radius:5px;padding:5px 10px;font-size:10px;color:#d0c7a5;white-space:nowrap}.setup-banner{display:flex;align-items:center;gap:17px;background:#24261d;border:1px solid #4b4a31;border-radius:8px;padding:16px 20px;margin-bottom:24px}.setup-banner strong{font-weight:500;font-size:13px}.setup-banner p{font-size:12px;color:#b4b8a5;margin:3px 0 0}.setup-banner .button{margin-left:auto;white-space:nowrap}.spark{font-size:30px;color:var(--gold)}.table-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:22px}.scene-panel{border:1px solid var(--line);border-radius:10px;overflow:hidden}.scene-art{height:350px;position:relative;background:#253932}.scene-art>img{width:100%;height:100%;object-fit:cover;object-position:50% 45%}.scene-shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(11,20,17,.96),transparent 75%)}.scene-tag{position:absolute;top:22px;left:24px;display:flex;align-items:center;border:1px solid #758e7160;background:#182c248c;padding:5px 10px;border-radius:4px;font-size:9px;letter-spacing:1.6px;color:#d1dec8}.scene-tag i{background:#c5b57d;width:5px;height:5px}.scene-caption{position:absolute;bottom:25px;left:30px;right:30px}.scene-caption h2{font-size:34px;margin:8px 0 9px}.scene-caption p{max-width:530px;color:#b9c9b9;font-size:13px;line-height:1.65;margin:0}.scene-footer{padding:16px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:11px;background:#18201b;color:var(--muted)}.small-rune{color:var(--gold);margin-right:6px}.party-panel{border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:22px}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.panel-heading h2{font-size:23px;margin:7px 0 20px}.panel-heading .icon-button{width:29px;height:29px;font-size:18px;margin-top:-13px}.hero{width:100%;text-align:left;background:none;border:1px solid transparent;border-radius:6px;padding:12px 8px;display:flex;gap:12px;align-items:center;margin-bottom:5px}.hero:hover{background:#242d24}.hero.selected{background:#272e24;border-color:#4f573e}.avatar{width:39px;height:43px;background:linear-gradient(150deg,#666047,#353c2e);border:1px solid #8b805650;display:grid;place-items:center;clip-path:polygon(15% 0,85% 0,100% 18%,100% 80%,50% 100%,0 80%,0 18%);font-family:var(--serif);font-size:23px;color:#e2cb91;flex-shrink:0}.hero:nth-child(2n) .avatar{background:linear-gradient(150deg,#475f5c,#293b36);color:#b7d0bd}.hero-info{flex:1;min-width:0}.hero-name{display:flex;justify-content:space-between;gap:5px;font-size:13px}.hero-name strong{font-weight:500}.hp{font-size:11px;color:#a0b49a;white-space:nowrap}.hero-role{font-size:10px;color:var(--muted);display:block;margin:2px 0 7px}.hp-bar{height:3px;background:#343e30;border-radius:3px;overflow:hidden}.hp-bar i{display:block;height:100%;background:#94a574}.party-note{color:var(--muted);font-size:10px;line-height:1.7;margin:18px 0 0;padding-top:15px;border-top:1px solid var(--line)}.enemy{margin-top:16px;color:var(--danger);font-size:12px}.voice-panel{border:1px solid #414936;border-radius:10px;background:radial-gradient(ellipse at 15% 0%,#283024 0%,#1b211c 50%);padding:24px 28px 15px;margin-top:22px}.voice-top{display:flex;align-items:center;justify-content:space-between;gap:20px}.voice-identity{display:flex;align-items:center;gap:19px}.ember-orb{width:64px;height:64px;border-radius:50%;background:radial-gradient(circle,#525139 0%,#30382a 45%,#252b20 70%);border:1px solid #6a6743;box-shadow:0 0 30px #d2b16b0e;display:grid;place-items:center;flex-shrink:0}.ember-orb span{font-size:33px;color:var(--gold);filter:drop-shadow(0 0 8px #cbb36270)}.ember-orb.live{animation:glow 2.5s ease-in-out infinite}.voice-identity h2{font-size:24px;margin:5px 0 5px}.voice-identity p{font-size:12px;color:var(--muted);margin:0}.quiet{color:var(--muted);border-color:var(--line);font-size:9px;letter-spacing:1px}#waveform{display:block;width:100%;height:45px;margin:18px 0 10px;opacity:.9}.voice-controls{display:flex;align-items:center;justify-content:space-between;gap:15px}.voice-options,.primary-controls{display:flex;align-items:center;gap:10px}.select-wrap{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--muted);margin:0}.select-wrap select{width:auto;padding:8px 26px 8px 10px;background:#242b22}.button{border:1px solid var(--line);border-radius:5px;padding:11px 17px;background:#252b23;font-size:12px;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:22px;transition:background .15s,border-color .15s}.button:hover:not(:disabled){border-color:var(--gold)}.button.primary{background:var(--gold);color:#20251a;border-color:var(--gold)}.button.primary:hover:not(:disabled){background:#e2c586}.subtle{background:transparent;border-color:#64603e;color:#d9c694}.quiet-button{background:#1c231e;color:#b8c4b5}.text-button{border:0;background:transparent;color:var(--gold);font-size:11px;padding:0;white-space:nowrap}.voice-footnote{border-top:1px solid #343d2f;margin-top:20px;padding-top:12px;font-size:10px;color:#879981;display:flex;justify-content:space-between;gap:10px}.voice-footnote i{width:5px;height:5px;background:#71846c;border-radius:50%;margin-right:5px}.voice-footnote i.live{background:var(--gold)}.lower-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:24px}.quest-panel,.recent-panel{padding:22px 25px;border:1px solid var(--line);border-radius:8px}.quest-panel h2{font-size:22px;margin-bottom:15px}.quest{display:flex;gap:12px;align-items:center;font-size:12px;color:#c6c9b9}.quest span{color:var(--gold);font-size:20px}.quest small{display:block;color:var(--muted);font-size:10px}.recent-panel p{font:italic 17px/1.6 var(--serif);margin:16px 0 14px;color:#c7cbbb}.muted{color:var(--muted)}.small{font-size:10px}.section-top{display:flex;justify-content:space-between;align-items:center}.journal-layout{display:grid;grid-template-columns:1.8fr 1fr;gap:45px}.journal-list{min-height:330px}.journal-entry{border-bottom:1px solid var(--line);padding:20px 0}.journal-entry small{font-size:9px;color:var(--gold);letter-spacing:1px}.journal-entry p{margin:8px 0 0;white-space:pre-wrap}.journal-entry.player p{color:#acbbaf}.journal-entry.correction{border-left:2px solid var(--ember);padding-left:16px}.journal-layout aside{padding:25px;border:1px solid var(--line);border-radius:8px;align-self:start}.journal-layout aside p{font-size:12px}.fact{padding:13px 0;border-bottom:1px solid var(--line);font-size:13px}.section-intro{max-width:750px;color:var(--muted);font-size:14px;line-height:1.8}.rules-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:30px 0}.rule{border:1px solid var(--line);border-radius:8px;padding:25px}.rule p{font-size:13px;color:#b0bfb1}.rule a{font-size:11px}.notice{background:#252b20;border:1px solid #424b34;border-radius:6px;padding:15px 18px;font-size:12px;color:#bac4a8;line-height:1.7}.roll-panel{display:flex;align-items:center;gap:20px;background:#333023;border:1px solid #9b8346;border-radius:8px;padding:20px 25px;margin-top:24px}.roll-panel h3{margin:3px 0}.roll-panel p{margin:0;color:#c3bea6;font-size:12px}.roll-panel>.button{margin-left:auto}.dice-emblem{font:25px var(--serif);color:var(--gold);width:50px;height:55px;border:1px solid var(--gold);display:grid;place-items:center;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:#514831}.correction-panel{background:#362b23;border:1px solid #916b4c;padding:20px;display:flex;gap:20px;align-items:center;margin-top:20px;border-radius:8px}.correction-panel div{flex:1}.correction-panel p{margin:5px 0 0;font-size:12px}.toast{position:fixed;z-index:20;bottom:35px;left:50%;transform:translateX(-50%);max-width:min(650px,90vw);padding:15px 25px;background:#3c3527;border:1px solid var(--gold);border-radius:8px;box-shadow:0 12px 40px #0008;color:#eee1c5;font-size:13px}.toast.error{border-color:var(--danger);background:#3b2925}footer{max-width:1440px;margin:auto;padding:24px 4.5vw 30px;display:flex;justify-content:space-between;gap:15px;color:#8e9a85;font-size:9px;letter-spacing:1px}footer>div{display:flex;gap:12px;align-items:center;letter-spacing:0}.budget-track{width:90px;height:3px;background:#363d30;border-radius:2px;overflow:hidden}.budget-track i{display:block;width:0;height:100%;background:var(--gold)}dialog{background:#1a211b;color:var(--text);border:1px solid #505a42;border-radius:12px;max-width:700px;width:calc(100% - 32px);max-height:88vh;padding:28px 32px;box-shadow:0 30px 120px #000a}dialog::backdrop{background:#080d0be0;backdrop-filter:blur(5px)}.dialog-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:25px}.dialog-heading h2{margin:8px 0 20px}.dialog-heading .icon-button{border:0;font-size:28px}label{display:block;font-size:12px;color:#c0cbb8;margin:18px 0}input:not([type=checkbox]):not([type=range]),select{display:block;width:100%;margin-top:7px;background:#111812;border:1px solid #3c4936;border-radius:5px;color:var(--text);padding:10px 12px;min-width:0}input[type=range]{display:block;width:100%;accent-color:var(--gold);margin-top:18px}label small{display:block;color:var(--muted);font-size:10px;line-height:1.6;margin-top:5px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.form-grid label{margin:12px 0}.check-label{display:flex;align-items:center;gap:10px}.check-label input{accent-color:var(--gold)}details{border-top:1px solid var(--line);padding:16px 0}summary{cursor:pointer;font-size:13px;color:var(--gold)}details>p{font-size:12px;margin-top:15px}details h3{font-size:18px;margin:15px 0 0}.dialog-actions{display:flex;justify-content:space-between;gap:15px;margin-top:20px}.form-error{font-size:12px;color:var(--danger);margin:10px 0}.caption{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);background:#10180ff2;border:1px solid #6b704d;color:#eeeada;padding:15px 22px;max-width:850px;width:90vw;border-radius:6px;z-index:15;font:17px/1.5 var(--serif);pointer-events:none}.empty{padding:35px 0;color:var(--muted);font:20px var(--serif)}.active-turn{color:var(--gold);font-size:10px}.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}
@keyframes glow{50%{box-shadow:0 0 35px #d2b16b30;border-color:#bda366}}
@media(min-width:1500px){.scene-art{height:390px}}
@media(max-width:1000px){.table-grid{grid-template-columns:minmax(0,1fr) 260px}.party-panel{padding:18px}.scene-caption h2{font-size:28px}.connection{display:none}.voice-controls{align-items:stretch}.voice-options{flex-wrap:wrap}.voice-identity h2{font-size:21px}.topbar{gap:15px}.topbar nav{gap:20px}.scene-footer>span{max-width:200px}.voice-panel{padding:22px}.scene-art{height:350px}}
@media(max-width:740px){.topbar{height:auto;min-height:77px;padding:16px 5vw;flex-wrap:wrap}.brand{font-size:20px}.brand small{font-size:7px}.topbar nav{order:3;width:100%;height:35px;justify-content:space-around}.topbar .top-actions{margin-left:auto}.campaign-heading{align-items:flex-start}h1{font-size:30px}.campaign-meta{display:none}main{padding:27px 5vw 20px}.table-grid{grid-template-columns:1fr}.scene-art{height:320px}.scene-caption{left:22px;right:22px}.scene-caption h2{font-size:29px}.scene-footer{padding:13px 18px}.party-panel{padding:18px}.party-panel .panel-heading h2{margin-bottom:10px}#party-list{display:grid;grid-template-columns:1fr 1fr;gap:5px}.party-note{font-size:10px;margin-top:10px;padding-top:10px}.setup-banner{flex-wrap:wrap;padding:15px}.setup-banner .spark{display:none}.setup-banner .button{margin-left:0}.voice-panel{padding:20px 17px 13px}.voice-top{align-items:flex-start}.voice-top .pill{font-size:8px;padding:4px 6px}.ember-orb{width:45px;height:45px}.ember-orb span{font-size:25px}.voice-identity{gap:11px}.voice-identity h2{font-size:19px}.voice-identity p{font-size:11px}.voice-identity .eyebrow{font-size:8px}.voice-controls{flex-direction:column}.voice-options,.primary-controls{justify-content:space-between}.primary-controls .primary{flex:1}.voice-footnote{font-size:9px;flex-wrap:wrap}.lower-grid{grid-template-columns:1fr}.recent-panel{display:none}.journal-layout{grid-template-columns:1fr;gap:20px}.rules-grid{grid-template-columns:1fr}.roll-panel{flex-wrap:wrap;padding:18px}.roll-panel>.button{width:100%;margin:0}.correction-panel{flex-wrap:wrap}.correction-panel>div{flex-basis:100%}footer{flex-wrap:wrap;font-size:8px;justify-content:center}footer>span:last-child{display:none}.form-grid{grid-template-columns:1fr;gap:0}dialog{padding:22px}.section-top{align-items:flex-start;flex-direction:column;gap:10px}.hero{padding:10px 6px}.hero-role{font-size:9px}.avatar{width:31px;height:37px}.hero-name{flex-wrap:wrap}.hp{font-size:9px}.select-wrap{gap:5px}.button{padding:10px 13px}.caption{font-size:14px;max-height:35vh;overflow:auto}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.dice-panel{margin-top:24px;padding:24px 28px;border:1px solid #695d3b;border-radius:9px;background:radial-gradient(ellipse at 5% 65%,#51452a55,transparent 55%),#1e241e}.dice-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.dice-heading h3{font:24px var(--serif);margin:6px 0 0}.auto-roll-label{display:flex;align-items:center;gap:10px;color:#e3d5b1;font-size:12px;margin:0;cursor:pointer}.auto-roll-label input{accent-color:var(--gold);width:18px;height:18px;flex-shrink:0}.dice-stage{display:flex;gap:26px;align-items:center;padding:24px 0 18px;min-height:136px}.dice-stage>.button{margin-left:auto;flex-shrink:0}.dice-tray{display:flex;gap:12px;perspective:700px;flex-shrink:0}.visual-die{display:flex;flex-direction:column;align-items:center;justify-content:center;width:82px;height:90px;clip-path:polygon(50% 0,96% 24%,96% 76%,50% 100%,4% 76%,4% 24%);background:linear-gradient(150deg,#d9bc7e,#8b713e 48%,#dbbf80 49%,#5c4b2e);color:#171b15;filter:drop-shadow(0 5px 6px #0005);transform-origin:center}.visual-die small{font-size:10px;font-weight:700;letter-spacing:2px}.visual-die strong{font:700 31px var(--serif);line-height:1.2}.die-discarded{opacity:.35}.is-rolling{animation:dice-roll .55s linear infinite}.die-reveal{animation:dice-settle .8s ease-out}.dice-calculation p{margin:3px 0}.dice-calculation .roll-formula{font-size:19px;color:#f1e2b9;font-variant-numeric:tabular-nums}.dice-calculation .muted{font-size:12px}.roll-outcome{font-weight:600}.roll-outcome.success{color:#bad4a7}.roll-outcome.failure{color:#e4ae96}#roll-damage{font-size:13px}.dice-footnote{font-size:11px;color:var(--muted);border-top:1px solid #46503c;padding-top:13px;margin:0}.ability-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.ability-cell{display:flex;flex-direction:column;background:#111a14;border:1px solid #394632;padding:9px;border-radius:5px}.ability-cell span{font-size:10px;color:var(--muted)}.ability-cell strong{font:24px var(--serif);color:var(--gold)}.sheet-stat,.inventory-list{font-size:12px;line-height:1.6;color:#cbd0bd}.inventory-list{padding-left:18px}#character-values h4{font-size:12px;color:var(--gold);margin:16px 0 5px}.sheet-note{font-size:10px;color:var(--muted);line-height:1.5}#character-sheet{padding:14px 0 0;margin-bottom:15px}#character-values h3{font-size:20px}
@keyframes dice-roll{0%{transform:rotate(-20deg) translateY(0)}50%{transform:rotate(160deg) translateY(-10px)}100%{transform:rotate(340deg) translateY(0)}}
@keyframes dice-settle{0%{transform:rotate(-160deg) scale(.65);opacity:.4}65%{transform:rotate(12deg) scale(1.08)}100%{transform:rotate(0) scale(1);opacity:1}}
@media(max-width:740px){.dice-panel{padding:20px 17px}.dice-heading{align-items:flex-start;flex-direction:column;gap:14px}.dice-stage{flex-wrap:wrap;gap:18px}.dice-stage>.button{width:100%;margin:0}.dice-calculation{flex:1;min-width:160px}.dice-calculation .roll-formula{font-size:16px}.visual-die{width:65px;height:75px}.dice-tray{gap:6px}}
@media(prefers-reduced-motion:reduce){.is-rolling,.die-reveal{animation:none}}
.dice-options{display:flex;flex-direction:column;gap:10px}.dice-stage{display:grid;grid-template-columns:minmax(240px,1.3fr) minmax(160px,1fr);gap:24px}.dice-tray{display:block;width:100%;min-width:0}.dice-canvas{width:100%;height:210px;display:block;border-radius:9px;box-shadow:inset 0 0 25px #0005}.dice-stage>.button{grid-column:2;justify-self:start;margin:0}.journal-entry.invalidated{opacity:.58;border-left:2px dashed #b49e76;padding-left:14px}.invalidated-label{display:block;font-size:11px;color:#d9bd87;margin-bottom:8px}
@media(max-width:740px){.dice-stage{grid-template-columns:minmax(0,1fr);gap:14px}.dice-stage>.button{grid-column:1;justify-self:stretch}.dice-calculation{min-width:0}.dice-options{width:100%;flex-wrap:wrap;flex-direction:row;gap:12px 20px}}
.campaign-row { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; padding: .7rem 0; border-bottom: 1px solid #ffffff1c; }
.campaign-row strong { flex: 1; min-width: 10rem; }

/* The character sheet is an overlay, so opening it never stretches the table. */
.character-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
#character-dialog .ability-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
#character-button{width:100%;margin-top:10px}

@media (min-width: 1000px) and (min-height: 650px) {
  .topbar{height:62px;padding:0 3vw}
  main{padding:14px 3vw 10px}
  .campaign-heading{margin-bottom:12px}
  .campaign-heading h1{font-size:27px;margin:3px 0 0}
  .setup-banner{padding:8px 14px;margin-bottom:10px}
  #table-view.view:not([hidden]){display:grid;grid-template-columns:minmax(0,1fr) minmax(310px,36%);grid-template-areas:'scene party' 'voice dice' 'lower lower';gap:12px;align-items:stretch}
  #table-view .table-grid{display:contents}
  #table-view .scene-panel{grid-area:scene}
  #table-view .scene-panel{display:flex;flex-direction:column}
  #table-view .scene-art{flex:1 1 auto;min-height:0}
  #table-view .party-panel{grid-area:party;min-width:0;padding:14px 16px}
  #table-view .voice-panel{grid-area:voice;margin:0;padding:14px 18px}
  #table-view .dice-panel{grid-area:dice;margin:0;padding:14px 16px}
  #table-view .lower-grid{grid-area:lower;margin:0;gap:12px}
  #table-view .scene-art{height:clamp(155px,24vh,205px)}
  #table-view .scene-caption{left:20px;bottom:15px}
  #table-view .scene-caption h2{font-size:25px;margin:4px 0}
  #table-view .scene-caption p{font-size:12px;line-height:1.4}
  #table-view .scene-tag{top:12px;left:14px}
  #table-view .scene-footer{padding:9px 15px}
  #table-view .party-panel .panel-heading h2{font-size:20px;margin:4px 0 8px}
  #table-view #party-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
  #table-view .hero{padding:5px;margin:0;gap:7px}
  #table-view .avatar{width:30px;height:34px;font-size:18px}
  #table-view .hero-role{margin:1px 0 4px}
  #table-view .party-note{margin:8px 0 0;padding-top:6px;line-height:1.35}
  #table-view #character-button{margin-top:7px;padding:7px 10px}
  #table-view .voice-identity h2{font-size:20px}
  #table-view .ember-orb{width:45px;height:45px}
  #table-view #waveform{height:26px;margin:8px 0}
  #table-view .voice-footnote{margin-top:9px;padding-top:7px}
  #table-view .voice-controls{flex-wrap:wrap}
  #table-view .dice-heading h3{font-size:19px;margin:3px 0 0}
  #table-view .dice-options{gap:5px}
  #table-view .auto-roll-label{font-size:11px}
  #table-view .dice-stage{grid-template-columns:minmax(115px,48%) minmax(0,1fr);gap:12px;min-height:0;padding:9px 0}
  #table-view .dice-canvas{height:clamp(95px,16vh,130px)}
  #table-view .dice-calculation .roll-formula{font-size:16px}
  #table-view .dice-stage>.button{padding:7px 10px}
  #table-view .dice-footnote{padding-top:6px;font-size:10px}
  #table-view .quest-panel,#table-view .recent-panel{padding:10px 15px}
  #table-view .quest-panel h2{font-size:18px;margin:3px 0}
  #table-view .recent-panel p{font-size:13px;line-height:1.35;margin:5px 0}
  #table-view .recent-panel .small{display:none}
  footer{padding:8px 3vw 12px}
}

@media (min-width: 1000px) and (min-height: 650px) and (max-height: 850px) {
  .topbar{height:50px}
  main{padding-top:6px;padding-bottom:6px}
  .campaign-heading{margin-bottom:8px}
  .campaign-heading h1{font-size:23px}
  .campaign-meta #session-label{display:none}
  .setup-banner{padding:6px 12px;margin-bottom:8px}
  .setup-banner .spark{font-size:18px;line-height:1}
  .setup-banner p{margin:0}
  .setup-banner .button{padding:7px 10px}
  #table-view.view:not([hidden]){gap:8px}
  #table-view .scene-art{height:clamp(125px,19vh,155px)}
  #table-view .scene-footer{padding:6px 12px}
  #table-view .scene-caption h2{font-size:21px}
  #table-view .party-panel{padding:10px 12px}
  #table-view .party-panel .panel-heading h2{margin:2px 0 5px}
  #table-view .hero{padding:3px}
  #table-view .party-note{margin-top:4px;padding-top:4px}
  #table-view #character-button{margin-top:4px;padding:5px 8px}
  #table-view .voice-panel,#table-view .dice-panel{padding:10px 12px}
  #table-view .voice-identity h2{font-size:18px}
  #table-view .voice-identity p{line-height:1.3}
  #table-view #waveform{height:20px;margin:5px 0}
  #table-view .voice-footnote{margin-top:6px;padding-top:5px}
  #table-view .dice-heading h3{font-size:17px;line-height:1.1}
  #table-view .dice-stage{padding:5px 0;gap:8px}
  #table-view .dice-canvas{height:clamp(75px,13vh,100px)}
  #table-view .dice-footnote{padding-top:4px;line-height:1.3}
  #table-view .quest-panel,#table-view .recent-panel{padding:4px 12px}
  #table-view .quest-panel>.eyebrow{display:none}
  #table-view .quest-panel h2{font-size:16px;margin:0}
  #table-view .quest small{display:none}
  #table-view .recent-panel p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:2px 0;font-size:12px}
  footer{padding:5px 3vw 7px}
}
@media (min-width: 1000px) and (min-height: 650px) {
  #table-view #party-list{grid-template-columns:repeat(3,minmax(0,1fr))}
  #table-view .hero-name{flex-wrap:wrap;line-height:1.2}
  #table-view .hero-name strong{overflow:hidden;text-overflow:ellipsis}
}
@media (min-width: 1000px) and (max-width: 1199px) and (min-height: 650px) {
  #table-view .hero .avatar,#table-view .hero-role,#table-view .hp-bar{display:none}
  #table-view .hero-name{gap:2px;font-size:11px}
  #table-view .hero-name .hp{font-size:9px}
}

/* Hub (step 2b): start page with campaigns, roster figures and adventure choice. */
#hub-view .section-top{margin-bottom:16px}
#hub-view .section-top h2{font:28px var(--serif);margin:4px 0 0}
#hub-problems{margin-bottom:16px}
.hub-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;margin-bottom:20px}
.hub-panel{padding:20px 24px;border:1px solid var(--line);border-radius:8px;background:var(--panel)}
.hub-panel>h3{margin:4px 0 10px}
.hub-panel h4{font:17px var(--serif);margin:18px 0 8px}
.hub-panel .small{font-size:11px}
.hub-actions{display:flex;gap:10px;flex-wrap:wrap}
.campaign-label{flex:1;min-width:12rem;display:flex;flex-direction:column}
.campaign-label small{color:var(--muted);font-size:12px}
.campaign-row.active .campaign-label strong{color:var(--gold)}
.adventure-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin-top:6px}
.adventure-card{display:flex;flex-direction:column;gap:6px;padding:16px 18px;border:1px solid var(--line);border-radius:8px;background:var(--panel2)}
.adventure-card h4{margin:0}
.adventure-card p{flex:1;margin:0 0 8px;color:#cfd2c4}
.adventure-card .button{align-self:flex-start}
.adventure-card.selected{border-color:var(--gold);box-shadow:0 0 0 1px #d4b47455}
#campaign-form{margin-top:18px;padding-top:6px;border-top:1px solid var(--line)}
.seat-list .seat{gap:12px;align-items:end}
.seat-list .seat label[hidden]{display:none}
@media(max-width:740px){.hub-grid{grid-template-columns:minmax(0,1fr)}.hub-panel{padding:16px}.hub-panel .form-grid{grid-template-columns:minmax(0,1fr);gap:0}}
.hub-running{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px;border-color:#916b4c;background:#2e2720}
.hub-grid{align-items:start}
@media(max-width:740px){.hub-running{flex-direction:column;align-items:stretch}}
.hero-marks{display:flex;flex-wrap:wrap;gap:3px;margin:0 0 4px}.mark{font-size:9px;line-height:1.4;padding:0 5px;border:1px solid #5c5a3e;border-radius:3px;color:#d8cba0;background:#2a2b20;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}.mark-down{border-color:#8a4f3f;color:#f0b9a4;background:#3a2722}.mark-stable{border-color:#5d7350;color:#c4dbb4;background:#26301f}
/* Character creation (Plan 5): wizard dialog with live preview, level-up dialog. */
.roster-actions{margin-top:12px}
.template-details{margin-top:14px;padding:10px 0 0}
.template-details>summary{font-size:12px}
.wide-dialog{max-width:1100px}
.step-nav{display:flex;flex-wrap:wrap;gap:6px;margin:-6px 0 16px}
.step-nav button{border:1px solid var(--line);background:#1c231e;color:#b8c4b5;border-radius:999px;padding:5px 12px;font-size:11px}
.step-nav button.current{border-color:var(--gold);color:var(--gold);background:#2a2c20}
.creation-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:22px;align-items:start}
.creation-step{min-width:0}
.creation-step h3{font-size:20px;margin:0 0 6px}
.creation-step label{margin:12px 0}
.creation-preview{position:sticky;top:0;padding:14px 16px;border:1px solid var(--line);border-radius:8px;background:var(--panel2);font-size:12px}
.creation-preview h4{font:19px var(--serif);margin:4px 0 2px}
.creation-preview h5{font-size:11px;color:var(--gold);margin:12px 0 4px;font-weight:500;letter-spacing:.5px}
.creation-preview p{margin:3px 0}
.preview-main{font:20px var(--serif)!important;color:var(--gold)!important}
.preview-abilities{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:10px;gap:5px}
.preview-abilities .ability-cell{padding:5px 7px}
.preview-abilities .ability-cell strong{font-size:18px}
.choice-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:10px 0}
.choice-card{text-align:left;border:1px solid var(--line);border-radius:6px;background:#1c231e;padding:9px 11px;display:flex;flex-direction:column;gap:2px;min-width:0}
.choice-card strong{font-weight:500}
.choice-card small{color:var(--muted);font-size:10px;line-height:1.45}
.choice-card:hover{border-color:#6a6743}
.choice-card.selected{border-color:var(--gold);background:#2a2c20}
.choice-card.selected strong{color:var(--gold)}
.choice-group{border:1px solid var(--line);border-radius:6px;padding:6px 12px 10px;margin:12px 0;min-width:0}
.choice-group legend{color:var(--gold);font-size:12px;padding:0 4px}
.check-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:0 14px}
.creation-step .check-grid .check-label,#levelup-body .check-grid .check-label{margin:5px 0;flex-wrap:wrap;gap:6px}
.check-grid .check-label small{flex-basis:100%;margin:0 0 0 24px}
.check-grid .check-label:has(input:disabled:not(:checked)){opacity:.55}
.feature-list{margin:4px 0;padding-left:18px;font-size:12px;color:#cbd0bd}
.feature-list li{margin:3px 0}
.feature-list strong{font-weight:500;color:var(--text)}
.feat-box{margin-top:4px}
.trait-details{padding:10px 0}
.score-table{width:100%;border-collapse:collapse;font-size:12px;margin:12px 0}
.score-table th{font-weight:500;color:var(--muted);font-size:11px}
.score-table td,.score-table th{padding:5px 6px;border-bottom:1px solid #2c362b;text-align:left}
.score-table select{margin:0;padding:6px 8px;max-width:110px}
.stepper{display:inline-flex;align-items:center;gap:8px}
.stepper button{width:30px;height:30px;border-radius:5px;border:1px solid var(--line);background:#1c231e;font-size:15px;line-height:1}
.stepper strong{min-width:20px;text-align:center;font:17px var(--serif);color:var(--gold)}
.points-left{font-size:13px}
.roll-line{font-variant-numeric:tabular-nums}
.roll-line s{opacity:.5}
.problem-list{margin:4px 0 0;padding-left:16px;color:var(--danger);font-size:11px;line-height:1.5}
.ok-text{color:var(--green)}
.summary-list{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 16px;font-size:12px;margin:10px 0 14px}
.summary-list dt{color:var(--muted)}
.summary-list dd{margin:0;color:#dcdccf}
.levelup-preview{margin-top:14px}
.levelup-preview p{margin:0}
.feature-details{border-top:0;padding:8px 0}
.feature-summary{display:block;margin:-2px 0 6px 10px}
@media(max-width:740px){.creation-layout{grid-template-columns:minmax(0,1fr)}.creation-preview{position:static}.step-nav{gap:4px}.step-nav button{padding:4px 9px;font-size:10px}.choice-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}.check-grid{grid-template-columns:minmax(0,1fr)}.summary-list{grid-template-columns:minmax(0,1fr);gap:0}.summary-list dd{margin-bottom:8px}.dialog-actions{flex-wrap:wrap}.score-table td,.score-table th{padding:4px 3px}.score-table th:nth-child(3),.score-table td:nth-child(3){display:none}.stepper{gap:4px}.stepper button{width:26px;height:26px}.stepper small{display:none}}
.stepper small{white-space:nowrap}
.resource-list{list-style:none;padding:0;margin:0 0 6px;font-size:12px;color:#cbd0bd}.resource-list li{padding:4px 0;border-bottom:1px solid #2c362b}.resource-line{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.resource-list .sheet-note{display:block}.tier-mark{font-size:9px;letter-spacing:.5px;color:var(--muted);border:1px solid #3c4936;border-radius:3px;padding:0 4px;white-space:nowrap}.tier-automatisch{color:#b9cfa6}.tier-unterstuetzt{color:#d8c690}.tier-schiedsentscheid{color:#e0b39b}
/* Session 6 Nov 2026 (Plan 11.06): dice tray, foe field, coins, spell details, table talk. */
/* While the dice roll the result lines keep their room; only visibility changes, so the
   tray column never resizes (a resize would reallocate the canvas mid-roll). */
@media(min-width:741px){.dice-stage{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}}
.dice-calculation{position:relative;min-width:0;overflow-wrap:anywhere}
#roll-motion{position:absolute;top:0;left:0;margin:0;visibility:hidden;opacity:0;transform:translateY(4px);transition:opacity .18s ease-out,transform .18s ease-out}
.dice-rolling #roll-motion{visibility:visible;opacity:1;transform:none}
.dice-rolling #roll-formula,.dice-rolling #roll-outcome,.dice-rolling #roll-damage,.dice-rolling #roll-hint{visibility:hidden}
#roll-formula,#roll-outcome,#roll-damage,#roll-hint{animation:roll-reveal .28s ease-out}
.dice-rolling #roll-formula,.dice-rolling #roll-outcome,.dice-rolling #roll-damage,.dice-rolling #roll-hint{animation:none}
@keyframes roll-reveal{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
/* Coins at the figure on the table page. */
.hero-money{display:block;font-size:10px;color:#d2c18d;margin:-4px 0 5px;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Foe field: compact, only during a fight. */
.foe-panel{margin-top:12px;padding-top:10px;border-top:1px solid var(--line)}
.foe-heading{display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.foe-heading .eyebrow{color:var(--danger)}
.foe-turn{font-size:11px;color:var(--gold)}
.foe-turn.foe-acting{color:var(--danger)}
.foe-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:6px}
.foe{border:1px solid #4a3a30;background:#241d19;border-radius:6px;padding:6px 8px;min-width:0;font-size:12px}
.foe.acting{border-color:var(--danger);box-shadow:0 0 0 1px #e6a58f40}
.foe.defeated{opacity:.5}
.foe.defeated strong{text-decoration:line-through}
.foe-name{display:flex;justify-content:space-between;gap:6px;align-items:baseline}
.foe-name strong{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.foe-hp{font-size:11px;color:#e4b9a5;white-space:nowrap;font-variant-numeric:tabular-nums}
.foe-bar{display:block;height:4px;background:#3c2c26;border-radius:3px;overflow:hidden;margin:5px 0 3px}
.foe-bar i{display:block;height:100%;width:100%;background:#c9785e;transform-origin:left center;transition:transform .45s ease-out}
.foe-bar.mid i{background:#d39a5a}.foe-bar.low i{background:#e0564a}
.foe-meta{display:block;font-size:10px;color:var(--muted)}
.foe.muted{border-style:dashed;color:var(--muted)}
@media(max-width:740px){.foe-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width: 1000px) and (min-height: 650px){#table-view .foe-panel{margin-top:4px;padding-top:4px}#table-view .foe-heading{margin-bottom:3px}#table-view .foe{padding:3px 6px;line-height:1.3}#table-view .foe-bar{margin:2px 0 1px;height:3px}#table-view .foe-list{gap:4px}
  /* In a fight the foe field takes the place of the fixed party hint, so the table keeps its height. */
  #table-view .party-panel.in-combat .party-note{display:none}#table-view .party-panel.in-combat #character-button{margin-top:4px}}
@media (min-width: 1000px) and (max-width: 1199px) and (min-height: 650px){#table-view .hero-money{font-size:9px;margin:0}}
/* Spell details in the creation wizard and the level-up dialog. */
.spell-info{grid-column:1/-1;margin:8px 0 2px;padding:8px 10px;border:1px solid #3c4936;border-radius:6px;background:#141c16;font-size:12px;color:#cbd0bd;min-height:2.6em}
.spell-info strong{color:var(--gold);font-weight:500}
.spell-info p{margin:3px 0}
.spell-info small{display:block;color:var(--muted);font-size:11px}
.check-grid .check-label[title]{cursor:help}
/* Utterances booked silently as table talk. */
.journal-entry.overheard{opacity:.55}
.journal-entry.overheard p{font-style:italic}
.journal-entry.no-reply{border-left:2px solid var(--danger);padding-left:14px}.journal-entry.no-reply p{color:#e9c2b4}
@media(prefers-reduced-motion:reduce){#roll-motion,.foe-bar i{transition:none}#roll-formula,#roll-outcome,#roll-damage,#roll-hint{animation:none}}
/* 7 Nov 2026: explanations on the character sheet (tooltip, info line, foldout). */
.info-chip{display:inline;padding:2px 0;margin:0;border:0;background:none;color:inherit;font:inherit;line-height:inherit;text-align:left;text-decoration:underline dotted #8a9a7f;text-underline-offset:3px;cursor:help}
.info-chip:hover{color:#f1e2b9}.info-chip:focus-visible{outline:1px solid var(--gold);outline-offset:2px;border-radius:2px}
.sheet-info{margin:2px 0 8px;min-height:0}.sheet-info[hidden]{display:none}
.info-details{margin:0;padding:1px 0;font-size:12px;color:#cbd0bd}.info-details>summary{cursor:pointer;line-height:1.6}.info-details>summary:hover{color:#f1e2b9}
.info-details>.sheet-note{margin:2px 0 6px 14px}.feature-details .info-details>summary,.trait-details .info-details>summary{list-style-position:inside}
.resource-info{flex:1;min-width:0}.resource-info>summary{line-height:1.5}
.trait-details{padding:4px 0}.trait-details>summary{font-size:12px;cursor:pointer;color:#cbd0bd}
/* Equipment: what is worn and held, and the change controls. */
.equip-block{font-size:12px;color:#cbd0bd}
.equip-list{display:grid;grid-template-columns:auto minmax(0,1fr);gap:3px 12px;margin:0 0 4px}.equip-list dt{color:var(--muted);font-size:11px;line-height:1.7}.equip-list dd{margin:0;line-height:1.6;min-width:0;overflow-wrap:anywhere}
.worn-mark{display:inline-block;margin-right:6px;padding:0 5px;border:1px solid #6d7f52;border-radius:3px;color:#c7dcae;font-size:9px;letter-spacing:.6px;text-transform:uppercase;line-height:1.5;vertical-align:1px}
.equip-facts{display:block;color:var(--muted);font-size:11px;line-height:1.4}
.equip-change{margin:2px 0 4px;padding:2px 0}.equip-change>summary{cursor:pointer;color:var(--gold);font-size:12px}
.equip-form{padding:6px 0 2px}.equip-form .form-grid{gap:2px 14px}.equip-form label{font-size:11px}.equip-form .check-label{align-self:end;margin-bottom:10px}
.equip-hint:empty{display:none}.equip-actions{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;margin-top:6px}.equip-result{margin:0;font-size:12px;color:#c7dcae}.equip-result.form-error{color:var(--danger)}
.device-note strong{color:var(--text);font-weight:600}
@media(max-width:740px){.equip-list{grid-template-columns:minmax(0,1fr);gap:0}.equip-list dt{margin-top:4px}.equip-form .check-label{margin-bottom:6px}}
/* 11 Nov 2026: addressing the game master, speaking up by itself, table talk in the chronicle. */
.settings-heading{font-size:18px;margin:22px 0 0}.settings-tip{font-size:11px;line-height:1.6;margin:4px 0 0}.settings-tip strong{color:var(--text);font-weight:600}
.intro-card{display:flex;align-items:flex-start;gap:18px;margin-bottom:18px;padding:14px 18px;border:1px solid #4b4a31;border-radius:8px;background:#22241b}
.intro-card .intro-text{flex:1;min-width:0}.intro-card h3{font-size:18px;margin:3px 0 6px}
.intro-list{margin:0;padding-left:18px;font-size:12px;line-height:1.6;color:#c9ccbb}.intro-list strong{color:var(--text);font-weight:600}
.intro-card>.button{flex-shrink:0;align-self:center}
@media (min-width: 1000px) and (min-height: 650px){
  #table-view.view:not([hidden]):has(> .intro-card:not([hidden])){grid-template-areas:'intro intro' 'scene party' 'voice dice' 'lower lower'}
  #table-view .intro-card{grid-area:intro;margin:0;padding:8px 14px}
  #table-view .intro-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px;font-size:11px;line-height:1.45}
}
@media(max-width:740px){.intro-card{flex-direction:column;gap:8px;padding:12px 14px}.intro-card>.button{align-self:stretch}}
.journal-entry.unprompted small .unprompted-mark{color:var(--muted);letter-spacing:1px}
.journal-entry.overheard:hover,.journal-entry.overheard:focus-within{opacity:.85}
.overheard-send{display:inline-block;margin-top:6px;font-size:11px;font-style:normal}/* Online mode (12 Nov 2026): account in the top bar, sign-in and the admin dialog. */
.account-label{font-size:12px;color:var(--muted);white-space:nowrap}
.inline-choice{display:inline-flex;align-items:center;gap:6px;margin-right:18px}
.inline-choice input{width:auto;margin:0}
.online-entry{margin:10px 0 14px}
.invite-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.account-list{display:grid;gap:6px;margin-bottom:10px}
#online-dialog form{max-width:640px}
