:root { --ink:#081522; --ink-2:#112334; --paper:#f4eddf; --paper-2:#e9dcc7; --coral:#dc735f; --gold:#c9a66b; --muted:#a9b1b7; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; overflow-x:hidden; background:var(--ink); color:var(--paper); font-family:"DM Sans",sans-serif; } .page-shell { overflow:hidden; }
.site-header { height:84px; display:grid; grid-template-columns:auto minmax(220px,430px) 1fr auto; align-items:center; gap:27px; padding:0 clamp(24px,7vw,110px); border-bottom:1px solid rgba(244,237,223,.12); background:rgba(8,21,34,.95); position:sticky; z-index:4; top:0; backdrop-filter:blur(12px); }
.wordmark { color:var(--paper); font:600 26px/1 "Playfair Display",serif; letter-spacing:.08em; text-decoration:none; } .search { border:1px solid rgba(244,237,223,.32); border-radius:30px; height:42px; display:flex; align-items:center; gap:10px; padding:0 16px; color:var(--paper-2); } .search input { min-width:0; width:100%; color:var(--paper); background:transparent; border:0; outline:0; font:14px "DM Sans",sans-serif; } .search input::placeholder{color:#b6b4ac;}
nav { display:flex; justify-content:flex-end; gap:22px; } nav a { color:#d7d1c5; text-decoration:none; font-size:14px; padding:30px 0 25px; border-bottom:2px solid transparent; } nav .active { color:var(--paper); border-color:var(--coral); } nav small { display:block; color:#8d9295; font-size:10px; text-align:center; margin-top:3px; }.locale-picker{display:flex;gap:6px;align-items:center;color:var(--paper-2);font-size:17px}.locale-picker select{color:var(--paper);background:transparent;border:0;outline:0;font:13px "DM Sans",sans-serif;cursor:pointer}.locale-picker option{background:var(--ink);}
.hero { min-height:620px; padding:90px clamp(24px,7vw,110px) 76px; display:grid; grid-template-columns:minmax(300px,.9fr) minmax(390px,1.1fr); align-items:center; gap:70px; background:radial-gradient(circle at 72% 25%,#263b50 0,transparent 30%),linear-gradient(108deg,#081522 20%,#10263a 100%); }
.eyebrow { margin:0 0 11px; color:var(--coral); font-weight:600; letter-spacing:.08em; text-transform:uppercase; font-size:11px; } h1,h2,h3,p { margin-top:0; } h1,h2 { font-family:"Playfair Display",serif; } h1 { font-size:clamp(52px,6vw,84px); font-weight:500; line-height:.98; letter-spacing:-.045em; margin-bottom:24px; } h1 em { color:var(--coral); font-style:normal; } .intro { max-width:410px; color:#d0d0c8; line-height:1.65; font-size:16px; } .hero-actions { display:flex; align-items:center; gap:26px; margin-top:31px; } .button { text-decoration:none; font-weight:600; padding:14px 18px; } .button-primary { background:var(--coral); color:#fff7ef; } .button span { margin-left:18px; } .text-link { color:var(--paper); text-underline-offset:5px; }
.hero-cover-stage{min-height:470px;display:grid;place-items:center;position:relative;background:radial-gradient(circle at 72% 25%,rgba(244,227,185,.5) 0 7%,transparent 8%),linear-gradient(140deg,transparent 8%,rgba(201,166,107,.15)),linear-gradient(#162d42,#091420);border:1px solid rgba(244,237,223,.18);box-shadow:inset 0 0 80px rgba(0,0,0,.65),0 28px 60px rgba(0,0,0,.27)}.hero-cover{width:min(68%,285px);aspect-ratio:2/3;display:flex;align-items:flex-end;padding:25px;position:relative;box-shadow:20px 17px 18px rgba(0,0,0,.5);font:600 30px/1.05 "Playfair Display",serif;color:#f8edcf}.hero-cover:after{content:"";position:absolute;inset:13px;border:1px solid rgba(221,187,120,.7)}.hero-cover span{position:relative;z-index:1}.cover-caption{position:absolute;bottom:16px;right:18px;margin:0;color:rgba(244,237,223,.55);font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.genre-row { display:flex; gap:11px; padding:23px clamp(24px,7vw,110px); overflow:auto; background:var(--paper); border-bottom:1px solid #d8cdbd; } .genre { flex:0 0 auto; border:1px solid #cfc0aa; color:#453b35; background:transparent; padding:10px 16px; font:500 13px "DM Sans",sans-serif; cursor:pointer; } .genre.selected { color:#fff7ed; background:var(--coral); border-color:var(--coral); }
.reading-section,.future-section { padding:78px clamp(24px,7vw,110px); } .section-heading { display:flex; align-items:end; justify-content:space-between; gap:35px; margin-bottom:32px; } h2 { font-size:42px; line-height:1; letter-spacing:-.04em; margin-bottom:0; font-weight:500; } .section-note { max-width:345px; color:var(--muted); line-height:1.5; font-size:13px; margin-bottom:0; }
.book-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:19px; } .story-card { min-width:0; } .cover { width:100%; aspect-ratio:2/3; display:flex; align-items:end; padding:18px; border:1px solid rgba(230,212,171,.35); position:relative; overflow:hidden; box-shadow:0 14px 24px rgba(0,0,0,.2); color:#f8edcf; font:600 21px/1.07 "Playfair Display",serif; } .cover:before { content:""; position:absolute; inset:9px; border:1px solid currentColor; opacity:.5; } .cover span { z-index:1; } .cover-one{background:radial-gradient(circle at 66% 25%,#ddd2b2 0 7%,transparent 8%),linear-gradient(155deg,#12283b,#305b67 50%,#0c1a2c)}.cover-two{background:linear-gradient(155deg,#2a1218,#9e2823 52%,#110c19)}.cover-three{background:radial-gradient(circle at 50% 60%,#d2b777 0 1%,transparent 2%),linear-gradient(155deg,#0e2735,#56777c 50%,#172019)}.cover-four{background:linear-gradient(160deg,#dd9a6e,#96626b 48%,#3d3548)}.cover-five{background:radial-gradient(circle at 45% 20%,#e9dfb9 0 8%,transparent 9%),linear-gradient(150deg,#08241f,#356151,#061b18)} .story-card h3 { margin:15px 0 5px; font:600 17px/1.15 "Playfair Display",serif; } .story-card p { margin:0; color:#a9b1b7; font-size:12px; } .empty-state{color:var(--paper-2);}
.future-section { color:#1b242b; background:var(--paper); position:relative; } .future-section:before { content:""; position:absolute; inset:0; opacity:.45; background:radial-gradient(ellipse at 0 40%,#e0c7b0,transparent 26%),radial-gradient(ellipse at 100% 66%,#e0c7b0,transparent 28%); pointer-events:none; } .future-section > * { position:relative; } .future-heading .eyebrow { color:#a65247; } .future-heading .section-note { color:#5b5a54; }
.future-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; } .future-card { min-height:245px; padding:22px; border:1px solid #cfbfa7; background:rgba(247,241,228,.6); } .future-poster{width:84px;aspect-ratio:2/3;display:grid;place-items:center;border:1px solid #a38768;background:linear-gradient(145deg,#172b3a,#5e6d70);color:#ecd5a4;font-size:34px;box-shadow:7px 8px 12px rgba(38,28,18,.16)}.updates .future-poster{background:linear-gradient(145deg,#c9ad8d,#9e5e53)}.people .future-poster{background:linear-gradient(145deg,#8e7d73,#373d4b)}.future-card .eyebrow { color:#a75f50; margin-top:16px; }.future-card h3 { font:500 30px/1 "Playfair Display",serif; margin-bottom:13px; }.future-card > p:last-child { color:#5d625e; font-size:13px; line-height:1.6; max-width:290px; }
footer { display:flex; justify-content:space-between; gap:25px; padding:29px clamp(24px,7vw,110px); color:#b9b2a7; background:#07111b; font-size:12px; } footer span:first-child { font:600 18px "Playfair Display",serif; letter-spacing:.08em; color:var(--paper); }
.hero-cover{overflow:hidden}.hero-cover img,.cover-real img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.cover-real:before{z-index:1;border-color:rgba(255,255,255,.5)}.cover-unavailable{background:radial-gradient(circle at 70% 20%,#d7bf89 0 7%,transparent 8%),linear-gradient(150deg,#19354a,#305e66 50%,#111827)}.cover-unavailable span{display:block;position:relative;z-index:2;color:#f9edd1;font:600 clamp(18px,2vw,30px)/1.05 "Playfair Display",serif;text-shadow:0 2px 16px #081522}.story-card h3 a{color:var(--paper);text-decoration:none}.detail-page{min-height:100vh}.reader-bar{height:58px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:0 clamp(20px,7vw,110px);border-bottom:1px solid rgba(244,237,223,.12);position:sticky;top:0;background:rgba(8,21,34,.96);backdrop-filter:blur(12px);z-index:2}.reader-bar a{color:var(--paper-2);font-size:13px;text-decoration:none}.reader-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#d7d1c5;font:500 14px "Playfair Display",serif}.reader{width:calc(100vw - 40px);max-width:720px;margin:0 auto;padding:64px 0 110px}.reader-loading,.reader-error{color:var(--paper-2);padding-top:20vh;text-align:center}.chapter{color:#ece8df;font:18px/1.9 Georgia,"Times New Roman",serif;margin:0 0 72px}.chapter h1{font:500 clamp(30px,4vw,46px)/1.08 "Playfair Display",serif;color:var(--paper);margin:0 0 32px}.chapter-content{overflow-wrap:anywhere}.chapter-content br{display:block;content:"";margin-bottom:1.05em}.reader-end{display:grid;place-items:center;text-align:center;border-top:1px solid rgba(244,237,223,.2);padding:56px 0}.reader-end p{color:var(--muted);font-size:14px;margin-bottom:20px}.reader-end .reader-cta{display:inline-flex;align-items:center;justify-content:center;min-width:240px;padding:18px 28px;font-size:16px;box-shadow:0 14px 28px rgba(220,115,95,.22)}
@media (max-width:980px) { .site-header { grid-template-columns:auto 1fr auto; gap:20px; height:auto; padding-block:17px; }.site-header nav{grid-column:1/-1;justify-content:flex-start;overflow:auto;gap:22px;}.site-header nav a{padding:0 0 8px;white-space:nowrap;}.hero{grid-template-columns:1fr;gap:42px;padding-top:65px;}.hero-cover-stage{min-height:390px;}.book-grid{grid-template-columns:repeat(3,1fr);}.future-grid{grid-template-columns:1fr;} }
@media (max-width:620px) { .site-header{grid-template-columns:1fr auto;}.wordmark{font-size:23px;}.search{grid-row:2;grid-column:1/-1}.site-header nav{grid-row:3;}.hero{min-height:auto;padding-block:54px;}.hero-cover-stage{min-height:330px;}.hero-cover{width:180px;padding:17px;font-size:22px;}h1{font-size:54px;}h2{font-size:36px;}.section-heading,footer{display:block;}.section-note{margin-top:18px;}.book-grid{grid-template-columns:repeat(2,1fr);gap:16px;}.cover{font-size:18px;}.reading-section,.future-section{padding-block:58px;}.future-card{min-height:0;}.genre-row{padding-inline:20px;}.reader{width:calc(100vw - 36px);padding-top:38px}.reader-bar{padding-inline:18px}.reader-title{max-width:58vw}.chapter{font-size:17px;line-height:1.85;margin-bottom:56px}.chapter h1{font-size:31px;margin-bottom:25px} }

/* Featured carousel and reader completion are intentionally quiet: the cover
   changes automatically, while the end of a legal preview has one clear exit. */
.hero-carousel-meta{position:absolute;right:18px;bottom:14px;left:18px;display:flex;align-items:center;justify-content:center;gap:10px;max-width:none}.cover-caption{display:none}.hero-dots{display:flex;gap:5px}.hero-dot{width:7px;height:7px;padding:0;border:1px solid rgba(244,237,223,.8);border-radius:50%;background:transparent;cursor:pointer}.hero-dot.is-active{background:var(--coral);border-color:var(--coral)}.hero-count{color:rgba(244,237,223,.65);font-size:11px;white-space:nowrap}
.topic-filter{display:flex;align-items:center;gap:12px;color:#453b35;font-size:13px;font-weight:600}.topic-filter select{min-width:210px;max-width:min(72vw,360px);height:40px;padding:0 34px 0 13px;border:1px solid #cfc0aa;border-radius:0;background:#fffaf0;color:#2c2926;font:500 13px "DM Sans",sans-serif;cursor:pointer}.chapter:last-of-type{margin-bottom:12px}.reader-end{display:flex;justify-content:center;align-items:center;border:0;padding:16px 0 30px;background:transparent}.reader-end p{display:none}.reader-cta{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-width:264px;padding:19px 30px;color:#fff7ef;text-decoration:none;font-size:16px;font-weight:600;background:linear-gradient(110deg,#dc735f,#e68b70);box-shadow:0 16px 32px rgba(220,115,95,.28);transition:transform .2s ease,box-shadow .2s ease;animation:reader-cta-pulse 2.8s ease-in-out infinite}.reader-cta:hover,.reader-cta:focus-visible{transform:translateY(-3px);box-shadow:0 22px 40px rgba(220,115,95,.43)}.reader-cta b{font-size:20px;line-height:0}@keyframes reader-cta-pulse{50%{box-shadow:0 18px 44px rgba(220,115,95,.5)}}@media (prefers-reduced-motion:reduce){.reader-cta{animation:none;transition:none}}.hero-carousel{position:relative;width:100%;height:420px}.hero-slide{position:absolute;left:50%;top:50%;width:250px;aspect-ratio:2/3;overflow:hidden;border:1px solid rgba(244,237,223,.28);box-shadow:0 14px 30px rgba(0,0,0,.38);transform:translate(-50%,-50%) translateX(calc(var(--offset) * 160px)) scale(.62);opacity:.42;filter:saturate(.7);transition:transform .55s ease,opacity .45s ease,filter .45s ease;z-index:1}.hero-slide.is-active{transform:translate(-50%,-50%) scale(1);opacity:1;filter:none;z-index:3;box-shadow:0 28px 48px rgba(0,0,0,.52)}.hero-slide img{width:100%;height:100%;object-fit:cover}.hero-carousel-meta{z-index:4}.pagination{display:flex;align-items:center;justify-content:center;gap:16px;padding:45px 0 0;color:var(--muted);font-size:13px}.pagination button{border:1px solid rgba(244,237,223,.32);background:transparent;color:var(--paper);padding:9px 13px;cursor:pointer}.pagination button:disabled{opacity:.35;cursor:not-allowed}@media(max-width:620px){.hero-carousel{height:315px}.hero-slide{width:180px;transform:translate(-50%,-50%) translateX(calc(var(--offset) * 112px)) scale(.58)}.hero-slide.is-active{transform:translate(-50%,-50%) scale(1)}.pagination{gap:9px;font-size:12px}.pagination button{padding:8px 9px}}
