/*
Theme Name: WhyOwl
Theme URI: https://whyowl.com/
Author: WhyOwl
Description: Dark editorial and market dashboard theme for WhyOwl. Built to preserve existing WordPress content, users, and comments.
Version: 0.2.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 8.0
Text Domain: whyowl
*/
:root{
  --bg-page:#060D17;
  --bg-surface:#0D1B2C;
  --bg-surface-2:#11233A;
  --bg-elevated:#152B45;
  --border:rgba(53,136,189,0.18);
  --border-strong:rgba(53,136,189,0.38);
  --text-primary:#EAF4FC;
  --text-secondary:#8FA9C0;
  --text-muted:#526A80;
  --brand-blue:#0089D1;
  --brand-blue-glow:#29AEFF;
  --brand-navy:#24669D;
  --brand-sky:#3588BD;
  --brand-ice:#ABDEF2;
  --accent-teal:#00C2D6;
  --accent-green:#17C97F;
  --accent-orange:#FFA351;
  --accent-red:#FF5C6C;
  --font-head:'Space Grotesk','Noto Sans SC',sans-serif;
  --font-body:'Noto Sans SC',-apple-system,sans-serif;
  --font-mono:'JetBrains Mono',monospace;
  --radius:12px;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{
  background:var(--bg-page);
  color:var(--text-primary);
  font-family:var(--font-body);
  line-height:1.6;
  background-image:
    radial-gradient(circle at 12% 8%, rgba(0,137,209,0.14), transparent 40%),
    radial-gradient(circle at 88% 0%, rgba(0,194,214,0.10), transparent 35%);
}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;height:auto;}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
.mono{font-family:var(--font-mono);}

/* ---------- topbar ---------- */
.topbar{
  border-bottom:1px solid var(--border);
  background:#0A1420;
  backdrop-filter:blur(10px);
  position:sticky;top:0;z-index:50;width:100%;
}
.topbar-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:14px 0;gap:12px 20px;}
.brand{display:flex;align-items:center;gap:10px;flex:none;}
.brand img{width:36px;height:36px;object-fit:contain;filter:drop-shadow(0 0 10px rgba(0,137,209,0.5));}
.brand-name{font-family:var(--font-head);font-weight:700;font-size:19px;letter-spacing:0.3px;}
.brand-name .why{color:var(--accent-teal);}
.brand-name .owl{color:var(--accent-green);}
.brand-tag{font-size:11px;color:var(--text-muted);letter-spacing:1.5px;text-transform:uppercase;margin-left:8px;padding-left:8px;border-left:1px solid var(--border-strong);}

nav.main-nav{display:flex;align-items:center;gap:2px;overflow-x:auto;scrollbar-width:none;max-width:100%;}
nav.main-nav::-webkit-scrollbar{display:none;}
nav.main-nav a, .nav-more>summary{
  font-size:14px;color:var(--text-secondary);padding:8px 12px;border-radius:8px;
  transition:.15s;white-space:nowrap;display:flex;align-items:center;gap:4px;cursor:pointer;list-style:none;
}
nav.main-nav a:hover{color:var(--text-primary);background:var(--bg-surface-2);}
nav.main-nav a.active{color:var(--brand-blue-glow);background:rgba(0,137,209,0.12);}
.nav-more{position:relative;}
.nav-more>summary::-webkit-details-marker{display:none;}
.nav-more[open]>summary{color:var(--text-primary);background:var(--bg-surface-2);}
.nav-more-panel{
  position:absolute;top:calc(100% + 8px);left:0;min-width:220px;
  background:var(--bg-elevated);border:1px solid var(--border-strong);border-radius:var(--radius);
  padding:8px;box-shadow:0 20px 40px rgba(0,0,0,0.45);
}
.nav-more-panel a{display:flex;align-items:center;justify-content:space-between;padding:9px 10px;border-radius:8px;font-size:13px;color:var(--text-secondary);}
.nav-more-panel a:hover{background:var(--bg-surface-2);color:var(--text-primary);}
.soon-tag{font-size:10px;padding:2px 6px;border-radius:20px;background:rgba(255,163,81,0.14);color:var(--accent-orange);border:1px solid rgba(255,163,81,0.3);}
.nav-more-panel .divider{height:1px;background:var(--border);margin:6px 4px;}
.nav-more-panel .hint{font-size:11px;color:var(--text-muted);padding:6px 10px 2px;}

.topbar-actions{display:flex;align-items:center;gap:10px;}
.icon-btn{
  width:34px;height:34px;border-radius:9px;border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;color:var(--text-secondary);
  background:var(--bg-surface);cursor:pointer;position:relative;
}
.icon-btn:hover{border-color:var(--border-strong);color:var(--text-primary);}
.icon-btn svg{width:16px;height:16px;}
.rss-dot{position:absolute;top:-3px;right:-3px;width:8px;height:8px;border-radius:50%;background:var(--accent-orange);border:2px solid var(--bg-page);}
.rss-panel{
  position:absolute;top:calc(100% + 10px);right:0;min-width:210px;
  background:var(--bg-elevated);border:1px solid var(--border-strong);border-radius:var(--radius);
  padding:8px;box-shadow:0 20px 40px rgba(0,0,0,0.45);display:none;
}
.icon-btn:hover .rss-panel{display:block;}
.rss-panel a{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;font-size:13px;color:var(--text-secondary);}
.rss-panel a:hover{background:var(--bg-surface-2);color:var(--accent-orange);}
.rss-panel svg{width:14px;height:14px;flex:none;}

.btn-primary{
  font-family:var(--font-head);font-weight:600;font-size:13.5px;
  background:linear-gradient(135deg,var(--brand-blue),var(--accent-teal));
  color:#04141F;padding:9px 18px;border-radius:9px;border:none;cursor:pointer;
  box-shadow:0 0 0 1px rgba(0,194,214,0.25), 0 8px 20px rgba(0,137,209,0.25);
}

.menu-toggle{display:none;}

.market-snapshot{
  border-top:1px solid rgba(53,136,189,0.12);
  background:rgba(6,13,23,0.58);
}
.market-snapshot-inner{
  min-height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  overflow-x:auto;
  scrollbar-width:none;
  white-space:nowrap;
}
.market-snapshot-inner::-webkit-scrollbar{display:none;}
.snapshot-date{
  font-family:var(--font-mono);
  font-size:11.5px;
  color:var(--brand-ice);
  padding-right:4px;
}

/* ---------- hero / dashboard ---------- */
.hero{padding:44px 0 8px;}
.hero-top{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:24px;}
.hero-title{font-family:var(--font-head);font-size:30px;font-weight:700;line-height:1.3;}
.hero-title span{color:var(--accent-teal);}
.hero-sub{color:var(--text-secondary);font-size:14px;margin-top:8px;max-width:560px;}
.live-pill{
  display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--accent-green);
  background:rgba(23,201,127,0.1);border:1px solid rgba(23,201,127,0.3);padding:5px 10px;border-radius:20px;
  font-family:var(--font-mono);
}
.live-pill i{width:6px;height:6px;border-radius:50%;background:var(--accent-green);display:inline-block;box-shadow:0 0 8px var(--accent-green);animation:pulse 1.6s infinite;}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:0.35;}}

.dash-grid{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:16px;margin-bottom:36px;}
.card{
  background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:18px 20px;position:relative;overflow:hidden;
}
.dash-grid .card{cursor:pointer;transition:border-color .15s,transform .15s,background .15s;}
.dash-grid .card:hover{border-color:var(--border-strong);transform:translateY(-2px);background:var(--bg-surface-2);}
.card-cover-link{position:absolute;inset:0;z-index:5;border-radius:inherit;}
.card-head,
.radar-row,
.mood-gauge,
.mood-meta,
.mood-quote,
.pick-ticker,
.pick-title,
.pick-tags,
.pick-desc{position:relative;z-index:2;}
.card-head a{position:relative;z-index:6;}
.card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.card-title{font-size:13px;color:var(--text-secondary);display:flex;align-items:center;gap:7px;font-weight:500;}
.card-title svg{width:15px;height:15px;color:var(--brand-blue-glow);}
.card-link{font-size:12px;color:var(--text-muted);display:flex;align-items:center;gap:3px;}
.card-link svg{width:12px;height:12px;}

.radar-row{display:flex;align-items:center;justify-content:space-between;padding:7px 0;border-bottom:1px dashed var(--border);font-size:13px;}
.radar-row:last-child{border-bottom:none;}
.radar-ticker{font-family:var(--font-mono);font-weight:600;width:56px;color:var(--text-primary);}
.radar-name{color:var(--text-muted);font-size:11.5px;flex:1;padding:0 6px;}
.lamps{display:flex;gap:3px;}
.lamp{width:7px;height:7px;border-radius:50%;background:var(--bg-elevated);border:1px solid var(--border-strong);}
.lamp.on{background:var(--accent-orange);border-color:var(--accent-orange);box-shadow:0 0 6px rgba(255,163,81,0.7);}
.status-tag{font-size:10.5px;padding:3px 8px;border-radius:20px;font-family:var(--font-mono);margin-left:8px;}
.status-tag.near{background:rgba(255,163,81,0.14);color:var(--accent-orange);border:1px solid rgba(255,163,81,0.3);}
.status-tag.watch{background:rgba(143,169,192,0.1);color:var(--text-muted);border:1px solid var(--border);}

.mood-gauge{display:flex;flex-direction:column;align-items:center;padding:6px 0 4px;}
.mood-thermo{
  width:min(170px,80%);
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:5px;
  margin:2px 0 10px;
}
.mood-thermo span{
  height:9px;
  border-radius:999px;
  background:var(--mood-soft, rgba(0,194,214,.14));
  border:1px solid var(--mood-border, rgba(0,194,214,.42));
}
.mood-thermo span:nth-child(-n+3){
  background:var(--mood-accent, var(--accent-teal));
  border-color:var(--mood-accent, var(--accent-teal));
  box-shadow:0 0 10px var(--mood-border, rgba(0,194,214,.42));
}
.mood-tone-alert .mood-thermo span:nth-child(-n+5),
.mood-tone-warm .mood-thermo span:nth-child(-n+4),
.mood-tone-positive .mood-thermo span:nth-child(-n+3),
.mood-tone-neutral .mood-thermo span:nth-child(-n+3),
.mood-tone-cold .mood-thermo span:nth-child(-n+2){
  background:var(--mood-accent, var(--accent-teal));
  border-color:var(--mood-accent, var(--accent-teal));
  box-shadow:0 0 10px var(--mood-border, rgba(0,194,214,.42));
}
.mood-tone-alert .mood-thermo span:nth-child(n+6),
.mood-tone-warm .mood-thermo span:nth-child(n+5),
.mood-tone-positive .mood-thermo span:nth-child(n+4),
.mood-tone-neutral .mood-thermo span:nth-child(n+4),
.mood-tone-cold .mood-thermo span:nth-child(n+3){
  background:var(--mood-soft, rgba(0,194,214,.14));
  border-color:var(--mood-border, rgba(0,194,214,.42));
  box-shadow:none;
}
.gauge-value{font-family:var(--font-head);font-size:26px;font-weight:700;color:var(--mood-accent, var(--accent-teal));text-align:center;}
.gauge-label{font-size:12px;color:var(--text-secondary);text-align:center;margin-top:2px;}
.mood-meta{display:flex;justify-content:center;gap:16px;margin-top:12px;font-size:11.5px;color:var(--text-muted);font-family:var(--font-mono);}
.mood-quote{
  margin-top:14px;font-size:12.5px;color:var(--text-secondary);text-align:center;
  border-top:1px solid var(--border);padding-top:12px;font-style:italic;line-height:1.6;
}
.mood-card .mood-quote{
  margin:8px 0 14px;
  padding:0 0 14px;
  border-top:none;
  border-bottom:1px solid var(--mood-border, var(--border));
  color:var(--text-primary);
  font-family:var(--font-head);
  font-size:clamp(18px,1.55vw,24px);
  font-style:normal;
  font-weight:700;
  line-height:1.46;
}
.mood-card .mood-gauge{padding:0 0 2px;}
.mood-card .gauge-value{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:2px;
  padding:3px 10px;
  border:1px solid var(--mood-border, rgba(0,194,214,0.32));
  border-radius:999px;
  background:var(--mood-soft, rgba(0,194,214,0.08));
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:700;
  color:var(--mood-accent, var(--accent-teal));
}
.mood-card .gauge-label{font-size:11px;color:var(--text-muted);margin-top:5px;font-family:var(--font-mono);}
.mood-card .mood-meta{margin-top:9px;font-size:10.5px;}
.dash-grid .mood-card{
  border-color:var(--mood-border, var(--border));
  background:
    linear-gradient(180deg,var(--mood-soft, rgba(0,194,214,.12)),transparent 62%),
    var(--bg-surface);
}
.dash-grid .mood-card:hover{
  border-color:var(--mood-accent, var(--border-strong));
  background:
    linear-gradient(180deg,var(--mood-soft, rgba(0,194,214,.14)),transparent 62%),
    var(--bg-surface-2);
}

.pick-card .pick-ticker{font-family:var(--font-mono);font-size:20px;font-weight:700;color:var(--brand-ice);}
.pick-card .pick-title{font-size:14px;margin:8px 0 10px;line-height:1.5;}
.pick-tags{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap;}
.tag{font-size:10.5px;padding:3px 8px;border-radius:6px;background:var(--bg-surface-2);color:var(--text-secondary);border:1px solid var(--border);font-family:var(--font-mono);}
.tag.up{color:var(--accent-green);border-color:rgba(23,201,127,0.3);background:rgba(23,201,127,0.08);}
.tag.warn{color:var(--accent-orange);border-color:rgba(255,163,81,0.3);background:rgba(255,163,81,0.08);}
.pick-desc{font-size:12.5px;color:var(--text-secondary);line-height:1.7;}

.tick-item{font-family:var(--font-mono);font-size:12.5px;color:var(--text-secondary);display:inline-flex;gap:6px;align-items:center;}
.tick-item b{color:var(--text-primary);}
.tick-item.pos{color:var(--accent-green);}
.tick-item.neg{color:var(--accent-red);}

/* ---------- section heading ---------- */
.section-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:18px;}
.section-title{font-family:var(--font-head);font-size:20px;font-weight:700;display:flex;align-items:center;gap:10px;}
.section-title .bar{width:4px;height:18px;background:linear-gradient(180deg,var(--brand-blue),var(--accent-teal));border-radius:3px;display:inline-block;}
.section-more{font-size:13px;color:var(--brand-blue-glow);display:flex;align-items:center;gap:4px;}

/* ---------- article grid ---------- */
.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:20px;}
.article-card{
  background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:18px;display:flex;flex-direction:column;gap:10px;transition:.15s;
}
.article-card:hover{border-color:var(--border-strong);transform:translateY(-2px);}
.article-top{display:flex;align-items:center;justify-content:space-between;}
.cat-pill{font-size:10.5px;padding:3px 9px;border-radius:20px;font-weight:600;letter-spacing:.3px;}
.cat-pill.gegu{background:rgba(0,137,209,0.14);color:var(--brand-blue-glow);}
.cat-pill.xinde{background:rgba(0,194,214,0.12);color:var(--accent-teal);}
.cat-pill.rizhi{background:rgba(23,201,127,0.12);color:var(--accent-green);}
.article-date{font-size:11px;color:var(--text-muted);font-family:var(--font-mono);}
.article-title{font-size:15px;font-weight:500;line-height:1.5;}
.article-desc{font-size:12.5px;color:var(--text-secondary);line-height:1.7;flex:1;}
.article-bottom{display:flex;align-items:center;justify-content:space-between;padding-top:8px;border-top:1px solid var(--border);}
.signal-mini{display:flex;gap:3px;align-items:center;}
.share-mini{display:flex;gap:6px;}
.share-mini button{width:24px;height:24px;border-radius:6px;border:1px solid var(--border);background:transparent;color:var(--text-muted);display:flex;align-items:center;justify-content:center;cursor:pointer;}
.share-mini button:hover{color:var(--accent-teal);border-color:var(--accent-teal);}
.share-mini svg{width:12px;height:12px;}

/* ---------- pagination ---------- */
.pagination{display:flex;align-items:center;justify-content:center;gap:6px;margin:28px 0 48px;}
.page-btn{
  min-width:34px;height:34px;padding:0 10px;border-radius:9px;border:1px solid var(--border);
  background:var(--bg-surface);color:var(--text-secondary);font-family:var(--font-mono);font-size:13px;
  display:flex;align-items:center;justify-content:center;cursor:pointer;gap:4px;
}
.page-btn:hover{border-color:var(--border-strong);color:var(--text-primary);}
.page-btn.active{background:linear-gradient(135deg,var(--brand-blue),var(--accent-teal));color:#04141F;border-color:transparent;font-weight:700;box-shadow:0 0 14px rgba(0,137,209,0.4);}
.page-btn svg{width:14px;height:14px;}
.page-dots{color:var(--text-muted);font-family:var(--font-mono);padding:0 4px;}

/* ---------- video section ---------- */
.video-section{
  background:linear-gradient(135deg, rgba(0,137,209,0.08), rgba(0,194,214,0.05));
  border:1px solid var(--border);border-radius:16px;padding:28px;margin-bottom:48px;
  display:grid;grid-template-columns:1.1fr 1fr;gap:28px;align-items:center;
}
.video-copy .section-title{margin-bottom:10px;}
.video-copy p{font-size:13px;color:var(--text-secondary);line-height:1.8;margin-bottom:16px;}
.video-copy .btn-primary{display:inline-flex;align-items:center;gap:8px;}
.video-slot{
  aspect-ratio:16/9;border-radius:12px;border:1px dashed var(--border-strong);
  background:var(--bg-surface);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  color:var(--text-muted);
}
.video-slot .play-circle{
  width:52px;height:52px;border-radius:50%;background:rgba(0,137,209,0.14);border:1px solid var(--border-strong);
  display:flex;align-items:center;justify-content:center;color:var(--brand-blue-glow);
}
.video-slot .play-circle svg{width:20px;height:20px;}
.video-slot span{font-size:12px;font-family:var(--font-mono);}

/* ---------- subscribe block ---------- */
.subscribe-block{
  background:var(--bg-surface);border:1px solid var(--border);border-radius:16px;
  padding:32px;display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:48px;flex-wrap:wrap;
}
.subscribe-copy .section-title{margin-bottom:8px;}
.subscribe-copy p{font-size:13px;color:var(--text-secondary);}
.subscribe-form{display:flex;gap:10px;flex-wrap:wrap;}
.subscribe-form input{
  background:var(--bg-surface-2);border:1px solid var(--border-strong);color:var(--text-primary);
  padding:10px 14px;border-radius:9px;font-size:13px;min-width:220px;
}
.channel-row{display:flex;gap:10px;margin-top:14px;}
.channel-row a{
  width:36px;height:36px;border-radius:9px;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;
  color:var(--text-secondary);
}
.channel-row a:hover{color:var(--text-primary);border-color:var(--border-strong);}
.channel-row svg{width:16px;height:16px;}

/* ---------- journal archive ---------- */
.journal-archive{padding:42px 0 56px;}
.journal-head{max-width:720px;margin-bottom:24px;}
.journal-title{
  font-family:var(--font-head);
  font-size:clamp(27px,3.3vw,40px);
  line-height:1.18;
  margin:8px 0 10px;
}
.journal-title span{color:var(--accent-green);}
.journal-sub{color:var(--text-secondary);font-size:14px;line-height:1.8;}
.journal-list{display:grid;gap:14px;max-width:880px;}
.journal-card{
  background:linear-gradient(135deg,rgba(13,27,44,0.96),rgba(9,20,34,0.96));
  border:1px solid var(--border);
  border-radius:14px;
  padding:18px;
  display:grid;
  grid-template-columns:74px minmax(0,1fr);
  gap:18px;
  transition:.15s;
}
.journal-card:hover{border-color:var(--border-strong);transform:translateY(-1px);}
.journal-date{
  border-right:1px solid var(--border);
  padding-right:16px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
}
.journal-date time{font-family:var(--font-mono);text-align:center;}
.journal-date span{display:block;color:var(--text-muted);font-size:11px;margin-bottom:4px;}
.journal-date strong{display:block;color:var(--accent-green);font-size:16px;}
.journal-body{min-width:0;}
.journal-meta{display:flex;gap:10px;flex-wrap:wrap;color:var(--text-muted);font-family:var(--font-mono);font-size:11px;margin-bottom:8px;}
.journal-card-title{
  font-family:var(--font-head);
  font-size:clamp(19px,2vw,24px);
  line-height:1.35;
  margin:0 0 10px;
  color:var(--text-primary);
}
.journal-card-title a:hover{color:var(--brand-blue-glow);}
.journal-body p{color:var(--text-secondary);font-size:13px;line-height:1.75;margin:0 0 14px;}
.journal-read{color:var(--brand-blue-glow);font-size:13px;font-weight:700;}
.journal-pagination{margin-top:28px;}

/* ---------- share bar ---------- */
.site-share{
  margin-top:28px;
  margin-bottom:28px;
  padding:16px 0;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.site-share-label{display:flex;align-items:baseline;gap:10px;min-width:0;}
.site-share-label span{font-size:11px;color:var(--brand-blue-glow);letter-spacing:.14em;}
.site-share-label strong{font-size:14px;color:var(--text-primary);font-family:var(--font-head);}
.site-share-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;}
.site-share-actions a,
.site-share-actions button{
  appearance:none;
  border:1px solid var(--border);
  background:var(--bg-surface);
  color:var(--text-secondary);
  border-radius:999px;
  padding:7px 11px;
  font:600 12px var(--font-head);
  cursor:pointer;
  line-height:1;
}
.site-share-actions a:hover,
.site-share-actions button:hover{
  color:var(--text-primary);
  border-color:var(--border-strong);
  background:var(--bg-surface-2);
}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--border);padding:40px 0 28px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:24px;margin-bottom:28px;}
.footer-brand .brand{margin-bottom:10px;}
.footer-brand p{font-size:12.5px;color:var(--text-muted);line-height:1.8;max-width:220px;}
.footer-col h4{font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;margin-bottom:12px;font-weight:600;}
.footer-col a{display:block;font-size:13px;color:var(--text-secondary);margin-bottom:9px;}
.footer-col a:hover{color:var(--text-primary);}
.footer-col .soon{color:var(--text-muted);display:flex;align-items:center;gap:6px;}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;padding-top:20px;border-top:1px solid var(--border);font-size:12px;color:var(--text-muted);flex-wrap:wrap;gap:12px;}
.footer-bottom .channel-row a{width:30px;height:30px;}

@media (max-width:900px){
  .dash-grid{grid-template-columns:1fr;}
  .article-grid{grid-template-columns:1fr 1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .video-section{grid-template-columns:1fr;}
  .topbar-inner{justify-content:center;}
  nav.main-nav{order:3;flex-basis:100%;justify-content:flex-start;border-top:1px solid var(--border);padding-top:10px;}
  nav.main-nav a{font-size:13px;padding:6px 10px;}
}
@media (max-width:600px){
  .article-grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .subscribe-block{flex-direction:column;align-items:flex-start;}
  .journal-card{grid-template-columns:1fr;gap:12px;}
  .journal-date{border-right:0;border-bottom:1px solid var(--border);padding-right:0;padding-bottom:10px;justify-content:flex-start;}
  .journal-date time{display:flex;gap:8px;align-items:baseline;text-align:left;}
  .site-share{align-items:flex-start;flex-direction:column;}
  .site-share-actions{justify-content:flex-start;}
}

/* ---------- WordPress integration ---------- */
.admin-bar .topbar{top:32px;}
main#content{min-height:60vh;}
.main-nav .active{color:var(--brand-blue-glow);background:rgba(0,137,209,0.12);}
.topbar .wrap.topbar-inner{padding-left:24px;padding-right:24px;}
.search-field,
.comment-form input,
.comment-form textarea{
  width:100%;background:var(--bg-surface-2);border:1px solid var(--border-strong);color:var(--text-primary);
  padding:10px 14px;border-radius:9px;font-size:13px;
}
.article-shell{padding:36px 0 64px;}
.article-head{margin-bottom:24px;}
.article-shell .article-title{font-family:var(--font-head);font-size:36px;font-weight:700;line-height:1.18;margin:12px 0;}
.article-meta{color:var(--text-muted);font-size:13px;display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px;}
.article-meta span{display:inline-flex;align-items:center;gap:6px;}
.article-meta span:not(:last-child)::after{content:"";width:3px;height:3px;border-radius:50%;background:rgba(148,163,184,.55);margin-left:2px;}
.article-content,
.page-content-card{font-size:16px;color:var(--text-primary);line-height:1.78;}
.page-content-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px;}
.article-content p,.article-content ul,.article-content ol,.article-content blockquote{margin:0 0 20px;}
.article-content h2,.article-content h3,.article-content h4{font-family:var(--font-head);line-height:1.28;margin:32px 0 14px;letter-spacing:0;}
.article-content h2{font-size:24px;}.article-content h3{font-size:19px;}
.article-content blockquote{border-left:3px solid var(--accent-teal);padding:14px 18px;background:rgba(0,194,214,0.08);color:var(--text-secondary);border-radius:0 var(--radius) var(--radius) 0;}
.article-content table{width:100%;border-collapse:collapse;margin:24px 0;font-size:14px;}
.article-content th,.article-content td{border-bottom:1px solid var(--border);padding:10px 12px;text-align:left;}
.article-content th{color:var(--brand-blue-glow);background:rgba(0,137,209,0.08);}
.inner-hero{padding-bottom:48px;}
.signal-page .article-head{border-bottom:1px solid var(--border);padding-bottom:22px;}
.featured-image{margin:0 0 22px;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--bg-surface);}
.featured-image img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;}
.article-thumb{display:block;border-radius:10px;overflow:hidden;border:1px solid var(--border);background:var(--bg-surface-2);}
.article-thumb img{width:100%;aspect-ratio:16/9;object-fit:cover;}
.post-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin:26px 0 44px;}
.post-card{padding:18px;min-height:210px;display:flex;flex-direction:column;gap:12px;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);}
.post-card:hover{border-color:var(--border-strong);transform:translateY(-1px);transition:.15s;}
.post-kicker{font-family:var(--font-mono);color:var(--accent-teal);font-size:11px;text-transform:uppercase;}
.post-card h2,.post-card h3{font-size:18px;line-height:1.35;margin:0;font-family:var(--font-head);}
.post-card p{margin:0;color:var(--text-secondary);font-size:13px;}.post-card .read-more{margin-top:auto;color:var(--brand-blue-glow);font-size:13px;}
.comment-area{margin-top:42px;}.comment-area h2,.comment-reply-title{font-family:var(--font-head);font-size:22px;}
.comment-list{list-style:none;padding:0;margin:0;}.comment{margin:16px 0;}.comment-body{padding:16px;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);}
.comment-author,.comment-metadata{font-size:13px;color:var(--text-muted);}.comment-content{color:var(--text-secondary);}
.logged-in-as,.comment-notes{color:var(--text-muted);font-size:13px;}
.paywall-note{background:rgba(255,163,81,0.08);border:1px solid rgba(255,163,81,0.36);border-radius:var(--radius);padding:18px;color:var(--text-secondary);}
.paywall-note strong{color:var(--accent-orange);}
.nav-links,.page-links{display:flex;align-items:center;justify-content:center;gap:8px;margin:28px 0;}
.page-numbers,.page-links a,.page-links span{
  min-width:34px;height:34px;padding:0 10px;border-radius:9px;border:1px solid var(--border);
  background:var(--bg-surface);color:var(--text-secondary);font-family:var(--font-mono);font-size:13px;
  display:inline-flex;align-items:center;justify-content:center;
}
.page-numbers.current,.page-links span{background:linear-gradient(135deg,var(--brand-blue),var(--accent-teal));color:#04141F;border-color:transparent;font-weight:700;}
.search-form{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.search-submit,.comment-form .submit{
  font-family:var(--font-head);font-weight:600;font-size:13.5px;
  background:linear-gradient(135deg,var(--brand-blue),var(--accent-teal));
  color:#04141F;padding:9px 18px;border-radius:9px;border:none;cursor:pointer;
  box-shadow:0 0 0 1px rgba(0,194,214,0.25), 0 8px 20px rgba(0,137,209,0.25);
}
.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.back-to-top{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:80;
  width:42px;
  height:42px;
  border-radius:999px;
  border:1px solid rgba(89,199,255,.42);
  background:rgba(7,15,28,.86);
  color:var(--brand-blue-glow);
  box-shadow:0 12px 32px rgba(0,0,0,.28), 0 0 0 1px rgba(50,230,200,.10);
  cursor:pointer;
  opacity:0;
  transform:translateY(12px);
  pointer-events:none;
  transition:opacity .18s ease, transform .18s ease, border-color .18s ease, color .18s ease;
  backdrop-filter:blur(12px);
}
.back-to-top span{font-size:22px;line-height:1;font-family:var(--font-mono);}
.back-to-top.is-visible{opacity:1;transform:translateY(0);pointer-events:auto;}
.back-to-top:hover{border-color:rgba(50,230,200,.75);color:var(--accent-teal);}
.mood-template-meta{justify-content:center;margin:10px 0 0;}
@media (max-width:900px){.post-grid{grid-template-columns:1fr;}.brand{min-width:0}.brand-tag{display:none}.topbar-actions{gap:7px}.btn-primary{padding:8px 12px;font-size:12.5px}}

/* ---------- Desktop compact alignment ---------- */
.narrow{
  width:min(100% - 48px, 860px);
  margin-left:auto;
  margin-right:auto;
}

@media (min-width:901px){
  body{font-size:14px;}
  .wrap{
    width:min(100% - 56px, 1080px);
    max-width:none;
    padding-left:0;
    padding-right:0;
  }
  .topbar-inner{
    flex-wrap:nowrap;
    gap:14px;
    padding-top:10px;
    padding-bottom:10px;
  }
  .topbar .wrap.topbar-inner{
    padding-left:0;
    padding-right:0;
  }
  .brand img{width:32px;height:32px;}
  .brand-name{font-size:17px;}
  .brand-tag{font-size:10px;letter-spacing:1.1px;}
  nav.main-nav{justify-content:center;flex:1;}
  nav.main-nav a,
  .nav-more>summary{font-size:12.5px;padding:7px 9px;}
  .btn-primary{font-size:12.5px;padding:8px 14px;}

  .hero{padding:30px 0 4px;}
  .hero-top{gap:18px;margin-bottom:18px;}
  .hero-title{font-size:25px;line-height:1.28;}
  .hero-sub{font-size:13px;max-width:520px;line-height:1.75;}
  .live-pill{font-size:11px;padding:4px 9px;}

  .dash-grid{
    grid-template-columns:1.08fr 0.96fr 0.96fr;
    gap:14px;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:28px;
  }
  .card{padding:15px 16px;border-radius:10px;}
  .card-head{margin-bottom:11px;}
  .card-title{font-size:12px;}
  .card-link{font-size:11px;}
  .radar-row{font-size:12px;padding:6px 0;}
  .radar-ticker{width:48px;}
  .radar-name{font-size:11px;}
  .status-tag{font-size:9.5px;padding:2px 6px;margin-left:6px;}
  .gauge-value{font-size:22px;}
  .gauge-label{font-size:11.5px;}
  .mood-meta{font-size:10.5px;margin-top:9px;}
  .mood-quote{font-size:11.5px;margin-top:11px;padding-top:10px;}
  .mood-card .mood-quote{font-size:18px;margin-top:6px;padding-top:0;padding-bottom:12px;}
  .mood-card .gauge-value{font-size:10.5px;padding:3px 9px;}
  .pick-card .pick-ticker{font-size:18px;}
  .pick-card .pick-title{font-size:13px;line-height:1.45;}
  .pick-desc{font-size:12px;}

  .market-snapshot-inner{min-height:30px;gap:16px;}
  .snapshot-date{font-size:11px;}
  .tick-item{font-size:11.5px;}
  .section-head{margin-bottom:14px;}
  .section-title{font-size:18px;}
  .section-title .bar{height:16px;}
  .article-grid{gap:14px;margin-bottom:18px;}
  .article-card{padding:15px;gap:8px;border-radius:10px;}
  .article-card-title{font-size:14px;line-height:1.45;}
  .article-desc{font-size:12px;line-height:1.65;}
  .article-date{font-size:10.5px;}
  .cat-pill{font-size:10px;padding:3px 8px;}

  .video-section{
    padding:22px;
    gap:22px;
    margin-bottom:36px;
    border-radius:12px;
  }
  .video-copy p{font-size:12.5px;}
  .subscribe-block{
    padding:24px;
    margin-bottom:36px;
    border-radius:12px;
  }
  footer{padding:32px 0 24px;}

  .article-shell{padding:30px 0 56px;}
  .article-head{
    margin-bottom:18px;
    text-align:left;
  }
  .article-shell .article-title{
    font-size:30px;
    line-height:1.22;
    margin:10px 0 12px;
  }
  .article-meta{font-size:12px;margin-bottom:16px;}
  .article-content,
  .page-content-card{font-size:15.5px;line-height:1.75;}
  .page-content-card{padding:22px;border-radius:10px;}
  .article-content p,
  .article-content ul,
  .article-content ol,
  .article-content blockquote{margin-bottom:16px;}
  .article-content h2,
  .article-content h3,
  .article-content h4{margin:28px 0 12px;}
  .article-content h2{font-size:21px;}
  .article-content h3{font-size:18px;}
  .article-content table{font-size:12.5px;}
  .article-content th,
  .article-content td{padding:8px 10px;}
  .article-content img{
    margin-left:auto !important;
    margin-right:auto !important;
    border-radius:10px;
  }
  .comment-area{margin-top:34px;}
  .comment-area h2,
  .comment-reply-title{font-size:19px;}
}

/* ---------- WhyOwl WordPress preview polish ---------- */
.card-title,
.pick-title,
.article-card-title,
.section-title{margin:0;}
.card-head{gap:14px;}
.card-link{white-space:nowrap;}
.radar-row{gap:8px;}
.radar-name{min-width:0;}
.lamps{flex:0 0 auto;}
.status-tag{flex:0 0 auto;}

@media (max-width:900px){
  .topbar .wrap.topbar-inner{padding-left:18px;padding-right:18px;}
  .topbar-inner{
    justify-content:space-between;
    align-items:center;
  }
  .brand{
    flex:0 1 auto;
    max-width:calc(100% - 172px);
    overflow:hidden;
  }
  .brand img{
    width:32px;
    height:32px;
    flex:0 0 32px;
  }
  .brand-name{font-size:16px;}
  nav.main-nav{
    order:3;
    flex-basis:100%;
  }
}

/* ---------- Legacy imported article dark mode ---------- */
.article-content{background:transparent;}
.article-content.page-content-card{
  background:var(--bg-surface);
}
.article-content *,
.page-content-card *{border-color:var(--border) !important;}
.article-content [style*="background:#fff"],
.article-content [style*="background: #fff"],
.article-content [style*="background:white"],
.article-content [style*="background: white"],
.article-content [style*="background-color:#fff"],
.article-content [style*="background-color: #fff"],
.article-content [style*="background-color:white"],
.article-content [style*="background-color: white"],
.article-content [style*="background:#ffffff"],
.article-content [style*="background: #ffffff"],
.article-content [style*="background-color:#ffffff"],
.article-content [style*="background-color: #ffffff"],
.article-content [style*="background:#f8fafc"],
.article-content [style*="background: #f8fafc"],
.article-content [style*="background-color:#f8fafc"],
.article-content [style*="background-color: #f8fafc"],
.article-content [style*="background:#f9fafb"],
.article-content [style*="background: #f9fafb"],
.article-content [style*="background-color:#f9fafb"],
.article-content [style*="background-color: #f9fafb"],
.article-content [style*="background:#f3f4f6"],
.article-content [style*="background: #f3f4f6"],
.article-content [style*="background-color:#f3f4f6"],
.article-content [style*="background-color: #f3f4f6"],
.article-content [style*="background:#f1f5f9"],
.article-content [style*="background: #f1f5f9"],
.article-content [style*="background-color:#f1f5f9"],
.article-content [style*="background-color: #f1f5f9"],
.article-content [style*="background:#fafbfc"],
.article-content [style*="background: #fafbfc"],
.article-content [style*="background-color:#fafbfc"],
.article-content [style*="background-color: #fafbfc"],
.article-content [style*="background:#f8f9fa"],
.article-content [style*="background: #f8f9fa"],
.article-content [style*="background-color:#f8f9fa"],
.article-content [style*="background-color: #f8f9fa"],
.article-content [style*="background:#fef2f2"],
.article-content [style*="background: #fef2f2"],
.article-content [style*="background-color:#fef2f2"],
.article-content [style*="background-color: #fef2f2"],
.article-content [style*="background:#f0fdf4"],
.article-content [style*="background: #f0fdf4"],
.article-content [style*="background-color:#f0fdf4"],
.article-content [style*="background-color: #f0fdf4"],
.article-content [style*="background:#dcfce7"],
.article-content [style*="background: #dcfce7"],
.article-content [style*="background-color:#dcfce7"],
.article-content [style*="background-color: #dcfce7"],
.article-content [style*="background:#fef3c7"],
.article-content [style*="background: #fef3c7"],
.article-content [style*="background-color:#fef3c7"],
.article-content [style*="background-color: #fef3c7"],
.article-content [style*="background:#fff7ed"],
.article-content [style*="background: #fff7ed"],
.article-content [style*="background-color:#fff7ed"],
.article-content [style*="background-color: #fff7ed"],
.article-content [style*="background:#e2e8f0"],
.article-content [style*="background: #e2e8f0"],
.article-content [style*="background-color:#e2e8f0"],
.article-content [style*="background-color: #e2e8f0"],
.article-content [style*="background:#dbeafe"],
.article-content [style*="background: #dbeafe"],
.article-content [style*="background-color:#dbeafe"],
.article-content [style*="background-color: #dbeafe"],
.article-content [style*="background:rgba(255,255,255"],
.article-content [style*="background: rgba(255,255,255"],
.article-content [style*="background-color:rgba(255,255,255"],
.article-content [style*="background-color: rgba(255,255,255"],
.article-content [style*="background:rgb(255"],
.article-content [style*="background: rgb(255"],
.article-content [style*="background-color:rgb(255"],
.article-content [style*="background-color: rgb(255"],
.article-content [style*="background:rgb(248"],
.article-content [style*="background: rgb(248"],
.article-content [style*="background-color:rgb(248"],
.article-content [style*="background-color: rgb(248"]{
  background:linear-gradient(180deg,rgba(13,27,44,0.98),rgba(8,19,31,0.98)) !important;
  color:var(--text-primary) !important;
  box-shadow:none !important;
}
.article-content div[style*="box-shadow"],
.article-content section[style*="box-shadow"],
.article-content article[style*="box-shadow"]{
  box-shadow:0 14px 34px rgba(0,0,0,0.22) !important;
}
.article-content [style*="color:#0f172a"],
.article-content [style*="color: #0f172a"],
.article-content [style*="color:#1e293b"],
.article-content [style*="color: #1e293b"],
.article-content [style*="color:#334155"],
.article-content [style*="color: #334155"],
.article-content [style*="color:#475569"],
.article-content [style*="color: #475569"],
.article-content [style*="color:#64748b"],
.article-content [style*="color: #64748b"],
.article-content [style*="color:#1a1a2e"],
.article-content [style*="color: #1a1a2e"],
.article-content [style*="color:#111827"],
.article-content [style*="color: #111827"],
.article-content [style*="color:#374151"],
.article-content [style*="color: #374151"],
.article-content [style*="color:#4b5563"],
.article-content [style*="color: #4b5563"],
.article-content [style*="color:#6b7280"],
.article-content [style*="color: #6b7280"],
.article-content [style*="color:#94a3b8"],
.article-content [style*="color: #94a3b8"],
.article-content [style*="color:black"],
.article-content [style*="color: black"],
.article-content [style*="color:rgb(15"],
.article-content [style*="color: rgb(15"],
.article-content [style*="color:rgb(30"],
.article-content [style*="color: rgb(30"],
.article-content [style*="color:rgb(51"],
.article-content [style*="color: rgb(51"],
.article-content [style*="color:rgb(71"],
.article-content [style*="color: rgb(71"],
.article-content [style*="color:rgb(100"],
.article-content [style*="color: rgb(100"]{
  color:var(--text-primary) !important;
}
.article-content [style*="color:#166534"],
.article-content [style*="color: #166534"],
.article-content [style*="color:#16a34a"],
.article-content [style*="color: #16a34a"]{
  color:#67e8a5 !important;
}
.article-content [style*="color:#991b1b"],
.article-content [style*="color: #991b1b"],
.article-content [style*="color:#7f1d1d"],
.article-content [style*="color: #7f1d1d"],
.article-content [style*="color:#dc2626"],
.article-content [style*="color: #dc2626"],
.article-content [style*="color:#ef4444"],
.article-content [style*="color: #ef4444"]{
  color:#ff8a8a !important;
}
.article-content [style*="color:#92400e"],
.article-content [style*="color: #92400e"],
.article-content [style*="color:#d97706"],
.article-content [style*="color: #d97706"],
.article-content [style*="color:#ea580c"],
.article-content [style*="color: #ea580c"],
.article-content [style*="color:#eab308"],
.article-content [style*="color: #eab308"]{
  color:var(--accent-orange) !important;
}
.article-content [style*="color:#2563eb"],
.article-content [style*="color: #2563eb"],
.article-content [style*="color:#1e40af"],
.article-content [style*="color: #1e40af"],
.article-content [style*="color:#3b82f6"],
.article-content [style*="color: #3b82f6"]{
  color:var(--brand-blue-glow) !important;
}
.article-content p,
.article-content li,
.article-content td,
.article-content figcaption{color:var(--text-secondary);}
.article-content h1,
.article-content h2,
.article-content h3,
.article-content h4,
.article-content h5,
.article-content h6{color:var(--text-primary) !important;}
.article-content strong,
.article-content b{color:#f7fbff;}
.article-content a{color:var(--brand-blue-glow);text-decoration-color:rgba(0,194,214,0.42);}
.article-content .quote-block{
  border-left:3px solid var(--brand-blue-glow);
  background:rgba(0,137,209,0.1);
  border-radius:0 10px 10px 0;
  padding:18px 22px;
  margin:28px 0;
}
.article-content .quote-block p{
  margin:0 0 8px;
  text-indent:0;
  color:var(--text-primary);
}
.article-content .quote-block .source{
  text-align:right;
  color:var(--text-muted);
  font-size:13px;
  margin-top:12px;
}
.article-content .quote-block-center p{
  text-align:center;
}
.article-content .divider{
  text-align:center;
  text-indent:0;
  color:var(--text-muted);
  font-size:22px;
  letter-spacing:.22em;
  margin:34px 0;
}
.article-content .no-indent{
  text-indent:0;
}
.article-content .fade,
.article-content .endmark{
  text-align:center;
  text-indent:0;
}
.article-content .fade{
  color:var(--text-muted);
  font-size:14px;
  letter-spacing:.12em;
  margin:44px 0 24px;
}
.article-content .endmark{
  font-size:28px;
  line-height:1;
  margin:28px 0;
}
.article-content table{
  display:block;
  overflow-x:auto;
  border:1px solid var(--border) !important;
  border-radius:12px;
  background:var(--bg-surface-2) !important;
}
.article-content thead,
.article-content tbody,
.article-content tr{background:transparent !important;}
.article-content th{
  background:rgba(0,137,209,0.14) !important;
  color:var(--brand-blue-glow) !important;
  border-bottom:1px solid var(--border-strong) !important;
}
.article-content td{
  background:rgba(13,27,44,0.78) !important;
  color:var(--text-secondary) !important;
}
.article-content tr + tr td{border-top:1px solid var(--border) !important;}
.article-content code,
.article-content pre{
  background:rgba(0,137,209,0.12) !important;
  color:var(--text-primary) !important;
  border:1px solid var(--border) !important;
}
.article-content hr{border-color:var(--border) !important;}
.article-content .has-white-background-color,
.article-content .has-very-light-gray-background-color,
.article-content .has-cyan-bluish-gray-background-color,
.article-content .has-pale-pink-background-color,
.article-content .has-luminous-vivid-amber-background-color,
.article-content .has-luminous-vivid-orange-background-color,
.article-content .has-light-green-cyan-background-color,
.article-content .has-pale-cyan-blue-background-color{
  background:linear-gradient(180deg,rgba(13,27,44,0.98),rgba(8,19,31,0.98)) !important;
  color:var(--text-primary) !important;
}
.article-content .has-black-color,
.article-content .has-very-dark-gray-color{
  color:var(--text-primary) !important;
}
.article-content .has-white-color,
.article-content .has-very-light-gray-color{
  color:#f7fbff !important;
}

/* ---------- Mood poster template ---------- */
.mood-template-shell{padding:28px 0 64px;}
.related-row{
  display:flex;
  gap:8px;
  overflow-x:auto;
  scrollbar-width:none;
  justify-content:center;
  background:rgba(13,27,44,0.82);
  border:1px solid var(--border);
  border-radius:14px;
  padding:8px;
  margin:0 auto 22px;
  width:max-content;
  max-width:100%;
}
.related-row::-webkit-scrollbar{display:none;}
.mood-related-row{padding:8px;}
.related-chip{
  font-size:12px;
  color:var(--text-secondary);
  background:transparent;
  border:0;
  padding:8px 14px;
  border-radius:10px;
  white-space:nowrap;
  font-family:var(--font-mono);
}
.related-chip:hover{color:var(--text-primary);background:rgba(17,35,58,0.9);}
.related-chip.active{color:#04141F;background:linear-gradient(135deg,var(--brand-blue),var(--accent-teal));font-weight:700;}
.mood-template-head{margin:0 0 22px;text-align:left;}
.mood-archive-head{margin-bottom:24px;}
.mood-template-title{font-family:var(--font-head);font-size:clamp(24px,2.6vw,34px);line-height:1.2;margin:8px 0;}
.mood-template-title span{color:var(--accent-teal);}
.mood-template-sub{max-width:620px;color:var(--text-secondary);font-size:13px;line-height:1.75;}
.mood-poster-layout{
  display:grid;grid-template-columns:minmax(280px,420px) minmax(0,1fr);gap:24px;align-items:start;margin-bottom:34px;
}
.mood-poster-layout-simple{
  display:flex;
  justify-content:center;
}
.mood-poster-layout-simple .mood-poster-frame{
  width:min(100%,420px);
}
.mood-poster-frame{
  background:
    linear-gradient(180deg,var(--mood-soft),transparent 52%),
    linear-gradient(180deg,rgba(13,27,44,0.98),rgba(8,19,31,0.98));
  border:1px solid var(--mood-border);
  border-radius:8px;
  padding:12px;
  box-shadow:0 18px 42px rgba(0,0,0,0.28), 0 0 0 1px var(--mood-border);
}
.mood-poster-frame,
.mood-web-poster,
.mood-archive-poster{
  --mood-accent:#00C2D6;
  --mood-soft:rgba(0,194,214,0.14);
  --mood-border:rgba(0,194,214,0.42);
}
.mood-tone-alert{--mood-accent:#FF5C6C;--mood-soft:rgba(255,92,108,0.14);--mood-border:rgba(255,92,108,0.44);}
.mood-tone-warm{--mood-accent:#FFA351;--mood-soft:rgba(255,163,81,0.14);--mood-border:rgba(255,163,81,0.44);}
.mood-tone-cold{--mood-accent:#29AEFF;--mood-soft:rgba(41,174,255,0.14);--mood-border:rgba(41,174,255,0.44);}
.mood-tone-positive{--mood-accent:#17C97F;--mood-soft:rgba(23,201,127,0.14);--mood-border:rgba(23,201,127,0.44);}
.mood-tone-neutral{--mood-accent:#00C2D6;--mood-soft:rgba(0,194,214,0.14);--mood-border:rgba(0,194,214,0.42);}
.mood-web-poster{
  width:100%;aspect-ratio:4/5;border-radius:7px;
  background:
    linear-gradient(90deg,transparent 49.8%,var(--mood-soft) 50%,transparent 50.2%),
    linear-gradient(180deg,var(--mood-soft),transparent 34%),
    linear-gradient(180deg,#0D1B2C,#060D17 74%);
  color:var(--text-primary);
  border:1px solid var(--mood-border);
  display:grid;grid-template-rows:auto auto auto auto minmax(0,1fr) auto;
  align-items:center;text-align:center;padding:26px 26px 22px;
  overflow:hidden;gap:10px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,0.03);
  transition:aspect-ratio .18s ease;
}
.mood-web-poster.is-square{aspect-ratio:1/1;}
.mood-web-poster-main{
  aspect-ratio:auto;
  min-height:520px;
  grid-template-rows:auto auto auto auto auto auto;
}
.mood-web-kicker,
.mood-web-date,
.mood-web-state,
.mood-web-brand{font-family:var(--font-mono);color:var(--text-muted);}
.mood-web-kicker{font-size:10px;letter-spacing:0;font-weight:700;text-transform:uppercase;}
.mood-web-date{font-size:12px;letter-spacing:0;font-weight:700;color:var(--brand-ice);}
.mood-web-state{
  justify-self:center;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:72px;
  border-radius:999px;
  padding:6px 13px;
  background:var(--mood-soft);
  border:1px solid var(--mood-accent);
  color:var(--mood-accent);
  font-size:12px;
  font-weight:800;
}
.mood-web-rule{width:82px;height:1px;background:var(--mood-accent);opacity:.42;margin:0 auto;}
.mood-web-poster blockquote{
  margin:0;color:var(--text-primary);font-family:var(--font-head);font-weight:800;
  font-size:clamp(18px,1.85vw,23px);line-height:1.44;letter-spacing:0;
  max-width:100%;overflow-wrap:anywhere;word-break:normal;text-wrap:balance;
  align-self:center;
  display:-webkit-box;
  -webkit-line-clamp:8;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.mood-web-poster-main blockquote{
  display:block;
  overflow:visible;
  -webkit-line-clamp:unset;
  font-size:clamp(18px,1.65vw,23px);
}
.mood-web-brand{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:10px;letter-spacing:0;}
.mood-web-brand img{width:26px;height:26px;object-fit:contain;}
.mood-original-link{
  display:block;text-align:center;margin-top:10px;font-size:11px;color:var(--text-muted);
}
.mood-original-link:hover{color:var(--brand-blue-glow);}
.mood-poster-image{
  width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:7px;background:var(--bg-surface-2);
}
.mood-poster-placeholder{
  aspect-ratio:4/5;border-radius:7px;background:var(--bg-surface-2);color:var(--text-primary);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:36px;gap:28px;
}
.mood-poster-placeholder span{color:var(--text-muted);font-size:13px;}
.mood-poster-placeholder strong{font-size:28px;line-height:1.55;font-weight:700;}
.mood-poster-panel{display:flex;flex-direction:column;gap:14px;}
.mood-status-card{
  background:var(--bg-surface);border:1px solid var(--border);border-radius:16px;padding:22px;
}
.mood-status-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;color:var(--text-muted);font-size:12px;}
.mood-status-badge{
  display:inline-flex;align-items:center;color:#04141F;background:linear-gradient(135deg,var(--brand-blue),var(--accent-teal));
  border-radius:999px;padding:5px 12px;font-weight:700;font-size:12px;
}
.mood-status-quote{font-size:23px;line-height:1.55;font-weight:700;color:var(--text-primary);font-family:var(--font-head);}
.mood-status-source{font-size:12px;color:var(--text-muted);font-family:var(--font-mono);margin-top:18px;}
.mood-mini-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.mood-mini-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:12px;padding:14px;}
.mood-mini-card span{display:block;font-family:var(--font-mono);font-size:10px;color:var(--text-muted);margin-bottom:6px;}
.mood-mini-card strong{display:block;font-size:18px;font-family:var(--font-head);color:var(--brand-ice);}
.mood-mini-card em{display:block;font-style:normal;font-size:11px;color:var(--text-muted);margin-top:2px;}
.mood-heat-section{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0;}
.heat-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px;}
.heat-title{font-size:12px;color:var(--text-secondary);display:flex;align-items:center;gap:8px;margin-bottom:12px;font-weight:600;}
.heat-title .dot{width:8px;height:8px;border-radius:50%;}
.heat-title.hot .dot{background:var(--accent-orange);box-shadow:0 0 6px rgba(255,163,81,0.6);}
.heat-title.cold .dot{background:var(--accent-teal);box-shadow:0 0 6px rgba(0,194,214,0.6);}
.heat-tags{display:flex;gap:8px;flex-wrap:wrap;}
.heat-tag{font-size:11.5px;padding:5px 10px;border-radius:999px;font-family:var(--font-mono);}
.heat-tag.hot{background:rgba(255,163,81,0.12);color:var(--accent-orange);border:1px solid rgba(255,163,81,0.28);}
.heat-tag.cold{background:rgba(0,194,214,0.1);color:var(--accent-teal);border:1px solid rgba(0,194,214,0.25);}
.mood-actions{display:flex;align-items:center;gap:8px;}
.mood-actions-simple{justify-content:center;margin-top:10px;flex-wrap:wrap;}
.mood-publish-tools{padding-top:12px;}
.mood-format-switch{
  width:100%;height:34px;display:grid;grid-template-columns:1fr 1fr;padding:3px;
  background:#08131F;border:1px solid var(--border);border-radius:8px;
}
.mood-format-switch button,
.mood-tool-btn{
  appearance:none;border:0;cursor:pointer;font:700 11px var(--font-head);letter-spacing:0;
}
.mood-format-switch button{
  border-radius:5px;background:transparent;color:var(--text-muted);
}
.mood-format-switch button.active{
  background:var(--bg-elevated);color:var(--text-primary);box-shadow:inset 0 0 0 1px var(--border-strong);
}
.mood-tool-btn{
  min-height:34px;padding:0 12px;border-radius:7px;border:1px solid var(--border);
  background:var(--bg-surface-2);color:var(--text-secondary);
}
.mood-tool-btn:hover{border-color:var(--border-strong);color:var(--text-primary);}
.mood-tool-btn.primary{background:var(--brand-blue);border-color:var(--brand-blue);color:#fff;}
.mood-tool-btn:disabled{cursor:wait;opacity:.6;}
.mood-social-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:8px;}
.mood-social-btn{
  min-height:32px;padding:0 10px;border-radius:999px;border:1px solid var(--border);
  background:rgba(12,28,44,.72);color:var(--text-secondary);display:inline-flex;align-items:center;justify-content:center;
  font:700 11px var(--font-head);text-decoration:none;letter-spacing:0;cursor:pointer;
}
.mood-social-btn:hover{border-color:var(--border-strong);color:var(--text-primary);}
.mood-social-btn.primary{background:var(--brand-blue);border-color:var(--brand-blue);color:#fff;}
.mood-tool-status{min-height:18px;margin:7px 0 0;text-align:center;font-size:10.5px;color:var(--text-muted);}
.mood-history-section{margin-top:8px;}
.mood-history-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
.mood-history-card{
  background:
    linear-gradient(180deg,var(--mood-soft),transparent 58%),
    rgba(13,27,44,0.82);
  border:1px solid var(--mood-border);
  border-radius:8px;padding:7px;color:var(--text-secondary);
  display:flex;flex-direction:column;gap:0;min-width:0;min-height:0;overflow:hidden;
}
.mood-history-card:hover,.mood-history-card.active{
  border-color:var(--mood-accent);
  color:var(--text-primary);
  box-shadow:0 0 0 1px var(--mood-border), 0 16px 34px rgba(0,0,0,.24);
}
.mood-history-card .mood-archive-poster,
.mood-history-card .mood-web-poster{width:100%;}
.mood-history-thumb{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:7px;background:var(--bg-surface-2);}
.mood-history-card span{font-size:10.5px;color:var(--text-muted);}
.mood-history-card strong{font-size:12px;color:var(--brand-blue-glow);}
.mood-history-card p{
  font-size:11px;line-height:1.45;color:var(--text-secondary);margin:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.mood-web-poster-archive{
  aspect-ratio:4/5;
  padding:15px 12px 12px;
  gap:6px;
  border-radius:7px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,0.02);
}
.mood-web-poster-archive .mood-web-kicker{
  font-size:8.5px;
}
.mood-web-poster-archive .mood-web-date{
  font-size:10px;
}
.mood-web-poster-archive .mood-web-state{
  min-width:58px;
  padding:4px 9px;
  font-size:10.5px;
}
.mood-web-poster-archive .mood-web-rule{
  width:58px;
}
.mood-web-poster-archive blockquote{
  display:-webkit-box;
  overflow:hidden;
  font-size:clamp(12px,1.05vw,15px);
  line-height:1.38;
  -webkit-line-clamp:7;
  -webkit-box-orient:vertical;
}
.mood-web-poster-archive .mood-web-brand{
  gap:4px;
  font-size:8.5px;
}
.mood-web-poster-archive .mood-web-brand img{
  width:18px;
  height:18px;
}
.mood-archive-poster{
  aspect-ratio:4/5;
  border-radius:7px;
  border:1px solid rgba(53,136,189,0.28);
  background:
    linear-gradient(90deg,transparent 49.7%,rgba(53,136,189,0.06) 50%,transparent 50.3%),
    linear-gradient(180deg,var(--mood-soft),transparent 36%),
    linear-gradient(145deg,#0D1B2C,#08131F 70%);
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr) auto;
  align-items:center;
  text-align:center;
  padding:13px 11px 11px;
  gap:8px;
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,0.02);
}
.mood-archive-date,
.mood-archive-brand{
  font-family:var(--font-mono);
  letter-spacing:0;
  color:var(--text-muted) !important;
  font-size:9.5px !important;
}
.mood-archive-state{
  display:inline-flex;
  border-radius:999px;
  padding:4px 9px;
  background:var(--mood-soft);
  border:1px solid var(--mood-accent);
  color:var(--mood-accent) !important;
  font-size:11px !important;
  font-weight:700;
}
.mood-archive-poster strong{
  color:var(--text-primary);
  font-family:var(--font-head);
  font-size:clamp(12px,1.05vw,15px);
  line-height:1.4;
  max-width:100%;
  overflow-wrap:anywhere;
  align-self:center;
  display:-webkit-box;
  -webkit-line-clamp:7;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.mood-history-grid-archive .mood-history-card{
  min-height:0;
}

@media (max-width:900px){
  .mood-poster-layout{grid-template-columns:1fr;}
  .mood-poster-frame{max-width:440px;margin:0 auto;width:100%;}
  .mood-mini-grid,.mood-heat-section{grid-template-columns:1fr;}
  .mood-history-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .mood-status-quote{font-size:19px;}
}

@media (max-width:640px){
  .mood-history-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media (max-width:520px){
  .mood-template-shell{padding-top:20px;}
  .mood-web-poster{padding:22px 18px 18px;gap:8px;}
  .mood-web-poster blockquote{font-size:clamp(17px,5vw,21px);line-height:1.42;-webkit-line-clamp:8;}
  .mood-web-poster-main{min-height:0;}
  .mood-web-poster-main blockquote{display:block;overflow:visible;-webkit-line-clamp:unset;font-size:clamp(16px,5vw,20px);}
  .mood-web-state{font-size:11px;padding:5px 11px;}
  .mood-actions-simple{display:grid;grid-template-columns:1fr 1fr;}
  .mood-tool-btn:last-child{grid-column:1/-1;}
  .mood-web-poster-archive{padding:11px 8px 9px;gap:5px;}
  .mood-web-poster-archive .mood-web-kicker{font-size:7.5px;}
  .mood-web-poster-archive .mood-web-date{font-size:9px;}
  .mood-web-poster-archive .mood-web-state{font-size:9.5px;padding:3px 8px;}
  .mood-web-poster-archive blockquote{font-size:12px;line-height:1.34;-webkit-line-clamp:7;}
  .mood-web-poster-archive .mood-web-brand{font-size:7.5px;}
  .mood-web-poster-archive .mood-web-brand img{width:16px;height:16px;}
  .mood-archive-poster{padding:11px 8px 9px;gap:6px;}
  .mood-archive-poster strong{font-size:12px;line-height:1.34;-webkit-line-clamp:7;}
}

/* ---------- publish article components ---------- */
.whyowl-article{
  --panel:#0e1727;
  --panel-2:#121d31;
  --line:#28364b;
  --soft:#c9d4e2;
  --muted:#93a4ba;
  --blue:#59c7ff;
  --cyan:#32e6c8;
  --amber:#f5b84b;
  --red:#ff6b6b;
  --green:#73e28a;
  --mono:var(--font-mono);
  color:var(--text-primary);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.78;
  letter-spacing:0;
}
.article-content .whyowl-article p,
.article-content .whyowl-article li,
.article-content .whyowl-article td{
  color:#dce7f4;
  font-size:16px;
  line-height:1.78;
}
.article-content .whyowl-article .lead{
  color:var(--text-primary);
  font-size:17px;
}
.article-content .whyowl-article h2{
  color:var(--text-primary) !important;
  font-family:var(--font-head);
  font-size:24px;
  line-height:1.28;
  letter-spacing:0;
  margin:34px 0 14px;
}
.article-content .whyowl-article h3{
  color:var(--text-primary) !important;
  font-family:var(--font-head);
  font-size:19px;
  line-height:1.28;
  letter-spacing:0;
  margin:28px 0 12px;
}
.article-content .whyowl-article .hero-image{
  border:1px solid rgba(148,163,184,0.20);
  border-radius:8px;
  background:#07101b;
  margin:4px 0 22px;
  overflow:hidden;
}
.article-content .whyowl-article .hero-image img{
  display:block;
  width:100%;
  height:auto;
}
.article-content .whyowl-article .chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 16px;
}
.article-content .whyowl-article .chip{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  border:1px solid rgba(89,199,255,0.34);
  border-radius:7px;
  background:rgba(89,199,255,0.08);
  color:var(--blue);
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1;
  padding:4px 8px;
}
.article-content .whyowl-article .hook{
  border-left:3px solid var(--cyan);
  border-radius:0 8px 8px 0;
  background:rgba(50,230,200,0.07);
  padding:15px 16px;
  margin:18px 0;
  color:#dce7f4;
}
.article-content .whyowl-article .hook b{
  color:var(--cyan);
}
.article-content .whyowl-article .news-hook{
  border-left:3px solid var(--cyan);
  border-radius:0 8px 8px 0;
  background:rgba(50,230,200,0.07);
  padding:15px 16px;
  margin:18px 0;
  color:#dce7f4;
}
.article-content .whyowl-article .news-hook b{
  color:var(--cyan);
}
.article-content .whyowl-article .quote{
  border:1px solid rgba(245,184,75,0.28);
  border-radius:8px;
  background:rgba(245,184,75,0.08);
  padding:16px 18px;
  margin:20px 0;
}
.article-content .whyowl-article .quote .q{
  color:#f6ddb3;
  font-size:17px;
  font-weight:750;
  line-height:1.65;
}
.article-content .whyowl-article .quote .src{
  color:var(--muted);
  font-family:var(--font-mono);
  font-size:12px;
  margin-top:8px;
}
.article-content .whyowl-article .quote-box{
  border:1px solid rgba(245,184,75,0.28);
  border-radius:8px;
  background:rgba(245,184,75,0.08);
  padding:16px 18px;
  margin:20px 0;
}
.article-content .whyowl-article .quote-box .q{
  color:#f6ddb3;
  font-size:15px;
  font-weight:750;
  line-height:1.72;
}
.article-content .whyowl-article .quote-box .src{
  color:var(--muted);
  font-family:var(--font-mono);
  font-size:12px;
  margin-top:8px;
}
.article-content .whyowl-article .viz{
  border:1px solid rgba(148,163,184,0.2);
  border-radius:8px;
  background:linear-gradient(180deg,rgba(17,27,45,0.92),rgba(10,16,28,0.94));
  padding:18px;
  margin:22px 0;
  overflow:hidden;
}
.article-content .whyowl-article .viz-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}
.article-content .whyowl-article .viz-head strong{
  color:var(--text-primary);
  font-size:15px;
}
.article-content .whyowl-article .viz-head span{
  color:var(--muted);
  font-family:var(--font-mono);
  font-size:11px;
  text-align:right;
}
.article-content .whyowl-article .bar{
  display:grid;
  grid-template-columns:145px minmax(0,1fr) 84px;
  gap:12px;
  align-items:center;
  margin:11px 0;
}
.article-content .whyowl-article .bar label{
  color:var(--soft);
  font-size:13px;
}
.article-content .whyowl-article .bar span{
  color:var(--text-primary);
  font-family:var(--font-mono);
  font-size:13px;
  text-align:right;
}
.article-content .whyowl-article .track{
  height:18px;
  border:1px solid rgba(148,163,184,0.16);
  border-radius:999px;
  background:#0a1020;
  overflow:hidden;
}
.article-content .whyowl-article .fill{
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,var(--cyan),var(--blue));
  box-shadow:0 0 16px rgba(50,230,200,0.25);
}
.article-content .whyowl-article .viz-caption{
  color:var(--muted);
  font-size:12px;
  line-height:1.62;
  margin:12px 0 0;
}
.article-content .whyowl-article .metric-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin:20px 0;
}
.article-content .whyowl-article .metric-card{
  min-height:118px;
  border:1px solid rgba(148,163,184,0.18);
  border-radius:8px;
  background:linear-gradient(180deg,rgba(17,27,45,0.82),rgba(10,16,28,0.92));
  padding:14px;
}
.article-content .whyowl-article .metric-card .k{
  display:block;
  color:var(--muted);
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.2;
  text-transform:uppercase;
}
.article-content .whyowl-article .metric-card .v{
  display:block;
  color:var(--text-primary);
  font-family:var(--font-mono);
  font-size:24px;
  font-weight:850;
  line-height:1.2;
  margin:8px 0 7px;
}
.article-content .whyowl-article .metric-card .d{
  display:block;
  color:var(--muted);
  font-size:12.5px;
  line-height:1.58;
}
.article-content .whyowl-article .grid3,
.article-content .whyowl-article .grid4{
  display:grid;
  gap:12px;
  margin:18px 0;
}
.article-content .whyowl-article .grid3{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.article-content .whyowl-article .grid4{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.article-content .whyowl-article .card{
  min-height:112px;
  border:1px solid rgba(148,163,184,0.18);
  border-radius:8px;
  background:rgba(15,23,42,0.68);
  padding:14px;
}
.article-content .whyowl-article .card b{
  display:block;
  color:var(--text-primary);
  margin-bottom:7px;
}
.article-content .whyowl-article .card span,
.article-content .whyowl-article .card .d{
  color:var(--muted);
  font-size:13px;
}
.article-content .whyowl-article .card .k{
  color:var(--muted);
  font-family:var(--font-mono);
  font-size:11px;
  text-transform:uppercase;
}
.article-content .whyowl-article .card .v{
  color:var(--text-primary);
  font-family:var(--font-mono);
  font-size:26px;
  font-weight:850;
  line-height:1.2;
  margin-top:7px;
}
.article-content .whyowl-article .humanoid{
  display:block;
  width:100%;
  max-width:860px;
  margin:0 auto;
  border:1px solid rgba(148,163,184,0.18);
  border-radius:8px;
  background:#070b12;
}
.article-content .whyowl-article .flow{
  display:grid;
  grid-template-columns:repeat(5,minmax(135px,1fr));
  gap:10px;
  overflow-x:auto;
  padding-bottom:4px;
}
.article-content .whyowl-article .scenario{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.article-content .whyowl-article .scenario .up{
  border-color:rgba(115,226,138,0.35);
}
.article-content .whyowl-article .scenario .down{
  border-color:rgba(255,107,107,0.35);
}
.article-content .whyowl-article .step{
  position:relative;
  min-height:118px;
  border:1px solid rgba(148,163,184,0.2);
  border-radius:8px;
  background:rgba(15,23,42,0.7);
  padding:14px;
}
.article-content .whyowl-article .step:not(:last-child)::after{
  content:"";
  position:absolute;
  right:-9px;
  top:50%;
  width:8px;
  height:1px;
  background:#3a4b66;
}
.article-content .whyowl-article .step b{
  display:block;
  color:var(--amber);
  margin-bottom:8px;
}
.article-content .whyowl-article .step span{
  color:var(--muted);
  font-size:13px;
}
.article-content .whyowl-article table{
  width:100%;
  border:1px solid rgba(148,163,184,0.18);
  border-collapse:collapse;
  margin:18px 0;
  font-size:14px;
}
.article-content .whyowl-article th,
.article-content .whyowl-article td{
  border-bottom:1px solid rgba(148,163,184,0.14) !important;
  padding:11px 12px;
  text-align:left;
  vertical-align:top;
}
.article-content .whyowl-article th{
  background:rgba(15,23,42,0.76) !important;
  color:var(--muted) !important;
  font-family:var(--font-mono);
  font-size:12px;
}
.article-content .whyowl-article td{
  color:#dbe6f4 !important;
}
.article-content .whyowl-article .sources{
  border-top:1px solid rgba(148,163,184,0.18);
  margin-top:34px;
  padding-top:18px;
}
.article-content .whyowl-article .sources li{
  color:var(--muted);
  font-size:14px;
  margin:6px 0;
}
.article-content .whyowl-article .amber{color:var(--amber);}
.article-content .whyowl-article .cyan{color:var(--cyan);}
.article-content .whyowl-article .green{color:var(--green);}
.article-content .whyowl-article .blue{color:var(--blue);}
.article-content .whyowl-article .red{color:var(--red);}
.article-content .whyowl-article svg{
  display:block;
  width:100%;
  height:auto;
}
.article-content .whyowl-article svg text{
  font-family:var(--font-mono);
}

@media (max-width:900px){
  .article-content .whyowl-article .viz-head{
    display:block;
  }
  .article-content .whyowl-article .viz-head span{
    display:block;
    margin-top:4px;
    text-align:left;
  }
  .article-content .whyowl-article .grid3,
  .article-content .whyowl-article .grid4,
  .article-content .whyowl-article .metric-grid,
  .article-content .whyowl-article .scenario{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .article-content .whyowl-article .bar{
    grid-template-columns:1fr;
  }
  .article-content .whyowl-article .bar span{
    text-align:left;
  }
}

@media (max-width:520px){
  .article-content .whyowl-article p,
  .article-content .whyowl-article li,
  .article-content .whyowl-article td{
    font-size:15px;
  }
  .article-content .whyowl-article .lead{
    font-size:16px;
  }
  .article-shell .article-title{
    font-size:28px;
    line-height:1.22;
  }
  .article-content .whyowl-article h2{
    font-size:21px;
  }
  .article-content .whyowl-article h3{
    font-size:18px;
  }
  .article-content .whyowl-article .viz,
  .article-content .whyowl-article .quote,
  .article-content .whyowl-article .quote-box,
  .article-content .whyowl-article .hook,
  .article-content .whyowl-article .news-hook{
    padding:14px;
  }
  .article-content .whyowl-article .flow{
    grid-template-columns:repeat(5,155px);
  }
  .article-content .whyowl-article .metric-grid,
  .article-content .whyowl-article .grid3,
  .article-content .whyowl-article .grid4,
  .article-content .whyowl-article .scenario{
    grid-template-columns:1fr;
  }
}