.demographic-questions{max-width:600px;margin:0 auto;padding:20px 24px;color:#333;animation:demographic-fade-in .5s ease-out forwards}@keyframes demographic-fade-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}[data-theme=dark] .demographic-questions{color:#fff}.demographic-questions h1{font-size:28px;margin-bottom:16px}[data-theme=dark] .demographic-questions h1{color:#fff}.demographic-intro{font-size:18px;line-height:1.5;margin-bottom:24px;color:#555}[data-theme=dark] .demographic-intro{color:#ffffffd9}.demographic-disclaimer{font-size:14px;color:#666;background-color:#f5f5f5;padding:12px 16px;border-radius:8px;margin-bottom:32px}[data-theme=dark] .demographic-disclaimer{background-color:#ffffff14;color:#aaa}.demographic-form{display:flex;flex-direction:column;gap:28px}.demographic-field{display:flex;flex-direction:column;gap:10px}.demographic-field>label{font-weight:600;font-size:16px}[data-theme=dark] .demographic-field>label{color:#fff}.demographic-options{display:flex;flex-wrap:wrap;gap:12px}.demographic-option{display:flex;align-items:center;gap:8px;cursor:pointer;padding:10px 16px;background-color:#eee;border-radius:8px;transition:background-color .2s}.demographic-option:hover{background-color:#e0e0e0}.demographic-option input{width:18px;height:18px;cursor:pointer}[data-theme=dark] .demographic-option{background-color:#ffffff1a}[data-theme=dark] .demographic-option:hover{background-color:#ffffff26}[data-theme=dark] .demographic-option span{color:#fff}.demographic-input,.demographic-select{padding:12px 16px;font-size:16px;border:1px solid #ccc;border-radius:8px;background-color:#fff;color:#333}.demographic-input:focus,.demographic-select:focus{outline:none;border-color:#62e662;box-shadow:0 0 0 2px #62e66233}.demographic-input-other{margin-top:8px}.demographic-field-subtext{font-size:12px;color:#888;line-height:1.4;margin:8px 0 0}[data-theme=dark] .demographic-field-subtext{color:#999}[data-theme=dark] .demographic-input,[data-theme=dark] .demographic-select{background-color:#ffffff14;border-color:#fff3;color:#fff}[data-theme=dark] .demographic-input::placeholder{color:#ffffff80}[data-theme=dark] .demographic-select option{background-color:#1a1a2e;color:#fff}.demographic-checkbox-wrap{margin-top:8px}.demographic-checkbox{display:flex;align-items:flex-start;gap:12px;cursor:pointer;font-weight:400;font-size:15px}.demographic-checkbox input{width:22px;height:22px;margin-top:2px;cursor:pointer;flex-shrink:0}[data-theme=dark] .demographic-checkbox span{color:#ffffffe6}.demographic-actions{display:flex;flex-direction:column;gap:12px;margin-top:16px}.demographic-btn{padding:14px 24px;font-size:18px;font-weight:600;border:none;border-radius:12px;cursor:pointer;transition:transform .2s,box-shadow .2s}.demographic-btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;background-color:#62e662;color:#fff}.demographic-btn-primary:disabled{background-color:#ccc;color:#888;cursor:not-allowed;transform:none}.demographic-btn-primary.demographic-btn-loading:disabled{background-color:#62e662;color:#fff;cursor:wait}.demographic-btn-primary:disabled:hover{transform:none;box-shadow:none}.demographic-btn-primary:disabled.demographic-btn-loading{background-color:#62e662;color:#fff;cursor:wait}[data-theme=dark] .demographic-btn-primary:disabled{background-color:#ffffff26;color:#666}[data-theme=dark] .demographic-btn-primary:disabled.demographic-btn-loading{background-color:#62e662;color:#fff}.demographic-btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #62e66266}[data-theme=dark] .demographic-btn-primary:hover:not(:disabled){box-shadow:0 4px 12px #62e66280}.demographic-btn-skip{display:inline-flex;align-items:center;justify-content:center;gap:8px;background-color:transparent;color:#666;background-color:#eee}.demographic-btn-skip:hover{background-color:#e0e0e0}[data-theme=dark] .demographic-btn-skip{background-color:#ffffff1a;color:#aaa}[data-theme=dark] .demographic-btn-skip:hover{background-color:#ffffff26;color:#fff}[data-theme=dark] .demographic-input:focus,[data-theme=dark] .demographic-select:focus{border-color:#62e662;box-shadow:0 0 0 2px #62e6624d}@media only screen and (max-width:600px){.demographic-questions{padding:24px 16px}.demographic-questions h1{font-size:24px}.demographic-intro{font-size:16px}}
