:root { --ink:#10110e; --paper:#f2f0e9; --lime:#d9ff43; --orange:#ff5a36; --muted:#77786e; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial, Helvetica, sans-serif; }
button, a { font:inherit; }
button { color:inherit; }
img { display:block; width:100%; }
main { min-height:100vh; overflow:hidden; }
.view[hidden] { display:none; }
.site-header { height:84px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 3.5vw; border-bottom:1px solid #c8c7bf; background:rgba(242,240,233,.95); position:sticky; top:0; z-index:20; backdrop-filter:blur(12px); }
.brand { display:flex; align-items:center; gap:13px; border:0; background:transparent; text-align:left; cursor:pointer; padding:0; width:max-content; }
.brand-mark { width:40px; height:40px; background:var(--ink); color:var(--lime); display:grid; place-items:center; font-weight:900; letter-spacing:-2px; border-radius:50%; }
.brand strong,.brand small { display:block; }.brand strong { font-size:13px; text-transform:uppercase; letter-spacing:.08em; }.brand small { color:var(--muted); margin-top:3px; font-size:11px; }
nav { display:flex; height:100%; gap:30px; } nav button { border:0; background:transparent; font-size:13px; font-weight:700; cursor:pointer; position:relative; } nav button.active:after { content:""; height:3px; background:var(--orange); position:absolute; left:0; right:0; bottom:0; }
.live { justify-self:end; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }.live i { display:inline-block; width:8px; height:8px; background:#36b36a; border-radius:50%; margin-right:6px; box-shadow:0 0 0 5px rgba(54,179,106,.12); }
.hero { height:calc(100vh - 84px); min-height:620px; position:relative; color:white; background:#222; }.hero>img { height:100%; object-fit:cover; filter:saturate(.82) contrast(1.04); }.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,0,0,.68),rgba(0,0,0,.05) 70%),linear-gradient(0deg,rgba(0,0,0,.45),transparent 55%); }
.hero-top { position:absolute; top:34px; left:3.5vw; right:3.5vw; display:flex; justify-content:space-between; border-top:1px solid rgba(255,255,255,.6); padding-top:12px; font-size:12px; text-transform:uppercase; letter-spacing:.12em; }
.hero-copy { position:absolute; left:3.5vw; bottom:8vh; max-width:780px; }.eyebrow { text-transform:uppercase; letter-spacing:.18em; font-size:11px; font-weight:800; color:var(--lime); margin:0 0 18px; }.eyebrow.dark { color:#5b5c53; }.hero-copy h1,.day-intro h1,.archive-head h1 { font-family:Georgia, 'Times New Roman', serif; font-size:clamp(58px,7.5vw,118px); line-height:.86; letter-spacing:-.055em; font-weight:400; margin:0; }.hero-copy p:not(.eyebrow) { max-width:600px; font-size:18px; line-height:1.5; margin:28px 0; }
.light-button { border:1px solid rgba(255,255,255,.7); background:transparent; color:white; padding:15px 18px; display:flex; gap:40px; align-items:center; cursor:pointer; font-size:13px; font-weight:700; }.light-button:hover { background:white; color:var(--ink); }.weather { position:absolute; right:3.5vw; bottom:8vh; display:flex; gap:14px; align-items:flex-end; }.weather span { font-size:50px; line-height:.8; }.weather small { text-transform:uppercase; line-height:1.4; letter-spacing:.08em; }
.quick-grid { display:grid; grid-template-columns:1.15fr repeat(4,1fr); background:var(--ink); color:white; }.section-label { padding:34px 3.5vw; display:flex; gap:18px; }.section-label span { color:var(--lime); font-size:12px; }.section-label p { margin:0; font-family:Georgia,serif; font-size:22px; line-height:1.05; }.quick-grid>button { min-height:190px; border:0; border-left:1px solid #35362f; background:transparent; color:white; text-align:left; padding:30px; position:relative; cursor:pointer; display:flex; flex-direction:column; justify-content:flex-end; transition:.25s; }.quick-grid>button:hover { background:var(--lime); color:var(--ink); }.quick-grid>button>span:last-child { position:absolute; right:24px; top:25px; font-size:20px; }.quick-icon { position:absolute; left:28px; top:25px; font-size:25px; color:var(--lime); }.quick-grid>button:hover .quick-icon { color:var(--ink); }.quick-grid strong { font-family:Georgia,serif; font-size:24px; font-weight:400; }.quick-grid small { color:#999b91; margin-top:8px; }.quick-grid>button:hover small { color:#494b42; }
.today,.latest,.photo-strip,.day-results { padding:100px 6vw; }.section-heading { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:42px; }.section-heading h2 { font-family:Georgia,serif; font-size:clamp(42px,5vw,76px); letter-spacing:-.04em; margin:0; font-weight:400; }.section-heading>p { text-align:right; font-size:12px; text-transform:uppercase; letter-spacing:.08em; line-height:1.5; }.section-heading>p span { color:var(--muted); }.schedule { border-top:2px solid var(--ink); }.schedule article { min-height:100px; display:grid; grid-template-columns:100px 1.6fr 130px 1fr 40px; align-items:center; border-bottom:1px solid #c8c7bf; gap:22px; }.schedule time { font-size:28px; font-weight:700; }.schedule article div small,.schedule article div strong { display:block; }.schedule article div small { color:var(--orange); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.1em; margin-bottom:7px; }.schedule article div strong { font-family:Georgia,serif; font-size:19px; }.status { font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }.status.running { color:#158c4c; font-weight:700; }.schedule article>b { font-size:13px; }.schedule article button { border:0; background:transparent; font-size:22px; cursor:pointer; }
.latest { background:#deddd5; }.text-link { border:0; background:transparent; font-size:13px; font-weight:700; cursor:pointer; border-bottom:1px solid; padding:0 0 5px; }.story-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:18px; }.lead-story { position:relative; min-height:530px; overflow:hidden; color:white; }.lead-story img { height:100%; object-fit:cover; }.lead-story:after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.75),transparent 65%); }.lead-story div { position:absolute; left:30px; bottom:28px; right:30px; z-index:1; }.lead-story small { color:var(--lime); text-transform:uppercase; letter-spacing:.1em; }.lead-story h3 { font-family:Georgia,serif; font-size:38px; line-height:1; font-weight:400; margin:12px 0; }.lead-story p { margin:0; max-width:480px; }.note,.result-card { min-height:530px; padding:30px; display:flex; flex-direction:column; }.note { background:var(--lime); }.note span { font-size:12px; }.note p { font-family:Georgia,serif; font-size:32px; line-height:1.08; margin:auto 0; }.note small { border-top:1px solid; padding-top:14px; text-transform:uppercase; }.result-card { background:var(--orange); color:white; }.result-card>small { text-transform:uppercase; letter-spacing:.1em; }.result-card>strong { font-family:Georgia,serif; font-size:130px; line-height:1; margin:auto 0 0; }.result-card h3 { font-family:Georgia,serif; font-size:30px; margin:0 0 8px; font-weight:400; }.result-card p { margin:0; }
.photo-strip { padding-right:0; }.strip-grid { display:grid; grid-template-columns:1.35fr repeat(3,1fr); gap:14px; overflow:hidden; }.album-card { color:inherit; text-decoration:none; min-width:0; }.album-image { aspect-ratio:4/3; overflow:hidden; position:relative; background:#ddd; }.album-image img { height:100%; object-fit:cover; transition:transform .5s; }.album-card:hover img { transform:scale(1.035); }.album-image>span { position:absolute; right:0; bottom:0; background:var(--lime); padding:7px 10px; font-size:10px; text-transform:uppercase; font-weight:800; }.album-card>small { display:block; color:var(--orange); text-transform:uppercase; letter-spacing:.08em; font-size:10px; margin:15px 0 8px; }.album-card h3 { font-family:Georgia,serif; font-weight:400; font-size:22px; margin:0; line-height:1.1; }.album-link { display:inline-block; font-size:11px; font-weight:700; margin-top:14px; border-bottom:1px solid; padding-bottom:3px; }
.day-intro { padding:100px 6vw 70px; display:grid; grid-template-columns:1fr auto; align-items:end; gap:50px; }.day-intro h1 { font-size:clamp(60px,8vw,130px); max-width:1050px; }.day-meta { display:flex; gap:40px; border-top:1px solid; padding-top:14px; font-size:10px; text-transform:uppercase; letter-spacing:.1em; }.day-meta strong { display:block; font-size:13px; margin-top:5px; }.day-hero { margin:0 3.5vw; }.day-hero img { height:min(72vh,850px); object-fit:cover; }.day-hero figcaption { display:flex; justify-content:space-between; padding:12px 0; font-size:11px; border-bottom:1px solid #bbb; }.day-body { display:grid; grid-template-columns:1fr 2.2fr 1fr; gap:40px; padding:90px 6vw; }.day-body aside { display:flex; flex-direction:column; gap:12px; border-top:2px solid; padding-top:15px; }.day-body aside p { font-size:10px; letter-spacing:.1em; }.day-body aside strong { font-family:Georgia,serif; font-size:21px; font-weight:400; }.day-body article { font-family:Georgia,serif; font-size:21px; line-height:1.65; }.day-body article p { margin-top:0; margin-bottom:30px; }.dropcap:first-letter { float:left; font-size:92px; line-height:.75; padding-right:12px; color:var(--orange); }.day-body blockquote { font-size:36px; line-height:1.2; margin:50px -12vw 50px 0; padding:30px 0; border-top:1px solid; border-bottom:1px solid; }.result-row { min-height:82px; border-top:1px solid #bbb; display:grid; grid-template-columns:100px 140px 1fr 180px; align-items:center; gap:20px; }.result-row:last-child { border-bottom:1px solid #bbb; }.result-row span { color:var(--orange); font-size:11px; text-transform:uppercase; font-weight:800; }.result-row strong { font-family:Georgia,serif; font-size:18px; }.result-row b { text-align:right; }.day-gallery { background:var(--ink); color:white; padding:90px 3.5vw; }.mosaic { display:grid; grid-template-columns:1.6fr .8fr; grid-template-rows:260px 260px; gap:12px; }.mosaic img { height:100%; object-fit:cover; }.mosaic img:first-child { grid-row:1/3; }
.archive-head { padding:110px 6vw 80px; background:var(--lime); position:relative; }.archive-head h1 { font-size:clamp(70px,10vw,155px); max-width:1100px; }.archive-head>p:not(.eyebrow) { position:absolute; right:7vw; bottom:90px; max-width:330px; line-height:1.5; }.archive-stats { margin-top:70px; display:flex; gap:60px; }.archive-stats span { text-transform:uppercase; font-size:10px; letter-spacing:.08em; }.archive-stats strong { display:block; font-family:Georgia,serif; font-size:36px; font-weight:400; letter-spacing:0; }.filter-bar { display:flex; align-items:center; justify-content:space-between; padding:28px 6vw; border-bottom:1px solid #bbb; position:sticky; top:84px; background:rgba(242,240,233,.95); z-index:10; backdrop-filter:blur(10px); }.filter-bar>span { font-size:11px; text-transform:uppercase; letter-spacing:.1em; }.filter-bar div { display:flex; gap:8px; }.filter-bar button { border:1px solid #aaa; border-radius:30px; background:transparent; padding:9px 15px; font-size:11px; cursor:pointer; }.filter-bar button.selected { background:var(--ink); color:white; border-color:var(--ink); }.archive-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:50px 15px; padding:60px 3.5vw 120px; }.archive-grid .album-card h3 { font-size:28px; }.archive-grid .album-card.priority { grid-column:span 2; }.archive-grid .album-card.priority .album-image { aspect-ratio:16/8.5; }.archive-note { margin:0 3.5vw 100px; border-top:1px solid; border-bottom:1px solid; padding:30px 0; display:grid; grid-template-columns:1fr 2fr; }.archive-note span { text-transform:uppercase; font-size:11px; letter-spacing:.1em; }.archive-note p { margin:0; font-family:Georgia,serif; font-size:24px; }.archive-note a { color:inherit; }
footer { background:var(--ink); color:white; padding:65px 3.5vw; display:grid; grid-template-columns:1fr auto 1fr; align-items:end; font-size:12px; line-height:1.6; }.footer-links { display:flex; gap:25px; }.footer-links button { border:0; background:transparent; color:white; cursor:pointer; }.credit { text-align:right; }
@media(max-width:900px){
  .site-header { grid-template-columns:1fr auto; height:72px; }.site-header nav { position:fixed; bottom:0; left:0; right:0; height:58px; background:var(--paper); justify-content:space-around; z-index:30; border-top:1px solid #bbb; }.live { display:none; }.hero { height:78vh; min-height:580px; }.hero-copy h1 { font-size:60px; }.weather { display:none; }
  .quick-grid { grid-template-columns:1fr 1fr; }.section-label { grid-column:1/3; }.quick-grid>button { min-height:150px; }.today,.latest,.photo-strip,.day-results { padding:70px 5vw; }.schedule article { grid-template-columns:70px 1fr 90px; padding:20px 0; }.schedule article>b { grid-column:2; }.schedule article button { display:none; }.story-grid { grid-template-columns:1fr 1fr; }.lead-story { grid-column:1/3; }.note,.result-card { min-height:380px; }.strip-grid { grid-template-columns:repeat(2,75vw); overflow:auto; padding-right:5vw; }.day-intro { grid-template-columns:1fr; padding-top:70px; }.day-body { grid-template-columns:1fr; }.day-body article { font-size:19px; }.day-body blockquote { margin:40px 0; }.result-row { grid-template-columns:70px 100px 1fr; padding:16px 0; }.result-row b { grid-column:3; text-align:left; }.archive-head>p:not(.eyebrow) { position:static; margin-top:35px; }.archive-grid { grid-template-columns:1fr 1fr; }.archive-grid .album-card.priority { grid-column:span 2; }.filter-bar { top:72px; align-items:flex-start; gap:20px; }.filter-bar div { overflow:auto; }.filter-bar button { white-space:nowrap; }.archive-note { grid-template-columns:1fr; gap:20px; } footer { margin-bottom:58px; grid-template-columns:1fr 1fr; }.footer-links { display:none; }
}
@media(max-width:560px){
  .brand small { display:none; }.hero-copy { bottom:6vh; }.hero-copy h1 { font-size:48px; }.hero-copy p:not(.eyebrow) { font-size:15px; }.hero-top { top:22px; }.quick-grid>button { padding:20px; }.quick-grid strong { font-size:20px; }.section-heading { align-items:flex-start; flex-direction:column; gap:20px; }.section-heading>p { text-align:left; }.story-grid { display:block; }.lead-story,.note,.result-card { min-height:390px; margin-bottom:12px; }.archive-grid { grid-template-columns:1fr; }.archive-grid .album-card.priority { grid-column:auto; }.archive-grid .album-card.priority .album-image { aspect-ratio:4/3; }.archive-head h1 { font-size:62px; }.archive-stats { gap:22px; }.filter-bar>span { display:none; }.day-intro h1 { font-size:54px; }.day-hero { margin:0; }.day-hero img { height:55vh; }.mosaic { grid-template-columns:1fr; grid-template-rows:320px 220px 220px; }.mosaic img:first-child { grid-row:auto; }.result-row { grid-template-columns:60px 1fr; }.result-row strong,.result-row b { grid-column:2; }.result-row span { grid-column:2; } footer { grid-template-columns:1fr; gap:25px; }.credit { text-align:left; }
}