:root{--actile-palette-white: #ffffff;--actile-palette-slate-50: #f8fafc;--actile-palette-slate-100: #f1f5f9;--actile-palette-slate-200: #e2e8f0;--actile-palette-slate-300: #cbd5e1;--actile-palette-slate-400: #94a3b8;--actile-palette-slate-500: #64748b;--actile-palette-slate-600: #475569;--actile-palette-slate-700: #334155;--actile-palette-slate-800: #1e293b;--actile-palette-slate-900: #0f172a;--actile-palette-indigo-400: #818cf8;--actile-palette-indigo-500: #6366f1;--actile-palette-indigo-600: #4f46e5;--actile-palette-indigo-700: #4338ca;--actile-palette-red-500: #ef4444;--actile-palette-red-600: #dc2626;--actile-palette-green-500: #22c55e;--actile-palette-green-600: #16a34a;--actile-palette-amber-500: #f59e0b;--actile-palette-amber-600: #d97706;--actile-palette-blue-500: #3b82f6;--actile-palette-blue-600: #2563eb;--actile-space-1: .25rem;--actile-space-2: .5rem;--actile-space-3: .75rem;--actile-space-4: 1rem;--actile-space-5: 1.5rem;--actile-space-6: 2rem;--actile-radius-sm: .375rem;--actile-radius-md: .5rem;--actile-radius-lg: .75rem;--actile-radius-full: 9999px;--actile-shadow-sm: 0 1px 2px rgb(15 23 42 / .08);--actile-shadow-md: 0 4px 12px rgb(15 23 42 / .12);--actile-shadow-lg: 0 12px 32px rgb(15 23 42 / .18);--actile-font-size-sm: .8125rem;--actile-font-size-md: .875rem;--actile-font-size-lg: 1rem;color-scheme:light;--actile-color-primary: var(--actile-palette-indigo-600);--actile-color-primary-hover: var(--actile-palette-indigo-700);--actile-color-on-primary: var(--actile-palette-white);--actile-color-surface: var(--actile-palette-white);--actile-color-text: var(--actile-palette-slate-800);--actile-color-text-muted: var(--actile-palette-slate-500);--actile-color-border: var(--actile-palette-slate-200);--actile-color-border-hover: var(--actile-palette-slate-300);--actile-color-danger: var(--actile-palette-red-600);--actile-color-success: var(--actile-palette-green-600);--actile-color-warning: var(--actile-palette-amber-600);--actile-color-info: var(--actile-palette-blue-600);--actile-color-disabled: var(--actile-palette-slate-100);--actile-color-surface-muted: var(--actile-palette-slate-50);--actile-radius: var(--actile-radius-lg);--actile-font-family: inherit;--actile-font-size: var(--actile-font-size-md);--actile-control-height: 2.75rem;--actile-control-padding-x: 1rem;--actile-focus-ring-width: 3px;--actile-focus-ring-color: color-mix(in srgb, var(--actile-color-primary) 25%, transparent)}[data-theme=dark]{color-scheme:dark;--actile-color-primary: var(--actile-palette-indigo-500);--actile-color-primary-hover: var(--actile-palette-indigo-400);--actile-color-on-primary: var(--actile-palette-white);--actile-color-surface: var(--actile-palette-slate-900);--actile-color-text: var(--actile-palette-slate-200);--actile-color-text-muted: var(--actile-palette-slate-400);--actile-color-border: var(--actile-palette-slate-700);--actile-color-border-hover: var(--actile-palette-slate-600);--actile-color-danger: var(--actile-palette-red-500);--actile-color-success: var(--actile-palette-green-500);--actile-color-warning: var(--actile-palette-amber-500);--actile-color-info: var(--actile-palette-blue-500);--actile-color-disabled: var(--actile-palette-slate-800);--actile-color-surface-muted: var(--actile-palette-slate-800)}@font-face{font-family:Bricolage Grotesque;src:url(/fonts/bricolage-grotesque.woff2) format("woff2");font-weight:200 800;font-display:swap}@font-face{font-family:Atkinson Hyperlegible Mono;src:url(/fonts/atkinson-mono.woff2) format("woff2");font-weight:200 800;font-display:swap}:root{--tapoti-sky: #eceefb;--tapoti-surface: #ffffff;--tapoti-ink: #17154a;--tapoti-ink-muted: #5f5c8f;--tapoti-line: #cfd2f5;--tapoti-lock: #b9bcd6;--tapoti-primary: #3a35d9;--tapoti-primary-hover: #27229e;--tapoti-on-primary: #ffffff;--tapoti-highlight: #ffe22e;--tapoti-highlight-deep: #d1b400;--tapoti-on-highlight: #17154a;--tapoti-mark-from: 55%;--tapoti-on-mark: var(--tapoti-ink);--tapoti-success: #12a66a;--tapoti-success-deep: #0b7d4f;--tapoti-warning: #ff8a1f;--tapoti-warning-soft: #fff1cc;--tapoti-danger: #f0354b;--tapoti-danger-deep: #c01f35;--tapoti-danger-soft: #ffe1e5;--tapoti-cursor-bg: var(--tapoti-highlight);--tapoti-keyboard-bed: #dcdff6;--tapoti-key-neutral: #f6f7fd;--tapoti-key-edge: rgb(23 21 74 / .18);--tapoti-finger-5: #ffb3c7;--tapoti-finger-4: #ffcf8f;--tapoti-finger-3: #fff09a;--tapoti-finger-2: #a6e8c1;--tapoti-finger-thumb: #c5c8ff;--tapoti-on-finger: #17154a;--tapoti-seyes-strong: rgb(96 90 220 / .3);--tapoti-seyes-mid: rgb(96 90 220 / .22);--tapoti-seyes-light: rgb(96 90 220 / .11);--tapoti-radius: 1.125rem;--tapoti-radius-key: .875rem;--tapoti-border: 2px solid var(--tapoti-line);--tapoti-font: "Bricolage Grotesque", ui-rounded, "Avenir Next", "Segoe UI", system-ui, sans-serif;--tapoti-font-typing: "Atkinson Hyperlegible Mono", ui-monospace, "SF Mono", Menlo, monospace;--actile-color-primary: var(--tapoti-primary);--actile-color-primary-hover: var(--tapoti-primary-hover);--actile-color-on-primary: var(--tapoti-on-primary);--actile-color-surface: var(--tapoti-surface);--actile-color-surface-muted: var(--tapoti-sky);--actile-color-text: var(--tapoti-ink);--actile-color-text-muted: var(--tapoti-ink-muted);--actile-color-border: var(--tapoti-line);--actile-color-border-hover: var(--tapoti-lock);--actile-color-disabled: var(--tapoti-sky);--actile-color-success: var(--tapoti-success);--actile-color-warning: var(--tapoti-warning);--actile-color-danger: var(--tapoti-danger);--actile-radius: var(--tapoti-radius-key);--actile-button-radius: var(--tapoti-radius-key);--actile-input-radius: var(--tapoti-radius-key);--actile-control-height: 3rem;--actile-font-family: inherit;--actile-font-size: 1rem}:root[data-theme=dark]{color-scheme:dark;--tapoti-sky: #100f2b;--tapoti-surface: #1b1a47;--tapoti-ink: #eef0ff;--tapoti-ink-muted: #a9acd6;--tapoti-line: #34327a;--tapoti-lock: #4a4890;--tapoti-primary: #6f6bf2;--tapoti-primary-hover: #4b47c4;--tapoti-success: #1fbf7d;--tapoti-success-deep: #128a58;--tapoti-warning-soft: #4a3c14;--tapoti-danger-soft: #4d1f33;--tapoti-keyboard-bed: #24225a;--tapoti-key-neutral: #34327a;--tapoti-key-edge: rgb(0 0 0 / .35);--tapoti-seyes-strong: rgb(150 146 255 / .2);--tapoti-seyes-mid: rgb(150 146 255 / .14);--tapoti-seyes-light: rgb(150 146 255 / .07);--tapoti-mark-from: 12%;--tapoti-on-mark: var(--tapoti-on-highlight)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){color-scheme:dark;--tapoti-sky: #100f2b;--tapoti-surface: #1b1a47;--tapoti-ink: #eef0ff;--tapoti-ink-muted: #a9acd6;--tapoti-line: #34327a;--tapoti-lock: #4a4890;--tapoti-primary: #6f6bf2;--tapoti-primary-hover: #4b47c4;--tapoti-success: #1fbf7d;--tapoti-success-deep: #128a58;--tapoti-warning-soft: #4a3c14;--tapoti-danger-soft: #4d1f33;--tapoti-keyboard-bed: #24225a;--tapoti-key-neutral: #34327a;--tapoti-key-edge: rgb(0 0 0 / .35);--tapoti-seyes-strong: rgb(150 146 255 / .2);--tapoti-seyes-mid: rgb(150 146 255 / .14);--tapoti-seyes-light: rgb(150 146 255 / .07);--tapoti-mark-from: 12%;--tapoti-on-mark: var(--tapoti-on-highlight)}}html,body{height:100%;margin:0}body{font-family:var(--tapoti-font);font-size:1.0625rem;line-height:1.5;color:var(--tapoti-ink);background:var(--tapoti-sky);-webkit-font-smoothing:antialiased}h1,h2,h3,h4{letter-spacing:-.02em;line-height:1.15}.seyes{position:relative;background-color:var(--tapoti-surface);background-image:linear-gradient(to right,var(--tapoti-seyes-mid) 1px,transparent 1px),linear-gradient(to bottom,var(--tapoti-seyes-strong) 1px,transparent 1px),linear-gradient(to bottom,var(--tapoti-seyes-light) 1px,transparent 1px);background-size:2rem 2rem,2rem 2rem,.5rem .5rem}.seyes--marge:before{content:"";position:absolute;inset:0 auto 0 calc(4rem - 1px);width:2px;background:var(--tapoti-danger);opacity:.55;pointer-events:none}.key-btn{--key-bg: var(--tapoti-primary);--key-fg: var(--tapoti-on-primary);--key-edge: var(--tapoti-primary-hover);--key-depth: 5px;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;box-sizing:border-box;padding:.7rem 1.35rem;border:2px solid var(--key-edge);border-radius:var(--tapoti-radius-key);background:var(--key-bg);color:var(--key-fg);font:inherit;font-weight:700;line-height:1.2;text-decoration:none;white-space:nowrap;box-shadow:0 var(--key-depth) 0 var(--key-edge);margin-bottom:var(--key-depth);cursor:pointer;-webkit-user-select:none;user-select:none;transition:transform 80ms ease-out,box-shadow 80ms ease-out}.key-btn:hover{transform:translateY(2px);box-shadow:0 calc(var(--key-depth) - 2px) 0 var(--key-edge)}.key-btn:active{transform:translateY(var(--key-depth));box-shadow:0 0 0 var(--key-edge)}.key-btn:focus-visible{outline:3px solid var(--tapoti-highlight);outline-offset:3px}.key-btn--success{--key-bg: var(--tapoti-success);--key-edge: var(--tapoti-success-deep)}.key-btn--accent{--key-bg: var(--tapoti-highlight);--key-fg: var(--tapoti-on-highlight);--key-edge: var(--tapoti-highlight-deep)}.key-btn--light{--key-bg: var(--tapoti-surface);--key-fg: var(--tapoti-primary);--key-edge: var(--tapoti-line)}:root[data-theme=dark] .key-btn--light{--key-fg: var(--tapoti-ink)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .key-btn--light{--key-fg: var(--tapoti-ink)}}.key-btn--danger{--key-bg: var(--tapoti-danger);--key-edge: var(--tapoti-danger-deep)}.key-btn--sm{--key-depth: 4px;padding:.4rem .9rem;font-size:.9375rem}.key-btn--lg{padding:1rem 1.75rem;font-size:1.25rem}.key-btn:disabled{--key-bg: var(--tapoti-sky);--key-fg: var(--tapoti-ink-muted);--key-edge: var(--tapoti-lock);cursor:not-allowed;transform:none;box-shadow:0 var(--key-depth) 0 var(--key-edge)}@media(prefers-reduced-motion:reduce){.key-btn{transition:none}}kbd.enter{display:inline-grid;place-items:center;min-width:1.7em;padding:.1em .35em;border-radius:.45em;background:color-mix(in srgb,currentColor 16%,transparent);border:1.5px solid color-mix(in srgb,currentColor 55%,transparent);font-family:inherit;font-size:.8em;font-weight:600;line-height:1.2}
