@import url('/navigation/visual-tokens.css');

/* Campaign Hub and the VM Workbench share one command-surface language. */
body[data-veilfall-page="campaign-home"]{font-family:var(--vf-body-font);background:var(--vf-bg);color:var(--vf-text)}
body[data-veilfall-page="campaign-home"] #hub{background:radial-gradient(circle at 56% 0,#1c2c2c 0,transparent 45%),var(--vf-bg)}
body[data-veilfall-page="campaign-home"] .top{background:#10191bf0;border-color:var(--vf-line);box-shadow:0 8px 28px #0003}
body[data-veilfall-page="campaign-home"] .top .brand{font-family:var(--vf-display-font);font-size:18px;letter-spacing:.17em}
body[data-veilfall-page="campaign-home"] .top .brand span{border-radius:5px;transform:skew(-8deg)}
body[data-veilfall-page="campaign-home"] .identity h1{font-size:clamp(25px,2.7vw,39px);letter-spacing:-.025em}
body[data-veilfall-page="campaign-home"] .rail{background:var(--vf-rail);border-color:var(--vf-line)}
body[data-veilfall-page="campaign-home"] .rail button{border:1px solid transparent;transition:background .16s,border-color .16s}
body[data-veilfall-page="campaign-home"] .rail button:hover{background:#263a36;border-color:#476057}
body[data-veilfall-page="campaign-home"] .rail button.selected{background:#263a36;border-color:#607765;box-shadow:inset 3px 0 var(--vf-gold);color:var(--vf-text)}
body[data-veilfall-page="campaign-home"] .rail button.selected span{color:var(--vf-gold)}
body[data-veilfall-page="campaign-home"] :is(.panel,#frames){border-color:var(--vf-line);background:linear-gradient(145deg,var(--vf-surface),#121c1e);box-shadow:var(--vf-shadow)}
body[data-veilfall-page="campaign-home"] :is(.panel,.workbench-heading) h2{font:700 clamp(24px,2.1vw,31px)/1 var(--vf-display-font);letter-spacing:.04em;text-transform:uppercase}
body[data-veilfall-page="campaign-home"] .campaign-banner{border-color:#6b795f;box-shadow:var(--vf-shadow)}
body[data-veilfall-page="campaign-home"] .record:hover{color:var(--vf-gold)}
body[data-veilfall-page="campaign-home"] :is(button,a):focus-visible{outline:2px solid var(--vf-gold);outline-offset:3px}

/* Adventure Matrix: denser Scene preparation, with its player stage as the focal surface. */
body[data-veilfall-page="adventure-matrix"]{font-family:var(--vf-body-font);background:radial-gradient(circle at 65% 0,#1b2b2b 0,transparent 45%),var(--vf-bg);color:var(--vf-text)}
body[data-veilfall-page="adventure-matrix"]>header{background:#10191bf2;border-color:var(--vf-line);box-shadow:0 8px 28px #0003}
body[data-veilfall-page="adventure-matrix"]>header>a{font:700 16px var(--vf-display-font);letter-spacing:.12em;text-transform:uppercase;color:var(--vf-gold)}
body[data-veilfall-page="adventure-matrix"]>header>strong{font:700 22px var(--vf-display-font);letter-spacing:.06em;text-transform:uppercase}
body[data-veilfall-page="adventure-matrix"] .layout>aside{background:var(--vf-rail);border-color:var(--vf-line)}
body[data-veilfall-page="adventure-matrix"] .layout>main{max-width:none}
body[data-veilfall-page="adventure-matrix"] :is(h1,h2,h3){color:var(--vf-text)}
body[data-veilfall-page="adventure-matrix"] #heading h1{font:800 clamp(30px,3vw,43px)/1 var(--vf-display-font);letter-spacing:.04em;text-transform:uppercase}
body[data-veilfall-page="adventure-matrix"] .workbench-top h2{font:800 clamp(29px,2.7vw,39px)/1 var(--vf-display-font);letter-spacing:.04em;text-transform:uppercase}
body[data-veilfall-page="adventure-matrix"] .workbench-top small{color:var(--vf-gold);letter-spacing:.15em}
body[data-veilfall-page="adventure-matrix"] .card{background:linear-gradient(145deg,var(--vf-surface),#121c1e);border-color:var(--vf-line);box-shadow:var(--vf-shadow)}
body[data-veilfall-page="adventure-matrix"] .card.vm{border-top:3px solid var(--vf-gold)}
body[data-veilfall-page="adventure-matrix"] .workbench-columns{grid-template-columns:minmax(0,1fr) minmax(290px,360px)}
body[data-veilfall-page="adventure-matrix"] .workbench-stage{display:grid;gap:15px;min-width:0}
body[data-veilfall-page="adventure-matrix"] .workbench-columns>.card.vm{min-width:0}
body[data-veilfall-page="adventure-matrix"] .player{background:#0d1517;border-color:#6d8c7d;border-radius:9px;overflow:hidden}
body[data-veilfall-page="adventure-matrix"] :is(.workbench-modes,.workbench-actions){border-color:var(--vf-line)}
body[data-veilfall-page="adventure-matrix"] .workbench-modes{background:#1d2c2b}
body[data-veilfall-page="adventure-matrix"] :is(button,input,textarea,select){font-family:var(--vf-body-font);border-color:#536b64}
body[data-veilfall-page="adventure-matrix"] button:hover{border-color:var(--vf-gold);background:#2a3f3a}
body[data-veilfall-page="adventure-matrix"] :is(button.primary,nav .selected,#library-filters [aria-pressed=true]){background:var(--vf-gold);border-color:var(--vf-gold);color:#18221e}
body[data-veilfall-page="adventure-matrix"] :is(button,a,input,textarea,select,summary):focus-visible{outline:2px solid var(--vf-gold);outline-offset:3px}
body[data-veilfall-page="adventure-matrix"] .inline-scene-value:not(:disabled):hover{background:#2c4642}

/* Shared Space is the companion side of the same visual language. */
body[data-veilfall-page="party-journal"]{font-family:var(--vf-body-font);background:var(--vf-bg);color:var(--vf-text)}
body[data-veilfall-page="party-journal"] .top{background:linear-gradient(110deg,#101a1b,#1b2b29);border-color:var(--vf-line)}
body[data-veilfall-page="party-journal"] .top h1{font-size:clamp(31px,3vw,43px)}
body[data-veilfall-page="party-journal"] :is(.team-dashboard>section,.team-dashboard>.team-art-tile,.record-link){border-color:var(--vf-line);background-color:var(--vf-surface)}
body[data-veilfall-page="party-journal"] button.active{background:var(--vf-gold);border-color:var(--vf-gold);color:#18221e}
body[data-veilfall-page="party-journal"] :is(a,button,input,select,textarea):focus-visible{outline:2px solid var(--vf-gold);outline-offset:3px}

@media(max-width:1050px){body[data-veilfall-page="adventure-matrix"] .workbench-columns{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){body[data-veilfall-page="campaign-home"] .rail button{transition:none}}