:root{font:16px/1.8 "Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,system-ui,sans-serif;color:#f2eadb;background:#1d1d1b;--surface:#292927;--muted:#c6bcaa;--line:#4b4842;--accent:#b6472e}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.52}h1,h2,h3{line-height:1.4;margin:0}h1{font-size:clamp(24px,5vw,34px)}h2{font-size:22px}p{margin:0;line-height:1.8;overflow-wrap:anywhere}.demo-banner{background:#462d27;text-align:center;padding:10px 16px;color:#f0d8d0;font-size:12px}.demo-page{background:linear-gradient(145deg,#171716,#1d1d1b);min-height:100vh;padding:32px 16px 72px}.demo-shell{margin:auto;width:min(760px,100%)}.demo-header{margin-bottom:18px}.demo-kicker{font-size:13px;font-weight:700;letter-spacing:.08em;margin-bottom:12px}.demo-badge{font-size:11px;background:#3a3936;border:1px solid var(--line);border-radius:20px;padding:3px 9px;display:inline-block;margin-left:6px}progress{appearance:none;display:block;background:#3a3834;border:0;border-radius:999px;height:4px;width:100%;overflow:hidden}progress::-webkit-progress-bar{background:#3a3834}progress::-webkit-progress-value{background:var(--accent)}progress::-moz-progress-bar{background:var(--accent)}.demo-step-label{color:var(--muted);font-size:12px;margin-top:8px}.demo-card{background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 18px 48px #0004;padding:28px}.demo-stack{display:grid;gap:20px}.demo-notice{background:#34322e;border-left:3px solid var(--accent);color:var(--muted);padding:14px 16px}.demo-fieldset{border:0;margin:0;padding:0;min-width:0}.demo-fieldset legend,.demo-question{font-size:22px;font-weight:700;line-height:1.5}.demo-hint,.demo-footnote{color:var(--muted);font-size:13px;margin-top:8px}.demo-options{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:20px}.demo-option{align-items:center;background:#333330;border:1px solid var(--line);border-radius:7px;display:flex;gap:10px;line-height:1.5;min-height:54px;padding:12px 14px}.demo-option:has(input:checked){background:#46332d;border-color:#a95641}.demo-option input{accent-color:var(--accent);height:18px;width:18px;flex-shrink:0}.demo-stars{font-size:18px;letter-spacing:1px;color:#ffca28}.demo-card textarea{background:#f7f0e3;border:1px solid #8b8376;border-radius:7px;color:#242321;margin-top:16px;padding:14px;resize:vertical;width:100%;line-height:1.8}.demo-input-label{display:block;font-size:14px;margin:18px 0 6px}select{display:block;width:100%;min-height:48px;padding:10px 12px;border:1px solid #8b8376;border-radius:7px;color:#242321;background:#f7f0e3}textarea:focus,button:focus-visible,select:focus-visible,.demo-option:focus-within{outline:3px solid #d36b4e;outline-offset:3px}.demo-warning{background:#3e2c28;border:1px solid #70453b;border-radius:7px;color:#f0d8d0;font-size:13px;margin-top:16px;padding:12px 14px}.demo-primary,.demo-secondary,.demo-text-button{border-radius:7px;font-weight:700;min-height:48px;padding:12px 18px;text-align:center}.demo-primary{background:var(--accent);border:1px solid #c45a40;color:white}.demo-secondary{background:#3a3936;border:1px solid #625e57;color:#f2eadb}.demo-text-button{background:transparent;border:1px solid transparent;color:var(--muted)}.demo-nav{display:flex;gap:12px;margin-top:26px}.demo-nav>*{flex:1}.demo-final-actions{display:grid;gap:10px;grid-template-columns:1fr 1fr}#copy{margin-top:16px;width:100%}#copy-status{min-height:24px}blockquote{margin:0;white-space:pre-line;padding:18px;background:#34322e;border-left:3px solid var(--accent)}footer{font-size:12px;color:var(--muted);margin-top:24px}footer button{font-size:12px;padding-left:0}dialog{background:var(--surface);color:#f2eadb;border:1px solid var(--line);border-radius:10px;padding:24px;max-width:min(480px,calc(100vw - 32px))}dialog::backdrop{background:#0008}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}[hidden]{display:none!important}
@media(max-width:640px){.demo-page{padding:20px 12px 56px}.demo-card{padding:20px 16px}.demo-options{grid-template-columns:1fr}.demo-nav{flex-direction:column-reverse}.demo-final-actions{grid-template-columns:1fr}.demo-stars{font-size:18px}.demo-notice{font-size:14px}}