:root{font-family:system-ui,'Microsoft YaHei',sans-serif;color:#193c58;background:#f4f8fc;--blue:#1268a0;--orange:#d66b18}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}main{max-width:1120px;margin:auto;padding:24px}a{color:#1268a0}header,.section-heading,.play-options,.study-options,.join-row{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}header{margin:6px 0 28px}.brand{text-decoration:none;font-size:25px;font-weight:800}.brand span{display:block;font-size:13px;font-weight:500;margin:4px 0 0 36px}header>a:last-child{font-size:14px}h1{font-size:clamp(34px,5vw,56px);line-height:1.17;margin:12px 0 20px}h2{font-size:23px;margin:10px 0}p{line-height:1.7}.hero{display:flex;align-items:center;justify-content:space-between;padding:16px 18px 32px}.eyebrow{font-size:12px;font-weight:800;letter-spacing:1.6px;color:#28749b}.hero-art{font-size:78px;transform:rotate(-7deg);line-height:1.5;padding-right:50px}.hero-art span{font-size:55px}.panel{background:white;border:1px solid #dbe6f0;border-radius:22px;padding:26px;margin:16px 0;box-shadow:0 8px 30px #183b5410}.fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:20px 0}label{font-size:14px;font-weight:650}select,input{display:block;width:100%;padding:12px;border:1px solid #c3d5e3;border-radius:10px;margin-top:8px;font:inherit;color:inherit;background:white}button{min-height:46px;cursor:pointer;padding:12px 20px;border:1px solid #bdd3e4;border-radius:12px;background:#e9f3fa;color:#164f74;font:inherit;font-weight:750}button:hover:not(:disabled){filter:brightness(.96)}button:disabled{opacity:.45;cursor:default}.primary{background:var(--blue);color:white;border-color:var(--blue)}.secondary{background:white}.play-options{justify-content:flex-start;margin:20px 0}.tag{border-radius:20px;padding:8px 14px;background:#edf5fc;font-size:13px;font-weight:700}.small{font-size:13px;color:#547086}.online-entry{border-top:1px solid #e4edf4;padding-top:18px;margin-top:22px}.online-entry summary{cursor:pointer;font-weight:750}.join-row label{max-width:180px}.compact{display:flex;gap:7px;align-items:center;font-size:13px}.compact input{width:auto;margin:0}.library{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:20px 0}.tile{padding:0;background:white;overflow:hidden;text-align:left;position:relative}.tile-label{display:block;padding:12px;font-size:16px}.tile-label small{display:block;color:#607d92;font-weight:400;margin-top:4px}.mastered{position:absolute;top:8px;right:8px;border-radius:50%;padding:3px 7px;background:#e1f4df;color:#246f33;z-index:1}.picture{width:100%;aspect-ratio:1.64;position:relative;overflow:hidden;background:#fff}.picture img{position:absolute;max-width:none}.picture .number-mask{position:absolute;top:0;left:0;padding:3px 7px;background:#1268a0;color:white;font-size:11px;line-height:1.4;border-radius:0 0 8px 0;min-width:30px;text-align:center}.study{max-width:740px;margin:20px auto}.word-card{max-width:610px;margin:24px auto;text-align:center}.word-card .picture{border-radius:15px}.word-lines{padding:22px 10px}.word-lines .primary-word{font-size:36px;font-weight:800;line-height:1.25;overflow-wrap:anywhere}.word-lines .translation{font-size:24px;color:#cb6113;margin:10px 0;overflow-wrap:anywhere}.word-lines .chinese{font-size:20px;color:#64788a}.word-lines.covered{visibility:hidden}.study-options{justify-content:center}.game{max-width:880px;margin:auto}.game #game-banner{border-radius:14px;padding:14px;background:#edf5fc;font-size:15px;line-height:1.8}.coach{background:#fff5e9;border-radius:16px;padding:18px;margin:18px 0}.coach p{margin:8px 0}.coach .frame{font-size:21px;font-weight:750}.secret{color:#b65c16;font-weight:750}.waiting{text-align:center;padding:35px 20px;background:#f0f6fb;border-radius:20px;margin:20px 0}.waiting .symbol{font-size:65px}.curtain{position:fixed;inset:0;background:#143a55ed;z-index:20;display:grid;place-items:center;padding:22px}.curtain>.panel{max-width:500px;text-align:center}.curtain-icon{font-size:70px}footer{text-align:center;color:#647d90;font-size:12px;margin:30px 0}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #e98e2e;outline-offset:4px}#status,#game-status{color:#9a4a16}#load-more{display:block;margin:12px auto}body.busy #create,body.busy #join{pointer-events:none;opacity:.45}
@media(max-width:700px){main{padding:14px}.hero{padding:5px 4px 18px}.hero-art{font-size:48px;padding:0}.hero-art span{font-size:34px}.fields{grid-template-columns:1fr}.library{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.panel{padding:18px}.word-lines .primary-word{font-size:30px}.brand{font-size:21px}.join-row{align-items:stretch}.join-row label{max-width:none;width:100%}.study-options>button{flex:1}.game .section-heading{align-items:flex-start}}
