:root{--color-primary: #005bbf;--color-primary-action: #1a73e8;--color-primary-hover: #0050a8;--color-surface: #f9f9ff;--color-surface-low: #f2f3fd;--color-surface-container: #ecedf7;--color-surface-high: #e6e8f2;--color-surface-white: #ffffff;--color-on-surface: #191c23;--color-on-surface-variant: #414754;--color-outline: #727785;--color-outline-variant: #c1c6d6;--color-error: #ba1a1a;--color-error-container: #ffdad6;--color-approved: #1e7e34;--color-approved-bg: #d4edda;--color-rejected: #ba1a1a;--color-rejected-bg: #ffdad6;--color-pending: #727785;--color-pending-bg: #e0e2ec;--color-deprecated: #9e9ea8;--color-deprecated-bg: #ececec;--color-progress-high: #1e7e34;--color-progress-mid: #856404;--color-progress-low: #ba1a1a;--font-sans: "Inter", system-ui, sans-serif;--font-mono: "Space Grotesk", monospace;--text-h1: 600 24px/32px var(--font-sans);--text-h2: 600 18px/24px var(--font-sans);--text-body-md: 400 14px/20px var(--font-sans);--text-body-sm: 400 13px/18px var(--font-sans);--text-label: 600 11px/16px var(--font-sans);--text-code: 500 13px/18px var(--font-mono);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--radius-sm: 2px;--radius: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--radius-full: 9999px;--sidebar-width: 240px;--header-height: 56px;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .06), 0 1px 2px rgba(0, 0, 0, .04);--shadow-md: 0 4px 12px rgba(0, 0, 0, .08)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;font:var(--text-body-md);color:var(--color-on-surface);background:var(--color-surface);-webkit-font-smoothing:antialiased}#root{height:100%;display:flex;flex-direction:column}.app-layout{display:flex;height:100%}.sidebar{width:var(--sidebar-width);flex-shrink:0;background:var(--color-surface-low);border-right:1px solid var(--color-outline-variant);display:flex;flex-direction:column;overflow-y:auto}.main-content{flex:1;overflow-y:auto;display:flex;flex-direction:column}h1{font:var(--text-h1);letter-spacing:-.02em}h2{font:var(--text-h2);letter-spacing:-.01em}.text-label{font:var(--text-label);letter-spacing:.05em;text-transform:uppercase;color:var(--color-on-surface-variant)}.text-code{font:var(--text-code)}.btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:0 var(--space-3);height:36px;border-radius:var(--radius);font:var(--text-body-sm);font-weight:500;cursor:pointer;border:1px solid transparent;transition:background .12s,border-color .12s;text-decoration:none;white-space:nowrap}.btn-primary{background:var(--color-primary-action);color:#fff}.btn-primary:hover{background:var(--color-primary-hover)}.btn-primary:disabled{opacity:.45;cursor:not-allowed}.btn-secondary{background:var(--color-surface-white);color:var(--color-on-surface);border-color:var(--color-outline-variant)}.btn-secondary:hover{background:var(--color-surface-high)}.btn-ghost{background:transparent;color:var(--color-on-surface-variant)}.btn-ghost:hover{background:var(--color-surface-container)}.btn-sm{height:28px;padding:0 var(--space-2);font-size:12px}.card{background:var(--color-surface-white);border:1px solid var(--color-outline-variant);border-radius:var(--radius-lg);padding:var(--space-4)}.badge{display:inline-flex;align-items:center;padding:2px var(--space-2);border-radius:var(--radius);font:var(--text-label)}.badge-approved{background:var(--color-approved-bg);color:var(--color-approved)}.badge-rejected{background:var(--color-rejected-bg);color:var(--color-rejected)}.badge-pending{background:var(--color-pending-bg);color:var(--color-pending)}.badge-type{background:#e8eef8;color:var(--color-primary)}.form-field{display:flex;flex-direction:column;gap:var(--space-1)}.form-label{font:var(--text-label);letter-spacing:.04em;text-transform:uppercase;color:var(--color-on-surface-variant)}.input,.select,.textarea{width:100%;height:36px;padding:0 var(--space-3);border:1px solid var(--color-outline-variant);border-radius:var(--radius);font:var(--text-body-sm);color:var(--color-on-surface);background:var(--color-surface-white);outline:none;transition:border-color .12s,box-shadow .12s}.textarea{height:auto;min-height:96px;padding:var(--space-2) var(--space-3);resize:vertical}.input:focus,.select:focus,.textarea:focus{border-color:var(--color-primary-action);box-shadow:0 0 0 2px #1a73e826}.input.error,.select.error{border-color:var(--color-error)}.form-error{font:var(--text-body-sm);color:var(--color-error)}.chip{display:inline-flex;align-items:center;padding:3px var(--space-2);border-radius:var(--radius-full);font:var(--text-body-sm);font-weight:500;cursor:pointer;border:1px solid var(--color-outline-variant);background:var(--color-surface-low);color:var(--color-on-surface-variant);transition:all .1s;-webkit-user-select:none;user-select:none}.chip.active{background:#e8eef8;border-color:var(--color-primary-action);color:var(--color-primary-action)}.progress-ring{transform:rotate(-90deg)}.progress-ring-indeterminate{animation:progress-ring-spin 1.2s linear infinite;transform-origin:center}@keyframes progress-ring-spin{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}.progress-ring-track{fill:none;stroke:var(--color-surface-high)}.progress-ring-fill{fill:none;stroke:var(--color-primary-action);stroke-linecap:round;transition:stroke-dashoffset .3s ease}.accordion-item{border-bottom:1px solid var(--color-outline-variant)}.accordion-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4);background:none;border:none;cursor:pointer;font:var(--text-body-sm);font-weight:500;color:var(--color-on-surface);text-align:left}.accordion-trigger:hover{background:var(--color-surface-container)}.tabs{display:flex;border-bottom:1px solid var(--color-outline-variant);gap:0}.tab{padding:var(--space-2) var(--space-4);font:var(--text-body-sm);font-weight:500;cursor:pointer;border:none;background:none;color:var(--color-on-surface-variant);border-bottom:2px solid transparent;transition:all .1s;margin-bottom:-1px}.tab.active{color:var(--color-primary-action);border-bottom-color:var(--color-primary-action)}.stepper{display:flex;align-items:center;gap:0;padding:var(--space-4) var(--space-6);border-bottom:1px solid var(--color-outline-variant);background:var(--color-surface-white)}.stepper-step{display:flex;align-items:center;gap:var(--space-2);font:var(--text-body-sm);color:var(--color-on-surface-variant)}.stepper-step.active{color:var(--color-primary-action);font-weight:600}.stepper-step.done{color:var(--color-approved)}.stepper-number{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;background:var(--color-surface-high);color:var(--color-on-surface-variant);flex-shrink:0}.stepper-step.active .stepper-number{background:var(--color-primary-action);color:#fff}.stepper-step.done .stepper-number{background:var(--color-approved);color:#fff}.stepper-divider{flex:1;height:1px;background:var(--color-outline-variant);margin:0 var(--space-2)}.status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.status-dot.approved{background:var(--color-approved)}.status-dot.rejected{background:var(--color-rejected)}.status-dot.pending{background:var(--color-pending)}.status-dot.deprecated{background:var(--color-deprecated)}.toast-container{position:fixed;bottom:var(--space-6);right:var(--space-6);display:flex;flex-direction:column;gap:var(--space-2);z-index:9999}.toast{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font:var(--text-body-sm);font-weight:500;box-shadow:var(--shadow-md);animation:slideIn .2s ease}.toast-success{background:var(--color-approved);color:#fff}.toast-error{background:var(--color-error);color:#fff}.toast-info{background:var(--color-primary-action);color:#fff}@keyframes slideIn{0%{transform:translate(20px);opacity:0}to{transform:translate(0);opacity:1}}.sideover-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100}.sideover{position:fixed;top:0;right:0;bottom:0;width:480px;max-width:100vw;background:var(--color-surface-white);border-left:1px solid var(--color-outline-variant);box-shadow:var(--shadow-md);display:flex;flex-direction:column;z-index:101;animation:slideInRight .2s ease}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}
