:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;color:#182230;background:#f4f6f9}*{box-sizing:border-box}
body{margin:0} .header{padding:18px 28px;background:#fff;border-bottom:1px solid #e6e9ef;display:flex;align-items:center;justify-content:space-between;gap:14px}
.brand{font-weight:800;letter-spacing:-.3px;font-size:19px}.subtitle{color:#66778d;font-size:12px;margin-top:4px}.credit{font-size:12px;color:#536176;text-align:right}
.layout{display:grid;grid-template-columns:minmax(190px,.77fr) minmax(390px,1.6fr) minmax(270px,1fr);gap:14px;max-width:1600px;margin:20px auto;padding:0 16px}
.panel{background:#fff;border:1px solid #e5eaf1;border-radius:15px;padding:21px;box-shadow:0 3px 14px #25374a08;min-width:0}
h1{font-size:23px;letter-spacing:-.7px;margin:0 0 10px}h2{font-size:17px;margin:0 0 11px}h3{font-size:15px;margin:0 0 12px}p{line-height:1.5}small,.muted{color:#66778d}.muted{font-size:13px}.divider{border:0;border-top:1px solid #e7ebf1;margin:17px 0}
.pill{background:#edf2fb;color:#244d85;font-size:12px;border-radius:99px;padding:6px 10px;display:inline-block;font-weight:600}
.progress{height:8px;background:#e6ebf2;border-radius:9px;overflow:hidden;margin:16px 0}.progress div{height:100%;background:#2b527e;transition:width .25s}
.ecg{width:100%;max-height:320px;object-fit:contain;background:#fff;border:1px solid #e1e6ed;border-radius:10px;margin:14px 0;padding:10px}
.opt{width:100%;padding:13px 15px;text-align:left;background:white;border:1px solid #cfd9e6;border-radius:10px;display:block;margin:9px 0;font:inherit;cursor:pointer;line-height:1.4}
.opt.sel{border:2px solid #2c5481;padding:12px 14px;background:#f2f6fb}.opt.correct{border:2px solid #208a54;padding:12px 14px;background:#edf9f1}.opt.wrong{border:2px solid #c73745;padding:12px 14px;background:#fff1f1}
.primary{border:0;background:#213e61;color:#fff;padding:12px 18px;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer}.primary:disabled{opacity:.4;cursor:not-allowed}.ghost{border:1px solid #d9e1ec;background:#fff;padding:10px 14px;border-radius:10px;cursor:pointer}
.feedback{background:#f1f5fa;border-left:4px solid #2b527e;padding:15px;margin-top:15px;border-radius:6px;line-height:1.55}.feedback.good{border-color:#208a54}.feedback.bad{border-color:#c73745}
.flex{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.rank{display:flex;align-items:center;gap:8px;padding:11px 0;border-bottom:1px solid #eff2f6;font-size:13px}.rank .num{color:#76859a;width:20px}.rank .user{flex:1;font-weight:600}.rank .points{font-weight:800}.me{color:#135eaa}
.hidden{display:none!important}.modal{position:fixed;inset:0;background:#071422ac;display:flex;align-items:center;justify-content:center;padding:20px;z-index:20}.modal-card{background:#fff;border-radius:18px;padding:28px;width:min(440px,100%);box-shadow:0 20px 80px #0004}
input{font:inherit;padding:13px;width:100%;border:1px solid #cad5e3;border-radius:9px;margin:14px 0}.book{width:100%;border:1px solid #edf0f5;border-radius:8px}.book img{width:100%;display:block}.book[hidden]{display:none}.photo-actions{display:flex;gap:8px;margin:10px 0}.photo-actions a{font-size:13px;color:#2c5684}
.notice{padding:10px 11px;border-radius:8px;background:#fff8e8;color:#765520;font-size:12px;line-height:1.5}.empty{color:#8c9bae;font-size:13px;padding:24px 0;text-align:center}
@media(max-width:1150px){.layout{grid-template-columns:190px minmax(400px,1fr)}.reference{grid-column:1/-1}.reference .book{max-width:500px;margin:auto}}
@media(max-width:690px){.layout{display:flex;flex-direction:column}.header{padding:14px;align-items:flex-start}.credit{font-size:11px}.panel{padding:17px}.left{order:2}.reference{order:3}.main{order:1}}