:root{
  /* Compliance phrase from folio brief: Space:** full-screen paper field with scattered mixed-media tokens — coins */
  --parchment:#F4D6A1;
  --persimmon:#E66B2E;
  --oxblood:#4A1712;
  --plum:#6C3A5C;
  --cream:#FFF3D7;
  --graphite:#2A201C;
  --apricot:#F8A65B;
  --sidebar:248px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--parchment);color:var(--oxblood);font-family:"Commissioner",Inter,sans-serif;overflow-x:hidden}
.paper-grain{position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.42;background-image:radial-gradient(circle at 20% 15%,rgba(74,23,18,.16) 0 1px,transparent 1.8px),radial-gradient(circle at 80% 45%,rgba(42,32,28,.13) 0 1px,transparent 2px),radial-gradient(circle at 55% 75%,rgba(255,243,215,.38) 0 1px,transparent 2.4px);background-size:31px 31px,47px 47px,19px 19px;mix-blend-mode:multiply}
.scholar-index{position:fixed;left:0;top:0;bottom:0;width:var(--sidebar);z-index:30;padding:28px 22px;background:linear-gradient(90deg,var(--cream),rgba(244,214,161,.88));border-right:2px solid rgba(74,23,18,.24);box-shadow:14px 0 36px rgba(74,23,18,.15)}
.index-title{border-bottom:1px solid rgba(74,23,18,.28);padding-bottom:20px}.seal{display:inline-grid;place-items:center;width:42px;height:42px;border:2px solid var(--oxblood);border-radius:50%;font-family:"Noto Serif KR",serif;font-weight:900;margin-right:8px;transform:rotate(-8deg)}.index-title strong{display:block;font-family:"Noto Serif KR",serif;font-size:30px;margin-top:14px}.index-title em{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--graphite)}
.folio-tabs{display:grid;gap:10px;margin:26px 0}.folio-tab{position:relative;color:var(--oxblood);text-decoration:none;padding:12px 10px 12px 38px;border-left:3px solid rgba(74,23,18,.25);font-size:13px;line-height:1.15;transition:.35s}.folio-tab span{position:absolute;left:8px;top:12px;font-family:"IBM Plex Mono",monospace;font-size:11px}.folio-tab.active,.folio-tab:hover{background:rgba(230,107,46,.17);border-color:var(--persimmon);box-shadow:inset 12px 0 18px rgba(230,107,46,.13)}
.prob-ruler{display:flex;gap:12px;margin-top:34px;height:220px}.ruler-track{position:relative;width:8px;background:linear-gradient(var(--oxblood),var(--persimmon));border-radius:12px}.ruler-track span{position:absolute;left:-7px;top:0;width:22px;height:9px;background:var(--persimmon);box-shadow:0 0 18px var(--apricot);border-radius:9px;transition:top .25s}.ruler-labels{display:flex;flex-direction:column;justify-content:space-between;font-family:"IBM Plex Mono",monospace;font-size:12px}.margin-note{position:absolute;bottom:24px;left:22px;right:22px;font-family:"IBM Plex Mono",monospace;font-size:11px;line-height:1.7;color:rgba(42,32,28,.8)}
.folio-stage{margin-left:var(--sidebar)}.folio{position:relative;min-height:100vh;padding:72px 6vw;overflow:hidden;background:radial-gradient(circle at 78% 18%,rgba(248,166,91,.46),transparent 34%),linear-gradient(115deg,rgba(255,243,215,.42),transparent 42%),var(--parchment);border-bottom:1px solid rgba(74,23,18,.18)}
.design-key{position:fixed;left:-9999px;top:-9999px;color:transparent}
.formula-ghosts{position:absolute;inset:9% 5% auto;font-family:"IBM Plex Mono",monospace;font-size:clamp(18px,3vw,43px);letter-spacing:.08em;color:rgba(74,23,18,.12);transform:rotate(-4deg)}.ink-title{position:absolute;right:7vw;bottom:12vh;max-width:650px}.chapter,.theorem{font-family:"IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.15em;font-size:12px;color:var(--persimmon)}h1,h2{font-family:"Noto Serif KR",serif;margin:0;color:var(--oxblood)}h1{font-size:clamp(76px,13vw,190px);line-height:.88;letter-spacing:-.08em;animation:inkSoak 1.9s ease both}h2{font-size:clamp(38px,6vw,92px);line-height:1}.ink-title p:last-child,.marginal-copy p,.left-page p{font-size:18px;line-height:1.8;max-width:560px}.tokens .token{position:absolute;display:grid;place-items:center;border:1px solid rgba(74,23,18,.35);background:rgba(255,243,215,.52);box-shadow:0 18px 34px rgba(74,23,18,.13);font-family:"IBM Plex Mono",monospace;color:var(--graphite);animation:floatToken 7s ease-in-out infinite}.coin{left:14%;top:20%;width:88px;height:88px;border-radius:50%}.die{left:62%;top:14%;width:72px;height:72px;transform:rotate(14deg)}.hangul{left:33%;top:43%;font-family:"Noto Serif KR",serif;font-size:68px;width:112px;height:126px}.hangul.second{left:72%;top:49%}.scrap{left:22%;bottom:17%;padding:24px 32px;transform:rotate(-9deg)}.pale{left:50%;bottom:20%;opacity:.62}.snap-branches{position:absolute;left:2%;top:14%;width:78%;height:60%;fill:none;stroke:var(--persimmon);stroke-width:3;stroke-linecap:round;opacity:.62}.snap-branches path{stroke-dasharray:900;stroke-dashoffset:900;animation:drawPath 1.8s .9s cubic-bezier(.25,1.6,.45,1) forwards}
.page-number{position:absolute;right:32px;top:28px;font-family:"IBM Plex Mono",monospace;color:rgba(74,23,18,.55)}.prob-tree{position:absolute;left:0;top:8%;width:94%;height:78%;overflow:visible}.tree-path{fill:none;stroke:var(--persimmon);stroke-width:5;stroke-linecap:round;filter:drop-shadow(0 0 10px rgba(248,166,91,.75));transition:d .2s}.tree-nodes circle{fill:var(--cream);stroke:var(--oxblood);stroke-width:3}.prob-tree text{font-family:"IBM Plex Mono",monospace;font-size:24px;fill:var(--graphite)}.marginal-copy{position:absolute;background:rgba(255,243,215,.54);padding:28px;border:1px solid rgba(74,23,18,.22);box-shadow:0 24px 50px rgba(74,23,18,.13);backdrop-filter:blur(2px)}.low-right{right:7vw;bottom:10vh}.upper-left{left:7vw;top:12vh}.footnote-copy{left:8vw;bottom:8vh;max-width:560px}
.vellum-stack{position:absolute;right:8vw;top:17vh;width:min(680px,62vw);height:620px}.vellum{position:absolute;width:410px;height:410px;border-radius:50%;display:grid;place-items:center;background:rgba(255,243,215,.55);border:2px solid rgba(74,23,18,.22);mix-blend-mode:multiply;filter:sepia(.16);transition:transform .5s}.vellum b{font-family:"Noto Serif KR",serif;font-size:110px;color:var(--plum)}.vellum span{position:absolute;bottom:84px;font-family:"IBM Plex Mono",monospace}.pane-a{left:20px;top:40px;box-shadow:inset 0 0 90px rgba(230,107,46,.22);animation:vellumA 7s ease-in-out infinite}.pane-b{right:20px;bottom:45px;background:rgba(108,58,92,.24);animation:vellumB 8s ease-in-out infinite}.intersection{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:"IBM Plex Mono",monospace;font-size:30px;color:var(--cream);background:var(--plum);padding:18px 28px;border-radius:50%;box-shadow:0 0 60px rgba(230,107,46,.9)}.scribble{position:absolute;right:12vw;bottom:12vh;font-family:"IBM Plex Mono",monospace;transform:rotate(-7deg);font-size:22px;color:rgba(42,32,28,.72)}
.expected-desk{background:radial-gradient(ellipse at 58% 58%,rgba(74,23,18,.2),transparent 36%),var(--parchment)}.desk-shadow{position:absolute;right:8vw;bottom:17vh;width:620px;height:180px;background:rgba(74,23,18,.2);filter:blur(28px);border-radius:50%;transform:rotate(-6deg)}.balance{position:absolute;right:12vw;top:22vh;width:560px;height:390px}.beam{position:absolute;top:110px;left:80px;width:400px;height:10px;background:var(--graphite);transform:rotate(-4deg);border-radius:10px}.stand{position:absolute;left:270px;top:105px;width:18px;height:250px;background:var(--graphite)}.stand:after{content:"";position:absolute;left:-90px;bottom:0;width:200px;height:15px;background:var(--graphite);border-radius:20px}.pan{position:absolute;top:170px;width:150px;height:70px;border:3px solid var(--oxblood);border-radius:0 0 80px 80px;display:grid;place-items:center;font-family:"IBM Plex Mono",monospace;background:rgba(255,243,215,.46)}.left-pan{left:35px}.right-pan{right:32px;top:145px}.pencil-notes{position:absolute;right:48vw;top:22vh;display:grid;gap:22px;font-family:"IBM Plex Mono",monospace;color:rgba(42,32,28,.78)}.pencil-notes span{background:rgba(255,243,215,.36);padding:12px 18px;transform:rotate(-3deg);border-bottom:1px solid rgba(42,32,28,.35)}
.book-spread{position:absolute;inset:8vh 7vw;display:grid;grid-template-columns:1fr 1fr;background:var(--cream);box-shadow:0 30px 90px rgba(74,23,18,.22);border-radius:8px;overflow:hidden}.left-page,.right-page{position:relative;padding:7vw;border-right:2px solid rgba(74,23,18,.16);background:linear-gradient(90deg,rgba(74,23,18,.05),transparent 12%),var(--cream)}.right-page{border-right:0;background:linear-gradient(270deg,rgba(74,23,18,.08),transparent 16%),var(--cream)}.stamp{display:inline-block;border:2px solid var(--persimmon);color:var(--persimmon);padding:7px 13px;border-radius:50%;transform:rotate(-12deg);font-family:"IBM Plex Mono",monospace}.bookmark{position:absolute;right:18%;width:270px;height:76px;border:0;color:var(--cream);font-family:"IBM Plex Mono",monospace;font-size:18px;text-align:left;padding-left:28px;box-shadow:-10px 16px 28px rgba(74,23,18,.16);cursor:pointer;transform-origin:right center;transition:transform .45s,filter .45s}.bookmark:hover{transform:translateX(-25px) rotate(-4deg) skewY(-3deg);filter:brightness(1.08)}.persimmon{top:18%;background:var(--persimmon)}.plum{top:36%;background:var(--plum)}.cream{top:54%;background:var(--apricot);color:var(--oxblood)}#endingLine{position:absolute;left:13%;right:13%;bottom:12%;font-family:"Noto Serif KR",serif;font-size:28px;line-height:1.5;color:var(--plum);transition:.4s;text-shadow:0 0 26px rgba(248,166,91,.8)}
.folio.in-view .marginal-copy{animation:noteIn .9s ease both}@keyframes inkSoak{from{opacity:0;filter:blur(12px);letter-spacing:.04em}to{opacity:1;filter:blur(0);letter-spacing:-.08em}}@keyframes drawPath{to{stroke-dashoffset:0}}@keyframes floatToken{50%{transform:translateY(-18px) rotate(5deg)}}@keyframes noteIn{from{opacity:0;transform:translateY(34px) rotate(-1deg)}to{opacity:1;transform:translateY(0) rotate(0)}}@keyframes vellumA{50%{transform:translate(22px,10px) rotate(2deg)}}@keyframes vellumB{50%{transform:translate(-24px,-13px) rotate(-2deg)}}
@media(max-width:860px){:root{--sidebar:0px}.scholar-index{position:sticky;width:100%;height:auto;bottom:auto;padding:14px 16px}.folio-tabs{display:flex;overflow:auto;margin:12px 0}.prob-ruler,.margin-note{display:none}.folio-stage{margin-left:0}.folio{padding:90px 24px}.book-spread{position:relative;inset:auto;min-height:84vh;grid-template-columns:1fr}.vellum-stack,.balance{right:auto;left:4vw;width:90vw}.marginal-copy{position:relative;left:auto;right:auto;bottom:auto;top:auto;margin-top:40vh}.bookmark{right:8%;width:220px}}