:root {
  color-scheme: dark;
  --bg: #171a1f;
  --panel: #282c34;
  --panel-2: #20252c;
  --panel-3: #151a20;
  --border: #3a414c;
  --text: #f7f9fc;
  --muted: #b7c0cd;
  --blue: #3282df;
  --blue-dark: #2469b8;
  --blue-soft: #19263a;
  --green: #40c981;
  --amber: #ffbf47;
  --max: 1180px;
}
* { box-sizing: border-box; }
html { min-height: 100%; }
body { margin:0; min-height:100vh; background:var(--bg); color:var(--text); font-family:Arial,Helvetica,sans-serif; line-height:1.45; }
a { color:inherit; }
.site-hero { background:var(--blue); padding:28px 16px 22px; text-align:center; }
.brand { display:inline-flex; align-items:center; gap:16px; text-decoration:none; }
.brand-mark { width:70px; height:54px; border:3px solid #fff; border-radius:7px; display:grid; place-items:center; font-size:30px; font-weight:800; }
.brand-copy { text-align:left; }
.brand-title { display:block; font-size:clamp(2rem,6vw,3rem); font-weight:800; line-height:1; }
.brand-subtitle { display:block; margin-top:8px; font-weight:800; letter-spacing:.24em; }
.site-tagline { margin:24px 0 0; font-size:1rem; }
.site-nav { position:sticky; top:0; z-index:20; background:#0f1216; border-bottom:1px solid #303641; }
.nav-inner { max-width:var(--max); margin:0 auto; display:flex; justify-content:center; overflow-x:auto; scrollbar-width:thin; }
.nav-link { flex:0 0 auto; padding:15px 17px; color:#fff; text-decoration:none; font-weight:700; white-space:nowrap; }
.nav-link:hover,.nav-link[aria-current="page"] { background:var(--blue); }
main { max-width:var(--max); margin:0 auto; padding:30px 18px 110px; }
.page-heading { margin-bottom:24px; }
.page-heading h1 { margin:0 0 6px; font-size:clamp(1.7rem,4vw,2.4rem); }
.page-heading p { margin:0; color:var(--muted); }
.card-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; }
.card { background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:18px; }
.card h2,.card h3 { margin-top:0; }
.placeholder { color:var(--muted); }
.notice { background:#19263a; border:1px solid #3275c5; border-radius:10px; padding:13px 16px; margin-bottom:20px; }
.site-footer { border-top:1px solid #303641; color:var(--muted); text-align:center; padding:24px 16px 90px; }
.ad-anchor-safe-area { min-height:72px; }
.public-asset-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-bottom:18px; }
.stat-card { background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:16px 18px; }
.stat-card span { display:block; color:var(--muted); font-size:.85rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.stat-card strong { display:block; margin-top:5px; font-size:1.55rem; }
.asset-controls { display:grid; grid-template-columns:minmax(260px,1fr) minmax(150px,220px) minmax(170px,230px); gap:12px; padding:14px; margin-bottom:14px; background:var(--panel-2); border:1px solid var(--border); border-radius:12px; }
.asset-control span { display:block; margin-bottom:5px; color:var(--muted); font-size:.82rem; font-weight:700; }
.asset-control input,.asset-control select { width:100%; min-height:42px; border:1px solid #4a5361; border-radius:8px; background:#11151a; color:var(--text); padding:9px 11px; font:inherit; }
.asset-filter-row { display:flex; gap:8px; overflow-x:auto; padding:4px 0 10px; }
.asset-filter-row[hidden] { display:none; }
.asset-filter-row button,.asset-pagination button { flex:0 0 auto; border:1px solid #46505e; border-radius:8px; background:var(--panel); color:var(--text); padding:8px 12px; font-weight:700; cursor:pointer; }
.asset-filter-row button:hover,.asset-filter-row button.active,.asset-pagination button:hover:not(:disabled) { background:var(--blue); border-color:var(--blue); }
.asset-pagination button:disabled { opacity:.4; cursor:default; }
.asset-results-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:8px 0 14px; }
.asset-results-bar p { margin:0; color:var(--muted); }
.asset-pagination { display:flex; align-items:center; justify-content:center; gap:10px; }
.asset-pagination span { color:var(--muted); white-space:nowrap; }
.asset-pagination--bottom { margin-top:18px; }
.public-asset-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:14px; min-height:180px; }
.public-asset-grid.is-loading { opacity:.65; }
.public-asset-card { position:relative; overflow:hidden; background:var(--panel); border:1px solid var(--border); border-radius:13px; padding:14px; }
.public-asset-card h2 { margin:9px 0 8px; font-size:1rem; line-height:1.25; }
.public-asset-market { display:flex; justify-content:space-between; gap:8px; }
.public-asset-market span { display:flex; flex-direction:column; }
.public-asset-market span:last-child { text-align:right; }
.public-asset-market small { color:var(--muted); font-size:.68rem; text-transform:uppercase; }
.public-asset-market strong { font-size:.92rem; }
.public-asset-image-wrap { height:145px; display:grid; place-items:center; margin:5px 0; }
.public-asset-image { display:block; max-width:100%; width:138px; height:138px; object-fit:contain; }
.public-asset-image--empty { display:grid; place-items:center; border-radius:12px; background:#1c2128; font-size:48px; opacity:.55; }
.public-asset-badges { display:flex; flex-wrap:wrap; gap:5px; }
.public-asset-badges span { border:1px solid #4a5667; border-radius:999px; background:#1d232b; padding:3px 7px; font-size:.7rem; font-weight:700; }
.public-asset-meta { display:flex; justify-content:space-between; gap:8px; color:var(--muted); font-size:.76rem; }
.public-asset-meta strong { color:var(--text); }
.empty-state { grid-column:1/-1; padding:36px 20px; text-align:center; border:1px dashed var(--border); border-radius:12px; color:var(--muted); }
.empty-state h2 { color:var(--text); }
.search-panel { display:grid; grid-template-columns:1fr auto; align-items:end; gap:10px; padding:14px; margin-bottom:10px; background:var(--panel-2); border:1px solid var(--border); border-radius:12px; }
.primary-button { min-height:42px; border:1px solid var(--blue); border-radius:8px; background:var(--blue); color:#fff; padding:9px 20px; font:inherit; font-weight:800; cursor:pointer; }
.primary-button:hover { background:var(--blue-dark); }

/* Dashboard front face */
.dashboard-main { padding-top:22px; }
.dashboard-intro { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; padding:24px 0 8px; }
.dashboard-intro h1 { margin:3px 0 8px; font-size:clamp(2rem,6vw,3.4rem); line-height:1.05; }
.dashboard-lead,.section-copy { margin:0; color:var(--muted); max-width:760px; }
.eyebrow { margin:0; color:#74b6ff; font-size:.76rem; font-weight:900; letter-spacing:.11em; text-transform:uppercase; }
.live-pill { flex:0 0 auto; display:flex; align-items:center; gap:8px; border:1px solid var(--border); border-radius:999px; background:var(--panel-2); padding:9px 13px; color:var(--muted); font-size:.82rem; font-weight:700; }
.live-dot { width:8px; height:8px; border-radius:50%; background:var(--amber); box-shadow:0 0 0 4px rgba(255,191,71,.12); }
.live-pill.is-live .live-dot { background:var(--green); box-shadow:0 0 0 4px rgba(64,201,129,.12); }
.dashboard-section { margin-top:34px; }
.section-heading-row { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:14px; }
.section-heading-row h2 { margin:2px 0 0; font-size:clamp(1.4rem,3vw,2rem); }
.text-link { color:#82bcff; text-decoration:none; font-weight:800; white-space:nowrap; }
.text-link:hover { text-decoration:underline; }
.dashboard-stat-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.dashboard-stat { min-height:112px; display:flex; flex-direction:column; justify-content:center; padding:17px 18px; border:1px solid var(--border); border-radius:14px; background:linear-gradient(180deg,#292e36 0%,#232830 100%); }
.dashboard-stat--wide { grid-column:span 2; }
.dashboard-stat span { color:var(--muted); font-size:.76rem; font-weight:900; letter-spacing:.06em; text-transform:uppercase; }
.dashboard-stat strong { display:block; margin-top:6px; font-size:clamp(1.5rem,3vw,2.1rem); line-height:1.1; overflow-wrap:anywhere; }

/* Dual-platform stream workspace */
.stream-stack { display:flex; flex-direction:column; gap:16px; }
.stream-card { overflow:hidden; border:1px solid var(--border); border-radius:15px; background:var(--panel); transition:border-color .18s ease; }
.stream-card--youtube { border-color:#46505e; }
.stream-card.is-focused { border-color:#4b91df; }
.stream-card.is-dimmed { opacity:.72; }
.stream-card-head { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:15px 17px; }
.stream-card-head h3 { margin:2px 0 0; }
.stream-card-actions { display:flex; align-items:center; justify-content:flex-end; gap:9px; flex-wrap:wrap; }
.platform-label { color:var(--muted); font-size:.7rem; font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.status-badge { flex:0 0 auto; border-radius:999px; padding:5px 8px; font-size:.68rem; font-weight:900; text-transform:uppercase; }
.status-badge--offline { background:#1c2229; color:var(--muted); border:1px solid #444d58; }
.stream-action-button,.stream-chat-toggle { min-height:36px; border:1px solid #4a5665; border-radius:8px; background:#171c22; color:var(--text); padding:7px 11px; font:inherit; font-size:.78rem; font-weight:800; cursor:pointer; }
.stream-action-button:hover,.stream-chat-toggle:hover { background:var(--blue); border-color:var(--blue); }
.stream-action-button[aria-pressed="true"] { background:var(--blue); border-color:var(--blue); }
.stream-pair { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,34%); min-width:0; border-top:1px solid var(--border); }
.stream-pane { min-width:0; background:#101318; }
.stream-pane--chat { display:flex; flex-direction:column; border-left:1px solid var(--border); background:#151a20; }
.stream-placeholder { aspect-ratio:16/9; min-height:300px; display:grid; place-content:center; gap:5px; text-align:center; padding:24px; background:#101318; color:var(--muted); }
.stream-placeholder strong { color:var(--text); font-size:1.05rem; }
.stream-placeholder span { max-width:480px; }
.stream-chat-head { min-height:50px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 11px; border-bottom:1px solid var(--border); }
.stream-chat-head strong { font-size:.88rem; }
.stream-chat-placeholder { flex:1; min-height:250px; display:grid; align-content:center; gap:6px; padding:18px; color:var(--muted); }
.stream-chat-placeholder strong { color:var(--text); }
.stream-pane--chat.is-collapsed { border-left:0; }
.stream-pane--chat.is-collapsed .stream-chat-placeholder { display:none; }
.stream-pane--chat.is-collapsed .stream-chat-head { border-bottom:0; }
.stream-card.is-focused .stream-pair { grid-template-columns:minmax(0,1fr) minmax(300px,30%); }
.stream-card.is-focused .stream-placeholder { min-height:430px; }

.prize-feature { padding:20px; border:1px solid #356ca8; border-radius:17px; background:linear-gradient(180deg,#1b2b40 0%,#19222e 100%); }
.section-heading-row--prize { align-items:center; }
.countdown-card { min-width:180px; border:1px solid #3b5e85; border-radius:12px; background:#121c28; padding:10px 13px; text-align:right; }
.countdown-card span,.countdown-card small { display:block; color:var(--muted); font-size:.72rem; }
.countdown-card strong { display:block; margin:2px 0; font-size:1.25rem; }
.prize-layout { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(250px,.8fr); gap:14px; }
.prize-list { display:flex; flex-direction:column; gap:9px; }
.prize-row { display:flex; align-items:center; gap:13px; min-height:78px; padding:13px 14px; border:1px solid #3c4d61; border-radius:12px; background:#18212b; }
.prize-row--empty { color:var(--muted); }
.prize-row strong,.prize-row span { display:block; }
.prize-row strong { color:var(--text); }
.prize-icon { width:44px; height:44px; display:grid; place-items:center; border-radius:11px; background:#223349; font-size:1.45rem; }
.entry-card { border:1px solid #496786; border-radius:13px; background:#111b26; padding:16px; }
.entry-card h3 { margin:3px 0 12px; }
.entry-card p { color:var(--muted); }
.entry-card code,.how-to-card code { display:inline-block; max-width:100%; overflow-wrap:anywhere; border:1px solid #41556d; border-radius:8px; background:#0a1119; color:#fff; padding:7px 9px; font-family:Consolas,monospace; }
.entry-cost { display:flex; align-items:baseline; gap:7px; margin:6px 0 12px; }
.entry-cost strong { font-size:2rem; }
.entry-cost span { color:var(--muted); font-weight:800; }
.micro-copy { margin-bottom:0; font-size:.8rem; }
.dashboard-two-column { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.dashboard-panel { margin-top:20px; padding:17px; border:1px solid var(--border); border-radius:15px; background:var(--panel); }
.compact-empty-state { display:flex; flex-direction:column; gap:4px; min-height:108px; justify-content:center; border:1px dashed #4a5664; border-radius:11px; padding:15px; color:var(--muted); }
.compact-empty-state strong { color:var(--text); }
.how-to-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.how-to-card { position:relative; min-height:180px; border:1px solid var(--border); border-radius:14px; background:var(--panel); padding:18px; }
.how-to-card h3 { margin:12px 0 7px; }
.how-to-card p { margin:0; color:var(--muted); }
.step-number { width:30px; height:30px; display:grid; place-items:center; border-radius:50%; background:var(--blue); font-weight:900; }
.goal-preview-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.goal-preview { min-height:106px; display:flex; flex-direction:column; justify-content:center; border:1px solid var(--border); border-radius:14px; background:linear-gradient(180deg,#262c34 0%,#20252c 100%); padding:16px; }
.goal-preview span { color:#79b9ff; font-size:.78rem; font-weight:900; text-transform:uppercase; }
.goal-preview strong { margin-top:6px; font-size:1rem; }

@media (max-width:900px) {
  .dashboard-stat-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dashboard-stat--wide { grid-column:span 2; }
  .stream-pair,.stream-card.is-focused .stream-pair { grid-template-columns:1fr; }
  .stream-pane--chat { border-left:0; border-top:1px solid var(--border); }
  .stream-placeholder,.stream-card.is-focused .stream-placeholder { min-height:0; }
  .stream-chat-placeholder { min-height:190px; }
  .prize-layout,.dashboard-two-column { grid-template-columns:1fr; }
  .how-to-grid,.goal-preview-grid { grid-template-columns:1fr; }
}
@media (max-width:640px) {
  .site-hero { padding-top:20px; }
  .brand-mark { width:55px; height:46px; font-size:24px; }
  .brand-subtitle { letter-spacing:.14em; font-size:.75rem; }
  .site-tagline { margin-top:16px; }
  .nav-inner { justify-content:flex-start; }
  .nav-link { padding:13px 14px; }
  main { padding-inline:12px; }
  .public-asset-summary { grid-template-columns:1fr; gap:8px; }
  .asset-controls { grid-template-columns:1fr; }
  .asset-results-bar { align-items:flex-start; flex-direction:column; }
  .public-asset-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
  .public-asset-card { padding:10px; }
  .public-asset-image-wrap { height:110px; }
  .public-asset-image { width:105px; height:105px; }
  .public-asset-meta { flex-direction:column; gap:2px; }
  .search-panel { grid-template-columns:1fr; }
  .dashboard-main { padding-top:12px; }
  .dashboard-intro,.section-heading-row { align-items:flex-start; flex-direction:column; }
  .live-pill { align-self:flex-start; }
  .dashboard-stat-grid { gap:8px; }
  .dashboard-stat { min-height:96px; padding:13px; }
  .dashboard-stat--wide { grid-column:span 2; }
  .stream-card-head { align-items:flex-start; flex-direction:column; }
  .stream-card-actions { width:100%; justify-content:space-between; }
  .stream-action-button,.stream-chat-toggle { min-height:44px; }
  .stream-chat-placeholder { min-height:150px; }
  .section-heading-row--prize { align-items:flex-start; }
  .countdown-card { width:100%; min-width:0; text-align:left; }
  .prize-feature { padding:14px; }
}
@media (max-width:390px) {
  .public-asset-grid { grid-template-columns:1fr; }
  .dashboard-stat-grid { grid-template-columns:1fr; }
  .dashboard-stat--wide { grid-column:span 1; }
}
