/* ══════════════════════════════════════════════════════════════════
   style.css — ChainGreets — Feuille de style principale
   ══════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&display=swap');

/* ── VARIABLES THÈME ── */
:root[data-theme="dark"] {
  --bg:#1c1a17;  --bg2:#252220;  --bg3:#2e2b27;  --bg4:#38342f;
  --border:#3d3830;  --border2:#4a443b;
  --accent:#c9a96e;  --accent2:#8b7355;  --accent3:#d4875a;  --accent-text:#1a1a1a;
  --accent-rgb:201,169,110;  --accent2-rgb:139,115,85;
  --green:#7ab87a;   --red:#c97070;
  --text:#e8e0d0;    --muted:#8a7f72;    --muted2:#6a6058;
  --shadow:rgba(0,0,0,.6);
  --card-hover:rgba(201,169,110,.05);
  --pill-bg:rgba(28,26,23,.92);
  --blob1:rgba(201,169,110,.08);  --blob2:rgba(139,115,85,.08);
  --grid-line:rgba(201,169,110,.03);
}
:root[data-theme="light"] {
  --bg:#f5f0e8;  --bg2:#fdfaf4;  --bg3:#ede8de;  --bg4:#e2ddd2;
  --border:#ccc5b5;  --border2:#b8b0a0;
  --accent:#7a5c3a;  --accent2:#9a7850;  --accent3:#b05a30;  --accent-text:#fff;
  --accent-rgb:122,92,58;  --accent2-rgb:154,120,80;
  --green:#4a8050;   --red:#a04040;
  --text:#2e2820;    --muted:#8a8070;    --muted2:#a89e90;
  --shadow:rgba(40,30,10,.14);
  --card-hover:rgba(122,92,58,.05);
  --pill-bg:rgba(245,240,232,.94);
  --blob1:rgba(122,92,58,.07);  --blob2:rgba(154,120,80,.07);
  --grid-line:rgba(122,92,58,.04);
}

:root[data-theme="web3"] {
  --bg:#0e1319;  --bg2:#1f2128;  --bg3:#17191f;  --bg4:#252830;
  --border:rgba(255,255,255,.10);  --border2:rgba(255,255,255,.15);
  --accent:#d0ff94;  --accent2:#6f75e5;  --accent3:#6f75e5;  --accent-text:#1a1a1a;
  --accent-rgb:208,255,148;  --accent2-rgb:111,117,229;
  --green:#00b17e;   --red:#ff6b6b;
  --text:rgba(255,255,255,.875);  --muted:#677694;  --muted2:#4a5568;
  --shadow:rgba(0,0,0,.7);
  --card-hover:rgba(208,255,148,.04);
  --pill-bg:rgba(14,19,25,.94);
  --blob1:rgba(111,117,229,.10);  --blob2:rgba(208,255,148,.06);
  --grid-line:rgba(255,255,255,.03);
}

:root[data-theme="web3-light"] {
  --bg:#f2f5f9;  --bg2:#ffffff;  --bg3:#eeeef1;  --bg4:#e5e5ea;
  --border:rgba(0,0,0,.10);  --border2:rgba(0,0,0,.15);
  --accent:#6f75e5;  --accent2:#ff68f0;  --accent3:#ff68f0;  --accent-text:#fff;
  --accent-rgb:111,117,229;  --accent2-rgb:255,104,240;
  --green:#00b17e;   --red:#e05050;
  --text:#1f2128;    --muted:#677694;  --muted2:#9aa5bc;
  --shadow:rgba(0,0,0,.12);
  --card-hover:rgba(111,117,229,.04);
  --pill-bg:rgba(242,245,249,.96);
  --blob1:rgba(111,117,229,.10);  --blob2:rgba(255,104,240,.08);
  --grid-line:rgba(0,0,0,.03);
}


/* ── WEB3 THEME — font + hardcoded accent overrides ── */
[data-theme="web3"] body,
[data-theme="web3"] button,
[data-theme="web3"] input,
[data-theme="web3"] a { font-family:'Space Grotesk',sans-serif !important; }

[data-theme="web3"] #connect-btn {
  box-shadow:0 0 18px rgba(208,255,148,.22);
}
[data-theme="web3"] #connect-btn:hover {
  box-shadow:0 0 32px rgba(208,255,148,.42);
}
[data-theme="web3"] .cbtn:hover     { background:rgba(208,255,148,.05); }
[data-theme="web3"] .cbtn.pri       { background:rgba(208,255,148,.08); border-color:rgba(208,255,148,.2); }
[data-theme="web3"] .cbtn.pri:hover { background:rgba(208,255,148,.15); }
[data-theme="web3"] .fbtn.active    { background:rgba(208,255,148,.05); }
[data-theme="web3"] .wi:hover       { background:rgba(208,255,148,.04); }
[data-theme="web3"] .btn-p          { box-shadow:0 0 16px rgba(208,255,148,.18); }
[data-theme="web3"] .btn-p:hover    { box-shadow:0 0 28px rgba(208,255,148,.38); }
[data-theme="web3"] .smod-btn-exp:hover { background:rgba(208,255,148,.07); }

/* ── WEB3-LIGHT THEME — font + hardcoded accent overrides ── */
[data-theme="web3-light"] body,
[data-theme="web3-light"] button,
[data-theme="web3-light"] input,
[data-theme="web3-light"] a { font-family:'Space Grotesk',sans-serif !important; }

[data-theme="web3-light"] #connect-btn      { box-shadow:0 0 18px rgba(111,117,229,.20); }
[data-theme="web3-light"] #connect-btn:hover { box-shadow:0 0 32px rgba(111,117,229,.38); }
[data-theme="web3-light"] .cbtn:hover        { background:rgba(111,117,229,.06); }
[data-theme="web3-light"] .cbtn.pri          { background:rgba(111,117,229,.08); border-color:rgba(111,117,229,.22); }
[data-theme="web3-light"] .cbtn.pri:hover    { background:rgba(111,117,229,.15); }
[data-theme="web3-light"] .fbtn.active       { background:rgba(111,117,229,.06); }
[data-theme="web3-light"] .wi:hover          { background:rgba(111,117,229,.04); }
[data-theme="web3-light"] .btn-p             { box-shadow:0 0 16px rgba(111,117,229,.18); }
[data-theme="web3-light"] .btn-p:hover       { box-shadow:0 0 28px rgba(111,117,229,.35); }
[data-theme="web3-light"] .smod-btn-exp:hover { background:rgba(111,117,229,.07); }

/* ── X1ECO THEME ── */
:root[data-theme="x1eco"] {
  --bg:#f4f7f2;     --bg2:#ffffff;   --bg3:#eaf0e7;   --bg4:#ddebd8;
  --border:rgba(58,140,47,.14);    --border2:rgba(58,140,47,.26);
  --accent:#3a8c2f; --accent2:#2e7024; --accent3:#5cb84d; --accent-text:#ffffff;
  --green:#3a8c2f;  --red:#d94f4f;
  --text:#1a2315;   --muted:#6a8062;  --muted2:#9aad92;
  --shadow:rgba(30,60,20,.12);
  --card-hover:rgba(58,140,47,.04);
  --pill-bg:rgba(244,247,242,.95);
  --blob1:rgba(58,140,47,.07);   --blob2:rgba(90,180,70,.05);
  --grid-line:rgba(58,140,47,.04);
  --accent-rgb:58,140,47;  --accent2-rgb:46,112,36;
}

[data-theme="x1eco"] body,
[data-theme="x1eco"] button,
[data-theme="x1eco"] input,
[data-theme="x1eco"] a { font-family:'Space Grotesk',sans-serif !important; }

[data-theme="x1eco"] #connect-btn       { box-shadow:0 2px 12px rgba(58,140,47,.20); }
[data-theme="x1eco"] #connect-btn:hover { box-shadow:0 4px 20px rgba(58,140,47,.35); }
[data-theme="x1eco"] .cbtn:hover        { background:rgba(58,140,47,.07); }
[data-theme="x1eco"] .cbtn.pri          { background:rgba(58,140,47,.09); border-color:rgba(58,140,47,.25); }
[data-theme="x1eco"] .cbtn.pri:hover    { background:rgba(58,140,47,.16); }
[data-theme="x1eco"] .fbtn.active       { background:rgba(58,140,47,.07); }
[data-theme="x1eco"] .wi:hover          { background:rgba(58,140,47,.05); }
[data-theme="x1eco"] .btn-p             { box-shadow:0 2px 10px rgba(58,140,47,.18); }
[data-theme="x1eco"] .btn-p:hover       { box-shadow:0 4px 18px rgba(58,140,47,.32); }
[data-theme="x1eco"] .smod-btn-exp:hover{ background:rgba(58,140,47,.07); }

/* ── SETTINGS MODAL ── */
.smod-settings {
  background:var(--bg2); border:1px solid var(--border); border-radius:18px;
  padding:28px; width:92%; max-width:480px; position:relative; animation:su .2s ease;
}
.smod-settings-title {
  font-family:'Syne',sans-serif; font-size:17px; font-weight:800;
  color:var(--text); margin-bottom:4px;
}
.smod-settings-sub { font-size:11px; color:var(--muted); margin-bottom:20px; }
.smod-settings-close {
  position:absolute; top:14px; right:14px; background:none; border:none;
  color:var(--muted); font-size:19px; cursor:pointer; transition:color .15s;
}
.smod-settings-close:hover { color:var(--text); }
.smod-section-label {
  font-size:9px; text-transform:uppercase; letter-spacing:2px;
  color:var(--muted2); margin-bottom:12px;
}
.theme-cards { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.theme-card {
  background:var(--bg3); border:2px solid var(--border); border-radius:12px;
  padding:12px; cursor:pointer; transition:all .18s;
  display:flex; flex-direction:column; gap:8px;
}
.theme-card:hover { border-color:var(--accent2); transform:translateY(-1px); }
.theme-card.selected { border-color:var(--accent); }
.theme-card-preview { border-radius:7px; overflow:hidden; height:52px; }
.tcp-header { height:16px; display:flex; align-items:center; padding:0 8px; gap:5px; }
.tcp-dot    { width:5px; height:5px; border-radius:50%; flex-shrink:0; }
.tcp-logo   { height:6px; border-radius:2px; flex:1; max-width:40px; opacity:.6; }
.tcp-body   { padding:5px 8px; display:flex; gap:5px; }
.tcp-card   { height:18px; border-radius:4px; flex:1; border:1px solid rgba(128,128,128,.15); }
.theme-card-label { font-size:12px; font-weight:700; color:var(--text); }
.theme-card-desc  { font-size:10px; color:var(--muted); margin-top:2px; }
@media(max-width:400px) { .theme-cards { grid-template-columns:1fr; } }

.adrop-settings {
  width:100%; background:transparent; border:1px solid var(--border);
  border-radius:7px; color:var(--muted); font-family:'Space Mono',monospace;
  font-size:11px; padding:8px 10px; cursor:pointer; transition:all .18s; text-align:left;
}
.adrop-settings:hover { color:var(--text); border-color:var(--muted); background:rgba(128,128,128,.05); }

/* ── RESET ── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html,body { transition:background .3s, color .3s; }
body {
  background:var(--bg); color:var(--text);
  font-family:'Space Mono', monospace; font-size:15px;
  min-height:100vh; overflow-x:hidden;
}


/* Blobs décoratifs */
.blob { position:fixed; border-radius:50%; filter:blur(130px); pointer-events:none; z-index:0; }
.blob-1 { width:500px; height:500px; background:var(--accent);  top:-180px; left:-80px;    opacity:.06; }
.blob-2 { width:400px; height:400px; background:var(--accent2); bottom:-120px; right:-60px; opacity:.06; }

.nav-left { display:flex; align-items:center; gap:10px; }
.nav-mobile-back { display:none; }
@media(max-width:768px) {
  .nav-mobile-back {
    display:inline-flex; align-items:center; white-space:nowrap;
    font-family:'Space Mono',monospace; font-size:11px; font-weight:700;
    color:var(--muted); text-decoration:none; letter-spacing:.3px;
    padding:5px 10px; border-radius:7px; border:1px solid var(--border);
    transition:color .18s, border-color .18s;
  }
  .nav-mobile-back:hover { color:var(--accent); border-color:var(--accent2); }
}

/* ── NAV ── */
nav {
  position:sticky; top:0; z-index:50;
  background:var(--pill-bg); backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 28px; height:62px;
}
.nav-logo { font-family:'Syne',sans-serif; font-size:20px; font-weight:800; color:var(--text); letter-spacing:-.5px; }
.nav-logo span { color:var(--accent); }
.nav-right { display:flex; align-items:center; gap:8px; }

/* ── Nav links ── */
a.nav-link {
  font-family:'Space Mono',monospace; font-size:11px; font-weight:700;
  color:var(--muted); text-decoration:none; letter-spacing:.3px;
  padding:7px 11px; border-radius:8px;
  border:1px solid transparent;
  transition:color .18s, border-color .18s, background .18s;
}
a.nav-link:hover {
  color:var(--accent); border-color:var(--accent2);
  background:rgba(201,169,110,.07);
}
a.nav-link.active {
  color:var(--accent); border-color:var(--accent2);
}

/* ── Settings button ── */
.btn-params {
  font-family:'Space Mono',monospace; font-size:11px; font-weight:700;
  color:var(--muted); background:var(--bg3);
  border:1px solid var(--border); border-radius:8px;
  padding:7px 11px; cursor:pointer; letter-spacing:.3px;
  transition:color .18s, border-color .18s, background .18s;
}
.btn-params:hover, .btn-params.has-key {
  color:var(--accent); border-color:var(--accent2);
  background:rgba(201,169,110,.07);
}

#theme-btn {
  background:var(--bg3); border:1px solid var(--border); border-radius:8px;
  width:36px; height:36px; cursor:pointer; font-size:15px;
  display:flex; align-items:center; justify-content:center;
  transition:all .2s; color:var(--text);
}
#theme-btn:hover { border-color:var(--accent2); transform:rotate(20deg); }

#nav-chain-pill {
  display:none; align-items:center; gap:7px;
  background:var(--bg3); border:1px solid var(--border); border-radius:8px;
  padding:7px 13px; font-size:11px; cursor:pointer;
  color:var(--text); font-family:'Space Mono',monospace; transition:all .2s;
}
#nav-chain-pill:hover { border-color:var(--accent2); }
#nav-chain-pill.show  { display:flex; }
.cdot { width:7px; height:7px; border-radius:50%; flex-shrink:0; }

#connect-btn {
  background:var(--accent); color:var(--bg); border:none; border-radius:8px;
  padding:9px 22px; cursor:pointer; font-family:'Space Mono',monospace;
  font-size:12px; font-weight:700; letter-spacing:.5px; transition:all .2s;
  display:flex; align-items:center; gap:8px;
  box-shadow:0 0 18px rgba(0,229,255,.28);
}
#connect-btn:hover { box-shadow:0 0 32px rgba(0,229,255,.5); transform:translateY(-1px); }
#connect-btn.connected {
  background:var(--accent); color:var(--bg);
  border:none; box-shadow:0 0 18px rgba(0,229,255,.28);
}
#connect-btn.connected:hover { box-shadow:0 0 32px rgba(0,229,255,.5); transform:translateY(-1px); }
#connect-btn.faded {
  background:var(--bg3); color:var(--text);
  border:1px solid var(--border); box-shadow:none; opacity:.6;
}
#connect-btn.faded:hover { opacity:1; border-color:var(--accent); }

.adot {
  width:7px; height:7px; border-radius:50%;
  background:var(--green); box-shadow:0 0 5px var(--green);
  animation:pulse 2s infinite; flex-shrink:0;
}
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.3} }

/* ── ACCOUNT DROPDOWN ── */
.acct-drop {
  display:none; position:fixed; top:70px; right:28px; z-index:100;
  background:var(--bg2); border:1px solid var(--border); border-radius:12px;
  padding:18px; width:270px; box-shadow:0 14px 44px var(--shadow);
  animation:slideDown .18s ease;
}
@keyframes slideDown { from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:none} }
.acct-drop.show { display:block; }
.arow  { display:flex; justify-content:space-between; align-items:center; margin-bottom:9px; }
.akey  { font-size:10px; text-transform:uppercase; letter-spacing:1.5px; color:var(--muted); }
.aval  { font-size:12px; color:var(--green); font-weight:700; cursor:pointer; }
.aval:hover { color:var(--accent); }
.aval.plain { color:var(--text); cursor:default; }
.adiv  { border:none; border-top:1px solid var(--border); margin:12px 0; }
.adisc {
  width:100%; background:transparent; border:1px solid rgba(255,59,107,.22);
  border-radius:7px; color:var(--red); font-family:'Space Mono',monospace;
  font-size:11px; padding:8px; cursor:pointer; transition:all .18s;
  margin-top:8px;
}
.adisc:hover { background:rgba(255,59,107,.07); border-color:var(--red); }

.adrop-theme {
  background:none; border:1px solid var(--border); border-radius:6px;
  color:var(--text); font-family:'Space Mono',monospace; font-size:11px;
  padding:3px 9px; cursor:pointer; transition:all .15s;
}
.adrop-theme:hover { color:var(--accent); border-color:var(--accent2); }
.adrop-exp {
  display:block; text-align:right; font-family:'Space Mono',monospace;
  font-size:11px; color:var(--accent); text-decoration:none;
  padding:5px 0 2px; transition:opacity .15s;
}
.adrop-exp:hover { text-decoration:underline; }

/* ── LAYOUT ── */
.wrap { position:relative; z-index:1; max-width:1100px; margin:0 auto; padding:44px 20px 80px; }
.hero { text-align:center; margin-bottom:32px; }
.hero h1 {
  font-family:'Syne',sans-serif; font-size:clamp(26px,5vw,46px); font-weight:800;
  color:var(--text); line-height:1.1; margin-bottom:8px;
}
.hero h1 span { color:var(--accent); }
.hero p { color:var(--muted); font-size:14px; letter-spacing:.8px; }

/* ── STATS ── */
.stats-bar { display:flex; gap:10px; justify-content:center; margin-bottom:24px; flex-wrap:wrap; }
.stat-pill {
  background:var(--bg2); border:1px solid var(--border); border-radius:8px;
  padding:8px 16px; font-size:12px; color:var(--muted);
  display:flex; align-items:center; gap:6px;
}
.stat-pill strong { color:var(--accent); font-size:13px; }
.streak-pill {
  background:var(--bg2); border:1px solid var(--border); border-radius:8px;
  padding:8px 16px; font-size:11px; color:var(--muted);
  display:flex; align-items:center; gap:8px; transition:all .3s;
}
.streak-pill.active { border-color:var(--accent3); background:rgba(255,107,53,.06); }
.streak-flame { font-size:16px; transition:transform .3s; }
.streak-pill.active .streak-flame { animation:flamepulse 1.4s ease-in-out infinite; }
@keyframes flamepulse { 0%,100%{transform:scale(1) rotate(-3deg)} 50%{transform:scale(1.18) rotate(3deg)} }
.streak-num   { font-family:'Syne',sans-serif; font-size:18px; font-weight:800; color:var(--accent3); line-height:1; }
.streak-label { font-size:9px; text-transform:uppercase; letter-spacing:1px; color:var(--muted); margin-top:1px; }
.streak-best  { font-size:9px; color:var(--muted2); margin-top:1px; }

/* ── COOLDOWN ── */
.cooldown-bar {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px 20px;
  margin: 0 auto 12px;
  max-width: 320px;
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 10px;
  font-size: 13px;
}
.cooldown-bar.show { display: flex; }
.cooldown-label { color: var(--muted); font-size: 12px; white-space: nowrap; }
.cooldown-timer { font-family: 'Space Mono', monospace; font-size: 15px; font-weight: 700; color: var(--accent2); letter-spacing: 1px; }

/* ── Compact cooldown chip inside the tab bar ── */
/* Framed like .tab-btn (same bg/border/radius/padding) and centered with the
   tabs as one flex group. No margin-left:auto so it sits next to the tabs. */
.tab-cooldown {
  display: none; align-items: center; gap: 6px;
  font-size: 11px; color: var(--muted); white-space: nowrap;
  background: var(--bg3); border: 1px solid var(--border);
  border-radius: 8px; padding: 10px 14px;
}
.tab-cooldown.show { display: inline-flex; }
.tab-cooldown-label { color: var(--muted); }
.tab-cooldown .cooldown-timer { font-size: 13px; }

/* ── TABS ── */
.tab-bar { display:flex; gap:8px; justify-content:center; margin-bottom:24px; flex-wrap:wrap; }
.tab-btn {
  background:var(--bg3); border:1px solid var(--border); border-radius:8px;
  padding:10px 20px; cursor:pointer; font-family:'Space Mono',monospace; font-size:15px;
  color:var(--muted); display:flex; align-items:center; gap:7px; transition:all .18s;
}
.tab-btn:hover { color:var(--text); border-color:var(--accent2); }
.tab-btn.active { background:var(--accent); color:var(--bg); border-color:var(--accent); font-weight:700; }
.limit-badge { font-size:8px; background:var(--accent3); color:#fff; border-radius:4px; padding:1px 5px; letter-spacing:.5px; }
.tab-btn.done-today .limit-badge { background:var(--muted2); }

/* ── FILTRE ── */
.filter-bar { display:flex; gap:6px; margin-bottom:20px; flex-wrap:wrap; align-items:center; }
.fbtn {
  background:var(--bg3); border:1px solid var(--border); border-radius:6px;
  padding:6px 14px; cursor:pointer; font-family:'Space Mono',monospace; font-size:12px;
  color:var(--muted); transition:all .15s; display:flex; align-items:center; gap:6px;
}
.fbtn:hover { color:var(--text); }
.fbtn.active { border-color:var(--accent); color:var(--accent); background:rgba(0,229,255,.05); }
.filter-count { margin-left:auto; font-size:10px; color:var(--muted); letter-spacing:1px; }

/* ── CHAIN GRID ── */
.chain-grid {
  display:grid; grid-template-columns:repeat(3, 1fr); gap:12px;
  width:97%; max-width:none; margin:0 auto; padding:0;
}
.ccard {
  background:var(--bg2); border:1px solid var(--border); border-radius:12px;
  padding:18px; transition:all .2s;
  display:flex; flex-direction:column; gap:12px; justify-content:space-between;
  min-height:120px; position:relative; overflow:hidden;
}
.ccard:hover  { border-color:var(--accent2); transform:translateY(-2px); box-shadow:0 8px 28px var(--shadow); }
.ccard.no-deploy { justify-content:flex-start; }
.ccard.sel    { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent); }
/* ── Corner ribbons ── */
.ccard-ribbon {
  position:absolute; top:0; left:0;
  width:64px; height:64px;
  overflow:hidden; pointer-events:none;
  border-radius:8px 0 0 0;
}
.ccard-ribbon.new::before {
  content:'NEW';
  position:absolute;
  top:14px; left:-18px;
  width:80px;
  text-align:center;
  font-size:9px; font-weight:800;
  letter-spacing:.8px;
  color:#fff;
  transform:rotate(-45deg);
  padding:3px 0;
  background:linear-gradient(135deg,#00c6ff,#0072ff);
  box-shadow:0 2px 6px rgba(0,114,255,.45);
}
.ccard-ribbon.tge::before {
  content:'TGE';
  position:absolute;
  top:14px; left:-18px;
  width:80px;
  text-align:center;
  font-size:9px; font-weight:800;
  letter-spacing:.8px;
  color:#fff;
  transform:rotate(-45deg);
  padding:3px 0;
  background:linear-gradient(135deg,#ff6b00,#ff0055);
  box-shadow:0 2px 6px rgba(255,0,85,.45);
}
.ccard-ribbon.hot::before {
  content:'HOT';
  position:absolute;
  top:14px; left:-18px;
  width:80px;
  text-align:center;
  font-size:9px; font-weight:800;
  letter-spacing:.8px;
  color:#fff;
  transform:rotate(-45deg);
  padding:3px 0;
  background:linear-gradient(135deg,#a855f7,#ec4899);
  box-shadow:0 2px 6px rgba(168,85,247,.45);
}
.ccard-top { display:flex; align-items:center; gap:8px; }
.cname     { font-family:'Syne',sans-serif; font-size:12px; font-weight:700; color:var(--text); display:flex; align-items:center; gap:8px; flex:1; min-width:0; flex-wrap:nowrap; overflow:hidden; white-space:nowrap; }
.cbadge    { font-size:9px; letter-spacing:1px; text-transform:uppercase; height:22px; line-height:22px; padding:0 7px; border-radius:4px; background:rgba(255,107,53,.1); color:var(--accent3); border:1px solid rgba(255,107,53,.22); }
.cbadge.mn { background:rgba(0,255,136,.07); color:var(--green); border-color:rgba(0,255,136,.18); }
.badge-new { display:inline-block; font-size:0.6rem; font-weight:800; letter-spacing:0.08em; text-transform:uppercase; background:#1a6bff22; color:#00c9ff; border:1px solid #1a6bff66; border-radius:4px; padding:1px 6px; margin-left:6px; vertical-align:middle; }
.cinfo     { font-size:12px; color:var(--muted); }
.cfee      { color:var(--muted2); font-size:10px; letter-spacing:.3px; }
.cfaucet   { color:var(--accent2); text-decoration:none; font-size:12px; opacity:.85; transition:opacity .15s; letter-spacing:.3px; white-space:nowrap; }
.cfaucet:hover { opacity:1; text-decoration:underline; }
.cbtns { display:flex; gap:7px; }
.cbtn  {
  flex:1; background:var(--bg3); border:1px solid var(--border); border-radius:6px;
  padding:8px 8px; cursor:pointer; font-family:'Space Mono',monospace; font-size:13px;
  color:var(--muted); text-align:center; transition:all .18s; letter-spacing:.3px;
}
.cbtn:hover      { color:var(--accent); border-color:var(--accent); background:rgba(0,229,255,.05); }
.cbtn.pri        { background:rgba(0,229,255,.08); color:var(--accent); border-color:rgba(0,229,255,.2); }
.cbtn.pri:hover  { background:rgba(0,229,255,.15); }
.cbtn.done       { background:var(--accent); color:var(--accent-text); border-color:var(--accent); cursor:default; font-weight:700; }
.cbtn.done:hover { background:var(--accent); color:var(--accent-text); border-color:var(--accent); transform:none; box-shadow:none; }
.ccard-foot      { display:flex; justify-content:space-between; align-items:center; }
/* Ensure ribbon positioning anchor (already set on .ccard above) */
.ccard { position:relative; overflow:hidden; }

/* ── TOAST ── */
.cg-toast {
  position:fixed; top:80px; left:50%; transform:translateX(-50%);
  background:#e05555; border:none; border-radius:10px;
  padding:11px 20px; font-size:12px; color:#fff; font-weight:700; white-space:nowrap;
  box-shadow:0 6px 24px rgba(224,85,85,.35); z-index:9999;
  animation:cg-toast-in .18s ease, cg-toast-out .3s ease 2.7s forwards;
}
@keyframes cg-toast-in  { from{opacity:0;transform:translateX(-50%) translateY(-8px)} to{opacity:1;transform:translateX(-50%)} }
@keyframes cg-toast-out { to{opacity:0;transform:translateX(-50%) translateY(-8px)} }
.cbtn.sw-btn     { flex:0 0 auto; height:20px; width:24px; line-height:20px; font-size:11px; padding:0; display:inline-flex; align-items:center; justify-content:center; border-radius:4px; }

/* ── LOG ── */
.log-panel  { background:var(--bg2); border:1px solid var(--border); border-radius:12px; margin-top:28px; overflow:hidden; }
.log-head   { padding:10px 16px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; gap:10px; }
.log-tabs   { display:flex; gap:4px; }
.log-tab    { background:none; border:none; color:var(--muted); font-family:'Space Mono',monospace; font-size:11px;
              cursor:pointer; padding:5px 12px; border-radius:6px; transition:all .15s; letter-spacing:.5px; }
.log-tab:hover  { color:var(--text); background:var(--bg3); }
.log-tab.active { background:var(--bg3); color:var(--accent); border:1px solid var(--border); }
.log-days   { font-size:9px; color:var(--muted2); margin-left:3px; }
.log-clr    { background:none; border:none; color:var(--muted); font-family:'Space Mono',monospace; font-size:10px; cursor:pointer; margin-left:auto; }
.log-clr:hover { color:var(--red); }
.tx-log-pane { padding:10px 20px; max-height:260px; overflow-y:auto; font-size:12px; }
.tx-log-pane::-webkit-scrollbar       { width:3px; }
.tx-log-pane::-webkit-scrollbar-thumb { background:var(--border); }
.log-date-sep { font-size:9px; text-transform:uppercase; letter-spacing:2px; color:var(--muted2);
                padding:8px 0 4px; border-bottom:1px solid var(--border); margin-bottom:4px; }
.hash-copy:hover { color:var(--accent); }
.le  { padding:5px 0; border-bottom:1px solid rgba(128,128,128,.05); display:flex; gap:10px; align-items:flex-start; animation:fi .22s ease; }
.lt  { color:var(--muted); flex-shrink:0; width:58px; }
.lk  { flex-shrink:0; width:72px; }
.lk.info    { color:var(--accent); }
.lk.success { color:var(--green); }
.lk.error   { color:var(--red); }
.lk.pending { color:var(--accent3); }
.lm  { color:var(--text); word-break:break-all; flex:1; line-height:1.7; }
.lm a        { color:var(--accent); text-decoration:none; }
.lm a:hover  { text-decoration:underline; }
@keyframes fi { from{opacity:0;transform:translateX(-4px)} to{opacity:1;transform:none} }

/* ── MODALS ── */
.ov { display:none; position:fixed; inset:0; z-index:200; background:rgba(5,8,16,.88); backdrop-filter:blur(8px); align-items:center; justify-content:center; }
[data-theme="light"] .ov { background:rgba(220,230,248,.85); }
.ov.show { display:flex; }
@keyframes su { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:none} }

/* Modal wallet */
.wmod       { background:var(--bg2); border:1px solid var(--border); border-radius:16px; padding:28px; width:90%; max-width:390px; animation:su .2s ease; position:relative; }
.wmod-title { font-family:'Syne',sans-serif; font-size:20px; font-weight:800; color:var(--text); margin-bottom:4px; }
.wmod-sub   { font-size:11px; color:var(--muted); margin-bottom:22px; }
.wmod-close { position:absolute; top:16px; right:16px; background:none; border:none; color:var(--muted); font-size:19px; cursor:pointer; }
.wmod-close:hover { color:var(--text); }
.wlist { display:flex; flex-direction:column; gap:10px; }
.wi {
  background:var(--bg3); border:1px solid var(--border); border-radius:10px;
  padding:13px 16px; cursor:pointer; display:flex; align-items:center; gap:13px;
  transition:all .16s; color:var(--text); font-family:'Space Mono',monospace;
}
.wi:hover   { border-color:var(--accent); background:rgba(0,229,255,.04); transform:translateX(2px); }
.wi.wactive { border-color:var(--green); background:rgba(0,255,136,.04); }
.wicon { width:38px; height:38px; border-radius:10px; background:rgba(128,128,128,.08); display:flex; align-items:center; justify-content:center; font-size:20px; flex-shrink:0; overflow:hidden; }
.wicon img { width:26px; height:26px; border-radius:5px; object-fit:contain; }
.wbody  { flex:1; min-width:0; }
.wname  { font-size:13px; font-weight:700; color:var(--text); }
.wtag   { font-size:10px; color:var(--muted); margin-top:2px; }
.warr   { color:var(--muted); font-size:14px; transition:transform .18s; }
.wi:hover .warr { transform:translateX(3px); color:var(--accent); }

/* Modal action (Send Tx) */
.amod       { background:var(--bg2); border:1px solid var(--border); border-radius:16px; padding:28px; width:90%; max-width:420px; position:relative; animation:su .2s ease; }
.amod-title { font-family:'Syne',sans-serif; font-size:19px; font-weight:800; color:var(--text); margin-bottom:6px; }
.amod-sub   { font-size:11px; color:var(--muted); margin-bottom:22px; line-height:1.7; }
.amod-close { position:absolute; top:15px; right:15px; background:none; border:none; color:var(--muted); font-size:18px; cursor:pointer; }
.amod-close:hover { color:var(--text); }
.ig    { margin-bottom:14px; }
.il    { display:block; font-size:10px; text-transform:uppercase; letter-spacing:2px; color:var(--muted); margin-bottom:7px; }
.ifield {
  width:100%; background:var(--bg3); border:1px solid var(--border); border-radius:8px;
  padding:10px 13px; color:var(--text); font-family:'Space Mono',monospace; font-size:12px; transition:border-color .18s;
}
.ifield:focus        { outline:none; border-color:var(--accent); }
.ifield::placeholder { color:var(--muted); }
.brow { display:flex; gap:8px; margin-top:18px; }
.send-msg-row { display:flex; gap:8px; }
.send-msg-opt { display:flex; align-items:center; gap:6px; cursor:pointer; padding:7px 14px; border-radius:7px; border:1px solid var(--border); background:var(--bg3); font-size:12px; color:var(--muted); transition:all .15s; user-select:none; flex:1; justify-content:center; }
.send-msg-opt:has(input:checked) { border-color:var(--accent); color:var(--accent); background:rgba(0,229,255,.06); }
.send-msg-opt input[type="radio"] { display:none; }
.send-bal-label { font-size:11px; color:var(--muted); letter-spacing:.3px; }
.btn  { display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:10px 22px; border-radius:7px; border:none; cursor:pointer; font-family:'Space Mono',monospace; font-size:11px; font-weight:700; letter-spacing:.8px; text-transform:uppercase; transition:all .18s; }
.btn-p { background:var(--accent); color:var(--bg); box-shadow:0 0 16px rgba(0,229,255,.2); }
.btn-p:hover { box-shadow:0 0 28px rgba(0,229,255,.42); transform:translateY(-1px); }
.btn-g { background:transparent; color:var(--muted); border:1px solid var(--border); }
.btn-g:hover { color:var(--text); border-color:var(--muted); }

/* ── SUCCESS MODAL ── */
.smod       { background:var(--bg2); border:1px solid var(--border2); border-radius:18px; padding:32px 28px 24px; width:92%; max-width:520px; position:relative; animation:su .22s cubic-bezier(.34,1.3,.64,1); display:flex; flex-direction:column; align-items:stretch; }
.smod-icon  { font-size:44px; text-align:center; margin-bottom:14px; line-height:1; }
.smod-title { font-family:'Syne',sans-serif; font-size:19px; font-weight:800; color:var(--accent); text-align:center; margin-bottom:6px; line-height:1.35; }
.smod-divider { height:1px; background:var(--border); margin:0 -28px 20px; }
.smod-preview {
  width:100%; height:auto; border-radius:10px;
  display:block; margin-bottom:16px;
  border:1px solid var(--border);
}
.smod-confirmed {
  text-align:center; font-size:11px; font-weight:700; letter-spacing:1px;
  color:var(--green); background:rgba(0,255,136,.08); border:1px solid rgba(0,255,136,.2);
  border-radius:20px; padding:4px 14px; display:inline-block;
  margin:0 auto 14px; width:auto; align-self:center;
}
.smod-tx    { background:var(--bg3); border:1px solid var(--border); border-radius:10px; padding:12px 16px; margin-bottom:20px; }
.smod-tx-label { font-size:9px; text-transform:uppercase; letter-spacing:2px; color:var(--muted); margin-bottom:8px; }
.smod-tx-row   { display:flex; align-items:center; gap:10px; }
.smod-tx-hash  { font-size:13px; color:var(--accent); word-break:break-all; line-height:1.5; flex:1; }
.smod-tx-hash a        { color:var(--accent); text-decoration:none; }
.smod-tx-hash a:hover  { text-decoration:underline; }
.smod-btn-copy {
  flex-shrink:0; background:var(--bg2); border:1px solid var(--border);
  border-radius:6px; padding:4px 10px; font-family:'Space Mono',monospace;
  font-size:11px; color:var(--muted); cursor:pointer; transition:all .15s;
  white-space:nowrap;
}
.smod-btn-copy:hover  { color:var(--accent); border-color:var(--accent); }
.smod-btn-copy.copied { color:var(--green);  border-color:var(--green);  background:rgba(0,255,136,.08); }
.smod-btns { display:flex; flex-direction:column; gap:9px; }
.smod-btn-exp {
  background:transparent; color:var(--accent); border:1px solid var(--accent);
  border-radius:8px; padding:10px 18px; font-family:'Space Mono',monospace; font-size:11px;
  font-weight:700; cursor:pointer; letter-spacing:.6px; text-transform:uppercase;
  transition:all .17s; display:flex; align-items:center; justify-content:center; gap:7px; text-decoration:none;
}
.smod-btn-exp:hover { background:rgba(0,229,255,.07); transform:translateY(-1px); }
[data-theme="light"] .smod-btn-exp { color:var(--accent); border-color:var(--accent); }
.smod-btn-share {
  background:#000; color:#fff; border:none; border-radius:8px;
  padding:10px 18px; font-family:'Space Mono',monospace; font-size:11px; font-weight:700;
  cursor:pointer; letter-spacing:.6px; text-transform:uppercase; transition:all .17s;
  display:flex; align-items:center; justify-content:center; gap:7px;
}
.smod-btn-share:hover { background:#1a1a1a; transform:translateY(-1px); }
[data-theme="light"] .smod-btn-share       { background:#111; }
[data-theme="light"] .smod-btn-share:hover { background:#333; }
.smod-btn-card {
  display:block; width:100%; padding:11px; border-radius:10px; border:1px solid rgba(201,169,110,0.35);
  background:rgba(201,169,110,0.07); color:var(--accent);
  font-family:'Space Mono',monospace; font-size:13px; font-weight:700;
  cursor:pointer; transition:all .18s; text-align:center; letter-spacing:.4px;
}
.smod-btn-card:hover    { background:rgba(201,169,110,0.14); border-color:var(--accent); transform:translateY(-1px); }
.smod-btn-card:disabled { opacity:.5; cursor:default; transform:none; }
.smod-btn-close {
  background:transparent; color:var(--muted); border:1px solid var(--border);
  border-radius:8px; padding:9px 18px; font-family:'Space Mono',monospace; font-size:11px;
  cursor:pointer; letter-spacing:.6px; text-transform:uppercase; transition:all .17s;
  display:flex; align-items:center; justify-content:center;
}
.smod-btn-close:hover { color:var(--text); border-color:var(--muted); }
.smod-close-x {
  position:absolute; top:14px; right:14px; background:none; border:none;
  color:var(--muted); font-size:19px; cursor:pointer; line-height:1; padding:2px 5px; transition:color .15s;
}
.smod-close-x:hover { color:var(--text); }

/* ── RESPONSIVE ── */
@media(max-width:600px) {
  nav { padding:0 14px; }
  .wrap { padding:28px 12px 60px; }
  .chain-grid { grid-template-columns:repeat(3, 1fr); width:100%; }
  .acct-drop  { right:12px; width:calc(100vw - 24px); }
}

@media(max-width:768px) {
  a.nav-link:not(.nav-back) { display:none; }
}

@media(max-width:480px) {
  .tab-btn { padding:8px 10px; font-size:13px; }
  .footer-nav { gap:4px; }
  .footer-nav-link { padding:4px 8px; font-size:10px; letter-spacing:0; }
}

/* ── FOOTER ── */
.footer-nav {
  display:flex; gap:8px; flex-wrap:wrap; justify-content:center;
}
.footer-nav-link {
  font-family:'Space Mono',monospace; font-size:11px;
  color:var(--muted); text-decoration:none; letter-spacing:.3px;
  padding:6px 12px; border-radius:7px; border:1px solid var(--border);
  transition:color .18s, border-color .18s;
}
.footer-nav-link:hover { color:var(--accent); border-color:var(--accent2); }

.site-footer {
  margin-top:44px; padding:24px 20px 16px;
  text-align:center; border-top:1px solid var(--border);
  display:flex; flex-direction:column; align-items:center; gap:10px;
}
.footer-main {
  font-size:13px; color:var(--muted); letter-spacing:.3px;
}
.footer-disclaimer {
  font-size:12px; color:#fff; line-height:1.75;
  max-width:620px; width:100%;
  background:rgba(180,40,40,.82); border:2px solid rgba(220,60,60,.7);
  border-radius:10px; padding:12px 22px;
  font-weight:700; letter-spacing:.2px;
  box-shadow:0 0 18px rgba(200,40,40,.25);
}
[data-theme="light"] .footer-disclaimer {
  background:rgba(180,40,40,.88); border-color:rgba(200,60,60,.8);
  color:#fff;
}
.footer-contact {
  font-size:13px; color:var(--muted); font-family:'Space Mono', monospace;
}
.footer-x {
  color:var(--accent); text-decoration:none; font-weight:700;
  font-family:'Space Mono', monospace; font-size:13px; letter-spacing:.3px;
  font-style:normal;
}
.footer-x:hover { text-decoration:underline; opacity:.85; }
.footer-handle {
  font-family:'Space Mono', monospace; font-style:normal; font-weight:700;
  font-variant-ligatures:none; -webkit-font-smoothing:antialiased;
}

/* ── NAV MORE DROPDOWN ── */
.nav-more { position: relative; display: inline-flex; align-items: center; }
.nav-more-btn { background: none; border: none; color: var(--text); font-size: 18px; cursor: pointer; padding: 4px 8px; opacity: .7; transition: opacity .2s; }
.nav-more-btn:hover { opacity: 1; }
.nav-more-drop { display: none; position: absolute; top: calc(100% + 8px); right: 0; background: var(--bg2); border: 1px solid var(--border); border-radius: 8px; padding: 6px; min-width: 130px; z-index: 999; flex-direction: column; gap: 2px; }
.nav-more:hover .nav-more-drop,
.nav-more-btn:focus + .nav-more-drop { display: flex; }
.nav-more-drop .nav-link { display: block; padding: 6px 10px; border-radius: 6px; }
.nav-more-drop .nav-link:hover { background: var(--bg3); }

/* ══════════════════════════════════════════════
   DEPLOY FEATURE
   ══════════════════════════════════════════ */

/* ── GM/GN buttons ── */
.cbtn.gm:not(.done) {
  background: rgba(var(--accent-rgb), 0.10);
  color: var(--accent);
  border-color: rgba(var(--accent-rgb), 0.28);
}
.cbtn.gm:not(.done):hover {
  background: rgba(var(--accent-rgb), 0.20);
  border-color: rgba(var(--accent-rgb), 0.50);
}
.cbtn.gn:not(.done) {
  background: rgba(var(--accent2-rgb), 0.10);
  color: var(--accent2);
  border-color: rgba(var(--accent2-rgb), 0.28);
}
.cbtn.gn:not(.done):hover {
  background: rgba(var(--accent2-rgb), 0.20);
  border-color: rgba(var(--accent2-rgb), 0.50);
}

/* ── Deploy row ── */
.deploy-row { margin-top: 5px; }
.deploy-row .cbtn {
  font-size: 11px;
  padding: 5px 4px;
  opacity: 0.65;
}
.deploy-row .cbtn:hover {
  opacity: 1;
  color: var(--accent);
  border-color: var(--accent);
  background: rgba(0, 229, 255, 0.05);
}

.deploy-modal {
  position: relative;
  background: var(--card-bg, #1a1a2e);
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: 16px;
  padding: 28px 24px 24px;
  width: 100%;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.deploy-modal-close {
  position: absolute;
  top: 14px; right: 16px;
  background: transparent;
  border: none;
  color: var(--muted, #888);
  font-size: 1rem;
  cursor: pointer;
}
.deploy-modal-title { font-weight: 700; font-size: 1.1rem; }
.deploy-modal-sub   { font-size: .82rem; color: var(--muted, #888); margin-top: -8px; }

.deploy-type-row { display: flex; gap: 8px; flex-wrap: wrap; }
.deploy-type-btn {
  padding: 6px 14px;
  border-radius: 8px;
  border: 1px solid var(--border, rgba(255,255,255,.08));
  background: transparent;
  color: var(--text, #eee);
  font-size: .82rem;
  cursor: pointer;
  transition: background .15s, border-color .15s, color .15s;
  font-family: inherit;
}
.deploy-type-btn:hover,
.deploy-type-btn.active {
  background: rgba(124, 92, 252, .15);
  border-color: #7c5cfc;
  color: #7c5cfc;
}
.deploy-gas-hint {
  font-size: .78rem;
  color: var(--muted, #888);
  font-family: var(--mono, monospace);
}
.deploy-args { flex-direction: column; gap: 8px; }
.deploy-input {
  padding: 9px 12px;
  border-radius: 8px;
  border: 1px solid var(--border, rgba(255,255,255,.08));
  background: var(--input-bg, rgba(0,0,0,.2));
  color: var(--text, #eee);
  font-size: .88rem;
  font-family: inherit;
  outline: none;
  transition: border-color .15s;
}
.deploy-input:focus { border-color: #7c5cfc; }
.deploy-modal-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 4px;
}
.deploy-cancel-btn {
  padding: 8px 16px;
  border-radius: 8px;
  border: 1px solid var(--border, rgba(255,255,255,.08));
  background: transparent;
  color: var(--muted, #888);
  cursor: pointer;
  font-family: inherit;
  font-size: .88rem;
}
.deploy-confirm-btn {
  padding: 8px 20px;
  border-radius: 8px;
  border: none;
  background: linear-gradient(135deg, #7c5cfc, #5c8afc);
  color: #fff;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
  font-size: .88rem;
  transition: opacity .15s;
}
.deploy-confirm-btn:hover { opacity: .85; }
.deploy-info-box {
  background: var(--card-bg-alt, rgba(255,255,255,0.05));
  border: 1px solid var(--border, rgba(255,255,255,0.1));
  border-radius: 8px;
  padding: 12px 16px;
  font-size: 13px;
  color: var(--text-muted, #aaa);
  margin: 8px 0 16px 0;
  line-height: 1.6;
}
.deploy-info-box strong { color: var(--accent, #00ff88); }

/* ── X Follow popup ── */
.xfollow-modal {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 32px 28px 24px;
  width: 90%;
  max-width: 440px;
  text-align: center;
  animation: su .25s ease;
  position: relative;
}
.xfollow-close {
  position: absolute;
  top: 12px; right: 14px;
  background: none; border: none;
  color: var(--muted); font-size: 16px;
  cursor: pointer; line-height: 1;
}
.xfollow-close:hover { color: var(--text); }
.xfollow-logo {
  font-size: 2rem;
  font-weight: 900;
  color: var(--text);
  margin-bottom: 12px;
  font-family: 'Syne', sans-serif;
}
.xfollow-title {
  font-family: 'Syne', sans-serif;
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--text);
  margin-bottom: 8px;
}
.xfollow-sub {
  font-size: 0.82rem;
  color: var(--muted);
  margin-bottom: 22px;
  line-height: 1.5;
}
.xfollow-btn {
  display: block;
  background: var(--text);
  color: var(--bg);
  text-decoration: none;
  font-weight: 800;
  font-size: 0.9rem;
  padding: 12px 20px;
  border-radius: 50px;
  margin-bottom: 12px;
  transition: opacity .15s;
}
.xfollow-btn:hover { opacity: 0.85; }
.xfollow-skip {
  background: none;
  border: none;
  color: var(--muted);
  font-size: 0.78rem;
  cursor: pointer;
  text-decoration: underline;
}
.xfollow-skip:hover { color: var(--text); }
