*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;background:var(--surface-page, #f7f8fb)}:root{--q-orange: #f7941d;--q-blue: #2f78ff;--q-dark: #1e3a5f;--q-bg: #f7f8fb;--q-pink: #ff27be;--q-radius: 16px;--q-page-pad: clamp(1rem, 3.5vw, 2.5rem);--danger: #e53935;--danger-hover: #c62828;--warning: #ff6b35;--surface-inverse: #1a1a2e;--card-text-color: #ffffff;--card-outline: #fbbf24;--card-bg: #3b82f6;--card-bg-hover: #82a9ee;--card-bg-active: #050505;--card-depth-color: #f59e0b;--card-active-depth-color: #4a1d1d}:root,.brand-theme{--brand: var(--q-orange);--surface-page: #f7f8fb;--surface-elevated: #ffffff;--surface-field: #ffffff;--surface-variant: #f5f5f5;--surface-variant-hover: #e5e7eb;--text-primary: #333333;--text-muted: #666666;--border: #dddddd;--field-border: color-mix(in srgb, var(--brand) 20%, var(--border));--bg-color: var(--surface-elevated);--text-color: var(--text-primary);--primary-brand: var(--brand)}.dark-theme{--brand: var(--q-orange);--surface-page: #292929;--surface-elevated: #3d3d3d;--surface-field: #3d3d3d;--surface-variant: #4d4d4d;--surface-variant-hover: #5a5a5a;--text-primary: #f2f2f2;--text-muted: #a1a1aa;--border: #4d4d4d;--field-border: color-mix(in srgb, var(--brand) 40%, var(--border));--bg-color: var(--surface-elevated);--text-color: var(--text-primary);--primary-brand: var(--brand)}.pink-theme{--brand: var(--q-pink);--surface-page: #f7f8fb;--surface-elevated: #ffffff;--surface-field: #ffffff;--surface-variant: #f5f5f5;--surface-variant-hover: #e5e7eb;--text-primary: #333333;--text-muted: #666666;--border: #dddddd;--field-border: color-mix(in srgb, var(--brand) 20%, var(--border));--bg-color: var(--surface-elevated);--text-color: var(--text-primary);--primary-brand: var(--brand)}.pink-dark-theme{--brand: var(--q-pink);--surface-page: #292929;--surface-elevated: #3d3d3d;--surface-field: #3d3d3d;--surface-variant: #4d4d4d;--surface-variant-hover: #5a5a5a;--text-primary: #f2f2f2;--text-muted: #a1a1aa;--border: #4d4d4d;--field-border: color-mix(in srgb, var(--brand) 40%, var(--border));--bg-color: var(--surface-elevated);--text-color: var(--text-primary);--primary-brand: var(--brand)}
