*{box-sizing:border-box}html,body,#root{height:100%;margin:0}#root{display:grid;grid-template-columns:320px 1fr;font:13px/1.4 ui-sans-serif,system-ui,sans-serif;color:#1c1c1e;background:#f5f5f7}#sidebar{display:flex;flex-direction:column;border-right:1px solid #d8d8dd;background:#fff;overflow:hidden}#sidebar header{padding:12px;border-bottom:1px solid #eee}#sidebar h1{font-size:14px;margin:0 0 8px}.filters{display:flex;flex-direction:column;gap:6px}.filters input,.filters select{width:100%;padding:5px 6px;border:1px solid #ccc;border-radius:6px;font:inherit}#case-list{list-style:none;margin:0;padding:0;overflow-y:auto;flex:1}#case-list li{padding:8px 12px;border-bottom:1px solid #f0f0f2;cursor:pointer;display:flex;flex-direction:column;gap:3px}#case-list li:hover{background:#f5f7ff}#case-list li.selected{background:#e8efff}.case-id{font-weight:600;word-break:break-all}.case-meta{display:flex;gap:5px;align-items:center;flex-wrap:wrap}.badge{font-size:10px;padding:1px 6px;border-radius:10px;text-transform:uppercase;letter-spacing:.03em;font-weight:700}.badge.split{background:#eceff4;color:#566}.badge.fresh{background:#d7f5dd;color:#14622a}.badge.stale{background:#ffe8cc;color:#8a4b00}.badge.none{background:#eee;color:#888}.badge.golden{background:#efe4ff;color:#5b2a9a}#conn-status{padding:6px 12px;font-size:11px;color:#888;border-top:1px solid #eee}#conn-status.live{color:#14622a}#main{display:flex;flex-direction:column;min-width:0}#case-header{padding:12px 16px;border-bottom:1px solid #d8d8dd;background:#fff}#case-title{font-weight:700;font-size:14px;word-break:break-all}#case-prompt{color:#555;margin-top:4px;font-style:italic}#tabs{display:flex;gap:2px;padding:8px 16px 0;background:#fff;border-bottom:1px solid #d8d8dd}#tabs button{border:1px solid #d8d8dd;border-bottom:none;background:#f0f0f2;padding:6px 16px;border-radius:8px 8px 0 0;cursor:pointer;font:inherit}#tabs button.active{background:#fff;font-weight:700}#panes{position:relative;flex:1;min-height:0}.pane{position:absolute;top:0;right:0;bottom:0;left:0;display:none;flex-direction:column}.pane.active{display:flex}.render-frame{flex:1;width:100%;border:none;background:#fff}.grade{padding:8px 16px;background:#fbfbfd;border-bottom:1px solid #eee;max-height:42%;overflow-y:auto}.grade-summary{font-weight:700;margin-bottom:6px}.grade-summary.pass{color:#14622a}.grade-summary.fail{color:#a11}.check{display:flex;gap:8px;padding:2px 0;align-items:baseline}.check .mark{width:14px}.check.pass .mark{color:#14622a}.check.fail .mark{color:#a11}.check .name{flex:1}.check .score{color:#888;font-variant-numeric:tabular-nums}.annotation{color:#a35;margin:1px 0 3px 22px;font-size:12px}.empty{color:#999;padding:16px}