:root{--ink:#173f37;--muted:#718079;--paper:#f7f7f0;--line:#dfe5da;--mint:#e7eee3;--orange:#dd8a57}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;line-height:1.6}button,select{font:inherit}button{cursor:pointer;border:0}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--orange);outline-offset:4px}header{max-width:1100px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:28px 34px;border-bottom:1px solid var(--line)}header a{display:flex;gap:12px;align-items:center;text-decoration:none;color:inherit;font-size:20px;font-weight:700}.logo{background:var(--ink);color:white;border-radius:12px;padding:5px 12px;font-size:22px}small{display:block;font-size:9px;letter-spacing:2px;font-weight:500}header>span{font-size:12px;color:var(--muted)}main{max-width:1000px;margin:auto;padding:46px 30px 10px}.eyebrow{font-size:11px;letter-spacing:3px;color:#8b6951;text-transform:uppercase}h1{font-size:44px;line-height:1.25;margin:16px 0;font-weight:650;letter-spacing:-1px}h2{font-size:26px;line-height:1.3;margin:10px 0}p{color:var(--muted);margin:12px 0}.hero{display:grid;grid-template-columns:1.4fr 1fr;align-items:center;gap:48px;padding:10px 0 40px}.art{height:230px;display:grid;place-items:center;background:radial-gradient(ellipse,#e5eddf,transparent 70%)}.book{width:155px;height:185px;background:#fffdf6;border:1px solid #d3ddce;transform:rotate(-10deg);border-radius:8px 14px 14px 8px;box-shadow:12px 14px 0 #dee7d8;padding:20px;font:60px Georgia;color:var(--ink)}.book:after{content:'';display:block;height:45px;margin-top:10px;background:repeating-linear-gradient(transparent 0 13px,#d5ddce 14px 15px)}.section-head{display:flex;justify-content:space-between;align-items:center;margin:22px 0 15px}.section-head h2{font-size:17px}.tag{background:var(--mint);padding:5px 10px;border-radius:99px;font-size:11px}.unit-card{width:100%;background:white;border:1px solid var(--line);border-radius:20px;padding:27px;display:flex;align-items:center;gap:22px;text-align:left;color:var(--ink);transition:transform .2s}.unit-card:hover{transform:translateY(-3px)}.number{background:var(--mint);border-radius:14px;min-width:75px;height:82px;display:grid;align-content:center;text-align:center;font:34px Georgia}.number span{font:10px sans-serif;letter-spacing:2px}.unit-card h2{font-size:25px;margin:4px 0}.unit-card p{font-size:13px;margin:4px 0}.arrow{margin-left:auto;background:var(--ink);border-radius:50%;width:40px;height:40px;display:grid;place-items:center;color:white;font-size:24px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:30px 0}.steps article{padding:13px 0;border-top:1px solid var(--line);font-size:13px}.steps b{font-size:11px;color:var(--orange);margin-right:8px}.steps p{font-size:12px}.sources{font-size:11px;color:var(--muted);margin-top:25px}.sources a{color:inherit}.text{background:none;color:var(--ink);min-height:44px;padding:6px 10px;font-size:13px}.back{padding-left:0;color:var(--muted)}.settings{display:flex;gap:15px;align-items:center;flex-wrap:wrap;background:#edf0e7;padding:18px 20px;border-radius:14px;margin:24px 0;font-size:12px}.settings label{display:flex;gap:8px;align-items:center}select{background:white;color:var(--ink);border:1px solid #d3dbcd;padding:8px;border-radius:8px;max-width:230px}.toolbar{display:flex;align-items:center;justify-content:space-between;margin:20px 0 12px;font-size:13px}.words{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.word{display:flex;gap:12px;align-items:center;padding:17px 15px;background:white;border:1px solid var(--line);border-radius:12px;cursor:pointer;min-width:0}.word:has(input:checked){background:#e9efe5;border-color:#8da18a}.word input{accent-color:var(--ink);width:18px;height:18px;flex-shrink:0}.word strong{display:block;font-size:19px;font-weight:550}.word em{font-style:normal;font-size:11px;color:var(--muted)}.primary{background:var(--ink);color:white;border-radius:12px;padding:15px 25px;font-weight:600;min-height:52px}.secondary{border:1px solid #cbd6c5;color:var(--ink);background:white;border-radius:12px;padding:14px 25px;min-height:52px}.start-bar{position:sticky;bottom:0;display:flex;align-items:center;justify-content:space-between;padding:18px 0 calc(18px + env(safe-area-inset-bottom));gap:20px;background:var(--paper);border-top:1px solid var(--line);margin-top:25px}.start-bar p{font-size:12px}.focus{max-width:580px;margin:30px auto 60px;text-align:center}.focus h1{font-size:40px}.progress{height:4px;background:var(--line);border-radius:5px;margin:27px 0 55px;overflow:hidden}.progress i{height:100%;display:block;background:var(--orange)}.sound{width:120px;height:120px;border-radius:50%;background:var(--mint);margin:30px auto;display:flex;align-items:center;justify-content:center;gap:6px}.sound i{width:5px;height:25px;background:#496d59;border-radius:5px}.sound i:nth-child(2),.sound i:nth-child(4){height:43px}.sound i:nth-child(3){height:60px}.speaking .sound i{animation:wave .7s ease-in-out infinite alternate}.speaking .sound i:nth-child(2n){animation-delay:.3s}@keyframes wave{to{transform:scaleY(.4)}}.actions{display:flex;justify-content:center;gap:14px;margin:32px 0}.actions button{min-width:140px}.status{min-height:48px;font-size:14px}.error{color:#a94432}.result-intro{background:var(--mint);padding:25px;border-radius:18px;margin:20px 0}.results{list-style:none;padding:0;margin:22px 0}.results li{display:flex;gap:18px;align-items:center;border-bottom:1px solid var(--line);padding:16px 5px}.results .index{font-size:12px;color:var(--muted);min-width:26px}.results strong{font-size:21px;font-weight:550}.results small{font-size:12px;letter-spacing:0;color:var(--muted)}.results button{margin-left:auto}footer{max-width:1000px;margin:30px auto 0;padding:28px 30px 40px;text-align:center;font-size:12px;color:#718079}body.in-focus footer{display:none}@media(max-width:680px){header{padding:20px}header a{font-size:17px}header>span{font-size:10px}main{padding:25px 20px 5px}h1{font-size:34px}.hero{grid-template-columns:1fr;gap:0;padding-bottom:15px}.art{display:none}.hero p{font-size:14px}.unit-card{padding:19px;gap:15px}.unit-card h2{font-size:21px}.number{min-width:58px;height:72px}.arrow{width:32px;height:32px}.steps{gap:12px}.steps article{font-size:12px}.steps p{font-size:11px}.words{grid-template-columns:repeat(2,1fr);gap:9px}.word{padding:14px 9px;gap:8px}.word strong{font-size:17px}.word em{font-size:10px}.settings{padding:14px;gap:10px}.settings label{width:100%;justify-content:space-between}.settings select{max-width:67%}.start-bar .primary{font-size:13px;padding:14px 17px}.focus{margin:32px auto}.focus h1{font-size:34px}.actions button{min-width:0;flex:1}.result-actions{display:flex;flex-wrap:wrap;gap:10px}.result-actions button{flex:1}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}