:root {
  --bg:#1A4CFF; --bg2:#123ADB; --ink:#14122B; --paper:#FFF8EA;
  --butter:#FFE45C; --coral:#FF5C7A; --coral-deep:#E23C5C; --mint:#7CF7C5;
  --text:#FFF8EA; --muted:rgba(255,248,234,.76); --line:rgba(255,248,234,.3);
  --card:#FFF8EA; --card-text:#14122B; --card-muted:#5B5878; --card-accent:#123ADB;
  color-scheme:light;
}
@media (prefers-color-scheme:dark) {
  :root:not([data-theme="light"]) {
    --bg:#0E1B4D; --bg2:#0A1440; --text:#FFF8EA; --muted:rgba(255,248,234,.7);
    --line:rgba(255,248,234,.23); --card:#17224F; --card-text:#FFF8EA; --card-muted:#B9BEDF; --card-accent:#FFE45C;
    color-scheme:dark;
  }
}
:root[data-theme="dark"] {
  --bg:#0E1B4D; --bg2:#0A1440; --text:#FFF8EA; --muted:rgba(255,248,234,.7);
  --line:rgba(255,248,234,.23); --card:#17224F; --card-text:#FFF8EA; --card-muted:#B9BEDF; --card-accent:#FFE45C;
  color-scheme:dark;
}
* { box-sizing:border-box }
html { scroll-behavior:smooth }
body { margin:0; overflow-x:clip; background:var(--bg); color:var(--text); font-family:"Bricolage Grotesque","Trebuchet MS","Segoe UI",Arial,sans-serif; line-height:1.45 }
a { color:inherit }
button { font:inherit; cursor:pointer }
:focus-visible { outline:3px solid var(--butter); outline-offset:3px }
[hidden] { display:none!important }
.wrap { width:min(1080px,calc(100% - 40px)); margin-inline:auto }
.ticker { position:sticky; top:0; z-index:10; overflow:hidden; white-space:nowrap; background:var(--butter); color:var(--ink); border-bottom:3px solid var(--ink); font-weight:800; letter-spacing:.03em; font-size:13px }
.rail { display:inline-block; padding:8px 0; animation:rail 34s linear infinite }
@keyframes rail { to { transform:translateX(-50%) } }
.site-header { display:flex; align-items:center; justify-content:space-between; gap:22px; padding-block:24px }
.brand { text-decoration:none; font-size:26px; font-weight:800; letter-spacing:-.055em }
.brand span { color:var(--butter); margin-left:2px }
nav { display:flex; gap:22px; font-size:15px; font-weight:700 }
nav a { text-decoration:none; border-bottom:2px solid transparent }
nav a:hover { border-color:var(--butter) }
button,.button { border:3px solid var(--ink); border-radius:14px; background:var(--butter); color:var(--ink); padding:13px 20px; font-weight:800; box-shadow:5px 5px 0 var(--ink); transition:transform .08s,box-shadow .08s }
button:hover,.button:hover { transform:translate(2px,2px); box-shadow:3px 3px 0 var(--ink) }
button:active,.button:active { transform:translate(4px,4px); box-shadow:1px 1px 0 var(--ink) }
button.small { padding:8px 12px; font-size:13px }
button.ghost { background:var(--card); color:var(--card-text) }
.hero { padding-top:54px; padding-bottom:44px }
.eyebrow { font-size:13px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--butter) }
.feature-card .eyebrow,.detail-card .eyebrow,.token-card .eyebrow { color:var(--card-accent) }
h1,h2,h3,p { margin-top:0 }
h1,h2,h3 { line-height:.96; letter-spacing:-.035em }
h1 { font-size:clamp(86px,19vw,220px); color:var(--butter); font-weight:800; font-stretch:75%; line-height:.83; text-shadow:6px 6px 0 var(--ink); margin:16px 0 28px }
h2 { font-size:clamp(38px,6vw,64px); font-weight:800; margin-bottom:12px }
h3 { font-size:clamp(26px,3vw,36px); font-weight:800 }
.hero-sub { display:flex; justify-content:space-between; gap:24px; align-items:end; flex-wrap:wrap; margin-bottom:50px }
.hero-sub p { max-width:600px; font-size:clamp(21px,2.5vw,28px); font-weight:600; margin:0 }
.chain-pill,.count-pill,.phase-pill { display:inline-block; border:2px solid var(--line); border-radius:999px; padding:7px 13px; font-size:14px; font-weight:800; white-space:nowrap }
.feature-card,.detail-card,.token-card { position:relative; background:var(--card); color:var(--card-text); border:4px solid var(--ink); border-radius:23px; box-shadow:12px 12px 0 var(--ink); padding:30px }
.stamp { position:absolute; top:-18px; right:24px; border:3px solid var(--ink); border-radius:999px; background:var(--coral); color:#fff; padding:7px 15px; font-size:14px; font-weight:800; transform:rotate(4deg) }
.feature-label,.card-label { color:var(--card-muted); font-size:15px; font-weight:700; text-transform:uppercase; letter-spacing:.08em }
.feature-card h2 { color:var(--card-text); font-size:clamp(31px,5vw,56px); margin:13px 0 10px }
.feature-card p { color:var(--card-muted); font-size:17px; max-width:65ch; margin-bottom:0 }
.meter,.detail-meter { margin-top:28px }
.meter-row { display:flex; justify-content:space-between; align-items:baseline; gap:16px; font-size:15px; font-weight:700 }
.meter-row strong { font-size:clamp(30px,6vw,64px); letter-spacing:-.04em; line-height:1; font-variant-numeric:tabular-nums }
.meter-row.quiet { margin-top:8px; font-size:14px }
.bar { --border:3px; position:relative; z-index:2; height:30px; margin-top:44px }
.bar .track { position:absolute; inset:0; border:var(--border) solid var(--ink); border-radius:999px; background:var(--paper) }
.bar .fill { position:absolute; left:0; top:0; bottom:0; width:var(--w,0px); border:var(--border) solid var(--ink); border-radius:999px; background:var(--coral); transition:width .6s ease }
.bar .fill.is-empty { visibility:hidden }
.bar .fill.is-over { box-shadow:6px 6px 0 var(--ink) }
.bar .fill::after { content:""; position:absolute; top:0; bottom:0; right:0; left:calc(var(--tw,100%) - var(--border)); border-radius:0 999px 999px 0; background:repeating-linear-gradient(-45deg,transparent 0 7px,var(--coral-deep) 7px 13px); opacity:0 }
.bar .fill.is-over::after { opacity:1 }
.bar .flag { position:absolute; right:-6px; bottom:calc(100% + 8px); background:var(--ink); color:var(--paper); font-weight:800; font-size:13px; line-height:1.4; white-space:nowrap; font-variant-numeric:tabular-nums; padding:3px 10px; border-radius:8px }
.bar .flag::after { content:""; position:absolute; right:14px; top:100%; border:6px solid transparent; border-top-color:var(--ink) }
.bar .fill.is-over .flag { background:var(--coral); color:var(--ink); border:2px solid var(--ink) }
.bar .speed { position:absolute; right:18px; top:-10px; bottom:-10px; width:46px; display:none }
.bar .fill.is-capped .speed { display:block }
.bar .speed i { position:absolute; right:0; height:3px; border-radius:3px; background:var(--ink); animation:whoosh .9s linear infinite }
.bar .speed i:nth-child(1) { top:-2px; width:28px }
.bar .speed i:nth-child(2) { bottom:-2px; width:40px; animation-delay:-.3s }
.bar .speed i:nth-child(3) { bottom:-2px; right:48px; width:16px; animation-delay:-.6s }
.bar + .meter-row { margin-top:16px }
.bar .goal-tick { position:absolute; top:-8px; bottom:-8px; right:0; width:3px; background:var(--ink); border-radius:2px; z-index:3 }
.bar.play .fill { animation:grow 1.5s cubic-bezier(.3,.7,.3,1) both }
.is-over-card.nudge { animation:nudge 1.5s both }
@media (max-width:1180px) { .feature-card.is-over-card,.detail-card.is-over-card { margin-right:48px } }
@keyframes whoosh { 0% { transform:translateX(8px); opacity:0 } 30% { opacity:1 } 100% { transform:translateX(-26px); opacity:0 } }
@keyframes grow { 0% { width:0 } 50% { width:var(--stall) } 64% { width:var(--stall) } 100% { width:var(--w) } }
@keyframes nudge { 0%,63% { transform:none } 68% { transform:translateX(-4px) rotate(-.4deg) } 76% { transform:translateX(2px) } 84%,100% { transform:none } }
.section { padding-block:72px }
.section-head { display:flex; align-items:end; justify-content:space-between; gap:20px; flex-wrap:wrap }
.section-intro { max-width:60ch; font-size:18px; color:var(--muted) }
.campaign-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px; margin-top:28px }
.campaign-card,.empty-card,.step,.stat { background:var(--card); color:var(--card-text); border:3px solid var(--ink); border-radius:18px; padding:22px }
.campaign-card { text-align:left; min-height:220px; box-shadow:6px 6px 0 var(--ink); display:flex; flex-direction:column; gap:12px; width:100%; transition:transform .08s,box-shadow .08s }
.campaign-card:hover { transform:translate(3px,3px); box-shadow:3px 3px 0 var(--ink) }
.campaign-card .label { color:var(--card-muted); font-size:13px; font-weight:800; text-transform:uppercase; letter-spacing:.08em }
.campaign-card strong { font-size:28px; line-height:1; overflow-wrap:anywhere }
.campaign-card .meta { color:var(--card-muted); font-size:14px }
.empty-card { grid-column:1/-1; min-height:160px; display:grid; place-items:center; text-align:center; font-size:20px; font-weight:700 }
.detail-card { margin-top:36px }
.detail-card>h3:not(:first-child),.token-card>h3:not(:first-child) { margin-top:32px }
.detail-top { display:flex; justify-content:space-between; gap:20px; align-items:start; flex-wrap:wrap }
.detail-top h3 { margin:10px 0 0; overflow-wrap:anywhere }
.phase-pill { color:var(--card-text); border-color:var(--card-text) }
.quiet { color:var(--card-muted) }
.stat-grid,.token-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:26px }
.stat { border-width:2px; padding:17px; min-width:0 }
.stat span { display:block; font-size:13px; font-weight:700; color:var(--card-muted) }
.stat strong { display:block; font-size:clamp(19px,2.2vw,27px); margin-top:10px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere }
.quote-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:12px }
.quote-grid>div { border:2px dashed var(--card-muted); border-radius:14px; padding:15px; min-width:0 }
.quote-grid span { display:block; color:var(--card-muted); font-size:12px; font-weight:700 }
.quote-grid strong { display:block; font-size:19px; margin-top:8px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere }
.split-card { display:grid; grid-template-columns:4fr 1.5fr 2fr 3fr; gap:10px; margin-top:24px }
.split-box { border:2px solid var(--ink); border-radius:14px; padding:15px; color:var(--ink) }
.split-box b { display:block; font-size:30px; line-height:1 }
.split-box span { font-size:13px; font-weight:700 }
.coral { background:var(--coral); color:white }.mint { background:var(--mint) }.butter { background:var(--butter) }.paper { background:var(--paper) }
.address-list { display:grid; gap:9px; margin-top:25px; padding-top:20px; border-top:2px dashed var(--card-muted) }
.address-list>div { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; font-size:14px }
.address-list span { color:var(--card-muted); font-weight:700 }
.address-list code { overflow-wrap:anywhere; font-size:13px }
.token-layout { display:grid; grid-template-columns:1.1fr .9fr; gap:24px; margin-top:30px }
.token-card { box-shadow:none; border-width:3px }
.supply-number { display:block; font-size:clamp(32px,5vw,54px); letter-spacing:-.04em; line-height:1; margin:14px 0 5px; font-variant-numeric:tabular-nums }
.allocation-bar { display:flex; margin:22px 0; border:3px solid var(--ink); border-radius:999px; overflow:hidden; color:var(--ink); font-weight:800; font-size:13px }
.allocation-bar span { padding:11px 8px; white-space:nowrap; text-align:center }
.allocation-bar span:first-child { flex:1; background:var(--coral); color:white }
.allocation-bar span:last-child { flex:1; background:var(--mint) }
.allocation-caption { display:flex; justify-content:space-between; gap:15px; margin-top:-16px; margin-bottom:22px; font-size:13px; font-weight:700; color:var(--card-muted) }
.token-card p { font-size:15px; color:var(--card-muted); margin-bottom:0 }
.token-stats { grid-template-columns:repeat(2,1fr); margin:0 }
.fine { color:var(--muted); font-size:15px; margin-top:20px; max-width:76ch }
.create-title { font-size:clamp(58px,11vw,110px); margin:20px 0 30px }
.create-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:24px }
.create-form label { display:grid; gap:7px; font-weight:800; color:var(--card-text) }
.create-form input,.create-form select,.create-form textarea { width:100%; min-height:48px; border:2px solid var(--ink); border-radius:10px; padding:10px; background:var(--paper); color:var(--ink); font:inherit }
.create-form textarea { min-height:90px; resize:vertical }
.create-form button { align-self:end }
.recipient-list { grid-column:1 / -1; display:grid; gap:10px; border:2px solid var(--ink); border-radius:10px; padding:12px }
.recipient-list legend { font-weight:800; padding:0 6px }
.recipient-list ol { display:grid; gap:8px; margin:0; padding-left:22px }
.recipient-list li { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center }
.recipient-list button { align-self:center; justify-self:start }
.create-result { margin:20px 0 0; overflow-wrap:anywhere; font-weight:700 }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:30px }
.step span { display:block; font-size:53px; font-weight:800; line-height:1; color:var(--coral); margin-bottom:15px }
.step h3 { font-size:23px; margin-bottom:9px }
.step p { font-size:15px; color:var(--card-muted); margin:0 }
footer { background:var(--butter); color:var(--ink); border-top:4px solid var(--ink); padding:48px 0 }
footer .wrap { display:grid; grid-template-columns:1fr 2fr auto; gap:24px; align-items:start }
footer strong { font-size:30px; letter-spacing:-.05em }
footer p { font-size:15px; margin:0 }
footer span { font-size:13px; font-weight:700 }
@media (max-width:800px) {
  .stat-grid,.steps { grid-template-columns:repeat(2,1fr) }
  .quote-grid { grid-template-columns:1fr }
  .token-layout { grid-template-columns:1fr }
  .site-header { flex-wrap:wrap }
  nav { order:3; width:100%; justify-content:space-between }
  .section { padding-block:54px }
}
@media (max-width:520px) {
  .create-form { grid-template-columns:1fr }
  .wrap { width:min(100% - 28px,1080px) }
  .site-header { padding-block:15px }
  .brand { font-size:23px }
  nav { gap:9px; font-size:13px }
  h1 { font-size:clamp(66px,18vw,96px); text-shadow:4px 4px 0 var(--ink) }
  .hero { padding-top:40px }
  .hero-sub { margin-bottom:42px }
  .feature-card,.detail-card,.token-card { padding:21px; box-shadow:7px 7px 0 var(--ink) }
  .stamp { font-size:11px; right:10px }
  .stat-grid,.steps,.token-stats { grid-template-columns:1fr 1fr }
  .split-card { grid-template-columns:1fr }
  footer .wrap { grid-template-columns:1fr }
}
@media (max-width:390px) {
  .stat-grid,.steps,.token-stats { grid-template-columns:1fr }
  .allocation-bar { font-size:11px }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; animation:none!important; transition:none!important }
}
.claim-shell { max-width:820px; padding-top:40px }
.claim-title { font-size:clamp(64px,12vw,128px); margin:12px 0 20px }
.claim-shell>.section-intro { margin-bottom:0 }
.deploy-mode { margin-top:0; color:var(--muted) }
.claim-shell>.detail-card { margin-top:32px }
.claim-card-title { font-size:clamp(28px,4vw,40px); margin-bottom:22px }
.claim-next { margin-top:32px }
.claim-campaign h3 { font-size:clamp(26px,3.4vw,36px); margin:8px 0 0 }
.claim-meta { margin:14px 0 0; font-size:14px; overflow-wrap:anywhere }
.claim-eligible { margin-top:14px }
.claim-eligible li, .eligible-list li { margin:4px 0; overflow-wrap:anywhere }
.claim-eligible code, .eligible-list code { font-size:12px; opacity:.7 }
.claim-campaign .detail-meter { margin-top:22px }
.claim-campaign .meter-row strong { font-size:clamp(28px,4.5vw,44px) }
.claim-campaign .meter-row span { color:var(--card-muted) }
.claim-amount { margin-top:24px; padding-top:20px; border-top:2px dashed var(--card-muted) }
.claim-amount strong { display:block; margin-top:6px; font-size:clamp(34px,5.5vw,56px); letter-spacing:-.04em; line-height:1; font-variant-numeric:tabular-nums }
.claim-amount p { margin:12px 0 0; font-size:15px }
.claim-amount p:empty { display:none }
.claim-steps { list-style:none; counter-reset:claim-step; margin:8px 0 0; padding:0; display:grid; gap:14px }
.claim-step { counter-increment:claim-step; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:16px; border:3px solid var(--ink); border-radius:16px; padding:16px 18px }
.claim-step::before { content:counter(claim-step); display:grid; place-items:center; width:38px; height:38px; border:3px solid var(--ink); border-radius:999px; background:var(--paper); color:var(--ink); font-weight:800 }
.claim-step.done::before { content:"✓"; background:var(--mint) }
.claim-step-text strong { display:block; font-size:18px }
.claim-step-text p { margin:4px 0 0; font-size:14px; overflow-wrap:anywhere }
.claim-step button { white-space:nowrap }
button:disabled,button:disabled:hover { cursor:not-allowed; opacity:.45; transform:none; box-shadow:5px 5px 0 var(--ink) }
.claim-fine { margin:22px 0 0; font-size:14px }
.claim-shell .button-row { margin-top:16px }
#campaign-error { margin-top:24px }
.claim-label { display:block; font-weight:800; margin-bottom:10px }
.claim-input { width:100%; padding:14px 16px; border:3px solid var(--ink); border-radius:14px; background:var(--paper); color:var(--ink); font:inherit; margin-bottom:20px }
.claim-status { margin-top:30px; font-weight:800; overflow-wrap:anywhere }
.claim-status:empty { display:none }
.claim-terms { display:grid; gap:8px; margin-block:20px }
.claim-terms div { display:flex; justify-content:space-between; gap:20px; padding:10px 0; border-bottom:1px solid var(--card-muted) }
.claim-terms span { color:var(--card-muted) }
.claim-terms strong { text-align:right; overflow-wrap:anywhere }
@media (max-width:600px) {
  .claim-terms div { display:block }
  .claim-terms strong { display:block; text-align:left }
  .claim-step { grid-template-columns:auto 1fr }
  .claim-step button { grid-column:1/-1; width:100% }
}

.budget-row { margin:10px 0 0; overflow-wrap:anywhere; font-size:14px }
.wallet-panel { margin-top:26px; padding-top:22px; border-top:3px dashed var(--card-muted) }
.wallet-panel h4 { margin:6px 0 14px; font-size:22px }
.wallet-panel code { overflow-wrap:anywhere }
.button-row { display:flex; flex-wrap:wrap; gap:14px; margin:16px 0 }
.grant-list { display:grid; gap:10px; margin:12px 0; min-width:0 }
.grant-list>li { min-width:0; overflow-wrap:anywhere }
.grant-list pre { max-width:100%; overflow-x:auto; white-space:pre-wrap; overflow-wrap:anywhere; font-size:12px }
.grant-row { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; border:3px solid var(--ink); border-radius:14px; padding:12px 14px; overflow-wrap:anywhere }
.usdg-note { font-size:14px }

.visually-hidden { position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap }
.site-header { flex-wrap:nowrap }
.header-search { position:relative; flex:1; max-width:420px; min-width:0 }
.search-input { width:100%; min-height:44px; border:3px solid var(--ink); border-radius:14px; background:var(--paper); color:var(--ink); padding:8px 14px; font:inherit; font-weight:600 }
.search-list { position:absolute; z-index:30; left:0; right:0; top:calc(100% + 6px); margin:0; padding:6px; list-style:none; background:var(--card); color:var(--card-text); border:3px solid var(--ink); border-radius:14px; box-shadow:6px 6px 0 var(--ink); max-height:min(70vh,460px); overflow:auto }
.search-option { display:grid; gap:2px; padding:10px 12px; border-radius:10px; cursor:pointer }
.search-option[aria-selected="true"],.search-option:hover { background:var(--butter); color:var(--ink) }
.search-option[aria-selected="true"] .quiet,.search-option:hover .quiet { color:var(--ink) }
.search-option strong { overflow-wrap:anywhere }
.search-option span { font-size:13px; overflow-wrap:anywhere }
.search-empty,.search-all { padding:10px 12px; font-size:14px; font-weight:700 }
.header-actions { display:flex; align-items:center; gap:14px; flex-shrink:0 }
.header-link { font-weight:800; text-decoration:none; border-bottom:2px solid transparent; white-space:nowrap }
.header-link:hover { border-color:var(--butter) }
.theme-button { padding:8px 11px }
.demo-badge { border:2px solid var(--ink); background:var(--coral); color:#fff; border-radius:999px; padding:4px 10px; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase }
.wallet-box { position:relative }
.wallet-chip { display:inline-flex; align-items:center; gap:8px; padding:9px 14px; font-size:14px; white-space:nowrap }
.wallet-chip.connected { background:var(--card); color:var(--card-text) }
.wallet-chip.wrong-network { background:var(--coral); color:#fff }
.identicon { width:22px; height:22px; border-radius:6px; border:2px solid var(--ink) }
.wallet-menu { position:absolute; z-index:30; right:0; top:calc(100% + 10px); width:min(320px,calc(100vw - 28px)); display:grid; gap:10px; padding:16px; background:var(--card); color:var(--card-text); border:3px solid var(--ink); border-radius:14px; box-shadow:6px 6px 0 var(--ink) }
.wallet-menu p { margin:0; font-size:14px }
.wallet-full { font-size:12px; overflow-wrap:anywhere }
@media (max-width:800px) {
  .site-header { flex-wrap:wrap }
  .header-search { order:3; flex-basis:100%; max-width:none }
  .header-actions { gap:10px }
}
@media (max-width:520px) {
  .header-actions { flex-wrap:wrap; flex-shrink:1; min-width:0; row-gap:8px }
  .wallet-box { position:static }
  .site-header { position:relative }
  .wallet-menu { left:14px; right:14px; width:auto }
  .header-link { font-size:14px }
  .wallet-chip { padding:8px 10px; font-size:13px }
}

.home-hero { padding-top:36px; padding-bottom:12px }
.home-title { font-size:clamp(56px,11vw,120px); margin:12px 0 18px }
.home-intro { max-width:62ch; font-size:clamp(18px,2.2vw,22px); font-weight:600; margin-bottom:22px }
.home-search { position:relative; max-width:640px }
.home-search .search-input { min-height:56px; font-size:18px }
.home-actions { display:flex; gap:14px; flex-wrap:wrap; align-items:center; margin-top:20px }
.home-section { padding-block:36px }
.home-section h2 { font-size:clamp(30px,4.5vw,46px) }
.card-row { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:16px; margin-top:18px }
.campaign-tile { display:flex; flex-direction:column; gap:8px; min-height:170px; text-decoration:none; background:var(--card); color:var(--card-text); border:3px solid var(--ink); border-radius:18px; padding:18px; box-shadow:6px 6px 0 var(--ink); transition:transform .08s,box-shadow .08s }
.campaign-tile:hover { transform:translate(3px,3px); box-shadow:3px 3px 0 var(--ink) }
.campaign-tile .tile-name { font-size:22px; font-weight:800; line-height:1.05; overflow-wrap:anywhere }
.campaign-tile .tile-symbol { color:var(--card-muted); font-weight:800; font-size:13px; letter-spacing:.06em }
.campaign-tile .tile-amount { font-size:26px; font-weight:800; font-variant-numeric:tabular-nums; margin-top:auto }
.campaign-tile .tile-meta { color:var(--card-muted); font-size:14px; overflow-wrap:anywhere }
.mini-bar { height:10px; border:2px solid var(--ink); border-radius:999px; background:var(--paper); overflow:hidden }
.mini-bar span { display:block; height:100%; background:var(--coral) }
.tab-row,.sort-row { display:flex; gap:8px; flex-wrap:wrap }
.tab-row a,.sort-row button { text-decoration:none; border:3px solid var(--ink); border-radius:999px; padding:8px 16px; font-weight:800; background:var(--card); color:var(--card-text); box-shadow:none; font-size:15px }
.tab-row a[aria-current="page"],.sort-row button[aria-pressed="true"] { background:var(--butter); color:var(--ink) }
.leader-list { display:grid; gap:10px; margin:18px 0 0; padding:0; list-style:none; counter-reset:leader }
.leader-list li { counter-increment:leader; display:grid; grid-template-columns:auto 1fr auto; gap:14px; align-items:center; background:var(--card); color:var(--card-text); border:3px solid var(--ink); border-radius:14px; padding:12px 16px }
.leader-list li::before { content:counter(leader); font-weight:800; font-size:20px; color:var(--coral) }
.leader-list a { font-weight:800; text-decoration:none; overflow-wrap:anywhere }
.leader-list strong { font-variant-numeric:tabular-nums }
details.more { margin-top:18px }
details.more>summary { cursor:pointer; font-weight:800 }
details.technical { margin-top:20px; border-top:2px dashed var(--card-muted); padding-top:14px }
details.technical>summary { cursor:pointer; font-weight:800; color:var(--card-muted) }
.campaign-head { padding-top:30px }
.campaign-head h1 { font-size:clamp(46px,9vw,96px); margin:8px 0 10px; text-shadow:4px 4px 0 var(--ink) }
.campaign-sub { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-bottom:16px }
.campaign-sub p { margin:0; max-width:70ch }
.head-actions { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-top:18px }
.head-actions .button,.head-actions button { padding:10px 16px; text-decoration:none }
.summary-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:22px }
.chart-card { margin-top:28px }
.chart-head { display:flex; justify-content:space-between; gap:12px; align-items:center; flex-wrap:wrap }
.chart-box { height:320px; margin-top:14px; border:2px solid var(--card-muted); border-radius:12px; overflow:hidden }
.chart-box:empty,.chart-box[data-empty] { display:grid; place-items:center; color:var(--card-muted); font-weight:700; padding:20px; text-align:center }
.chart-note { font-size:13px; margin:10px 0 0 }
.post-form { display:grid; gap:10px; margin-top:16px }
.post-form textarea { min-height:90px; border:2px solid var(--ink); border-radius:12px; padding:10px; background:var(--paper); color:var(--ink); font:inherit; resize:vertical }
.post-list { display:grid; gap:12px; margin:16px 0 0; padding:0; list-style:none }
.post { border:2px solid var(--ink); border-radius:14px; padding:12px 14px }
.post .post-head { display:flex; gap:10px; align-items:center; flex-wrap:wrap; font-size:14px; font-weight:700 }
.post .post-body { margin:8px 0 0; white-space:pre-wrap; overflow-wrap:anywhere }
.post .post-actions { display:flex; gap:10px; margin-top:8px }
.post .post-actions button { padding:4px 10px; font-size:12px; box-shadow:2px 2px 0 var(--ink) }
.post .replies { list-style:none; margin:10px 0 0 18px; padding:0; display:grid; gap:10px }
.badge { display:inline-flex; align-items:center; gap:6px; border:2px solid var(--ink); border-radius:999px; padding:2px 10px 2px 4px; background:var(--paper); color:var(--ink); font-size:12px; font-weight:800 }
.badge img { width:22px; height:22px }
.claim-hero-amount { font-size:clamp(40px,7vw,72px); font-weight:800; letter-spacing:-.04em; line-height:1; font-variant-numeric:tabular-nums; margin:6px 0 4px }
.claim-summary { display:grid; gap:0; margin:18px 0 }
.claim-summary div { display:flex; justify-content:space-between; gap:16px; padding:10px 0; border-bottom:1px solid var(--card-muted) }
.claim-summary span { color:var(--card-muted); font-weight:700 }
.claim-summary strong { text-align:right; overflow-wrap:anywhere }
.claim-progress { list-style:none; margin:16px 0 0; padding:0; display:grid; gap:6px }
.claim-progress li { display:flex; gap:10px; align-items:center; color:var(--card-muted); font-weight:700 }
.claim-progress li::before { content:""; width:14px; height:14px; border:2px solid var(--card-muted); border-radius:999px }
.claim-progress li.done { color:var(--card-text) }
.claim-progress li.done::before { background:var(--mint); border-color:var(--ink) }
.claim-progress li.current { color:var(--card-text) }
.claim-progress li.current::before { background:var(--butter); border-color:var(--ink) }
.drawer { position:fixed; z-index:40; top:0; left:0; bottom:0; width:min(440px,100vw); overflow:auto; background:var(--card); color:var(--card-text); border-right:4px solid var(--ink); box-shadow:8px 0 0 var(--ink); padding:22px }
.drawer[hidden] { display:none }
.drawer-head { display:flex; justify-content:space-between; align-items:center; gap:12px }
.drawer dl { display:grid; grid-template-columns:auto 1fr; gap:4px 12px; margin:8px 0; font-size:14px }
.drawer dt { font-weight:800 }
.drawer dd { margin:0; overflow-wrap:anywhere }
.demo-warning { border:2px solid var(--ink); background:var(--butter); color:#111; border-radius:10px; padding:8px 10px; font-weight:700 }
button.danger { background:var(--coral); color:#111 }
.demo-notice { position:sticky; top:0; z-index:50; display:flex; gap:12px; align-items:center; justify-content:space-between; background:var(--butter); color:#111; border-bottom:4px solid var(--ink); padding:10px 16px; font-weight:700 }
.demo-notice[hidden] { display:none }
.demo-notice p { margin:0 }
.drawer h2 { font-size:32px }
.drawer h3 { font-size:20px; margin:22px 0 8px }
.drawer label { display:grid; gap:4px; font-weight:700; margin:8px 0 }
.drawer input,.drawer select { min-height:40px; border:2px solid var(--ink); border-radius:10px; padding:6px 10px; background:var(--paper); color:var(--ink); font:inherit }
.drawer .button-row { margin:10px 0 }
.drawer button { padding:8px 12px; font-size:14px; box-shadow:3px 3px 0 var(--ink) }
.job-list { display:grid; gap:8px; margin:8px 0; padding:0; list-style:none; font-size:14px }
.job-list li { border:2px solid var(--ink); border-radius:10px; padding:8px 10px; overflow-wrap:anywhere }
@media (max-width:800px) { .summary-grid { grid-template-columns:repeat(2,1fr) } }
@media (max-width:420px) { .summary-grid { grid-template-columns:1fr } .leader-list li { grid-template-columns:auto 1fr } .leader-list li strong { grid-column:2 } }
