:root{--ink:#172033;--muted:#667085;--paper:#fffdf9;--line:#e8e5df;--accent:#22685f;--accent-light:#e4f1ee;--bad:#b54747}*{box-sizing:border-box}body{margin:0;background:#f5f5f1;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP",sans-serif}header{height:66px;background:var(--paper);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(20px,calc((100% - 1060px)/2))}.brand{font-size:20px;font-weight:800;letter-spacing:.04em}.brand span{font-size:13px;font-weight:600;margin-left:8px;color:var(--muted);letter-spacing:0}nav{display:flex;gap:4px}button{font:inherit;cursor:pointer;border:0}nav button,.text-button{background:transparent;color:var(--muted);padding:10px 12px;border-radius:8px}nav button:hover{background:#f1f3f2;color:var(--ink)}main{max-width:900px;margin:auto;padding:48px 20px 70px}.page{display:none}.page.active{display:block}.hero{max-width:680px;margin:10px auto 30px}.hero h1{font-size:clamp(28px,5vw,44px);letter-spacing:-.04em;margin:5px 0 12px;line-height:1.25}.hero.compact{margin-left:0}.eyebrow{color:var(--accent);font-size:12px;font-weight:800;letter-spacing:.13em;margin:0 0 8px}.muted,.hint{color:var(--muted);line-height:1.6}.card{background:var(--paper);border:1px solid var(--line);box-shadow:0 4px 12px #17203308;border-radius:16px;padding:26px;margin:18px 0}.setup{max-width:700px;margin:auto}.field-row{display:flex;gap:18px;align-items:end;margin:16px 0}.field-row>label{flex:1}label{font-size:14px;font-weight:650;display:block}input,select{width:100%;display:block;margin-top:7px;border:1px solid #d6d9d4;background:#fff;border-radius:8px;padding:11px 12px;font:inherit;color:var(--ink)}fieldset{border:0;padding:0;margin:24px 0}legend{font-weight:700;margin-bottom:10px}fieldset label{padding:7px 0;font-weight:500}fieldset input,.check input{display:inline;width:auto;margin:0 6px 0 0}.check{padding:11px 0}.primary,.secondary{border-radius:9px;padding:12px 20px;font-weight:750}.primary{background:var(--accent);color:white}.primary:hover{background:#18524b}.secondary{background:#edf0ed;color:var(--ink)}.hint{font-size:13px}.quiz-top{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:700}.progressbar{height:5px;background:#dce7e4;border-radius:99px;margin:12px 0 22px}.progressbar i{display:block;height:100%;background:var(--accent);width:0;border-radius:99px;transition:.3s}.question-card{text-align:center;max-width:700px;margin:auto;padding:40px}.question-card h2{font-size:clamp(30px,6vw,48px);margin:10px 0}.pos{color:var(--muted);min-height:22px}.answers{display:grid;gap:10px;margin:28px 0}.answer{padding:15px 18px;border:1px solid #d8ddd7;background:#fff;border-radius:10px;text-align:left;font-size:16px}.answer:hover:not(:disabled){border-color:var(--accent);background:var(--accent-light)}.answer.correct{background:#ddf0e8;border-color:#51a879}.answer.wrong{background:#f9e2e2;border-color:#d47575}.answer:disabled{cursor:default}.feedback{min-height:34px;font-weight:700;line-height:1.6;margin:8px 0 18px}.feedback.good{color:var(--accent)}.feedback.bad{color:var(--bad)}.hidden{display:none}.spell{display:flex;gap:8px;max-width:480px;margin:28px auto}.spell input{margin:0}.result-actions{display:flex;gap:10px;margin:20px 0}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;text-align:left;font-size:14px}th,td{padding:12px;border-bottom:1px solid var(--line)}th{font-size:12px;color:var(--muted)}.ok{color:var(--accent);font-weight:800}.ng{color:var(--bad);font-weight:800}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:20px 0}.stat{padding:18px;background:var(--paper);border:1px solid var(--line);border-radius:12px}.stat strong{font-size:27px;display:block}.stat span{font-size:13px;color:var(--muted)}canvas{width:100%;height:auto}.search{max-width:430px}@media(max-width:600px){header{padding:0 14px}.brand span{display:none}nav button{padding:8px 6px;font-size:13px}main{padding:28px 14px 48px}.field-row{display:block;margin:0}.field-row>label{margin:14px 0}.card{padding:19px}.question-card{padding:28px 17px}.spell{display:block}.spell button{width:100%;margin-top:10px}.result-actions{display:grid}.stats{grid-template-columns:1fr}.answers .answer{padding:16px}.quiz-top{font-size:12px}}
