*{box-sizing:border-box}html{font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;color:#3b5360}body{margin:0;min-height:100dvh;background:radial-gradient(circle at 15% 12%,#fdf1ed 0,transparent 30%),radial-gradient(circle at 90% 19%,#dbeafa 0,transparent 37%),linear-gradient(155deg,#eaf6f2,#e9edf9 56%,#f8eff0);overflow-x:hidden}button,input{font:inherit}button{cursor:pointer;border:0}button:disabled{opacity:.55;cursor:not-allowed}.shell{min-height:100dvh;display:flex;flex-direction:column;align-items:center;padding:24px 20px max(24px,env(safe-area-inset-bottom));position:relative}.shell:before,.shell:after{content:"";position:absolute;border-radius:50%;pointer-events:none;background:#ffffff88;filter:blur(1px)}.shell:before{width:12px;height:12px;top:18%;left:13%}.shell:after{width:7px;height:7px;top:33%;right:17%}.top{width:min(100%,460px);display:flex;align-items:center;justify-content:space-between;gap:10px}.brand{font-weight:800;letter-spacing:.08em;font-size:18px;color:#4f6c78}.pill{border:1px solid #ffffffaf;background:#ffffff80;border-radius:999px;padding:7px 13px;color:#67818d;font-size:12px}.main{width:min(100%,460px);flex:1;display:flex;align-items:center;justify-content:center;padding:24px 0}.card{width:100%;background:#ffffffbc;border:1px solid #fff;box-shadow:0 24px 80px #6b91a526,0 4px 20px #a9c5ce23;border-radius:30px;padding:32px 27px;text-align:center;backdrop-filter:blur(18px);animation:rise .45s ease both}@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.icon{font-size:36px;margin:0 auto 15px;width:76px;height:76px;border-radius:25px;display:grid;place-items:center;background:linear-gradient(135deg,#e3f7ee,#e8ecff);box-shadow:inset 0 0 0 1px white}.eyebrow{color:#86a8ac;letter-spacing:.22em;font-size:11px;font-weight:800;margin:0 0 10px}.title{font-size:clamp(36px,10vw,51px);line-height:1.2;margin:0;color:#4b6976;letter-spacing:.08em}.subtitle{color:#879ca7;font-size:14px;line-height:1.8;margin:12px 0 29px}.btn{width:100%;border-radius:16px;padding:15px 18px;font-weight:700;transition:transform .18s,box-shadow .18s}.btn:active{transform:scale(.98)}.primary{background:linear-gradient(105deg,#81c9c3,#8fb9dc 55%,#b7aee0);color:white;box-shadow:0 10px 24px #78a8c95a}.secondary{background:#edf5f5;color:#62858e;margin-top:12px}.plain{background:none;color:#79929b;padding:10px}.field{display:block;width:100%;border:1px solid #d8e8e9;background:#fff;border-radius:16px;padding:15px 17px;outline:none;text-align:center;color:#466370;box-shadow:0 4px 12px #a1bfc113}.field:focus{border-color:#85c5c6;box-shadow:0 0 0 4px #abdeda55}.field::placeholder{color:#a9b8c0}.field.code{font-size:24px;letter-spacing:.24em;font-weight:700}.field.word{font-size:19px;margin:22px 0 13px}.tiny{font-size:12px;color:#9aadb5;line-height:1.6}.foot{font-size:12px;color:#90a6ad;text-align:center;letter-spacing:.08em}.room-code{font-size:32px;font-weight:800;letter-spacing:.18em;color:#577888;margin:10px 0}.copy{display:inline-flex;align-items:center;gap:5px;background:#eaf4f3;color:#628d92;padding:8px 12px;border-radius:99px;font-size:12px}.progress{display:flex;gap:7px;justify-content:center;margin:18px 0 26px}.dot{width:25px;height:5px;border-radius:9px;background:#dde9e9}.dot.done{background:#8fcfbd}.dot.now{background:#9eafe5}.topic{font-size:clamp(45px,13vw,67px);line-height:1.25;color:#547785;font-weight:800;letter-spacing:.1em;margin:9px 0}.topic-wrap{padding:20px 0 6px}.status{background:#f0f7f7;border-radius:15px;padding:13px;color:#738e98;font-size:13px;margin:15px 0}.avatars{display:flex;justify-content:center;gap:10px;margin:12px 0}.avatar{border-radius:99px;padding:8px 11px;background:#eff3fb;font-size:12px;color:#7991ad}.avatar.ready{background:#e6f6ed;color:#669e83}.result-word{font-size:34px;font-weight:800;color:#537b82;margin:8px 0 22px}.split{display:flex;align-items:center;justify-content:center;gap:15px;margin:20px 0}.answer{background:#f4f8f8;border-radius:15px;padding:11px 14px;min-width:95px}.answer small{display:block;color:#9bb0b7;font-size:11px;margin-bottom:5px}.answer b{font-size:20px;color:#587887}.rows{text-align:left;display:grid;gap:8px;margin:20px 0}.row{display:grid;grid-template-columns:22px 1fr auto;align-items:center;gap:10px;background:#f3f8f8;border-radius:13px;padding:11px;font-size:13px}.row span:last-child{color:#718e98}.score{font-size:47px;font-weight:800;color:#5e9c9d;margin:6px 0}.error{color:#b76e75;font-size:13px;min-height:22px;margin:10px 0 0}.hide{display:none!important}@media(max-width:380px){.card{padding:27px 20px}.shell{padding:18px 14px 23px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
textarea{font:inherit;resize:vertical;min-height:100px}dialog{border:1px solid white;border-radius:24px;padding:28px;width:calc(100% - 40px);max-width:400px;color:#3b5360;background:#f6fbfc;box-shadow:0 20px 80px #4567}dialog::backdrop{background:#3b536066}dialog p{line-height:1.8;font-size:14px}.raw{white-space:pre-wrap;overflow-wrap:anywhere;unicode-bidi:plaintext}.answer{min-width:0;flex:1}.answer b{font-size:18px}.record{background:#f3f8f8;border-radius:15px;padding:14px;min-width:0}.record-title{font-size:12px;display:flex;justify-content:space-between;gap:8px;color:#78959a;margin-bottom:12px}.record-answer{display:flex;flex-direction:column;gap:5px;margin-top:10px}.record-answer small{font-size:11px;color:#8ca6ad}.record em{font-style:normal;color:#9faeb1;font-size:12px}
textarea{font:inherit;resize:vertical;min-height:100px}.draft-status{font-size:11px;color:#779a96;margin:-6px 0 12px;min-height:18px}dialog{border:1px solid white;border-radius:24px;padding:28px;width:calc(100% - 40px);max-width:400px;color:#3b5360;background:#f6fbfc;box-shadow:0 20px 80px #4567}dialog::backdrop{background:#3b536066}dialog p{line-height:1.8;font-size:14px}.raw{white-space:pre-wrap;overflow-wrap:anywhere;unicode-bidi:plaintext}.answer{min-width:0;flex:1}.answer b{font-size:18px}.record{background:#f3f8f8;border-radius:15px;padding:14px;min-width:0}.record-title{font-size:12px;display:flex;justify-content:space-between;gap:8px;color:#78959a;margin-bottom:12px}.record-answer{display:flex;flex-direction:column;gap:5px;margin-top:10px}.record-answer small{font-size:11px;color:#8ca6ad}.record em{font-style:normal;color:#9faeb1;font-size:12px}
.library-home{margin-bottom:18px}.library-cards{display:grid;gap:10px;max-height:55vh;overflow:auto}.library-card{display:grid;gap:7px;text-align:left;padding:16px;border:1px solid #d9e7e9;border-radius:16px;background:#f5fafb;color:#3b5360}.library-card.selected{border:2px solid #7eafb1}.library-card small,.library-card span{font-size:12px;color:#7b929c}.music-control{position:fixed;right:16px;bottom:16px;z-index:5;border-radius:99px;padding:11px 16px;background:#334e61;color:white;box-shadow:0 5px 15px #0002}.grade{border-radius:24px;padding:24px 16px;margin:20px 0;display:grid;gap:10px;box-shadow:inset 0 0 0 1px #ffffffaa}.grade small{font-size:11px;letter-spacing:.1em}.grade strong{font-size:28px;line-height:1.5}.grade p{font-size:11px;line-height:1.8;margin:0}.grade-count{font-size:38px;font-weight:800}.tier-0{background:linear-gradient(135deg,#ddf7e6,#ebf5ca);color:#3f7860;border:2px solid #badfc6}.tier-1{background:linear-gradient(135deg,#def6f2,#e1edfc);color:#467b91;border:1px solid #b8d6de}.tier-2{background:linear-gradient(135deg,#e7e6fc,#f4e8fc);color:#796e9d;border:1px solid #d5c9ed}.tier-3{background:linear-gradient(135deg,#fff1d9,#fbe7db);color:#a08258;border:1px dashed #d5bc9d}.tier-4{background:linear-gradient(135deg,#f1e5ea,#ece7f1);color:#927e92;border:1px dashed #c1a8ba}.tier-5{background:linear-gradient(135deg,#e3e8ef,#f0f1f4);color:#738091;border:2px dotted #aeb9c9}.agreed{background:#edf5f5;color:#7b9497}.agreed strong{font-size:24px}
body.kpl{background:radial-gradient(circle at 70% 15%,#793d36 0,transparent 40%),linear-gradient(145deg,#171b2a,#292238 70%,#3b2930);color:#e8d9be}.kpl .card{background:#222635f2;border-color:#b49a6460;box-shadow:0 24px 80px #0006}.kpl .brand,.kpl .title,.kpl .topic{color:#ebd29b}.kpl .eyebrow,.kpl .tiny,.kpl .foot{color:#b8a991}.kpl .subtitle{color:#c1b6a8}.kpl .pill,.kpl .icon{background:#ffffff0c;color:#e0bb7b;border-color:#ffffff22}.kpl .primary{background:linear-gradient(105deg,#a35c4c,#bd985b);box-shadow:0 10px 24px #0003}.kpl .secondary,.kpl .status,.kpl .record,.kpl .answer{background:#ffffff0a;color:#d9ccbc}.kpl .plain,.kpl .answer b{color:#dbb77e}.kpl .record-title{color:#d1b98c}.kpl .field{background:#171b27;color:#f2e5cf;border-color:#a58b5e66}.kpl-grade{background:linear-gradient(125deg,#513726,#2b2c45);color:#f6d991;border-color:#e1bd6b}.kpl-grade strong{font-size:23px}.kpl-grade.tier-0{box-shadow:0 0 28px #eeb54f33,inset 0 0 0 3px #ebc77830}.kpl-grade.tier-1{background:linear-gradient(125deg,#374445,#2c3349);border-color:#a7cdbd}.kpl-grade.tier-2{background:linear-gradient(125deg,#353459,#4e354b);border-color:#b7a0d2}.kpl-grade.tier-3{background:linear-gradient(125deg,#543d30,#3e3036);border-style:dashed}.kpl-grade.tier-4{background:linear-gradient(125deg,#4a3042,#292d3e);color:#d3a4b6;border-color:#a18091}.kpl-grade.tier-5{background:linear-gradient(125deg,#272b36,#303345);color:#aeb6c7;border-color:#778395}