/* ===========================================================
   币种行情 · 前台样式（重写版）
   命名前缀 ct- ，避免和主题原有样式冲突
   =========================================================== */

:root{
    --thead:#fbfcfe;
    --hover:#fafbff;
    --chart-bg:#ffffff;
    --chart-grid:#eef1f5;
    --chart-axis:#9ba2b2;
    --chart-text:#333333;
    --bg:#f5f7fb;
    --card:#ffffff;
    --ink:#0b1220;
    --ink-2:#334155;
    --muted:#7c8798;
    --line:#e8edf5;
    --line-2:#f1f5f9;
    --brand:#2563eb;
    --brand-2:#0ea5e9;
    --up:#16a34a;
    --down:#e11d48;
    --radius:14px;
    --shadow:0 1px 2px rgba(15,23,42,.04),0 8px 24px rgba(15,23,42,.06);
    --shadow-sm:0 1px 2px rgba(15,23,42,.05);
}

*{box-sizing:border-box;}

html{ -webkit-text-size-adjust:100%; }

body{
    margin:0;
    overflow-x:hidden;
    background:var(--bg);
    color:var(--ink);
    font:15px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
    font-variant-numeric:tabular-nums;
    -webkit-font-smoothing:antialiased;
}

a{ color:inherit; text-decoration:none; }
img{ border:0; vertical-align:middle; }
h1,h2,h3,h4,p,ul,li{ margin:0; padding:0; list-style:none; }

.ct-wrap{ max-width:1240px; margin:0 auto; padding:0 20px; }

/* ---------------- 头部 ---------------- */
.ct-header{
    position:sticky; top:0; z-index:50;
    background:rgba(255,255,255,.86);
    backdrop-filter:saturate(180%) blur(12px);
    border-bottom:1px solid var(--line);
}
.ct-header .ct-wrap{ display:flex; align-items:center; height:64px; gap:28px; }

.ct-brand{ display:flex; align-items:center; gap:10px; font-weight:700; font-size:17px; letter-spacing:.2px; }
.ct-brand img{ width:26px; height:26px; }
.ct-brand .dot{ width:10px; height:10px; border-radius:50%; background:linear-gradient(135deg,var(--brand),var(--brand-2)); box-shadow:0 0 0 4px rgba(37,99,235,.12); }

.ct-nav{ display:flex; align-items:center; gap:4px; flex:1; }
.ct-nav a{ padding:7px 12px; border-radius:9px; color:var(--ink-2); font-size:14px; transition:.15s; }
.ct-nav a:hover{ background:var(--line-2); color:var(--ink); }

.ct-head-right{ display:flex; align-items:center; gap:10px; }

/* ---------------- 页面容器 ---------------- */
.ct-main{ padding:26px 0 56px; }

/* ---------------- 首屏 ---------------- */
.ct-hero{
    position:relative; overflow:hidden;
    border-radius:20px;
    padding:34px 36px;
    background:radial-gradient(1200px 400px at 10% -20%,#1e3a8a 0%,#0b1220 58%,#070b14 100%);
    color:#fff;
    margin-bottom:22px;
}
.ct-hero:after{
    content:""; position:absolute; right:-80px; top:-120px; width:420px; height:420px;
    background:radial-gradient(circle,rgba(14,165,233,.35),transparent 62%);
}
.ct-hero h1{ font-size:30px; line-height:1.25; font-weight:700; letter-spacing:-.4px; }
.ct-hero p{ margin-top:10px; color:#a9b6cc; font-size:14px; max-width:640px; }
.ct-hero .ct-hero-stats{ display:flex; gap:12px; flex-wrap:wrap; margin-top:22px; position:relative; z-index:2; }
.ct-chip{
    display:flex; align-items:center; gap:8px;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.12);
    padding:9px 14px; border-radius:11px;
    font-size:13px; color:#cfd9e8;
}
.ct-chip b{ color:#fff; font-size:15px; font-weight:600; }

/* ---------------- 卡片 ---------------- */
.ct-card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow-sm);
}
.ct-card + .ct-card{ margin-top:20px; }
.ct-card-head{
    display:flex; align-items:center; justify-content:space-between; gap:16px;
    padding:18px 22px; border-bottom:1px solid var(--line-2);
}
.ct-card-head h2{ font-size:16px; font-weight:650; }
.ct-card-head .ct-sub{ color:var(--muted); font-size:13px; }

/* ---------------- 行情表 ---------------- */
.ct-table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%; }
.ct-table{ width:100%; border-collapse:separate; border-spacing:0; }
.ct-table thead th{
    position:sticky; top:0; z-index:2;
    background:var(--thead,#fbfcfe);
    color:var(--muted); font-weight:500; font-size:12.5px;
    text-align:right; padding:12px 14px; white-space:nowrap;
    border-bottom:1px solid var(--line);
}
.ct-table thead th:first-child,.ct-table thead th:nth-child(2){ text-align:left; }
.ct-table tbody td{
    padding:13px 14px; text-align:right; white-space:nowrap;
    border-bottom:1px solid var(--line-2); font-size:14px; color:var(--ink-2);
}
.ct-table tbody td:first-child,.ct-table tbody td:nth-child(2){ text-align:left; }
.ct-table tbody tr{ transition:background .12s; }
.ct-table tbody tr:hover{ background:var(--hover,#fafbff); }
.ct-table tbody tr:last-child td{ border-bottom:0; }

.ct-rank{ display:inline-block; min-width:26px; color:var(--muted); font-size:13px; }

.ct-coin{ display:flex; align-items:center; gap:11px; }
.ct-coin img{ width:30px; height:30px; border-radius:50%; background:#eef2f8; }
.ct-coin .n{ display:flex; flex-direction:column; line-height:1.28; }
.ct-coin .n b{ font-weight:600; font-size:14px; color:var(--ink); }
.ct-coin .n span{ font-size:12px; color:var(--muted); }

.ct-price{ font-weight:600; color:var(--ink); }
.ct-up{ color:var(--up); }
.ct-down{ color:var(--down); }
.ct-flat{ color:var(--muted); }

.ct-pill{
    display:inline-block; min-width:76px; text-align:center;
    padding:5px 10px; border-radius:8px; font-size:13px; font-weight:600;
}
.ct-pill.up{ background:rgba(22,163,74,.10); color:var(--up); }
.ct-pill.down{ background:rgba(225,29,72,.10); color:var(--down); }
.ct-pill.flat{ background:var(--line-2); color:var(--muted); }

/* ---------------- 分页 ---------------- */
.ct-pager{ display:flex; align-items:center; justify-content:center; gap:6px; padding:22px 0 4px; flex-wrap:wrap; }
.ct-pager a,.ct-pager span{
    min-width:38px; height:38px; padding:0 12px;
    display:inline-flex; align-items:center; justify-content:center;
    border:1px solid var(--line); background:var(--card); border-radius:10px;
    color:var(--ink-2); font-size:14px; transition:.15s;
}
.ct-pager a:hover{ border-color:#c7d2fe; color:var(--brand); }
.ct-pager .active{ background:var(--brand); border-color:var(--brand); color:#fff; font-weight:600; }

/* ---------------- 币种详情 ---------------- */
.ct-coin-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:24px; padding:26px 26px 22px; flex-wrap:wrap; }
.ct-coin-id{ display:flex; align-items:center; gap:14px; }
.ct-coin-id img{ width:52px; height:52px; border-radius:50%; background:#eef2f8; }
.ct-coin-id h1{ font-size:22px; font-weight:700; letter-spacing:-.3px; }
.ct-coin-id .sym{ color:var(--muted); font-size:13px; margin-top:2px; }

.ct-coin-price{ margin-top:20px; display:flex; align-items:flex-end; gap:14px; flex-wrap:wrap; }
.ct-coin-price .big{ font-size:44px; line-height:1; font-weight:700; letter-spacing:-1.2px; color:var(--ink) !important; }
.ct-coin-price .sub{ color:var(--muted); font-size:13px; padding-bottom:6px; }
.ct-coin-change{ margin-top:12px; font-size:15px; font-weight:600; }

.ct-stats{ display:grid; grid-template-columns:repeat(5,minmax(120px,1fr)); gap:1px; background:var(--line-2); border-radius:12px; overflow:hidden; border:1px solid var(--line-2); }
.ct-stats div{ background:var(--card); padding:14px 16px; }
.ct-stats .k{ color:var(--muted); font-size:12.5px; margin-bottom:6px; }
.ct-stats .v{ font-size:15px; font-weight:600; color:var(--ink); }

/* 图表 */
.ct-chart-tools{ display:flex; gap:6px; flex-wrap:wrap; }
.ct-chart-tools button{
    border:1px solid var(--line); background:var(--card); color:var(--ink-2);
    padding:7px 14px; border-radius:9px; font-size:13px; cursor:pointer; transition:.15s;
}
.ct-chart-tools button:hover{ border-color:#c7d2fe; color:var(--brand); }
.ct-chart-tools button.active{ background:var(--brand); border-color:var(--brand); color:#fff; font-weight:600; }
#coin-chart{ padding:8px 10px 4px; }

/* ---------------- 页脚 ---------------- */
.ct-footer{ background:#0b1220; color:#94a3b8; margin-top:40px; }
.ct-footer .ct-wrap{ padding:34px 20px 26px; display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.ct-footer a{ color:#cbd5e1; }
.ct-footer a:hover{ color:#fff; }
.ct-footer .brand{ color:#fff; font-weight:700; font-size:16px; margin-bottom:8px; }
.ct-footer .tip{ font-size:13px; line-height:1.8; max-width:620px; }
.ct-footer .copy{ font-size:12.5px; color:#64748b; padding:0 20px 26px; }

/* ---------------- 响应式 ---------------- */
@media (max-width:1024px){
    .ct-stats{ grid-template-columns:repeat(3,minmax(140px,1fr)); }
}
@media (max-width:900px){
    .ct-hero{ padding:26px 22px; border-radius:16px; }
    .ct-hero h1{ font-size:23px; }
    .ct-nav{ display:none; }
    .ct-coin-price .big{ font-size:34px; }
    
    .ct-hide-md{ display:none; }
}
@media (max-width:760px){
    .ct-table{ width:100%; }
    .ct-table-scroll{ overflow-x:visible; }
    .ct-table thead th:nth-child(1){ width:46px; }
    .ct-table thead th:nth-child(3){ width:94px; }
    .ct-table thead th:last-child{ width:92px; }
    .ct-table thead th,.ct-table tbody td{ padding:10px 8px; font-size:12.5px; }
    .ct-coin{ gap:8px; }
    .ct-coin img{ width:24px; height:24px; }
    .ct-coin .n b{ font-size:13px; }
    .ct-coin .n span{ display:block; max-width:110px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .ct-pill{ min-width:62px; padding:4px 6px; font-size:12px; }
    .ct-price{ font-size:12.5px; }
}
@media (max-width:620px){
    .ct-wrap{ padding:0 14px; }
    .ct-table{ min-width:0; }
    .ct-table-scroll{ overflow-x:visible; }
    .ct-main{ padding:16px 0 40px; }
    .ct-card-head{ padding:14px 16px; }
    .ct-table thead th{ padding:10px 10px; }
    .ct-table tbody td{ padding:11px 10px; }
    
    .ct-stats{ grid-template-columns:1fr 1fr; }
    .ct-coin-price .big{ font-size:30px; }
    .ct-coin-head{ padding:20px 16px; }
    .ct-hide-sm{ display:none; }
}

/* ---------------- 兼容插件输出的 green / red ---------------- */
.green{ color:var(--up); }
.red{ color:var(--down); }
.ct-pill.green{ background:rgba(22,163,74,.10); color:var(--up); }
.ct-pill.red{ background:rgba(225,29,72,.10); color:var(--down); }

/* ---------------- 顶栏按钮 ---------------- */
.ct-btn{
    display:inline-flex; align-items:center; height:36px; padding:0 16px;
    border-radius:10px; background:var(--brand); color:#fff !important;
    font-size:13.5px; font-weight:600;
    box-shadow:0 1px 2px rgba(37,99,235,.25);
}
.ct-btn:hover{ filter:brightness(1.05); }

/* 图表区域兜底高度，避免加载前塌陷 */
#coin-chart{ min-height:470px; }
@media (max-width:620px){ #coin-chart{ min-height:360px; } }

/* ---------------- 涨幅榜 / 跌幅榜 ---------------- */
.ct-movers{ display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px; }
.ct-movers .ct-card + .ct-card{ margin-top:0; }

.ct-dot{ display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:8px; vertical-align:1px; }
.ct-dot.up{ background:var(--up); box-shadow:0 0 0 4px rgba(22,163,74,.12); }
.ct-dot.down{ background:var(--down); box-shadow:0 0 0 4px rgba(225,29,72,.12); }

.ct-move-list{ padding:6px 0; }
.ct-move-list li{
    display:grid; grid-template-columns:1fr auto 84px; align-items:center; gap:12px;
    padding:11px 20px; transition:background .12s;
}
.ct-move-list li + li{ border-top:1px solid var(--line-2); }
.ct-move-list li:hover{ background:var(--hover,#fafbff); }

.ct-move-coin{ display:flex; align-items:center; gap:10px; min-width:0; }
.ct-move-coin img{ width:26px; height:26px; border-radius:50%; background:#eef2f8; flex:none; }
.ct-move-coin .n{ display:flex; flex-direction:column; line-height:1.3; min-width:0; }
.ct-move-coin .n b{ font-size:13.5px; font-weight:600; color:var(--ink); }
.ct-move-coin .n span{ font-size:11.5px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.ct-move-price{ font-size:13px; color:var(--ink-2); text-align:right; white-space:nowrap; }
.ct-move-list .ct-pill{ min-width:66px; padding:4px 8px; font-size:12px; }

/* 详情页底部列表与上方卡片留白 */
.ct-detail-list{ margin-top:20px; }

@media (max-width:900px){
    .ct-movers{ grid-template-columns:1fr; gap:16px; }
}
@media (max-width:620px){
    .ct-move-list li{ grid-template-columns:1fr auto; padding:10px 14px; }
    .ct-move-price{ display:none; }
}

/* ---------------- 搜索框 ---------------- */
.ct-search{
    display:flex; align-items:center; gap:8px;
    height:36px; padding:0 10px 0 12px;
    background:var(--line-2);
    border:1px solid transparent; border-radius:10px;
    color:var(--muted); transition:.15s;
}
.ct-search:focus-within{ background:var(--card); border-color:#c7d2fe; box-shadow:0 0 0 3px rgba(37,99,235,.10); }
.ct-search svg{ flex:none; opacity:.7; }
.ct-search input{
    width:150px; border:0; outline:0; background:transparent;
    font-size:13.5px; color:var(--ink); font-family:inherit;
}
.ct-search input::placeholder{ color:var(--muted); }
.ct-search input::-webkit-search-cancel-button{ display:none; }

/* 图标按钮 */
.ct-icon-btn{
    display:inline-flex; align-items:center; justify-content:center;
    width:36px; height:36px; border-radius:10px;
    border:1px solid var(--line); background:var(--card); color:var(--ink-2);
    cursor:pointer; transition:.15s;
}
.ct-icon-btn:hover{ border-color:#c7d2fe; color:var(--brand); }
.ct-icon-btn .ico-sun{ display:none; }
html[data-theme="dark"] .ct-icon-btn .ico-moon{ display:none; }
html[data-theme="dark"] .ct-icon-btn .ico-sun{ display:block; }

/* ---------------- 排行榜 Tab ---------------- */
.ct-tabs{ display:flex; gap:6px; flex-wrap:wrap; }
.ct-tabs button{
    border:1px solid var(--line); background:var(--card); color:var(--ink-2);
    padding:6px 13px; border-radius:9px; font-size:13px; cursor:pointer; transition:.15s;
}
.ct-tabs button:hover{ border-color:#c7d2fe; color:var(--brand); }
.ct-tabs button.active{ background:var(--brand); border-color:var(--brand); color:#fff; font-weight:600; }

.ct-rank-panel{ display:none; }
.ct-rank-panel.active{ display:block; }
.ct-rank-panel .ct-move-list{ padding:6px 0; display:grid; grid-template-columns:1fr 1fr; }
.ct-rank-panel .ct-move-list li{ border-top:1px solid var(--line-2); }
.ct-rank-panel .ct-move-list li:nth-child(-n+2){ border-top:0; }
.ct-rank-panel .ct-move-list li:nth-child(odd){ border-right:1px solid var(--line-2); }

@media (max-width:900px){
    .ct-rank-panel .ct-move-list{ grid-template-columns:1fr; }
    .ct-rank-panel .ct-move-list li:nth-child(2){ border-top:1px solid var(--line-2); }
    .ct-rank-panel .ct-move-list li:nth-child(odd){ border-right:0; }
    .ct-search input{ width:110px; }
}
@media (max-width:620px){
    .ct-search{ display:none; }
}

/* ---------------- 深色模式 ---------------- */
html[data-theme="dark"]{
    --bg:#0a101c;
    --card:#111a2b;
    --ink:#e8eef9;
    --ink-2:#b7c4d8;
    --muted:#7b8aa3;
    --line:#1d2940;
    --line-2:#162135;
    --brand:#3b82f6;
    --up:#22c55e;
    --down:#f43f5e;
    --thead:#0f1a2c;
    --hover:#152138;
    --shadow:0 1px 2px rgba(0,0,0,.5),0 10px 30px rgba(0,0,0,.35);
    --shadow-sm:0 1px 2px rgba(0,0,0,.45);
    --chart-bg:#111a2b;
    --chart-grid:#1e2c44;
    --chart-axis:#64748b;
    --chart-text:#c7d2e2;
}
html[data-theme="dark"] body{ background:var(--bg); color:var(--ink); }
html[data-theme="dark"] .ct-header{ background:rgba(12,19,31,.82); border-bottom-color:var(--line); }
html[data-theme="dark"] .ct-hero{
    background:radial-gradient(1200px 400px at 10% -20%,#172554 0%,#0a101c 60%,#070c16 100%);
}
html[data-theme="dark"] .ct-footer{ background:#070c16; }
html[data-theme="dark"] .ct-search:focus-within{ box-shadow:0 0 0 3px rgba(59,130,246,.18); }
html[data-theme="dark"] .ct-pill.up{ background:rgba(34,197,94,.14); }
html[data-theme="dark"] .ct-pill.down{ background:rgba(244,63,94,.14); }
html[data-theme="dark"] .ct-coin img,
html[data-theme="dark"] .ct-move-coin img{ background:#1b2740; }

/* ---------------- 广告位 ---------------- */
.ct-ad{
    display:flex; align-items:center; gap:18px;
    padding:18px 22px; margin-bottom:20px;
}
.ct-ad-icon{
    flex:none; width:56px; height:56px; border-radius:14px;
    background:var(--line-2); display:flex; align-items:center; justify-content:center;
    overflow:hidden; font-weight:700; color:var(--muted); font-size:13px; letter-spacing:.5px;
}
.ct-ad-icon img{ width:56px; height:56px; object-fit:cover; }
.ct-ad-body{ flex:1; min-width:0; }
.ct-ad-title{ font-size:16px; font-weight:650; color:var(--ink); }
.ct-ad-desc{ font-size:13px; color:var(--muted); margin-top:5px; line-height:1.6; }
.ct-ad-actions{ display:flex; gap:10px; flex:none; }
.ct-ad-btn{
    display:inline-flex; align-items:center; justify-content:center;
    height:40px; padding:0 22px; border-radius:10px;
    background:var(--ink); color:var(--card) !important;
    font-size:14px; font-weight:600; transition:.15s;
}
.ct-ad-btn:hover{ filter:brightness(1.15); }
.ct-ad-btn.primary{ background:#16a34a; color:#fff !important; }

@media (max-width:760px){
    .ct-ad{ flex-wrap:wrap; gap:12px; padding:16px; }
    .ct-ad-body{ flex:1 1 60%; }
    .ct-ad-actions{ width:100%; }
    .ct-ad-btn{ flex:1; height:38px; padding:0 12px; font-size:13.5px; }
}

/* ---------------- 模板 B：卡片网格 ---------------- */
.ct-hero-slim{ padding:34px 38px; }
.ct-hero-slim h1{ font-size:30px; }

.ct-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(196px,1fr));
    gap:12px;
    padding:16px;
}
.ct-tile{
    display:block;
    border:1px solid var(--line-2);
    border-radius:12px;
    padding:14px 14px 12px;
    background:var(--card);
    transition:.15s;
}
.ct-tile:hover{ border-color:#c7d2fe; transform:translateY(-1px); box-shadow:0 6px 18px rgba(15,23,42,.06); }
.ct-tile-top{ display:flex; align-items:center; gap:8px; }
.ct-tile-top img{ width:22px; height:22px; border-radius:50%; background:var(--line-2); }
.ct-tile-sym{ font-weight:700; font-size:14px; color:var(--ink); }
.ct-tile-top .ct-pill{ margin-left:auto; }
.ct-tile-name{ font-size:12.5px; color:var(--muted); margin-top:6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ct-tile-price{ font-size:17px; font-weight:700; margin-top:8px; color:var(--ink); font-variant-numeric:tabular-nums; }
.ct-tile-meta{ display:flex; justify-content:space-between; gap:6px; font-size:11.5px; color:var(--muted); margin-top:8px; }

/* 模板 B：详情两列 */
.ct-coin-2col{
    display:grid;
    grid-template-columns:360px 1fr;
    gap:20px;
    align-items:start;
}
.ct-coin-head{ padding:22px; }
.ct-coin-title{ display:flex; align-items:center; gap:12px; }
.ct-coin-title img{ width:44px; height:44px; border-radius:50%; background:var(--line-2); }
.ct-coin-title h1{ font-size:20px; margin:0; }
.ct-coin-head .ct-price{ font-size:34px; font-weight:800; margin-top:16px; letter-spacing:-.5px; }
.ct-coin-head .ct-price-sub{ display:flex; align-items:center; gap:10px; margin-top:8px; }
.ct-stats-mini{
    margin-top:18px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1px;
    background:var(--line-2);
    border:1px solid var(--line-2);
    border-radius:10px;
    overflow:hidden;
}
.ct-stats-mini div{ background:var(--card); padding:10px 12px; }
.ct-stats-mini span{ display:block; font-size:11.5px; color:var(--muted); }
.ct-stats-mini b{ display:block; font-size:13.5px; margin-top:3px; }

@media (max-width:1000px){
    .ct-coin-2col{ grid-template-columns:1fr; }
    .ct-grid{ grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:10px; padding:12px; }
}

/* ---------------- 模板 C：看板 ---------------- */
.ct-shell{
    display:grid;
    grid-template-columns:280px minmax(0,1fr);
    gap:20px;
    align-items:start;
    padding-top:20px;
    padding-bottom:24px;
}
.ct-side{ position:sticky; top:84px; display:flex; flex-direction:column; gap:14px; }
.ct-side-card{ background:var(--card); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.ct-side-head{ display:flex; align-items:center; gap:8px; padding:12px 14px; font-size:14px; font-weight:650; border-bottom:1px solid var(--line-2); }
.ct-side-head .dot{ width:7px; height:7px; border-radius:50%; }
.ct-side-head .dot.up{ background:#16a34a; }
.ct-side-head .dot.down{ background:#e11d48; }
.ct-side-list li a{
    display:grid; grid-template-columns:52px 1fr auto; gap:8px; align-items:center;
    padding:9px 14px; font-size:12.5px; border-top:1px solid var(--line-2);
}
.ct-side-list li:first-child a{ border-top:0; }
.ct-side-list li a:hover{ background:var(--hover); }
.ct-side-list b{ font-size:13px; }
.ct-side-list .p{ color:var(--muted); font-variant-numeric:tabular-nums; }

.ct-col{ display:flex; flex-direction:column; gap:18px; min-width:0; }

.ct-ov{
    display:grid; grid-template-columns:repeat(5,1fr); gap:1px;
    background:var(--line-2); border:1px solid var(--line);
    border-radius:14px; overflow:hidden;
}
.ct-ov-item{ background:var(--card); padding:14px 16px; }
.ct-ov-item span{ display:block; font-size:12px; color:var(--muted); }
.ct-ov-item b{ display:block; font-size:19px; margin-top:4px; font-variant-numeric:tabular-nums; }
.ct-ov-item.up b{ color:#16a34a; }
.ct-ov-item.down b{ color:#e11d48; }

.ct-table.compact th,
.ct-table.compact td{ padding:8px 10px; font-size:13px; }
.ct-table.compact .ct-coin img{ width:22px; height:22px; }

.ct-c-head{ padding:22px 24px; }
.ct-c-top{ display:grid; grid-template-columns:auto 1fr auto auto; gap:16px; align-items:center; }
.ct-c-top > img{ width:48px; height:48px; border-radius:50%; background:var(--line-2); }
.ct-c-name h1{ font-size:20px; margin:0; }
.ct-c-price{ text-align:right; }
.ct-c-price .big{ font-size:32px; font-weight:800; letter-spacing:-.5px; font-variant-numeric:tabular-nums; }
.ct-c-sub{ display:flex; gap:10px; align-items:center; justify-content:flex-end; margin-top:6px; }
.ct-c-grid{
    display:grid; grid-template-columns:repeat(5,1fr); gap:1px;
    background:var(--line-2); border:1px solid var(--line-2);
    border-radius:12px; overflow:hidden; margin-top:18px;
}
.ct-c-grid div{ background:var(--card); padding:12px 14px; }
.ct-c-grid span{ display:block; font-size:11.5px; color:var(--muted); }
.ct-c-grid b{ display:block; font-size:14px; margin-top:4px; font-variant-numeric:tabular-nums; }

@media (max-width:1000px){
    .ct-shell{ grid-template-columns:1fr; padding-top:16px; }
    .ct-side{ position:static; }
    .ct-ov{ grid-template-columns:repeat(3,1fr); }
    .ct-c-top{ grid-template-columns:auto 1fr; row-gap:10px; }
    .ct-c-price{ text-align:left; grid-column:1 / -1; }
    .ct-c-sub{ justify-content:flex-start; }
    .ct-c-grid{ grid-template-columns:1fr 1fr; }
}

.ct-upd{ margin-top:10px; color:var(--muted); font-size:12.5px; }
.ct-c-price .ct-upd{ margin-top:6px; }

.ct-tile-rank{ font-size:11px; color:var(--muted); margin-left:2px; }
.ct-amt{ font-size:12.5px; color:var(--muted); }
.ct-c-price .ct-amt{ margin-left:8px; }

/* ---------------- 轮链 ---------------- */
.ct-links{ padding:18px 20px 20px; }
.ct-links-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(196px,1fr));
    gap:8px 10px;
    padding-top:4px;
}
.ct-links-grid a{
    display:flex; align-items:center; justify-content:center;
    min-width:0; padding:9px 12px;
    border:1px solid var(--line-2);
    border-radius:10px;
    background:var(--card);
    font-size:12.5px;
    transition:.15s;
}
.ct-links-grid a:hover{
    border-color:#c7d2fe;
    background:var(--hover,#fafbff);
    transform:translateY(-1px);
}
.ct-links-grid .n{
    color:var(--ink);
    font-weight:600;
    max-width:100%;
    font-size:12px;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.ct-links-grid .k{
    color:var(--muted);
    font-size:11.5px;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.ct-links-grid .k::before{
    content:"·";
    margin-right:5px;
    color:var(--line);
}
@media (max-width:640px){
    .ct-links{ padding:14px 14px 16px; }
    .ct-links-grid{ grid-template-columns:1fr 1fr; gap:8px; }
}

/* ---------------- 移动端统一修正 ---------------- */
@media (min-width:1001px){
    .ct-shell .ct-side{ order:-1; }
}
@media (max-width:900px){
    .ct-side{ position:static; display:grid; grid-template-columns:1fr 1fr; gap:12px; }
    .ct-ov{ grid-template-columns:repeat(2,1fr); }
    .ct-ad{ flex-wrap:wrap; row-gap:10px; max-width:100%; overflow:hidden; }
    .ct-ad-actions{ width:100%; display:flex; gap:8px; flex-wrap:wrap; }
    .ct-ad-btn{ flex:1; min-width:0; text-align:center; padding:0 10px; }
    .ct-top-ad{ padding-top:14px; }
}
@media (max-width:760px){
    .ct-card-head{ flex-wrap:wrap; gap:8px 10px; }
    .ct-card-head h2{ white-space:nowrap; }
    .ct-tabs{ width:100%; overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch; padding-bottom:2px; }
    .ct-tabs button, .ct-tabs > a{ flex:0 0 auto; }
    .ct-table th:nth-child(1){ width:44px; }
    .ct-table th:nth-child(3){ width:96px; }
    .ct-table th:last-child{ width:78px; }
    .ct-coin .n span{ max-width:72px; }
}
@media (max-width:420px){
    .ct-table th:nth-child(1), .ct-table td:nth-child(1){ display:none; }
    .ct-hero{ padding:20px 16px; }
    .ct-hero h1{ font-size:20px; }
    .ct-ad-icon{ width:40px; height:40px; }
    .ct-grid{ grid-template-columns:1fr 1fr; gap:8px; padding:10px; }
    .ct-tile{ padding:10px; }
}

/* 移动端：卡片网格 */
@media (max-width:620px){
    .ct-grid{ grid-template-columns:1fr 1fr; gap:8px; padding:10px; }
    .ct-tile{ min-width:0; padding:12px 10px; }
    .ct-tile-top{ gap:6px; }
    .ct-tile-sym{ font-size:13px; }
    .ct-tile-top .ct-pill{ min-width:50px; font-size:11.5px; padding:3px 5px; }
    .ct-tile-name{ font-size:12px; }
    .ct-tile-price{ font-size:15px; margin-top:6px; }
    .ct-tile-meta{ display:block; margin-top:6px; }
    .ct-tile-meta span{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .ct-tile-meta span + span{ margin-top:2px; }
}

/* 移动端：图表工具条 */
@media (max-width:620px){
    .ct-chart-tools{ gap:4px; flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%; padding-bottom:2px; }
    .ct-chart-tools button{ flex:0 0 auto; padding:0 9px; height:28px; font-size:12px; border-radius:7px; }
    #coin-chart{ min-height:320px; }
}

/* 移动端：表格不换行 */
@media (max-width:760px){
    .ct-table th, .ct-table td{ white-space:nowrap; }
    .ct-table .ct-coin .n span{ white-space:nowrap; }
    .ct-table .num{ text-align:right; }
}

/* 看板首页：广告区上下间距 */
.ct-top-ad{ padding-top:20px; padding-bottom:0; }
.ct-top-ad .ct-ad{ margin-bottom:14px; }
.ct-top-ad .ct-ad:last-child{ margin-bottom:0; }
.ct-top-ad + .ct-shell{ padding-top:20px; }

@media (max-width:900px){
    .ct-top-ad{ padding-top:14px; }
    .ct-top-ad + .ct-shell{ padding-top:14px; }
    .ct-top-ad .ct-ad{ margin-bottom:12px; }
}

/* 表格：不换行 + 最小宽度 */
.ct-table th, .ct-table td{ white-space:nowrap; }
.ct-table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%; }
.ct-table-scroll .ct-table{ min-width:620px; }

@media (max-width:900px){
    .ct-table-scroll .ct-table{ min-width:0; }   /* 手机上靠隐藏列解决，不需要横滑 */
}

/* 看板表格：窄屏按列位置隐藏（不依赖模板类） */
@media (max-width:900px){
@media (max-width:480px){
    .ct-table.compact th, .ct-table.compact td{ padding:9px 4px; font-size:10.5px; letter-spacing:-.2px; }
    .ct-table.compact .ct-pill{ min-width:44px; padding:3px 4px; font-size:10px; }
    .ct-table.compact .ct-coin{ gap:5px; }
    .ct-table.compact .ct-coin img{ width:20px; height:20px; }
    .ct-table.compact .ct-coin .n b{ font-size:11.5px; }
    .ct-table.compact .ct-coin .n span{ max-width:52px; font-size:10px; }
}
@media (max-width:620px){
    .ct-table.compact th, .ct-table.compact td{ padding:9px 8px; font-size:12.5px; }
    .ct-table.compact th:last-child, .ct-table.compact td:last-child{ width:74px; }
}

/* 手机上把 量/市值 放到币种名下 */
.ct-coin-sub{ display:none; }
@media (max-width:480px){
    .ct-coin .n .ct-coin-sub{
        display:block; white-space:normal; overflow:visible; text-overflow:clip;
        max-width:170px; font-size:10px; line-height:1.4; color:var(--muted); margin-top:1px;
    }
    .ct-table th.ct-hide-vol, .ct-table td.ct-hide-vol{ display:none; }
}

@media (max-width:480px){
}

.ct-lbl{ font-style:normal; font-size:11px; color:var(--muted); margin-right:4px; }

.ct-wide{ grid-column:1 / -1; }
.ct-wide .ct-ad:last-child{ margin-bottom:0; }

/* 详情页顶部广告 */
.ct-main > .ct-wrap > .ct-ad:first-child{ margin-top:0; }

/* ===== 手机端：排行榜数值 + 排名列 ===== */
@media (max-width:620px){
    .ct-move-list li{ grid-template-columns:minmax(0,1fr) auto auto; gap:8px; padding:10px 12px; }
    .ct-move-price{ display:block; font-size:12px; }
    .ct-move-list .ct-pill{ min-width:54px; padding:4px 6px; font-size:11.5px; }
    .ct-lbl{ font-size:10px; margin-right:2px; }
}
@media (max-width:760px){
    .ct-table thead th:first-child, .ct-table tbody td:first-child{ width:40px; padding-left:10px; padding-right:4px; }
    .ct-table thead th:nth-child(2), .ct-table tbody td:nth-child(2){ padding-left:4px; }
}

/* 副行：桌面隐藏，手机显示 */
.ct-table
@media (max-width:480px){
    .ct-table .ct-coin .n .ct-coin-sub{ display:block !important; }
}

/* 手机端列策略：电脑全显示，手机只留关键列 */
@media (max-width:900px){
    .ct-c-hi, .ct-c-lo, .ct-c-mcap{ display:none; }
    .ct-table{ table-layout:auto; }
    .ct-table th, .ct-table td{ white-space:nowrap; }
}
@media (max-width:480px){
    .ct-table thead th:first-child, .ct-table tbody td:first-child{ display:none; }
    .ct-table th, .ct-table td{ padding:9px 6px; font-size:12px; }
    .ct-table .ct-coin{ gap:7px; }
    .ct-table .ct-coin img{ width:22px; height:22px; }
    .ct-table .ct-coin .n span{ max-width:64px; }
    .ct-table .ct-pill{ min-width:48px; padding:3px 5px; font-size:11px; }
}

/* 看板：手机端把涨幅/跌幅榜放到行情列表上方 */
@media (max-width:1000px){
    .ct-shell{ display:flex; flex-direction:column; gap:14px; align-items:stretch; }
    .ct-col{ display:contents; }
    .ct-shell > *{ width:100%; }

    .ct-ov{ order:1; }
    .ct-side{ order:2; display:flex; flex-direction:column; gap:12px; position:static; }
    .ct-col > .ct-card:not(.ct-links){ order:3; }
    .ct-links{ order:4; }

    .ct-side-card{ width:100%; }
    .ct-side-list li a{ padding:11px 14px; }
}

/* ct-c-grid：改用单元格边框，避免拉伸时露出空白条 */
.ct-c-grid{ gap:0; background:transparent; }
.ct-c-grid div{ border-right:1px solid var(--line-2); border-bottom:1px solid var(--line-2); }
.ct-c-grid div:nth-child(5n){ border-right:0; }
.ct-c-grid div:nth-child(n+6){ border-bottom:0; }
