/* Workspace palette and typography */
* { box-sizing:border-box }
body { margin:0; font:15px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif; background:#f8f9f5; }
.phone { --ink:#24372c; --muted:#606d62; --bg:#f8f9f5; --card:#fff; --line:#dce1d8; --accent:#31634a; --soft:#e7efdf; --warm:#f7efdc; --serif:Georgia,"Times New Roman",serif; --rail:225px; --bar:65px; color:var(--ink); background:var(--bg); height:100vh; height:100dvh; position:relative; overflow:hidden; }
.phone.dark { --ink:#edf2e9; --muted:#b0bcaf; --bg:#18241e; --card:#213027; --line:#3a4b3f; --accent:#b2d0b1; --soft:#344c3b; --warm:#413b29; color-scheme:dark; }
button,input,textarea,select { font:inherit; }
button { border:0; cursor:pointer; color:inherit; background:transparent; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #bc792c; outline-offset:3px; }
button:disabled { opacity:.55; cursor:default; }
svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
h1,h2,h3,p { margin:0; }
h1,h2,h3,strong { overflow-wrap:anywhere; }
h1 { font:500 clamp(32px,3.2vw,50px)/1.12 var(--serif); letter-spacing:-.045em; }
h2 { font:500 25px/1.2 var(--serif); letter-spacing:-.035em; }
h3 { font-size:15px; line-height:1.4; }
p { line-height:1.65; }
small,.muted,.tiny { color:var(--muted); }
small { font-size:12px; }
.skip { position:absolute; z-index:99; top:-100px; left:10px; padding:10px; background:var(--card); color:var(--ink); }
.skip:focus { top:10px; }
/* Navigation */
.sidebar { position:absolute; inset:0 auto 0 0; width:var(--rail); display:flex; flex-direction:column; background:var(--card); border-right:1px solid var(--line); padding:26px 17px 20px; overflow-y:auto; }
.brand { display:flex; align-items:center; gap:10px; font:600 27px/1 var(--serif); letter-spacing:-1.3px; padding:0 10px; }
.logo { display:grid; place-items:center; background:#294c38; color:#e1edb0; border-radius:9px; width:37px; height:37px; flex:none; }
.logo svg { width:25px; height:25px; }
.sidenav { margin-top:37px; display:grid; gap:4px; }
.nav-label,.eyebrow,.group,.focus-label { text-transform:uppercase; letter-spacing:.14em; font:700 10px/1.4 system-ui,sans-serif; letter-spacing:.13em; color:var(--muted); }
.nav-label { padding:0 13px 8px; }
.nav-personal { border-top:1px solid var(--line); margin:17px 0 0; padding-top:21px; }
.sidenav button { display:flex; gap:12px; padding:11px 13px; align-items:center; font-size:13px; font-weight:540; border-radius:7px; text-align:left; color:var(--muted); }
.sidenav button[aria-current],.bottom button[aria-current] { background:var(--soft); color:var(--accent); font-weight:700; }
.sidenav button:hover,.sideuser:hover { background:var(--soft); }
.sideuser { display:flex; align-items:center; gap:11px; margin-top:auto; padding:16px 4px 2px; border-top:1px solid var(--line); text-align:left; }
.sideuser strong,.sideuser small { display:block; font-size:12px; }
.sideuser small { font-size:11px; }
.avatar { width:35px; height:35px; flex-shrink:0; display:grid; place-items:center; border-radius:50%; color:#614324; background:#ecdbc0; font-size:11px; font-weight:700; }
.chevron { color:var(--muted); font-size:21px; margin-left:auto; }
.appbar { height:var(--bar); margin-left:var(--rail); border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; padding:0 clamp(20px,3.2vw,56px); background:var(--card); }
.crumb,.topright { display:flex; align-items:center; gap:13px; color:var(--muted); font-size:12px; }
.crumb span { color:var(--line); }
.crumb b { color:var(--ink); font-weight:600; }
.topright time { font-size:12px; }
.mobilebrand,.bottom { display:none; }
.content { margin-left:var(--rail); height:calc(100% - var(--bar)); overflow:auto; scrollbar-gutter:stable; padding:clamp(23px,2.7vw,44px) clamp(20px,3.2vw,56px) 48px; }
.page-width { max-width:1350px; margin:auto; }
.startup { margin:48px auto; max-width:600px; }
/* Overview */
.desk-title { margin-bottom:22px; }
.desk-title p,.title p { margin-top:7px; font-size:14px; color:var(--muted); }
.desk-title p span { margin:0 6px; }
.focus-banner { position:relative; isolation:isolate; display:flex; align-items:center; overflow:hidden; min-height:208px; border-radius:14px; color:#f6f3db; background:#294b3b; }
.focus-copy { padding:24px 32px; position:relative; z-index:1; max-width:62%; }
.focus-label { color:#dce6b8; display:flex; align-items:center; gap:8px; }
.light-dot { width:7px; height:7px; background:#c6d994; border-radius:50%; }
.focus-banner h2 { color:#fff8e5; font:500 clamp(36px,3.7vw,56px)/1.07 var(--serif); margin:9px 0 6px; letter-spacing:-.045em; }
.focus-banner p { color:#e3eadd; font-size:13px; }
.focus-action { display:inline-flex; align-items:center; gap:9px; border-radius:7px; padding:10px 15px; background:#e3ecba; color:#233b2d; font-size:12px; font-weight:700; margin-top:19px; }
.focus-action svg { width:13px; height:13px; fill:currentColor; }
.button-divider { height:15px; width:1px; background:#9ead89; }
.desk-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:18px; margin:22px 0; }
.panel,.card,.quizcanvas { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:22px; }
.panel-head,.section,.spread { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.panel-head { margin-bottom:12px; }
.panel-head h2 { display:flex; align-items:center; gap:9px; font-size:24px; }
.panel-head h2 svg { color:var(--accent); width:18px; height:18px; }
.link,.back { color:var(--accent); font-size:12px; font-weight:650; padding:6px 1px; }
.link:hover,.back:hover { text-decoration:underline; }
.panel-head .link { white-space:nowrap; }
.deadline,.agenda-row,.shelf-book { text-align:left; width:100%; display:flex; align-items:center; gap:13px; }
.deadline { padding:12px 0; border-top:1px solid var(--line); }
.deadline:hover strong,.shelf-book:hover strong,.agenda-row:hover strong { text-decoration:underline; }
.date-tile { flex:none; width:45px; min-height:45px; display:grid; place-content:center; text-align:center; line-height:1; border-radius:7px; background:var(--bg); border:1px solid var(--line); }
.date-tile b { font:500 22px/1 var(--serif); }
.date-tile small { margin-top:2px; font-size:9px; text-transform:uppercase; letter-spacing:.09em; }
.deadline-name,.shelf-name,.agenda-row span { display:grid; gap:2px; min-width:0; }
.deadline-name strong,.agenda-row strong,.shelf-name strong { font-size:13px; line-height:1.45; font-weight:650; }
.priority,.chip { font-size:10px; font-weight:650; border-radius:5px; padding:4px 8px; display:inline-block; }
.priority { margin-left:auto; white-space:nowrap; }
.high,.chip.red { background:#f6e4dc; color:#883f2e; }
.medium,.chip.warm { background:#f4ead3; color:#75551b; }
.low,.chip { background:var(--soft); color:var(--accent); }
.week-strip { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:3px; border-block:1px solid var(--line); padding:9px 0; }
.weekday { display:grid; justify-items:center; gap:2px; padding:5px 1px; border-radius:7px; }
.weekday small { font-size:10px; }
.weekday b { font-size:14px; font-variant-numeric:tabular-nums; }
.weekday[aria-pressed=true] { background:var(--accent); color:var(--bg); }
.weekday[aria-pressed=true] small { color:inherit; }
.weekday:hover:not([aria-pressed=true]) { background:var(--soft); }
.agenda-row { padding:9px 0 0; gap:12px; }
.agenda-row time { font-size:11px; color:var(--muted); font-variant-numeric:tabular-nums; }
.agenda-row span { border-left:3px solid #89a17f; padding-left:10px; }
.agenda-row:nth-child(even) span { border-color:#ceaa7c; }
.shelf-grid,#files { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.shelf-book { background:var(--card); border:1px solid var(--line); padding:16px; border-radius:10px; }
.shelf-book .chevron { font-size:18px; }
.file { flex:none; width:38px; min-height:45px; background:#f6e6df; color:#9a533c; border-radius:6px; display:grid; place-content:center; justify-items:center; font-size:9px; font-weight:700; }
.file svg { width:16px; height:16px; }
.file.doc { background:#e4ebf7; color:#456685; }
/* Module screens and forms */
.reading { max-width:930px; margin:0 auto; }
.title { margin-bottom:21px; }
.row,.actions,.revisionactions { display:flex; align-items:center; gap:11px; }
.grow { flex:1; min-width:0; }
.primary,.secondary { font-size:13px; font-weight:650; border-radius:7px; padding:10px 15px; }
.primary { background:var(--accent); color:var(--bg); }
.secondary { background:var(--card); border:1px solid var(--line); color:var(--ink); }
.primary:hover,.focus-action:hover { filter:brightness(.94); }
.secondary:hover,.listselect:hover,.answer:hover,.checkbox:hover { background:var(--soft); }
.wide { width:100%; }
.card { margin-bottom:14px; }
.card p { font-size:14px; }
.card .actions { border-top:1px solid var(--line); padding-top:11px; margin-top:15px; justify-content:space-between; }
#files .card { margin:0; }
.dots,.more { min-width:34px; min-height:36px; border-radius:6px; font-size:20px; }
.dots:hover,.more:hover { background:var(--soft); }
input,textarea,select { width:100%; min-width:0; background:var(--card); border:1px solid var(--line); border-radius:7px; padding:10px 12px; color:var(--ink); font-size:14px; }
label { display:block; font-size:13px; font-weight:650; margin:15px 0 6px; }
textarea { min-height:78px; resize:vertical; }
.timegrid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 12px; }
.timegrid label { grid-row:1; }
.timegrid input { grid-row:2; }
.tabs { display:flex; gap:6px; overflow:auto; margin:18px 0; padding:3px; }
.tabs button { white-space:nowrap; border:1px solid var(--line); border-radius:18px; padding:7px 12px; color:var(--muted); font-size:12px; }
.tabs button.on { color:var(--accent); background:var(--soft); border-color:var(--accent); }
.note,.revisionbox { background:var(--soft); border-radius:8px; padding:14px 17px; margin:18px 0; font-size:13px; }
.checkbox { width:24px; height:24px; border:1px solid var(--line); border-radius:6px; flex-shrink:0; padding:0; color:var(--accent); }
.item,.setting,.topicrow { padding:14px 0; border-bottom:1px solid var(--line); }
.item:last-child,.setting:last-child,.topicrow:last-child { border:0; }
.progress { background:var(--line); height:5px; border-radius:8px; overflow:hidden; margin-top:9px; }
.progress i { display:block; background:var(--accent); height:100%; }
.profilehead { display:grid; justify-items:center; padding:12px 0 20px; text-align:center; }
.profilehead .avatar { width:54px; height:54px; font-size:17px; margin-bottom:8px; }
.group { margin:22px 0 8px; }
.setting { display:flex; align-items:center; gap:12px; }
.setting strong,.setting small { display:block; }
.setting strong { font-size:14px; }
.settingicon { display:grid; place-items:center; border-radius:7px; background:var(--soft); color:var(--accent); padding:9px; }
.toggle { background:var(--muted); border-radius:30px; width:39px; height:23px; padding:3px; flex:none; }
.toggle:before { content:''; display:block; border-radius:50%; width:17px; height:17px; background:var(--card); }
.toggle.on { background:var(--accent); }
.toggle.on:before { margin-left:auto; }
.danger { color:#a04438; }
.primary.danger { color:white; background:#994639; }
.tiny { font-size:12px; margin:12px 0; }
.empty { text-align:center; color:var(--muted); padding:18px 8px; font-size:13px; }
.schedulegrid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:20px; align-items:start; }
.section { margin-bottom:14px; }
.timeline { padding-left:12px; border-left:3px solid #a4b991; }
.timerdisc,.score { border:5px solid var(--soft); border-top-color:var(--accent); border-radius:50%; display:grid; align-content:center; justify-content:center; width:185px; height:185px; margin:22px auto; }
.timer { font:500 49px/1.2 var(--serif); font-variant-numeric:tabular-nums; }
.center { text-align:center; }
.score { width:120px; height:120px; font:500 34px var(--serif); }
.quizcanvas { max-width:760px; margin:auto; }
.qtitle { margin-top:22px; }
.answer { width:100%; text-align:left; border:1px solid var(--line); border-radius:7px; padding:13px 14px; margin-top:9px; }
.answer.selected { border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent); background:var(--soft); }
.back { display:inline-flex; align-items:center; gap:5px; margin-bottom:14px; }
.revisionactions { flex-wrap:wrap; margin-top:14px; }
.sourceexcerpt { border-left:3px solid var(--accent); padding:12px 16px; margin:16px 0; background:var(--soft); }
.sign-in { max-width:510px; margin:20px auto; padding:26px; background:var(--card); border:1px solid var(--line); border-radius:12px; }
.sign-in .primary,.sign-in .secondary { margin-top:15px; }
.auth .sidebar,.auth .bottom,.inquiz .bottom,.auth .topright,.auth .crumb,.welcome { display:none; }
.auth .appbar,.auth .content { margin-left:0; }
.auth .mobilebrand { display:flex; }
.modalback { position:fixed; z-index:30; inset:0; display:grid; place-items:center; padding:16px; background:#11241c80; }
.sheet { width:min(100%,470px); max-height:90dvh; overflow:auto; padding:24px; border-radius:13px; background:var(--card); box-shadow:0 12px 40px #17271b2b; }
.sheet>.row:first-of-type { margin-bottom:10px; }
.sheet p { font-size:14px; margin:10px 0; }
.sheet .primary { margin-top:18px; }
.listselect { display:block; width:100%; text-align:left; padding:14px 2px; border-bottom:1px solid var(--line); }
.toast { position:fixed; z-index:50; bottom:24px; left:50%; transform:translateX(-50%); background:var(--ink); color:var(--bg); padding:12px 18px; border-radius:8px; width:max-content; max-width:90vw; font-size:13px; }
/* Responsive navigation, agenda, and dialogs */
@media(max-width:1100px) {
  .phone { --rail:190px; }
  .sidebar { padding-inline:12px; }
  .desk-grid { gap:13px; }
  .panel { padding:16px; }
  .panel-head h2 { font-size:21px; }
  .shelf-grid,#files { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:900px) and (min-width:641px) {
  .phone { --rail:70px; }
  .sidebar { align-items:center; padding-inline:8px; }
  .sidebar .brand { padding:0; }
  .sidebar .brand>span:last-child,.sidenav button span,.userdata,.sideuser .chevron,.nav-label { display:none; }
  .sidenav { gap:6px; }
  .sidenav button { padding:13px; }
}
@media(max-width:730px) {
  .desk-grid,.schedulegrid { grid-template-columns:1fr; }
}
@media(max-width:640px) {
  .phone { --rail:0px; --bar:56px; }
  .sidebar,.crumb,.topright time { display:none; }
  .mobilebrand { display:flex; padding:0; font-size:23px; }
  .logo { width:32px; height:32px; }
  .content { padding:21px 15px calc(85px + env(safe-area-inset-bottom)); scrollbar-gutter:auto; }
  .desk-title { margin-bottom:15px; }
  h1 { font-size:32px; }
  .desk-title p,.title p { font-size:13px; }
  .focus-banner { min-height:175px; }
  .focus-copy { max-width:67%; padding:20px; }
  .focus-banner h2 { font-size:34px; }
  .focus-banner p { font-size:12px; }
  .focus-action { margin-top:13px; }
  .desk-grid { margin:14px 0 20px; }
  .shelf-grid,#files { grid-template-columns:1fr; }
  .shelf-book { padding:12px 14px; }
  .bottom { position:absolute; bottom:0; left:0; right:0; z-index:10; display:grid; grid-template-columns:repeat(5,1fr); gap:2px; border-top:1px solid var(--line); background:var(--card); padding:5px 5px calc(5px + env(safe-area-inset-bottom)); }
  .bottom button { padding:5px 0; display:grid; justify-items:center; font-size:10px; gap:2px; color:var(--muted); border-radius:6px; }
  .sheet { max-height:91dvh; border-radius:14px 14px 0 0; padding:20px 18px calc(24px + env(safe-area-inset-bottom)); }
  .modalback { align-items:end; padding:0; }
  .toast { bottom:76px; }
  .quizcanvas,.card { padding:17px; }
  .title { align-items:flex-start; }
  .title .primary { white-space:nowrap; padding-inline:10px; }
  .auth .content,.inquiz .content { padding-bottom:24px; }
}
@media(max-width:370px) {
  .focus-copy { max-width:74%; }
  .deadline,.panel-head { gap:7px; }
}

/* Closed hardcovers built from six CSS planes, stacked in perspective. */
.book-scene { position:absolute; inset:0 0 0 auto; width:42%; display:grid; place-items:center; perspective:850px; pointer-events:none; background-image:radial-gradient(#d9e8b224 1px,transparent 1px); background-size:16px 16px; }
.book-stack,.book-shadow { width:168px; height:120px; grid-area:1/1; }
.book-shadow { background:#142c22; opacity:.65; border-radius:20%; filter:blur(9px); transform:translateY(37px) rotate(-13deg) scale(1.16,.56); }
.book-stack { transform-style:preserve-3d; transform:translateY(25px) rotateX(52deg) rotateZ(-24deg); }
.volume { position:absolute; inset:0; transform-style:preserve-3d; --thick:18px; }
.ochre { --cover:#b9734c; --binding:#8f5137; transform:rotateZ(4deg); }
.moss { --cover:#9fb499; --binding:#5f816d; transform:translate3d(4px,-2px,21px) rotateZ(-7deg); }
.linen { --cover:#e4ce98; --binding:#af955f; transform:translate3d(-2px,-4px,43px) rotateZ(2deg); }
.volume i { display:block; position:absolute; }
.front-cover,.back-cover { inset:0; border-radius:2px 5px 4px 2px; background:var(--cover); box-shadow:inset 0 0 0 1.5px var(--binding); }
.front-cover { transform:translateZ(var(--thick)); background:linear-gradient(90deg,var(--binding),var(--cover) 4%,var(--binding) 6%,var(--cover) 7%); }
.page-edge,.head-edge { height:var(--thick); left:1px; right:2px; background:repeating-linear-gradient(0deg,#e2d6b2 0 2px,#bba983 2px 3px); }
.page-edge { top:100%; transform-origin:top; transform:rotateX(90deg); }
.head-edge { bottom:100%; transform-origin:bottom; transform:rotateX(-90deg); }
.fore-edge,.spine { top:1px; bottom:1px; width:var(--thick); }
.fore-edge { left:100%; transform-origin:left; transform:rotateY(-90deg); background:repeating-linear-gradient(90deg,#f1e6c9 0 2px,#c3b899 2px 3px); }
.spine { right:100%; transform-origin:right; transform:rotateY(90deg); background:var(--binding); }
.linen .front-cover:before { content:''; position:absolute; inset:9px 9px 9px 21px; border:1px solid #a48a51; border-radius:2px; }
.foil { position:absolute; width:34px; height:34px; top:36%; left:44%; transform:rotate(45deg); border:3px double #907442; }
.foil:after { content:'✧'; position:absolute; inset:0; display:grid; place-items:center; color:#7a6338; font:26px/1 Georgia,serif; }
.ribbon { position:absolute; inset:0 16% -6px auto; width:10px; background:#486449; clip-path:polygon(0 0,100% 0,100% 100%,50% 95%,0 100%); }
@media(max-width:640px){ .book-stack { transform:translateY(17px) scale(.6) rotateX(52deg) rotateZ(-24deg); } .book-scene { width:36%; } .book-shadow { width:88px; height:58px; } .book-stack { justify-self:center; } .book-scene { grid-template-columns:minmax(0,1fr); } }
@media(hover:hover) and (prefers-reduced-motion:no-preference){
 .book-stack { transition:transform .55s cubic-bezier(.2,.7,.2,1); }
 .focus-banner:hover .book-stack { rotate:0 0 1 -3deg; }
 .book-stack { transition-property:rotate; }
}
@media(prefers-reduced-motion:no-preference){
 .page-enter { animation:page-in 235ms cubic-bezier(.2,.75,.25,1) both; }
 .sheet { animation:page-in 170ms ease-out both; }
 .modalback { animation:veil-in 150ms ease-out both; }
 @keyframes page-in { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
 @keyframes veil-in { from { opacity:0; } to { opacity:1; } }
}
.task-open { padding:0; text-align:left; }
.range-field { margin:15px 0 5px; }
.range-caption { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.range-caption label { margin:0; color:var(--muted); font-size:12px; }
.range-caption output { color:var(--accent); font-weight:700; font-size:13px; font-variant-numeric:tabular-nums; }
.range-field input { appearance:none; cursor:pointer; display:block; width:100%; height:28px; margin:0; padding:0; border:0; background:transparent; }
.range-field input::-webkit-slider-runnable-track { height:6px; border-radius:10px; background:linear-gradient(to right,var(--accent) var(--filled),var(--line) var(--filled)); }
.range-field input::-webkit-slider-thumb { appearance:none; width:17px; height:17px; margin-top:-5.5px; border-radius:50%; background:var(--accent); border:2px solid var(--card); box-shadow:0 0 0 1px var(--accent); }
.range-field input::-moz-range-track { height:6px; border-radius:10px; background:var(--line); }
.range-field input::-moz-range-progress { height:6px; background:var(--accent); border-radius:10px; }
.range-field input::-moz-range-thumb { width:14px; height:14px; border:2px solid var(--card); border-radius:50%; background:var(--accent); }

/* Opening spread. Both paper faces share a hinge on the book's spine. */
.splash[hidden] { display:none; }
.splash { position:fixed; inset:0; z-index:100; display:grid; place-items:center; overflow:auto; color:#f5edcc;
  background:radial-gradient(ellipse at 50% 49%,#365846 0%,#234337 43%,#172f27 88%); }
.splash::before { content:''; position:absolute; inset:0; pointer-events:none; opacity:.42; background-image:radial-gradient(#d7e9b746 .8px,transparent .9px); background-size:21px 21px; }
.splash-stage { position:relative; text-align:center; padding:24px 0; }
.splash-stage h1 { font:500 clamp(44px,6.4vw,76px)/1 Georgia,serif; letter-spacing:-.055em; color:#f6efcf; margin:0; }
.splash-entry { display:flex; flex-direction:column; align-items:center; padding:0; margin:0 auto; color:inherit; border-radius:18px; }
.splash-entry:focus-visible { outline:2px solid #d8c587; outline-offset:5px; }
.splash-figure { width:min(90vw,510px); height:clamp(190px,32vh,300px); position:relative; display:grid; place-items:center; perspective:850px; }
.book-halo { position:absolute; width:76%; height:58%; border:1px solid #dccb9530; border-radius:50%; transform:translateY(24px) rotate(-11deg); }
.book-halo::before,.book-halo::after { content:'✦'; position:absolute; color:#d5c78c; font:19px/1 Georgia,serif; }
.book-halo::before { left:10%; top:9%; } .book-halo::after { right:5%; bottom:16%; font-size:13px; }
.intro-book { width:56%; aspect-ratio:1.75; position:relative; transform-style:preserve-3d; transform:rotateX(32deg) rotateZ(-10deg); }
.paper,.turning-leaf,.leaf-face,.leaf-back { position:absolute; top:0; height:100%; width:50%; }
.paper { box-shadow:0 2px #cfc19b,0 4px #efe1b8,0 6px #b7a57b,0 8px #d9bd7e,0 11px #956941,0 14px #61492e,0 21px 20px #11271dcc; }
.left-leaf,.leaf-back { left:0; border-radius:6% 13% 0 5%; background:linear-gradient(90deg,#e6d7ae,#fff2ca 65%,#bfa878); }
.right-leaf,.leaf-face { right:0; border-radius:13% 5% 5% 0; background:linear-gradient(90deg,#baa374,#eadbb8 14%,#f8eccc 90%,#d9c79e); }
.bookplate { position:absolute; left:26%; top:33%; width:49%; height:34%; border:3px double #a49061; display:grid; place-items:center; color:#877245; font:italic clamp(16px,2vw,27px) Georgia,serif; }
.ink-lines { position:absolute; inset:24% 16% 20%; background:repeating-linear-gradient(to bottom,#a28f655e 0 1px,transparent 1px 9px); }
.turning-leaf { right:0; transform-style:preserve-3d; transform-origin:left center; transform:rotateY(-35deg); }
.leaf-face,.leaf-back { width:100%; backface-visibility:hidden; }
.leaf-back { transform:rotateY(180deg); }
.silk-mark { position:absolute; left:24%; top:90%; width:5%; height:24%; background:#885339; clip-path:polygon(0 0,100% 0,100% 100%,50% 79%,0 100%); }
.entry-label { display:inline-flex; align-items:center; gap:18px; padding:11px 19px; border:1px solid #e2d2a169; border-radius:24px; color:#f4ebcb; background:#18362a6b; font-size:14px; }
.splash-entry:hover .entry-label { background:#33523f; border-color:#dfd29d; }
@media(prefers-reduced-motion:no-preference){
 .turning-leaf { animation:turn-paper 4.4s ease-in-out infinite; }
 .intro-book { animation:book-breathe 4.4s ease-in-out infinite; }
 @keyframes turn-paper { 0%,12% { transform:rotateY(-7deg); } 57%,72% { transform:rotateY(-166deg); } 100% { transform:rotateY(-7deg); } }
 @keyframes book-breathe { 50% { transform:translateY(-5px) rotateX(34deg) rotateZ(-9deg); } }
}