:root{font-family:system-ui,-apple-system,"Microsoft JhengHei",sans-serif;color:#17324d;background:#eff7ff;line-height:1.65;font-size:17px}*{box-sizing:border-box}body{margin:0}main,header,footer{max-width:1120px;margin:auto;padding:22px}header{padding-bottom:8px}h1{font-size:clamp(1.65rem,4vw,2.5rem);line-height:1.25}h2{margin-top:0}a{color:#1253a0}button,select,input,textarea{font:inherit}button,select{min-height:44px;padding:8px 14px;border:1px solid #91b8d9;border-radius:10px;background:white;color:#17324d;cursor:pointer}button:hover,button[aria-current=true]{background:#185fa5;color:white}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #c75a00;outline-offset:3px}button:disabled{opacity:.5;cursor:default}.card{background:white;border:1px solid #bed6e9;border-radius:18px;padding:24px;margin:16px 0;box-shadow:0 5px 20px #17324d08}.note{background:#e1f0ff;border-left:4px solid #2673b7;padding:14px}.warn{background:#fff3de;border-left:4px solid #b56600;padding:14px}.flow,.toolbar,nav{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin:20px 0}label{display:block;font-weight:600}label small{display:block;font-weight:400}input[type=range]{display:block;width:100%;accent-color:#185fa5}output{font-family:ui-monospace,monospace;color:#1253a0}svg{display:block;width:100%;height:auto;background:#fafcff;border:1px solid #d3e3ee;border-radius:10px}svg text{font-family:system-ui,sans-serif;font-size:13px;fill:#17324d}.legend{display:flex;flex-wrap:wrap;gap:16px;font-size:.9rem}.legend span:before{content:'━ ';color:var(--color);font-weight:bold}.feedback{min-height:3rem;margin-top:12px;padding:10px;background:#edf5ff}.feedback.good{background:#e4f5eb}.feedback.bad{background:#fff0df}.choices{display:flex;gap:10px;flex-wrap:wrap}.tablewrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:.93rem}th,td{text-align:left;padding:9px;border-bottom:1px solid #d3e3ee;white-space:nowrap}textarea{width:100%;min-height:88px;padding:10px;border:1px solid #91b8d9;border-radius:10px}.muted{color:#4d657b}progress{width:100%;accent-color:#185fa5}#observation{font-family:ui-monospace,monospace;overflow-wrap:anywhere}section[hidden]{display:none}footer{font-size:.9rem}.skip{position:absolute;left:-9999px}.skip:focus{left:10px;top:10px;background:white;padding:10px;z-index:2}@media(max-width:600px){main,header,footer{padding:14px}.card{padding:16px}nav button{flex:1 0 28%;font-size:.85rem;padding:7px}h2{font-size:1.35rem}.controls{grid-template-columns:1fr}.toolbar button{flex:1}svg text{font-size:14px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
