/* PressureTest design system -- the ONE stylesheet every page loads LAST.
   Rules and reasons: BRAND.md. Living style guide: /brand.html.
   The brand gate (tools/brand/check.mjs) fails a deploy that drifts from it. */

@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/inter-var.woff2) format("woff2")}

/* 1. Tokens ---------------------------------------------------------------- */
:root,body,body.pt-home,body.pt-app,.pt-app{
  --pt-bg:#071725;        /* page */
  --pt-surface:#0d2231;   /* bands, footer, inputs */
  --pt-card:#102737;      /* cards */
  --pt-card-2:#163749;    /* raised / featured card */
  --pt-line:#284757;      /* hairlines */
  --pt-line-2:#416477;    /* input borders */
  --pt-text:#edf7fc;
  --pt-muted:#b0c7d3;
  --pt-subtle:#8aa3b1;
  --pt-cyan:#36d3e4;      /* ACTION: buttons, links, focus */
  --pt-cyan-2:#79e5ef;    /* action hover */
  --pt-on-cyan:#071725;   /* text on cyan */
  --pt-brass:#ddb14d;     /* ACCENT: eyebrows, badges, ranks, highlights. Never a button. */
  --pt-ok:#3ecf8e;
  --pt-bad:#ff6b6b;
  --pt-font:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --pt-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --pt-r:6px;--pt-r-lg:10px;--pt-r-xl:14px;

  /* compat: pressuretest.css / brand.css names */
  --pt-ink:var(--pt-text);--pt-paper:var(--pt-bg);--pt-copper:var(--pt-cyan);--pt-soft:var(--pt-surface);
  /* compat: legacy Arena styles.css names -> brand */
  --bg-dark:var(--pt-bg);--bg-primary:var(--pt-bg);--bg-card:var(--pt-card);--bg-card-hover:var(--pt-card-2);--bg-surface:var(--pt-surface);--bg-input:var(--pt-bg);
  --neon-blue:var(--pt-cyan);--neon-cyan:var(--pt-cyan);--neon-orange:var(--pt-brass);--neon-yellow:var(--pt-brass);--neon-purple:var(--pt-brass);--neon-green:var(--pt-ok);--neon-red:var(--pt-bad);
  --success:var(--pt-ok);--danger:var(--pt-bad);--warning:var(--pt-brass);--info:var(--pt-cyan);
  --text-primary:var(--pt-text);--text-secondary:var(--pt-muted);--text-muted:var(--pt-subtle);--text-white:#fff;
  --border:var(--pt-line);--border-glow:var(--pt-line-2);
  --glow-blue:none;--glow-orange:none;--glow-green:none;--glow-red:none;--glow-purple:none;
  --font-display:var(--pt-font);--font-heading:var(--pt-font);--font-body:var(--pt-font);
  --radius:var(--pt-r-lg);--radius-sm:var(--pt-r);--radius-lg:var(--pt-r-xl);--radius-xl:var(--pt-r-xl);
}

/* 2. Base -------------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{background:var(--pt-bg)}
body{background:var(--pt-bg)!important;color:var(--pt-text);font-family:var(--pt-font)!important;-webkit-font-smoothing:antialiased}
body::before,body::after{display:none!important}               /* no Arena glow/grid */
h1,h2,h3,h4,h5{font-family:var(--pt-font)!important;color:var(--pt-text);text-shadow:none!important}
h1{font-weight:800;letter-spacing:-.025em;line-height:1.08;text-transform:none!important}
h2{font-weight:750;letter-spacing:-.015em;line-height:1.2;text-transform:none!important}
h3,h4{font-weight:700;letter-spacing:-.01em;text-transform:none}
a{color:var(--pt-cyan)}
a:hover{color:var(--pt-cyan-2)}
::selection{background:var(--pt-cyan);color:var(--pt-on-cyan)}
:focus-visible{outline:3px solid var(--pt-cyan)!important;outline-offset:3px}
code,kbd{font-family:var(--pt-mono)}
.skip-link{position:fixed;top:-80px;left:16px;background:var(--pt-cyan);color:var(--pt-on-cyan)!important;padding:10px 14px;border-radius:var(--pt-r);z-index:200;font-weight:700}
.skip-link:focus{top:10px}
.eyebrow{font:700 12px/1.5 var(--pt-font)!important;text-transform:uppercase;letter-spacing:.14em;color:var(--pt-brass)!important;margin:0 0 14px}
h1 em,.pt-home h1 em{font-style:normal;color:var(--pt-cyan)}

/* 3. Site header (shared partial) ------------------------------------------- */
.pt-header{position:relative;z-index:50;border-bottom:1px solid var(--pt-line);background:var(--pt-bg)}
.pt-header-in{max-width:1240px;margin:0 auto;padding:10px 24px;display:flex;align-items:center;gap:28px;min-height:96px}
.pt-logo{display:block;flex:none;line-height:0}
.pt-logo img{width:120px;height:90px;object-fit:contain}
.pt-links{display:flex;flex-wrap:wrap;gap:4px 22px;flex:1;justify-content:flex-end;font:600 14px/1.4 var(--pt-font)}
.pt-links a,.pt-menu a{color:var(--pt-muted);text-decoration:none}
.pt-links a:hover,.pt-links a[aria-current=page],.pt-menu a[aria-current=page]{color:var(--pt-text)}
.pt-links a[aria-current=page]{box-shadow:inset 0 -2px 0 var(--pt-cyan)}
.pt-cta{display:flex;align-items:center;gap:16px;flex:none}
.pt-signin{font:600 14px var(--pt-font);color:var(--pt-text)!important;text-decoration:none}
.pt-menu{display:none;margin-left:auto}
.pt-menu summary{list-style:none;cursor:pointer;font:700 14px var(--pt-font);color:var(--pt-text);border:1px solid var(--pt-line-2);border-radius:var(--pt-r);padding:9px 14px}
.pt-menu summary::-webkit-details-marker{display:none}
.pt-menu nav{position:absolute;right:16px;left:16px;top:100%;background:var(--pt-card);border:1px solid var(--pt-line);border-radius:var(--pt-r-lg);padding:10px;display:grid;gap:2px;box-shadow:0 20px 40px rgba(0,0,0,.45)}
.pt-menu nav a{padding:12px 12px;border-radius:var(--pt-r);font:600 16px var(--pt-font)}
.pt-menu nav a:hover{background:var(--pt-card-2)}
.pt-menu nav .pt-button{margin-top:8px}
@media(max-width:1060px){.pt-links,.pt-cta{display:none}.pt-menu{display:block}.pt-header-in{min-height:76px}.pt-logo img{width:96px;height:72px}}

/* Compact header for signed-in tools (teacher, class, receipts) */
.pt-header.compact .pt-header-in{min-height:64px}
.pt-header.compact .pt-logo img{width:72px;height:54px}
.pt-header.compact .pt-back{margin-left:auto;font:600 14px var(--pt-font);color:var(--pt-muted)}

/* 4. Site footer (shared partial) ------------------------------------------- */
.pt-site-footer{margin-top:64px;border-top:1px solid var(--pt-line);background:var(--pt-surface);color:var(--pt-muted);font:14px/1.6 var(--pt-font)}
.pt-site-footer .pt-footer-in{max-width:1240px;margin:0 auto;padding:44px 24px 24px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.pt-site-footer img{width:96px;height:72px;object-fit:contain}
.pt-site-footer h2{font:700 12px/1.5 var(--pt-font)!important;letter-spacing:.14em;text-transform:uppercase!important;color:var(--pt-brass)!important;margin:4px 0 12px}
.pt-site-footer nav a{display:block;color:var(--pt-muted);text-decoration:none;padding:3px 0}
.pt-site-footer nav a:hover{color:var(--pt-text)}
.pt-site-footer .pt-fine{font-size:12px;color:var(--pt-subtle);max-width:420px}
.pt-site-footer .pt-footer-base{max-width:1240px;margin:0 auto;padding:16px 24px 28px;border-top:1px solid var(--pt-line);font-size:12px;color:var(--pt-subtle)}
@media(max-width:860px){.pt-site-footer .pt-footer-in{grid-template-columns:1fr 1fr}.pt-site-footer .pt-footer-brand{grid-column:1/-1}}
/* retired footers never show if a stray one survives */
.landing-footer{display:none!important}

/* 5. Buttons --------------------------------------------------------------- */
.pt-button,.btn-primary,.pt-home .pt-button,.pt-home .btn-primary,.pt-app .btn-primary,.action-btn.primary,.landing-cta,.btn-hero{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--pt-cyan)!important;color:var(--pt-on-cyan)!important;
  font:700 15px/1.3 var(--pt-font)!important;letter-spacing:0!important;text-transform:none!important;padding:13px 20px;min-height:46px;
  border:1px solid transparent!important;border-radius:var(--pt-r)!important;box-shadow:none!important;text-decoration:none!important;cursor:pointer;filter:none}
.pt-button:hover,.btn-primary:hover,.action-btn.primary:hover,.landing-cta:hover,.btn-hero:hover{background:var(--pt-cyan-2)!important;color:var(--pt-on-cyan)!important;transform:none}
.pt-button-sm{min-height:38px;padding:8px 14px;font-size:14px!important}
.pt-button.secondary,.btn-secondary,.action-btn:not(.primary){background:transparent!important;color:var(--pt-text)!important;border:1px solid var(--pt-line-2)!important;border-radius:var(--pt-r)!important;font-family:var(--pt-font)!important;box-shadow:none!important}
.pt-button.secondary:hover,.btn-secondary:hover,.action-btn:not(.primary):hover{border-color:var(--pt-cyan)!important;color:var(--pt-text)!important}
button:disabled,.pt-button[aria-disabled=true]{opacity:.55;cursor:not-allowed}
.text-link{color:var(--pt-cyan);font-weight:700;text-underline-offset:5px}

/* 6. Surfaces ---------------------------------------------------------------- */
.pt-card,.session-card,.training-card,.stat-card,.mode-card,.faq-item,.help-card,.price-card,.checkout-notice,.panel{
  background:var(--pt-card)!important;border:1px solid var(--pt-line)!important;border-radius:var(--pt-r-lg)!important;box-shadow:none!important;color:var(--pt-text)}
.training-card.featured,.pt-card.featured{background:var(--pt-card-2)!important;border-color:var(--pt-line-2)!important}
.session-card{border-top:3px solid var(--pt-cyan)!important}
.mode-card:hover,.training-card:hover,.pt-card.link:hover{border-color:var(--pt-cyan)!important;transform:translateY(-2px)}
.callout{background:var(--pt-surface);border-left:4px solid var(--pt-brass);border-radius:var(--pt-r);padding:12px 18px;margin:18px 0}
.rulebox{background:rgba(54,211,228,.07);border:1px solid rgba(54,211,228,.35);border-radius:var(--pt-r-lg);padding:14px 18px;margin:18px 0}
.pt-badge,.chip{display:inline-block;font:700 11px/1.4 var(--pt-font);letter-spacing:.08em;text-transform:uppercase;color:var(--pt-brass);border:1px solid rgba(221,177,77,.45);border-radius:999px;padding:3px 10px}
.pt-band,.training-section{background:var(--pt-surface)!important}

/* 7. Forms ------------------------------------------------------------------- */
input,select,textarea{font-family:var(--pt-font)}
.pt-home input,.pt-app input,input[type=text],input[type=tel],input[type=email],input[type=number],input[type=search],select,textarea{
  background:var(--pt-bg)!important;color:var(--pt-text)!important;border:1px solid var(--pt-line-2)!important;border-radius:var(--pt-r)!important}
input::placeholder,textarea::placeholder{color:var(--pt-subtle)}
input:focus,select:focus,textarea:focus{border-color:var(--pt-cyan)!important;outline:none}
label{font-family:var(--pt-font)}

/* 8. Tables + long-form prose ------------------------------------------------ */
table{border-collapse:collapse}
.post table,.pt-table{width:100%;font-size:15px;background:var(--pt-surface)}
.post th,.post td,.pt-table th,.pt-table td{border-bottom:1px solid var(--pt-line);padding:9px 10px;text-align:left;vertical-align:top}
.post th,.pt-table th{color:var(--pt-text);font-weight:700;background:var(--pt-card)}
.post p,.post li{color:var(--pt-text)}
.post .meta,.meta{color:var(--pt-subtle);font-size:13px}

/* 9. Practice questions (blog, lessons, class) ------------------------------- */
.pq-opts button,.opt{font-family:var(--pt-font)!important;background:var(--pt-surface)!important;border:1px solid var(--pt-line)!important;color:var(--pt-text)!important;border-radius:var(--pt-r-lg)!important}
.pq-opts button.ok,.opt.ok{border-color:var(--pt-ok)!important;background:rgba(62,207,142,.14)!important}
.pq-opts button.no,.opt.no{border-color:var(--pt-bad)!important;background:rgba(255,107,107,.12)!important}

/* 10. App shell (app.html) --------------------------------------------------- */
.pt-app .app-header{background:rgba(7,23,37,.96)!important;border-bottom:1px solid var(--pt-line)!important;box-shadow:none!important}
.pt-app .bottom-nav{background:rgba(7,23,37,.97)!important;border-top:1px solid var(--pt-line)!important}
.pt-app .nav-tab{font-family:var(--pt-font)!important;color:var(--pt-subtle)!important;text-transform:none!important;letter-spacing:0!important}
.pt-app .nav-tab.active{color:var(--pt-cyan)!important}
.pt-app .section-header{font:700 12px/1.5 var(--pt-font)!important;letter-spacing:.14em!important;color:var(--pt-brass)!important;text-transform:uppercase}
.pt-app .section-header svg{color:var(--pt-brass);fill:currentColor}
.pt-app .mode-icon{filter:none!important;color:var(--pt-cyan);line-height:0}
.pt-app .mode-icon svg{width:28px;height:28px}
.pt-app .mode-name,.pt-app .stat-value,.pt-app .user-name{font-family:var(--pt-font)!important;color:var(--pt-text)}
.pt-app .stat-value{font-weight:800;letter-spacing:-.02em}
.pt-app .stat-label,.pt-app .user-level{font-family:var(--pt-font)!important;color:var(--pt-subtle)!important;letter-spacing:.06em}
.pt-app .xp-bar{background:var(--pt-line)!important}.pt-app .xp-fill{background:var(--pt-brass)!important;box-shadow:none!important}
.pt-app .user-avatar{background:var(--pt-card-2)!important;border:1px solid var(--pt-brass)!important;color:var(--pt-brass);box-shadow:none!important}
.pt-app .answer-option{font-family:var(--pt-font)!important;background:var(--pt-card)!important;border:1px solid var(--pt-line)!important;box-shadow:none!important}
.pt-app .answer-option:hover{border-color:var(--pt-cyan)!important}
.pt-app .answer-option.correct{border-color:var(--pt-ok)!important;background:rgba(62,207,142,.14)!important}
.pt-app .answer-option.wrong{border-color:var(--pt-bad)!important;background:rgba(255,107,107,.12)!important}
.pt-app .bp-node .bp-icon{font:800 13px var(--pt-font);color:var(--pt-subtle)}
.pt-app .bp-node.unlocked .bp-icon{color:var(--pt-brass)}
.pt-app .question-text,.pt-app .mode-desc{font-family:var(--pt-font)!important}
.pt-sec{display:inline-block;font:800 13px/1 var(--pt-mono);color:var(--pt-cyan);border:1px solid rgba(54,211,228,.45);border-radius:var(--pt-r);padding:6px 8px}

/* 11. Motion ----------------------------------------------------------------- */
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
