:root{--cream:#f8f2e7;--paper:#fffdf8;--blue:#315a75;--blue2:#e8f1f5;--red:#d85d57;--red2:#fae5e2;--ink:#24323a;--muted:#71808a;--line:#e6ded2;--green:#4e8964;--shadow:0 18px 50px rgba(50,54,48,.09)}
*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:"DM Sans",sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}
.topbar{height:76px;padding:0 6%;display:flex;justify-content:space-between;align-items:center;background:rgba(255,253,248,.94);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10;backdrop-filter:blur(12px)}
.brand{display:flex;gap:11px;align-items:center}.brand-mark{width:40px;height:40px;border-radius:13px;background:var(--red);color:white;display:grid;place-items:center;font-size:22px;font-weight:800}.brand strong{font:800 19px Manrope;display:block}.brand em{font:800 10px DM Sans;color:var(--red);font-style:normal;margin-left:3px}.brand span{font-size:11px;color:var(--muted);display:block}.top-actions{display:flex;align-items:center;gap:9px}.case-pill,.ghost{border:1px solid var(--line);background:var(--paper);padding:9px 13px;border-radius:12px;font-size:12px}.case-pill b{color:var(--red)}.ghost{font-weight:700;color:var(--blue)}
main{max-width:1240px;margin:auto;padding:42px 24px}.hero{display:flex;justify-content:space-between;gap:25px;align-items:end;margin-bottom:25px}.eyebrow{letter-spacing:2px;color:var(--red);font-size:10px;font-weight:800}.hero h1{font:800 clamp(30px,5vw,53px)/1.05 Manrope;margin:8px 0 12px}.hero h1 span{color:var(--blue)}.hero-copy{max-width:700px;color:var(--muted);line-height:1.65}.stats{display:flex;background:var(--paper);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}.stats div{padding:18px 24px;text-align:center;border-left:1px solid var(--line)}.stats div:first-child{border:0}.stats b{display:block;font:800 25px Manrope;color:var(--blue)}.stats span{font-size:10px;color:var(--muted)}
.main-nav{display:flex;gap:8px;margin-bottom:20px}.nav-btn{border:1px solid var(--line);background:var(--paper);padding:12px 16px;border-radius:13px;font-weight:800;color:var(--muted)}.nav-btn.active{background:var(--blue);color:white;border-color:var(--blue)}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:28px;box-shadow:var(--shadow)}.panel-head{display:flex;justify-content:space-between;gap:20px;align-items:start;margin-bottom:24px}.panel h2{font:800 27px Manrope;margin:2px 0 7px}.panel h3{font:800 17px Manrope;margin:0 0 8px}.panel p{color:var(--muted);line-height:1.6;margin:0}.badge{background:var(--red2);color:#a8443e;border-radius:30px;padding:7px 11px;font-size:10px;font-weight:800;white-space:nowrap}
.workspace{display:grid;grid-template-columns:215px 1fr;gap:20px}.steps{background:#faf7f0;border:1px solid var(--line);border-radius:18px;padding:9px;height:max-content}.step{width:100%;display:grid;grid-template-columns:35px 1fr;text-align:left;gap:0 8px;padding:11px;border:0;background:transparent;border-radius:11px;color:var(--muted)}.step i{grid-row:1/3;font-style:normal;font-size:10px;padding-top:2px}.step span{font-size:12px;font-weight:800;color:var(--ink)}.step small{font-size:9px;margin-top:2px}.step.active{background:var(--blue2)}.step.active i,.step.active span{color:var(--blue)}
.avatar{height:170px;border-radius:17px;background:var(--blue2);display:grid;place-items:center;font-size:65px}.patient-grid{display:grid;grid-template-columns:175px 1fr;gap:20px}.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.fact{padding:14px;border:1px solid var(--line);border-radius:13px}.fact small{display:block;color:var(--muted);font-size:9px}.fact b{display:block;margin-top:3px}.quote{margin-top:12px;padding:15px;background:#faf1e7;border-left:4px solid var(--red);border-radius:9px;font-style:italic;font-size:13px}
.symptoms,.tests,.results{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.symptom,.test,.result{padding:16px;border:1px solid var(--line);border-radius:14px;background:#fff}.symptom b{display:block;margin-bottom:5px}.symptom span,.test span,.result span{font-size:11px;color:var(--muted)}.test{text-align:left;transition:.18s}.test:hover{transform:translateY(-2px)}.test.selected{border:2px solid var(--blue);background:var(--blue2)}.test-icon{font-size:23px}.test b{display:block;margin:7px 0 4px}.result{display:flex;justify-content:space-between;gap:12px}.result b{font-size:13px}.normal{color:var(--green)!important;font-weight:800}.abnormal{color:var(--red)!important;font-weight:800}
.choices{display:grid;gap:9px}.choice{padding:15px;border:1px solid var(--line);border-radius:13px;background:#fff;text-align:left}.choice:hover{border-color:#9db4c0}.choice.correct{background:#edf8f0;border-color:var(--green)}.choice.wrong{background:var(--red2);border-color:var(--red)}
.explain{margin-top:16px;padding:16px;background:var(--blue2);border-radius:13px;font-size:12px}.explain b{display:block;color:var(--blue);margin-bottom:4px}.btn-row{display:flex;justify-content:space-between;gap:10px;margin-top:25px}.primary,.secondary,.danger{padding:11px 16px;border-radius:11px;font-weight:800}.primary{border:0;background:var(--blue);color:white}.secondary{border:1px solid var(--line);background:#fff;color:var(--ink)}.danger{border:0;background:var(--red2);color:#a8443e}.primary:disabled{opacity:.35;cursor:not-allowed}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.field{display:flex;flex-direction:column;gap:6px}.field.full{grid-column:1/-1}.field label{font-size:11px;font-weight:800}.field input,.field textarea,.field select{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:11px;background:#fff;outline:0}.field textarea{min-height:85px;resize:vertical}.field input:focus,.field textarea:focus{border-color:#8da9b8}.builder-section{margin-top:24px;padding-top:22px;border-top:1px solid var(--line)}.builder-section>div:first-child{margin-bottom:13px}.builder-row{display:grid;grid-template-columns:1fr 1fr auto;gap:9px;margin-bottom:9px}.builder-row input,.builder-row select{padding:10px;border:1px solid var(--line);border-radius:10px;background:#fff}.mini-btn{border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 11px;font-weight:800}.remove{color:var(--red)}.check-row{display:flex;gap:10px;align-items:center;padding:10px 0}.check-row input{accent-color:var(--blue)}
.library-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.case-card{border:1px solid var(--line);border-radius:16px;padding:18px;background:#fff;display:flex;flex-direction:column;min-height:205px}.case-card h3{font:800 18px Manrope;margin:8px 0}.case-card p{font-size:11px}.case-meta{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0}.tag{padding:5px 8px;border-radius:20px;background:var(--blue2);color:var(--blue);font-size:9px;font-weight:800}.card-actions{margin-top:auto;display:flex;gap:7px}.card-actions button{flex:1;padding:9px;border-radius:9px;border:1px solid var(--line);background:#fff;font-size:11px;font-weight:800}.card-actions .play{background:var(--blue);color:#fff;border-color:var(--blue)}.empty{text-align:center;padding:50px 20px;color:var(--muted)}.score{text-align:center;margin-top:15px}.score-num{font:800 54px Manrope;color:var(--red)}.notice{padding:12px 14px;border-radius:11px;background:#fff4e5;color:#806b50;font-size:11px;margin-bottom:17px}
footer{text-align:center;color:var(--muted);font-size:10px;padding:30px}.hidden{display:none}#toast{position:fixed;bottom:22px;right:22px;background:var(--ink);color:#fff;padding:12px 16px;border-radius:11px;font-size:11px;opacity:0;transform:translateY(10px);transition:.25s;z-index:50}#toast.show{opacity:1;transform:translateY(0)}
@media(max-width:850px){.hero{display:block}.stats{width:max-content;margin-top:18px}.workspace{grid-template-columns:1fr}.steps{display:flex;overflow:auto}.step{min-width:145px}.library-grid{grid-template-columns:1fr 1fr}.top-actions .case-pill{display:none}}@media(max-width:600px){main{padding:28px 15px}.topbar{padding:0 15px}.hero h1{font-size:35px}.form-grid,.symptoms,.tests,.results,.library-grid{grid-template-columns:1fr}.patient-grid{grid-template-columns:1fr}.avatar{height:120px}.facts{grid-template-columns:1fr 1fr}.panel{padding:20px}.builder-row{grid-template-columns:1fr}.main-nav{overflow:auto}.nav-btn{white-space:nowrap}}