:root{color-scheme:dark;--bg:#080b10;--panel:#10151d;--line:#263142;--muted:#8995a7;--cyan:#41e8d3;--yellow:#ffc857;--purple:#b89cff;--orange:#ff9966;--blue:#73a7ff}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 10% -10%,#17323a,transparent 35%),var(--bg);color:#f5f7fb;font-family:Inter,"Hiragino Sans","Yu Gothic",sans-serif}h1,h2,p{margin:0}
header{display:flex;justify-content:space-between;gap:24px;padding:22px 28px 18px;border-bottom:1px solid var(--line)}h1{font-size:clamp(28px,4vw,48px);letter-spacing:-.04em}.eyebrow,.card-header p{color:var(--cyan);font-size:11px;letter-spacing:.18em;font-weight:800}.lead{color:var(--muted);margin-top:7px;font-size:13px}
.controls{display:flex;align-items:end;justify-content:flex-end;gap:9px;flex-wrap:wrap}.lang-switch{display:flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;align-self:center}.lang-btn{min-height:32px;min-width:38px;padding:0 8px;border:0;border-radius:0;font-size:11px;font-weight:800;letter-spacing:.06em;background:#151c26;color:var(--muted);cursor:pointer}.lang-btn.active{background:var(--cyan);color:#06110f}.lang-btn+.lang-btn{border-left:1px solid var(--line)}label{color:var(--muted);font-size:11px;display:grid;gap:5px}select,button{min-height:38px;border:1px solid var(--line);border-radius:8px;color:#fff;background:#151c26;padding:0 12px}button{cursor:pointer;background:var(--cyan);color:#06110f;font-weight:800;border-color:transparent}button.secondary,.mode-tab{color:#fff;background:#151c26;border-color:var(--line)}button:disabled{opacity:.5;cursor:wait}
.mode-tabs{display:flex;gap:7px;padding:12px 28px 0}.mode-tab.active{background:#edfdfb;color:#07110f}.mode-tab[data-mode="licenses"]{border-color:transparent;color:var(--muted);font-weight:400;font-size:12px;letter-spacing:.02em}.mode-tab[data-mode="licenses"].active{background:#1a1f28;color:#ccc;border-color:var(--line)}.mode-panel{display:none}.mode-panel.active{display:block}main{padding:12px 28px 30px}.system-strip{min-height:38px;display:flex;gap:20px;align-items:center;color:var(--muted);font-size:12px;margin-bottom:10px}.status{color:#ffd1d1;border:1px solid #753f48;padding:5px 9px;border-radius:100px}.status.ok{color:var(--cyan);border-color:#236d64}
.mode-help{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:12px}.mode-help h2{font-size:18px}.mode-help p{color:var(--muted);font-size:12px;margin-top:4px}.toggles{display:flex;gap:8px;flex-wrap:wrap}.toggle{display:flex;align-items:center;gap:5px;padding:7px 9px;border:1px solid var(--line);border-radius:7px;font-size:11px;color:var(--muted)}.toggle input{accent-color:var(--cyan)}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.model-card{--accent:var(--cyan);background:linear-gradient(180deg,#121923,#0d1219);border:1px solid var(--line);border-radius:12px;overflow:hidden}.model-card[data-model="yolo"]{--accent:var(--yellow)}.model-card[data-model="yoloxrtmposeS"]{--accent:#c891ff}.model-card[data-model="movenet"]{--accent:var(--blue)}.model-card[data-model="rtmo"]{--accent:var(--orange)}.model-card[data-model="segmenter"]{--accent:var(--purple)}.model-card[data-model="modnet"]{--accent:#66ccaa}.model-card[data-model="pphumseg"]{--accent:var(--orange)}.model-card.hidden{display:none}.model-card.disabled{opacity:.42}
.card-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px}.pose-card .card-header,.silhouette-card .card-header{cursor:grab;touch-action:none;user-select:none}.pose-card.dragging,.silhouette-card.dragging{opacity:.55}.pose-card.drop-target,.silhouette-card.drop-target{outline:2px solid var(--accent);outline-offset:-2px}.card-tools{display:flex;align-items:center;gap:5px}.sort-btn{min-width:24px;min-height:24px;padding:0;border-radius:6px;background:#19212c;color:var(--muted);border-color:var(--line);font-size:13px;line-height:1}.sort-btn:hover{color:#fff;border-color:var(--accent)}.card-header p{color:var(--accent)}.card-header h2{font-size:16px;margin-top:2px}.model-state{font-size:10px;color:var(--muted)}.model-state.ok{color:var(--accent)}.model-state.error{color:#ff8b98}.viewport{position:relative;background:#030507;aspect-ratio:16/9;overflow:hidden}canvas{display:block;width:100%;height:100%}.metrics{display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid var(--line)}.metrics div{padding:8px 9px;border-right:1px solid var(--line)}.metrics div:last-child{border:0}.metrics span{color:var(--muted);font-size:9px;display:block}.metrics strong{font:700 12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace}
.solo-host{max-width:1100px;margin:auto}.solo-host .model-card .card-header h2{font-size:20px}.benchmark-layout{display:grid;grid-template-columns:minmax(300px,1fr) minmax(500px,1.5fr);gap:14px}.benchmark-preview{position:relative;background:#030507;border:1px solid var(--line);border-radius:12px;overflow:hidden;aspect-ratio:16/9}.benchmark-preview canvas{height:100%}#benchmarkProgress{position:absolute;left:12px;bottom:12px;background:#05080bcc;padding:7px 10px;border-radius:6px;font-size:11px}table{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--line);font-size:12px}th,td{text-align:right;padding:11px;border-bottom:1px solid var(--line)}th:first-child,td:first-child{text-align:left}th{color:var(--muted)}#camera{position:fixed;width:2px;height:2px;opacity:.01;pointer-events:none}
.licenses-table{max-width:720px}.licenses-table a{color:var(--cyan);text-decoration:none}.licenses-table a:hover{text-decoration:underline}
@media(max-width:1000px){header{display:block}.controls{justify-content:flex-start;margin-top:16px}.grid,.benchmark-layout{grid-template-columns:1fr}.metrics{grid-template-columns:repeat(3,1fr)}.metrics div:nth-child(3){border-right:0}.mode-help{align-items:start;flex-direction:column}}@media(max-width:600px){header,main{padding-left:12px;padding-right:12px}.mode-tabs{padding-left:12px;overflow:auto}.grid{grid-template-columns:1fr}.mode-tab{white-space:nowrap}}