.pm-page .container{
  max-width: 1200px;
}

.pm-hero{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  padding:18px 20px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.08);
  background:
    radial-gradient(120% 160% at 0% 0%, rgba(34,72,110,0.35), transparent 60%),
    linear-gradient(135deg, rgba(15,18,26,0.95), rgba(20,24,34,0.9));
  box-shadow:0 18px 40px rgba(0,0,0,0.35);
  margin-bottom:14px;
}

.pm-title-row{
  display:flex;
  align-items:center;
  gap:10px;
}

.pm-title{
  margin:0;
  font-size:28px;
  font-weight:700;
  letter-spacing:0.01em;
}

.pm-hero-tag{
  display:inline-flex;
  align-items:center;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(34,197,94,0.14);
  border:1px solid rgba(34,197,94,0.5);
  color:#7cf4b1;
  font-size:12px;
  font-weight:600;
  text-transform:uppercase;
}

.pm-hero-meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.pm-hero-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(12,15,21,0.7);
  font-size:12px;
  color:var(--text);
}

.pm-chip-label{
  text-transform:uppercase;
  font-size:10px;
  letter-spacing:0.08em;
  color:var(--muted);
}

.pm-shell{
  max-width:860px;
  margin:0 auto;
}

.muted{
  color:var(--muted);
}

.pm-meta{
  font-size:12px;
  color:var(--muted);
}

.pm-toolbar{
  align-items:center;
  justify-content:space-between;
}

.pm-toolbar .pm-left,
.pm-toolbar .pm-right{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}

.pm-input,
.pm-select{
  background:#0f1116;
  color:var(--text);
  border:1px solid var(--border);
  border-radius:999px;
  padding:6px 12px;
  font-size:13px;
  min-height:34px;
}

.pm-select{
  padding-right:30px;
}

.pm-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  color:var(--muted);
}

.pm-toggle input{
  accent-color:#3b82f6;
}

.pm-counts{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.count-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 10px;
  border-radius:999px;
  border:1px solid var(--border);
  background:#141821;
  font-size:12px;
  color:var(--muted);
}

.count-chip b{
  color:var(--text);
}

#premarket-table{
  width:100%;
  min-width:980px;
  max-width:100%;
  border-left:1px solid var(--border);
  border-right:1px solid var(--border);
  table-layout:fixed;
}

#premarket-table th:nth-child(1), #premarket-table td:nth-child(1){ width:240px; }
#premarket-table th:nth-child(2), #premarket-table td:nth-child(2){ width:150px; }
#premarket-table th:nth-child(3), #premarket-table td:nth-child(3){ width:120px; }
#premarket-table th:nth-child(4), #premarket-table td:nth-child(4){ width:110px; }
#premarket-table th:nth-child(5), #premarket-table td:nth-child(5){ width:120px; }
#premarket-table th:nth-child(6), #premarket-table td:nth-child(6){ width:150px; }
#premarket-table th:nth-child(7), #premarket-table td:nth-child(7){ width:150px; }
#premarket-table th:nth-child(8), #premarket-table td:nth-child(8){ width:120px; }
#premarket-table th:nth-child(9), #premarket-table td:nth-child(9){ width:70px; }

#premarket-table td.token-cell,
#premarket-table th.token-cell,
#premarket-table td.exchange-cell,
#premarket-table th.exchange-cell{
  text-align:left;
}

.token-wrap{
  display:flex;
  align-items:center;
  gap:10px;
}

.token-icon{
  width:36px;
  height:36px;
  border-radius:12px;
  background:#141821;
  border:1px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.token-icon img{
  width:28px;
  height:28px;
  border-radius:10px;
  object-fit:cover;
}

.token-icon.fallback{
  background:#0f1622;
  border-color:#2b3647;
  color:#d5dee9;
  font-weight:700;
  font-size:15px;
  letter-spacing:0.02em;
}

.token-icon.fallback::after{
  content: attr(data-letter);
}

.token-meta{
  display:flex;
  flex-direction:column;
  gap:2px;
  line-height:1.1;
}

.token-symbol{
  font-weight:700;
  color:#9cd3ff;
  font-size:18px;
}

.token-name{
  font-size:12px;
  color:var(--muted);
}

.exchange-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:5px 12px 5px 8px;
  border-radius:999px;
  border:1px solid var(--border);
  background:#141821;
  font-size:13px;
  font-weight:600;
  color:var(--text);
}

.exchange-logo{
  width:22px;
  height:22px;
  border-radius:50%;
  background:transparent;
  border:1px solid transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  flex-shrink:0;
}

.exchange-logo img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.exchange-logo span{
  font-size:11px;
  font-weight:700;
  color:#d4dae5;
}

.status-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:4px 10px;
  border-radius:999px;
  font-weight:600;
  font-size:12px;
  border:1px solid transparent;
  white-space:nowrap;
}

.status-live{
  color:#64f0a3;
  border-color:#0b8f54;
  background:rgba(11,143,84,0.18);
}

.status-upcoming{
  color:#8dd0ff;
  border-color:#1d4ed8;
  background:rgba(59,130,246,0.18);
}

.status-ended{
  color:#ff9c9c;
  border-color:#b53d3d;
  background:rgba(181,61,61,0.2);
}

.status-unknown{
  color:#fbbf24;
  border-color:#b45309;
  background:rgba(245,158,11,0.2);
}

.pm-link{
  color:#9cd3ff;
  font-weight:600;
}

.pm-link:hover{
  color:#c7e2ff;
  text-decoration:underline;
}

.pm-list{
  display:flex;
  flex-direction:column;
  gap:14px;
  margin-top:6px;
}

.pm-empty{
  padding:12px 6px;
  font-size:14px;
}

.pm-card{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  box-shadow:var(--shadow);
}

.pm-card-left{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:210px;
}

.token-info{
  display:flex;
  flex-direction:column;
  gap:4px;
}

.token-line{
  display:flex;
  align-items:center;
  gap:8px;
}

.pm-group-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:3px 8px;
  border-radius:999px;
  font-size:11px;
  border:1px solid transparent;
}

.token-quote{
  font-size:12px;
  color:var(--muted);
}

.pm-card-right{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
}

.pm-card-stats{
  display:flex;
  gap:14px;
  margin-bottom:12px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.pm-stat{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:110px;
}

.pm-stat-label{
  font-size:11px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:0.03em;
}

.pm-stat-value{
  font-size:15px;
  font-weight:700;
}

.pm-ex-tiles{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
}

.pm-ex-tile{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.06);
  background:rgba(255,255,255,0.02);
  min-width:110px;
  text-decoration:none;
  color:var(--text);
}

.pm-ex-tile:hover{
  border-color:rgba(255,255,255,0.14);
  background:rgba(255,255,255,0.04);
  color:var(--text);
  text-decoration:none;
}

body.light .pm-hero{
  border-color:#e2e8f0;
  background:
    radial-gradient(120% 160% at 0% 0%, rgba(191,219,254,0.45), transparent 60%),
    linear-gradient(135deg, #ffffff, #f1f5f9);
  box-shadow:0 14px 30px rgba(15, 23, 42, 0.08);
}

body.light .pm-hero-chip{
  background:#ffffff;
  border-color:#e2e8f0;
  color:var(--text);
}

body.light .pm-hero-tag{
  background:#dcfce7;
  border-color:#16a34a;
  color:#166534;
}

body.light .pm-input,
body.light .pm-select{
  background:#ffffff;
  border-color:#e2e8f0;
  color:var(--text);
}

body.light .count-chip{
  background:#ffffff;
  border-color:#e2e8f0;
  color:var(--muted);
}

body.light .token-icon{
  background:#f8fafc;
  border-color:#e2e8f0;
}

body.light .token-icon.fallback{
  background:#f1f5f9;
  border-color:#e2e8f0;
  color:#1f2937;
}

body.light .exchange-badge{
  background:#ffffff;
  border-color:#e2e8f0;
}

body.light .exchange-logo{
  background:transparent;
  border-color:transparent;
}

body.light .exchange-logo span{
  color:#334155;
}

body.light .pm-ex-tile{
  background:#ffffff;
  border-color:#e2e8f0;
}

body.light .pm-ex-tile:hover{
  background:#f8fafc;
  border-color:#cbd5f5;
}

body.light .status-live{
  color:#166534;
  border-color:#16a34a;
  background:#dcfce7;
}

.pm-ex-head{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  color:var(--muted);
}

.pm-ex-name{
  font-weight:600;
  color:var(--text);
}

.pm-ex-price{
  font-size:15px;
  font-weight:700;
  letter-spacing:0.01em;
}

.pm-ex-meta{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:11px;
  color:var(--muted);
}

.pm-tile-status{
  padding:2px 6px;
  border-radius:999px;
  font-size:10px;
  border:1px solid transparent;
}

.pm-ex-vol{
  font-variant-numeric:tabular-nums;
}

@media (max-width: 900px){
  .pm-toolbar{
    align-items:flex-start;
  }
  .pm-card{
    flex-direction:column;
    align-items:flex-start;
  }
  .pm-card-left{
    width:100%;
  }
  .pm-card-right{
    width:100%;
    align-items:flex-start;
  }
  .pm-card-stats{
    justify-content:flex-start;
  }
  .pm-ex-tiles{
    justify-content:flex-start;
  }
}

img[src^="/uploads/exchange-logos/"]{
  width:18px;
  height:18px;
  object-fit:contain;
  border-radius:5px;
  background:transparent;
  box-shadow:none;
}
body.light img[src^="/uploads/exchange-logos/"]{
  background:transparent;
  box-shadow:none;
}
