/* ESO Training Sandbox — modeled on the ESO EHR look (ESO-AUDIT.md §8). */
*{box-sizing:border-box}body{margin:0;font-family:-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;background:#eef1f4;color:#1c2733}
a{color:#0b6fa4}.muted{color:#6b7a89}.small{font-size:.85em}.error{color:#b00020}.right{text-align:right}.center{text-align:center}
.suitebar{background:#14202e;color:#fff;display:flex;align-items:center;gap:14px;padding:8px 16px}
.eso-word{font-weight:700;font-style:italic;letter-spacing:-1px;font-size:1.3em}.eso-word.big{font-size:2.6em;color:#14202e}
.suite-title{font-weight:600}.suite-user{margin-left:auto;font-size:.9em}.suite-user a{color:#9fd3ee}
.train-banner{background:#fff3cd;border-bottom:2px solid #e0a800;color:#664d03;padding:7px 16px;font-size:.9em}
.mainnav{background:#fff;border-bottom:1px solid #d5dce2;padding:8px 16px;display:flex;gap:18px}
main{max-width:1180px;margin:0 auto;padding:18px 16px 60px}
h1{font-size:1.5em}h2{font-size:1.1em;text-transform:uppercase;letter-spacing:.03em}
.loginbody{background:#14202e;display:flex;align-items:center;justify-content:center;min-height:100vh}
.login-card{background:#fff;border-radius:10px;padding:32px;max-width:380px;width:92%}
.login-card label{display:block;margin:12px 0}.login-card input{width:100%;padding:9px;margin-top:4px}
.cardform label{display:block;margin:10px 0}.cardform input,.cardform select,.cardform textarea{width:100%;padding:8px;margin-top:3px}
.cardform.wide{max-width:720px}
.greenbtn{background:#43a047;color:#fff;border:0;border-radius:5px;padding:9px 18px;cursor:pointer;font-size:.95em;text-decoration:none;display:inline-block}
.greenbtn:hover{background:#388e3c}.greenbtn.alt{background:#8a97a5}.greenbtn:disabled{opacity:.5}
.delbtn{background:none;border:0;color:#c62828;cursor:pointer;font-size:.95em}
.records{width:100%;border-collapse:collapse;background:#fff}
.records th,.records td{border-bottom:1px solid #e2e8ee;padding:8px;text-align:left;font-size:.93em}
.icon.lock{color:#2e7d32}.icon.draft{color:#1565c0}
.listbar{display:flex;justify-content:space-between;align-items:end;margin-bottom:10px}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin:12px 0}
.tile{background:#fff;border:1px solid #d5dce2;border-radius:8px;padding:14px;text-decoration:none;color:inherit;display:block;position:relative}
.tile.started{border-color:#43a047}.tile .corner{color:#43a047;font-weight:700}
.tileform{margin:0}
/* chart shell */
.chartbar{background:#37474f;color:#fff;display:flex;align-items:center;gap:14px;padding:8px 14px;border-radius:6px 6px 0 0}
.chartbar .homebtn{color:#fff;text-decoration:none;font-size:1.2em}.patientdd{font-weight:600}
.chart-actions{margin-left:auto;display:flex;gap:10px;align-items:center}
.iconbtn{background:none;border:1px solid #90a4ae;color:#fff;border-radius:50%;width:32px;height:32px;cursor:pointer;font-size:1em}
.bolt{color:#ef5350;font-size:1.3em}
.tabbar{background:#29b6f6;display:flex;flex-wrap:wrap;border-radius:0 0 6px 6px;overflow:hidden}
.tab{color:#fff;text-decoration:none;padding:11px 16px;font-weight:600;font-size:.92em;letter-spacing:.02em}
.tab.on{background:#0288d1}.tab:hover{background:#03a9f4}
.scenario-note,.locked-note{background:#e3f2fd;border:1px solid #90caf9;padding:8px 12px;margin:12px 0;border-radius:6px}
.locked-note{background:#e8f5e9;border-color:#a5d6a7}
.withnav{display:flex;gap:0;margin-top:14px;align-items:flex-start}
.subnav{background:#fff;min-width:170px;border:1px solid #d5dce2;border-radius:6px;padding:8px 0;position:sticky;top:10px}
.subnav a{display:block;padding:8px 14px;color:#37474f;text-decoration:none;font-size:.88em;font-weight:600}
.subnav a:hover{background:#eceff1}
.tabbody{flex:1;padding-left:16px;min-width:0}
.card{background:#fff;border:1px solid #d5dce2;border-radius:6px;padding:16px;margin-bottom:16px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.grid.single{grid-template-columns:1fr}
.field label{display:block;font-size:.85em;color:#546e7a;margin-bottom:4px;font-weight:600}
.field input,.field select,.field textarea{width:100%;padding:8px;border:1px solid #b0bec5;border-bottom:2px dashed #90a4ae;border-radius:4px;background:#fff}
.field.wide{grid-column:1/-1}
.pillgroup{display:flex;flex-wrap:wrap;gap:6px}
.pill{background:#eceff1;border:1px solid #b0bec5;border-radius:20px;padding:6px 13px;cursor:pointer;font-size:.88em}
.pill.on{background:#29b6f6;color:#fff;border-color:#0288d1}
.checkgroup{display:flex;flex-wrap:wrap;gap:10px}.check{font-weight:400}
.sectionform .greenbtn{margin-top:12px}.saved-note{color:#2e7d32;margin-left:8px}
.fixedbar{position:sticky;bottom:0;background:#e8f5e9;border-top:2px solid #43a047;padding:10px;display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.segcontrol{display:flex;gap:0;margin-bottom:10px}.seg{border:1px solid #90a4ae;background:#eceff1;padding:7px 16px;cursor:pointer}.seg.on{background:#0288d1;color:#fff}
.hidden{display:none !important}
/* slide-overs, pickers, modals */
.slideover{position:fixed;top:0;right:0;width:min(480px,96vw);height:100vh;background:#fff;box-shadow:-4px 0 18px rgba(0,0,0,.3);z-index:50;overflow-y:auto;padding:16px}
.slide-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.picker{position:fixed;inset:0;background:#101c28;z-index:60;overflow-y:auto;padding:18px;color:#fff}
.pickgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-top:14px}
.navytile{width:100%;background:#1d3247;color:#fff;border:1px solid #33506e;border-radius:6px;padding:16px 10px;cursor:pointer;font-size:.95em}
.navytile:hover{background:#274a68}.badge{background:#43a047;border-radius:10px;padding:1px 8px}
.pickersearch{padding:9px;width:260px}
.modal{position:fixed;inset:0;background:rgba(10,20,30,.55);z-index:70;display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;padding:24px 10px}
.modal-card{background:#fff;border-radius:8px;padding:20px;max-width:640px;width:96%}
.modal-card.wide{max-width:900px}
.valhead{display:flex;gap:14px;align-items:center}.valcount{color:#c62828;font-size:2em;font-weight:700}
.issuebtn{display:block;width:100%;text-align:left;background:#fdecea;border:1px solid #ef9a9a;color:#b71c1c;border-radius:5px;padding:8px 12px;margin:5px 0;cursor:pointer}
.bigcheck{font-size:3em;color:#43a047}
.genbtn{width:100%;background:#1976d2;color:#fff;border:0;border-radius:6px;padding:13px;font-size:1.05em;cursor:pointer}
.ai-warning{color:#c62828;font-weight:600;margin:10px 0}
.action-banner{background:#f5f5f5;border-left:5px solid #f9a825;padding:10px 12px;margin:10px 0}
.narrative-text{white-space:pre-wrap;background:#fafafa;border:1px solid #e0e0e0;border-radius:6px;padding:12px}
.cor{border-top:1px solid #ddd;margin-top:16px;padding-top:10px}
.sigbox{border:2px dashed #90a4ae;border-radius:6px;padding:22px;text-align:center;cursor:pointer;color:#546e7a}
.sigcanvas{border:2px dashed #90a4ae;border-radius:6px;background:#fff;cursor:crosshair;max-width:100%}
.signed-line{color:#2e7d32;font-weight:600}
.flowrow{display:flex;gap:14px;align-items:center;background:#fff;border-bottom:1px solid #e2e8ee;padding:9px 6px;flex-wrap:wrap}
.inline{display:inline}.inlineform{display:flex;gap:8px;margin-top:10px;align-items:center}
.chip{background:#e3f2fd;border-radius:12px;padding:2px 9px;font-size:.85em}
.axrow{border-bottom:1px solid #eee;padding:10px 0}.axrow-head{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.findings{margin:8px 0 4px 22px}.findings-head{font-weight:600;color:#546e7a;font-size:.88em}
.finding{padding:6px 8px;cursor:pointer;border-radius:5px}.finding:hover{background:#f5f5f5}
.finding .slider{display:inline-flex;gap:8px;margin-right:8px;color:#90a4ae}
.finding.present{background:#e3f2fd}.finding.present .s-check{color:#1565c0;font-weight:700}
.finding.absent{background:#fdecea}.finding.absent .s-x{color:#c62828;font-weight:700}
.finding em{color:#1565c0;font-style:normal;font-weight:600}
.fbrow{display:flex;gap:12px;padding:10px;border-bottom:1px solid #eee}
.fbrow.pass span:first-child{color:#2e7d32;font-weight:700}.fbrow.fail span:first-child{color:#c62828;font-weight:700}
.preview-text{white-space:normal;color:#37474f}
@media(max-width:760px){.withnav{flex-direction:column}.subnav{position:static;display:flex;flex-wrap:wrap;min-width:0}.tabbody{padding-left:0}}