.spt-tool{--spt-accent:var(--color-accent);--spt-accent-bright:var(--color-accent-bright);--spt-accent-bg:#ff7a001a;--spt-accent-bd:#ff7a004d;--spt-ok:#15803d;--spt-ok-bg:#15803d1a;--spt-ok-bd:#15803d47;--spt-warn:#b45309;--spt-warn-bg:#b453091a;--spt-warn-bd:#b4530947;--spt-err:#b91c1c;--spt-err-bg:#b91c1c1a;--spt-err-bd:#b91c1c47;--spt-hairline-soft:color-mix(in srgb, var(--color-hairline) 70%, transparent);overflow-x:clip}:root.dark .spt-tool{--spt-accent-bg:#ff7a0024;--spt-accent-bd:#ff7a0061;--spt-ok:#4ade80;--spt-ok-bg:#4ade801f;--spt-ok-bd:#4ade804d;--spt-warn:#fbbf24;--spt-warn-bg:#fbbf241f;--spt-warn-bd:#fbbf244d;--spt-err:#f87171;--spt-err-bg:#f871711f;--spt-err-bd:#f871714d}.spt-card{background-color:var(--color-canvas);border:1px solid var(--color-hairline);border-radius:.75rem;transition:border-color .2s,box-shadow .2s,transform .15s}.spt-card:hover{border-color:var(--spt-accent-bd)}.spt-tile{background-color:var(--color-canvas-soft);border:1px solid var(--color-hairline);border-radius:.625rem}:root.dark .spt-tool .spt-tile{background-color:var(--color-canvas-soft-2)}.spt-metric-card{border-left-width:2px;transition:border-color .2s,transform .2s}.spt-metric-card:hover{transform:translateY(-2px)}.spt-rail-accent{border-left-color:var(--spt-accent)}.spt-rail-ink{border-left-color:var(--color-hairline-strong)}.spt-rail-warn{border-left-color:var(--spt-warn)}.spt-rail-bright{border-left-color:var(--spt-accent-bright)}.spt-rail-ok{border-left-color:var(--spt-ok)}.spt-val-accent{color:var(--spt-accent)}.spt-val-bright{color:var(--spt-accent-bright)}.spt-val-warn{color:var(--spt-warn)}.spt-val-ok{color:var(--spt-ok)}.spt-val-ink{color:var(--color-ink)}.spt-val-mute{color:var(--color-mute)}.spt-canvas-container{aspect-ratio:16/9;border:1px solid var(--spt-accent-bd);background-color:#050505;border-radius:1.25rem;width:100%;min-height:320px;max-height:620px;transition:border-color .3s,box-shadow .3s;position:relative;overflow:hidden;box-shadow:inset 0 2px 16px #000000d9,0 16px 36px -10px #0009}.spt-canvas-container.is-running{border-color:#ff7a008c;box-shadow:inset 0 2px 16px #000000d9,0 0 25px #ff7a0033,0 16px 36px -10px #0009}@media (width<=640px){.spt-canvas-container{aspect-ratio:4/3;max-height:420px}}.spt-canvas-container:fullscreen{aspect-ratio:auto;border:none;border-radius:0;min-height:0;max-height:none}#spt-canvas{width:100%;height:100%;display:block}.spt-hud-chip{-webkit-backdrop-filter:blur(10px);color:#e5e5e5;background-color:#0a0a0ad1;border:1px solid #ffffff1f}.spt-viewport-overlay{-webkit-backdrop-filter:blur(2px);color:#f5f5f5;background:radial-gradient(120% 120% at 50% 40%,#0a0a0ab8,#030303eb)}.spt-btn-primary{background-color:var(--spt-accent);color:#0a0a0a;transition:transform .1s,box-shadow .15s,background-color .15s;box-shadow:0 8px 22px -8px #ff7a0099}.spt-btn-primary:hover{background-color:var(--spt-accent-bright);box-shadow:0 10px 26px -8px #ff7a00b3}.spt-btn-primary:active{transform:scale(.98)}.spt-btn-primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.spt-btn-secondary{background-color:var(--color-canvas);border:1px solid var(--color-hairline);color:var(--color-body);transition:border-color .15s,color .15s,background-color .15s}.spt-btn-secondary:hover{border-color:var(--spt-accent-bd);color:var(--color-ink)}.spt-btn-danger{background-color:var(--spt-err);color:#fff;transition:transform .1s,filter .15s;box-shadow:0 8px 22px -8px #dc26268c}.spt-btn-danger:hover{filter:brightness(1.08)}.spt-btn-danger:active{transform:scale(.98)}.spt-opt-btn{border:1px solid var(--color-hairline);background-color:var(--color-canvas);color:var(--color-body);user-select:none;transition:all .15s ease-in-out}.spt-opt-btn:hover{border-color:var(--spt-accent-bd);color:var(--color-ink)}.spt-opt-btn.chip-active{box-shadow:0 0 0 1px var(--spt-accent), 0 0 14px -2px #ff7a0059;border-color:var(--spt-accent)!important;background-color:var(--spt-accent-bg)!important;color:var(--color-ink)!important}.spt-config-locked{opacity:.6;pointer-events:none}.spt-progress-track{background-color:var(--color-canvas-soft-2);border-radius:9999px;height:6px;overflow:hidden}:root.dark .spt-tool .spt-progress-track{background-color:#ffffff14}.spt-progress-fill{background:linear-gradient(90deg,#ff7a00 0%,#ff8a1f 50%,#fbbf24 100%);border-radius:9999px;width:0%;height:100%;transition:width .15s linear}.spt-chart-surface{border:1px solid var(--color-hairline);background-color:#0a0a0a;border-radius:.625rem}:root.dark .spt-tool .spt-chart-surface{border-color:var(--color-hairline-strong)}.spt-graph-fps-path{filter:drop-shadow(0 0 4px #ff7a008c)}.spt-graph-ft-path{filter:drop-shadow(0 0 4px #fbbf2480)}.spt-badge{border:1px solid var(--color-hairline);background-color:var(--color-canvas-soft);color:var(--color-mute);border-radius:9999px;align-items:center;gap:.375rem;padding:.125rem .5rem;font-size:11px;font-weight:600;display:inline-flex}.spt-badge-ok{color:var(--spt-ok);background-color:var(--spt-ok-bg);border-color:var(--spt-ok-bd)}.spt-badge-warn{color:var(--spt-warn);background-color:var(--spt-warn-bg);border-color:var(--spt-warn-bd)}.spt-badge-err{color:var(--spt-err);background-color:var(--spt-err-bg);border-color:var(--spt-err-bd)}.spt-badge-accent{color:var(--spt-accent);background-color:var(--spt-accent-bg);border-color:var(--spt-accent-bd)}.spt-tooltip-trigger{cursor:help;justify-content:center;align-items:center;display:inline-flex;position:relative}.spt-tooltip-trigger .spt-tooltip-box{visibility:hidden;opacity:0;pointer-events:none;color:#e2e2e2;z-index:50;background-color:#1b1b1b;border:1px solid #ffffff26;border-radius:.5rem;width:220px;max-width:min(220px,100vw - 2rem);padding:.5rem .65rem;font-size:.6875rem;line-height:1.35;transition:opacity .15s,transform .15s,visibility .15s;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)translateY(4px);box-shadow:0 10px 25px -5px #000000b3}.spt-tooltip-trigger:hover .spt-tooltip-box,.spt-tooltip-trigger:focus-within .spt-tooltip-box{visibility:visible;opacity:1;transform:translate(-50%)translateY(0)}.spt-comp-table{border-collapse:collapse;width:100%}.spt-comp-table th,.spt-comp-table td{text-align:left;border-bottom:1px solid var(--color-hairline);padding:.625rem .75rem}.spt-comp-table thead th{text-transform:uppercase;letter-spacing:.05em;color:var(--color-mute);font-size:.6875rem;font-weight:600}.spt-comp-table tbody tr{transition:background-color .15s}.spt-comp-table tbody tr:hover{background-color:var(--color-canvas-soft)}.spt-comp-table tbody tr.is-active-tier{background-color:var(--spt-accent-bg)}.spt-faq-item{transition:border-color .2s,background-color .2s}.spt-faq-item[data-open=true]{border-color:var(--spt-accent-bd);background-color:var(--spt-accent-bg)}.spt-faq-trigger{text-align:left;justify-content:space-between;align-items:center;gap:1rem;width:100%;display:flex}.spt-faq-icon{flex-shrink:0;transition:transform .25s}.spt-faq-item[data-open=true] .spt-faq-icon{transform:rotate(180deg)}.spt-faq-content{display:none}.spt-faq-item[data-open=true] .spt-faq-content{display:block}.spt-faq-inner{overflow:hidden}.spt-scroll::-webkit-scrollbar{width:6px;height:6px}.spt-scroll::-webkit-scrollbar-track{background:0 0}.spt-scroll::-webkit-scrollbar-thumb{background:var(--color-hairline-strong);border-radius:3px}.spt-scroll::-webkit-scrollbar-thumb:hover{background:var(--spt-accent-bd)}.spt-tool button:focus-visible,.spt-tool a:focus-visible,.spt-tool [tabindex]:focus-visible{outline:2px solid var(--spt-accent);outline-offset:2px;border-radius:.25rem}@media (prefers-reduced-motion:reduce){.spt-tool .animate-pulse,.spt-tool .animate-ping,.spt-tool .animate-spin{animation:none!important}}
