/* Eat. Shift. Or Die. · redesign, November 2026
   The cover, taken apart and put to work: aubergine desk, paper layers, gears that turn when you move.
   Chrome rules are scoped under .esod so they hold on legacy pages that still load site.css. */
@font-face{font-family:"Figtree";font-style:normal;font-weight:400 800;font-display:swap;src:url("/fonts/figtree-latin.woff2") format("woff2")}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url("/fonts/instrument-serif-italic-latin.woff2") format("woff2")}
@font-face{font-family:"Anton";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/anton-regular.ttf") format("truetype")}
@font-face{font-family:"Plex";font-weight:400;font-display:swap;src:url("/fonts/ibm-plex-mono-400.woff2") format("woff2")}
@font-face{font-family:"Plex";font-weight:500;font-display:swap;src:url("/fonts/ibm-plex-mono-500.woff2") format("woff2")}

:root{
  --aub:#471e50; --aub-2:#5a2866; --aub-deep:#2c1434; --aub-ink:#1b0d21;
  --orange:#f2531a; --orange-deep:#b5360a; --ivory:#fdf4d9; --tan:#e7c7a0; --white:#fffaf0;
  --on-deep:#fdf4d9; --on-deep-2:rgba(253,244,217,.8); --on-deep-3:rgba(253,244,217,.6); --deep-line:rgba(255,255,255,.16); --deep-glass:rgba(255,255,255,.09);
  /* night (default) */
  --bg:#1b0d21; --bg-2:#26122d; --fg:#fdf4e3; --fg-2:rgba(253,244,227,.78); --fg-3:rgba(253,244,227,.58);
  --accent:#f2531a; --accent-ink:#22101f; --accent-text:#ffa26e;
  --surface:rgba(255,255,255,.06); --surface-2:rgba(255,255,255,.1); --surface-3:rgba(255,255,255,.16); --surface-solid:#2c1734;
  --hairline:rgba(255,255,255,.13); --hi:rgba(255,255,255,.2); --chrome:rgba(46,22,55,.7); --chrome-line:rgba(255,255,255,.16);
  --shadow:rgba(6,1,9,.6); --scrim:rgba(10,3,14,.62); --sheet:#fffaf0; --sheet-ink:#201c25;
  --aura-1:rgba(120,58,134,.5); --aura-2:rgba(242,83,26,.15);
  --font:"Figtree",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --serif:"Instrument Serif","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --display:"Anton","Arial Narrow",Impact,sans-serif; --mono:"Plex",ui-monospace,Menlo,monospace;
  --r-xl:32px; --r-lg:26px; --r-md:18px; --r-sm:12px;
  --gl:max(18px,env(safe-area-inset-left,0px)); --gr:max(18px,env(safe-area-inset-right,0px));
  --ease:cubic-bezier(.2,.8,.2,1); color-scheme:dark;
}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]){
  --bg:#f7f1e6; --bg-2:#efe6d6; --fg:#2a1532; --fg-2:rgba(42,21,50,.78); --fg-3:rgba(42,21,50,.6);
  --accent-text:#b5360a; --surface:rgba(255,255,255,.6); --surface-2:rgba(255,255,255,.84); --surface-3:rgba(71,30,80,.09); --surface-solid:#fffdf8;
  --hairline:rgba(71,30,80,.14); --hi:rgba(255,255,255,.95); --chrome:rgba(252,248,240,.76); --chrome-line:rgba(71,30,80,.14);
  --shadow:rgba(71,30,80,.2); --scrim:rgba(42,21,50,.4); --sheet:#fffdf8;
  --aura-1:rgba(140,84,156,.16); --aura-2:rgba(242,83,26,.12); color-scheme:light;}}
:root[data-theme="light"]{
  --bg:#f7f1e6; --bg-2:#efe6d6; --fg:#2a1532; --fg-2:rgba(42,21,50,.78); --fg-3:rgba(42,21,50,.6);
  --accent-text:#b5360a; --surface:rgba(255,255,255,.6); --surface-2:rgba(255,255,255,.84); --surface-3:rgba(71,30,80,.09); --surface-solid:#fffdf8;
  --hairline:rgba(71,30,80,.14); --hi:rgba(255,255,255,.95); --chrome:rgba(252,248,240,.76); --chrome-line:rgba(71,30,80,.14);
  --shadow:rgba(71,30,80,.2); --scrim:rgba(42,21,50,.4); --sheet:#fffdf8;
  --aura-1:rgba(140,84,156,.16); --aura-2:rgba(242,83,26,.12); color-scheme:light;}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
body.esod{margin:0;min-height:100vh;overflow-x:clip;color:var(--fg);font:400 1rem/1.6 var(--font);-webkit-font-smoothing:antialiased;
background:var(--bg)}
body.esod::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(90vmax 70vmax at -10% -10%,var(--aura-1),transparent 60%),radial-gradient(70vmax 60vmax at 110% 35%,var(--aura-2),transparent 60%),linear-gradient(180deg,var(--bg),var(--bg-2))}
.esod [hidden]{display:none!important}
/* resets stay inside the new chrome and the new homepage, so legacy component colours are never overridden */
.page-home img,.esod :is(.sheet,.foot,.topbar) img{max-width:100%;height:auto;display:block}
.page-home a,.esod :is(.strip,.topbar,.tabbar,.sheet,.foot) a{color:inherit}
.page-home button,.esod :is(.topbar,.tabbar,.sheet,.foot) button{font:inherit;color:inherit;cursor:pointer}
.esod :focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.esod .num{font-variant-numeric:tabular-nums}
.esod .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.esod .skip-link{position:absolute;top:-80px;left:16px;z-index:100;background:var(--orange);color:var(--accent-ink);padding:10px 18px;border-radius:999px;font-weight:700;text-decoration:none}
.esod .skip-link:focus{top:10px}
.page-home :is(h1,h2,h3,p,ol,ul,figure,blockquote),.esod :is(.strip,.topbar,.foot,.sheet,.tabbar) :is(h2,h3,p,ol,ul,figure){margin:0}
.page-home :is(ol,ul){padding:0;list-style:none}
.page-home :is(h1,h2,h3){text-wrap:balance}
.wrap{max-width:1180px;margin-inline:auto;padding-left:var(--gl);padding-right:var(--gr)}
.page-home main{display:block}
.page-home h2{font-weight:800;font-size:clamp(1.9rem,5.4vw,3.2rem);line-height:1.02;letter-spacing:-.035em}
.page-home h3{font-weight:800;letter-spacing:-.02em;line-height:1.12}

.page-home .eyebrow,.esod :is(.strip,.topbar,.sheet,.foot) .eyebrow{font:500 .75rem/1.5 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-3);margin:0}
.esod .eyebrow.dot::before{content:"";display:inline-block;width:.6em;height:.6em;border-radius:50%;background:var(--orange);margin-right:.7em;vertical-align:.05em}
.esod em.s{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em;color:var(--accent-text)}
.page-home .muted,.esod .sheet .muted{color:var(--fg-3)} .page-home .xs,.esod .sheet .xs{font-size:.75rem} .page-home .small,.esod .sheet .small{font-size:.875rem}
.page-home .lede{font-size:1.12rem;line-height:1.5;color:var(--fg-2);max-width:36rem}
.esod .tlink{color:inherit;font-weight:650;text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:.22em;text-decoration-thickness:2px}
.esod .more{display:inline-flex;align-items:center;gap:.35em;font-weight:700;font-size:.9rem;text-decoration:none;color:var(--accent-text);white-space:nowrap}
.esod .more::after{content:"›";font-size:1.3em;line-height:1;transform:translateY(-.05em)}

.esod .btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:48px;padding:.65em 1.3em;border-radius:999px;border:0;background:var(--orange);color:var(--accent-ink);font:750 1rem/1.1 var(--font);letter-spacing:-.01em;text-decoration:none;box-shadow:0 10px 30px -10px rgba(242,83,26,.75),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.esod .btn:hover{transform:translateY(-2px)} .esod .btn:active{transform:scale(.97)}
.esod .btn.ghost{background:var(--surface-2);color:var(--fg);border:1px solid var(--hairline);box-shadow:inset 0 1px 0 var(--hi)}
.esod .btn.sm{min-height:40px;font-size:.875rem;padding:.5em 1.05em} .esod .btn.lg{min-height:54px;font-size:1.06rem;padding:.7em 1.5em}
.esod .deep .btn.ghost{background:var(--deep-glass);color:var(--on-deep);border-color:var(--deep-line);box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
.esod .icon-btn{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--chrome-line);background:var(--surface);color:var(--fg);flex:none;padding:0;transition:transform .2s var(--ease)}
.esod .icon-btn:active{transform:scale(.92)} .esod .icon-btn svg,.esod .btn svg{width:20px;height:20px}

/* the cover's full stop */
.esod .stop{display:inline-block;width:.34em;height:.34em;margin:0 .16em 0 .05em;vertical-align:baseline;overflow:visible}
.esod .stop-a{fill:var(--orange)} .esod .stop-b{fill:#e7c7a0} .esod .stop-c{fill:#fffaf0}

/* ---------- chrome ---------- */
.esod .strip{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:7px max(20px,var(--gl));background:var(--aub-deep);color:var(--ivory);font:500 .72rem/1.5 var(--mono);letter-spacing:.04em}
.esod .strip a{color:var(--ivory);text-underline-offset:4px} .esod .strip-links{display:flex;gap:18px;white-space:nowrap}
.esod .topbar{position:sticky;top:0;z-index:30;padding:10px var(--gr) 0 var(--gl);pointer-events:none}
.esod .topbar-in{pointer-events:auto;max-width:1180px;margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:9px 10px 9px 20px;border-radius:999px;background:var(--chrome);border:1px solid var(--chrome-line);box-shadow:0 14px 40px -18px var(--shadow),inset 0 1px 0 var(--hi);-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5)}
.esod .wordmark{display:inline-flex;align-items:baseline;font:400 1.5rem/1 var(--display);letter-spacing:.02em;text-decoration:none;color:var(--fg);white-space:nowrap}
.esod .wordmark span{color:inherit}
.esod .wordmark .w-shift,.esod .w-shift{color:transparent;-webkit-text-stroke:1.1px var(--fg)}
.esod .wordmark .w-die,.esod .w-die{color:var(--orange)}
.esod .wordmark.lg{font-size:clamp(1.7rem,8.6vw,2.3rem)}
.esod .topnav{display:flex;gap:4px;font-size:.92rem;font-weight:650}
.esod .topnav a{padding:.55em .9em;border-radius:999px;text-decoration:none;color:var(--fg-2);transition:background .2s,color .2s}
.esod .topnav a:hover{background:var(--surface-2);color:var(--fg)}
.esod .topnav a[aria-current]{background:var(--surface-3);color:var(--fg)}
.esod .topbar-act{display:flex;gap:8px;align-items:center}
.esod .tabbar{display:none}
@media (max-width:860px){
  .esod .topnav,.esod .topbar-act .btn{display:none}
  .esod .topbar-in{padding:7px 8px 7px 16px}
  .esod .strip{font-size:.66rem;padding-block:6px} .esod .strip-links a:first-child{display:none}
  .esod .tabbar{position:fixed;z-index:40;left:50%;transform:translateX(-50%);bottom:calc(10px + env(safe-area-inset-bottom,0px));width:min(430px,calc(100% - 20px));display:grid;grid-template-columns:1fr 1fr 74px 1fr 1fr;align-items:center;padding:6px;border-radius:999px;background:var(--chrome);border:1px solid var(--chrome-line);box-shadow:0 18px 44px -14px var(--shadow),inset 0 1px 0 var(--hi);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6)}
  .esod .tabbar a{display:grid;justify-items:center;gap:1px;padding:6px 2px;border-radius:999px;font-size:.66rem;font-weight:700;text-decoration:none;color:var(--fg-3)}
  .esod .tabbar a svg{width:22px;height:22px}
  .esod .tabbar a[aria-current]{color:var(--fg);background:var(--surface-3)}
  .esod .tabbar .tab-buy{width:62px;height:62px;margin:-16px auto;border-radius:50%;background:var(--orange);color:var(--accent-ink);place-items:center;font:400 1.05rem/1 var(--display);letter-spacing:.06em;text-transform:uppercase;box-shadow:0 12px 26px -8px rgba(242,83,26,.8),inset 0 1px 0 rgba(255,255,255,.4)}
  .esod .tabbar .tab-buy b{font-weight:400}
  body.esod{padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))}
}

/* sheets */
.esod .sheet-wrap{position:fixed;inset:0;z-index:60;display:grid;align-items:end;justify-items:center}
.esod .sheet-backdrop{position:absolute;inset:0;background:var(--scrim);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fade .25s both}
.esod .sheet{position:relative;width:min(640px,100%);max-height:88vh;overflow:auto;background:var(--surface-solid);color:var(--fg);border:1px solid var(--chrome-line);border-radius:var(--r-xl) var(--r-xl) 0 0;padding:8px 22px calc(26px + env(safe-area-inset-bottom,0px));box-shadow:0 -20px 60px -20px var(--shadow);animation:rise .38s var(--ease) both}
.esod .sheet:focus{outline:none}
.esod .sheet-grab{display:flex;justify-content:flex-end;padding:6px 0 2px}
.esod .sheet h2{font:800 1.7rem/1.05 var(--font);letter-spacing:-.03em;margin:.2em 0 .25em}
.esod .buy-sheet{display:grid;grid-template-columns:120px 1fr;gap:20px;align-items:start}
.esod .buy-sheet img{border-radius:3px 6px 6px 3px;box-shadow:0 14px 26px -10px var(--shadow)}
.esod .buy-rows{display:grid;gap:10px;margin:16px 0 12px;justify-items:start} .esod .buy-rows .btn{width:100%}
.esod .buy-sheet p+p{margin-top:8px}
.esod .menu-sheet{display:grid;gap:22px;padding-bottom:6px}
.esod .menu-sheet a{display:block;padding:.5em 0;font-weight:650;font-size:1.05rem;text-decoration:none;border-bottom:1px solid var(--hairline)}
.esod .menu-sheet .eyebrow{margin-bottom:4px}
@media (min-width:861px){.esod .sheet-wrap{align-items:center}.esod .sheet{border-radius:var(--r-xl);padding-bottom:26px}}
@keyframes fade{from{opacity:0}} @keyframes rise{from{transform:translateY(40px);opacity:0}}

/* footer */
.esod .foot{margin-top:72px;padding:0 var(--gr) 30px var(--gl);color:var(--fg-2);font-size:.95rem}
.esod .foot-in{max-width:1180px;margin-inline:auto}
.esod .foot-signup{display:grid;grid-template-columns:1fr 1.15fr;gap:28px 48px;align-items:center;padding:34px;border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--hairline);box-shadow:inset 0 1px 0 var(--hi)}
.esod .foot-signup h2{font:800 clamp(1.8rem,4.6vw,2.7rem)/1.02 var(--font);letter-spacing:-.035em;color:var(--fg);margin-top:.35em}
.esod .launch-signup{display:grid;gap:10px;margin:0}
.esod .launch-signup p{margin:0;font-size:.9rem;color:var(--fg-2)}
.esod .launch-signup .newsletter-promise{font-size:1rem;color:var(--fg)}
.esod .newsletter-fields{display:flex;gap:10px;align-items:end;flex-wrap:wrap}
.esod .newsletter-fields>div{flex:1 1 220px;display:grid;gap:6px}
.esod .launch-signup label{font:500 .72rem/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fg-3)}
.esod .launch-signup input[type=email]{width:100%;min-height:50px;padding:.6em 1.1em;border-radius:999px;border:1px solid var(--hairline);background:var(--surface-2);color:var(--fg);font:500 1rem var(--font)}
.esod .launch-signup input::placeholder{color:var(--fg-3)}
.esod .launch-signup button[type=submit]{min-height:50px;padding:.6em 1.4em;border-radius:999px;border:0;background:var(--orange);color:var(--accent-ink);font:750 1rem var(--font);box-shadow:0 10px 30px -10px rgba(242,83,26,.75),inset 0 1px 0 rgba(255,255,255,.35)}
.esod .signup-trap{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.esod .signup-consent{font-size:.8rem!important;color:var(--fg-3)!important} .esod .signup-consent a{text-decoration:underline}
.esod .signup-status{padding:.7em 1em;border-radius:var(--r-sm);background:var(--surface-3);color:var(--fg)!important}
.esod .signup-status[data-error="true"]{outline:2px solid var(--orange)}
.esod .foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:32px;padding:44px 6px 30px}
.esod .foot-grid p{margin-top:14px;line-height:1.5}
.esod .foot-grid a:not(.wordmark){display:block;padding:.32em 0;text-decoration:none;color:var(--fg-2)} .esod .foot-grid a:not(.wordmark):hover{color:var(--fg);text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:.25em}
.esod .foot-grid .eyebrow{margin-bottom:8px}
.esod .foot-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:20px 6px 0;border-top:1px solid var(--hairline);font-size:.8rem;color:var(--fg-3)}
.esod .foot-bottom a{margin-left:18px;color:var(--fg-2)}
@media (max-width:760px){.esod .foot-signup{grid-template-columns:1fr;padding:24px}.esod .foot-grid{grid-template-columns:1fr;gap:26px;padding-top:34px}.esod .foot-bottom a{margin:0 18px 0 0}}

/* ---------- always-aubergine panels ---------- */
.deep{position:relative;isolation:isolate;overflow:hidden;color:var(--on-deep);background:radial-gradient(120% 90% at 18% 0%,var(--aub-2),var(--aub) 46%,var(--aub-deep));--fg:var(--on-deep);--fg-2:var(--on-deep-2);--fg-3:var(--on-deep-3);--accent-text:#ffa26e;--hairline:var(--deep-line)}
.deep::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.5;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .5 0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E")}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:20px 40px;flex-wrap:wrap;margin-bottom:28px}
.sec-head h2{margin-top:.3em;max-width:16ch}
.page-home main>section{margin-top:clamp(64px,10vw,120px)}
.page-home main>section.hero{margin-top:-72px}

/* gears */
.gearstack{display:block;width:100%;height:100%;overflow:visible}
.gear-layer{filter:drop-shadow(0 12px 14px rgba(18,3,24,.5))}
.gear-layer path{transform:rotate(calc(var(--spin,0)*var(--k,1)*1deg));transition:transform .5s linear}
.g-orange path{fill:var(--orange);--k:1} .g-tan path{fill:var(--tan);--k:-1.45} .g-ivory path{fill:var(--white);--k:1.9}

/* ---------- hero ---------- */
.hero{padding:clamp(118px,14vw,160px) 0 0;border-radius:0 0 var(--r-xl) var(--r-xl)}
.hero-gears{position:absolute;z-index:-1;right:0;bottom:0;width:clamp(420px,58vw,820px);aspect-ratio:1;transform:translate(48%,55%)}
.hero-in{display:grid;grid-template-columns:1.12fr .88fr;gap:clamp(28px,5vw,80px);align-items:center}
.launch-kicker{display:flex;gap:14px;align-items:center;flex-wrap:wrap;color:var(--on-deep-2)!important}
.pill{display:inline-block;padding:.3em .8em;border-radius:999px;background:var(--orange);color:var(--accent-ink);font-weight:500;letter-spacing:.08em}
.display{font:400 clamp(3.4rem,9.2vw,8.2rem)/.94 var(--display);text-transform:uppercase;letter-spacing:.005em;margin:.22em 0 .2em!important}
.display span{display:block}
.d-fill{color:var(--ivory)} .d-line{color:transparent;-webkit-text-stroke:2px var(--ivory)} .d-orange{color:var(--orange)}
.hero-deck{font-size:clamp(1.12rem,2.1vw,1.45rem);line-height:1.38;font-weight:600;letter-spacing:-.015em;color:var(--on-deep)}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:26px}
.hero-alt{margin-top:16px!important} .hero-copy .associate-disclosure{margin-top:10px} .hero-review{margin-top:14px!important;color:var(--on-deep-2)}
.hero-byline{display:flex;gap:6px 18px;flex-wrap:wrap;margin-top:clamp(36px,6vw,64px);padding-block:20px 26px;border-top:1px solid var(--deep-line);font-size:.92rem}
.hero-byline span{color:var(--on-deep-2)}

.book3d{position:relative;display:grid;justify-items:center;gap:34px;perspective:1700px;margin:0}
.book{--w:min(310px,58vw);--h:calc(var(--w)*1.5);--d:calc(var(--w)*.119);position:relative;width:var(--w);height:var(--h);transform-style:preserve-3d;transform:rotateY(calc(24deg + var(--ry,0deg))) rotateX(calc(5deg + var(--rx,0deg)));transition:transform .6s var(--ease)}
.book>*{position:absolute;top:0;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.book-front{left:0;width:100%;transform:translateZ(calc(var(--d)/2));border-radius:2px 6px 6px 2px;overflow:hidden;background:var(--aub)}
.book-front::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.32),rgba(255,255,255,.1) 3.2%,rgba(0,0,0,.12) 5.5%,transparent 9%,transparent 70%,rgba(255,255,255,.07))}
.book-front img{width:100%;height:100%;object-fit:cover}
.book-back{left:0;width:100%;transform:rotateY(180deg) translateZ(calc(var(--d)/2));background:var(--aub-deep);border-radius:6px 2px 2px 6px}
.book-spine{left:0;width:var(--d);transform:translateX(calc(var(--d)/-2)) rotateY(-90deg);background:linear-gradient(90deg,#34153c,#4d2257 45%,#3a1842);display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:16px 0;writing-mode:vertical-rl;font:400 calc(var(--d)*.44)/1 var(--display);letter-spacing:.08em;color:var(--ivory)}
.book-spine span:last-child{color:var(--orange);font-size:.8em}
.book-pages{right:0;width:var(--d);transform:translateX(calc(var(--d)/2)) rotateY(90deg);background:repeating-linear-gradient(90deg,#f6ecd6 0 1px,#e2d4b6 1px 2px)}
.book3d::after{content:"";position:absolute;left:50%;bottom:42px;width:70%;height:34px;transform:translateX(-46%);background:radial-gradient(closest-side,rgba(10,2,14,.6),transparent);filter:blur(8px);z-index:-1}
.book3d figcaption{display:flex;gap:28px;font:500 .72rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--on-deep-3)}
@media (prefers-reduced-motion:no-preference){.book{animation:bookfloat 7s ease-in-out infinite alternate}}
@keyframes bookfloat{from{translate:0 -6px}to{translate:0 8px}}
@media (max-width:820px){
  .hero-in{grid-template-columns:1fr;gap:44px} .display{font-size:clamp(3.2rem,17.4vw,6.6rem)}
  .book3d{order:-1} .book{--w:min(214px,52vw)}
  .hero{padding-top:112px} .hero-gears{width:min(128vw,560px);bottom:auto;top:0;transform:translate(52%,-46%)}
  .cta-row .btn{flex:1 1 100%}
}

/* ---------- shelf ---------- */
.shelf-text{font-size:clamp(1.22rem,2.5vw,1.72rem);line-height:1.42;letter-spacing:-.015em;font-weight:500;color:var(--fg-2);max-width:54rem;text-wrap:pretty}
.shelf-text strong{color:var(--fg);font-weight:800;background:linear-gradient(transparent 62%,color-mix(in srgb,var(--orange) 46%,transparent) 62% 94%,transparent 94%)}

/* ---------- dictionary ---------- */
.book-dictionary{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;counter-reset:d}
.dict-card{position:relative;padding:26px 24px 28px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--hairline);box-shadow:inset 0 1px 0 var(--hi);counter-increment:d}
.dict-card::before{content:counter(d);position:absolute;top:18px;right:20px;font:500 .72rem var(--mono);color:var(--fg-3)}
.dict-card:not(:nth-child(3))::after{content:"→";position:absolute;z-index:2;right:-21px;top:50%;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--orange);color:var(--accent-ink);font-weight:800;transform:translateY(-50%)}
.dict-card h2{font:400 clamp(2.6rem,6vw,4rem)/1 var(--display)!important;letter-spacing:.01em!important;text-transform:lowercase}
.dict-card .w-eat{color:var(--fg)} .dict-card .w-shift{-webkit-text-stroke:1.6px var(--fg)}
.dict-ph{font:500 .8rem var(--mono);color:var(--fg-3);margin:10px 0 12px!important} .dict-ph em{font-family:var(--serif);font-size:1.25em;color:var(--accent-text)}
.dict-card p:last-child{color:var(--fg-2);line-height:1.5}
.dict-seq{grid-column:1/-1;text-align:center;font:400 clamp(1.6rem,4vw,2.4rem)/1.15 var(--serif);font-style:italic;color:var(--fg);padding-top:22px}
@media (max-width:820px){.book-dictionary{grid-template-columns:1fr}.dict-card:not(:nth-child(3))::after{content:"↓";right:auto;left:50%;top:auto;bottom:-21px;transform:translateX(-50%)}}

/* ---------- the day ---------- */
.day-panel{display:grid;grid-template-columns:auto 1fr;gap:10px 40px;align-items:center;padding:26px 28px 18px;border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--hairline);box-shadow:inset 0 1px 0 var(--hi)}
.day-readout{display:grid;gap:14px;min-width:230px}
.day-clock{font:500 1.05rem var(--mono);letter-spacing:.08em;color:var(--accent-text)}
.day-count{display:grid;gap:2px} .day-count b{font:400 clamp(4.6rem,11vw,7.4rem)/.9 var(--display);color:var(--fg)} .day-count span{font:500 .74rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-3)}
.daychart{width:100%;height:auto;color:var(--orange);overflow:visible}
.dc-line{fill:none;stroke:var(--orange);stroke-width:3.5;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.dc-tick line{stroke:var(--hairline);stroke-width:1;vector-effect:non-scaling-stroke} .dc-tick text{font:500 15px var(--mono);fill:var(--fg-3);text-anchor:middle}
.dc-dot{fill:var(--bg);stroke:var(--orange);stroke-width:3;cursor:pointer;transition:r .25s var(--ease),fill .2s} .dc-dot.is-on{fill:var(--orange);r:11}
.deck-wrap{position:relative;margin-top:16px}
.page-home .deck{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-block:10px 18px}
.deck::-webkit-scrollbar{display:none}
.page-home .ticks{padding-inline:calc(50% - 79px)}
.tick{flex:0 0 158px;scroll-snap-align:center;display:grid;gap:4px;align-content:start;padding:16px 16px 18px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--hairline);cursor:pointer;opacity:.62;transition:opacity .3s,transform .35s var(--ease),background .3s,border-color .3s}
.tick.is-on{opacity:1;transform:translateY(-6px);background:var(--surface-2);border-color:var(--orange);box-shadow:0 18px 34px -18px var(--shadow)}
.tick-time{font:500 .72rem var(--mono);letter-spacing:.08em;color:var(--accent-text)} .tick-n{font:400 2.5rem/1 var(--display);color:var(--fg)}
.tick-ch{font:500 .68rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-3);margin-top:6px} .tick-t{font-weight:700;font-size:.9rem;line-height:1.25}
.deck-arrows{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center;padding-inline:max(10px,calc((100% - 1180px)/2));pointer-events:none}
.deck-arrows button{pointer-events:auto;width:46px;height:46px;border-radius:50%;border:1px solid var(--chrome-line);background:var(--chrome);color:var(--fg);font-size:1.3rem;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 10px 24px -10px var(--shadow)}
@media (hover:none){.deck-arrows{display:none}}
.day-quote{margin-top:22px!important;padding-left:20px;border-left:3px solid var(--orange);max-width:44rem}
.day-quote p{font:400 clamp(1.35rem,3vw,1.8rem)/1.25 var(--serif);font-style:italic;color:var(--fg)} .day-quote figcaption{font:500 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-3);margin-top:8px}
@media (max-width:820px){.day-panel{grid-template-columns:1fr;padding:22px 18px 12px}.day-readout{grid-template-columns:1fr auto;align-items:end;min-width:0}.day-clock{order:2;text-align:right}}

/* ---------- contents ---------- */
.seg{--n:3;--i:0;position:relative;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));max-width:420px;padding:4px;border-radius:999px;background:var(--surface-3);border:1px solid var(--hairline);margin-bottom:18px}
.seg::before{content:"";position:absolute;top:4px;bottom:4px;left:4px;width:calc((100% - 8px)/var(--n));border-radius:999px;background:var(--surface-solid);box-shadow:0 4px 14px -4px var(--shadow),inset 0 1px 0 var(--hi);transform:translateX(calc(var(--i)*100%));transition:transform .38s var(--ease)}
.seg button{position:relative;z-index:1;min-height:42px;border:0;background:none;border-radius:999px;font-weight:700;font-size:.92rem;color:var(--fg-3);transition:color .25s} .seg button[aria-selected=true]{color:var(--fg)}
.parts{display:grid;gap:14px}
.part{padding:26px 28px;border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--hairline);box-shadow:inset 0 1px 0 var(--hi)}
.js .parts.is-tabbed .part:not(.is-on){display:none}
.part header{display:flex;gap:22px;align-items:start;margin-bottom:18px}
.part-n{font:400 clamp(3.6rem,8vw,5.6rem)/.8 var(--serif);font-style:italic;color:var(--orange);min-width:1.25em}
.part h3{font-size:clamp(1.4rem,3.4vw,2rem)} .part header p{color:var(--fg-2);max-width:36rem;margin-top:6px}
.chapters li{display:grid;grid-template-columns:2.4em 1fr auto;gap:10px;align-items:baseline;padding:13px 0;border-top:1px solid var(--hairline)}
.ch-n{font:500 .78rem var(--mono);color:var(--accent-text)} .ch-t{font-weight:700;font-size:1.06rem;letter-spacing:-.01em;line-height:1.25} .ch-p{font:500 .76rem var(--mono);color:var(--fg-3)}
.contents-note{margin-top:16px!important}
.part.is-on{animation:partin .45s var(--ease)} @keyframes partin{from{opacity:0;transform:translateY(10px)}}

/* ---------- the spine ---------- */
.spine-in{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(24px,5vw,70px);align-items:center;padding:clamp(26px,5vw,56px);border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--hairline);box-shadow:inset 0 1px 0 var(--hi)}
.spine-quote blockquote p{font-weight:800;font-size:clamp(1.5rem,3.3vw,2.25rem);line-height:1.12;letter-spacing:-.03em;margin-top:.6em}
.spine-quote figcaption{font:500 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-3);margin-top:16px}
.loop{width:100%;height:auto;color:var(--fg-3);overflow:visible}
.lp-cond rect{fill:var(--surface-2);stroke:var(--hairline)} .lp-cond text,.lp-node text{font:750 19px var(--font);fill:var(--fg);text-anchor:middle}
.lp-chev{fill:none;stroke:var(--orange);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.lp-feed{fill:none;stroke:currentColor;stroke-width:1.6;stroke-dasharray:3 6}
.lp-ring{fill:none;stroke:var(--orange);stroke-width:2.5;stroke-dasharray:2 9;stroke-linecap:round}
.lp-node circle{fill:var(--surface-solid);stroke:var(--orange);stroke-width:2.5}
.lp-runner{fill:var(--orange)} .lp-orbit{transform-origin:462px 170px}
@media (prefers-reduced-motion:no-preference){.lp-orbit{animation:orbit 9s linear infinite}.lp-ring{animation:dash 30s linear infinite}}
@keyframes orbit{to{transform:rotate(360deg)}} @keyframes dash{to{stroke-dashoffset:-220}}
@media (max-width:820px){.spine-in{grid-template-columns:1fr}}

/* ---------- extract teaser, identity ---------- */
.teaser-card{position:relative;overflow:hidden;display:grid;grid-template-columns:1.5fr .7fr;gap:18px 40px;align-items:end;justify-items:start;padding:clamp(28px,5vw,60px);border-radius:var(--r-xl);background:var(--sheet);color:var(--sheet-ink);--fg:var(--sheet-ink);--fg-3:#655e69;--surface-2:#fff;--hairline:rgba(71,30,80,.2);--hi:#fff;box-shadow:0 30px 60px -30px var(--shadow)}
.teaser-card .eyebrow{color:var(--orange-deep);grid-column:1/-1}
.teaser-side{display:grid;gap:18px;justify-items:start;position:relative;z-index:1}
.teaser-gears{position:absolute;right:0;top:0;width:clamp(220px,30vw,380px);aspect-ratio:1;transform:translate(46%,-50%);pointer-events:none}
.teaser-gears .g-ivory path{fill:var(--aub)}
@media (max-width:820px){.teaser-card{grid-template-columns:1fr}}
.teaser-card blockquote p{font:400 clamp(2rem,5.4vw,3.6rem)/1.06 var(--serif);font-style:italic;letter-spacing:-.01em;max-width:24ch}
.teaser-card .muted{max-width:32rem;font-size:1.05rem}
.identity .book-quote-tile{position:relative;overflow:hidden;margin:0;padding:clamp(34px,7vw,84px) clamp(24px,6vw,72px);border-radius:var(--r-xl);background:var(--orange);color:#22101f}
.identity blockquote p{font:400 clamp(2.9rem,9.6vw,8.4rem)/.96 var(--display);text-transform:uppercase;max-width:19ch}
.identity figcaption{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:26px;font:500 .78rem var(--mono);letter-spacing:.08em;text-transform:uppercase}

/* ---------- film ---------- */
.film{border-radius:var(--r-xl);margin-inline:max(10px,calc((100% - 1240px)/2));padding:clamp(34px,6vw,72px) 0}
.film-in{display:grid;grid-template-columns:.8fr 1.5fr;gap:clamp(22px,4vw,56px);align-items:center}
.film-head h2{margin:.3em 0 .5em} .film-head p:last-child{color:var(--on-deep-2);max-width:26rem}
.film-frame{margin:0} .film-frame video{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:var(--r-md);background:#12060f;box-shadow:0 30px 70px -24px rgba(0,0,0,.8),0 0 0 1px var(--deep-line)}
.film-frame figcaption{display:flex;gap:8px 20px;flex-wrap:wrap;margin-top:12px;font-size:.82rem;color:var(--on-deep-3)} .film-frame figcaption a{color:var(--on-deep-2)}
.film-note{grid-column:1/-1;color:var(--on-deep-3)}
@media (max-width:820px){.film-in{grid-template-columns:1fr}}

/* ---------- beyond deck ---------- */
.page-home .tiles{padding-inline:max(var(--gl),calc((100% - 1180px)/2 + 18px));gap:14px;scroll-padding-inline:max(var(--gl),calc((100% - 1180px)/2 + 18px))}
.tile{flex:0 0 min(300px,78vw);scroll-snap-align:start;display:grid;align-content:start;gap:6px;padding:10px 10px 22px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--hairline);box-shadow:inset 0 1px 0 var(--hi);text-decoration:none;transition:transform .35s var(--ease),background .3s}
.tile:hover{transform:translateY(-6px);background:var(--surface-2)}
.tile-img{display:block;aspect-ratio:3/2;border-radius:var(--r-md);overflow:hidden;background:#f5eee2;margin-bottom:10px} .tile-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)} .tile:hover .tile-img img{transform:scale(1.05)}
.tile-n{font:500 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent-text);padding-inline:8px}
.tile h3{font-size:1.3rem;padding-inline:8px} .tile p{color:var(--fg-2);font-size:.95rem;line-height:1.45;padding-inline:8px}
.tile-img.parody{display:grid;align-content:space-between;padding:14px 16px;background:#f3ead7;color:#1d1a1f}
.parody-label{font:500 .62rem var(--mono);letter-spacing:.14em;text-transform:uppercase;border-bottom:2px solid currentColor;padding-bottom:6px}
.parody-mast{font:400 2.5rem/.92 var(--display);letter-spacing:.01em} .parody-mast em{font-style:normal;color:var(--orange-deep)}
.parody-cols{height:26px;background:repeating-linear-gradient(180deg,#1d1a1f55 0 2px,transparent 2px 7px);-webkit-mask:linear-gradient(90deg,#000 0 30%,transparent 30% 35%,#000 35% 65%,transparent 65% 70%,#000 70%);mask:linear-gradient(90deg,#000 0 30%,transparent 30% 35%,#000 35% 65%,transparent 65% 70%,#000 70%)}

/* ---------- author ---------- */
.author-card{display:grid;grid-template-columns:minmax(200px,340px) 1fr;gap:clamp(24px,5vw,64px);align-items:center}
.author-photo{position:relative} .author-photo img{position:relative;width:100%;border-radius:var(--r-xl);box-shadow:0 30px 60px -28px var(--shadow)}
.author-photo::before{content:"";position:absolute;inset:14px -14px -14px 14px;border-radius:var(--r-xl);background:var(--orange)}
.author-card h2{margin:.3em 0 .5em} .author-card p{color:var(--fg-2);max-width:38rem;font-size:1.06rem}
.author-links{display:flex;gap:12px 22px;flex-wrap:wrap;align-items:center;margin-top:20px!important}
@media (max-width:760px){.author-card{grid-template-columns:1fr}.author-photo{max-width:260px}}

/* ---------- closing ---------- */
.closing{border-radius:var(--r-xl);margin-inline:max(10px,calc((100% - 1240px)/2));padding:clamp(48px,9vw,110px) 0}
.closing-gears{position:absolute;z-index:-1;left:0;top:0;width:clamp(300px,40vw,520px);aspect-ratio:1;transform:translate(-52%,-52%)}
.closing-in{display:grid;gap:22px;justify-items:start;max-width:880px}
.book-closing-passage p{font-size:clamp(1.3rem,2.9vw,1.9rem);line-height:1.3;font-weight:600;letter-spacing:-.02em;color:var(--on-deep-2)}
.book-closing-passage .closing-turn{margin-top:.7em;font:400 clamp(2.1rem,6vw,4.1rem)/1.02 var(--serif);font-style:italic;color:var(--ivory);letter-spacing:-.01em}
.book-closing-passage cite{display:block;margin-top:22px;font:500 .74rem var(--mono);font-style:normal;letter-spacing:.1em;text-transform:uppercase;color:var(--on-deep-3)}

/* ---------- motion ---------- */
@media (prefers-reduced-motion:no-preference){.reveal-armed .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease)}.reveal-armed .reveal.in{opacity:1;transform:none}
  /* page to page: the chrome holds still and the sheet of paper changes underneath it */
  @view-transition{navigation:auto}
  .esod .topbar{view-transition-name:esod-topbar} .esod .tabbar{view-transition-name:esod-tabbar} .esod .strip{view-transition-name:esod-strip}
  .esod main{view-transition-name:esod-main}
  ::view-transition-old(esod-main){animation:vt-out .22s ease-in both} ::view-transition-new(esod-main){animation:vt-in .42s var(--ease) both}
}
@keyframes vt-out{to{opacity:0;transform:translateY(-10px)}} @keyframes vt-in{from{opacity:0;transform:translateY(22px)}}
.esod .progress{position:fixed;z-index:35;left:0;top:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(var(--p,0));background:linear-gradient(90deg,var(--orange),#ffb07c);pointer-events:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.gear-layer path{transition:none}.esod *{animation-duration:.01ms!important}}
@media (max-width:860px){.deck-arrows{display:none}.lp-cond text,.lp-node text{font-size:25px}.dc-tick text{font-size:30px}.dc-tick:nth-child(even) text{display:none}.dc-dot{r:9}}