:root{--bg:#0b1020;--panel:#121a2e;--panel2:#17213a;--text:#edf2ff;--muted:#9aa7c7;--line:#263455;--accent:#58a6ff;--good:#3ddc97;--bad:#ff5c7a;--warn:#ffd166}*{box-sizing:border-box}body{margin:0;background:linear-gradient(135deg,#070b16,#101a31);color:var(--text);font-family:Inter,Segoe UI,Roboto,Arial,sans-serif}.side{position:fixed;inset:0 auto 0 0;width:270px;background:#080d19;border-right:1px solid var(--line);padding:18px;display:flex;flex-direction:column;gap:10px}.brand{display:flex;gap:12px;align-items:center;margin-bottom:18px}.brand span{display:block;color:var(--muted);font-size:12px;margin-top:2px}.dot{width:18px;height:18px;border-radius:50%;background:var(--accent);box-shadow:0 0 22px var(--accent)}.nav{border:1px solid transparent;background:transparent;color:var(--muted);padding:12px 14px;border-radius:12px;text-align:left;font-weight:700;cursor:pointer}.nav:hover,.nav.active{background:var(--panel2);color:var(--text);border-color:var(--line)}.nav.danger{margin-top:auto;color:#ff9aad}.ws{font-size:12px;color:var(--muted);padding:8px}.main{margin-left:270px;min-height:100vh;padding:24px}.top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px}.top h1{margin:0 0 6px;font-size:28px}.top p{margin:0;color:var(--muted)}.activebox{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px 16px;min-width:260px;text-align:right;color:var(--muted)}.tab{display:none}.tab.active{display:block}.grid{display:grid;gap:18px}.grid.two{grid-template-columns:1fr 1fr}.grid.smallgap{gap:10px}.card{background:rgba(18,26,46,.92);border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 12px 35px rgba(0,0,0,.25)}.card h2,.card h3{margin:0 0 14px}.muted{color:var(--muted)}label{display:block;color:var(--muted);font-size:13px;margin:12px 0 6px}input,select,textarea{width:100%;background:#0b1222;color:var(--text);border:1px solid var(--line);border-radius:10px;padding:10px;outline:none}select[multiple]{min-height:160px}textarea{resize:vertical}.row{display:flex;gap:10px;align-items:center}.row>*{flex:1}.row button,.row a{flex:0 auto}button,a.button{border:1px solid var(--line);background:#1b2744;color:var(--text);padding:10px 14px;border-radius:10px;font-weight:800;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}button:hover,a.button:hover{filter:brightness(1.12)}button.primary{background:var(--accent);color:#071120;border-color:var(--accent)}button.danger{background:#481425;color:#ffc5d1;border-color:#7e2440}.dangerCard{border-color:#7e2440}.split{height:1px;background:var(--line);margin:16px 0}.check{display:flex;gap:8px;align-items:center}.check input{width:auto}.pre{background:#07101e;border:1px solid var(--line);border-radius:12px;padding:12px;min-height:70px;max-height:330px;overflow:auto;color:#c9d7ff;font-size:12px}.statusbox{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.pill{background:#0b1222;border:1px solid var(--line);border-radius:12px;padding:10px}.pill b{display:block;font-size:20px}.pill span{color:var(--muted);font-size:12px}.tablewrap{overflow:auto;max-height:520px;border:1px solid var(--line);border-radius:12px}table{width:100%;border-collapse:collapse;font-size:13px}th,td{padding:9px 10px;border-bottom:1px solid var(--line);white-space:nowrap}th{position:sticky;top:0;background:#101832;text-align:left;color:#b8c6e8}tr:hover td{background:#151f37}.gain{color:var(--good);font-weight:900}.loss{color:var(--bad);font-weight:900}.links{display:grid;gap:10px}.links a{color:#9fd0ff;text-decoration:none;background:#0b1222;border:1px solid var(--line);border-radius:10px;padding:12px}.links code{color:#d9e6ff}@media(max-width:1000px){.side{position:static;width:auto}.main{margin-left:0}.grid.two{grid-template-columns:1fr}.top{display:block}.activebox{text-align:left;margin-top:12px}}

.inlineEdit{min-width:120px;padding:7px 8px;border-radius:8px;font-size:12px}.inlineEdit.small{min-width:70px;width:80px}.inlineEdit.tiny{min-width:60px;width:72px}.inlineEdit.model{min-width:190px}.mini{padding:6px 9px;border-radius:8px;font-size:12px}.saveStatus{font-size:12px;color:var(--muted);padding:8px 0}.saveStatus.good{color:var(--good)}.saveStatus.bad{color:var(--bad)}#competitorsTable td{vertical-align:middle}#competitorsTable select{min-width:150px}

#sessionsTable td:nth-child(7), #sessionsTable th:nth-child(7){white-space:normal;min-width:360px;max-width:900px;line-height:1.35}.wrapclasses{white-space:normal;overflow-wrap:anywhere}.statusbox small{display:block;color:var(--muted);margin-top:4px}.tablewrap table td{vertical-align:middle}

/* GUI overflow fix for API/racer previews and wide JSON blocks */
.main, .tab, .card, .grid, .grid > *, .row, .row > *, .statusbox, .statusbox > *, .tablewrap, .pre {
  min-width: 0;
}
.grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
#tab-graphics .grid.two {
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
  align-items: start;
}
#tab-graphics .card {
  overflow: hidden;
}
#tab-graphics .row input,
#tab-graphics .row select,
#tab-graphics .row textarea {
  min-width: 0;
}
#tab-graphics .pre,
#racerPreview,
#timingStatus,
#importResult,
#weatherBox,
#resetResult {
  width: 100%;
  max-width: 100%;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  overflow: auto;
}
#racerPreview {
  max-height: 260px;
}
#outputSessionBox {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  overflow-wrap: anywhere;
}
#apiLinks a,
.links a {
  display: block;
  max-width: 100%;
  overflow-wrap: anywhere;
}
#apiLinks code,
.links code {
  white-space: normal;
  overflow-wrap: anywhere;
}
@media(max-width:1200px){
  #tab-graphics .grid.two{grid-template-columns:1fr;}
}

/* Responsive racer card picker for /api/racer */
.racerPickControls{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:center;margin-bottom:10px}
.racerPickerToolbar{display:grid;grid-template-columns:minmax(180px,1fr) auto auto auto;gap:8px;align-items:center;margin:10px 0 12px}
.racerPickerToolbar button.activeToggle{background:var(--accent);color:#071120;border-color:var(--accent)}
.racerGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:10px;max-height:360px;overflow:auto;padding:2px 2px 8px}
.racerCard{position:relative;display:grid;grid-template-rows:auto auto auto auto;align-content:start;gap:3px;min-height:112px;width:100%;padding:10px;border:1px solid var(--line);border-radius:14px;background:#0b1222;color:var(--text);text-align:left;box-shadow:none;overflow:hidden}
.racerCard:hover{border-color:var(--accent);filter:none;background:#111d35}.racerCard.selected{border-color:var(--good);box-shadow:0 0 0 2px rgba(61,220,151,.18) inset}.racerPos{position:absolute;right:8px;top:6px;color:var(--muted);font-size:11px;font-weight:800}.racerBibNo{font-size:26px;line-height:1;font-weight:1000;color:#ffffff;letter-spacing:.02em}.racerLast{font-size:13px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.racerBike{font-size:11px;color:#b9c8ee;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.racerClass{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.emptyGrid{border:1px dashed var(--line);border-radius:12px;padding:16px}.racerPreviewBox{margin-top:10px;background:#07101e;border:1px solid var(--line);border-radius:12px;min-height:64px;padding:10px;overflow:hidden}.selectedRacerBox{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center}.selectedRacerBib{font-size:32px;font-weight:1000;background:#192642;border:1px solid var(--line);border-radius:14px;min-width:68px;text-align:center;padding:8px 10px}.selectedRacerInfo{min-width:0}.selectedRacerInfo b,.selectedRacerInfo span,.selectedRacerInfo small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.selectedRacerInfo span{color:#b9c8ee}.selectedRacerInfo small{color:var(--muted)}.selectedRacerStats{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.selectedRacerStats span{background:#101832;border:1px solid var(--line);border-radius:999px;padding:6px 9px;font-size:12px;color:var(--muted)}.selectedRacerStats b{color:var(--text)}
@media(max-width:780px){.racerPickControls,.racerPickerToolbar{grid-template-columns:1fr}.selectedRacerBox{grid-template-columns:1fr}.selectedRacerStats{justify-content:flex-start}.racerGrid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));max-height:420px}}
