:root{--ink:#132b55;--blue:#2667ff;--red:#f04d3d;--paper:#f7f2e8;--line:#cdd6e5;--muted:#68758a}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,"PingFang SC",sans-serif;min-height:100vh;background-image:linear-gradient(rgba(38,103,255,.055) 1px,transparent 1px);background-size:100% 32px}.shell{width:min(1100px,calc(100% - 40px));margin:auto;padding:26px 0 60px}header{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid var(--ink);padding-bottom:18px}.brand{color:var(--ink);text-decoration:none;font-size:20px;font-weight:900;letter-spacing:-.5px}.brand span{display:inline-grid;place-items:center;width:34px;height:34px;margin-right:8px;background:var(--blue);color:white;transform:rotate(-5deg)}button{font:inherit}.quiet{border:1px solid var(--ink);background:transparent;color:var(--ink);padding:9px 14px;font-size:13px;cursor:pointer}.intro{display:grid;grid-template-columns:1.4fr .6fr;gap:30px;align-items:end;padding:54px 0 34px}.eyebrow{grid-column:1/-1;margin:0;color:var(--blue);font-size:12px;font-weight:800;letter-spacing:2px}.intro h1{margin:0;font-family:Georgia,"Songti SC",serif;font-size:clamp(40px,6vw,76px);line-height:.96;letter-spacing:-3px}.intro h1 em{color:var(--red);font-weight:400}.intro>p:last-child{margin:0 0 4px;line-height:1.8;color:var(--muted);font-size:15px}.study{width:min(680px,100%);margin:auto}.progress-row{display:flex;justify-content:space-between;align-items:end;font-size:13px;margin-bottom:8px}.progress-row strong{font-family:Georgia,serif;font-size:28px}.progress-row span{color:var(--muted)}#percent{font-weight:bold;color:var(--blue)}.progress{height:6px;background:#d9dfdf;margin-bottom:22px;overflow:hidden}.progress i{display:block;height:100%;width:0;background:var(--blue);transition:width .35s}.card{height:330px;perspective:1200px;outline:none;cursor:pointer}.card:focus-visible{outline:3px solid rgba(38,103,255,.35);outline-offset:5px}.card-inner{position:relative;width:100%;height:100%;transition:transform .58s cubic-bezier(.2,.75,.25,1);transform-style:preserve-3d}.card.flipped .card-inner{transform:rotateY(180deg)}.face{position:absolute;inset:0;backface-visibility:hidden;border:2px solid var(--ink);padding:28px 34px;box-shadow:9px 9px 0 var(--ink);display:flex;flex-direction:column}.front{background:#fff}.front:after{content:"";position:absolute;width:84px;height:84px;border:18px solid rgba(38,103,255,.12);border-radius:50%;right:28px;top:28px}.card-no{font-size:11px;font-weight:800;letter-spacing:2px;color:var(--blue)}.front p{margin:auto 0 0;color:var(--muted);font-size:13px}.front h2{font-family:Georgia,serif;font-size:clamp(62px,12vw,104px);letter-spacing:-5px;margin:0 0 auto;line-height:1}.hint{align-self:flex-end;font-size:12px;color:var(--muted)}.hint b{color:var(--red);font-size:18px}.back{background:var(--ink);color:#fff;transform:rotateY(180deg)}.back .card-no{color:#8eb0ff}.back dl{margin:auto 0;display:grid;grid-template-columns:1fr 1fr;gap:18px}.back dl div+div{border-left:1px solid #57709a;padding-left:24px}.back dt{font-size:12px;color:#aebbd0;margin-bottom:8px}.back dd{font-family:Georgia,serif;font-size:clamp(28px,5vw,46px);margin:0}.meaning{margin:0;border-top:1px solid #57709a;padding-top:14px;color:#dbe5f7}.actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}.actions button{border:0;padding:17px;cursor:pointer;font-weight:800}.actions span{margin-right:5px}.again{background:#ffd9d4;color:#a72518}.know{background:var(--blue);color:white}.tip{text-align:center;color:var(--muted);font-size:12px;margin-top:18px}.done{width:min(680px,100%);margin:30px auto 0;text-align:center;border:2px solid var(--ink);background:#fff;padding:46px;box-shadow:9px 9px 0 var(--ink)}.done>span{display:inline-grid;place-items:center;width:54px;height:54px;border-radius:50%;background:#22a06b;color:white;font-size:28px}.done h2{font-family:Georgia,"Songti SC",serif;font-size:36px;margin:20px 0 8px}.done p{color:var(--muted)}.done button{background:var(--ink);color:white;border:0;padding:14px 24px;cursor:pointer;margin-top:12px}@media(max-width:650px){.shell{width:min(100% - 24px,1100px);padding-top:16px}.intro{grid-template-columns:1fr;padding:38px 0 26px}.intro .eyebrow{grid-column:auto}.intro h1{letter-spacing:-2px}.card{height:300px}.face{padding:23px}.front h2{font-size:70px}.back dl{grid-template-columns:1fr}.back dl div+div{border-left:0;border-top:1px solid #57709a;padding:14px 0 0}.back dd{font-size:32px}.actions{grid-template-columns:1fr}.tip{display:none}}