:root{
  --bg: #f8f8f8;
  --grid-line: rgba(0,0,0,0.06);
  --ink:#000;
  --muted: rgba(0,0,0,0.65);
  --border:#8f8f8f;
  --card:#fff;
  --panel:#f6f6f6;
  --green:#2e9e5b;
  --red:#d9534f;
  --blue:#3576d1;
}
html.dark, html[data-theme="dark"]{
  --bg:#111;
  --grid-line: rgba(255,255,255,0.08);
  --ink:#fff;
  --muted: rgba(255,255,255,0.5);
  --border:#444;
  --card:#1b1b1b;
  --panel:#1e1e1e;
}
html[data-theme="terminal"]{
  --bg:#000;
  --grid-line: rgba(51,255,119,0.08);
  --ink:#33ff77;
  --muted: rgba(51,255,119,0.5);
  --border:#1f3d29;
  --card:#050505;
  --panel:#0b0f0b;
  --green:#33ff77;
  --red:#ff4444;
  --blue:#33aaff;
}
html[data-theme="terminal"] body{ font-family:'Courier New', monospace; }
html:not([data-theme]) body{ font-family:'Courier New', monospace; }
html:not([data-theme]) .group input,
html:not([data-theme]) .group select,
html:not([data-theme]) .head__logo,
html:not([data-theme]) .rate-line,
html:not([data-theme]) .updated,
html:not([data-theme]) .stats,
html:not([data-theme]) .timeframes button,
html:not([data-theme]) footer{ font-weight:700; }
html:not([data-theme]) .group{ border-width:2.5px; }
html:not([data-theme]) .group select{ border-left-width:2.5px; }
html[data-theme="navy"]{
  --bg:#0b1a33;
  --grid-line: rgba(255,255,255,0.05);
  --ink:#e8eef7;
  --muted: rgba(232,238,247,0.55);
  --border:#24406b;
  --card:#0f2447;
  --panel:#122a52;
  --green:#39c98f;
  --red:#ff6b6b;
  --blue:#5b9dff;
}
html[data-theme="sepia"]{
  --bg:#f2e8d5;
  --grid-line: rgba(90,60,20,0.08);
  --ink:#3a2c17;
  --muted: rgba(58,44,23,0.55);
  --border:#c9b58f;
  --card:#faf3e4;
  --panel:#ece0c6;
  --green:#4c7a3d;
  --red:#a8442f;
  --blue:#3d6ea5;
}
*{box-sizing:border-box;}
body{
  margin:0;
  min-height:100vh;
  font-family:'Nunito Sans','Lucida Grande','Lucida Sans Unicode',sans-serif;
  color:var(--ink);
  background-color:var(--bg);
  background-image:
    linear-gradient(var(--grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
  background-size:22px 22px;
  transition: background-color .3s, color .3s;
}
header{
  display:flex; align-items:center; justify-content:space-between;
  max-width:900px; margin:0 auto;
  padding:24px 20px 0;
}
.head__logo{
  font-size:26px; font-weight:300; letter-spacing:1px;
  background:var(--panel); border:1px solid var(--border); border-radius:4px;
  padding:4px 10px; text-decoration:none; color:var(--ink);
}
.head__title{
  font-size:24px; font-weight:400; margin:0;
}
.head__icons{ display:flex; gap:10px; align-items:center; }
.icon-btn{
  width:44px; height:44px; border-radius:50%;
  border:1px solid transparent; background:transparent; color:var(--ink);
  cursor:pointer; font-size:19px; display:flex; align-items:center; justify-content:center;
}
.icon-btn:hover{ background:var(--panel); }

main{ max-width:900px; margin:0 auto; padding:0 20px 60px; }

.page-intro{ max-width:640px; margin:32px auto 0; padding:0 20px; text-align:center; }
.page-intro h1{ font-size:19px; font-weight:400; margin:0 0 6px; color:var(--ink); }
.page-intro p{ font-size:13px; color:var(--muted); margin:0; line-height:1.6; font-weight:600; }

.converter-grid{
  display:flex; align-items:stretch; justify-content:center; flex-wrap:wrap;
  gap:16px; margin:56px 0 8px;
}
.group{
  display:flex; align-items:stretch;
  border:2px solid var(--border); border-radius:8px;
  background:var(--card); overflow:hidden;
}
.group input, .group select{
  font-family:inherit; font-weight:200; font-size:56px;
  color:var(--ink); background:transparent; border:none; outline:none;
  padding:6px 12px; text-align:center; box-sizing:border-box; min-width:0;
}
.group input{
  width:190px; min-width:0;
}
.group input[readonly]{ color:var(--muted); font-weight:400; }
@keyframes flashUp{ 0%{ background-color: rgba(46,158,91,0.35); } 100%{ background-color: transparent; } }
@keyframes flashDown{ 0%{ background-color: rgba(217,83,79,0.35); } 100%{ background-color: transparent; } }
.group.flash-up{ animation: flashUp .7s ease-out; }
.group.flash-down{ animation: flashDown .7s ease-out; }
.group select{
  width:150px; border-left:2px solid var(--border);
  -webkit-appearance:none; appearance:none; cursor:pointer;
  background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: calc(100% - 18px) 58%, calc(100% - 12px) 58%;
  background-size: 6px 6px, 6px 6px;
  background-repeat:no-repeat;
  font-size:36px;
}
.divider-bar{
  align-self:stretch;
  width:2px; flex:0 0 auto;
  background:linear-gradient(transparent, var(--border) 50%, transparent);
}
.swap-btn{
  align-self:center; flex:0 0 auto;
  width:36px; height:36px; border-radius:50%;
  border:1px solid var(--border); background:var(--card); color:var(--ink);
  cursor:pointer; font-size:16px; display:flex; align-items:center; justify-content:center;
  transition: transform .2s;
}
.swap-btn:hover{ background:var(--panel); }
.swap-btn:active{ transform: rotate(180deg); }

.chart-section{ margin-top:44px; }
.chart-wrap{ position:relative; height:180px; }
.chart-wrap canvas{ width:100%; height:100%; display:block; }
.chart-empty{
  display:flex; align-items:center; justify-content:center; height:180px;
  color:var(--muted); font-size:14px; text-align:center;
}

.chart-controls{
  display:flex; align-items:center; justify-content:center; gap:18px;
  flex-wrap:wrap; margin-top:14px; font-size:14px; color:var(--muted);
}
.timeframes{ display:flex; gap:4px; }
.timeframes button{
  font-family:inherit; font-size:13px; color:var(--muted);
  background:transparent; border:none; padding:6px 9px; border-radius:6px; cursor:pointer;
}
.timeframes button.active{ background:var(--panel); color:var(--ink); font-weight:700; }
.stats{ display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
.stats .change.up{ color:var(--green); }
.stats .change.down{ color:var(--red); }

.rate-line{
  text-align:center; margin-top:26px; font-size:14px; color:var(--muted);
}
.updated{ text-align:center; font-size:12px; color:var(--muted); margin-top:4px; }

.faq-section{ max-width:640px; margin:56px auto 0; padding:14px 20px 0; border-top:1px solid var(--grid-line); }
.faq-heading{ font-size:10px; letter-spacing:0.06em; text-transform:uppercase; color:var(--muted); opacity:0.6; margin:0 0 4px; font-weight:400; }
.faq-item{ border-top:1px solid var(--grid-line); }
.faq-item:first-of-type{ border-top:none; }
.faq-item summary{
  padding:7px 0; font-size:12px; color:var(--muted); cursor:pointer;
  list-style:none; display:flex; align-items:baseline; gap:6px; opacity:0.75;
}
.faq-item summary:hover{ opacity:1; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::before{ content:'+'; flex:0 0 auto; }
.faq-item[open] summary::before{ content:'\2013'; }
.faq-item[open] summary{ opacity:1; }
.faq-item p{ font-size:12px; color:var(--muted); line-height:1.6; margin:0 0 12px; padding-left:16px; }

.internal-links{ max-width:640px; margin:20px auto 0; padding:0 20px; text-align:center; font-size:12px; color:var(--muted); }
.internal-links a{ color:var(--muted); text-decoration:none; margin:0 6px; white-space:nowrap; }
.internal-links a:hover{ text-decoration:underline; color:var(--ink); }

footer{
  max-width:900px; margin:50px auto 0; padding:0 20px;
  text-align:center; color:var(--muted); font-size:12px; line-height:1.7;
}

@media (max-width:640px){
  .converter-grid{ flex-direction:column; align-items:center; margin:36px 0 8px; }
  .group{ width:100%; max-width:340px; }
  .group input, .group select{ padding:10px 8px; }
  .group input{ width:60%; }
  .group select{ width:40%; font-size:20px; }
  .swap-btn{ transform:rotate(90deg); }
  .swap-btn:active{ transform:rotate(270deg); }
  .head__title{ font-size:18px; }
  .icon-btn{ width:36px; height:36px; font-size:16px; }
  #langToggle{ font-size:12px !important; }
}

.info-overlay{
  display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5);
  align-items:center; justify-content:center; padding:20px; z-index:100;
}
.info-overlay.open{ display:flex; }
.info-modal{
  position:relative; width:100%; max-width:520px; max-height:82vh; overflow-y:auto;
  background:var(--card); border:2px solid var(--border); border-radius:10px;
  padding:32px 28px; color:var(--ink);
}
.info-close{
  position:absolute; top:14px; right:14px;
  width:32px; height:32px; border-radius:50%; border:1px solid var(--border);
  background:transparent; color:var(--ink); font-size:16px; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.info-close:hover{ background:var(--panel); }
.info-modal h2{ margin:0 0 16px; font-size:22px; font-weight:600; }
.info-modal h3{ margin:22px 0 8px; font-size:15px; font-weight:700; }
.info-modal p, .info-modal li{ margin:0 0 10px; font-size:14px; line-height:1.6; color:var(--muted); }
.info-modal ul{ margin:0 0 10px; padding-left:20px; }
.info-modal a{ color:var(--ink); }
.info-modal strong{ color:var(--ink); }

.donate-row{
  display:flex; flex-direction:column; gap:8px;
  padding:16px 0; border-top:1px solid var(--border);
}
.donate-row:first-of-type{ margin-top:6px; }
.donate-label{ font-size:14px; font-weight:700; color:var(--ink); }
.donate-net{ font-weight:400; color:var(--muted); }
.donate-addr-row{ display:flex; align-items:center; gap:8px; }
.donate-addr{
  flex:1; min-width:0;
  font-size:12px; color:var(--muted); word-break:break-all;
  background:var(--panel); border:1px solid var(--border); border-radius:6px; padding:6px 8px;
}
.donate-copy, .donate-qr-btn{
  flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
  font-family:inherit; font-size:12px; font-weight:700;
  padding:8px; min-width:32px; height:32px; box-sizing:border-box;
  border-radius:6px; border:1px solid var(--border);
  background:var(--card); color:var(--ink); cursor:pointer;
}
.donate-copy svg, .donate-qr-btn svg{ display:block; flex:0 0 auto; }
.donate-copy:hover, .donate-qr-btn:hover{ background:var(--panel); }
.donate-copy.copied{ background:var(--green); color:#fff; border-color:var(--green); padding:6px 12px; width:auto; }
.donate-qr-btn.active{ background:var(--ink); color:var(--card); border-color:var(--ink); }
.donate-qr-panel{
  display:flex; flex-direction:column; align-items:center; gap:12px;
  padding:18px; margin-top:2px;
  border:1px solid var(--border); border-radius:12px; background:var(--panel);
}
.donate-qr-panel[hidden]{ display:none; }
.donate-qr{ width:160px; height:160px; border-radius:8px; border:1px solid var(--border); background:#fff; }
.donate-qr-addr{ font-size:12px; color:var(--muted); text-align:center; word-break:break-all; max-width:280px; }
.donate-qr-actions{ display:flex; flex-direction:column; gap:8px; width:100%; max-width:280px; }
.donate-qr-copy{
  display:flex; align-items:center; justify-content:center; gap:6px;
  padding:10px 14px; border-radius:8px; border:1px solid var(--border);
  background:var(--card); color:var(--ink); font-family:inherit;
  font-size:13px; font-weight:600; cursor:pointer; text-decoration:none; box-sizing:border-box;
}
.donate-qr-copy svg{ display:block; flex:0 0 auto; }
.donate-qr-copy:hover{ background:var(--card); filter:brightness(0.95); }
.donate-qr-copy.copied{ background:var(--green); color:#fff; border-color:var(--green); }
@media (max-width:640px){
  .donate-addr-row{ flex-wrap:wrap; }
  .donate-addr{ width:100%; }
}

.install-banner{
  position:fixed; left:16px; right:16px; bottom:16px; z-index:90;
  max-width:560px; margin:0 auto;
  display:flex; align-items:center; flex-wrap:wrap; gap:10px 12px;
  background:var(--card); border:1px solid var(--border); border-radius:12px;
  padding:14px 14px 14px 16px; box-shadow:0 8px 28px rgba(0,0,0,0.18);
  transform:translateY(130%); opacity:0;
  transition:transform .35s ease, opacity .35s ease;
}
.install-banner.show{ transform:translateY(0); opacity:1; }
.install-banner__body{
  display:flex; align-items:center; gap:12px;
  flex:1 1 240px; min-width:0;
}
.install-banner__icon{
  flex:0 0 auto; width:34px; height:34px; border-radius:50%;
  background:var(--panel); color:var(--ink);
  display:flex; align-items:center; justify-content:center;
}
.install-banner__text{ flex:1 1 auto; min-width:0; font-size:13px; line-height:1.5; color:var(--ink); }
.install-banner__actions{ flex:0 0 auto; display:flex; align-items:center; gap:8px; margin-left:auto; }
.install-banner__btn{
  font-family:inherit; font-size:13px; font-weight:700; white-space:nowrap;
  padding:9px 16px; border-radius:8px; border:1px solid var(--blue);
  background:var(--blue); color:#fff; cursor:pointer;
}
.install-banner__btn:hover{ filter:brightness(1.08); }
.install-banner__close{
  flex:0 0 auto; width:28px; height:28px; border-radius:50%;
  border:1px solid transparent; background:transparent; color:var(--muted);
  font-size:16px; line-height:1; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.install-banner__close:hover{ background:var(--panel); color:var(--ink); }
@media (max-width:640px){
  .install-banner{ left:10px; right:10px; bottom:10px; padding:12px; }
  .install-banner__text{ font-size:12.5px; }
}

.accel-card{ max-width:480px; margin:24px auto 0; padding:24px 20px; border:1px solid var(--border); border-radius:8px; background:var(--card); text-align:center; }
.accel-card input{ width:100%; box-sizing:border-box; font-family:inherit; font-size:16px; padding:10px 12px; border:1px solid var(--border); border-radius:6px; background:transparent; color:var(--ink); margin-bottom:10px; }
.accel-card input:focus{ outline:none; border-color:var(--green); }
.accel-btn{ width:100%; font-family:inherit; font-size:14px; font-weight:700; padding:11px 12px; border:none; border-radius:6px; background:var(--green); color:#fff; cursor:pointer; }
.accel-btn:hover{ filter:brightness(0.95); }
.accel-btn:disabled{ opacity:0.6; cursor:default; }
.accel-status{ margin-top:14px; font-size:13px; color:var(--muted); text-align:left; line-height:1.6; min-height:0; font-weight:600; }
.accel-status .ok{ color:var(--green); font-weight:700; }
.accel-status .err{ color:#e0524b; font-weight:700; }
.accel-relays{ list-style:none; margin:8px 0 0; padding:0; }
.accel-relays li{ padding:6px 0; border-top:1px solid var(--border); display:flex; justify-content:space-between; gap:8px; font-size:12px; }
.accel-relays li:first-child{ border-top:none; }
.accel-note{ max-width:640px; margin:32px auto 0; padding:0 20px; font-size:12px; color:var(--muted); line-height:1.6; text-align:center; }
.accel-alt{ max-width:480px; margin:18px auto 0; padding:0 20px; display:flex; gap:8px; justify-content:center; flex-wrap:wrap; }
.accel-alt a{ font-size:12px; color:var(--muted); text-decoration:none; border:1px solid var(--border); border-radius:20px; padding:6px 12px; }
.accel-alt a:hover{ color:var(--ink); border-color:var(--ink); }
.accel-spin{ display:inline-block; width:12px; height:12px; border:2px solid var(--border); border-top-color:var(--green); border-radius:50%; animation:accelSpin .7s linear infinite; vertical-align:-2px; margin-right:6px; }
@keyframes accelSpin{ to{ transform:rotate(360deg); } }
.accel-counter{ max-width:344px; margin:20px auto 0; border:2px solid var(--border); border-radius:8px; background:var(--card); padding:14px 20px; text-align:center; }
.accel-counter-label{ font-size:13px; color:var(--muted); font-weight:600; margin-bottom:4px; }
.accel-counter-num{ font-size:32px; font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; }
.home-h1{font-size:14px;font-weight:600;text-align:center;opacity:.6;margin:0 0 10px;letter-spacing:.2px;}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

.fee-card{ max-width:480px; margin:20px auto 0; padding:16px 20px; border:1px solid var(--border); border-radius:8px; background:var(--card); text-align:center; }
.fee-tiers{ margin-top:8px; }
.fee-tier{ margin:10px 0; }
.fee-tier-label{ font-size:13px; color:var(--muted); font-weight:700; margin-bottom:2px; }
.fee-tier-val{ font-size:16px; font-weight:700; color:var(--ink); }

.news-list{ max-width:640px; margin:16px auto 0; padding:0 20px; display:flex; flex-direction:column; gap:10px; }
.news-item{ display:block; padding:12px 16px; border:1px solid var(--border); border-radius:10px; background:var(--card); text-decoration:none; transition:border-color .15s; }
.news-item:hover{ border-color:var(--blue); }
.news-item-title{ display:block; font-size:14px; font-weight:700; color:var(--ink); line-height:1.4; }
.news-item-meta{ display:block; margin-top:4px; font-size:12px; color:var(--muted); font-weight:600; }
.news-loading{ text-align:center; padding:20px; color:var(--muted); font-size:14px; }

.news-item{ border-left:3px solid var(--border); }
.news-src-dot{ display:inline-block; width:7px; height:7px; border-radius:50%; margin-right:6px; vertical-align:middle; background:var(--muted); }
.news-item[data-src="CoinDesk"]{ border-left-color:#f7931a; }
.news-item[data-src="CoinDesk"] .news-src-dot{ background:#f7931a; }
.news-item[data-src="Cointelegraph"]{ border-left-color:#6366f1; }
.news-item[data-src="Cointelegraph"] .news-src-dot{ background:#6366f1; }
.news-item[data-src="ForkLog"]{ border-left-color:#14b8a6; }
.news-item[data-src="ForkLog"] .news-src-dot{ background:#14b8a6; }
.news-item[data-src="Investing.com"]{ border-left-color:#0ea5e9; }
.news-item[data-src="Investing.com"] .news-src-dot{ background:#0ea5e9; }

.wallet-input-wrap{max-width:640px;margin:20px auto 0;padding:0 20px;}
.wallet-input{width:100%;box-sizing:border-box;padding:14px 16px;font-size:15px;border-radius:14px;border:2px solid #000;background:var(--panel);color:inherit;font-family:inherit;}
.wallet-input:focus{outline:none;border-color:#3b82f6;}
.wallet-type-badge{margin-top:8px;font-size:12px;font-weight:700;color:var(--muted);}
.wallet-type-badge.btc{color:#f7931a;}
.wallet-type-badge.eth{color:#627eea;}.wallet-type-badge.trc20{color:#26a17b;}
.wallet-status{max-width:640px;margin:10px auto 0;padding:0 20px;font-size:13px;color:var(--muted);text-align:center;}
.wallet-status.err{color:#e0524b;font-weight:700;}
.wallet-result{max-width:640px;margin:16px auto 0;padding:0 20px;}
.wallet-balance-card{border:1px solid var(--grid-line);border-radius:14px;padding:20px;text-align:center;background:var(--panel);}
.wallet-balance-label{font-size:12px;color:var(--muted);font-weight:600;}
.wallet-balance-amount{font-size:26px;font-weight:800;margin-top:4px;}
.wallet-balance-meta{font-size:12px;color:var(--muted);margin-top:6px;}
.wallet-tx-list{margin-top:16px;border:1px solid var(--grid-line);border-radius:14px;padding:4px 16px;}
.wallet-tx-heading{font-size:12px;font-weight:700;color:var(--muted);padding:10px 0 4px;}
.wallet-tx-item{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--grid-line);font-size:12px;}
.wallet-tx-item:first-of-type{border-top:none;}
.wallet-tx-hash{font-family:monospace;color:var(--muted);}
.wallet-tx-amount{font-weight:700;white-space:nowrap;}
.wallet-tx-amount.in{color:var(--green);}
.wallet-tx-amount.out{color:#e0524b;}
.wallet-intro{max-width:640px;margin:8px auto 0;padding:0 20px;text-align:center;font-size:13px;color:var(--muted);line-height:1.5;}
