/* Mainstay — Born Between 2 Generals LLC */

:root {
  --navy:#0a3161; --navy-2:#12417c; --navy-3:#1e4d80; --navy-ink:#06203f;
  --gold:#c5a046; --gold-lt:#e3c97e; --gold-dk:#8f6f22;
  --red:#b31942; --red-dk:#8a1233;
  --green:#1f6b45;
  --paper:#f7f5ef; --card:#ffffff; --card-2:#fbfaf6;
  --ink:#1b2430; --ink-2:#4a5769; --ink-3:#77839a;
  --line:#e2ddd0; --line-2:#eeeae0;
  --shadow:0 1px 2px rgba(10,49,97,.06), 0 8px 24px -12px rgba(10,49,97,.18);
  --shadow-lg:0 24px 60px -20px rgba(6,32,63,.42);
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, "Helvetica Neue", Arial, sans-serif;
  --r:14px;
}
@media (prefers-color-scheme: dark) {
  :root {
    --paper:#0d1420; --card:#141d2b; --card-2:#101825;
    --ink:#eef2f8; --ink-2:#b3bfd0; --ink-3:#8593a8;
    --line:#26334a; --line-2:#1d2839;
    --navy:#0a3161; --navy-2:#16457f;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 8px 24px -12px rgba(0,0,0,.6);
  }
}
html[data-theme="dark"] {
  --paper:#0d1420; --card:#141d2b; --card-2:#101825;
  --ink:#eef2f8; --ink-2:#b3bfd0; --ink-3:#8593a8;
  --line:#26334a; --line-2:#1d2839;
}
html[data-theme="light"] {
  --paper:#f7f5ef; --card:#ffffff; --card-2:#fbfaf6;
  --ink:#1b2430; --ink-2:#4a5769; --ink-3:#77839a;
  --line:#e2ddd0; --line-2:#eeeae0;
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body {
  font-family:var(--sans); background:var(--paper); color:var(--ink);
  line-height:1.55; -webkit-font-smoothing:antialiased; overflow-x:hidden;
  padding-bottom:env(safe-area-inset-bottom);
}
body::before {
  content:""; position:fixed; inset:0 0 auto 0; height:4px; z-index:999;
  background:linear-gradient(90deg,var(--navy) 0 40%,#f7f5f0 40% 60%,var(--red) 60% 100%);
}
img,svg { max-width:100%; }
a { color:var(--navy-3); }
@media (prefers-color-scheme: dark) { a { color:var(--gold-lt); } }
button,input,select,textarea { font-family:inherit; font-size:1rem; color:inherit; }
:focus-visible { outline:2.5px solid var(--gold); outline-offset:2px; border-radius:4px; }
::selection { background:var(--gold); color:var(--navy); }

.wrap { max-width:820px; margin:0 auto; padding:0 16px 130px; }
.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; }

/* ------------------------------------------------------------------ HEADER */
header.site {
  position:relative; color:#fff; padding:26px 18px 20px; text-align:center; overflow:hidden;
  background:
    radial-gradient(120% 140% at 20% 0%, rgba(255,255,255,.16), rgba(255,255,255,0) 46%),
    linear-gradient(165deg,var(--navy-ink),var(--navy) 45%,var(--navy-3));
  border-bottom:3px solid var(--gold);
}
header.site::after {
  content:""; position:absolute; inset:10px 10px auto 10px; height:1px;
  background:linear-gradient(90deg,transparent,rgba(197,160,70,.55) 12%,rgba(197,160,70,.55) 88%,transparent);
}
.corner { position:absolute; width:26px; height:26px; border:1.5px solid rgba(197,160,70,.6); }
.corner.tl { top:10px; left:10px; border-right:0; border-bottom:0; }
.corner.tr { top:10px; right:10px; border-left:0; border-bottom:0; }
.badge {
  display:inline-block; font-size:.64rem; text-transform:uppercase; letter-spacing:.18em;
  background:rgba(255,255,255,.13); border:1px solid rgba(197,160,70,.45);
  padding:5px 14px; border-radius:20px; margin-bottom:10px; font-weight:600;
}
.badge::before { content:"\2605"; color:var(--gold-lt); margin-right:7px; }
header.site h1 { font-family:var(--serif); font-size:2rem; font-weight:600; letter-spacing:.02em; line-height:1.1; }
header.site .tag { font-size:.9rem; opacity:.9; margin-top:5px; }
.hero-art { width:104px; margin:12px auto 0; }
.hero-art svg { display:block; width:100%; height:auto; }
.hdr-tools { position:absolute; top:14px; right:14px; display:flex; gap:6px; }
.icon-btn {
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.2); color:#fff;
  width:34px; height:34px; border-radius:10px; display:grid; place-items:center; cursor:pointer;
}
.icon-btn:hover { background:rgba(255,255,255,.22); }
.icon-btn svg { width:17px; height:17px; }

/* --------------------------------------------------------------------- NAV */
nav.tabs {
  display:flex; gap:6px; overflow-x:auto; padding:12px 0 6px; position:sticky; top:0; z-index:40;
  background:linear-gradient(var(--paper) 72%, transparent); scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
nav.tabs::-webkit-scrollbar { display:none; }
nav.tabs button {
  flex:0 0 auto; border:1px solid var(--line); background:var(--card); color:var(--ink-2);
  padding:9px 15px; border-radius:22px; font-size:.83rem; font-weight:650; cursor:pointer; white-space:nowrap;
  display:flex; align-items:center; gap:7px; transition:background .15s,color .15s;
}
nav.tabs button svg { width:15px; height:15px; opacity:.75; }
nav.tabs button:hover { border-color:var(--gold); }
nav.tabs button.active { background:var(--navy); color:#fff; border-color:var(--navy); box-shadow:0 2px 10px -3px var(--navy); }
nav.tabs button.active svg { opacity:1; }

.panel { display:none; }
.panel.active { display:block; animation:fade .25s ease-out; }
@keyframes fade { from{opacity:0;transform:translateY(7px)} to{opacity:1;transform:none} }

/* ------------------------------------------------------------------- CARDS */
.card { background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:18px; margin-top:14px; box-shadow:var(--shadow); }
.card.flush { padding:0; overflow:hidden; }
.card h2 { font-family:var(--serif); font-size:1.22rem; font-weight:600; letter-spacing:.01em; }
.card h3 { font-size:.95rem; margin:16px 0 6px; color:var(--navy-3); }
@media (prefers-color-scheme: dark){ .card h3 { color:var(--gold-lt); } }
.card p { font-size:.92rem; color:var(--ink-2); margin-top:6px; }
.card p + p { margin-top:10px; }
.eyebrow { font-size:.65rem; text-transform:uppercase; letter-spacing:.16em; color:var(--navy); font-weight:800; margin-bottom:7px; }
@media (prefers-color-scheme: dark){ .eyebrow { color:var(--gold-lt); } }
.eyebrow::before { content:"\2605"; color:var(--gold); margin-right:6px; }
.rule { height:1px; background:var(--line); margin:16px 0; border:0; }
.muted { color:var(--ink-3); font-size:.83rem; }

/* ------------------------------------------------------------------ FIELDS */
label.fl { display:block; font-size:.79rem; font-weight:700; margin:14px 0 5px; color:var(--ink-2); letter-spacing:.01em; }
label.fl .req { color:var(--gold-dk); font-weight:800; }
input[type=text],input[type=tel],input[type=date],input[type=number],input[type=search],select,textarea {
  width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:10px;
  font-size:.94rem; background:var(--card-2); color:var(--ink);
}
textarea { resize:vertical; min-height:64px; line-height:1.5; }
input::placeholder,textarea::placeholder { color:var(--ink-3); opacity:.75; }
.field-row { display:flex; gap:8px; }
.field-row > * { flex:1; }

.btn {
  background:var(--navy); color:#fff; border:1px solid var(--navy); padding:12px 18px; border-radius:10px;
  font-size:.92rem; font-weight:700; cursor:pointer; margin-top:14px; width:100%;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
}
.btn:hover { background:var(--navy-2); }
.btn:active { transform:translateY(1px); }
.btn svg { width:16px; height:16px; }
.btn.gold { background:var(--gold); border-color:var(--gold); color:var(--navy); }
.btn.gold:hover { background:var(--gold-lt); }
.btn.red { background:var(--red); border-color:var(--red); }
.btn.red:hover { background:var(--red-dk); }
.btn.ghost { background:transparent; border-color:var(--line); color:var(--ink-2); }
.btn.ghost:hover { border-color:var(--navy); color:var(--navy); background:transparent; }
.btn.sm { width:auto; padding:8px 14px; font-size:.83rem; margin-top:0; }
.btn-row { display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; }
.btn-row .btn { margin-top:0; flex:1 1 160px; }

.call-btn {
  display:flex; align-items:center; justify-content:center; gap:10px;
  background:var(--red); color:#fff; text-decoration:none; text-align:center;
  padding:17px; border-radius:12px; font-weight:800; font-size:1.12rem; letter-spacing:.02em;
  box-shadow:0 4px 0 var(--red-dk); margin-top:4px;
}
.call-btn:active { transform:translateY(3px); box-shadow:0 1px 0 var(--red-dk); }
.call-btn svg { width:22px; height:22px; }

/* ---------------------------------------------------------------- READINESS */
.ready-wrap { display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.ring { position:relative; width:96px; height:96px; flex:0 0 auto; }
.ring svg { transform:rotate(-90deg); }
.ring .val { position:absolute; inset:0; display:grid; place-items:center; font-family:var(--serif); font-size:1.5rem; font-weight:700; color:var(--navy); }
@media (prefers-color-scheme: dark){ .ring .val { color:var(--gold-lt); } }
.ready-txt { flex:1 1 200px; }
.ready-txt h2 { margin-bottom:2px; }
.checklist { margin-top:12px; display:grid; gap:7px; }
.chk { display:flex; align-items:center; gap:9px; font-size:.86rem; color:var(--ink-2); }
.chk .dot { width:17px; height:17px; border-radius:50%; flex:0 0 auto; display:grid; place-items:center; border:1.5px solid var(--line); font-size:.6rem; color:#fff; }
.chk.done .dot { background:var(--green); border-color:var(--green); }
.chk.done { color:var(--ink-3); }
.chk button { background:none; border:0; color:var(--navy-3); font-weight:700; cursor:pointer; font-size:.82rem; text-decoration:underline; padding:0; }
@media (prefers-color-scheme: dark){ .chk button { color:var(--gold-lt); } }

/* ------------------------------------------------------------------ ALERTS */
.alert-band { border-radius:12px; padding:13px 15px; margin-top:14px; font-size:.87rem; border:1px solid; display:flex; gap:11px; align-items:flex-start; }
.alert-band svg { width:18px; height:18px; flex:0 0 auto; margin-top:1px; }
.alert-band.warn { background:#fdf3e2; border-color:#e8c98a; color:#6b4c0d; }
.alert-band.danger { background:#fdeaef; border-color:#f0b3c3; color:#7d1030; }
.alert-band.info { background:#eef4fb; border-color:#c3d8f0; color:#123d70; }
.alert-band.ok { background:#eaf5ef; border-color:#b4dcc6; color:#14523a; }
@media (prefers-color-scheme: dark) {
  .alert-band.warn { background:#2e2411; border-color:#6b551f; color:#f0d79a; }
  .alert-band.danger { background:#331420; border-color:#7d2846; color:#f5aec2; }
  .alert-band.info { background:#0f2540; border-color:#25507f; color:#a9cbef; }
  .alert-band.ok { background:#0f2a20; border-color:#255741; color:#a3dcbf; }
}
.alert-band b { display:block; }

/* -------------------------------------------------------------- PROCEDURES */
.searchbar { position:relative; margin-top:14px; }
.searchbar input { padding-left:38px; }
.searchbar svg { position:absolute; left:12px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:var(--ink-3); }
.chips { display:flex; gap:6px; overflow-x:auto; padding:12px 0 2px; scrollbar-width:none; }
.chips::-webkit-scrollbar { display:none; }
.chip { flex:0 0 auto; border:1px solid var(--line); background:var(--card); color:var(--ink-2); padding:7px 13px; border-radius:18px; font-size:.78rem; font-weight:650; cursor:pointer; white-space:nowrap; }
.chip.on { background:var(--navy); color:#fff; border-color:var(--navy); }

.proc { border:1px solid var(--line); border-radius:12px; margin-top:10px; overflow:hidden; background:var(--card); box-shadow:var(--shadow); }
.proc summary {
  padding:14px 15px; cursor:pointer; font-weight:700; font-size:.97rem; list-style:none;
  display:flex; justify-content:space-between; align-items:center; gap:10px; background:var(--card);
}
.proc summary::-webkit-details-marker { display:none; }
.proc summary:hover { background:var(--card-2); }
.proc[open] summary { border-bottom:1px solid var(--line-2); background:var(--card-2); }
.proc .ttl { display:flex; align-items:center; gap:10px; min-width:0; }
.proc .ttl span { overflow:hidden; text-overflow:ellipsis; }
.u-dot { width:9px; height:9px; border-radius:50%; flex:0 0 auto; }
.u-call { background:var(--red); box-shadow:0 0 0 3px rgba(179,25,66,.18); }
.u-high { background:var(--gold); box-shadow:0 0 0 3px rgba(197,160,70,.18); }
.u-plan { background:var(--navy-3); box-shadow:0 0 0 3px rgba(30,77,128,.16); }
.proc .arrow { color:var(--ink-3); transition:transform .18s; flex:0 0 auto; }
.proc[open] .arrow { transform:rotate(90deg); }
.proc .content { padding:4px 15px 16px; }
.proc .summ { font-size:.88rem; color:var(--ink-2); font-style:italic; padding:11px 0 3px; }

.step { display:flex; gap:12px; padding:11px 0; border-bottom:1px solid var(--line-2); align-items:flex-start; }
.step:last-child { border-bottom:none; }
.step .n { flex:0 0 25px; height:25px; background:var(--navy); color:#fff; border-radius:50%; display:grid; place-items:center; font-weight:700; font-size:.78rem; }
.step .stx { font-size:.9rem; }
.step .role, .inc-step .role { display:block; font-size:.66rem; text-transform:uppercase; letter-spacing:.08em; font-weight:800; color:var(--gold-dk); margin-top:4px; }
@media (prefers-color-scheme: dark){ .step .role, .inc-step .role { color:var(--gold-lt); } }
.sub-h { font-size:.7rem; text-transform:uppercase; letter-spacing:.13em; font-weight:800; color:var(--ink-3); margin:16px 0 4px; }
.bullets { margin:0; padding-left:19px; }
.bullets li { font-size:.87rem; color:var(--ink-2); padding:4px 0; }
.note-box { background:var(--card-2); border-left:3px solid var(--gold); border-radius:0 8px 8px 0; padding:10px 13px; margin-top:14px; font-size:.85rem; color:var(--ink-2); }
.disclaimer { background:var(--card-2); border:1px dashed var(--line); border-radius:10px; padding:12px 14px; font-size:.79rem; color:var(--ink-2); margin-top:16px; }

/* ------------------------------------------------------------------- LISTS */
.rowitem { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:11px 0; border-bottom:1px solid var(--line-2); font-size:.9rem; }
.rowitem:last-child { border-bottom:none; }
.rowitem .l { min-width:0; }
.rowitem .l b { display:block; }
.rowitem .l small { color:var(--ink-3); font-size:.78rem; }
.rowitem .r { display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.tel { color:var(--navy); font-weight:750; text-decoration:none; white-space:nowrap; }
@media (prefers-color-scheme: dark){ .tel { color:var(--gold-lt); } }
.del { background:none; border:0; color:var(--ink-3); cursor:pointer; font-size:1.2rem; line-height:1; padding:2px 4px; }
.del:hover { color:var(--red); }
.empty { text-align:center; color:var(--ink-3); font-size:.85rem; padding:20px 8px; }
.group-h { font-size:.7rem; text-transform:uppercase; letter-spacing:.13em; font-weight:800; color:var(--gold-dk); margin:18px 0 2px; }
@media (prefers-color-scheme: dark){ .group-h { color:var(--gold-lt); } }
.pill { display:inline-block; font-size:.68rem; font-weight:800; padding:3px 9px; border-radius:12px; letter-spacing:.04em; }
.pill.ok { background:#e6f3ec; color:var(--green); }
.pill.warn { background:#fbf0d8; color:#7a5c10; }
.pill.bad { background:#fbe2e9; color:var(--red-dk); }
.pill.neutral { background:var(--card-2); color:var(--ink-3); border:1px solid var(--line); }
@media (prefers-color-scheme: dark) {
  .pill.ok { background:#12301f; color:#87d3a8; }
  .pill.warn { background:#33280f; color:#e8c37a; }
  .pill.bad { background:#3a1524; color:#f0a3ba; }
}
.suggest { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.suggest button { border:1px dashed var(--line); background:var(--card-2); color:var(--ink-2); border-radius:16px; padding:6px 11px; font-size:.76rem; cursor:pointer; }
.suggest button:hover { border-color:var(--gold); border-style:solid; color:var(--navy); }

/* -------------------------------------------------------------- INCIDENT */
.fab {
  position:fixed; right:16px; bottom:calc(16px + env(safe-area-inset-bottom)); z-index:60;
  background:var(--red); color:#fff; border:0; border-radius:30px; padding:14px 20px;
  font-weight:800; font-size:.9rem; box-shadow:0 8px 24px -6px rgba(179,25,66,.6); cursor:pointer;
  display:flex; align-items:center; gap:8px;
}
.fab:active { transform:translateY(2px); }
.fab svg { width:17px; height:17px; }
.fab.live { animation:pulse 2s infinite; }
@keyframes pulse { 0%,100%{box-shadow:0 8px 24px -6px rgba(179,25,66,.6)} 50%{box-shadow:0 8px 30px 0 rgba(179,25,66,.85)} }

.sheet { position:fixed; inset:0; z-index:120; background:rgba(6,20,38,.72); backdrop-filter:blur(5px); display:flex; align-items:flex-end; justify-content:center; }
.sheet.hidden { display:none; }
.sheet-card {
  background:var(--paper); width:100%; max-width:640px; max-height:94vh; overflow-y:auto;
  border-radius:20px 20px 0 0; box-shadow:var(--shadow-lg); padding:0 0 30px;
  animation:rise .28s cubic-bezier(.2,.8,.3,1);
}
@keyframes rise { from{transform:translateY(30px);opacity:0} to{transform:none;opacity:1} }
@media (min-width:700px) { .sheet { align-items:center; } .sheet-card { border-radius:20px; max-height:88vh; } }
.sheet-head {
  position:sticky; top:0; background:var(--navy); color:#fff; padding:16px 18px; z-index:2;
  display:flex; justify-content:space-between; align-items:center; gap:12px; border-bottom:2px solid var(--gold);
}
.sheet-head h2 { font-family:var(--serif); font-size:1.12rem; }
.sheet-head .sub { font-size:.76rem; opacity:.85; }
.sheet-body { padding:0 18px; }
.closex { background:rgba(255,255,255,.14); border:0; color:#fff; width:32px; height:32px; border-radius:9px; font-size:1.1rem; cursor:pointer; flex:0 0 auto; }

.timer { font-family:var(--serif); font-size:1.9rem; font-weight:700; letter-spacing:.03em; }
.inc-step { display:flex; gap:11px; padding:12px 0; border-bottom:1px solid var(--line-2); align-items:flex-start; cursor:pointer; }
.inc-step:last-child { border-bottom:none; }
.box { width:24px; height:24px; border-radius:7px; border:2px solid var(--line); flex:0 0 auto; display:grid; place-items:center; background:var(--card); }
.inc-step.done .box { background:var(--green); border-color:var(--green); }
.inc-step.done .box svg { display:block; }
.box svg { width:13px; height:13px; color:#fff; display:none; }
.inc-step.done .t { text-decoration:line-through; color:var(--ink-3); }
.inc-step .t { font-size:.9rem; }
.inc-step .stamp { font-size:.7rem; color:var(--green); font-weight:800; letter-spacing:.04em; }
.log-line { display:flex; gap:10px; padding:8px 0; border-bottom:1px solid var(--line-2); font-size:.85rem; }
.log-line time { flex:0 0 62px; color:var(--ink-3); font-variant-numeric:tabular-nums; font-weight:700; font-size:.78rem; }
.quick { display:flex; gap:6px; flex-wrap:wrap; margin-top:10px; }
.quick button { border:1px solid var(--line); background:var(--card); border-radius:16px; padding:6px 12px; font-size:.78rem; cursor:pointer; font-weight:650; color:var(--ink-2); }
.quick button:hover { border-color:var(--navy); color:var(--navy); }
.roll { display:flex; justify-content:space-between; align-items:center; padding:9px 0; border-bottom:1px solid var(--line-2); font-size:.88rem; gap:10px; }
.roll:last-child { border-bottom:none; }
.seg { display:flex; border:1px solid var(--line); border-radius:9px; overflow:hidden; flex:0 0 auto; }
.seg button { border:0; background:var(--card); padding:6px 10px; font-size:.74rem; font-weight:700; cursor:pointer; color:var(--ink-3); border-right:1px solid var(--line); }
.seg button:last-child { border-right:0; }
.seg button.on { color:#fff; }
.seg button.on[data-v="here"] { background:var(--green); }
.seg button.on[data-v="out"] { background:var(--gold); color:var(--navy); }
.seg button.on[data-v="missing"] { background:var(--red); }

/* ---------------------------------------------------------------- ONBOARD */
.onboard { position:fixed; inset:0; z-index:200; background:rgba(6,20,38,.72); backdrop-filter:blur(6px); display:grid; place-items:center; padding:20px; }
.onboard.hidden { display:none; }
.ob-card { background:var(--card); border-radius:20px; max-width:400px; width:100%; padding:32px 26px 22px; text-align:center; box-shadow:var(--shadow-lg); border-top:4px solid var(--gold); }
.ob-slide { display:none; } .ob-slide.active { display:block; }
.ob-icon { width:82px; height:82px; margin:0 auto 18px; border-radius:22px; display:grid; place-items:center;
  background:linear-gradient(160deg,var(--navy-2),var(--navy-3)); border:1.5px solid var(--gold); overflow:hidden; }
.ob-icon svg { width:100%; height:auto; display:block; }
.ob-slide h2 { font-family:var(--serif); font-size:1.3rem; margin-bottom:8px; }
.ob-slide p { font-size:.92rem; color:var(--ink-2); }
.ob-dots { display:flex; gap:7px; justify-content:center; margin:24px 0 18px; }
.ob-dots span { width:8px; height:8px; border-radius:50%; background:var(--line); transition:all .2s; }
.ob-dots span.on { background:var(--navy); width:24px; border-radius:4px; }
.ob-actions { display:flex; justify-content:space-between; align-items:center; }
.ob-skip { background:none; border:0; color:var(--ink-3); font-size:.88rem; cursor:pointer; }

/* ----------------------------------------------------------------- FOOTER */
footer.site { border-top:1px solid var(--line); background:var(--card-2); padding:26px 18px 34px; text-align:center; margin-top:20px; }
footer.site .mark { width:52px; margin:0 auto 12px; }
footer.site p { font-size:.78rem; color:var(--ink-3); margin-top:5px; }
footer.site a { color:var(--ink-2); }
footer.site .gold { color:var(--gold-dk); font-weight:700; letter-spacing:.06em; text-transform:uppercase; font-size:.68rem; }

/* toast */
.toast { position:fixed; left:50%; bottom:86px; transform:translateX(-50%) translateY(20px); z-index:300;
  background:var(--navy); color:#fff; padding:11px 18px; border-radius:24px; font-size:.85rem; font-weight:650;
  box-shadow:var(--shadow-lg); opacity:0; pointer-events:none; transition:.24s; border:1px solid var(--gold); }
.toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

/* ------------------------------------------------------------------ PRINT */
#print-sheet { display:none; }
@media print {
  body { background:#fff; color:#000; }
  body::before, header.site, nav.tabs, .panel, .fab, footer.site, .onboard, .sheet, .toast { display:none !important; }
  #print-sheet { display:block !important; }
  @page { margin:1.5cm; }
}
#print-sheet { font-family:var(--serif); color:#000; }
#print-sheet .pcover { text-align:center; padding:56px 0 26px; border-bottom:3px double #0a3161; margin-bottom:22px; page-break-after:always; }
#print-sheet .pcover .em { width:120px; margin:0 auto 18px; }
#print-sheet .pcover h1 { font-size:30pt; letter-spacing:.02em; line-height:1.1; }
#print-sheet .pcover .sub { font-size:13pt; letter-spacing:.22em; text-transform:uppercase; margin-top:12px; color:#0a3161; }
#print-sheet .pcover .meta { font-size:11pt; margin-top:20px; line-height:1.7; }
#print-sheet .pcover .foot { font-size:9pt; margin-top:34px; color:#555; }
#print-sheet section { page-break-inside:avoid; margin-bottom:22px; }
#print-sheet h2 { font-size:15pt; border-bottom:2px solid #0a3161; padding-bottom:5px; margin-bottom:10px; color:#0a3161; }
#print-sheet h3 { font-size:11.5pt; margin:12px 0 4px; }
#print-sheet .prow { font-size:10.5pt; padding:4px 0; border-bottom:1px solid #ddd; display:flex; justify-content:space-between; gap:14px; }
#print-sheet .pstep { font-size:10.5pt; padding:3px 0 3px 20px; text-indent:-20px; }
#print-sheet .pnote { font-size:9.5pt; color:#444; font-style:italic; padding:5px 0; }
#print-sheet .plabel { font-size:8pt; letter-spacing:.14em; text-transform:uppercase; color:#8f6f22; font-weight:700; }
#print-sheet .pfoot { font-size:8.5pt; color:#555; border-top:1px solid #999; padding-top:8px; margin-top:16px; }
#print-sheet .newpage { page-break-before:always; }
#print-sheet .cards { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
#print-sheet .wcard { border:1.5px solid #0a3161; border-radius:6px; padding:12px; page-break-inside:avoid; }
#print-sheet .wcard h4 { font-size:11pt; border-bottom:1px solid #c5a046; padding-bottom:4px; margin-bottom:6px; }
#print-sheet .wcard div { font-size:8.5pt; padding:1.5px 0; }
#print-sheet .poster { text-align:center; padding:20px 0; }
#print-sheet .poster h1 { font-size:40pt; }
#print-sheet .poster .big { font-size:18pt; margin:14px 0; }
#print-sheet .poster img { width:210px; margin:20px auto; display:block; }
#print-sheet .blank { border-bottom:1px solid #999; display:inline-block; min-width:150px; }

/* ===========================================================================
   >>> édition layer >>>
   The same finishing pass the Community Toolkit wears, so the two read as one
   house: engraved rules, laid paper, oldstyle numerals, restrained motion.
   Appended last on purpose — deleting this block returns the plainer look.
   =========================================================================== */

:root {
  --paper:#f6f3e9; --card:#fffdf8; --card-2:#faf7ee;
  --line:#e0d9c7; --line-2:#ece6d8;
  --hair:rgba(197,160,70,.34); --hair-soft:rgba(197,160,70,.16);
  --shadow:0 1px 1px rgba(20,32,52,.04), 0 2px 4px rgba(20,32,52,.04), 0 10px 26px -14px rgba(10,49,97,.24);
  --shadow-lg:0 2px 6px rgba(6,32,63,.14), 0 30px 70px -26px rgba(6,32,63,.5);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23g)' opacity='0.5'/%3E%3C/svg%3E");
}
@media (prefers-color-scheme: dark) {
  :root { --paper:#0b111c; --card:#141d2c; --card-2:#101827; --line:#26324a; --line-2:#1c2637;
          --hair:rgba(197,160,70,.30); --hair-soft:rgba(197,160,70,.13); }
}
html[data-theme="dark"] { --paper:#0b111c; --card:#141d2c; --card-2:#101827; --line:#26324a; --line-2:#1c2637;
                          --hair:rgba(197,160,70,.30); --hair-soft:rgba(197,160,70,.13); }
html[data-theme="light"] { --paper:#f6f3e9; --card:#fffdf8; --card-2:#faf7ee; --line:#e0d9c7; --line-2:#ece6d8; }

body { text-rendering:optimizeLegibility; font-feature-settings:"kern" 1,"liga" 1; }
body::after {
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:var(--grain); background-size:160px 160px; opacity:.028; mix-blend-mode:multiply;
}
@media (prefers-color-scheme: dark) { body::after { opacity:.05; mix-blend-mode:screen; } }
html[data-theme="dark"] body::after { opacity:.05; mix-blend-mode:screen; }
body > * { position:relative; z-index:1; }

h1, h2, .card h2, .sheet-head h2, .ob-slide h2 {
  font-family:var(--serif); font-weight:600; letter-spacing:-.006em; text-wrap:balance;
  font-variant-numeric:oldstyle-nums;
}
header.site h1 { letter-spacing:-.016em; }
p, .card p, li, .stx, .muted { font-variant-numeric:oldstyle-nums proportional-nums; }
input, select, textarea, .timer, .ring .val, time, .log-line time { font-variant-numeric:tabular-nums; }

.eyebrow { display:flex; align-items:center; gap:9px; font-size:.63rem; letter-spacing:.24em; font-weight:700; }
.eyebrow::before { content:"\25C6"; font-size:.5rem; color:var(--gold); margin:0; opacity:.9; }
.eyebrow::after { content:""; flex:1 1 auto; height:1px; min-width:14px;
  background:linear-gradient(90deg,var(--hair),transparent); }
.badge { letter-spacing:.24em; font-size:.62rem; padding:6px 16px;
  background:rgba(255,255,255,.08); border:1px solid rgba(197,160,70,.5);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14); }
.badge::before { content:"\25C6"; font-size:.5rem; margin-right:9px; }
.sub-h, .group-h { letter-spacing:.2em; }

header.site {
  background:
    radial-gradient(120% 150% at 22% -10%, rgba(255,255,255,.17), rgba(255,255,255,0) 52%),
    repeating-radial-gradient(circle at 50% 135%, rgba(197,160,70,.075) 0 1px, rgba(197,160,70,0) 1px 15px),
    repeating-linear-gradient(48deg, rgba(255,255,255,.028) 0 1px, rgba(255,255,255,0) 1px 9px),
    radial-gradient(140% 110% at 50% 55%, rgba(255,255,255,0) 42%, rgba(3,16,33,.42) 100%),
    linear-gradient(168deg,#05192f,#0a3161 46%,#1d4b7e);
  border-bottom:none;
  box-shadow:inset 0 -3px 0 var(--gold), inset 0 -6px 0 rgba(255,255,255,.5), inset 0 -7px 0 var(--gold);
}
header.site::after { inset:12px 12px auto 12px;
  background:linear-gradient(90deg,transparent,var(--hair) 10%,var(--hair) 90%,transparent); }
.corner { border-color:rgba(197,160,70,.72); width:34px; height:34px; }
.hero-art { position:relative; width:132px; height:132px; display:grid; place-items:center; margin:14px auto 0; }
.hero-art svg { width:88px; }
.hero-art::before, .hero-art::after { content:""; position:absolute; border-radius:50%; pointer-events:none; }
.hero-art::before { inset:0; border:1px solid rgba(197,160,70,.55); }
.hero-art::after { inset:7px; border:1px solid rgba(197,160,70,.28); }

.card, .proc, .sheet-card, .ob-card {
  border-radius:4px; border:1px solid var(--line);
  box-shadow:var(--shadow), inset 0 1px 0 rgba(255,255,255,.7);
}
@media (prefers-color-scheme: dark) {
  .card, .proc, .sheet-card, .ob-card { box-shadow:var(--shadow), inset 0 1px 0 rgba(255,255,255,.05); }
}
.card { position:relative; }
.card::before { content:""; position:absolute; inset:0 0 auto 0; height:1px;
  background:linear-gradient(90deg,transparent,var(--hair-soft) 20%,var(--hair-soft) 80%,transparent); }
.ob-card { border-radius:6px; border-top:3px solid var(--gold); }
.ob-icon { border-radius:4px; }
.sheet-card { border-radius:6px 6px 0 0; }
@media (min-width:700px) { .sheet-card { border-radius:6px; } }

.btn, .call-btn, .fab, .chip, .quick button, .seg, .icon-btn { border-radius:3px; letter-spacing:.02em; }
.btn { background-image:linear-gradient(180deg,var(--navy-3),var(--navy)); border:1px solid var(--navy-ink);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 1px 2px rgba(6,32,63,.28); }
.btn:hover { background-image:linear-gradient(180deg,#26578c,var(--navy-2)); }
.btn.gold { background-image:linear-gradient(180deg,var(--gold-lt),var(--gold)); border:1px solid #a5822c;
  color:var(--navy); box-shadow:inset 0 1px 0 rgba(255,255,255,.55), 0 1px 2px rgba(6,32,63,.24); }
.btn.gold:hover { background-image:linear-gradient(180deg,#f0dca4,var(--gold-lt)); }
.btn.ghost { background-image:none; background:transparent; box-shadow:none; border:1px solid var(--line); }
.btn.ghost:hover { border-color:var(--gold); background:var(--card-2); }
.btn.red, .call-btn, .fab { background-image:linear-gradient(180deg,#c8214f,var(--red)); border:1px solid #7d1030; }
.call-btn { box-shadow:inset 0 1px 0 rgba(255,255,255,.2), 0 3px 0 var(--red-dk); letter-spacing:.03em; }
.fab { border-radius:3px; box-shadow:inset 0 1px 0 rgba(255,255,255,.2), 0 8px 24px -6px rgba(179,25,66,.6); }

nav.tabs button { border-radius:2px; letter-spacing:.02em; }
nav.tabs button.active { background-image:linear-gradient(180deg,var(--navy-3),var(--navy));
  border-color:var(--navy-ink); box-shadow:inset 0 1px 0 rgba(255,255,255,.16), 0 2px 8px -4px var(--navy); }
input[type=text],input[type=tel],input[type=date],input[type=number],input[type=search],select,textarea {
  border-radius:2px; box-shadow:inset 0 1px 2px rgba(20,32,52,.05); }
input:focus, textarea:focus, select:focus { border-color:var(--gold); }
.step .n, .ct-steps .s b { background-image:linear-gradient(180deg,var(--navy-3),var(--navy));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2), 0 0 0 1px var(--hair-soft); font-variant-numeric:lining-nums; }
.pill { border-radius:2px; letter-spacing:.06em; }
.box { border-radius:2px; }
.alert-band { border-radius:3px; }
.searchbar input { border-radius:2px; }

footer.site { position:relative; }
footer.site::before { content:""; position:absolute; left:0; right:0; top:3px; height:1px;
  background:linear-gradient(90deg,transparent,var(--hair),transparent); }

::selection { background:var(--gold); color:var(--navy-ink); }
:focus-visible { outline:2px solid var(--gold); outline-offset:3px; border-radius:2px; }
.rule { border:0; height:1px; background:linear-gradient(90deg,transparent,var(--line),transparent); }

@media (prefers-reduced-motion: no-preference) {
  .card { transition:box-shadow .28s, border-color .28s; }
  .proc summary:hover { background:var(--card-2); }
}
@media print { body::after { display:none !important; } }

/* Same defence as the toolkit: bare <input> with no type attribute. */
input:not([type]), input[type=text], input[type=tel], input[type=date], input[type=number],
input[type=search], input[type=email], input[type=url], input[type=time], input[type=password],
select, textarea {
  background:var(--card-2); color:var(--ink); border:1px solid var(--line);
  border-radius:2px; box-shadow:inset 0 1px 2px rgba(20,32,52,.05);
}
input:not([type])::placeholder, textarea::placeholder { color:var(--ink-3); opacity:.75; }
/* <<< édition layer <<< */
