:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--bg:#f7f6f2;--surface:#fff;--text:#1b1b1f;--muted:#55565e;--border:#c9c7bf;--accent:#1f5fbf;--accent-text:#fff;--dot:#1b1b1f;--dot-empty:#d9d6cc;--slot-bg:#fff;--slot-empty:#f0eee8;--write-tint:#fff8e6;--focus:#c2410c;--warn-bg:#fff4d6;--warn-border:#b7791f;--error:#b42318;--slot:28px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#121316;--surface:#1c1d22;--text:#ecebe6;--muted:#a9a8a2;--border:#3d3e45;--accent:#7fb0ff;--accent-text:#0b1a33;--dot:#f4f3ee;--dot-empty:#3a3b42;--slot-bg:#24252b;--slot-empty:#18191d;--write-tint:#2a2416;--focus:#ffb067;--warn-bg:#2d2412;--warn-border:#d69e2e;--error:#ff8a80}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0}main,.site-header,.site-footer{max-width:1040px;margin:0 auto;padding:0 16px}h1{margin:1.5rem 0 .25rem;font-size:1.8rem}h2{margin:0 0 .5rem;font-size:1.25rem}.tagline,.hint,.summary{color:var(--muted)}.tagline{max-width:60ch;margin:0 0 1.5rem}a{color:var(--accent)}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.skip-link{background:var(--surface);border:2px solid var(--focus);z-index:10;padding:8px 12px;position:absolute;top:-100px;left:8px}.skip-link:focus{top:8px}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.controls,.output,.unicode,.help{background:var(--surface);border:1px solid var(--border);border-radius:10px;margin-bottom:16px;padding:16px}.field{flex-direction:column;gap:4px;min-width:0;display:flex}.field-text{margin-bottom:12px}.field-row{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px 16px;display:grid}label,legend{font-weight:600}.optional{color:var(--muted);font-weight:400}textarea,input,select,button{font:inherit;color:inherit}textarea,input[type=number],select{border:1px solid var(--border);background:var(--bg);border-radius:6px;width:100%;min-height:44px;padding:8px 10px}textarea{resize:vertical;font-size:1.1rem}[aria-invalid=true]{border-color:var(--error);border-width:2px}.hint,.error{margin:0;font-size:.875rem}.error{color:var(--error);font-weight:600}.view-toggle{border:0;flex-wrap:wrap;gap:8px 24px;margin:16px 0 0;padding:0;display:flex}.view-toggle legend{margin-bottom:6px}.view-toggle label{cursor:pointer;align-items:center;gap:8px;min-height:44px;font-weight:400;display:inline-flex}.view-toggle input{width:20px;height:20px;accent-color:var(--accent)}button{background:var(--accent);color:var(--accent-text);cursor:pointer;border:0;border-radius:6px;min-height:44px;margin-top:8px;padding:10px 16px;font-weight:600}.output:focus{outline:none}.summary{margin:0 0 12px}.warnings{background:var(--warn-bg);border-left:4px solid var(--warn-border);margin:0 0 12px;padding:8px 12px 8px 32px}.empty{color:var(--muted);font-style:italic}.page h3{margin:16px 0 6px;font-size:1rem}.slate-scroll{padding-bottom:4px;overflow-x:auto}.slate{border-radius:8px;gap:6px;width:max-content;padding:8px;display:grid}.slate.view-write{background:var(--write-tint)}.slate-row,.ruler{grid-template-columns:2.75rem repeat(var(--cells), var(--slot)) 2.75rem;align-items:center;gap:4px;display:grid}.view-write .slate-row,.view-write .ruler{direction:rtl}.ruler{color:var(--muted);text-align:center;font-variant-numeric:tabular-nums;font-size:.7rem}.row-num{color:var(--muted);text-align:center;font-variant-numeric:tabular-nums;white-space:nowrap;direction:ltr;font-size:.85rem}.view-write .row-num.start{color:var(--accent);font-weight:700}.slot{width:var(--slot);height:calc(var(--slot) * 1.45);background:var(--slot-bg);border:1px solid var(--border);cursor:default;border-radius:4px;justify-content:center;align-items:center;display:flex}.slot.empty{background:var(--slot-empty);border-style:dashed}.slot:not(.empty):hover{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.cell-graphic{grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(2,1fr);grid-auto-flow:column;gap:3px;display:inline-grid}.dot{border:1px solid var(--dot-empty);border-radius:50%;width:7px;height:7px}.dot.raised{background:var(--dot);border-color:var(--dot)}.cell-graphic.large{gap:6px}.cell-graphic.large .dot{width:14px;height:14px}.tooltip{z-index:20;background:var(--surface);border:1px solid var(--border);pointer-events:none;border-radius:8px;max-width:min(320px,100vw - 16px);padding:10px 12px;font-size:.9rem;position:absolute;box-shadow:0 6px 24px #0003}.tooltip-title{margin:0 0 8px;font-weight:600}.tooltip-print{vertical-align:middle;margin-right:4px;font-size:1.6rem;line-height:1}.tooltip-pics{gap:20px;display:flex}.tooltip-pics figure{flex-direction:column;align-items:center;gap:4px;margin:0;display:flex}.tooltip-pics figcaption,.tooltip-meta{color:var(--muted);font-size:.8rem}.tooltip-meta{margin:8px 0 0}#unicode-out{margin-top:8px;font-size:1.5rem;line-height:1.4}.help summary{cursor:pointer;min-height:32px;font-weight:600}.help h3{margin-top:1rem;font-size:1rem}.site-footer{color:var(--muted);padding-bottom:2rem;font-size:.875rem}@media (width<=600px){:root{--slot:22px}.dot{width:5px;height:5px}.cell-graphic{gap:2px}}@media (forced-colors:active){.dot.raised{forced-color-adjust:none;background:canvastext}}@media print{.controls,.unicode,.help,.skip-link,.site-footer,.tagline{display:none}.output{border:0}.slate-scroll{overflow:visible}}
