:root{--color-primary-50: #f0f9ff;--color-primary-100: #e0f2fe;--color-primary-200: #bae6fd;--color-primary-300: #7dd3fc;--color-primary-400: #38bdf8;--color-primary-500: #0ea5e9;--color-primary-600: #0284c7;--color-primary-700: #0369a1;--color-primary-800: #075985;--color-primary-900: #0c4a6e;--color-primary-950: #082f49;--color-gray-25: #fcfcfd;--color-gray-50: #f9fafb;--color-gray-100: #f2f4f7;--color-gray-200: #eaecf0;--color-gray-300: #d0d5dd;--color-gray-400: #98a2b3;--color-gray-500: #667085;--color-gray-600: #475467;--color-gray-700: #344054;--color-gray-800: #1d2939;--color-gray-900: #101828;--color-gray-950: #0c111d;--color-success-50: #ecfdf5;--color-success-100: #d1fae5;--color-success-200: #a7f3d0;--color-success-300: #6ee7b7;--color-success-400: #34d399;--color-success-500: #10b981;--color-success-600: #059669;--color-success-700: #047857;--color-success-800: #065f46;--color-success-900: #064e3b;--color-success-950: #022c22;--color-warning-50: #fffbeb;--color-warning-100: #fef3c7;--color-warning-200: #fde68a;--color-warning-300: #fcd34d;--color-warning-400: #fbbf24;--color-warning-500: #f59e0b;--color-warning-600: #d97706;--color-warning-700: #b45309;--color-warning-800: #92400e;--color-warning-900: #78350f;--color-warning-950: #451a03;--color-error-50: #fef2f2;--color-error-100: #fee2e2;--color-error-200: #fecaca;--color-error-300: #fca5a5;--color-error-400: #f87171;--color-error-500: #ef4444;--color-error-600: #dc2626;--color-error-700: #b91c1c;--color-error-800: #991b1b;--color-error-900: #7f1d1d;--color-error-950: #450a0a;--color-brand-primary: var(--color-primary-600);--color-brand-primary-hover: var(--color-primary-700);--color-brand-primary-active: var(--color-primary-800);--color-brand-primary-light: var(--color-primary-50);--color-text-primary: var(--color-gray-900);--color-text-secondary: var(--color-gray-600);--color-text-tertiary: var(--color-gray-500);--color-text-placeholder: var(--color-gray-400);--color-text-disabled: var(--color-gray-300);--color-text-inverse: white;--color-bg-primary: white;--color-bg-secondary: var(--color-gray-25);--color-bg-tertiary: var(--color-gray-50);--color-bg-brand: var(--color-primary-600);--color-bg-overlay: rgba(16, 24, 40, .7);--color-border-primary: var(--color-gray-300);--color-border-secondary: var(--color-gray-200);--color-border-tertiary: var(--color-gray-100);--color-border-disabled: var(--color-gray-200);--color-border-focus: var(--color-primary-300);--color-border-error: var(--color-error-300);--color-interactive-primary: var(--color-primary-600);--color-interactive-primary-hover: var(--color-primary-700);--color-interactive-primary-active: var(--color-primary-800);--color-interactive-secondary: var(--color-gray-50);--color-interactive-secondary-hover: var(--color-gray-100);--color-interactive-secondary-active: var(--color-gray-200);--font-family-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-family-mono: "JetBrains Mono", "Fira Code", "SF Mono", Consolas, "Liberation Mono", Menlo, monospace;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-size-5xl: 3rem;--font-size-6xl: 3.75rem;--line-height-none: 1;--line-height-tight: 1.25;--line-height-snug: 1.375;--line-height-normal: 1.5;--line-height-relaxed: 1.625;--line-height-loose: 2;--spacing-px: 1px;--spacing-0: 0;--spacing-0-5: .125rem;--spacing-1: .25rem;--spacing-1-5: .375rem;--spacing-2: .5rem;--spacing-2-5: .625rem;--spacing-3: .75rem;--spacing-3-5: .875rem;--spacing-4: 1rem;--spacing-5: 1.25rem;--spacing-6: 1.5rem;--spacing-7: 1.75rem;--spacing-8: 2rem;--spacing-9: 2.25rem;--spacing-10: 2.5rem;--spacing-11: 2.75rem;--spacing-12: 3rem;--spacing-14: 3.5rem;--spacing-16: 4rem;--spacing-20: 5rem;--spacing-24: 6rem;--spacing-28: 7rem;--spacing-32: 8rem;--shadow-xs: 0 1px 2px 0 rgba(16, 24, 40, .05);--shadow-sm: 0 1px 3px 0 rgba(16, 24, 40, .1), 0 1px 2px -1px rgba(16, 24, 40, .1);--shadow-md: 0 4px 8px -2px rgba(16, 24, 40, .1), 0 2px 4px -2px rgba(16, 24, 40, .06);--shadow-lg: 0 12px 16px -4px rgba(16, 24, 40, .08), 0 4px 6px -2px rgba(16, 24, 40, .03);--shadow-xl: 0 20px 24px -4px rgba(16, 24, 40, .08), 0 8px 8px -4px rgba(16, 24, 40, .03);--shadow-2xl: 0 24px 48px -12px rgba(16, 24, 40, .18);--shadow-3xl: 0 32px 64px -12px rgba(16, 24, 40, .14);--shadow-focus: 0 0 0 4px var(--color-primary-100);--radius-none: 0;--radius-sm: .125rem;--radius-base: .25rem;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--radius-3xl: 1.5rem;--radius-full: 9999px;--container-xs: 20rem;--container-sm: 24rem;--container-md: 28rem;--container-lg: 32rem;--container-xl: 36rem;--container-2xl: 42rem;--container-3xl: 48rem;--container-4xl: 56rem;--container-5xl: 64rem;--container-6xl: 72rem;--container-7xl: 80rem;--header-height: 4rem;--sidebar-width: 16rem;--sidebar-collapsed-width: 4rem;--z-index-hide: -1;--z-index-auto: auto;--z-index-base: 0;--z-index-docked: 10;--z-index-dropdown: 1000;--z-index-sticky: 1020;--z-index-banner: 1030;--z-index-overlay: 1040;--z-index-modal: 1050;--z-index-popover: 1060;--z-index-tooltip: 1070;--z-index-toast: 1080;--ease-linear: linear;--ease-in: cubic-bezier(.4, 0, 1, 1);--ease-out: cubic-bezier(0, 0, .2, 1);--ease-in-out: cubic-bezier(.4, 0, .2, 1);--duration-75: 75ms;--duration-100: .1s;--duration-150: .15s;--duration-200: .2s;--duration-300: .3s;--duration-500: .5s;--duration-700: .7s;--duration-1000: 1s;--button-height-sm: 2rem;--button-height-md: 2.5rem;--button-height-lg: 3rem;--button-padding-x-sm: var(--spacing-3);--button-padding-x-md: var(--spacing-4);--button-padding-x-lg: var(--spacing-6);--input-height: 2.5rem;--input-padding-x: var(--spacing-3);--input-border-width: 1px;--card-padding: var(--spacing-6);--card-border-radius: var(--radius-lg);--card-border-width: 1px;--table-cell-padding-x: var(--spacing-3);--table-cell-padding-y: var(--spacing-3);--table-header-height: 3rem;--table-row-height: 3rem}@media (prefers-reduced-motion: reduce){:root{--duration-75: 0ms;--duration-100: 0ms;--duration-150: 0ms;--duration-200: 0ms;--duration-300: 0ms;--duration-500: 0ms;--duration-700: 0ms;--duration-1000: 0ms}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-family-sans);line-height:var(--line-height-normal);color:var(--color-text-primary);background-color:var(--color-bg-secondary);font-size:var(--font-size-base);font-weight:var(--font-weight-regular);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#app{min-height:100vh;display:grid;grid-template-areas:"sidebar header" "sidebar main";grid-template-columns:var(--sidebar-width) 1fr;grid-template-rows:var(--header-height) 1fr}.app-nav{grid-area:sidebar;background:linear-gradient(180deg,var(--color-brand-primary) 0%,var(--color-primary-700) 100%);padding:var(--spacing-6) 0;box-shadow:var(--shadow-lg);position:relative;overflow-y:auto}.sidebar-logo{padding:0 var(--spacing-4) var(--spacing-6);border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:var(--spacing-6);display:flex;align-items:center;justify-content:center}.logo-image{width:auto;height:48px;filter:drop-shadow(0 2px 8px rgba(0,0,0,.15));transition:all var(--duration-200) var(--ease-out)}.nav-list{display:flex;flex-direction:column;list-style:none;gap:var(--spacing-1);padding:0 var(--spacing-3)}.nav-link{display:flex;align-items:center;padding:var(--spacing-4);text-decoration:none;color:#fffc;font-weight:var(--font-weight-medium);font-size:var(--font-size-sm);border-radius:var(--radius-lg);transition:all var(--duration-200) var(--ease-out);position:relative;letter-spacing:-.01em;gap:var(--spacing-3)}.nav-link:hover{color:#fff;background-color:#ffffff1a;transform:translate(4px)}.nav-link:focus{outline:none;box-shadow:0 0 0 2px #ffffff4d;color:#fff}.nav-link.active{color:#fff;background-color:#fff3;box-shadow:var(--shadow-sm)}.nav-icon{width:20px;height:20px;flex-shrink:0;opacity:.8;transition:opacity var(--duration-200) var(--ease-out)}.nav-link:hover .nav-icon,.nav-link.active .nav-icon{opacity:1}.app-header{grid-area:header;background:var(--color-primary-50);border-bottom:1px solid var(--color-primary-100);border-left:1px solid var(--color-primary-100);padding:0 var(--spacing-6);box-shadow:var(--shadow-sm);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:var(--z-index-sticky);display:flex;align-items:center;justify-content:flex-end;transition:all var(--duration-200) var(--ease-out)}.header-controls{display:flex;align-items:center;gap:var(--spacing-3)}.app-main{grid-area:main;padding:var(--spacing-8);overflow-y:auto;background:var(--color-bg-secondary);position:relative}.btn{display:inline-flex;align-items:center;justify-content:center;padding:var(--button-padding-x-md);height:var(--button-height-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);border:1px solid transparent;border-radius:var(--radius-lg);text-decoration:none;cursor:pointer;transition:all var(--duration-200) var(--ease-out);gap:var(--spacing-2);letter-spacing:-.01em;position:relative;white-space:nowrap}.btn:focus{outline:none;box-shadow:var(--shadow-focus)}.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn-sm{padding:var(--button-padding-x-sm);height:var(--button-height-sm);font-size:var(--font-size-xs);gap:var(--spacing-1-5)}.btn-lg{padding:var(--button-padding-x-lg);height:var(--button-height-lg);font-size:var(--font-size-base);gap:var(--spacing-3)}.btn-primary{background-color:var(--color-interactive-primary);color:var(--color-text-inverse);box-shadow:var(--shadow-xs)}.btn-primary:hover:not(:disabled){background-color:var(--color-interactive-primary-hover);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.btn-primary:active:not(:disabled){background-color:var(--color-interactive-primary-active);box-shadow:var(--shadow-xs);transform:translateY(0)}.btn-secondary{background-color:var(--color-bg-primary);color:var(--color-text-secondary);border-color:var(--color-border-primary);box-shadow:var(--shadow-xs)}.btn-secondary:hover:not(:disabled){background-color:var(--color-interactive-secondary-hover);border-color:var(--color-border-secondary);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.btn-secondary:active:not(:disabled){background-color:var(--color-interactive-secondary-active);box-shadow:var(--shadow-xs);transform:translateY(0)}.btn-danger{background-color:var(--color-error-600);color:var(--color-text-inverse);box-shadow:var(--shadow-xs)}.btn-danger:hover:not(:disabled){background-color:var(--color-error-700);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.btn-danger:active:not(:disabled){background-color:var(--color-error-800);box-shadow:var(--shadow-xs);transform:translateY(0)}.form-group{margin-bottom:var(--spacing-5)}.form-label{display:block;margin-bottom:var(--spacing-2);font-weight:var(--font-weight-medium);font-size:var(--font-size-sm);color:var(--color-text-primary);letter-spacing:-.01em}.form-input{width:100%;height:var(--input-height);padding:0 var(--input-padding-x);border:var(--input-border-width) solid var(--color-border-primary);border-radius:var(--radius-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-regular);background-color:var(--color-bg-primary);color:var(--color-text-primary);transition:all var(--duration-200) var(--ease-out);box-shadow:var(--shadow-xs)}.form-input::placeholder{color:var(--color-text-placeholder)}.form-input:hover:not(:disabled){border-color:var(--color-border-secondary);box-shadow:var(--shadow-sm)}.form-input:focus{outline:none;border-color:var(--color-border-focus);box-shadow:var(--shadow-focus);background-color:var(--color-bg-primary)}.form-input:disabled{background-color:var(--color-bg-tertiary);border-color:var(--color-border-disabled);color:var(--color-text-disabled);cursor:not-allowed}.form-input:invalid:not(:placeholder-shown){border-color:var(--color-border-error);box-shadow:0 0 0 3px #ef44441a}.form-input-sm{height:calc(var(--input-height) - var(--spacing-2));padding:0 var(--spacing-2-5);font-size:var(--font-size-xs)}.form-input-lg{height:calc(var(--input-height) + var(--spacing-2));padding:0 var(--spacing-4);font-size:var(--font-size-base)}.card{background:var(--color-bg-primary);border-radius:var(--card-border-radius);padding:var(--card-padding);box-shadow:var(--shadow-md);border:var(--card-border-width) solid var(--color-border-tertiary);transition:all var(--duration-200) var(--ease-out)}.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.card-header{margin-bottom:var(--spacing-5);padding-bottom:var(--spacing-4);border-bottom:1px solid var(--color-border-tertiary)}.card-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);letter-spacing:-.025em;line-height:var(--line-height-tight)}.card-elevated{box-shadow:var(--shadow-lg)}.card-elevated:hover{box-shadow:var(--shadow-xl);transform:translateY(-4px)}.card-flat{box-shadow:none;border:1px solid var(--color-border-secondary)}.card-interactive{cursor:pointer;transition:all var(--duration-200) var(--ease-out)}.card-interactive:hover{border-color:var(--color-border-primary);box-shadow:var(--shadow-lg);transform:translateY(-1px)}.table{width:100%;border-collapse:collapse;background:var(--color-bg-primary);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid var(--color-border-tertiary)}.table th,.table td{padding:var(--table-cell-padding-y) var(--table-cell-padding-x);text-align:left;border-bottom:1px solid var(--color-border-tertiary);font-size:var(--font-size-sm);line-height:var(--line-height-snug)}.table th{background-color:var(--color-bg-tertiary);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);height:var(--table-header-height);font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.05em;position:sticky;top:0;z-index:var(--z-index-docked)}.table tbody tr{transition:background-color var(--duration-150) var(--ease-out);height:var(--table-row-height)}.table tbody tr:hover{background-color:var(--color-bg-tertiary)}.table tbody tr:active{background-color:var(--color-primary-50)}.table-borderless .table th,.table-borderless .table td{border-bottom:none}.table-compact .table th,.table-compact .table td{padding:var(--spacing-2) var(--spacing-3)}.table-striped tbody tr:nth-child(2n){background-color:var(--color-bg-secondary)}.loading-skeleton{display:none;position:fixed;inset:0;background:var(--color-bg-overlay);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:var(--z-index-overlay);animation:fadeIn var(--duration-200) var(--ease-out)}.loading-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;background:var(--color-bg-primary);padding:var(--spacing-8);border-radius:var(--radius-2xl);box-shadow:var(--shadow-2xl);border:1px solid var(--color-border-tertiary)}.spinner{display:inline-block;width:var(--spacing-8);height:var(--spacing-8);border:3px solid var(--color-border-tertiary);border-top:3px solid var(--color-brand-primary);border-radius:var(--radius-full);animation:spin var(--duration-1000) linear infinite;margin-bottom:var(--spacing-4)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.skeleton{background:linear-gradient(90deg,var(--color-gray-200) 25%,var(--color-gray-100) 50%,var(--color-gray-200) 75%);background-size:200% 100%;animation:shimmer var(--duration-1000) ease-in-out infinite;border-radius:var(--radius-md)}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton-text{height:var(--spacing-4);margin-bottom:var(--spacing-2)}.skeleton-text-lg{height:var(--spacing-6)}.skeleton-text-sm{height:var(--spacing-3)}.skeleton-circle{border-radius:var(--radius-full);aspect-ratio:1}.error-page{text-align:center;padding:var(--spacing-20) var(--spacing-4);max-width:var(--container-md);margin:0 auto}.error-page h1{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-error-600);margin-bottom:var(--spacing-4);letter-spacing:-.025em;line-height:var(--line-height-tight)}.error-page p{font-size:var(--font-size-lg);color:var(--color-text-secondary);margin-bottom:var(--spacing-8);line-height:var(--line-height-relaxed)}.empty-state{text-align:center;padding:var(--spacing-16) var(--spacing-4);color:var(--color-text-secondary)}.empty-state h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-2);color:var(--color-text-primary);letter-spacing:-.025em)}.empty-state p{font-size:var(--font-size-sm);color:var(--color-text-tertiary);margin-bottom:var(--spacing-6);line-height:var(--line-height-relaxed)}.status-dot{display:inline-block;width:var(--spacing-2);height:var(--spacing-2);border-radius:var(--radius-full);margin-right:var(--spacing-2)}.status-dot-success{background-color:var(--color-success-500)}.status-dot-warning{background-color:var(--color-warning-500)}.status-dot-error{background-color:var(--color-error-500)}.status-dot-info{background-color:var(--color-primary-500)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.text-justify{text-align:justify}.text-xs{font-size:var(--font-size-xs)}.text-sm{font-size:var(--font-size-sm)}.text-base{font-size:var(--font-size-base)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.text-2xl{font-size:var(--font-size-2xl)}.font-light{font-weight:var(--font-weight-light)}.font-normal{font-weight:var(--font-weight-regular)}.font-medium{font-weight:var(--font-weight-medium)}.font-semibold{font-weight:var(--font-weight-semibold)}.font-bold{font-weight:var(--font-weight-bold)}.text-primary{color:var(--color-text-primary)}.text-secondary{color:var(--color-text-secondary)}.text-tertiary{color:var(--color-text-tertiary)}.text-success{color:var(--color-success-600)}.text-warning{color:var(--color-warning-600)}.text-error{color:var(--color-error-600)}.m-0{margin:var(--spacing-0)}.m-1{margin:var(--spacing-1)}.m-2{margin:var(--spacing-2)}.m-3{margin:var(--spacing-3)}.m-4{margin:var(--spacing-4)}.m-5{margin:var(--spacing-5)}.m-6{margin:var(--spacing-6)}.m-8{margin:var(--spacing-8)}.mb-0{margin-bottom:var(--spacing-0)}.mb-1{margin-bottom:var(--spacing-1)}.mb-2{margin-bottom:var(--spacing-2)}.mb-3{margin-bottom:var(--spacing-3)}.mb-4{margin-bottom:var(--spacing-4)}.mb-5{margin-bottom:var(--spacing-5)}.mb-6{margin-bottom:var(--spacing-6)}.mb-8{margin-bottom:var(--spacing-8)}.mt-0{margin-top:var(--spacing-0)}.mt-1{margin-top:var(--spacing-1)}.mt-2{margin-top:var(--spacing-2)}.mt-3{margin-top:var(--spacing-3)}.mt-4{margin-top:var(--spacing-4)}.mt-5{margin-top:var(--spacing-5)}.mt-6{margin-top:var(--spacing-6)}.mt-8{margin-top:var(--spacing-8)}.p-0{padding:var(--spacing-0)}.p-1{padding:var(--spacing-1)}.p-2{padding:var(--spacing-2)}.p-3{padding:var(--spacing-3)}.p-4{padding:var(--spacing-4)}.p-5{padding:var(--spacing-5)}.p-6{padding:var(--spacing-6)}.p-8{padding:var(--spacing-8)}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.hidden{display:none}.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-end{justify-content:flex-end}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.flex-1{flex:1}.rounded-none{border-radius:var(--radius-none)}.rounded-sm{border-radius:var(--radius-sm)}.rounded{border-radius:var(--radius-base)}.rounded-md{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:var(--radius-full)}@media (max-width: 768px){.header-content{padding:0 var(--spacing-2)}.app-main{padding:var(--spacing-4) var(--spacing-2)}.nav-list{overflow-x:auto;white-space:nowrap;scrollbar-width:none;-ms-overflow-style:none}.nav-list::-webkit-scrollbar{display:none}.nav-link{padding:var(--spacing-3) var(--spacing-4);white-space:nowrap;font-size:var(--font-size-xs)}.card{padding:var(--spacing-4);border-radius:var(--radius-lg)}.table{font-size:var(--font-size-xs)}.table th,.table td{padding:var(--spacing-2) var(--spacing-2-5)}.btn{height:var(--button-height-sm);padding:0 var(--spacing-3);font-size:var(--font-size-xs)}.form-input{height:calc(var(--input-height) - var(--spacing-1));font-size:var(--font-size-sm)}.mobile-hidden{display:none}.mobile-stack{flex-direction:column}.mobile-stack>*{width:100%;margin-bottom:var(--spacing-2)}}@media (max-width: 480px){.app-title{font-size:var(--font-size-lg)}.card{padding:var(--spacing-3);margin-bottom:var(--spacing-3)}.btn{width:100%}.table-container{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.spinner{border-width:2px}}@media (max-width: 768px){#app{grid-template-areas:"header" "main";grid-template-columns:1fr;grid-template-rows:var(--header-height) 1fr}.app-nav{position:fixed;top:var(--header-height);left:-100%;width:280px;height:calc(100vh - var(--header-height));z-index:var(--z-index-overlay);transition:left var(--duration-300) var(--ease-out);box-shadow:var(--shadow-xl)}.app-nav.sidebar-open{left:0}.app-main{padding:var(--spacing-4)}.sidebar-toggle{display:block;background:none;border:none;padding:var(--spacing-2);color:var(--color-text-secondary);cursor:pointer}}@media (min-width: 769px){.sidebar-toggle{display:none}}@media print{*{background:#fff!important;color:#000!important;box-shadow:none!important}.app-header,.app-nav{display:none}.card{border:1px solid #ccc;box-shadow:none;page-break-inside:avoid}}