:root{--accent: #ec4899;--accent-light: #fce7f3;--accent-dark: #be185d;--base-bg: #fafafa;--base-surface: #ffffff;--base-border: #e5e5e5;--base-muted: #737373;--base-text: #171717;--radius: 8px;--font: system-ui, sans-serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font);background-color:var(--base-bg);color:var(--base-text);min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px}.demo-link{position:absolute;top:24px;right:24px;font-size:14px;color:var(--base-muted);text-decoration:none;z-index:100}.demo-link:hover{color:var(--accent)}.page-wrapper{width:100%;max-width:560px;display:flex;flex-direction:column;gap:20px;position:relative}.survey-header{display:flex;flex-direction:column;gap:8px}.survey-header__label{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}.survey-header__title{font-size:24px;font-weight:700;line-height:1.25;color:var(--base-text)}.survey-header__description{font-size:15px;line-height:1.6;color:var(--base-muted)}.card{background:var(--base-surface);border:1px solid var(--base-border);border-radius:12px;padding:32px;width:100%;max-width:560px;display:flex;flex-direction:column;gap:24px;position:relative}.card__title{font-size:18px;font-weight:600;line-height:1.4;color:var(--base-text)}.card__body{font-size:15px;line-height:1.6;color:var(--base-muted)}.card__notice{font-size:14px;color:var(--accent-dark);background:var(--accent-light);border-radius:8px;padding:10px 14px}.answer-list{list-style:none;display:flex;flex-direction:column;gap:8px}.btn{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:8px;padding:10px 20px;font-size:15px;font-family:var(--font);font-weight:500;cursor:pointer;transition:background-color .15s,color .15s;width:100%;text-align:left}.btn-primary{background-color:var(--accent);color:#fff}.btn-primary:hover{background-color:var(--accent-dark)}.btn-secondary{background-color:transparent;color:var(--base-muted);border:1px solid var(--base-border)}.btn-secondary:hover{background-color:var(--base-bg);color:var(--base-text)}.btn-answer{background-color:var(--base-bg);color:var(--base-text);border:1px solid var(--base-border);text-align:left;justify-content:flex-start}.btn-answer:hover{border-color:var(--accent);color:var(--accent-dark);background-color:var(--accent-light)}.btn-answer.selected{border-color:var(--accent);color:#fff;background-color:var(--accent)}.action-row{display:flex;gap:12px}.action-row .btn{flex:1}