:root{color-scheme:light;--paper:#f7f5ef;--card:#fffdf8;--ink:#20201f;--accent:#862e38;--muted:#62605d;--rule:#d7d3cd;font-family:system-ui,sans-serif;color:var(--ink);background:var(--paper)}
*{box-sizing:border-box}
body{margin:0}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
button,summary{cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.masthead{border-bottom:1px solid var(--rule);background:var(--card)}
.bar,main,footer{max-width:1500px;margin:auto;padding-inline:clamp(14px,3vw,42px)}
.bar{min-height:66px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.brand{display:flex;align-items:center;gap:9px;font:bold clamp(24px,4vw,36px) Georgia,serif;letter-spacing:-.045em}
.brand span{border:1px solid var(--accent);border-radius:50%;color:var(--accent);width:36px;height:36px;display:grid;place-items:center;font-size:24px}
nav{display:flex;align-items:center;gap:clamp(6px,1.8vw,24px)}
details{position:relative}
summary{list-style:none;font-size:13px;font-weight:700;padding:8px 5px;white-space:nowrap}
summary::-webkit-details-marker{display:none}
summary::after{content:' ▾';font-size:10px}
.settings{background:var(--accent);color:white;border-radius:5px;padding-inline:10px}
.menu{z-index:2;position:absolute;right:0;top:calc(100% + 8px);min-width:155px;background:var(--card);border:1px solid var(--rule);padding:11px;box-shadow:0 6px 18px #20201f18;border-radius:5px;font-size:13px}
.menu a,.menu label{display:block;white-space:nowrap;padding:4px 0}
.menu input{accent-color:var(--accent);margin-right:6px}
.menu button,#restore{margin-top:5px;color:var(--accent);background:transparent;border:0;text-decoration:underline;padding:3px;font:inherit}
.about{width:175px}
.about p{margin:5px 0 0}
.edition{display:flex;align-items:baseline;justify-content:space-between;gap:6px 14px;flex-wrap:wrap;margin:16px 0 12px;border-bottom:3px double var(--accent);padding-bottom:6px}
h1,h2{font-family:Georgia,serif;margin:0}
h1{font-size:clamp(26px,4vw,38px);letter-spacing:-.045em}
time,footer{color:var(--muted);font-size:12px}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.card{background:var(--card);border:1px solid var(--rule);border-top:2px solid var(--accent);padding:9px 11px 4px;scroll-margin-top:12px}
h2{font-size:21px;letter-spacing:-.035em;padding-bottom:5px}
ol{margin:0;padding:0;list-style:none;counter-reset:stories}
li{counter-increment:stories;position:relative;padding:6px 0 6px 20px;border-top:1px solid var(--rule)}
li::before{content:counter(stories);position:absolute;left:0;top:7px;color:var(--accent);font:700 12px system-ui}
.headline{font:700 15px/1.22 Georgia,serif;display:block;overflow-wrap:anywhere}
.sources{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.sources a{font-size:10px;font-weight:650;color:var(--accent);background:#f2e5e6;padding:1px 6px;border-radius:12px}
footer{padding-block:14px}
@media(max-width:1020px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){.grid{grid-template-columns:1fr}.brand span{display:none}.bar{min-height:54px}.edition{margin-top:11px}}

/* Keep the paper tint light and deepen it slightly behind each story. */
#politics{--section:#f1f4f8;--row:#e9eef5;--row-alt:#e3eaf3}
#business-finance{--section:#faf6e9;--row:#f5efdc;--row-alt:#f0e9d3}
#arts,#literature{--section:#f6f0e9;--row:#efe6db;--row-alt:#eadfd2}
#music{--section:#faf0f5;--row:#f5e7ef;--row-alt:#f0dfe9}
#sports{--section:#fbf2e8;--row:#f7e9da;--row-alt:#f3e2ce}
#pop-culture{--section:#faf0f2;--row:#f6e7eb;--row-alt:#f1dfe5}
#science{--section:#f0f5ec;--row:#e8f0e2;--row-alt:#e1ebda}
#technology{--section:#f4f0f8;--row:#ede7f3;--row-alt:#e7dfef}
.card{background:var(--section,var(--card))}
.card li{background:var(--row,var(--card));padding-right:6px}
.card li:nth-child(even){background:var(--row-alt,var(--card))}
.card li::before{left:5px}

.brand img{display:block;object-fit:contain;flex:none}
.about-title{display:flex;align-items:center;gap:8px}
.circle-n{display:grid;place-items:center;width:26px;height:26px;border:1px solid var(--accent);border-radius:50%;color:var(--accent);font:bold 17px Georgia,serif}
#technology{--section:#edf5f5;--row:#e3efef;--row-alt:#dbeaea}
#international{--section:#f4f0f8;--row:#ede7f3;--row-alt:#e7dfef}
#sections .section-link{padding:5px 8px;border-radius:4px;background:var(--menu-color);color:#20201f}
#sections .section-link + .section-link{margin-top:3px}
[data-section="politics"]{--menu-color:#bcd3ed}
[data-section="business-finance"]{--menu-color:#ead390}
[data-section="arts"],[data-section="literature"]{--menu-color:#d8b99e}
[data-section="music"]{--menu-color:#e5b4d3}
[data-section="sports"]{--menu-color:#f1c293}
[data-section="pop-culture"]{--menu-color:#e9b1bc}
[data-section="science"]{--menu-color:#bfd6a9}
[data-section="technology"]{--menu-color:#add5d5}
[data-section="international"]{--menu-color:#cfb9e5}
@media(max-width:540px){.brand img{width:40px;height:40px}.brand{gap:5px}}
@media(max-width:420px){
  .bar{flex-wrap:wrap;gap:0 8px;padding-block:5px}
  .bar nav{margin-left:auto}
}