*{box-sizing:border-box} :root{--green:#214d40;--muted:#66766b;--line:#d8dfd3;--cream:#f7f8f1}body{margin:0;background:var(--cream);color:#243b31;font-family:Arial,"Microsoft JhengHei",sans-serif;font-size:16px}button,a,input,select{touch-action:manipulation}button,input,select{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;border:1px solid var(--line);border-radius:10px;background:white;color:var(--green);padding:11px 18px}button:hover{background:#eaf0e5}button:disabled{cursor:default;opacity:.55}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #b47a2e;outline-offset:4px}a{color:var(--green)}header{max-width:1200px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:27px 28px;border-bottom:1px solid var(--line)}.brand{font-size:16px;font-weight:800;letter-spacing:2px;text-decoration:none}.brand span{font-size:12px;font-weight:400;letter-spacing:1px;margin-left:14px}.pdf{font-size:14px;text-decoration:none}main{max-width:1144px;margin:auto;padding:0 0 25px}.hero{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:65px;padding:42px 0}.eyebrow{font-size:11px;letter-spacing:2px;color:#78815f;font-weight:bold}h1{font:48px/1.1 Georgia,serif;letter-spacing:-1px;margin:18px 0}h1 em{color:#607d50;font-weight:400}.intro{line-height:1.8;color:var(--muted);font-size:14px}.chips{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}.chips span{font-size:11px;padding:6px 10px;border:1px solid var(--line);border-radius:20px}figure{margin:0}figure img{width:100%;height:230px;object-fit:cover;border-radius:100px 12px 100px 12px}figcaption{text-align:right;font:italic 14px Georgia,serif;margin-top:10px;color:var(--muted)}.tabs{display:flex;gap:5px;border-bottom:1px solid var(--line);margin-bottom:24px}.tabs button{border:0;background:transparent;border-radius:0;padding:17px 24px;border-bottom:3px solid transparent;display:flex;gap:12px;color:#7c887c;font-size:12px}.tabs strong{font-size:16px;font-weight:500}.tabs button[aria-current]{color:var(--green);border-bottom-color:var(--green)}.learning{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:24px}.panel{background:white;border:1px solid var(--line);border-radius:18px;padding:28px}.panel h2{font-size:20px;margin:0 0 10px}.sub{font-size:13px;line-height:1.7;color:var(--muted)}.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.between{justify-content:space-between}.card{margin:20px 0 16px;width:100%;min-height:210px;border:0;background:#eef3e7;border-radius:14px;padding:30px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:17px}.card:hover{background:#e8efde}.card .term{font:38px/1.3 Georgia,serif;overflow-wrap:anywhere}.card .translation{font-size:29px;line-height:1.6}.tiny{font-size:12px;color:var(--muted);line-height:1.6}.card small{font-size:12px;letter-spacing:1px;color:var(--muted)}.primary{background:var(--green);color:white;border-color:var(--green)}.primary:hover{background:#34644e}.controls{display:flex;justify-content:center;gap:10px}.progress{height:7px;background:#e8ede1;border-radius:10px;margin:20px 0 12px;overflow:hidden}.progress span{display:block;background:#78945f;height:100%;transition:width .2s}.stat{font:44px Georgia,serif;margin:25px 0 0}.sidebar{align-self:start}.sidebar label{display:flex;gap:8px;line-height:1.6;font-size:14px;margin:24px 0 16px}.sidebar button{width:100%;margin:5px 0}.hint{padding:16px 20px;background:#f4f5ee;border-left:3px solid #9dad7e;line-height:1.7;margin:18px 0;font-size:15px}.sentence{font:22px/1.8 Georgia,serif;margin:28px 0}.options{display:grid;grid-template-columns:1fr 1fr;gap:12px}.options button{text-align:left;line-height:1.6;display:flex;gap:12px;align-items:center}.options button b{font-size:12px;color:#809071;flex-shrink:0}.options .correct{background:#e2f1dd;border-color:#6c9b57}.options .wrong{background:#fff0e8;border-color:#c08767}.feedback{padding:15px 0;min-height:35px;line-height:1.6}.success{color:#386e32}.error{color:#9e512f}input[type=text]{width:min(100%,380px);padding:13px;border:1px solid #9eae98;border-radius:9px;background:#fbfcf8}input[type=checkbox]{accent-color:var(--green);width:17px;height:17px}select{padding:9px;border:1px solid var(--line);border-radius:8px;background:white;color:var(--green)}.practice-title{font:24px/1.5 Georgia,serif}.article{max-width:800px;margin:auto;font:19px/1.9 Georgia,serif}.article h2{font:30px Georgia,serif}.article p{margin:20px 0}.article img{max-width:100%;border-radius:14px}.celebrate{animation:pop .4s ease-out}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}footer{display:flex;justify-content:space-between;gap:18px;border-top:1px solid var(--line);margin-top:35px;padding-top:20px;font-size:12px;color:var(--muted)}footer div{display:flex;gap:24px}footer a{text-decoration:none}kbd{background:#edf0e7;padding:2px 6px;border-radius:4px}.empty{text-align:center;padding:35px}.score{font:44px Georgia,serif}.source-links{margin-top:12px;display:flex;gap:14px;flex-wrap:wrap}.source-links a{font-size:12px}.question-count{font-size:12px;font-weight:bold;letter-spacing:1px;color:#74865f}@keyframes pop{50%{transform:scale(1.02)}}@media(max-width:1180px){main{padding:0 28px 25px}}@media(max-width:740px){header{padding:20px}.brand span{display:none}main{padding:0 18px 24px}.hero{gap:20px;padding:28px 0;grid-template-columns:1fr}h1{font-size:39px}.hero figure{display:none}.tabs{gap:0;justify-content:space-between}.tabs button{padding:14px 7px;gap:5px;font-size:10px}.tabs strong{font-size:14px}.learning{grid-template-columns:1fr}.panel{padding:21px}.sidebar{order:2}.card .term{font-size:30px}.options{grid-template-columns:1fr}.sentence{font-size:20px}footer{flex-direction:column}.stat{font-size:34px}.sidebar label{margin-top:15px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
