#security-playground.sp-root{--sp-bg: rgba(10, 6, 22, .72);--sp-surface: rgba(15, 10, 30, .6);--sp-border: rgba(255,255,255,.08);--sp-border-strong: rgba(147, 51, 234, .42);--sp-text: #f1f5ff;--sp-text-dim: rgba(255,255,255,.68);--sp-muted: rgba(255,255,255,.42);--sp-mono: "JetBrains Mono", "Fira Code", ui-monospace, SFMono-Regular, Menlo, monospace;--sp-accent: #c084fc;--sp-accent-strong: #9333EA;--sp-accent-cyan: #06B6D4;--sp-ok: #34d399;--sp-warn: #fbbf24;--sp-bad: #f87171;display:block;color:var(--sp-text);font-family:DM Sans,Inter Tight,ui-sans-serif,system-ui,sans-serif;background:var(--sp-bg);border:1px solid var(--sp-border);border-radius:22px;padding:clamp(1.1rem,2.2vw,2rem);box-shadow:0 32px 80px -30px #000000b3,0 0 0 1px #9333ea0f;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);max-width:1040px;margin:0 auto;-webkit-font-smoothing:antialiased}#security-playground .sp-header{margin-bottom:1.25rem}#security-playground .sp-title-row{display:flex;align-items:center;flex-wrap:wrap;gap:.75rem}#security-playground .sp-badge{display:inline-flex;align-items:center;padding:.35rem .85rem;font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--sp-accent);background:#9333ea1f;border:1px solid rgba(147,51,234,.28);border-radius:999px}#security-playground .sp-title{margin:0;font-size:clamp(1.35rem,1.8vw + .7rem,1.85rem);font-weight:700;color:#fff;letter-spacing:-.02em;line-height:1.2}#security-playground .sp-sub{margin:.7rem 0 0;font-size:.98rem;line-height:1.65;color:var(--sp-text-dim)}#security-playground .sp-sub code{font-family:var(--sp-mono);font-size:.86em;color:#c7d2fe;background:#9333ea1f;padding:.1rem .4rem;border-radius:5px}#security-playground .sp-tabs{display:flex;flex-wrap:wrap;gap:.4rem;margin:1.2rem 0 .9rem;padding:.35rem;background:#0a061680;border:1px solid var(--sp-border);border-radius:14px}#security-playground .sp-tab{flex:1 1 150px;display:inline-flex;align-items:center;gap:.6rem;padding:.65rem .85rem;background:transparent;color:var(--sp-text-dim);font:500 .88rem/1.2 DM Sans,Inter Tight,system-ui,sans-serif;border:1px solid transparent;border-radius:10px;cursor:pointer;transition:color .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease}#security-playground .sp-tab:hover{color:var(--sp-text);background:#ffffff0a}#security-playground .sp-tab.sp-tab-active{color:#fff;background:linear-gradient(135deg,#9333ea38,#06b6d42e);border-color:var(--sp-border-strong);box-shadow:0 0 0 1px #9333ea40,0 8px 24px -12px #9333ea99}#security-playground .sp-tab-id{font:500 .68rem/1 var(--sp-mono);color:var(--sp-muted);letter-spacing:.06em}#security-playground .sp-tab.sp-tab-active .sp-tab-id{color:var(--sp-accent)}#security-playground .sp-tab-label{font-size:.84rem;font-weight:500}#security-playground .sp-toggle-row{display:flex;align-items:center;flex-wrap:wrap;gap:.85rem;margin-bottom:.8rem}#security-playground .sp-toggle{display:inline-flex;padding:.25rem;gap:.2rem;background:#0a061680;border:1px solid var(--sp-border);border-radius:10px}#security-playground .sp-toggle-btn{padding:.5rem 1rem;background:transparent;color:var(--sp-text-dim);font:500 .82rem/1.2 DM Sans,Inter Tight,system-ui,sans-serif;border:0;border-radius:7px;cursor:pointer;transition:color .16s,background .16s,box-shadow .16s}#security-playground .sp-toggle-btn:hover{color:var(--sp-text)}#security-playground .sp-toggle-active{color:#fff;background:linear-gradient(135deg,#9333ea40,#06b6d433);box-shadow:0 0 0 1px #9333ea47,0 6px 18px -10px #9333ea8c}#security-playground .sp-toggle-hint{margin:0;flex:1;min-width:220px;font-size:.84rem;color:var(--sp-text-dim);line-height:1.5}#security-playground .sp-split{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}#security-playground .sp-pane{background:var(--sp-surface);border:1px solid var(--sp-border);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;min-height:280px;position:relative;transition:border-color .24s ease,box-shadow .24s ease}#security-playground .sp-pane-output.sp-pane-scanning{border-color:#9333ea8c;box-shadow:0 0 0 1px #9333ea40,0 0 40px #9333ea1f}#security-playground .sp-pane-head{display:flex;align-items:center;justify-content:space-between;padding:.65rem 1rem;background:#ffffff04;border-bottom:1px solid var(--sp-border)}#security-playground .sp-pane-label{font:500 .75rem/1 var(--sp-mono);letter-spacing:.06em;color:var(--sp-muted)}#security-playground .sp-run-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 1.1rem;font:600 .82rem/1 DM Sans,Inter Tight,system-ui,sans-serif;letter-spacing:.01em;color:#fff;background:linear-gradient(135deg,#9333ea,#06b6d4);border:0;border-radius:10px;cursor:pointer;box-shadow:0 4px 18px #9333ea66;transition:transform .12s ease,box-shadow .16s ease,filter .12s ease}#security-playground .sp-run-btn:before{content:"";width:0;height:0;border-style:solid;border-width:5px 0 5px 8px;border-color:transparent transparent transparent #fff;display:inline-block}#security-playground .sp-run-btn:hover{transform:translateY(-1px);box-shadow:0 6px 24px #9333ea8c;filter:brightness(1.05)}#security-playground .sp-run-btn:active{transform:translateY(0) scale(.98)}#security-playground .sp-run-btn.sp-run-btn-firing{animation:sp-run-pulse .42s ease}@keyframes sp-run-pulse{0%{box-shadow:0 4px 18px #9333ea66}50%{box-shadow:0 0 0 6px #9333ea47,0 6px 28px #06b6d48c}to{box-shadow:0 4px 18px #9333ea66}}#security-playground .sp-input{flex:1;resize:vertical;min-height:180px;padding:1rem 1.1rem;background:transparent;color:#f1f5ff;font:400 .92rem/1.65 var(--sp-mono);border:0;outline:none;caret-color:var(--sp-accent)}#security-playground .sp-input:focus{background:#9333ea0a}#security-playground .sp-input-note{margin:0;padding:.7rem 1.05rem;font-size:.82rem;line-height:1.55;color:var(--sp-text-dim);border-top:1px solid var(--sp-border);background:#ffffff04}#security-playground .sp-input-note strong{color:var(--sp-accent);font-weight:600}#security-playground .sp-verdict{font:600 .72rem/1 var(--sp-mono);letter-spacing:.1em;text-transform:uppercase;padding:.32rem .7rem;border-radius:6px;border:1px solid var(--sp-border);background:#ffffff05;color:var(--sp-text-dim);transition:background-color .2s ease,color .2s ease,border-color .2s ease}#security-playground .sp-verdict[data-state=ok]{color:#6ee7b7;border-color:#34d39973;background:#34d3991a}#security-playground .sp-verdict[data-state=warn]{color:#fcd34d;border-color:#fbbf2473;background:#fbbf241a}#security-playground .sp-verdict[data-state=bad]{color:#fca5a5;border-color:#f8717173;background:#f871711a}#security-playground .sp-verdict[data-state=scanning]{color:var(--sp-accent);border-color:#9333ea73;background:#9333ea1f;animation:sp-verdict-scan 1s ease-in-out infinite}@keyframes sp-verdict-scan{0%,to{opacity:1}50%{opacity:.55}}#security-playground .sp-output{flex:1;padding:1rem 1.15rem;font:400 .88rem/1.65 var(--sp-mono);color:#f1f5ff;overflow-x:auto}#security-playground .sp-output-empty{color:var(--sp-muted);font-style:italic}#security-playground .sp-output-scanning{display:flex;align-items:center;gap:.75rem;color:var(--sp-accent);font-weight:500}#security-playground .sp-scan-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--sp-accent);animation:sp-scan-bounce 1s ease-in-out infinite}#security-playground .sp-scan-dot:nth-child(2){animation-delay:.15s}#security-playground .sp-scan-dot:nth-child(3){animation-delay:.3s}@keyframes sp-scan-bounce{0%,80%,to{transform:scale(.6);opacity:.4}40%{transform:scale(1);opacity:1}}#security-playground .sp-line{display:block;white-space:pre-wrap;margin-bottom:.15rem}#security-playground .sp-prompt-char{color:var(--sp-accent);user-select:none}#security-playground .sp-line-cmd{color:#f1f5ff;font-weight:500}#security-playground .sp-line-info{color:var(--sp-text-dim)}#security-playground .sp-line-ok{color:#6ee7b7}#security-playground .sp-line-warn{color:#fcd34d}#security-playground .sp-line-bad{color:#fca5a5}#security-playground .sp-output mark{background:#f8717133;color:#fecaca;padding:.05rem .25rem;border-radius:4px}#security-playground .sp-footnote{margin:1.3rem 0 0;font-size:.84rem;line-height:1.55;color:var(--sp-text-dim)}#security-playground .sp-footnote strong{color:#fff;font-weight:600}#security-playground .sp-footnote a{color:var(--sp-accent);text-decoration:none;border-bottom:1px solid rgba(192,132,252,.3);transition:border-color .16s}#security-playground .sp-footnote a:hover{border-color:var(--sp-accent)}@media(max-width:720px){#security-playground .sp-split{grid-template-columns:1fr}#security-playground .sp-tab{flex-basis:44%}}@media(max-width:420px){#security-playground.sp-root{padding:.85rem;border-radius:14px}#security-playground .sp-tab{flex-basis:100%}#security-playground .sp-toggle-btn{padding:.4rem .6rem;font-size:.7rem}#security-playground .sp-input{font-size:.8rem}#security-playground .sp-output{font-size:.76rem}}