:root{--primary-color:#2563eb;--primary-hover:#1d4ed8;--bg-color:#f8fafc;--card-bg:#fff;--text-main:#1e293b;--text-muted:#64748b;--border-color:#e2e8f0;--error-color:#ef4444;--success-color:#22c55e}body{background-color:var(--bg-color);color:var(--text-main);margin:0;font-family:Inter,-apple-system,sans-serif;line-height:1.5}.survey-container{max-width:800px;margin:40px auto;padding:0 20px}.survey-card{background:var(--card-bg);border-radius:12px;padding:32px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.progress-container{margin-bottom:32px}.survey-note{color:var(--text-muted);text-align:center;margin:0 0 24px;font-size:14px;line-height:1.5}.btn-stats{color:var(--primary-color);border:1px solid var(--primary-color);cursor:pointer;background:#eff6ff;border-radius:8px;margin:0 auto 24px;padding:10px 20px;font-size:14px;font-weight:600;transition:all .2s;display:block}.btn-stats:hover{background:var(--primary-color);color:#fff}.progress-bar{background:var(--border-color);border-radius:4px;height:8px;overflow:hidden}.progress-fill{background:var(--primary-color);height:100%;transition:width .3s}.progress-text{color:var(--text-muted);margin-top:8px;font-size:14px;display:block}h1{margin-bottom:8px;font-size:24px}h2{margin-top:0;margin-bottom:24px;font-size:20px}.question-block{margin-bottom:32px}.question-label{margin-bottom:12px;font-weight:600;display:block}.options-grid{gap:12px;display:grid}.option-item{border:1px solid var(--border-color);cursor:pointer;border-radius:8px;align-items:center;padding:12px 16px;transition:all .2s;display:flex}.option-item:hover{background-color:#f1f5f9}.option-item.selected{border-color:var(--primary-color);background-color:#eff6ff}.option-item input{margin-right:12px}.matrix-table{border-collapse:collapse;width:100%;margin-top:16px}.matrix-table th{text-align:center;color:var(--text-muted);padding:12px;font-weight:500}.matrix-table td{border-top:1px solid var(--border-color);padding:8px}.matrix-row-label{font-weight:500}.matrix-cell{text-align:center}.other-input{border:1px solid var(--border-color);box-sizing:border-box;border-radius:6px;width:100%;margin-top:8px;padding:8px 12px}.button-group{justify-content:space-between;margin-top:32px;display:flex}button{cursor:pointer;border-radius:8px;padding:12px 24px;font-weight:600;transition:all .2s}.btn-primary{background:var(--primary-color);color:#fff;border:none}.btn-primary:hover{background:var(--primary-hover)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{color:var(--text-main);border:1px solid var(--border-color);background:#fff}.btn-secondary:hover{background:#f8fafc}@media (width<=640px){.matrix-table,.matrix-table thead,.matrix-table tbody,.matrix-table th,.matrix-table td,.matrix-table tr{display:block}.matrix-table thead{display:none}.matrix-table tr{border:1px solid var(--border-color);border-radius:8px;margin-bottom:24px;padding:12px}.matrix-table td{border:none;justify-content:space-between;align-items:center;padding:4px 0;display:flex}.matrix-table td:before{content:attr(data-label);font-size:14px;font-weight:600}}.stats-container{gap:24px;display:grid}.stat-item{border:1px solid var(--border-color);background:#fff;border-radius:12px;padding:20px}.bar-container{background:#f1f5f9;border-radius:4px;height:24px;margin:8px 0;position:relative;overflow:hidden}.bar-fill{background:var(--primary-color);opacity:.8;height:100%}.bar-label{justify-content:space-between;font-size:14px;display:flex}.matrix-chart{gap:16px;display:flex}.year-column{flex:1}.year-title{text-align:center;margin-bottom:12px;font-weight:600}
