#objtrain-panel {
  position: fixed; top: 56px; bottom: 0; left: 220px; right: 0;
  background: #101e18; z-index: 1050;
  display: none; flex-direction: column; font-family: inherit; overflow: hidden;
}
#objtrain-panel.open { display: flex; }
body.sb-icon-only #objtrain-panel { left: 68px; }
#objtrain-panel .ot-body { flex: 1; overflow-y: auto; padding: 28px 36px; display: grid; grid-template-columns: 380px 1fr; gap: 24px; align-content: start; }
@media (max-width: 900px) { #objtrain-panel .ot-body { grid-template-columns: 1fr; } }
#objtrain-panel .ot-header { display: flex; align-items: center; justify-content: space-between; padding: 18px 32px 14px; border-bottom: 1px solid #22382f; flex-shrink: 0; background: #101e18; }
#objtrain-panel .ot-title { font-size: 1.05rem; font-weight: 700; color: #d3e5dc; letter-spacing: .02em; }
#objtrain-panel .ot-close { background: rgba(220,50,50,.16); border: 1px solid rgba(220,50,50,.38); border-radius: 8px; color: #f87171; cursor: pointer; font-size: .8rem; font-weight: 600; padding: 7px 20px; white-space: nowrap; transition: background .15s, border-color .15s; }
#objtrain-panel .ot-close:hover { background: rgba(220,50,50,.32); border-color: rgba(220,50,50,.60); }
.ot-card { background: #22382f; border: 1px solid #4ebb81; border-radius: 8px; padding: 14px; }
.ot-card-title { font-size: .78rem; font-weight: 700; color: #88c0a2; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 10px; }
.ot-field { margin-bottom: 10px; }
.ot-field label { display:block; font-size:.75rem; color:#a0c0af; margin-bottom:4px; }
.ot-field input[type=text], .ot-field input[type=file] { width: 100%; box-sizing: border-box; background: #12221b; border: 1px solid #55b481; border-radius: 6px; color: #d3e5dc; font-size: .82rem; padding: 7px 10px; outline: none; }
.ot-field input[type=text]:focus { border-color: #64e6a1; }
.ot-field input[type=file] { padding: 5px 8px; cursor: pointer; }
.ot-tabs { display: flex; gap: 6px; margin-bottom: 2px; border-bottom: 1px solid #2a4439; padding-bottom: 8px; }
.ot-tab { flex: 1; padding: 6px 0; border: 1px solid #55b481; border-radius: 6px; background: #12221b; color: #66a383; font-size: .76rem; font-weight: 600; cursor: pointer; transition: all .18s; }
.ot-tab:hover  { border-color: #4ac081; color: #d3e5dc; }
.ot-tab-active { background: #304e42; border-color: #49e190; color: #c4dbd0; }
.ot-ann-header { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:10px; gap:10px; }
.ot-ann-progress-text { font-size:.9rem; font-weight:700; color:#d3e5dc; }
.ot-ann-filename { font-size:.68rem; color:#68a183; margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:220px; }
.ot-ann-dots { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:12px; min-height:15px; }
.ot-dot { width:10px; height:10px; border-radius:50%; background:#2a4439; border:1px solid #55b481; cursor:pointer; transition:background .15s, transform .1s; flex-shrink:0; }
.ot-dot:hover { transform:scale(1.4); }
.ot-dot-active { background:#64e6a1; border-color:#8decb9; transform:scale(1.4); }
.ot-dot-done   { background:#4ade80; border-color:#2a8a50; }
.ot-dot-skip   { background:#f59e0b; border-color:#a06010; }
.ot-ann-stage { display:flex; flex-direction:column; align-items:center; }
.ot-ann-hint { font-size:.73rem; color:#8decb9; margin-bottom:8px; background:#12211a; border:1px solid #2a4439; border-radius:6px; padding:5px 12px; }
.ot-ann-img-wrap { position:relative; display:inline-block; border:2px solid #55b481; border-radius:8px; overflow:hidden; max-width:100%; }
.ot-ann-img-wrap img { display:block; max-width:100%; }
.ot-ann-img-wrap canvas { position:absolute; top:0; left:0; cursor:crosshair; }
.ot-ann-nav { display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; justify-content:flex-end; }
.ot-ann-btn { padding:7px 16px; border:none; border-radius:7px; font-size:.8rem; font-weight:600; cursor:pointer; transition:opacity .2s; white-space:nowrap; }
.ot-ann-btn:disabled { opacity:.4; cursor:not-allowed; }
.ot-ann-btn-sec   { background:#22382f; color:#88c0a2; border:1px solid #4ebb81; }
.ot-ann-btn-sec:hover:not(:disabled) { background:#4ebb81; color:#d3e5dc; }
.ot-ann-btn-pri   { background:linear-gradient(135deg,#49e190,#49e1c8); color:#fff; border:none; }
.ot-ann-btn-pri:hover:not(:disabled) { opacity:.85; }
.ot-ann-btn-green { background:linear-gradient(135deg,#16a34a,#22c55e); color:#fff; border:none; }
.ot-ann-btn-green:hover:not(:disabled) { opacity:.85; }
.ot-review-header { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:14px; gap:10px; flex-wrap:wrap; }
.ot-review-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(180px,1fr)); gap:10px; }
.ot-thumb-card { background:#12221b; border:1px solid #4ebb81; border-radius:10px; overflow:hidden; display:flex; flex-direction:column; }
.ot-thumb-unannotated { border-color:#4a2a1a; }
.ot-thumb-canvas-wrap { position:relative; background:#0d1713; flex-shrink:0; }
.ot-thumb-img { width:100%; display:block; object-fit:contain; max-height:140px; }
.ot-thumb-canvas { position:absolute; top:0; left:0; width:100%; height:100%; pointer-events:none; }
.ot-thumb-badge { font-size:.64rem; font-weight:700; padding:3px 8px; display:block; }
.ot-thumb-badge-done { background:#0e2e1a; color:#4ade80; }
.ot-thumb-badge-skip { background:#2e1a0a; color:#f59e0b; }
.ot-thumb-name { font-size:.64rem; color:#64a582; padding:3px 8px 5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ot-thumb-actions { display:flex; gap:5px; padding:5px 7px 8px; margin-top:auto; }
.ot-thumb-btn { flex:1; padding:5px 0; border:none; border-radius:5px; font-size:.68rem; font-weight:600; cursor:pointer; transition:background .15s; }
.ot-thumb-btn-edit { background:#284237; color:#8decb9; }
.ot-thumb-btn-edit:hover { background:#4ebb81; }
.ot-thumb-btn-del { background:#2e1010; color:#f87171; }
.ot-thumb-btn-del:hover { background:#3e1818; }
.ot-submit-btn { width: 100%; padding: 9px; border: none; border-radius: 7px; cursor: pointer; font-size: .84rem; font-weight: 700; color: #fff; background: linear-gradient(135deg,#49e190,#49e1c8); transition: opacity .2s; }
.ot-submit-btn:hover { opacity: .88; }
.ot-submit-btn:disabled { opacity: .45; cursor: not-allowed; }
.ot-jobs-list { display: flex; flex-direction: column; gap: 10px; }
.ot-job-del { background: none; border: 1px solid #3a1a1a; color: #e05555; cursor: pointer; font-size: .7rem; font-weight:600; padding: 3px 8px; border-radius: 5px; flex-shrink: 0; transition: background .15s; }
.ot-job-del:hover { background: #2a1010; border-color:#e05555; }
.ot-job-retry { background: none; border: 1px solid #3acf80; color: #8decb9; cursor: pointer; font-size: .7rem; font-weight:600; padding: 3px 8px; border-radius: 5px; flex-shrink: 0; transition: background .15s; }
.ot-job-retry:hover { background: #1e3029; border-color:#8decb9; }
#ot-alert-modal { display: none; position: fixed; inset: 0; z-index: 99999; background: rgba(0,0,0,.55); backdrop-filter: blur(4px); align-items: center; justify-content: center; }
#ot-alert-modal.open { display: flex; }
.ot-alert-box { position: relative; background: #fff; border-radius: 16px; padding: 36px 32px 28px; max-width: 400px; width: 92%; box-shadow: 0 20px 60px rgba(0,0,0,.35); display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; animation: otAlertIn .22s ease; }
@keyframes otAlertIn { from { transform: scale(.88); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.ot-alert-close { position: absolute; top: 12px; right: 14px; background: none; border: none; font-size: 1.3rem; color: #aaa; cursor: pointer; line-height: 1; padding: 2px 6px; border-radius: 6px; transition: background .15s, color .15s; }
.ot-alert-close:hover { background: #f0f0f0; color: #333; }
.ot-alert-icon-wrap { width: 72px; height: 72px; border-radius: 50%; border: 3px solid #f0a500; display: flex; align-items: center; justify-content: center; margin-bottom: 4px; }
.ot-alert-icon-wrap span { font-size: 2.2rem; color: #f0a500; font-weight: 900; line-height: 1; }
.ot-alert-title { font-size: 1.25rem; font-weight: 700; color: #1b2d25; margin: 0; }
.ot-alert-msg { font-size: .88rem; color: #666; line-height: 1.55; margin: 0; }
.ot-alert-actions { display: flex; gap: 12px; width: 100%; margin-top: 10px; }
.ot-alert-btn-confirm { flex: 1; padding: 11px; border: none; border-radius: 8px; background: #33d77f; color: #fff; font-size: .9rem; font-weight: 700; cursor: pointer; transition: background .18s; }
.ot-alert-btn-confirm:hover { background: #2cdd7f; }
.ot-alert-btn-confirm.danger { background: #e53935; }
.ot-alert-btn-confirm.danger:hover { background: #b71c1c; }
.ot-alert-btn-cancel { flex: 1; padding: 11px; border: 1px solid #d0d0d0; border-radius: 8px; background: #fff; color: #555; font-size: .9rem; font-weight: 600; cursor: pointer; transition: background .18s; }
.ot-alert-btn-cancel:hover { background: #f5f5f5; }
.ot-progress-wrap { height: 4px; background: #2a4439; border-radius: 2px; overflow: hidden; margin-top: 3px; }
.ot-progress-bar { height: 100%; background: linear-gradient(90deg,#49e190,#49e1c8); border-radius: 2px; transition: width .5s ease; }
@keyframes ot-pulse { 0%,100%{opacity:1} 50%{opacity:.3} }
.ot-pulse-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #71e8a9; margin-right: 5px; vertical-align: middle; animation: ot-pulse 1.2s ease-in-out infinite; }
.ot-terminal-wrap { background: #0b1511; border: 1px solid #22382f; border-radius: 8px; overflow: hidden; margin-top: 6px; }
.ot-terminal-bar { background: #152820; padding: 5px 10px; display: flex; align-items: center; gap: 6px; border-bottom: 1px solid #22382f; }
.ot-terminal-dot { width: 9px; height: 9px; border-radius: 50%; }
.ot-terminal-title { font-size: .68rem; color: #64a582; margin-left: 4px; flex: 1; font-family: monospace; }
.ot-terminal-clear { background: none; border: none; color: #5eab82; font-size: .65rem; cursor: pointer; padding: 0 4px; }
.ot-terminal-clear:hover { color: #7ac09b; }
#ot-terminal { padding: 8px 10px; height: 220px; overflow-y: auto; font-family: 'Consolas', 'Courier New', monospace; font-size: .69rem; line-height: 1.6; background: #0b1511; color: #7ac09b; }
#ot-terminal .tl-info    { color: #8decb9; }
#ot-terminal .tl-warning { color: #f59e0b; }
#ot-terminal .tl-error   { color: #f87171; }
#ot-terminal .tl-debug   { color: #5eab82; }
#ot-terminal .tl-time    { color: #55b481; margin-right: 4px; }
#ot-terminal .tl-stage   { color: #b3d2c2; font-weight: 600; }
#ot-log { background: #0f1b16; border: 1px solid #2a4439; border-radius: 6px; padding: 8px 10px; font-size: .7rem; color: #6ac092; max-height: 90px; overflow-y: auto; line-height: 1.5; white-space: pre-wrap; word-break: break-all; }
.ot-job-row { background: #12221b; border: 1px solid #4ebb81; border-radius: 10px; padding: 14px 14px 12px; display: flex; flex-direction: column; gap: 0; transition: border-color .2s; }
.ot-job-complete { border-color: #1a4a2a; }
.ot-job-failed   { border-color: #4a1a1a; }
.ot-job-top { display:flex; align-items:center; gap: 12px; }
.ot-job-icon { width: 36px; height: 36px; border-radius: 8px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size: 1rem; font-weight: 700; }
.ot-job-info { flex: 1; min-width: 0; }
.ot-job-name { font-size: .9rem; font-weight: 700; color: #d3e5dc; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ot-job-date { font-size: .68rem; color: #68a183; margin-top: 2px; }
.ot-ready-badge  { display: inline-block; padding: 4px 10px; border-radius: 20px; font-size: .72rem; font-weight: 700; background: #0e2e1a; color: #4ade80; border: 1px solid #1a5a30; }
.ot-failed-badge { display: inline-block; padding: 4px 10px; border-radius: 20px; font-size: .72rem; font-weight: 700; background: #2e0e0e; color: #f87171; border: 1px solid #5a1a1a; }
.ot-active-badge { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 20px; font-size: .72rem; font-weight: 700; background: #304e42; color: #8decb9; border: 1px solid #47c380; }
.ot-progress-wrap { position: relative; height: 6px; background: #2a4439; border-radius: 3px; overflow: visible; }
.ot-progress-bar  { height: 100%; background: linear-gradient(90deg,#49e190,#49e1c8); border-radius: 3px; transition: width .5s ease; }
.ot-progress-complete { background: linear-gradient(90deg,#16a34a,#4ade80); }
.ot-progress-label { position: absolute; right: 0; top: -16px; font-size: .65rem; color: #8decb9; font-weight: 600; }
.ot-job-accuracy { display: flex; align-items: center; justify-content: space-between; background: #0a1e10; border: 1px solid #1a4a2a; border-radius: 8px; padding: 8px 12px; margin-top: 10px; }
.ot-accuracy-label { font-size: .72rem; color: #4ade80; font-weight: 600; }
.ot-accuracy-val   { font-size: 1.1rem; font-weight: 800; color: #4ade80; }
.ot-job-meta { font-size: .68rem; color: #68a183; margin-top: 8px; }

/* Fullscreen annotation modal */
#ot-fullscreen-modal { display: none; position: fixed; inset: 0; z-index: 9999; background: #0d1914; flex-direction: column; }
#ot-fullscreen-modal.open { display: flex; }
.otfs-header { display: flex; align-items: center; gap: 12px; padding: 9px 16px; background: #12211a; border-bottom: 1px solid #22382f; flex-shrink: 0; }
.otfs-obj-label { font-size: .72rem; color: #68a183; }
.otfs-obj-name-display { font-size: .82rem; font-weight: 700; color: #c4dbd0; background: #22382f; border: 1px solid #4ebb81; border-radius: 6px; padding: 3px 10px; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.otfs-counter { font-size: .82rem; color: #68a183; }
.otfs-shortcuts { margin-left: auto; font-size: .64rem; color: #5eab82; white-space: nowrap; }
.otfs-close-btn { background: none; border: 1px solid #3a1a1a; color: #e05555; font-size: .75rem; font-weight: 600; padding: 4px 12px; border-radius: 6px; cursor: pointer; margin-left: 8px; white-space: nowrap; }
.otfs-close-btn:hover { background: #2a1010; }
.otfs-body { flex: 1; display: flex; overflow: hidden; min-height: 0; }
.otfs-sidebar-left { width: 196px; flex-shrink: 0; overflow-y: auto; background: #12211a; border-right: 1px solid #22382f; padding: 10px 8px; }
.otfs-sidebar-title { font-size: .63rem; font-weight: 700; color: #5eab82; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 8px; padding: 0 4px; }
.otfs-thumb-item { display: flex; align-items: center; gap: 7px; padding: 6px 8px; border-radius: 7px; cursor: pointer; font-size: .71rem; color: #68a183; margin-bottom: 3px; border: 1px solid transparent; transition: background .12s; }
.otfs-thumb-item:hover { background: #1b2b24; }
.otfs-thumb-item.active { background: #263e34; border-color: #49e190; color: #c4dbd0; }
.otfs-thumb-item.done   { color: #4ade80; }
.otfs-thumb-dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; background: #2a4439; }
.otfs-thumb-item.done   .otfs-thumb-dot { background: #4ade80; }
.otfs-thumb-item.active .otfs-thumb-dot { background: #64e6a1; }
.otfs-thumb-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.otfs-center { flex: 1; display: flex; align-items: center; justify-content: center; background: #0d1914; overflow: hidden; position: relative; padding: 12px; }
.otfs-canvas-wrap { position: relative; display: inline-block; border: 2px solid #55b481; border-radius: 8px; overflow: hidden; line-height: 0; }
.otfs-canvas-wrap img { display: block; max-width: 100%; max-height: 100%; }
.otfs-canvas-wrap canvas { position: absolute; top: 0; left: 0; cursor: crosshair; }
.otfs-hint { position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%); background: rgba(18,33,26,.88); border: 1px solid #2a4439; color: #8decb9; font-size: .71rem; padding: 4px 14px; border-radius: 20px; white-space: nowrap; pointer-events: none; }
.otfs-sidebar-right { width: 196px; flex-shrink: 0; overflow-y: auto; background: #12211a; border-left: 1px solid #22382f; padding: 14px 12px; display: flex; flex-direction: column; gap: 14px; }
.otfs-section-label { font-size: .63rem; font-weight: 700; color: #5eab82; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 5px; }
.otfs-class-input { width: 100%; box-sizing: border-box; background: #12221b; border: 1px solid #55b481; border-radius: 6px; color: #d3e5dc; font-size: .78rem; padding: 6px 8px; outline: none; }
.otfs-class-input:focus { border-color: #64e6a1; }
.otfs-class-hint { font-size: .6rem; color: #5eab82; margin-top: 3px; }
.otfs-coords { font-family: monospace; font-size: .67rem; color: #5a8a60; background: #0a1a10; border: 1px solid #1a3020; border-radius: 5px; padding: 7px 8px; min-height: 46px; word-break: break-all; }
.otfs-clear-btn { width: 100%; padding: 7px; border: 1px solid #3a1a1a; background: #1a0808; color: #f87171; font-size: .75rem; font-weight: 600; border-radius: 6px; cursor: pointer; }
.otfs-clear-btn:hover { background: #2a1010; }
.otfs-save-status { font-size: .63rem; color: #2a6a38; text-align: center; min-height: 14px; }
.otfs-footer { display: flex; align-items: center; gap: 8px; justify-content: flex-end; padding: 9px 16px; background: #12211a; border-top: 1px solid #22382f; flex-shrink: 0; }
.otfs-btn { border-radius: 7px; font-size: .78rem; font-weight: 600; padding: 7px 14px; cursor: pointer; border: 1px solid transparent; white-space: nowrap; }
.otfs-btn-sec   { background: #22382f; border-color: #55b481; color: #7abf9a; }
.otfs-btn-sec:hover { background: #284036; }
.otfs-btn-pri   { background: #3ecb80; border-color: #49e190; color: #c4dbd0; }
.otfs-btn-pri:hover { background: #3ecc80; }
.otfs-btn-green { background: #0f3320; border-color: #2a7040; color: #4ade80; }
.otfs-btn-green:hover { background: #143a26; }
