@font-face{font-family:Excalifont;src:url(/fonts/excalifont-latin.woff2)format("woff2");font-display:swap}*,:before,:after{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--sheet);color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased}.brand{color:var(--ink);font-family:var(--display);letter-spacing:-.02em;align-items:center;gap:8px;font-size:22px;font-weight:800;line-height:1;text-decoration:none;display:flex;position:absolute;top:16px;left:16px}.brand .mark{width:36px;height:auto}.brand .u{display:inline-block;position:relative}.brand .accent{width:.26em;height:auto;position:absolute;top:-.32em;left:58%}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}button:disabled{cursor:default;opacity:.35}:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.app{-webkit-user-select:none;user-select:none;position:fixed;inset:0;overflow:hidden}.board{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}.empty{font-family:var(--display);color:var(--storm);pointer-events:none;place-items:center;margin:0;font-size:clamp(28px,4vw,44px);font-weight:500;display:grid;position:absolute;inset:0}.icon{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}.pill{background:var(--sheet);border:1px solid var(--rule);box-shadow:0 1px 0 var(--rule), 0 8px 24px -16px var(--ink);border-radius:12px;align-items:center;gap:2px;padding:5px;display:flex;position:absolute}.divider{background:var(--rule);flex:none;width:1px;height:20px;margin:0 4px}.tool{width:40px;height:40px;color:var(--ink);border-radius:8px;place-items:center;display:grid;position:relative}.tool:not(:disabled):hover{background:var(--paper)}.tool[aria-pressed=true],.tool[aria-pressed=true]:hover{background:var(--ink);color:var(--sheet)}.key{font-family:var(--mono);color:var(--storm);font-size:10px;line-height:1;position:absolute;bottom:2px;right:4px}.tool[aria-pressed=true] .key{color:var(--cloud)}.dock{bottom:18px;left:50%;translate:-50%}.history{bottom:18px;left:18px}.zoom-group{align-items:center;gap:2px;display:flex}.zoom{min-width:52px;height:40px;font-family:var(--mono);color:var(--storm);font-variant-numeric:tabular-nums;border-radius:8px;font-size:11px}.zoom:hover{background:var(--paper);color:var(--ink)}.top-right{align-items:center;gap:10px;display:flex;position:absolute;top:16px;right:18px}.board-name{font-family:var(--mono);color:var(--storm);font-size:12px}.btn{min-width:32px;height:32px;font-family:var(--mono);color:var(--ink);background:var(--sheet);border:1px solid var(--rule);border-radius:8px;padding:0 11px;font-size:12px}.btn:not(:disabled):hover{background:var(--paper)}.btn-primary,.btn-primary:not(:disabled):hover{background:var(--ink);color:var(--sheet);border-color:var(--ink)}.theme{box-shadow:none;border-radius:10px;padding:3px;position:static}.segments{gap:2px;display:flex}.segment{width:28px;height:28px;color:var(--storm);border-radius:999px;place-items:center;display:grid}.segment .icon{width:18px;height:18px}.theme .segment{border-radius:7px;width:26px;height:26px}.theme .segment[aria-pressed=true]{background:var(--ink);color:var(--sheet)}.dial{font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;justify-items:end;font-size:12px;display:grid;position:absolute;top:112px;right:18px}.dial-label{letter-spacing:.1em;color:var(--storm);padding-bottom:6px;font-size:10px}.dial .track{background:var(--rule);width:2px;position:absolute;top:46px;bottom:30px;right:6px}.dial-stop{color:var(--storm);text-transform:uppercase;letter-spacing:inherit;padding:18px 24px 18px 8px;position:relative}.dial-stop:after{content:"";background:var(--sheet);border:2px solid var(--cloud);border-radius:50%;width:10px;height:10px;margin-top:-5px;position:absolute;top:50%;right:2px}.dial-stop:hover{color:var(--ink)}.dial-stop[aria-pressed=true]{color:var(--bolt);font-weight:500}.dial-stop[aria-pressed=true]:after{background:var(--bolt);border-color:var(--bolt);width:14px;height:14px;margin-top:-7px;right:0}.style-panel{font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--storm);font-size:10px;position:absolute;top:112px;left:18px}.panel-toggle{display:none}.panel-body{background:var(--sheet);border:1px solid var(--rule);width:140px;box-shadow:0 8px 24px -18px var(--ink);border-radius:12px;gap:14px;padding:12px;display:grid}.panel-scope{border-bottom:1px solid var(--rule);color:var(--ink);padding-bottom:10px}.panel-section{gap:6px;display:grid}.style-panel .segments{justify-content:space-between}.style-panel .segment{border-radius:7px}.style-panel .segment:hover{color:var(--ink)}.style-panel .segment[aria-pressed=true]{background:var(--paper);color:var(--ink);box-shadow:inset 0 0 0 1px var(--rule)}.style-panel .segment-text{font-size:13px;line-height:1}.swatches{grid-template-columns:repeat(4,24px);justify-content:space-between;row-gap:6px;display:grid}.swatch{background:var(--swatch);width:24px;height:24px;box-shadow:inset 0 0 0 1px var(--rule);border-radius:50%;display:block}.swatch[aria-pressed=true]{box-shadow:0 0 0 2px var(--sheet), 0 0 0 3.5px var(--ink)}.strike{border-top:1px solid var(--rule);letter-spacing:.06em;text-transform:uppercase;color:var(--ink);white-space:nowrap;align-items:center;gap:8px;padding-top:12px;font-size:10px;display:flex}.bolt{background:var(--bolt);width:28px;height:28px;color:var(--on-bolt);border-radius:50%;place-items:center;display:grid}.bolt .icon{width:16px;height:16px}.help{min-width:240px;color:var(--ink);background:var(--sheet);border:1px solid var(--rule);box-shadow:0 12px 32px -18px var(--ink);border-radius:12px;width:min(580px,100vw - 36px);max-height:calc(100dvh - 140px);margin:0;padding:16px 18px;inset:60px 18px auto auto;overflow-y:auto}.text-editor{resize:none;scrollbar-width:none;transform-origin:0 0;-webkit-user-select:text;user-select:text;background:0 0;border:0;outline:none;margin:0;padding:0;position:absolute;overflow:hidden}.notice{max-width:calc(100vw - 32px);color:var(--ink);border-color:var(--storm);gap:10px;padding:5px 5px 5px 14px;font-size:14px;top:18px;left:50%;translate:-50%}.menu{min-width:240px;color:var(--ink);background:var(--sheet);border:1px solid var(--rule);box-shadow:0 12px 32px -18px var(--ink);border-radius:12px;margin:0;padding:6px;inset:60px 60px auto auto}.menu button{width:100%;font:inherit;color:inherit;text-align:left;background:0 0;border:0;border-radius:8px;justify-content:space-between;gap:16px;padding:8px 10px;font-size:14px;display:flex}.menu button:hover,.menu button:focus-visible{background:var(--paper)}.menu kbd{font-family:var(--mono);color:var(--storm);font-size:12px}.help h2{font-family:var(--display);margin:0 0 10px;font-size:18px;font-weight:800}.help dl{columns:2 240px;column-gap:28px;margin:0}.help dl div{break-inside:avoid;grid-template-columns:96px 1fr;gap:8px;padding-block:3px;display:grid}.help dd{margin:0;font-size:14px}.help kbd{font-family:var(--mono);color:var(--storm);font-size:12px}@media (width<=960px){.history{bottom:84px}}@media (width<=640px){.board-name{display:none}.dock{grid-template-columns:repeat(9,minmax(0,1fr));gap:0;width:min(354px,100vw - 24px);display:grid}.dock .tool{width:100%}.panel-toggle{background:var(--sheet);border:1px solid var(--rule);border-radius:12px;place-items:center;width:44px;height:44px;display:grid}.panel-toggle[aria-expanded=true]{background:var(--paper)}.style-panel .panel-body{margin-top:8px;display:none}.style-panel[data-open=true] .panel-body{display:grid}}.lost{text-align:center;background-color:var(--sheet);background-image:radial-gradient(var(--rule) 1px, transparent 1.4px);background-size:24px 24px;flex-direction:column;justify-content:center;align-items:center;padding:72px 16px 48px;display:flex;position:fixed;inset:0;overflow-y:auto}.lost-scene{aspect-ratio:960/520;width:min(100%,760px);display:grid}.lost-layer{grid-area:1/1;animation:.42s step-end infinite lost-boil}.lost-layer:first-child{animation-delay:-.28s}.lost-layer:nth-child(2){animation-delay:-.14s}.lost-layer .sketch{width:100%;height:auto;display:block;overflow:visible}@keyframes lost-boil{0%{visibility:visible}33.34%{visibility:hidden}}@media (prefers-reduced-motion:reduce){.lost-layer{visibility:hidden;animation:none}.lost-layer:first-child{visibility:visible}}.lost-code{font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--storm);margin:8px 0 0;font-size:12px}.lost-title{font-family:var(--hand);color:var(--ink);margin:10px 0 0;font-size:clamp(32px,6vw,56px);font-weight:400;line-height:1.05}.lost-copy{max-width:34ch;color:var(--storm);margin:12px 0 0;font-size:17px;line-height:1.5}.lost-home{border:2px solid var(--ink);background:var(--bolt);color:var(--on-bolt);box-shadow:3px 3px 0 var(--ink);border-radius:255px 15px 225px/15px 225px 15px 255px;margin-top:28px;padding:12px 22px;font-weight:600;text-decoration:none;transition:transform .12s,box-shadow .12s}.lost-home:hover{box-shadow:4px 4px 0 var(--ink);transform:translate(-1px,-1px)}.lost-home:active{box-shadow:1px 1px 0 var(--ink);transform:translate(2px,2px)}.diagram-dialog{border:1px solid var(--rule);width:min(640px,100vw - 32px);max-height:calc(100dvh - 32px);box-shadow:0 12px 32px -18px var(--ink);background:var(--sheet);color:var(--ink);-webkit-user-select:text;user-select:text;border-radius:12px;padding:24px;overflow:auto}.diagram-dialog::backdrop{background:#00000059}.diagram-dialog h2{font-family:var(--display);margin:0;font-size:18px;font-weight:800}.diagram-dialog p{font-size:14px;line-height:1.5}.diagram-dialog code{font-family:var(--mono)}.diagram-dialog label{font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--storm);margin-bottom:8px;font-size:10px;display:block}.diagram-dialog textarea{resize:vertical;border:1px solid var(--rule);background:var(--sheet);width:100%;min-height:140px;color:var(--ink);font:12px / 1.6 var(--mono);border-radius:8px;padding:12px;display:block}.diagram-dialog .diagram-help{color:var(--storm);font-size:12px;line-height:1.6}.diagram-error{font-size:14px;font-weight:600}.diagram-actions{border-top:1px solid var(--rule);flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;padding-top:12px;display:flex}.diagram-actions button:first-child{margin-right:auto}@media (width<=640px){.diagram-open{position:absolute;top:44px;right:0}.diagram-dialog{padding:16px}}
