@tekkare/romulus 0.1.8 → 0.1.10

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": ">=3.16.0"
   },
-  "version": "0.1.7",
+  "version": "0.1.9",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/runtime/assets/styles/components.css

@@ -1 +1 @@
-.grid-2{grid-template-columns:repeat(2,1fr)}.grid-2,.grid-3{display:grid;gap:20px}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{display:grid;gap:16px;grid-template-columns:repeat(4,1fr)}.grid-2-1{display:grid;gap:20px;grid-template-columns:2fr 1fr}.chart-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:10px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;transition:box-shadow .18s,border-color .18s}.chart-card:hover{border-color:var(--color-violet-pale);box-shadow:0 6px 16px rgba(107,63,255,.1),0 1px 3px rgba(30,41,59,.04)}.chart-card-head{padding:22px 64px 14px 24px;position:relative}.chart-card-title{color:var(--text-primary);font-size:15px;font-weight:700;letter-spacing:-.01em;line-height:1.3;margin:0 0 5px}.chart-card-context{color:var(--text-muted);font-size:12px;line-height:1.55;margin:0}.chart-card-actions{position:absolute;right:12px;top:12px}.cc-export{align-items:center;background:var(--bg-surface);border:1px solid var(--border-default);border-radius:6px;color:var(--text-secondary);cursor:pointer;display:flex;font-size:14px;height:28px;justify-content:center;transition:background .15s,color .15s,border-color .15s;width:28px}.cc-export:hover{color:var(--color-secondary)}.cc-export:hover,.chart-card-actions.open .cc-export{background:var(--bg-hover);border-color:var(--color-violet-pale)}.chart-card-actions.open .cc-export{color:var(--color-primary)}.cc-menu{animation:cc-menu-in .12s cubic-bezier(.2,0,0,1);background:var(--bg-surface);border:1px solid var(--border-default);border-radius:8px;box-shadow:var(--shadow-lg);display:none;min-width:200px;padding:6px 0;position:absolute;right:0;top:34px;z-index:var(--z-modal)}.chart-card-actions.open .cc-menu{display:block}.cc-menu-section{color:var(--text-muted);font-size:10px;font-weight:700;letter-spacing:.08em;padding:8px 14px 4px;text-transform:uppercase}.cc-menu-item{align-items:center;background:none;border:0;color:var(--text-secondary);cursor:pointer;display:flex;font-family:var(--font-sans);font-size:13px;gap:10px;padding:7px 14px;text-align:left;width:100%}.cc-menu-item i{color:var(--text-muted);font-size:14px}.cc-menu-item:hover{background:var(--bg-surface-3);color:var(--text-primary)}.cc-menu-item:hover i{color:var(--text-secondary)}.cc-menu-divider{background:var(--bg-surface-3);height:1px;margin:4px 0}@keyframes cc-menu-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.chart-card-body{flex:1;padding:4px 12px 8px}.chart-card-foot{align-items:center;background:var(--bg-surface-2);border-radius:0 0 10px 10px;border-top:1px solid var(--border-soft);color:var(--text-muted);display:flex;flex-wrap:wrap;font-size:11px;gap:10px;padding:12px 24px}.chart-card-foot .src{align-items:center;display:flex;gap:4px}.chart-card-foot .src b{color:var(--text-secondary);font-weight:600}.chart-card-foot .dot{background:var(--border-default);border-radius:50%;height:3px;width:3px}.chart-card-foot .updated{color:var(--text-secondary);font-weight:500}.kpi-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:8px;box-shadow:0 2px 8px rgba(30,41,59,.06);padding:16px 18px}.kpi-label{color:var(--text-muted);font-size:11px;font-weight:600;letter-spacing:.1em;margin:0 0 6px;text-transform:uppercase}.kpi-value{color:var(--color-primary);font-family:var(--font-serif);font-size:28px;font-weight:700;line-height:1;margin:0}.kpi-value.healthcare{color:var(--color-healthcare)}.kpi-value.discovery{color:var(--color-discovery)}.kpi-value.pharma{color:var(--color-pharma)}.kpi-value.databank{color:var(--color-databank)}.kpi-trend{align-items:center;display:inline-flex;font-size:12px;font-weight:600;gap:4px;margin-top:6px}.kpi-trend i{font-size:11px}.kpi-trend--up{color:var(--color-success)}.kpi-trend--down{color:var(--color-danger)}.kpi-foot,.kpi-trend--flat{color:var(--text-muted)}.kpi-foot{font-size:11px;margin-top:4px}.badge{border-radius:4px;display:inline-block;font-size:10px;font-weight:600;padding:2px 8px}.badge-active{background:var(--color-success-bg);color:var(--color-success)}.badge-pending{background:var(--color-warning-bg);color:var(--color-warning)}.badge-error{background:var(--color-danger-bg);color:var(--color-danger)}.badge-info{background:var(--bg-hover);color:var(--color-primary)}.badge-grey{background:var(--bg-surface-3);color:var(--text-secondary)}table.tk{border-collapse:collapse;font-size:13px;width:100%}.sr-only,table.tk>caption.sr-only{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border:0;white-space:nowrap}table.tk caption{caption-side:top;color:var(--text-primary);font-size:var(--font-13);font-weight:var(--weight-bold);padding:0 0 var(--space-8);text-align:left}table.tk th{background:var(--bg-surface-2);border-bottom:1px solid var(--border-default);color:var(--text-secondary);font-size:11px;font-weight:700;letter-spacing:.08em;padding:12px 14px;text-align:left;text-transform:uppercase}table.tk tbody th[scope=row]{background:transparent;font-size:var(--font-13);font-weight:var(--weight-bold);letter-spacing:0;text-transform:none}table.tk tbody th[scope=row],table.tk td{border-bottom:1px solid var(--border-soft);color:var(--text-primary)}table.tk td{padding:12px 14px}table.tk tbody tr:nth-child(2n) td,table.tk tbody tr:nth-child(2n) th[scope=row]{background:var(--bg-surface-2)}table.tk tbody tr:hover td,table.tk tbody tr:hover th[scope=row]{background:var(--bg-hover)}table.tk th[aria-sort]{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}table.tk th[aria-sort]:hover{color:var(--text-primary)}.tk-wrap{overflow-x:auto}.tk-num{font-variant-numeric:tabular-nums;text-align:right}.nav-group{display:flex;flex-direction:column}.nav-group-header{align-items:center;background:none;border:0;color:var(--text-muted);cursor:pointer;display:flex;font-family:var(--font-sans);font-size:11px;font-weight:700;gap:8px;letter-spacing:.08em;padding:8px 12px;text-align:left;text-transform:uppercase;transition:color var(--duration-fast) var(--ease-out);width:100%}.nav-group-header:hover{color:var(--text-secondary)}.nav-group-header .caret{display:inline-flex;margin-left:auto;transition:transform var(--duration-fast) var(--ease-out)}.nav-group[data-open=true]>.nav-group-header{color:var(--color-primary)}.nav-group[data-open=true]>.nav-group-header .caret{transform:rotate(180deg)}.nav-group-items{display:flex;flex-direction:column;gap:2px;padding:2px 0 8px}.cc-export:focus-visible,.cc-menu-item:focus-visible,.chart-card :focus-visible,.nav-group-header:focus-visible,table.tk th[aria-sort]:focus-visible{box-shadow:var(--shadow-focus);outline:2px solid var(--color-secondary);outline-offset:2px}.cc-menu-item,.nav-group-header{min-height:40px}body.text-large .kpi-label{font-size:13px}body.text-large .kpi-value{font-size:34px}body.text-large .kpi-trend{font-size:14px}body.text-large .kpi-foot{font-size:13px}body.text-large .chart-card-title{font-size:17px}body.text-large .chart-card-context{font-size:14px}body.text-large .chart-card-foot{font-size:12px}body.text-large .badge{font-size:12px;padding:3px 9px}body.text-large table.tk{font-size:15px}body.text-large table.tk th{font-size:13px}body.text-xl .kpi-label{font-size:14px}body.text-xl .kpi-value{font-size:40px}body.text-xl .kpi-trend{font-size:16px}body.text-xl .kpi-foot{font-size:14px}body.text-xl .chart-card-title{font-size:20px}body.text-xl .chart-card-context{font-size:16px}body.text-xl .chart-card-foot{font-size:14px}body.text-xl .badge{font-size:14px;padding:3px 10px}body.text-xl table.tk{font-size:16px}body.text-xl table.tk th{font-size:14px}body.high-contrast .cc-export,body.high-contrast .cc-menu,body.high-contrast .chart-card,body.high-contrast .kpi-card{border-width:2px}body.high-contrast .chart-card:hover{border-color:var(--border-default)}
+.grid-2{grid-template-columns:repeat(2,1fr)}.grid-2,.grid-3{display:grid;gap:20px}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{display:grid;gap:16px;grid-template-columns:repeat(4,1fr)}.grid-2-1{display:grid;gap:20px;grid-template-columns:2fr 1fr}.chart-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:10px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;transition:box-shadow .18s,border-color .18s}.chart-card:hover{border-color:var(--color-violet-pale);box-shadow:0 6px 16px rgba(107,63,255,.1),0 1px 3px rgba(30,41,59,.04)}.chart-card-head{padding:22px 64px 14px 24px;position:relative}.chart-card-title{color:var(--text-primary);font-size:15px;font-weight:700;letter-spacing:-.01em;line-height:1.3;margin:0 0 5px}.chart-card-context{color:var(--text-muted);font-size:12px;line-height:1.55;margin:0}.chart-card-actions{position:absolute;right:12px;top:12px}.cc-export{align-items:center;background:var(--bg-surface);border:1px solid var(--border-default);border-radius:6px;color:var(--text-secondary);cursor:pointer;display:flex;font-size:14px;height:28px;justify-content:center;transition:background .15s,color .15s,border-color .15s;width:28px}.cc-export:hover{color:var(--color-secondary)}.cc-export:hover,.chart-card-actions.open .cc-export{background:var(--bg-hover);border-color:var(--color-violet-pale)}.chart-card-actions.open .cc-export{color:var(--color-primary)}.cc-menu{animation:cc-menu-in .12s cubic-bezier(.2,0,0,1);background:var(--bg-surface);border:1px solid var(--border-default);border-radius:8px;box-shadow:var(--shadow-lg);display:none;min-width:200px;padding:6px 0;position:absolute;right:0;top:34px;z-index:var(--z-modal)}.chart-card-actions.open .cc-menu{display:block}.cc-menu-section{color:var(--text-muted);font-size:10px;font-weight:700;letter-spacing:.08em;padding:8px 14px 4px;text-transform:uppercase}.cc-menu-item{align-items:center;background:none;border:0;color:var(--text-secondary);cursor:pointer;display:flex;font-family:var(--font-sans);font-size:13px;gap:10px;padding:7px 14px;text-align:left;width:100%}.cc-menu-item i{color:var(--text-muted);font-size:14px}.cc-menu-item:hover{background:var(--bg-surface-3);color:var(--text-primary)}.cc-menu-item:hover i{color:var(--text-secondary)}.cc-menu-divider{background:var(--bg-surface-3);height:1px;margin:4px 0}@keyframes cc-menu-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.chart-card-body{flex:1;padding:4px 12px 8px}.chart-card-foot{align-items:center;background:var(--bg-surface-2);border-radius:0 0 10px 10px;border-top:1px solid var(--border-soft);color:var(--text-muted);display:flex;flex-wrap:wrap;font-size:11px;gap:10px;padding:12px 24px}.chart-card-foot .src{align-items:center;display:flex;gap:4px}.chart-card-foot .src b{color:var(--text-secondary);font-weight:600}.chart-card-foot .dot{background:var(--border-default);border-radius:50%;height:3px;width:3px}.chart-card-foot .updated{color:var(--text-secondary);font-weight:500}.kpi-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:8px;box-shadow:0 2px 8px rgba(30,41,59,.06);padding:16px 18px}.kpi-label{color:var(--text-muted);font-size:11px;font-weight:600;letter-spacing:.1em;margin:0 0 6px;text-transform:uppercase}.kpi-value{color:var(--color-primary);font-family:var(--font-serif);font-size:28px;font-weight:700;line-height:1;margin:0}.kpi-value.healthcare{color:var(--color-healthcare)}.kpi-value.discovery{color:var(--color-discovery)}.kpi-value.pharma{color:var(--color-pharma)}.kpi-value.databank{color:var(--color-databank)}.kpi-trend{align-items:center;display:inline-flex;font-size:12px;font-weight:600;gap:4px;margin-top:6px}.kpi-trend i{font-size:11px}.kpi-trend--up{color:var(--color-success)}.kpi-trend--down{color:var(--color-danger)}.kpi-foot,.kpi-trend--flat{color:var(--text-muted)}.kpi-foot{font-size:11px;margin-top:4px}.badge{border-radius:4px;display:inline-block;font-size:10px;font-weight:600;padding:2px 8px}.badge-active{background:var(--color-success-bg);color:var(--color-success)}.badge-pending{background:var(--color-warning-bg);color:var(--color-warning)}.badge-error{background:var(--color-danger-bg);color:var(--color-danger)}.badge-info{background:var(--bg-hover);color:var(--color-primary)}.badge-grey{background:var(--bg-surface-3);color:var(--text-secondary)}table.tk{border-collapse:collapse;font-size:13px;width:100%}.sr-only,table.tk>caption.sr-only{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border:0;white-space:nowrap}table.tk caption{caption-side:top;color:var(--text-primary);font-size:var(--font-13);font-weight:var(--weight-bold);padding:0 0 var(--space-8);text-align:left}table.tk th{background:var(--bg-surface-2);border-bottom:1px solid var(--border-default);color:var(--text-secondary);font-size:11px;font-weight:700;letter-spacing:.08em;padding:12px 14px;text-align:left;text-transform:uppercase}table.tk tbody th[scope=row]{background:transparent;font-size:var(--font-13);font-weight:var(--weight-bold);letter-spacing:0;text-transform:none}table.tk tbody th[scope=row],table.tk td{border-bottom:1px solid var(--border-soft);color:var(--text-primary)}table.tk td{padding:12px 14px}table.tk tbody tr:nth-child(2n) td,table.tk tbody tr:nth-child(2n) th[scope=row]{background:var(--bg-surface-2)}table.tk tbody tr:hover td,table.tk tbody tr:hover th[scope=row]{background:var(--bg-hover)}table.tk th[aria-sort]{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}table.tk th[aria-sort]:hover{color:var(--text-primary)}.tk-wrap{overflow-x:auto}.tk-num{font-variant-numeric:tabular-nums;text-align:right}.nav-group{display:flex;flex-direction:column}.nav-group-header{align-items:center;background:none;border:0;color:var(--text-muted);cursor:pointer;display:flex;font-family:var(--font-sans);font-size:11px;font-weight:700;gap:8px;letter-spacing:.08em;padding:8px 12px;text-align:left;text-transform:uppercase;transition:color var(--duration-fast) var(--ease-out);width:100%}.nav-group-header:hover{color:var(--text-secondary)}.nav-group-header .caret{display:inline-flex;margin-left:auto;transition:transform var(--duration-fast) var(--ease-out)}.nav-group[data-open=true]>.nav-group-header{color:var(--color-primary)}.nav-group[data-open=true]>.nav-group-header .caret{transform:rotate(180deg)}.nav-group-items{display:flex;flex-direction:column;gap:2px;padding:2px 0 8px}.cc-export:focus-visible,.cc-menu-item:focus-visible,.chart-card :focus-visible,.nav-group-header:focus-visible,table.tk th[aria-sort]:focus-visible{box-shadow:var(--shadow-focus);outline:2px solid var(--color-secondary);outline-offset:2px}.cc-menu-item,.nav-group-header{min-height:40px}body.text-large .kpi-label{font-size:13px}body.text-large .kpi-value{font-size:34px}body.text-large .kpi-trend{font-size:14px}body.text-large .kpi-foot{font-size:13px}body.text-large .chart-card-title{font-size:17px}body.text-large .chart-card-context{font-size:14px}body.text-large .chart-card-foot{font-size:12px}body.text-large .badge{font-size:12px;padding:3px 9px}body.text-large table.tk{font-size:15px}body.text-large table.tk th{font-size:13px}body.text-xl .kpi-label{font-size:14px}body.text-xl .kpi-value{font-size:40px}body.text-xl .kpi-trend{font-size:16px}body.text-xl .kpi-foot{font-size:14px}body.text-xl .chart-card-title{font-size:20px}body.text-xl .chart-card-context{font-size:16px}body.text-xl .chart-card-foot{font-size:14px}body.text-xl .badge{font-size:14px;padding:3px 10px}body.text-xl table.tk{font-size:16px}body.text-xl table.tk th{font-size:14px}body.high-contrast .cc-export,body.high-contrast .cc-menu,body.high-contrast .chart-card,body.high-contrast .kpi-card{border-width:2px}body.high-contrast .chart-card:hover{border-color:var(--border-default)}body.theme-switching,body.theme-switching *,body.theme-switching :after,body.theme-switching :before{transition:none!important}body.high-contrast *{box-shadow:none!important}

package/dist/runtime/assets/styles/tokens.css

@@ -1 +1 @@
-:root{--sidebar-w:220px;--sidebar-collapsed-w:56px;--rsidebar-w:280px;--rsidebar-collapsed-w:76px;--topbar-h:56px;--tabs-h:46px;--analysis-header-h:124px;--sourcebar-h:38px;--filterbar-h:56px;--color-primary:#2100ad;--color-primary-hover:#1a0088;--color-secondary:#6b3fff;--color-accent-soft:#b485ff;--color-violet-pale:#d6ccff;--color-healthcare:#4164ee;--color-discovery:#07816f;--color-pharma:#f7520e;--color-databank:#e04380;--color-healthcare-active:#1a65e0;--color-discovery-active:#066b5c;--color-pharma-active:#d9470c;--color-databank-active:#c73a6f;--healthcare-rgb:65,100,238;--discovery-rgb:7,129,111;--pharma-rgb:247,82,14;--databank-rgb:224,67,128;--color-accent-teal:#00d4a8;--color-notification:#e59;--color-text-inverse:#fff;--color-success:#16a34a;--color-success-bg:#dcfce7;--color-warning:#d97706;--color-warning-bg:#fef3c7;--color-danger:#dc2626;--color-danger-bg:#fee2e2;--color-info:#4164ee;--color-info-bg:#dbeafe;--bg-app:#eef1f5;--bg-surface:#fff;--bg-surface-2:#fbfbfd;--bg-surface-3:#f5f5f9;--bg-hover:#eef1fe;--border-default:#dbdef0;--border-soft:#f0f1f7;--text-primary:#1e293b;--text-secondary:#525670;--text-muted:#878ca6;--brand-rgb:33,0,173;--chart-cat-1:#2100ad;--chart-cat-2:#00a38e;--chart-cat-3:#e67e22;--chart-cat-4:#d63384;--chart-cat-5:#4164ee;--chart-cat-6:#16a34a;--space-2:2px;--space-4:4px;--space-6:6px;--space-8:8px;--space-12:12px;--space-16:16px;--space-20:20px;--space-24:24px;--space-32:32px;--space-40:40px;--space-48:48px;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-xl:10px;--radius-2xl:12px;--radius-pill:999px;--font-10:10px;--font-11:11px;--font-12:12px;--font-13:13px;--font-14:14px;--font-16:16px;--font-18:18px;--font-22:22px;--font-24:24px;--font-32:32px;--weight-normal:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--font-serif:"Caudex",Georgia,serif;--font-sans:"Figtree",system-ui,sans-serif;--font-mono:"SF Mono",Menlo,monospace;--shadow-xs:0 1px 2px rgba(30,41,59,.04);--shadow-sm:0 2px 6px rgba(30,41,59,.06),0 1px 2px rgba(30,41,59,.03);--shadow-md:0 4px 12px rgba(30,41,59,.06),0 1px 3px rgba(30,41,59,.04);--shadow-lg:0 8px 24px rgba(30,41,59,.12);--shadow-focus:0 0 0 3px rgba(107,63,255,.14);--duration-instant:100ms;--duration-fast:150ms;--duration-base:240ms;--duration-slow:400ms;--duration-slowest:600ms;--ease-out:cubic-bezier(.2,0,0,1);--ease-in-out:cubic-bezier(.4,0,.2,1);--ease-spring:cubic-bezier(.5,1.6,.4,1);--z-base:1;--z-sticky:20;--z-header:30;--z-drawer:40;--z-modal:50;--z-toast:60;--z-help:70}body.night{--color-primary:#9b7cff;--color-secondary:#b485ff;--color-accent-soft:#d6ccff;--color-databank:#f472b6;--bg-app:#0e0e14;--bg-surface:#1a1a24;--bg-surface-2:#232330;--bg-surface-3:#2a2a38;--bg-hover:#2d2a42;--border-default:#45455c;--border-soft:#32323f;--text-primary:#f5f6fa;--text-secondary:#cfd3e5;--text-muted:#8a90a8;--brand-rgb:155,124,255;--color-success:#6fe8c5;--color-success-bg:rgba(0,212,168,.18);--color-warning:#fbbf24;--color-warning-bg:rgba(245,158,11,.18);--color-danger:#fca5a5;--color-danger-bg:rgba(239,68,68,.18);--color-info:#7aa0ff;--color-info-bg:rgba(65,100,238,.18);--chart-cat-1:#9b7cff;--chart-cat-2:#6fe8c5;--chart-cat-3:#fbbf24;--chart-cat-4:#f472b6;--chart-cat-5:#7b9ef5;--chart-cat-6:#bef264;background:var(--bg-app);color:var(--text-primary)}body.high-contrast:not(.night){--text-primary:#000;--text-secondary:#1a1a24;--text-muted:#2f2f40;--border-default:#000;--border-soft:#525670;--bg-app:#fff;--bg-surface:#fff;--bg-surface-2:#fff;--bg-surface-3:#f0f1f7;--bg-hover:#ffe56b;--color-primary:#1100a0;--color-primary-hover:#0a0070;--color-secondary:#5028d8;--color-success:#006b2c;--color-warning:#8c4500;--color-danger:#a60000;--color-info:#0040c8}body.night.high-contrast{--text-primary:#fff;--text-secondary:#f5f6fa;--text-muted:#cfd3e5;--border-default:#fff;--border-soft:#b8bcd0;--bg-app:#000;--bg-surface:#000;--bg-surface-2:#000;--bg-surface-3:#000;--bg-hover:#ffe56b;--color-primary:#d6ccff;--color-primary-hover:#fff;--color-secondary:#e5daff;--color-accent-soft:#fff;--color-success:#6fe8c5;--color-warning:#fbbf24;--color-danger:#fca5a5;--color-info:#7aa0ff;--brand-rgb:214,204,255}body.reduce-motion *,body.reduce-motion :after,body.reduce-motion :before{animation:none!important;scroll-behavior:auto!important;transition:none!important}:root{--r-color-primary-50:#f0f4ff;--r-color-primary-100:#dce5fd;--r-color-primary-200:#b9cbfb;--r-color-primary-300:#96b0f9;--r-color-primary-400:#7395f5;--r-color-primary-500:#5a7ef2;--r-color-primary-600:var(--color-healthcare);--r-color-primary-700:#3451d4;--r-color-primary-800:#283fb0;--r-color-primary-900:#1c2d8a;--r-color-gray-50:#f9fafb;--r-color-gray-100:#f3f4f6;--r-color-gray-200:#e5e7eb;--r-color-gray-300:#d1d5db;--r-color-gray-400:#9ca3af;--r-color-gray-500:#6b7280;--r-color-gray-600:#4b5563;--r-color-gray-700:#374151;--r-color-gray-800:#1f2937;--r-color-gray-900:#111827;--r-color-gray-950:#030712;--r-color-success-500:var(--color-success);--r-color-success-600:#16a34a;--r-color-warning-500:#f59e0b;--r-color-warning-600:var(--color-warning);--r-color-danger-500:#ef4444;--r-color-danger-600:var(--color-danger);--r-color-white:#fff;--r-color-black:#000;--r-font-family:var(--font-sans);--r-font-mono:var(--font-mono);--r-text-xs:0.75rem;--r-text-sm:0.875rem;--r-text-base:1rem;--r-text-lg:1.125rem;--r-text-xl:1.25rem;--r-text-2xl:1.5rem;--r-text-3xl:1.875rem;--r-text-4xl:2.25rem;--r-font-weight-normal:var(--weight-normal);--r-font-weight-medium:var(--weight-medium);--r-font-weight-semibold:var(--weight-semibold);--r-font-weight-bold:var(--weight-bold);--r-leading-tight:1.25;--r-leading-normal:1.5;--r-leading-relaxed:1.75;--r-space-0:0;--r-space-1:var(--space-4);--r-space-2:var(--space-8);--r-space-3:var(--space-12);--r-space-4:var(--space-16);--r-space-5:var(--space-20);--r-space-6:var(--space-24);--r-space-8:var(--space-32);--r-space-10:var(--space-40);--r-space-12:var(--space-48);--r-radius-none:0;--r-radius-sm:var(--radius-sm);--r-radius-md:var(--radius-md);--r-radius-lg:var(--radius-lg);--r-radius-xl:0.75rem;--r-radius-2xl:1rem;--r-radius-full:var(--radius-pill);--r-shadow-xs:0 1px 2px 0 rgba(0,0,0,.05);--r-shadow-sm:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--r-shadow-md:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--r-shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--r-shadow-xl:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);--r-transition-fast:var(--duration-fast) var(--ease-in-out);--r-transition-base:200ms var(--ease-in-out);--r-transition-slow:var(--duration-slow) var(--ease-in-out)}
+:root{--sidebar-w:220px;--sidebar-collapsed-w:56px;--rsidebar-w:280px;--rsidebar-collapsed-w:76px;--topbar-h:56px;--tabs-h:46px;--analysis-header-h:124px;--sourcebar-h:38px;--filterbar-h:56px;--color-primary:#2100ad;--color-primary-hover:#1a0088;--color-secondary:#6b3fff;--color-accent-soft:#b485ff;--color-violet-pale:#d6ccff;--color-healthcare:#4164ee;--color-discovery:#07816f;--color-pharma:#f7520e;--color-databank:#e04380;--color-healthcare-active:#3451d4;--color-discovery-active:#066b5c;--color-pharma-active:#d9470c;--color-databank-active:#c73a6f;--color-pharma-soft:#ff7942;--healthcare-rgb:65,100,238;--discovery-rgb:7,129,111;--pharma-rgb:247,82,14;--databank-rgb:224,67,128;--surface-rgb:255,255,255;--shadow-rgb:30,41,59;--color-accent-teal:#00d4a8;--color-notification:#e59;--color-text-inverse:#fff;--color-success:#16a34a;--color-success-bg:#dcfce7;--color-warning:#d97706;--color-warning-bg:#fef3c7;--color-danger:#dc2626;--color-danger-bg:#fee2e2;--color-info:#4164ee;--color-info-bg:#dbeafe;--bg-app:#eef1f5;--bg-surface:#fff;--bg-surface-2:#fbfbfd;--bg-surface-3:#f5f5f9;--bg-hover:#eef1fe;--border-default:#dbdef0;--border-soft:#f0f1f7;--text-primary:#1e293b;--text-secondary:#525670;--text-muted:#878ca6;--brand-rgb:33,0,173;--chart-cat-1:#2100ad;--chart-cat-2:#00a38e;--chart-cat-3:#e67e22;--chart-cat-4:#d63384;--chart-cat-5:#4164ee;--chart-cat-6:#16a34a;--space-2:2px;--space-4:4px;--space-6:6px;--space-8:8px;--space-12:12px;--space-16:16px;--space-20:20px;--space-24:24px;--space-32:32px;--space-40:40px;--space-48:48px;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-xl:10px;--radius-2xl:12px;--radius-pill:999px;--font-10:10px;--font-11:11px;--font-12:12px;--font-13:13px;--font-14:14px;--font-16:16px;--font-18:18px;--font-22:22px;--font-24:24px;--font-32:32px;--weight-normal:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--font-serif:"Caudex",Georgia,serif;--font-sans:"Figtree",system-ui,sans-serif;--font-mono:"SF Mono",Menlo,monospace;--shadow-xs:0 1px 2px rgba(30,41,59,.04);--shadow-sm:0 2px 6px rgba(30,41,59,.06),0 1px 2px rgba(30,41,59,.03);--shadow-md:0 4px 12px rgba(30,41,59,.06),0 1px 3px rgba(30,41,59,.04);--shadow-lg:0 8px 24px rgba(30,41,59,.12);--shadow-focus:0 0 0 3px rgba(107,63,255,.14);--duration-instant:100ms;--duration-fast:150ms;--duration-base:240ms;--duration-slow:400ms;--duration-slowest:600ms;--ease-out:cubic-bezier(.2,0,0,1);--ease-in-out:cubic-bezier(.4,0,.2,1);--ease-spring:cubic-bezier(.5,1.6,.4,1);--z-base:1;--z-sticky:20;--z-header:30;--z-drawer:40;--z-modal:50;--z-toast:60;--z-help:70}body.night{--color-primary:#9b7cff;--color-secondary:#b485ff;--color-accent-soft:#d6ccff;--color-healthcare:#7aa0ff;--color-discovery:#2ecc71;--color-pharma:#ff8c00;--color-databank:#f472b6;--color-healthcare-active:#4164ee;--color-discovery-active:#07816f;--color-pharma-active:#f7520e;--color-databank-active:#e04380;--healthcare-rgb:122,160,255;--discovery-rgb:46,204,113;--pharma-rgb:255,140,0;--databank-rgb:244,114,182;--surface-rgb:26,26,36;--shadow-rgb:0,0,0;--bg-app:#0e0e14;--bg-surface:#1a1a24;--bg-surface-2:#232330;--bg-surface-3:#2a2a38;--bg-hover:#2d2a42;--border-default:#45455c;--border-soft:#32323f;--text-primary:#f5f6fa;--text-secondary:#cfd3e5;--text-muted:#8a90a8;--brand-rgb:155,124,255;--color-success:#6fe8c5;--color-success-bg:rgba(0,212,168,.18);--color-warning:#fbbf24;--color-warning-bg:rgba(245,158,11,.18);--color-danger:#fca5a5;--color-danger-bg:rgba(239,68,68,.18);--color-info:#7aa0ff;--color-info-bg:rgba(65,100,238,.18);--chart-cat-1:#9b7cff;--chart-cat-2:#6fe8c5;--chart-cat-3:#fbbf24;--chart-cat-4:#f472b6;--chart-cat-5:#7b9ef5;--chart-cat-6:#bef264;background:var(--bg-app);color:var(--text-primary)}body.high-contrast:not(.night){--text-primary:#000;--text-secondary:#1a1a24;--text-muted:#2f2f40;--border-default:#000;--border-soft:#525670;--bg-app:#fff;--bg-surface:#fff;--bg-surface-2:#fff;--bg-surface-3:#f0f1f7;--bg-hover:#ffe56b;--color-primary:#1100a0;--color-primary-hover:#0a0070;--color-secondary:#5028d8;--color-success:#006b2c;--color-warning:#8c4500;--color-danger:#a60000;--color-info:#0040c8}body.night.high-contrast{--text-primary:#fff;--text-secondary:#f5f6fa;--text-muted:#cfd3e5;--border-default:#fff;--border-soft:#b8bcd0;--bg-app:#000;--bg-surface:#000;--bg-surface-2:#000;--bg-surface-3:#000;--bg-hover:#ffe56b;--color-primary:#d6ccff;--color-primary-hover:#fff;--color-secondary:#e5daff;--color-accent-soft:#fff;--color-success:#6fe8c5;--color-warning:#fbbf24;--color-danger:#fca5a5;--color-info:#7aa0ff;--brand-rgb:214,204,255}body.reduce-motion *,body.reduce-motion :after,body.reduce-motion :before{animation:none!important;scroll-behavior:auto!important;transition:none!important}:root{--r-color-primary-50:#f0f4ff;--r-color-primary-100:#dce5fd;--r-color-primary-200:#b9cbfb;--r-color-primary-300:#96b0f9;--r-color-primary-400:#7395f5;--r-color-primary-500:#5a7ef2;--r-color-primary-600:var(--color-healthcare);--r-color-primary-700:#3451d4;--r-color-primary-800:#283fb0;--r-color-primary-900:#1c2d8a;--r-color-gray-50:#f9fafb;--r-color-gray-100:#f3f4f6;--r-color-gray-200:#e5e7eb;--r-color-gray-300:#d1d5db;--r-color-gray-400:#9ca3af;--r-color-gray-500:#6b7280;--r-color-gray-600:#4b5563;--r-color-gray-700:#374151;--r-color-gray-800:#1f2937;--r-color-gray-900:#111827;--r-color-gray-950:#030712;--r-color-success-500:var(--color-success);--r-color-success-600:#16a34a;--r-color-warning-500:#f59e0b;--r-color-warning-600:var(--color-warning);--r-color-danger-500:#ef4444;--r-color-danger-600:var(--color-danger);--r-color-white:#fff;--r-color-black:#000;--r-font-family:var(--font-sans);--r-font-mono:var(--font-mono);--r-text-xs:0.75rem;--r-text-sm:0.875rem;--r-text-base:1rem;--r-text-lg:1.125rem;--r-text-xl:1.25rem;--r-text-2xl:1.5rem;--r-text-3xl:1.875rem;--r-text-4xl:2.25rem;--r-font-weight-normal:var(--weight-normal);--r-font-weight-medium:var(--weight-medium);--r-font-weight-semibold:var(--weight-semibold);--r-font-weight-bold:var(--weight-bold);--r-leading-tight:1.25;--r-leading-normal:1.5;--r-leading-relaxed:1.75;--r-space-0:0;--r-space-1:var(--space-4);--r-space-2:var(--space-8);--r-space-3:var(--space-12);--r-space-4:var(--space-16);--r-space-5:var(--space-20);--r-space-6:var(--space-24);--r-space-8:var(--space-32);--r-space-10:var(--space-40);--r-space-12:var(--space-48);--r-radius-none:0;--r-radius-sm:var(--radius-sm);--r-radius-md:var(--radius-md);--r-radius-lg:var(--radius-lg);--r-radius-xl:0.75rem;--r-radius-2xl:1rem;--r-radius-full:var(--radius-pill);--r-shadow-xs:0 1px 2px 0 rgba(0,0,0,.05);--r-shadow-sm:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--r-shadow-md:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--r-shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--r-shadow-xl:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);--r-transition-fast:var(--duration-fast) var(--ease-in-out);--r-transition-base:200ms var(--ease-in-out);--r-transition-slow:var(--duration-slow) var(--ease-in-out)}

package/dist/runtime/components/ActionBar.vue

@@ -91,5 +91,5 @@ function closeDrawer() {
 </template>
 
 <style scoped>
-.rm-action-bar{bottom:0;display:flex;position:fixed;right:0;top:0;transition:width .3s cubic-bezier(.4,0,.2,1);z-index:61}.rm-action-bar__panel{background-color:var(--r-color-white);border-left:1px solid var(--r-color-gray-200);display:flex;flex-direction:column;flex-shrink:0;height:100%}.rm-action-bar__header{align-items:center;display:flex;gap:12px;justify-content:space-between;min-height:64px;padding:0 16px}.rm-action-bar__tabs{border-bottom:1px solid var(--r-color-gray-200);padding:8px 16px 12px}.rm-action-bar__content{display:flex;flex:1;flex-direction:column;overflow-y:auto}.rm-action-bar__footer{border-top:1px solid var(--r-color-gray-200);padding:16px}.rm-action-bar__overlay{backdrop-filter:blur(2px);background-color:rgba(0,0,0,.2);inset:0;position:fixed;z-index:60}.rm-action-bar-overlay-enter-active,.rm-action-bar-overlay-leave-active{transition:opacity .25s ease}.rm-action-bar-overlay-enter-from,.rm-action-bar-overlay-leave-to{opacity:0}.rm-action-bar__drawer{background-color:var(--r-color-white);border-left:1px solid var(--r-color-gray-200);display:flex;flex:1;flex-direction:column;min-width:0;overflow:hidden}.rm-action-bar__drawer-header{align-items:center;border-bottom:1px solid var(--r-color-gray-200);display:flex;justify-content:space-between;min-height:64px;padding:0 24px}.rm-action-bar__drawer-close{align-items:center;background:none;border:none;border-radius:var(--r-radius-md);color:var(--r-color-gray-500);cursor:pointer;display:flex;flex-shrink:0;height:32px;justify-content:center;transition:all var(--r-transition-fast);width:32px}.rm-action-bar__drawer-close:hover{background-color:var(--r-color-gray-100);color:var(--r-color-gray-700)}.rm-action-bar__drawer-body{flex:1;overflow-y:auto;padding:24px}.rm-action-bar__drawer-footer{border-top:1px solid var(--r-color-gray-200);padding:16px 24px}.rm-action-bar-drawer-enter-active,.rm-action-bar-drawer-leave-active{transition:opacity .25s ease}.rm-action-bar-drawer-enter-from,.rm-action-bar-drawer-leave-to{opacity:0}
+.rm-action-bar{bottom:0;display:flex;position:fixed;right:0;top:0;transition:width .3s cubic-bezier(.4,0,.2,1);z-index:61}.rm-action-bar__panel{background-color:var(--color-text-inverse);border-left:1px solid var(--border-default);display:flex;flex-direction:column;flex-shrink:0;height:100%}.rm-action-bar__header{align-items:center;display:flex;gap:12px;justify-content:space-between;min-height:64px;padding:0 16px}.rm-action-bar__tabs{border-bottom:1px solid var(--border-default);padding:8px 16px 12px}.rm-action-bar__content{display:flex;flex:1;flex-direction:column;overflow-y:auto}.rm-action-bar__footer{border-top:1px solid var(--border-default);padding:16px}.rm-action-bar__overlay{backdrop-filter:blur(2px);background-color:rgba(0,0,0,.2);inset:0;position:fixed;z-index:60}.rm-action-bar-overlay-enter-active,.rm-action-bar-overlay-leave-active{transition:opacity .25s ease}.rm-action-bar-overlay-enter-from,.rm-action-bar-overlay-leave-to{opacity:0}.rm-action-bar__drawer{background-color:var(--color-text-inverse);border-left:1px solid var(--border-default);display:flex;flex:1;flex-direction:column;min-width:0;overflow:hidden}.rm-action-bar__drawer-header{align-items:center;border-bottom:1px solid var(--border-default);display:flex;justify-content:space-between;min-height:64px;padding:0 24px}.rm-action-bar__drawer-close{align-items:center;background:none;border:none;border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;display:flex;flex-shrink:0;height:32px;justify-content:center;transition:all var(--duration-fast) var(--ease-in-out);width:32px}.rm-action-bar__drawer-close:hover{background-color:var(--bg-surface-3);color:var(--text-secondary)}.rm-action-bar__drawer-body{flex:1;overflow-y:auto;padding:24px}.rm-action-bar__drawer-footer{border-top:1px solid var(--border-default);padding:16px 24px}.rm-action-bar-drawer-enter-active,.rm-action-bar-drawer-leave-active{transition:opacity .25s ease}.rm-action-bar-drawer-enter-from,.rm-action-bar-drawer-leave-to{opacity:0}
 </style>

package/dist/runtime/components/AdvancedSearch.vue

@@ -6,7 +6,7 @@ import {
   PhMinus,
 } from '@phosphor-icons/vue'
 
-interface SearchRow {
+export interface AdvancedSearchRow {
   id: number
   type: 'and' | 'or' | 'not'
   value: string
@@ -16,17 +16,28 @@ defineProps<{
   visible: boolean
 }>()
 
-defineEmits<{
+const emit = defineEmits<{
   close: []
   saveSearch: []
+  apply: [rows: AdvancedSearchRow[]]
+  clear: []
 }>()
 
 let nextId = 1
 
-const rows = ref<SearchRow[]>([
+const rows = ref<AdvancedSearchRow[]>([
   { id: nextId++, type: 'and', value: '' },
 ])
 
+let debounceTimer: ReturnType<typeof setTimeout>
+
+function emitApply() {
+  clearTimeout(debounceTimer)
+  debounceTimer = setTimeout(() => {
+    emit('apply', rows.value.filter(r => r.value.trim() !== ''))
+  }, 500)
+}
+
 function addRow(type: 'and' | 'or' | 'not') {
   rows.value.push({ id: nextId++, type, value: '' })
 }
@@ -36,16 +47,19 @@ function removeRow(id: number) {
   if (rows.value.length === 0) {
     rows.value.push({ id: nextId++, type: 'and', value: '' })
   }
+  emitApply()
 }
 
 function clearAll() {
   rows.value = [{ id: nextId++, type: 'and', value: '' }]
+  emit('clear')
+  emitApply()
 }
 
 const typeColors: Record<string, string> = {
-  and: '#4164EE',
-  or: '#07816F',
-  not: '#F7520E',
+  and: 'var(--color-healthcare)',
+  or: 'var(--color-discovery)',
+  not: 'var(--color-pharma)',
 }
 </script>
 
@@ -55,7 +69,6 @@ const typeColors: Record<string, string> = {
       <h2 class="advanced-search__title">Advanced search</h2>
       <RmButton variant="outline" size="sm" @click="$emit('saveSearch')">
         Save search
-        <PhLineVertical :size="14" />
       </RmButton>
     </div>
 
@@ -74,9 +87,15 @@ const typeColors: Record<string, string> = {
         <input
           v-model="row.value"
           type="text"
-          :placeholder="row.value ? '' : 'Add a keyword'"
+          placeholder="Add a keyword"
           class="advanced-search__input"
-          :class="{ 'advanced-search__input--not': row.type === 'not' }"
+          :class="{
+            'advanced-search__input--and': row.type === 'and',
+            'advanced-search__input--or': row.type === 'or',
+            'advanced-search__input--not': row.type === 'not',
+          }"
+          @input="emitApply"
+          @keydown.enter="emitApply"
         >
         <button class="advanced-search__delete" @click="removeRow(row.id)">
           <PhTrash :size="16" />
@@ -106,5 +125,5 @@ const typeColors: Record<string, string> = {
 </template>
 
 <style scoped>
-.advanced-search{background-color:var(--r-color-white);border-bottom:1px solid var(--r-color-gray-200);padding:20px 24px}.advanced-search__header{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.advanced-search__title{color:var(--r-color-gray-900);font-family:var(--r-font-family);font-size:16px;font-weight:700;margin:0}.advanced-search__rows{display:flex;flex-direction:column;gap:12px;margin-bottom:16px}.advanced-search__row{align-items:center;display:flex;gap:12px}.advanced-search__type{flex-shrink:0;font-weight:600;min-width:32px}.advanced-search__input,.advanced-search__type{font-family:var(--r-font-family);font-size:var(--r-text-sm)}.advanced-search__input{background:#fff;border:1px solid #dbdef0;border-radius:6px;color:var(--r-color-gray-900);flex:1;height:36px;outline:none;padding:0 12px;transition:border-color var(--r-transition-fast)}.advanced-search__input:focus{border-color:#4164ee}.advanced-search__input--not,.advanced-search__input--not:focus{border-color:#f7520e}.advanced-search__input::-moz-placeholder{color:var(--r-color-gray-400)}.advanced-search__input::placeholder{color:var(--r-color-gray-400)}.advanced-search__delete{align-items:center;background:none;border:none;border-radius:4px;color:var(--r-color-gray-400);cursor:pointer;display:flex;justify-content:center;padding:4px;transition:color var(--r-transition-fast)}.advanced-search__delete:hover{color:var(--r-color-danger-500)}.advanced-search__actions{display:flex;gap:8px;margin-bottom:16px}.advanced-search__add{align-items:center;background:#fff;border:1px solid #dbdef0;border-radius:6px;color:var(--r-color-gray-600);cursor:pointer;display:inline-flex;font-family:var(--r-font-family);font-size:var(--r-text-sm);font-weight:var(--r-font-weight-medium);gap:4px;height:32px;padding:4px 12px;transition:all var(--r-transition-fast)}.advanced-search__add:hover{border-color:var(--r-color-gray-300);box-shadow:0 1px 2px 0 rgba(30,41,59,.1)}.advanced-search__clear{background:none;border:1px solid var(--r-color-danger-500);border-radius:6px;color:var(--r-color-danger-500);cursor:pointer;font-family:var(--r-font-family);font-size:var(--r-text-sm);font-weight:var(--r-font-weight-medium);padding:4px 12px;transition:all var(--r-transition-fast)}.advanced-search__clear:hover{background-color:var(--r-color-danger-500);color:#fff}
+.advanced-search{background-color:var(--color-text-inverse);border-bottom:1px solid var(--border-default);padding:20px 24px}.advanced-search__header{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.advanced-search__title{color:var(--text-primary);font-family:var(--font-sans);font-size:16px;font-weight:700;margin:0}.advanced-search__rows{display:flex;flex-direction:column;gap:12px;margin-bottom:16px}.advanced-search__row{align-items:center;display:flex;gap:12px}.advanced-search__type{flex-shrink:0;font-weight:600;min-width:32px}.advanced-search__input,.advanced-search__type{font-family:var(--font-sans);font-size:var(--font-14)}.advanced-search__input{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:6px;color:var(--text-primary);flex:1;height:36px;outline:none;padding:0 12px;transition:border-color var(--duration-fast) var(--ease-in-out)}.advanced-search__input--and:focus,.advanced-search__input:focus{border-color:var(--color-healthcare)}.advanced-search__input--or:focus{border-color:var(--color-discovery)}.advanced-search__input--not,.advanced-search__input--not:focus{border-color:var(--color-pharma)}.advanced-search__input::-moz-placeholder{color:var(--text-muted)}.advanced-search__input::placeholder{color:var(--text-muted)}.advanced-search__delete{align-items:center;background:none;border:none;border-radius:4px;color:var(--text-muted);cursor:pointer;display:flex;justify-content:center;padding:4px;transition:color var(--duration-fast) var(--ease-in-out)}.advanced-search__delete:hover{color:var(--color-danger)}.advanced-search__actions{display:flex;gap:8px;margin-bottom:16px}.advanced-search__add{align-items:center;background:var(--bg-surface);border:1px solid var(--border-default);border-radius:6px;color:var(--text-secondary);cursor:pointer;display:inline-flex;font-family:var(--font-sans);font-size:var(--font-14);font-weight:var(--weight-medium);gap:4px;height:32px;padding:4px 12px;transition:all var(--duration-fast) var(--ease-in-out)}.advanced-search__add:hover{border-color:var(--border-default);box-shadow:0 1px 2px 0 rgba(var(--shadow-rgb),.1)}.advanced-search__clear{background:none;border:1px solid var(--color-danger);border-radius:6px;color:var(--color-danger);cursor:pointer;font-family:var(--font-sans);font-size:var(--font-14);font-weight:var(--weight-medium);padding:4px 12px;transition:all var(--duration-fast) var(--ease-in-out)}.advanced-search__clear:hover{background-color:var(--color-danger);color:var(--color-text-inverse)}
 </style>

package/dist/runtime/components/BarChart.vue

@@ -0,0 +1,45 @@
+<!--
+  RmBarChart - bar chart vertical (une ou plusieurs series, empilable) ou
+  horizontal. Option construite par utils/chart, palette et theme resolus par
+  useChartTheme, donc mode nuit et modes daltoniens suivis automatiquement.
+-->
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useChartTheme } from '../composables/useChartTheme'
+import { rmBarHorizontalOption, rmBarVerticalOption, type RmSeriesInput, RM_CHART_HEIGHTS } from '../utils/chart'
+
+const props = withDefaults(defineProps<{
+  /** Categories de l'axe : annees, libelles d'indicateur. */
+  categories: (string | number)[]
+  series: RmSeriesInput[]
+  horizontal?: boolean
+  height?: keyof typeof RM_CHART_HEIGHTS | number
+  description?: string
+  /** Formatage de la valeur en bout de barre (horizontal uniquement). */
+  labelFormatter?: (value: number) => string
+}>(), {
+  horizontal: false,
+  height: 'standard',
+  description: undefined,
+  labelFormatter: undefined,
+})
+
+const { theme, palette, decal } = useChartTheme()
+
+const option = computed(() =>
+  props.horizontal
+    ? rmBarHorizontalOption(
+        props.categories.map(String),
+        props.series[0]?.data ?? [],
+        theme.value,
+        palette.value.cat,
+        decal.value,
+        props.labelFormatter,
+      )
+    : rmBarVerticalOption(props.categories, props.series, theme.value, palette.value.cat, decal.value),
+)
+</script>
+
+<template>
+  <RmChart :option="option" :height="height" :description="description" />
+</template>

package/dist/runtime/components/Breadcrumb.vue

@@ -42,5 +42,5 @@ defineProps<RmBreadcrumbProps>()
 </template>
 
 <style scoped>
-.rm-breadcrumb{align-items:center;color:var(--r-color-gray-400);display:flex;font-family:var(--r-font-family);font-size:14px;gap:8px}.rm-breadcrumb__sep{color:var(--r-color-gray-300)}.rm-breadcrumb__item{align-items:center;color:var(--r-color-gray-400);display:inline-flex;gap:6px;text-decoration:none;transition:color var(--r-transition-fast)}.rm-breadcrumb__item--first{color:var(--r-color-gray-700);font-weight:500}a.rm-breadcrumb__item:hover{color:var(--r-color-primary-600)}.rm-breadcrumb__icon{color:var(--r-color-primary-500)}
+.rm-breadcrumb{align-items:center;color:var(--text-muted);display:flex;font-family:var(--font-sans);font-size:14px;gap:8px}.rm-breadcrumb__sep{color:var(--border-default)}.rm-breadcrumb__item{align-items:center;color:var(--text-muted);display:inline-flex;gap:6px;text-decoration:none;transition:color var(--duration-fast) var(--ease-in-out)}.rm-breadcrumb__item--first{color:var(--text-secondary);font-weight:500}.rm-breadcrumb__icon,a.rm-breadcrumb__item:hover{color:var(--color-healthcare)}
 </style>

package/dist/runtime/components/Button.vue

@@ -50,5 +50,5 @@ defineEmits<{
 </template>
 
 <style scoped>
-.rm-button{align-items:center;border:1px solid transparent;border-radius:6px;cursor:pointer;display:inline-flex;font-family:var(--r-font-family);font-weight:500;gap:8px;justify-content:center;transition:all var(--r-transition-fast);-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}.rm-button:focus-visible{outline:2px solid var(--r-color-primary-500);outline-offset:2px}.rm-button:disabled{cursor:not-allowed;opacity:.5}.rm-button--sm{font-size:13px;height:32px;padding:6px 16px}.rm-button--md{font-size:14px;height:40px;padding:10px 24px}.rm-button--lg{font-size:15px;height:48px;padding:12px 28px}.rm-button--primary-fill{background:linear-gradient(180deg,rgba(65,100,238,.8),rgba(65,100,238,.9));border-color:#4164ee;box-shadow:0 2px 3px 0 rgba(65,100,238,.5);color:var(--r-color-white)}.rm-button--primary-fill:hover:not(:disabled){background:linear-gradient(180deg,#4164ee,#4164ee);box-shadow:0 2px 4px 0 rgba(65,100,238,.6)}.rm-button--primary-fill:active:not(:disabled){background:#3451d4;box-shadow:0 1px 2px 0 rgba(65,100,238,.4)}.rm-button--primary-stroke{box-shadow:0 2px 3px 0 rgba(65,100,238,.5);color:#4164ee}.rm-button--primary-stroke,.rm-button--primary-stroke:hover:not(:disabled){background:linear-gradient(180deg,hsla(0,0%,100%,.5),hsla(0,0%,100%,.9));border-color:#4164ee}.rm-button--primary-stroke:hover:not(:disabled){box-shadow:none}.rm-button--primary-stroke:active:not(:disabled){background:var(--r-color-primary-50);box-shadow:none}.rm-button--discovery-fill{background:linear-gradient(180deg,rgba(7,129,111,.8),rgba(7,129,111,.9));border-color:#07816f;box-shadow:0 2px 3px 0 rgba(7,129,111,.5);color:var(--r-color-white)}.rm-button--discovery-fill:hover:not(:disabled){background:linear-gradient(180deg,#07816f,#07816f);border-color:#07816f;box-shadow:none}.rm-button--discovery-fill:active:not(:disabled){background:linear-gradient(180deg,#066b5c,#066b5c);box-shadow:none}.rm-button--discovery-stroke{box-shadow:0 2px 3px 0 rgba(7,129,111,.5);color:#07816f}.rm-button--discovery-stroke,.rm-button--discovery-stroke:hover:not(:disabled){background:linear-gradient(180deg,hsla(0,0%,100%,.5),hsla(0,0%,100%,.9));border-color:#07816f}.rm-button--discovery-stroke:hover:not(:disabled){box-shadow:none}.rm-button--discovery-stroke:active:not(:disabled){background:rgba(7,129,111,.05);box-shadow:none}.rm-button--databank-fill{background:linear-gradient(180deg,rgba(224,67,128,.8),rgba(224,67,128,.9));border-color:#e04380;box-shadow:0 2px 3px 0 rgba(224,67,128,.5);color:var(--r-color-white)}.rm-button--databank-fill:hover:not(:disabled){background:linear-gradient(180deg,#e04380,#e04380);border-color:#e04380;box-shadow:none}.rm-button--databank-fill:active:not(:disabled){background:linear-gradient(180deg,#c73a6f,#c73a6f);box-shadow:none}.rm-button--databank-stroke{box-shadow:0 2px 3px 0 rgba(224,67,128,.5);color:#e04380}.rm-button--databank-stroke,.rm-button--databank-stroke:hover:not(:disabled){background:linear-gradient(180deg,hsla(0,0%,100%,.5),hsla(0,0%,100%,.9));border-color:#e04380}.rm-button--databank-stroke:hover:not(:disabled){box-shadow:none}.rm-button--databank-stroke:active:not(:disabled){background:rgba(224,67,128,.05);box-shadow:none}.rm-button--pharma-fill{background:linear-gradient(180deg,#ff7942,#f7520e);border-color:#f7520e;box-shadow:0 2px 3px 0 rgba(247,82,14,.5);color:var(--r-color-white)}.rm-button--pharma-fill:hover:not(:disabled){background:linear-gradient(180deg,#f7520e,#f7520e);border-color:#f7520e;box-shadow:none}.rm-button--pharma-fill:active:not(:disabled){background:linear-gradient(180deg,#d9470c,#d9470c);box-shadow:none}.rm-button--pharma-stroke{box-shadow:0 2px 3px 0 rgba(247,82,14,.5);color:#f7520e}.rm-button--pharma-stroke,.rm-button--pharma-stroke:hover:not(:disabled){background:linear-gradient(180deg,hsla(0,0%,100%,.5),hsla(0,0%,100%,.9));border-color:#f7520e}.rm-button--pharma-stroke:hover:not(:disabled){box-shadow:none}.rm-button--pharma-stroke:active:not(:disabled){background:rgba(247,82,14,.05);box-shadow:none}.rm-button--secondary{background-color:var(--r-color-gray-100);color:var(--r-color-gray-800)}.rm-button--secondary:hover:not(:disabled){background-color:var(--r-color-gray-200)}.rm-button--secondary:active:not(:disabled){background-color:var(--r-color-gray-300)}.rm-button--outline{background-color:transparent;border-color:var(--r-color-gray-300);color:var(--r-color-gray-700)}.rm-button--outline:hover:not(:disabled){background-color:var(--r-color-gray-50);border-color:var(--r-color-gray-400)}.rm-button--outline:active:not(:disabled){background-color:var(--r-color-gray-100)}.rm-button--ghost{background-color:transparent;color:var(--r-color-gray-700)}.rm-button--ghost:hover:not(:disabled){background-color:var(--r-color-gray-100)}.rm-button--ghost:active:not(:disabled){background-color:var(--r-color-gray-200)}.rm-button--block{width:100%}
+.rm-button{align-items:center;border:1px solid transparent;border-radius:6px;cursor:pointer;display:inline-flex;font-family:var(--font-sans);font-weight:500;gap:8px;justify-content:center;transition:all var(--duration-fast) var(--ease-in-out);-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}.rm-button:focus-visible{outline:2px solid var(--color-healthcare);outline-offset:2px}.rm-button:disabled{cursor:not-allowed;opacity:.5}.rm-button--sm{font-size:13px;height:32px;padding:6px 16px}.rm-button--md{font-size:14px;height:40px;padding:10px 24px}.rm-button--lg{font-size:15px;height:48px;padding:12px 28px}.rm-button--primary-fill{background:linear-gradient(180deg,rgba(var(--healthcare-rgb),.8) 0,rgba(var(--healthcare-rgb),.9) 100%);border-color:var(--color-healthcare);box-shadow:0 2px 3px 0 rgba(var(--healthcare-rgb),.5);color:var(--color-text-inverse)}.rm-button--primary-fill:hover:not(:disabled){background:linear-gradient(180deg,var(--color-healthcare) 0,var(--color-healthcare) 100%);box-shadow:0 2px 4px 0 rgba(var(--healthcare-rgb),.6)}.rm-button--primary-fill:active:not(:disabled){background:var(--color-healthcare-active);box-shadow:0 1px 2px 0 rgba(var(--healthcare-rgb),.4)}.rm-button--primary-stroke{box-shadow:0 2px 3px 0 rgba(var(--healthcare-rgb),.5);color:var(--color-healthcare)}.rm-button--primary-stroke,.rm-button--primary-stroke:hover:not(:disabled){background:linear-gradient(180deg,rgba(var(--surface-rgb),.5) 0,rgba(var(--surface-rgb),.9) 100%);border-color:var(--color-healthcare)}.rm-button--primary-stroke:hover:not(:disabled){box-shadow:none}.rm-button--primary-stroke:active:not(:disabled){background:var(--bg-hover);box-shadow:none}.rm-button--discovery-fill{background:linear-gradient(180deg,rgba(var(--discovery-rgb),.8) 0,rgba(var(--discovery-rgb),.9) 100%);border-color:var(--color-discovery);box-shadow:0 2px 3px 0 rgba(var(--discovery-rgb),.5);color:var(--color-text-inverse)}.rm-button--discovery-fill:hover:not(:disabled){background:linear-gradient(180deg,var(--color-discovery) 0,var(--color-discovery) 100%);border-color:var(--color-discovery);box-shadow:none}.rm-button--discovery-fill:active:not(:disabled){background:linear-gradient(180deg,var(--color-discovery-active) 0,var(--color-discovery-active) 100%);box-shadow:none}.rm-button--discovery-stroke{box-shadow:0 2px 3px 0 rgba(var(--discovery-rgb),.5);color:var(--color-discovery)}.rm-button--discovery-stroke,.rm-button--discovery-stroke:hover:not(:disabled){background:linear-gradient(180deg,rgba(var(--surface-rgb),.5) 0,rgba(var(--surface-rgb),.9) 100%);border-color:var(--color-discovery)}.rm-button--discovery-stroke:hover:not(:disabled){box-shadow:none}.rm-button--discovery-stroke:active:not(:disabled){background:rgba(var(--discovery-rgb),.05);box-shadow:none}.rm-button--databank-fill{background:linear-gradient(180deg,rgba(var(--databank-rgb),.8) 0,rgba(var(--databank-rgb),.9) 100%);border-color:var(--color-databank);box-shadow:0 2px 3px 0 rgba(var(--databank-rgb),.5);color:var(--color-text-inverse)}.rm-button--databank-fill:hover:not(:disabled){background:linear-gradient(180deg,var(--color-databank) 0,var(--color-databank) 100%);border-color:var(--color-databank);box-shadow:none}.rm-button--databank-fill:active:not(:disabled){background:linear-gradient(180deg,var(--color-databank-active) 0,var(--color-databank-active) 100%);box-shadow:none}.rm-button--databank-stroke{box-shadow:0 2px 3px 0 rgba(var(--databank-rgb),.5);color:var(--color-databank)}.rm-button--databank-stroke,.rm-button--databank-stroke:hover:not(:disabled){background:linear-gradient(180deg,rgba(var(--surface-rgb),.5) 0,rgba(var(--surface-rgb),.9) 100%);border-color:var(--color-databank)}.rm-button--databank-stroke:hover:not(:disabled){box-shadow:none}.rm-button--databank-stroke:active:not(:disabled){background:rgba(var(--databank-rgb),.05);box-shadow:none}.rm-button--pharma-fill{background:linear-gradient(180deg,var(--color-pharma-soft) 0,var(--color-pharma) 100%);border-color:var(--color-pharma);box-shadow:0 2px 3px 0 rgba(var(--pharma-rgb),.5);color:var(--color-text-inverse)}.rm-button--pharma-fill:hover:not(:disabled){background:linear-gradient(180deg,var(--color-pharma) 0,var(--color-pharma) 100%);border-color:var(--color-pharma);box-shadow:none}.rm-button--pharma-fill:active:not(:disabled){background:linear-gradient(180deg,var(--color-pharma-active) 0,var(--color-pharma-active) 100%);box-shadow:none}.rm-button--pharma-stroke{box-shadow:0 2px 3px 0 rgba(var(--pharma-rgb),.5);color:var(--color-pharma)}.rm-button--pharma-stroke,.rm-button--pharma-stroke:hover:not(:disabled){background:linear-gradient(180deg,rgba(var(--surface-rgb),.5) 0,rgba(var(--surface-rgb),.9) 100%);border-color:var(--color-pharma)}.rm-button--pharma-stroke:hover:not(:disabled){box-shadow:none}.rm-button--pharma-stroke:active:not(:disabled){background:rgba(var(--pharma-rgb),.05);box-shadow:none}.rm-button--secondary{background-color:var(--bg-surface-3);color:var(--text-primary)}.rm-button--secondary:active:not(:disabled),.rm-button--secondary:hover:not(:disabled){background-color:var(--border-default)}.rm-button--outline{background-color:transparent;border-color:var(--border-default);color:var(--text-secondary)}.rm-button--outline:hover:not(:disabled){background-color:var(--bg-surface-2);border-color:var(--text-muted)}.rm-button--outline:active:not(:disabled){background-color:var(--bg-surface-3)}.rm-button--ghost{background-color:transparent;color:var(--text-secondary)}.rm-button--ghost:hover:not(:disabled){background-color:var(--bg-surface-3)}.rm-button--ghost:active:not(:disabled){background-color:var(--border-default)}.rm-button--block{width:100%}
 </style>

package/dist/runtime/components/Card.vue

@@ -43,5 +43,5 @@ withDefaults(defineProps<RCardProps>(), {
 </template>
 
 <style scoped>
-.r-card{background-color:var(--r-color-white);border-radius:var(--r-radius-xl);overflow:hidden;transition:all var(--r-transition-base)}.r-card--bordered{border:1px solid var(--r-color-gray-200)}.r-card--shadow-none{box-shadow:none}.r-card--shadow-sm{box-shadow:var(--r-shadow-sm)}.r-card--shadow-md{box-shadow:var(--r-shadow-md)}.r-card--hoverable:hover,.r-card--shadow-lg{box-shadow:var(--r-shadow-lg)}.r-card--hoverable:hover{transform:translateY(-2px)}.r-card--padding-none .r-card__body{padding:0}.r-card--padding-sm .r-card__body{padding:var(--r-space-3)}.r-card--padding-md .r-card__body{padding:var(--r-space-5)}.r-card--padding-lg .r-card__body{padding:var(--r-space-8)}.r-card__header{border-bottom:1px solid var(--r-color-gray-200);font-weight:var(--r-font-weight-semibold)}.r-card__footer,.r-card__header{padding:var(--r-space-4) var(--r-space-5)}.r-card__footer{background-color:var(--r-color-gray-50);border-top:1px solid var(--r-color-gray-200)}
+.r-card{background-color:var(--color-text-inverse);border-radius:var(--radius-xl);overflow:hidden;transition:all var(--duration-base) var(--ease-in-out)}.r-card--bordered{border:1px solid var(--border-default)}.r-card--shadow-none{box-shadow:none}.r-card--shadow-sm{box-shadow:var(--shadow-sm)}.r-card--shadow-md{box-shadow:var(--shadow-md)}.r-card--hoverable:hover,.r-card--shadow-lg{box-shadow:var(--shadow-lg)}.r-card--hoverable:hover{transform:translateY(-2px)}.r-card--padding-none .r-card__body{padding:0}.r-card--padding-sm .r-card__body{padding:var(--space-12)}.r-card--padding-md .r-card__body{padding:var(--space-20)}.r-card--padding-lg .r-card__body{padding:var(--space-32)}.r-card__header{border-bottom:1px solid var(--border-default);font-weight:var(--weight-semibold)}.r-card__footer,.r-card__header{padding:var(--space-16) var(--space-20)}.r-card__footer{background-color:var(--bg-surface-2);border-top:1px solid var(--border-default)}
 </style>

package/dist/runtime/components/Chart.vue

@@ -0,0 +1,75 @@
+<!--
+  RmChart - enveloppe ECharts bas niveau. Les composants RmBarChart,
+  RmLineChart, RmDonutChart et RmSparklineChart construisent leur `option` et
+  la passent ici ; une page peut aussi fournir une option brute pour un type
+  non couvert.
+
+  Renderer SVG impose, comme dans le design system : net en HiDPI, et
+  exportable en vectoriel depuis le menu de la chart-card.
+-->
+<script setup lang="ts">
+import { onBeforeUnmount, onMounted, ref, shallowRef, watch } from 'vue'
+import { RM_CHART_HEIGHTS } from '../utils/chart'
+
+const props = withDefaults(defineProps<{
+  /** Option ECharts complete. */
+  option: Record<string, unknown>
+  /** Hauteur : un palier normalise du design system, ou un nombre de pixels. */
+  height?: keyof typeof RM_CHART_HEIGHTS | number
+  /**
+   * Description textuelle du graphe pour les lecteurs d'ecran. ECharts genere
+   * un resume automatique, mais il enonce des series et des valeurs brutes :
+   * une phrase de lecture vaut mieux. Le survol n'etant jamais le seul acces
+   * a l'information, la donnee cle doit de toute facon rester dans le texte
+   * de l'ecran.
+   */
+  description?: string
+}>(), {
+  height: 'standard',
+  description: undefined,
+})
+
+const el = ref<HTMLElement | null>(null)
+const chart = shallowRef<{ setOption: (o: unknown, n?: boolean) => void, resize: () => void, dispose: () => void } | null>(null)
+let observer: ResizeObserver | null = null
+
+const heightPx = () =>
+  typeof props.height === 'number' ? props.height : RM_CHART_HEIGHTS[props.height]
+
+onMounted(async () => {
+  if (!el.value) return
+  const echarts = await import('echarts')
+  chart.value = echarts.init(el.value, undefined, { renderer: 'svg' })
+  chart.value.setOption(props.option)
+
+  // ResizeObserver plutot qu'un listener global sur window : un graphe dans un
+  // panneau repliable ou une grille change de taille sans que la fenetre bouge.
+  observer = new ResizeObserver(() => chart.value?.resize())
+  observer.observe(el.value)
+})
+
+// `true` en second argument : on remplace l'option au lieu de la fusionner.
+// Sans ca, retirer une serie la laisse affichee, parce qu'ECharts fusionne
+// par defaut et ne sait pas qu'elle a disparu.
+watch(() => props.option, (next) => chart.value?.setOption(next, true), { deep: true })
+
+onBeforeUnmount(() => {
+  observer?.disconnect()
+  observer = null
+  chart.value?.dispose()
+  chart.value = null
+})
+
+defineExpose({ instance: chart })
+</script>
+
+<template>
+  <figure class="rm-chart">
+    <div ref="el" class="echart" :style="{ height: `${heightPx()}px` }" role="img" :aria-label="description" />
+    <figcaption v-if="description" class="sr-only">{{ description }}</figcaption>
+  </figure>
+</template>
+
+<style scoped>
+.rm-chart{margin:0}.echart{width:100%}
+</style>

package/dist/runtime/components/ChartCard.vue

@@ -34,6 +34,7 @@ const props = withDefaults(defineProps<{
 
 const emit = defineEmits<{
   exportPng: []
+  exportSvg: []
   exportCsv: []
   exportXlsx: []
   copyLink: []
@@ -67,7 +68,7 @@ onBeforeUnmount(() => {
   document.removeEventListener('keydown', onEscape)
 })
 
-function run(action: 'exportPng' | 'exportCsv' | 'exportXlsx' | 'copyLink' | 'fullscreen') {
+function run(action: 'exportPng' | 'exportSvg' | 'exportCsv' | 'exportXlsx' | 'copyLink' | 'fullscreen') {
   menuOpen.value = false
   emit(action)
 }
@@ -94,6 +95,9 @@ function run(action: 'exportPng' | 'exportCsv' | 'exportXlsx' | 'copyLink' | 'fu
           <button class="cc-menu-item" type="button" role="menuitem" @click="run('exportPng')">
             <RmIcon name="Image" :size="14" /> Image PNG
           </button>
+          <button class="cc-menu-item" type="button" role="menuitem" @click="run('exportSvg')">
+            <RmIcon name="VectorThree" :size="14" /> Vectoriel SVG
+          </button>
           <button class="cc-menu-item" type="button" role="menuitem" @click="run('exportCsv')">
             <RmIcon name="FileCsv" :size="14" /> Données CSV
           </button>

package/dist/runtime/components/DonutChart.vue

@@ -0,0 +1,27 @@
+<!--
+  RmDonutChart - repartition en parts. Au-dela de six parts, regrouper le
+  reste en "Autres" : la palette categorielle s'arrete a six couleurs
+  distinguables sous dyschromatopsie.
+-->
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useChartTheme } from '../composables/useChartTheme'
+import { rmDonutOption, RM_CHART_HEIGHTS } from '../utils/chart'
+
+const props = withDefaults(defineProps<{
+  data: { name: string, value: number }[]
+  height?: keyof typeof RM_CHART_HEIGHTS | number
+  description?: string
+}>(), {
+  height: 'standard',
+  description: undefined,
+})
+
+const { theme, palette, decal } = useChartTheme()
+
+const option = computed(() => rmDonutOption(props.data, theme.value, palette.value.cat, decal.value))
+</script>
+
+<template>
+  <RmChart :option="option" :height="height" :description="description" />
+</template>

package/dist/runtime/components/Drawer.vue

@@ -75,5 +75,5 @@ const drawerWidth = computed(() => sizeMap[props.size] || props.size)
 </template>
 
 <style scoped>
-.rm-drawer-overlay{backdrop-filter:blur(2px);background-color:rgba(0,0,0,.2);inset:0;position:fixed;z-index:90}.rm-drawer{background-color:var(--r-color-white);bottom:0;box-shadow:var(--r-shadow-xl);display:flex;flex-direction:column;max-width:100%;position:fixed;top:0;z-index:91}.rm-drawer--right{border-left:1px solid var(--r-color-gray-200)}.rm-drawer--left{border-right:1px solid var(--r-color-gray-200)}.rm-drawer__header{align-items:center;border-bottom:1px solid var(--r-color-gray-200);display:flex;justify-content:space-between;min-height:64px;padding:16px 24px}.rm-drawer__close{align-items:center;background:none;border:none;border-radius:var(--r-radius-md);color:var(--r-color-gray-500);cursor:pointer;display:flex;flex-shrink:0;height:32px;justify-content:center;transition:all var(--r-transition-fast);width:32px}.rm-drawer__close:hover{background-color:var(--r-color-gray-100);color:var(--r-color-gray-700)}.rm-drawer__body{flex:1;overflow-y:auto;padding:24px}.rm-drawer__footer{border-top:1px solid var(--r-color-gray-200);padding:16px 24px}.rm-drawer-overlay-enter-active,.rm-drawer-overlay-leave-active{transition:opacity .25s ease}.rm-drawer-overlay-enter-from,.rm-drawer-overlay-leave-to{opacity:0}.rm-drawer-slide-right-enter-active,.rm-drawer-slide-right-leave-active{transition:transform .3s cubic-bezier(.4,0,.2,1)}.rm-drawer-slide-right-enter-from,.rm-drawer-slide-right-leave-to{transform:translateX(100%)}.rm-drawer-slide-left-enter-active,.rm-drawer-slide-left-leave-active{transition:transform .3s cubic-bezier(.4,0,.2,1)}.rm-drawer-slide-left-enter-from,.rm-drawer-slide-left-leave-to{transform:translateX(-100%)}
+.rm-drawer-overlay{backdrop-filter:blur(2px);background-color:rgba(0,0,0,.2);inset:0;position:fixed;z-index:90}.rm-drawer{background-color:var(--color-text-inverse);bottom:0;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;max-width:100%;position:fixed;top:0;z-index:91}.rm-drawer--right{border-left:1px solid var(--border-default)}.rm-drawer--left{border-right:1px solid var(--border-default)}.rm-drawer__header{align-items:center;border-bottom:1px solid var(--border-default);display:flex;justify-content:space-between;min-height:64px;padding:16px 24px}.rm-drawer__close{align-items:center;background:none;border:none;border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;display:flex;flex-shrink:0;height:32px;justify-content:center;transition:all var(--duration-fast) var(--ease-in-out);width:32px}.rm-drawer__close:hover{background-color:var(--bg-surface-3);color:var(--text-secondary)}.rm-drawer__body{flex:1;overflow-y:auto;padding:24px}.rm-drawer__footer{border-top:1px solid var(--border-default);padding:16px 24px}.rm-drawer-overlay-enter-active,.rm-drawer-overlay-leave-active{transition:opacity .25s ease}.rm-drawer-overlay-enter-from,.rm-drawer-overlay-leave-to{opacity:0}.rm-drawer-slide-right-enter-active,.rm-drawer-slide-right-leave-active{transition:transform .3s cubic-bezier(.4,0,.2,1)}.rm-drawer-slide-right-enter-from,.rm-drawer-slide-right-leave-to{transform:translateX(100%)}.rm-drawer-slide-left-enter-active,.rm-drawer-slide-left-leave-active{transition:transform .3s cubic-bezier(.4,0,.2,1)}.rm-drawer-slide-left-enter-from,.rm-drawer-slide-left-leave-to{transform:translateX(-100%)}
 </style>

package/dist/runtime/components/FilterCheckbox.vue

@@ -22,5 +22,5 @@ const checked = defineModel<boolean>({ default: false })
 </template>
 
 <style scoped>
-.filter-checkbox{align-items:center;background:#fff;border:1px solid #dbdef0;border-radius:6px;box-sizing:border-box;color:var(--r-color-gray-600);cursor:pointer;display:flex;font-family:var(--r-font-family);font-size:var(--r-text-sm);font-weight:var(--r-font-weight-medium);gap:8px;height:32px;padding:8px;transition:all var(--r-transition-fast);white-space:nowrap;width:193px}.filter-checkbox:hover{border-color:var(--r-color-gray-300)}.filter-checkbox--active{border-color:#4164ee;box-shadow:0 0 8px 0 rgba(65,100,238,.1)}.filter-checkbox__box{align-items:center;border:1.5px solid var(--r-color-gray-300);border-radius:3px;display:flex;flex-shrink:0;height:16px;justify-content:center;transition:all var(--r-transition-fast);width:16px}.filter-checkbox__box--checked{background-color:#4164ee;border-color:#4164ee;color:#fff}
+.filter-checkbox{align-items:center;background:var(--bg-surface);border:1px solid var(--border-default);border-radius:6px;box-sizing:border-box;color:var(--text-secondary);cursor:pointer;display:flex;font-family:var(--font-sans);font-size:var(--font-14);font-weight:var(--weight-medium);gap:8px;height:32px;padding:8px;transition:all var(--duration-fast) var(--ease-in-out);white-space:nowrap;width:193px}.filter-checkbox:hover{border-color:var(--border-default)}.filter-checkbox--active{border-color:var(--color-healthcare);box-shadow:0 0 8px 0 rgba(var(--healthcare-rgb),.1)}.filter-checkbox__box{align-items:center;border:1.5px solid var(--border-default);border-radius:3px;display:flex;flex-shrink:0;height:16px;justify-content:center;transition:all var(--duration-fast) var(--ease-in-out);width:16px}.filter-checkbox__box--checked{background-color:var(--color-healthcare);border-color:var(--color-healthcare);color:var(--color-text-inverse)}
 </style>

package/dist/runtime/components/FilterComplex.vue

@@ -112,7 +112,7 @@ onUnmounted(() => document.removeEventListener('click', onClickOutside))
           <h3 class="filter-complex__title">Custom selection</h3>
 
           <div class="filter-complex__search">
-            <PhMagnifyingGlass :size="14" color="#9ca3af" />
+            <PhMagnifyingGlass :size="14" color="var(--text-muted)" />
             <input
               v-model="addSearch"
               type="text"
@@ -165,7 +165,7 @@ onUnmounted(() => document.removeEventListener('click', onClickOutside))
           </div>
 
           <div v-if="selected.length > 0" class="filter-complex__search">
-            <PhMagnifyingGlass :size="14" color="#9ca3af" />
+            <PhMagnifyingGlass :size="14" color="var(--text-muted)" />
             <input
               v-model="delSearch"
               type="text"
@@ -201,5 +201,5 @@ onUnmounted(() => document.removeEventListener('click', onClickOutside))
 </template>
 
 <style scoped>
-.filter-complex{position:relative}.filter-complex__trigger{align-items:center;background:#fff;border:1px solid #dbdef0;border-radius:6px;box-sizing:border-box;color:var(--r-color-gray-600);cursor:pointer;display:flex;font-family:var(--r-font-family);font-size:var(--r-text-sm);font-weight:var(--r-font-weight-medium);gap:8px;height:32px;padding:8px;transition:all var(--r-transition-fast);white-space:nowrap;width:193px}.filter-complex__trigger:hover{border-color:var(--r-color-gray-300)}.filter-complex__icon{color:#4164ee;flex-shrink:0}.filter-complex__trigger--active{border-color:#4164ee;box-shadow:0 0 8px 0 rgba(65,100,238,.1)}.filter-complex__label{flex:1;min-width:0;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.filter-complex__badge{align-items:center;background-color:#4164ee;border-radius:100px;color:#fff;display:inline-flex;flex-shrink:0;font-size:11px;font-weight:600;height:18px;justify-content:center;line-height:1;min-width:18px;padding:0 5px}.filter-complex__caret{color:var(--r-color-gray-400);flex-shrink:0;transition:transform var(--r-transition-fast)}.filter-complex__caret--open{transform:rotate(180deg)}.filter-complex__panel{background:#fff;border:1px solid #dbdef0;border-radius:8px;box-shadow:0 4px 24px rgba(0,0,0,.1),0 2px 8px rgba(0,0,0,.05);display:flex;left:0;max-height:380px;overflow:hidden;position:absolute;top:calc(100% + 4px);width:520px;z-index:50}.filter-complex__left{flex:1 1 60%;flex-direction:column}.filter-complex__left,.filter-complex__right{display:flex;gap:8px;overflow:hidden;padding:20px}.filter-complex__right{background-color:var(--r-color-gray-50);border-left:1px solid #dbdef0;flex:1 1 40%;flex-direction:column}.filter-complex__right-header{align-items:center;display:flex;justify-content:space-between}.filter-complex__title{color:var(--r-color-gray-700);font-size:var(--r-text-sm);font-weight:var(--r-font-weight-semibold);margin:0}.filter-complex__search{align-items:center;background:#fff;border:1px solid #dbdef0;border-radius:6px;display:flex;gap:8px;padding:6px 8px}.filter-complex__search:focus-within{border-color:#4164ee}.filter-complex__search-input{background:transparent;border:none;color:var(--r-color-gray-700);flex:1;font-family:var(--r-font-family);font-size:var(--r-text-sm);outline:none}.filter-complex__search-input::-moz-placeholder{color:var(--r-color-gray-400)}.filter-complex__search-input::placeholder{color:var(--r-color-gray-400)}.filter-complex__search-clear{color:var(--r-color-gray-400);cursor:pointer;flex-shrink:0}.filter-complex__search-clear:hover{color:var(--r-color-gray-700)}.filter-complex__action{background:none;border:none;cursor:pointer;font-family:var(--r-font-family);font-size:var(--r-text-sm);padding:0;text-align:left;text-decoration:underline}.filter-complex__action--add{color:#4164ee}.filter-complex__action--add:hover{color:#3451d4}.filter-complex__action--clear{color:var(--r-color-danger-500)}.filter-complex__action--clear:hover{color:var(--r-color-danger-600)}.filter-complex__list{display:flex;flex:1;flex-direction:column;overflow-y:auto}.filter-complex__list::-webkit-scrollbar{width:4px}.filter-complex__list::-webkit-scrollbar-thumb{background:var(--r-color-gray-200);border-radius:100px}.filter-complex__list::-webkit-scrollbar-thumb:hover{background:var(--r-color-gray-400)}.filter-complex__item{align-items:center;background:none;border:none;border-radius:4px;color:var(--r-color-gray-700);cursor:pointer;display:flex;font-family:var(--r-font-family);font-size:var(--r-text-sm);gap:8px;padding:6px 8px;text-align:left;transition:background-color var(--r-transition-fast)}.filter-complex__item:hover{background-color:var(--r-color-gray-50)}.filter-complex__right .filter-complex__item:hover{background-color:var(--r-color-gray-100)}.filter-complex__item-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filter-complex__item-icon{flex-shrink:0;opacity:0;transition:opacity var(--r-transition-fast)}.filter-complex__item:hover .filter-complex__item-icon{opacity:1}.filter-complex__item-icon--add{color:#4164ee}.filter-complex__item-icon--remove{color:var(--r-color-danger-500)}.filter-complex__empty{color:var(--r-color-gray-400);font-size:var(--r-text-sm);font-style:italic;padding:8px}.dropdown-enter-active,.dropdown-leave-active{transition:opacity var(--r-transition-fast),transform var(--r-transition-fast)}.dropdown-enter-from,.dropdown-leave-to{opacity:0;transform:translateY(-4px)}
+.filter-complex{position:relative}.filter-complex__trigger{align-items:center;background:var(--bg-surface);border:1px solid var(--border-default);border-radius:6px;box-sizing:border-box;color:var(--text-secondary);cursor:pointer;display:flex;font-family:var(--font-sans);font-size:var(--font-14);font-weight:var(--weight-medium);gap:8px;height:32px;padding:8px;transition:all var(--duration-fast) var(--ease-in-out);white-space:nowrap;width:193px}.filter-complex__trigger:hover{border-color:var(--border-default)}.filter-complex__icon{color:var(--color-healthcare);flex-shrink:0}.filter-complex__trigger--active{border-color:var(--color-healthcare);box-shadow:0 0 8px 0 rgba(var(--healthcare-rgb),.1)}.filter-complex__label{flex:1;min-width:0;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.filter-complex__badge{align-items:center;background-color:var(--color-healthcare);border-radius:100px;color:var(--color-text-inverse);display:inline-flex;flex-shrink:0;font-size:11px;font-weight:600;height:18px;justify-content:center;line-height:1;min-width:18px;padding:0 5px}.filter-complex__caret{color:var(--text-muted);flex-shrink:0;transition:transform var(--duration-fast) var(--ease-in-out)}.filter-complex__caret--open{transform:rotate(180deg)}.filter-complex__panel{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:8px;box-shadow:0 4px 24px rgba(var(--shadow-rgb),.1),0 2px 8px rgba(var(--shadow-rgb),.05);display:flex;left:0;max-height:380px;overflow:hidden;position:absolute;top:calc(100% + 4px);width:520px;z-index:50}.filter-complex__left{flex:1 1 60%;flex-direction:column}.filter-complex__left,.filter-complex__right{display:flex;gap:8px;overflow:hidden;padding:20px}.filter-complex__right{background-color:var(--bg-surface-2);border-left:1px solid var(--border-default);flex:1 1 40%;flex-direction:column}.filter-complex__right-header{align-items:center;display:flex;justify-content:space-between}.filter-complex__title{color:var(--text-secondary);font-size:var(--font-14);font-weight:var(--weight-semibold);margin:0}.filter-complex__search{align-items:center;background:var(--bg-surface);border:1px solid var(--border-default);border-radius:6px;display:flex;gap:8px;padding:6px 8px}.filter-complex__search:focus-within{border-color:var(--color-healthcare)}.filter-complex__search-input{background:transparent;border:none;color:var(--text-secondary);flex:1;font-family:var(--font-sans);font-size:var(--font-14);outline:none}.filter-complex__search-input::-moz-placeholder{color:var(--text-muted)}.filter-complex__search-input::placeholder{color:var(--text-muted)}.filter-complex__search-clear{color:var(--text-muted);cursor:pointer;flex-shrink:0}.filter-complex__search-clear:hover{color:var(--text-secondary)}.filter-complex__action{background:none;border:none;cursor:pointer;font-family:var(--font-sans);font-size:var(--font-14);padding:0;text-align:left;text-decoration:underline}.filter-complex__action--add{color:var(--color-healthcare)}.filter-complex__action--add:hover{color:var(--color-healthcare-active)}.filter-complex__action--clear,.filter-complex__action--clear:hover{color:var(--color-danger)}.filter-complex__list{display:flex;flex:1;flex-direction:column;overflow-y:auto}.filter-complex__list::-webkit-scrollbar{width:4px}.filter-complex__list::-webkit-scrollbar-thumb{background:var(--border-default);border-radius:100px}.filter-complex__list::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.filter-complex__item{align-items:center;background:none;border:none;border-radius:4px;color:var(--text-secondary);cursor:pointer;display:flex;font-family:var(--font-sans);font-size:var(--font-14);gap:8px;padding:6px 8px;text-align:left;transition:background-color var(--duration-fast) var(--ease-in-out)}.filter-complex__item:hover{background-color:var(--bg-surface-2)}.filter-complex__right .filter-complex__item:hover{background-color:var(--bg-surface-3)}.filter-complex__item-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filter-complex__item-icon{flex-shrink:0;opacity:0;transition:opacity var(--duration-fast) var(--ease-in-out)}.filter-complex__item:hover .filter-complex__item-icon{opacity:1}.filter-complex__item-icon--add{color:var(--color-healthcare)}.filter-complex__item-icon--remove{color:var(--color-danger)}.filter-complex__empty{color:var(--text-muted);font-size:var(--font-14);font-style:italic;padding:8px}.dropdown-enter-active,.dropdown-leave-active{transition:opacity var(--duration-fast) var(--ease-in-out),transform var(--duration-fast) var(--ease-in-out)}.dropdown-enter-from,.dropdown-leave-to{opacity:0;transform:translateY(-4px)}
 </style>

package/dist/runtime/components/FilterDropdown.vue

@@ -12,9 +12,11 @@ const props = withDefaults(defineProps<{
   label: string
   options: FilterDropdownOption[]
   multiple?: boolean
+  showSelectAll?: boolean
 }>(), {
   icon: undefined,
   multiple: true,
+  showSelectAll: false,
 })
 
 const selected = defineModel<string[]>({ default: () => [] })
@@ -61,6 +63,17 @@ function isSelected(value: string) {
   return selected.value.includes(value)
 }
 
+const allSelected = computed(() => props.options.length > 0 && selected.value.length === props.options.length)
+
+function toggleAll() {
+  hasUserChanged.value = true
+  if (allSelected.value) {
+    selected.value = []
+  } else {
+    selected.value = props.options.map(o => o.value)
+  }
+}
+
 function onClickOutside(e: Event) {
   if (chipRef.value && !chipRef.value.contains(e.target as Node)) {
     isOpen.value = false
@@ -92,6 +105,17 @@ onUnmounted(() => document.removeEventListener('click', onClickOutside))
 
     <Transition name="dropdown">
       <div v-if="isOpen" class="filter-chip__dropdown">
+        <button
+          v-if="showSelectAll && multiple && options.length > 0"
+          class="filter-chip__select-all"
+          @click="toggleAll"
+        >
+          <span class="filter-chip__checkbox" :class="{ 'filter-chip__checkbox--checked': allSelected }">
+            <PhCheck v-if="allSelected" :size="10" weight="bold" />
+          </span>
+          <span>{{ allSelected ? 'Deselect all' : 'Select all' }}</span>
+        </button>
+        <div :class="{ 'filter-chip__options-group': showSelectAll && multiple && options.length > 0 }">
         <button
           v-for="option in options"
           :key="option.value"
@@ -109,11 +133,12 @@ onUnmounted(() => document.removeEventListener('click', onClickOutside))
           </span>
           <span>{{ option.label }}</span>
         </button>
+        </div>
       </div>
     </Transition>
   </div>
 </template>
 
 <style scoped>
-.filter-chip-wrapper{position:relative}.filter-chip{align-items:center;background:#fff;border:1px solid #dbdef0;border-radius:6px;box-sizing:border-box;color:var(--r-color-gray-600);cursor:pointer;display:flex;font-family:var(--r-font-family);font-size:var(--r-text-sm);font-weight:var(--r-font-weight-medium);gap:8px;height:32px;padding:8px;transition:all var(--r-transition-fast);white-space:nowrap;width:193px}.filter-chip:hover{border-color:var(--r-color-gray-300)}.filter-chip__icon{color:#4164ee;flex-shrink:0}.filter-chip--active{border-color:#4164ee;box-shadow:0 0 8px 0 rgba(65,100,238,.1)}.filter-chip__label{flex:1;min-width:0;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.filter-chip__badge{align-items:center;background-color:#4164ee;border-radius:100px;color:#fff;display:inline-flex;flex-shrink:0;font-size:11px;font-weight:600;height:18px;justify-content:center;line-height:1;min-width:18px;padding:0 5px}.filter-chip__caret{color:var(--r-color-gray-400);flex-shrink:0;transition:transform var(--r-transition-fast)}.filter-chip__caret--open{transform:rotate(180deg)}.filter-chip__dropdown{background-color:#fff;border:1px solid #dbdef0;border-radius:6px;box-shadow:0 4px 12px rgba(0,0,0,.08),0 2px 4px rgba(0,0,0,.04);left:0;max-height:260px;min-width:200px;overflow-y:auto;padding:4px;position:absolute;top:calc(100% + 4px);z-index:50}.filter-chip__option{align-items:center;background:none;border:none;border-radius:4px;color:var(--r-color-gray-700);cursor:pointer;display:flex;font-family:var(--r-font-family);font-size:var(--r-text-sm);gap:8px;padding:6px 8px;text-align:left;transition:background-color var(--r-transition-fast);width:100%}.filter-chip__option:hover{background-color:var(--r-color-gray-50)}.filter-chip__option--selected{color:var(--r-color-gray-900);font-weight:var(--r-font-weight-medium)}.filter-chip__checkbox{align-items:center;border:1.5px solid var(--r-color-gray-300);border-radius:3px;display:flex;flex-shrink:0;height:16px;justify-content:center;transition:all var(--r-transition-fast);width:16px}.filter-chip__checkbox--checked{background-color:#4164ee;border-color:#4164ee;color:#fff}.filter-chip__radio{align-items:center;border:1.5px solid var(--r-color-gray-300);border-radius:100%;display:flex;flex-shrink:0;height:16px;justify-content:center;transition:all var(--r-transition-fast);width:16px}.filter-chip__radio--checked{border-color:#4164ee}.filter-chip__radio--checked:after{background-color:#4164ee;border-radius:100%;content:"";height:8px;width:8px}.dropdown-enter-active,.dropdown-leave-active{transition:opacity var(--r-transition-fast),transform var(--r-transition-fast)}.dropdown-enter-from,.dropdown-leave-to{opacity:0;transform:translateY(-4px)}
+.filter-chip-wrapper{position:relative}.filter-chip{align-items:center;background:var(--bg-surface);border:1px solid var(--border-default);border-radius:6px;box-sizing:border-box;color:var(--text-secondary);cursor:pointer;display:flex;font-family:var(--font-sans);font-size:var(--font-14);font-weight:var(--weight-medium);gap:8px;height:32px;padding:8px;transition:all var(--duration-fast) var(--ease-in-out);white-space:nowrap;width:193px}.filter-chip:hover{border-color:var(--border-default)}.filter-chip__icon{color:var(--color-healthcare);flex-shrink:0}.filter-chip--active{border-color:var(--color-healthcare);box-shadow:0 0 8px 0 rgba(var(--healthcare-rgb),.1)}.filter-chip__label{flex:1;min-width:0;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.filter-chip__badge{align-items:center;background-color:var(--color-healthcare);border-radius:100px;color:var(--color-text-inverse);display:inline-flex;flex-shrink:0;font-size:11px;font-weight:600;height:18px;justify-content:center;line-height:1;min-width:18px;padding:0 5px}.filter-chip__caret{color:var(--text-muted);flex-shrink:0;transition:transform var(--duration-fast) var(--ease-in-out)}.filter-chip__caret--open{transform:rotate(180deg)}.filter-chip__dropdown{background-color:var(--color-text-inverse);border:1px solid var(--border-default);border-radius:6px;box-shadow:0 4px 12px rgba(var(--shadow-rgb),.08),0 2px 4px rgba(var(--shadow-rgb),.04);left:0;max-height:300px;max-width:420px;min-width:380px;overflow-y:auto;padding:4px;position:absolute;top:calc(100% + 4px);width:-moz-max-content;width:max-content;z-index:50}.filter-chip__option{align-items:center;background:none;border:none;border-radius:4px;color:var(--text-secondary);cursor:pointer;display:flex;font-family:var(--font-sans);font-size:var(--font-14);gap:8px;padding:6px 8px;text-align:left;transition:background-color var(--duration-fast) var(--ease-in-out);width:100%}.filter-chip__option:hover{background-color:var(--bg-surface-2)}.filter-chip__option--selected{color:var(--text-primary);font-weight:var(--weight-medium)}.filter-chip__checkbox{align-items:center;border:1.5px solid var(--border-default);border-radius:3px;display:flex;flex-shrink:0;height:16px;justify-content:center;transition:all var(--duration-fast) var(--ease-in-out);width:16px}.filter-chip__checkbox--checked{background-color:var(--color-healthcare);border-color:var(--color-healthcare);color:var(--color-text-inverse)}.filter-chip__radio{align-items:center;border:1.5px solid var(--border-default);border-radius:100%;display:flex;flex-shrink:0;height:16px;justify-content:center;transition:all var(--duration-fast) var(--ease-in-out);width:16px}.filter-chip__radio--checked{border-color:var(--color-healthcare)}.filter-chip__radio--checked:after{background-color:var(--color-healthcare);border-radius:100%;content:"";height:8px;width:8px}.filter-chip__select-all{align-items:center;background:none;border:none;border-radius:4px;color:var(--color-healthcare);cursor:pointer;display:flex;font-family:var(--font-sans);font-size:var(--font-14);font-weight:500;gap:8px;padding:6px 8px;text-align:left;width:100%}.filter-chip__select-all:hover{background-color:rgba(var(--healthcare-rgb),.04)}.filter-chip__options-group{border-left:1px solid var(--border-default);margin-left:14px;padding-left:6px}.dropdown-enter-active,.dropdown-leave-active{transition:opacity var(--duration-fast) var(--ease-in-out),transform var(--duration-fast) var(--ease-in-out)}.dropdown-enter-from,.dropdown-leave-to{opacity:0;transform:translateY(-4px)}
 </style>

package/dist/runtime/components/Input.vue

@@ -48,5 +48,5 @@ defineEmits<{
 </template>
 
 <style scoped>
-.r-input-wrapper{display:flex;flex-direction:column;gap:var(--r-space-1)}.r-input-label{color:var(--r-color-gray-700);font-size:var(--r-text-sm);font-weight:var(--r-font-weight-medium)}.r-input-required{color:var(--r-color-danger-500);margin-left:2px}.r-input{background-color:var(--r-color-white);border:1px solid var(--r-color-gray-300);border-radius:var(--r-radius-lg);color:var(--r-color-gray-900);font-size:var(--r-text-sm);height:2.5rem;line-height:var(--r-leading-normal);padding:var(--r-space-2) var(--r-space-3);transition:all var(--r-transition-fast);width:100%}.r-input::-moz-placeholder{color:var(--r-color-gray-400)}.r-input::placeholder{color:var(--r-color-gray-400)}.r-input:hover:not(:disabled){border-color:var(--r-color-gray-400)}.r-input:focus{border-color:var(--r-color-primary-500);box-shadow:0 0 0 3px var(--r-color-primary-100);outline:none}.r-input:disabled{background-color:var(--r-color-gray-50);cursor:not-allowed;opacity:.5}.r-input--error,.r-input--error:focus{border-color:var(--r-color-danger-500)}.r-input--error:focus{box-shadow:0 0 0 3px rgba(239,68,68,.15)}.r-input-error{color:var(--r-color-danger-500);font-size:var(--r-text-xs);margin-top:var(--r-space-1)}
+.r-input-wrapper{display:flex;flex-direction:column;gap:var(--space-4)}.r-input-label{color:var(--text-secondary);font-size:var(--font-14);font-weight:var(--weight-medium)}.r-input-required{color:var(--color-danger);margin-left:2px}.r-input{background-color:var(--color-text-inverse);border:1px solid var(--border-default);border-radius:var(--radius-lg);color:var(--text-primary);font-size:var(--font-14);height:2.5rem;line-height:1.5;padding:var(--space-8) var(--space-12);transition:all var(--duration-fast) var(--ease-in-out);width:100%}.r-input::-moz-placeholder{color:var(--text-muted)}.r-input::placeholder{color:var(--text-muted)}.r-input:hover:not(:disabled){border-color:var(--text-muted)}.r-input:focus{border-color:var(--color-healthcare);box-shadow:0 0 0 3px var(--bg-hover);outline:none}.r-input:disabled{background-color:var(--bg-surface-2);cursor:not-allowed;opacity:.5}.r-input--error,.r-input--error:focus{border-color:var(--color-danger)}.r-input--error:focus{box-shadow:0 0 0 3px rgba(239,68,68,.15)}.r-input-error{color:var(--color-danger);font-size:var(--font-12);margin-top:var(--space-4)}
 </style>