/* P8 design-c 2026-10-21 — PulseBoard (internal ops tool). Loaded last. Tokens: PulseBoard/DESIGN_TOKENS.md
   (refero "Axiom": terminal window at midnight). Near-black layers, monospaced UI, one ember for the primary action and
   log bars. Radius 2 everywhere; full round only for status dots. Status is always text + colour, never colour alone. */
:root{
  --p8-void:#000000; --p8-carbon:#111111; --p8-graphite:#191919; --p8-iron:#202020; --p8-slate:#3a3a3a;
  --p8-ash:#7e7e7e;   /* disabled, placeholders (5.3:1 on #000) */
  --p8-fog:#b4b4b4;   /* secondary text */
  --p8-chalk:#d9d9d9; /* body */
  --p8-paper:#eeeeee; /* headings, figures */
  --p8-ember:#da5c2c; /* primary fill (black text 5.6:1), log bars, live marker */
  --p8-ok:#4cc38a; --p8-warn:#e5a54b; --p8-bad:#f2555a; /* semantic, always with a label */
  --p8-mono:ui-monospace,"Cascadia Mono","SFMono-Regular",Consolas,"D2Coding","Noto Sans KR","Malgun Gothic",monospace;
  --p8-r:2px;
  /* Remap the V2 canonical variables. */
  --nav:var(--p8-void); --nav2:var(--p8-void); --bg:var(--p8-void); --panel:var(--p8-carbon);
  --line:var(--p8-iron); --line2:var(--p8-graphite); --ink:var(--p8-paper); --text:var(--p8-chalk); --muted:var(--p8-fog);
  --mint:var(--p8-ember); --mint2:var(--p8-ember); --mintsoft:var(--p8-graphite);
  --amber:var(--p8-warn); --ambersoft:var(--p8-graphite); --red:var(--p8-bad); --redsoft:var(--p8-graphite);
  --blue:var(--p8-fog); --bluesoft:var(--p8-graphite); --shadow:none;
  color-scheme:dark;
}
html,html body{background:var(--p8-void);color:var(--p8-chalk);font-family:var(--p8-mono)}
html body h1,html body h2,html body h3,html body h4{color:var(--p8-paper);font-family:var(--p8-mono);letter-spacing:-.02em}
html body :focus-visible{outline:2px solid var(--p8-paper)!important;outline-offset:2px}
html body a{color:inherit}
html body .muted,html body .sub,html body small{color:var(--p8-fog)}

/* ---------- Buttons: primary / secondary / text; hover · focus · active · disabled · loading ---------- */
html body .btn{height:auto;min-height:40px;padding:0 16px;border:1px solid var(--p8-slate);border-radius:var(--p8-r);background:transparent;color:var(--p8-paper);font:600 14px/1.2 var(--p8-mono);box-shadow:none;transition:background-color .15s,border-color .15s,color .15s}
html body .btn:hover:not(:disabled){background:var(--p8-graphite);border-color:var(--p8-ash)}
html body .btn:active:not(:disabled){background:var(--p8-iron);transform:none}
html body .btn.mint,html body .btn.primary{background:var(--p8-ember);border-color:var(--p8-ember);color:#000;font-weight:700}
html body .btn.mint:hover:not(:disabled),html body .btn.primary:hover:not(:disabled){background:var(--p8-paper);border-color:var(--p8-paper);color:#000}
html body .btn.mint:active:not(:disabled),html body .btn.primary:active:not(:disabled){background:var(--p8-chalk);border-color:var(--p8-chalk)}
/* .dark was the old filled secondary; on black it reads as an outlined secondary. */
html body .btn.dark{background:transparent;border-color:var(--p8-slate);color:var(--p8-paper)}
html body .btn.danger{background:transparent;color:var(--p8-bad);border-color:#5a2526}
html body .btn.danger:hover:not(:disabled){border-color:var(--p8-bad);background:var(--p8-graphite)}
html body .btn:disabled,html body .btn[aria-disabled=true]{opacity:1;background:var(--p8-carbon)!important;border-color:var(--p8-iron)!important;color:var(--p8-ash)!important;cursor:not-allowed}
html body .btn.is-loading,html body .btn[aria-busy=true]{position:relative;color:transparent!important;pointer-events:none}
html body .btn.is-loading::after,html body .btn[aria-busy=true]::after{content:'';position:absolute;inset:calc(50% - 7px) auto auto calc(50% - 7px);width:14px;height:14px;border:2px solid var(--p8-paper);border-right-color:transparent;border-radius:50%;animation:p8spin .7s linear infinite}
html body .btn.mint.is-loading::after,html body .btn.mint[aria-busy=true]::after{border-color:#000;border-right-color:transparent}
@keyframes p8spin{to{transform:rotate(360deg)}}
html body .iconbtn{background:transparent;border:1px solid var(--p8-slate);border-radius:var(--p8-r);color:var(--p8-paper);min-width:40px;min-height:40px}
html body .iconbtn:hover{background:var(--p8-graphite)}

/* ---------- Forms + inline errors ---------- */
html body .input,html body input:not([type=checkbox]):not([type=radio]):not([type=range]),html body select,html body textarea{background:var(--p8-carbon);border:1px solid var(--p8-slate);border-radius:var(--p8-r);color:var(--p8-paper);font-family:var(--p8-mono)}
html body .input:focus,html body input:focus,html body select:focus,html body textarea:focus{border-color:var(--p8-paper);outline:none;box-shadow:0 0 0 1px var(--p8-paper)}
html body ::placeholder{color:var(--p8-ash)}
html body [aria-invalid=true]{border-color:var(--p8-bad)!important;box-shadow:0 0 0 1px var(--p8-bad)!important}
html body .form-error:not([hidden]),html body .field-error,html body .error-text,html body .p8-field-error{color:var(--p8-bad);font-size:13px}
html body .form-error:not([hidden])::before,html body .p8-field-error::before{content:'ERR ';font-weight:700}
html body .toggle:after{background:var(--p8-paper)}

/* ---------- Surfaces ---------- */
html body .shell{background:var(--p8-void)}
html body .sidebar{background:var(--p8-void);border-right:1px solid var(--p8-iron);color:var(--p8-fog)}
html body .brand{border-bottom-color:var(--p8-iron);color:var(--p8-paper)}
html body .brandmark{border-radius:var(--p8-r);border-color:var(--p8-slate);background:var(--p8-carbon)}
html body .glabel{font-size:13px;color:var(--p8-ash);letter-spacing:.08em}
html body .navitem{height:auto;min-height:40px;border-radius:var(--p8-r);color:var(--p8-fog);font-size:14px;font-weight:400}
html body .navitem:hover{background:var(--p8-graphite);color:var(--p8-paper)}
html body .navitem.active{background:var(--p8-graphite);color:var(--p8-paper);font-weight:700}
html body .navitem.active:before{background:var(--p8-ember);border-radius:0}
html body .sidebar-footer{border-top-color:var(--p8-iron)}
html body .avatar{border-radius:50%;background:var(--p8-iron);color:var(--p8-paper)}
html body .topbar{background:var(--p8-void);border-bottom:1px solid var(--p8-iron)}
html body .search{background:var(--p8-carbon);border:1px solid var(--p8-slate);border-radius:var(--p8-r);color:var(--p8-paper)}
html body .card,html body .table,html body .empty,html body .modal,html body .week,html body .component,html body .mcard,html body .mbottom,html body .statushero,html body .authbox,html body .article,html body .toc,html body .helpnav,html body .helpcol,html body .helpaside{background:var(--p8-carbon);border-color:var(--p8-iron);border-radius:var(--p8-r);box-shadow:none;color:var(--p8-chalk)}
html body .th,html body .week .head{background:var(--p8-void);color:var(--p8-fog);font-size:13px;letter-spacing:.04em}
html body .tr{border-color:var(--p8-iron)}
html body .selectable:hover,html body .selected{background:var(--p8-graphite)}
html body .kpi b,html body .card.kpi b{color:var(--p8-paper);font-variant-numeric:tabular-nums;font-weight:700}
html body .badge{border-radius:var(--p8-r);background:var(--p8-graphite);color:var(--p8-chalk);border:1px solid var(--p8-slate);font:600 13px/1.5 var(--p8-mono)}
html body .badge.green{color:var(--p8-ok);border-color:#1f4a35}
html body .badge.amber{color:var(--p8-warn);border-color:#5a4220}
html body .badge.red{color:var(--p8-bad);border-color:#5a2526}
html body .badge.gray{color:var(--p8-fog)}
html body .alert{border-radius:var(--p8-r);background:var(--p8-carbon);border:1px solid var(--p8-iron);color:var(--p8-chalk)}
html body .alert.amber{border-left:2px solid var(--p8-warn);background:var(--p8-carbon)}
html body .alert.green{border-left:2px solid var(--p8-ok);background:var(--p8-carbon)}
html body .alert.red{border-left:2px solid var(--p8-bad);background:var(--p8-carbon)}
html body .healthbox{background:var(--p8-carbon);border-color:var(--p8-iron);border-radius:var(--p8-r)}
html body .signal-band{background:var(--p8-graphite)}
html body .maint-chip{background:var(--p8-graphite);color:var(--p8-chalk);border-radius:var(--p8-r)}
html body .maint-chip.warn{color:var(--p8-warn)}
html body .modal .mhead,html body .modal .mfoot{border-color:var(--p8-iron)}
html body .toast{background:var(--p8-carbon);border:1px solid var(--p8-slate);color:var(--p8-paper);border-radius:var(--p8-r)}
html body .pb-first-run{border-left:2px solid var(--p8-ember)}
html body .pb-fr-steps li{background:var(--p8-void);border-color:var(--p8-iron);border-radius:var(--p8-r)}
html body .pb-fr-steps b{background:var(--p8-graphite);color:var(--p8-paper);border-radius:var(--p8-r)}
html body .statuspage,html body .mobile-only{background:var(--p8-void)}
html body .mico{background:var(--p8-graphite)}

/* ---------- Public pages ---------- */
html body .public{background:var(--p8-void)}
html body .pubnav{background:var(--p8-void);border-bottom:1px solid var(--p8-iron)}
html body .publinks a{display:inline-flex;align-items:center;min-height:44px;color:var(--p8-fog);font-size:14px}
html body .publinks a:hover{color:var(--p8-paper)}
html body .publinks a.active{color:var(--p8-paper);box-shadow:inset 0 -2px 0 var(--p8-ember)}
/* One primary per screen: the nav repeats the hero action as a secondary. */
html body .pubactions .btn.dark,html body .pubactions .btn.mint{background:transparent;border-color:var(--p8-slate);color:var(--p8-paper)}
html body .hero h1{font-size:clamp(32px,3.6vw,52px);font-weight:700;line-height:1.2;letter-spacing:-.03em;color:var(--p8-paper)}
html body .hero h1 em,html body .hero h1 span,html body .hero h1 strong{color:var(--p8-paper);font-style:normal}
html body .hero p{color:var(--p8-fog);font-size:16px;line-height:1.75}
html body .heroactions .btn{min-height:48px}
html body .eyebrow{color:var(--p8-fog);font:600 13px/1.4 var(--p8-mono);letter-spacing:.08em}
html body .eyebrow::before{content:'> ';color:var(--p8-ember)}
html body .product-window{background:var(--p8-carbon);border:1px solid var(--p8-slate);border-radius:var(--p8-r);box-shadow:none}
html body .hero h1 *{color:var(--p8-paper)!important}
html body .pwtop,html body .pwside,html body .pwrow{border-color:var(--p8-iron)}
html body .pwlive{color:var(--p8-ember)}
html body .pws{border-radius:var(--p8-r);color:var(--p8-fog)}
html body .pws.on{background:var(--p8-iron);color:var(--p8-paper)}
html body .pwstat,html body .pwtable{background:var(--p8-void);border-color:var(--p8-iron);border-radius:var(--p8-r)}
html body .pwbar{border-radius:0;background:var(--p8-iron)}
html body .product-window .alert.red,html body .product-window .alert{background:var(--p8-void);border-color:var(--p8-iron);border-left:2px solid var(--p8-bad);color:var(--p8-chalk)}
/* First run: the guide's own button is the primary; the page-head duplicate steps down. */
html body .main:has(.pb-first-run) .pagehead .btn.mint{background:transparent;border-color:var(--p8-slate);color:var(--p8-paper);font-weight:600}
html body #pb-extended-home .pb-last-actions .btn:not(.mint){border-color:var(--p8-slate)!important}
html body #pb-extended-home .pb-last-actions .btn:not(.mint):hover{background:var(--p8-graphite)!important}
html body #pb-extended-home .pb-last-actions .btn.mint{color:#000;border-color:var(--p8-ember)}
html body .pubsection{background:var(--p8-void);border-top:1px solid var(--p8-iron)}
html body .pubsection.soft{background:var(--p8-carbon)}
html body .flow4>div,html body #pb-extended-home .pb-value-card,html body #pb-extended-home .pb-step,html body .pb-step,html body .pb-value-card{background:var(--p8-carbon);border-color:var(--p8-iron);border-radius:var(--p8-r);box-shadow:none;color:var(--p8-chalk)}
html body .pb-value-number{color:var(--p8-ember)}
html body .pb-last-cta{background:var(--p8-carbon);border-top:1px solid var(--p8-iron)}
html body .pb-public-footer{background:var(--p8-void);border-top:1px solid var(--p8-iron);color:var(--p8-fog)}
html body .pb-public-footer a,html body .rv-biz a{display:inline-flex;align-items:center;min-height:44px}
html body .pb-help-contact{background:var(--p8-carbon);border-radius:var(--p8-r)}
html body .pb-nav-toggle{background:transparent;border:1px solid var(--p8-slate);color:var(--p8-paper);border-radius:var(--p8-r)}
html body .rv-biz,html body .rv-biz p{color:var(--p8-fog)}

@media (max-width:768px),(pointer:coarse){
  html body .btn,html body .navitem,html body .iconbtn{min-height:44px}
  html body .iconbtn{min-width:44px}
}
@media (prefers-reduced-motion:reduce){html body *{transition:none!important;animation:none!important}}

/* ---------- Legacy light-theme text colours (greys/greens tuned for white) re-mapped for black ---------- */
html body :is(p,label,small,li,dd,dt,figcaption,.sub,.pb-max-intro,.pb-auth-alt,.pb-auth-aux):not(.badge):not(.badge *){color:var(--p8-fog)!important}
html body :is(h1,h2,h3,h4,b,strong,th,.kpi b){color:var(--p8-paper)}
html body :is(em,.pb-value-number){color:var(--p8-paper)!important;font-style:normal}
html body a:not(.btn):not(.navitem):not(.pubbrand):not(.brand):not(.pws){color:var(--p8-paper)!important;text-decoration:underline;text-decoration-color:var(--p8-slate);text-underline-offset:3px}
html body .publinks a,html body .pubnav a:not(.btn){text-decoration:none!important}
html body .publinks a:not(.active){color:var(--p8-fog)!important}
/* Login: the submit is the one primary action on the screen. */
html body .authbg,html body .authleft,html body .authright{background:var(--p8-void)!important}
html body .authbox{border:1px solid var(--p8-iron)}
html body .authleft{border-right:1px solid var(--p8-iron)}
html body .authright .btn.dark,html body .authbox form .btn.dark{background:var(--p8-ember);border-color:var(--p8-ember);color:#000;font-weight:700}
html body .authright .btn.dark:hover{background:var(--p8-paper);border-color:var(--p8-paper)}
html body .authmini,html body .authmini *{background-color:var(--p8-carbon);border-color:var(--p8-iron)}
@media (max-width:768px),(pointer:coarse){
  html body .pubbrand,html body .pb-auth-aux a,html body .pb-auth-alt a,html body .avatar{min-height:44px;display:inline-flex;align-items:center}
  html body .pubactions .btn{min-height:44px}
}
html body :is(.pb-step,.pb-fr-steps,.pb-detail-copy,.pb-detail-bullets,.pb-value-card,.flow4,.pb-journey-section,.card) span:not(.badge):not(.badge *){color:var(--p8-fog)!important}
html body .alert,html body .alert *{color:var(--p8-chalk)!important}

/* 404 (P9 QA 2026-10-22): the canonical text colours are for the dark theme, so the 404 sits on the same dark surface. */
html body.pb-v2-public-route:has(.pb-nf){background:#000!important;color:#ededed}
body.pb-v2-public-route:has(.pb-nf) .pb-v2-public-head{background:#000;border-bottom:1px solid #262626}
body.pb-v2-public-route:has(.pb-nf) .pb-v2-public-head a{color:#d9d9d9}
body.pb-v2-public-route:has(.pb-nf) .pb-v2-public-head a:hover{color:#fff}
body.pb-v2-public-route:has(.pb-nf) .pb-v2-public-head .pb-v2-primary{background:transparent;color:#f2f2f2;box-shadow:0 0 0 1px #5c5c5c}
body.pb-v2-public-route:has(.pb-nf) .pb-v2-public-footer{background:#000;color:#bdbdbd;border-top:1px solid #262626}
body.pb-v2-public-route:has(.pb-nf) .pb-v2-public-footer a{color:#d9d9d9}
.pb-nf{width:min(1120px,100% - 32px);margin:0 auto;padding:96px 0}
.pb-nf small{font-size:13px;font-weight:600;letter-spacing:.08em;color:#bdbdbd}
.pb-nf h1{margin:12px 0 16px;color:#f5f5f5;font-size:clamp(30px,4vw,44px);font-weight:700;letter-spacing:-.03em}
.pb-nf p{max-width:34em;margin:0 0 32px;color:#c4c4c4;font-size:17px;line-height:1.7}
.pb-nf-row{display:flex;flex-wrap:wrap;gap:12px}
html body .pb-nf-btn{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:8px;color:#f2f2f2;font-weight:600;text-decoration:none;box-shadow:0 0 0 1px #5c5c5c}
html body .pb-nf-btn.pb-nf-main{background:#f2f2f2;color:#000;box-shadow:none}
html body .pb-nf-btn:hover{box-shadow:0 0 0 1px #d9d9d9}html body .pb-nf-btn.pb-nf-main:hover{background:#fff}
.pb-nf-btn:focus-visible,.pb-v2-public-head a:focus-visible{outline:2px solid #f2f2f2;outline-offset:2px}
