/* Paxie.Airdrop — the Paxie.Matrix field-guide palette: parchment ground, frosted glass panes,
   ink hairlines, rust accent, outlined mono chips, rust matrix rain underneath. Day + night. */
:root {
  color-scheme: light;
  --bg: #f2e2c6;
  --ground: radial-gradient(1100px 700px at 82% 6%, rgba(178,134,62,.16), transparent 62%),
            radial-gradient(900px 620px at 8% 30%, hsla(78,17%,69%,.2), transparent 64%);
  --glass: rgba(255,248,234,.34);
  --glass-hi: rgba(255,248,234,.6);
  --tile: rgba(255,252,244,.42);
  --panel-solid: rgba(247,235,214,.97);
  --th: #f7ebd6;
  --line: rgba(32,32,26,.16);
  --line-mid: rgba(32,32,26,.26);
  --line-hi: rgba(32,32,26,.44);
  --fg: #20201a; --mid: #4a4033; --dim: #6b5f4c; --faint: #9a8b72;
  --accent: #7f2f19; --accent-hi: #ae4a2b; --accent-soft: rgba(126,43,24,.07); --accent-line: rgba(149,57,31,.44); --on-accent: #fbf2e2;
  --win: #2f6a3b; --win-soft: rgba(49,80,53,.12);
  --loss: #b3261e; --loss-soft: rgba(179,38,30,.1);
  --warn: #9a5a0c; --warn-soft: rgba(154,90,12,.1);
  --info: #2c6aa8; --info-soft: rgba(44,106,168,.12);
  --ink: rgba(30,27,22,.92); --ink-fg: #efe4cf; --ink-dim: #a99a80; --ink-line: rgba(239,228,207,.12);
  --glow-sm: 0 1px 2px rgba(60,44,20,.18);
  --glow-lg: 0 12px 34px -18px rgba(60,44,20,.4);
  --input: rgba(255,253,246,.9);
  --rain: 127,47,25; --rain-head: 174,74,43;
  --display: "Google Sans Display", "Google Sans", "Outfit", system-ui, -apple-system, sans-serif;
  --body: Roboto, system-ui, -apple-system, sans-serif;
  --mono: "Roboto Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --r: 12px; --r-sm: 8px; --r-full: 999px;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #12100c;
  --ground: radial-gradient(1100px 700px at 82% 6%, rgba(224,121,79,.14), transparent 62%),
            radial-gradient(900px 620px at 8% 30%, rgba(127,202,143,.06), transparent 64%);
  --glass: rgba(36,31,25,.46); --glass-hi: rgba(32,28,22,.82); --tile: rgba(52,45,36,.42); --panel-solid: rgba(26,23,18,.97); --th: #1c1813;
  --line: rgba(239,228,207,.11); --line-mid: rgba(239,228,207,.2); --line-hi: rgba(239,228,207,.36);
  --fg: #efe4cf; --mid: #d0c2a8; --dim: #a99a80; --faint: #7d705c;
  --accent: #e5875c; --accent-hi: #f0b27a; --accent-soft: rgba(229,135,92,.1); --accent-line: rgba(240,178,122,.45); --on-accent: #1a1510;
  --win: #7fca8f; --win-soft: rgba(127,202,143,.13);
  --loss: #ff7a6b; --loss-soft: rgba(255,122,107,.13);
  --warn: #f2c46d; --warn-soft: rgba(242,196,109,.12);
  --info: #6fa8dc; --info-soft: rgba(111,168,220,.14);
  --ink: rgba(6,5,4,.88);
  --glow-sm: 0 1px 2px rgba(0,0,0,.55); --glow-lg: 0 14px 36px -18px rgba(0,0,0,.85);
  --input: rgba(26,23,18,.92);
  --rain: 229,135,92; --rain-head: 240,178,122;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { background: var(--bg); }
html, body { min-height: 100%; }
body { margin: 0; background: var(--ground), var(--bg); background-attachment: fixed; color: var(--fg); font: 13px/1.5 var(--body); font-variant-numeric: tabular-nums; -webkit-font-smoothing: antialiased; -webkit-tap-highlight-color: transparent; }
#rain { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 0; opacity: .38; pointer-events: none; }
:root[data-theme="dark"] #rain { opacity: .45; mix-blend-mode: screen; }
.scan { position: fixed; inset: 0; pointer-events: none; z-index: 1; background: repeating-linear-gradient(to bottom, transparent 0 3px, rgba(60,44,20,.025) 3px 4px); }
:root[data-theme="dark"] .scan { background: repeating-linear-gradient(to bottom, transparent 0 3px, rgba(0,0,0,.18) 3px 4px); }
.wrap { position: relative; z-index: 2; max-width: 1480px; margin: 0 auto; padding: 12px 16px 40px; display: flex; flex-direction: column; gap: 14px; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: var(--accent); }
:focus-visible { outline: 2px solid var(--accent-hi); outline-offset: 2px; }
svg.i { width: 16px; height: 16px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.glass { background: var(--glass); -webkit-backdrop-filter: blur(3px) saturate(125%); backdrop-filter: blur(3px) saturate(125%); border: 1px solid var(--line); box-shadow: var(--glow-sm), var(--glow-lg); }
.glass.keep { background: var(--glass-hi); -webkit-backdrop-filter: blur(11px) saturate(135%); backdrop-filter: blur(11px) saturate(135%); }
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) { .glass { background: var(--panel-solid); } }

/* ---------- top rail ---------- */
.rail { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; padding: 10px 14px; border-radius: var(--r); }
.logo { display: inline-flex; align-items: center; gap: 9px; font: 500 21px/1 var(--display); color: var(--fg); letter-spacing: -.01em; white-space: nowrap; text-decoration: none; }
.logo b { font-weight: 500; color: var(--accent); }
.logo svg { width: 26px; height: 26px; flex: none; }
.eyebrow { font: 500 10.5px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.tabs { display: flex; gap: 4px; flex-wrap: wrap; }
.tab { display: inline-flex; align-items: center; gap: 7px; background: none; border: 1px solid transparent; border-radius: var(--r-full); padding: 7px 12px; color: var(--dim); font: 500 10.5px/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; min-height: 34px; }
.tab:hover { color: var(--accent); background: var(--accent-soft); }
.tab[aria-selected="true"] { color: var(--accent); border-color: var(--accent-line); background: var(--accent-soft); }
.badge { font: 600 9px/1 var(--mono); color: var(--on-accent); background: var(--accent); border-radius: 99px; padding: 2px 5px; letter-spacing: 0; }
.grow { flex: 1 1 0; }
.ctrls { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; background: var(--tile); border: 1px solid var(--line-mid); color: var(--fg); padding: 7px 12px; border-radius: var(--r-full); font: 500 10.5px/1 var(--mono); letter-spacing: .09em; text-transform: uppercase; transition: background .18s, color .18s, border-color .18s; min-height: 34px; white-space: nowrap; text-decoration: none; }
.btn:hover { background: var(--accent-soft); border-color: var(--accent-line); color: var(--accent); }
.btn.primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.btn.primary:hover { background: var(--accent-hi); border-color: var(--accent-hi); color: var(--on-accent); }
.btn.danger { border-color: rgba(179,38,30,.35); color: var(--loss); }
.btn.danger:hover { background: var(--loss-soft); border-color: var(--loss); }
.btn.solid-danger { background: var(--loss); border-color: var(--loss); color: #fff; }
.btn.ghost { background: none; border-color: transparent; }
.btn.sm { min-height: 28px; padding: 5px 9px; font-size: 9.5px; }
.btn:disabled { opacity: .45; pointer-events: none; }
.icon-btn { width: 36px; padding: 0; }
.themebtn .sun { display: none; color: #f5b54a; filter: drop-shadow(0 0 5px rgba(245,181,74,.6)); }
:root[data-theme="dark"] .themebtn .sun { display: block; }
:root[data-theme="dark"] .themebtn .moon { display: none; }
.themebtn svg { width: 16px; height: 16px; }
.themebtn .moon { color: var(--mid); }

/* ---------- panels ---------- */
.view { display: flex; flex-direction: column; gap: 14px; animation: fade .2s ease-out; }
@keyframes fade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.panel { border-radius: var(--r); min-width: 0; display: flex; flex-direction: column; overflow: hidden; }
.ph { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 16px 10px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.ph h2 { margin: 0; display: inline-flex; align-items: center; gap: 8px; font: 500 10.5px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.ph .meta { font: 400 10.5px/1.2 var(--mono); color: var(--dim); }
.pb { padding: 12px 16px; min-width: 0; }
.panel.ink { background: var(--ink); border-color: rgba(32,32,26,.5); color: var(--ink-fg); }
.panel.ink .ph { border-bottom-color: var(--ink-line); }
.panel.ink .ph h2 { color: #f0b27a; }
.panel.ink .ph .meta { color: var(--ink-dim); }
.panel.ink a { color: #f0b27a; }
.grid { display: grid; gap: 14px; }
.g-kpi { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.g-two { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); }
.g-three { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); }
.kpi { padding: 14px 16px; border-radius: var(--r); position: relative; overflow: hidden; text-align: left; color: var(--fg); }
.kpi b { display: block; font: 500 28px/1.05 var(--display); letter-spacing: -.02em; }
.kpi span { display: flex; align-items: center; gap: 6px; margin-top: 8px; font: 500 9.5px/1.2 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--dim); }
.kpi svg.i { width: 14px; height: 14px; color: var(--accent); }
.kpi.click { cursor: pointer; transition: border-color .18s, transform .18s; }
.kpi.click:hover { border-color: var(--accent-line); transform: translateY(-1px); }
.kpi.alert b { color: var(--warn); }
.kpi.bad b { color: var(--loss); }
.kpi.good b { color: var(--win); }

/* ---------- tables ---------- */
.scroll { overflow: auto; }
.scroll.tall { max-height: 70vh; }
table { width: 100%; border-collapse: collapse; font: 400 12.5px/1.35 var(--body); }
th { text-align: left; font: 500 9.5px/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--dim); padding: 9px 10px; border-bottom: 1px solid var(--line-mid); position: sticky; top: 0; background: var(--th); z-index: 1; white-space: nowrap; }
td { padding: 9px 10px; border-bottom: 1px solid var(--line); vertical-align: middle; }
tr.row { cursor: pointer; transition: background .15s; }
tr.row:hover td { background: var(--accent-soft); }
tr.dimrow td { opacity: .55; }
td.num, th.num { text-align: right; font-family: var(--mono); font-size: 11.5px; }
.mono { font-family: var(--mono); font-size: 11.5px; }
.addr { font-family: var(--mono); font-size: 11.5px; color: var(--mid); white-space: nowrap; }
.who b { font-weight: 500; }
.who small { display: block; color: var(--dim); font: 400 11px/1.3 var(--mono); }
.empty { padding: 22px 16px; color: var(--faint); font: 400 12px/1.5 var(--mono); text-align: center; }
.chip { display: inline-flex; align-items: center; gap: 4px; font: 500 9px/1 var(--mono); letter-spacing: .09em; text-transform: uppercase; padding: 3px 6px; border-radius: var(--r-full); border: 1px solid currentColor; white-space: nowrap; margin: 1px 2px 1px 0; }
.chip.win { color: var(--win); } .chip.loss { color: var(--loss); } .chip.warn { color: var(--warn); } .chip.info { color: var(--info); } .chip.dim { color: var(--dim); } .chip.acc { color: var(--accent); }
.up { color: var(--win); } .down { color: var(--loss); }
.list { display: flex; flex-direction: column; }
.li { display: flex; align-items: center; gap: 10px; padding: 9px 16px; border-bottom: 1px solid var(--line); min-width: 0; }
.li:last-child { border-bottom: 0; }
.li .grow { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.li time { font: 400 10.5px/1 var(--mono); color: var(--dim); white-space: nowrap; }
.li.click { cursor: pointer; }
.li.click:hover { background: var(--accent-soft); }
.panel.ink .li { border-bottom-color: var(--ink-line); }
.panel.ink .li time, .panel.ink .addr { color: var(--ink-dim); }
.panel.ink .li.click:hover { background: rgba(240,178,122,.08); }
.tokrow { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 9px 16px; border-bottom: 1px solid var(--line); }
.tokrow b { font: 500 18px/1 var(--display); }
.tokrow span { font: 500 10px/1 var(--mono); letter-spacing: .1em; color: var(--dim); }

/* ---------- members toolbar ---------- */
.toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.search { display: flex; align-items: center; gap: 8px; flex: 1 1 260px; min-width: 0; background: var(--input); border: 1px solid var(--line-mid); border-radius: var(--r-full); padding: 0 12px; min-height: 38px; color: var(--dim); }
.search input { flex: 1; min-width: 0; border: 0; background: none; outline: none; font-size: 14px; padding: 8px 0; color: var(--fg); }
.search:focus-within { border-color: var(--accent-line); box-shadow: 0 0 0 3px var(--accent-soft); }
.filters { display: flex; gap: 6px; flex-wrap: wrap; }
.fchip { background: none; border: 1px solid var(--line-mid); color: var(--dim); border-radius: var(--r-full); padding: 6px 10px; font: 500 9.5px/1 var(--mono); letter-spacing: .09em; text-transform: uppercase; min-height: 30px; }
.fchip:hover { color: var(--accent); border-color: var(--accent-line); }
.fchip[aria-pressed="true"] { color: var(--on-accent); background: var(--accent); border-color: var(--accent); }
.more { display: flex; justify-content: center; align-items: center; gap: 10px; padding: 12px; color: var(--dim); font: 400 11px/1 var(--mono); }

/* ---------- drawer + dialogs ---------- */
.scrim { position: fixed; inset: 0; z-index: 40; background: rgba(32,24,14,.32); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); animation: fade .18s; }
:root[data-theme="dark"] .scrim { background: rgba(0,0,0,.55); }
.drawer { position: fixed; z-index: 41; top: 0; right: 0; bottom: 0; width: min(560px, 100%); display: flex; flex-direction: column; background: var(--panel-solid); border-left: 1px solid var(--line-mid); box-shadow: -20px 0 50px -20px rgba(0,0,0,.35); animation: slidein .22s ease-out; }
@keyframes slidein { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
.drawer header { position: relative; display: flex; align-items: flex-start; gap: 12px; padding: 16px 18px 12px; padding-top: max(16px, env(safe-area-inset-top)); border-bottom: 1px solid var(--line); }
.drawer header h3 { margin: 0; font: 500 22px/1.15 var(--display); letter-spacing: -.01em; word-break: break-word; }
.drawer header .sub { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 6px 10px; font: 400 11.5px/1.3 var(--mono); color: var(--dim); align-items: center; }
.drawer header .sub a { display: inline-flex; align-items: center; gap: 4px; text-decoration: none; }
.drawer header .sub svg.i { width: 13px; height: 13px; }
.drawer .body { flex: 1; overflow: auto; padding: 4px 18px 24px; padding-bottom: max(24px, env(safe-area-inset-bottom)); }
.sec { margin-top: 18px; }
.sec > h4 { margin: 0 0 8px; font: 500 9.5px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.wcard { border: 1px solid var(--line); border-radius: var(--r-sm); padding: 10px 12px; margin-bottom: 8px; background: var(--tile); }
.wcard.payout { border-color: var(--accent-line); box-shadow: 0 0 0 1px var(--accent-line) inset; }
.wcard .top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.wcard .addr { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; color: var(--fg); }
.wcard .src { margin-top: 6px; font: 400 10.5px/1.5 var(--mono); color: var(--dim); }
.wcard .acts { margin-top: 8px; display: flex; gap: 6px; flex-wrap: wrap; }
.form { display: grid; gap: 12px; }
.form .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
label.f { display: grid; gap: 6px; font: 500 9.5px/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--dim); }
label.f em { font-style: normal; text-transform: none; letter-spacing: 0; color: var(--faint); font: 400 11px/1.3 var(--body); }
.in { width: 100%; background: var(--input); border: 1px solid var(--line-mid); border-radius: var(--r-sm); padding: 10px 12px; font: 400 15px/1.3 var(--body); color: var(--fg); text-transform: none; letter-spacing: 0; }
.in.mono { font-family: var(--mono); font-size: 13.5px; }
textarea.in { min-height: 70px; resize: vertical; }
.in:focus { border-color: var(--accent-line); outline: none; box-shadow: 0 0 0 3px var(--accent-soft); }
.check { display: flex; align-items: center; gap: 8px; font: 400 13px/1.3 var(--body); color: var(--mid); }
.check input { width: 18px; height: 18px; accent-color: var(--accent); }
.tog { position: relative; width: 46px; height: 26px; border-radius: 99px; border: 1px solid var(--line-mid); background: rgba(32,32,26,.12); transition: background .2s, border-color .2s; flex: none; padding: 0; }
:root[data-theme="dark"] .tog { background: rgba(239,228,207,.1); }
.tog::after { content: ''; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: var(--glow-sm); transition: transform .2s; }
.tog[aria-checked="true"] { background: var(--win); border-color: var(--win); }
.tog[aria-checked="true"]::after { transform: translateX(20px); }
.setting { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.setting div b { display: block; font-weight: 500; }
.setting div small { color: var(--dim); }
.banbox { display: flex; gap: 10px; align-items: flex-start; border: 1px solid rgba(179,38,30,.35); background: var(--loss-soft); border-radius: var(--r-sm); padding: 10px 12px; color: var(--loss); margin-top: 14px; }
.banbox svg.i { margin-top: 1px; }
.banbox div { flex: 1; }
.modal { position: fixed; z-index: 42; inset: 0; display: grid; place-items: center; padding: 16px; }
.modal .box { width: min(480px, 100%); max-height: calc(100dvh - 32px); overflow: auto; border-radius: 18px; padding: 22px; display: grid; gap: 14px; background: var(--panel-solid); border: 1px solid var(--line-mid); box-shadow: 0 30px 60px -30px rgba(0,0,0,.5); animation: pop .18s ease-out; }
@keyframes pop { from { transform: scale(.97); opacity: 0; } to { transform: none; opacity: 1; } }
.modal h3 { margin: 0; font: 500 22px/1.1 var(--display); }
.modal p { margin: 0; color: var(--mid); }
.modal .acts { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.err { color: var(--loss); font: 400 12px/1.4 var(--mono); min-height: 1em; }

/* ---------- gate ---------- */
.gate { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center; padding: 16px; background: rgba(242,226,198,.5); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
:root[data-theme="dark"] .gate { background: rgba(14,12,9,.7); }
.gatebox { width: min(400px, 100%); border-radius: 20px; padding: 30px 24px 24px; display: flex; flex-direction: column; gap: 14px; }
.gatebox .logo { justify-content: center; font-size: 32px; }
.gatebox .logo svg { width: 40px; height: 40px; }
.gatebox p { margin: 0; text-align: center; }
.gatebox input { text-align: center; letter-spacing: .25em; font-size: 16px; }
.gatebox .btn { min-height: 44px; font-size: 11px; }
.shake { animation: shake .35s; }
@keyframes shake { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }

/* ---------- toast ---------- */
.toasts { position: fixed; z-index: 70; left: 50%; transform: translateX(-50%); bottom: calc(18px + env(safe-area-inset-bottom)); display: grid; gap: 8px; width: min(440px, calc(100% - 24px)); pointer-events: none; }
.toast { pointer-events: auto; padding: 11px 14px; border-radius: var(--r-sm); background: var(--ink); color: var(--ink-fg); font: 400 12.5px/1.4 var(--body); box-shadow: 0 14px 30px -14px rgba(0,0,0,.6); display: flex; gap: 9px; align-items: center; animation: up .2s ease-out; }
.toast.bad { background: var(--loss); color: #fff; }
.toast svg.i { color: #f0b27a; }
.toast.bad svg.i { color: #fff; }
@keyframes up { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ---------- layout breakpoints ---------- */
.glance, .tabbar, .fab { display: none; }
@media (max-width: 1180px) { .g-kpi { grid-template-columns: repeat(3, minmax(0, 1fr)); } .g-two, .g-three { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) {
  .wrap { padding: 8px 12px calc(96px + env(safe-area-inset-bottom, 0px)); gap: 12px; }
  .rail { display: none; }
  #rain { opacity: .22; }
  .glance { display: block; position: sticky; top: env(safe-area-inset-top, 0px); z-index: 6; border-radius: var(--r); padding: 12px 14px; }
  .glance .row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
  .glance .logo { font-size: 18px; }
  .glance .logo svg { width: 22px; height: 22px; }
  .glance .kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-top: 10px; }
  .glance .kpis b { display: block; font: 500 18px/1.15 var(--display); }
  .glance .kpis span { font: 500 8.5px/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--dim); }
  .tabbar:not([hidden]) { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; background: rgba(255,248,234,.9); -webkit-backdrop-filter: blur(14px) saturate(135%); backdrop-filter: blur(14px) saturate(135%); border-top: 1px solid var(--line-mid); padding-bottom: env(safe-area-inset-bottom, 0px); }
  :root[data-theme="dark"] .tabbar { background: rgba(20,17,13,.92); }
  .tabbar button { background: none; border: 0; padding: 9px 2px 8px; color: var(--dim); font: 500 9px/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; display: flex; flex-direction: column; align-items: center; gap: 5px; min-height: 58px; position: relative; }
  .tabbar button svg.i { width: 21px; height: 21px; }
  .tabbar button[aria-selected="true"] { color: var(--accent); }
  .tabbar .badge { position: absolute; top: 6px; left: calc(50% + 7px); }
  .fab:not([hidden]) { display: flex; position: fixed; right: 16px; bottom: calc(72px + env(safe-area-inset-bottom)); z-index: 29; width: 54px; height: 54px; border-radius: 50%; border: 0; background: var(--accent); color: var(--on-accent); align-items: center; justify-content: center; box-shadow: 0 12px 26px -10px rgba(127,47,25,.7); }
  .fab svg.i { width: 24px; height: 24px; }
  .g-kpi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi b { font-size: 24px; }
  .hide-sm { display: none; }
  td, th { padding: 8px 7px; }
  .drawer { top: auto; width: 100%; max-height: 92dvh; border-left: 0; border-top: 1px solid var(--line-mid); border-radius: 18px 18px 0 0; animation: sheet .24s ease-out; }
  @keyframes sheet { from { transform: translateY(30px); opacity: 0; } to { transform: none; opacity: 1; } }
  .drawer header::before { content: ''; position: absolute; left: 50%; top: 6px; width: 38px; height: 4px; border-radius: 4px; background: var(--line-hi); transform: translateX(-50%); }
  .form .row2 { grid-template-columns: 1fr; }
  .modal { align-items: end; padding: 0; }
  .modal .box { width: 100%; border-radius: 18px 18px 0 0; padding-bottom: max(22px, env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } #rain { display: none; } }