:root{--gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--gradient-accent: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);--gradient-secondary: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);--gradient-success: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);--gradient-warning: linear-gradient(135deg, #f6d365 0%, #fda085 100%);--color-primary: #667eea;--color-accent: #f5576c;--color-success: #43e97b;--color-warning: #fda085;--color-danger: #f5576c;--bg-page: #f5f7fa;--bg-card: #ffffff;--bg-input: #f8f9fc;--text-dark: #333333;--text-medium: #666666;--text-light: #999999;--text-white: #ffffff;--border-color: #e8eaf0;--border-radius: 16px;--border-radius-lg: 24px;--border-radius-xl: 40px;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .06);--shadow-md: 0 4px 20px rgba(0, 0, 0, .1);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .12);--shadow-primary: 0 8px 24px rgba(102, 126, 234, .35);--shadow-accent: 0 8px 24px rgba(245, 87, 108, .35);--spacing-xs: 8px;--spacing-sm: 12px;--spacing-md: 20px;--spacing-lg: 30px;--spacing-xl: 40px;--transition: .3s ease;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-size-sm: 13px;--font-size-md: 15px;--font-size-lg: 18px;--font-size-xl: 24px;--font-size-xxl: 32px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%}body{font-family:var(--font-family);background:var(--bg-page);color:var(--text-dark);line-height:1.5;min-height:100dvh;-webkit-font-smoothing:antialiased}.card{background:var(--bg-card);border-radius:var(--border-radius);padding:var(--spacing-md);box-shadow:var(--shadow-sm);border:1px solid var(--border-color)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 24px;border:none;border-radius:var(--border-radius);font-size:var(--font-size-md);font-family:var(--font-family);font-weight:600;cursor:pointer;transition:transform var(--transition),box-shadow var(--transition),opacity var(--transition);min-height:52px;text-decoration:none;white-space:nowrap}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--gradient-primary);color:var(--text-white);box-shadow:var(--shadow-primary)}.btn-primary:active:not(:disabled){box-shadow:0 2px 8px #667eea4d}.btn-accent{background:var(--gradient-accent);color:var(--text-white);box-shadow:var(--shadow-accent)}.btn-outline{background:transparent;color:var(--color-primary);border:2px solid var(--color-primary);box-shadow:none}.btn-ghost{background:var(--bg-input);color:var(--text-medium);box-shadow:none}.btn-full{width:100%}.input-group{display:flex;flex-direction:column;gap:8px}.input-label{font-size:var(--font-size-sm);font-weight:600;color:var(--text-medium);text-transform:uppercase;letter-spacing:.5px}.input-field{width:100%;padding:14px 16px;border:2px solid var(--border-color);border-radius:var(--border-radius);font-size:var(--font-size-md);font-family:var(--font-family);background:var(--bg-input);color:var(--text-dark);transition:border-color var(--transition),box-shadow var(--transition);outline:none;-webkit-appearance:none}.input-field:focus{border-color:var(--color-primary);box-shadow:0 0 0 4px #667eea1f;background:var(--bg-card)}textarea.input-field{resize:vertical;min-height:100px}.alert{padding:14px 16px;border-radius:var(--border-radius);font-size:var(--font-size-md);margin-bottom:var(--spacing-md);font-weight:500}.alert-error{background:#fff0f0;color:var(--color-danger);border:1px solid #ffcdd2}.alert-success{background:#f0fff8;color:#2d9e6b;border:1px solid #a3e4c5}.page-container{min-height:100dvh;display:flex;flex-direction:column}.page-header{background:var(--gradient-primary);color:var(--text-white);padding:var(--spacing-md) var(--spacing-md);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100}.page-header h1{font-size:var(--font-size-lg);font-weight:700}.page-content{flex:1;padding:var(--spacing-md);max-width:600px;margin:0 auto;width:100%}.page-content--wide{max-width:1100px}.spinner{width:24px;height:24px;border:3px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;display:inline-block}.spinner--dark{border-color:#667eea33;border-top-color:var(--color-primary)}@keyframes spin{to{transform:rotate(360deg)}}.badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:20px;font-size:12px;font-weight:600}.badge-problem{background:#fff0f0;color:var(--color-danger)}.badge-ok{background:#f0fff8;color:#2d9e6b}@media (min-width: 600px){.page-header{padding:var(--spacing-md) var(--spacing-lg)}.page-content{padding:var(--spacing-lg)}}@media (max-width: 599px){.input-field{font-size:16px;padding:13px 14px}.btn{min-height:48px;padding:12px 18px}.card{padding:16px}.page-header h1{font-size:16px}.alert{font-size:14px}}@media (max-width: 360px){.page-header{padding:12px;gap:8px}.btn{padding:10px 12px;font-size:13px}}