/* Crypto Prix Direct — look "terminal de trading" */
:root{
  --bg:#04060a; --bg2:#090d13; --card:#0a0f16; --line:#1c2634;
  --txt:#d7dee9; --mut:#6b7a90; --green:#00e07f; --red:#ff4d5e;
  --acc:#f0b90b; --acc2:#4f7cff;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  background-color:var(--bg);color:var(--txt);
  background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:28px 28px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;line-height:1.55;
}
.wrap{max-width:1060px;margin:0 auto;padding:0 16px}
a{color:var(--acc2)}
/* nav */
.nav{background:rgba(4,6,10,.92);backdrop-filter:blur(6px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:58px}
.logo{font-weight:800;font-size:1.15rem;color:var(--txt);text-decoration:none;font-family:var(--mono)}
.logo span{color:var(--acc)}
.logo::after{content:'▊';color:var(--green);animation:blink 1.1s steps(1) infinite;margin-left:3px}
@keyframes blink{50%{opacity:0}}
.nav-links a{color:var(--mut);text-decoration:none;margin-left:18px;font-size:.95rem}
.nav-links a:hover,.nav-links a.active{color:var(--txt)}
/* bandeau défilant des prix */
.ticker{background:#020304;border-bottom:1px solid var(--line);overflow:hidden;white-space:nowrap}
.ticker-track{display:inline-block;padding:7px 0;animation:tick 45s linear infinite;will-change:transform}
.ticker:hover .ticker-track{animation-play-state:paused}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tk{margin:0 22px;font-family:var(--mono);font-size:.8rem;color:var(--mut)}
.tk b{color:var(--txt)}
/* pubs */
.ad-label{font-size:.68rem;color:var(--mut);text-transform:uppercase;letter-spacing:.08em;margin:14px 0 4px;text-align:center;font-family:var(--mono)}
.ad-slot{background:var(--bg2);border:1px dashed var(--line);border-radius:6px;min-height:60px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.ad-mobile{display:none}
@media(max-width:760px){.ad-desktop-728,.ad-desktop-300{display:none}.ad-mobile{display:block}}
/* hero */
.hero{padding:28px 0 6px;text-align:center}
.hero h1{font-size:1.9rem;margin-bottom:6px;font-family:var(--mono);letter-spacing:-.02em}
.hero h1 .y{color:var(--acc)}
.hero .sub{color:var(--mut);max-width:640px;margin:0 auto 18px}
.top3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:14px 0 6px}
@media(max-width:640px){.top3{grid-template-columns:1fr}}
.coin-card{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:14px 16px;text-align:left}
.coin-card .ch{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.coin-ic{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;color:#04060a;background:var(--acc);flex:none;font-family:var(--mono)}
.coin-card .nm{font-weight:700}
.coin-card .sy{color:var(--mut);font-size:.8rem;font-family:var(--mono)}
/* BULLES de montants */
.bubble{display:inline-block;background:#0d141d;border:1px solid #2b3a4f;border-radius:999px;
  padding:6px 16px;font-family:var(--mono);font-weight:700;font-variant-numeric:tabular-nums;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);white-space:nowrap}
.bubble.big{font-size:1.45rem;padding:10px 28px;border-color:#3a4f6b;
  box-shadow:0 0 22px rgba(240,185,11,.10),inset 0 1px 0 rgba(255,255,255,.07)}
.pr{font-family:var(--mono);font-variant-numeric:tabular-nums}
.up{color:var(--green)} .down{color:var(--red)}
.chg{font-weight:700;font-variant-numeric:tabular-nums;font-family:var(--mono)}
/* toolbar */
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin:18px 0 10px}
.search input{background:#020304;border:1px solid var(--line);color:var(--txt);border-radius:6px;padding:9px 12px;width:230px;font-size:.95rem;font-family:var(--mono)}
.cur-toggle{display:flex;background:#020304;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.cur-toggle button{background:none;border:none;color:var(--mut);padding:9px 16px;cursor:pointer;font-weight:700;font-family:var(--mono)}
.cur-toggle button.on{background:var(--acc);color:#04060a}
.updated{color:var(--mut);font-size:.82rem;font-family:var(--mono)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--green);display:inline-block;margin-right:6px;animation:pulse 2s infinite}
@keyframes pulse{50%{opacity:.35}}
/* table */
.table-card{background:var(--card);border:1px solid var(--line);border-radius:6px;overflow:hidden;margin-bottom:8px}
table{width:100%;border-collapse:collapse;font-size:.93rem}
thead th{text-align:right;color:var(--mut);font-weight:600;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;padding:12px 14px;border-bottom:1px solid var(--line);white-space:nowrap;font-family:var(--mono)}
thead th:first-child,thead th:nth-child(2){text-align:left}
tbody td{padding:10px 14px;border-bottom:1px solid var(--line);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;font-family:var(--mono)}
tbody tr:last-child td{border-bottom:none}
tbody td:first-child,tbody td:nth-child(2){text-align:left}
tbody tr{transition:background .2s}
tbody tr:hover{background:#0d141d}
.cname{display:flex;align-items:center;gap:10px}
.cname .coin-ic{width:30px;height:30px;font-size:.8rem}
.cname b{display:block;line-height:1.2}
.cname small{color:var(--mut);font-family:var(--mono)}
.rank{color:var(--mut)}
.spark{width:120px;height:36px}
.flash-up{animation:fUp .8s} .flash-down{animation:fDown .8s}
@keyframes fUp{0%{background:rgba(0,224,127,.22)}100%{background:transparent}}
@keyframes fDown{0%{background:rgba(255,77,94,.22)}100%{background:transparent}}
@media(max-width:760px){
  thead{display:none}
  table,tbody,tr,td{display:block;width:100%}
  tbody tr{border-bottom:1px solid var(--line);padding:8px 4px}
  tbody td{border:none;padding:5px 14px;text-align:left;display:flex;justify-content:space-between;align-items:center}
  tbody td::before{content:attr(data-l);color:var(--mut);font-size:.72rem;text-transform:uppercase;font-family:var(--mono)}
  tbody td:first-child::before,tbody td:nth-child(2)::before{content:none}
  .spark{width:140px}
}
/* converter */
.conv-card{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:22px;max-width:560px;margin:18px auto}
.conv-row{display:flex;gap:10px;margin-bottom:14px}
.conv-row>div{flex:1}
label{display:block;color:var(--mut);font-size:.82rem;margin-bottom:6px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.06em}
input[type=number],select{width:100%;background:#020304;border:1px solid var(--line);color:var(--txt);border-radius:6px;padding:11px 12px;font-size:1rem;font-family:var(--mono)}
.conv-result{background:#020304;border:1px solid var(--line);border-radius:6px;padding:20px 16px;text-align:center;margin-top:6px}
.conv-result .rate{color:var(--mut);font-size:.85rem;margin-top:10px;font-family:var(--mono)}
/* prose pages */
.prose{max-width:720px;margin:0 auto;padding:26px 0}
.prose h1{margin-bottom:14px;font-family:var(--mono)}
.prose h2{margin:22px 0 8px;font-size:1.15rem}
.prose p,.prose li{color:#aeb9cc;margin-bottom:10px}
.prose ul{padding-left:20px}
.section-title{margin:26px 0 4px;font-size:1.25rem;font-family:var(--mono)}
/* footer */
footer{border-top:1px solid var(--line);margin-top:34px;padding:22px 0 34px;color:var(--mut);font-size:.85rem;text-align:center}
footer nav{margin-bottom:10px}
footer nav a{color:var(--mut);margin:0 10px;text-decoration:none}
footer nav a:hover{color:var(--txt)}
.disclaimer{font-size:.75rem;max-width:640px;margin:8px auto 0}
.loading,.error{text-align:center;padding:34px;color:var(--mut);font-family:var(--mono)}
.error{color:var(--red)}
