.tc-top { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.tc-top h3 { font-size:21px; margin:7px 0; }
.tc-eyebrow { color:var(--brand); font-size:11px; font-weight:700; letter-spacing:2px; }
.tc-bar { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.tc-bar label { display:flex; align-items:center; gap:8px; }
.tc-bar .field { align-items:stretch; }
.tc-spacer { flex:1; }
#tc-library { width:240px; max-width:100%; }
.tc-layout { display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:16px; align-items:start; }
.tc-court-card { min-width:0; }
#tc-court { width:100%; max-height:650px; display:block; margin:12px auto; border-radius:12px; touch-action:none; user-select:none; }
#tc-court [data-tc-player] { cursor:grab; outline:none; }
#tc-court [data-tc-player]:focus circle { stroke:#f59e0b; stroke-width:5px; }
.tc-playback { justify-content:center; margin-top:14px; }
.tc-side .field { margin-bottom:10px; }
.tc-side hr { border:0; border-top:1px solid var(--line); margin:16px 0; }
.tc-step-list { display:flex; flex-direction:column; gap:6px; max-height:200px; overflow:auto; margin:12px 0; }
.tc-step-list .btn { text-align:left; white-space:normal; }
.tc-two { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; }
.tc-rationale { white-space:pre-wrap; overflow-wrap:anywhere; font:inherit; line-height:1.8; color:var(--ink-2); }
.tc-skills summary { cursor:pointer; font-weight:600; }
.tc-skills summary span { margin-left:10px; font-weight:400; }
.tc-skills select { min-width:64px; }
.tc-skills table { min-width:760px; }
#tc-root>.card,#tc-root>.tc-layout { margin-bottom:16px; }
@media(max-width:1100px) { .tc-layout { grid-template-columns:minmax(0,1fr); } .tc-side { display:grid; grid-template-columns:1fr 1fr; gap:16px; } }
@media(max-width:800px) {
  body:has(#tc-root) #app { flex-direction:column; }
  body:has(#tc-root) #side { width:100%; flex:0 0 auto; height:auto; position:static; }
  body:has(#tc-root) #side .nav-search-wrap,body:has(#tc-root) #side .side-foot,body:has(#tc-root) #side .nav-group-title { display:none; }
  body:has(#tc-root) #nav { display:flex; overflow-x:auto; padding:4px 10px 10px; }
  body:has(#tc-root) #nav .nav-group { display:contents; }
  body:has(#tc-root) #nav .nav-item { flex:0 0 auto; white-space:nowrap; }
  body:has(#tc-root) #toolbar { flex-wrap:wrap; height:auto; gap:8px; padding:12px; }
  body:has(#tc-root) #toolbar select { max-width:145px; }
  body:has(#tc-root) #view { padding:12px; }
  #tc-root { min-width:0; max-width:100%; }
  #tc-root .card { min-width:0; }
  .tc-top { flex-direction:column; align-items:flex-start; }
}
@media(max-width:650px) { .tc-side { display:block; } .tc-top h3 { font-size:18px; } #tc-library { width:180px; } }
