/* ==== hydrogen/css ==== */
:root{--buncss-light: ;--buncss-dark:initial;color-scheme:dark;--bg:#000;--text:#ededed;--text-muted:#888;--border:#333;--accents-1:#111;--accents-2:#1a1a1a;--accents-3:#222;--accents-4:#444;--accents-5:#666;--font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--font-mono:"SF Mono",Monaco,"Cascadia Code",monospace;--transition:.15s ease;--text-accessible:#a1a1a1;--text-accessible-muted:#8a8a8a;--link-accessible:#6eb5ff;--success-accessible:#50e3c2;--warning-accessible:#f5a623;--error-accessible:#ff6b6b;--primary:#0070f3;--success:#0f0;--warning:#fa0;--danger:red;--surface-hover:var(--accents-2);--hydrogen-card-padding:1.5rem;--hydrogen-status-unknown-bg:#4b5563;--hydrogen-status-unknown-text:#f3f4f6;--hydrogen-status-stale-bg:#78350f;--hydrogen-status-stale-text:#fde68a;--hydrogen-avatar-gradient-start:#8b5cf6;--hydrogen-avatar-gradient-end:#ec4899;--hydrogen-avatar-gradient-text:#fff}@media (prefers-color-scheme:light){:root{--buncss-light:initial;--buncss-dark: ;color-scheme:light;--bg:#fff;--text:#171717;--text-muted:#525252;--border:#d4d4d4;--accents-1:#f5f5f5;--accents-2:#e5e5e5;--accents-3:#d4d4d4;--accents-4:#a3a3a3;--accents-5:#737373;--text-accessible:#404040;--text-accessible-muted:#525252;--link-accessible:#0052a3;--success-accessible:#166534;--warning-accessible:#854d0e;--error-accessible:#b91c1c;--primary:#06c;--success:#16a34a;--warning:#ca8a04;--danger:#dc2626}}[data-theme=dark]{--buncss-light: ;--buncss-dark:initial;color-scheme:dark;--bg:#000;--text:#ededed;--text-muted:#888;--border:#333;--accents-1:#111;--accents-2:#1a1a1a;--accents-3:#222;--accents-4:#444;--accents-5:#666;--text-accessible:#a1a1a1;--text-accessible-muted:#8a8a8a;--link-accessible:#6eb5ff;--success-accessible:#50e3c2;--warning-accessible:#f5a623;--error-accessible:#ff6b6b;--primary:#0070f3;--success:#0f0;--warning:#fa0;--danger:red;--surface-hover:var(--accents-2);--hydrogen-card-bg:var(--accents-1);--hydrogen-card-border:var(--border);--hydrogen-avatar-bg:var(--accents-2);--hydrogen-avatar-text:var(--text)}[data-theme=light]{--buncss-light:initial;--buncss-dark: ;color-scheme:light;--bg:#fff;--text:#171717;--text-muted:#525252;--border:#d4d4d4;--accents-1:#f5f5f5;--accents-2:#e5e5e5;--accents-3:#d4d4d4;--accents-4:#a3a3a3;--accents-5:#737373;--text-accessible:#404040;--text-accessible-muted:#525252;--link-accessible:#0052a3;--success-accessible:#166534;--warning-accessible:#854d0e;--error-accessible:#b91c1c;--primary:#06c;--success:#16a34a;--warning:#ca8a04;--danger:#dc2626;--surface-hover:var(--accents-2);--hydrogen-card-bg:var(--accents-1);--hydrogen-card-border:var(--border);--hydrogen-avatar-bg:var(--accents-2);--hydrogen-avatar-text:var(--text)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;text-size-adjust:100%;font-size:100%}body{font-family:var(--font-sans);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-size:.875rem;line-height:1.5}h1,h2,h3,h4{letter-spacing:-.02em;font-weight:600}a{color:inherit;text-decoration:none;transition:var(--transition)}.container{max-width:1200px;margin:0 auto;padding:0 1rem}.flex{display:flex}.flex-between{display:flex;justify-content:space-between;align-items: center}.grid{display:grid}.stack{display:flex;flex-direction:column;gap:.75rem}input,select,textarea{background:var(--accents-1);border:1px solid var(--border);color:var(--text);transition:var(--transition);border-radius:0;width:100%;padding:.75rem 1rem;font-family:inherit;font-size:.875rem}@media (pointer:coarse){input,select,textarea{min-height:44px;font-size:16px}}input:focus-visible{outline:2px solid var(--primary);outline-offset:1px;border-color:var(--accents-5);background:var(--accents-2)}select:focus-visible{outline:2px solid var(--primary);outline-offset:1px;border-color:var(--accents-5);background:var(--accents-2)}textarea:focus-visible{outline:2px solid var(--primary);outline-offset:1px;border-color:var(--accents-5);background:var(--accents-2)}select{cursor:pointer}textarea{resize:vertical;min-height:4rem}.char-count{color:var(--text-muted);text-align:right;margin-top:.25rem;font-size:12px}.btn{display:inline-flex;cursor:pointer;transition:var(--transition);border:1px solid #0000;border-radius:0;justify-content:center;align-items: center;gap:.5rem;padding:.625rem 1.5rem;font-size:.875rem;font-weight:500}@media (pointer:coarse){.btn{min-height:44px}}.btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.btn-primary{background:var(--text);color:var(--bg)}.btn-primary:hover{opacity:.88}.btn-secondary{border:1px solid var(--border);color:var(--text);background:0 0}.btn-secondary:hover{background:var(--accents-1);border-color:var(--accents-4)}.btn-sm{min-height:2rem;padding:.375rem .75rem;font-size:.75rem}.btn-md{min-height:2.75rem}.btn-lg{min-height:3.25rem;padding:.75rem 1.75rem;font-size:1rem}.btn-ghost{color:var(--text);background:0 0}.btn-ghost:hover{background:var(--surface-hover)}.btn-destructive{background:var(--danger);color:#fff}.btn-destructive:hover{background:var(--danger);filter:brightness(.82)}@supports (color: color-mix(in srgb, red, blue)){.btn-destructive:hover{background:color-mix(in srgb,var(--danger)82%,#000);filter:none}}.btn:disabled,.btn[aria-disabled=true]{cursor:not-allowed;opacity:.5}.btn-spinner{flex:none}.btn-loading .btn-spinner{animation:hydrogen-spin .8s linear infinite}@keyframes hydrogen-spin{to{transform:rotate(360deg)}}.btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.popover-trigger:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.tooltip-trigger:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.alert-dismiss:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.accordion-header:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.switch-track:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.datepicker-trigger:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.datepicker-nav-btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.datepicker-day-btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.collapsible-sidebar__toggle:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.breadcrumbs a:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.tree-view-item:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.form-field{display:grid;gap:.5rem;width:min(100%,24rem)}.input-label,.slider-label,.checkbox-group-legend,.radio-group-legend{color:var(--text-muted);letter-spacing:.08em;text-transform:uppercase;font-size:.75rem;font-weight:600}.required,.error-message{color:var(--error-accessible)}.error-message{font-size:.75rem}.input[aria-invalid=true]{border-color:var(--error-accessible)}.checkbox-wrapper,.radio-wrapper{display:flex;align-items: center;gap:.65rem;min-height:2rem}.checkbox-input,.radio-input{accent-color:var(--primary);flex:none;width:1rem;height:1rem;margin:0;padding:0}.checkbox-label,.radio-label,.switch-label{color:var(--text);cursor:pointer;font-size:.875rem}.checkbox-group,.radio-group{display:grid;border:1px solid var(--border);gap:.25rem;width:min(100%,24rem);padding:1rem}.checkbox-group-legend,.radio-group-legend{padding:0 .35rem}.checkbox-group:disabled,.radio-group:disabled{opacity:.5}.switch-wrapper{display:inline-flex;align-items: center;gap:.75rem}.switch-track{position:relative;border:1px solid var(--border);background:var(--accents-3);cursor:pointer;transition:background var(--transition),border-color var(--transition);border-radius:999px;flex:none;width:2.75rem;height:1.5rem;padding:0}.switch-thumb{position:absolute;background:var(--text);transition:transform var(--transition);border-radius:50%;width:1rem;height:1rem;top:.1875rem;left:.1875rem;box-shadow:0 1px 3px #00000059}.switch-track[aria-checked=true]{border-color:var(--primary);background:var(--primary)}.switch-track[aria-checked=true] .switch-thumb{transform:translate(1.25rem)}.switch-sm .switch-track{width:2.25rem;height:1.25rem}.switch-sm .switch-thumb{width:.75rem;height:.75rem}.switch-sm .switch-track[aria-checked=true] .switch-thumb{transform:translate(1rem)}.switch-lg .switch-track{width:3.25rem;height:1.75rem}.switch-lg .switch-thumb{width:1.25rem;height:1.25rem}.switch-lg .switch-track[aria-checked=true] .switch-thumb{transform:translate(1.5rem)}.switch-track:disabled{cursor:not-allowed;opacity:.5}.slider-wrapper{display:grid;grid-template-columns:minmax(0,1fr)auto;gap:.5rem .75rem;width:min(100%,22rem)}.slider-label{grid-column:1/-1}.slider-container{position:relative;display:grid;align-items: center;min-width:min(12rem,100%)}.slider-input{position:relative;z-index:2;appearance:none;cursor:pointer;opacity:0;background:0 0;border:0;width:100%;height:1.5rem;padding:0}.slider-track{position:absolute;background:var(--accents-3);overflow:hidden;pointer-events:none;border-radius:999px;height:.375rem;left:0;right:0}.slider-fill{border-radius:inherit;background:var(--primary);height:100%}.slider-input:focus-visible+.slider-track{outline:2px solid var(--primary);outline-offset:3px}.slider-ticks{position:absolute;bottom:-.15rem;left:0;right:0}.slider-tick{position:absolute;background:var(--text-muted);width:1px;height:.5rem}.slider-value{display:grid;border:1px solid var(--border);background:var(--accents-1);color:var(--text);font-family:var(--font-mono);place-items: center;min-width:2.75rem;min-height:2rem;font-size:.75rem}.alert{display:flex;border:1px solid var(--border);background:var(--accents-1);color:var(--text);border-left-width:3px;align-items: flex-start;gap:.75rem;width:min(100%,34rem);padding:.875rem 1rem}.alert-info{border-left-color:var(--link-accessible);background:color-mix(in srgb,var(--link-accessible)9%,var(--accents-1))}.alert-success{border-left-color:var(--success-accessible);background:color-mix(in srgb,var(--success-accessible)9%,var(--accents-1))}.alert-warning{border-left-color:var(--warning-accessible);background:color-mix(in srgb,var(--warning-accessible)9%,var(--accents-1))}.alert-error{border-left-color:var(--error-accessible);background:color-mix(in srgb,var(--error-accessible)9%,var(--accents-1))}.alert-icon{display:grid;border:1px solid;border-radius:50%;flex:none;place-items: center;width:1.75rem;height:1.75rem}.alert-info .alert-icon{color:var(--link-accessible)}.alert-success .alert-icon{color:var(--success-accessible)}.alert-warning .alert-icon{color:var(--warning-accessible)}.alert-error .alert-icon{color:var(--error-accessible)}.alert-content{display:grid;flex:1;gap:.15rem}.alert-title{color:var(--text);font-size:.875rem}.alert-message{color:var(--text-muted);line-height:1.5}.alert-dismiss{color:var(--text-muted);cursor:pointer;background:0 0;border:0;flex:none;width:1.75rem;height:1.75rem;font-size:1.25rem}.alert-dismiss:hover{color:var(--text)}.popover-wrapper,.tooltip-wrapper{position:relative;display:inline-flex}.popover-trigger{border:1px solid var(--border);background:var(--accents-1);color:var(--text);cursor:pointer;min-height:2.75rem;padding:.625rem 1rem}.tooltip-trigger{display:inline-flex;border-bottom:1px dashed var(--text-muted);color:var(--text);cursor:help;padding:.15rem 0}.popover,.tooltip{position:fixed;top:var(--hydrogen-anchor-y,0);left:var(--hydrogen-anchor-x,0);z-index:100;border:1px solid var(--border);background:var(--accents-1);color:var(--text);width:max-content;max-width:min(20rem,80vw);box-shadow:0 .75rem 2rem #00000059}.popover{min-width:min(12rem,100dvw - 1rem);padding:.75rem}.tooltip{padding:.4rem .6rem;font-size:.75rem}.popover[hidden],.tooltip[hidden]{display:none}.popover:not([data-side]),.tooltip:not([data-side]){position:absolute}.popover-top:not([data-side]),.tooltip-top:not([data-side]){top:auto;bottom:calc(100% + .65rem);left:50%;transform:translate(-50%)}.popover-bottom:not([data-side]),.tooltip-bottom:not([data-side]){top:calc(100% + .65rem);left:50%;transform:translate(-50%)}.popover-left:not([data-side]),.tooltip-left:not([data-side]){top:50%;left:auto;right:calc(100% + .65rem);transform:translateY(-50%)}.popover-right:not([data-side]),.tooltip-right:not([data-side]){top:50%;left:calc(100% + .65rem);transform:translateY(-50%)}.popover-content{line-height:1.5}.popover-arrow{position:absolute;border:1px solid var(--border);background:var(--accents-1);width:.6rem;height:.6rem;transform:rotate(45deg)}.popover-bottom:not([data-side]) .popover-arrow,.popover[data-side=bottom] .popover-arrow{border-bottom:0;border-right:0;top:-.35rem;bottom:auto;left:calc(50% - .3rem)}.popover[data-side=top] .popover-arrow{border-top:0;border-left:0;top:auto;bottom:-.35rem;left:calc(50% - .3rem)}.popover[data-side=right] .popover-arrow{border-top:0;border-right:0;top:calc(50% - .3rem);left:-.35rem}.popover[data-side=left] .popover-arrow{border-bottom:0;border-left:0;top:calc(50% - .3rem);left:auto;right:-.35rem}.card{background:var(--hydrogen-card-bg,var(--accents-1));border:1px solid var(--hydrogen-card-border,var(--border));padding:var(--hydrogen-card-padding,1.5rem)}.card-elevated{border-color:#0000;box-shadow:0 .75rem 2rem #0003}.card-outlined{background:0 0}.card-padding-none{padding:0}.card-padding-sm{padding:1rem}.card-padding-md{padding:1.5rem}.card-padding-lg{padding:2rem}.card-header{color:var(--text);margin-bottom:.75rem;font-weight:600}.card-content{color:var(--text)}.card-footer{border-top:1px solid var(--border);color:var(--text-muted);margin-top:1rem;padding-top:.75rem}.avatar{position:relative;display:inline-flex;background:var(--hydrogen-avatar-bg,var(--accents-2));color:var(--hydrogen-avatar-text,var(--text));user-select:none;border-radius:50%;flex:none;justify-content:center;align-items: center;font-weight:600;line-height:1}.avatar-xs{width:1.5rem;height:1.5rem;font-size:.625rem}.avatar-sm{width:2rem;height:2rem;font-size:.75rem}.avatar-md{width:2.5rem;height:2.5rem;font-size:.875rem}.avatar-lg{width:3rem;height:3rem;font-size:1rem}.avatar-xl{width:4rem;height:4rem;font-size:1.25rem}.avatar-gradient{background:linear-gradient(135deg,var(--hydrogen-avatar-gradient-start,#8b5cf6),var(--hydrogen-avatar-gradient-end,#ec4899));color:var(--hydrogen-avatar-gradient-text,#fff);box-shadow:0 .625rem 1.5rem #0f172a33}.avatar-image,.avatar-initials{border-radius:inherit;width:100%;height:100%}.avatar-image{display:block;object-fit:cover}.avatar-initials{display:grid;place-items: center}.avatar-status{position:absolute;aspect-ratio:1;border:2px solid var(--bg);background:var(--text-muted);border-radius:50%;width:25%;min-width:.5rem;max-width:.75rem;bottom:0;right:0}.avatar-status-online{background:var(--success-accessible)}.avatar-status-offline{background:var(--text-muted)}.avatar-status-away{background:var(--warning-accessible)}.avatar-status-busy{background:var(--error-accessible)}.avatar-group{display:inline-flex;align-items: center;padding-left:.5rem}.avatar-group>.avatar{border:2px solid var(--bg);margin-left:-.5rem}.avatar-overflow{background:var(--accents-3);color:var(--text)}.accordion{display:grid;border:1px solid var(--border);background:var(--accents-1);width:min(100%,34rem)}.accordion-item+.accordion-item{border-top:1px solid var(--border)}.accordion-header{display:flex;color:var(--text);cursor:pointer;text-align:left;background:0 0;border:0;justify-content:space-between;align-items: center;gap:1rem;width:100%;min-height:3.25rem;padding:.85rem 1rem}.accordion-header:hover{background:var(--surface-hover)}.accordion-title{font-weight:600}.accordion-icon{display:grid;color:var(--text-muted);flex:none;place-items: center;width:1.5rem;height:1.5rem}.accordion-panel{border-top:1px solid var(--border);color:var(--text-muted)}.accordion-panel[hidden]{display:none}.accordion-content{padding:.9rem 1rem 1.1rem;line-height:1.6}.datepicker{position:relative}.datepicker-input-wrapper{display:flex}.datepicker-input-wrapper .datepicker-input{border-right:0;min-width:0}.datepicker-trigger,.datepicker-nav-btn,.datepicker-day-btn{display:inline-grid;border:1px solid var(--border);background:var(--accents-1);color:var(--text);cursor:pointer;place-items: center}.datepicker-trigger{flex:none;width:2.75rem}.datepicker-calendar{position:absolute;z-index:80;border:1px solid var(--border);background:var(--accents-1);color:var(--text);width:min(19rem,100% - 2rem);padding:.75rem;top:calc(100% + .5rem);left:0;box-shadow:0 .75rem 2rem #00000059}.datepicker-calendar[hidden]{display:none}.datepicker-header{display:grid;grid-template-columns:2rem 2rem 1fr 2rem 2rem;align-items: center;gap:.25rem;margin-bottom:.75rem}.datepicker-header-label{color:var(--text);text-align:center;font-weight:600}.datepicker-nav-btn{width:2rem;height:2rem;padding:0}.datepicker-nav-btn:hover,.datepicker-day-btn:hover:not(:disabled){border-color:var(--accents-5);background:var(--surface-hover)}.datepicker-weekdays,.datepicker-days{display:grid;grid-template-columns:repeat(7,1fr);gap:.2rem}.datepicker-weekday{color:var(--text-muted);text-align:center;text-transform:uppercase;padding:.25rem 0;font-size:.65rem;font-weight:600}.datepicker-day{aspect-ratio:1}.datepicker-day-btn{background:0 0;border-color:#0000;width:100%;height:100%;min-height:2rem;padding:0;font-size:.75rem}.datepicker-day-btn.today{border-color:var(--primary)}.datepicker-day-btn.selected{border-color:var(--primary);background:var(--primary);color:#fff}.datepicker-day-btn.disabled,.datepicker-day-btn:disabled{cursor:not-allowed;opacity:.35}.tree-view,.tree-view-group{list-style:none;margin:0;padding:0}.tree-view{border:1px solid var(--border);background:var(--accents-1);width:min(100%,24rem);padding:.5rem}.tree-view-group[hidden]{display:none}.tree-view-item{color:var(--text);outline:none}.tree-view-content{display:flex;cursor:pointer;align-items: center;gap:.35rem;min-height:2rem;padding-right:.5rem}.tree-view-content:hover,.tree-view-item.selected>.tree-view-content{background:var(--surface-hover)}.tree-view-item.selected>.tree-view-content{box-shadow:inset 2px 0 var(--primary)}.tree-view-toggle,.tree-view-spacer{display:grid;color:var(--text-muted);flex:none;place-items: center;width:1.25rem;font-size:.65rem}.tree-view-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.breadcrumbs{color:var(--text-muted);font-size:.8125rem}.breadcrumbs ol{display:flex;list-style:none;flex-wrap:wrap;align-items: center;gap:.5rem;margin:0;padding:0}.breadcrumbs li{display:inline-flex;align-items: center;gap:.5rem}.breadcrumbs a{color:var(--link-accessible)}.breadcrumbs a:hover{color:var(--text)}.breadcrumbs [aria-current=page]{color:var(--text);font-weight:600}.breadcrumbs .separator{color:var(--accents-5)}.split-pane{display:flex;box-sizing:border-box;width:100%;min-width:0;height:100%;min-height:0}.split-pane--horizontal{flex-direction:row}.split-pane--vertical{flex-direction:column}.split-pane__pane{overflow:auto;box-sizing:border-box;min-width:0;min-height:0}.split-pane--horizontal>.split-pane__pane--left,.split-pane--vertical>.split-pane__pane--top{flex:0 0 calc(var(--split-ratio,.5)*100%)}.split-pane--horizontal>.split-pane__pane--left{min-width:var(--split-min-size,0px)}.split-pane--vertical>.split-pane__pane--top{min-height:var(--split-min-size,0px)}.split-pane--horizontal>.split-pane__pane--right,.split-pane--vertical>.split-pane__pane--bottom{flex:1 1 0}.split-pane__divider{touch-action:none;cursor:col-resize;display:flex;background:var(--border);user-select:none;flex:0 0 8px;justify-content:center;align-items: center}.split-pane--vertical>.split-pane__divider{cursor:row-resize}.split-pane__divider-handle{background:var(--accents-4);border-radius:1px;width:2px;height:24px}.split-pane--vertical>.split-pane__divider .split-pane__divider-handle{width:24px;height:2px}.split-pane--dragging{cursor:col-resize;user-select:none}.split-pane--vertical.split-pane--dragging{cursor:row-resize}.collapsible-sidebar{position:relative;display:flex;box-sizing:border-box;flex-direction:column;width:100%;min-width:0;height:100%;min-height:0}.collapsible-sidebar__pane{position:relative;height:100%;min-height:0}.collapsible-sidebar .split-pane{flex:auto}.collapsible-sidebar--collapsed .collapsible-sidebar__sidebar-content{overflow:hidden}.collapsible-sidebar__sidebar-wrapper{position:relative;overflow:auto;height:100%;min-height:0}.collapsible-sidebar__sidebar-content{min-height:100%;padding:1rem}.collapsible-sidebar__toggle{position:absolute;display:grid;border:1px solid var(--border);background:var(--accents-1);color:var(--text-muted);cursor:pointer;place-items: center;width:2rem;height:2rem;padding:0;top:.5rem;right:.5rem}.collapsible-sidebar__toggle:hover{border-color:var(--accents-5);color:var(--text)}.collapsible-sidebar--right .collapsible-sidebar__toggle{left:.5rem;right:auto}.collapsible-sidebar__toggle-icon{font-size:.65rem}.docs-page{display:flex;background:var(--bg);color:var(--text);flex-direction:column;width:100%;min-height:100%}.docs-header{border-bottom:1px solid var(--border);background:var(--bg);min-height:4rem}.docs-header-inner{display:flex;align-items: center;gap:1.5rem;width:100%;min-height:4rem;padding:0 1.5rem}.docs-logo-text{color:var(--text);font-size:1.125rem;font-weight:700}.docs-header-nav{display:flex;align-items: center;gap:1rem;margin-left:auto}.docs-header-nav a,.docs-nav-link,.docs-toc-item a{color:var(--text-muted)}.docs-header-nav a:hover,.docs-header-nav a.active,.docs-nav-link:hover,.docs-nav-link.active,.docs-toc-item a:hover,.docs-toc-item a.active{color:var(--text)}.docs-header-search,.docs-sidebar-search{display:flex;border:1px solid var(--border);background:var(--accents-1);padding:.5rem .75rem}.docs-search-input{outline:0;color:var(--text);background:0 0;border:0;width:100%}.docs-search-key{color:var(--text-muted);font-size:.75rem}.docs-layout{display:grid;grid-template-columns:minmax(12rem,16rem)minmax(0,1fr)minmax(10rem,13rem);flex:auto;width:100%;min-height:0}.docs-layout.no-sidebar{grid-template-columns:minmax(0,1fr)minmax(10rem,13rem)}.docs-layout.no-aside{grid-template-columns:minmax(12rem,16rem)minmax(0,1fr)}.docs-layout.no-sidebar.no-aside{grid-template-columns:minmax(0,1fr)}.docs-sidebar,.docs-aside{border-color:var(--border);min-width:0;padding:1.5rem}.docs-sidebar{border-right:1px solid var(--border)}.docs-aside{border-left:1px solid var(--border)}.docs-main{min-width:0;padding:2rem}.docs-sidebar-wrapper,.docs-sidebar-nav,.docs-nav-section,.docs-toc{display:grid;align-content: start;gap:1rem}.docs-nav-title,.docs-toc-title{color:var(--text);letter-spacing:.08em;text-transform:uppercase;font-size:.6875rem}.docs-nav-list,.docs-toc-list{display:grid;list-style:none;gap:.25rem;margin:0;padding:0}.docs-nav-link,.docs-toc-item a{display:block;padding:.35rem 0}.docs-toc-item.level-3{padding-left:.75rem}@media (max-width:48rem){.docs-layout,.docs-layout.no-sidebar,.docs-layout.no-aside{grid-template-columns:minmax(0,1fr)}.docs-sidebar,.docs-aside,.docs-header-search{display:none}}.badge{display:inline-block;text-transform:uppercase;letter-spacing:.05em;border:1px solid var(--border);padding:.25rem .5rem;font-size:11px;font-weight:500}.badge.success{color:var(--success-accessible);border-color:var(--success-accessible)}.badge.warning{color:var(--warning-accessible);border-color:var(--warning-accessible)}.badge.error{color:var(--error-accessible);border-color:var(--error-accessible)}.badge.success:before,.badge.warning:before,.badge.error:before{margin-right:.3em;font-weight:700}.badge.success:before{content:"✓"}.badge.warning:before{content:"⚠"}.badge.error:before{content:"✕"}.modal-backdrop{position:fixed;z-index:1000;display:none;background:#000000d1;place-items: center;padding:1rem;inset:0}.modal-backdrop.open{display:grid}.modal{display:grid;border:1px solid var(--border);background:var(--accents-1);color:var(--text);gap:1rem;width:min(100%,32rem);padding:2rem;box-shadow:0 1.5rem 4rem #00000073}.modal h3{color:var(--text);font-size:1.25rem}.modal p{color:var(--text-muted);line-height:1.6}.modal .btn{justify-self:start}.modal-overlay{position:fixed;display:none;z-index:1000;background:#000c;justify-content:center;align-items: center;inset:0}.modal-overlay.open{display:flex}.modal-content{background:var(--accents-1);border:1px solid var(--border);width:90%;max-width:480px;padding:2rem}.toast-container{position:fixed;bottom:max(1rem,env(safe-area-inset-bottom,0px));right:max(1rem,env(safe-area-inset-right,0px));z-index:1001;display:flex;flex-direction:column;gap:.5rem}.toast{background:var(--accents-2);border:1px solid var(--border);border-left:3px solid var(--border);color:var(--text);animation:slideIn .2s ease;max-width:min(28rem,100% - 2rem);padding:.75rem 1rem;transition:opacity .3s,transform .3s;box-shadow:0 .75rem 2rem #00000059}.toast-success{border-left-color:var(--success)}.toast-error{border-left-color:var(--danger)}.toast-warning{border-left-color:var(--warning)}.toast-info{border-left-color:var(--primary)}@keyframes slideIn{0%{transform:translate(100%);opacity:0}}.h-table-container{border:1px solid var(--border);background:var(--accents-1);overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;width:min(100%,48rem)}.h-table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;max-width:100%}.table-filter{border-bottom:1px solid var(--border);padding:.75rem}.table-filter-input{max-width:20rem}.h-table{border-collapse:collapse;width:100%;font-size:.875rem}.h-table thead{border-bottom:1px solid var(--border)}.h-table th{text-align:left;color:var(--text);padding:.75rem 1rem;font-weight:600}.h-table th[data-sortable]{cursor:pointer;user-select:none}.h-table th[data-sortable]:hover{background:var(--accents-1)}.h-table th[data-sort=asc]:after{content:" ↑"}.h-table th[data-sort=desc]:after{content:" ↓"}.h-table td{border-bottom:1px solid var(--border);color:var(--text);padding:.75rem 1rem}.h-table tbody tr:hover{background:var(--accents-1)}.table-no-results td{color:var(--text-muted);text-align:center;padding:2rem 1rem}@media (pointer:coarse){.h-table td a,.h-table th a{display:inline-flex;align-items: center;min-width:44px;min-height:44px}}.task-list{display:grid;list-style:none;gap:.5rem;margin:1rem 0;padding:0}.task-item{display:flex;color:var(--text);align-items: flex-start;gap:.6rem}.task-item input[type=checkbox]{accent-color:var(--primary);flex:none;width:1rem;height:1rem;margin:.15rem 0 0}.task-done{color:var(--text-muted)}.wikilink{color:var(--link-accessible);text-decoration:underline;text-underline-offset:.2em}.wikilink:hover{color:var(--text)}.flex-center{display:flex;justify-content:center;align-items: center}.text-muted{color:var(--text-muted)}.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.status-indicator{display:inline-flex;color:var(--text);align-items: center;gap:.5rem}.status-dot{box-shadow:0 0 0 3px color-mix(in srgb,currentcolor 12%,transparent);flex:none}.progress-metric{display:grid;gap:.5rem;width:min(100%,28rem)}.usage-row{display:flex;color:var(--text);justify-content:space-between;align-items: center;gap:1rem;font-size:.8125rem}.progress-bar{background:var(--surface-hover);width:100%}.progress-fill{min-width:0}.pan-zoom,.force-graph{position:relative;border:1px solid var(--border);background:var(--accents-1);overflow:hidden;width:100%;min-width:0;max-width:100%}.pan-zoom{cursor:grab;min-height:16rem}.pan-zoom:active{cursor:grabbing}.pan-zoom:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.pan-zoom__content{will-change:transform;min-width:max-content}.force-graph-svg{max-width:100%}.error-boundary{display:grid;border:1px solid var(--border);background:var(--accents-1);color:var(--text);text-align:center;place-items: center;width:min(100%,28rem);min-height:15rem;padding:2rem}.error-boundary-content{display:grid;justify-items:center;gap:.5rem}.error-boundary-icon{display:grid;background:color-mix(in srgb,var(--error-accessible)14%,transparent);color:var(--error-accessible);border-radius:50%;place-items: center;width:2.5rem;height:2.5rem}.error-boundary-title{color:var(--text);font-size:1rem}.error-boundary-message{color:var(--text-muted)}.error-boundary-actions{margin-top:.5rem}.error-boundary-reload{min-width:7rem}.h-error-page{display:flex;width:100%;min-width:0;min-height:60vh;text-align:center;flex-direction:column;justify-content:center;align-items: center;min-height:60dvh;padding:2rem}.h-error-code{color:var(--accents-3);max-width:100%;font-size:clamp(3rem,20vw,8rem);font-weight:800;line-height:1}.h-error-title{color:var(--text);margin:1rem 0 .5rem;font-size:2rem}.h-error-message{color:var(--text-muted);max-width:400px;margin-bottom:2rem}.h-error-back{min-width:10rem}.sr-only{position:absolute;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0}.scrollbar-styled{scrollbar-width:thin;scrollbar-color:var(--accents-3)var(--bg)}.scrollbar-styled::-webkit-scrollbar{width:8px;height:8px}.scrollbar-styled::-webkit-scrollbar-track{background:var(--bg)}.scrollbar-styled::-webkit-scrollbar-thumb{background:var(--accents-3)}.scrollbar-styled::-webkit-scrollbar-thumb:hover{background:var(--accents-4)}.scrollbar-thin{scrollbar-width:thin;scrollbar-color:var(--accents-2)var(--bg)}.scrollbar-thin::-webkit-scrollbar{width:6px;height:6px}.scrollbar-thin::-webkit-scrollbar-track{background:var(--bg)}.scrollbar-thin::-webkit-scrollbar-thumb{background:var(--accents-2)}.scrollbar-thin::-webkit-scrollbar-thumb:hover{background:var(--accents-3)}.scrollbar-hidden{scrollbar-width:none}.scrollbar-hidden::-webkit-scrollbar{display:none}[data-table-layout=cards] .h-table,[data-table-layout=cards] .h-table tbody,[data-table-layout=cards] .h-table tr,[data-table-layout=cards] .h-table td{display:block;width:100%}[data-table-layout=cards] .h-table thead{position:absolute;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;width:1px;height:1px}[data-table-layout=cards] .h-table tr{border:1px solid var(--border);border-radius:var(--hydrogen-radius,0);background:var(--accents-1);margin-bottom:.75rem}[data-table-layout=cards] .h-table td{display:grid;grid-template-columns:minmax(6rem,40%)1fr;border:0;border-bottom:1px solid var(--border);align-items:baseline;gap:.75rem;padding:.5rem .75rem}[data-table-layout=cards] .h-table tr td:last-child{border-bottom:0}[data-table-layout=cards] .h-table td:before{content:attr(data-label);color:var(--text-muted);font-weight:500}[data-table-layout=cards] .h-table .table-no-results{background:0 0;border:0}.collapsible-sidebar[data-sidebar-mode=rail].collapsible-sidebar--left .split-pane__pane--left,.collapsible-sidebar[data-sidebar-mode=rail].collapsible-sidebar--right .split-pane__pane--right{flex:0 0 var(--hydrogen-sidebar-rail,4.25rem);min-width:var(--hydrogen-sidebar-rail,4.25rem);overflow:hidden}.collapsible-sidebar[data-sidebar-mode=rail].collapsible-sidebar--collapsed.collapsible-sidebar--left .split-pane__pane--left,.collapsible-sidebar[data-sidebar-mode=rail].collapsible-sidebar--collapsed.collapsible-sidebar--right .split-pane__pane--right{flex:0 0 0;min-width:0}.collapsible-sidebar[data-sidebar-mode=rail] .split-pane__divider,.collapsible-sidebar[data-sidebar-mode=drawer] .split-pane__divider{display:none}.collapsible-sidebar--left[data-sidebar-mode=drawer] .split-pane__pane--left,.collapsible-sidebar--right[data-sidebar-mode=drawer] .split-pane__pane--right{overflow:visible}.collapsible-sidebar__rail{display:none}.collapsible-sidebar[data-sidebar-mode=rail][data-rail-content=true] .collapsible-sidebar__rail{display:block;overflow:hidden auto;height:100%}.collapsible-sidebar[data-sidebar-mode=rail][data-rail-content=true] .collapsible-sidebar__sidebar-wrapper{display:none}.collapsible-sidebar[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper{position:absolute;z-index:40;top:0;bottom:0;background:var(--bg);border-inline-end:1px solid var(--border);transition:transform var(--transition,.15s ease);width:min(20rem,85vw);transform:translate(-101%)}.collapsible-sidebar[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}.collapsible-sidebar[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper:not(:-moz-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}.collapsible-sidebar[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:0}.collapsible-sidebar[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}.collapsible-sidebar[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper:-moz-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}.collapsible-sidebar[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}.collapsible-sidebar--right[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper{border-inline-end:0;border-inline-start:1px solid var(--border);transform:translate(101%)}.collapsible-sidebar--right[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:auto;right:0}.collapsible-sidebar--right[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper:not(:-moz-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:auto;right:0}.collapsible-sidebar--right[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:auto;right:0}.collapsible-sidebar--right[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){left:0;right:auto}.collapsible-sidebar--right[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper:-moz-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){left:0;right:auto}.collapsible-sidebar--right[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){left:0;right:auto}.collapsible-sidebar[data-sidebar-mode=drawer][data-drawer-open=true] .collapsible-sidebar__sidebar-wrapper{transform:translate(0)}.collapsible-sidebar[data-sidebar-mode=drawer] .collapsible-sidebar__toggle{z-index:50}.collapsible-sidebar--left[data-sidebar-mode=drawer] .collapsible-sidebar__toggle{left:.5rem;right:auto}.collapsible-sidebar--left[data-sidebar-mode=drawer][data-drawer-open=true] .collapsible-sidebar__toggle{left:calc(min(20rem,85vw) - 2.5rem)}.collapsible-sidebar--right[data-sidebar-mode=drawer] .collapsible-sidebar__toggle{left:auto;right:.5rem}.collapsible-sidebar--right[data-sidebar-mode=drawer][data-drawer-open=true] .collapsible-sidebar__toggle{right:calc(min(20rem,85vw) - 2.5rem)}.collapsible-sidebar__scrim{display:none}.collapsible-sidebar[data-sidebar-mode=drawer][data-drawer-open=true] .collapsible-sidebar__scrim{position:absolute;z-index:30;display:block;background:#00000080;inset:0}@media (prefers-reduced-motion:reduce){.collapsible-sidebar[data-sidebar-mode=drawer] .collapsible-sidebar__sidebar-wrapper{transition:none}}@media (min-width:640px){.container{padding:0 1.5rem}.hide-sm{display:none!important}.show-sm{display:block!important}}@media (min-width:768px){.container{padding:0 2rem}.hide-md{display:none!important}.show-md{display:block!important}.grid-cols-md-2{grid-template-columns:repeat(2,1fr)}.grid-cols-md-3{grid-template-columns:repeat(3,1fr)}}@media (min-width:1024px){.hide-lg{display:none!important}.show-lg{display:block!important}.grid-cols-lg-3{grid-template-columns:repeat(3,1fr)}.grid-cols-lg-4{grid-template-columns:repeat(4,1fr)}}@media (min-width:1280px){.container{max-width:1280px}.hide-xl{display:none!important}.show-xl{display:block!important}.grid-cols-xl-4{grid-template-columns:repeat(4,1fr)}.grid-cols-xl-5{grid-template-columns:repeat(5,1fr)}}@media (min-width:1536px){.container{max-width:1400px}.hide-2xl{display:none!important}.show-2xl{display:block!important}.grid-cols-2xl-5{grid-template-columns:repeat(5,1fr)}.grid-cols-2xl-6{grid-template-columns:repeat(6,1fr)}}@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}@media (forced-colors:active){.btn,.card,.badge,.toast,.modal-content,input,select,textarea{border:1px solid}.btn:focus-visible{outline:2px solid highlight;outline-offset:2px}a:focus-visible{outline:2px solid highlight;outline-offset:2px}input:focus-visible{outline:2px solid highlight;outline-offset:2px}select:focus-visible{outline:2px solid highlight;outline-offset:2px}textarea:focus-visible{outline:2px solid highlight;outline-offset:2px}[tabindex]:focus-visible{outline:2px solid highlight;outline-offset:2px}.toast-success,.toast-error,.toast-warning,.toast-info{border-left-style:solid;border-left-width:3px}}.pan-zoom{touch-action:none;overflow:hidden}.pan-zoom__content{transform-origin:0 0}.force-graph-svg{touch-action:none}:root{--h-radius-sm:4px;--h-radius:6px;--h-ring:var(--primary);--h-control-sm:28px;--h-control-md:34px;--h-control-lg:40px;--h-shadow-lg:0 16px 48px #00000070,0 4px 12px #00000047;--h-ease:cubic-bezier(.16,1,.3,1);--h-duration:.16s;--h-accent-primary:var(--primary);--h-accent-info:var(--link-accessible);--h-accent-success:var(--success-accessible);--h-accent-warning:var(--warning-accessible);--h-accent-danger:var(--error-accessible);--h-scrim:#0000008c}@media (prefers-color-scheme:light){:root{--h-shadow-lg:0 16px 48px #00000024,0 4px 12px #00000014;--h-scrim:#0000005c}}.h-input-container:focus-within{outline:2px solid var(--h-ring);outline-offset:2px}.h-badge:focus-visible{outline:2px solid var(--h-ring);outline-offset:2px}.h-tag-body:focus-visible{outline:2px solid var(--h-ring);outline-offset:2px}.h-tag-remove:focus-visible{outline:2px solid var(--h-ring);outline-offset:2px}.h-counter-button:focus-visible{outline:2px solid var(--h-ring);outline-offset:2px}.pagination-button:focus-visible{outline:2px solid var(--h-ring);outline-offset:2px}.stepper-step__button:focus-visible{outline:2px solid var(--h-ring);outline-offset:2px}.list-item__button:focus-visible{outline:2px solid var(--h-ring);outline-offset:2px}.command-palette__input:focus-visible{outline:2px solid var(--h-ring);outline-offset:2px}.command-palette__item:focus-visible{outline:2px solid var(--h-ring);outline-offset:2px}.h-input-clear:focus-visible{outline:2px solid var(--h-ring);outline-offset:2px}@media (prefers-reduced-motion:reduce){.command-palette-overlay,.command-palette__content,.skeleton,.skeleton-line{animation:none!important;transition:none!important}}.h-input-wrapper{display:flex;flex-direction:column;gap:.375rem;width:100%}.h-input-label{color:var(--text);font-size:13px;font-weight:500;line-height:1.4}.h-input-container{display:flex;position:relative;align-items: center;width:100%}.h-input{background:var(--accents-1);border:1px solid var(--border);border-radius:var(--h-radius);color:var(--text);transition:border-color var(--h-duration)var(--h-ease),background-color var(--h-duration)var(--h-ease)}.h-input:hover:not(.h-input--disabled){border-color:var(--accents-4)}.h-input--sm{min-height:var(--h-control-sm);font-size:13px}.h-input--md{min-height:var(--h-control-md);font-size:14px}.h-input--lg{min-height:var(--h-control-lg);font-size:15px}.h-input--error,.h-input--error:hover{border-color:var(--danger)}.h-input--error:focus-within{--h-ring:var(--danger)}.h-input--disabled{opacity:.5;cursor:not-allowed}.h-input--readonly{background:var(--accents-2)}.h-input-element{color:inherit;font-size:inherit;outline:none;background:0 0;border:none;flex:1;align-self:stretch;min-width:0;padding:0 .75rem;font-family:inherit}.h-input-element::placeholder{color:var(--text-muted)}.h-input-element:disabled{cursor:not-allowed}.h-input--icon .h-input-element{padding-left:2rem}.h-input-icon{position:absolute;display:flex;color:var(--text-muted);pointer-events:none;align-items: center;font-size:.9em;line-height:1;left:.6875rem}.h-input-clear{display:inline-flex;color:var(--text-muted);cursor:pointer;border-radius:var(--h-radius-sm);transition:color var(--h-duration)var(--h-ease),background-color var(--h-duration)var(--h-ease);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items: center;width:20px;height:20px;margin-right:.4375rem;padding:0;font-size:11px;line-height:1}.h-input-clear:hover{color:var(--text);background:var(--accents-3)}.h-input-error{color:var(--error-accessible);font-size:12px;line-height:1.4}.h-input-hint{color:var(--text-muted);font-size:12px;line-height:1.4}.h-input-count{color:var(--text-muted);text-align:right;font-variant-numeric:tabular-nums;font-size:11px}.h-badge{display:inline-flex;border-radius:var(--h-radius-sm);letter-spacing:.02em;white-space:nowrap;vertical-align:middle;border:1px solid #0000;align-items: center;gap:.3125rem;font-family:inherit;font-weight:500;line-height:1}button.h-badge{cursor:pointer;transition:filter var(--h-duration)var(--h-ease)}button.h-badge:hover{filter:brightness(1.18)}.h-badge--default{background:var(--accents-2);color:var(--text-accessible);border-color:var(--border)}.h-badge--primary{background:color-mix(in srgb,var(--h-accent-primary)15%,transparent);color:var(--h-accent-primary);border-color:color-mix(in srgb,var(--h-accent-primary)32%,transparent)}.h-badge--success{background:color-mix(in srgb,var(--h-accent-success)15%,transparent);color:var(--h-accent-success);border-color:color-mix(in srgb,var(--h-accent-success)32%,transparent)}.h-badge--warning{background:color-mix(in srgb,var(--h-accent-warning)15%,transparent);color:var(--h-accent-warning);border-color:color-mix(in srgb,var(--h-accent-warning)32%,transparent)}.h-badge--error{background:color-mix(in srgb,var(--h-accent-danger)15%,transparent);color:var(--h-accent-danger);border-color:color-mix(in srgb,var(--h-accent-danger)32%,transparent)}.h-badge--info{background:color-mix(in srgb,var(--h-accent-info)15%,transparent);color:var(--h-accent-info);border-color:color-mix(in srgb,var(--h-accent-info)32%,transparent)}.h-badge--ghost{color:var(--text-muted);border-color:var(--border);background:0 0;border-style:dashed}.h-badge--xs{padding:1px 5px;font-size:10px}.h-badge--sm{padding:2px 7px;font-size:11px}.h-badge--md{padding:3px 9px;font-size:12px}.h-badge-text{line-height:1}.h-badge--dot{padding-left:6px}.h-badge-dot{display:inline-block;background:currentColor;border-radius:50%;flex-shrink:0;width:6px;height:6px}.pagination{display:flex;flex-wrap:wrap;align-items: center;gap:.25rem}.pagination-pages{display:flex;align-items: center;gap:.25rem}.pagination-button{display:inline-flex;min-width:var(--h-control-md);height:var(--h-control-md);border-radius:var(--h-radius);color:var(--text-muted);font-variant-numeric:tabular-nums;cursor:pointer;transition:background-color var(--h-duration)var(--h-ease),color var(--h-duration)var(--h-ease),border-color var(--h-duration)var(--h-ease);background:0 0;border:1px solid #0000;justify-content:center;align-items: center;padding:0 .5rem;font-family:inherit;font-size:13px}.pagination-button:hover:not(:disabled){background:var(--accents-2);color:var(--text)}.pagination-button--active{background:var(--primary);color:#fff;border-color:var(--primary);cursor:default;font-weight:600}.pagination-button:disabled:not(.pagination-button--active){opacity:.35;cursor:default}.pagination-button.pagination-prev,.pagination-button.pagination-next{font-size:16px;line-height:1}.pagination-ellipsis{display:inline-flex;height:var(--h-control-md);color:var(--text-muted);user-select:none;justify-content:center;align-items: flex-end;min-width:1.5rem;padding-bottom:.5rem}.pagination-sm .pagination-button{min-width:var(--h-control-sm);height:var(--h-control-sm);font-size:12px}.pagination-lg .pagination-button{min-width:var(--h-control-lg);height:var(--h-control-lg);font-size:14px}.pagination-info{color:var(--text-muted);font-size:12px}.skeleton{display:block;background:var(--accents-2);border-radius:var(--h-radius-sm)}.skeleton--rect,.skeleton--circle{display:inline-block}.skeleton--text{background:0 0}.skeleton-lines{display:flex;flex-direction:column}.skeleton-line{display:block;background:var(--accents-2)}.skeleton--shimmer,.skeleton-line.skeleton--shimmer{position:relative;overflow:hidden}.skeleton--shimmer:after,.skeleton-line.skeleton--shimmer:after{content:"";position:absolute;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--text)8%,transparent),transparent);animation:h-skeleton-shimmer 1.6s var(--h-ease)infinite;inset:0;transform:translate(-100%)}@keyframes h-skeleton-shimmer{to{transform:translate(100%)}}.skeleton--pulse,.skeleton-line.skeleton--pulse{animation:h-skeleton-pulse 1.8s var(--h-ease)infinite}@keyframes h-skeleton-pulse{0%,to{opacity:1}50%{opacity:.45}}.empty-state{display:flex;justify-content:center;align-items: center;width:100%;padding:3rem 1.5rem}.empty-state__content{display:flex;text-align:center;flex-direction:column;align-items: center;gap:.5rem}.empty-state__icon{opacity:.7;margin-bottom:.25rem;line-height:1}.empty-state__title{color:var(--text);margin:0;font-weight:600;line-height:1.3}.empty-state__message{color:var(--text-muted);margin:0;font-size:13px;line-height:1.5}.empty-state__action{margin-top:.75rem}.h-tag{display:inline-flex;border-radius:var(--h-radius);transition:background-color var(--h-duration)var(--h-ease),border-color var(--h-duration)var(--h-ease),color var(--h-duration)var(--h-ease);border:1px solid #0000;align-items: center;gap:.25rem;max-width:100%;font-weight:500;line-height:1.4}.h-tag--sm{padding:.125rem .4375rem;font-size:11px}.h-tag--md{padding:.25rem .5rem;font-size:12px}.h-tag--default{background:var(--accents-2);color:var(--text-accessible);border-color:var(--border)}.h-tag--primary{background:color-mix(in srgb,var(--h-accent-primary)15%,transparent);color:var(--h-accent-primary);border-color:color-mix(in srgb,var(--h-accent-primary)32%,transparent)}.h-tag--success{background:color-mix(in srgb,var(--h-accent-success)15%,transparent);color:var(--h-accent-success);border-color:color-mix(in srgb,var(--h-accent-success)32%,transparent)}.h-tag--warning{background:color-mix(in srgb,var(--h-accent-warning)15%,transparent);color:var(--h-accent-warning);border-color:color-mix(in srgb,var(--h-accent-warning)32%,transparent)}.h-tag--error{background:color-mix(in srgb,var(--h-accent-danger)15%,transparent);color:var(--h-accent-danger);border-color:color-mix(in srgb,var(--h-accent-danger)32%,transparent)}.h-tag--ghost{color:var(--text-muted);border-color:var(--border);background:0 0}.h-tag-body{display:inline-flex;color:inherit;font:inherit;cursor:pointer;border-radius:var(--h-radius-sm);background:0 0;border:none;align-items: center;gap:.25rem;min-width:0;padding:0}.h-tag:has(.h-tag-body:hover){border-color:var(--accents-5)}.h-tag:has(.h-tag-body[aria-pressed=true]){background:var(--primary);color:#fff;border-color:var(--primary)}.h-tag-icon{flex-shrink:0;font-size:.95em;line-height:1}.h-tag-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.3}.h-tag-remove{display:inline-flex;border-radius:var(--h-radius-sm);color:inherit;cursor:pointer;opacity:.55;transition:opacity var(--h-duration)var(--h-ease),background-color var(--h-duration)var(--h-ease);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items: center;width:14px;height:14px;margin-left:1px;padding:0;font-size:13px;line-height:1}.h-tag-remove:hover{opacity:1;background:color-mix(in srgb,currentColor 18%,transparent)}.h-taggroup{display:flex;flex-wrap:wrap;gap:.375rem}.h-taggroup-item{margin:0}.stepper{display:flex;flex-direction:column;gap:0}.stepper__steps{display:flex;flex-direction:column;width:100%}.stepper--horizontal .stepper__steps{overflow-x:auto;flex-direction:row;align-items: center}.stepper-step{display:flex;align-items: center;min-width:0}.stepper--horizontal .stepper-step{flex:1}.stepper--horizontal .stepper-step:last-child{flex:none}.stepper-step__button{display:flex;border-radius:var(--h-radius);color:var(--text-muted);cursor:pointer;text-align:left;transition:color var(--h-duration)var(--h-ease);background:0 0;border:none;align-items: center;gap:.625rem;min-width:0;padding:.5rem;font-family:inherit;font-size:13px}.stepper-step__button:hover:not(:disabled){color:var(--text)}.stepper-step__button:disabled{cursor:default}.stepper-step--current .stepper-step__button{color:var(--text);font-weight:600}.stepper-step--completed .stepper-step__label{color:var(--text)}.stepper-step__number{display:inline-flex;background:var(--accents-2);border:1px solid var(--border);color:var(--text-muted);font-variant-numeric:tabular-nums;transition:background-color var(--h-duration)var(--h-ease),border-color var(--h-duration)var(--h-ease),color var(--h-duration)var(--h-ease);border-radius:50%;flex-shrink:0;justify-content:center;align-items: center;width:26px;height:26px;font-size:12px;font-weight:600}.stepper-step__number--completed{background:color-mix(in srgb,var(--h-accent-success)20%,transparent);border-color:var(--h-accent-success);color:var(--h-accent-success)}.stepper-step--current .stepper-step__number{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 0 0 3px color-mix(in srgb,var(--primary)22%,transparent)}.stepper-step__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.stepper-step__subtitle{color:var(--text-muted);font-size:11px}.stepper-connector{background:var(--border);transition:background-color var(--h-duration)var(--h-ease);flex:24px;min-width:16px;height:1px;margin:0 .25rem}.stepper--horizontal .stepper-connector{margin:0 .5rem}.stepper-connector--completed{background:color-mix(in srgb,var(--h-accent-success)55%,transparent)}.stepper-step__icon{font-size:16px;line-height:1}.command-palette-overlay{position:fixed;z-index:1000;display:flex;background:var(--h-scrim);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);visibility:hidden;opacity:0;transition:opacity var(--h-duration)var(--h-ease),visibility var(--h-duration)var(--h-ease);justify-content:center;align-items: flex-start;padding:12vh 1rem 1rem;inset:0}.command-palette-overlay--open{visibility:visible;opacity:1}.command-palette__content{display:flex;background:var(--accents-1);border:1px solid var(--border);box-shadow:var(--h-shadow-lg);overflow:hidden;opacity:0;transition:transform var(--h-duration)var(--h-ease),opacity var(--h-duration)var(--h-ease);border-radius:10px;flex-direction:column;width:100%;max-width:640px;max-height:min(28rem,70vh);transform:translateY(-8px)scale(.98)}.command-palette-overlay--open .command-palette__content{opacity:1;transform:translateY(0)scale(1)}.command-palette__input-wrapper{display:flex;border-bottom:1px solid var(--border);flex-shrink:0;align-items: center;gap:.625rem;padding:0 .875rem}.command-palette__search-icon{color:var(--text-muted);flex-shrink:0;font-size:14px;line-height:1}.command-palette__input{color:var(--text);outline:none;outline-offset:-2px;background:0 0;border:none;flex:1;min-width:0;height:48px;font-family:inherit;font-size:15px}.command-palette__input::placeholder{color:var(--text-muted)}.command-palette__list{overflow-y:auto;display:flex;flex-direction:column;gap:1px;padding:.375rem}.command-palette__item{display:flex;border-radius:var(--h-radius);color:var(--text-accessible);text-align:left;cursor:pointer;outline-offset:-2px;transition:background-color var(--h-duration)var(--h-ease),color var(--h-duration)var(--h-ease);background:0 0;border:none;align-items: center;gap:.625rem;width:100%;padding:.5rem .625rem;font-family:inherit;font-size:13px}.command-palette__item:hover,.command-palette__item--active{background:var(--accents-3);color:var(--text)}.command-palette__icon{text-align:center;flex-shrink:0;width:1.25rem;font-size:14px;line-height:1}.command-palette__label{flex-shrink:0;font-weight:500}.command-palette__description{color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:12px}.command-palette__shortcut{color:var(--text-muted);font-family:var(--font-mono);flex-shrink:0;margin-left:auto;padding-left:.75rem;font-size:11px}.command-palette__empty{text-align:center;color:var(--text-muted);padding:2rem 1rem;font-size:13px}.list-wrapper{display:flex;flex-direction:column;width:100%}.list-header{letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);padding:.5rem .75rem;font-size:11px;font-weight:600}.list{display:flex;flex-direction:column}.list-item{display:flex;border-radius:var(--h-radius);flex-direction:column}.list-item--disabled{opacity:.5}.list-item__button{display:flex;border-radius:inherit;color:var(--text);text-align:left;cursor:pointer;outline-offset:-2px;transition:background-color var(--h-duration)var(--h-ease);background:0 0;border:none;align-items: center;gap:.75rem;width:100%;padding:.625rem .75rem;font-family:inherit;font-size:14px}.list-item__button:hover:not(:disabled){background:var(--surface-hover)}.list-item__button:disabled{cursor:not-allowed}.list-item--interactive .list-item__chevron{transition:transform var(--h-duration)var(--h-ease)}.list-item__button:hover .list-item__chevron{transform:translate(2px)}.list-item__row{display:flex;align-items: center;gap:.75rem;padding:.625rem .75rem;font-size:14px}.list-item__content{display:flex;flex-direction:column;flex:1;gap:.125rem;min-width:0}.list-item__label{color:var(--text);overflow:hidden;text-overflow:ellipsis;line-height:1.4}.list-item__description,.list-item__sublabel{color:var(--text-muted);font-size:12px;line-height:1.4}.list-item__leading,.list-item__icon,.list-item__trailing-icon,.list-item__trailing{display:inline-flex;flex-shrink:0;align-items: center;line-height:1}.list-item__icon,.list-item__leading{color:var(--text-muted)}.list-item__trailing-icon,.list-item__trailing{color:var(--text-muted);margin-left:auto;font-size:12px}.list-item__chevron{color:var(--text-muted);flex-shrink:0;font-size:16px;line-height:1}.list-item__trailing+.list-item__chevron,.list-item__trailing-icon+.list-item__chevron{margin-left:.5rem}.list-item__divider{background:var(--border);height:1px;margin:.25rem .75rem}.list-footer{color:var(--text-muted);padding:.5rem .75rem;font-size:12px}.kbd-wrapper{display:inline-flex;align-items: center;gap:.5rem}.kbd-label{color:var(--text-muted);font-size:13px}.kbd-shortcut{display:inline-flex;align-items: center;gap:.1875rem}.kbd{display:inline-flex;background:var(--accents-2);border:1px solid var(--border);border-radius:var(--h-radius-sm);color:var(--text-accessible);font-family:var(--font-mono);white-space:nowrap;border-bottom-width:2px;justify-content:center;align-items: center;min-width:22px;height:22px;padding:0 .375rem;font-size:12px;line-height:1}.kbd--modifier{color:var(--text);font-weight:600}.kbd-separator{color:var(--text-muted);user-select:none;font-size:10px}.h-counter{display:inline-flex;align-items: center;gap:.25rem}.h-counter-button{display:inline-flex;background:var(--accents-2);border:1px solid var(--border);border-radius:var(--h-radius);color:var(--text);cursor:pointer;transition:background-color var(--h-duration)var(--h-ease),border-color var(--h-duration)var(--h-ease),opacity var(--h-duration)var(--h-ease);flex-shrink:0;justify-content:center;align-items: center;font-family:inherit;line-height:1}.h-counter-button:hover:not(:disabled){background:var(--accents-3);border-color:var(--accents-4)}.h-counter-button:active:not(:disabled){background:var(--accents-4)}.h-counter-button:disabled{opacity:.35;cursor:not-allowed}.h-counter-value{display:inline-flex;color:var(--text);font-variant-numeric:tabular-nums;justify-content:center;align-items: center;font-weight:500}.h-counter--sm .h-counter-button{width:var(--h-control-sm);height:var(--h-control-sm);font-size:13px}.h-counter--sm .h-counter-value{min-width:2rem;font-size:13px}.h-counter--md .h-counter-button{width:var(--h-control-md);height:var(--h-control-md);font-size:15px}.h-counter--md .h-counter-value{min-width:2.5rem;font-size:14px}.h-counter--lg .h-counter-button{width:var(--h-control-lg);height:var(--h-control-lg);font-size:17px}.h-counter--lg .h-counter-value{min-width:3rem;font-size:16px}.h-counter--outline .h-counter-button{background:0 0}.h-counter--pill .h-counter-button{border-radius:999px}

/* ==== ./styles.css ==== */
/* Brand tokens: design/brand/tokens.json — sole color source for tenant UI. */
:root {
  --pmp-primary: #4f46e5;
  --pmp-primary-hover: #4338ca;
  --pmp-primary-soft: #eef2ff;
  --pmp-primary-muted: #a5b4fc;
  --pmp-canvas: #f8fafc;
  --pmp-surface: #ffffff;
  --pmp-sidebar: #ffffff;
  --pmp-border: #e2e8f0;
  --pmp-border-strong: #cbd5e1;
  --pmp-ink: #0f172a;
  --pmp-ink-soft: #64748b;
  --pmp-ink-inverse: #ffffff;
  --pmp-success: #15803d;
  --pmp-success-soft: #dcfce7;
  --pmp-warning: #b45309;
  --pmp-warning-soft: #fef3c7;
  --pmp-danger: #b91c1c;
  --pmp-danger-soft: #fee2e2;
  --pmp-info: #0369a1;
  --pmp-ai: #7c3aed;
  --pmp-ai-soft: #f3e8ff;
  --pmp-claim-insert: #15803d;
  --pmp-claim-delete: #b91c1c;
  --pmp-claim-move: #1d4ed8;
  --pmp-claim-reword: #b45309;
  --pmp-radius-control: 0.5rem;
  --pmp-radius-card: 0.75rem;
  --pmp-radius-pill: 9999px;
  --pmp-nav-width: 15rem;
  --pmp-topbar-height: 3.5rem;
  /* Vertical rhythm between the sections of a page. */
  --pmp-section-gap: 1rem;
  --pmp-font-mono: 'IBM Plex Mono', 'JetBrains Mono', ui-monospace, monospace;
  font-family: Inter, Geist, 'IBM Plex Sans', system-ui, sans-serif;
  font-size: 14px;
  color: var(--pmp-ink);
  background: var(--pmp-canvas);
  line-height: 1.5;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  width: 100%;
  min-height: 100%;
  min-height: 100vh;
  /* `:root` above sets the 14px base, but body does not inherit it when something else declares its
     own size. Hydrogen's reset declares `body { font-size: .875rem }`, which would resolve against
     this root and render the entire product at 12.25px. `inherit` restores the root's base on the
     element Tokkyodo owns, rather than leaving the product's type scale to whichever reset loads last.
     It does no rem arithmetic, so the result is the root size in every engine. On `html` itself the
     more specific `:root` declaration above still wins. */
  font-size: inherit;
}

/* Root mount must consume the viewport or Hydrogen shells shrink-wrap content */
#app {
  display: block;
  width: 100%;
  min-height: 100vh;
}

.record-page {
  display: contents;
}

button,
input,
select {
  font: inherit;
}

a {
  color: inherit;
}

/* —— App shell (Set B) —— */
.shell {
  display: grid;
  grid-template-columns: var(--pmp-nav-width) 1fr;
  grid-template-rows: 100vh;
  min-height: 100vh;
}

/* Sidebar lives inside Hydrogen CollapsibleSidebar (.nav-inner), not .nav */
.nav,
.nav-inner {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  background: var(--pmp-sidebar);
  height: 100%;
  min-height: 100%;
  overflow: hidden;
}

.nav-brand {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.35rem 0.65rem 1rem;
  text-decoration: none;
  color: var(--pmp-ink);
  flex-shrink: 0;
}

.nav-brand .logo,
.nav-brand svg.logo {
  width: 1.75rem !important;
  height: 1.75rem !important;
  max-width: 1.75rem;
  max-height: 1.75rem;
  flex-shrink: 0;
  display: block;
}

.nav-brand .wordmark {
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: -0.03em;
}

.nav-section {
  margin: 0.35rem 0.65rem 0.25rem;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--pmp-ink-soft);
}

a.nav-item,
.nav a.nav-item,
.nav-inner a.nav-item {
  display: flex !important;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 0.65rem;
  border-radius: var(--pmp-radius-control);
  color: var(--pmp-ink);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.2;
  min-height: 2.25rem;
}

a.nav-item svg,
.nav a.nav-item svg,
.nav-inner a.nav-item svg,
.nav-item > svg {
  width: 1.125rem !important;
  height: 1.125rem !important;
  max-width: 1.125rem !important;
  max-height: 1.125rem !important;
  flex: 0 0 1.125rem;
  display: block;
  opacity: 0.85;
}

a.nav-item .badge,
.nav a.nav-item .badge,
.nav-inner a.nav-item .badge {
  margin-left: auto;
  min-width: 1.25rem;
  padding: 0.05rem 0.4rem;
  border-radius: var(--pmp-radius-pill);
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
  font-size: 0.6875rem;
  font-weight: 600;
  text-align: center;
}

a.nav-item:hover,
.nav a.nav-item:hover,
.nav-inner a.nav-item:hover {
  background: var(--pmp-canvas);
}

a.nav-item.active,
.nav a.nav-item.active,
.nav-inner a.nav-item.active {
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
}

a.nav-item.active svg,
.nav a.nav-item.active svg,
.nav-inner a.nav-item.active svg {
  opacity: 1;
}

/* Never let decorative SVGs scale with layout width */
svg.logo,
.icon-btn svg,
.topbar-search svg {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}

.topbar-search svg {
  width: 1rem !important;
  height: 1rem !important;
}

.nav-foot {
  margin-top: auto;
  padding: 0.75rem 0.65rem 0.25rem;
  border-top: 1px solid var(--pmp-border);
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.nav-foot .live-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.35rem;
  padding: 0.2rem 0.5rem;
  border-radius: var(--pmp-radius-pill);
  background: var(--pmp-success-soft);
  color: var(--pmp-success);
  font-weight: 600;
  font-size: 0.6875rem;
}

.nav-foot .live-chip.err {
  background: var(--pmp-danger-soft);
  color: var(--pmp-danger);
}

.nav-foot .live-chip.idle {
  background: var(--pmp-canvas);
  color: var(--pmp-ink-soft);
}

/* —— Workspace column —— */
.workspace {
  display: flex;
  flex-direction: column;
  min-width: 0;
  background: var(--pmp-canvas);
}

.topbar {
  display: flex;
  align-items: center;
  gap: 1rem;
  height: var(--pmp-topbar-height);
  padding: 0 1.5rem;
  background: var(--pmp-surface);
  border-bottom: 1px solid var(--pmp-border);
  flex-shrink: 0;
}

.topbar-search {
  flex: 1;
  min-width: 0;
  max-width: 32rem;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  height: 2.25rem;
  padding: 0 0.85rem;
  background: var(--pmp-canvas);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-pill);
  color: var(--pmp-ink-soft);
  font-size: 0.8125rem;
  font-family: inherit;
  text-align: left;
  cursor: pointer;
}

.topbar-search:hover {
  border-color: var(--pmp-border-strong);
  color: var(--pmp-ink);
}

/* Single line at every width. The label used to wrap to three lines and spill
   out of the control on narrow viewports. */
.topbar-search-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

.topbar-search kbd {
  margin-left: auto;
  padding: 0.1rem 0.4rem;
  border: 1px solid var(--pmp-border);
  border-radius: 0.35rem;
  background: var(--pmp-surface);
  font-size: 0.6875rem;
  font-family: inherit;
  color: var(--pmp-ink-soft);
}

.topbar-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-left: auto;
}

.icon-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border: 0;
  border-radius: var(--pmp-radius-pill);
  background: transparent;
  color: var(--pmp-ink-soft);
  cursor: pointer;
}

.icon-btn:hover {
  background: var(--pmp-canvas);
  color: var(--pmp-ink);
}

.icon-btn .dot {
  position: absolute;
  top: 0.35rem;
  right: 0.4rem;
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 50%;
  background: var(--pmp-danger);
  border: 2px solid var(--pmp-surface);
}

.avatar {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--pmp-primary), var(--pmp-primary-muted));
  color: var(--pmp-ink-inverse);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 700;
}

.page {
  flex: 1;
  overflow: auto;
  padding: 1.5rem 1.75rem 2rem;
}

.page-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
}

.page-head h1 {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.02em;
}

.page-head .sub {
  margin: 0.25rem 0 0;
  color: var(--pmp-ink-soft);
  font-size: 0.875rem;
}

.page-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}

.btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  height: 2.25rem;
  padding: 0 0.9rem;
  border-radius: var(--pmp-radius-control);
  border: 1px solid var(--pmp-border);
  background: var(--pmp-surface);
  color: var(--pmp-ink);
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
}

.btn:hover {
  background: var(--pmp-canvas);
}

.btn-primary {
  border-color: transparent;
  background: var(--pmp-primary);
  color: var(--pmp-ink-inverse);
}

.btn-primary:hover {
  background: var(--pmp-primary-hover);
}

.btn-ghost {
  border-color: transparent;
  background: transparent;
  color: var(--pmp-ink-soft);
}

/* —— KPI row —— */
.kpi-row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.85rem;
  margin-bottom: 1rem;
}

@media (max-width: 1200px) {
  .kpi-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 800px) {
  .kpi-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .shell {
    grid-template-columns: 1fr;
  }

  .nav,
  .nav-inner {
    /* keep sidebar available; CollapsibleSidebar can collapse */
  }
}

.kpi {
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
  padding: 0.9rem 1rem;
  min-height: 7.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.kpi-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}

.kpi-icon {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.85rem;
  flex-shrink: 0;
}

.kpi-icon.indigo {
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
}

.kpi-icon.blue {
  background: var(--pmp-primary-soft);
  color: var(--pmp-info);
}

.kpi-icon.green {
  background: var(--pmp-success-soft);
  color: var(--pmp-success);
}

.kpi-icon.red {
  background: var(--pmp-danger-soft);
  color: var(--pmp-danger);
}

.kpi-icon.amber {
  background: var(--pmp-warning-soft);
  color: var(--pmp-warning);
}

.kpi-icon svg {
  width: 1.05rem;
  height: 1.05rem;
}

.kpi-label {
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
  font-weight: 500;
}

.kpi-value {
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.1;
}

.kpi-meta {
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.kpi-delta {
  font-size: 0.75rem;
  font-weight: 600;
}

.kpi-delta.up {
  color: var(--pmp-success);
}

.kpi-delta.down {
  color: var(--pmp-danger);
}

.spark {
  margin-top: auto;
  height: 1.75rem;
  width: 100%;
}

.spark path {
  fill: none;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* —— Grid panels —— */
.grid-2 {
  display: grid;
  grid-template-columns: 1.4fr 1fr 0.95fr;
  gap: 0.85rem;
  margin-bottom: 0.85rem;
}

.grid-3 {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr 1fr;
  gap: 0.85rem;
}

@media (max-width: 1100px) {
  .grid-2,
  .grid-3 {
    grid-template-columns: 1fr;
  }
}

.panel {
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
  padding: 1rem 1.1rem;
  min-width: 0;
}

.panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.85rem;
}

.panel-head h2 {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 600;
}

.panel-head .link {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--pmp-primary);
  text-decoration: none;
}

.panel-head .link:hover {
  text-decoration: underline;
}

.muted {
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
}

/* —— Chart placeholders —— */
.chart-line {
  height: 11rem;
  width: 100%;
}

.chart-line path.area {
  fill: url(#areaFill);
  stroke: none;
}

.chart-line path.line {
  fill: none;
  stroke: var(--pmp-primary);
  stroke-width: 2.25;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.chart-line .grid-line {
  stroke: var(--pmp-border);
  stroke-width: 1;
}

.chart-line text {
  fill: var(--pmp-ink-soft);
  font-size: 10px;
}

.donut-wrap {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.donut {
  width: 8.5rem;
  height: 8.5rem;
  border-radius: 50%;
  background: conic-gradient(
    var(--pmp-primary) 0 39%,
    var(--pmp-info) 39% 65%,
    var(--pmp-success) 65% 82%,
    var(--pmp-danger) 82% 92%,
    var(--pmp-warning) 92% 100%
  );
  display: grid;
  place-items: center;
  flex-shrink: 0;
  position: relative;
}

.donut::before {
  content: '';
  position: absolute;
  inset: 1.35rem;
  border-radius: 50%;
  background: var(--pmp-surface);
}

.donut-center {
  position: relative;
  z-index: 1;
  text-align: center;
}

.donut-center strong {
  display: block;
  font-size: 1.25rem;
  letter-spacing: -0.02em;
}

.donut-center span {
  font-size: 0.6875rem;
  color: var(--pmp-ink-soft);
}

.legend {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  font-size: 0.75rem;
  flex: 1;
  min-width: 0;
}

.legend li {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.legend .swatch {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  flex-shrink: 0;
}

.legend .count {
  margin-left: auto;
  color: var(--pmp-ink-soft);
  font-variant-numeric: tabular-nums;
}

/* —— Lists —— */
.deadline-list,
.activity-list,
.insight-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.deadline-list li,
.activity-list li,
.insight-list li {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  padding: 0.55rem 0.15rem;
  border-bottom: 1px solid var(--pmp-border);
  font-size: 0.8125rem;
}

.deadline-list li:last-child,
.activity-list li:last-child,
.insight-list li:last-child {
  border-bottom: 0;
}

.date-pill {
  width: 2.5rem;
  flex-shrink: 0;
  text-align: center;
  line-height: 1.15;
}

.date-pill .mon {
  display: block;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--pmp-primary);
}

.date-pill .day {
  display: block;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.date-pill.warn .mon,
.date-pill.warn .day {
  color: var(--pmp-warning);
}

.date-pill.danger .mon,
.date-pill.danger .day {
  color: var(--pmp-danger);
}

.item-body {
  flex: 1;
  min-width: 0;
}

.item-body strong {
  display: block;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.item-body span {
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
}

.item-meta {
  flex-shrink: 0;
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
}

.health {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.health-score {
  width: 5.5rem;
  height: 5.5rem;
  border-radius: 50%;
  background: conic-gradient(var(--pmp-primary) 0 82%, var(--pmp-border) 82% 100%);
  display: grid;
  place-items: center;
  flex-shrink: 0;
  position: relative;
}

.health-score::before {
  content: '';
  position: absolute;
  inset: 0.7rem;
  border-radius: 50%;
  background: var(--pmp-surface);
}

.health-score > div {
  position: relative;
  z-index: 1;
  text-align: center;
}

.health-score strong {
  display: block;
  font-size: 1.35rem;
  letter-spacing: -0.03em;
}

.health-score span {
  font-size: 0.6875rem;
  color: var(--pmp-ink-soft);
  font-weight: 600;
}

.checklist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  font-size: 0.8125rem;
}

.checklist li {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.checklist .ok {
  color: var(--pmp-success);
}

.checklist .warn {
  color: var(--pmp-warning);
}

/* —— Filters + table (Portfolio) —— */
.toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-bottom: 0.85rem;
}

.toolbar input[type='search'],
.toolbar select {
  height: 2.15rem;
  padding: 0 0.7rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-surface);
  color: var(--pmp-ink);
  font-size: 0.8125rem;
}

.toolbar input[type='search'] {
  min-width: 12rem;
  flex: 1;
}

.table-wrap {
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
  overflow: auto;
}

table.data {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8125rem;
}

table.data th {
  text-align: left;
  padding: 0.65rem 0.75rem;
  background: var(--pmp-canvas);
  border-bottom: 1px solid var(--pmp-border);
  color: var(--pmp-ink-soft);
  font-weight: 600;
  font-size: 0.75rem;
  white-space: nowrap;
}

table.data td {
  padding: 0.7rem 0.75rem;
  border-bottom: 1px solid var(--pmp-border);
  vertical-align: middle;
}

table.data tr:last-child td {
  border-bottom: 0;
}

table.data tr:hover td {
  background: var(--pmp-canvas);
}

.title-cell {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 600;
  color: var(--pmp-primary);
}

.dot-status {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  flex-shrink: 0;
}

.dot-status.granted {
  background: var(--pmp-success);
}

.dot-status.pending {
  background: var(--pmp-info);
}

.chip {
  display: inline-flex;
  align-items: center;
  /* A chip sizes to its label. `align-self` keeps that true inside a stretch
     alignment context, where it would otherwise span the whole column. */
  align-self: flex-start;
  width: fit-content;
  height: 1.35rem;
  padding: 0 0.5rem;
  border-radius: var(--pmp-radius-pill);
  font-size: 0.6875rem;
  font-weight: 600;
  white-space: nowrap;
}

.chip.granted {
  background: var(--pmp-success-soft);
  color: var(--pmp-success);
}

.chip.pending {
  background: var(--pmp-primary-soft);
  color: var(--pmp-info);
}

.chip.live {
  background: var(--pmp-success-soft);
  color: var(--pmp-success);
}

.chip.fixture {
  background: var(--pmp-canvas);
  color: var(--pmp-ink-soft);
}

.table-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.65rem 0.85rem;
  border-top: 1px solid var(--pmp-border);
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

/* —— Record detail —— */
.breadcrumb {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.85rem;
  font-size: 0.8125rem;
  color: var(--pmp-ink-soft);
}

.breadcrumb a {
  color: var(--pmp-primary);
  text-decoration: none;
  font-weight: 600;
}

.record-hero {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 1rem 1.1rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
  background: var(--pmp-surface);
}

.record-title {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  min-width: 0;
}

.record-title .icon {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: var(--pmp-primary);
  color: var(--pmp-ink-inverse);
  display: grid;
  place-items: center;
  font-weight: 700;
  flex-shrink: 0;
}

.record-title .icon svg {
  width: 1.4rem;
  height: 1.4rem;
}

.favorite {
  appearance: none;
  width: 1.4rem;
  height: 1.4rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--pmp-ink-soft);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
}

.record-heading-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.record-title h1 {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 600;
  letter-spacing: -0.02em;
}

.record-title .meta {
  margin-top: 0.25rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  font-size: 0.8125rem;
  color: var(--pmp-ink-soft);
}

.record-hero-facts {
  display: grid;
  grid-template-columns: repeat(6, minmax(6.5rem, 1fr));
  margin: 1rem 0 0;
}

.record-hero-facts div {
  padding: 0 0.9rem;
  border-left: 1px solid var(--pmp-border);
}

.record-hero-facts div:first-child {
  padding-left: 0;
  border-left: 0;
}

.record-hero-facts dt,
.record-hero-facts dd {
  margin: 0;
}

.record-hero-facts dt {
  color: var(--pmp-ink-soft);
  font-size: 0.67rem;
}

.record-hero-facts dd {
  margin-top: 0.12rem;
  font-size: 0.75rem;
  font-weight: 600;
  white-space: nowrap;
}

.record-hero-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
}

.record-summary-metrics {
  display: flex;
  gap: 0.6rem;
}

.record-summary-metrics > div {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-width: 8.6rem;
  padding: 0.55rem 0.7rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  color: var(--pmp-primary);
}

.record-summary-metrics svg {
  width: 1.25rem;
  height: 1.25rem;
}

.record-summary-metrics span,
.record-summary-metrics strong {
  display: block;
}

.record-summary-metrics span {
  color: var(--pmp-ink-soft);
  font-size: 0.65rem;
}

.record-summary-metrics strong {
  color: var(--pmp-ink);
  font-size: 1rem;
}

.tabs {
  display: flex;
  gap: 0.15rem;
  border-bottom: 1px solid var(--pmp-border);
  margin-bottom: 1rem;
  overflow-x: auto;
}

.tabs button {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0.65rem 0.9rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--pmp-ink-soft);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}

.tabs button.active {
  color: var(--pmp-primary);
  border-bottom-color: var(--pmp-primary);
}

.tab-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.3rem;
  height: 1.15rem;
  margin-left: 0.2rem;
  border-radius: var(--pmp-radius-pill);
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
  font-size: 0.62rem;
}

.kv {
  display: grid;
  grid-template-columns: 8rem minmax(0, 1fr);
  gap: 0.35rem 0.75rem;
  font-size: 0.8125rem;
}

.kv dt {
  color: var(--pmp-ink-soft);
  margin: 0;
}

.kv dd {
  margin: 0;
  min-width: 0;
  font-weight: 500;
  overflow-wrap: anywhere;
}

.record-overview-grid > .panel:first-child .kv {
  grid-template-columns: 6.3rem minmax(0, 1fr);
  gap: 0.5rem 0.65rem;
  font-size: 0.72rem;
}

.record-overview-grid > .panel:first-child .kv dd:nth-of-type(2) {
  line-height: 1.5;
}

.record-links {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin-top: 0.7rem;
  padding-top: 0.65rem;
  border-top: 1px solid var(--pmp-border);
  font-size: 0.7rem;
}

.record-links a,
.panel-link {
  color: var(--pmp-primary);
  text-decoration: none;
  font-weight: 600;
}

.provenance-note {
  margin-top: 0.75rem;
  padding: 0.55rem 0.7rem;
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-ai-soft);
  color: var(--pmp-ai);
  font-size: 0.75rem;
}

.mono {
  font-family: var(--pmp-font-mono);
  font-size: 0.8125rem;
}

pre.raw {
  margin: 0;
  padding: 0.85rem;
  background: var(--pmp-canvas);
  border-radius: var(--pmp-radius-control);
  font-size: 0.75rem;
  overflow: auto;
  white-space: pre-wrap;
  max-height: 22rem;
}

.status-ok {
  color: var(--pmp-success);
}

.status-err {
  color: var(--pmp-danger);
}

.side-stack {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.record-overview-grid {
  display: grid;
  grid-template-columns:
    minmax(15.5rem, 0.9fr)
    minmax(11rem, 0.58fr)
    minmax(28rem, 1.65fr)
    minmax(16rem, 0.9fr);
  grid-template-areas:
    'biblio relationships graph side'
    'timeline timeline events side';
  gap: 0.75rem;
  align-items: stretch;
}

.record-overview-grid > .panel:nth-child(1) {
  grid-area: biblio;
}

.record-relationships {
  grid-area: relationships;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.record-relationships .panel {
  padding: 0.75rem;
}

.record-overview-grid > .panel:nth-child(3) {
  grid-area: graph;
}

.record-side-stack {
  grid-area: side;
}

.record-overview-grid > .panel:nth-child(5) {
  grid-area: timeline;
}

.record-overview-grid > .panel:nth-child(6) {
  grid-area: events;
}

.people-list,
.related-products,
.family-list,
.secret-links,
.event-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.people-list li {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.68rem;
}

.people-list li > span:first-child {
  display: grid;
  place-items: center;
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 50%;
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
  font-weight: 700;
}

.people-list li strong {
  flex: 1;
}

.assignee,
.related-products li,
.secret-links li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.assignee > span,
.related-products li > span,
.secret-links svg {
  display: grid;
  place-items: center;
  color: var(--pmp-primary);
  flex: 0 0 auto;
}

.assignee strong,
.assignee small,
.related-products strong,
.related-products small,
.secret-links strong {
  display: block;
}

.assignee strong,
.related-products strong,
.secret-links strong {
  font-size: 0.68rem;
}

.assignee small,
.related-products small {
  color: var(--pmp-ink-soft);
  font-size: 0.6rem;
}

.record-relationships .panel-link {
  display: inline-block;
  margin-top: 0.65rem;
  font-size: 0.65rem;
}

.patent-graph {
  position: relative;
  width: 100%;
  min-height: 24rem;
  overflow: hidden;
  border-radius: var(--pmp-radius-control);
  background:
    radial-gradient(circle at 50% 50%, var(--pmp-primary-soft), transparent 27%), var(--pmp-surface);
}

.graph-links {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  color: var(--pmp-border-strong);
}

.graph-links path {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.2;
}

.graph-hub {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 7.5rem;
  height: 7.5rem;
  padding: 0.6rem;
  border: 2px solid var(--pmp-primary-muted);
  border-radius: 50%;
  background: var(--pmp-surface);
  color: var(--pmp-primary);
  text-align: center;
  box-shadow: 0 0 0 0.65rem var(--pmp-primary-soft);
  z-index: 2;
}

.graph-hub svg {
  width: 2.1rem;
  height: 2.1rem;
  padding: 0.45rem;
  border-radius: 50%;
  background: var(--pmp-primary);
  color: var(--pmp-ink-inverse);
}

.graph-hub strong {
  max-width: 100%;
  margin-top: 0.35rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--pmp-ink);
  font-size: 0.68rem;
}

.graph-hub span {
  color: var(--pmp-ink-soft);
  font-size: 0.55rem;
}

.graph-relation {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 7.3rem;
  padding: 0.45rem 0.55rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-surface);
  color: var(--pmp-ink);
  text-decoration: none;
  font-size: 0.62rem;
  z-index: 3;
}

.graph-relation:hover {
  border-color: var(--pmp-primary-muted);
  background: var(--pmp-primary-soft);
}

.graph-relation-icon {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
}

.graph-relation-icon svg {
  width: 1rem;
  height: 1rem;
}

.graph-relation > span:last-child,
.graph-relation strong {
  display: block;
}

.graph-relation strong {
  margin-top: 0.05rem;
  font-size: 0.7rem;
}

.graph-relation.inventors {
  left: 50%;
  top: 1%;
  transform: translateX(-50%);
}

.graph-relation.applications {
  right: 2%;
  top: 15%;
}

.graph-relation.office-actions {
  right: 0;
  top: 43%;
}

.graph-relation.products {
  right: 7%;
  bottom: 8%;
}

.graph-relation.jurisdictions {
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
}

.graph-relation.owners {
  left: 7%;
  bottom: 8%;
}

.graph-relation.evidence {
  left: 0;
  top: 43%;
}

.graph-relation.prior-art {
  left: 2%;
  top: 15%;
}

.graph-legend {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.9rem;
  margin-top: 0.45rem;
  color: var(--pmp-ink-soft);
  font-size: 0.6rem;
}

.graph-legend span::before {
  content: '';
  display: inline-block;
  width: 0.42rem;
  height: 0.42rem;
  margin-right: 0.3rem;
  border-radius: 50%;
  background: var(--pmp-primary);
}

.family-list li {
  display: grid;
  grid-template-columns: 1.6rem minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.35rem;
  padding-bottom: 0.42rem;
  border-bottom: 1px solid var(--pmp-border);
  font-size: 0.64rem;
}

.family-list .flag {
  color: var(--pmp-primary);
  font-weight: 700;
}

.record-side-stack .panel-link {
  display: inline-block;
  margin-top: 0.6rem;
  font-size: 0.65rem;
}

.secret-links li {
  align-items: flex-start;
  color: var(--pmp-ink-soft);
  font-size: 0.62rem;
}

/* Tracks flex to the panel instead of holding a fixed 4.5rem minimum. At the
   fixed minimum the eight columns overran the panel and the last dot painted
   on top of the neighbouring card; `min-width: 0` plus a scrolling container
   keeps any residual overflow inside this panel. */
.record-timeline {
  position: relative;
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 0;
  margin: 1.2rem 0 0;
  padding: 0 0 0.25rem;
  min-width: 0;
  overflow-x: auto;
  list-style: none;
}

.record-timeline::before {
  content: '';
  position: absolute;
  left: 4%;
  right: 4%;
  top: 0.5rem;
  height: 1px;
  background: var(--pmp-border-strong);
}

.record-timeline li {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.18rem;
  text-align: center;
  font-size: 0.58rem;
  color: var(--pmp-ink-soft);
}

.timeline-dot {
  width: 1.05rem;
  height: 1.05rem;
  margin-bottom: 0.45rem;
  border: 0.3rem solid var(--pmp-primary-soft);
  border-radius: 50%;
  background: var(--pmp-primary);
  z-index: 1;
}

.record-timeline li.success .timeline-dot {
  border-color: var(--pmp-success-soft);
  background: var(--pmp-success);
}

.record-timeline li.warning .timeline-dot {
  border-color: var(--pmp-warning-soft);
  background: var(--pmp-warning);
}

.record-timeline li.danger .timeline-dot {
  border-color: var(--pmp-danger-soft);
  background: var(--pmp-danger);
}

.record-timeline li.info .timeline-dot {
  background: var(--pmp-info);
}

.event-list li {
  display: grid;
  grid-template-columns: 6.7rem minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.5rem;
  padding: 0.36rem 0;
  border-bottom: 1px solid var(--pmp-border);
  font-size: 0.64rem;
}

.event-list li > span:first-child {
  color: var(--pmp-ink-soft);
}

.live-evidence {
  margin-top: 0.75rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
  background: var(--pmp-surface);
}

.live-evidence summary {
  padding: 0.65rem 0.8rem;
  color: var(--pmp-ink-soft);
  font-size: 0.7rem;
  font-weight: 600;
  cursor: pointer;
}

.live-evidence-grid {
  display: grid;
  grid-template-columns: 18rem 1fr;
  gap: 0.8rem;
  padding: 0 0.8rem 0.8rem;
}

@media (max-width: 1380px) {
  .record-overview-grid {
    grid-template-columns: minmax(15rem, 0.8fr) minmax(10.5rem, 0.55fr) minmax(25rem, 1.55fr);
    grid-template-areas:
      'biblio relationships graph'
      'timeline timeline events'
      'side side side';
  }

  .record-side-stack {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* —— Hydrogen CollapsibleSidebar / SplitPane product styling —— */
.collapsible-sidebar {
  position: relative;
  min-width: 100%;
  min-height: 100vh;
  background: var(--pmp-canvas);
}

.collapsible-sidebar > .split-pane,
.split-pane {
  display: flex;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  min-height: 100vh;
  background: var(--pmp-canvas);
}

.split-pane--horizontal {
  flex-direction: row;
  align-items: stretch;
}

.split-pane__pane {
  overflow: hidden;
}

.split-pane--horizontal > .split-pane__pane--left {
  flex: 0 0 var(--pmp-nav-width);
  width: var(--pmp-nav-width);
  max-width: var(--pmp-nav-width);
  background: var(--pmp-sidebar);
  border-right: 1px solid var(--pmp-border);
  height: 100%;
}

.split-pane--horizontal > .split-pane__pane--right {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-width: 0;
  height: 100%;
  overflow: hidden;
}

.collapsible-sidebar--collapsed .split-pane--horizontal > .split-pane__pane--left {
  flex-basis: 0;
  width: 0;
  max-width: 0;
  border-right: 0;
  overflow: hidden;
}

.split-pane__divider {
  width: 4px;
  flex: 0 0 4px;
  background: var(--pmp-border);
  cursor: col-resize;
  position: relative;
  align-self: stretch;
}

.split-pane__divider:hover,
.split-pane__divider:active,
.split-pane--dragging .split-pane__divider {
  background: var(--pmp-primary-muted);
}

.collapsible-sidebar__sidebar-wrapper,
.collapsible-sidebar__sidebar-content,
.nav-inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 100%;
  width: 100%;
  min-width: 0;
}

.collapsible-sidebar__toggle {
  position: absolute;
  left: 0;
  bottom: 0.75rem;
  z-index: 5;
  margin-left: calc(var(--sidebar-width, 240px) - 2.25rem);
  width: 1.75rem;
  height: 1.75rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-pill);
  background: var(--pmp-surface);
  color: var(--pmp-ink-soft);
  cursor: pointer;
  display: grid;
  place-items: center;
  font-size: 0.65rem;
  box-shadow: 0 1px 2px color-mix(in srgb, var(--pmp-ink) 6%, transparent);
}

.collapsible-sidebar--collapsed .collapsible-sidebar__toggle {
  margin-left: 0.35rem;
}

.collapsible-sidebar--collapsed .nav-label,
.collapsible-sidebar--collapsed .wordmark,
.collapsible-sidebar--collapsed .badge,
.collapsible-sidebar--collapsed .nav-foot {
  display: none;
}

.nav-inner {
  padding: 0.85rem 0.65rem 2.5rem;
}

.nav-scroll {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  flex: 1;
  overflow-y: auto;
}

.nav-foot-row {
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.nav-foot-meta {
  margin-top: 0.35rem;
  font-size: 0.65rem;
  color: var(--pmp-ink-soft);
  opacity: 0.85;
}

/* Hydrogen Button class hooks */
.h-btn,
button.btn,
a.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  height: 2.25rem;
  padding: 0 0.9rem;
  border-radius: var(--pmp-radius-control);
  border: 1px solid var(--pmp-border);
  background: var(--pmp-surface);
  color: var(--pmp-ink);
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
}

.h-btn-primary,
.btn-primary,
button.btn-primary,
a.btn-primary {
  border-color: transparent;
  background: var(--pmp-primary);
  color: var(--pmp-ink-inverse);
}

.h-btn-primary:hover,
.btn-primary:hover {
  background: var(--pmp-primary-hover);
}

.h-btn-secondary {
  background: var(--pmp-surface);
}

/* Drop old fixed grid shell when using CollapsibleSidebar */
.shell {
  display: contents;
}

.page-stack {
  display: flex;
  flex-direction: column;
  gap: var(--pmp-section-gap);
  width: 100%;
  min-width: 0;
  min-height: 100%;
  box-sizing: border-box;
}

.head-actions {
  margin: -0.5rem 0 1rem;
  justify-content: flex-end;
}

.workspace {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 100%;
  flex: 1 1 auto;
  background: var(--pmp-canvas);
}

.workspace > .page,
.page {
  width: 100%;
  min-width: 0;
  flex: 1 1 auto;
  box-sizing: border-box;
}

.page-stack {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.fixture-line {
  margin: -0.35rem 0 0.85rem;
}

/**
 * The stack owns the rhythm between page sections.
 *
 * It used to own nothing: `gap` was zero and each section was expected to
 * carry its own bottom margin. The chrome sections do, so they looked spaced;
 * the content sections (`.stat-row`, `.table-wrap`, `.link-cards`, panels) do
 * not, so a widget row sat flush against the table under it. Sections that
 * also appear outside a stack keep their own margin for those uses — this
 * neutralises it here so one gap applies everywhere and no pair can silently
 * touch again.
 *
 * The selector repeats the class to outrank any single-class section rule
 * whatever the source order: several of them are declared below this point,
 * and a rhythm that depends on where a rule happens to sit in the file is a
 * defect waiting to come back.
 */
.page-stack.page-stack > * {
  margin-top: 0;
  margin-bottom: 0;
}

.projection-strip {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem 1rem;
  margin: -0.35rem 0 0.85rem;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-surface);
  color: var(--pmp-ink-soft);
  font-size: 0.72rem;
}

.projection-strip strong {
  color: var(--pmp-ink);
  font-weight: 600;
}

.ai-disclosure {
  width: fit-content;
  margin: -0.2rem 0 0.35rem;
  padding: 0.25rem 0.55rem;
  border-radius: var(--pmp-radius-pill);
  background: var(--pmp-ai-soft);
  color: var(--pmp-ai);
  font-size: 0.68rem;
  font-weight: 600;
}

/* —— Portfolio inventory + strategic rail —— */
.portfolio-disclosure {
  margin-top: -0.4rem;
}

.portfolio-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 17.5rem;
  gap: 0.9rem;
  align-items: start;
}

.portfolio-main {
  min-width: 0;
}

.portfolio-kpis {
  gap: 0.65rem;
}

.portfolio-kpis .kpi {
  min-height: 8.65rem;
  padding: 0.8rem 0.85rem;
}

.portfolio-kpis .kpi-value {
  font-size: 1.35rem;
}

.portfolio-toolbar {
  flex-wrap: nowrap;
}

.portfolio-toolbar input[type='search'] {
  min-width: 11rem;
}

.portfolio-toolbar select {
  min-width: 7.3rem;
}

.portfolio-table {
  min-width: 72rem;
  font-size: 0.74rem;
}

.portfolio-table th,
.portfolio-table td {
  padding: 0.57rem 0.62rem;
}

.portfolio-table .title-cell {
  max-width: 15rem;
}

.portfolio-rail {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.portfolio-rail .panel {
  padding: 0.85rem;
}

.rail-kicker {
  margin: -0.25rem 0 0.65rem;
  color: var(--pmp-ink-soft);
  font-size: 0.72rem;
}

.rail-donut {
  align-items: flex-start;
  gap: 0.65rem;
}

.rail-donut .donut {
  width: 6.2rem;
  height: 6.2rem;
}

.rail-donut .donut::before {
  inset: 1.05rem;
}

.rail-donut .legend {
  gap: 0.26rem;
  font-size: 0.66rem;
}

.rail-value {
  display: flex;
  align-items: baseline;
  gap: 0.55rem;
}

.rail-value strong {
  font-size: 1.25rem;
}

.rail-value span {
  color: var(--pmp-success);
  font-size: 0.72rem;
  font-weight: 600;
}

.rail-chart .chart-line {
  height: 7.5rem;
  margin: 0.25rem 0 -1rem;
}

.portfolio-rail .provenance-note {
  margin-top: 0.35rem;
  line-height: 1.35;
}

/* —— Trademark registry folio —— */
.trademark-disclosure {
  border-left: 0.2rem solid var(--pmp-primary);
}

.trademark-kpis {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.65rem;
}

.trademark-kpis .kpi {
  min-height: 8.25rem;
}

.trademark-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 18rem;
  gap: 0.9rem;
  align-items: start;
}

.trademark-register {
  min-width: 0;
}

.trademark-toolbar {
  flex-wrap: wrap;
}

.trademark-toolbar input[type='search'] {
  min-width: min(22rem, 100%);
  flex: 1 1 18rem;
}

.trademark-table {
  min-width: 74rem;
  font-size: 0.74rem;
}

.trademark-table th,
.trademark-table td {
  padding: 0.62rem;
  vertical-align: middle;
}

.trademark-mark {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-width: 10rem;
  color: var(--pmp-ink);
  text-decoration: none;
}

.trademark-mark > span:nth-child(2) {
  display: flex;
  flex-direction: column;
  gap: 0.08rem;
}

.trademark-mark small {
  color: var(--pmp-ink-soft);
  font-size: 0.65rem;
  font-weight: 400;
}

.mark-sigil {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  flex: 0 0 2rem;
  border: 1px solid var(--pmp-border-strong);
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
  font-family: var(--pmp-font-mono);
  font-size: 0.68rem;
  font-weight: 700;
}

.class-badge {
  display: inline-flex;
  padding: 0.18rem 0.42rem;
  border: 1px solid var(--pmp-border-strong);
  border-radius: var(--pmp-radius-pill);
  background: var(--pmp-canvas);
  color: var(--pmp-ink);
  font-family: var(--pmp-font-mono);
  font-size: 0.68rem;
}

.tm-state {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.45rem;
  border-radius: var(--pmp-radius-pill);
  font-size: 0.67rem;
  font-weight: 650;
}

.tm-state.registered {
  background: var(--pmp-success-soft);
  color: var(--pmp-success);
}

.tm-state.published,
.tm-state.examining {
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
}

.tm-state.clearance {
  background: var(--pmp-warning-soft);
  color: var(--pmp-warning);
}

.next-action {
  color: var(--pmp-ink);
  font-size: 0.7rem;
  font-weight: 600;
}

.trademark-rail {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.trademark-rail .panel {
  padding: 0.85rem;
}

.trademark-facts {
  margin: 0;
}

.trademark-facts div {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.48rem 0;
  border-bottom: 1px solid var(--pmp-border);
}

.trademark-facts dt {
  color: var(--pmp-ink-soft);
  font-size: 0.7rem;
}

.trademark-facts dd {
  margin: 0;
  color: var(--pmp-ink);
  font-family: var(--pmp-font-mono);
  font-size: 0.72rem;
  font-weight: 650;
}

.trademark-facts dd.good {
  color: var(--pmp-success);
}

.trademark-actions {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.trademark-actions li {
  display: grid;
  grid-template-columns: 3.2rem 1fr;
  gap: 0.65rem;
  padding: 0.62rem 0;
  border-bottom: 1px solid var(--pmp-border);
}

.trademark-actions time {
  color: var(--pmp-primary);
  font-family: var(--pmp-font-mono);
  font-size: 0.66rem;
  font-weight: 650;
}

.trademark-actions span {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  color: var(--pmp-ink-soft);
  font-size: 0.69rem;
}

.trademark-actions strong {
  color: var(--pmp-ink);
  font-size: 0.72rem;
}

.evidence-chain {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.32rem;
}

.evidence-chain span {
  padding: 0.28rem 0.4rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-canvas);
  color: var(--pmp-ink);
  font-family: var(--pmp-font-mono);
  font-size: 0.61rem;
}

.evidence-chain i {
  color: var(--pmp-primary-muted);
  font-style: normal;
}

.trademark-rail .provenance-note {
  margin-top: 0.7rem;
  line-height: 1.4;
}

.detail-crumbs {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.8rem;
  color: var(--pmp-ink-soft);
  font-size: 0.76rem;
}

.detail-crumbs a {
  color: var(--pmp-primary);
  font-weight: 600;
  text-decoration: none;
}

.trademark-detail-hero {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 1.1rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
  background: var(--pmp-surface);
}

.detail-mark {
  width: 3.5rem;
  height: 3.5rem;
  font-size: 0.85rem;
}

.detail-eyebrow {
  color: var(--pmp-primary);
  font-size: 0.7rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.trademark-detail-hero h1 {
  margin: 0.1rem 0;
  font-size: 1.65rem;
  letter-spacing: -0.03em;
}

.trademark-detail-hero p,
.scope-statement p,
.trademark-detail-rail .muted {
  margin: 0;
  color: var(--pmp-ink-soft);
  font-size: 0.76rem;
}

.detail-status {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.trademark-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 20rem;
  gap: 0.9rem;
  align-items: start;
}

.trademark-detail-main,
.trademark-detail-rail {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.trademark-detail-main .panel,
.trademark-detail-rail .panel {
  padding: 1rem;
}

.detail-scope-grid {
  display: grid;
  grid-template-columns: minmax(16rem, 0.85fr) minmax(18rem, 1.15fr);
  gap: 1rem;
}

.detail-kv {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
  margin: 0;
}

.detail-kv div {
  padding-bottom: 0.55rem;
  border-bottom: 1px solid var(--pmp-border);
}

.detail-kv dt,
.scope-statement > span {
  display: block;
  color: var(--pmp-ink-soft);
  font-size: 0.68rem;
}

.detail-kv dd {
  margin: 0.12rem 0 0;
  color: var(--pmp-ink);
  font-size: 0.76rem;
  font-weight: 600;
}

.scope-statement {
  padding: 0.8rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-canvas);
}

.scope-statement strong {
  display: block;
  margin: 0.2rem 0 0.55rem;
  overflow-wrap: anywhere;
  font-family: var(--pmp-font-mono);
  font-size: 0.7rem;
}

.detail-chain {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.65rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.detail-chain li {
  display: flex;
  gap: 0.55rem;
  min-width: 0;
  padding: 0.7rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-canvas);
}

.detail-chain li > span {
  display: grid;
  place-items: center;
  width: 1.45rem;
  height: 1.45rem;
  flex: 0 0 1.45rem;
  border-radius: var(--pmp-radius-pill);
  background: var(--pmp-primary);
  color: var(--pmp-ink-inverse);
  font-size: 0.65rem;
  font-weight: 700;
}

.detail-chain div,
.detail-chain code {
  display: block;
  min-width: 0;
}

.detail-chain strong {
  font-size: 0.72rem;
}

.detail-chain code {
  margin-top: 0.2rem;
  overflow-wrap: anywhere;
  color: var(--pmp-ink-soft);
  font-size: 0.6rem;
}

.detail-next-action {
  display: block;
  margin-bottom: 0.45rem;
  color: var(--pmp-ink);
  font-size: 0.9rem;
}

.rail-deadlines {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.rail-deadlines li {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.rail-deadlines div {
  min-width: 0;
}

.rail-deadlines strong,
.rail-deadlines span {
  display: block;
  font-size: 0.68rem;
}

.rail-deadlines span {
  color: var(--pmp-ink-soft);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rail-dot {
  width: 0.5rem;
  height: 0.5rem;
  margin-top: 0.28rem;
  border-radius: 50%;
  background: var(--pmp-primary);
  flex: 0 0 auto;
}

.rail-dot.warn {
  background: var(--pmp-warning);
}

.rail-dot.danger {
  background: var(--pmp-danger);
}

.banner-warn {
  margin-bottom: 1rem;
  padding: 0.75rem 1rem;
  border-radius: var(--pmp-radius-card);
  background: var(--pmp-warning-soft);
  color: var(--pmp-warning);
  font-size: 0.8125rem;
}

.wizard-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.wizard-step {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 0.7rem;
  border-radius: var(--pmp-radius-pill);
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--pmp-ink-soft);
}

.wizard-step.active {
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
  border-color: transparent;
}

.wizard-step .n {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--pmp-canvas);
  font-size: 0.6875rem;
}

.field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  margin-bottom: 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--pmp-ink-soft);
}

.field input,
.field select,
.field textarea {
  font-weight: 400;
  color: var(--pmp-ink);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  padding: 0.5rem 0.65rem;
  background: var(--pmp-surface);
}

.simple-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  font-size: 0.8125rem;
}

.simple-list li {
  padding: 0.55rem 0;
  border-bottom: 1px solid var(--pmp-border);
}

.simple-list li:last-child {
  border-bottom: 0;
}

.link-cards,
.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  gap: 0.85rem;
}

.link-card,
.market-card {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 1rem;
  border-radius: var(--pmp-radius-card);
  border: 1px solid var(--pmp-border);
  background: var(--pmp-surface);
  text-decoration: none;
  color: inherit;
}

.link-card:hover,
.market-card:hover {
  border-color: var(--pmp-primary-muted);
  box-shadow: 0 4px 14px color-mix(in srgb, var(--pmp-primary) 8%, transparent);
}

.link-card span,
.market-card span {
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0.25rem;
}

.cal-head {
  text-align: center;
  font-size: 0.65rem;
  font-weight: 700;
  color: var(--pmp-ink-soft);
  padding: 0.25rem;
}

.cal-cell {
  aspect-ratio: 1;
  border-radius: 0.4rem;
  border: 1px solid var(--pmp-border);
  background: var(--pmp-canvas);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 0.7rem;
  gap: 0.15rem;
}

.cal-cell.has-event {
  background: var(--pmp-primary-soft);
  border-color: transparent;
  color: var(--pmp-primary);
  font-weight: 700;
}

.cal-dot {
  width: 0.3rem;
  height: 0.3rem;
  border-radius: 50%;
  background: var(--pmp-primary);
}

.claim {
  margin: 0;
  white-space: pre-wrap;
  background: var(--pmp-canvas);
  padding: 0.85rem;
  border-radius: var(--pmp-radius-control);
  font-size: 0.8125rem;
  line-height: 1.45;
}

.body-sm {
  font-size: 0.8125rem;
  margin: 0.5rem 0 0;
}

/* Public / auth */
.public-shell {
  min-height: 100vh;
  background: var(--pmp-canvas);
}

.public-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.5rem;
  background: var(--pmp-surface);
  border-bottom: 1px solid var(--pmp-border);
}

.public-links {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: 0.875rem;
  font-weight: 600;
}

/* Excludes .btn so a nested button keeps its own ink. A bare `.public-links a`
   rule outranked `a.btn-primary` on source order and rendered the header call
   to action at 1.32:1 against its own fill. */
.public-links a:not(.btn) {
  text-decoration: none;
  color: var(--pmp-ink-soft);
}

.public-links a:not(.btn):hover {
  color: var(--pmp-primary);
}

.public-main {
  max-width: 56rem;
  margin: 0 auto;
  padding: 2.5rem 1.5rem;
}

.hero h1 {
  font-size: 2.25rem;
  letter-spacing: -0.03em;
  margin: 0.35rem 0 0.75rem;
}

.hero .eyebrow {
  color: var(--pmp-primary);
  font-weight: 700;
  font-size: 0.75rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.hero .lede {
  color: var(--pmp-ink-soft);
  font-size: 1.05rem;
  max-width: 36rem;
}

.auth-card {
  max-width: 24rem;
  margin: 2rem auto;
  padding: 1.5rem;
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
}

.auth-card h1 {
  margin: 0 0 0.35rem;
  font-size: 1.35rem;
}

.tabs button {
  cursor: pointer;
}

/* —— Public marketing + auth + legal —— */
.public-shell {
  width: 100%;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.public-main {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  flex: 1 1 auto;
  box-sizing: border-box;
}

/* Constrain copy blocks, not the whole public chrome */
.public-main > .page-stack {
  width: 100%;
  max-width: 80rem;
  margin: 0 auto;
  padding: 2rem 1.5rem 3rem;
  box-sizing: border-box;
}

.public-main > .page-stack.landing {
  max-width: none;
  padding: 0;
}

.public-main > .page-stack.landing > * {
  max-width: 80rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  box-sizing: border-box;
}

.public-main > .page-stack.landing > .hero-split,
.public-main > .page-stack.landing > .landing-features,
.public-main > .page-stack.landing > .landing-band {
  width: 100%;
  max-width: 80rem;
}

.public-top {
  position: sticky;
  top: 0;
  z-index: 20;
  backdrop-filter: blur(8px);
  background: color-mix(in srgb, var(--pmp-surface) 92%, transparent);
}

.public-links {
  flex-wrap: nowrap;
  gap: 0.75rem 1rem;
}

.public-nav-menu {
  display: flex;
  align-items: center;
  margin: 0;
}

.public-nav-menu__trigger {
  display: none;
}

/* Keep marketing links visible on desktop even when details is closed. */
.public-nav-menu > .public-links {
  display: flex;
  align-items: center;
}

.public-footer {
  border-top: 1px solid var(--pmp-border);
  background: var(--pmp-surface);
  padding: 2rem 1.5rem 1.25rem;
}

.public-footer-inner {
  max-width: 72rem;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.2fr 2fr;
  gap: 2rem;
}

.public-footer .nav-brand {
  padding: 0 0 0.5rem;
}

.footer-cols {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  font-size: 0.8125rem;
}

.footer-cols strong {
  display: block;
  margin-bottom: 0.5rem;
}

.footer-cols a {
  display: block;
  color: var(--pmp-ink-soft);
  text-decoration: none;
  margin: 0.25rem 0;
}

.footer-cols a:hover {
  color: var(--pmp-primary);
}

.public-footer-note {
  max-width: 72rem;
  margin: 1.5rem auto 0;
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.hero-split {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 2rem;
  align-items: start;
  margin-bottom: 2rem;
}

.hero-copy h1 {
  font-size: clamp(2rem, 4vw, 2.75rem);
  line-height: 1.1;
  letter-spacing: -0.03em;
  margin: 0.5rem 0 1rem;
}

.hero-checks {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--pmp-ink-soft);
}

.hero-checks li {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.hero-checks svg {
  width: 1rem !important;
  height: 1rem !important;
  color: var(--pmp-success);
}

.hero-kpis {
  grid-template-columns: 1fr;
}

.landing-features {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
  margin: 1.5rem 0 2rem;
}

.feature-card {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  padding: 1.1rem;
  border-radius: var(--pmp-radius-card);
  border: 1px solid var(--pmp-border);
  background: var(--pmp-surface);
  text-decoration: none;
  color: inherit;
}

.feature-card:hover {
  border-color: var(--pmp-primary-muted);
  box-shadow: 0 8px 24px rgb(79 70 229 / 8%);
}

.feature-icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.65rem;
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
  display: grid;
  place-items: center;
}

.feature-icon svg {
  width: 1.125rem !important;
  height: 1.125rem !important;
}

.feature-card span:last-child {
  font-size: 0.8125rem;
  color: var(--pmp-ink-soft);
}

.landing-band {
  margin: 1.5rem 0;
}

.landing-band h2 {
  margin: 0 0 0.5rem;
  font-size: 1.35rem;
}

.auth-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  align-items: start;
  max-width: 56rem;
  margin: 0 auto;
}

.auth-layout-single {
  grid-template-columns: minmax(0, 26rem);
  justify-content: center;
}

.auth-panel,
.auth-aside {
  padding: 1.5rem;
}

.auth-panel h1 {
  margin: 0 0 0.35rem;
  font-size: 1.75rem;
  letter-spacing: -0.02em;
}

.auth-error {
  margin: 0 0 1rem;
  padding: 0.75rem;
  border: 1px solid var(--pmp-danger);
  border-radius: var(--pmp-radius-control);
  color: var(--pmp-danger);
  background: var(--pmp-danger-soft);
}

.backup-code-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.4rem;
  margin-top: 0.75rem;
}

.backup-code-grid code,
.auth-note code {
  display: block;
  overflow-wrap: anywhere;
  font-family: var(--pmp-font-mono);
}

.tenant-switcher {
  display: grid;
  gap: 0.35rem;
  color: var(--pmp-ink-soft);
}

.tenant-switcher select {
  width: 100%;
  min-width: 0;
  color: var(--pmp-ink);
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
}

.locale-switcher {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--pmp-ink-soft);
}

.locale-switcher select {
  min-width: 6.5rem;
  color: var(--pmp-ink);
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  padding: 0.3rem 0.45rem;
  font: inherit;
}

.nav-signout {
  width: 100%;
  margin-top: 0.5rem;
  padding: 0.4rem 0;
  color: var(--pmp-ink-soft);
  background: transparent;
  border: 0;
  text-align: left;
  cursor: pointer;
}

.nav-account-email {
  overflow: hidden;
  margin-top: 0.55rem;
  color: var(--pmp-ink-soft);
  font-family: var(--pmp-font-mono);
  font-size: 0.68rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-inline-form,
.admin-grant-form {
  display: grid;
  gap: 0.75rem;
  align-items: end;
  margin-bottom: 1rem;
}

.admin-inline-form {
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
}

.admin-grant-form {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.policy-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.policy-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  align-items: end;
  margin-bottom: 1rem;
}

.policy-card {
  display: grid;
  gap: 0.45rem;
  min-width: 0;
  padding: 0.75rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-canvas);
}

.policy-card code {
  overflow-wrap: anywhere;
  font-family: var(--pmp-font-mono);
}

@media (max-width: 800px) {
  .admin-inline-form,
  .admin-grant-form,
  .policy-grid,
  .policy-controls,
  .backup-code-grid {
    grid-template-columns: 1fr;
  }
}

.text-primary {
  color: var(--pmp-primary);
}

.auth-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0.5rem 0 1rem;
  font-size: 0.8125rem;
}

.auth-two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}

.check-inline {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--pmp-ink-soft);
  margin: 0.75rem 0;
}

.check-inline input[type='checkbox'] {
  flex: 0 0 1rem;
  width: 1rem;
  height: 1rem;
  min-height: 0;
  margin: 0.1rem 0 0;
  padding: 0;
  accent-color: var(--pmp-primary);
}

.check-inline-copy {
  min-width: 0;
  line-height: 1.45;
}

.check-inline-copy a {
  color: var(--pmp-primary);
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

.btn-block {
  width: 100%;
  margin: 0.35rem 0;
}

.auth-divider {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
  margin: 1rem 0;
}

.auth-divider::before,
.auth-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--pmp-border);
}

.center {
  text-align: center;
}

.auth-aside h2 {
  margin: 1rem 0 0.35rem;
  font-size: 1.15rem;
}

.auth-aside-card {
  padding: 1rem;
  border-radius: var(--pmp-radius-card);
  background: var(--pmp-primary-soft);
  margin-bottom: 1rem;
}

.auth-aside .simple-list li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.auth-aside .simple-list svg {
  width: 1rem !important;
  height: 1rem !important;
  color: var(--pmp-primary);
  flex-shrink: 0;
}

.legal-doc {
  max-width: 48rem;
  margin: 0 auto;
}

.legal-doc h1 {
  font-size: 1.75rem;
  margin: 0 0 0.5rem;
}

.legal-section {
  margin-bottom: 0.85rem;
}

.legal-section h2 {
  margin: 0 0 0.35rem;
  font-size: 1rem;
}

.legal-section p {
  margin: 0;
  font-size: 0.875rem;
  color: var(--pmp-ink-soft);
}

.legal-section p + p,
.legal-section p + ul,
.legal-section p + ol,
.legal-section ul + p,
.legal-section ol + p,
.legal-section blockquote + p,
.legal-section p + blockquote,
.legal-section p + table {
  margin-top: 0.6rem;
}

.legal-section h3 {
  margin: 0.75rem 0 0.25rem;
  font-size: 0.9rem;
}

.legal-section ul,
.legal-section ol {
  margin: 0;
  padding-left: 1.25rem;
  font-size: 0.875rem;
  color: var(--pmp-ink-soft);
}

.legal-ack {
  margin: 0;
  padding: 0.5rem 0.75rem;
  border-left: 3px solid var(--pmp-border-strong);
  font-size: 0.875rem;
}

.legal-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8125rem;
}

.legal-table th,
.legal-table td {
  padding: 0.35rem 0.5rem;
  border: 1px solid var(--pmp-border);
  text-align: left;
  vertical-align: top;
}

@media (max-width: 1180px) {
  .portfolio-layout {
    grid-template-columns: 1fr;
  }

  .trademark-layout {
    grid-template-columns: 1fr;
  }

  .trademark-detail-grid {
    grid-template-columns: 1fr;
  }

  .trademark-rail,
  .trademark-detail-rail {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .portfolio-rail {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .portfolio-toolbar {
    flex-wrap: wrap;
  }

  .record-hero,
  .record-hero-facts,
  .record-summary-metrics,
  .record-side-stack,
  .live-evidence-grid {
    grid-template-columns: 1fr;
  }

  .record-hero {
    flex-direction: column;
  }

  .record-hero-right {
    align-items: flex-start;
  }

  .record-summary-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .record-hero-facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .record-overview-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      'biblio'
      'relationships'
      'graph'
      'side'
      'timeline'
      'events';
  }

  .record-relationships,
  .record-side-stack {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .hero-split,
  .auth-layout,
  .landing-features,
  .public-footer-inner {
    grid-template-columns: 1fr;
  }

  .public-links .btn {
    width: auto;
  }
}

@media (max-width: 760px) {
  .public-top {
    gap: 0.75rem;
    padding-inline: 1rem;
  }

  .public-nav-menu {
    position: relative;
    margin-left: auto;
    flex-shrink: 0;
  }

  .public-nav-menu__trigger {
    display: list-item;
    list-style: none;
    cursor: pointer;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.2;
    padding: 0.45rem 0.75rem;
    border: 1px solid var(--pmp-border);
    border-radius: var(--pmp-radius-pill);
    color: var(--pmp-ink);
    background: var(--pmp-surface);
  }

  .public-nav-menu__trigger::-webkit-details-marker {
    display: none;
  }

  .public-nav-menu:not([open]) .public-links {
    display: none;
  }

  .public-nav-menu[open] .public-links {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 0.15rem;
    position: absolute;
    right: 0;
    top: calc(100% + 0.35rem);
    z-index: 30;
    min-width: 11.5rem;
    padding: 0.45rem;
    background: var(--pmp-surface);
    border: 1px solid var(--pmp-border);
    border-radius: var(--pmp-radius-card);
    box-shadow: 0 12px 32px color-mix(in srgb, var(--pmp-ink) 12%, transparent);
  }

  .public-nav-menu[open] .public-links a {
    padding: 0.5rem 0.65rem;
    border-radius: var(--pmp-radius-control);
  }

  .public-nav-menu[open] .public-links a:not(.btn):hover {
    background: color-mix(in srgb, var(--pmp-primary) 8%, transparent);
  }

  .public-nav-menu[open] .public-links .btn {
    margin-top: 0.25rem;
    justify-content: center;
    width: 100%;
  }

  .split-pane--horizontal > .split-pane__pane--left {
    flex: 0 0 4.25rem;
    width: 4.25rem;
    min-width: 4.25rem;
    max-width: 4.25rem;
  }

  .nav-label,
  .nav-item .badge,
  .nav-foot,
  .nav-brand .wordmark,
  .collapsible-sidebar__toggle,
  .split-pane__divider {
    display: none;
  }

  .nav-inner {
    padding-inline: 0.5rem;
  }

  .nav-brand,
  a.nav-item,
  .nav-inner a.nav-item {
    justify-content: center;
    padding-inline: 0.5rem;
  }

  .topbar {
    padding-inline: 0.75rem;
  }

  .topbar-search {
    margin: 0;
  }

  .page {
    padding: 1rem;
  }

  .portfolio-rail,
  .trademark-rail,
  .trademark-detail-rail,
  .trademark-kpis,
  .record-relationships,
  .record-side-stack,
  .record-hero-facts,
  .record-summary-metrics {
    grid-template-columns: 1fr;
  }

  .trademark-detail-hero,
  .detail-scope-grid,
  .detail-kv,
  .detail-chain {
    grid-template-columns: 1fr;
  }

  .detail-status {
    flex-wrap: wrap;
  }

  .record-title {
    flex-wrap: wrap;
  }

  .patent-graph {
    min-width: 36rem;
  }

  .record-overview-grid > .panel:nth-child(3) {
    overflow-x: auto;
  }
}

@media (max-width: 360px) {
  .head-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .head-actions .btn {
    width: 100%;
    height: auto;
    min-height: 2.25rem;
    padding-block: 0.55rem;
  }
}
/* ————————————————————————————————————————————————————————————
   Skip link, screen-reader text and focus visibility
   ———————————————————————————————————————————————————————————— */

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: absolute;
  left: 0.5rem;
  top: -3rem;
  z-index: 60;
  padding: 0.5rem 0.85rem;
  background: var(--pmp-primary);
  color: var(--pmp-ink-inverse);
  border-radius: var(--pmp-radius-control);
  font-size: 0.8125rem;
  font-weight: 600;
  text-decoration: none;
  transition: top 0.12s ease-in;
}

.skip-link:focus-visible {
  top: 0.5rem;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--pmp-primary);
  outline-offset: 2px;
  border-radius: 0.2rem;
}

/* ————————————————————————————————————————————————————————————
   Command palette
   ———————————————————————————————————————————————————————————— */

.modal-backdrop.palette-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: none;
  justify-content: center;
  align-items: flex-start;
  padding: 6rem 1rem 2rem;
  background: color-mix(in srgb, var(--pmp-ink) 42%, transparent);
}

.modal-backdrop.palette-backdrop.open {
  display: flex;
}

.modal.palette {
  width: min(40rem, 100%);
  max-height: min(28rem, 80vh);
  display: flex;
  flex-direction: column;
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
  box-shadow: 0 24px 60px color-mix(in srgb, var(--pmp-ink) 22%, transparent);
  overflow: hidden;
}

.palette-field {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.85rem 1rem;
  border-bottom: 1px solid var(--pmp-border);
}

.palette-input {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: 0.9375rem;
  color: var(--pmp-ink);
}

.palette-input:focus {
  outline: none;
}

.palette-hint {
  padding: 0.1rem 0.4rem;
  border: 1px solid var(--pmp-border);
  border-radius: 0.35rem;
  background: var(--pmp-canvas);
  font-size: 0.6875rem;
  font-family: inherit;
  color: var(--pmp-ink-soft);
}

.palette-list {
  flex: 1;
  margin: 0;
  padding: 0.35rem;
  list-style: none;
  overflow-y: auto;
}

.palette-option {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.55rem 0.7rem;
  border-radius: var(--pmp-radius-control);
  cursor: pointer;
}

.palette-option.active {
  background: var(--pmp-primary-soft);
}

.palette-label {
  font-weight: 600;
  color: var(--pmp-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.palette-detail {
  flex: 1;
  min-width: 0;
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.palette-group {
  flex-shrink: 0;
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--pmp-ink-soft);
  padding: 0.1rem 0.45rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-pill);
}

.palette-empty,
.palette-status {
  padding: 0.9rem 1rem;
  margin: 0;
  font-size: 0.8125rem;
  color: var(--pmp-ink-soft);
}

.palette-status {
  border-top: 1px solid var(--pmp-border);
}

/* ————————————————————————————————————————————————————————————
   Provenance strip
   ———————————————————————————————————————————————————————————— */

.projection-strip .origin-detail {
  color: var(--pmp-ink-soft);
}

.projection-strip.origin-fixture {
  border-left: 3px solid var(--pmp-warning);
}

.projection-strip.origin-live,
.projection-strip.origin-mixed {
  border-left: 3px solid var(--pmp-success);
}

/* ————————————————————————————————————————————————————————————
   Stat row, charts and lifecycle bars
   ———————————————————————————————————————————————————————————— */

.stat-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  gap: 0.75rem;
}

.stat {
  padding: 0.85rem 1rem;
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
}

.stat strong {
  display: block;
  font-size: 1.5rem;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}

.stat span {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.chart-line,
.chart-bars {
  width: 100%;
  height: auto;
  display: block;
}

.chart-line .axis-y,
.chart-bars .axis-y {
  font-size: 9px;
  fill: var(--pmp-ink-soft);
  text-anchor: end;
}

/* No text-anchor here: the charts set it per label so the first and last
   labels anchor inward instead of overflowing the viewBox. A CSS declaration
   would outrank that presentation attribute. */
.chart-line .axis-x,
.chart-bars .axis-x {
  font-size: 9px;
  fill: var(--pmp-ink-soft);
}

.chart-caption {
  margin: 0.6rem 0 0;
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.donut-svg {
  width: 10.5rem;
  height: 10.5rem;
  flex-shrink: 0;
}

.donut-value {
  font-size: 22px;
  font-weight: 700;
  fill: var(--pmp-ink);
}

.donut-label {
  font-size: 9px;
  fill: var(--pmp-ink-soft);
}

.lifecycle-bars {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.7rem;
}

.lifecycle-bars li {
  display: grid;
  grid-template-columns: 9rem 1fr 3rem;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.8125rem;
}

.lifecycle-track {
  height: 0.55rem;
  border-radius: var(--pmp-radius-pill);
  background: var(--pmp-canvas);
  overflow: hidden;
}

.lifecycle-fill {
  display: block;
  height: 100%;
  border-radius: var(--pmp-radius-pill);
}

.lifecycle-count {
  text-align: right;
  font-variant-numeric: tabular-nums;
  color: var(--pmp-ink-soft);
}

.cell-meta {
  display: block;
  margin-top: 0.15rem;
  font-size: 0.6875rem;
  color: var(--pmp-ink-soft);
}

/* ————————————————————————————————————————————————————————————
   Settings preferences
   ———————————————————————————————————————————————————————————— */

.pref-group {
  margin: 0;
  padding: 0;
  border: 0;
}

.pref-group legend {
  padding: 0;
  font-weight: 600;
  font-size: 0.875rem;
  color: var(--pmp-ink);
}

.pref-hint {
  margin: 0.2rem 0 0.7rem;
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.pref-option {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.45rem 0.1rem;
  font-size: 0.8125rem;
  cursor: pointer;
}

.pref-label {
  font-weight: 500;
}

.pref-sample {
  margin-left: auto;
  font-family: var(--pmp-font-mono);
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.pref-toggles {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.85rem;
}

.pref-toggle {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  cursor: pointer;
}

.pref-toggle > span {
  display: block;
}

.pref-toggle .pref-hint {
  margin: 0.15rem 0 0;
}

/* ————————————————————————————————————————————————————————————
   Landing proof list, pricing and auth notice
   ———————————————————————————————————————————————————————————— */

.hero-proof {
  margin: 1.75rem 0 0;
  padding: 1.1rem 0 0;
  border-top: 1px solid var(--pmp-border);
  display: grid;
  gap: 0.7rem;
}

.hero-proof > div {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  font-size: 0.875rem;
}

.hero-proof dt {
  font-weight: 650;
  color: var(--pmp-ink);
}

.hero-proof dd {
  margin: 0;
  color: var(--pmp-ink-soft);
}

.pricing-card {
  gap: 0.5rem;
}

.pricing-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.pricing-price {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 650;
  line-height: 1.1;
}

.pricing-cadence {
  margin: 0;
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.pricing-includes {
  margin: 0.6rem 0 0;
  padding-left: 1.1rem;
  display: grid;
  gap: 0.3rem;
  font-size: 0.8125rem;
  color: var(--pmp-ink-soft);
}

.auth-note {
  margin: 0 0 1.1rem;
  padding: 0.75rem 0.9rem;
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-warning-soft);
  border: 1px solid color-mix(in srgb, var(--pmp-warning) 35%, transparent);
  font-size: 0.8125rem;
  color: var(--pmp-ink);
}

/* ————————————————————————————————————————————————————————————
   Docket calendar
   ———————————————————————————————————————————————————————————— */

.cal-cell.empty {
  background: transparent;
  border-color: transparent;
}

.cal-cell.is-today {
  border-color: var(--pmp-primary);
  font-weight: 700;
}

.role-matrix td:not(:first-child),
.role-matrix th:not(:first-child) {
  text-align: center;
}

@media (max-width: 760px) {
  .topbar-search-label {
    display: none;
  }

  .topbar-search {
    flex: 0 0 auto;
    width: 2.25rem;
    justify-content: center;
    padding: 0;
  }

  .topbar-search kbd {
    display: none;
  }

  .lifecycle-bars li {
    grid-template-columns: 7rem 1fr 2.5rem;
  }
}

/* Landing waitlist — the tokkyodo.com public site renders this section statically. */
.waitlist {
  max-width: 42rem;
  margin: 0 auto;
}

.waitlist-form {
  display: grid;
  gap: 0.75rem;
  margin-top: 1rem;
}

.waitlist-form .field {
  margin: 0;
}

.waitlist-hp {
  position: absolute;
  left: -100vw;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.cf-turnstile {
  margin: 0.25rem 0;
}

.waitlist-status {
  margin: 0.25rem 0 0;
  font-size: 0.875rem;
}

.waitlist-status[data-state='ok'] {
  color: var(--pmp-success);
}

.waitlist-status[data-state='error'] {
  color: var(--pmp-danger);
}

.waitlist-note {
  margin-top: 0.75rem;
}

/* ==== ./hydrogen-bridge.css ==== */
/**
 * Maps Tokkyodo's brand tokens onto Hydrogen's framework variable names.
 *
 * Hydrogen components read `--text`, `--border`, `--accents-1` and friends.
 * Tokkyodo's brand pack defines `--pmp-*`, generated from design/brand/tokens.json.
 * Without this file a Hydrogen component resolves its colours against
 * Hydrogen's own defaults -- which are a dark palette -- so a component
 * dropped into a Tokkyodo screen arrives with no surface, no border and no
 * hierarchy, and the fact is discovered by rendering it (#247).
 *
 * Load order matters and is fixed in app.css:
 *
 *   1. hydrogen/css        framework chrome and its default variables
 *   2. ./styles.css        Tokkyodo brand tokens and every selector Tokkyodo owns
 *   3. ./hydrogen-bridge.css   this file, last, so brand wins on variables
 *
 * Tokkyodo's own rules sit between the framework and this bridge deliberately.
 * Hydrogen and Tokkyodo both define `.btn`, `.badge`, `.card`, `.modal`, `.avatar`
 * and the `.split-pane` / `.collapsible-sidebar` families, plus the bare
 * `a`, `body`, `html`, `input`, `select` and `textarea` selectors -- 24 class
 * collisions and 6 element collisions. Equal specificity means the later
 * sheet wins, so Tokkyodo keeps every selector it already owned and Hydrogen
 * supplies chrome only where Tokkyodo defines none. This bridge changes no
 * selector; it only re-points variables.
 *
 * Every variable Hydrogen declares on :root is mapped here. Leaving one out
 * would let a single Hydrogen default survive into a Tokkyodo screen, which is the
 * failure this file exists to prevent -- so the list is exhaustive by
 * construction rather than by need.
 */

:root {
  /* Tokkyodo is a light product. Hydrogen's :root declares `color-scheme: dark`,
     which would flip native controls, scrollbars and form widgets even though
     Tokkyodo paints its own surfaces light. */
  color-scheme: light;

  /* Surfaces and ink. */
  --bg: var(--pmp-canvas);
  --text: var(--pmp-ink);
  --text-muted: var(--pmp-ink-soft);
  --border: var(--pmp-border);

  /* Hydrogen's neutral ramp, lightest to darkest. Tokkyodo's pack has no ramp of
     its own, so this is the brand's surface/border pair extended outward
     rather than five invented greys. */
  --accents-1: var(--pmp-surface);
  --accents-2: var(--pmp-canvas);
  --accents-3: var(--pmp-border);
  --accents-4: var(--pmp-border-strong);
  --accents-5: var(--pmp-ink-soft);
  --surface-hover: var(--pmp-primary-soft);

  /* Status. */
  --primary: var(--pmp-primary);
  --success: var(--pmp-success);
  --warning: var(--pmp-warning);
  --danger: var(--pmp-danger);

  /* Hydrogen's accessible-contrast set. Tokkyodo's palette is already the
     light-background pairing these exist to provide, so they map to the same
     tokens rather than to a second, unmanaged set of colours. */
  --text-accessible: var(--pmp-ink);
  --text-accessible-muted: var(--pmp-ink-soft);
  --link-accessible: var(--pmp-primary);
  --success-accessible: var(--pmp-success);
  --warning-accessible: var(--pmp-warning);
  --error-accessible: var(--pmp-danger);

  /* Typography and motion. Tokkyodo sets its own font-family on :root; --font-sans
     exists for components that read the variable directly. */
  --font-sans: Inter, Geist, 'IBM Plex Sans', system-ui, sans-serif;
  --font-mono: var(--pmp-font-mono);
  --transition: 0.15s ease;

  /* Component hooks Hydrogen exposes for theming without forking its CSS. */
  --hydrogen-card-padding: 1rem;
  --hydrogen-card-bg: var(--pmp-surface);
  --hydrogen-card-border: var(--pmp-border);
  --hydrogen-status-unknown-bg: var(--pmp-canvas);
  --hydrogen-status-unknown-text: var(--pmp-ink-soft);
  --hydrogen-status-stale-bg: var(--pmp-warning-soft);
  --hydrogen-status-stale-text: var(--pmp-warning);
  --hydrogen-avatar-bg: var(--pmp-primary-soft);
  --hydrogen-avatar-gradient-start: var(--pmp-primary);
  --hydrogen-avatar-gradient-end: var(--pmp-ai);
  --hydrogen-avatar-gradient-text: var(--pmp-ink-inverse);
}

/**
 * Hydrogen ships a `prefers-color-scheme: dark` block and a `[data-theme=dark]`
 * block that re-declare the variables above. Tokkyodo has one palette and no theme
 * toggle, so both are re-pointed at the same brand tokens: a Tokkyodo screen must
 * not change colour because of an operating-system setting the product does
 * not otherwise honour.
 */
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: light;
    --bg: var(--pmp-canvas);
    --text: var(--pmp-ink);
    --text-muted: var(--pmp-ink-soft);
    --border: var(--pmp-border);
    --accents-1: var(--pmp-surface);
    --accents-2: var(--pmp-canvas);
    --accents-3: var(--pmp-border);
    --accents-4: var(--pmp-border-strong);
    --accents-5: var(--pmp-ink-soft);
    --surface-hover: var(--pmp-primary-soft);
    --primary: var(--pmp-primary);
    --success: var(--pmp-success);
    --warning: var(--pmp-warning);
    --danger: var(--pmp-danger);
    --text-accessible: var(--pmp-ink);
    --text-accessible-muted: var(--pmp-ink-soft);
    --link-accessible: var(--pmp-primary);
    --success-accessible: var(--pmp-success);
    --warning-accessible: var(--pmp-warning);
    --error-accessible: var(--pmp-danger);
    --hydrogen-card-bg: var(--pmp-surface);
    --hydrogen-card-border: var(--pmp-border);
  }
}

/* ==== ./polish-surfaces.css ==== */
/* Shared surfaces: panels, KPI cards, tables, row lists, chart furniture. */

/* —— Panels and cards —— */
.panel,
.kpi,
.table-wrap {
  border-color: var(--pmp-border);
  box-shadow: var(--pmp-shadow-card);
}

.panel {
  padding: 1.15rem 1.25rem 1.25rem;
}

.panel-head {
  margin-bottom: 1rem;
}

.panel-head h2 {
  font-size: 0.9375rem;
  font-weight: 650;
  letter-spacing: -0.01em;
}

.panel-head .link {
  padding: 0.2rem 0.55rem;
  margin: -0.2rem -0.55rem -0.2rem 0;
  border-radius: var(--pmp-radius-pill);
  transition: background-color 0.12s ease;
}

.panel-head .link:hover {
  background: var(--pmp-primary-soft);
  text-decoration: none;
}

.panel-note {
  margin: 0.75rem 0 0;
  padding-top: 0.75rem;
  border-top: 1px solid var(--pmp-border);
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
}

.panel .empty-state {
  padding: 1.75rem 0.5rem;
}

.empty-state .empty-icon.tone-danger {
  background: var(--pmp-danger-soft);
  color: var(--pmp-danger);
}

/* —— KPI cards: icon beside label and value, footer says where the number came from —— */
.kpi-row {
  gap: 1rem;
  margin: 0;
}

.kpi {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-content: start;
  column-gap: 0.85rem;
  row-gap: 0.1rem;
  min-height: 0;
  padding: 1.1rem 1.15rem 0.95rem;
  color: inherit;
  text-decoration: none;
}

.kpi-top {
  display: contents;
}

.kpi-icon {
  grid-column: 1;
  grid-row: 1 / span 2;
  align-self: center;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: var(--pmp-radius-card);
}

.kpi-icon svg {
  width: 1.3rem;
  height: 1.3rem;
}

.kpi-label {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
  overflow: hidden;
  color: var(--pmp-ink-soft);
  font-size: 0.8125rem;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kpi-value {
  grid-column: 2;
  grid-row: 2;
  font-size: 1.875rem;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
}

.kpi-meta,
.kpi-delta,
.kpi-basis,
.kpi > .spark {
  grid-column: 1 / -1;
}

.kpi-meta {
  margin-top: 0.7rem;
  line-height: 1.35;
}

.kpi-delta {
  margin-top: 0.15rem;
}

.kpi-basis {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-top: 0.8rem;
  padding-top: 0.65rem;
  border-top: 1px solid var(--pmp-border);
  color: var(--pmp-primary);
  font-size: 0.75rem;
  font-weight: 600;
}

.kpi-basis svg {
  width: 0.9rem;
  height: 0.9rem;
  flex-shrink: 0;
  transition: transform 0.12s ease;
}

a.kpi {
  transition:
    border-color 0.12s ease,
    box-shadow 0.12s ease,
    transform 0.12s ease;
}

a.kpi:hover {
  border-color: var(--pmp-primary-muted);
  box-shadow: var(--pmp-shadow-lift);
  transform: translateY(-1px);
}

a.kpi:hover .kpi-basis svg {
  transform: translateX(2px);
}

a.kpi:focus-visible {
  outline: none;
  border-color: var(--pmp-primary);
  box-shadow: var(--pmp-ring);
}

/* —— Tables —— */
.table-wrap {
  max-height: min(40rem, calc(100vh - 11rem));
  overflow: auto;
}

table.data th {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 0.7rem 0.9rem;
  background: var(--pmp-canvas);
  box-shadow: inset 0 -1px 0 var(--pmp-border);
  border-bottom: 0;
  font-size: 0.6875rem;
  font-weight: 650;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

table.data td {
  padding: 0.8rem 0.9rem;
}

table.data tbody tr {
  transition: background-color 0.1s ease;
}

table.data tbody tr:hover td {
  background: var(--pmp-primary-soft);
}

table.data tr:last-child td {
  border-bottom: 0;
}

table.data a {
  color: var(--pmp-primary);
  font-weight: 600;
  text-decoration: none;
}

table.data a:hover {
  text-decoration: underline;
}

.table-foot {
  background: var(--pmp-surface);
}

/* —— Lists inside panels —— */
.deadline-list,
.activity-list,
.insight-list,
.attention-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.deadline-list li,
.activity-list li,
.attention-list li {
  align-items: center;
  padding: 0.7rem 0;
  border-bottom: 1px solid var(--pmp-border);
}

.activity-list li,
.attention-list li {
  padding: 0;
}

.deadline-list li:last-child,
.activity-list li:last-child,
.attention-list li:last-child {
  border-bottom: 0;
}

.date-pill {
  display: grid;
  place-content: center;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-primary-soft);
}

.date-pill.warn {
  background: var(--pmp-warning-soft);
}

.date-pill.danger {
  background: var(--pmp-danger-soft);
}

.item-body strong {
  font-size: 0.8125rem;
}

.item-body span {
  display: block;
  margin-top: 0.1rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.item-body .item-rule {
  font-family: var(--pmp-font-mono);
  font-size: 0.6875rem;
}

.attention-list .item-body span {
  white-space: normal;
}

.row-link {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  width: 100%;
  padding: 0.7rem 0.5rem;
  margin: 0 -0.5rem;
  border-radius: var(--pmp-radius-control);
  color: inherit;
  text-decoration: none;
  transition: background-color 0.1s ease;
}

.row-link:hover {
  background: var(--pmp-canvas);
}

.row-icon {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  flex-shrink: 0;
  border-radius: var(--pmp-radius-control);
}

.row-icon svg {
  width: 1rem;
  height: 1rem;
}

.row-icon.indigo {
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
}

.row-icon.blue {
  background: var(--pmp-primary-soft);
  color: var(--pmp-info);
}

.row-icon.green,
.row-icon.tone-info {
  background: var(--pmp-success-soft);
  color: var(--pmp-success);
}

.row-icon.amber,
.row-icon.tone-warn {
  background: var(--pmp-warning-soft);
  color: var(--pmp-warning);
}

.row-icon.tone-danger {
  background: var(--pmp-danger-soft);
  color: var(--pmp-danger);
}

.row-icon.tone-ai {
  background: var(--pmp-ai-soft);
  color: var(--pmp-ai);
}

.row-chevron {
  display: grid;
  flex-shrink: 0;
  color: var(--pmp-ink-soft);
}

.row-chevron svg {
  width: 1rem;
  height: 1rem;
}

.row-link:hover .row-chevron {
  color: var(--pmp-primary);
}

.ai-tag,
.item-body .ai-tag {
  display: inline-block;
  margin: 0 0 0 0.35rem;
  padding: 0 0.4rem;
  border-radius: var(--pmp-radius-pill);
  background: var(--pmp-ai-soft);
  color: var(--pmp-ai);
  font-size: 0.6875rem;
  font-weight: 600;
}

.legend .legend-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.donut-wrap {
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem 1.5rem;
}

.donut-wrap .donut-svg {
  width: 9.5rem;
  height: 9.5rem;
}

.donut-wrap .legend {
  min-width: 9rem;
  gap: 0.55rem;
  font-size: 0.8125rem;
}

.chart-bars .grid-line {
  stroke: var(--pmp-border);
  stroke-width: 1;
}

.chart-caption {
  line-height: 1.4;
}

/* A wide panel must not stretch its chart into a poster. */
.panel .chart-bars,
.panel .chart-line {
  max-height: 15rem;
}

/* A row of exactly five cards never leaves a hole: 3 + 2 on mid widths, 2 + 2 + 1 on narrow. */
@media (max-width: 1180px) {
  .kpi-row.five {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .kpi-row.five > .kpi {
    grid-column: span 2;
  }

  .kpi-row.five > .kpi:nth-child(n + 4) {
    grid-column: span 3;
  }
}

@media (max-width: 760px) {
  .kpi-row.five {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kpi-row.five > .kpi,
  .kpi-row.five > .kpi:nth-child(n + 4) {
    grid-column: auto;
  }

  .kpi-row.five > .kpi:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 560px) {
  .kpi-row.five {
    grid-template-columns: minmax(0, 1fr);
  }

  .kpi-row.five > .kpi:last-child {
    grid-column: auto;
  }
}

/* ==== ./polish-command.css ==== */
/* Command Center: onboarding, loading skeleton and the dashboard grid. */

/* ————————————————————————————————————————————————————————————
   Command Center
   ———————————————————————————————————————————————————————————— */

.cc-row {
  display: grid;
  gap: 1rem;
}

.cc-row-a {
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr);
}

.cc-row-b {
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
}

@media (max-width: 1180px) {
  .cc-row-a {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cc-row-a > :first-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 880px) {
  .cc-row-a,
  .cc-row-b {
    grid-template-columns: minmax(0, 1fr);
  }
}

.command-center .cc-row > .panel {
  display: flex;
  flex-direction: column;
}

.eyebrow {
  display: inline-block;
  margin-bottom: 0.5rem;
  color: var(--pmp-primary);
  font-size: 0.75rem;
  font-weight: 650;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* Empty tenant: onboarding. */
.cc-onboarding {
  display: grid;
  gap: 1.5rem;
  padding: 1.75rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
  background: linear-gradient(
    135deg,
    var(--pmp-primary-soft),
    color-mix(in srgb, var(--pmp-primary-soft) 35%, var(--pmp-surface))
  );
  box-shadow: var(--pmp-shadow-card);
}

.cc-onboarding-copy h2 {
  margin: 0;
  font-size: 1.375rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.cc-onboarding-copy p {
  max-width: 40rem;
  margin: 0.5rem 0 0;
  color: var(--pmp-ink-soft);
  font-size: 0.9375rem;
  line-height: 1.5;
}

.cc-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

@media (max-width: 960px) {
  .cc-steps {
    grid-template-columns: minmax(0, 1fr);
  }
}

.cc-step {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 1.15rem 1.2rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
  background: var(--pmp-surface);
  color: inherit;
  text-decoration: none;
  box-shadow: var(--pmp-shadow-card);
  transition:
    border-color 0.12s ease,
    box-shadow 0.12s ease,
    transform 0.12s ease;
}

.cc-step:hover {
  border-color: var(--pmp-primary-muted);
  box-shadow: var(--pmp-shadow-lift);
  transform: translateY(-1px);
}

.cc-step:focus-visible {
  outline: none;
  border-color: var(--pmp-primary);
  box-shadow: var(--pmp-ring);
}

.cc-step-index {
  position: absolute;
  top: 1rem;
  right: 1.1rem;
  color: var(--pmp-primary-muted);
  font-size: 0.75rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.cc-step-icon {
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  margin-bottom: 0.4rem;
  border-radius: var(--pmp-radius-card);
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
}

.cc-step-icon svg {
  width: 1.25rem;
  height: 1.25rem;
}

.cc-step strong {
  font-size: 0.9375rem;
  font-weight: 650;
}

.cc-step-body {
  flex: 1;
  color: var(--pmp-ink-soft);
  font-size: 0.8125rem;
  line-height: 1.45;
}

.cc-step-go {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.7rem;
  color: var(--pmp-primary);
  font-size: 0.8125rem;
  font-weight: 600;
}

.cc-step-go svg {
  width: 0.95rem;
  height: 0.95rem;
  transition: transform 0.12s ease;
}

.cc-step:hover .cc-step-go svg {
  transform: translateX(2px);
}

.cc-fills {
  padding: 1.15rem 1.25rem;
  border: 1px dashed var(--pmp-border-strong);
  border-radius: var(--pmp-radius-card);
}

.cc-fills h2 {
  margin: 0 0 0.75rem;
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
  font-weight: 650;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.cc-fills ul {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.9rem 1.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

@media (max-width: 1100px) {
  .cc-fills ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.cc-fills li {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  font-size: 0.8125rem;
}

.cc-fills li span {
  color: var(--pmp-ink-soft);
}

/* Loading skeleton. */
.skeleton-block {
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
  background: linear-gradient(
    100deg,
    var(--pmp-surface) 30%,
    color-mix(in srgb, var(--pmp-border) 60%, var(--pmp-surface)) 50%,
    var(--pmp-surface) 70%
  );
  background-size: 200% 100%;
  box-shadow: var(--pmp-shadow-card);
  animation: pmp-shimmer 1.4s ease-in-out infinite;
}

.kpi-skeleton {
  min-height: 7.5rem;
}

.panel-skeleton {
  min-height: 17rem;
}

.cc-skeleton {
  display: grid;
  gap: 1rem;
}

@keyframes pmp-shimmer {
  from {
    background-position: 100% 0;
  }

  to {
    background-position: -100% 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .skeleton-block {
    animation: none;
  }

  a.kpi,
  .cc-step,
  .btn {
    transition: none;
  }

  a.kpi:hover,
  .cc-step:hover {
    transform: none;
  }
}

/* ==== ./polish-shell.css ==== */
/* Shell polish: page frame, buttons, sidebar, topbar, source line, empty states, responsive rules. */

/* —— Source line: one quiet line under the page header, opens to facts —— */
.source-line {
  margin: -0.5rem 0 1rem;
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.source-line > summary {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  cursor: pointer;
  list-style: none;
  border-radius: var(--pmp-radius-pill);
  padding: 0.1rem 0.5rem 0.1rem 0.1rem;
}

.source-line > summary::-webkit-details-marker {
  display: none;
}

.source-line > summary:hover,
.source-line[open] > summary {
  color: var(--pmp-ink);
}

.source-dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: var(--pmp-success);
  box-shadow: 0 0 0 3px var(--pmp-success-soft);
}

.source-more {
  color: var(--pmp-primary);
  font-weight: 600;
}

.source-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 1.5rem;
  margin: 0.5rem 0 0;
  padding: 0.6rem 0.85rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-surface);
}

.source-facts div {
  display: flex;
  gap: 0.4rem;
}

.source-facts dt {
  font-weight: 600;
  color: var(--pmp-ink);
}

.source-facts dd {
  margin: 0;
}

/* —— Empty state: designed, with a next action —— */
.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.35rem;
  padding: 2.5rem 1.5rem;
  color: var(--pmp-ink-soft);
}

.empty-state .empty-icon {
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  margin-bottom: 0.4rem;
  border-radius: var(--pmp-radius-card);
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
}

.empty-state .empty-icon svg {
  width: 1.4rem;
  height: 1.4rem;
}

.empty-state :is(h1, h2, h3) {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  color: var(--pmp-ink);
}

.empty-state p {
  max-width: 34rem;
  margin: 0;
  font-size: 0.8125rem;
}

.empty-state .empty-action {
  margin-top: 0.85rem;
}

/* ————————————————————————————————————————————————————————————
   Shared surface language
   One shadow, one radius family, one type scale for every page.
   ———————————————————————————————————————————————————————————— */

:root {
  --pmp-shadow-card: 0 1px 2px color-mix(in srgb, var(--pmp-ink) 5%, transparent);
  --pmp-shadow-lift: 0 6px 18px color-mix(in srgb, var(--pmp-ink) 9%, transparent);
  --pmp-ring: 0 0 0 3px color-mix(in srgb, var(--pmp-primary) 22%, transparent);
  --pmp-nav-width: 16.5rem;
}

/* —— Page frame —— */
.page {
  padding: 1.75rem 2rem 2.5rem;
}

.page-stack {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-content: start;
  gap: var(--pmp-section-gap) 1.25rem;
}

.page-stack > * {
  grid-column: 1 / -1;
  min-width: 0;
}

/* Header text and its actions share the first row; everything else spans. */
.page-stack > .page-head {
  grid-column: 1;
  grid-row: 1;
}

.page-stack > .head-actions {
  grid-column: 2;
  grid-row: 1;
  align-self: start;
  margin: 0;
}

.page-stack.page-stack > .source-line {
  margin-top: -0.65rem;
}

.page-head {
  margin: 0;
}

.page-head h1,
.page-title {
  font-size: 1.625rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.025em;
}

.page-head .sub {
  max-width: 46rem;
  margin: 0.4rem 0 0;
  color: var(--pmp-ink-soft);
  font-size: 0.9375rem;
  line-height: 1.45;
}

.page-head .sub .accent {
  color: var(--pmp-primary);
  font-weight: 600;
}

.page-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

/* —— Buttons —— */
.btn {
  transition:
    background-color 0.12s ease,
    border-color 0.12s ease,
    box-shadow 0.12s ease;
}

.btn:hover {
  border-color: var(--pmp-border-strong);
}

.btn:active {
  background: var(--pmp-primary-soft);
}

.btn-primary:hover,
.btn-primary:active {
  border-color: transparent;
}

.btn-primary:active {
  background: var(--pmp-primary-hover);
}

.btn svg {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}

.btn:focus-visible {
  outline: none;
  box-shadow: var(--pmp-ring);
}

/* ————————————————————————————————————————————————————————————
   Shell: sidebar, topbar, avatar
   ———————————————————————————————————————————————————————————— */

/* Hydrogen pads the sidebar content; the nav owns its own padding. */
.collapsible-sidebar__sidebar-content {
  padding: 0;
}

.nav-inner {
  gap: 0;
  padding: 1rem 0.85rem 1rem;
}

.nav-brand {
  padding: 0.35rem 0.55rem 1.25rem;
}

.nav-scroll {
  gap: 1.1rem;
  padding-bottom: 0.5rem;
}

.nav-group {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.nav-section {
  margin: 0 0.55rem 0.35rem;
  color: var(--pmp-ink-soft);
  font-size: 0.6875rem;
  font-weight: 650;
  letter-spacing: 0.07em;
}

a.nav-item,
.nav-inner a.nav-item {
  gap: 0.7rem;
  min-height: 2.375rem;
  padding: 0.45rem 0.65rem;
  color: var(--pmp-ink-soft);
  font-weight: 500;
  transition:
    background-color 0.12s ease,
    color 0.12s ease;
}

a.nav-item svg,
.nav-inner a.nav-item svg {
  opacity: 0.9;
}

a.nav-item:hover,
.nav-inner a.nav-item:hover {
  background: var(--pmp-canvas);
  color: var(--pmp-ink);
}

a.nav-item.active,
.nav-inner a.nav-item.active {
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
  font-weight: 650;
}

a.nav-item:focus-visible {
  outline: none;
  box-shadow: var(--pmp-ring);
}

.nav-foot {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin-top: auto;
  padding: 0.85rem 0.15rem 0;
}

.nav-user {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-width: 0;
  padding: 0.5rem 0.55rem;
  border-radius: var(--pmp-radius-control);
  color: var(--pmp-ink);
  text-decoration: none;
  transition: background-color 0.12s ease;
}

.nav-user:hover {
  background: var(--pmp-canvas);
}

.nav-user .avatar {
  flex-shrink: 0;
}

.nav-user-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.25;
}

.nav-user-text strong,
.nav-user-text small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nav-user-text strong {
  font-size: 0.8125rem;
  font-weight: 650;
}

.nav-user-text small {
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
}

.nav-account-email {
  margin: 0 0.55rem;
}

.nav-signout {
  width: auto;
  margin: 0 0.55rem;
  padding: 0.25rem 0;
  font-size: 0.75rem;
  font-weight: 600;
}

.nav-signout:hover {
  color: var(--pmp-danger);
}

.tenant-switcher {
  margin: 0 0.55rem;
  font-size: 0.75rem;
}

.tenant-switcher select {
  height: 2rem;
  padding: 0 0.5rem;
}

/*
 * Collapse handle. It renders inside the sidebar pane, which clips its
 * overflow, so it is fixed to the viewport: that keeps it reachable when the
 * pane collapses to zero width.
 */
.collapsible-sidebar__toggle {
  position: fixed;
  top: 1.15rem;
  left: calc(var(--pmp-nav-width) - 2.25rem);
  bottom: auto;
  width: 1.625rem;
  height: 1.625rem;
  margin-left: 0;
  box-shadow: var(--pmp-shadow-card);
  transition:
    color 0.12s ease,
    border-color 0.12s ease;
}

.collapsible-sidebar__toggle:hover {
  border-color: var(--pmp-primary-muted);
  color: var(--pmp-primary);
}

.collapsible-sidebar--collapsed .collapsible-sidebar__toggle {
  left: 0.75rem;
  top: 0.95rem;
  margin-left: 0;
}

.topbar {
  gap: 0.75rem;
  padding: 0 2rem;
  justify-content: flex-end;
  box-shadow: 0 1px 0 var(--pmp-border);
  border-bottom: 0;
}

.topbar-search {
  flex: 0 1 23rem;
  margin: 0;
  height: 2.375rem;
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-surface);
  border-color: var(--pmp-border-strong);
  transition:
    border-color 0.12s ease,
    box-shadow 0.12s ease;
}

.topbar-search:hover {
  border-color: var(--pmp-primary-muted);
}

.topbar-search:focus-visible {
  outline: none;
  border-color: var(--pmp-primary);
  box-shadow: var(--pmp-ring);
}

.topbar-actions {
  margin-left: 0;
  gap: 0.25rem;
}

.icon-btn {
  transition: background-color 0.12s ease;
}

.icon-btn:hover {
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
}

.icon-btn svg {
  width: 1.15rem !important;
  height: 1.15rem !important;
}

.icon-btn .dot {
  top: 0.4rem;
  right: 0.45rem;
}

.avatar {
  flex-shrink: 0;
  letter-spacing: 0.02em;
  box-shadow: 0 0 0 2px var(--pmp-surface);
}

.icon-btn .avatar {
  width: 2rem;
  height: 2rem;
}

/* Command palette: group tags read as quiet labels. */
.palette-option.active .palette-group {
  border-color: var(--pmp-primary-muted);
  color: var(--pmp-primary);
}

.palette-input::placeholder {
  color: var(--pmp-ink-soft);
}

/* The sidebar is a fixed width; the resize handle has nothing to resize. */
.split-pane__divider {
  display: none;
}

/* ————————————————————————————————————————————————————————————
   Responsive
   ———————————————————————————————————————————————————————————— */

@media (max-width: 1100px) {
  .kpi-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .page {
    padding: 1.5rem 1.5rem 2rem;
  }

  .topbar {
    padding-inline: 1.5rem;
  }
}

@media (max-width: 760px) {
  .topbar-search {
    flex: 0 0 auto;
    width: 2.375rem;
    padding: 0;
    justify-content: center;
  }

  .page {
    padding: 1.25rem 1rem 2rem;
  }

  .page-stack {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-stack > .head-actions {
    grid-column: 1;
    grid-row: auto;
    justify-content: flex-start;
  }

  .page-head h1,
  .page-title {
    font-size: 1.375rem;
  }

  .kpi-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }

  .nav-user-text,
  .nav-account-email,
  .nav-signout,
  .tenant-switcher,
  .nav-section {
    display: none;
  }

  .nav-user {
    justify-content: center;
    padding-inline: 0;
  }

  .nav-scroll {
    gap: 0.5rem;
  }

  .topbar {
    padding-inline: 0.75rem;
  }
}

@media (max-width: 560px) {
  .kpi-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .panel {
    padding: 1rem;
  }

  .donut-wrap .donut-svg {
    width: 8rem;
    height: 8rem;
  }
}

/* ==== ./polish-portfolio.css ==== */
/* Area polish: portfolio, record detail, trademarks and prior-art research. */

@import './polish-portfolio-list.css';
@import './polish-record.css';
@import './polish-trademark.css';
@import './polish-prior-art.css';

/* ==== ./polish-workspaces.css ==== */
/* Area polish: workspaces (patents, applications, docket, tasks). Capture and claims live in their own files. */
@import './polish-capture.css';
@import './polish-filing.css';
@import './polish-claims.css';
@import './polish-docket.css';

/* —— Status chips beyond the base set —— */
.ws-page .chip.neutral {
  background: var(--pmp-canvas);
  color: var(--pmp-ink-soft);
  border: 1px solid var(--pmp-border);
}

.ws-page .chip.warn {
  background: var(--pmp-warning-soft);
  color: var(--pmp-warning);
}

.ws-page .chip.danger {
  background: var(--pmp-danger-soft);
  color: var(--pmp-danger);
}

.ws-page .chip.ai {
  background: var(--pmp-ai-soft);
  color: var(--pmp-ai);
}

/* —— Toolbar: search + single-choice filters —— */
.ws-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem 0.85rem;
  margin: 0;
}

.ws-search {
  flex: 1 1 14rem;
  min-width: 0;
  max-width: 22rem;
  height: 2.25rem;
  padding: 0 0.75rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-surface);
  color: var(--pmp-ink);
  font-size: 0.8125rem;
}

.ws-search:focus-visible,
.ws-page .field input:focus-visible,
.ws-page .field select:focus-visible,
.ws-page .field textarea:focus-visible {
  outline: 2px solid var(--pmp-primary);
  outline-offset: 1px;
  border-color: var(--pmp-primary);
}

.ws-segments {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.2rem;
  padding: 0.2rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-surface);
}

.ws-segment {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  height: 1.8rem;
  padding: 0 0.65rem;
  border: 0;
  border-radius: calc(var(--pmp-radius-control) - 0.15rem);
  background: transparent;
  color: var(--pmp-ink-soft);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
}

.ws-segment:hover {
  background: var(--pmp-canvas);
  color: var(--pmp-ink);
}

.ws-segment:focus-visible {
  outline: 2px solid var(--pmp-primary);
  outline-offset: 1px;
}

.ws-segment.active {
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
}

.ws-count {
  min-width: 1.15rem;
  padding: 0 0.3rem;
  border-radius: var(--pmp-radius-pill);
  background: var(--pmp-canvas);
  color: var(--pmp-ink-soft);
  font-size: 0.6875rem;
  font-variant-numeric: tabular-nums;
  text-align: center;
}

.ws-segment.active .ws-count {
  background: var(--pmp-surface);
  color: var(--pmp-primary);
}

/* —— Tables —— */
.ws-table th,
.ws-table td {
  vertical-align: top;
}

.ws-table td.ws-primary strong {
  display: block;
  color: var(--pmp-ink);
  font-weight: 600;
}

.ws-table td .cell-meta {
  max-width: 28rem;
}

.ws-table .ws-action {
  text-align: right;
  white-space: nowrap;
}

.ws-table tr.ws-open td {
  background: var(--pmp-canvas);
}

.ws-table tr.ws-detail td {
  padding: 0;
  background: var(--pmp-canvas);
}

.ws-deadline {
  display: block;
  color: inherit;
  text-decoration: none;
}

.ws-deadline strong {
  color: var(--pmp-ink);
  font-weight: 600;
}

.ws-deadline:hover strong {
  color: var(--pmp-primary);
}

.ws-no-match {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.6rem;
  padding: 2rem 1rem;
  color: var(--pmp-ink-soft);
  font-size: 0.8125rem;
}

.ws-no-match p {
  margin: 0;
}

.ws-links {
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
}

.ws-links .link-card {
  padding: 0.8rem 0.95rem;
}

/* —— Loading, error and form feedback —— */
.ws-loading {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
  padding: 1.25rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
  background: var(--pmp-surface);
}

.ws-loading-label {
  color: var(--pmp-ink-soft);
  font-size: 0.8125rem;
}

.ws-skeleton {
  display: block;
  height: 0.85rem;
  border-radius: var(--pmp-radius-pill);
  background: linear-gradient(90deg, var(--pmp-canvas), var(--pmp-border), var(--pmp-canvas));
  background-size: 200% 100%;
  animation: ws-shimmer 1.4s ease-in-out infinite;
}

.ws-skeleton.short {
  width: 55%;
}

@keyframes ws-shimmer {
  from {
    background-position: 200% 0;
  }
  to {
    background-position: -200% 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ws-skeleton {
    animation: none;
  }
}

.ws-error {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.85rem;
  padding: 1rem 1.15rem;
  border: 1px solid var(--pmp-danger-soft);
  border-left: 3px solid var(--pmp-danger);
  border-radius: var(--pmp-radius-card);
  background: var(--pmp-surface);
}

.ws-error strong {
  display: block;
  color: var(--pmp-ink);
  font-size: 0.875rem;
}

.ws-error p {
  margin: 0.2rem 0 0;
  color: var(--pmp-ink-soft);
  font-size: 0.8125rem;
}

.ws-form-error {
  margin: 0.75rem 0 0;
  padding: 0.6rem 0.8rem;
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-danger-soft);
  color: var(--pmp-danger);
  font-size: 0.8125rem;
}

.ws-run-result {
  margin: 0;
  padding: 0.6rem 0.85rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-surface);
  color: var(--pmp-ink-soft);
  font-size: 0.8125rem;
}

.ws-page .btn:focus-visible,
.ws-page .link-card:focus-visible {
  outline: 2px solid var(--pmp-primary);
  outline-offset: 2px;
}

.ws-page .btn[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

/* —— Responsive —— */
@media (max-width: 720px) {
  .ws-search {
    max-width: none;
    flex-basis: 100%;
  }

  .derive-form {
    grid-template-columns: minmax(0, 1fr);
  }

  /* Tables become stacked cards: no horizontal scroll, labels from the cell. */
  .ws-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
  }

  .ws-table,
  .ws-table tbody,
  table.data.ws-table tr,
  table.data.ws-table td {
    display: block;
    width: 100%;
  }

  table.data.ws-table tr {
    padding: 0.55rem 0.85rem;
    border-bottom: 1px solid var(--pmp-border);
  }

  table.data.ws-table tr:last-child {
    border-bottom: 0;
  }

  table.data.ws-table td {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.3rem 0;
    border: 0;
    text-align: right;
  }

  table.data.ws-table td::before {
    content: attr(data-label);
    flex: none;
    color: var(--pmp-ink-soft);
    font-size: 0.72rem;
    font-weight: 600;
    text-align: left;
  }

  table.data.ws-table td[data-label='']::before {
    content: none;
  }

  table.data.ws-table td.ws-primary {
    justify-content: flex-start;
    text-align: left;
  }

  table.data.ws-table td.ws-primary::before {
    content: none;
  }

  table.data.ws-table td .ws-cell {
    text-align: right;
  }

  table.data.ws-table tr.ws-detail {
    padding: 0;
  }

  table.data.ws-table tr.ws-detail td {
    display: block;
    text-align: left;
  }

  table.data.ws-table tr.ws-detail td::before {
    content: none;
  }
}

/* ==== ./polish-auth.css ==== */
/* Area polish: public marketing, account screens and legal pages. Brand tokens only. */

/* —— Account screens: split surface —— */
.auth-screen {
  box-sizing: border-box;
  width: 100%;
  max-width: 72rem;
  margin: 0 auto;
  padding: 2rem 1.5rem 3.5rem;
}

.auth-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  min-height: 36rem;
  overflow: hidden;
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: 1.1rem;
  box-shadow: 0 18px 48px color-mix(in srgb, var(--pmp-ink) 7%, transparent);
}

.auth-form-side {
  display: flex;
  align-items: center;
  padding: 2.75rem 3rem;
}

.auth-form-inner {
  width: 100%;
  max-width: 26rem;
  margin: 0 auto;
}

.auth-form-inner h1,
.auth-solo h1 {
  margin: 0 0 0.5rem;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.03em;
}

.auth-form-inner .sub,
.auth-solo .sub {
  margin: 0 0 1.5rem;
  color: var(--pmp-ink-soft);
  font-size: 0.9375rem;
  line-height: 1.55;
}

.auth-eyebrow {
  margin: 0 0 0.5rem;
  color: var(--pmp-primary);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* Fields */
.auth-field {
  gap: 0.4rem;
  margin-bottom: 1rem;
  color: var(--pmp-ink);
  font-size: 0.8125rem;
}

.auth-field input,
.auth-field select,
.auth-field textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: 2.75rem;
  padding: 0.6rem 0.85rem;
  font: inherit;
  font-weight: 400;
  font-size: 0.9375rem;
  border-radius: var(--pmp-radius-control);
  transition:
    border-color 120ms ease,
    box-shadow 120ms ease;
}

.auth-field input::placeholder,
.auth-field textarea::placeholder {
  color: var(--pmp-ink-soft);
  opacity: 0.75;
}

.auth-field input:focus-visible,
.auth-field select:focus-visible,
.auth-field textarea:focus-visible {
  outline: none;
  border-color: var(--pmp-primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--pmp-primary) 22%, transparent);
}

.auth-field textarea {
  min-height: 5.5rem;
  font-family: var(--pmp-font-mono);
  font-size: 0.8125rem;
  resize: vertical;
}

.auth-field input:disabled {
  background: var(--pmp-canvas);
  color: var(--pmp-ink-soft);
}

.auth-input {
  position: relative;
  display: block;
}

.auth-input-glyph {
  position: absolute;
  top: 50%;
  left: 0.8rem;
  display: grid;
  place-items: center;
  color: var(--pmp-ink-soft);
  transform: translateY(-50%);
  pointer-events: none;
}

.auth-input-glyph svg {
  width: 1.05rem !important;
  height: 1.05rem !important;
}

.auth-input input {
  padding-left: 2.6rem;
}

.auth-hint {
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
  font-weight: 400;
}

.auth-code {
  font-family: var(--pmp-font-mono);
  font-size: 1.25rem !important;
  letter-spacing: 0.35em;
  text-align: center;
}

.auth-form-inner .btn-block,
.auth-solo .btn-block {
  justify-content: center;
  height: 2.75rem;
  margin: 0.5rem 0;
  font-size: 0.9375rem;
}

.auth-form-inner .btn-block:disabled {
  cursor: progress;
  opacity: 0.7;
}

.auth-switch {
  margin: 1.5rem 0 0;
  color: var(--pmp-ink-soft);
  font-size: 0.875rem;
  text-align: center;
}

.auth-switch a,
.auth-solo a:not(.btn) {
  color: var(--pmp-primary);
  font-weight: 600;
  text-decoration: none;
}

.auth-switch a:hover {
  text-decoration: underline;
}

.auth-form-inner .check-inline {
  margin: 0.25rem 0 0.75rem;
  line-height: 1.45;
}

.auth-form-inner .check-inline input[type='checkbox'] {
  margin-top: 0.15rem;
}

.auth-note {
  background: var(--pmp-primary-soft);
  border: 1px solid color-mix(in srgb, var(--pmp-primary) 22%, transparent);
  line-height: 1.5;
}

.auth-error {
  font-size: 0.8125rem;
  line-height: 1.5;
}

.auth-divider {
  margin: 1.25rem 0 0.75rem;
  text-transform: lowercase;
}

/* Brand side */
.auth-brand-side {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.35rem;
  padding: 2.75rem 3rem;
  background:
    radial-gradient(
      28rem 20rem at 85% 0%,
      color-mix(in srgb, var(--pmp-primary-muted) 35%, transparent),
      transparent 70%
    ),
    linear-gradient(165deg, var(--pmp-primary-soft), var(--pmp-surface) 85%);
  border-left: 1px solid var(--pmp-border);
}

.auth-brand-side h2 {
  margin: 0.5rem 0 0;
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.auth-brand-lede {
  margin: 0.35rem 0 1.25rem;
  color: var(--pmp-ink-soft);
  font-size: 0.875rem;
  line-height: 1.6;
}

.auth-art {
  position: relative;
  height: 12.5rem;
  margin-bottom: 0.75rem;
}

.auth-art-ring {
  position: absolute;
  top: 50%;
  left: 50%;
  border: 1px solid color-mix(in srgb, var(--pmp-primary) 22%, transparent);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.ring-outer {
  width: 12rem;
  height: 12rem;
}

.ring-inner {
  width: 8rem;
  height: 8rem;
  background: color-mix(in srgb, var(--pmp-surface) 70%, transparent);
}

.auth-art-badge {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  width: 4.5rem;
  height: 4.5rem;
  color: var(--pmp-ink-inverse);
  background: linear-gradient(145deg, var(--pmp-primary), var(--pmp-primary-hover));
  border-radius: 1.3rem;
  box-shadow: 0 14px 30px color-mix(in srgb, var(--pmp-primary) 35%, transparent);
  transform: translate(-50%, -50%);
}

.auth-art-badge svg {
  width: 2rem !important;
  height: 2rem !important;
}

.auth-art-chip {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.7rem;
  color: var(--pmp-primary);
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: 0.75rem;
  box-shadow: 0 8px 20px color-mix(in srgb, var(--pmp-ink) 8%, transparent);
}

.auth-art-chip svg {
  width: 1rem !important;
  height: 1rem !important;
}

.auth-art-chip i {
  display: block;
  width: 3.25rem;
  height: 0.4rem;
  background: var(--pmp-border);
  border-radius: var(--pmp-radius-pill);
}

.chip-a {
  top: 0.5rem;
  left: 8%;
}

.chip-b {
  top: 2.5rem;
  right: 4%;
}

.chip-c {
  bottom: 0.25rem;
  left: 14%;
}

.auth-points {
  display: grid;
  gap: 0.9rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.auth-points li {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.auth-point-icon {
  display: grid;
  flex: 0 0 2.1rem;
  place-items: center;
  width: 2.1rem;
  height: 2.1rem;
  color: var(--pmp-primary);
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: 0.65rem;
}

.auth-point-icon svg {
  width: 1rem !important;
  height: 1rem !important;
}

.auth-point-copy {
  display: grid;
  gap: 0.1rem;
  min-width: 0;
}

.auth-point-copy strong {
  font-size: 0.875rem;
}

.auth-point-copy span {
  color: var(--pmp-ink-soft);
  font-size: 0.8125rem;
  line-height: 1.45;
}

/* Centered single card */
.auth-solo {
  box-sizing: border-box;
  max-width: 27rem;
  margin: 1.5rem auto 0;
  padding: 2.25rem 2.25rem 2rem;
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: 1.1rem;
  box-shadow: 0 18px 48px color-mix(in srgb, var(--pmp-ink) 7%, transparent);
}

.auth-solo-mark {
  display: inline-grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  margin-bottom: 1rem;
  background: var(--pmp-primary-soft);
  border-radius: 0.9rem;
}

.auth-solo .backup-code-grid code {
  padding: 0.3rem 0.5rem;
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: 0.4rem;
  font-size: 0.8125rem;
}

@media (max-width: 900px) {
  .auth-screen {
    padding: 1rem 1rem 2.5rem;
  }

  .auth-split {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .auth-form-side,
  .auth-brand-side {
    padding: 2rem 1.5rem;
  }

  .auth-brand-side {
    border-top: 1px solid var(--pmp-border);
    border-left: 0;
  }
}

@media (max-width: 560px) {
  .auth-art {
    display: none;
  }

  .auth-solo {
    padding: 1.75rem 1.25rem;
  }

  .auth-form-inner h1,
  .auth-solo h1 {
    font-size: 1.6rem;
  }
}

/* —— Landing —— */
.public-main > .page-stack.landing {
  background: radial-gradient(
    62rem 30rem at 85% 0%,
    color-mix(in srgb, var(--pmp-primary-soft) 90%, transparent),
    transparent 70%
  );
}

.public-main > .page-stack.landing > * {
  width: 100%;
}

.landing .hero-split {
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 3rem;
  align-items: center;
  margin: 0;
  padding-top: 3.5rem;
  padding-bottom: 2.5rem;
}

.landing .hero .eyebrow {
  margin: 0;
  letter-spacing: 0;
  text-transform: none;
}

.eyebrow-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.35rem 0.85rem 0.35rem 0.65rem;
  color: var(--pmp-primary);
  background: var(--pmp-primary-soft);
  border-radius: var(--pmp-radius-pill);
  font-size: 0.8125rem;
  font-weight: 600;
}

.eyebrow-pill svg {
  width: 0.95rem !important;
  height: 0.95rem !important;
}

.landing .hero-copy h1 {
  margin: 1.25rem 0 1.1rem;
  font-size: clamp(2rem, 3.3vw, 2.9rem);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -0.035em;
}

.hero-copy h1 .dot {
  color: var(--pmp-primary);
}

.landing .hero .lede {
  max-width: 33rem;
  margin: 0 0 1.75rem;
  color: var(--pmp-ink-soft);
  font-size: 1.0625rem;
  line-height: 1.65;
}

.hero-actions {
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 0.75rem;
}

.btn-lg {
  height: 2.9rem;
  padding: 0 1.4rem;
  font-size: 0.9375rem;
}

.btn-primary.btn-lg {
  box-shadow: 0 10px 22px color-mix(in srgb, var(--pmp-primary) 28%, transparent);
}

.landing .hero-checks {
  margin-top: 1.75rem;
  gap: 0.6rem 1.5rem;
}

/* Hero visual container */
.hero-visual {
  min-width: 0;
  margin: 0;
}

.hero-visual figcaption {
  margin-top: 0.75rem;
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
  text-align: center;
}

/* Feature cards */
.landing .landing-features {
  gap: 1rem;
  margin: 0;
  padding-top: 1rem;
  padding-bottom: 2.5rem;
}

.landing .feature-card {
  gap: 0.5rem;
  padding: 1.25rem;
  transition:
    transform 140ms ease,
    box-shadow 140ms ease,
    border-color 140ms ease;
}

.landing .feature-card:hover {
  border-color: var(--pmp-primary-muted);
  box-shadow: 0 14px 30px color-mix(in srgb, var(--pmp-primary) 12%, transparent);
  transform: translateY(-2px);
}

.landing .feature-card:focus-visible {
  outline: 2px solid var(--pmp-primary);
  outline-offset: 2px;
}

.landing .feature-card > strong {
  font-size: 1rem;
}

.landing .feature-card > span:last-child {
  line-height: 1.5;
}

.landing .feature-card::after {
  content: '→';
  margin-top: auto;
  padding-top: 0.5rem;
  color: var(--pmp-primary);
  font-weight: 600;
}

.feature-icon {
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 0.8rem;
}

.feature-icon.tone-info {
  color: var(--pmp-info);
  background: color-mix(in srgb, var(--pmp-info) 12%, var(--pmp-surface));
}

.feature-icon.tone-success {
  color: var(--pmp-success);
  background: var(--pmp-success-soft);
}

.landing .feature-icon svg {
  width: 1.2rem !important;
  height: 1.2rem !important;
}

/* Principles */
.landing-principles {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem;
  padding-top: 1.5rem;
  padding-bottom: 2.5rem;
}

.landing-principles article {
  display: grid;
  gap: 0.5rem;
  align-content: start;
}

.landing-principles h3 {
  margin: 0.35rem 0 0;
  font-size: 1.0625rem;
  letter-spacing: -0.01em;
}

.landing-principles p {
  margin: 0;
  color: var(--pmp-ink-soft);
  font-size: 0.875rem;
  line-height: 1.6;
}

/* Call to action and pricing */
.landing .landing-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  box-sizing: border-box;
  width: calc(100% - 3rem);
  max-width: calc(80rem - 3rem);
  margin: 1rem auto 3rem;
  padding: 2rem 2.25rem;
  background: linear-gradient(135deg, var(--pmp-primary-soft), var(--pmp-surface));
  border: 1px solid var(--pmp-border);
  border-radius: 1rem;
}

.landing .landing-cta h2 {
  margin: 0 0 0.5rem;
  font-size: 1.5rem;
  letter-spacing: -0.02em;
}

.landing .landing-cta .lede {
  max-width: 38rem;
  margin: 0;
  color: var(--pmp-ink-soft);
  line-height: 1.6;
}

.landing .landing-cta .page-actions {
  flex-wrap: wrap;
}

#pricing {
  padding-bottom: 4rem;
  scroll-margin-top: 5rem;
}

#features,
#solutions {
  scroll-margin-top: 5rem;
}

#pricing h2 {
  margin: 0 0 0.35rem;
  font-size: 1.5rem;
  letter-spacing: -0.02em;
}

#pricing > .muted {
  max-width: 40rem;
  margin: 0 0 1.5rem;
  font-size: 0.875rem;
  line-height: 1.55;
}

.pricing-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.pricing-card {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 1.35rem;
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
}

.pricing-card .pricing-price {
  margin-top: 0.5rem;
  font-size: 1.75rem;
  letter-spacing: -0.02em;
}

.pricing-card .pricing-includes {
  padding: 0.9rem 0 0;
  margin-top: 0.75rem;
  border-top: 1px solid var(--pmp-border);
  list-style: none;
}

.pricing-card .pricing-includes li {
  display: flex;
  gap: 0.5rem;
}

.pricing-card .pricing-includes li::before {
  content: '✓';
  color: var(--pmp-success);
  font-weight: 700;
}

@media (max-width: 1180px) {
  .landing .hero-split {
    gap: 2rem;
    padding-top: 2rem;
  }

  .landing .landing-features {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .landing .hero-split {
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
  }

  .landing-principles,
  .pricing-grid {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }

  .landing .landing-cta {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 640px) {
  .landing .landing-features {
    grid-template-columns: 1fr;
  }

  .hero-actions .btn {
    flex: 1 1 auto;
    justify-content: center;
  }
}

/* —— Legal pages —— */
.legal-page {
  box-sizing: border-box;
  width: 100%;
  max-width: 72rem;
  margin: 0 auto;
  padding: 2.5rem 1.5rem 3.5rem;
}

.legal-head {
  max-width: 46rem;
  margin-bottom: 2rem;
}

.legal-eyebrow {
  margin: 0 0 0.35rem;
  color: var(--pmp-primary);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.legal-head h1 {
  margin: 0 0 0.75rem;
  font-size: 2.25rem;
  font-weight: 700;
  letter-spacing: -0.03em;
}

.legal-intro {
  color: var(--pmp-ink-soft);
  font-size: 0.9375rem;
  line-height: 1.65;
}

.legal-intro p {
  margin: 0 0 0.6rem;
}

.legal-intro .lede {
  font-size: 1rem;
}

.legal-layout {
  display: grid;
  grid-template-columns: 15rem minmax(0, 46rem);
  gap: 2.5rem;
  align-items: start;
}

.legal-toc {
  position: sticky;
  top: 5.5rem;
  max-height: calc(100vh - 7rem);
  overflow: auto;
  padding-right: 0.5rem;
  font-size: 0.8125rem;
}

.legal-toc strong {
  display: block;
  margin-bottom: 0.6rem;
  color: var(--pmp-ink-soft);
  font-size: 0.6875rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.legal-toc ol {
  display: grid;
  gap: 0.1rem;
  margin: 0;
  padding: 0;
  list-style: none;
  border-left: 1px solid var(--pmp-border);
}

.legal-toc a {
  display: block;
  padding: 0.3rem 0 0.3rem 0.85rem;
  margin-left: -1px;
  color: var(--pmp-ink-soft);
  border-left: 2px solid transparent;
  line-height: 1.35;
  text-decoration: none;
}

.legal-toc a:hover {
  color: var(--pmp-primary);
  border-left-color: var(--pmp-primary);
}

.legal-body {
  display: grid;
  gap: 0.85rem;
  min-width: 0;
}

.legal-page .legal-section {
  padding: 1.35rem 1.5rem;
  scroll-margin-top: 5.5rem;
  overflow-x: auto;
}

.legal-page .legal-section h2 {
  margin: 0 0 0.6rem;
  font-size: 1.0625rem;
  letter-spacing: -0.01em;
}

.legal-page .legal-section p,
.legal-page .legal-section ul,
.legal-page .legal-section ol {
  color: var(--pmp-ink);
  font-size: 0.9rem;
  line-height: 1.7;
}

.legal-page .legal-section li + li {
  margin-top: 0.25rem;
}

.legal-page .legal-ack {
  background: var(--pmp-primary-soft);
  border-left: 3px solid var(--pmp-primary);
  border-radius: 0 var(--pmp-radius-control) var(--pmp-radius-control) 0;
  padding: 0.7rem 0.9rem;
}

.legal-page .legal-table {
  display: block;
  overflow-x: auto;
}

.legal-page .legal-table th {
  background: var(--pmp-canvas);
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.legal-foot {
  margin: 2rem 0 0;
  color: var(--pmp-ink-soft);
  font-size: 0.8125rem;
}

.legal-foot a {
  color: var(--pmp-primary);
  text-decoration: none;
}

.legal-foot a:hover {
  text-decoration: underline;
}

@media (max-width: 960px) {
  .legal-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .legal-toc {
    display: none;
  }

  .legal-page {
    padding: 1.5rem 1rem 2.5rem;
  }

  .legal-head h1 {
    font-size: 1.75rem;
  }
}

/* ==== ./polish-admin.css ==== */
/* Area polish: tenant administration and trade-secret vault. Brand tokens only. */

/* —— Summary tiles: each links to the list it was counted from —— */
.admin-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
}

.admin-stat {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding: 1rem 1.1rem;
  color: inherit;
  text-decoration: none;
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-card);
  transition:
    border-color 120ms ease,
    box-shadow 120ms ease;
}

.admin-stat:hover {
  border-color: var(--pmp-primary-muted);
  box-shadow: 0 8px 22px color-mix(in srgb, var(--pmp-primary) 10%, transparent);
}

.admin-stat:focus-visible {
  outline: 2px solid var(--pmp-primary);
  outline-offset: 2px;
}

.admin-stat-icon {
  display: grid;
  flex: 0 0 2.6rem;
  place-items: center;
  width: 2.6rem;
  height: 2.6rem;
  color: var(--pmp-primary);
  background: var(--pmp-primary-soft);
  border-radius: 0.8rem;
}

.admin-stat-icon svg {
  width: 1.2rem !important;
  height: 1.2rem !important;
}

.admin-stat-copy {
  display: grid;
  min-width: 0;
}

.admin-stat-label {
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
  font-weight: 600;
}

.admin-stat-value {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.admin-stat-basis {
  color: var(--pmp-ink-soft);
  font-size: 0.6875rem;
}

/* —— Two-column layout —— */
.admin-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 24rem;
  gap: 1rem;
  align-items: start;
}

.admin-main,
.admin-side {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
  min-width: 0;
}

.admin-page .panel-head h2 {
  font-size: 1rem;
}

.admin-sub {
  margin: 1.25rem 0 0.6rem;
  color: var(--pmp-ink-soft);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.admin-sub:first-child {
  margin-top: 0;
}

.admin-lede,
.admin-policy-floor,
.admin-footnote {
  margin: 0 0 1rem;
  color: var(--pmp-ink-soft);
  font-size: 0.8125rem;
  line-height: 1.55;
}

.admin-footnote {
  margin: 0.85rem 0 0;
  font-size: 0.75rem;
}

.admin-none {
  margin: 0 0 0.75rem;
  padding: 0.85rem 1rem;
  color: var(--pmp-ink-soft);
  background: var(--pmp-canvas);
  border: 1px dashed var(--pmp-border-strong);
  border-radius: var(--pmp-radius-control);
  font-size: 0.8125rem;
  line-height: 1.5;
}

/* —— Forms —— */
.admin-page .field {
  margin-bottom: 0.75rem;
}

.admin-page .field input,
.admin-page .field select,
.admin-page .field textarea,
.admin-page select {
  box-sizing: border-box;
  min-height: 2.25rem;
  font: inherit;
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--pmp-ink);
  background: var(--pmp-surface);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
}

.admin-page .field input,
.admin-page .field select {
  width: 100%;
  padding: 0.4rem 0.65rem;
}

.admin-page input:focus-visible,
.admin-page select:focus-visible {
  outline: none;
  border-color: var(--pmp-primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--pmp-primary) 22%, transparent);
}

.admin-page .btn:focus-visible,
.admin-add > summary:focus-visible {
  outline: 2px solid var(--pmp-primary);
  outline-offset: 2px;
}

.admin-page .btn-sm {
  height: 1.9rem;
  padding: 0 0.65rem;
  font-size: 0.75rem;
}

.admin-inline-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 11rem auto;
  gap: 0.75rem;
  align-items: end;
  margin-bottom: 1rem;
  padding: 0.9rem;
  background: var(--pmp-canvas);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
}

.admin-inline-form .field {
  margin-bottom: 0;
}

.admin-inline-form .btn {
  height: 2.25rem;
}

.admin-roles {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.9rem;
}

.admin-roles:empty {
  display: none;
}

.admin-role-chip {
  padding: 0.2rem 0.65rem;
  color: var(--pmp-ink-soft);
  background: var(--pmp-canvas);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-pill);
  font-size: 0.75rem;
}

.admin-role-chip b {
  color: var(--pmp-ink);
}

/* —— Tables —— */
.admin-table {
  min-width: 36rem;
}

.admin-page .table-wrap {
  margin-bottom: 0.5rem;
}

.admin-person {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
}

.admin-avatar {
  flex: 0 0 2.1rem;
  width: 2.1rem;
  height: 2.1rem;
  font-size: 0.6875rem;
}

.admin-person-copy {
  display: grid;
  min-width: 0;
}

.admin-person-copy .mono {
  overflow: hidden;
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
  text-overflow: ellipsis;
}

.admin-actions-cell {
  white-space: nowrap;
}

.admin-manage {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.admin-manage select {
  min-height: 1.9rem;
  padding: 0 0.4rem;
  font-size: 0.75rem;
}

.admin-you,
.admin-meta {
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
}

/* —— Row lists —— */
.admin-rows {
  display: grid;
  margin: 0 0 0.5rem;
  padding: 0;
  list-style: none;
}

.admin-rows li {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 0;
  border-bottom: 1px solid var(--pmp-border);
  font-size: 0.8125rem;
}

.admin-rows li:last-child {
  border-bottom: 0;
}

.admin-row-main {
  display: grid;
  flex: 1;
  min-width: 0;
}

.admin-row-main strong {
  overflow: hidden;
  text-overflow: ellipsis;
}

.admin-row-sub,
.admin-row-meta {
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
}

.admin-row-sub.mono {
  overflow: hidden;
  text-overflow: ellipsis;
}

.admin-row-meta {
  white-space: nowrap;
}

/* —— Add disclosures —— */
.admin-add {
  margin: 0.25rem 0 0.5rem;
}

.admin-add > summary {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0;
  color: var(--pmp-primary);
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
}

.admin-add > summary::-webkit-details-marker {
  display: none;
}

.admin-add > summary::before {
  content: '+';
  display: grid;
  place-items: center;
  width: 1.15rem;
  height: 1.15rem;
  color: var(--pmp-primary);
  background: var(--pmp-primary-soft);
  border-radius: 50%;
  font-weight: 700;
  line-height: 1;
}

.admin-add[open] > summary::before {
  content: '–';
}

.admin-add > form {
  margin-top: 0.5rem;
  padding: 0.9rem;
  background: var(--pmp-canvas);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
}

.admin-grant-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 0.85rem;
}

.admin-form-foot {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
}

/* —— Policy rows —— */
.admin-policies {
  display: grid;
}

.admin-policy {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.5rem;
  align-items: center;
  padding: 0.85rem 0;
  border-top: 1px solid var(--pmp-border);
}

.admin-policy:first-child {
  border-top: 0;
  padding-top: 0;
}

.admin-policy-copy {
  display: grid;
  grid-column: 1 / -1;
  gap: 0.1rem;
  font-size: 0.8125rem;
}

.admin-policy-rev {
  color: var(--pmp-ink-soft);
  font-size: 0.6875rem;
}

.admin-policy-value {
  color: var(--pmp-ink);
  font-size: 0.8125rem;
}

.admin-policy select {
  min-width: 0;
  padding: 0 0.5rem;
}

/* —— Loading and error —— */
.admin-loading,
.vault-loading {
  display: grid;
  gap: 0.75rem;
  padding: 1.5rem;
}

.admin-loading .sk-bar,
.vault-loading .sk-bar {
  display: block;
  width: 60%;
  height: 0.9rem;
  background: color-mix(in srgb, var(--pmp-border) 75%, var(--pmp-canvas));
  border-radius: 0.35rem;
}

.admin-loading .sk-bar.wide,
.vault-loading .sk-bar.wide {
  width: 100%;
  height: 2.5rem;
}

.admin-loading .sk-bar.short,
.vault-loading .sk-bar.short {
  width: 35%;
}

.admin-error-detail {
  margin: 0.25rem 0 0.75rem;
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
  text-align: center;
}

.admin-error-actions {
  display: flex;
  justify-content: center;
  padding-bottom: 1.25rem;
}

/* —— Vault —— */
.vault-callout {
  display: flex;
  align-items: flex-start;
  gap: 0.9rem;
  padding: 1rem 1.15rem;
  background: var(--pmp-primary-soft);
  border: 1px solid color-mix(in srgb, var(--pmp-primary) 22%, transparent);
  border-radius: var(--pmp-radius-card);
}

.vault-callout-icon {
  display: grid;
  flex: 0 0 2.2rem;
  place-items: center;
  width: 2.2rem;
  height: 2.2rem;
  color: var(--pmp-primary);
  background: var(--pmp-surface);
  border-radius: 0.65rem;
}

.vault-callout-icon svg {
  width: 1.05rem !important;
  height: 1.05rem !important;
}

.vault-callout strong {
  font-size: 0.9375rem;
}

.vault-callout p {
  max-width: 56rem;
  margin: 0.25rem 0 0;
  color: var(--pmp-ink-soft);
  font-size: 0.8125rem;
  line-height: 1.6;
}

.vault-table {
  min-width: 34rem;
}

.vault-rationale {
  max-width: 34rem;
  line-height: 1.5;
}

.vault-authority {
  color: var(--pmp-ink-soft);
  font-size: 0.75rem;
}

.vault-weighed {
  white-space: nowrap;
}

.vault-alt {
  display: inline-block;
  margin: 0 0.25rem 0.15rem 0;
  padding: 0.1rem 0.5rem;
  color: var(--pmp-ink-soft);
  background: var(--pmp-canvas);
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-pill);
  font-size: 0.6875rem;
}

.vault-date {
  white-space: nowrap;
}

.vault-error {
  display: grid;
  gap: 0.75rem;
  justify-items: start;
  font-size: 0.875rem;
}

.vault-error p {
  margin: 0;
}

@media (max-width: 1180px) {
  .admin-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .admin-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .admin-stats,
  .admin-inline-form,
  .admin-grant-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .vault-callout {
    flex-direction: column;
  }
}

/* ==== ./polish-insights.css ==== */
/* Area polish: settings, profile, analytics, reports. Marketplace rules live in polish-marketplace.css. */

@import './polish-marketplace.css';

/* —— Shared: grids, notes, chips —— */
.ins-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

.ins-note {
  margin: 0.75rem 0 0;
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.panel > .ins-note:first-of-type:last-child {
  margin-top: 0;
}

.ins-page .panel .source-line {
  margin: 0 0 0.85rem;
}

.chip.neutral {
  background: var(--pmp-canvas);
  color: var(--pmp-ink-soft);
  border: 1px solid var(--pmp-border);
}

.chip.ai {
  background: var(--pmp-ai-soft);
  color: var(--pmp-ai);
}

.ins-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.5rem;
}

/* —— Account and identity cards —— */
.ins-account,
.ins-identity {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.1rem 1.25rem;
}

.ins-account-text {
  flex: 1 1 auto;
  min-width: 0;
}

.ins-account-text h2 {
  margin: 0;
  font-size: 1.125rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.ins-account-text p {
  margin: 0.15rem 0 0;
  font-size: 0.8125rem;
  color: var(--pmp-ink-soft);
  overflow-wrap: anywhere;
}

.ins-avatar {
  display: grid;
  place-items: center;
  flex: none;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  background: var(--pmp-primary-soft);
  color: var(--pmp-primary);
  font-size: 1.125rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.ins-avatar svg {
  width: 1.5rem;
  height: 1.5rem;
}

.ins-identity .kv {
  flex: 0 1 22rem;
  grid-template-columns: 7.5rem minmax(0, 1fr);
  padding-left: 1.25rem;
  border-left: 1px solid var(--pmp-border);
}

/* —— Preference radio cards —— */
.pref-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
  gap: 0.5rem;
}

.pref-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  padding: 0.65rem 0.8rem;
  border: 1px solid var(--pmp-border);
  border-radius: var(--pmp-radius-control);
  background: var(--pmp-surface);
  cursor: pointer;
  transition:
    border-color 120ms ease,
    background-color 120ms ease;
}

.pref-card:hover {
  border-color: var(--pmp-primary-muted);
}

.pref-card input {
  position: absolute;
  opacity: 0;
  inset: 0;
  margin: 0;
  cursor: pointer;
}

.pref-card:has(input:checked) {
  border-color: var(--pmp-primary);
  background: var(--pmp-primary-soft);
  box-shadow: 0 0 0 1px var(--pmp-primary);
}

.pref-card:has(input:focus-visible) {
  outline: 2px solid var(--pmp-primary);
  outline-offset: 2px;
}

.pref-card-label {
  font-size: 0.8125rem;
  font-weight: 600;
}

.pref-card-sample {
  font-family: var(--pmp-font-mono);
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

/* The selected card's wash is lighter than the page, and ink-soft misses AA on it. */
.pref-card:has(input:checked) .pref-card-sample {
  color: var(--pmp-ink);
}

.ins-page .panel > .btn,
.ins-page .panel > dl + .btn {
  margin-top: 0.85rem;
}

/* —— Lists: workspaces, recent activity —— */
.ins-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ins-list li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.65rem 0;
  border-bottom: 1px solid var(--pmp-border);
}

.ins-list li:first-child {
  padding-top: 0;
}

.ins-list li:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.ins-list-main {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-width: 0;
  font-size: 0.8125rem;
}

.ins-list-main strong {
  font-weight: 600;
}

.ins-list-main span {
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.ins-when {
  flex: none;
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
  font-variant-numeric: tabular-nums;
}

/* —— Loading and failure —— */
.ins-skeleton {
  display: grid;
  gap: 0.75rem;
}

.ins-skeleton span {
  height: 3.25rem;
  border-radius: var(--pmp-radius-card);
  background: var(--pmp-border);
  opacity: 0.5;
  animation: ins-pulse 1.4s ease-in-out infinite;
}

.ins-skeleton span:nth-child(2) {
  animation-delay: 120ms;
}

.ins-skeleton span:nth-child(3) {
  animation-delay: 240ms;
}

@keyframes ins-pulse {
  50% {
    opacity: 0.22;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ins-skeleton span {
    animation: none;
  }
}

.ins-error {
  padding: 1rem 1.1rem;
  border: 1px solid var(--pmp-danger-soft);
  border-left: 3px solid var(--pmp-danger);
  border-radius: var(--pmp-radius-card);
  background: var(--pmp-surface);
}

.ins-error p {
  margin: 0.25rem 0 0.75rem;
  font-size: 0.8125rem;
  color: var(--pmp-ink-soft);
}

/* —— Analytics —— */
.stat-link {
  text-decoration: none;
  color: inherit;
  transition: border-color 120ms ease;
}

.stat-link:hover {
  border-color: var(--pmp-primary-muted);
}

.stat-link:focus-visible {
  outline: 2px solid var(--pmp-primary);
  outline-offset: 2px;
}

.ins-bars .lifecycle-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* —— Reports —— */
.ins-reports th.num,
.ins-reports td.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.ins-download {
  width: 1%;
  text-align: right;
  white-space: nowrap;
}

.ins-download .btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* —— AI-authored chrome stays visibly non-authoritative —— */
.ins-ai {
  border-color: var(--pmp-ai-soft);
  border-left: 3px solid var(--pmp-ai);
  background: color-mix(in srgb, var(--pmp-ai-soft) 35%, var(--pmp-surface));
}

/* —— Responsive —— */
@media (max-width: 900px) {
  .ins-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .ins-identity {
    flex-wrap: wrap;
  }

  .ins-identity .kv {
    flex: 1 0 100%;
    padding: 0.85rem 0 0;
    border-top: 1px solid var(--pmp-border);
    border-left: 0;
  }
}

@media (max-width: 600px) {
  .ins-account {
    flex-wrap: wrap;
  }

  .ins-reports th:nth-child(2),
  .ins-reports td:nth-child(2) {
    display: none;
  }
}

a.ins-list-main {
  color: inherit;
  text-decoration: none;
}

a.ins-list-main:hover strong {
  color: var(--pmp-primary);
}

.ins-bars + .ins-note {
  margin-top: 1rem;
}

.ins-bars li {
  grid-template-columns: minmax(7rem, 11rem) minmax(0, 1fr) 2.5rem;
}

.ins-grid > .panel {
  align-self: stretch;
}

/* ==== ./polish-hero.css ==== */
/* Landing hero: the animated patent process. Schedule is shared with hero-process.ts (18s loop, 3s slots). */

.hero-process {
  margin: 0;
  width: 100%;
  min-width: 0;
}

.hp-svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.hero-process figcaption {
  margin-top: 0.5rem;
  text-align: center;
  font-size: 0.75rem;
  color: var(--pmp-ink-soft);
}

.hp-track {
  fill: none;
  stroke: var(--pmp-border-strong);
  stroke-width: 2;
  stroke-dasharray: 3 7;
  stroke-linecap: round;
}

.hp-progress {
  fill: none;
  stroke: var(--pmp-primary);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-dasharray: 1;
}

.hp-card {
  fill: var(--pmp-surface);
  stroke: var(--pmp-border);
  stroke-width: 1.5;
  filter: drop-shadow(0 4px 10px rgb(15 23 42 / 0.06));
  animation: hp-card-on 18s ease-in-out var(--hp-delay, 0s) infinite;
}

.hp-badge {
  fill: var(--pmp-primary-soft);
}

.hp-icon {
  color: var(--pmp-primary);
}

.hp-ai .hp-icon {
  color: var(--pmp-ai);
}

.hp-ai .hp-badge {
  fill: var(--pmp-ai-soft);
}

.hp-step {
  font: 600 11px/1 var(--pmp-font-mono);
  fill: var(--pmp-ink-soft);
}

.hp-title {
  font:
    600 16px/1 Inter,
    system-ui,
    sans-serif;
  fill: var(--pmp-ink);
}

.hp-kicker {
  font:
    500 12px/1 Inter,
    system-ui,
    sans-serif;
  fill: var(--pmp-ink-soft);
}

.hp-ai .hp-kicker {
  fill: var(--pmp-ai);
}

.hp-cap-card {
  fill: var(--pmp-surface);
  stroke: var(--pmp-border);
  stroke-width: 1;
}

.hp-caption {
  opacity: 0;
  animation: hp-caption-on 18s ease-in-out var(--hp-delay, 0s) infinite;
}

.hp-cap-title {
  text-anchor: middle;
  font:
    600 14px/1 Inter,
    system-ui,
    sans-serif;
  fill: var(--pmp-primary);
}

.hp-caption.hp-ai .hp-cap-title {
  fill: var(--pmp-ai);
}

.hp-cap-body {
  text-anchor: middle;
  font:
    400 13px/1 Inter,
    system-ui,
    sans-serif;
  fill: var(--pmp-ink);
}

.hp-token-core {
  fill: var(--pmp-primary);
}

.hp-token-dot {
  fill: var(--pmp-ink-inverse);
}

/* A stage is active from the token's arrival until it leaves for the next one. */
@keyframes hp-card-on {
  0%,
  19% {
    stroke: var(--pmp-primary);
    stroke-width: 2.5;
  }
  22%,
  100% {
    stroke: var(--pmp-border);
    stroke-width: 1.5;
  }
}

@keyframes hp-caption-on {
  0% {
    opacity: 0;
  }
  3%,
  15.5% {
    opacity: 1;
  }
  19%,
  100% {
    opacity: 0;
  }
}

.hp-node.hp-ai .hp-card {
  animation-name: hp-card-on-ai;
}

@keyframes hp-card-on-ai {
  0%,
  19% {
    stroke: var(--pmp-ai);
    stroke-width: 2.5;
  }
  22%,
  100% {
    stroke: var(--pmp-border);
    stroke-width: 1.5;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hp-card,
  .hp-caption {
    animation: none;
  }

  .hp-progress,
  .hp-captions,
  .hp-token {
    display: none;
  }
}

/* ==== ./theme-dark.css ==== */
/**
 * Dark scheme. Every hex below is a `colors_dark` role in
 * `design/brand/tokens.json`; `scripts/check-theme-tokens.ts` fails the check
 * chain if they drift. `data-theme` is written onto <html> by the inline script
 * in index.html (before first paint) and by `applyTheme()` in preferences.ts.
 *
 * `:root[data-theme='dark']` (0,2,0) outranks the bridge's `:root` (0,1,0), so
 * `color-scheme` and the Hydrogen variable mapping resolve dark with no `!important`.
 * The bridge maps Hydrogen variables via `var(--pmp-*)`, so redefining the
 * brand tokens here re-themes every Hydrogen component in one move.
 */

:root[data-theme='dark'] {
  color-scheme: dark;

  --pmp-primary: #818cf8;
  --pmp-primary-hover: #a5b4fc;
  --pmp-primary-soft: #1f2250;
  --pmp-primary-muted: #4f46e5;
  --pmp-canvas: #0b1120;
  --pmp-surface: #111a2e;
  --pmp-sidebar: #0e1627;
  --pmp-border: #24324a;
  --pmp-border-strong: #334155;
  --pmp-ink: #e2e8f0;
  --pmp-ink-soft: #94a3b8;
  --pmp-ink-inverse: #0b1120;
  --pmp-success: #4ade80;
  --pmp-success-soft: #0f2e1d;
  --pmp-warning: #fbbf24;
  --pmp-warning-soft: #33260a;
  --pmp-danger: #f87171;
  --pmp-danger-soft: #3a1414;
  --pmp-info: #38bdf8;
  --pmp-ai: #a78bfa;
  --pmp-ai-soft: #271b4a;
  --pmp-claim-insert: #4ade80;
  --pmp-claim-delete: #f87171;
  --pmp-claim-move: #60a5fa;
  --pmp-claim-reword: #fbbf24;
}

/* Hydrogen paints a literal #fff on its filled primary/danger controls. In dark the fills are
   light, so the text takes the dark inverse ink the brand pack defines for exactly this. */
:root[data-theme='dark'] .btn-destructive,
:root[data-theme='dark'] .pagination-button--active,
:root[data-theme='dark'] .datepicker-day-btn.selected,
:root[data-theme='dark'] .h-tag:has(.h-tag-body[aria-pressed='true']),
:root[data-theme='dark'] .stepper-step--current .stepper-step__number {
  color: var(--pmp-ink-inverse);
}

/* Shadows tuned for a light page vanish on slate; deepen them from the canvas ink instead. */
:root[data-theme='dark'] .feature-card:hover {
  box-shadow: 0 8px 24px color-mix(in srgb, var(--pmp-primary) 18%, transparent);
}

:root[data-theme='dark'] .hp-card {
  filter: drop-shadow(0 4px 10px color-mix(in srgb, var(--pmp-canvas) 70%, transparent));
}

/* The palette scrim and shadow are mixed from `--pmp-ink`, which is a light colour in dark: the
   scrim would wash the page out. Mix them from the canvas so they dim instead. */
:root[data-theme='dark'] .modal-backdrop.palette-backdrop {
  background: color-mix(in srgb, var(--pmp-canvas) 72%, transparent);
}

:root[data-theme='dark'] .modal.palette {
  box-shadow: 0 24px 60px color-mix(in srgb, var(--pmp-canvas) 80%, transparent);
}

/* Same reason for the card shadows: an ink-mixed shadow is a pale halo on slate. */
:root[data-theme='dark'] {
  --pmp-shadow-card: 0 1px 2px color-mix(in srgb, var(--pmp-canvas) 60%, transparent);
  --pmp-shadow-lift: 0 6px 18px color-mix(in srgb, var(--pmp-canvas) 55%, transparent);
}

:root[data-theme='dark'] .auth-split,
:root[data-theme='dark'] .auth-solo {
  box-shadow: 0 18px 48px color-mix(in srgb, var(--pmp-canvas) 60%, transparent);
}

:root[data-theme='dark'] .auth-art-chip {
  box-shadow: 0 8px 20px color-mix(in srgb, var(--pmp-canvas) 50%, transparent);
}

:root[data-theme='dark'] .collapsible-sidebar__toggle {
  box-shadow: 0 1px 2px color-mix(in srgb, var(--pmp-canvas) 60%, transparent);
}