/* TSB Standalone Widgets CSS - Extended (~15KB) */
/* Base from widget.min.css + standalone-specific styles */

*{margin:0;padding:0;box-sizing:border-box}
:root{--bg-void:#0a0a0a;--bg-primary:#191919;--bg-secondary:#161616;--bg-card:#141414;--glass-bg:#161616;--glass-bg-hover:#202020;--glass-border:#222222;--glass-border-hover:#2a2a2a;--text-primary:#f0f0f2;--text-secondary:#9898a0;--text-muted:#5c5c66;--text-tertiary:#5c5c66;--brand:#4DAB9A;--accent:#4DAB9A;--accent-light:#5BC4B0;--green:#22c55e;--green-light:#4ade80;--red:#ef4444;--red-light:#f87171;--amber:#f59e0b;--indigo:#6366f1}
html,html body{background:var(--bg-primary)}
html,body{font-family:'Instrument Sans',-apple-system,sans-serif;color:var(--text-primary);min-height:100%;margin:0;padding:0}
body{padding:8px}
.font-mono{font-family:'JetBrains Mono',monospace}
.antialiased{-webkit-font-smoothing:antialiased}

/* Layout */
.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.block{display:block}.hidden{display:none}
.flex-col{flex-direction:column}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}
.items-center{align-items:center}.items-start{align-items:start}.items-end{align-items:flex-end}
.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-end{justify-content:flex-end}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}
.gap-0\.5{gap:.125rem}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}
.space-y-1>*+*{margin-top:.25rem}.space-y-1\.5>*+*{margin-top:.375rem}.space-y-2>*+*{margin-top:.5rem}.space-y-3>*+*{margin-top:.75rem}.space-y-4>*+*{margin-top:1rem}

/* Positioning */
.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}
.inset-0{top:0;right:0;bottom:0;left:0}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}
.z-10{z-index:10}.z-50{z-index:50}

/* Sizing */
.w-full{width:100%}.w-2{width:.5rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-10{width:2.5rem}.w-32{width:8rem}
.h-full{height:100%}.h-1{height:.25rem}.h-2{height:.5rem}.h-5{height:1.25rem}.h-8{height:2rem}.h-10{height:2.5rem}.h-32{height:8rem}
.min-h-\[50px\]{min-height:50px}.min-h-\[80px\]{min-height:80px}.min-h-\[180px\]{min-height:180px}.min-h-\[200px\]{min-height:200px}

/* Spacing */
.p-2{padding:.5rem}.p-2\.5{padding:.625rem}.p-4{padding:1rem}.p-5{padding:1.25rem}
.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}
.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-4{padding-top:1rem;padding-bottom:1rem}
.pt-2{padding-top:.5rem}.pt-3{padding-top:.75rem}.pt-4{padding-top:1rem}
.pb-2{padding-bottom:.5rem}
.pl-7{padding-left:1.75rem}
.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}
.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}
.ml-auto{margin-left:auto}.mx-auto{margin-left:auto;margin-right:auto}

/* Typography */
.text-\[8px\]{font-size:8px}.text-\[9px\]{font-size:15px}.text-\[10px\]{font-size:14px}.text-\[13px\]{font-size:15px}.text-\[14px\]{font-size:14px}
.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-base{font-size:1rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}
.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-\[800\]{font-weight:800}
.uppercase{text-transform:uppercase}.italic{font-style:italic}
.tracking-tight{letter-spacing:-.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.tracking-\[0\.15em\]{letter-spacing:.15em}.tracking-\[0\.2em\]{letter-spacing:.2em}
.leading-none{line-height:1}.leading-relaxed{line-height:1.625}
.text-center{text-align:center}.text-right{text-align:right}
.whitespace-pre-wrap{white-space:pre-wrap}.break-words{word-wrap:break-word}

/* Colors */
.text-white{color:#fff}.text-black{color:#000}
.text-brand{color:var(--brand)}.text-accent{color:var(--accent)}
.text-green-400{color:#4ade80}.text-green-500{color:#22c55e}
.text-red-400{color:#f87171}.text-red-500{color:#ef4444}
.text-amber-400{color:#fbbf24}
.text-indigo-400{color:#818cf8}
.text-zinc-200{color:#e4e4e7}.text-zinc-300{color:#d4d4d8}.text-zinc-400{color:#a1a1aa}.text-zinc-500{color:#71717a}.text-zinc-600{color:#52525b}

.bg-brand{background-color:var(--brand)}.bg-darkCard{background-color:var(--bg-card)}
.bg-green-500{background-color:#22c55e}.bg-red-500{background-color:#ef4444}
.bg-zinc-600{background-color:#52525b}.bg-zinc-700{background-color:#3f3f46}.bg-zinc-800{background-color:#27272a}.bg-zinc-900{background-color:#18181b}
.bg-indigo-400{background-color:#818cf8}.bg-indigo-500{background-color:#6366f1}
.bg-white{background-color:#fff}.bg-black{background-color:#000}
.bg-transparent{background-color:transparent}

/* Opacity backgrounds */
.bg-white\/5{background-color:rgba(255,255,255,.05)}
.bg-indigo-500\/10{background-color:rgba(99,102,241,.1)}.bg-indigo-500\/15{background-color:rgba(99,102,241,.15)}
.bg-brand\/5{background-color:rgba(77,171,154,.05)}
.bg-black\/60{background-color:rgba(0,0,0,.6)}

/* Borders */
.border{border-width:1px}.border-t{border-top-width:1px}.border-b{border-bottom-width:1px}
.border-white\/5{border-color:rgba(255,255,255,.05)}.border-white\/10{border-color:rgba(255,255,255,.1)}
.border-indigo-500\/20{border-color:rgba(99,102,241,.2)}
.border-zinc-200{border-color:#e4e4e7}.border-zinc-300{border-color:#d4d4d8}
.rounded{border-radius:.25rem}.rounded-sm{border-radius:.125rem}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-2xl{border-radius:1rem}.rounded-\[16px\]{border-radius:16px}.rounded-\[20px\]{border-radius:20px}.rounded-\[24px\]{border-radius:24px}
.rounded-full{border-radius:9999px}

/* Effects */
.shadow-sm{box-shadow:0 1px 2px rgba(0,0,0,.05)}.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}
.opacity-50{opacity:.5}.opacity-75{opacity:.75}
.backdrop-blur-sm{backdrop-filter:blur(4px)}
.blur-\[40px\]{filter:blur(40px)}
.overflow-hidden{overflow:hidden}

/* Transitions */
.transition-all{transition:all .2s ease}.transition-colors{transition:color .2s,background-color .2s,border-color .2s}

/* Transforms */
.-translate-y-1\/2{transform:translateY(-50%)}
.-top-10{top:-2.5rem}.-right-10{right:-2.5rem}

/* Gradients */
.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}
.from-indigo-500\/15{--tw-gradient-from:rgba(99,102,241,.15);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,transparent)}
.via-darkCard{--tw-gradient-via:var(--bg-card);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-via),var(--tw-gradient-to,transparent)}
.to-brand\/5{--tw-gradient-to:rgba(77,171,154,.05)}

/* Custom widget styles */
.standard-border{border:1px solid rgba(255,255,255,.08);border-radius:16px}
.no-scrollbar::-webkit-scrollbar{display:none}
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--glass-border-hover)}
*{scrollbar-width:thin;scrollbar-color:var(--glass-border) transparent}
.pulse-dot{animation:pulse-glow 2s infinite}
@keyframes pulse-glow{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.3)}}
.confidence-bar{transition:width .5s ease}

/* Stat Card */
.stat-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;padding:12px 14px;position:relative;overflow:hidden;transition:all .2s cubic-bezier(.16,1,.3,1)}
.stat-card::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:linear-gradient(90deg,var(--accent),var(--accent-light));transition:width .35s cubic-bezier(.16,1,.3,1)}
.stat-card:hover{background:var(--glass-bg-hover);border-color:var(--glass-border-hover);transform:translateY(-2px)}
.stat-card:hover::after{width:100%}
.stat-card.stat-positive{background:linear-gradient(135deg,rgba(34,197,94,.08) 0%,rgba(34,197,94,.02) 100%);border-color:rgba(34,197,94,.2)}
.stat-card.stat-positive::after{background:linear-gradient(90deg,var(--green),var(--green-light));width:100%}
.stat-card.stat-negative{background:linear-gradient(135deg,rgba(239,68,68,.08) 0%,rgba(239,68,68,.02) 100%);border-color:rgba(239,68,68,.2)}
.stat-card.stat-negative::after{background:linear-gradient(90deg,var(--red),var(--red-light));width:100%}
.stat-label{font-size:15px;font-weight:600;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:2px}
.stat-value{font-family:'JetBrains Mono',monospace;font-size:1.25rem;font-weight:600;line-height:1.1;color:var(--text-primary)}
.stat-value.positive{color:var(--green-light)}
.stat-value.negative{color:var(--red-light)}

/* Chart Container */
.chart-container{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:12px;padding:12px 14px;width:100%;transition:all .2s cubic-bezier(.16,1,.3,1)}
.chart-container:hover{background:var(--glass-bg-hover);border-color:var(--glass-border-hover)}
.chart-header{font-size:15px;font-weight:600;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}
.chart-area{height:160px;width:100%}

/* Theme is controlled only via html.dark / html.light classes */

/* Dark Theme (explicit class override) */
html.dark{--bg-primary:#191919;--bg-secondary:#161616;--bg-card:#141414;--glass-bg:#161616;--glass-bg-hover:#202020;--glass-border:#222222;--glass-border-hover:#2a2a2a;--text-primary:#f0f0f2;--text-secondary:#9898a0;--text-muted:#5c5c66;--text-tertiary:#5c5c66}

/* Light Theme (explicit class override) */
html.light{--bg-primary:#fff;--bg-secondary:#f8f8f8;--bg-card:#fff;--glass-bg:rgba(0,0,0,.02);--glass-bg-hover:rgba(0,0,0,.04);--glass-border:rgba(0,0,0,.08);--glass-border-hover:rgba(0,0,0,.12);--text-primary:#1a1a1a;--text-secondary:#666;--text-muted:#999;--text-tertiary:#888}
html.light .stat-card.stat-positive{background:linear-gradient(135deg,rgba(34,197,94,.1) 0%,rgba(34,197,94,.03) 100%)}
html.light .stat-card.stat-negative{background:linear-gradient(135deg,rgba(239,68,68,.1) 0%,rgba(239,68,68,.03) 100%)}
html.light .bg-darkCard{background-color:#fff;border:1px solid rgba(0,0,0,.08)}
html.light .text-white{color:#1a1a1a}
html.light .border-white\/5{border-color:rgba(0,0,0,.05)}
html.light .border-white\/10{border-color:rgba(0,0,0,.1)}
