@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=IM+Fell+English:ital@0;1&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap');
:root { --wine:#3c0b12; --wine2:#56141c; --ink:#24140e; --paper:#e9d5a7; --gold:#c6923a; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#190709; color:var(--ink); font-family:'Libre Baskerville',Georgia,serif; }
button,a { font:inherit; }
a { color:inherit; text-decoration:none; }
button { cursor:pointer; }
.topbar { height:84px; padding:0 5vw; position:absolute; z-index:10; inset:0 0 auto; color:#f5dfae; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #d1a15444; }
.brand { display:flex; align-items:center; gap:12px; font-family:'Cinzel',serif; font-size:14px; letter-spacing:.06em; font-weight:700; }
.crest { width:42px; height:42px; display:grid; place-items:center; border:1px solid #c89b4f; border-radius:50%; background:#e0bb7020; overflow:hidden; }
.crest img { width:52px; margin-top:14px; }
nav { display:flex; gap:34px; font-size:12px; letter-spacing:.09em; text-transform:uppercase; }
nav a { opacity:.75; transition:.2s; } nav a:hover { opacity:1; color:#e6bd70; }
.ticker { color:#f4d999; border:1px solid #b78945; background:#2a080d99; padding:11px 16px; text-transform:uppercase; letter-spacing:.08em; font-size:11px; }
.ticker span { margin-left:10px; color:#e6b95e; }
.hero { position:relative; min-height:100vh; display:grid; place-items:center; overflow:hidden; padding:110px 20px 60px; background:radial-gradient(ellipse at center,#551821 0,#2c080e 55%,#130406 100%); }
.hero:before { content:""; position:absolute; inset:0; opacity:.18; background-image:repeating-linear-gradient(92deg,transparent 0 7px,#000 8px 9px),radial-gradient(circle at 50% 30%,#dcb46b55,transparent 45%); }
.forest { position:absolute; bottom:0; width:32%; height:70%; opacity:.28; filter:blur(1px); background:linear-gradient(150deg,transparent 45%,#050102 46% 49%,transparent 50%),linear-gradient(30deg,transparent 44%,#050102 45% 48%,transparent 49%); }
.forest:after { content:""; position:absolute; inset:0; background:repeating-linear-gradient(80deg,transparent 0 34px,#080203 36px 44px,transparent 46px 80px); }
.forest-left { left:-5%; transform:skewX(-8deg); } .forest-right { right:-5%; transform:scaleX(-1) skewX(-8deg); }
.book-cover { position:relative; z-index:2; width:min(570px,80vw); aspect-ratio:.77; padding:17px; border-radius:4px 16px 16px 4px; color:#e7c47e; background:linear-gradient(90deg,#26070b,#4f1119 4%,#621d24 47%,#451018 96%,#210508); box-shadow:-25px 25px 55px #050000aa,inset 0 0 55px #170407,0 0 0 2px #180408,0 0 0 6px #6d242a; transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .8s ease; transform-origin:left center; cursor:pointer; }
.book-cover.open { transform:perspective(1600px) rotateY(-118deg) translateX(-42%); opacity:.12; pointer-events:none; }
.book-cover:focus-visible { outline:3px solid #edc16e; outline-offset:10px; }
.book-cover:before { content:""; position:absolute; left:18px; top:0; bottom:0; width:8px; border-left:1px solid #9b573755; border-right:1px solid #1d0407; }
.cover-frame { height:100%; border:2px solid #b68745; outline:1px solid #7c512c; outline-offset:-9px; display:flex; flex-direction:column; align-items:center; text-align:center; padding:7% 9%; position:relative; }
.cover-frame:before,.cover-frame:after { content:"✦"; position:absolute; font-size:18px; color:#ca9b4d; } .cover-frame:before { top:16px; left:18px; } .cover-frame:after { bottom:16px; right:18px; }
.flourish { font-size:36px; transform:rotate(-35deg); color:#d5a955; }
.eyebrow { font-family:'Cinzel',serif; text-transform:uppercase; letter-spacing:.24em; font-size:11px; margin:12px 0; }
h1,h2,h3 { font-family:'Cinzel',serif; }
h1 { font-size:clamp(30px,4.2vw,54px); line-height:1.03; text-transform:uppercase; letter-spacing:.04em; margin:5px 0 8px; text-shadow:0 2px #1b0508; }
h1 em,h2 em { font-family:'IM Fell English',serif; font-weight:400; text-transform:none; color:#e0aa4a; }
.hero-portrait { flex:1; min-height:180px; width:77%; overflow:hidden; display:flex; align-items:flex-start; justify-content:center; margin-top:4px; filter:drop-shadow(0 10px 8px #17030688); }
.hero-portrait img { width:100%; transform:translateY(-1%); }
.motto { font-family:'IM Fell English',serif; font-style:italic; font-size:14px; margin:0 0 14px; color:#f0d49d; }
.open-book { border:1px solid #cb9a4b; border-radius:4px; color:#f4dfa9; background:#2c080e; padding:13px 22px; font-family:'Cinzel',serif; text-transform:uppercase; letter-spacing:.14em; font-size:10px; box-shadow:inset 0 0 0 3px #55201e,0 0 7px #d9a64c44; animation:book-button-glow 2.2s ease-in-out infinite; }
.open-book span { margin-left:14px; color:#e4b253; }
@keyframes book-button-glow { 0%,100% { box-shadow:inset 0 0 0 3px #55201e,0 0 5px #d9a64c33,0 0 0 #d9a64c00; } 50% { box-shadow:inset 0 0 0 3px #754028,0 0 18px #eabe62cc,0 0 34px #ca8f324f; } }
.cover-disclaimer { max-width:420px; margin:13px 0 0; padding-top:9px; border-top:1px solid #b7894566; color:#d2b87d; font-family:Georgia,serif; font-size:7px; line-height:1.45; letter-spacing:.07em; text-transform:uppercase; opacity:.82; }
.site-footer { min-height:58px; display:flex; align-items:center; justify-content:center; padding:18px 20px; border-top:1px solid #b7894566; color:#d8b56d; background:#160406; box-shadow:inset 0 12px 28px #08010288; font-family:'Cinzel',serif; font-size:9px; letter-spacing:.16em; text-align:center; text-transform:uppercase; }.site-footer span { margin:0 9px; color:#8f6031; }
.scroll-cue { position:absolute; bottom:20px; z-index:3; color:#d4ac6c; font-size:9px; letter-spacing:.22em; text-transform:uppercase; display:flex; align-items:center; flex-direction:column; gap:3px; opacity:.7; }
.scroll-cue span { font-size:20px; animation:bob 1.5s infinite; } @keyframes bob { 50% { transform:translateY(5px); } }
.book-reader { position:absolute; z-index:6; left:50%; top:52%; width:min(1000px,94vw); height:min(760px,calc(100svh - 125px)); display:grid; place-items:center; padding:0; visibility:hidden; opacity:0; transform:translate(-50%,-50%) scale(.9); transform-origin:center; transition:opacity .55s ease,transform .7s cubic-bezier(.2,.75,.2,1),visibility .55s; perspective:1600px; }
.book-reader.visible { visibility:visible; opacity:1; }
.book-reader.visible { transform:translate(-50%,-50%) scale(1); }
.reader-backdrop { display:none; }
.reader-shell { position:relative; width:100%; height:100%; color:#321f16; background:#d8ba7f; border:14px solid #4b1117; border-radius:6px 18px 18px 6px; box-shadow:0 32px 75px #050000aa,inset 0 0 55px #76512666,0 0 0 3px #7c2a31; overflow:hidden; }
.reader-shell:before { content:""; position:absolute; inset:13px; border:1px solid #93662d; pointer-events:none; z-index:5; }
.reader-spine { position:absolute; z-index:4; left:50%; top:0; bottom:0; width:32px; transform:translateX(-50%); opacity:.35; background:linear-gradient(90deg,transparent,#5e3b1d,transparent); pointer-events:none; }
.reader-close { position:absolute; z-index:10; right:22px; top:19px; width:42px; height:42px; border:1px solid #855528; border-radius:50%; background:#e4cc99; color:#651f20; font-size:28px; line-height:1; }
.reader-page { position:absolute; inset:0; padding:46px 54px 90px; overflow-y:auto; opacity:0; pointer-events:none; transform-origin:left center; transform:perspective(1200px) rotateY(95deg); transition:transform .7s cubic-bezier(.2,.75,.2,1),opacity .25s; background-color:#e8d19f; background-image:radial-gradient(#70491922 1px,transparent 1px),linear-gradient(90deg,#8b642f33,transparent 8%,transparent 92%,#7d542733); background-size:5px 5px,100% 100%; scrollbar-color:#986b32 transparent; }
.reader-page.active { opacity:1; pointer-events:auto; transform:perspective(1200px) rotateY(0); }
.reader-page.turning-out { opacity:0; transform:perspective(1200px) rotateY(-95deg); }
.page-ornament { width:calc(50% - 52px); text-align:center; color:#8d2e2e; font-size:32px; transform:rotate(-30deg); }
.page-number { width:calc(50% - 52px); text-align:center; margin:0; font-family:'Cinzel',serif; text-transform:uppercase; letter-spacing:.3em; color:#8c562b; font-size:10px; }
.reader-page h2 { width:calc(50% - 52px); margin:8px 0 28px; text-align:center; font-size:clamp(25px,3vw,38px); line-height:1.1; color:#59221e; }
.page-text { width:100%; margin:auto; columns:2; column-gap:104px; column-fill:balance; font-family:'IM Fell English',Georgia,serif; font-size:16px; line-height:1.62; text-align:left; hyphens:auto; }
.page-text p { margin:0 0 1em; break-inside:avoid; }.page-text p:first-child:first-letter { float:left; font-size:58px; color:#8e2c2d; line-height:.75; padding:11px 8px 0 0; }
.page-text .dramatic { text-align:center; color:#7b2526; font-size:22px; font-style:italic; padding:5px 0; }
.closing-quote { border-top:1px solid #966633; border-bottom:1px solid #966633; padding:18px!important; text-align:center; font-style:italic; }
.reader-controls { position:absolute; z-index:8; bottom:0; left:0; right:0; height:82px; display:flex; align-items:center; justify-content:space-between; padding:0 38px; color:#f7e2ad; background:#4b1117; border-top:2px solid #d2a34f; box-shadow:0 -8px 20px #2b080c33; }
.reader-controls button { min-width:150px; border:1px solid #e3ba68; color:#2b0a0d; background:#d7a64f; box-shadow:inset 0 0 0 3px #f0d18455,0 4px 10px #18030577; font-family:'Cinzel',serif; font-weight:700; text-transform:uppercase; letter-spacing:.11em; font-size:11px; padding:14px 18px; transition:background .2s,transform .2s; }
.reader-controls button:not(:disabled):hover { background:#edc36e; transform:translateY(-2px); }
.reader-controls button:disabled { opacity:.38; cursor:not-allowed; }.reader-controls p { min-width:66px; margin:0; padding:10px 12px; border:1px solid #b88943; border-radius:50%; background:#2c080d; text-align:center; font-family:'Cinzel',serif; font-size:11px; letter-spacing:.12em; }
.feature-spread { display:grid; grid-template-columns:1fr 1fr; gap:70px 104px; align-items:center; padding:10px 5px 20px; }
.feature-copy { min-width:0; }.feature-kicker { margin:0 0 12px; color:#8d2e2e; font-family:'Cinzel',serif; font-size:9px; letter-spacing:.2em; text-transform:uppercase; }
.feature-copy h3,.community-spread h3 { margin:0 0 20px; color:#3d2116; font-family:'Cinzel',serif; font-size:32px; line-height:1.05; text-transform:uppercase; }
.feature-copy h3 em,.community-spread h3 em { color:#8d2e2e; font-family:'IM Fell English',serif; font-weight:400; text-transform:none; }
.feature-copy > p:not(.feature-kicker),.community-spread > p:not(.feature-kicker) { color:#503729; font-family:'IM Fell English',serif; font-size:17px; line-height:1.6; }
.book-token-facts { display:flex; gap:34px; margin:25px 0; padding:16px 0; border-top:1px solid #93642f88; border-bottom:1px solid #93642f88; }
.book-token-facts div { display:flex; flex-direction:column; gap:6px; }.book-token-facts small { color:#8d2e2e; font-size:8px; letter-spacing:.16em; text-transform:uppercase; }.book-token-facts strong { font-family:'Cinzel',serif; font-size:12px; }
.feature-page .contract-container { background:#6f462917; box-shadow:inset 0 0 14px #6a461522; }.feature-page .contract-container code { color:#4a2c20; }
.book-coin { position:relative; width:100%; max-width:300px; justify-self:center; }.book-coin .coin { width:100%; }.book-coin .spark { color:#9b692c; }
.community-spread { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:auto auto auto 1fr; column-gap:104px; align-items:start; padding:16px 5px; }
.community-spread .feature-kicker,.community-spread h3,.community-spread > p,.community-spread > .primary { grid-column:1; }.community-spread blockquote { grid-column:2; grid-row:1 / span 4; align-self:center; margin:0; padding:35px 20px; font-size:23px; }
.community-spread .primary { width:max-content; margin-top:10px; }.book-signoff { grid-column:2; display:flex; flex-direction:column; gap:8px; align-self:end; padding-top:22px; border-top:1px solid #93642f; color:#6e3c27; font-family:'Cinzel',serif; font-size:10px; letter-spacing:.1em; text-transform:uppercase; }
body.book-open { overflow:auto; }.hero:has(.book-reader.visible) .scroll-cue { opacity:0; }
.paper-section { position:relative; background-color:var(--paper); background-image:radial-gradient(#6d421421 1px,transparent 1px),linear-gradient(90deg,#8a5d2533,transparent 4%,transparent 96%,#8a5d2533); background-size:5px 5px,100% 100%; padding:110px 20px; box-shadow:inset 0 20px 30px #6f421f44,inset 0 -20px 30px #6f421f44; }
.paper-inner { max-width:1060px; margin:auto; }
.chapter-heading { display:flex; align-items:center; justify-content:center; gap:20px; color:#80521d; text-transform:uppercase; letter-spacing:.25em; font-family:'Cinzel',serif; font-size:10px; }
.chapter-heading:before,.chapter-heading:after { content:""; width:70px; height:1px; background:#8f642e; }
.paper-section h2,.token-section h2,.finale h2 { text-align:center; font-size:clamp(36px,5vw,64px); line-height:1; margin:20px 0; letter-spacing:-.025em; text-transform:uppercase; }
.paper-section h2 em { color:#8c2c2f; }
.lead { max-width:600px; margin:0 auto 70px; text-align:center; font-family:'IM Fell English',serif; font-style:italic; font-size:19px; line-height:1.6; color:#63452b; }
.story-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 80px; }
.chapter { padding:34px 0; border-top:1px solid #78502055; }
.chapter:nth-child(-n+2) { border-top:2px solid #78502099; }
.chapter-number { font-family:'Cinzel',serif; color:#93362d; text-transform:uppercase; letter-spacing:.2em; font-size:9px; }
.chapter h3 { font-size:21px; margin:12px 0 14px; color:#362117; }
.chapter p { font-size:13px; line-height:1.85; color:#4f3829; margin:0; }
.chapter p:first-letter { float:left; font-family:'IM Fell English',serif; color:#8e2c2d; font-size:50px; line-height:.75; padding:9px 8px 0 0; }
blockquote { margin:70px auto 0; text-align:center; max-width:770px; padding:36px; border-top:1px solid #976b34; border-bottom:1px solid #976b34; font-family:'IM Fell English',serif; font-size:26px; font-style:italic; line-height:1.4; color:#722b28; }
.token-section { min-height:720px; display:flex; align-items:center; justify-content:center; gap:9vw; padding:100px 8vw; color:#f1ddaf; background:radial-gradient(circle at 75% 50%,#5f2125,#26080d 48%,#160407); overflow:hidden; }
.token-copy { max-width:480px; }
.token-copy h2 { text-align:left; margin:15px 0 25px; }
.gold { color:#d5a852; }
.token-copy > p:not(.eyebrow) { color:#c6ad8d; font-size:14px; line-height:1.8; }
.token-facts { display:flex; gap:50px; border-top:1px solid #b4894f66; border-bottom:1px solid #b4894f66; padding:22px 0; margin:34px 0; }
.token-facts div { display:flex; flex-direction:column; gap:7px; }
.token-facts small { color:#c2914b; text-transform:uppercase; letter-spacing:.18em; font-size:9px; }
.token-facts strong { font-family:'Cinzel',serif; font-size:14px; }
.contract-container { margin:0 0 16px; padding:16px 18px; border:1px solid #b4894f88; background:#16040888; box-shadow:inset 0 0 18px #0005; }
.contract-container small { display:block; margin-bottom:9px; color:#c2914b; text-transform:uppercase; letter-spacing:.18em; font-size:9px; }
.contract-container code { display:block; color:#f2dba7; font-family:Georgia,serif; font-size:13px; line-height:1.5; word-break:break-all; }
.copy-button,.primary { border:0; background:#c48e3d; color:#26090c; padding:16px 22px; text-transform:uppercase; letter-spacing:.13em; font-family:'Cinzel',serif; font-size:10px; font-weight:700; }
.copy-button span { margin-left:18px; }
.copy-button:disabled { cursor:not-allowed; opacity:.55; }
.coin-wrap { width:min(400px,38vw); aspect-ratio:1; position:relative; display:grid; place-items:center; }
.coin { width:82%; aspect-ratio:1; border-radius:50%; padding:20px; background:linear-gradient(145deg,#f0c45f,#8b541b 45%,#e6b950 72%,#6d3f13); box-shadow:0 30px 60px #05000088,inset 0 0 0 5px #f3cf7888,0 0 70px #dca64833; transform:rotate(5deg); }
.coin-inner { height:100%; border-radius:50%; border:4px double #673b15; overflow:hidden; background:#e8b854; display:flex; justify-content:center; align-items:flex-start; }
.coin-inner img { width:104%; transform:translateY(5%); filter:sepia(.25) contrast(1.06); }
.spark { position:absolute; color:#e8ba58; } .s1{top:2%;right:10%;font-size:30px}.s2{bottom:8%;left:0;font-size:16px}.s3{top:25%;left:0;font-size:10px}
.finale { padding:110px 20px; background:#d9bd84; background-image:linear-gradient(#ac885033 1px,transparent 1px); background-size:100% 34px; }
.finale-card { max-width:900px; margin:auto; border:1px solid #885a2c; outline:1px solid #9e7445; outline-offset:-10px; padding:70px; text-align:center; background:#e4cc99cc; box-shadow:0 20px 50px #54331333; }
.quill { display:block; color:#8d302d; font-size:45px; transform:rotate(-35deg); }
.finale h2 em { color:#8d302d; }
.finale-card > p:not(.eyebrow) { max-width:620px; margin:0 auto 32px; color:#5a3e2b; line-height:1.8; font-size:14px; }
.actions { display:flex; justify-content:center; align-items:center; gap:25px; }
.primary span { margin-left:15px; }.secondary { font-size:10px; text-transform:uppercase; letter-spacing:.12em; border-bottom:1px solid #7d4c2c; padding:10px 0; }
footer { display:flex; justify-content:space-between; align-items:center; padding:30px 5vw; color:#cda96c; background:#180507; font-family:'Cinzel',serif; font-size:10px; text-transform:uppercase; letter-spacing:.12em; }
footer p { font-family:'IM Fell English',serif; text-transform:none; font-style:italic; letter-spacing:.03em; color:#8d7252; }
@media (max-width:760px) {
  .topbar { height:68px; padding:0 12px; background:#26080ddb; border-bottom-color:#d1a15466; backdrop-filter:blur(12px); box-shadow:0 8px 24px #09010266; }.brand { gap:8px; font-size:10px; line-height:1.15; letter-spacing:.03em; }.brand span:last-child { display:inline; width:78px; }.crest { width:38px; height:38px; flex:0 0 38px; }.ticker { display:none; }
  nav { display:flex; gap:0; margin-left:auto; border:1px solid #b78945; background:#17040799; }nav a { display:block; min-width:42px; padding:10px 11px; color:#f1d69b; text-align:center; font-size:9px; letter-spacing:.08em; opacity:1; }nav a + a { border-left:1px solid #b7894566; }nav a:first-child { display:none; }
  .hero { min-height:100svh; padding:84px 12px 55px; align-items:center; }.forest { display:none; }
  .book-cover { width:min(92vw,390px); aspect-ratio:.74; padding:11px; border-radius:3px 12px 12px 3px; box-shadow:-12px 16px 30px #050000aa,inset 0 0 35px #170407,0 0 0 2px #180408,0 0 0 4px #6d242a; }
  .book-cover:before { left:11px; width:5px; }.cover-frame { padding:6% 5.5% 5%; outline-offset:-6px; }
  .cover-frame .flourish { font-size:27px; line-height:1; }.cover-frame .eyebrow { margin:10px 0 7px; max-width:none; white-space:nowrap; letter-spacing:.13em; font-size:7px; }
  h1 { font-size:clamp(26px,9vw,34px); line-height:1.02; letter-spacing:.01em; margin:4px 0 2px; }.hero-portrait { width:100%; min-height:205px; margin-top:0; }.hero-portrait img { width:125%; max-width:none; transform:translateY(-2%); }
  .motto { font-size:11px; margin:2px 0 9px; }.open-book { padding:11px 16px; font-size:8px; letter-spacing:.12em; }.open-book span { margin-left:10px; }.cover-disclaimer { margin-top:8px; padding-top:6px; font-size:5.5px; line-height:1.3; letter-spacing:.04em; }.site-footer { min-height:52px; padding:16px 12px; font-size:7px; letter-spacing:.1em; }.scroll-cue { bottom:11px; font-size:7px; letter-spacing:.17em; }
  .paper-section { padding:80px 22px; }.story-grid { grid-template-columns:1fr; }.chapter:nth-child(2) { border-top:1px solid #78502055; }.lead { margin-bottom:45px; }.chapter-heading:before,.chapter-heading:after { width:20px; }.paper-section h2,.token-section h2,.finale h2 { font-size:38px; }
  .token-section { flex-direction:column; padding:80px 24px; gap:60px; }.token-copy h2 { text-align:left; }.coin-wrap { width:78vw; order:-1; }.token-facts { gap:30px; }
  .finale { padding:70px 16px; }.finale-card { padding:55px 24px; }.actions { flex-direction:column; } footer { flex-direction:column; gap:8px; text-align:center; }
  .book-reader { top:51%; width:96vw; height:calc(100svh - 86px); padding:0; }.reader-shell { width:100%; height:100%; border-width:8px; }.reader-page { padding:48px 27px 98px; }.reader-spine { display:none; }.page-ornament,.page-number,.reader-page h2 { width:100%; }.reader-page h2 { font-size:clamp(27px,8vw,38px); }.page-text { columns:1; width:auto; font-size:16px; text-align:left; }.reader-controls { height:82px; padding:0 9px; gap:8px; }.reader-controls button { min-width:88px; padding:13px 10px; font-size:15px; }.reader-controls button span { display:none; }.reader-controls p { min-width:58px; padding:9px 7px; }.reader-close { right:16px; top:14px; }
  .feature-spread,.community-spread { display:block; padding:10px 0 25px; }.feature-copy h3,.community-spread h3 { font-size:27px; }.book-coin { width:190px; margin:35px auto 15px; }.community-spread blockquote { margin:30px 0 20px; font-size:20px; }.book-signoff { margin-top:24px; }.book-token-facts { gap:20px; }
}
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; animation:none!important; transition:none!important; } }
