@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=IBM+Plex+Mono:wght@400;500&display=swap');

  :root{
    --paper:#f7f6f2;
    --ink:#17181a;
    --ink-soft:#4a4c50;
    --rule:#d8d6cf;
    --wire-red:#c8102e;
    --tag-bg:#eceae2;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:'Barlow Condensed', sans-serif;
  }

  ::selection{background:var(--wire-red);color:#fff;}

  a{color:inherit;text-decoration:none;}

  /* ---------- Masthead ---------- */
  .masthead{
    border-bottom:3px solid var(--ink);
    padding:14px 20px 10px;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:8px;
  }
  .logo{
    font-weight:800;
    font-size:clamp(28px,5vw,40px);
    letter-spacing:0.5px;
    line-height:1;
  }
  .logo span{color:var(--wire-red);}
  .masthead-meta{
    font-family:'IBM Plex Mono', monospace;
    font-size:12px;
    color:var(--ink-soft);
    text-align:right;
  }

  /* ---------- Ticker (signature element) ---------- */
  .ticker{
    border-bottom:1px solid var(--ink);
    background:var(--ink);
    color:var(--paper);
    overflow:hidden;
    white-space:nowrap;
    position:relative;
  }
  .ticker::before{
    content:"LIVE";
    position:absolute;
    left:0;top:0;bottom:0;
    background:var(--wire-red);
    color:#fff;
    font-family:'IBM Plex Mono',monospace;
    font-size:11px;
    font-weight:500;
    display:flex;
    align-items:center;
    padding:0 10px;
    letter-spacing:1px;
    z-index:2;
  }
  .ticker-track{
    display:inline-block;
    padding-left:70px;
    font-family:'IBM Plex Mono', monospace;
    font-size:13px;
    animation:scroll-left 45s linear infinite;
  }
  .ticker-track span{margin-right:48px;color:#c9c8c2;}
  .ticker-track span b{color:#fff;font-weight:500;}
  @keyframes scroll-left{
    from{transform:translateX(0);}
    to{transform:translateX(-50%);}
  }
  @media (prefers-reduced-motion: reduce){
    .ticker-track{animation:none;}
  }

  /* ---------- Category nav ---------- */
  .catnav{
    display:flex;
    gap:0;
    flex-wrap:wrap;
    border-bottom:1px solid var(--rule);
    background:var(--paper);
    position:sticky;
    top:0;
    z-index:10;
  }
  .catnav button{
    font-family:'IBM Plex Mono', monospace;
    font-size:12.5px;
    background:none;
    border:none;
    border-right:1px solid var(--rule);
    padding:11px 14px;
    cursor:pointer;
    color:var(--ink-soft);
    letter-spacing:0.3px;
  }
  .catnav button:hover{color:var(--ink);background:var(--tag-bg);}
  .catnav button.active{
    color:#fff;
    background:var(--ink);
  }
  .catnav button .count{
    color:inherit;
    opacity:0.55;
    margin-left:5px;
  }

  /* ---------- Headline list ---------- */
  main{max-width:920px;margin:0 auto;padding:0 20px 60px;}

  .day-divider{
    font-family:'IBM Plex Mono', monospace;
    font-size:11px;
    color:var(--ink-soft);
    text-transform:uppercase;
    letter-spacing:1.5px;
    padding:18px 0 6px;
    border-bottom:1px solid var(--rule);
    margin-bottom:0;
  }

  .headline-row{
    display:grid;
    grid-template-columns:64px 90px 1fr;
    gap:14px;
    align-items:baseline;
    padding:11px 0;
    border-bottom:1px solid var(--rule);
    transition:background 0.12s ease;
  }
  .headline-row:hover{background:var(--tag-bg);}
  .headline-row:hover .headline-text{color:var(--wire-red);}

  .time{
    font-family:'IBM Plex Mono', monospace;
    font-size:12px;
    color:var(--ink-soft);
  }
  .tag{
    font-family:'IBM Plex Mono', monospace;
    font-size:10.5px;
    text-transform:uppercase;
    letter-spacing:0.5px;
    color:var(--ink-soft);
    background:var(--tag-bg);
    padding:3px 6px;
    border-radius:2px;
    width:fit-content;
    white-space:nowrap;
  }
  .headline-text{
    font-size:19px;
    font-weight:600;
    line-height:1.25;
    color:var(--ink);
  }
  .headline-row.breaking .tag{
    background:var(--wire-red);
    color:#fff;
  }
  .headline-row.breaking .headline-text{font-weight:700;}

  @media (max-width:600px){
    .headline-row{grid-template-columns:1fr;gap:4px;padding:12px 0;}
    .time{order:1;}
    .tag{order:2;}
    .headline-text{order:3;font-size:18px;}
    .logo{font-size:30px;}
  }

  footer{
    border-top:3px solid var(--ink);
    padding:16px 20px 40px;
    font-family:'IBM Plex Mono', monospace;
    font-size:11px;
    color:var(--ink-soft);
    max-width:920px;
    margin:0 auto;
  }

  .empty{
    padding:40px 0;
    font-family:'IBM Plex Mono', monospace;
    font-size:13px;
    color:var(--ink-soft);
  }