@charset "UTF-8";*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100%;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Helvetica Neue,Arial,sans-serif;background-color:var(--color-bg);color:var(--color-text)}.app-root{min-height:100vh;display:flex;flex-direction:column}.main-content{flex:1}:root{--color-bg: #fefefe;--color-surface: #ffffff;--color-card: #ffffff;--color-primary: #4e6ccd;--color-secondary: #4ECDC4;--color-primary-hover: #1c9f96;--color-secondary-hover: #3f5dbe;--color-danger: #ff4757;--color-success: #26de81;--color-warning: #fed330;--color-text: #2d3436;--color-text-muted: #444a4d;--color-border: #e8edf2;--color-border-bright: #d1dbe3;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--shadow-sm: 0 2px 4px rgba(0,0,0,.08);--shadow-md: 0 4px 12px rgba(0,0,0,.12);--shadow-glow: 0 4px 20px rgba(255, 107, 107, .2);--shadow-glow-teal: 0 4px 20px rgba(78, 205, 196, .2);--font-sm: .875rem;--font-md: 1rem;--font-lg: 1.25rem;--font-xl: 1.75rem}.container{width:100%;max-width:1200px;padding:var(--space-5);margin:0 auto}.container-sm{max-width:800px}.container-lg{max-width:1400px}.flex{display:flex}.flex-col{display:flex;flex-direction:column;text-align:center}.flex-between{display:flex;justify-content:space-between;align-items:center}.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-around{justify-content:space-around}.flex-wrap{flex-wrap:wrap}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-5{gap:var(--space-5)}.title{color:#4e6ccd;font-size:3rem;text-align:center}h1{font-size:var(--font-xl)}h3{font-size:var(--font-md)}.text-sm{font-size:var(--font-sm)}.text-md{font-size:var(--font-md)}.text-lg{font-size:var(--font-lg)}.text-xl{font-size:var(--font-xl)}.text-accent{background:linear-gradient(135deg,#4e6ccd,#4ecdc4);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}h2{font-size:var(--font-lg)}h3{font-size:1.1rem}p{margin:0 0 var(--space-2) 0;color:var(--color-text-muted);line-height:1.5;color:#6b7280;font-size:18px}.card-section{max-width:1200px;margin:0 auto}.card{background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-5);box-shadow:var(--shadow-sm);transition:border-color .3s ease,box-shadow .3s ease;text-align:center;width:100%}.card:hover{border-color:#4ecdc44d;box-shadow:var(--shadow-md)}.form{width:100%;max-width:500px}label{font-size:var(--font-sm);color:var(--color-text-muted);margin-bottom:var(--space-1);font-weight:500}input,textarea,select{width:100%;padding:var(--space-3);border-radius:var(--radius-sm);border:1px solid var(--color-border);background-color:#fafbfc;color:var(--color-text);outline:none;font-size:var(--font-md);transition:border-color .2s ease,box-shadow .2s ease}input:focus,textarea:focus,select:focus{border-color:var(--color-secondary);background-color:#fff;box-shadow:0 0 0 3px #4ecdc426}textarea{resize:vertical;min-height:120px}.btn{display:inline-block;cursor:pointer;border:none;border-radius:var(--radius-lg);padding:var(--space-3) var(--space-5);font-size:var(--font-md);font-weight:500;text-decoration:none;transition:all .2s ease}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,#4e6ccd,#4ecdc4);color:#fff;box-shadow:0 4px 12px #ff6b6b4d}.btn-primary:hover:not(:disabled){box-shadow:0 6px 20px #ff6b6b66;transform:translateY(-2px)}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-secondary{background-color:transparent;color:var(--color-primary);border:2px solid var(--color-primary)}.btn-secondary:hover:not(:disabled){background-color:#4ecdc41a;border-color:var(--color-secondary-hover);color:var(--color-secondary-hover)}.btn-danger{background:linear-gradient(135deg,#ff4757,#ff6348);color:#fff;box-shadow:0 4px 12px #ff47574d}.btn-danger:hover:not(:disabled){box-shadow:0 6px 20px #ff475766;transform:translateY(-2px)}.alert{padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);margin-bottom:var(--space-4)}.alert-error{background-color:#fff5f5;border:1px solid #ff4757;color:#c53030}.alert-success{background-color:#f0fff4;border:1px solid var(--color-success);color:#22863a}.alert-warning{background-color:#fffbeb;border:1px solid var(--color-warning);color:#b7791f}.loader{width:32px;height:32px;border:3px solid var(--color-border);border-top-color:var(--color-primary);border-right-color:var(--color-secondary);border-radius:50%;animation:spin 1s linear infinite;margin:var(--space-4) auto}@keyframes spin{to{transform:rotate(360deg)}}.gradient-text{background:linear-gradient(135deg,#4e6ccd,#4ecdc4);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.accent-border{border:2px solid transparent;background-image:linear-gradient(var(--color-card),var(--color-card)),linear-gradient(135deg,#4e6ccd,#4ecdc4);background-origin:border-box;background-clip:padding-box,border-box}.grid{display:grid}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}@media (min-width: 768px){.grid-2{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1024px){.grid-3{grid-template-columns:repeat(3,1fr)}}