:root{
  --bg:#0f1724;
  --card:#0b1220;
  --muted:#94a3b8;
  --accent:#06b6d4;
  --text:#e6eef8;
  --glass: rgba(255,255,255,0.03);
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; background:linear-gradient(180deg,#071027 0%, #071a2a 60%);color:var(--text);line-height:1.45}
.container{max-width:980px;margin:0 auto;padding:1rem}
.site-header{backdrop-filter: blur(6px);background:linear-gradient(180deg, rgba(255,255,255,0.02), transparent);border-bottom:1px solid rgba(255,255,255,0.03)}
.site-header .container{display:flex;align-items:center;justify-content:space-between;padding:0.75rem 1rem}

/* Make the header area feel like a soft black canvas and style the logo */
.site-header .container.header-inner{background: rgba(3,6,10,0.8); padding:0.5rem 1rem; border-radius:10px}
.brand{display:inline-block;padding:0.25rem 0.8rem;border-radius:6px;background:rgba(0,0,0,0.6)}
.brand .logo{color:#ffffff; font-weight:900; font-size:1.6rem; letter-spacing:0.06em; text-transform:uppercase}
.brand{font-weight:700;color:var(--text);text-decoration:none;font-size:1.1rem}
.logo{font-weight:800;letter-spacing:0.02em;color:#ffffff;font-family:Inter,system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial}
.nav a{color:var(--muted);text-decoration:none;margin-left:1rem}
.nav a:hover{color:var(--text)}
.main{padding:2rem 1rem}
.hero{padding:2rem;background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));border-radius:12px;margin-bottom:1rem}
.hero h1{margin:0 0 0.3rem 0;font-size:2rem}
.lede{color:var(--muted);margin-top:0}
.actions .btn{display:inline-block;padding:0.5rem 0.9rem;border-radius:8px;background:var(--accent);color:#05222a;text-decoration:none;font-weight:600;margin-right:0.5rem}
.actions .btn.ghost{background:transparent;color:var(--text);border:1px solid rgba(255,255,255,0.04)}
.panel{padding:1rem;margin:1rem 0;background:var(--glass);border-radius:10px;border:1px solid rgba(255,255,255,0.03)}
.muted{color:var(--muted)}
.small{font-size:0.9rem}
.feed-list{list-style:none;padding:0;margin:0}
.feed-item{padding:0.6rem 0;border-bottom:1px dashed rgba(255,255,255,0.03)}
.feed-item:last-child{border-bottom:none}
.feed-title{font-weight:600;color:var(--text);text-decoration:none}
.feed-title:hover{text-decoration:underline}
.feed-meta{color:var(--muted);font-size:0.9rem;margin-top:0.25rem}
.feed-desc{color:var(--muted);font-size:0.95rem;margin-top:0.5rem}
.site-footer{padding:1.2rem 0;color:var(--muted);border-top:1px solid rgba(255,255,255,0.02);margin-top:3rem}
code{background:rgba(255,255,255,0.03);padding:0.1rem 0.3rem;border-radius:4px}

/* Layout for homepage */
.layout{display:grid;grid-template-columns:1fr 360px;gap:1rem;align-items:start}
.left{min-height:280px}
.right .panel{margin-bottom:1rem}
.placeholder-rect{height:140px;border-radius:8px;background:linear-gradient(180deg, rgba(255,255,255,0.01), rgba(255,255,255,0.02));display:flex;align-items:center;justify-content:center;color:var(--muted);border:1px dashed rgba(255,255,255,0.03)}

/* Simple ticker scroller */
.ticker-wrap{overflow:hidden}
.ticker{display:flex;gap:2rem;white-space:nowrap;animation:scroll 16s linear infinite}
.ticker-item{color:var(--text);font-weight:700}
@keyframes scroll{from{transform:translateX(0%)}to{transform:translateX(-50%)}}

@media (max-width:900px){
  .container{padding:0.75rem}
  .layout{grid-template-columns:1fr;}
  .right{order:2}
  .left{order:1}
}

@media (max-width:640px){
  .hero h1{font-size:1.6rem}
  .site-header .container{padding:0.5rem}
}

/* Monitor page styles */
.monitor-section{padding:1.25rem 1rem}
.monitor-table{width:100%;border-collapse:collapse;margin-top:0.75rem}
.monitor-table th,.monitor-table td{border:1px solid rgba(255,255,255,0.04);padding:0.6rem;text-align:left}
.monitor-table th{background:rgba(255,255,255,0.03);color:var(--muted)}
.monitor-table tr:nth-child(even){background:rgba(255,255,255,0.01)}
.monitor-note{color:var(--muted);font-size:0.95rem;margin-top:0.75rem}

/* Tag styles aligned with main theme */
.tag{display:inline-block;padding:0.2rem 0.5rem;border-radius:6px;font-size:0.9rem}
.accumulating{background:#123218;color:#9fe7b6}
.momentum{background:#3b3a1e;color:#ffd37a}
.overextended{background:#401a1a;color:#ffb6b6}

@media (max-width:700px){
  .monitor-table th,.monitor-table td{font-size:0.95rem;padding:0.5rem}
}