/* Apple HIG theme — shared token + primitive layer for the entry/auth pages
   (signup, forgot, reset, join). Link AFTER wrenchroute.css so it wins on
   source order. Retunes the design tokens to Apple's system palette + San
   Francisco and restyles the shared .auth-card into an Apple sign-in screen.
   Both themes are defined at :root[data-theme] specificity so the swap beats
   wrenchroute's defaults reliably. Mirrors the inline layers in portal.html /
   app.html; keep the token values in sync if they change. */

:root[data-theme="dark"]{
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue",system-ui,sans-serif;
  --mono:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",system-ui,sans-serif;
  --bg:#000000; --panel:#1c1c1e; --panel-2:#2c2c2e; --panel-inset:#2c2c2e;
  --ink:#ffffff; --ink-2:rgba(235,235,245,.62); --muted:rgba(235,235,245,.34);
  --line:rgba(84,84,88,.55); --line-2:rgba(84,84,88,.32);
  --brand:rgba(28,28,30,.72); --brand-2:#2c2c2e; --brand-ink:#ffffff; --brand-ink-2:rgba(235,235,245,.62); --brand-line:rgba(84,84,88,.5);
  --amber:#ff9f0a; --amber-hi:#ffb340; --amber-soft:rgba(255,159,10,.16); --amber-ink:#1a1100;
  --chip:rgba(120,120,128,.28); --chip-ink:rgba(235,235,245,.62);
  --good:#30d158; --good-bg:rgba(48,209,88,.16);
  --warn:#ff9f0a; --warn-bg:rgba(255,159,10,.16);
  --crit:#ff453a; --crit-bg:rgba(255,69,58,.16);
  --info:#0a84ff; --info-bg:rgba(10,132,255,.18);
  --r:12px; --r-sm:8px;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 10px 30px -16px rgba(0,0,0,.7);
  --sheen:none; --weave:none;
}
:root[data-theme="light"]{
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue",system-ui,sans-serif;
  --mono:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",system-ui,sans-serif;
  --bg:#f2f2f7; --panel:#ffffff; --panel-2:#f2f2f7; --panel-inset:#f2f2f7;
  --ink:#1c1c1e; --ink-2:rgba(60,60,67,.62); --muted:rgba(60,60,67,.34);
  --line:rgba(60,60,67,.16); --line-2:rgba(60,60,67,.09);
  --brand:rgba(255,255,255,.78); --brand-2:#f2f2f7; --brand-ink:#1c1c1e; --brand-ink-2:rgba(60,60,67,.62); --brand-line:rgba(60,60,67,.14);
  --amber:#ff9500; --amber-hi:#e07f00; --amber-soft:rgba(255,149,0,.15); --amber-ink:#ffffff;
  --chip:rgba(120,120,128,.14); --chip-ink:rgba(60,60,67,.62);
  --good:#34c759; --good-bg:rgba(52,199,89,.16);
  --warn:#ff9500; --warn-bg:rgba(255,149,0,.17);
  --crit:#ff3b30; --crit-bg:rgba(255,59,48,.13);
  --info:#007aff; --info-bg:rgba(0,122,255,.13);
  --r:12px; --r-sm:8px;
  --shadow:0 1px 2px rgba(0,0,0,.05), 0 10px 28px -16px rgba(0,0,0,.22);
  --sheen:none; --weave:none;
}

body{font-size:15px; line-height:1.47; -webkit-font-smoothing:antialiased; letter-spacing:-.006em;}
body::before{display:none !important;}   /* kill the carbon weave texture */

/* header, if present → translucent vibrancy material */
header.hdr{background:var(--brand); -webkit-backdrop-filter:saturate(180%) blur(24px); backdrop-filter:saturate(180%) blur(24px);
  box-shadow:none; border-bottom:.5px solid var(--brand-line);}

/* buttons */
.btn{border-radius:11px; font-weight:600; letter-spacing:-.01em;}
.btn:active{transform:none; opacity:.85;}
.btn.primary{box-shadow:none; background:var(--amber); color:var(--amber-ink);}
.btn.primary:hover{background:var(--amber-hi);}
.btn.ghost{background:var(--chip); color:var(--ink); border-color:transparent;}
.btn.ghost:hover{background:var(--line-2); border-color:transparent;}

/* inputs — 16px font-size stops iOS zoom-on-focus */
.input,.select select,textarea.input{border-radius:12px; height:48px; font-size:16px; background:var(--panel-inset); border:.5px solid var(--line);}
textarea.input{height:auto;}
.input:focus,.select select:focus,textarea.input:focus{border-color:var(--amber); box-shadow:0 0 0 3.5px var(--amber-soft);}
.field label{font-family:var(--font); font-size:12px; font-weight:600; letter-spacing:.01em; text-transform:none; color:var(--ink-2);}

/* cards + chips */
.panel{border:.5px solid var(--line); border-radius:16px; box-shadow:var(--shadow);}
.pill,.badge{font-family:var(--font); text-transform:none; letter-spacing:0; border-radius:980px;}

/* auth headings (used by signup's 2-col layout + the centered cards) */
.auth-h{font-family:var(--font); font-weight:700; letter-spacing:-.02em;}
.auth-sub{font-family:var(--font); color:var(--ink-2);}
.pitch .brand .name{font-family:var(--font);}

/* fixed theme toggle on entry pages → clear the notch/safe area */
body > .icobtn{top:calc(env(safe-area-inset-top) + 14px) !important; right:calc(env(safe-area-inset-right) + 14px) !important; border-radius:10px;}
body > .icobtn:hover{background:var(--chip);}

/* ---- centered .auth-card → an Apple sign-in screen (forgot / reset / join) ---- */
.auth-plane{min-height:100dvh;}
.auth-card{max-width:400px;}
.auth-card .panel{padding:30px 24px 26px; border-radius:22px; border:.5px solid var(--line); box-shadow:var(--shadow);}
.auth-card .brand{flex-direction:column; text-align:center; gap:12px; margin-bottom:16px;}
.auth-card .brand .logo{width:56px; height:56px; border-radius:16px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(160deg,var(--amber-hi),var(--amber));
  box-shadow:0 12px 26px -8px rgba(255,159,10,.7), inset 0 1px 0 rgba(255,255,255,.35);}
.auth-card .brand .logo svg{width:30px; height:30px; stroke:var(--amber-ink); stroke-width:2;}
.auth-card .brand .name{font-size:16px !important; font-weight:600; letter-spacing:-.01em; color:var(--ink) !important; font-family:var(--font);}
.auth-card .auth-h{font-size:21px; text-align:center; margin:2px 0 5px;}
.auth-card .auth-sub{text-align:center; font-size:14px; margin:0 0 20px;}
.auth-card .btn.primary.block{height:52px; border-radius:14px; font-size:16px;}
.auth-card .hint{font-size:13px;}
