.trace-page{height:100dvh;min-height:760px;box-sizing:border-box;padding:12px 18px;display:flex;flex-direction:column;gap:9px;color:#283338;background:#f4f4f2;font-size:13px}.trace-heading{display:flex;align-items:center;gap:18px}.trace-heading h1{font-size:22px;margin:0}.trace-heading small{font-size:10px;letter-spacing:1px;color:#8b2130}.trace-heading form{display:flex;align-items:end;gap:8px;margin-left:auto}.trace-heading label{font-size:11px}.trace-heading input{display:block;padding:5px;width:140px}.trace-heading button{padding:7px 14px}.trace-troops{height:140px;flex-shrink:0}.trace-summary{display:flex;align-items:center;gap:15px;padding:10px 12px;background:#fff;border-left:4px solid #a3273d;border-radius:8px;font-size:11px}.trace-summary>strong{font-size:17px}.trace-summary span{flex:1}.trace-summary b,.trace-summary small{display:block}.trace-summary b{font-size:12px}.trace-summary small{color:#67727a}.trace-branches{display:grid;grid-template-columns:1.1fr 1fr;gap:12px;flex:1;min-height:0}.trace-branch{display:grid;grid-template-rows:24px 1fr 1fr 1fr;gap:8px;min-width:0;min-height:0}.trace-branch h2{font-size:16px;margin:0;color:#8d2538}.trace-branch h2 small{font-size:11px;font-weight:400;margin-left:10px;color:#61727b}.trace-grid{display:flex;flex-direction:column;height:100%;min-height:0;background:white;border:1px solid #ddd;border-radius:8px;overflow:hidden}.trace-grid header{display:flex;justify-content:space-between;padding:6px 10px;background:#f1e8e9;font-size:12px}.trace-grid header span{font-size:10px;color:#687279}.trace-scroll{overflow:auto;flex:1;min-height:35px}.trace-grid table{width:100%;border-collapse:collapse;font-size:11px}.trace-grid th{position:sticky;top:0;background:#fff;color:#687279;font-size:10px;padding:5px 8px;text-align:left;z-index:1}.trace-grid td{padding:6px 8px;border-bottom:1px solid #eee;vertical-align:top}.trace-grid td:nth-last-child(-n+2){white-space:nowrap}.trace-grid tr.selected{background:#fbe5c9;box-shadow:inset 3px 0 #b14a24}.trace-grid a{font-weight:700;color:#8d2538;text-decoration:underline}.trace-grid footer{padding:6px 10px;background:#f8f0e6;font-size:11px;font-weight:700;border-top:1px solid #e4d8c8}.trace-note{padding:3px 10px;font-size:10px;color:#667279;line-height:1.2}.trace-tabs{display:grid;grid-template-columns:repeat(2,max-content) 1fr;grid-template-rows:24px minmax(0,1fr);min-height:0;gap:0 4px}.trace-tabs.three{grid-template-columns:repeat(3,max-content) 1fr}.trace-tabs>input{position:absolute;opacity:0;width:1px;height:1px}.trace-tabs>label{font-size:11px;padding:4px 9px;background:#e6e6e5;border-radius:5px 5px 0 0;cursor:pointer}.trace-tabs>input:focus-visible+label{outline:2px solid #92283a}.trace-tabs>input:checked+label{background:#8d2538;color:white}.trace-tabs>div{display:none;grid-column:1/-1;grid-row:2;min-height:0}.trace-tabs>input:nth-of-type(1):checked~.tab-a,.trace-tabs>input:nth-of-type(2):checked~.tab-b,.trace-tabs>input:nth-of-type(3):checked~.tab-c{display:block}@media(max-width:900px){.trace-page{height:auto;min-height:100vh;padding:10px}.trace-heading{flex-wrap:wrap}.trace-heading form{margin-left:0;flex-wrap:wrap}.trace-summary{flex-wrap:wrap}.trace-summary span{flex:1 1 40%}.trace-branches{grid-template-columns:1fr}.trace-branch{grid-template-rows:26px repeat(3,240px)}.trace-troops{height:200px}.trace-tabs>label{font-size:10px;padding:4px}.trace-heading h1{font-size:20px}}
/* The trace workspace must not inherit the dashboard's clipped viewport. */
.direction-shell:has(.trace-page){height:auto;min-height:100dvh;overflow:visible}
@media(min-width:901px){
 .trace-page{min-height:600px}
 .trace-branch{grid-template-rows:24px repeat(3,minmax(0,1fr))}
 .trace-grid header,.trace-grid footer,.trace-note{flex-shrink:0}
 .trace-scroll{min-height:0}
}
@media(min-width:901px) and (max-height:780px){
 .trace-page{padding:6px 10px;gap:5px}
 .trace-heading{gap:12px;flex-shrink:0}
 .trace-heading h1{font-size:18px}
 .trace-heading form{gap:6px}
 .trace-heading input{padding:3px;width:130px}
 .trace-heading button{padding:5px 12px}
 .trace-troops{height:96px}
 .trace-summary{gap:10px;padding:6px 9px;flex-shrink:0}
 .trace-summary>strong{font-size:15px}
 .trace-summary b{font-size:11px}
 .trace-branch{gap:5px;grid-template-rows:20px repeat(3,minmax(0,1fr))}
 .trace-branch h2{font-size:14px}
 .trace-grid header{padding:3px 8px;font-size:11px}
 .trace-grid th{padding:3px 6px}
 .trace-grid td{padding:4px 6px}
 .trace-grid footer{padding:3px 8px;line-height:1.2}
 .trace-note{padding:2px 8px;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .trace-tabs{grid-template-rows:21px minmax(0,1fr)}
 .trace-tabs>label{padding:3px 8px}
}