:root{
  --pitch:#000F0C; --pitch2:#06140F; --teal:#10302E; --teal-soft:#0c2522;
  --mint:#01CB9A; --ink:#EFF0F6; --muted:rgba(239,240,246,.62); --faint:rgba(239,240,246,.40);
  --line:rgba(1,203,154,.22); --line2:rgba(239,240,246,.10); --danger:#ff6b6b; --radius:14px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--pitch);color:var(--ink);font-family:Montserrat,system-ui,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--mint);text-decoration:none}
a:hover{text-decoration:underline}
.wm{font-weight:900;font-size:1.1rem;letter-spacing:.4px}
.wm .l{color:#fff}.wm .s{color:var(--mint);font-family:"Dancing Script",cursive;font-size:1.45em;font-weight:700}
.nav{display:flex;align-items:center;gap:12px;padding:14px 26px;border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(0,15,12,.9);backdrop-filter:blur(8px);z-index:10}
.nav .brand{display:flex;align-items:center;gap:10px}
.nav .spacer{margin-left:auto}
.nav a{color:var(--muted);font-size:.86rem;font-weight:600;margin-left:20px}
.nav a:hover{color:var(--ink);text-decoration:none}
.btn{display:inline-block;background:var(--mint);color:#00231a;font-weight:700;font-size:.9rem;padding:11px 20px;border-radius:10px;border:0;cursor:pointer}
.btn:hover{filter:brightness(1.06);text-decoration:none}
.btn.ghost{background:transparent;color:var(--mint);border:1px solid var(--line)}
.wrap{max-width:1080px;margin:0 auto;padding:0 26px}
.flash{max-width:1080px;margin:14px auto 0;padding:0 26px}
.flash .msg{padding:11px 16px;border-radius:10px;font-size:.86rem;border:1px solid var(--line);background:var(--teal-soft);margin-bottom:8px}
.flash .msg.error{border-color:rgba(255,107,107,.4);background:rgba(255,107,107,.08)}
.hero{max-width:820px;margin:0 auto;padding:96px 26px 60px;text-align:center}
.hero .kicker{font-size:.7rem;letter-spacing:2px;text-transform:uppercase;color:var(--mint);font-weight:700}
.hero h1{font-size:3rem;font-weight:900;line-height:1.1;margin:14px 0}
.hero h1 .s{font-family:"Dancing Script",cursive;color:var(--mint)}
.hero p{color:var(--muted);font-size:1.1rem;max-width:60ch;margin:0 auto 28px}
.center{display:flex;justify-content:center;align-items:center;min-height:calc(100vh - 120px);padding:40px 20px}
.card{width:100%;max-width:420px;background:linear-gradient(180deg,var(--teal-soft),rgba(6,20,15,.5));border:1px solid var(--line);border-radius:18px;padding:34px 32px}
.card h2{margin:0 0 4px;font-size:1.5rem;font-weight:800}
.card .sub{color:var(--muted);font-size:.86rem;margin-bottom:22px}
.field{margin-bottom:16px}
.field label{display:block;font-size:.78rem;font-weight:600;color:var(--muted);margin-bottom:6px}
.field input[type=email],.field input[type=password]{width:100%;padding:12px 14px;border-radius:10px;border:1px solid var(--line2);background:#04100c;color:var(--ink);font-size:.92rem;font-family:inherit}
.field input:focus{outline:none;border-color:var(--mint)}
.field .err{color:var(--danger);font-size:.76rem;margin-top:5px}
.row{display:flex;align-items:center;justify-content:space-between;margin:6px 0 20px;font-size:.82rem;color:var(--muted)}
.row label{display:flex;align-items:center;gap:7px}
.dash{display:grid;grid-template-columns:220px 1fr;min-height:calc(100vh - 60px)}
.side{border-right:1px solid var(--line2);padding:24px 16px}
.side .lbl{font-size:.64rem;letter-spacing:1.4px;text-transform:uppercase;color:var(--faint);font-weight:700;margin:8px 10px}
.side a{display:block;color:var(--muted);font-size:.86rem;font-weight:600;padding:9px 12px;border-radius:9px;margin-left:0}
.side a.active{color:var(--mint);background:rgba(1,203,154,.08)}
.side a:hover{color:var(--ink);text-decoration:none}
.content{padding:30px 34px}
.content h1{font-size:1.5rem;margin:0 0 4px}
.content .sub{color:var(--muted);font-size:.9rem;margin-bottom:24px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.tile{background:var(--teal-soft);border:1px solid var(--line);border-radius:14px;padding:20px;min-height:120px}
.tile h3{margin:0 0 4px;font-size:1rem}
.tile p{margin:0;color:var(--faint);font-size:.82rem}
.badge{display:inline-block;font-size:.62rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--mint);background:var(--teal);border:1px solid var(--line);padding:3px 8px;border-radius:20px;margin-top:12px}
@media(max-width:720px){.dash{grid-template-columns:1fr}.side{display:none}.grid{grid-template-columns:1fr}.hero h1{font-size:2.1rem}}

/* ===== LiquidLabs component layer — marketplace iteration =====
   Dark-mode-first, ambient mint glow, glass surfaces, purposeful motion.
   Montserrat Bold for display, Regular ALL-CAPS microlabels. */
.page{display:flex;min-height:calc(100vh - 61px)}
.content{flex:1;padding:34px 42px;max-width:1180px}
.eyebrow{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--mint);font-weight:700;margin:0 0 6px}
.h-xl{font-size:2.1rem;font-weight:800;margin:0 0 4px;letter-spacing:-.01em}
.sub{color:var(--muted);font-size:.92rem;margin-bottom:26px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin:22px 0 30px}
.kpi{position:relative;overflow:hidden;background:linear-gradient(165deg,rgba(16,48,46,.65),rgba(0,15,12,.9));border:1px solid var(--line2);border-radius:var(--radius);padding:18px 20px;transition:border-color .25s,transform .25s}
.kpi:hover{border-color:var(--line);transform:translateY(-2px)}
.kpi::after{content:"";position:absolute;inset:auto -30% -60% auto;width:140px;height:140px;background:radial-gradient(circle,rgba(1,203,154,.16),transparent 65%)}
.kpi .k{font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);font-weight:700}
.kpi .v{font-size:1.65rem;font-weight:800;color:var(--mint);line-height:1.25;font-variant-numeric:tabular-nums}
.kpi .u{font-size:.78rem;color:var(--muted);font-weight:600;margin-left:4px}
.panel{background:linear-gradient(180deg,rgba(16,48,46,.42),rgba(0,15,12,.75));border:1px solid var(--line2);border-radius:var(--radius);padding:22px 24px;margin-bottom:18px}
.panel h3{margin:0 0 14px;font-size:.95rem}
.panel .hint{color:var(--faint);font-size:.78rem;line-height:1.5}
.tbl{width:100%;border-collapse:collapse;font-size:.86rem}
.tbl th{text-align:left;padding:9px 10px;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);border-bottom:1px solid var(--line)}
.tbl td{padding:10px;border-bottom:1px solid var(--line2);font-variant-numeric:tabular-nums}
.tbl tr:hover td{background:rgba(1,203,154,.04)}
.tbl code{font-size:.78rem}
.chip{display:inline-block;font-size:.64rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:3px 10px;border-radius:999px;border:1px solid var(--line);color:var(--mint)}
.chip.warn{border-color:rgba(242,180,65,.5);color:#f2b441}
.chip.err{border-color:rgba(255,107,107,.5);color:var(--danger)}
.chip.dim{border-color:var(--line2);color:var(--muted)}
.asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;margin-top:6px}
.asset{position:relative;display:block;color:inherit;background:linear-gradient(160deg,rgba(16,48,46,.6),rgba(0,15,12,.92));border:1px solid var(--line2);border-radius:var(--radius);padding:22px;transition:border-color .25s,transform .25s,box-shadow .25s}
.asset:hover{border-color:var(--line);transform:translateY(-3px);box-shadow:0 12px 40px rgba(1,203,154,.12);text-decoration:none}
.asset h3{margin:0 0 4px;font-size:1.02rem}
.asset .cls{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);font-weight:700}
.asset .px{font-size:1.3rem;font-weight:800;color:var(--mint);margin-top:12px;font-variant-numeric:tabular-nums}
.asset .px .q{font-size:.72rem;color:var(--muted);font-weight:600}
.book{display:grid;grid-template-columns:1fr 1fr;gap:2px;font-size:.82rem;font-variant-numeric:tabular-nums}
.book .col h4{margin:0 0 8px;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}
.book .row{position:relative;display:flex;justify-content:space-between;padding:5px 10px;border-radius:6px;overflow:hidden}
.book .row .bar{position:absolute;inset:0;opacity:.14;border-radius:6px}
.book .bid .bar{background:var(--mint);right:auto}
.book .ask .bar{background:var(--danger);left:auto}
.book .bid{color:#7ee9c8}.book .ask{color:#ff9d9d}
.split{display:grid;grid-template-columns:3fr 2fr;gap:18px;align-items:start}
@media(max-width:900px){.split{grid-template-columns:1fr}.content{padding:24px 18px}}
.form label{display:block;margin:10px 0;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:700}
.form input,.form select{width:100%;margin-top:6px;padding:11px 13px;border-radius:10px;border:1px solid var(--line2);background:rgba(0,15,12,.7);color:var(--ink);font-family:inherit;font-size:.95rem;letter-spacing:normal;text-transform:none;transition:border-color .2s,box-shadow .2s}
.form input:focus,.form select:focus{outline:none;border-color:var(--mint);box-shadow:0 0 0 3px rgba(1,203,154,.15)}
.seg{display:inline-flex;border:1px solid var(--line2);border-radius:10px;overflow:hidden;margin:6px 0}
.seg input{display:none}
.seg label{margin:0;padding:9px 22px;cursor:pointer;font-size:.78rem;font-weight:700;letter-spacing:.1em;color:var(--muted)}
.seg input:checked+label{background:var(--mint);color:#00231a}
.timeline{list-style:none;margin:0;padding:0}
.timeline li{position:relative;padding:0 0 18px 26px;border-left:1px solid var(--line2);margin-left:8px}
.timeline li::before{content:"";position:absolute;left:-5px;top:4px;width:9px;height:9px;border-radius:50%;background:var(--mint);box-shadow:0 0 10px rgba(1,203,154,.8)}
.timeline li.dim::before{background:var(--teal);box-shadow:none}
.steps{display:flex;gap:10px;margin:14px 0 20px;flex-wrap:wrap}
.steps .st{display:flex;align-items:center;gap:8px;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.steps .st .n{width:22px;height:22px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;color:var(--mint);font-size:.7rem}
.steps .st.on{color:var(--ink)}
.steps .st.on .n{background:var(--mint);color:#00231a;border-color:var(--mint)}
.empty{border:1px dashed var(--line2);border-radius:var(--radius);padding:38px;text-align:center;color:var(--faint)}
.empty .big{font-size:1.05rem;color:var(--muted);font-weight:700;margin-bottom:6px}
.quote{display:flex;align-items:center;justify-content:space-between;gap:14px;border:1px solid var(--line);background:rgba(1,203,154,.06);border-radius:var(--radius);padding:16px 20px;margin:10px 0}
.quote .route{font-weight:700}
.quote .route .via{color:var(--mint)}
.quote .bps{font-variant-numeric:tabular-nums;color:var(--muted);font-size:.84rem}
.progress{height:6px;border-radius:999px;background:var(--teal-soft);overflow:hidden;margin:8px 0}
.progress i{display:block;height:100%;background:linear-gradient(90deg,var(--mint),#7ee9c8);border-radius:999px;transition:width .4s ease}
.addr{font-size:.78rem;color:var(--muted)}
.row-actions{display:flex;gap:8px;align-items:center}
.btn.sm{padding:7px 14px;font-size:.76rem;border-radius:8px}
.btn.danger{background:transparent;color:var(--danger);border:1px solid rgba(255,107,107,.4)}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}

/* ===== Real logo lockup ===== */
.brand{display:flex;align-items:center;gap:11px;text-decoration:none}
.brand-mark{display:block;height:34px;width:auto;filter:drop-shadow(0 0 10px rgba(1,203,154,.25))}
.wm{font-weight:800;letter-spacing:.02em;font-size:1.22rem;line-height:1}
.wm .l{color:#fff}
.wm .s{color:var(--mint);font-family:"Dancing Script",cursive;font-size:1.5em;font-weight:700;margin-left:.06em}
.hero .brand-mark-lg{height:88px;margin:0 auto 22px;display:block;filter:drop-shadow(0 0 28px rgba(1,203,154,.35))}

/* ===== Redesigned dashboard ===== */
.dash-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:8px}
.balance-hero{position:relative;overflow:hidden;background:radial-gradient(600px 200px at 100% 0,rgba(1,203,154,.14),transparent 60%),linear-gradient(160deg,rgba(16,48,46,.7),rgba(0,15,12,.92));border:1px solid var(--line);border-radius:18px;padding:26px 30px;margin:14px 0 22px}
.balance-hero .k{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);font-weight:700}
.balance-hero .big-v{display:block;font-size:2.8rem;font-weight:800;color:#fff;line-height:1.1;font-variant-numeric:tabular-nums;margin-top:4px}
.balance-hero .big-v .u{font-size:1.1rem;color:var(--mint)}
.balance-hero .mini-kpis{display:flex;gap:18px;margin-top:14px;flex-wrap:wrap}
.balance-hero .mini-kpis span{color:var(--muted);font-size:.85rem;font-weight:600}
.balance-hero .mini-kpis span::before{content:"●";color:var(--mint);margin-right:6px;font-size:.6rem;vertical-align:middle}
.quick-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:22px}
.quick{display:flex;flex-direction:column;gap:3px;padding:18px;border-radius:14px;border:1px solid var(--line2);background:linear-gradient(160deg,rgba(16,48,46,.5),rgba(0,15,12,.85));text-decoration:none;color:var(--ink);transition:transform .2s,border-color .2s,box-shadow .2s}
.quick:hover{transform:translateY(-3px);border-color:var(--line);box-shadow:0 12px 34px rgba(1,203,154,.14);text-decoration:none}
.quick .qi{font-size:1.4rem;color:var(--mint);line-height:1}
.quick strong{font-size:1rem}
.quick.admin{border-color:rgba(1,203,154,.3)}
.wallet-row{display:flex;justify-content:space-between;align-items:center;padding:11px 0;border-bottom:1px solid var(--line2)}
.wallet-bal{font-weight:800;color:var(--mint);font-variant-numeric:tabular-nums}

/* ===== Sign status ===== */
.sign-icon{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-size:1.8rem;margin:0 auto 14px;font-weight:800}
.sign-icon.ok{background:rgba(1,203,154,.15);color:var(--mint);border:1px solid var(--mint)}
.sign-icon.warn{background:rgba(242,180,65,.15);color:#f2b441;border:1px solid rgba(242,180,65,.5)}
.poll-status{margin-top:16px;color:var(--faint);font-size:.85rem}

/* ===== Marketplace polish ===== */
.filter-chips{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 20px}
.fchip{padding:7px 15px;border-radius:999px;border:1px solid var(--line2);color:var(--muted);font-size:.78rem;font-weight:700;text-transform:capitalize;text-decoration:none;transition:all .2s}
.fchip:hover{border-color:var(--line);color:var(--ink);text-decoration:none}
.fchip.on{background:var(--mint);color:#00231a;border-color:var(--mint)}
.market-card{position:relative;display:flex;flex-direction:column;min-height:180px}
.market-card .mc-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.market-card .mc-price{margin-top:auto;padding-top:14px}
.market-card .mc-price .px{font-size:1.5rem;font-weight:800;color:var(--mint);font-variant-numeric:tabular-nums}
.market-card .mc-price .q{font-size:.75rem;color:var(--muted);margin-left:5px}
.market-card .mc-go{position:absolute;top:20px;right:20px;opacity:0;color:var(--mint);font-weight:700;font-size:.8rem;transition:opacity .2s}
.market-card:hover .mc-go{opacity:1}

/* ===== Design-QA pass: wallet + shared polish ===== */
.danger-banner{background:linear-gradient(90deg,rgba(255,107,107,.14),rgba(255,107,107,.05));border:1px solid rgba(255,107,107,.4);color:#ffb4b4;border-radius:12px;padding:14px 18px;margin:6px 0 18px;font-size:.9rem}
.cred{margin:0}
.cred dt{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);font-weight:700;margin-top:12px}
.cred dd{margin:4px 0 0}
.cred code{font-size:.86rem}
.seed-hot{background:rgba(1,203,154,.1);padding:6px 10px;border-radius:8px;border:1px solid var(--line);display:inline-block}
.check{display:flex;align-items:center;gap:10px;text-transform:none;letter-spacing:normal;font-size:.9rem;color:var(--ink)}
.check input{width:auto;margin:0}
.custody-list{list-style:none;margin:0;padding:0}
.custody-list li{padding:10px 0;border-bottom:1px solid var(--line2);font-size:.9rem;color:var(--muted)}
.custody-list li b{color:var(--ink)}
.custody-list li:last-child{border-bottom:0}
/* password managers force white bg on inputs; keep our dark field readable */
input:-webkit-autofill,input:-webkit-autofill:focus{-webkit-text-fill-color:var(--ink);-webkit-box-shadow:0 0 0 40px var(--pitch) inset;caret-color:var(--ink)}
/* select consistency with inputs */
.form select{width:100%;margin-top:6px;padding:11px 13px;border-radius:10px;border:1px solid var(--line2);background:rgba(0,15,12,.7);color:var(--ink);font-family:inherit;font-size:.95rem}
.form select:focus{outline:none;border-color:var(--mint);box-shadow:0 0 0 3px rgba(1,203,154,.15)}

/* ============================================================
   MASTERPIECE UPLIFT — design tokens, nav, landing, motion, mobile
   Brand: mint #01CB9A · pitch #000F0C · dark-green #10302E · light #EFF0F6
   ============================================================ */
:root{
  --r-sm:10px; --r-md:16px; --r-lg:22px; --r-xl:30px;
  --sp:clamp(60px,8vw,110px);
  --sh-1:0 6px 24px rgba(0,0,0,.35);
  --sh-glow:0 0 40px rgba(1,203,154,.18);
  --ease:cubic-bezier(.22,.61,.36,1);
  --maxw:1160px;
}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{overflow-x:hidden}

/* ---------- Environment banners + flash ---------- */
.env-banner{text-align:center;font-weight:700;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;padding:6px 12px}
.env-banner.staging{background:var(--mint);color:#00231a}
.env-banner.demo{background:#f2b441;color:#000F0C}
.flash-wrap{max-width:var(--maxw);margin:14px auto;padding:0 22px;display:flex;flex-direction:column;gap:8px}
.flash{padding:12px 16px;border-radius:var(--r-sm);font-size:.88rem;border:1px solid var(--line);background:var(--teal-soft)}
.flash.error{border-color:rgba(255,107,107,.5);color:#ffb4b4;background:rgba(255,107,107,.08)}
.flash.info,.flash.success{border-color:var(--line);color:var(--mint)}

/* ---------- Sticky glass top nav ---------- */
.topnav{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:14px;
  padding:14px clamp(18px,4vw,42px);border-bottom:1px solid transparent;transition:.3s var(--ease)}
.topnav.scrolled{background:rgba(0,15,12,.78);backdrop-filter:blur(14px) saturate(1.2);
  border-bottom-color:var(--line2);box-shadow:0 8px 30px rgba(0,0,0,.4)}
.topnav .brand{margin-right:auto}
.nav-links{display:flex;align-items:center;gap:26px}
.nav-links a{color:var(--muted);font-size:.9rem;font-weight:600;text-decoration:none;transition:color .2s}
.nav-links a:hover{color:var(--ink)}
.btn-nav{padding:9px 18px;font-size:.85rem}
.btn-nav.ghost{background:transparent}
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;margin-left:auto}
.nav-toggle span{width:24px;height:2px;background:var(--ink);border-radius:2px;transition:.3s var(--ease)}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- Buttons refined ---------- */
.btn{transition:transform .18s var(--ease),box-shadow .25s var(--ease),filter .2s}
.btn:hover{transform:translateY(-2px)}
.btn-lg{padding:15px 30px;font-size:1rem;border-radius:var(--r-md)}
.btn.btn-lg:not(.ghost){box-shadow:var(--sh-glow)}

/* ---------- Reveal animation ---------- */
[data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
[data-reveal].in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){[data-reveal]{opacity:1;transform:none;transition:none}}

/* ---------- LANDING ---------- */
.lp-wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.lp-hero{position:relative;overflow:hidden;min-height:92vh;display:flex;flex-direction:column;
  justify-content:center;align-items:center;text-align:center;padding:80px 22px 60px}
.lp-mesh{position:absolute;inset:-20% -20% auto;height:120%;z-index:0;
  background:
    radial-gradient(40% 40% at 22% 18%,rgba(1,203,154,.28),transparent 60%),
    radial-gradient(38% 46% at 82% 26%,rgba(16,48,46,.9),transparent 62%),
    radial-gradient(50% 50% at 60% 92%,rgba(1,203,154,.12),transparent 60%);
  filter:blur(24px);animation:meshfloat 18s ease-in-out infinite alternate}
@keyframes meshfloat{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(-3%,2%,0) scale(1.08)}}
.lp-grid-bg{position:absolute;inset:0;z-index:0;opacity:.5;
  background-image:linear-gradient(rgba(1,203,154,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(1,203,154,.06) 1px,transparent 1px);
  background-size:52px 52px;mask-image:radial-gradient(circle at 50% 40%,#000 30%,transparent 78%)}
@media (prefers-reduced-motion:reduce){.lp-mesh{animation:none}}
.lp-hero-inner{position:relative;z-index:1;max-width:920px}
.lp-eyebrow{display:inline-block;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--mint);font-weight:700;
  border:1px solid var(--line);border-radius:999px;padding:7px 16px;background:rgba(1,203,154,.06);margin-bottom:26px}
.lp-title{font-size:clamp(2.4rem,6.2vw,4.6rem);font-weight:800;line-height:1.04;letter-spacing:-.02em;margin:0 0 20px}
.lp-title .grad{background:linear-gradient(100deg,#01CB9A,#7ee9c8 60%,#01CB9A);-webkit-background-clip:text;background-clip:text;color:transparent}
.lp-lede{font-size:clamp(1rem,1.6vw,1.2rem);color:var(--muted);max-width:640px;margin:0 auto;line-height:1.65}
.lp-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin:34px 0 44px}
.lp-stats{display:flex;justify-content:center;gap:clamp(24px,5vw,64px);flex-wrap:wrap}
.lp-stat{display:flex;flex-direction:column;gap:4px}
.lp-stat .v{font-size:clamp(1.6rem,3vw,2.3rem);font-weight:800;color:#fff;font-variant-numeric:tabular-nums;line-height:1}
.lp-stat .k{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);font-weight:700}
.lp-scroll{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);width:24px;height:38px;border:2px solid var(--line);border-radius:14px;z-index:1}
.lp-scroll span{position:absolute;top:7px;left:50%;transform:translateX(-50%);width:4px;height:8px;border-radius:2px;background:var(--mint);animation:scrolldot 1.8s ease-in-out infinite}
@keyframes scrolldot{0%,100%{opacity:0;top:7px}50%{opacity:1;top:16px}}

.lp-section{padding:var(--sp) 0}
.lp-section.alt{background:linear-gradient(180deg,rgba(16,48,46,.28),transparent)}
.lp-head{text-align:center;max-width:640px;margin:0 auto 46px}
.lp-kicker{display:block;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--mint);font-weight:700;margin-bottom:12px}
.lp-head h2{font-size:clamp(1.7rem,3.4vw,2.6rem);font-weight:800;letter-spacing:-.01em;margin:0}

.lp-feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.lp-feature{display:block;padding:28px;border-radius:var(--r-lg);border:1px solid var(--line2);text-decoration:none;color:inherit;
  background:linear-gradient(165deg,rgba(16,48,46,.5),rgba(0,15,12,.86));transition:transform .3s var(--ease),border-color .3s,box-shadow .3s}
.lp-feature:hover{transform:translateY(-5px);border-color:var(--line);box-shadow:var(--sh-1),var(--sh-glow);text-decoration:none}
.lp-feature .fi{display:inline-grid;place-items:center;width:48px;height:48px;border-radius:14px;background:rgba(1,203,154,.12);color:var(--mint);font-size:1.4rem;margin-bottom:16px}
.lp-feature h3{margin:0 0 8px;font-size:1.15rem}
.lp-feature p{color:var(--muted);font-size:.92rem;line-height:1.6;margin:0}
.lp-feature .fmore{display:inline-block;margin-top:14px;color:var(--mint);font-weight:700;font-size:.85rem}

.lp-assets{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-bottom:28px}
.lp-asset{display:flex;flex-direction:column;padding:24px;border-radius:var(--r-lg);border:1px solid var(--line2);text-decoration:none;color:inherit;
  background:linear-gradient(165deg,rgba(16,48,46,.55),rgba(0,15,12,.9));transition:transform .3s var(--ease),border-color .3s,box-shadow .3s;min-height:170px}
.lp-asset:hover{transform:translateY(-4px);border-color:var(--line);box-shadow:var(--sh-glow);text-decoration:none}
.lp-asset .la-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.lp-asset .la-top .cls{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);font-weight:700}
.lp-asset h3{margin:0 0 4px;font-size:1.05rem}
.lp-asset .la-price{margin-top:auto;padding-top:14px;font-size:1.4rem;font-weight:800;color:var(--mint);font-variant-numeric:tabular-nums}
.lp-asset .la-price span{font-size:.72rem;color:var(--muted);font-weight:600}

.lp-steps{display:flex;align-items:stretch;justify-content:center;gap:14px;flex-wrap:wrap}
.lp-step{flex:1;min-width:200px;max-width:250px;padding:26px;border-radius:var(--r-lg);border:1px solid var(--line2);background:linear-gradient(165deg,rgba(16,48,46,.4),rgba(0,15,12,.8))}
.lp-step .sn{font-size:.8rem;font-weight:800;color:var(--mint);letter-spacing:.1em}
.lp-step h3{margin:8px 0 6px;font-size:1.1rem}
.lp-step p{color:var(--muted);font-size:.88rem;line-height:1.55;margin:0}
.lp-arrow{align-self:center;color:var(--mint);font-size:1.4rem;opacity:.6}

.lp-security{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:center}
.lp-security h2{font-size:clamp(1.7rem,3.4vw,2.6rem);margin:12px 0 20px}
.lp-checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.lp-checks li{position:relative;padding-left:32px;color:var(--muted);line-height:1.6}
.lp-checks li::before{content:"✓";position:absolute;left:0;top:0;width:22px;height:22px;border-radius:50%;background:rgba(1,203,154,.14);color:var(--mint);display:grid;place-items:center;font-size:.8rem;font-weight:800}
.lp-checks li b{color:var(--ink)}
.lp-lock{display:grid;place-items:center}
.lp-lock svg{filter:drop-shadow(0 0 30px rgba(1,203,154,.3))}

.lp-final{padding:var(--sp) 22px;text-align:center;background:radial-gradient(60% 100% at 50% 0,rgba(1,203,154,.1),transparent 70%)}
.lp-final h2{font-size:clamp(1.9rem,4vw,3rem);font-weight:800;letter-spacing:-.01em;margin:0}
.lp-footer{border-top:1px solid var(--line2);padding:30px 0;margin-top:20px}
.lp-foot-inner{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}

/* ---------- App shell responsive (authed pages) ---------- */
@media (max-width:860px){
  .page{flex-direction:column}
  .side{flex-direction:row;overflow-x:auto;gap:4px;padding:10px 14px;border-right:0;border-bottom:1px solid var(--line);position:sticky;top:60px;background:rgba(0,15,12,.9);backdrop-filter:blur(8px);white-space:nowrap}
  .side .lbl{display:none}
  .side a{padding:8px 12px;font-size:.82rem;border-radius:8px;flex:0 0 auto}
  .content{padding:22px 16px}
}

/* ---------- Mobile nav drawer ---------- */
@media (max-width:820px){
  .nav-toggle{display:flex}
  .nav-links{position:fixed;top:0;right:0;height:100dvh;width:min(78vw,320px);flex-direction:column;align-items:flex-start;
    gap:8px;padding:84px 26px 26px;background:rgba(0,15,12,.97);backdrop-filter:blur(16px);border-left:1px solid var(--line);
    transform:translateX(102%);transition:transform .34s var(--ease);z-index:49}
  .nav-links.open{transform:translateX(0)}
  .nav-links a{width:100%;padding:12px 0;font-size:1.05rem;border-bottom:1px solid var(--line2)}
  .btn-nav{width:100%;text-align:center;margin-top:8px}
}

/* ---------- Misc mobile ---------- */
@media (max-width:640px){
  .split{grid-template-columns:1fr!important}
  .h-xl{font-size:1.6rem}
  .tbl{font-size:.8rem}
  .panel{padding:18px}
  .lp-security{grid-template-columns:1fr;text-align:center}
  .lp-checks li{text-align:left}
  .lp-lock{order:-1}
  .lp-arrow{display:none}
}
/* Tables scroll on small screens instead of overflowing */
.panel{overflow-x:auto}

/* Public (logged-out) market/explorer pages: center the content, no sidebar */
.page.public .content{margin:0 auto}
.gate-cta{border:1px solid var(--line);background:rgba(1,203,154,.06);border-radius:var(--r-md);padding:20px 24px;text-align:center}
.gate-cta h3{margin:0 0 6px}

/* ---------- Auth pages ---------- */
.auth-shell{min-height:calc(100dvh - 70px);display:grid;place-items:center;padding:40px 20px;position:relative;overflow:hidden}
.auth-shell::before{content:"";position:absolute;inset:0;z-index:0;
  background:radial-gradient(50% 50% at 50% 30%,rgba(1,203,154,.12),transparent 70%)}
.auth-card{position:relative;z-index:1;width:100%;max-width:420px;padding:36px 32px;border-radius:var(--r-lg);
  border:1px solid var(--line);background:linear-gradient(170deg,rgba(16,48,46,.6),rgba(0,15,12,.92));box-shadow:var(--sh-1)}
.auth-card h1{text-align:center;font-size:1.6rem;margin:0 0 4px}
.auth-alt{text-align:center;margin-top:18px;color:var(--muted);font-size:.9rem}
.auth-alt a{color:var(--mint);font-weight:600}

/* ===== RWA project cards (iteration 2) ===== */
.proj-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:20px}
.proj-card{display:flex;flex-direction:column;border-radius:18px;overflow:hidden;text-decoration:none;color:inherit;
  border:1px solid var(--line2);background:linear-gradient(180deg,rgba(16,48,46,.5),rgba(0,15,12,.92));
  transition:transform .3s var(--ease),border-color .3s,box-shadow .3s}
.proj-card:hover{transform:translateY(-6px);border-color:var(--line);box-shadow:0 20px 50px rgba(1,203,154,.16);text-decoration:none}
.pc-img{position:relative;height:160px;background:linear-gradient(135deg,#0a3d2e,#02120e);background-size:cover;background-position:center;
  display:flex;align-items:flex-start;padding:14px}
.pc-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,15,12,.15),rgba(0,15,12,.9))}
.pc-badges{position:relative;z-index:1;display:flex;gap:6px;flex-wrap:wrap}
.pc-ticker{position:absolute;z-index:1;right:14px;bottom:12px;font-weight:800;font-size:1.5rem;color:var(--mint);
  letter-spacing:.04em;text-shadow:0 2px 20px rgba(0,15,12,.9)}
.pc-body{padding:20px;display:flex;flex-direction:column;flex:1}
.pc-sponsor{font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);font-weight:700}
.pc-body h3{margin:5px 0 6px;font-size:1.2rem;line-height:1.25}
.pc-tag{color:var(--muted);font-size:.87rem;line-height:1.5;margin:0 0 14px}
.pc-metrics{display:flex;gap:18px;margin-bottom:14px;flex-wrap:wrap}
.pc-metric .mv{display:block;font-size:1.05rem;font-weight:800;color:var(--mint);font-variant-numeric:tabular-nums;line-height:1.2}
.pc-metric .mk{display:block;font-size:.6rem;color:var(--faint);text-transform:uppercase;letter-spacing:.1em;font-weight:700}
.pc-fund{margin-top:auto}
.bar{height:8px;border-radius:99px;background:var(--teal);overflow:hidden}
.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--mint),#7ee9c8);border-radius:99px;
  box-shadow:0 0 14px rgba(1,203,154,.5);transition:width 1s var(--ease)}
.bar-row{display:flex;justify-content:space-between;font-size:.75rem;color:var(--muted);margin-top:7px}
.bar-row b{color:var(--ink)}
.pc-foot{display:flex;justify-content:space-between;align-items:center;margin-top:16px;padding-top:14px;border-top:1px solid var(--line2)}
.pc-price{font-size:1.15rem;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.pc-price em{font-style:normal;font-size:.7rem;color:var(--muted);font-weight:600}
.pc-go{color:var(--mint);font-weight:700;font-size:.82rem;opacity:0;transform:translateX(-6px);transition:.25s}
.proj-card:hover .pc-go{opacity:1;transform:none}
.chip.dim{border-color:var(--line2);color:var(--muted)}
.chip.amber{border-color:rgba(242,180,65,.5);color:#f2b441}
.chip.blue{border-color:#5aa9ff88;color:#5aa9ff}

/* ===== Project detail (iteration 2) ===== */
.pd-hero{border-radius:20px;padding:34px;margin-bottom:22px;background:linear-gradient(90deg,rgba(0,15,12,.94),rgba(16,48,46,.6));
  background-size:cover;background-position:center;border:1px solid var(--line)}
.pd-sponsor{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);font-weight:700}
.pd-sponsor b{color:var(--mint)}
.pd-tagline{color:var(--ink);font-size:1.1rem;font-style:italic;max-width:640px;margin:14px 0 0;opacity:.9}
.pd-cols{display:grid;grid-template-columns:1fr 340px;gap:22px;align-items:start}
.pd-rail{position:sticky;top:80px}
.pd-body{color:var(--muted);line-height:1.75;margin:0}
.pd-row{display:flex;gap:14px;padding:10px 0;border-bottom:1px solid var(--line2);font-size:.9rem}
.pd-row:last-child{border-bottom:0}
.pd-row b{color:var(--mint);min-width:170px;flex:none}
.pd-row span{color:var(--muted)}
.pd-fund-line{text-align:center;color:var(--muted);font-size:.85rem;margin:12px 0 4px}
.pd-fund-line b{color:var(--ink);font-size:1rem}
.ring-wrap{position:relative;display:grid;place-items:center;margin:4px 0}
.ring{--p:0;width:132px;height:132px;border-radius:50%;display:grid;place-items:center;position:relative;
  background:conic-gradient(var(--mint) calc(var(--p)*1%),var(--teal) 0)}
.ring::before{content:"";position:absolute;width:102px;height:102px;border-radius:50%;background:#02120e}
.ring span{position:relative;font-weight:800;font-size:1.5rem;color:var(--mint);font-variant-numeric:tabular-nums}
@media(max-width:900px){.pd-cols{grid-template-columns:1fr}.pd-rail{position:static}}

/* ===== Iteration 3: account, practice, currency ===== */
.practice-banner{background:linear-gradient(90deg,rgba(90,169,255,.14),rgba(1,203,154,.06));border:1px solid #5aa9ff55;
  color:#bcdcff;border-radius:12px;padding:14px 18px;margin:6px 0 18px;font-size:.9rem}
.practice-banner b{color:#fff}
.cur-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(76px,1fr));gap:8px}
.cur-opt{margin:0;padding:10px 6px;border-radius:10px;border:1px solid var(--line2);text-align:center;cursor:pointer;
  font-size:.8rem;font-weight:700;color:var(--muted);text-transform:none;letter-spacing:normal;transition:.2s}
.cur-opt input{display:none}
.cur-opt:hover{border-color:var(--line);color:var(--ink)}
.cur-opt.on{background:var(--mint);color:#00231a;border-color:var(--mint)}
.kpi .u{font-size:.75rem;color:var(--muted);margin-left:4px}

/* ═══════════════════════════════════════════════════════════════════════
   RWA MARKETPLACE v2 — masthead, pitch pages, tokenization layer
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Masthead ─────────────────────────────────────────────────────────── */
.mk-head{padding:8px 0 30px;border-bottom:1px solid var(--line2);margin-bottom:24px}
.mk-title{font-size:clamp(2.2rem,4.4vw,3.4rem);font-weight:900;line-height:1.06;letter-spacing:-.02em;margin:6px 0 16px}
.mk-title .s{font-family:"Dancing Script",cursive;color:var(--mint);font-weight:700}
.mk-lede{color:var(--muted);font-size:1.02rem;line-height:1.75;max-width:64ch;margin:0}
.mk-lede.sm{font-size:.95rem;max-width:70ch}
.mk-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:26px}
.mk-stat{background:linear-gradient(180deg,rgba(16,48,46,.5),rgba(0,15,12,.6));border:1px solid var(--line2);
  border-radius:14px;padding:16px 18px;display:flex;flex-direction:column;gap:2px}
.mk-stat .v{font-size:1.6rem;font-weight:900;color:var(--mint);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.mk-stat .k{font-size:.72rem;color:var(--faint);letter-spacing:.06em;text-transform:uppercase;font-weight:600}
.mk-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.mk-bar-note{font-size:.78rem;color:var(--faint)}
.mk-h2{font-size:clamp(1.5rem,2.6vw,2.1rem);font-weight:800;letter-spacing:-.015em;line-height:1.2;margin:4px 0 18px}
.mk-h2 .s{font-family:"Dancing Script",cursive;color:var(--mint);font-weight:700;font-size:1.15em}

/* ── Card extras ──────────────────────────────────────────────────────── */
.pc-ticker em{display:block;font-style:normal;font-size:.58rem;letter-spacing:.14em;color:var(--faint);font-weight:700;margin-top:1px}
.pc-strip{display:flex;gap:14px;flex-wrap:wrap;margin:10px 0 2px;font-size:.76rem;color:var(--faint)}
.pc-strip b{color:var(--ink)}

/* ── How it works rail ────────────────────────────────────────────────── */
.mk-flow{margin:56px 0 8px;padding-top:34px;border-top:1px solid var(--line2)}
.flow-rail{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;position:relative}
.flow-step{background:linear-gradient(180deg,rgba(16,48,46,.38),rgba(0,15,12,.5));border:1px solid var(--line2);
  border-radius:16px;padding:20px;position:relative;transition:.25s}
.flow-step:hover{border-color:var(--line);transform:translateY(-3px)}
.flow-step .n{font-size:.7rem;font-weight:800;letter-spacing:.16em;color:var(--mint);display:block;margin-bottom:10px}
.flow-step h4{margin:0 0 8px;font-size:1rem;font-weight:800}
.flow-step p{margin:0;font-size:.84rem;color:var(--muted);line-height:1.65}
.flow-step code{background:rgba(1,203,154,.1);color:var(--mint);padding:1px 5px;border-radius:5px;font-size:.94em}

/* ── Why tokenize ─────────────────────────────────────────────────────── */
.mk-why{margin:56px 0 0;padding-top:34px;border-top:1px solid var(--line2)}
.mk-why-head{max-width:70ch;margin-bottom:26px}
.why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.why-grid.compact{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.why-card{background:linear-gradient(180deg,rgba(16,48,46,.34),rgba(0,15,12,.55));border:1px solid var(--line2);
  border-radius:16px;padding:22px;position:relative;overflow:hidden;transition:.25s}
.why-card::after{content:"";position:absolute;inset:0 auto 0 0;width:2px;background:var(--mint);
  transform:scaleY(0);transform-origin:top;transition:.35s}
.why-card:hover{border-color:var(--line);transform:translateY(-3px)}
.why-card:hover::after{transform:scaleY(1)}
.why-n{font-size:.68rem;font-weight:800;letter-spacing:.18em;color:var(--mint);opacity:.8}
.why-card h4{margin:8px 0 8px;font-size:1rem;font-weight:800;letter-spacing:-.01em}
.why-card p{margin:0;font-size:.85rem;color:var(--muted);line-height:1.7}

/* ── Closing CTA ──────────────────────────────────────────────────────── */
.mk-cta{margin:56px 0 10px;padding:44px 32px;text-align:center;border-radius:20px;
  background:radial-gradient(120% 140% at 50% 0%,rgba(1,203,154,.14),rgba(0,15,12,0) 62%),
             linear-gradient(180deg,rgba(16,48,46,.55),rgba(0,15,12,.7));border:1px solid var(--line)}
.mk-cta h2{font-size:1.7rem;font-weight:900;margin:0 0 10px;letter-spacing:-.02em}
.mk-cta p{color:var(--muted);max-width:56ch;margin:0 auto 22px;font-size:.94rem;line-height:1.7}
.cta-row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}

/* ═══ PROJECT DETAIL — the pitch ═══════════════════════════════════════ */
.back-link{display:inline-block;font-size:.8rem;font-weight:600;color:var(--faint);margin-bottom:14px}
.back-link:hover{color:var(--mint);text-decoration:none}
.pd-title{font-size:clamp(1.9rem,3.6vw,2.9rem);font-weight:900;letter-spacing:-.02em;line-height:1.08;margin:14px 0 6px}
.pd-token-chip{display:inline-flex;align-items:center;gap:10px;margin-top:16px;padding:8px 14px;border-radius:999px;
  border:1px solid var(--line);background:rgba(1,203,154,.07)}
.pd-token-chip .tk{font-weight:900;color:var(--mint);letter-spacing:.06em}
.pd-token-chip .ts{font-size:.7rem;color:var(--faint);letter-spacing:.06em;text-transform:uppercase;font-weight:600}

/* Section nav */
.pd-nav{display:flex;gap:4px;flex-wrap:wrap;position:sticky;top:56px;z-index:8;margin:0 0 22px;padding:8px 0;
  background:rgba(0,15,12,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line2)}
.pd-nav a{font-size:.76rem;font-weight:700;color:var(--faint);padding:7px 13px;border-radius:999px;transition:.2s}
.pd-nav a:hover{color:var(--ink);background:rgba(1,203,154,.09);text-decoration:none}

/* Sections */
.pd-main{min-width:0}
.pd-sec{padding:34px 0;border-top:1px solid var(--line2)}
.pd-sec:first-of-type{border-top:0;padding-top:8px}
.pd-h2{font-size:clamp(1.4rem,2.4vw,1.95rem);font-weight:800;letter-spacing:-.015em;line-height:1.22;margin:4px 0 16px}
.pd-h2 .s{font-family:"Dancing Script",cursive;color:var(--mint);font-weight:700;font-size:1.18em}
.pd-lead{font-size:1.02rem;color:var(--ink);line-height:1.75;margin:0 0 16px;max-width:70ch}
.pd-sec .pd-body{margin:0 0 14px;max-width:72ch}
.pd-quote{margin:24px 0 0;padding:20px 26px;border-left:3px solid var(--mint);background:rgba(1,203,154,.05);
  border-radius:0 14px 14px 0;font-size:1.12rem;font-weight:600;color:var(--ink);line-height:1.55;font-style:italic}

/* Three-track thesis */
.track-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.track-card{background:linear-gradient(180deg,rgba(16,48,46,.4),rgba(0,15,12,.55));border:1px solid var(--line2);
  border-radius:16px;padding:22px;position:relative;transition:.25s}
.track-card:hover{transform:translateY(-3px);border-color:var(--line)}
.tc-dot{width:10px;height:10px;border-radius:50%;display:block;margin-bottom:12px;background:var(--mint)}
.t-optimisation .tc-dot,.t-optimisation .ag-dot{background:#f2b441}
.t-infrastructure .tc-dot,.t-infrastructure .ag-dot{background:#5aa9ff}
.track-card h4{margin:0 0 6px;font-size:1.02rem;font-weight:800}
.tc-thesis{margin:0 0 10px;font-size:.86rem;color:var(--mint);font-weight:700}
.tc-detail{margin:0;font-size:.84rem;color:var(--muted);line-height:1.65}
.tc-count{display:inline-block;margin-top:14px;font-size:.68rem;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--faint);border:1px solid var(--line2);border-radius:999px;padding:3px 10px}

/* Asset portfolio */
.asset-group{margin-top:26px}
.ag-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-bottom:12px;margin-bottom:14px;
  border-bottom:1px solid var(--line2)}
.ag-dot{width:9px;height:9px;border-radius:50%;background:var(--mint);flex:none}
.ag-head h3{margin:0;font-size:1.05rem;font-weight:800}
.ag-thesis{font-size:.8rem;color:var(--faint)}
.ag-count{margin-left:auto;font-size:.72rem;font-weight:800;color:var(--mint);border:1px solid var(--line);
  border-radius:999px;padding:2px 10px}
.asset-list{display:grid;gap:12px}
.asset-card{background:linear-gradient(180deg,rgba(16,48,46,.3),rgba(0,15,12,.5));border:1px solid var(--line2);
  border-radius:16px;padding:20px 22px;transition:.25s}
.asset-card:hover{border-color:var(--line);transform:translateX(3px)}
.ac-top{display:flex;align-items:flex-start;gap:14px}
.ac-no{font-size:.78rem;font-weight:900;color:var(--mint);opacity:.55;padding-top:3px;font-variant-numeric:tabular-nums}
.ac-id{flex:1;min-width:0}
.ac-id h4{margin:0 0 3px;font-size:1.02rem;font-weight:800;letter-spacing:-.01em}
.ac-loc{font-size:.78rem;color:var(--faint)}
.ac-price{text-align:right;flex:none}
.ac-price b{display:block;color:var(--mint);font-size:1.02rem;font-weight:800;white-space:nowrap}
.ac-price span{display:block;font-size:.68rem;color:var(--faint);margin-top:2px}
.ac-facts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0 12px;padding:14px 0;
  border-top:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.ac-fact{display:flex;flex-direction:column;gap:3px;min-width:0}
.ac-fact .l{font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);font-weight:700}
.ac-fact .v{font-size:.86rem;color:var(--ink);font-weight:600;line-height:1.45}
.ac-note{margin:0;font-size:.84rem;color:var(--muted);line-height:1.7}

/* Value cards / moat / why-now / structure */
.vc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.vc-card{background:linear-gradient(180deg,rgba(16,48,46,.34),rgba(0,15,12,.5));border:1px solid var(--line2);
  border-radius:14px;padding:20px;transition:.25s}
.vc-card:hover{border-color:var(--line);transform:translateY(-3px)}
.vc-card h4{margin:0 0 8px;font-size:.95rem;font-weight:800;color:var(--mint)}
.vc-card p{margin:0;font-size:.85rem;color:var(--muted);line-height:1.65}

/* Experiences */
.exp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}
.exp-card{background:linear-gradient(180deg,rgba(16,48,46,.34),rgba(0,15,12,.5));border:1px solid var(--line2);
  border-radius:16px;padding:22px;transition:.25s}
.exp-card:hover{border-color:var(--line);transform:translateY(-3px)}
.exp-n{font-size:.68rem;font-weight:800;letter-spacing:.16em;color:var(--mint);opacity:.75}
.exp-card h4{margin:8px 0 8px;font-size:1rem;font-weight:800}
.exp-card p{margin:0;font-size:.85rem;color:var(--muted);line-height:1.65}

/* Revenue */
.rev-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin-top:16px}
.rev-card{border:1px solid var(--line2);border-radius:14px;padding:20px;background:rgba(1,203,154,.04)}
.rev-card h4{margin:0 0 8px;font-size:.92rem;font-weight:800;color:var(--mint)}
.rev-card p{margin:0;font-size:.84rem;color:var(--muted);line-height:1.6}

/* Timeline */
.timeline{list-style:none;margin:0;padding:0 0 0 26px;position:relative}
.timeline::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:1px;
  background:linear-gradient(180deg,var(--mint),rgba(1,203,154,.1))}
.tl-item{position:relative;padding:0 0 26px}
.tl-item:last-child{padding-bottom:0}
.tl-dot{position:absolute;left:-26px;top:5px;width:11px;height:11px;border-radius:50%;background:var(--pitch);
  border:2px solid var(--mint)}
.tl-phase{font-size:.68rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--mint)}
.tl-item h4{margin:5px 0 6px;font-size:1.05rem;font-weight:800}
.tl-item p{margin:0;font-size:.86rem;color:var(--muted);line-height:1.7;max-width:64ch}

/* Tokenization block */
.pd-sec.tok{background:radial-gradient(90% 60% at 0% 0%,rgba(1,203,154,.07),rgba(0,15,12,0) 70%);
  border-radius:20px;padding:34px 26px;margin-top:34px;border:1px solid var(--line)}
.tok-h3{font-size:.86rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);
  margin:30px 0 14px}
.tok-hero{display:grid;grid-template-columns:1.6fr 1fr;gap:14px;margin-top:6px}
.tok-rep,.tok-std{background:rgba(0,15,12,.55);border:1px solid var(--line2);border-radius:16px;padding:22px}
.tok-rep .l,.tok-std .l{display:block;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--faint);font-weight:700;margin-bottom:8px}
.tok-rep p{margin:0;font-size:.95rem;color:var(--ink);line-height:1.7}
.tok-std b{display:block;color:var(--mint);font-size:.95rem;font-weight:800}
.flag-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.flag-card{border:1px solid var(--line2);border-radius:14px;padding:18px;background:rgba(0,15,12,.5)}
.fc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.fc-top code{font-size:.85rem;font-weight:800;color:var(--mint);background:rgba(1,203,154,.1);
  padding:3px 9px;border-radius:7px}
.fc-on{font-size:.6rem;font-weight:900;letter-spacing:.14em;color:#00231a;background:var(--mint);
  padding:3px 8px;border-radius:999px}
.flag-card p{margin:0;font-size:.82rem;color:var(--muted);line-height:1.6}

/* Next steps ordered list */
.steps-ol{margin:0;padding-left:20px;color:var(--muted)}
.steps-ol li{margin-bottom:9px;font-size:.88rem;line-height:1.6}
.steps-ol li::marker{color:var(--mint);font-weight:800}

/* Disclaimer */
.disclaimer{border:1px solid var(--line2);border-radius:14px;padding:22px 24px;background:rgba(0,15,12,.45)}
.disclaimer h4{margin:0 0 10px;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);font-weight:800}
.disclaimer p{margin:0 0 10px;font-size:.78rem;color:var(--faint);line-height:1.65}
.disclaimer p:last-child{margin-bottom:0}
.disclaimer b{color:var(--muted)}

/* Rail extras */
.rail-note h4{margin:0 0 8px;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);font-weight:800}
.rail-note code{color:var(--mint);background:rgba(1,203,154,.1);padding:1px 5px;border-radius:5px;font-size:.9em}
.rail-contact{text-align:center;line-height:1.6;margin-top:-4px}

/* Responsive */
@media(max-width:900px){
  .pd-cols{grid-template-columns:1fr}
  .pd-rail{position:static}
  .tok-hero{grid-template-columns:1fr}
  .ac-facts{grid-template-columns:1fr}
  .ac-top{flex-wrap:wrap}
  .ac-price{text-align:left;width:100%;margin-top:8px}
  .pd-nav{overflow-x:auto;flex-wrap:nowrap}
  .pd-sec.tok{padding:26px 18px}
}

/* ═══════════════════════════════════════════════════════════════════════
   DESIGN SYSTEM PASS — nav, buttons, focus, figures
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Top nav ──────────────────────────────────────────────────────────── */
.topnav{padding:12px 26px;border-bottom:1px solid transparent;transition:border-color .3s,background .3s,padding .3s}
.topnav.scrolled{border-bottom-color:var(--line2);padding-top:9px;padding-bottom:9px;
  box-shadow:0 10px 40px -22px rgba(0,0,0,.9)}
.topnav .brand{display:flex;align-items:center;gap:11px;transition:opacity .2s}
.topnav .brand:hover{opacity:.85;text-decoration:none}

.nav-links{gap:6px}
.nav-link{position:relative;padding:8px 14px;border-radius:10px;font-size:.88rem;font-weight:600;
  color:var(--muted);transition:color .18s,background .18s}
.nav-link:hover{color:var(--ink);background:rgba(239,240,246,.05);text-decoration:none}
.nav-link.on{color:var(--ink)}
.nav-link.on::after{content:"";position:absolute;left:14px;right:14px;bottom:2px;height:2px;border-radius:2px;
  background:var(--mint);box-shadow:0 0 10px rgba(1,203,154,.6)}
.nav-sep{width:1px;height:22px;background:var(--line2);margin:0 8px}

/* Network pill — always tells you which ledger you're on */
.net-pill{display:inline-flex;align-items:center;gap:7px;margin-left:14px;padding:5px 11px;border-radius:999px;
  font-size:.62rem;font-weight:800;letter-spacing:.14em;border:1px solid var(--line2);color:var(--faint)}
.net-pill i{width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.net-pill.test{color:#5aa9ff;border-color:rgba(90,169,255,.35);background:rgba(90,169,255,.07)}
.net-pill.main{color:var(--mint);border-color:var(--line);background:rgba(1,203,154,.07)}
.net-pill.main i{animation:pulse-dot 2.4s ease-in-out infinite}
@keyframes pulse-dot{0%,100%{box-shadow:0 0 0 0 rgba(1,203,154,.5)}50%{box-shadow:0 0 0 5px rgba(1,203,154,0)}}

/* ── Button system ────────────────────────────────────────────────────── */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border-radius:11px;font-weight:700;letter-spacing:.01em;line-height:1;
  transition:transform .16s var(--ease,cubic-bezier(.2,.7,.3,1)),box-shadow .2s,filter .2s,background .2s;
  box-shadow:0 1px 0 rgba(255,255,255,.14) inset,0 8px 22px -12px rgba(1,203,154,.75)}
.btn:hover{transform:translateY(-1px);filter:brightness(1.05);
  box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 14px 30px -12px rgba(1,203,154,.9)}
.btn:active{transform:translateY(0) scale(.985);box-shadow:0 4px 12px -8px rgba(1,203,154,.8)}
.btn .btn-arrow{transition:transform .2s var(--ease,cubic-bezier(.2,.7,.3,1))}
.btn:hover .btn-arrow{transform:translateX(3px)}
.btn.ghost{box-shadow:none;background:transparent;border:1px solid var(--line);color:var(--mint)}
.btn.ghost:hover{background:rgba(1,203,154,.09);border-color:var(--mint);filter:none;box-shadow:none}
.btn.sm{padding:7px 13px;font-size:.78rem;border-radius:9px;box-shadow:none}
.btn.danger{background:transparent;border:1px solid rgba(255,107,107,.42);color:var(--danger);box-shadow:none}
.btn.danger:hover{background:rgba(255,107,107,.1);border-color:var(--danger);filter:none}
.btn[disabled],.btn.disabled{opacity:.45;pointer-events:none;box-shadow:none}
.btn-nav{padding:9px 16px;font-size:.84rem}

/* ── Focus visibility (keyboard users only) ───────────────────────────── */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
.fchip:focus-visible,.proj-card:focus-visible{outline:2px solid var(--mint);outline-offset:3px;border-radius:8px}
:focus:not(:focus-visible){outline:none}

/* ── Filter chips ─────────────────────────────────────────────────────── */
.fchip{transition:background .18s,color .18s,border-color .18s,transform .18s}
.fchip:hover{transform:translateY(-1px)}

/* ── Cards: consistent lift ───────────────────────────────────────────── */
.panel{transition:border-color .25s}
.proj-card:focus-visible{outline-offset:4px}

/* ── Data figures ─────────────────────────────────────────────────────── */
.pd-figure{margin:26px 0 0;border:1px solid var(--line2);border-radius:18px;overflow:hidden;
  background:linear-gradient(180deg,rgba(16,48,46,.3),rgba(0,15,12,.6))}
.pd-figure img{display:block;width:100%;height:auto}
.pd-figure figcaption{padding:14px 20px;font-size:.8rem;color:var(--faint);line-height:1.6;
  border-top:1px solid var(--line2)}

/* Hero art: SVG heroes deserve to be seen, not cropped to a sliver */
.pd-hero{min-height:340px;background-size:cover;background-position:center right}
.pc-img{background-size:cover;background-position:center}

/* ── Motion respect ───────────────────────────────────────────────────── */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
}

/* ── Smooth anchor scrolling for the project section nav ──────────────── */
html{scroll-behavior:smooth;scroll-padding-top:110px}

/* ── Mobile nav polish ────────────────────────────────────────────────── */
@media(max-width:860px){
  .net-pill{display:none}
  .nav-links{padding-top:76px;gap:2px}
  .nav-link{width:100%;padding:14px 4px;border-radius:0}
  .nav-link.on::after{left:4px;right:auto;width:20px;bottom:8px}
  .nav-sep{display:none}
}

/* Admin: demo-project seed controls */
.seed-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.seed-row form{margin:0}
.panel code{background:rgba(1,203,154,.1);color:var(--mint);padding:1px 6px;border-radius:5px;font-size:.9em}

/* ═══════════════════════════════════════════════════════════════════════
   MARKETPLACE v3 — quieter cards, progressive disclosure, mobile-first
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Cards ────────────────────────────────────────────────────────────── */
.proj-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:18px}
.proj-card{border:1px solid var(--line2);background:linear-gradient(180deg,rgba(16,48,46,.4),rgba(0,15,12,.72))}
.proj-card:hover{box-shadow:0 24px 60px -30px rgba(1,203,154,.5)}

.pc-img{position:relative;aspect-ratio:16/9;background-size:cover;background-position:center;
  border-bottom:1px solid var(--line2)}
.pc-img::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,15,12,.15) 0%,rgba(0,15,12,0) 40%,rgba(0,15,12,.85) 100%)}
.pc-img .pc-badges{position:absolute;top:12px;left:12px;z-index:2;display:flex;gap:6px}
.pc-ticker{position:absolute;top:12px;right:12px;z-index:2;display:flex;flex-direction:column;
  align-items:flex-end;font-weight:900;font-size:1.05rem;letter-spacing:.06em;color:var(--mint);
  text-shadow:0 2px 12px rgba(0,15,12,.9)}
.pc-ticker em{font-style:normal;font-size:.56rem;letter-spacing:.16em;color:var(--faint);font-weight:700}
.pc-img-foot{position:absolute;left:12px;right:12px;bottom:10px;z-index:2;display:flex;gap:8px;
  align-items:center;font-size:.64rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.pc-class{color:var(--ink);opacity:.75}
.pc-risk{color:var(--mint);opacity:.9;margin-left:auto;text-align:right;letter-spacing:.08em}

.pc-body{padding:20px 22px 18px;display:flex;flex-direction:column;gap:10px;flex:1}
.pc-sponsor{font-size:.68rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.pc-body h3{margin:0;font-size:1.25rem;font-weight:800;letter-spacing:-.015em;line-height:1.2}
.pc-tag{margin:0;font-size:.86rem;color:var(--muted);line-height:1.6;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

.pc-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:12px 0;
  border-top:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.pc-metric{display:flex;flex-direction:column;gap:2px;min-width:0}
.pc-metric .mv{font-size:1.02rem;font-weight:900;color:var(--mint);letter-spacing:-.01em}
.pc-metric .mk{font-size:.62rem;color:var(--faint);letter-spacing:.06em;text-transform:uppercase;
  font-weight:700;line-height:1.3}

.pc-fund .bar{height:5px;border-radius:999px;background:rgba(239,240,246,.08);overflow:hidden}
.pc-fund .bar i{display:block;height:100%;border-radius:999px;
  background:linear-gradient(90deg,#0aa87f,var(--mint));box-shadow:0 0 12px rgba(1,203,154,.55)}
.pc-fund .bar-row.top{display:flex;justify-content:space-between;align-items:baseline;
  margin-bottom:7px;font-size:.74rem;color:var(--faint)}
.pc-fund .pct{font-size:.95rem;font-weight:900;color:var(--ink)}

.pc-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;
  padding-top:14px;border-top:1px solid var(--line2)}
.pc-price b{display:block;font-size:1rem;font-weight:800;color:var(--ink)}
.pc-price span{font-size:.7rem;color:var(--faint)}
.pc-go{width:34px;height:34px;flex:none;border-radius:50%;display:grid;place-items:center;
  border:1px solid var(--line);color:var(--mint);font-size:1rem;opacity:1;transform:none;
  transition:background .2s,transform .2s}
.proj-card:hover .pc-go{background:var(--mint);color:#00231a;transform:translateX(3px)}

/* ── Project page: brief first ────────────────────────────────────────── */
.pd-sec.first{padding-top:6px;border-top:0}
.pd-summary{font-size:1.16rem;line-height:1.65;color:var(--ink);font-weight:500;margin:0 0 22px;
  max-width:62ch}
.pd-summary.sm{font-size:1rem;color:var(--muted);margin-bottom:18px}
.pd-summary b{color:var(--mint);font-weight:800}
.kpis.tight{margin:0 0 22px;gap:10px}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.sec-note{font-size:.74rem;color:var(--faint);letter-spacing:.04em}

/* Track strip — three tracks, one glance */
.track-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin:4px 0 18px}
.ts-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;
  padding:14px 16px;border:1px solid var(--line2);border-radius:13px;background:rgba(0,15,12,.4)}
.ts-dot{width:9px;height:9px;border-radius:50%;background:var(--mint)}
.t-optimisation .ts-dot{background:#f2b441}
.t-infrastructure .ts-dot{background:#5aa9ff}
.ts-card b{font-size:.9rem;font-weight:800}
.ts-n{font-size:.78rem;font-weight:900;color:var(--mint);border:1px solid var(--line);
  border-radius:999px;padding:1px 9px}
.ts-th{grid-column:1/-1;font-size:.76rem;color:var(--faint);line-height:1.45}

/* ── Disclosure rows (assets, experiences) ────────────────────────────── */
.asset-rows{display:flex;flex-direction:column;gap:8px}
.asset-row{border:1px solid var(--line2);border-radius:13px;background:rgba(0,15,12,.4);
  overflow:hidden;transition:border-color .2s,background .2s}
.asset-row:hover{border-color:var(--line)}
.asset-row[open]{background:rgba(16,48,46,.34);border-color:var(--line)}
.asset-row summary{display:flex;align-items:center;gap:12px;padding:15px 18px;cursor:pointer;
  list-style:none;min-height:56px}
.asset-row summary::-webkit-details-marker{display:none}
.ar-dot{width:8px;height:8px;border-radius:50%;flex:none;background:var(--mint)}
.t-optimisation .ar-dot{background:#f2b441}
.t-infrastructure .ar-dot{background:#5aa9ff}
.ar-no{font-size:.72rem;font-weight:900;color:var(--faint);flex:none;font-variant-numeric:tabular-nums}
.ar-name{flex:1;min-width:0;font-size:.95rem;font-weight:700;line-height:1.25}
.ar-name em{display:block;font-style:normal;font-size:.72rem;font-weight:500;color:var(--faint);
  margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar-price{font-size:.92rem;font-weight:800;color:var(--mint);flex:none;white-space:nowrap}
.ar-caret{width:22px;height:22px;flex:none;border-radius:50%;border:1px solid var(--line2);
  position:relative;transition:transform .25s,border-color .2s}
.ar-caret::before,.ar-caret::after{content:"";position:absolute;background:var(--mint);
  left:50%;top:50%;transform:translate(-50%,-50%)}
.ar-caret::before{width:9px;height:1.5px}
.ar-caret::after{width:1.5px;height:9px;transition:opacity .2s}
.asset-row[open] .ar-caret{transform:rotate(180deg);border-color:var(--line)}
.asset-row[open] .ar-caret::after{opacity:0}
.ar-body{padding:0 18px 18px;animation:disc-in .28s var(--ease,ease) both}
.ar-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;
  padding:14px 0;margin-bottom:10px;border-top:1px solid var(--line2)}
.ar-facts .l{display:block;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--faint);font-weight:800;margin-bottom:3px}
.ar-facts .v{font-size:.86rem;color:var(--ink);font-weight:600;line-height:1.45}
.ar-note{margin:0;font-size:.86rem;color:var(--muted);line-height:1.7}
@keyframes disc-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* ── Deep-dive disclosures ────────────────────────────────────────────── */
.disc{border:1px solid var(--line2);border-radius:14px;margin-bottom:10px;overflow:hidden;
  background:rgba(0,15,12,.35);transition:border-color .2s}
.disc:hover{border-color:var(--line)}
.disc[open]{background:rgba(16,48,46,.3);border-color:var(--line)}
.disc>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 20px;cursor:pointer;list-style:none;font-size:.95rem;font-weight:700;
  color:var(--ink);min-height:56px}
.disc>summary::-webkit-details-marker{display:none}
.disc>summary::after{content:"";width:22px;height:22px;flex:none;border-radius:50%;
  border:1px solid var(--line2);background:
    linear-gradient(var(--mint),var(--mint)) center/9px 1.5px no-repeat,
    linear-gradient(var(--mint),var(--mint)) center/1.5px 9px no-repeat;transition:transform .25s}
.disc[open]>summary::after{transform:rotate(45deg)}
.disc>*:not(summary){padding-left:20px;padding-right:20px}
.disc>*:not(summary):last-child{padding-bottom:20px}
.disc .pd-body:first-of-type{padding-top:4px}

/* ── Mobile action bar ────────────────────────────────────────────────── */
.pd-bar{display:none}

/* ═══ RESPONSIVE ═══════════════════════════════════════════════════════ */
@media(max-width:1080px){
  .proj-grid{grid-template-columns:1fr;max-width:560px}
}
@media(max-width:860px){
  .content.pd{padding-bottom:88px}          /* room for the sticky bar */
  .pd-hero{min-height:250px;padding:22px 20px;background-position:center}
  .pd-title{font-size:1.65rem}
  .pd-summary{font-size:1.04rem}
  .pd-nav{top:0;padding:6px 0;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none;
    -webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
  .pd-nav::-webkit-scrollbar{display:none}
  .pd-nav a{flex:none;scroll-snap-align:start}
  .pd-sec{padding:26px 0}
  .pd-sec.tok{padding:24px 16px}
  .kpis,.kpis.tight{grid-template-columns:repeat(2,1fr)}
  .pc-metrics{grid-template-columns:repeat(3,1fr);gap:6px}
  .pc-metric .mv{font-size:.92rem}
  .sec-head{align-items:flex-start;flex-direction:column;gap:4px}
  .ar-price{font-size:.84rem}
  .ar-name{font-size:.9rem}
  .track-strip{grid-template-columns:1fr}
  .pd-figure figcaption{font-size:.76rem;padding:12px 16px}

  /* the invest rail becomes a card in the flow, and the bar does the work */
  .pd-rail{position:static;margin-top:20px}

  .pd-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;
    position:fixed;left:0;right:0;bottom:0;z-index:40;padding:12px 16px;
    padding-bottom:calc(12px + env(safe-area-inset-bottom));
    background:rgba(0,15,12,.94);backdrop-filter:blur(14px);
    border-top:1px solid var(--line);box-shadow:0 -12px 40px -20px #000}
  .pb-price b{display:block;font-size:.98rem;font-weight:800;color:var(--ink);line-height:1.2}
  .pb-price span{font-size:.7rem;color:var(--faint)}
  .pd-bar .btn.sm{padding:11px 22px;font-size:.85rem}
  .pb-lock{font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
    color:var(--faint);border:1px solid var(--line2);border-radius:999px;padding:7px 14px}
}
@media(max-width:520px){
  .mk-stats{grid-template-columns:repeat(2,1fr)}
  .pc-body{padding:18px}
  .pc-body h3{font-size:1.12rem}
  .why-grid,.vc-grid,.rev-grid,.flag-grid,.exp-grid,.track-grid{grid-template-columns:1fr}
  .asset-row summary{padding:14px;gap:9px}
  .ar-name em{font-size:.68rem}
  .disc>summary{padding:14px 16px;font-size:.9rem}
  .disc>*:not(summary){padding-left:16px;padding-right:16px}
}

/* ═══════════════════════════════════════════════════════════════════════
   FIXES — overlap bugs found on device, nav drawer, KPI layout
   ═══════════════════════════════════════════════════════════════════════ */

/* KPI: value and key were rendering inline and colliding. Stack them. */
.kpi{display:flex;flex-direction:column;gap:5px;justify-content:center}
.kpi .v{line-height:1.15;word-break:break-word}
.kpi .k{line-height:1.35;letter-spacing:.12em;hyphens:auto}

/* Detail hero: badges live in the flow, never absolutely over the nav */
.pd-hero .pc-badges{position:static;display:flex;flex-wrap:wrap;gap:6px;margin-bottom:4px}
.pd-hero{position:relative;isolation:isolate;overflow:hidden}
.pd-hero-in{position:relative;z-index:1}

/* Nav drawer: opaque panel, scrim, close button, no bleed-through */
.nav-scrim{position:fixed;inset:0;z-index:48;background:rgba(0,6,5,.72);backdrop-filter:blur(3px);
  opacity:0;pointer-events:none;transition:opacity .3s}
.nav-scrim.on{opacity:1;pointer-events:auto}
.nav-close{display:none;position:absolute;top:16px;right:18px;width:40px;height:40px;border:0;
  background:transparent;color:var(--ink);font-size:1.5rem;line-height:1;cursor:pointer;border-radius:10px}
.nav-close:hover{background:rgba(239,240,246,.07)}
body.nav-open{overflow:hidden}

@media(max-width:860px){
  .nav-links{background:#020D0A;backdrop-filter:none;z-index:60;
    box-shadow:-24px 0 60px -20px rgba(0,0,0,.9);width:min(84vw,340px);
    padding:76px 22px calc(26px + env(safe-area-inset-bottom))}
  .nav-close{display:block}
  .nav-link{border-bottom:1px solid var(--line2);border-radius:0}
  .nav-link.on{color:var(--mint)}
  .nav-link.on::after{display:none}
  .btn-nav{margin-top:14px}
  .topnav{z-index:50}
}

/* ═══════════════════════════════════════════════════════════════════════
   CARDS v4 — real photography, Ken Burns lift, no overlap
   ═══════════════════════════════════════════════════════════════════════ */
.pc-img{position:relative;aspect-ratio:16/9;overflow:hidden;background:#04140F;
  border-bottom:1px solid var(--line2)}
.pc-img picture,.pc-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.pc-img img{transition:transform .7s cubic-bezier(.2,.7,.3,1),filter .4s;
  filter:saturate(1.02) contrast(1.02)}
.proj-card:hover .pc-img img{transform:scale(1.06)}
.pc-img::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(0,15,12,.35) 0%,rgba(0,15,12,0) 34%,
             rgba(0,15,12,.55) 72%,rgba(0,15,12,.94) 100%)}
.pc-img::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(120% 90% at 100% 0%,rgba(1,203,154,.16),transparent 55%);
  mix-blend-mode:screen}
.pc-img .pc-badges,.pc-ticker,.pc-img-foot{z-index:2}
.pc-ticker{text-shadow:0 2px 14px rgba(0,6,5,.95)}
.pc-img-foot{text-shadow:0 1px 10px rgba(0,6,5,.9)}
.proj-card{position:relative;isolation:isolate}
.proj-card::after{content:"";position:absolute;inset:0;border-radius:18px;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(1,203,154,0);transition:box-shadow .3s}
.proj-card:hover::after{box-shadow:inset 0 0 0 1px rgba(1,203,154,.35)}

/* Schematic figure — the drawing sits beside the photograph */
.pd-figure.schematic{background:linear-gradient(180deg,rgba(4,20,15,.9),rgba(0,15,12,.95))}
.pd-figure.schematic figcaption b{color:var(--mint)}

/* Admin image manager */
.img-manager{display:flex;flex-direction:column;gap:12px}
.img-preview{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--line2);
  aspect-ratio:16/9;background:#04140F}
.img-preview img{width:100%;height:100%;object-fit:cover;display:block}
.img-preview.empty{display:grid;place-items:center;color:var(--faint);font-size:.82rem;
  border-style:dashed}
.img-tag{position:absolute;bottom:10px;left:10px;font-size:.58rem;font-weight:800;letter-spacing:.14em;
  padding:4px 9px;border-radius:999px;background:rgba(0,15,12,.85);border:1px solid var(--line);
  color:var(--mint)}
.file-drop{display:block;border:1px dashed var(--line);border-radius:12px;padding:18px;
  text-align:center;cursor:pointer;transition:background .2s,border-color .2s;margin-bottom:10px}
.file-drop:hover{background:rgba(1,203,154,.06);border-color:var(--mint)}
.file-drop input{width:100%;color:var(--muted);font-size:.8rem}
.file-drop span{display:block;margin-top:8px}
.file-drop b{display:block;font-size:.9rem;color:var(--ink)}
.file-drop em{font-style:normal;font-size:.74rem;color:var(--faint)}
.row-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

@media(max-width:860px){
  .pc-img{aspect-ratio:3/2}
  .proj-card:hover .pc-img img{transform:none}   /* no hover on touch — save the paint */
}

/* ═══════════════════════════════════════════════════════════════════════
   WALLET CONSOLE — the address-overflow bug, fixed at the root
   The old .addr/code had no min-width:0 inside a grid/flex parent and no
   wrapping rule, so a 34-char r-address pushed straight out of its card.
   Every address now lives in a .wc-addr box that owns its own overflow.
   ═══════════════════════════════════════════════════════════════════════ */
.content.wm{min-width:0}
.wm-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  flex-wrap:wrap;padding-bottom:26px;border-bottom:1px solid var(--line2);margin-bottom:8px}
.wm-head-copy{min-width:0;flex:1 1 380px}
.wm-title{font-size:clamp(1.9rem,3.4vw,2.7rem);font-weight:900;letter-spacing:-.02em;
  line-height:1.08;margin:6px 0 12px}
.wm-lede{color:var(--muted);line-height:1.7;max-width:60ch;margin:0;font-size:.95rem}
.wm-actions{display:flex;gap:10px;flex-wrap:wrap}
.wm-sec{padding:30px 0;border-top:1px solid var(--line2)}
.wm-sec:first-of-type{border-top:0}
.wm-h2{font-size:clamp(1.3rem,2.2vw,1.7rem);font-weight:800;letter-spacing:-.015em;margin:2px 0 0}
.wm-note{font-size:.88rem;color:var(--muted);line-height:1.7;margin:0 0 18px;max-width:74ch;
  padding:14px 16px;border-left:2px solid var(--line);background:rgba(1,203,154,.04);
  border-radius:0 12px 12px 0}
.wm-note b{color:var(--ink)}
.wm-note em{color:var(--mint);font-style:normal;font-weight:700}

/* ── Wallet cards ─────────────────────────────────────────────────────── */
.wallet-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px}
.wallet-card{position:relative;min-width:0;display:flex;flex-direction:column;gap:12px;
  padding:22px;border:1px solid var(--line2);border-radius:18px;overflow:hidden;
  background:linear-gradient(165deg,rgba(16,48,46,.5),rgba(0,15,12,.8));transition:.25s}
.wallet-card::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--mint);
  opacity:.5;transition:opacity .25s}
.wallet-card:hover{border-color:var(--line);transform:translateY(-2px)}
.wallet-card:hover::before{opacity:1}
.c-xaman::before{background:#5aa9ff}
.c-self::before{background:#f2b441}
.c-third_party::before{background:#b78cff}
.wc-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.wc-custody{display:inline-flex;align-items:center;gap:7px;font-size:.66rem;font-weight:800;
  letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.wc-dot{width:7px;height:7px;border-radius:50%;background:var(--mint);flex:none}
.c-xaman .wc-dot{background:#5aa9ff}
.c-self .wc-dot{background:#f2b441}
.c-third_party .wc-dot{background:#b78cff}
.wc-label{margin:0;font-size:1.15rem;font-weight:800;letter-spacing:-.01em}

/* THE FIX: the address box owns its overflow. It wraps, it never escapes. */
.wc-addr{display:flex;align-items:flex-start;gap:8px;min-width:0;
  background:rgba(0,6,5,.55);border:1px solid var(--line2);border-radius:12px;padding:11px 12px}
.wc-addr code{flex:1;min-width:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:.78rem;line-height:1.5;color:var(--ink);
  overflow-wrap:anywhere;word-break:break-all}
.wc-copy{flex:none;align-self:center;border:1px solid var(--line);background:transparent;
  color:var(--mint);font-size:.68rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  padding:6px 11px;border-radius:8px;cursor:pointer;transition:.2s;min-width:60px}
.wc-copy:hover{background:rgba(1,203,154,.12)}
.wc-copy.ok{background:var(--mint);color:#00231a;border-color:var(--mint)}

.wc-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-size:.76rem;color:var(--faint);flex-wrap:wrap}
.wc-explore{font-weight:700;color:var(--mint);white-space:nowrap}
.wc-send{margin-top:2px;border-top:1px solid var(--line2);padding-top:12px}
.wc-send summary{cursor:pointer;font-size:.82rem;font-weight:700;color:var(--mint);
  list-style:none;padding:4px 0}
.wc-send summary::-webkit-details-marker{display:none}
.wc-send summary::before{content:"＋ ";font-weight:800}
.wc-send[open] summary::before{content:"− "}

/* ── Empty state ──────────────────────────────────────────────────────── */
.wm-empty{grid-column:1/-1;text-align:center;padding:44px 26px;border:1px dashed var(--line2);
  border-radius:20px;background:radial-gradient(90% 120% at 50% 0%,rgba(1,203,154,.07),transparent 60%)}
.wm-empty h3{margin:16px 0 8px;font-size:1.3rem;font-weight:800}
.wm-empty p{color:var(--muted);max-width:52ch;margin:0 auto 22px;font-size:.9rem;line-height:1.65}
.wm-empty-art{display:flex;gap:8px;justify-content:center;align-items:flex-end;height:44px}
.wm-empty-art span{width:12px;border-radius:6px;background:var(--mint);opacity:.25;
  animation:wm-bob 1.8s ease-in-out infinite}
.wm-empty-art span:nth-child(1){height:20px}
.wm-empty-art span:nth-child(2){height:36px;animation-delay:.2s;opacity:.45}
.wm-empty-art span:nth-child(3){height:26px;animation-delay:.4s}
@keyframes wm-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.custody-menu{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;
  text-align:left;max-width:760px;margin:0 auto}
.custody-opt{display:block;padding:16px;border:1px solid var(--line2);border-radius:14px;
  background:rgba(0,15,12,.4);transition:.2s;text-decoration:none}
.custody-opt:hover{border-color:var(--mint);transform:translateY(-2px);text-decoration:none}
.custody-opt b{display:block;color:var(--ink);font-size:.95rem;margin-bottom:5px}
.custody-opt span{font-size:.8rem;color:var(--muted);line-height:1.55}

/* ── Chain cards ──────────────────────────────────────────────────────── */
.chain-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px}
.chain-card{min-width:0;display:flex;flex-direction:column;gap:12px;padding:20px;
  border:1px solid var(--line2);border-radius:18px;background:rgba(0,15,12,.5);transition:.25s}
.chain-card:hover{border-color:color-mix(in srgb,var(--c,#01CB9A) 55%,transparent);
  transform:translateY(-2px)}
.cc-top{display:flex;align-items:center;gap:12px;min-width:0}
.cc-badge{flex:none;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;
  font-size:.7rem;font-weight:900;letter-spacing:.04em;
  color:var(--c,#01CB9A);border:1px solid color-mix(in srgb,var(--c,#01CB9A) 45%,transparent);
  background:color-mix(in srgb,var(--c,#01CB9A) 12%,transparent)}
.cc-id{flex:1;min-width:0}
.cc-id b{display:block;font-size:1rem;font-weight:800;line-height:1.2}
.cc-id span{display:block;font-size:.74rem;color:var(--faint);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-x{flex:none;width:30px;height:30px;border-radius:9px;border:1px solid var(--line2);
  background:transparent;color:var(--faint);font-size:1.1rem;line-height:1;cursor:pointer;
  transition:.2s}
.cc-x:hover{border-color:var(--danger);color:var(--danger);background:rgba(255,107,107,.08)}
.cc-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;
  padding-top:12px;border-top:1px solid var(--line2)}
.cc-bal b{font-size:1.15rem;font-weight:900;color:var(--c,#01CB9A);
  font-variant-numeric:tabular-nums}
.cc-bal b.dim{color:var(--faint)}
.cc-bal span{font-size:.72rem;color:var(--faint);margin-left:5px}

.chain-card.add{border-style:dashed;background:transparent}
.chain-card.add summary{display:flex;align-items:center;gap:12px;cursor:pointer;list-style:none}
.chain-card.add summary::-webkit-details-marker{display:none}
.cc-plus{flex:none;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;
  border:1px solid var(--line);color:var(--mint);font-size:1.3rem;font-weight:800}
.chain-card.add:hover{border-color:var(--mint)}
.chain-card.add .form{margin-top:14px}

/* ── Custody explainer ────────────────────────────────────────────────── */
.custody-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.cm-card{padding:20px;border:1px solid var(--line2);border-radius:16px;
  background:linear-gradient(180deg,rgba(16,48,46,.34),rgba(0,15,12,.5));transition:.25s}
.cm-card:hover{border-color:var(--line);transform:translateY(-2px)}
.cm-i{font-size:1.4rem;display:block;margin-bottom:8px}
.cm-card h4{margin:0 0 7px;font-size:.98rem;font-weight:800}
.cm-card p{margin:0;font-size:.83rem;color:var(--muted);line-height:1.65}

@media(max-width:860px){
  .wm-head{flex-direction:column;align-items:stretch}
  .wm-actions .btn{flex:1;justify-content:center}
  .wallet-grid,.chain-grid,.custody-grid,.custody-menu{grid-template-columns:1fr}
  .wc-addr code{font-size:.74rem}
}

/* ── Cross-chain comparator ───────────────────────────────────────────── */
.xb{margin-top:34px;padding-top:30px;border-top:1px solid var(--line2)}
.xb-form{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin:6px 0 18px;
  padding:16px;border:1px solid var(--line2);border-radius:16px;background:rgba(0,15,12,.45)}
.xb-form label{display:flex;flex-direction:column;gap:5px;font-size:.7rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--faint);flex:1;min-width:120px}
.xb-form select,.xb-form input{padding:10px 12px;border-radius:10px;border:1px solid var(--line2);
  background:#04100c;color:var(--ink);font-family:inherit;font-size:.88rem;font-weight:600}
.xb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.xb-card{display:flex;flex-direction:column;gap:12px;padding:20px;border:1px solid var(--line2);
  border-radius:16px;background:linear-gradient(180deg,rgba(16,48,46,.35),rgba(0,15,12,.6));
  transition:.25s;min-width:0}
.xb-card:hover{border-color:var(--line);transform:translateY(-2px)}
.xb-card.rec{border-color:var(--mint);box-shadow:0 0 0 1px rgba(1,203,154,.25) inset}
.xb-card.off{opacity:.5}
.xb-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.xb-top b{display:block;font-size:1rem;font-weight:800}
.xb-tier{font-size:.7rem;color:var(--faint);line-height:1.4}
.xb-nums{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px 0;
  border-top:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.xb-nums .l{display:block;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--faint);font-weight:800;margin-bottom:3px}
.xb-nums .v{font-size:1rem;font-weight:800;color:var(--mint)}
.xb-note{margin:0;font-size:.8rem;color:var(--muted);line-height:1.6;flex:1}
.xb-cta{margin:0;font-size:.7rem;color:var(--faint);line-height:1.5}
.xb-cta.real{color:var(--mint);font-weight:700}
.xb-cta.off{font-style:italic}

/* ── Bridge job rail ──────────────────────────────────────────────────── */
.bj-rail{display:flex;gap:6px;flex-wrap:wrap;margin:20px 0 22px}
.bj-step{display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;
  border:1px solid var(--line2);font-size:.74rem;font-weight:700;color:var(--faint)}
.bj-step.on{color:var(--ink);border-color:var(--line);background:rgba(1,203,154,.07)}
.bj-dot{width:7px;height:7px;border-radius:50%;background:var(--line2)}
.bj-step.on .bj-dot{background:var(--mint);box-shadow:0 0 8px rgba(1,203,154,.7)}
.bj-step.fail .bj-dot{background:var(--danger);box-shadow:0 0 8px rgba(255,107,107,.7)}

/* ═══════════════════════════════════════════════════════════════════════
   DEVICE FIXES — landscape drawer, clipped rows, clipped list markers
   ═══════════════════════════════════════════════════════════════════════ */

/* ── 1. LANDSCAPE: the drawer swallowed the screen ─────────────────────
   In landscape an iPhone is ~850px wide, so the max-width:860px drawer rule
   still fired — but with only ~390px of height, a 100dvh panel with 76px of
   top padding filled the viewport and could not scroll. Now it scrolls, it
   sits above the safe areas, and the sticky bottom bar gets out of the way. */
@media (orientation:landscape) and (max-height:560px){
  .nav-links{
    width:min(52vw,320px);
    padding:14px 20px calc(16px + env(safe-area-inset-bottom));
    overflow-y:auto;-webkit-overflow-scrolling:touch;
    padding-right:calc(20px + env(safe-area-inset-right));
  }
  .nav-close{top:8px;right:10px;width:36px;height:36px}
  .nav-link{padding:11px 4px;font-size:.95rem}
  .btn-nav{margin-top:10px;padding:10px 16px}

  /* A 60px action bar on a 390px-tall viewport is a sixth of the screen.
     Hide it — the invest rail is right there in the flow. */
  .pd-bar{display:none!important}
  .content.pd{padding-bottom:24px}

  .topnav{padding-top:6px;padding-bottom:6px}
  .pd-hero{min-height:180px}
}

/* Belt and braces: the drawer is never taller than the screen, ever. */
.nav-links{max-height:100dvh;overflow-y:auto;overscroll-behavior:contain}

/* ── 2. KEY/VALUE ROWS were clipping their value column ────────────────
   .pd-row is a flex row with `b{min-width:170px;flex:none}`. On a 390px screen
   that left ~200px for the value, and long values ("Data room access upon
   qualification…") were cut off at the panel edge. Stack them on mobile. */
@media(max-width:640px){
  .pd-row{flex-direction:column;gap:4px;padding:12px 0}
  .pd-row b{min-width:0;width:100%}
  .pd-row span{width:100%}

  /* Ordered-list markers were rendering outside the panel's padding box. */
  .steps-ol{padding-left:24px;margin-left:2px}
  .steps-ol li{padding-left:2px}
  .disc>*:not(summary){padding-left:16px;padding-right:16px}

  /* Panels inside disclosures were adding a second inset and overflowing. */
  .disc .panel{padding:16px;margin-left:0;margin-right:0}
  .tbl{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}

/* ── 3. The in-app sidebar becomes a scrolling rail, not a column ──────
   .side is a fixed-width flex column. On a phone it stole ~200px of a 390px
   viewport, which is why content read as "cut off". It now lies flat across
   the top and scrolls horizontally. */
@media(max-width:860px){
  .page{flex-direction:column}
  .side{width:auto;border-right:0;border-bottom:1px solid var(--line2);
    padding:10px 12px;display:flex;gap:6px;align-items:center;
    overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .side::-webkit-scrollbar{display:none}
  .side .lbl{display:none}
  .side a{flex:none;white-space:nowrap;padding:8px 12px;font-size:.8rem;
    border:1px solid var(--line2);border-radius:999px}
  .side a.active{border-color:var(--line)}
  .content{min-width:0;padding-left:16px;padding-right:16px}
}

/* ── 4. Nothing may exceed the viewport, anywhere ──────────────────────── */
html,body{max-width:100%;overflow-x:hidden}
.content,.panel,.pd-main,.wallet-card,.chain-card,.xb-card{min-width:0}
img,svg,figure,table{max-width:100%}

/* ═══════════════════════════════════════════════════════════════════════
   CSP-SAFE UTILITIES
   style-src is 'self' with NO 'unsafe-inline' — by design, because an
   inline style attribute is an injection sink (CSS can exfiltrate via
   attribute selectors + url()). The browser was silently dropping all 111
   inline styles, which is why the hero banner was blank and the funding
   ring was empty. These utilities replace them. Dynamic values (widths,
   ring percentage, chain colour) are set from JS via CSSOM, which CSP
   permits — so the policy stays strict and the UI actually renders.
   ═══════════════════════════════════════════════════════════════════════ */
.u-align-items-start{align-items:start}
.u-align-items-start-margin-top-18px{align-items:start;margin-top:18px}
.u-border-color-rgba-255-107-107-4{border-color:rgba(255,107,107,.4)}
.u-border-radius-12px-margin-14px-auto-display-block{border-radius:12px;margin:14px auto;display:block}
.u-border-radius-12px-margin-6px-auto-14px-display-block{border-radius:12px;margin:6px auto 14px;display:block}
.u-color-f2b441{color:#f2b441}
.u-color-var-danger{color:var(--danger)}
.u-color-var-mint-margin-top-12px{color:var(--mint);margin-top:12px}
.u-flex-wrap-wrap{flex-wrap:wrap}
.u-flex-1{flex:1}
.u-flex-2{flex:2}
.u-margin-bottom-12px{margin-bottom:12px}
.u-margin-top-10px{margin-top:10px}
.u-margin-top-12px{margin-top:12px}
.u-margin-top-14px{margin-top:14px}
.u-margin-top-16px{margin-top:16px}
.u-margin-top-18px{margin-top:18px}
.u-margin-top-20px{margin-top:20px}
.u-margin-top-22px{margin-top:22px}
.u-margin-top-24px{margin-top:24px}
.u-margin-top-26px{margin-top:26px}
.u-margin-top-28px{margin-top:28px}
.u-margin-top-8px{margin-top:8px}
.u-margin-8px-0-18px{margin:-8px 0 18px}
.u-margin-0-0-12px{margin:0 0 12px}
.u-margin-0-0-14px{margin:0 0 14px}
.u-margin-0-0-4px{margin:0 0 4px}
.u-margin-0-auto-14px-display-block{margin:0 auto 14px;display:block}
.u-margin-14px-0-0{margin:14px 0 0}
.u-margin-14px-auto-26px{margin:14px auto 26px}
.u-max-width-110px{max-width:110px}
.u-max-width-120px{max-width:120px}
.u-max-width-440px{max-width:440px}
.u-max-width-480px{max-width:480px}
.u-max-width-520px{max-width:520px}
.u-max-width-520px-margin-0-auto{max-width:520px;margin:0 auto}
.u-max-width-560px{max-width:560px}
.u-max-width-640px{max-width:640px}
.u-max-width-80px{max-width:80px}
.u-text-align-center{text-align:center}
.u-text-align-center-margin-bottom-20px{text-align:center;margin-bottom:20px}
.u-text-decoration-none{text-decoration:none}
.u-width-100{width:100%}
.u-width-100-border-radius-12px-margin-bottom-12px{width:100%;border-radius:12px;margin-bottom:12px}
.u-width-100-margin-top-10px{width:100%;margin-top:10px}
.u-width-100-margin-top-14px{width:100%;margin-top:14px}
.u-width-100-margin-top-4px{width:100%;margin-top:4px}
.u-width-100-margin-top-6px{width:100%;margin-top:6px}
.u-width-100-margin-top-8px{width:100%;margin-top:8px}
.u-width-150px{width:150px}

/* ── Project hero: a real <img>, so a strict CSP can never blank it ────── */
.pd-hero{position:relative;isolation:isolate;overflow:hidden;min-height:340px;
  display:flex;align-items:flex-end;background:linear-gradient(120deg,#06231C,#000F0C)}
.pd-hero-media{position:absolute;inset:0;z-index:0}
.pd-hero-media img{width:100%;height:100%;object-fit:cover;display:block;
  object-position:center 42%}
.pd-hero-scrim{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,rgba(0,15,12,.96) 0%,rgba(0,15,12,.78) 46%,
             rgba(0,15,12,.30) 100%),
             linear-gradient(0deg,rgba(0,15,12,.75) 0%,rgba(0,15,12,0) 55%)}
.pd-hero-in{position:relative;z-index:2;width:100%}
@media(max-width:860px){
  .pd-hero{min-height:260px}
  .pd-hero-scrim{background:linear-gradient(0deg,rgba(0,15,12,.95) 8%,
                 rgba(0,15,12,.55) 55%,rgba(0,15,12,.25) 100%)}
}