/* ══ THE FLOOR ═══════════════════════════════════════════════════════════════════════════════════
   Every estate market maker at work, in the Field's dress: paper with the lattice, white rounded sheets, Archivo for
   the figures, Inter for the words, gold where something is pressed or alive. One reading every fifteen seconds.
   18 Sep 2026. */
:root { --paper:#efe9db; --paper2:#e6dfcd; --ink:#1c1712; --ink2:#6a5f52; --gold:#f7931e; --estate:#f4c542; --green:#2f7a2c; --red:#c8371f; --white:#fff; --shadow:0 12px 34px rgba(28,23,18,.12); --ease:cubic-bezier(.2,.8,.2,1); }
html, body { margin:0; background:var(--paper); color:var(--ink); font:400 15px/1.55 Inter, system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; }
body { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='90'%3E%3Cg fill='%23e4dcc8' stroke='%23e4dcc8' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M26 3 L47 15 L47 33 L26 45 L5 33 L5 15 Z'/%3E%3Cpath d='M52 48 L73 60 L73 78 L52 90 L31 78 L31 60 Z'/%3E%3Cpath d='M0 48 L21 60 L21 78 L0 90 L-21 78 L-21 60 Z'/%3E%3C/g%3E%3C/svg%3E"); background-size:52px 90px; padding-bottom:60px; }
a { color:var(--ink); }
.serif, h1, h2, h3, .fig b, .big { font-family:Archivo, Impact, "Arial Black", sans-serif; font-weight:900; font-stretch:112%; text-transform:uppercase; letter-spacing:-.01em; }
.dim { color:var(--ink2); }
.mono { font:500 12px ui-monospace, Menlo, Consolas, monospace; }

/* ── the pill ── */
.gnav { position:fixed; top:14px; left:16px; right:16px; z-index:10; }
.gnav .pill { max-width:1280px; margin:0 auto; background:var(--white); border-radius:999px; box-shadow:var(--shadow); display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 8px 8px 16px; }
.gnav .mark { display:inline-flex; align-items:center; gap:10px; text-decoration:none; font:900 17px Archivo, Impact, sans-serif; letter-spacing:.06em; text-transform:uppercase; color:var(--ink); white-space:nowrap; }
.gnav .mark img { width:30px; height:30px; }
.gnav .mark small { font:600 11px Inter, sans-serif; letter-spacing:.14em; color:var(--ink2); margin-left:4px; }
.gnav .live { display:inline-flex; align-items:center; gap:8px; font:600 12px Inter, sans-serif; letter-spacing:.08em; text-transform:uppercase; color:var(--ink2); }
.gnav .live i { width:10px; height:10px; border-radius:50%; background:var(--green); box-shadow:0 0 0 0 rgba(47,122,44,.5); animation:fl-ping 2s infinite; }
.gnav .live.off i { background:var(--red); animation:none; }
.gnav .cta { display:inline-flex; align-items:center; gap:10px; text-decoration:none; background:var(--ink); color:#fff; font:600 15px Inter, sans-serif; padding:10px 18px 10px 10px; border-radius:999px; white-space:nowrap; }
.gnav .cta .ico { width:26px; height:26px; border-radius:7px; background:var(--gold); display:inline-grid; place-items:center; color:var(--ink); font:900 13px Archivo, sans-serif; }
@keyframes fl-ping { 0% { box-shadow:0 0 0 0 rgba(47,122,44,.5); } 70% { box-shadow:0 0 0 10px rgba(47,122,44,0); } 100% { box-shadow:0 0 0 0 rgba(47,122,44,0); } }

main { max-width:1280px; margin:0 auto; padding:96px 16px 40px; }
.sheet { background:var(--white); border-radius:28px; box-shadow:var(--shadow); padding:26px 30px; margin:0 0 16px; animation:fl-rise .5s var(--ease) both; }
@keyframes fl-rise { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
.eyebrow { display:inline-flex; align-items:center; gap:8px; background:rgba(28,23,18,.07); border-radius:999px; padding:5px 12px; font:600 11px Inter, sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--ink2); margin-bottom:12px; }
.eyebrow::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--gold); }
h1 { font-size:clamp(34px, 5vw, 56px); line-height:.95; margin:0 0 10px; }
h2 { font-size:18px; letter-spacing:.02em; margin:0 0 14px; }
h3 { font-size:14px; letter-spacing:.03em; margin:0 0 8px; }
.lede { font-size:16px; color:var(--ink2); max-width:760px; margin:0; }

/* ── figures ── */
.figures { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:12px; margin-top:22px; }
.fig { background:var(--paper); border-radius:18px; padding:14px 16px 12px; min-width:0; }
.fig small { display:block; font:600 11px Inter, sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--ink2); }
.fig b { display:block; font-size:28px; line-height:1.05; margin-top:6px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.fig b .unit { font:600 12px Inter, sans-serif; letter-spacing:.08em; text-transform:none; color:var(--ink2); margin-left:4px; }
.fig .note { font:500 12px/1.4 Inter, sans-serif; color:var(--ink2); margin-top:6px; }
.fig.up b { color:var(--green); } .fig.gold b { color:var(--gold); }

/* ── the wave: where the price sits between the anchors ── */
.wave { display:grid; grid-template-columns:1fr 1.4fr; gap:22px; align-items:center; }
.band { position:relative; height:74px; }
.band .rail { position:absolute; left:0; right:0; top:34px; height:6px; border-radius:6px; background:linear-gradient(90deg, rgba(47,122,44,.35), rgba(28,23,18,.08) 45%, rgba(28,23,18,.08) 55%, rgba(247,147,30,.5)); }
.band .mk { position:absolute; top:0; transform:translateX(-50%); text-align:center; font:600 10px Inter, sans-serif; letter-spacing:.1em; text-transform:uppercase; color:var(--ink2); white-space:nowrap; }
.band .mk::after { content:""; display:block; width:2px; height:22px; margin:4px auto 0; background:var(--ink2); }
.band .mk.now { color:var(--ink); top:26px; display:flex; flex-direction:column-reverse; align-items:center; } .band .mk.now::after { width:14px; height:14px; border-radius:50%; background:var(--gold); border:3px solid var(--white); box-shadow:0 2px 8px rgba(28,23,18,.25); margin:0 auto 4px; height:14px; }
.band .lbl { position:absolute; top:48px; font:500 11px Inter, sans-serif; color:var(--ink2); }
.band .lbl.l { left:0; } .band .lbl.r { right:0; }

/* ── the tree ── */
.tree { position:relative; }
.purse { display:flex; align-items:center; gap:14px; background:var(--ink); color:#fff; border-radius:20px; padding:14px 18px; width:max-content; max-width:100%; margin:0 auto 26px; box-sizing:border-box; position:relative; }
.purse::after { content:""; position:absolute; left:50%; top:100%; width:2px; height:18px; background:rgba(28,23,18,.25); }
.purse .k { font:600 10px Inter, sans-serif; letter-spacing:.14em; text-transform:uppercase; opacity:.7; }
.purse .v { font:700 14px Inter, sans-serif; }
.purse .ico { width:36px; height:36px; border-radius:10px; background:var(--gold); display:grid; place-items:center; color:var(--ink); font:900 16px Archivo, sans-serif; }
.estates { columns:340px; column-gap:14px; position:relative; border-top:2px solid rgba(28,23,18,.14); padding-top:16px; }
.estate { background:var(--paper); border-radius:22px; padding:14px 14px 12px; position:relative; min-width:0; break-inside:avoid; margin:0 0 14px; display:inline-block; width:100%; box-sizing:border-box; }
.estate .head { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.estate .sw { width:30px; height:30px; border-radius:9px; flex:none; box-shadow:inset 0 0 0 3px rgba(255,255,255,.7); }
.estate .nm { font:700 15px Inter, sans-serif; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.estate .sub { font:500 12px Inter, sans-serif; color:var(--ink2); }
.estate .val { margin-left:auto; text-align:right; }
.estate .val b { display:block; font-size:18px; }
.estate .val small { font:600 10px Inter, sans-serif; letter-spacing:.12em; text-transform:uppercase; color:var(--ink2); }
.chips { display:flex; flex-wrap:wrap; gap:5px; margin:0 0 10px; }
.chip { font:600 10px Inter, sans-serif; letter-spacing:.08em; text-transform:uppercase; background:var(--white); border-radius:999px; padding:4px 9px; color:var(--ink2); }
.chip b { color:var(--ink); font-weight:700; margin-left:3px; }
.agents { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:8px; }
.agent { background:var(--white); border-radius:14px; padding:10px 11px 9px; cursor:pointer; border:2px solid transparent; transition:transform .25s var(--ease), box-shadow .25s ease, border-color .25s ease; position:relative; min-width:0; }
.agent:hover { transform:translateY(-2px); box-shadow:0 10px 24px rgba(28,23,18,.12); }
.agent.live { border-color:var(--green); }
.agent.flash { animation:fl-flash 1.6s ease both; }
@keyframes fl-flash { 0% { background:#fff3dd; box-shadow:0 0 0 6px rgba(247,147,30,.35); } 100% { background:var(--white); box-shadow:none; } }
.agent .top { display:flex; align-items:center; justify-content:space-between; gap:6px; }
.agent .n { font:900 14px Archivo, Impact, sans-serif; letter-spacing:.02em; }
.st { display:inline-flex; align-items:center; gap:5px; font:600 9px Inter, sans-serif; letter-spacing:.1em; text-transform:uppercase; color:var(--ink2); white-space:nowrap; }
.st i { width:7px; height:7px; border-radius:50%; background:var(--ink2); }
.st.live { color:var(--green); } .st.live i { background:var(--green); animation:fl-ping 2s infinite; }
.st.watching i { background:var(--gold); }
.st.capped i { background:#b9ad98; }
.st.resting { color:var(--ink2); } .st.resting i { background:#8fb3d9; }
.st.expired { color:var(--red); } .st.expired i { background:var(--red); }
.mix { position:relative; height:8px; border-radius:6px; background:rgba(28,23,18,.1); margin:8px 0 6px; overflow:visible; }
.mix .fill { position:absolute; left:0; top:0; bottom:0; border-radius:6px; background:var(--gold); }
.mix .tgt { position:absolute; top:-3px; width:2px; height:14px; background:var(--ink); }
.agent .row { display:flex; justify-content:space-between; gap:6px; font:500 11px Inter, sans-serif; color:var(--ink2); white-space:nowrap; }
.agent .row b { color:var(--ink); font-weight:700; }
.cap { height:4px; border-radius:4px; background:rgba(28,23,18,.08); margin-top:6px; overflow:hidden; }
.cap i { display:block; height:100%; background:var(--ink2); }

/* ── two columns: the feed beside the floor ── */
.cols { display:grid; grid-template-columns:minmax(0, 1fr) 380px; gap:16px; align-items:start; }
.feed { max-height:720px; overflow:auto; overscroll-behavior:contain; margin:0 -8px; padding:0 8px; }
.ev { display:grid; grid-template-columns:auto 1fr auto; gap:6px 10px; align-items:baseline; padding:9px 0; border-bottom:1px solid rgba(28,23,18,.07); font:500 13px Inter, sans-serif; }
.ev.new { animation:fl-flash 1.6s ease both; border-radius:10px; }
.ev .side { font:700 10px Inter, sans-serif; letter-spacing:.1em; text-transform:uppercase; border-radius:999px; padding:3px 8px; background:var(--paper); color:var(--ink2); }
.ev .side.buy { background:#e6f2e3; color:var(--green); } .ev .side.sell { background:#fdebd9; color:#a75f0a; } .ev .side.on { background:var(--ink); color:#fff; }
.ev .who { font-weight:700; } .ev .who small { font-weight:500; color:var(--ink2); margin-left:4px; }
.ev .why { grid-column:2 / -1; color:var(--ink2); font-size:12px; line-height:1.4; }
.ev .amt { text-align:right; font-variant-numeric:tabular-nums; }
.ev .when { grid-column:1; font:500 11px Inter, sans-serif; color:var(--ink2); }
.ev a { color:var(--ink2); font-size:11px; text-decoration:none; border-bottom:1px solid var(--gold); }
.words { background:var(--paper); border-radius:14px; padding:10px 12px; max-height:220px; overflow:auto; font:500 11.5px/1.5 ui-monospace, Menlo, Consolas, monospace; color:var(--ink2); white-space:pre-wrap; overflow-wrap:anywhere; }

/* ── fees, rules ── */
.kv { display:grid; grid-template-columns:auto 1fr; gap:6px 14px; font-size:14px; }
.kv span:nth-child(odd) { white-space:nowrap; color:var(--ink2); }
.kv span:nth-child(even) { text-align:right; font-variant-numeric:tabular-nums; font-weight:700; }
.rules li { margin:0 0 6px; color:var(--ink2); } .rules li b { color:var(--ink); }

/* ── the deed: one agent, opened ── */
#veil { position:fixed; inset:0; z-index:50; background:rgba(28,23,18,.45); backdrop-filter:blur(4px); display:none; align-items:center; justify-content:center; padding:20px; }
#veil.on { display:flex; animation:fl-fade .3s ease both; }
@keyframes fl-fade { from { opacity:0; } to { opacity:1; } }
.deed { width:min(860px, 100%); max-height:calc(100vh - 40px); overflow:auto; overscroll-behavior:contain; background:var(--white); border-radius:26px; box-shadow:0 30px 80px rgba(28,23,18,.35); padding:24px 26px; box-sizing:border-box; }
.deed .top { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.deed .top h2 { margin:0; font-size:24px; }
.deed .x { margin-left:auto; width:40px; height:40px; border-radius:50%; border:2px solid var(--ink); background:var(--white); font:700 16px Inter, sans-serif; cursor:pointer; }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.box { background:var(--paper); border-radius:16px; padding:14px 16px; min-width:0; }
table.pos { width:100%; border-collapse:collapse; font-size:13.5px; }
table.pos th { text-align:left; font:600 10px Inter, sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--ink2); padding:4px 6px; border-bottom:1px solid rgba(28,23,18,.12); }
table.pos td { padding:5px 6px; border-bottom:1px solid rgba(28,23,18,.07); font-variant-numeric:tabular-nums; }
table.pos td:not(:first-child) { text-align:right; }
.btnrow { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.btn { display:inline-flex; align-items:center; font:600 13px Inter, sans-serif; color:var(--ink); background:var(--white); border:2px solid var(--ink); border-radius:999px; padding:8px 14px; text-decoration:none; cursor:pointer; }
.btn:hover { background:var(--gold); }
.empty { padding:40px 20px; text-align:center; color:var(--ink2); }

@media (max-width:1000px) { .cols { grid-template-columns:1fr; } .wave { grid-template-columns:1fr; } .feed { max-height:520px; } }
@media (max-width:700px) {
  main { padding:86px 12px 40px; }
  .sheet { padding:18px 16px; border-radius:22px; }
  .gnav { top:10px; left:10px; right:10px; } .gnav .pill { padding:6px 6px 6px 14px; } .gnav .mark { font-size:15px; gap:8px; } .gnav .mark img { width:26px; height:26px; } .gnav .mark small, .gnav .live span { display:none; }
  .gnav .cta { font-size:13px; padding:7px 12px 7px 7px; gap:7px; } .gnav .cta .ico { width:22px; height:22px; font-size:11px; }
  .figures { grid-template-columns:1fr 1fr; } .fig b { font-size:22px; }
  .estates { columns:1; } .agents { grid-template-columns:repeat(auto-fill, minmax(140px, 1fr)); } .agent .row { white-space:normal; }
  .gnav .live { display:none; }
  .grid2 { grid-template-columns:1fr; } .deed { padding:18px 16px; border-radius:22px; }
  .purse { width:100%; }
}
@media (prefers-reduced-motion: reduce) { .sheet, .agent.flash, .ev.new { animation:none; } .gnav .live i, .st.live i { animation:none; } }

/* ── the page: the summary across the top, the floor and the feed side by side beneath ── */
main { display:grid; grid-template-columns:minmax(0, 1fr) 380px; grid-template-areas:"l l" "c r" "s s"; column-gap:16px; align-items:start; }
#col-l { grid-area:l; } #col-c { grid-area:c; min-width:0; } #col-r { grid-area:r; min-width:0; } #stamp { grid-area:s; }
#col-l { display:grid; grid-template-columns:repeat(auto-fit, minmax(420px, 1fr)); column-gap:16px; align-items:start; }
#col-l > .sheet:first-child { grid-column:1 / -1; }
@media (max-width:1000px) { main { grid-template-columns:1fr; grid-template-areas:"l" "c" "r" "s"; } #col-l { grid-template-columns:1fr; } }

/* ── the board: everything at once, three columns, each scrolling on its own ── */
.gnav .lay { font:600 13px Inter, sans-serif; color:var(--ink); background:var(--white); border:2px solid var(--ink); border-radius:999px; padding:8px 14px; cursor:pointer; white-space:nowrap; margin-left:auto; }
.gnav .lay:hover { background:var(--gold); }
.gnav .lay[hidden] { display:none; }
body.board { height:100vh; overflow:hidden; padding-bottom:0; }
body.board .gnav .pill { max-width:none; }
body.board main { max-width:none; height:100vh; box-sizing:border-box; padding:84px 16px 14px; grid-template-columns:minmax(330px, 390px) minmax(0, 1fr) minmax(330px, 410px); grid-template-areas:"l c r"; grid-template-rows:minmax(0, 1fr); align-items:stretch; }
body.board #col-l, body.board #col-c, body.board #col-r { display:block; overflow-y:auto; overscroll-behavior:contain; min-height:0; padding:0 4px 20px; margin:0 -4px; scrollbar-width:thin; scrollbar-color:rgba(28,23,18,.25) transparent; }
body.board #col-l::-webkit-scrollbar, body.board #col-c::-webkit-scrollbar, body.board #col-r::-webkit-scrollbar { width:6px; }
body.board #col-l::-webkit-scrollbar-thumb, body.board #col-c::-webkit-scrollbar-thumb, body.board #col-r::-webkit-scrollbar-thumb { background:rgba(28,23,18,.25); border-radius:6px; }
body.board #stamp { display:none; }
body.board .sheet { padding:20px 20px; border-radius:24px; }
body.board h1 { font-size:40px; }
body.board .lede { font-size:14px; }
body.board .figures { grid-template-columns:1fr 1fr; gap:10px; margin-top:16px; }
body.board .fig { padding:12px 13px 10px; } body.board .fig b { font-size:22px; }
body.board .wave { grid-template-columns:1fr; gap:14px; }
body.board .feed { max-height:none; overflow:visible; }
body.board .words { max-height:340px; }
body.board .kv { font-size:13px; }
body.board .estates { columns:300px; }

/* the kind of agent on a tile, when it is not the market maker (19 Sep 2026) */
.agent .top .n small.kind { font:600 9px Inter, sans-serif; letter-spacing:.08em; text-transform:uppercase; color:var(--ink2); margin-left:4px; }

/* two anchors close together: the last sell's label sits a row higher (19 Sep 2026) */
.band { margin-top:18px; }
.band .mk.up { top:-18px; }
.band .mk.up::after { height:40px; }

/* ── the book: buy pressure against sell pressure (19 Sep 2026) ── */
.pnums { display:grid; grid-template-columns:1fr auto 1fr; gap:12px; align-items:end; }
.pn small { display:block; font:600 10px Inter, sans-serif; letter-spacing:.12em; text-transform:uppercase; color:var(--ink2); }
.pn b { display:block; font:900 30px/1.1 Archivo, Impact, sans-serif; letter-spacing:-.01em; }
.pn b em { font:600 12px Inter, sans-serif; font-style:normal; margin-left:4px; color:var(--ink2); }
.pn span { font:500 12px Inter, sans-serif; color:var(--ink2); }
.pn.buy b { color:#2f7a2c; } .pn.sell { text-align:right; } .pn.sell b { color:#c8601f; } .pn.mid { text-align:center; }
.pbar { display:flex; height:16px; border-radius:999px; overflow:hidden; background:var(--paper2, #e6dfcd); margin:12px 0 6px; }
.pbar i { display:block; height:100%; transition:width .6s ease; }
.pbar .b.rd { background:#2f7a2c; } .pbar .s.rd { background:#e8781f; }
.pbar .b.wt { background:repeating-linear-gradient(135deg, rgba(47,122,44,.55) 0 6px, rgba(47,122,44,.25) 6px 12px); }
.pbar .s.wt { background:repeating-linear-gradient(135deg, rgba(232,120,31,.55) 0 6px, rgba(232,120,31,.25) 6px 12px); }
.p24 { display:flex; justify-content:space-between; font:500 12px Inter, sans-serif; color:var(--ink2); }
.book { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px; }
.bside h3 { font:900 14px Archivo, Impact, sans-serif; text-transform:uppercase; letter-spacing:.04em; margin:0 0 8px; display:flex; justify-content:space-between; }
.bside h3 span { font:600 12px Inter, sans-serif; color:var(--ink2); }
.bside.buy h3 { color:#2f7a2c; } .bside.sell h3 { color:#c8601f; }
.bk { display:grid; grid-template-columns:52px 1fr auto; grid-template-rows:auto auto; column-gap:8px; padding:7px 10px; margin:0 0 5px; border-radius:12px; background:var(--white, #fff); cursor:pointer; font:500 12px Inter, sans-serif; border-left:4px solid transparent; transition:transform .15s ease; }
.bk:hover { transform:translateX(2px); }
.bk b { font:800 13px Inter, sans-serif; grid-row:1 / 3; align-self:center; }
.bk .kd { color:var(--ink2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bk .u { font-weight:700; text-align:right; }
.bk .at { grid-column:2 / 4; color:var(--ink2); font-size:11.5px; }
.bk.buy { border-left-color:rgba(47,122,44,.35); } .bk.sell { border-left-color:rgba(232,120,31,.35); }
.bk.buy.rd { border-left-color:#2f7a2c; background:#eef6e8; } .bk.sell.rd { border-left-color:#e8781f; background:#fdf0e3; }
.bk.rd .at { color:var(--ink); font-weight:700; }
.bside .more { margin-top:4px; width:100%; }
@media (max-width:700px) { .pnums { grid-template-columns:1fr 1fr; } .pn.mid { grid-column:1 / -1; order:-1; } .pn b { font-size:24px; } .book { grid-template-columns:1fr; } }
.bside .more { font:600 12px Inter, sans-serif; background:var(--white, #fff); border:2px solid var(--ink, #1c1712); border-radius:999px; padding:7px 12px; cursor:pointer; }
.bside .more:hover { background:var(--ink, #1c1712); color:#fff; }
/* the heading splits over its two sides: buy pressure over the buyers, sell pressure over the sellers */
h2.bookh { display:flex; justify-content:space-between; gap:12px; }
h2.bookh .b { color:#2f7a2c; } h2.bookh .s { color:#c8601f; text-align:right; }
.pn.buy, .pn.sell { align-self:end; }

/* ── while a panel reads: a shimmer in the shape of what is coming, instead of the word "reading" ── */
.skel { border-radius:14px; margin:0 0 10px; background:linear-gradient(100deg, rgba(28,23,18,.05) 30%, rgba(28,23,18,.10) 45%, rgba(28,23,18,.05) 60%); background-size:240% 100%; animation:skel 1.4s linear infinite; }
@keyframes skel { from { background-position:160% 0; } to { background-position:-60% 0; } }
/* a figure whose number moved says so once, quietly */
.fig.moved b, .pn.moved b { animation:figmove .9s var(--ease, cubic-bezier(.2,.8,.2,1)) 1; }
@keyframes figmove { 0% { transform:translateY(-6px); opacity:.35; } 60% { transform:translateY(0); opacity:1; } }
.fig.moved::after { content:""; position:absolute; inset:-6px -8px; border-radius:14px; background:rgba(247,147,30,.16); animation:figflash .9s ease-out 1; pointer-events:none; }
.fig { position:relative; }
@keyframes figflash { from { opacity:1; } to { opacity:0; } }
@media (prefers-reduced-motion: reduce) { .skel { animation:none; } .fig.moved b, .pn.moved b, .fig.moved::after { animation:none; } .fig.moved::after { display:none; } }

/* one slow sweep of gold across the main button, so the eye finds it without a glow (20 Sep 2026) */
.sweep { position:relative; overflow:hidden; }
.sweep::after { content:""; position:absolute; top:0; bottom:0; width:38%; left:-45%; background:linear-gradient(100deg, transparent, rgba(247,147,30,.5), transparent); animation:sweep 5.5s ease-in-out infinite; pointer-events:none; }
@keyframes sweep { 0%, 62% { left:-45%; } 88%, 100% { left:115%; } }
@media (prefers-reduced-motion: reduce) { .sweep::after { display:none; } }

/* ── the live line: $OMEN as the floor reads it, a point a minute (20 Sep 2026) ── */
.lchart { position:relative; margin:14px 0 6px; }
.lchart canvas { width:100%; height:150px; display:block; cursor:crosshair; }
/* the last point's halo. It used to be drawn on the canvas, which meant redrawing the whole chart
   seven times a second to animate one dot; here it is one composited element and costs nothing. */
.lbeat { position:absolute; width:10px; height:10px; margin:-5px 0 0 -5px; border-radius:50%;
  background:rgba(247,147,30,.38); pointer-events:none; animation:lbeat 1.8s ease-in-out infinite; }
@keyframes lbeat { 0%,100% { transform:scale(1); opacity:.45; } 50% { transform:scale(2.1); opacity:.12; } }
@media (prefers-reduced-motion: reduce) { .lbeat { animation:none; } }
.lread { position:absolute; top:0; transform:translateX(-50%); background:var(--ink); color:#fff; border-radius:10px; padding:5px 9px; font:600 11.5px Inter, sans-serif; white-space:nowrap; pointer-events:none; box-shadow:0 8px 20px rgba(28,23,18,.25); }
.lrange { display:flex; justify-content:space-between; font:600 10px Inter, sans-serif; letter-spacing:.1em; text-transform:uppercase; color:var(--ink2); margin-top:2px; }

/* ── a vault as a ring: its mix, its target, and the day's share traded ── */
.ringrow { display:flex; gap:18px; align-items:center; margin:0 0 14px; flex-wrap:wrap; }
.ring { width:132px; height:132px; flex:none; }
.ring .rv { font:900 27px Archivo, Impact, sans-serif; fill:var(--ink); }
.ring .rk { font:600 10px Inter, sans-serif; letter-spacing:.14em; fill:var(--ink2); text-transform:uppercase; }
.ringkey { font:500 12.5px/1.7 Inter, sans-serif; color:var(--ink2); min-width:180px; }
.ringkey i { display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:8px; vertical-align:-1px; }
.ringkey .k1 { background:#f7931e; } .ringkey .k2 { background:rgba(28,23,18,.14); } .ringkey .k3 { background:#1c1712; border-radius:50%; } .ringkey .k4 { background:#2f7a2c; }

/* ── numflow: a digit is a column of 0-9 that slides (20 Sep 2026) ── */
.nf { white-space:nowrap; }   /* no display change: the element keeps whatever it was, table cell included */
.nf .nf-col { display:inline-block; overflow:hidden; height:1.06em; line-height:1.06em; vertical-align:bottom; }
.nf .nf-roll { display:block; transition:transform .62s cubic-bezier(.2,.85,.25,1); will-change:transform; }
.nf .nf-roll > span { display:block; height:1.06em; line-height:1.06em; font-variant-numeric:tabular-nums; }
.nf .nf-fix { display:inline-block; height:1.06em; line-height:1.06em; vertical-align:bottom; }
@media (prefers-reduced-motion: reduce) { .nf .nf-roll { transition:none; } }

/* ── micro-transitions on the floor ── */
:root { --micro: 180ms cubic-bezier(.2,.8,.2,1); }
.agent, .bk, .btn, .cta, .more, .lay { transition:transform var(--micro), background var(--micro), box-shadow var(--micro), border-color var(--micro); }
.agent:hover { transform:translateY(-2px); box-shadow:0 10px 24px rgba(28,23,18,.12); }
.cta:active, .btn:active, .more:active { transform:scale(.975); }
a:focus-visible, button:focus-visible { outline:3px solid var(--gold); outline-offset:2px; border-radius:12px; }
@media (prefers-reduced-motion: reduce) { .agent:hover { transform:none; } }

/* ══ the pool, live (24 Sep 2026): the Liveline-style trading chart, floor-tape.js ══ */
.tp-head { display:flex; align-items:flex-end; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.tp-price { display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; min-width:0; }
.tp-price .tp-k { flex-basis:100%; font:600 11px Inter, sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--ink2); }
.tp-price b { font:900 34px/1 Archivo, Impact, sans-serif; font-stretch:112%; letter-spacing:-.01em; }
.tp-sol { font:600 13px Inter, sans-serif; color:var(--ink2); }
.tp-chg { font:700 13px Inter, sans-serif; padding:3px 9px; border-radius:999px; }
.tp-chg.up { color:var(--green); background:rgba(47,122,44,.1); } .tp-chg.dn { color:var(--red); background:rgba(200,55,31,.1); }
.tp-seg { display:inline-flex; background:var(--paper); border-radius:999px; padding:3px; gap:2px; }
.tp-seg button { border:0; background:transparent; font:700 12px Inter, sans-serif; padding:6px 12px; border-radius:999px; cursor:pointer; color:var(--ink); }
.tp-seg button.on { background:var(--ink); color:#fff; }
.tp-chips { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:14px 0 8px; }
.tp-chips button { display:inline-flex; align-items:center; gap:6px; border:1.5px solid rgba(28,23,18,.18); background:var(--white); border-radius:999px; font:600 12px Inter, sans-serif; padding:5px 11px; cursor:pointer; color:var(--ink2); transition:all .2s var(--ease, ease); }
.tp-chips button.on { border-color:var(--ink); color:var(--ink); }
.tp-chips button:not(.on) { opacity:.55; }
.tp-count { margin-left:auto; font:500 12px Inter, sans-serif; }
.tp-chips i, .tp-legend i { width:10px; height:10px; border-radius:50%; display:inline-block; }
.c-agent { background:#fff; box-shadow:inset 0 0 0 2.4px var(--green); }
.c-holder { background:var(--green); } .c-project { background:var(--green); box-shadow:0 0 0 2px var(--ink); } .c-trader { background:rgba(47,122,44,.35); }
.c-comment { border-radius:3px !important; background:#fff; box-shadow:inset 0 0 0 1.5px var(--ink); }
.c-buy { background:var(--green); } .c-sell { background:var(--red); }
.tp-chart { position:relative; height:340px; margin:4px -4px 0; touch-action:pan-y; }
.tp-chart canvas { display:block; width:100%; height:100%; cursor:crosshair; }
.tp-beat { position:absolute; width:12px; height:12px; margin:-6px 0 0 -6px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 0 rgba(247,147,30,.55); animation:tp-beat 1.6s infinite; pointer-events:none; }
@keyframes tp-beat { 0% { box-shadow:0 0 0 0 rgba(247,147,30,.55); } 70% { box-shadow:0 0 0 14px rgba(247,147,30,0); } 100% { box-shadow:0 0 0 0 rgba(247,147,30,0); } }
.tp-empty[hidden] { display:none; }
.tp-empty { position:absolute; inset:0; display:grid; place-items:center; font:600 13px Inter, sans-serif; color:var(--ink2); }
.tp-tip { position:absolute; z-index:3; width:max-content; max-width:300px; background:var(--white); border-radius:14px; box-shadow:0 12px 34px rgba(28,23,18,.2); padding:10px 12px; font:500 12.5px/1.4 Inter, sans-serif; pointer-events:none; animation:fl-fade .15s ease; }
.tp-tip .tt-k { font:800 13px Inter, sans-serif; } .tp-tip .tt-k.up { color:var(--green); } .tp-tip .tt-k.dn { color:var(--red); }
.tp-tip .tt-w { font-weight:700; margin-top:2px; } .tp-tip .tt-c { margin-top:4px; } .tp-tip .tt-d, .tp-tip .tt-l { margin-top:4px; color:var(--ink2); font-size:11.5px; }
.tp-legend { display:flex; flex-wrap:wrap; gap:6px 14px; font:500 11.5px Inter, sans-serif; margin-top:6px; }
.tp-legend span { display:inline-flex; align-items:center; gap:5px; }
.tp-say { margin-top:16px; border-top:1px solid rgba(28,23,18,.08); padding-top:14px; }
.tp-form { display:flex; gap:8px; }
.tp-form input { flex:1; min-width:0; border:2px solid var(--paper2); border-radius:12px; background:var(--white); font:500 14px Inter, sans-serif; height:40px; padding:0 12px; }
.tp-form input:focus { border-color:var(--ink); outline:0; }
.tp-post { border:0; background:var(--ink); color:#fff; font:700 13px Inter, sans-serif; border-radius:999px; padding:0 16px; height:40px; cursor:pointer; white-space:nowrap; }
.tp-post:disabled { opacity:.5; }
.tp-note { font:500 12px Inter, sans-serif; margin-top:6px; } .tp-note.bad { color:var(--red); }
.tp-list { margin-top:10px; display:grid; gap:8px; max-height:260px; overflow:auto; }
.tp-c { background:var(--paper); border-radius:12px; padding:8px 12px; font:500 13px/1.45 Inter, sans-serif; animation:fl-rise .35s ease both; }
.tp-none { font-size:13px; }
@media (max-width:700px) { .tp-chart { height:250px; } .tp-price b { font-size:28px; } .tp-count { margin-left:0; flex-basis:100%; } }
/* a comment's GIF (24 Sep 2026) */
.tp-gif { display:block; max-width:min(220px, 100%); max-height:160px; border-radius:10px; margin-top:6px; }
.tp-tip .tt-gif { display:block; max-width:200px; max-height:130px; border-radius:8px; margin-top:6px; }
/* the GIF picker (24 Sep 2026) */
.tp-gifbtn { border:2px solid var(--ink); background:var(--white); color:var(--ink); font:900 12px Archivo, sans-serif; letter-spacing:.06em; border-radius:999px; padding:0 14px; height:40px; cursor:pointer; }
.tp-gifbtn[aria-expanded="true"] { background:var(--gold); }
.tp-gifs[hidden] { display:none; }
.tp-gifs { margin-top:10px; background:var(--paper); border-radius:14px; padding:10px; animation:fl-rise .25s ease both; }
.tp-gifs input { width:100%; box-sizing:border-box; border:2px solid var(--paper2); border-radius:10px; height:36px; padding:0 10px; font:500 13px Inter, sans-serif; margin-bottom:8px; }
.tp-gtags { display:flex; gap:6px; overflow-x:auto; padding-bottom:6px; scrollbar-width:thin; }
.tp-gtags button { flex:none; border:1.5px solid rgba(28,23,18,.18); background:var(--white); border-radius:999px; font:600 12px Inter, sans-serif; padding:5px 10px; cursor:pointer; white-space:nowrap; }
.tp-gtags button.on { background:var(--ink); color:#fff; border-color:var(--ink); }
.tp-ggrid { display:grid; grid-template-columns:repeat(auto-fill, minmax(96px, 1fr)); gap:6px; max-height:260px; overflow:auto; margin-top:4px; }
.tp-ggrid img { width:100%; height:84px; object-fit:cover; border-radius:8px; cursor:pointer; background:var(--paper2); transition:transform .15s ease; }
.tp-ggrid img:hover, .tp-ggrid img:focus { transform:scale(1.04); outline:2px solid var(--gold); }
.tp-gnote { font:500 11px Inter, sans-serif; margin-top:8px; }