:root{font-size:16px;color-scheme:light;font-family:Space Grotesk,Noto Sans JP,Noto Sans TC,sans-serif;--color-mineral: #eeeae0;--color-paper: #f7f4ec;--color-graphite: #17191a;--color-strata: #b9b2a5;--color-algae: #536a55;--color-oxidized-blue: #4f6b78;--color-fossil: #94613a;--color-signal: #ad4938;--color-bg: var(--color-mineral);--color-surface: var(--color-paper);--color-text: var(--color-graphite);--color-text-muted: #53554f;--color-line: #a9a294;--color-line-soft: rgb(60 56 48 / 18%);--color-line-strong: #766f63;--color-accent: var(--color-algae);--color-accent-soft: rgb(83 106 85 / 11%);--color-warning: #875c2e;--color-error: var(--color-signal);--color-disabled: #67645d;--viewer-canvas-inset: 20px;--viewer-grid-size: 24px;--viewer-grid-major-size: 96px;--radius-sm: 2px;--radius-md: 4px;--border-control: 2px;--border-strong: 2px;--touch-target: 44px;--control-height: 48px;--control-label-height: 16px;--control-label-gap: 8px;--control-border-width: 2px;--control-border-color: var(--color-line-strong);--control-radius: var(--radius-md);--control-background: var(--color-paper);--control-hover-bg: #e8e6e0;--control-foreground: var(--color-graphite);--control-font: 600 14px/1.2 var(--font-display);--control-padding-inline: 12px;--control-focus-color: var(--color-oxidized-blue);--control-focus-shadow: inset 0 0 0 2px var(--control-focus-color);--size-2: 2px;--size-4: 4px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-7: 32px;--space-8: 44px;--space-9: 48px;--space-10: 64px;--font-size-micro: 12px;--font-size-label: 14px;--font-size-body: 16px;--font-size-heading: 20px;--font-display: "Space Grotesk", "Noto Sans JP", "Noto Sans TC", sans-serif;--font-body: "Noto Sans JP", "Noto Sans TC", "Space Grotesk", sans-serif;--font-mono: "Space Grotesk", "Noto Sans JP", "Noto Sans TC", monospace;--transition-fast: .14s ease}:root{font-synthesis:none;text-rendering:optimizeLegibility}*,*:before,*:after{box-sizing:border-box}html{min-width:320px;min-height:100%;overflow-x:clip;background:var(--color-mineral);scrollbar-color:var(--color-strata) var(--color-mineral);scrollbar-width:thin}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--color-mineral)}::-webkit-scrollbar-thumb{border:2px solid var(--color-mineral);border-radius:2px;background-color:var(--color-strata);background-clip:padding-box}::-webkit-scrollbar-thumb:hover{background-color:var(--color-graphite)}body{min-width:320px;min-height:100vh;margin:0;color:var(--color-graphite);background-color:var(--color-mineral);font-family:var(--font-body)}button,input,textarea,select{font:inherit}button,input,textarea,select{color:inherit}button{min-width:0;min-height:var(--touch-target);padding:var(--space-2) var(--space-3);border:var(--border-control) solid var(--color-line-strong);border-radius:var(--radius-sm);background:var(--color-paper);color:var(--color-graphite);cursor:pointer;transition:border-color var(--transition-fast),color var(--transition-fast),background-color var(--transition-fast)}button:active:not(:disabled):not(:focus-visible):not([aria-invalid=true]){border-color:var(--color-algae);background:var(--color-accent-soft);color:var(--color-algae)}button:disabled{border-color:var(--color-line-soft);background:#e7e3d9;color:var(--color-disabled);cursor:not-allowed}:focus-visible{outline:2px solid var(--color-oxidized-blue);outline-offset:2px}:where(button,input:not([type=checkbox]):not([type=range]):not([type=file]),textarea,select,[tabindex]):focus-visible{outline:none;outline-offset:0;border-color:var(--control-focus-color);box-shadow:none}input[type=checkbox]:focus-visible{outline:none;box-shadow:none}input[type=file]:focus-visible{outline:none}input[type=range]:focus-visible{outline:2px solid var(--color-oxidized-blue);outline-offset:-4px}::selection{color:var(--color-paper);background:var(--color-graphite)}.sr-only{position:absolute;width:2px;height:2px;padding:0;margin:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.app-shell{position:relative;isolation:isolate;width:min(calc(100% - 32px),1600px);margin-inline:auto;padding-block:clamp(22px,3vw,48px) 32px}.app-heading{position:relative;display:flex;align-items:end;justify-content:space-between;gap:var(--space-6);min-height:120px;margin-bottom:24px;padding:0 0 18px;border-bottom:var(--border-strong) solid var(--color-line-strong)}.app-heading:after{position:absolute;right:0;bottom:0;width:80px;border-bottom:2px solid var(--color-fossil);content:""}.brand-lockup{min-width:0}.eyebrow{margin:0 0 6px;color:var(--color-fossil);font:500 10px/1.3 var(--font-display);letter-spacing:.13em;text-transform:uppercase}.app-heading h1{margin:0;color:var(--color-graphite);font:600 clamp(38px,5vw,68px)/.96 var(--font-display);letter-spacing:.045em}.brand-subtitle{margin:12px 0 0;color:var(--color-text-muted);font:12px/1.45 var(--font-body);letter-spacing:.02em}.header-side{display:flex;align-items:center;gap:14px;min-width:0;padding-bottom:2px;text-align:right}.header-meta{display:grid;justify-items:end;gap:8px;min-width:0}.specimen-number{padding:var(--space-2) var(--space-3);border-left:var(--border-strong) solid var(--color-fossil);background:var(--color-paper);color:var(--color-graphite);font:500 12px/1.3 var(--font-mono);letter-spacing:.08em}.header-notation{color:var(--color-text-muted);font:10px/1.4 var(--font-mono);letter-spacing:.09em}.workspace{display:grid;grid-template-columns:minmax(224px,.82fr) minmax(304px,1.8fr) minmax(224px,.86fr);grid-template-areas:"controls preview record";gap:18px;align-items:start;background-image:repeating-linear-gradient(0deg,transparent 0,transparent 128px,rgb(83 78 68 / 2.5%) 128px,transparent 130px,transparent 224px)}.control-archive{grid-area:controls;min-width:0;border-top:2px solid var(--color-line-strong)}.archive-heading,.record-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;min-height:72px;padding:12px 0 14px;border-bottom:2px solid var(--color-line)}.archive-heading{justify-content:flex-start}.archive-mark,.record-empty-mark{display:grid;flex:0 0 32px;width:32px;height:32px;place-items:center;border:2px solid var(--color-strata);color:var(--color-algae);font:400 16px/1 var(--font-mono)}.archive-heading .eyebrow,.record-heading .eyebrow{margin-bottom:2px}.archive-heading h2,.record-heading h2{margin:0;color:var(--color-graphite);font:500 16px/1.3 var(--font-body)}.panel-section{min-width:0;padding:16px 0 18px;border-bottom:var(--border-control) solid var(--color-line)}.panel-section h2,.export-section h2{display:flex;align-items:baseline;gap:10px;margin:0 0 14px;color:var(--color-graphite);font:600 12px/1.4 var(--font-display);letter-spacing:.105em}.field-label{display:block;margin-bottom:8px;color:var(--color-text-muted);font:500 12px/1.4 var(--font-display);letter-spacing:.045em;text-transform:uppercase}.panel-section textarea,.panel-section input[type=text],.panel-section input[type=number],.filename-control input{width:100%;min-width:0;min-height:var(--touch-target);padding:var(--space-2) var(--space-3);border:var(--border-control) solid var(--color-line-strong);border-radius:var(--radius-sm);background:var(--color-paper);color:var(--color-graphite)}.panel-section textarea{min-height:84px;resize:vertical;line-height:1.6}.font-file-name{margin:2px 0 6px;color:var(--color-graphite);font:600 12px/1.45 var(--font-display);letter-spacing:.045em;overflow-wrap:anywhere}.font-profile-label{margin:10px 0 0;color:var(--color-fossil);font:500 8px/1.35 var(--font-mono);letter-spacing:.1em}.font-profile-note{max-width:352px;margin:0 0 10px;color:var(--color-text-muted);font:12px/1.5 var(--font-body);overflow-wrap:anywhere}.font-status{display:flex;align-items:center;gap:8px;margin:10px 0 8px;color:var(--color-text-muted);font:600 10px/1.4 var(--font-mono);letter-spacing:.07em;transition:color var(--transition-fast)}.font-status>span:first-child{color:var(--color-strata)}.font-status--ready,.font-status--ready>span:first-child{color:var(--color-algae)}.font-status--error,.font-status--error>span:first-child,.font-error{color:var(--color-signal)}.font-units,.local-note,.quiet-note{color:var(--color-text-muted);font-size:12px;line-height:1.55}.font-units{margin:6px 0 10px;font-family:var(--font-mono)}.local-note{max-width:352px;margin:10px 0 0}.quiet-note{margin:8px 0 2px}.file-picker{position:relative;display:inline-flex;min-width:128px;min-height:var(--touch-target);align-items:center;justify-content:center;padding:10px 14px;border:var(--border-control) solid var(--color-graphite);border-radius:var(--radius-sm);background:var(--color-graphite);color:var(--color-paper);font:600 10px/1.3 var(--font-display);letter-spacing:.09em;cursor:pointer;transition:background-color var(--transition-fast)}.file-picker:focus-within{border-color:var(--color-oxidized-blue)}.file-picker input{position:absolute;width:2px;height:2px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.glyph-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 10px;margin:0 0 10px;color:var(--color-text-muted);font:500 var(--font-size-micro)/1.5 var(--font-mono);letter-spacing:.025em}.glyph-summary strong{margin-right:2px;color:var(--color-fossil);font-size:var(--font-size-micro);font-weight:600}.glyph-summary .has-empty,.glyph-summary .has-empty strong{color:var(--color-oxidized-blue)}.glyph-summary .has-missing,.glyph-summary .has-missing strong{color:var(--color-signal)}.glyph-cell-list{display:flex;flex-wrap:wrap;gap:6px}.glyph-cell-list button{position:relative;display:grid;width:48px;min-height:56px;padding:4px;align-content:center;justify-items:center;grid-template-rows:minmax(24px,1fr) auto;row-gap:4px;border-color:var(--color-line);font-family:var(--font-body);font-size:18px;line-height:1.15}.cell-character{display:grid;min-height:24px;place-items:center;line-height:1.2}.glyph-cell-list button[aria-pressed=true]{border-color:var(--color-algae);border-bottom:4px solid var(--color-fossil);background:var(--color-algae);color:var(--color-paper)}.cell-index{font:var(--font-size-micro)/1 var(--font-mono);letter-spacing:.04em}.orientation-control{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 18px;padding:0;border:0}.orientation-control legend{width:100%;margin:0 0 8px;color:var(--color-text-muted);font:500 10px/1.4 var(--font-display);letter-spacing:.08em;text-transform:uppercase}.orientation-control button{flex:1 1 88px;min-height:var(--touch-target);font:600 10px/1.25 var(--font-display);letter-spacing:.065em;text-transform:uppercase}.orientation-control button[aria-pressed=true]{position:relative;border-color:var(--color-graphite);border-bottom:4px solid var(--color-fossil);background:var(--color-graphite);color:var(--color-paper)}.measurement-field+.measurement-field{margin-top:14px}.range-field{display:flex;justify-content:space-between;gap:6px;margin:0 0 8px;color:var(--color-text-muted);font:500 10px/1.4 var(--font-display);letter-spacing:.045em;text-transform:uppercase}.measurement-input{display:grid;grid-template-columns:minmax(0,1fr) 116px;align-items:center;gap:10px}.measurement-input input[type=range]{width:100%;min-width:0;height:var(--touch-target);margin:0;accent-color:var(--color-algae);cursor:pointer}.number-wrap{display:flex;align-items:center;gap:6px;min-width:0}.panel-section .number-input{min-height:var(--touch-target);padding:var(--space-2);text-align:center;font:12px/1.2 var(--font-mono)}input[type=number]{appearance:textfield;-moz-appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{margin:0;-webkit-appearance:none}.number-wrap>span{color:var(--color-text-muted);font:10px/1 var(--font-mono)}.fill-control{display:grid;grid-template-columns:50px minmax(0,1fr);gap:10px}.fill-control input[type=color]{width:50px;min-height:var(--touch-target);padding:var(--space-1);border:var(--border-control) solid var(--color-line-strong);border-radius:var(--radius-sm);background:var(--color-paper)}.fill-control input[type=text]{font-family:var(--font-mono)}.field-error{margin:6px 0 0;color:var(--color-signal);font:10px/1.45 var(--font-body)}[aria-invalid=true]{border-color:var(--color-signal)}[aria-invalid=true]:focus-visible{box-shadow:var(--control-focus-shadow)}.specimen-record{grid-area:record;min-width:0;border-top:2px solid var(--color-line-strong)}.glyph-inspection{min-width:0;padding:10px 0 14px;border-bottom:2px solid var(--color-line)}.glyph-inspection-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:10px}.glyph-inspection-heading h3{margin:0;color:var(--color-graphite);font:500 10px/1.4 var(--font-display);letter-spacing:.06em;text-transform:uppercase}.glyph-inspection-heading>span{color:var(--color-text-muted);font:8px/1.3 var(--font-mono);letter-spacing:.06em}.glyph-inspection .quiet-note{margin:0}.record-sheet{min-width:0;padding-top:6px}.specimen-identity{padding:10px 0 14px;border-bottom:2px solid var(--color-line)}.record-field-label{color:var(--color-text-muted);font:500 10px/1.4 var(--font-display);letter-spacing:.12em}.specimen-identity-line{display:flex;align-items:end;justify-content:space-between;gap:8px;margin-top:4px}.specimen-character{min-width:0;color:var(--color-graphite);font:500 clamp(36px,4vw,54px)/1.1 var(--font-body);overflow-wrap:anywhere}.specimen-index{padding-bottom:4px;color:var(--color-fossil);font:10px/1 var(--font-mono);letter-spacing:.1em}.record-details{display:grid;min-width:0;margin:0}.record-details>div{display:grid;grid-template-columns:minmax(74px,.72fr) minmax(0,1.28fr);align-items:start;gap:8px;min-width:0;padding:8px 0;border-bottom:2px solid var(--color-line-soft)}.record-details dt{color:var(--color-text-muted);font:500 10px/1.45 var(--font-display);letter-spacing:.055em;text-transform:uppercase}.record-details dd{min-width:0;margin:0;color:var(--color-graphite);font:12px/1.5 var(--font-mono);text-align:right;overflow-wrap:anywhere;word-break:normal}.record-status-row dd{display:inline-flex;justify-content:end;align-items:baseline;gap:6px}.glyph-state{font-weight:600!important;transition:color var(--transition-fast)}.glyph-state--mapped,.glyph-state--mapped span{color:var(--color-algae)!important}.glyph-state--empty,.glyph-state--empty span{color:var(--color-oxidized-blue)!important}.glyph-state--missing,.glyph-state--missing span{color:var(--color-signal)!important}.kana-record{margin-top:16px;padding-top:14px;border-top:2px solid var(--color-line)}.kana-record h3{margin:0 0 8px;color:var(--color-fossil);font:600 10px/1.4 var(--font-display);letter-spacing:.12em;text-transform:uppercase}.record-details--kana>div{padding-block:6px}.record-footnote{margin:10px 0 0;color:var(--color-text-muted);font-size:12px;line-height:1.5}.record-empty{display:grid;justify-items:start;gap:12px;padding:18px 4px}.record-empty .record-empty-mark{width:28px;height:28px;font-size:14px}.record-empty p{max-width:272px;margin:0;color:var(--color-text-muted);font-size:12px;line-height:1.55}.record-empty>span:last-child{color:var(--color-fossil);font:8px/1.3 var(--font-mono);letter-spacing:.07em}.export-section{position:relative;min-width:0;margin-top:12px;padding-top:14px;border-top:0}.filename-control{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;border:var(--border-control) solid var(--color-line-strong);border-radius:var(--control-radius);background:var(--color-paper);overflow:clip}.filename-control input{border:0;border-radius:var(--control-radius) 0 0 var(--control-radius);background:transparent}.filename-control:focus-within:not(:has(input[aria-invalid=true])){border-color:var(--control-focus-color);box-shadow:var(--control-focus-shadow)}.filename-control:has(input[aria-invalid=true]){border-color:var(--color-signal)}.filename-control:has(input:disabled){border-color:var(--color-line-soft);background:#e7e3d9;color:var(--color-disabled)}.filename-control>span{padding:0 10px;border-left:var(--control-border-width) solid var(--control-border-color);border-radius:0 var(--control-radius) var(--control-radius) 0;background:transparent;color:var(--color-text-muted);font:10px var(--font-mono)}.button-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.button-row button{flex:1 1 112px;min-height:var(--touch-target);border-radius:var(--control-radius);font:600 10px/1.3 var(--font-display);letter-spacing:.06em;text-transform:uppercase}.button-row button:last-child:not(:disabled){border-color:var(--color-graphite);background:var(--color-graphite);color:var(--color-paper)}.action-feedback{min-height:1.35em;margin:8px 0 0;color:var(--color-algae);font:10px/1.4 var(--font-mono)}.status-rail{display:flex;flex-wrap:wrap;gap:var(--space-6);align-items:baseline;margin-top:var(--space-6);padding:var(--space-4) 0;border-top:2px solid var(--color-line-strong)}.status-caption{display:flex;align-items:center;gap:var(--space-2);margin:0;color:var(--color-fossil);font:600 10px/1.3 var(--font-mono);letter-spacing:.1em}.registration-dot{color:var(--color-algae);font-size:14px}.status-values{display:flex;flex:1 1 400px;flex-wrap:wrap;gap:var(--space-6);align-items:baseline;min-width:0;margin:0}.status-values>div{display:flex;flex:0 0 auto;flex-wrap:nowrap;align-items:baseline;gap:var(--space-2);white-space:nowrap}.status-values dt{color:var(--color-text-muted);font:500 8px/1.3 var(--font-display);letter-spacing:.07em;text-transform:uppercase}.status-values dd{min-width:0;margin:0;color:var(--color-graphite);font:10px/1.4 var(--font-mono);white-space:nowrap}.copyright-footer{display:flex;align-items:baseline;justify-content:space-between;gap:12px 20px;min-width:0;padding:var(--space-3) 0 var(--space-1);border-top:2px solid var(--color-line-strong);color:var(--color-text-muted)}.copyright-label{color:var(--color-text-muted);font:500 8px/1.4 var(--font-mono);letter-spacing:.075em}.copyright-footer p{margin:0;color:var(--color-text-muted);font:10px/1.45 var(--font-body);letter-spacing:.025em}.app-heading h1{font-size:clamp(38px,5vw,68px)}.brand-subtitle{font-size:var(--font-size-label)}.specimen-number,.header-notation,.font-profile-label,.font-profile-note,.font-status,.font-units,.local-note,.quiet-note,.file-picker,.glyph-summary,.glyph-summary strong,.cell-index,.orientation-control legend,.orientation-control button,.range-field,.panel-section .number-input,.number-wrap>span,.field-error,.glyph-inspection-heading h3,.glyph-inspection-heading>span,.record-field-label,.specimen-index,.record-details dt,.record-details dd,.kana-record h3,.record-footnote,.record-empty p,.record-empty>span:last-child,.filename-control>span,.button-row button,.action-feedback,.status-caption,.status-values dt,.status-values dd,.copyright-footer p{font-size:var(--font-size-micro)}.panel-section h2,.export-section h2,.archive-heading h2,.record-heading h2,.preview-titleblock h2,.zoom-control-set button,.viewer-actions button,.field-label,.viewer-select-label,.bounds-toggle,.viewer-options-label,.zoom-control-set .zoom-input,.backdrop-trigger{font-size:var(--font-size-label)}.panel-section textarea,.panel-section input[type=text],.panel-section input[type=number],.filename-control input{font-size:var(--font-size-body)}.filename-control input{background:transparent}.app-heading .eyebrow,.archive-heading .eyebrow,.record-heading .eyebrow,.copyright-label{font-size:10px}@media(max-width:900px){.app-shell{width:min(calc(100% - 24px),1024px);padding-top:24px}.workspace{grid-template-columns:minmax(0,1fr);grid-template-areas:"preview" "controls" "record";gap:18px}.control-archive,.specimen-record{width:100%}.archive-heading,.record-heading{min-height:64px}.control-archive{border-top:0}.control-archive .archive-heading{border-top:2px solid var(--color-line-strong)}.panel-section{padding-block:16px}.export-section{margin-top:4px}}@media(max-width:520px){.app-shell{width:min(calc(100% - 16px),512px);padding-top:16px}.app-heading{display:grid;grid-template-columns:minmax(0,1fr);align-items:start;gap:8px;min-height:96px;margin-bottom:16px;padding-bottom:12px}.app-heading h1{font-size:clamp(26px,8.1vw,32px)}.brand-subtitle{margin-top:8px;font-size:12px}.header-side{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:none;text-align:left}.header-meta{justify-items:start}.specimen-number{padding:8px;font-size:12px}.header-notation{font-size:12px}.measurement-input{grid-template-columns:minmax(0,1fr) 118px}.record-details>div{grid-template-columns:minmax(82px,.7fr) minmax(0,1.3fr)}.status-rail{margin-top:18px}}@media(max-width:520px){.status-values{flex-basis:100%}.copyright-footer{display:grid;grid-template-columns:minmax(0,1fr);gap:6px}.copyright-footer p{font-size:12px}}@media(max-width:360px){html,body{min-width:0}.app-shell{width:min(calc(100% - 24px),512px)}.app-heading{display:grid;grid-template-columns:minmax(0,1fr);gap:6px}.header-side{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:none;text-align:left}.app-heading h1{font-size:26px;letter-spacing:.025em}.brand-subtitle{max-width:none}.measurement-input{grid-template-columns:minmax(0,1fr) 108px;gap:6px}.panel-section input[type=number]{padding-inline:4px}.number-wrap{gap:4px}.record-details>div{grid-template-columns:minmax(108px,.72fr) minmax(0,1.28fr)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:0ms!important;animation-duration:0ms!important}}@media(hover:hover)and (pointer:fine){button:hover:not(:disabled):not(:active):not(:focus-visible):not([aria-invalid=true]),input:not(.filename-control input):not([type=checkbox]):not([type=range]):not([type=file]):hover:not(:disabled):not(:active):not(:focus-visible):not([aria-invalid=true]),textarea:hover:not(:disabled):not(:active):not(:focus-visible):not([aria-invalid=true]),select:hover:not(:disabled):not(:active):not(:focus-visible):not([aria-invalid=true]),.bounds-toggle:hover:not(:active):not(:has(input:disabled)):not(:has(input:focus-visible)),.file-picker:hover:not(:active):not(:focus-within):not(:has(input:disabled)){background-color:var(--control-hover-bg);color:var(--control-foreground)}.filename-control:hover:not(:focus-within):not(:has(input:disabled)):not(:has(input[aria-invalid=true])){background-color:var(--control-hover-bg)}.measurement-input input[type=range]:hover::-webkit-slider-runnable-track,.measurement-input input[type=range]:hover::-moz-range-track{background-color:var(--control-hover-bg)}}.bounds-toggle input:focus-visible{outline:none}.bounds-toggle:has(input:focus-visible){box-shadow:var(--control-focus-shadow)}button:focus-visible:not([aria-invalid=true]),input:not([type=checkbox]):not([type=range]):not([type=file]):focus-visible:not([aria-invalid=true]),textarea:focus-visible:not([aria-invalid=true]),select:focus-visible:not([aria-invalid=true]){outline:none;outline-offset:0;border-color:var(--control-focus-color);box-shadow:none}@media(forced-colors:active){:where(button,input:not([type=checkbox]):not([type=range]):not([type=file]),textarea,select,[tabindex]):focus-visible{outline:2px solid Highlight;outline-offset:0;box-shadow:none}.file-picker:focus-within{outline:2px solid Highlight;outline-offset:0}input[type=range]:focus-visible{outline-color:Highlight}.bounds-toggle:has(input:focus-visible){outline:2px solid Highlight;outline-offset:-2px;box-shadow:none}}.preview-section{position:relative;grid-area:preview;min-width:0;border:var(--border-strong) solid var(--color-line-strong);background:var(--color-paper)}.preview-toolbar{display:grid;grid-template-areas:"title zoom view backdrop" "options options options options";grid-template-columns:repeat(4,max-content);align-items:start;column-gap:var(--space-6);row-gap:var(--space-4);min-width:0;padding:var(--space-4);border-bottom:var(--border-strong) solid var(--color-line)}.preview-titleblock{grid-area:title;align-self:start;justify-self:start;min-width:0}.preview-titleblock h2,.viewer-group-label{box-sizing:border-box;height:var(--control-label-height);min-height:var(--control-label-height);margin:0;font:500 var(--font-size-micro)/var(--control-label-height) var(--font-display);letter-spacing:.06em;white-space:nowrap}.preview-titleblock h2{color:var(--color-graphite)}.preview-titleblock p{height:var(--control-label-height);margin:var(--control-label-gap) 0 0;color:var(--color-fossil);font:var(--font-size-micro)/var(--control-label-height) var(--font-mono);letter-spacing:.09em}.viewer-group{display:grid;grid-template-rows:var(--control-label-height) var(--control-height);align-content:start;align-self:start;gap:var(--control-label-gap);min-width:0}.viewer-group--zoom{grid-area:zoom;align-self:start}.viewer-group--view{grid-area:view;align-self:start}.viewer-group--backdrop{grid-area:backdrop;align-self:start;justify-self:start}.viewer-group-label{color:var(--color-text-muted)}.zoom-control-set,.viewer-actions{box-sizing:border-box;display:grid;width:max-content;height:var(--control-height);min-height:var(--control-height);overflow:clip;border:var(--control-border-width) solid var(--control-border-color);border-radius:var(--control-radius);background:var(--control-background)}.zoom-control-set{grid-template-columns:var(--space-9) var(--space-10) var(--space-9)}.viewer-actions{grid-template-columns:minmax(0,1fr) var(--control-border-width) minmax(0,1fr);grid-template-rows:minmax(0,1fr)}.viewer-actions:before{z-index:1;grid-row:1;grid-column:2;align-self:stretch;background:var(--color-line-strong);content:"";pointer-events:none}.viewer-actions>button:first-of-type{grid-row:1;grid-column:1}.viewer-actions>button:last-of-type{grid-row:1;grid-column:3}.zoom-control-set button,.viewer-actions button,.zoom-input{box-sizing:border-box;height:var(--control-height);margin-block:calc(0px - var(--control-border-width));min-width:var(--touch-target);min-height:var(--touch-target);padding:0 var(--control-padding-inline);border:0;border-radius:0;background:transparent;color:var(--control-foreground);font:var(--control-font);letter-spacing:.035em;text-transform:uppercase;transition:color var(--transition-fast),background-color var(--transition-fast)}.zoom-control-set>*+*{border:var(--control-border-width) solid var(--color-line-strong)}.viewer-actions>button{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-width:0;margin:0;padding:0 16px;border:0;line-height:1;text-align:center}.zoom-input{width:var(--space-10);min-width:var(--space-10);text-align:center}.zoom-control-set button:active:not(:disabled):not(:focus-visible):not([aria-invalid=true]),.viewer-actions button:active:not(:disabled):not(:focus-visible):not([aria-invalid=true]),.backdrop-trigger:active:not(:disabled):not(:focus-visible):not([aria-invalid=true]){background:var(--color-accent-soft);color:var(--color-algae)}.zoom-control-set button:active:not(:disabled):not(:focus-visible):not([aria-invalid=true]){border-color:var(--color-line-strong)}.zoom-control-set button:disabled,.viewer-actions button:disabled,.zoom-input:disabled,.backdrop-trigger:disabled{background:transparent;color:var(--color-disabled);cursor:not-allowed}.backdrop-trigger:disabled{border-color:var(--color-line-soft)}.zoom-control-set:not(:has(button:not(:disabled))),.viewer-actions:not(:has(button:not(:disabled))){border-color:var(--color-line-soft)}.viewer-actions:not(:has(button:not(:disabled))):before{background:var(--color-line-soft)}.backdrop-control{position:relative;width:160px;min-width:0}.backdrop-trigger{box-sizing:border-box;position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;height:var(--control-height);min-width:0;min-height:var(--control-height);padding:0 var(--control-padding-inline);border:var(--control-border-width) solid var(--control-border-color);border-radius:var(--control-radius);background:var(--control-background);color:var(--control-foreground);font:var(--control-font);cursor:pointer;text-align:left;transition:border-color var(--transition-fast),color var(--transition-fast),background-color var(--transition-fast)}.backdrop-trigger[aria-expanded=true]{border-radius:var(--control-radius) var(--control-radius) 0 0}.backdrop-chevron{position:absolute;right:var(--control-padding-inline);width:var(--space-2);height:var(--space-2);border-right:var(--control-border-width) solid var(--control-border-color);border-bottom:var(--control-border-width) solid var(--control-border-color);pointer-events:none;transform:rotate(45deg);transition:border-color var(--transition-fast),transform var(--transition-fast)}.backdrop-trigger[aria-expanded=true] .backdrop-chevron{transform:rotate(225deg)}.backdrop-trigger:disabled .backdrop-chevron{border-color:var(--color-disabled)}.backdrop-listbox{position:absolute;z-index:10;top:100%;left:0;display:grid;width:100%;overflow:clip;border:var(--control-border-width) solid var(--control-border-color);border-top:0;border-radius:0 0 var(--control-radius) var(--control-radius);background:var(--control-background);color:var(--control-foreground)}.backdrop-listbox[hidden]{display:none}.backdrop-option{display:flex;align-items:center;width:100%;min-width:0;min-height:var(--touch-target);padding:0 var(--control-padding-inline);border:0;border-radius:0;background:var(--control-background);color:var(--control-foreground);font:var(--control-font);cursor:pointer;text-align:left;-webkit-user-select:none;user-select:none}.backdrop-option[aria-selected=true]{background:var(--color-graphite);color:var(--color-paper)}@media(hover:hover)and (pointer:fine){.backdrop-option:not([aria-selected=true]):hover:not(:active):not(:focus-visible){background:var(--control-hover-bg);color:var(--control-foreground)}.backdrop-listbox .backdrop-option[aria-selected=true]:hover:not(:active):not(:focus-visible){background:var(--color-graphite);color:var(--color-paper)}}.viewer-options{grid-area:options;display:grid;grid-template-columns:max-content max-content max-content;grid-template-areas:"legend grid bounds";align-self:start;justify-self:start;align-items:center;column-gap:var(--space-2);min-width:0}.viewer-select-label{box-sizing:border-box;height:var(--control-label-height);align-self:start;color:var(--color-text-muted);font:500 var(--font-size-micro)/var(--control-label-height) var(--font-display);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}.viewer-options-label{grid-area:legend;align-self:center;color:var(--color-text-muted);font:500 var(--font-size-micro)/var(--control-label-height) var(--font-display);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}.bounds-toggle{display:inline-flex;align-items:center;gap:var(--space-2);min-height:var(--touch-target);color:var(--color-text-muted);font-size:var(--font-size-label);cursor:pointer;white-space:nowrap}.bounds-toggle--grid{grid-area:grid;padding:0 10px;border-radius:var(--radius-sm)}.bounds-toggle--bounds{grid-area:bounds;padding:0 10px;border-radius:var(--radius-sm)}.bounds-toggle input{width:var(--space-4);height:var(--space-4);accent-color:var(--color-algae)}.bounds-toggle:has(input:checked){color:var(--color-graphite)}.bounds-toggle:has(input:checked) span{text-decoration:underline;text-decoration-color:var(--color-fossil);text-underline-offset:.2em}.preview-viewer{position:relative;display:block;box-sizing:border-box;min-width:0;height:min(63vh,832px);min-height:368px;overflow:hidden;background-color:var(--color-paper);transition:background-color .18s ease}.preview-viewer--dark{background-color:#74786f}.viewer-rulers{position:absolute;z-index:0;inset:0;overflow:hidden;pointer-events:none;--ruler-major: rgb(83 106 85 / 66%);--ruler-minor: rgb(118 111 99 / 32%)}.preview-viewer--dark .viewer-rulers{--ruler-major: rgb(247 244 236 / 58%);--ruler-minor: rgb(247 244 236 / 28%)}.viewer-ruler{position:absolute;pointer-events:none}.viewer-ruler--top{top:0;left:var(--viewer-canvas-inset);right:var(--viewer-canvas-inset);height:var(--viewer-canvas-inset);background-image:linear-gradient(to right,var(--ruler-major) 0 2px,transparent 2px),linear-gradient(to right,var(--ruler-minor) 0 2px,transparent 2px);background-position:left bottom;background-size:var(--viewer-grid-major-size) var(--space-2),var(--viewer-grid-size) var(--space-1);background-repeat:repeat-x}.viewer-ruler--left{top:var(--viewer-canvas-inset);bottom:var(--viewer-canvas-inset);left:0;width:var(--viewer-canvas-inset);background-image:linear-gradient(to bottom,var(--ruler-major) 0 2px,transparent 2px),linear-gradient(to bottom,var(--ruler-minor) 0 2px,transparent 2px);background-position:right top;background-size:var(--space-2) var(--viewer-grid-major-size),var(--space-1) var(--viewer-grid-size);background-repeat:repeat-y}.viewer-canvas{position:absolute;z-index:1;display:grid;inset:var(--viewer-canvas-inset);min-width:0;min-height:0;place-items:center;overflow:hidden;background-color:var(--color-paper);transition:background-color .18s ease;touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none}.viewer-canvas:active,.preview-viewer.is-dragging .viewer-canvas{cursor:grabbing}.preview-viewer--light .viewer-canvas>p{color:var(--color-graphite)}.preview-viewer--dark .viewer-canvas{background-color:#74786f}.viewer-grid{position:absolute;z-index:0;inset:0;display:block;background-image:linear-gradient(to right,var(--grid-minor) 2px,transparent 2px),linear-gradient(to bottom,var(--grid-minor) 2px,transparent 2px),linear-gradient(to right,var(--grid-major) 2px,transparent 2px),linear-gradient(to bottom,var(--grid-major) 2px,transparent 2px);background-position:0 0;background-size:var(--viewer-grid-size) var(--viewer-grid-size),var(--viewer-grid-size) var(--viewer-grid-size),var(--viewer-grid-major-size) var(--viewer-grid-major-size),var(--viewer-grid-major-size) var(--viewer-grid-major-size);pointer-events:none;opacity:0;transition:opacity var(--transition-fast)}.viewer-grid[data-visible=true]{opacity:1}.preview-viewer--light{--grid-minor: rgb(23 25 26 / 9%);--grid-major: rgb(185 178 165 / 20%)}.preview-viewer--dark{--grid-minor: rgb(238 234 224 / 12%);--grid-major: rgb(185 178 165 / 22%)}.preview-grid-frame{position:absolute;z-index:1;inset:0;box-sizing:border-box;border-inline-end:var(--border-control) solid var(--grid-major);border-block-end:var(--border-control) solid var(--grid-major);opacity:0;pointer-events:none;transition:opacity var(--transition-fast)}.preview-viewer[data-show-grid=true] .preview-grid-frame{opacity:1}.viewer-canvas>p{position:relative;z-index:2;max-width:352px;margin:0;color:#f7f4ec;font:500 var(--font-size-body)/1.5 var(--font-mono);letter-spacing:.09em;text-align:center}.svg-stage{position:absolute;z-index:1;top:50%;left:50%;flex:none;transform-origin:center;overflow:hidden}.canonical-svg{width:100%;height:100%}.canonical-svg svg{display:block;width:100%;height:100%;overflow:hidden}.svg-bounds-overlay{position:absolute;inset:0;box-sizing:border-box;border:2px dashed var(--bounds-color, rgb(83 106 85 / 88%));pointer-events:none}.preview-viewer--dark .svg-bounds-overlay{--bounds-color: rgb(247 244 236 / 88%)}.viewport-meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-2) var(--space-3);padding:var(--space-3) var(--space-4);border-top:var(--border-strong) solid var(--color-line);color:var(--color-text-muted);font:500 var(--font-size-micro)/1.45 var(--font-mono);letter-spacing:.045em}.viewport-meta>span{min-width:0}.viewport-meta strong{color:var(--color-algae);font-weight:600}.viewport-meta i{color:var(--color-fossil);font-style:normal}@media(max-width:900px){.preview-viewer{height:min(62vh,576px);min-height:320px}}@media(max-width:520px){.preview-toolbar{grid-template-areas:"title" "zoom" "view" "backdrop" "options";grid-template-columns:minmax(0,1fr)}.preview-titleblock{grid-area:title}.viewer-group--zoom,.viewer-group--view,.viewer-group--backdrop,.viewer-options{width:100%}.zoom-control-set{width:100%;grid-template-columns:var(--space-9) minmax(var(--space-10),1fr) var(--space-9)}.zoom-input{width:100%;min-width:0}.viewer-actions{width:100%}.viewer-group--backdrop{grid-template-columns:max-content minmax(0,1fr);grid-template-rows:auto;align-items:center;column-gap:var(--space-2)}.backdrop-control{width:100%}.viewer-options{grid-template-columns:max-content max-content;grid-template-areas:"legend legend" "grid bounds";row-gap:var(--space-4);column-gap:var(--space-4)}.viewer-options-label{align-self:end}.preview-viewer{height:min(60svh,544px);min-height:280px}.viewport-meta{justify-content:flex-start;gap:var(--space-1) var(--space-3);padding-inline:var(--space-3)}}@media(min-width:521px)and (max-width:700px){.preview-toolbar{grid-template-areas:"title title" "zoom view" "backdrop backdrop" "options options";grid-template-columns:max-content max-content}.viewer-options{grid-template-columns:max-content max-content max-content}}@media(min-width:901px)and (max-width:1320px){.preview-toolbar{grid-template-areas:"title title" "zoom view" "backdrop backdrop" "options options";grid-template-columns:max-content max-content}}@media(prefers-reduced-motion:reduce){.preview-viewer,.viewer-canvas,.viewer-grid,.preview-grid-frame{transition:none}}.zoom-control-set button:focus-visible,.viewer-actions button:focus-visible,.zoom-input:focus-visible,.viewer-canvas:focus-visible{outline:none;outline-offset:0;box-shadow:var(--control-focus-shadow)}.backdrop-trigger:focus-visible:not([aria-invalid=true]){outline:none;outline-offset:0;border-color:var(--control-focus-color);box-shadow:var(--control-focus-shadow)}.backdrop-listbox .backdrop-option:focus-visible{outline:none;outline-offset:0;box-shadow:var(--control-focus-shadow)}@media(forced-colors:active){.zoom-control-set button:focus-visible,.viewer-actions button:focus-visible,.zoom-input:focus-visible,.viewer-canvas:focus-visible,.backdrop-trigger:focus-visible,.backdrop-option:focus-visible{outline:2px solid Highlight;outline-offset:0;box-shadow:none}}