igneum-network/igneum
1
0
Fork 0
Code Issues Pull requests Releases Activity
igneum/site/site.css
igneum-josh 693a0e0ada site-ui-5: the padding and visuals sweep (7 October 2026, 17:xx UK): the /wallet band's padding, tools/ci/padding-check.mjs in the gate, every finding fixed in site.css, the eye pass 
Josh: the ember band on /wallet had no vertical padding (the heading on the band's top edge, the button on its bottom), then
"run a full site sweep for padding and visuals".

- The band: .band .wrap carried the padding and the three bands use .container; both selectors now, 56 px (40 on phones), and
  24 px at the sides on phones.
- tools/ci/padding-check.mjs: renders every served page at 390, 768, 1024, 1440 and 1600 in both themes and flags TIGHT (text or
  a control under 24 px from the edge of the filled band, card or section that holds it; rows of radius 12 and under are the
  app's compact rows and keep their own padding; small filled things such as buttons, pills, badges, tabs, cells and the bar are
  never containers), SCALE (a section's vertical padding not 0 and not a multiple of 4 from 24), TOUCH (controls under 6 px
  apart outside segmented groups), OVERRUN (an image or canvas past its frame) and UNDER-BAR (a heading under the sticky bar on
  load, an anchor the bar would cover). --self-test builds the fixture from the site's own stylesheet and bar with the exact
  /wallet band with its padding lost, a touching pair, an image over its frame and a heading under the bar; each must fail,
  the clean twin must pass. A gate line runs it (self-test, then the built site); where no browser exists it says so.
- Findings fixed (first run 2,740, then 1,040, then 48, now 0 at 230 renders): page heroes 64/48 (were 65/45), the
  observatory head and the 404 the same, the footer's bottom 24, doc sections and the litepaper's 40 (were 42), .sec 72 at
  tablet (was 70), the 404 card 36, /live's motion block 24 (was 25), the scenes lab 48 (was 50); every card at 24 inside
  (download cards, home tiles, the live tiles and stats, the evidence labels, the wallet state cards, the journey phases, the
  live inspector and toolbar, the download card on phones).
- The eye pass over every page at 1440 and 390 dark: the journey's phases are cards now, so the old timeline rail and marker
  (drawn for an unboxed list, sitting on the card's top border) go and the when column keeps clear of the body; tables keep
  words whole (break-word, not anywhere: "regenerat es" on the litepaper) and give the label column 14ch (one word per line on
  /randomx); the litepaper's body paragraphs share one measure; the ledger's count-table chips stay on one line; orphan words
  go through text-wrap: pretty on body text (copy law 18, "measurement." alone on /claims); the dev-fee page lost its doubled
  gutter (a lifted section keeps its own .container) and its table clears the text above; /faucet and /metamask keep a gap
  between headline and lead, line their two cards up at the top and end 72 px above the footer; a heading after a card grid
  gets 40 px.
- The overlap sweep at the same five widths and both themes: 0 overlaps at 290 renders.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
2026-10-07 17:30:58 +01:00

559 lines
90 KiB
CSS
Raw Blame History

/* Igneum site: the full-site redesign package's design system (7 Oct 2026, "match it 1:1"), its tokens, type, chrome and
components as delivered, with three changes: the fonts are self-hosted (declared in partials/head.html, no Google Fonts),
the text tokens --ember-text and --molten-text exist for contrast on light surfaces, and a compatibility layer at the end
restates the vocabulary our data pages still use (.wrap, .sec, .card, .tbl, .tile, .frame, .lines, .band, states, scenes). */
/* ---------- 1. tokens (the package's) ---------- */
/* scene-tokens:start (scene/tokens.css, written by tools/scene/sync.mjs; edit the source, never this block) */
:root{--obsidian:#0C0C0E;--graphite:#16161A;--row:#111114;--line:#2A2A30;--line-2:#3A3A42;--ember:#F2541B;--ember-hi:#FF6A2B;--molten:#FFB35C;--bone:#F4F1EC;--ink-2:#C9C7C2;--ash:#9A9A9E;--included:#3B7DD8;--excluded:#B0362B;--ember-ink:#0C0C0E}
:root[data-theme="light"]{--obsidian:#F4F1EC;--graphite:#FFFFFF;--row:#FAF8F5;--line:#E2DED8;--line-2:#CFCAC2;--ember:#D0420D;--ember-hi:#E04A14;--molten:#B8731F;--bone:#16161A;--ink-2:#3C3C42;--ash:#6B6B70;--included:#2A62B8;--excluded:#B0362B;--ember-ink:#FFFFFF}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]){--obsidian:#F4F1EC;--graphite:#FFFFFF;--row:#FAF8F5;--line:#E2DED8;--line-2:#CFCAC2;--ember:#D0420D;--ember-hi:#E04A14;--molten:#B8731F;--bone:#16161A;--ink-2:#3C3C42;--ash:#6B6B70;--included:#2A62B8;--excluded:#B0362B;--ember-ink:#FFFFFF}}
/* scene-tokens:end */
:root{color-scheme:dark;--glass:rgba(12,12,14,.93);--ember-tint:rgba(242,84,27,.09);--shadow:0 24px 80px #0005;--sans:'IBM Plex Sans','Plex Sans Fallback',Arial,sans-serif;--display:'Unbounded','Unbounded Fallback','Arial Black',Arial,sans-serif;--mono:'IBM Plex Mono','Plex Mono Fallback',ui-monospace,monospace;--max:1280px;
--ember-text:#F2541B;--molten-text:#FFB35C;
/* aliases for the page blocks written before the redesign (7 Oct 2026): fonts, type steps, space, radii, chrome */
--f-sans:var(--sans);--f-display:var(--display);--f-mono:var(--mono);
--t-xs:11px;--t-sm:12px;--t-base:15px;--t-md:17px;--t-lg:19px;--t-h3:19px;
--t-h2:clamp(26px,3.05vw,42px);--t-h1:clamp(38px,5.2vw,70px);--t-hero:clamp(38px,5.2vw,70px);--t-num:clamp(26px,3vw,40px);
--s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:24px;--s-6:32px;
--gutter:36px;--sec:100px;--nav-h:113px;
--r-card:16px;--r-row:12px;--r-btn:8px;--r-pill:5px;
--top-bg:var(--glass);--ember-12:var(--ember-tint);--ember-40:color-mix(in srgb,var(--ember) 40%,transparent);--molten-10:color-mix(in srgb,var(--molten) 10%,transparent);
--scrim:rgba(12,12,14,.72);--hover:rgba(255,255,255,.04);--ok:var(--molten);
--ground:var(--obsidian);--surface:var(--graphite);--surface-2:var(--row);--ink:var(--bone);--quiet:var(--ash);
--ui-bg:var(--glass);--ui-menu:var(--obsidian);--ui-ink:var(--bone);--ui-ink-2:var(--ink-2);--ui-ash:var(--ash);--ui-line:var(--line);--ui-line-2:var(--line-2);
--ui-accent:var(--ember);--ui-accent-ink:var(--ember-ink);--ui-hot:var(--molten);--ui-hover:var(--ember-hi);--ui-tint:var(--ember-tint);
--code:var(--row);--code-ink:var(--ink-2);
}
:root[data-theme="light"]{color-scheme:light;--glass:rgba(244,241,236,.95);--shadow:0 24px 70px #30201810;
--ember-text:#B8390C;--molten-text:#8F5810;
--scrim:rgba(244,241,236,.72);--hover:rgba(0,0,0,.04);--ok:var(--molten);
}
/* ---------- 2. the package's rules ---------- */
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:120px}body{margin:0;background:var(--obsidian);color:var(--bone);font:17px/1.6 var(--sans);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input,summary,select{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,canvas:focus-visible{outline:2px solid var(--ember);outline-offset:5px}::selection{color:var(--bone);background:var(--ember-tint)}[hidden]{display:none!important}img,svg,canvas{max-width:100%}h1,h2,h3,h4,p{margin:0}h1,h2,h3{font-family:var(--display);text-wrap:balance}h1{font-size:clamp(38px,5.2vw,70px);font-weight:900;line-height:1.12;letter-spacing:-.055em}h2{font-size:clamp(26px,3.05vw,42px);line-height:1.2;letter-spacing:-.035em;font-weight:700}h3{font-size:19px;line-height:1.4;letter-spacing:-.02em;font-weight:700}h4{font-size:17px;font-weight:600}p{text-wrap:pretty}p+p{margin-top:15px}.container{max-width:var(--max);margin:auto;padding:0 36px}.section{padding:100px 0}.section.compact{padding:64px 0}.muted{color:var(--ash)}.accent{color:var(--ember)}.molten{color:var(--molten)}.mono{font-family:var(--mono)}.eyebrow{display:flex;align-items:center;gap:10px;font:500 11px/1.7 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ash);margin-bottom:20px}.eyebrow .line{display:inline-block;width:24px;height:1px;background:var(--ember)}.eyebrow em{font-style:normal;color:var(--ember)}.lead{font-size:19px;line-height:1.65;color:var(--ink-2);max-width:53ch;margin-top:24px}.small{font-size:13px;color:var(--ash)}.rule{border-top:1px solid var(--line)}.pill{display:inline-flex;align-items:center;gap:8px;font:500 10px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--line-2);padding:7px 10px;border-radius:5px;white-space:nowrap}.pill.warm{color:var(--molten);border-color:color-mix(in srgb,var(--molten) 28%,transparent);background:color-mix(in srgb,var(--molten) 6%,transparent)}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--molten)}.icon{display:inline-block;width:20px;height:20px;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:48px;border:1px solid var(--line-2);background:var(--graphite);border-radius:8px;padding:13px 20px;font:700 12px/1.4 var(--display);letter-spacing:-.01em;transition:transform .2s,background .2s,border-color .2s}.btn:hover{border-color:var(--ash);transform:translateY(-2px)}.btn.primary{background:var(--ember);border-color:var(--ember);color:var(--ember-ink)}.btn.primary:hover{background:var(--ember-hi);border-color:var(--ember-hi)}.btn.ghost{background:transparent}.btn.small-btn{font:500 12px var(--sans);min-height:38px;padding:9px 12px}.btn.icon-btn{width:40px;height:40px;min-height:40px;padding:10px;border-color:transparent;background:transparent}.btn.icon-btn:hover{background:var(--graphite);border-color:var(--line)}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.text-link{display:inline-flex;align-items:center;gap:10px;color:var(--ink-2);font-size:14px;font-weight:500}.text-link:hover{color:var(--ember)}.text-link .icon{width:16px;height:16px}.skip{position:fixed;left:20px;top:-100px;z-index:100;background:var(--ember);color:var(--ember-ink);padding:12px}.skip:focus{top:15px}.statusbar{height:33px;border-bottom:1px solid var(--line);font:10px var(--mono);color:var(--ash);letter-spacing:.04em}.statusbar .container{height:100%;display:flex;align-items:center;justify-content:space-between;gap:15px}.statusbar .dev-label{color:var(--molten);margin-right:15px}.site-header,.nav{position:sticky;top:0;z-index:30;background:var(--glass);border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.nav-row{height:80px;display:flex;align-items:center;gap:36px}.logo{display:inline-flex;align-items:center;gap:10px;font:900 20px/1 var(--display);letter-spacing:.055em;flex-shrink:0}.logo .brand-mark{width:36px;height:36px;display:block}.logo .stop{color:#F2541B}.logo .word{font:inherit}.nav-links,.nav .links{display:flex;gap:27px;align-items:center;flex:1;justify-content:center}.nav-links>a,.nav .links>a,.nav-dropdown>summary{font-size:13px;color:var(--ink-2);white-space:nowrap}.nav-links>a:hover,.nav-links>a[aria-current=page],.nav .links>a:hover,.nav .links>a[aria-current=page]{color:var(--ember)}.nav-dropdown{position:relative}.nav-dropdown>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:7px}.nav-dropdown>summary::-webkit-details-marker{display:none}.nav-dropdown .icon{width:12px}.dropdown-body{position:absolute;top:34px;right:-55px;width:540px;padding:22px;background:var(--graphite);border:1px solid var(--line-2);border-radius:14px;box-shadow:var(--shadow);display:grid;grid-template-columns:1fr 1fr;gap:4px}.dropdown-body a{font-size:14px;padding:10px 12px;border-radius:6px}.dropdown-body a:hover{background:var(--row);color:var(--ember)}.dropdown-body a small{display:block;color:var(--ash);font-size:11px;font-family:var(--mono);margin-top:3px}.nav-controls{display:flex;align-items:center;gap:7px}.nav-controls .btn.primary,.nav .cta{font-size:11px;min-height:40px;padding:11px 15px}.mobile-toggle,.burger{display:none}.mobile-nav,.nav-sheet{padding:16px 25px 25px;border-top:1px solid var(--line);max-height:70vh;overflow:auto;grid-template-columns:1fr 1fr;gap:5px}.mobile-nav a,.nav-sheet a{padding:9px 5px;font-size:14px}.mobile-nav:not([hidden]),.nav.open .nav-sheet{display:grid}.hero{padding:76px 0 57px;overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:12px;min-height:510px}.hero-copy{position:relative;z-index:1;padding-bottom:16px}.hero-copy h1 .accent{display:inline-block}.hero-copy .lead{max-width:43ch}.hero-footnote{display:flex;align-items:center;gap:9px;margin-top:20px;font:10px/1.6 var(--mono);color:var(--ash)}.hero-footnote .icon{width:14px}.hero-scene{height:500px;position:relative;margin-right:-20px;isolation:isolate}.hero-scene:before{content:'';position:absolute;inset:20px -50px 0;background:radial-gradient(ellipse at 58% 48%,rgba(242,84,27,.075),transparent 65%);z-index:-1}.hero-scene canvas{display:block;width:100%;height:100%}.scene-corner{position:absolute;font:10px/1.5 var(--mono);color:var(--ash);letter-spacing:.05em;pointer-events:none}.scene-corner.tl{left:15px;top:22px}.scene-corner.tr{right:24px;top:22px;text-align:right}.scene-corner.bl{left:15px;bottom:84px}.scene-corner.br{right:24px;bottom:30px;text-align:right;max-width:calc(50% - 130px)}.scene-corner strong{display:block;color:var(--ink-2);font-weight:500;margin-bottom:4px}.scene-steps{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);display:flex;gap:5px;border:1px solid var(--line);padding:5px;border-radius:10px;background:var(--glass)}.scene-step{background:transparent;border:0;color:var(--ash);font:11px var(--mono);padding:9px 13px;border-radius:6px;white-space:nowrap}.scene-step[aria-pressed=true]{background:var(--ember-tint);color:var(--ember)}.scene-step:hover{color:var(--bone)}.hero-bottom{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);padding-top:25px;margin-top:26px;gap:28px}.principle{display:flex;gap:13px;align-items:flex-start}.principle .icon{color:var(--ember);width:17px;margin-top:2px}.principle strong{font-size:13px;font-weight:500;display:block}.principle small{font-size:11px;color:var(--ash);display:block;margin-top:4px}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:36px}.section-head h2{max-width:20ch}.section-head>p{color:var(--ash);max-width:40ch;font-size:16px}.section-head .eyebrow{margin-bottom:12px}.panel{background:var(--row);border:1px solid var(--line);border-radius:16px;overflow:hidden}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:21px 25px;border-bottom:1px solid var(--line)}.panel-head .eyebrow{margin:0}.panel-controls{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.panel-footer{display:flex;align-items:center;justify-content:space-between;padding:17px 25px;gap:12px;border-top:1px solid var(--line);font:10px/1.7 var(--mono);color:var(--ash)}.live-peek{position:relative}.live-peek canvas{display:block;height:280px;width:100%}.legend{display:flex;gap:17px;align-items:center;flex-wrap:wrap;font:10px var(--mono);color:var(--ash)}.legend i{display:inline-block;width:6px;height:6px;background:var(--ember);margin-right:6px}.legend .your{background:var(--molten)}.legend .included{background:var(--included)}.legend .excluded{background:var(--excluded)}.label-below{font-size:12px;color:var(--ash);margin-top:14px;display:flex;justify-content:space-between;gap:20px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.feature{position:relative;padding:30px 29px;background:var(--row);border:1px solid var(--line);border-radius:14px;overflow:hidden}.feature:after{content:'';position:absolute;width:75px;height:1px;top:0;left:29px;background:var(--ember);opacity:.7}.feature .number{font:11px var(--mono);color:var(--ember);margin-bottom:30px;display:flex;align-items:center;justify-content:space-between}.feature .number .icon{width:24px;height:24px;color:var(--ash)}.feature h3{margin-bottom:15px}.feature p{color:var(--ash);font-size:15px}.feature .text-link{margin-top:28px}.feature-graphic{height:120px;width:100%;margin:15px 0;display:flex;align-items:center;justify-content:center}.chip-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:5px;width:100%;max-width:260px;transform:perspective(400px) rotateX(30deg) rotateZ(-7deg)}.chip-grid i{display:block;height:10px;border:1px solid var(--line-2);border-radius:2px}.chip-grid i:nth-child(3n),.chip-grid i:nth-child(7n){background:var(--ember-tint);border-color:color-mix(in srgb,var(--ember) 50%,var(--line))}.split-section{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}.split-section .lead{font-size:17px}.split-section h2{max-width:19ch}.reward-bars{padding:32px}.reward-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.reward-row strong{font:700 38px var(--display);letter-spacing:-.04em}.reward-bar{height:12px;background:var(--graphite);display:flex;border-radius:3px;overflow:hidden;gap:3px;margin:24px 0}.reward-bar i:first-child{width:80%;background:var(--ember)}.reward-bar i:last-child{width:20%;background:var(--molten)}.reward-key{display:flex;justify-content:space-between;gap:25px;margin-top:26px;font-size:13px}.reward-key strong{display:block;margin-bottom:5px}.reward-key span{color:var(--ash)}.reward-note{margin-top:27px;border-top:1px solid var(--line);padding-top:20px;font:10px/1.8 var(--mono);color:var(--ash)}.mini-title{font:500 11px var(--mono);letter-spacing:.1em;text-transform:uppercase}.tag-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}.cta-band{position:relative;padding:58px;border:1px solid color-mix(in srgb,var(--ember) 35%,var(--line));border-radius:16px;background:linear-gradient(120deg,var(--ember-tint),transparent 70%);display:flex;align-items:center;justify-content:space-between;gap:40px;overflow:hidden}.cta-band h2{max-width:20ch}.cta-band p{color:var(--ash);font-size:15px;margin-top:15px;max-width:50ch}.cta-band .actions{margin:0;flex-shrink:0}.site-footer{padding:64px 0 25px;border-top:1px solid var(--line)}.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:50px}.footer-brand p{font-size:13px;color:var(--ash);margin:21px 0}.footer-column h4{font:500 10px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ash);margin-bottom:20px}.footer-column a{display:block;font-size:13px;margin:10px 0;color:var(--ink-2)}.footer-column a:hover{color:var(--ember)}.footer-bottom{margin-top:54px;border-top:1px solid var(--line);padding-top:22px;display:flex;justify-content:space-between;gap:20px;font:10px/1.8 var(--mono);color:var(--ash)}.footer-bottom p{max-width:82ch}.theme-group{display:flex;align-items:center;gap:3px;border:1px solid var(--line);padding:3px;border-radius:6px;align-self:flex-start}.theme-group button{background:none;border:0;border-radius:3px;font:10px var(--mono);padding:7px 10px;color:var(--ash)}.theme-group button[aria-pressed=true]{background:var(--graphite);color:var(--bone)}.page-hero{padding:65px 0 45px}.page-hero h1{font-size:clamp(36px,4.2vw,56px);max-width:22ch}.page-hero .lead{max-width:67ch;font-size:18px}.breadcrumb{font:10px var(--mono);color:var(--ash);margin-bottom:28px;display:flex;gap:12px}.breadcrumb a:hover{color:var(--ember)}.page-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px}.page-heading .actions{margin:0}.tabs{display:flex;gap:5px;border-bottom:1px solid var(--line);margin-top:24px;overflow-x:auto;scrollbar-width:thin}.tabs button,.tabs a{background:none;border:0;border-bottom:2px solid transparent;padding:14px 17px;color:var(--ash);font:500 13px var(--sans);white-space:nowrap}.tabs [aria-selected=true],.tabs [aria-current=page]{border-bottom-color:var(--ember);color:var(--bone)}.tabs button:hover{color:var(--bone)}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:24px;background:var(--row)}.stat{padding:22px 25px;border-right:1px solid var(--line)}.stat:last-child{border-right:0}.stat .key{font:10px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ash);margin-bottom:11px}.stat strong{font:700 clamp(21px,2.2vw,29px) var(--display);letter-spacing:-.04em}.stat .small{font-size:10px;font-family:var(--mono);margin-top:8px}.console-layout{display:grid;grid-template-columns:minmax(0,1fr) 295px;gap:18px}.dag-panel{position:relative}.dag-panel canvas{height:420px;display:block;width:100%;touch-action:pan-y}.dag-tip{position:absolute;left:0;top:65px;pointer-events:none;z-index:4;max-width:280px;overflow-wrap:anywhere;white-space:pre-line;border:1px solid var(--line-2);padding:11px 13px;background:var(--graphite);border-radius:8px;box-shadow:var(--shadow);font:10px/1.8 var(--mono)}.dag-tip b,.dag-tip span{display:block}.inspector{padding:22px}.inspector .eyebrow{font-size:10px;margin:0}.inspector canvas{width:100%;height:200px;display:block}.inspector h3{font-size:13px;word-break:break-all;margin-bottom:17px}.data-row{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font:11px var(--mono)}.data-row:last-child{border:0}.data-row span{color:var(--ash)}.data-row strong{font-weight:500;text-align:right}.shards{display:flex;gap:6px;margin:18px 0}.shard{flex:1;min-width:0;border:1px solid var(--line-2);border-radius:4px;padding:10px 0;text-align:center;font:9px var(--mono);color:var(--ash);background:var(--graphite)}.shard[data-state=verified]{border-color:var(--ember);color:var(--ember)}.shard[data-state=paid]{border-color:var(--molten);color:var(--molten)}.shard[data-state=proving]{background:var(--ember-tint);border-color:var(--ember);color:var(--ember)}.demo-controls{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:17px 0;color:var(--ash);font-size:12px}.demo-controls>div{display:flex;gap:7px;flex-wrap:wrap}.demo-controls .btn{font-family:var(--mono);font-size:10px;min-height:35px;padding:8px 11px}.tables-row{margin-top:25px}.table-wrap{overflow-x:auto;max-width:100%;border:1px solid var(--line);border-radius:12px;background:var(--row)}table{border-collapse:collapse;width:100%;text-align:left;font-size:13px}caption{text-align:left;padding:20px 22px;color:var(--ash);font:10px var(--mono);letter-spacing:.12em;text-transform:uppercase}th{font:500 10px/1.6 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--ash);padding:13px 22px;border-bottom:1px solid var(--line);white-space:nowrap}td{padding:15px 22px;border-bottom:1px solid var(--line);white-space:nowrap}tr:last-child td{border:0}tbody tr:hover{background:var(--graphite)}.table-button{border:0;background:none;color:var(--molten);padding:0;font:12px var(--mono);text-align:left}.table-button:hover{text-decoration:underline}.small-caption{font-size:12px;color:var(--ash);padding:13px 0}.badge{display:inline-block;padding:4px 7px;border:1px solid var(--line-2);border-radius:4px;font:10px var(--mono);color:var(--ink-2);white-space:nowrap}.badge.warm{border-color:color-mix(in srgb,var(--ember) 40%,transparent);color:var(--ember)}.badge.gold{border-color:color-mix(in srgb,var(--molten) 40%,transparent);color:var(--molten)}.events{padding:8px 21px}.event{display:flex;gap:15px;padding:15px 0;border-bottom:1px solid var(--line);align-items:flex-start;font-size:12px}.event:last-child{border:0}.event .icon{color:var(--ember);width:15px}.event p{line-height:1.5}.event time{display:block;font:9px var(--mono);color:var(--ash);margin-top:5px}.event-tag{font:9px var(--mono);margin-left:auto;color:var(--ash);white-space:nowrap}.source-note{font:10px/1.8 var(--mono);color:var(--ash);margin-top:22px;padding-left:12px;border-left:2px solid var(--line-2)}.source-note a{color:var(--ink-2);text-decoration:underline;text-underline-offset:3px}.source-note a:hover{color:var(--ember)}.download-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:52px;align-items:center}.app-window{border:1px solid var(--line-2);border-radius:15px;background:var(--row);box-shadow:var(--shadow);overflow:hidden}.window-top{height:43px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 17px;gap:5px;font:10px var(--mono);color:var(--ash)}.window-top i{width:6px;height:6px;background:var(--line-2);border-radius:50%}.window-top span{margin-left:auto;margin-right:auto}.app-inner{display:grid;grid-template-columns:100px 1fr;min-height:370px}.app-sidebar{padding:17px 11px;border-right:1px solid var(--line);font:10px var(--mono);color:var(--ash)}.app-sidebar div{padding:9px 7px;margin-bottom:4px}.app-sidebar div.on{color:var(--ember);background:var(--ember-tint);border-radius:4px}.app-content{padding:22px;min-width:0}.app-content .app-greeting{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.app-content .app-greeting strong{font:700 14px var(--display)}.app-content .app-greeting .pill{font-size:8px;padding:5px}.app-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}.app-stat{border:1px solid var(--line);border-radius:7px;padding:12px}.app-stat span{display:block;font:9px var(--mono);color:var(--ash);margin-bottom:8px}.app-stat strong{font:700 20px var(--display)}.app-content canvas{width:100%;height:145px;display:block}.app-bar{display:flex;justify-content:space-between;font:9px var(--mono);border:1px solid var(--line);padding:11px;border-radius:6px}.app-bar b{color:var(--molten);font-weight:400}.download-card{padding:27px}.download-card .tabs{margin-top:0}.download-card .tabs button{padding:12px 15px;flex:1}.platform-body{padding-top:24px}.platform-body .platform-title{display:flex;align-items:center;gap:15px;margin:10px 0 15px}.platform-title .icon{width:28px;height:28px}.platform-body h3{font-size:18px}.platform-body p{font-size:14px;color:var(--ash)}.platform-body .btn{width:100%;margin-top:26px}.download-detail{display:flex;justify-content:space-between;gap:15px;font:10px var(--mono);margin-top:15px;color:var(--ash)}.step-list{display:grid;gap:0}.step-item{display:grid;grid-template-columns:44px 1fr;gap:20px;padding:28px 0;border-top:1px solid var(--line)}.step-item .step-index{font:700 14px var(--display);color:var(--ember);border:1px solid var(--line-2);height:38px;width:38px;display:grid;place-items:center;border-radius:8px}.step-item h3{font-size:16px;margin-bottom:9px}.step-item p{font-size:15px;color:var(--ash)}.faq details{border-bottom:1px solid var(--line)}.faq summary{font-size:16px;font-weight:500;list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;padding:21px 0}.faq summary:after{content:'+';color:var(--ash);font:20px var(--mono)}.faq details[open] summary:after{content:'-';color:var(--ember)}.faq details p{padding-bottom:24px;color:var(--ash);font-size:15px;max-width:85ch}.faq details a{color:var(--ember)}.tools-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.tool-card{border:1px solid var(--line);border-radius:14px;padding:25px;transition:border-color .2s,transform .2s;background:var(--row)}.tool-card:hover{border-color:var(--line-2);transform:translateY(-3px)}.tool-card .icon{color:var(--ember);width:26px;height:26px;margin-bottom:22px}.tool-card h3{font-size:16px;margin-bottom:12px}.tool-card p{color:var(--ash);font-size:14px}.tool-card .text-link{margin-top:22px}.docs-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:55px;align-items:start}.doc-nav{position:sticky;top:112px;max-height:calc(100vh - 145px);overflow:auto;border-right:1px solid var(--line);padding-right:20px;scrollbar-width:thin}.doc-nav .eyebrow{margin-bottom:17px;font-size:10px}.doc-nav a{display:block;font-size:12px;color:var(--ash);padding:8px 10px;border-left:2px solid transparent}.doc-nav a:hover,.doc-nav a.active{color:var(--ember);background:var(--ember-tint);border-left-color:var(--ember)}.doc-body{max-width:810px;min-width:0}.doc-section{padding-bottom:42px;margin-bottom:42px;border-bottom:1px solid var(--line);scroll-margin-top:110px}.doc-section h2{font-size:27px;margin:0 0 22px}.doc-section h3{font-size:16px;margin:26px 0 13px}.doc-section p{color:var(--ink-2);font-size:16px;line-height:1.85}.doc-section .section-number{font:11px var(--mono);color:var(--ember);margin-bottom:13px}.doc-section li{color:var(--ink-2);font-size:15px;margin:9px 0}.doc-section .table-wrap{margin:25px 0}.doc-section td{white-space:normal;min-width:140px;font-size:13px}.doc-notice{background:var(--ember-tint);border:1px solid color-mix(in srgb,var(--ember) 25%,var(--line));border-radius:10px;padding:20px 24px;margin-bottom:35px;font-size:13px;color:var(--ink-2)}.doc-notice strong{display:block;color:var(--molten);margin-bottom:6px;font-weight:500}.doc-notice a{color:var(--ember);text-decoration:underline;text-underline-offset:3px}.searchbar{position:relative;display:flex;align-items:center;gap:12px;padding:12px 16px;border:1px solid var(--line-2);border-radius:8px;background:var(--row)}.searchbar .icon{width:17px;color:var(--ash)}.searchbar input{flex:1;min-width:0;border:0;outline:none;background:transparent;color:var(--bone);font-size:14px}.searchbar input::placeholder{color:var(--ash)}.filter-row{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0}.filter{background:none;border:1px solid var(--line);border-radius:6px;padding:8px 13px;font:11px var(--mono);color:var(--ash)}.filter[aria-pressed=true]{border-color:var(--ember);color:var(--ember);background:var(--ember-tint)}.filter:hover{color:var(--bone)}.record-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.record{background:var(--row);border:1px solid var(--line);border-radius:12px;padding:25px}.record .record-top{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-bottom:20px}.record time{font:10px var(--mono);color:var(--ash)}.record h3{font-size:16px;max-width:35ch;line-height:1.5;margin-bottom:13px}.record p{font-size:14px;color:var(--ash)}.record details{border-top:1px solid var(--line);margin-top:20px;padding-top:12px;font-size:12px}.record summary{cursor:pointer;color:var(--molten);font:11px var(--mono)}.record details p{margin-top:15px;font-size:13px}.record details a{display:block;margin-top:13px}.record-count{font:11px var(--mono);color:var(--ash);margin:20px 0}.evidence-row{display:grid;grid-template-columns:50px minmax(0,1fr) 160px;gap:25px;padding:25px 24px;border-bottom:1px solid var(--line);align-items:start}.evidence-row:last-child{border:0}.evidence-row>.mono{color:var(--ember);font-size:12px}.evidence-row h3{font-size:14px;margin:0 0 9px}.evidence-row p{font-size:13px;color:var(--ash)}.evidence-row .badge{justify-self:end}.evidence-row a{font:11px var(--mono);color:var(--molten);display:inline-block;margin-top:12px}.notice{display:flex;gap:14px;align-items:flex-start;border:1px solid var(--line-2);border-radius:10px;padding:20px 23px;font-size:13px;color:var(--ash);background:var(--row)}.notice .icon{color:var(--molten);width:19px;margin-top:1px}.notice strong{color:var(--ink-2);display:block;margin-bottom:4px;font-weight:500}.wallet-hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:65px}.wallet-card{padding:32px;border:1px solid var(--line-2);border-radius:17px;background:var(--row);position:relative;overflow:hidden}.wallet-card:before{content:'';position:absolute;width:300px;height:180px;right:-100px;top:-100px;background:radial-gradient(ellipse,var(--ember-tint),transparent 65%)}.wallet-card .eyebrow{margin:0}.wallet-balance{font:700 43px var(--display);letter-spacing:-.05em;margin:27px 0 9px}.wallet-balance small{font:15px var(--mono);color:var(--ash)}.wallet-address{display:flex;align-items:center;justify-content:space-between;gap:10px;font:11px var(--mono);padding:13px 15px;border:1px solid var(--line);border-radius:7px;margin-top:25px;color:var(--ash)}.wallet-card .actions{display:grid;grid-template-columns:1fr 1fr}.wallet-card .actions .btn{font:12px var(--sans)}.wallet-history{margin-top:25px}.wallet-history .data-row{font:12px var(--sans);padding:14px 0}.form-panel{max-width:650px;margin:auto;padding:35px}.form-panel h2{font-size:25px;margin-bottom:18px}.form-panel label{display:block;font-size:13px;margin:22px 0 9px;color:var(--ink-2)}.form-panel input,.form-panel select{background:var(--obsidian);border:1px solid var(--line-2);border-radius:7px;padding:14px 15px;color:var(--bone);width:100%;font:12px var(--mono)}.form-panel .btn{width:100%;margin-top:24px}.form-panel .form-status{font-size:13px;color:var(--molten);min-height:24px;margin-top:20px}.form-status.error{color:var(--ember)}.form-note{font-size:12px;color:var(--ash);margin-top:14px}.stepper{display:flex;gap:7px;margin:25px 0}.stepper div{flex:1;border-top:2px solid var(--line);padding-top:9px;font:9px var(--mono);color:var(--ash)}.stepper div.active{color:var(--ember);border-color:var(--ember)}.timeline{position:relative;margin-top:40px}.milestone{display:grid;grid-template-columns:130px 1fr;gap:35px;position:relative;padding-bottom:44px}.milestone:before{content:'';position:absolute;top:12px;bottom:0;left:146px;width:1px;background:var(--line)}.milestone:last-child:before{display:none}.milestone:after{content:'';width:9px;height:9px;border:1px solid var(--line-2);background:var(--obsidian);border-radius:2px;position:absolute;left:142px;top:8px}.milestone.current:after{background:var(--ember);border-color:var(--ember)}.milestone time{font:11px var(--mono);color:var(--ash);padding-top:5px}.milestone h3{font-size:18px;margin-bottom:12px}.milestone p{color:var(--ash);font-size:15px;max-width:75ch}.milestone .badge{margin-bottom:12px}.compare-table td:first-child{font-weight:500}.compare-table th:last-child{color:var(--ember)}.compare-table td{white-space:normal;min-width:180px;vertical-align:top;line-height:1.8;font-size:14px}.compare-table td:last-child{background:var(--ember-tint)}.code{font:12px/1.8 var(--mono);border:1px solid var(--line);border-radius:8px;background:var(--row);padding:19px 22px;overflow-x:auto;white-space:pre-wrap;word-break:break-word;color:var(--ink-2);margin:20px 0}.benchmark-bar{width:120px;height:4px;border-radius:2px;background:var(--line);margin-top:7px;overflow:hidden}.benchmark-bar i{display:block;background:var(--ember);height:100%}.empty-state{padding:50px 25px;text-align:center;color:var(--ash)}.empty-state .icon{width:33px;height:33px;color:var(--ember);margin-bottom:20px}.empty-state h3{color:var(--bone);font-size:17px;margin-bottom:14px}.empty-state p{font-size:14px;max-width:55ch;margin:auto}.dialog{border:1px solid var(--line-2);border-radius:16px;background:var(--graphite);color:var(--bone);padding:0;max-width:660px;width:calc(100% - 32px);max-height:85vh;box-shadow:0 20px 150px #0008}.dialog::backdrop{background:rgba(0,0,0,.65);backdrop-filter:blur(5px)}.dialog .dialog-head{padding:20px 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.dialog h2{font-size:17px}.dialog .dialog-body{padding:24px;overflow:auto;max-height:68vh}.dialog .searchbar{margin-bottom:14px}.search-results{display:grid;gap:5px}.search-results a{padding:13px 12px;border-radius:7px;display:flex;justify-content:space-between;font-size:14px;gap:20px}.search-results a:hover{background:var(--row);color:var(--ember)}.search-results a small{font:10px var(--mono);color:var(--ash)}.toast{position:fixed;bottom:27px;left:50%;transform:translate(-50%,20px);z-index:100;max-width:calc(100% - 32px);border:1px solid var(--line-2);background:var(--graphite);border-radius:10px;box-shadow:var(--shadow);padding:14px 22px;font-size:13px;opacity:0;pointer-events:none;transition:.22s}.toast.show{opacity:1;transform:translate(-50%,0)}.review-switch{position:fixed;bottom:20px;right:20px;z-index:25;display:flex;align-items:center;gap:9px;font:10px var(--mono);color:var(--ash);background:var(--glass);padding:10px 13px;border:1px solid var(--line-2);border-radius:7px;backdrop-filter:blur(12px)}.review-switch:hover{color:var(--bone);border-color:var(--ember)}.review-switch .icon{width:14px}.screen-reader{position:absolute;width:1px;height:1px;margin:-1px;clip:rect(0,0,0,0);overflow:hidden}.incoming{animation:incoming .65s ease-out}.page-enter{animation:pageIn .26s ease-out}.reveal{opacity:1}.reveal.will-reveal{opacity:0;transform:translateY(18px);transition:opacity .65s,transform .65s}.reveal.visible{opacity:1;transform:none}@keyframes incoming{0%{background:var(--ember-tint)}100%{background:transparent}}@keyframes pageIn{from{opacity:.4;transform:translateY(6px)}to{opacity:1;transform:none}}.glow-button{position:relative}.glow-button:after{content:'';position:absolute;inset:-4px;border:1px solid var(--ember);border-radius:12px;opacity:0;pointer-events:none}.glow-button:hover:after{animation:btnSignal .7s ease-out}@keyframes btnSignal{from{transform:scale(.96);opacity:.45}to{transform:scale(1.06);opacity:0}}
@media(min-width:1600px){:root{--max:1390px}.hero-grid{gap:45px}.hero-scene{height:540px}.hero h1{font-size:76px}}
@media(max-width:1100px){.nav-links,.nav .links{gap:19px}.nav-row{gap:18px}.container{padding:0 28px}.hero-grid{gap:0;grid-template-columns:1.06fr 1fr}.hero-scene{height:420px;margin-right:-15px}.hero-copy h1{font-size:clamp(42px,5.25vw,61px)}.hero .lead{font-size:17px}.split-section{gap:50px}.download-layout{gap:30px}.footer-grid{gap:25px}.console-layout{grid-template-columns:minmax(0,1fr) 270px}.docs-layout{grid-template-columns:195px minmax(0,1fr);gap:35px}.app-sidebar{font-size:9px}.app-inner{grid-template-columns:85px 1fr}.app-content{padding:18px}.wallet-hero{gap:35px}}
@media(max-width:860px){.nav-links,.nav .links{display:none}.nav-row{height:68px}.nav-controls{margin-left:auto}.mobile-toggle,.burger{display:inline-flex!important}.hero{padding-top:50px}.hero-grid{grid-template-columns:1fr;min-height:0}.hero-copy{max-width:640px}.hero-copy h1{font-size:clamp(44px,7.9vw,68px);max-width:16ch}.hero-scene{max-width:660px;width:100%;height:440px;margin:0 auto}.hero-bottom{grid-template-columns:1fr 1fr;gap:23px;margin-top:8px}.section{padding:70px 0}.grid-3,.tools-grid{grid-template-columns:1fr 1fr}.grid-3>.feature:last-child{grid-column:1/-1}.split-section{grid-template-columns:1fr;gap:35px}.split-section h2{max-width:26ch}.section-head{align-items:flex-start}.section-head>p{max-width:30ch}.console-layout{grid-template-columns:1fr}.inspector{display:grid;grid-template-columns:200px 1fr;column-gap:25px}.inspector>.eyebrow{grid-column:1/-1}.inspector canvas{grid-row:2/7}.inspector h3{margin:17px 0 8px}.inspector .small{grid-column:1/-1}.inspector .shards{grid-column:2}.stat{padding:18px}.stat .key{font-size:9px}.stat-grid{grid-template-columns:repeat(4,1fr)}.stat strong{font-size:21px}.download-layout,.wallet-hero{grid-template-columns:1fr}.download-layout>.app-window{max-width:620px;margin:auto;width:100%}.footer-grid{grid-template-columns:1.2fr 1fr 1fr;gap:30px}.footer-brand{grid-column:1/-1}.footer-brand p{margin:12px 0}.cta-band{padding:37px;flex-direction:column;align-items:flex-start;gap:25px}.page-heading{align-items:flex-start;flex-direction:column;gap:20px}.page-heading .actions{margin:0}.docs-layout{grid-template-columns:1fr}.doc-nav{position:relative;top:0;max-height:190px;border:1px solid var(--line);border-radius:9px;padding:18px;display:grid;grid-template-columns:1fr 1fr}.doc-nav .eyebrow{grid-column:1/-1}.record-grid{gap:12px}.evidence-row{grid-template-columns:27px 1fr 135px;gap:14px}.page-hero{padding-top:40px}.wallet-card{max-width:580px;width:100%;margin:auto}.review-switch{font-size:9px;bottom:12px;right:12px}}
@media(max-width:560px){.container{padding:0 20px}.statusbar{font-size:8px}.statusbar .dev-label{margin-right:5px}.statusbar .hide-phone{display:none}.logo{font-size:16px;gap:7px}.logo .brand-mark{width:30px;height:30px}.nav-row{gap:8px}.nav-controls{gap:0}.nav-controls .btn.primary,.nav .cta{font-size:9px;padding:10px 12px;min-height:36px;gap:5px}.nav-controls .btn.primary .icon{width:13px}.nav-controls .btn.icon-btn,.burger{width:35px;height:35px;min-height:35px}.hero{padding-top:40px;padding-bottom:40px}.hero .eyebrow{font-size:9px;margin-bottom:20px}.hero-copy h1{font-size:clamp(35px,9.2vw,49px);letter-spacing:-.055em;line-height:1.14}.hero-copy .lead{font-size:16px;margin-top:23px}.actions{gap:9px;margin-top:24px}.btn{min-height:45px;padding:12px 15px;font-size:10px;gap:10px}.hero .actions .btn{font-size:10px}.hero-footnote{font-size:9px;margin-top:17px;max-width:33ch;line-height:1.8}.hero-scene{height:335px;margin:18px auto 0}.scene-corner{font-size:8px}.scene-corner.tl{left:0;top:8px}.scene-corner.tr{right:0;top:8px}.scene-corner.bl{left:0;bottom:52px}.scene-corner.br{right:0;bottom:8px;max-width:calc(50% - 105px)}.scene-steps{bottom:8px;padding:4px;gap:2px}.scene-step{font-size:9px;padding:8px 10px}.hero-bottom{padding-top:24px;margin-top:25px;gap:22px 16px}.principle{gap:8px}.principle strong{font-size:11px}.principle small{font-size:10px;line-height:1.5}.principle .icon{width:14px}.section{padding:52px 0}.section.compact{padding:45px 0}.section-head{display:block;margin-bottom:26px}.section-head h2{max-width:24ch;font-size:27px}.section-head>p{margin-top:18px;max-width:none;font-size:15px}.section-head>.text-link{margin-top:16px}.eyebrow{font-size:9px;margin-bottom:15px}.grid-3,.grid-2,.tools-grid,.record-grid{grid-template-columns:1fr}.grid-3>.feature:last-child{grid-column:auto}.feature{padding:25px}.feature h3{font-size:17px}.feature .number{margin-bottom:22px}.feature-graphic{height:85px}.panel-head{padding:16px;align-items:flex-start;flex-wrap:wrap;gap:10px}.panel-head .eyebrow{font-size:9px}.panel-head .pill{font-size:8px}.panel-footer{padding:14px 16px;flex-direction:column;align-items:flex-start;font-size:9px}.legend{gap:12px;font-size:9px}.live-peek canvas{height:225px}.label-below{display:block;font-size:11px}.label-below>*+*{margin-top:10px;display:block}.reward-bars{padding:24px}.reward-key{gap:17px;font-size:11px}.reward-row strong{font-size:32px}.cta-band{padding:29px 24px}.cta-band h2{font-size:27px}.cta-band .actions{flex-wrap:wrap;width:100%}.site-footer{padding-top:40px}.footer-grid{grid-template-columns:1fr 1fr;gap:28px 22px}.footer-column:last-child{grid-column:1/-1}.footer-column:last-child>div{display:grid;grid-template-columns:1fr 1fr}.footer-column a{font-size:12px;margin:8px 0}.footer-column h4{margin-bottom:15px}.footer-bottom{display:block;margin-top:35px;font-size:9px;padding-bottom:35px}.theme-group{margin-top:23px;width:max-content}.page-hero h1{font-size:clamp(30px,8.5vw,44px);line-height:1.2}.page-hero .lead{font-size:16px;margin-top:20px}.breadcrumb{font-size:9px;margin-bottom:23px}.stat-grid{grid-template-columns:1fr 1fr}.stat:nth-child(2){border-right:0}.stat:nth-child(-n+2){border-bottom:1px solid var(--line)}.stat{padding:20px 17px}.stat strong{font-size:23px}.dag-panel canvas{height:330px}.panel-controls .btn{font-size:10px;min-height:32px;padding:7px 10px}.panel-controls select{max-width:130px;font-size:10px}.inspector{grid-template-columns:120px 1fr;padding:20px;gap:0 14px}.inspector canvas{height:160px}.inspector h3{font-size:11px}.data-row{font-size:10px;padding:10px 0}.inspector .shard{font-size:8px;padding:7px 0}.demo-controls{align-items:flex-start;flex-direction:column;gap:12px;font-size:11px}.tables-row .grid-2{gap:18px}.table-wrap td,.table-wrap th{padding:13px 15px;font-size:11px}.table-wrap th{font-size:9px}.table-button{font-size:10px}.badge{font-size:9px}.app-inner{grid-template-columns:67px 1fr;min-height:320px}.app-sidebar{padding:13px 5px;font-size:8px}.app-sidebar div{padding:8px 4px}.app-content{padding:17px 13px}.app-content .app-greeting strong{font-size:11px}.app-content .app-greeting .pill{font-size:7px}.app-stat{padding:10px}.app-stat strong{font-size:16px}.app-stat span{font-size:8px}.app-content canvas{height:125px}.app-bar{font-size:8px}.download-card{padding:22px}.download-card .tabs button{font-size:12px;padding:13px 10px}.download-detail{font-size:9px}.step-item{gap:14px;grid-template-columns:38px 1fr}.step-item h3{font-size:15px}.step-item p{font-size:14px}.faq summary{font-size:14px;padding:20px 0}.faq details p{font-size:14px}.doc-nav{grid-template-columns:1fr 1fr;max-height:200px;padding:13px}.doc-nav a{font-size:10px;padding:7px}.doc-section h2{font-size:23px}.doc-section p{font-size:15px}.doc-section .table-wrap{margin:20px 0}.doc-notice{padding:18px;font-size:12px}.evidence-row{grid-template-columns:26px 1fr;padding:23px 18px;gap:8px}.evidence-row .badge{grid-column:2;justify-self:start;margin-top:7px}.evidence-row h3{font-size:13px}.wallet-card{padding:23px}.wallet-balance{font-size:35px}.wallet-address{font-size:9px}.form-panel{padding:26px 20px}.form-panel h2{font-size:23px}.form-panel input{font-size:11px}.milestone{grid-template-columns:74px 1fr;gap:26px;padding-bottom:35px}.milestone:before{left:83px}.milestone:after{left:79px}.milestone time{font-size:9px;line-height:1.8}.milestone h3{font-size:15px}.milestone p{font-size:14px}.notice{padding:17px;font-size:12px}.dialog .dialog-body{padding:18px}.dialog h2{font-size:15px}.review-switch span{display:none}.review-switch{padding:10px}.hero-scene+.hero-bottom{margin-top:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal.will-reveal{opacity:1;transform:none}}
html[data-motion=off]{scroll-behavior:auto}html[data-motion=off] *,html[data-motion=off] *:before,html[data-motion=off] *:after{animation:none!important;transition:none!important}html[data-motion=off] .reveal.will-reveal{opacity:1;transform:none}
@media print{.site-header,.statusbar,.review-switch,.site-footer,.doc-nav,.scene-steps,.actions,.demo-controls{display:none!important}body{background:white;color:black}.container{padding:0}.section{padding:25px 0}.docs-layout{display:block}.doc-section{break-inside:avoid}.page-hero{padding:20px 0}.source-note{color:#444}}
/* Interaction adapter details. Data and sample labels remain visible at every size. */
.hash-btn{border:0;background:none;color:var(--molten);padding:7px 0;font:11px var(--mono);text-align:left;overflow-wrap:anywhere;cursor:pointer}.hash-btn:hover{text-decoration:underline;text-underline-offset:4px}.event-item{display:flex;gap:13px;padding:16px 0;border-bottom:1px solid var(--line);align-items:flex-start;font-size:12px}.event-item:last-child{border:0}.event-icon{color:var(--ember);margin-top:2px;flex-shrink:0}.event-item strong{display:block;font:500 12px/1.5 var(--sans)}.event-item small{display:block;font:9px/1.8 var(--mono);color:var(--ash);margin-top:5px}.event-icon .icon{width:17px;height:17px}.search-result strong{display:block;font-weight:500}.search-result small{display:block;max-width:46ch;margin-top:4px;line-height:1.6!important}.search-result>span:last-child{white-space:nowrap;color:var(--ash);font-size:9px;display:flex;align-items:center;gap:8px}.search-result .icon{width:14px;height:14px}.download-platform{display:flex;gap:15px;align-items:center;margin:27px 0}.download-platform>.icon{width:29px;height:29px;color:var(--bone)}.download-platform h3{font-size:19px}.download-platform p{font:11px var(--mono);color:var(--ash);margin-top:6px}.download-note{font-size:14px;color:var(--ink-2);margin-top:20px;line-height:1.7}.shard.verified{border-color:var(--ember);color:var(--ember)}.shard.paid{border-color:var(--molten);color:var(--molten)}.shard.proving{border-color:var(--ember);color:var(--ember);background:var(--ember-tint)}.shards{flex-wrap:wrap}.shard{flex-basis:65px;line-height:1.6;padding:9px 5px;overflow-wrap:anywhere}.break-anywhere{overflow-wrap:anywhere}.code-block{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--row);border:1px solid var(--line);padding:18px;border-radius:9px;font:12px/1.8 var(--mono);margin:20px 0}.dialog-body>.data-row{gap:24px}.dialog-body>.data-row strong{overflow-wrap:anywhere;max-width:66%}.form-status{line-height:1.7;font-size:13px}.form-status.error{color:var(--molten)}.form-status.success{color:var(--ink-2)}#platform-content .btn.primary{width:100%}.mobile-nav a[aria-current=page],.nav-sheet a[aria-current=page]{color:var(--ember)}
@media(max-width:560px){.hash-btn{font-size:10px}.search-result>span:last-child{display:none}.scene-corner.br{display:none}.search-results a{padding:12px 5px}.download-note{font-size:13px}.dialog-body>.data-row{font-size:11px}.notice:has(#feed-mode){flex-wrap:wrap}.notice:has(#feed-mode)>div:last-child{width:100%;margin-left:0!important}#feed-mode{width:100%;margin-top:8px}.shard{line-height:1.7;flex-basis:55px}}
.tables-row>*,.grid-2>*,.console-layout>*{min-width:0}.doc-section{scroll-margin-top:0}
/* ---------- 3. the compatibility layer: our data pages' vocabulary on the package's tokens ---------- */
.container,.wrap{max-width:var(--max);margin:0 auto;padding:0 36px}
@media(max-width:1100px){:root{--gutter:28px}.container,.wrap{padding:0 28px}}
@media(max-width:560px){:root{--gutter:20px}.container,.wrap{padding:0 20px}}
.sec{padding:100px 0}.sec.compact{padding:64px 0}
@media(max-width:860px){.sec{padding:70px 0}}@media(max-width:560px){.sec{padding:52px 0}.sec.compact{padding:45px 0}}
.sec-head{max-width:68ch;margin-bottom:32px}.sec-head p{color:var(--ink-2);font-size:19px;line-height:1.5;margin:12px 0 0}
.eyebrow.ember{color:var(--ember-text)}
.measure{max-width:68ch}.right{text-align:right}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:20px;top:-100px;z-index:100;background:var(--ember);color:var(--ember-ink);padding:12px;border-radius:8px}.skip:focus{top:15px}
hr{border:0;border-top:1px solid var(--line);margin:32px 0}
img,canvas,svg,video{max-width:100%}
code,kbd,.mono{font-family:var(--mono)}
/* prose links keep the ember colour; the package inherits colour on every link, which is right for its chrome and wrong for a paragraph */
p a:not(.btn):not(.text-link),li a:not(.btn),td a,dd a,dt a,.derived a,.doc-body a,article a,.note a,.fair a,figcaption a,.pt a{color:var(--ember-text)}
p a:hover,li a:hover,td a:hover{text-decoration:underline;text-underline-offset:3px}
.card{background:var(--graphite);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--s-5)}
.card h3{margin-bottom:var(--s-2)}
.card p:last-child{margin-bottom:0}
.grid{display:grid;gap:var(--s-4)}
.grid.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:900px){.grid.c3,.grid.c4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.grid.c2,.grid.c3,.grid.c4{grid-template-columns:minmax(0,1fr)}}
/* a grid track never grows past the viewport for a long line inside it (the 390 px overflow class, 6 Oct 2026) */
.grid>*,.tiles>*,.card,.two>*,.split>*,.split2>*,.hero-grid>*,.download>*,.layout>*,.pillars>*,.phases>*,.group>*,.feats>*,.fee>*,.steps>*,.states>*,.ol>*,.cells>*,.strip>*{min-width:0}
pre{max-width:100%}
@media (max-width:720px){main table{display:block;overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}.tbl table{display:table}}
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-3)}
@media (max-width:700px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
.tile{background:var(--row);border:1px solid var(--line);border-radius:var(--r-row);padding:var(--s-4) var(--s-4) var(--s-3);min-width:0}
.tile .v{font:700 var(--t-num)/1 var(--f-display);color:var(--bone);letter-spacing:-.02em;overflow-wrap:anywhere}
.tile .v.state{font:500 var(--t-base)/1.3 var(--f-mono);color:var(--ash);padding:6px 0}
.tile .k{font:400 var(--t-sm)/1.4 var(--f-mono);color:var(--ash);margin-top:var(--s-2)}
.tile.hot .v{color:var(--ember-text)}
.btn.small{min-height:40px;padding:11px 15px;font-size:11px}
.btn[aria-disabled="true"],.btn:disabled{opacity:.5;cursor:default}
@media (max-width:720px){.cta .btn{width:100%}}
.cta{display:flex;flex-wrap:wrap;gap:var(--s-3)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--molten);display:inline-block;flex:none}
.dot.live{animation:pulse 2s ease-in-out infinite}
.dot.off{background:var(--ash);animation:none}
.dot.bad{background:var(--ember);animation:none}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.dot.live{animation:none}}
.note{color:var(--ash);font-size:13px;line-height:1.7;max-width:80ch;margin:var(--s-4) 0 0}
.callout{border-left:2px solid var(--ember);background:var(--row);border-radius:0 var(--r-row) var(--r-row) 0;padding:var(--s-4) var(--s-5);margin:var(--s-5) 0;color:var(--ink-2)}
.callout p:last-child{margin:0}
pre,.code{background:var(--row);border:1px solid var(--line);border-radius:var(--r-row);padding:var(--s-4);font:400 14px/1.6 var(--f-mono);color:var(--ink-2);overflow:auto;margin:0}
code{font-size:.92em;background:var(--row);border:1px solid var(--line);border-radius:6px;padding:1px 6px;color:var(--ink-2)}
pre code{background:none;border:0;padding:0}
/* our tables wrap their text (the package's nowrap is for its short sample rows); the chrome is the package's .table-wrap */
.tbl{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:12px;background:var(--row);min-width:0;max-width:100%}
.tbl table{font-size:13px;line-height:1.5}
.tbl td{white-space:normal;color:var(--ink-2);vertical-align:top}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
td.id{font-family:var(--f-mono);font-size:13px;overflow-wrap:anywhere}
.tbl tbody tr:hover{background:var(--graphite)}
@media (max-width:720px){.tbl th,.tbl td{padding:11px 14px}}
.kv{display:grid;grid-template-columns:minmax(120px,30%) 1fr;gap:0 var(--s-4)}
.kv>div{padding:10px 0;border-top:1px solid var(--line);color:var(--ink-2)}
.kv>div:nth-child(-n+2){border-top:0}
.kv .k{font:500 var(--t-sm)/1.4 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ash);padding-top:12px}
details{border-top:1px solid var(--line)}
details:last-of-type{border-bottom:1px solid var(--line)}
summary{cursor:pointer;padding:14px 0;color:var(--bone);font-weight:500;list-style:none;display:flex;justify-content:space-between;gap:var(--s-3)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:var(--f-mono);color:var(--ash)}
details[open] summary::after{content:"\2212"}
details>:not(summary){padding-bottom:var(--s-4);color:var(--ink-2)}
input,select,textarea{font:400 var(--t-md)/1.4 var(--f-sans);color:var(--bone);background:var(--row);border:1px solid var(--line);border-radius:var(--r-btn);padding:10px 12px;width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--line-2)}
.field{display:grid;gap:6px;margin-bottom:var(--s-4)}
.field label{font:500 var(--t-sm)/1.4 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ash)}
/* ---------- 6. states ---------- */
.state{display:inline-flex;align-items:center;gap:8px;font:500 var(--t-sm)/1.4 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ash)}
.state.live{color:var(--molten-text)}
.state.bad{color:var(--ember-text)}
.empty{color:var(--ash);font-size:var(--t-base);padding:var(--s-5) 0}
.empty.err{color:var(--ember-text)}
.spinner{width:24px;height:24px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--ember);animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spinner{animation:none}}
/* ---------- 7. scenes ---------- */
.viz{padding:var(--s-4)}
.viz-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px var(--s-5);margin-bottom:var(--s-3)}
.viz-stats{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-4);font:400 var(--t-sm)/1.4 var(--f-mono);color:var(--ash)}
.viz-stats b{color:var(--bone);font-weight:500}
.viz canvas{width:100%;height:340px;border-radius:var(--r-row);background:var(--row);border:1px solid var(--line)}
@media (max-width:600px){.viz canvas{height:240px}}
.legend{flex-wrap:wrap}.legend[hidden]{display:none}
.legend span{display:inline-flex;align-items:center;gap:8px}
.sw{width:12px;height:12px;border-radius:3px;display:inline-block;flex:none}
/* the engaged scene: a chip in the corner while the wheel zooms */
.scene canvas.engaged{outline:2px solid var(--ember);outline-offset:-2px}
.chip-zoom{position:absolute;right:12px;top:12px;display:inline-flex;align-items:center;gap:8px;background:var(--graphite);border:1px solid var(--line-2);border-radius:var(--r-pill);padding:5px 12px;font:500 var(--t-sm)/1.4 var(--f-mono);color:var(--ink-2);pointer-events:none}
.chip-zoom[hidden]{display:none}
/* ---------- 8. print ---------- */
@media print{.statusbar,.site-footer{display:none!important}
:root{--obsidian:#fff;--graphite:#fff;--row:#f3f3f3;--line:#bbb;--line-2:#999;--bone:#000;--ink-2:#111;--ash:#444;--ember:#B8390C;--ember-text:#B8390C;--molten-text:#8F5810}
.nav,.foot,.burger,.skip,.cta,.theme,.no-print{display:none!important}
body{font-size:11pt;line-height:1.45;background:#fff;color:#000}
.wrap{max-width:none;padding:0}
a{color:#000;text-decoration:underline}
a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;color:#444}
.card,.tbl,.callout,pre{break-inside:avoid;border-color:#bbb}
h1,h2,h3{break-after:avoid}
tr{break-inside:avoid}
canvas{display:none}
}
/* ---------- 9. product pages: miner, app, wallet, live (7 Oct 2026) ---------- */
.phero{position:relative;padding:calc(var(--s-6) + 16px) 0 var(--s-6);overflow:hidden}
.phero::before{content:"";position:absolute;inset:auto -10% -30% 40%;height:70%;background:radial-gradient(closest-side,var(--ember-12),transparent);pointer-events:none}
.phero .wrap{position:relative;display:grid;gap:var(--s-6);grid-template-columns:1fr;align-items:center}
@media (min-width:980px){.phero .wrap{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:var(--s-6) 56px}}
.phero h1{margin:0 0 var(--s-4)}
.phero .lead{margin:0 0 var(--s-5)}
.phero .os{display:flex;flex-wrap:wrap;gap:6px 16px;font:400 var(--t-sm)/1.4 var(--f-mono);color:var(--ash);margin-top:var(--s-4)}
.frame{position:relative;border:1px solid var(--line-2);border-radius:var(--r-card);background:var(--obsidian);box-shadow:0 30px 80px var(--shadow);overflow:hidden;margin:0;min-width:0}
.frame .bar{height:32px;display:flex;align-items:center;gap:7px;padding:0 14px;border-bottom:1px solid var(--line);background:var(--graphite)}
.frame .bar i{width:10px;height:10px;border-radius:50%;background:var(--line-2);display:block}
.frame .bar b{margin-left:auto;font:500 11px/1 var(--f-mono);letter-spacing:.12em;color:var(--ash);text-transform:uppercase}
.frame img{display:block;width:100%;height:auto}
.frame figcaption{padding:10px 14px;font:400 13px/1.5 var(--f-mono);color:var(--ash);border-top:1px solid var(--line)}
.frame.phone{max-width:300px;margin:0 auto}
.frame .img-light,.frame .cap-light{display:none}
:root[data-theme="light"] .frame .img-dark,:root[data-theme="light"] .frame .cap-dark{display:none}:root[data-theme="light"] .frame .img-light{display:block}:root[data-theme="light"] .frame .cap-light{display:inline}
.glow{position:relative}
.glow::before{content:"";position:absolute;inset:12% -6% -8% -6%;background:radial-gradient(closest-side,var(--ember-12),transparent);filter:blur(12px);pointer-events:none}
.shots3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-4)}
@media (max-width:900px){.shots3{grid-template-columns:1fr}}
.dl-list{display:flex;flex-direction:column;gap:var(--s-2);margin:var(--s-4) 0}
.dl-list a{display:flex;justify-content:space-between;align-items:center;gap:var(--s-3);padding:12px 16px;border:1px solid var(--line);border-radius:var(--r-row);background:var(--graphite);color:var(--bone);font-weight:600;min-width:0}
.dl-list a:hover{text-decoration:none;border-color:var(--line-2);background:var(--hover)}
.dl-list a.primary{background:var(--ember);border-color:var(--ember);color:var(--ember-ink)}
.dl-list a.primary:hover{background:var(--ember-hi)}
.dl-list a span{font:400 var(--t-sm)/1.4 var(--f-mono);opacity:.85;text-align:right}
.dl-list a[data-dl-missing]{opacity:.55}
.dl-list a .osmark{width:26px;height:26px;flex:none}
.dl-list a.primary .osmark{color:#fff}
.dl-list a b{font-weight:600;margin-right:auto}
p.notice{display:block;margin:14px 0 0;font-size:13px;line-height:1.7}
.notice b{color:var(--ink-2);font-weight:500}
.lines{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-3)}
.lines li{background:var(--row);border:1px solid var(--line);border-radius:var(--r-row);padding:var(--s-4);min-width:0;color:var(--ink-2);font-size:var(--t-base);line-height:1.5}
.lines strong{color:var(--bone);display:block;margin-bottom:4px}
.lines .src{display:block;font:400 var(--t-xs)/1.4 var(--f-mono);margin-top:6px}
.lines.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.lines.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:900px){.lines,.lines.c2,.lines.c4{grid-template-columns:1fr}}
.feat-row{display:grid;grid-template-columns:1fr;gap:var(--s-5);align-items:center}
@media (min-width:980px){.feat-row{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}.feat-row.flip>.frame{order:2}}
.feat-row h2{margin-bottom:var(--s-3)}
.feat-row>div>p{color:var(--ink-2)}
.feat-row .lines{grid-template-columns:1fr;margin-top:var(--s-4)}
.yourcard{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2) var(--s-3);background:var(--row);border:1px solid var(--line);border-radius:var(--r-row);padding:var(--s-3) var(--s-4);font-size:var(--t-base);color:var(--ink-2)}
.yourcard select{width:auto;padding:6px 10px;font:500 var(--t-base)/1.3 var(--f-sans)}
.yourcard b{color:var(--bone);font-weight:600}
.yourcard .eta{font-family:var(--f-mono);color:var(--molten-text)}
.tick{transition:color .5s ease}.tick.flash{color:var(--molten-text);transition:none}
.dl-bar{display:none}
@media (max-width:720px){.dl-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;justify-content:space-between;align-items:center;gap:var(--s-3);padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom));background:var(--top-bg);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line)}.dl-bar span{font:400 var(--t-sm)/1.4 var(--f-mono);color:var(--ash);min-width:0}body.has-dl-bar{padding-bottom:72px}}
.band{background:var(--ember);color:var(--ember-ink)}
.band .wrap,.band .container{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-5);padding-top:56px;padding-bottom:56px}
@media (max-width:560px){.band .wrap,.band .container{padding-top:40px;padding-bottom:40px}}
.band h2{color:var(--ember-ink);font-weight:900;margin-bottom:var(--s-2)}
.band p{margin:0;max-width:56ch}
.btn.dark{background:var(--obsidian);color:var(--bone);border-color:var(--obsidian)}
.btn.dark:hover{background:var(--graphite);border-color:var(--graphite)}
.switch{display:inline-flex;align-items:center;gap:12px;font-size:var(--t-base);color:var(--bone)}
.switch .track{width:44px;height:26px;border-radius:13px;background:var(--ember);position:relative;flex:0 0 44px}
.switch .track::after{content:"";position:absolute;top:3px;right:3px;width:20px;height:20px;border-radius:50%;background:var(--bone)}
/* ---------- 4. the redesign pages' additions the package lacks ---------- */
.hero-scene canvas{border:0;background:transparent}
.scene-step{min-height:36px;cursor:pointer}
.scene-corner.bl{max-width:52%}
.platform-body[hidden]{display:none}
.download-platform .osmark{width:29px;height:29px;color:var(--bone);flex:none}
.platform-body .btn.primary{width:100%;margin-top:26px}
.platform-body .btn[data-dl-missing]{opacity:.55}
.download-detail span{overflow-wrap:anywhere;min-width:0}
.platform-body .hive-sheet{margin-top:16px;font-size:13px;color:var(--ink-2);line-height:1.7}
.platform-body .hive-sheet code{overflow-wrap:anywhere}
.platform-body .sha{font:10px/1.6 var(--mono);color:var(--ash);overflow-wrap:anywhere;margin-top:12px}
.tabs button[aria-selected=true]{border-bottom-color:var(--ember);color:var(--bone)}
.record[hidden],.doc-section[hidden]{display:none}
.milestone .when{font:11px var(--mono);color:var(--ash);padding-top:5px;min-width:0;overflow-wrap:anywhere}
.milestone .gate{color:var(--ash);font-size:14px}.milestone .gate b{color:var(--bone);font-weight:600}
.milestone.done:after{background:var(--molten);border-color:var(--molten)}
@media(max-width:560px){.milestone{grid-template-columns:1fr;gap:6px;padding:0 0 35px 22px}.milestone:before{left:4px;top:18px}.milestone:after{left:0;top:14px}}
.onward{display:flex;flex-wrap:wrap;gap:12px;margin-top:40px;padding-top:30px;border-top:1px solid var(--line)}
.derived{max-width:810px;color:var(--ink-2)}.derived h2{font-size:27px;margin:40px 0 22px}.derived h3{font-size:16px;margin:26px 0 13px}.derived p{font-size:16px;line-height:1.85}.derived li{font-size:15px;margin:9px 0;color:var(--ink-2)}.derived ul,.derived ol{padding-left:22px}.derived strong{color:var(--bone)}.derived .pull{margin:25px 0;padding:18px 24px;border-left:2px solid var(--ember);background:var(--row);border-radius:0 10px 10px 0;font:500 19px/1.45 var(--sans);color:var(--bone)}.derived .src{font:10px/1.8 var(--mono);color:var(--ash);margin:-8px 0 24px}.derived .src b{color:var(--ink-2);font-weight:500}
.doc-body article,.doc-body{color:var(--ink-2)}
.doc-section h2{font-size:27px;margin:0 0 22px}.doc-section h3{font-size:16px;margin:26px 0 13px}.doc-section p{color:var(--ink-2);font-size:16px;line-height:1.85}.doc-section li{color:var(--ink-2);font-size:15px;margin:9px 0}
.doc-section .tbl{margin:25px 0}.doc-section .tbl td{white-space:normal;min-width:140px;font-size:13px}
.doc-nav>a:first-of-type{margin-top:0}
.doc-tools{margin:0 0 30px}.doc-tools .searchbar{max-width:560px}.doc-tools .small{white-space:nowrap}
.state-card{border:1px solid var(--line);border-radius:12px;padding:25px;background:var(--row);display:flex;flex-direction:column;gap:8px;position:relative;min-width:0}
.state-card .pill{align-self:flex-start}.state-card .pill i{width:6px;height:6px;border-radius:50%;background:var(--ash);display:inline-block}
.state-card.block .pill{border-color:color-mix(in srgb,var(--molten) 40%,transparent);color:var(--molten)}.state-card.block .pill i{background:var(--molten)}
.state-card.final .pill{border-color:var(--ember);background:var(--ember);color:var(--ember-ink)}.state-card.final .pill i{background:var(--ember-ink)}
.state-card .t{font:700 16px/1.4 var(--display);color:var(--bone)}.state-card p{font-size:14px;color:var(--ash)}
.states{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}@media(max-width:640px){.states{grid-template-columns:1fr}}
.wallet-card .frame{border:0;box-shadow:none;background:transparent;border-radius:0}.wallet-card .frame .bar{display:none}.wallet-card .frame img{border-radius:10px;border:1px solid var(--line)}
.wallet-card .shot-cap{font:10px/1.8 var(--mono);color:var(--ash);margin-top:14px}
.cards-table .eta{color:var(--molten);font-family:var(--mono)}
.fair{margin:20px 0 0;color:var(--ash);font-size:15px;max-width:85ch;line-height:1.7}.fair b{color:var(--bone)}
.feecard{display:grid;grid-template-columns:1fr;gap:16px}@media(min-width:900px){.feecard{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:start}}
.app-window .shot{display:block;width:100%;height:auto}
.app-window figcaption{padding:12px 17px;font:10px/1.7 var(--mono);color:var(--ash);border-top:1px solid var(--line)}
.lines{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.lines li{background:var(--row);border:1px solid var(--line);border-radius:12px;padding:25px;min-width:0;color:var(--ash);font-size:14px;line-height:1.6}
.lines strong{color:var(--bone);display:block;margin-bottom:8px;font-weight:500;font-size:15px}
.lines.c2{grid-template-columns:repeat(2,minmax(0,1fr))}.lines.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:900px){.lines,.lines.c2,.lines.c4{grid-template-columns:1fr}}
.ledger-line{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0}
.ledger-line p{margin:0;color:var(--ink-2)}
.statusbar .dot{width:6px;height:6px;margin-right:8px}
.stat-grid.six{grid-template-columns:repeat(6,1fr)}@media(max-width:1100px){.stat-grid.six{grid-template-columns:repeat(3,1fr)}.stat-grid.six .stat:nth-child(3){border-right:0}.stat-grid.six .stat:nth-child(-n+3){border-bottom:1px solid var(--line)}}@media(max-width:560px){.stat-grid.six{grid-template-columns:1fr 1fr}.stat-grid.six .stat:nth-child(3){border-right:1px solid var(--line)}.stat-grid.six .stat:nth-child(2n){border-right:0}.stat-grid.six .stat:nth-child(-n+4){border-bottom:1px solid var(--line)}}
.stat strong.tick{display:block}
.stat .v.word{font:500 13px/1.4 var(--mono);color:var(--ash)}
/* the header's burger: the package's icon button with the menu and cross glyphs; the sheet opens under the bar */
.burger .cross{display:none}.nav.open .burger .bars{display:none}.nav.open .burger .cross{display:block}
.nav .links{display:flex;gap:27px;align-items:center;flex:1;justify-content:center}
.nav .nav-dropdown{margin-left:-10px}
@media(max-width:1100px){.nav .links{gap:19px}}
@media(max-width:860px){.nav .links,.nav .nav-dropdown{display:none}}
.nav-sheet{display:none;padding:16px 25px 25px;border-top:1px solid var(--line);max-height:70vh;overflow:auto;grid-template-columns:1fr 1fr;gap:5px}
.nav.open .nav-sheet{display:grid}
.nav-sheet a{padding:9px 5px;font-size:14px}.nav-sheet .btn.primary{grid-column:1/-1;margin:8px 0}
.statusbar .hide-phone{display:inline-flex;align-items:center;text-transform:uppercase;letter-spacing:.08em}
/* ---------- 10. site-ui-5 (7 Oct 2026): the apps' treatments over the package, so the site and the miner and wallet read as one product ----------
Source of truth: app/igneum-app/ui/app.css (miner-ui-5) and app/igneum-wallet/ui/app.css (wallet-0.1.5). The fourteen palette
tokens stay in the scene-tokens block above (scene/tokens.css); everything here reads them. Buttons, pills, cards and rows take
the app's shapes (radius 10 / 12 / 16, 1 px --line, graphite surfaces, Plex Sans 600 labels, mono eyebrows), the wordmark the
app's rail brand, the glow the wallet's lock screen. The slim bar replaces the seven-item header: the mark, three groups, Download. */
:root{--nav-h:60px;--top-bg:rgba(12,12,14,.86);--well:rgba(255,255,255,.05);--ring:rgba(255,255,255,.14);--r-btn:10px}
:root[data-theme="light"]{--top-bg:rgba(244,241,236,.88);--well:rgba(0,0,0,.04);--ring:rgba(0,0,0,.12)}
html{scroll-padding-top:calc(var(--nav-h) + 16px)}
body{font-size:16px;line-height:1.6}
h1{font-size:clamp(34px,4.6vw,56px);font-weight:900;line-height:1.1;letter-spacing:-.02em}
h2{font-size:clamp(24px,2.6vw,34px);font-weight:700;line-height:1.18;letter-spacing:-.015em}
h3{font-size:17px;font-weight:700;letter-spacing:0}
.page-hero h1{font-size:clamp(32px,4vw,48px)}
.eyebrow{font:500 11px/1.7 var(--mono);letter-spacing:.16em}
/* buttons: the app's */
.btn{min-height:40px;padding:8px 18px;border-radius:var(--r-btn);font:600 14px/1.3 var(--sans);letter-spacing:0;gap:10px;background:transparent;border:1px solid var(--line-2);color:var(--bone);transition:transform .15s ease,background .15s ease,border-color .15s ease,color .15s ease}
.btn:hover{transform:translateY(-1px);border-color:var(--ash)}
.btn:active{transform:none}
.btn.primary{background:var(--ember);border-color:var(--ember);color:var(--ember-ink)}
.btn.primary:hover{background:var(--ember-hi);border-color:var(--ember-hi)}
.btn.big{min-height:52px;padding:12px 26px;font-size:17px}
.btn.small,.btn.small-btn{min-height:34px;padding:6px 14px;font-size:13px;border-radius:8px}
.btn.ghost{border-color:transparent;color:var(--ink-2)}
.btn.ghost:hover{border-color:var(--line-2);color:var(--bone)}
.btn.icon-btn{width:38px;height:38px;min-height:38px;padding:8px;border-color:transparent}
.btn.icon-btn:hover{background:var(--hover);border-color:var(--line)}
.btn .icon{width:18px;height:18px}
:focus-visible{outline:2px solid var(--ember);outline-offset:3px;border-radius:6px}
/* pills: the app's status pill */
.pill{font:500 11px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ash);border:1px solid var(--line);border-radius:999px;padding:6px 12px 6px 10px;background:var(--graphite);gap:8px}
.pill.warm,.pill.on{color:var(--molten-text);border-color:color-mix(in srgb,var(--molten) 40%,transparent);background:var(--graphite)}
.pill .dot,.devnet .dot{width:8px;height:8px;border-radius:50%;background:var(--ash);display:inline-block;flex:0 0 8px}
.pill.warm .dot,.dot.live{background:var(--molten);animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,179,92,.5)}50%{box-shadow:0 0 0 7px rgba(255,179,92,0)}}
/* cards and rows: graphite, 16 and 12, the hairline */
.panel,.feature,.tool-card,.card,.stat-grid,.download-card,.cta-band,.frame,.dp,.state-card,.record,.milestone,.wallet-card,.tile{background:var(--graphite);border:1px solid var(--line);border-radius:16px}
.feature:after{display:none}
.feature,.tool-card{padding:24px}
.feature p,.tool-card p,.stat .small{color:var(--ink-2)}
.lines li,.dl-list a,.step-item,.notice,.table-wrap,.yourcard,.kv,.row{border-radius:12px}
.stat{border-right:1px solid var(--line)}
.cta-band{background:linear-gradient(120deg,var(--ember-12),transparent 70%),var(--graphite);border-color:color-mix(in srgb,var(--ember) 35%,var(--line))}
.section{padding:72px 0}.section.compact{padding:48px 0}
@media (max-width:560px){.section{padding:48px 0}.section.compact{padding:36px 0}}
.text-link{color:var(--ink-2)}.text-link:hover{color:var(--ember-text)}
/* the slim bar */
.nav{position:sticky;top:0;z-index:40;background:var(--top-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav .statusbar{display:none}
.nav-row{height:var(--nav-h);display:flex;align-items:center;gap:18px}
.logo{display:inline-flex;align-items:center;gap:10px;flex-shrink:0;color:var(--bone)}
.logo .brand-mark{width:32px;height:32px;display:block;border-radius:8px}
.logo .word{font:900 18px/1 var(--display);letter-spacing:.06em}
.logo .stop{display:none}
.devnet{display:inline-flex;align-items:center;gap:7px;font:500 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ash);border:1px solid var(--line);border-radius:999px;padding:6px 10px;white-space:nowrap}
.nav-groups{display:flex;align-items:center;gap:4px;margin-left:8px;flex:1}
.group-btn{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:6px 12px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--ink-2);font:500 14px/1 var(--sans);cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease}
.group-btn .icon{width:14px;height:14px;color:var(--ash);transition:transform .15s ease}
.group-btn:hover{background:var(--hover);color:var(--bone)}
.group-btn[aria-expanded="true"],.group-btn[data-active]{background:var(--ember-12);border-color:var(--ember-40);color:var(--bone);font-weight:600}
.group-btn[aria-expanded="true"] .icon{transform:rotate(180deg);color:var(--ember)}
.nav-controls{display:flex;align-items:center;gap:8px;margin-left:auto}
.nav .cta{min-height:36px;padding:6px 14px;font-size:13px}
.burger{display:none;width:38px;height:38px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--bone);align-items:center;justify-content:center;cursor:pointer;padding:0}
.burger .icon{width:22px;height:22px}
.burger .cross{display:none}
.nav.open .burger .bars{display:none}.nav.open .burger .cross{display:block}
/* the panels: one under the bar per group, the whole width, graphite */
.panels{position:absolute;left:0;right:0;top:100%;z-index:39}
.nav:not(.panel-open) .panels{display:none}
.panel-wrap{padding-top:0;padding-bottom:0}
.nav-panel{background:var(--graphite);border:1px solid var(--line);border-top:0;border-radius:0 0 16px 16px;box-shadow:0 24px 60px var(--shadow);padding:16px;margin-top:-1px}
.nav-panel[hidden]{display:none}
.panel-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
.panel-list a,.sheet-group a{display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:12px;border:1px solid transparent;color:var(--bone);min-width:0;transition:background .15s ease,border-color .15s ease}
.panel-list a b,.sheet-group a b{font:600 15px/1.3 var(--sans);color:var(--bone)}
.panel-list a span,.sheet-group a span{font:400 13px/1.45 var(--sans);color:var(--ash)}
.panel-list a:hover,.sheet-group a:hover{background:var(--hover);border-color:var(--line)}
.panel-list a[aria-current="page"],.sheet-group a[aria-current="page"]{background:var(--ember-12);border-color:var(--ember-40)}
@media (max-width:1100px){.panel-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* the sheet on phones: full screen under the bar, every group */
.nav-sheet{display:none}
.nav-sheet[hidden]{display:none!important}
html.nav-locked,html.nav-locked body{overflow:hidden}
@media (max-width:860px){
.nav-groups,.panels{display:none!important}
.burger{display:inline-flex}
.devnet{display:none}
.nav .cta{display:inline-flex}
.nav-sheet,.nav.open .nav-sheet{display:block;position:absolute;left:0;right:0;top:100%;height:calc(100vh - var(--nav-h));height:calc(100dvh - var(--nav-h));z-index:38;background:var(--obsidian);border-top:1px solid var(--line);padding:0;max-height:none;overflow:hidden;grid-template-columns:none}
.sheet-scroll{height:100%;overflow:auto;-webkit-overflow-scrolling:touch;padding:12px 16px 32px}
.sheet-group{padding:10px 0 6px;border-bottom:1px solid var(--line)}
.sheet-head{font:500 11px/1.7 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ember-text);padding:6px 14px 4px}
.sheet-group a{padding:11px 14px}
.sheet-foot{padding:20px 0 0;display:flex;flex-direction:column;gap:14px}
.sheet-foot .btn{width:100%}
.sheet-social{display:flex;gap:18px;justify-content:center;font:500 13px/1 var(--sans);color:var(--ink-2)}
}
@media (max-width:420px){.nav-row{gap:10px}.logo .word{font-size:16px}.nav .cta{padding:6px 12px}}
/* mark-tokens:start (site/lib/marks.mjs tokensCss(), written by build.mjs; edit the module, never this block) */
:root{--mark-nvidia:#8BE37A;--mark-nvidia-well:rgba(139,227,122,.14);--mark-nvidia-ring:rgba(139,227,122,.45);--mark-amd:#FF5A5A;--mark-amd-well:rgba(255,90,90,.14);--mark-amd-ring:rgba(255,90,90,.45);--mark-intel:#7CC4FF;--mark-intel-well:rgba(124,196,255,.14);--mark-intel-ring:rgba(124,196,255,.45);--mark-apple:#E6E3DD;--mark-apple-well:rgba(230,227,221,.14);--mark-apple-ring:rgba(230,227,221,.45);--mark-gpu:#9A9A9E;--mark-gpu-well:rgba(154,154,158,.14);--mark-gpu-ring:rgba(154,154,158,.45)}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]){--mark-nvidia:#2F8A22;--mark-nvidia-well:rgba(47,138,34,.1);--mark-nvidia-ring:rgba(47,138,34,.45);--mark-amd:#C41E2A;--mark-amd-well:rgba(196,30,42,.1);--mark-amd-ring:rgba(196,30,42,.45);--mark-intel:#1C6FD6;--mark-intel-well:rgba(28,111,214,.1);--mark-intel-ring:rgba(28,111,214,.45);--mark-apple:#4A4A50;--mark-apple-well:rgba(74,74,80,.1);--mark-apple-ring:rgba(74,74,80,.45);--mark-gpu:#6B6B70;--mark-gpu-well:rgba(107,107,112,.1);--mark-gpu-ring:rgba(107,107,112,.45)}}
:root[data-theme="light"]{--mark-nvidia:#2F8A22;--mark-nvidia-well:rgba(47,138,34,.1);--mark-nvidia-ring:rgba(47,138,34,.45);--mark-amd:#C41E2A;--mark-amd-well:rgba(196,30,42,.1);--mark-amd-ring:rgba(196,30,42,.45);--mark-intel:#1C6FD6;--mark-intel-well:rgba(28,111,214,.1);--mark-intel-ring:rgba(28,111,214,.45);--mark-apple:#4A4A50;--mark-apple-well:rgba(74,74,80,.1);--mark-apple-ring:rgba(74,74,80,.45);--mark-gpu:#6B6B70;--mark-gpu-well:rgba(107,107,112,.1);--mark-gpu-ring:rgba(107,107,112,.45)}
/* mark-tokens:end */
/* marks: OS glyphs in the brand's monochrome well; vendor glyphs in the app's tinted well (tokens stamped by the build from site/lib/marks.mjs) */
.osmark,.badge[data-mark]{width:44px;height:44px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;border:1px solid var(--ring);background:var(--well);color:var(--bone);box-shadow:0 0 0 0 transparent;transition:box-shadow .15s ease,border-color .15s ease;vertical-align:middle}
.osmark svg,.badge[data-mark] svg{width:22px;height:22px;display:block}
.osmark.mini,.badge[data-mark].mini{width:26px;height:26px;border-radius:8px;flex:0 0 26px;display:inline-flex;margin-right:8px}
.osmark.mini svg,.badge[data-mark].mini svg{width:15px;height:15px}
.osmark.bare{width:auto;height:auto;border:0;background:transparent;flex:none;border-radius:0}
.osmark.bare svg{width:20px;height:20px}
.btn .osmark.bare svg{width:18px;height:18px}
.btn.primary .osmark{color:var(--ember-ink)}
.badge[data-mark].nvidia{color:var(--mark-nvidia);background:var(--mark-nvidia-well);border-color:var(--mark-nvidia-ring)}
.badge[data-mark].amd{color:var(--mark-amd);background:var(--mark-amd-well);border-color:var(--mark-amd-ring)}
.badge[data-mark].intel{color:var(--mark-intel);background:var(--mark-intel-well);border-color:var(--mark-intel-ring)}
.badge[data-mark].apple{color:var(--mark-apple);background:var(--mark-apple-well);border-color:var(--mark-apple-ring)}
.badge[data-mark].gpu{color:var(--mark-gpu);background:var(--mark-gpu-well);border-color:var(--mark-gpu-ring)}
tr:hover .badge[data-mark],a:hover .badge[data-mark],.gpu-row:hover .badge[data-mark],.gpu-row:focus-within .badge[data-mark]{border-color:currentColor;box-shadow:0 0 0 3px var(--mark-gpu-well)}
/* the app's .gen series line is not drawn on the site: the build pages own .gen for their footnote */
td .badge[data-mark].mini{margin-right:10px}
.cardname{display:inline-flex;align-items:center;gap:0;white-space:nowrap}
@media (prefers-reduced-motion:reduce){.badge[data-mark],.osmark{transition:none}}
/* the home fold: the mark on the ember glow (the wallet's lock screen), one line, two buttons, the scene breathing under it */
.fold{position:relative;overflow:hidden;min-height:calc(100vh - var(--nav-h));min-height:calc(100svh - var(--nav-h));display:flex;flex-direction:column}
.fold-scene{position:absolute;inset:0;z-index:0}
.fold-scene canvas{display:block;width:100%;height:100%}
.fold-scene{transition:opacity .6s ease}
.fold.pending .fold-scene{opacity:0}
.fold-scene::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in srgb,var(--obsidian) 55%,transparent) 0%,color-mix(in srgb,var(--obsidian) 62%,transparent) 36%,color-mix(in srgb,var(--obsidian) 30%,transparent) 64%,var(--obsidian) 100%);pointer-events:none}
.fold-body{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 20px 56px;gap:0}
.fold-coin{position:relative;width:132px;height:132px;display:flex;align-items:center;justify-content:center;margin-bottom:26px;flex:0 0 auto}
.fold-coin::before{content:"";position:absolute;inset:-150px;border-radius:50%;background:radial-gradient(circle,rgba(255,179,92,.10) 0,rgba(242,84,27,.05) 40%,rgba(242,84,27,0) 68%);pointer-events:none}
.fold-glow{position:absolute;inset:-70px;border-radius:50%;background:radial-gradient(circle,rgba(242,84,27,.38) 0,rgba(242,84,27,.14) 36%,rgba(242,84,27,0) 66%);animation:breathe 6s ease-in-out infinite;pointer-events:none}
@keyframes breathe{0%,100%{opacity:.75;transform:scale(1)}50%{opacity:1;transform:scale(1.06)}}
.fold-coin svg{position:relative;width:132px;height:132px;border-radius:30px;filter:drop-shadow(0 12px 32px rgba(242,84,27,.35))}
.fold h1{font-size:clamp(34px,5vw,64px);max-width:16ch;margin:0 0 14px;text-wrap:balance}
.fold h1 .accent{color:var(--ember-text)}
.fold .lead{max-width:50ch;color:var(--ink-2);font-size:clamp(16px,1.5vw,19px);margin:0 0 30px;text-wrap:balance}
.fold-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center}
.fold-actions .btn{min-height:54px;padding:12px 24px;font-size:16px;gap:12px}
.fold-actions .btn .osmark.bare svg{width:20px;height:20px}
.fold-actions .btn .meta{font:400 11px/1 var(--mono);opacity:.8;margin-left:2px}
.fold-more{margin:18px 0 0;font:400 13px/1.6 var(--sans);color:var(--ash)}
.fold p.fold-more a:not(.btn){color:var(--ink-2);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--line-2)}
.fold p.fold-more a:not(.btn):hover{color:var(--ember-text)}
.fold-state{position:absolute;right:20px;bottom:18px;z-index:1}
@media (max-width:560px){.fold{min-height:auto}.fold-body{padding:36px 16px 40px}.fold-coin{width:104px;height:104px;margin-bottom:22px}.fold-coin svg{width:104px;height:104px;border-radius:24px}.fold-actions{flex-direction:column;width:100%}.fold-actions .btn{width:100%;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:12px;row-gap:2px;justify-content:start;text-align:left;padding:10px 18px}.fold-actions .btn .osmark{grid-row:1/3;align-self:center}.fold-actions .btn .meta{grid-column:2;margin:0}.fold-state{position:static;align-self:center;margin:0 0 20px}.fold{flex-direction:column}}
@media (prefers-reduced-motion:reduce){.fold-glow{animation:none}}
/* below the fold: three short blocks */
.home-three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.home-three .tile,.home-tile{background:var(--graphite);border:1px solid var(--line);border-radius:16px;padding:22px 24px;min-width:0}
.home-tile .k{font:500 11px/1.7 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ash);margin-bottom:8px}
.home-tile .v{font:700 clamp(24px,2.6vw,34px)/1.1 var(--display);letter-spacing:-.02em;color:var(--bone)}
.home-tile .v.ember{color:var(--ember-text)}
.home-tile .d{font:400 13px/1.5 var(--sans);color:var(--ink-2);margin-top:8px}
.home-three.rows{grid-template-columns:1fr}
.home-row{display:flex;gap:16px;align-items:flex-start;background:var(--graphite);border:1px solid var(--line);border-radius:12px;padding:16px 18px;color:var(--ink-2)}
.home-row .n{font:700 13px/1 var(--display);color:var(--ember-text);border:1px solid var(--line-2);width:34px;height:34px;border-radius:9px;display:grid;place-items:center;flex:0 0 34px}
.home-row b{color:var(--bone);display:block;margin-bottom:2px}
.home-row p{margin:0;font-size:14px}
.home-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:18px}
.home-head h2{font-size:clamp(20px,2.2vw,26px)}
.community{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.community a{display:flex;align-items:center;gap:14px;padding:18px 20px;background:var(--graphite);border:1px solid var(--line);border-radius:16px;color:var(--bone);transition:border-color .15s ease,transform .15s ease}
.community a:hover{border-color:var(--line-2);transform:translateY(-1px)}
.community a svg{width:24px;height:24px;flex:none;color:var(--ink-2)}
.community a b{display:block;font-weight:600}.community a span{display:block;font-size:13px;color:var(--ash)}
.home-quiet{font:400 13px/1.7 var(--sans);color:var(--ash);margin:16px 0 0;max-width:80ch}
.home-quiet a{color:var(--ink-2);text-decoration:underline;text-underline-offset:3px}
@media (max-width:860px){.home-three,.community{grid-template-columns:1fr}.home-head{flex-direction:column;align-items:flex-start;gap:8px}}
/* the download page and every download card */
.dl-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.dl-card{display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px 16px;align-items:start;background:var(--graphite);border:1px solid var(--line);border-radius:16px;padding:22px}
.dl-card.primary{border-color:var(--ember-40);background:linear-gradient(135deg,var(--ember-12),transparent 60%),var(--graphite)}
.dl-card h3{margin:0 0 2px;font-size:18px}
.dl-card .sub{font:400 13px/1.5 var(--sans);color:var(--ash)}
.dl-card .body{grid-column:1/-1;display:flex;flex-direction:column;gap:12px}
.dl-card .body p{color:var(--ink-2);font-size:14px;margin:0}
.dl-card .btn{align-self:flex-start}
.dl-card .btn .meta{font:400 11px/1 var(--mono);opacity:.8}
.dl-card .sha{font:400 11px/1.6 var(--mono);color:var(--ash);overflow-wrap:anywhere}
.dl-card .sha b{color:var(--ink-2);font-weight:500}
.dl-card [data-dl-missing]{opacity:.55;pointer-events:none}
@media (max-width:860px){.dl-grid{grid-template-columns:1fr}}
.dl-row a .osmark{grid-row:1/3}
.footer-dl{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0}
.footer-dl a{display:inline-flex;align-items:center;gap:8px;padding:7px 12px 7px 8px;border:1px solid var(--line);border-radius:999px;font:500 12px/1 var(--sans);color:var(--ink-2)}
.footer-dl a:hover{border-color:var(--line-2);color:var(--bone)}
.footer-dl a .osmark.mini{margin:0}
.site-footer{padding:48px 0 22px}
.footer-grid{gap:32px}
.footer-bottom{font:11px/1.8 var(--mono)}
.footer-bottom .theme-group{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;align-self:flex-start}
.footer-bottom .theme-group button{border:0;background:transparent;color:var(--ash);font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:8px 12px;cursor:pointer}
.footer-bottom .theme-group button[aria-pressed="true"]{color:var(--bone);background:var(--hover)}
@media (max-width:860px){.footer-grid{grid-template-columns:1fr 1fr}.footer-grid .footer-brand{grid-column:1/-1}.footer-bottom{flex-direction:column}}
@media (max-width:560px){.footer-grid{grid-template-columns:1fr}}
/* phones: no horizontal scroll anywhere */
html,body{max-width:100%;overflow-x:clip}
.container,.wrap{min-width:0}
pre,code{overflow-wrap:anywhere}
pre{max-width:100%;overflow:auto}
.tbl,.table-wrap{max-width:100%;overflow-x:auto}
/* the explorer's block and address titles are hashes: they wrap, never clip (overlap sweep, 7 Oct 2026) */
main .head h1,h1#title,.hash,.mono.long{overflow-wrap:anywhere}
/* the ledger's status row wraps its long badges at phone width (overlap sweep, 7 Oct 2026) */
article .status{white-space:normal;flex-wrap:wrap;overflow:visible}
article .status .badge:not([data-mark]){white-space:normal;overflow-wrap:anywhere;line-height:1.5;max-width:100%}
/* data tables size to their content and scroll inside their frame, never squeeze a column to a sliver (site-ui-5) */
.tbl table,.table-wrap table{width:100%;min-width:720px;table-layout:auto}
.tbl td,.table-wrap td{white-space:normal;overflow-wrap:break-word;vertical-align:top;min-width:9ch}
.tbl td .cardname,.table-wrap td .cardname{white-space:nowrap}
.phero .os span{display:inline-flex;align-items:center}
.download-platform{display:flex;align-items:center;gap:14px}
/* the evidence table's status pills wrap inside their cell (overlap sweep, 7 Oct 2026) */
table#claims .st{white-space:normal;display:inline-block;line-height:1.4;max-width:100%}
/* the padding sweep (tools/ci/padding-check.mjs, 7 Oct 2026): every section's vertical padding on the scale (a multiple of 4
from 24), every card's inner padding 24, so no text or control sits under 24 px from a filled edge */
.page-hero,main .obs-head,.lost{padding-top:64px;padding-bottom:48px}
@media (max-width:560px){.page-hero{padding:24px 0}}
.site-footer{padding-bottom:24px}
.footer-bottom{padding-top:24px}
.doc-section,article section{padding-bottom:40px;margin-bottom:40px}
@media (max-width:860px){.sec{padding:72px 0}}
.lost{padding-bottom:96px}
.grid>section.card{padding-top:36px;padding-bottom:36px}
.motion{padding:24px}
.lab{padding-top:48px}
.dl-card,.home-tile,.tiles6>div,.mstats>div,.label,.card,.feature,.tool-card,.stat{padding:24px}
.dl-card{gap:14px 16px}
.dl-card .body{grid-column:1/-1}
.footer-bottom{padding-bottom:0}
@media (max-width:560px){.footer-bottom{padding-bottom:0}}
/* the ledger's count table keeps each status badge whole: the table scrolls, the word never breaks */
.counts .badge:not([data-mark]){white-space:nowrap;overflow-wrap:normal}
/* the same scale and 24 px rule where a page's own style block sits later in the cascade (the sweep's second round) */
main .layout article section{padding-bottom:40px;margin-bottom:40px}
main .lost{padding-top:64px;padding-bottom:96px}
main .motion{padding:24px}
main .lab{padding-top:48px}
main .tiles6>div,main .mstats>div{padding:24px 25px}
main .labels .label{padding:24px}
main .state-card,main .milestone{padding:24px}
main .strip{padding-top:24px;padding-bottom:24px}
/* the sweep's third round: the live inspector and toolbar at 24, the band and the download card 24 from their edges on phones */
main .icol{padding:24px}
main .toolbar{padding:24px 25px}
@media (max-width:560px){.band .wrap,.band .container{padding-left:24px;padding-right:24px}.download-card{padding:24px}}
/* the journey's phases are cards in this system: the old timeline rail and marker (drawn for an unboxed list) go, the badge says the state; the when column keeps clear of the body */
main .milestone:before,main .milestone:after{display:none}
main .milestone .when{padding-right:12px;padding-top:2px}
@media (max-width:560px){main .milestone{padding:24px}}
/* the litepaper's body paragraphs share one measure (the eye pass: the first paragraph sat narrower than the second) */
main .layout article section>p{max-width:76ch}
/* the ledger's count table: a filter chip stays on one line, the table scrolls before a pill wraps */
main table .chip{white-space:nowrap}
/* no orphan word on its own line (copy law 18): the browser's pretty wrapping on body text; headings already balance */
p,li,dd,figcaption,.lead,.d,.sub{text-wrap:pretty}
/* a comparison table's label column holds a short phrase on one or two lines, never one word per line */
main .tbl td:first-child,main .table-wrap td:first-child{min-width:14ch}
/* a section lifted into a derived page keeps its own .container: the inner one adds no second gutter; a card's table clears the text above it */
main .container .container,main .wrap .wrap{padding-left:0;padding-right:0}
.feecard .tbl,.feecard .table-wrap{margin-top:16px}
/* the eye pass on /faucet and /metamask: the headline keeps a gap above its lead, two cards in a grid line up at the top, the page ends 72 px above the footer */
main.wrap h1+p,main.wrap h1+.lead,.page-hero h1+.lead{margin-top:16px}
main.wrap>.grid{align-items:start}
main.wrap{padding-bottom:72px}
@media (max-width:560px){main.wrap{padding-bottom:48px}}
main.wrap>.grid{margin-bottom:40px}
Reference in a new issue View git blame Copy permalink