:root{--board: #fafaf8;--sidebar: #f1f1ee;--board-dot: #dcdfe4;--ink: #1f242b;--chrome: #fff;--chrome-line: #e3e6eb;--chrome-text: #2b3038;--muted: #7a818c;--active: #eaf1fe;--sector: #fbfbfd;--sector-active: #eef3ff;--groove: #eff1f5;--hub: #fff;--label: #3a404b;--fab: #171a20;--fab-icon: #fff;--shadow: rgba(40, 50, 75, .16);--blue: #3b82f0;--purple: #6447ec;--green: #34c38f;--orange: #f2a23c;--red: #ec5d6c;--primary: #007aff;--primary-pressed: #0062cc;--secondary: #eff1f5;--secondary-pressed: #e3e6eb;--pen-blue: #337aeb;--pen-red: #e34a54;--pen-orange: #f57305;--pen-green: #149e4d;--pen-mint: #26a878;color-scheme:light}:root[data-theme=dark]{--board: #1e2329;--sidebar: #171b20;--board-dot: #313842;--ink: #f2f3f5;--chrome: #2a3038;--chrome-line: #3b434e;--chrome-text: #e7e9ed;--muted: #9aa2ad;--active: #33405a;--sector: #2b313a;--sector-active: #343c47;--groove: #22272e;--hub: #323943;--label: #e3e6eb;--fab: #f2f3f5;--fab-icon: #1e2329;--shadow: rgba(0, 0, 0, .5);--blue: #5c9dff;--purple: #8a70ff;--green: #45d09a;--orange: #ffb04d;--red: #ff7a87;--primary: #0a84ff;--primary-pressed: #409cff;--secondary: #3b434e;--secondary-pressed: #47505c;--pen-blue: #5c9dff;--pen-red: #ff7a87;--pen-orange: #ffa04d;--pen-green: #45d09a;--pen-mint: #45d09a;color-scheme:dark}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overflow:hidden;overscroll-behavior:none;background:var(--sidebar);color:var(--chrome-text);font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,Roboto,sans-serif}button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}svg{display:block}a{color:inherit}.js .page-text{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.page-text{padding:24px}#stage{direction:ltr}#stage{position:fixed;inset:0;overflow:hidden;touch-action:none;z-index:1;background-color:var(--board);transition:transform .35s cubic-bezier(.3,1,.4,1),border-radius .35s;background-image:radial-gradient(var(--board-dot) 1.1px,transparent 1.2px);background-size:26px 26px}#stage canvas{position:absolute;inset:0;width:100%;height:100%}#stage[data-tool=hand] canvas{cursor:grab}#stage[data-tool=hand].panning canvas{cursor:grabbing}#stage[data-tool=pen] canvas,#stage[data-tool=highlighter] canvas,#stage[data-tool=lasso] canvas{cursor:crosshair}#stage[data-tool=eraser] canvas{cursor:cell}#stage[data-tool=text] canvas{cursor:text}#stage[data-tool=select] canvas{cursor:default}.type-box{position:absolute;padding:0;margin:0;border:0;outline:1.5px dashed color-mix(in srgb,var(--blue) 60%,transparent);outline-offset:4px;background:transparent;line-height:1.3;resize:none;overflow:hidden;white-space:pre;caret-color:var(--blue)}#selbar{position:absolute;z-index:6;transform:translate(-50%);display:none;padding:4px;border-radius:12px;background:var(--chrome);box-shadow:0 4px 12px var(--shadow)}#selbar.show{display:flex}#selbar button{height:30px;padding:0 12px;border-radius:8px;color:var(--red);font-weight:600;font-size:13px}#selbar button:hover{background:var(--secondary)}.picker{position:fixed;left:50%;bottom:70px;width:1px;height:1px;opacity:0;pointer-events:none}#world,#fixed{position:absolute;inset:0 auto auto 0;width:0;height:0}.spot{position:absolute;display:block;border-radius:10px;visibility:hidden}.spot.on{visibility:visible}.spot:focus-visible{outline:2px solid var(--blue);outline-offset:2px}a.spot,button.spot{background:transparent;cursor:pointer}a.spot:hover,button.spot:hover{background:color-mix(in srgb,var(--blue) 9%,transparent)}a.spot.ink-link:hover,button.spot.ink-link:hover{background:transparent}input.spot,textarea.spot{border:0;background:transparent;color:var(--ink);padding:8px 12px;font:16px/28px inherit;font-family:inherit;outline:none;resize:none;touch-action:auto}input.spot:focus,textarea.spot:focus{background:color-mix(in srgb,var(--blue) 7%,transparent)}.round{position:absolute;width:44px;height:44px;border-radius:50%;background:var(--chrome);box-shadow:0 3px 10px #00000014;display:grid;place-items:center}#menu-button{top:14px;left:14px}.round svg{width:22px;height:22px}.wide #menu-button{display:none}#langs{position:absolute;top:14px;right:102px;z-index:7}#lang-button{height:44px;padding:0 12px 0 10px;display:flex;align-items:center;gap:6px;border-radius:22px;background:var(--chrome);box-shadow:0 3px 10px #00000014;color:var(--chrome-text);font-size:12px;font-weight:700;letter-spacing:.04em}#lang-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6}#lang-menu{position:absolute;top:52px;right:0;display:none;min-width:190px;max-height:min(80vh,600px);overflow:auto;padding:6px;border-radius:14px;background:var(--chrome);box-shadow:0 10px 30px var(--shadow)}#langs.open #lang-menu{display:grid}#lang-menu a{padding:9px 12px;border-radius:9px;color:var(--chrome-text);font-size:15px;text-decoration:none}#lang-menu a:hover{background:var(--secondary)}#lang-menu a[aria-current]{color:var(--blue);font-weight:600}#theme{position:absolute;top:14px;right:14px;width:80px;height:44px;border-radius:22px;background:var(--chrome);box-shadow:0 3px 10px #00000014;color:var(--muted)}#theme .ends{position:absolute;inset:0 13px;display:flex;align-items:center;justify-content:space-between;opacity:.7}#theme .knob{position:absolute;top:4px;left:4px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--orange) 16%,transparent);color:var(--orange);transition:transform .25s cubic-bezier(.3,1.4,.5,1)}:root[data-theme=dark] #theme .knob{transform:translate(36px);background:var(--active);color:var(--purple)}#theme svg,.ends svg{width:15px;height:15px}#bar{position:absolute;left:50%;bottom:14px;transform:translate(-50%);display:flex;align-items:center;gap:2px;height:44px;padding:0 5px;border-radius:22px;background:var(--chrome);border:1px solid var(--chrome-line);box-shadow:0 6px 18px #00000012;white-space:nowrap}#bar .tool{width:36px;height:36px;border-radius:12px;display:grid;place-items:center}#bar .tool svg{width:20px;height:20px}#bar .tool.on{color:var(--blue);background:var(--active)}#bar .tool.dim{opacity:.4}#bar{transition:opacity .2s}.dial-open #bar{opacity:.25;pointer-events:none}#bar .sep{width:1px;height:22px;margin:0 4px;background:var(--chrome-line)}#bar .dot{width:30px;height:36px;display:grid;place-items:center}#bar .dot i{display:block;width:18px;height:18px;border-radius:50%;background:var(--c);box-shadow:0 0 0 4px var(--chrome),0 0 0 6px transparent}#bar .dot.first i{outline:1px solid var(--chrome-line)}#bar .dot.on i{box-shadow:0 0 0 3.5px var(--chrome),0 0 0 5px var(--blue)}#bar .dot.wheel{width:36px}#bar .wheel i{position:relative;width:22px;height:22px;box-shadow:none;background:conic-gradient(#ff3b30,#ff2d92,#af52de,#007aff,#32ade6,#34c759,#fc0,#ff3b30)}#bar .wheel i:after{content:"";position:absolute;inset:2.5px;border-radius:50%;background:var(--wheel, var(--ink));border:2px solid var(--chrome)}.reduced #bar .extra{display:none}.wiggle{animation:wiggle .4s ease}@keyframes wiggle{20%{transform:rotate(-9deg)}50%{transform:rotate(8deg)}80%{transform:rotate(-4deg)}}#fab{position:absolute;width:50px;height:50px;margin:-25px 0 0 -25px;border-radius:50%;background:var(--fab);color:var(--fab-icon);display:grid;place-items:center;box-shadow:0 10px 15px var(--shadow);touch-action:none;transition:opacity .15s,scale .2s;cursor:grab}#fab:after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2.5px solid transparent}#fab.pen:after{border-color:var(--pen-ink, var(--ink))}#fab svg{width:21px;height:21px}#fab.away{opacity:0;pointer-events:none}#tip,.tip{position:absolute;left:0;top:0;z-index:3;--m: var(--ink);filter:drop-shadow(4px 7px 5px var(--shadow));pointer-events:none;visibility:hidden}#tip svg.marker,.tip svg.marker{display:block;width:100%;height:auto;--m-dark: color-mix(in srgb, var(--m) 70%, #000)}#scrim{position:absolute;inset:0;display:none}#dial{position:absolute;left:0;top:0;touch-action:none;cursor:grab;opacity:0;pointer-events:none;transform:scale(.18);transition:opacity .18s,transform .3s cubic-bezier(.3,1.3,.5,1);user-select:none}#dial.open{opacity:1;pointer-events:auto;transform:none}#dial>svg{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 calc(var(--d) * .014) calc(var(--d) * .02) var(--shadow));overflow:visible}#dial>svg path{fill:var(--sector);stroke:var(--sector);stroke-linejoin:round}#dial>svg path.on{fill:var(--sector-active);stroke:var(--sector-active)}#dial .groove{fill:var(--groove)}#dial .hub{fill:var(--hub)}#dial .hub.on{fill:var(--sector-active)}.item{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:3px;pointer-events:none;font-size:calc(var(--d) * .042);font-weight:500;color:var(--label)}.item svg{width:calc(var(--d) * .074);height:calc(var(--d) * .074);color:var(--c)}.item img{width:calc(var(--d) * .1);height:calc(var(--d) * .1);margin:calc(var(--d) * -.017) 0}#hint{position:absolute;display:none;align-items:center;gap:8px;height:36px;padding:0 14px;font-size:12px;border-radius:18px;background:var(--chrome);border:1px solid var(--chrome-line);white-space:nowrap;pointer-events:none;transform:translate(-50%)}#pill{position:absolute;left:50%;bottom:68px;transform:translate(-50%);display:none;align-items:center;gap:8px;height:40px;padding:0 6px 0 14px;border-radius:20px;background:var(--chrome);box-shadow:0 4px 10px var(--shadow);font-size:13px;font-weight:600;white-space:nowrap}#pill.show{display:flex}#pill.pager{padding:0 4px}#pill.show{gap:4px;padding:0 5px 0 12px}#pill .live{width:10px;height:10px;margin-right:6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 22%,transparent);animation:blink 1.1s ease-in-out infinite;position:relative}#pill.paused .live{background:var(--muted);box-shadow:none;animation:none}@keyframes blink{50%{opacity:.25}}#pill .ico{position:relative;width:32px;height:32px;display:grid;place-items:center;border-radius:50%}#pill .ico:hover{background:var(--secondary)}#pill .ico svg{width:20px;height:20px}#pill .stop svg rect{fill:var(--red)}#pill .play svg path{fill:var(--green)}#pill .done svg circle{fill:var(--primary)}#pill .done svg path{fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}#pill [data-tip]:after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 10px);transform:translate(-50%);padding:4px 8px;border-radius:6px;background:var(--fab);color:var(--fab-icon);font-size:12px;font-weight:600;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s}#pill [data-tip]:hover:after{opacity:1}.portrait #pill [data-tip]:after{bottom:auto;top:calc(100% + 10px)}#pill .capsule{height:28px;padding:0 12px;border-radius:14px;background:var(--primary);color:#fff;font-weight:600}#pill .capsule:active{background:var(--primary-pressed)}#pill .step{width:32px;height:32px;display:grid;place-items:center;border-radius:50%}#pill .step svg{width:18px;height:18px;transform:rotate(90deg)}#pill .step:disabled{opacity:.3;cursor:default}.spin{width:14px;height:14px;border-radius:50%;border:2px solid var(--chrome-line);border-top-color:var(--muted);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#buddy{position:absolute;left:2px;bottom:0;width:132px;height:136px;touch-action:none;cursor:pointer;transform-origin:bottom}#buddy img{width:100%;height:100%;display:block;pointer-events:none}:root[data-theme=dark] #buddy img{filter:drop-shadow(0 0 .6px rgba(255,255,255,.9)) drop-shadow(0 0 .6px rgba(255,255,255,.6))}.portrait #buddy{left:-6px;bottom:20px;width:80px;height:83px}.portrait #bar{inset:50% 10px auto auto;transform:translateY(-50%);flex-direction:column;width:44px;height:auto;padding:5px 0}.portrait #bar .sep{width:22px;height:1px;margin:4px 0}.portrait #bar .dot{width:36px;height:30px}.portrait #bar .dot.wheel{height:32px}.portrait #menu-button,.portrait #theme{top:4px}.portrait #pill{top:6px;bottom:auto}.portrait #pill:not(.show){display:none}.portrait #toast{top:58px}.low #buddy{width:84px;height:87px}.mood-bounce{animation:bounce .5s ease-in-out infinite alternate}.mood-sway{animation:sway 2.2s ease-in-out infinite alternate}.mood-breathe{animation:breathe 3s ease-in-out infinite alternate}.mood-scribble{animation:scribble .35s linear infinite}.mood-pulse{animation:pulse 1s ease-in-out infinite alternate}.mood-shake{animation:shake .5s ease 2}@keyframes bounce{to{transform:translateY(-7px)}}@keyframes sway{0%{transform:rotate(-4deg)}to{transform:rotate(4deg)}}@keyframes breathe{to{transform:scaleY(1.03)}}@keyframes scribble{25%{transform:translate(1px,-1px)}75%{transform:translate(-1px,1px)}}@keyframes pulse{to{transform:scale(1.04)}}@keyframes shake{25%{transform:translate(-3px)}75%{transform:translate(3px)}}#toast{position:absolute;left:50%;top:70px;transform:translate(-50%,-8px);max-width:calc(100vw - 32px);display:flex;align-items:center;gap:10px;padding:8px 14px;font-size:13px;color:var(--fab-icon);background:var(--fab);border-radius:12px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}#toast.show{opacity:1;transform:translate(-50%);pointer-events:auto}#toast a{font-weight:600;white-space:nowrap}#drawer-scrim{position:absolute;inset:0;pointer-events:none}#drawer{position:fixed;top:0;bottom:0;left:0;width:min(82vw,340px);padding:24px 18px;display:flex;flex-direction:column;gap:4px;background:var(--sidebar);opacity:0;transform:translate(-30%);transition:transform .35s cubic-bezier(.3,1,.4,1),opacity .25s}.drawer-open #drawer{transform:none;opacity:1}.drawer-open #stage{transform:translate(min(82vw,340px));border-radius:36px;box-shadow:0 0 24px #0000001f}.drawer-open #drawer-scrim{pointer-events:auto}#drawer strong{font:700 24px Georgia,serif;margin:0 0 14px 8px}#drawer a,#drawer button{display:flex;align-items:center;min-height:46px;padding:0 10px;border-radius:12px;font-size:16px;text-decoration:none;text-align:left}#drawer hr{width:100%;border:0;border-top:1px solid var(--chrome-line);margin:10px 0}#drawer .small{font-size:14px;color:var(--muted);min-height:38px}html[dir=rtl] #theme{right:auto;left:14px}html[dir=rtl] #langs{right:auto;left:102px}html[dir=rtl] #lang-menu{right:auto;left:0}html[dir=rtl] #lang-menu a{text-align:right}#lang-menu svg.hand{display:block;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;overflow:visible}#lang-menu a{display:flex;align-items:center;min-height:40px}html[dir=rtl] #lang-menu a{justify-content:flex-end}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}#lang-button{height:auto;padding:0;background:none;box-shadow:none;border-radius:12px}#lang-button svg.badge{display:block;width:auto;height:37px;fill:none;stroke-linecap:round;stroke-linejoin:round}#lang-button:focus-visible{outline:2px solid var(--blue);outline-offset:3px}#lang-menu{background:transparent;box-shadow:none;border-radius:0;z-index:1}#langs .menu-bg{position:absolute;z-index:0;overflow:visible;pointer-events:none;display:none}#langs.open .menu-bg{display:block}#langs .menu-bg .fill{fill:var(--board);stroke:none;opacity:0;animation:menu-fill .2s .12s forwards}#langs .menu-bg .edge{fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:menu-draw .32s ease-out forwards}#langs.open #lang-menu svg.hand path{stroke-dasharray:1;stroke-dashoffset:1;animation:menu-draw .38s ease-out var(--d, .2s) forwards}#lang-menu a:hover{background:color-mix(in srgb,var(--blue) 9%,transparent)}@keyframes menu-draw{to{stroke-dashoffset:0}}@keyframes menu-fill{to{opacity:1}}@media(prefers-reduced-motion:reduce){#langs .menu-bg .edge,#langs.open #lang-menu svg.hand path{animation:none;stroke-dashoffset:0}#langs .menu-bg .fill{animation:none;opacity:1}}