:root{--bg-1: #0f1824;--bg-2: #edf3fb;--ink-1: #1f1b17;--ink-2: #5b5147;--accent: #ff6b4a;--panel: rgba(255, 255, 255, .84);--panel-border: rgba(31, 27, 23, .12);--shadow: 0 18px 40px rgba(31, 27, 23, .18);--radius-lg: 20px;--radius-md: 12px}*{box-sizing:border-box}html,body{margin:0;padding:0}body{min-height:100vh;font-family:Space Grotesk,"M PLUS 1p",sans-serif;color:var(--ink-1);background:radial-gradient(circle at 12% 12%,rgba(225,238,255,.9),transparent 45%),radial-gradient(circle at 82% 0%,rgba(199,221,248,.9),transparent 45%),linear-gradient(135deg,var(--bg-1),var(--bg-2))}#app{position:relative;min-height:100vh;padding:32px}#stage{position:relative;display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 64px);border-radius:var(--radius-lg)}#canvas-wrap{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}#canvas-wrap canvas{display:block;border-radius:var(--radius-lg);background:#fff;box-shadow:var(--shadow);max-width:100%;max-height:100%;height:auto;width:auto}#empty-state{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:24px;color:var(--ink-2);pointer-events:none;opacity:0;transition:opacity .4s ease}#empty-state.is-visible{opacity:1}.empty-title{font-size:clamp(24px,3vw,32px);font-weight:700;letter-spacing:.02em}.empty-sub{margin-top:8px;font-size:14px;max-width:360px}#ui{position:fixed;top:16px;right:16px;width:min(340px,88vw);max-height:calc(100vh - 32px);overflow:auto;padding:16px;border-radius:var(--radius-lg);background:var(--panel);border:1px solid var(--panel-border);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:10;--tp-base-background-color: rgba(255, 255, 255, .78);--tp-base-shadow-color: rgba(0, 0, 0, .1);--tp-button-background-color: #1f1b17;--tp-button-foreground-color: #f6f1e6;--tp-container-background-color: rgba(255, 255, 255, .65);--tp-accent-color: #ff6b4a;--tp-accent-foreground-color: #1f1b17;--tp-label-foreground-color: #3c342b;--tp-input-background-color: rgba(255, 255, 255, .9);--tp-input-foreground-color: #1f1b17}#ui.is-collapsed{padding-bottom:8px}#ui.is-collapsed .ui-block{display:none}#ui .tp-btn,#ui .tp-btn:hover{color:#f6f1e6}.ui-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.ui-title{font-weight:700;font-size:18px}#togglePanel{border:none;background:#1f1b1714;color:var(--ink-1);font-size:11px;text-transform:uppercase;letter-spacing:.12em;padding:6px 10px;border-radius:999px;cursor:pointer}#togglePanel:hover{background:#1f1b1729}.ui-block{margin-bottom:14px;display:grid;gap:8px}.ui-label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2)}#sampleSelect,#fileInput,#refreshSamples{font-family:inherit}#sampleSelect{width:100%;padding:8px 10px;border-radius:var(--radius-md);border:1px solid rgba(31,27,23,.2);background:#ffffffd9}.drop-zone{position:relative;display:grid;place-items:center;padding:16px;border-radius:var(--radius-md);border:1px dashed rgba(31,27,23,.35);background:#ffffffbf;color:var(--ink-2);cursor:pointer;min-height:88px;text-align:center}.drop-zone-text{font-size:12px;text-transform:uppercase;letter-spacing:.08em;width:100%;overflow-wrap:anywhere;word-break:break-word}.drop-zone.is-dragover{border-color:var(--accent);color:var(--ink-1);background:#ffffffeb}.drop-zone.is-disabled{opacity:.6;cursor:not-allowed}.drop-zone #fileInput{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}.drop-zone.is-disabled #fileInput{pointer-events:none}#refreshSamples{padding:8px 12px;border-radius:var(--radius-md);border:none;background:var(--ink-1);color:#f6f1e6;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}#refreshSamples:focus,#refreshSamples:active{color:#f6f1e6}#refreshSamples:hover{transform:translateY(-1px);box-shadow:0 6px 14px #1f1b1733}.ui-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.ui-actions button{padding:10px 12px;border-radius:var(--radius-md);border:none;background:var(--ink-1);color:#f6f1e6;cursor:pointer;text-transform:uppercase;letter-spacing:.08em;font-size:12px;transition:transform .2s ease,box-shadow .2s ease}.ui-actions button:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.ui-actions button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 14px #1f1b1733}.ui-actions #stopButton{background:#1f1b171f;color:var(--ink-1);border:1px solid rgba(31,27,23,.2)}.ui-note{font-size:11px;color:var(--ink-2);line-height:1.4}#pane{display:grid;gap:10px}.ui-status-tab{border:1px solid rgba(31,27,23,.12);border-radius:var(--radius-md);background:#ffffffb3;overflow:hidden}.ui-status-tab summary{list-style:none;padding:10px 12px;cursor:pointer;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2);display:flex;align-items:center;justify-content:space-between}.ui-status-tab summary::-webkit-details-marker{display:none}.ui-status-tab summary:after{content:"Show";font-size:11px;letter-spacing:.12em;color:var(--ink-1);background:#1f1b1714;padding:4px 8px;border-radius:999px}.ui-status-tab[open] summary:after{content:"Hide"}.ui-status{border-top:1px solid rgba(31,27,23,.12);padding:10px 12px}.ui-status-row{display:grid;grid-template-columns:72px minmax(0,1fr);gap:8px;align-items:baseline;font-size:12px;color:var(--ink-2)}.ui-status-row+.ui-status-row{margin-top:6px}#statusValue{color:var(--ink-1);font-weight:600}#statusValue.is-success{color:#1e6d4a}#statusValue.is-error{color:#b13a2a}.ui-shortcuts{margin-top:8px;font-size:11px;color:#1f1b1780;letter-spacing:.06em}#socialButtons{position:fixed;left:20px;bottom:20px;display:flex;gap:10px;z-index:9}#socialButtons a{padding:10px 16px;border-radius:999px;background:#ffffffc7;color:var(--ink-1);text-decoration:none;font-size:12px;text-transform:uppercase;letter-spacing:.12em;border:1px solid rgba(31,27,23,.16);box-shadow:0 10px 24px #1f1b172e;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:transform .2s ease,box-shadow .2s ease}#socialButtons a:hover{transform:translateY(-1px);box-shadow:0 12px 28px #1f1b1738}#pane .detect-classes .tp-fldv_c{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;row-gap:6px}#pane .detect-classes .tp-lblv{margin:0}#pane .detect-classes .tp-lblv_l{font-size:12px;line-height:1.2;min-width:90px}#pane .detect-classes .tp-lblv_v{justify-content:flex-end}#pane .detect-classes-actions{grid-column:1 / -1}#pane .detect-classes-actions .tp-fldv_c{display:flex;gap:8px}#pane .detect-classes-actions .tp-btnv{flex:1 1 0}#pane .detect-classes-actions .tp-btnv_b{padding-inline:12px;min-width:110px}#pane .tp-rotv_c{max-height:calc((100vh - 140px)/2);overflow:auto;padding-right:4px}@media(max-width:720px){#app{padding:18px}#stage{min-height:calc(100vh - 36px)}#ui{right:8px;left:8px;width:auto}#socialButtons{left:12px;bottom:12px}}