:root { --gold: #FFC107; --cyan: #00BCD4; --pink: #EC4899; --bg: #050505; --border: #222; }
* { margin:0; padding:0; box-sizing:border-box; }
body { background: var(--bg); color: #fff; font-family: 'Barlow', sans-serif; height: 100vh; overflow: hidden; display: flex; flex-direction: column; }

.topbar { height: 52px; background: #0F0F0F; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; padding: 0 15px; }
.logo-name { font-family: 'Barlow Condensed'; font-size: 18px; font-weight: 900; letter-spacing: 1px; }
.logo-name span { color: var(--gold); }
.logo-name em { font-style: normal; color: var(--cyan); margin-left: 5px; }

.workstation { display: flex; flex: 1; overflow: hidden; }
.viewer-panel { flex: 1.5; background: #000; position: relative; display: flex; align-items: center; justify-content: center; }
#output_canvas { max-width: 100%; max-height: 100%; }

.data-sidebar { flex: 1; background: #0A0A0A; border-left: 1px solid var(--border); padding: 15px; display: flex; flex-direction: column; gap: 15px; overflow-y: auto; }
.clinical-card { background: #111; border: 1px solid var(--border); padding: 12px; border-radius: 4px; }
.card-tag { font-family: 'Barlow Condensed'; font-size: 9px; font-weight: 800; color: #555; letter-spacing: 2px; margin-bottom: 10px; border-bottom: 1px solid #222; padding-bottom: 4px; }

.plot-box { height: 150px; width: 100%; }
.imso-badge { font-size: 9px; font-weight: 800; color: var(--gold); background: #1A1A1A; border: 1px solid #333; padding: 4px 8px; border-radius: 2px; }

.report-btn { background: var(--gold); color: #000; font-family: 'Oswald'; border: none; padding: 15px; border-radius: 3px; font-weight: 700; cursor: pointer; text-transform: uppercase; }

@media(max-width: 900px) { .workstation { flex-direction: column; } }