:root{--font:var(--font-hagrid),"Poppins",system-ui,-apple-system,"Segoe UI",sans-serif;--hand:"Caveat","Bradley Hand",var(--font);--mono:"JetBrains Mono",ui-monospace,monospace;--violet:#5b27e5;--peri:#5067eb;--lav:#ecebfb;--ink:#1a1430;--paper:#f7f5ef;--nav-blue:#1e3fcf;--sy:#f6de85;--sp:#c2cefb;--sl:#e3dbfb;--sm:#c6e8d4;--sc:#f7c7cf;--so:#f6d2b0;--maxw:1320px;--board:1280px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font);color:var(--violet);background:#f3f1ea;background-image:radial-gradient(circle, color-mix(in srgb,var(--violet) 15%,transparent) 1.2px, transparent 1.6px);-webkit-font-smoothing:antialiased;font-synthesis:none;text-rendering:optimizelegibility;background-position:0 0;background-size:30px 30px;font-weight:400;overflow-x:hidden}a{color:inherit;text-decoration:none}.wrap{max-width:var(--maxw);margin:0 auto;padding:0 56px}.mono{font-family:var(--mono)}header{z-index:80;pointer-events:none;background:0 0;padding-top:4px;position:fixed;top:0;left:0;right:0}header:before{content:"";pointer-events:none;-webkit-backdrop-filter:blur(14px)saturate(1.35);backdrop-filter:blur(14px)saturate(1.35);opacity:0;background:linear-gradient(#ffffffb8,#fff0);transition:opacity .28s;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0% 65%,#0000 100%);mask-image:linear-gradient(#000 0% 65%,#0000 100%)}header.scrolled:before{opacity:1}.nav{z-index:1;justify-content:space-between;align-items:center;gap:16px;height:78px;display:flex;position:relative}.brand,.nav-pills{pointer-events:auto}.brand{text-transform:none;line-height:1;font-family:var(--font);letter-spacing:.005em;color:#26233a;background:#fff;border:1px solid #e4e3ea;border-radius:999px;align-items:center;padding:10px 22px;font-size:15px;font-weight:600;transition:border-color .2s,box-shadow .2s;display:inline-flex}.brand:hover{border-color:#cfccda;box-shadow:0 5px 16px -10px #1a143066}.nav-pills{align-items:center;gap:9px;display:flex}.np{white-space:nowrap;line-height:1;font-family:var(--font);letter-spacing:.005em;color:#2b2838;background:#fff;border:1px solid #e4e3ea;border-radius:999px;align-items:center;gap:8px;padding:10px 17px;font-size:15px;font-weight:600;transition:background .18s,border-color .18s,color .18s,box-shadow .18s;display:inline-flex}.np svg{flex:none;width:16px;height:16px}.np:hover{border-color:#cfccda;box-shadow:0 5px 16px -10px #1a143073}.np.active{background:var(--nav-blue);border-color:var(--nav-blue);color:#fff}.np.active:hover{box-shadow:0 7px 20px -9px color-mix(in srgb,var(--nav-blue) 65%,transparent)}.stage{width:100%;padding:128px 0 0;position:relative;overflow:hidden}.board{width:var(--board);max-width:var(--board);transform-origin:top;position:absolute;top:128px;left:50%;transform:translate(-50%)}.board-spacer{width:100%}.frame{margin:0 auto 30px;position:relative}.frame-head{align-items:center;gap:12px;margin:0 0 10px 4px;display:flex}.frame-name{font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--peri);font-size:12px;font-weight:500}.frame-dim{font-family:var(--mono);color:color-mix(in srgb,var(--violet) 45%,#fff);font-size:11px}.frame-body{border:1.5px solid color-mix(in srgb,var(--peri) 30%,transparent);background:#ffffff4d;border-radius:6px;position:relative}.sticky{width:230px;color:var(--ink);background:var(--sy);cursor:grab;border-radius:3px;padding:20px 20px 22px;transition:transform .18s,box-shadow .18s;position:absolute;box-shadow:0 14px 26px -16px #1a143080,0 2px 4px -2px #1a143040}.sticky:hover{z-index:30;transform:translateY(-3px)rotate(0)scale(1.015);box-shadow:0 24px 40px -18px #1a14308c,0 3px 6px -2px #1a14304d}.sticky.s-peri{background:var(--sp)}.sticky.s-lav{background:var(--sl)}.sticky.s-mint{background:var(--sm)}.sticky.s-coral{background:var(--sc)}.sticky.s-peach{background:var(--so)}.sticky .k{font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;opacity:.55;margin-bottom:8px;font-size:10px;display:block}.sticky .big{font-family:var(--font);letter-spacing:-.01em;font-size:20px;font-weight:800;line-height:1.12}.sticky p{font-family:var(--font);font-size:14.5px;font-weight:500;line-height:1.5}.sticky p b{font-weight:800}.sticky.sm{width:184px;padding:15px 16px 17px}.sticky.sm p{font-size:13.5px}.sticky.wide{width:300px}.scribble{font-family:var(--hand);color:var(--violet);cursor:default;white-space:nowrap;font-size:30px;font-weight:700;line-height:1;position:absolute}.scribble.peri{color:var(--peri)}.polaroid{cursor:grab;background:#fff;border-radius:3px;width:240px;padding:12px 12px 0;transition:transform .18s,box-shadow .18s;position:absolute;box-shadow:0 18px 34px -18px #1a143080,0 2px 5px -2px #1a14304d}.polaroid:hover{z-index:30;transform:translateY(-3px)scale(1.015);box-shadow:0 28px 48px -20px #1a14308c}.polaroid .ph{border:1px solid color-mix(in srgb,var(--violet) 8%,transparent);background:#efedf8;border-radius:2px;width:100%;height:260px;display:block;overflow:hidden}.polaroid .cap{font-family:var(--hand);text-align:center;color:var(--ink);padding:11px 4px 14px;font-size:22px;font-weight:700;line-height:1}.polaroid.tall .ph{height:320px}.polaroid.wide{width:300px}.polaroid.wide .ph{height:210px}.polaroid.sm{width:190px}.polaroid.sm .ph{height:210px}.polaroid.sm .cap{font-size:19px}.tape{z-index:35;pointer-events:none;background:repeating-linear-gradient(45deg, color-mix(in srgb,var(--peri) 38%,transparent) 0 7px, color-mix(in srgb,var(--peri) 22%,transparent) 7px 14px);opacity:.92;border-left:1px solid #fff6;border-right:1px solid #fff6;width:84px;height:26px;position:absolute;box-shadow:0 2px 4px -2px #1a14304d}.tape.coral{background:repeating-linear-gradient(45deg, color-mix(in srgb,var(--sc) 90%,transparent) 0 7px, color-mix(in srgb,var(--sc) 60%,transparent) 7px 14px)}.tape.yellow{background:repeating-linear-gradient(45deg, color-mix(in srgb,var(--sy) 95%,transparent) 0 7px, color-mix(in srgb,var(--sy) 60%,transparent) 7px 14px)}.cursortag{z-index:40;pointer-events:none;align-items:flex-start;gap:0;display:flex;position:absolute}.cursortag svg{filter:drop-shadow(0 2px 3px #1a143059);width:22px;height:22px;display:block}.cursortag .flag{font-family:var(--font);color:#fff;white-space:nowrap;border-radius:6px;margin-top:13px;margin-left:-3px;padding:3px 9px;font-size:12px;font-weight:700;box-shadow:0 3px 8px -3px #1a143080}.cursortag.peri svg{color:var(--peri)}.cursortag.peri .flag{background:var(--peri)}.cursortag.green svg{color:#28a36d}.cursortag.green .flag{background:#28a36d}.cursortag.coral svg{color:#e5677a}.cursortag.coral .flag{background:#e5677a}.float{animation:7s ease-in-out infinite floaty}.float.b{animation-duration:9s;animation-delay:-3s}@keyframes floaty{0%,to{transform:translate(0)}50%{transform:translate(10px,-12px)}}.comment{z-index:45;border:1.5px solid var(--peri);width:34px;height:34px;font-family:var(--mono);color:var(--peri);cursor:pointer;background:#fff;border-radius:50% 50% 50% 2px;justify-content:center;align-items:center;font-size:12px;font-weight:500;transition:transform .18s;display:flex;position:absolute;box-shadow:0 8px 18px -8px #1a143073}.comment:hover{z-index:60;transform:scale(1.08)}.comment .pop{border:1px solid color-mix(in srgb,var(--violet) 14%,transparent);text-align:left;opacity:0;transform-origin:0 0;pointer-events:none;background:#fff;border-radius:10px;width:188px;padding:11px 13px;transition:opacity .16s,transform .16s;position:absolute;top:-4px;left:42px;transform:translateY(4px)scale(.96);box-shadow:0 16px 34px -16px #1a143080}.comment:hover .pop{opacity:1;transform:translateY(0)scale(1)}.comment .pop .who{font-family:var(--font);color:var(--violet);margin-bottom:3px;font-size:12px;font-weight:800;display:block}.comment .pop .msg{font-family:var(--font);color:color-mix(in srgb,var(--violet) 78%,#fff);font-size:12.5px;font-weight:500;line-height:1.4}.titleobj{padding:4px 10px;position:absolute}.titleobj .t{font-family:var(--font);letter-spacing:-.03em;color:var(--violet);font-size:84px;font-weight:800;line-height:.9}.titleobj .sel{border:1.5px solid var(--peri);pointer-events:none;position:absolute;inset:-10px -6px}.titleobj .h{border:1.5px solid var(--peri);background:#fff;border-radius:1px;width:9px;height:9px;position:absolute}.titleobj .h.tl{top:-5px;left:-5px}.titleobj .h.tr{top:-5px;right:-5px}.titleobj .h.bl{bottom:-5px;left:-5px}.titleobj .h.br{bottom:-5px;right:-5px}.titleobj .dim{background:var(--peri);color:#fff;font-family:var(--mono);letter-spacing:.04em;border-radius:3px;padding:2px 7px;font-size:10px;position:absolute;bottom:-26px;left:0}.doodle{color:var(--peri);pointer-events:none;z-index:5;position:absolute}.book-wrap{perspective:2600px;width:820px}.book{aspect-ratio:1.62;width:100%;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.34,.85,.3,1);position:relative}.book.closed{transform:translate(-25%)}.book.closed .base{opacity:0}.base{background:var(--paper);border:1px solid color-mix(in srgb,var(--violet) 12%,transparent);width:50%;height:100%;transition:opacity .5s;position:absolute;top:0;overflow:hidden}.base.left{border-radius:8px 0 0 8px;left:0;box-shadow:inset -28px 0 40px -34px #1a143080}.base.right{border-radius:0 8px 8px 0;right:0;box-shadow:inset 28px 0 40px -34px #1a143080}.leaf{transform-origin:0;width:50%;height:100%;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.34,.85,.3,1);position:absolute;top:0;right:0}.face{backface-visibility:hidden;background:var(--paper);border:1px solid color-mix(in srgb,var(--violet) 12%,transparent);flex-direction:column;display:flex;position:absolute;inset:0;overflow:hidden}.face.front{border-radius:0 8px 8px 0;transform:translateZ(1px);box-shadow:inset 26px 0 44px -38px #1a14308c}.face.back{border-radius:8px 0 0 8px;transform:rotateY(180deg)translateZ(1px);box-shadow:inset -26px 0 44px -38px #1a14308c}.face{transition:opacity linear}.leaf.turned .face.front,.leaf:not(.turned) .face.back{opacity:0;pointer-events:none}.pg{flex-direction:column;flex:1;padding:38px 42px;display:flex;position:relative}.pg.ruled{background-image:repeating-linear-gradient(transparent 0 31px, color-mix(in srgb,var(--peri) 14%,transparent) 31px 32px);background-position:0 52px}.pg .pnum{font-family:var(--mono);letter-spacing:.1em;color:color-mix(in srgb,var(--violet) 50%,#fff);font-size:10.5px;position:absolute;bottom:16px}.face.front .pg .pnum{right:22px}.face.back .pg .pnum{left:22px}.pg .chlbl{font-family:var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--peri);font-size:11px}.cover{background:radial-gradient(120% 90% at 80% 10%, color-mix(in srgb,var(--peri) 26%,transparent), transparent 60%), linear-gradient(160deg, var(--violet), color-mix(in srgb,var(--violet) 70%, var(--peri)));color:#fff;border-color:color-mix(in srgb,var(--violet) 60%,#000);flex-direction:column;flex:1;justify-content:flex-end;padding:42px 40px;display:flex}.cover .ctop{font-family:var(--mono);letter-spacing:.22em;text-transform:uppercase;color:#fffc;font-size:11px}.cover .ctitle{letter-spacing:-.02em;font-size:clamp(30px,4.4vw,48px);font-weight:800;line-height:.98}.cover .cby{font-family:var(--mono);letter-spacing:.06em;color:#ffffffd9;margin-top:14px;font-size:12px}.cover .cseal{font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#fff;border:1px solid #ffffff73;border-radius:999px;align-self:flex-start;align-items:center;gap:8px;padding:7px 13px;font-size:10.5px;display:inline-flex}.cover .cstamp{text-align:center;width:88px;height:88px;font-family:var(--mono);letter-spacing:.14em;color:#ffffffc7;border:1.5px dashed #ffffff80;border-radius:50%;justify-content:center;align-items:center;font-size:9px;line-height:1.5;display:flex;position:absolute;bottom:108px;right:30px;transform:rotate(-9deg)}.chL{justify-content:center;gap:16px}.chL .num{color:color-mix(in srgb,var(--violet) 20%,#fff);letter-spacing:-.03em;font-size:88px;font-weight:800;line-height:.8}.chL .ttl{color:var(--violet);letter-spacing:-.02em;max-width:11ch;font-size:clamp(26px,3.4vw,38px);font-weight:800;line-height:1.02}.chL .meta{font-family:var(--mono);letter-spacing:.06em;color:var(--peri);margin-top:2px;font-size:11px}.chL .doodle2{color:color-mix(in srgb,var(--peri) 70%,#fff);margin-top:12px;position:static}.chL .doodle2 svg{width:58px;height:58px}.chR{justify-content:flex-start;gap:18px}.chR .lede{color:color-mix(in srgb,var(--violet) 84%,#fff);font-size:15px;font-weight:500;line-height:1.6}.chR .lede b{color:var(--violet);font-weight:700}.chR .pull{border-left:2px solid var(--peri);color:var(--violet);margin-top:auto;padding:6px 0 6px 16px;font-size:15.5px;font-style:italic;line-height:1.45}.chR .chip{font-family:var(--mono);letter-spacing:.04em;background:var(--lav);color:var(--violet);border:1px solid color-mix(in srgb,var(--violet) 16%,transparent);border-radius:4px;align-self:flex-start;margin-top:16px;padding:4px 9px;font-size:10px}.endp{text-align:center;justify-content:center;align-items:center;gap:13px}.endp .big{color:var(--violet);letter-spacing:-.02em;font-size:clamp(28px,4vw,44px);font-weight:800;line-height:1}.endp .small{font-family:var(--mono);letter-spacing:.04em;color:color-mix(in srgb,var(--violet) 62%,#fff);max-width:24ch;font-size:11.5px}.book-ctrl{justify-content:center;align-items:center;gap:18px;margin-top:24px;display:flex}.pgbtn{cursor:pointer;font-family:var(--font);color:var(--violet);background:#fff;border:1px solid #e4e3ea;border-radius:999px;align-items:center;gap:8px;padding:10px 18px;font-size:14px;font-weight:600;transition:border-color .15s,box-shadow .15s,opacity .15s;display:inline-flex}.pgbtn:hover{border-color:var(--peri);box-shadow:0 6px 16px -10px color-mix(in srgb,var(--peri) 70%,transparent)}.pgbtn[disabled]{opacity:.34;pointer-events:none}.pgcount{font-family:var(--mono);letter-spacing:.12em;color:var(--peri);text-align:center;min-width:96px;font-size:13px}.tlcard{border:1px solid color-mix(in srgb,var(--violet) 12%,transparent);cursor:grab;background:#fff;border-radius:10px;width:208px;padding:16px 17px 17px;transition:transform .18s,box-shadow .18s;position:absolute;box-shadow:0 16px 30px -20px #1a143073}.tlcard:hover{z-index:30;transform:translateY(-3px);box-shadow:0 24px 42px -22px #1a143080}.tlcard .yr{font-family:var(--mono);letter-spacing:.06em;color:#fff;background:var(--peri);border-radius:5px;margin-bottom:10px;padding:3px 9px;font-size:11px;display:inline-block}.tlcard.now .yr{color:#1f8f5e;background:0 0;align-items:center;gap:7px;padding:0;font-weight:700;display:inline-flex}.tlcard .yr .livedot{background:#22a06b;border-radius:50%;width:8px;height:8px;animation:1.8s ease-out infinite livepulse;box-shadow:0 0 #22a06b99}@keyframes livepulse{0%{box-shadow:0 0 #22a06b8c}70%{box-shadow:0 0 0 8px #22a06b00}to{box-shadow:0 0 #22a06b00}}@media (prefers-reduced-motion:reduce){.tlcard .yr .livedot{animation:none}}.tlcard .h{color:var(--violet);letter-spacing:-.01em;font-size:17px;font-weight:800;line-height:1.12}.tlcard .d{color:color-mix(in srgb,var(--violet) 70%,#fff);margin-top:6px;font-size:13px;font-weight:500;line-height:1.45}.fchrome{z-index:70;pointer-events:none;position:fixed}.presence{align-items:center;display:flex;top:104px;right:40px}.presence .av{width:30px;height:30px;font-family:var(--font);color:#fff;pointer-events:auto;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;margin-left:-8px;font-size:12px;font-weight:800;display:flex;box-shadow:0 2px 6px -2px #1a143066}.presence .av:first-child{margin-left:0}.toolbar{background:var(--ink);pointer-events:auto;border-radius:14px;align-items:center;gap:4px;padding:8px 10px;display:flex;bottom:26px;left:50%;transform:translate(-50%);box-shadow:0 18px 40px -18px #1a1430b3}.toolbar .tool{color:#cfcadf;cursor:pointer;border-radius:9px;justify-content:center;align-items:center;width:38px;height:38px;transition:background .14s,color .14s;display:flex}.toolbar .tool svg{width:19px;height:19px}.toolbar .tool:hover{color:#fff;background:#ffffff1a}.toolbar .tool.on{background:var(--peri);color:#fff}.toolbar .sep{background:#ffffff29;width:1px;height:24px;margin:0 5px}.zoom{background:var(--ink);pointer-events:auto;border-radius:11px;align-items:center;gap:2px;padding:5px 6px;display:flex;bottom:26px;right:26px;box-shadow:0 14px 30px -16px #1a1430b3}.zoom button{color:#cfcadf;cursor:pointer;background:0 0;border:none;border-radius:7px;justify-content:center;align-items:center;width:30px;height:30px;font-size:18px;transition:background .14s,color .14s;display:flex}.zoom button:hover{color:#fff;background:#ffffff1a}.zoom .val{text-align:center;min-width:50px;font-family:var(--mono);color:#fff;font-size:12px}footer{background:var(--violet);color:#fff;z-index:1;margin-top:10px;position:relative}.footer-inner{max-width:var(--maxw);margin:0 auto;padding:92px 56px 52px}.footer-huge{letter-spacing:-.02em;color:#fff;font-size:clamp(44px,7vw,100px);font-weight:800;line-height:.94}.footer-links{border-top:1px solid #ffffff40;flex-wrap:wrap;align-items:center;gap:14px 40px;margin-top:44px;padding-top:30px;display:flex}.footer-links a{color:#fff;padding-bottom:2px;font-size:19px;font-weight:500;position:relative}.footer-links a:after{content:"";transform-origin:0;background:#fff;height:2px;transition:transform .25s;position:absolute;bottom:-2px;left:0;right:0;transform:scaleX(0)}.footer-links a:hover:after{transform:scaleX(1)}.footer-links .d{opacity:.5}.footer-meta{color:#ffffffb3;flex-wrap:wrap;justify-content:space-between;gap:16px;margin-top:60px;font-size:14px;display:flex}@media (max-width:760px){.fchrome{display:none!important}.stage{padding:104px 0 40px;overflow:visible}.board{width:100%;position:static!important;transform:none!important}.board-spacer{display:none}.frame{margin-bottom:14px}.frame-body{background:0 0;border:none;flex-direction:column;align-items:stretch;gap:18px;padding:4px 0;display:flex;height:auto!important}.frame-body .sticky,.frame-body .polaroid,.frame-body .tlcard,.frame-body .titleobj{margin:0;width:auto!important;position:static!important;transform:none!important}.frame-body .polaroid{max-width:340px}.frame-body .scribble,.frame-body .doodle,.frame-body .cursortag,.frame-body .tape,.frame-body .comment{display:none!important}.titleobj .sel,.titleobj .h,.titleobj .dim{display:none}.titleobj .t{font-size:60px}.book-wrap{width:100%}.book{aspect-ratio:1.2}.book-host{margin:8px 0;width:100%!important;position:static!important;transform:none!important}}@media (max-width:680px){.wrap{padding:0 20px}.nav{gap:10px;height:64px}.np{padding:9px 12px}.np .lbl{display:none}.brand{padding:8px 15px;font-size:14px}.titleobj .t{font-size:44px}.pg{padding:22px 20px}.chL .num{font-size:60px}.footer-inner{padding:64px 24px 40px}}
