:root{color:#21343a;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f1f7f7;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}body{min-width:320px;min-height:100svh;margin:0}button,input,textarea,select{font:inherit}h1,h2,p{margin:0}h1{color:#20343a;max-width:760px;font-size:2.35rem;line-height:1.2}h2{color:#20343a;font-size:1.15rem}#root{min-height:100svh}@media (width<=720px){h1{font-size:1.8rem}}.screen{box-sizing:border-box;width:min(100%,1040px);min-height:100svh;margin:0 auto;padding:32px 24px}.home-screen,.intro-screen,.result-screen{flex-direction:column;justify-content:center;gap:28px;display:flex}.hero-band,.task-message{justify-items:center;gap:18px;display:grid}.eyebrow{color:#356272;margin:0;font-weight:700}.lead{color:#4d5d63;font-size:1.05rem}.quiet-panel,.debug-panel,.task-list-panel{color:#40545a;background:#f7fbfb;border:1px solid #dce7e9;border-radius:8px;max-width:720px;margin:0 auto;padding:18px 22px}.task-list-panel{text-align:left;gap:20px;width:min(100%,840px);display:grid}.task-group{gap:12px;display:grid}.task-card-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;display:grid}.task-card-button{color:#21343a;text-align:left;cursor:pointer;background:#fff;border:2px solid #cfe0e3;border-radius:8px;align-content:center;gap:8px;min-height:112px;padding:16px;display:grid}.task-card-button:hover{border-color:#7aa9b3}.task-card-button strong{font-size:1.1rem}.task-card-button span{color:#51676d;font-size:.95rem}.button-row{flex-wrap:wrap;justify-content:center;gap:14px;display:flex}.primary-button,.secondary-button{min-width:168px;min-height:54px;font:inherit;cursor:pointer;border:2px solid #0000;border-radius:8px;padding:12px 22px;font-weight:700}.primary-button{color:#fff;background:#236b7a}.secondary-button{color:#236b7a;background:#fff;border-color:#8fb9c1}.primary-button:focus-visible,.secondary-button:focus-visible,.choice-button:focus-visible{outline-offset:3px;outline:3px solid #f1c453}.task-screen{grid-template-rows:auto auto auto;align-content:start;gap:24px;display:grid}.task-top{gap:18px;display:grid}.task-heading{justify-content:space-between;align-items:center;gap:16px;min-height:34px;display:flex}.timer{color:#7a4d23;margin:0;font-weight:700}.sample-area{background:#fff;border:2px solid #d6e4e7;border-radius:8px;place-items:center;min-height:178px;display:grid}.choices-grid{grid-template-columns:repeat(auto-fit,minmax(132px,1fr));align-content:center;gap:18px;display:grid}.choice-button{cursor:pointer;background:#fff;border:3px solid #d3e2e5;border-radius:8px;min-height:132px;padding:0;transition:border-color .14s,transform .14s,background .14s}.choice-button:hover:not(:disabled){border-color:#7aa9b3;transform:translateY(-2px)}.choice-button:disabled{cursor:default}.choice-button.is-correct,.choice-button.is-target{background:#edf8f0;border-color:#48a26a}.choice-button.is-wrong{background:#fff3ef;border-color:#d68b7b}.shape-view{max-width:100%;height:auto;margin:0 auto;display:block}.feedback-area{place-items:center;gap:14px;min-height:102px;display:grid}.feedback-area p{color:#236b7a;font-size:1.4rem;font-weight:700}.count-grid{gap:10px;width:min(100%,560px);margin:0 auto;display:grid}.count-cell{background:#fff;border:2px solid #d3e2e5;border-radius:8px;place-items:center;min-height:70px;display:grid}.number-row{flex-wrap:wrap;justify-content:center;gap:14px;display:flex}.number-choice{color:#21343a;cursor:pointer;background:#fff;border:3px solid #d3e2e5;border-radius:8px;min-width:74px;min-height:64px;font-size:1.45rem;font-weight:800}.number-choice:disabled{cursor:default}.number-choice.is-correct,.number-choice.is-target{background:#edf8f0;border-color:#48a26a}.number-choice.is-wrong{background:#fff3ef;border-color:#d68b7b}.progress-wrap{gap:8px;display:grid}.progress-label{color:#40545a;justify-content:space-between;font-weight:700;display:flex}.progress-track{background:#dce7e9;border-radius:999px;height:14px;overflow:hidden}.progress-fill{border-radius:inherit;background:#56a178;height:100%;transition:width .18s}.result-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.result-item{background:#fff;border:1px solid #dce7e9;border-radius:8px;align-content:center;gap:10px;min-height:122px;display:grid}.result-item span{color:#51676d;font-weight:700}.result-item strong{color:#21343a;font-size:1.8rem}.setting-panel,.support-panel{color:#33474d;text-align:left;background:#f7fbfb;border:1px solid #dce7e9;border-radius:8px;gap:12px;width:min(100%,720px);margin:0 auto;padding:20px 22px;display:grid}.setting-panel h2,.support-panel h2{margin:0;font-size:1.05rem}.support-panel p{margin:0}.level-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;display:grid}.level-button{color:#21343a;cursor:pointer;background:#fff;border:2px solid #cfe0e3;border-radius:8px;min-height:52px;font-size:1.15rem;font-weight:800}.level-button.is-selected{color:#fff;background:#236b7a;border-color:#236b7a}.count-row{flex-wrap:wrap;gap:10px;display:flex}.count-option{color:#21343a;min-width:96px;min-height:52px;font:inherit;cursor:pointer;background:#fff;border:2px solid #cfe0e3;border-radius:8px;font-weight:700}.count-option.is-selected{color:#fff;background:#236b7a;border-color:#236b7a}.setting-note{color:#51676d;margin:0;font-size:.95rem}.feedback-area .feedback-hint{color:#7a4d23;margin:0;font-size:1.05rem;font-weight:700}@media (width<=720px){.screen{padding:24px 16px}.task-heading{flex-direction:column;align-items:flex-start}.choices-grid{grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:12px}.level-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.result-grid{grid-template-columns:1fr}}