.intro-scene{--intro-dark: #232836;--intro-light: #f5dbf7;--intro-paper: #fffaff}.intro-3d-fallback{opacity:1;transition:opacity .45s ease}.intro-scene.webgl-ready .intro-3d-fallback{opacity:0;pointer-events:none}.intro-canvas-stage{opacity:1;transform:translateY(0);transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1)}.intro-handwriting-svg-text{font-family:Caveat,Cormorant Garamond,Georgia,serif;font-size:56px;font-weight:600;letter-spacing:.01em;dominant-baseline:alphabetic}.intro-scene:not(.js-writing-active) #intro-handwriting-text{mask:none!important;-webkit-mask:none!important}.intro-scene:not(.js-writing-active) .intro-pen-actor{opacity:0;pointer-events:none}.intro-pen-actor{opacity:0;transition:opacity .35s ease;will-change:transform,opacity}.intro-scene.pen-visible .intro-pen-actor{opacity:1}.intro-scene.pen-finished .intro-pen-actor{opacity:0;transition:opacity .55s ease,transform .65s cubic-bezier(.22,1,.36,1)}.intro-underline-path{stroke-dasharray:240;stroke-dashoffset:240;transition:stroke-dashoffset .7s cubic-bezier(.22,1,.36,1)}.intro-scene.writing-complete .intro-underline-path{stroke-dashoffset:0}.intro-editorial-caption{opacity:.35;transform:translateY(4px);transition:opacity .6s ease,transform .6s ease}.intro-scene.writing-complete .intro-editorial-caption{opacity:1;transform:translateY(0)}@media (max-width: 1023px){.intro-handwriting-svg-text{font-size:54px}}@media (max-width: 639px){.intro-writing-stage{padding:1.25rem .875rem}.intro-handwriting-svg-text{font-size:50px}}@media (prefers-reduced-motion: reduce){.intro-canvas-stage,.intro-editorial-caption,.intro-underline-path,.intro-pen-actor{transition:none!important;animation:none!important}#intro-handwriting-text{mask:none!important;-webkit-mask:none!important}.intro-underline-path{stroke-dashoffset:0!important}.intro-editorial-caption{opacity:1!important;transform:none!important}.intro-pen-actor{opacity:0!important}}.nb{--paper: #fffaff;--ink: #232836;--rose: #e8bce9;--light: #f5dbf7;--hs: 4px;--tc: 4px;--tb: 12px;--m: 9px;--pw: 420px;--ph: 560px;--c: 0;position:fixed;inset:0;z-index:200;overflow:hidden;color:var(--ink);opacity:0}.nb[hidden]{display:none}html.nb-open{overflow:hidden}html.nb-open #eop-cursor{display:none!important}.nb-desk{position:absolute;inset:0;background-color:var(--light);background-image:linear-gradient(to right,rgba(35,40,54,.07) 1px,transparent 1px),linear-gradient(to bottom,rgba(35,40,54,.07) 1px,transparent 1px);background-size:48px 48px;opacity:var(--desk, 1)}.nb-stage{position:absolute;inset:0;perspective:1800px;perspective-origin:50% 46%}.nb-book{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d;transform:translate3d(var(--x, 0px),var(--y, 0px),var(--z, 0px)) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) rotate(var(--rz, 0deg)) scale(var(--s, 1));will-change:transform}.nb-shift{position:absolute;left:0;top:0;width:0;height:0;transform-style:preserve-3d;transform:translate(calc(var(--c) * var(--pw) * -.5))}.nb-b,.nb-leaf,.nb-a{position:absolute;top:calc(var(--ph) * -.5);width:var(--pw);height:var(--ph);transform-style:preserve-3d}.nb-page,.nb-lf,.nb-lb{background-color:var(--paper);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .14 0 0 0 0 .16 0 0 0 0 .21 0 0 0 .06 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"),repeating-linear-gradient(to bottom,transparent 0,transparent calc(var(--ph) / 22 - 1px),rgba(35,40,54,.075) calc(var(--ph) / 22 - 1px),rgba(35,40,54,.075) calc(var(--ph) / 22));background-position:0 0,0 calc(var(--ph) / 22 * 1.6)}.nb-page:after,.nb-lf:after,.nb-lb:after{content:"";position:absolute;inset:0;pointer-events:none}.nb-page:after,.nb-lf:after{background:linear-gradient(to right,#2328361f,#23283600 11%)}.nb-lb:after{background:linear-gradient(to left,#2328361f,#23283600 11%)}.nb-page canvas,.nb-lb canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1}.nb-b{left:0}.nb-b-back{position:absolute;inset:calc(var(--m) * -1) calc(var(--m) * -1) calc(var(--m) * -1) 0;background:var(--ink);border-radius:0 3px 3px 0;transform:translateZ(calc(var(--tb) * -1 - var(--tc)))}.nb-page{position:absolute;inset:0;transform:translateZ(0)}.nb-edge{position:absolute;background:repeating-linear-gradient(90deg,#f3eee8 0 1px,#dcd4c8 1px 2px)}.nb-edge-r{left:100%;top:0;width:var(--tb);height:100%;transform-origin:0 50%;transform:rotateY(90deg)}.nb-edge-t{left:0;top:calc(var(--tb) * -1);width:100%;height:var(--tb);transform-origin:50% 100%;transform:rotateX(90deg);background:repeating-linear-gradient(0deg,#f3eee8 0 1px,#dcd4c8 1px 2px)}.nb-edge-b{left:0;top:100%;width:100%;height:var(--tb);transform-origin:50% 0;transform:rotateX(-90deg);background:repeating-linear-gradient(180deg,#f3eee8 0 1px,#dcd4c8 1px 2px)}.nb-ribbon{position:absolute;left:calc(var(--pw) * .07);top:calc(var(--ph) * .5);width:11px;height:calc(var(--m) + 42px);background:var(--rose);clip-path:polygon(0 0,100% 0,100% 100%,50% 86%,0 100%);transform:translateZ(calc(var(--tb) * -.5))}.nb-leaf{left:0;transform-origin:0 50%;transform:rotateY(calc(var(--lf, 0) * -180deg)) translateZ(calc(var(--i) * 1px))}.nb-leaf[data-leaf="1"]{--lf: var(--lf1, 0)}.nb-leaf[data-leaf="2"]{--lf: var(--lf2, 0)}.nb-lf,.nb-lb{position:absolute;inset:0;backface-visibility:hidden}.nb-lb{transform:rotateY(180deg)}.nb-a{left:calc(var(--pw) * -1);transform-origin:100% 50%;transform:rotateY(calc(var(--c) * 180deg)) translateZ(calc(var(--hs) * -1))}.nb-a-in,.nb-a-out{position:absolute;inset:calc(var(--m) * -1) 0 calc(var(--m) * -1) calc(var(--m) * -1);backface-visibility:hidden;background:var(--ink)}.nb-a-in{border-radius:3px 0 0 3px}.nb-a-out{overflow:hidden;border-radius:0 3px 3px 0;transform:translateZ(calc(var(--tc) * -1)) rotateY(180deg)}.nb-cover-grid{position:absolute;inset:0;background-image:linear-gradient(to right,rgba(245,219,247,.07) 1px,transparent 1px),linear-gradient(to bottom,rgba(245,219,247,.07) 1px,transparent 1px);background-size:calc(var(--pw) / 9) calc(var(--pw) / 9)}.nb-cover-band{position:absolute;top:0;bottom:0;right:calc(var(--pw) * .1);width:calc(var(--pw) * .045);background:var(--rose);box-shadow:0 0 0 1px #23283666}.nb-cover-mark{position:absolute;top:calc(var(--pw) * .1);left:calc(var(--pw) * .1);width:calc(var(--pw) * .17);height:calc(var(--pw) * .17);background:var(--light)}.nb-cover-mark i{position:absolute;left:50%;top:50%;translate:-50% -50%}.nb-cover-mark i:nth-child(1){width:60%;height:60%;background:var(--ink)}.nb-cover-mark i:nth-child(2){width:36%;height:36%;background:var(--rose)}.nb-cover-mark i:nth-child(3){width:14%;height:14%;background:var(--ink)}.nb-cover-label{position:absolute;left:calc(var(--pw) * .1);top:calc(var(--pw) * .33);font-size:calc(var(--pw) * .026);letter-spacing:.12em;color:var(--light);opacity:.8}.nb-cover-word{position:absolute;left:calc(var(--pw) * .1);bottom:calc(var(--ph) * .07);font-size:calc(var(--pw) * .25);font-weight:800;letter-spacing:-.04em;line-height:.9;color:var(--light)}.nb-spine{position:absolute;left:0;top:calc(var(--ph) * -.5 - var(--m));width:calc(var(--tb) + var(--tc) + var(--c) * (var(--hs) + var(--tc)));height:calc(var(--ph) + var(--m) * 2);background:var(--ink);transform-origin:0 50%;transform:rotateY(-90deg) translate(calc(var(--tb) * -1 - var(--tc)))}.nb-shadow{position:absolute;left:calc(var(--pw) * -1);top:calc(var(--ph) * -.5);width:calc(var(--pw) * 2);height:var(--ph);border-radius:24px;background:#23283638;filter:blur(22px);opacity:calc(.55 + var(--c) * .2);transform:translateZ(calc(var(--tb) * -1 - var(--tc) - 16px)) translate(calc(var(--c) * var(--pw) * .5)) scaleX(calc(1 - var(--c) * .5))}.nb-surface{position:absolute;inset:0;z-index:2;touch-action:none;pointer-events:none;outline:none;cursor:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'><g transform='translate(3 29) rotate(45)'><rect x='-2.5' y='-22' width='5' height='17' fill='%23232836'/><rect x='-2.5' y='-26' width='5' height='4' fill='%23f5dbf7' stroke='%23232836' stroke-width='.8'/><polygon points='-2.5,-5 2.5,-5 0,0' fill='%23dfb995' stroke='%23232836' stroke-width='.6'/></g></svg>") 3 29,crosshair}.nb--ready .nb-surface{pointer-events:auto}.nb-surface:focus-visible{box-shadow:inset 0 0 0 3px var(--ink)}.nb-kbd-dot{position:absolute;left:0;top:0;width:14px;height:14px;margin:-7px 0 0 -7px;border:2px solid var(--ink);background:var(--rose);display:none}.nb-surface[data-kbd="1"] .nb-kbd-dot{display:block}.nb-surface[data-pen="1"] .nb-kbd-dot{background:var(--ink)}.nb-ui{position:absolute;inset:0;z-index:3;pointer-events:none}.nb-ui>*{pointer-events:auto}.nb-btn{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:0 .95rem;font-family:JetBrains Mono,ui-monospace,monospace;font-size:.75rem;letter-spacing:.04em;color:var(--paper);background:var(--ink);border:1.5px solid var(--ink);cursor:pointer;transition:background-color .3s var(--ease-eop, ease),color .3s var(--ease-eop, ease),transform .3s var(--ease-eop, ease),box-shadow .3s var(--ease-eop, ease)}.nb-btn:hover{background:var(--rose);color:var(--ink);transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ink)}.nb-btn:focus-visible{outline:3px solid var(--ink);outline-offset:3px;background:var(--rose);color:var(--ink)}.nb-tools .nb-btn{background:var(--paper);color:var(--ink)}.nb-tools .nb-btn:hover{background:var(--rose)}.nb-close{position:absolute;top:max(16px,env(safe-area-inset-top));right:16px}.nb-tools{position:absolute;left:16px;bottom:max(16px,env(safe-area-inset-bottom));display:flex;gap:8px;opacity:0;transition:opacity .5s ease}.nb--ready .nb-tools{opacity:1}@media (max-width: 639px){.nb-btn{width:44px;padding:0;justify-content:center}.nb-btn-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}.nb-hint{position:absolute;left:50%;bottom:max(6px,env(safe-area-inset-bottom));width:112px;height:96px;translate:-50% 0;opacity:0;transition:opacity .5s ease;pointer-events:none}.nb--ready:not(.nb--drawn) .nb-hint{opacity:1}.nb-hint-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.nb-hint-touch{display:none}@media (pointer: coarse){.nb-hint-mouse{display:none}.nb-hint-touch{display:block}}.nb-hint-line{stroke-dasharray:1;stroke-dashoffset:1}.nb--ready:not(.nb--drawn) .nb-hint-line{animation:nb-hint-line 3s linear infinite}.nb-pencil{opacity:0}.nb--ready:not(.nb--drawn) .nb-pencil{animation:nb-pencil-move 3s linear infinite}.nb--ready:not(.nb--drawn) .nb-mouse-btn{animation:nb-click 3s ease-in-out infinite}.nb-mouse-ring{opacity:0}.nb--ready:not(.nb--drawn) .nb-mouse-ring{animation:nb-ring 3s ease-out infinite}@keyframes nb-hint-line{0%{stroke-dashoffset:1;opacity:1}78%{stroke-dashoffset:0;opacity:1}92%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:0;opacity:0}}@keyframes nb-click{0%,8%,to{opacity:0}2%,6%{opacity:1}}@keyframes nb-ring{0%,1%{opacity:0;transform:scale(.6)}4%{opacity:.9;transform:scale(1)}14%{opacity:0;transform:scale(2.2)}to{opacity:0}}@keyframes nb-pencil-move{0.0%{transform:translate(18px,112px);opacity:1}3.9%{transform:translate(23px,108px);opacity:1}7.8%{transform:translate(29.1px,107.5px);opacity:1}11.7%{transform:translate(34.8px,110.3px);opacity:1}15.6%{transform:translate(40.5px,113.6px);opacity:1}19.5%{transform:translate(46.6px,114.8px);opacity:1}23.4%{transform:translate(52.1px,111.9px);opacity:1}27.3%{transform:translate(56.7px,107.4px);opacity:1}31.2%{transform:translate(62.7px,105.1px);opacity:1}35.1%{transform:translate(68.6px,106.9px);opacity:1}39.0%{transform:translate(74.2px,110.1px);opacity:1}42.9%{transform:translate(80.1px,112.6px);opacity:1}46.8%{transform:translate(86.3px,112px);opacity:1}50.7%{transform:translate(91.5px,108.5px);opacity:1}54.6%{transform:translate(96.6px,104.4px);opacity:1}58.5%{transform:translate(102.8px,102.9px);opacity:1}62.4%{transform:translate(108.9px,104.5px);opacity:1}66.3%{transform:translate(114.7px,107.3px);opacity:1}70.2%{transform:translate(120.7px,109.1px);opacity:1}74.1%{transform:translate(127px,107.8px);opacity:1}78.0%{transform:translate(132px,104px);opacity:1}88%{transform:translate(138px,92px);opacity:0}to{transform:translate(18px,112px);opacity:0}}.nb-away #intro-canvas-container{opacity:0;transition:opacity .22s linear}.nb-invite{display:none}.js-enabled .nb-invite{display:inline-flex}.nb-invite-ring{animation:nb-invite-pulse 2.6s ease-out infinite}@keyframes nb-invite-pulse{0%{transform:scale(1);opacity:.55}70%,to{transform:scale(1.5);opacity:0}}@media (prefers-reduced-motion: reduce){.nb-hint-line,.nb-pencil,.nb-mouse-btn,.nb-mouse-ring,.nb-invite-ring{animation:none!important}.nb-hint-line{stroke-dashoffset:0}.nb-btn:hover{transform:none}}.nb:not(.nb--ready) .nb-surface:focus-visible{box-shadow:none}.nb--portrait .nb-page,.nb--portrait .nb-lf,.nb--portrait .nb-lb{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .14 0 0 0 0 .16 0 0 0 0 .21 0 0 0 .06 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"),repeating-linear-gradient(to right,transparent 0,transparent calc(var(--ph) / 22 - 1px),rgba(35,40,54,.075) calc(var(--ph) / 22 - 1px),rgba(35,40,54,.075) calc(var(--ph) / 22));background-position:0 0,calc(var(--ph) / 22 * 1.6) 0}
