
  :root { color-scheme: light dark;
          --bg:#0B0F14; --card:#161B22; --raised:#1C232C; --text:#F1F5F9;
          --muted:#9AA5B4; --soft:#6B7684; --border:#2A323D;
          --accent:#0E9F6E; --good:#16A34A; --warn:#F59E0B; --bad:#DC2626; --gold:#F0B429; }
  @media (prefers-color-scheme: light) {
    :root { --bg:#F6F7F9; --card:#FFFFFF; --raised:#FFFFFF; --text:#1F2430;
            --muted:#6B7280; --soft:#94A3B8; --border:#E2E8F0; }
  }
  * { box-sizing:border-box; }
  body { margin:0; background:var(--bg); color:var(--text); font:15px/1.5 -apple-system,
         BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
         -webkit-font-smoothing:antialiased; }
  .wrap { max-width:1100px; margin:0 auto; padding:28px 20px 64px; }
  header { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap;
           margin-bottom:22px; }
  h1 { margin:0; font-size:1.5rem; letter-spacing:-0.02em; }
  h1 .sub { color:var(--muted); font-weight:400; font-size:1rem; margin-left:6px; }
  .stamp { margin-left:auto; font-size:0.78rem; color:var(--soft); }
  h2 { font-size:0.78rem; text-transform:uppercase; letter-spacing:0.08em;
       color:var(--muted); margin:34px 0 12px; font-weight:700; }
  h2:first-of-type { margin-top:26px; }

  .tiles { display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }
  .tile { background:var(--card); border:1px solid var(--border); border-radius:14px;
          padding:14px 16px; }
  .tile .v { font-size:1.7rem; font-weight:700; letter-spacing:-0.02em;
             font-variant-numeric:tabular-nums; }
  .tile .l { font-size:0.8rem; color:var(--muted); margin-top:2px; }
  .tile .d { font-size:0.72rem; color:var(--soft); margin-top:5px; }
  .accent .v { color:var(--accent); } .good .v { color:var(--good); }
  .warn .v { color:var(--warn); } .bad .v { color:var(--bad); }

  .charts { display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); }
  .panel { background:var(--card); border:1px solid var(--border); border-radius:14px;
           padding:16px; }
  .panel .head { display:flex; align-items:baseline; gap:8px; margin-bottom:12px; }
  .panel .head b { font-size:0.9rem; }
  .panel .head span { font-size:0.78rem; color:var(--soft); margin-left:auto;
                      font-variant-numeric:tabular-nums; }
  svg { display:block; width:100%; height:auto; overflow:visible; }
  svg rect { fill:var(--accent); }
  svg rect.zero { fill:var(--border); }
  svg rect:hover { fill:var(--gold); }
  .axis { display:flex; justify-content:space-between; font-size:0.68rem;
          color:var(--soft); margin-top:6px; }
  .empty { color:var(--soft); font-size:0.82rem; padding:22px 0; text-align:center; }

  .bars { display:grid; gap:9px; }
  .bars .r { display:grid; grid-template-columns:8rem 1fr 3rem; align-items:center;
             gap:10px; font-size:0.83rem; }
  .bars .track { height:8px; border-radius:99px; background:var(--border);
                 overflow:hidden; }
  .bars .fill { height:100%; background:var(--accent); border-radius:99px; }
  .bars .n { text-align:right; font-variant-numeric:tabular-nums; color:var(--muted); }

  table { width:100%; border-collapse:collapse; background:var(--card);
          border:1px solid var(--border); border-radius:14px; overflow:hidden; }
  th, td { text-align:left; padding:10px 12px; font-size:0.84rem;
           border-bottom:1px solid var(--border); }
  th { font-size:0.72rem; text-transform:uppercase; letter-spacing:0.06em;
       color:var(--muted); font-weight:700; background:var(--raised); }
  tr:last-child td { border-bottom:none; }
  td.num { text-align:right; font-variant-numeric:tabular-nums; }
  code { font:0.8rem ui-monospace,SFMono-Regular,Menlo,monospace; color:var(--muted); }
  .pill { display:inline-block; padding:2px 8px; border-radius:99px; font-size:0.7rem;
          font-weight:700; letter-spacing:0.02em; }
  .pill.pending { background:color-mix(in srgb, var(--warn) 18%, transparent); color:var(--warn); }
  .pill.approved { background:color-mix(in srgb, var(--good) 18%, transparent); color:var(--good); }
  .pill.rejected { background:color-mix(in srgb, var(--bad) 18%, transparent); color:var(--bad); }
  .pill.on { background:color-mix(in srgb, var(--good) 18%, transparent); color:var(--good); }
  .pill.off { background:var(--border); color:var(--muted); }
  .pill.admin { background:color-mix(in srgb, var(--gold) 20%, transparent); color:var(--gold); }
  .pill.verifier { background:color-mix(in srgb, var(--accent) 18%, transparent); color:var(--accent); }
  .pill.member { background:var(--border); color:var(--muted); }
  .more { font-size:0.76rem; color:var(--soft); margin-top:8px; }
  .note { font-size:0.76rem; color:var(--soft); margin:10px 0 0; }
  .scroll { overflow-x:auto; }

  .tabs { display:flex; gap:6px; margin:0 0 4px; }
  .tabs a { text-decoration:none; font-size:0.85rem; font-weight:600; color:var(--muted);
            padding:8px 14px; border-radius:10px; border:1px solid transparent; }
  .tabs a:hover { color:var(--text); background:var(--card); }
  .tabs a.on { color:var(--text); background:var(--card); border-color:var(--border); }

  .ledger { display:grid; gap:2px; }
  .lr { display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
        padding:9px 2px; border-bottom:1px solid var(--border); }
  .lr:last-child { border-bottom:none; }
  .lr .lbl { font-size:0.87rem; font-weight:600; }
  .lr .dtl { font-size:0.72rem; color:var(--soft); margin-top:2px; }
  .lr .amt { font-size:0.95rem; font-weight:700; font-variant-numeric:tabular-nums;
             white-space:nowrap; }
  .lr.subtract .amt { color:var(--bad); }
  .lr.total { border-top:2px solid var(--border); margin-top:6px; padding-top:12px;
              align-items:center; }
  .lr.total .lbl { font-size:1rem; }
  .lr.total .amt { font-size:1.5rem; color:var(--accent); }
  .warnbox { font-size:0.76rem; color:var(--warn); margin:10px 0 0;
             background:color-mix(in srgb, var(--warn) 10%, transparent);
             border:1px solid color-mix(in srgb, var(--warn) 35%, transparent);
             border-radius:10px; padding:10px 12px; }
  .banner { font-size:0.85rem; padding:11px 14px; border-radius:12px; margin-bottom:16px;
            background:color-mix(in srgb, var(--accent) 12%, var(--card));
            border:1px solid color-mix(in srgb, var(--accent) 40%, var(--border)); }

  .change { display:grid; grid-template-columns:9rem 1fr auto 1fr; gap:10px;
            align-items:baseline; padding:7px 0; border-bottom:1px solid var(--border);
            font-size:0.83rem; }
  .change:last-child { border-bottom:none; }
  .change .k { color:var(--muted); font-weight:600; }
  .change .was { color:var(--soft); word-break:break-word; }
  .change .arrow { color:var(--soft); }
  .change .now { color:var(--text); font-weight:600; word-break:break-word; }
  .change.fresh .now { color:var(--good); }
  .review { display:flex; gap:10px; align-items:center; margin-top:12px; flex-wrap:wrap; }
  .review input[type=text] { flex:1; min-width:10rem; font:inherit; font-size:0.85rem;
        color:var(--text); background:var(--bg); border:1px solid var(--border);
        border-radius:10px; padding:8px 10px; }
  .review button { font:inherit; font-size:0.85rem; font-weight:700; border:none;
        border-radius:10px; padding:9px 16px; cursor:pointer; color:#fff; }
  .review button.yes { background:var(--good); }
  .review button.no { background:var(--bad); }
  .sub { color:var(--muted); font-weight:400; }

  textarea { width:100%; min-height:22rem; font:0.8rem/1.5 ui-monospace,SFMono-Regular,
        Menlo,monospace; color:var(--text); background:var(--bg);
        border:1px solid var(--border); border-radius:12px; padding:12px; resize:vertical; }
  .search { display:flex; gap:10px; margin-bottom:12px; }
  .search input { flex:1; font:inherit; font-size:0.9rem; color:var(--text);
        background:var(--card); border:1px solid var(--border); border-radius:11px;
        padding:10px 13px; }
  .search button, .save button { font:inherit; font-size:0.88rem; font-weight:700;
        color:#fff; background:var(--accent); border:none; border-radius:11px;
        padding:10px 18px; cursor:pointer; }
  .save { display:flex; gap:10px; align-items:center; margin-top:12px; }
  a.edit { color:var(--accent); text-decoration:none; font-weight:600; }

  .signin { max-width:22rem; margin:9vh auto 0; text-align:center; }
  .signin .mark { width:52px; height:52px; margin:0 auto 16px; border-radius:15px;
        background:linear-gradient(140deg,#0E9F6E,#047857); display:grid;
        place-items:center; font-size:26px; }
  .signin h1 { font-size:1.4rem; margin:0; }
  .signin p.sub { color:var(--muted); font-size:0.85rem; margin:4px 0 22px; }
  .signin .warnbox { text-align:left; margin-bottom:16px; }
  .stack { display:grid; gap:12px; text-align:left; }
  .stack label { display:grid; gap:5px; font-size:0.72rem; text-transform:uppercase;
        letter-spacing:0.06em; color:var(--muted); font-weight:700; }
  .stack input { font:inherit; font-size:0.95rem; color:var(--text); background:var(--card);
        border:1px solid var(--border); border-radius:11px; padding:11px 13px;
        text-transform:none; letter-spacing:normal; font-weight:400; }
  .stack input[name=code] { font:1.2rem ui-monospace,SFMono-Regular,Menlo,monospace;
        letter-spacing:0.3em; text-align:center; }
  .stack button { font:inherit; font-size:0.95rem; font-weight:700; color:#fff;
        background:var(--accent); border:none; border-radius:11px; padding:12px;
        cursor:pointer; margin-top:4px; }
  .signout { margin-left:12px; font-size:0.78rem; color:var(--soft); text-decoration:none; }
  .signout:hover { color:var(--text); }

  .mint { display:flex; gap:12px; align-items:flex-end; flex-wrap:wrap; }
  .mint label { display:flex; flex-direction:column; gap:5px; font-size:0.74rem;
                text-transform:uppercase; letter-spacing:0.06em; color:var(--muted);
                font-weight:700; }
  .mint .grow { flex:1; min-width:12rem; }
  .mint select, .mint input { font:inherit; font-size:0.88rem; color:var(--text);
        background:var(--bg); border:1px solid var(--border); border-radius:10px;
        padding:8px 10px; text-transform:none; letter-spacing:normal; font-weight:400; }
  .mint button { font:inherit; font-size:0.88rem; font-weight:700; color:#fff;
        background:var(--accent); border:none; border-radius:10px; padding:10px 18px;
        cursor:pointer; }
  .mint button:hover { filter:brightness(1.08); }
  .minted { border-color:color-mix(in srgb, var(--accent) 45%, var(--border));
            background:color-mix(in srgb, var(--accent) 7%, var(--card)); }
  .codes { display:flex; flex-wrap:wrap; gap:8px; }
  code.big { font-size:0.95rem; color:var(--text); background:var(--bg);
             border:1px solid var(--border); border-radius:9px; padding:7px 11px;
             user-select:all; }
