@import "tailwindcss";
:root{--violet:#673b82;--violet-dark:#351c43;--ink:#201b22;--paper:#fffdf8;--line:#ded7df}*{box-sizing:border-box}body{margin:0;background:#f6f5f4;color:var(--ink);font-family:Arial,Helvetica,sans-serif}.portal{min-height:100vh;padding:42px 20px 55px;background:radial-gradient(circle at 50% 50%,#fff 0,#f5f3f5 56%,#ebe8eb 100%)}.intro{text-align:center;max-width:850px;margin:0 auto 28px}.intro p{font-size:10px;font-weight:700;letter-spacing:.25em;color:var(--violet);margin:0 0 12px}.intro h1{font:400 clamp(36px,5vw,58px)/1 Georgia,serif;letter-spacing:-.035em;margin:0}.intro span{display:block;margin-top:14px;color:#655d66;font-size:15px}.reader{display:grid;grid-template-columns:55px minmax(0,760px) 55px;align-items:center;justify-content:center;gap:18px;perspective:1800px}.bookpage{position:relative;min-height:600px;padding:64px 70px 48px;background:linear-gradient(90deg,#eee9df 0,#fffdf8 4%,#fffefa 96%,#e8e1d6 100%);box-shadow:0 28px 60px rgba(36,20,40,.2),inset 0 0 45px rgba(96,74,48,.05);border:1px solid #e0d9cf;border-radius:3px 10px 10px 3px;animation:turn .48s ease both;overflow:hidden}.bookpage:before{content:"";position:absolute;left:0;top:0;bottom:0;width:20px;background:linear-gradient(90deg,rgba(30,15,30,.14),transparent)}@keyframes turn{from{opacity:.45;transform:rotateY(-8deg) translateX(18px)}to{opacity:1;transform:none}}.bookpage.cover{display:flex;flex-direction:column;justify-content:center;color:white;background:linear-gradient(145deg,#25152d,#59316e 55%,#2b1735);border:8px solid #2a1833;box-shadow:0 30px 65px rgba(23,10,28,.34),inset 0 0 0 1px rgba(255,255,255,.16),inset 0 0 80px rgba(0,0,0,.22)}.bookpage.cover:after{content:"";position:absolute;inset:22px;border:1px solid rgba(221,205,229,.28)}.pagehead{font-size:10px;font-weight:700;letter-spacing:.23em;color:var(--violet);margin-bottom:25px}.cover .pagehead{color:#d9c4e3}.bookpage h2{font:400 clamp(35px,5vw,56px)/1.05 Georgia,serif;letter-spacing:-.035em;margin:0 0 32px;max-width:650px}.bookpage p{font:16px/1.78 Georgia,serif;color:#463e46;max-width:650px}.bookpage .lead{font-size:22px;line-height:1.5;color:#332a34}.cover p{color:#eee7f1;font-size:18px}.bookpage blockquote,.bookpage aside{margin:32px 0 0;padding:20px 24px;border-left:3px solid var(--violet);background:#f5eff7;font:italic 19px/1.55 Georgia,serif}.bookpage ol,.bookpage ul{margin:28px 0;padding:0;list-style:none}.bookpage li{padding:15px 8px;border-bottom:1px solid var(--line);font:16px/1.4 Georgia,serif}.bookpage li:before{content:"✦";color:var(--violet);margin-right:12px;font-size:10px}.bookpage footer{position:absolute;left:70px;right:55px;bottom:28px;display:flex;justify-content:space-between;padding-top:12px;border-top:1px solid var(--line);font-size:10px;letter-spacing:.12em;color:#837882}.cover footer{border-color:rgba(255,255,255,.2);color:#dacde0}.nav{width:52px;height:52px;border-radius:50%;border:1px solid #d4ccd7;background:white;color:var(--violet);font-size:24px;cursor:pointer;box-shadow:0 8px 18px rgba(40,20,45,.1)}.nav:disabled{opacity:.25;cursor:default}.dots{display:flex;justify-content:center;gap:7px;margin-top:25px}.dots button{width:7px;height:7px;padding:0;border:0;border-radius:50%;background:#c8c0ca;cursor:pointer}.dots button.active{width:24px;border-radius:5px;background:var(--violet)}.progress{text-align:center;color:#7c737c;font-size:11px;letter-spacing:.06em;margin:13px 0 0}@media(max-width:700px){.portal{padding:28px 12px 40px}.intro{margin-bottom:20px}.reader{grid-template-columns:36px minmax(0,1fr) 36px;gap:5px}.nav{width:35px;height:35px;font-size:18px}.bookpage{min-height:570px;padding:42px 31px 54px}.bookpage h2{font-size:35px;margin-bottom:22px}.bookpage p{font-size:14px;line-height:1.65}.bookpage .lead{font-size:18px}.bookpage blockquote,.bookpage aside{font-size:15px;padding:15px;margin-top:22px}.bookpage li{font-size:13px;padding:12px 3px}.bookpage footer{left:31px;right:25px;bottom:22px;font-size:8px}.progress{font-size:9px}.intro span{font-size:13px}}