:root{--ref-white: #ffffff;--ref-black: #000000;--ref-slate-50: #f8fafc;--ref-slate-100: #f1f5f9;--ref-slate-200: #e2e8f0;--ref-slate-300: #cbd5e1;--ref-slate-400: #94a3b8;--ref-slate-500: #64748b;--ref-slate-600: #475569;--ref-slate-700: #334155;--ref-slate-800: #1e293b;--ref-slate-900: #0f172a;--ref-teal-500: #14b8a6;--ref-teal-600: #0d9488;--ref-teal-700: #0f766e;--ref-teal-800: #115e59;--ref-red-500: #ef4444;--ref-red-600: #dc2626;--ref-amber-500: #f59e0b;--ref-orange-500: #f97316;--ref-orange-600: #ea580c;--ref-sky-500: #0ea5e9;--ref-green-600: #16a34a;--ref-teal-600-rgb: 13, 148, 136;--ref-teal-500-rgb: 20, 184, 166;--ref-red-600-rgb: 220, 38, 38;--ref-amber-500-rgb: 245, 158, 11;--ref-orange-500-rgb: 249, 115, 22;--ref-sky-500-rgb: 14, 165, 233;--ref-green-600-rgb: 22, 163, 74;--sys-color-bg-page: var(--ref-slate-50);--sys-color-bg-surface: var(--ref-white);--sys-color-border-default: var(--ref-slate-200);--sys-color-text-primary: var(--ref-slate-900);--sys-color-text-secondary: var(--ref-slate-600);--sys-color-primary: var(--ref-teal-600);--sys-color-primary-hover: var(--ref-teal-700);--sys-color-primary-rgb: var(--ref-teal-600-rgb);--sys-color-accent: var(--ref-orange-500);--sys-color-accent-hover: var(--ref-orange-600);--sys-color-accent-rgb: var(--ref-orange-500-rgb);--sys-color-success-text: var(--ref-green-600);--sys-color-success-bg: rgba(var(--ref-green-600-rgb), .12);--sys-color-success-border: rgba(var(--ref-green-600-rgb), .35);--sys-color-warning-text: var(--ref-amber-500);--sys-color-warning-bg: rgba(var(--ref-amber-500-rgb), .14);--sys-color-warning-border: rgba(var(--ref-amber-500-rgb), .35);--sys-color-error-text: var(--ref-red-600);--sys-color-error-bg: rgba(var(--ref-red-600-rgb), .12);--sys-color-error-border: rgba(var(--ref-red-600-rgb), .35);--sys-color-info-text: var(--ref-teal-700);--sys-color-info-bg: rgba(var(--ref-teal-500-rgb), .14);--sys-color-info-border: rgba(var(--ref-teal-500-rgb), .35);--sys-color-neutral-text: var(--ref-slate-700);--sys-color-neutral-bg: var(--ref-slate-100);--sys-color-neutral-border: var(--ref-slate-300);--sys-space-1: 4px;--sys-space-2: 8px;--sys-space-3: 12px;--sys-space-4: 16px;--sys-space-6: 24px;--sys-space-8: 32px;--sys-space-10: 40px;--sys-space-12: 48px;--sys-radius-sm: 8px;--sys-radius-md: 10px;--sys-radius-lg: 12px;--sys-radius-xl: 16px;--sys-shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);--sys-shadow-md: 0 6px 20px rgba(15, 23, 42, .1);--sys-shadow-lg: 0 12px 32px rgba(15, 23, 42, .14);--sys-font-size-h1: 32px;--sys-font-size-h2: 24px;--sys-font-size-h3: 20px;--sys-font-size-body: 16px;--sys-font-size-caption: 14px;--sys-line-height-heading: 1.3;--sys-line-height-body: 1.6;--sys-breakpoint-sm: 640px;--sys-breakpoint-md: 768px;--sys-breakpoint-lg: 1024px;--sys-breakpoint-xl: 1280px;--z-index-deep: -1;--z-index-default: 1;--z-index-sticky: 100;--z-index-dropdown: 200;--z-index-modal: 1000;--z-index-toast: 2000;--safe-top: env(safe-area-inset-top, 0px);--safe-right: env(safe-area-inset-right, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--comp-page-bg: var(--sys-color-bg-page);--comp-page-padding-x: var(--sys-space-6);--comp-card-bg: var(--sys-color-bg-surface);--comp-card-border-color: var(--sys-color-border-default);--comp-card-radius: var(--sys-radius-lg);--comp-card-shadow: var(--sys-shadow-sm);--comp-card-shadow-hover: var(--sys-shadow-md);--comp-card-padding: var(--sys-space-4);--comp-button-height: 40px;--comp-button-height-mobile: 44px;--comp-button-radius: var(--sys-radius-md);--comp-button-bg-primary: var(--sys-color-primary);--comp-button-bg-primary-hover: var(--sys-color-primary-hover);--comp-button-text-primary: var(--ref-white);--comp-button-bg-secondary: var(--sys-color-bg-surface);--comp-button-bg-secondary-hover: var(--sys-color-neutral-bg);--comp-button-border-secondary: var(--sys-color-border-default);--comp-button-text-secondary: var(--sys-color-text-primary);--comp-button-bg-danger: var(--sys-color-error-text);--comp-button-bg-danger-hover: var(--ref-red-500);--comp-button-text-danger: var(--ref-white);--comp-button-bg-text: transparent;--comp-button-text-text: var(--sys-color-primary);--comp-button-padding-x: var(--sys-space-4);--comp-button-font-size: var(--sys-font-size-body);--comp-button-font-weight: 600;--comp-input-height: 40px;--comp-input-height-mobile: 44px;--comp-input-radius: var(--sys-radius-md);--comp-input-padding-x: var(--sys-space-3);--comp-input-border: var(--sys-color-border-default);--comp-input-bg: var(--sys-color-bg-surface);--comp-input-text: var(--sys-color-text-primary);--comp-input-placeholder: var(--sys-color-text-secondary);--comp-input-font-size: var(--sys-font-size-body);--comp-input-focus-ring: rgba(var(--sys-color-primary-rgb), .2);--comp-input-focus-shadow: 0 0 0 3px var(--comp-input-focus-ring);--comp-input-focus-border: var(--sys-color-primary)}.ui-page-shell{min-height:100vh;--ui-page-padding: clamp(1.5rem, 4vw, 3rem);--page-padding: var(--ui-page-padding);background:var(--comp-page-bg, var(--sys-color-bg-page));padding:var(--ui-page-padding);color:var(--sys-color-text-primary)}.ui-page-content{max-width:1080px;margin:0 auto}@media (max-width: 640px){.ui-page-shell{--ui-page-padding: 1rem}}.ui-card{background:var(--comp-card-bg, var(--sys-color-bg-surface));border:1px solid var(--comp-card-border-color, var(--sys-color-border-default));border-radius:var(--comp-card-radius, var(--sys-radius-lg));box-shadow:var(--comp-card-shadow, var(--sys-shadow-sm));padding:var(--comp-card-padding, var(--sys-space-4))}.ui-card--interactive{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;cursor:pointer}.ui-card--interactive:hover{transform:translateY(-1px);box-shadow:var(--comp-card-shadow-hover, var(--sys-shadow-md))}.ui-btn{display:inline-flex;align-items:center;justify-content:center;height:var(--comp-button-height, 40px);min-height:var(--comp-button-height, 40px);padding:0 var(--comp-button-padding-x, var(--sys-space-4));border-radius:var(--comp-button-radius, var(--sys-radius-md));border:1px solid transparent;font-size:var(--comp-button-font-size, var(--sys-font-size-body));font-weight:var(--comp-button-font-weight, 600);line-height:1;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease}.ui-btn:disabled,.ui-btn[aria-disabled=true]{opacity:.55;cursor:not-allowed;pointer-events:none}.ui-btn:focus-visible{outline:none;box-shadow:var(--comp-input-focus-shadow)}.ui-btn--primary{background:var(--comp-button-bg-primary, var(--sys-color-primary));border-color:var(--comp-button-bg-primary, var(--sys-color-primary));color:var(--comp-button-text-primary, var(--ref-white))}.ui-btn--primary:hover{background:var(--comp-button-bg-primary-hover, var(--sys-color-primary-hover));border-color:var(--comp-button-bg-primary-hover, var(--sys-color-primary-hover))}.ui-btn--secondary{background:var(--comp-button-bg-secondary, var(--sys-color-bg-surface));border-color:var(--comp-button-border-secondary, var(--sys-color-border-default));color:var(--comp-button-text-secondary, var(--sys-color-text-primary))}.ui-btn--secondary:hover{background:var(--comp-button-bg-secondary-hover, var(--sys-color-neutral-bg))}.ui-btn--danger{background:var(--comp-button-bg-danger, var(--sys-color-error-text));border-color:var(--comp-button-bg-danger, var(--sys-color-error-text));color:var(--comp-button-text-danger, var(--ref-white))}.ui-btn--danger:hover{background:var(--comp-button-bg-danger-hover, var(--ref-red-500));border-color:var(--comp-button-bg-danger-hover, var(--ref-red-500))}.ui-btn--text{background:var(--comp-button-bg-text, transparent);border-color:transparent;color:var(--comp-button-text-text, var(--sys-color-primary))}.ui-btn--text:hover{background:rgba(var(--sys-color-primary-rgb),.08)}.ui-input{width:100%;height:var(--comp-input-height, 40px);min-height:var(--comp-input-height, 40px);padding:0 var(--comp-input-padding-x, var(--sys-space-3));border:1px solid var(--comp-input-border, var(--sys-color-border-default));border-radius:var(--comp-input-radius, var(--sys-radius-md));background:var(--comp-input-bg, var(--sys-color-bg-surface));color:var(--comp-input-text, var(--sys-color-text-primary));font-size:var(--comp-input-font-size, var(--sys-font-size-body));line-height:var(--sys-line-height-body);transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease}.ui-input::placeholder{color:var(--comp-input-placeholder, var(--sys-color-text-secondary))}.ui-input:focus{outline:none;border-color:var(--comp-input-focus-border, var(--sys-color-primary));box-shadow:var(--comp-input-focus-shadow)}@media (max-width: 640px){.ui-btn{height:var(--comp-button-height-mobile, 44px);min-height:var(--comp-button-height-mobile, 44px)}.ui-input{height:var(--comp-input-height-mobile, 44px);min-height:var(--comp-input-height-mobile, 44px)}}html,body,#app{height:100%}*,*:before,*:after{box-sizing:border-box}body{margin:0;background:var(--comp-page-bg, var(--sys-color-bg-page));color:var(--sys-color-text-primary);font-size:var(--sys-font-size-body);line-height:var(--sys-line-height-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}a{color:var(--sys-color-primary)}a:visited{color:var(--sys-color-primary-hover)}::selection{background:rgba(var(--sys-color-accent-rgb),.22);color:var(--sys-color-text-primary)}:focus-visible{outline:2px solid rgba(var(--sys-color-primary-rgb),.55);outline-offset:2px}@media (hover: hover) and (pointer: fine){*,*:before,*:after{transition:none!important;animation:none!important}*:hover{transform:none!important}}