:root{--font-primary:"DM Sans",-apple-system,BlinkMacSystemFont,sans-serif;--font-mono:"JetBrains Mono",monospace;--text-3xl:28px;--text-2xl:20px;--text-xl:16px;--text-lg:14px;--text-base:13px;--text-sm:12px;--text-xs:11px;--text-2xs:10px;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--tracking-tight:-0.02em;--tracking-normal:-0.01em;--tracking-wide:0.01em;--tracking-wider:0.05em;--bg-primary:#0a0a0a;--bg-secondary:#111;--bg-elevated:#171717;--bg-hover:#1f1f1f;--accent:#facc15;--accent-hover:#fde047;--accent-dark:#eab308;--accent-muted:rgba(250,204,21,.08);--accent-border:rgba(250,204,21,.2);--text-primary:#fafafa;--text-secondary:#a3a3a3;--text-tertiary:#737373;--border:#262626;--border-subtle:#1a1a1a;--success:#4ade80;--error:#f87171;--warning:#fbbf24;--space-xs:0.25rem;--space-sm:0.5rem;--space-md:0.75rem;--space-lg:1rem;--space-xl:1.5rem;--space-2xl:2rem;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-full:100px;--shadow-inset:inset 0 2px 4px rgba(0,0,0,.3);--shadow-inset-highlight:inset 0 1px 0 hsla(0,0%,100%,.2);--shadow-elevation-sm:0 1px 3px rgba(0,0,0,.3);--shadow-elevation-md:0 4px 8px rgba(0,0,0,.4);--shadow-elevation-lg:0 8px 24px rgba(0,0,0,.5);--shadow-glow-sm:0 0 12px rgba(250,204,21,.15);--shadow-glow-md:0 0 20px rgba(250,204,21,.25);--shadow-focus:0 0 0 3px rgba(250,204,21,.1);--transition-fast:all 0.15s ease;--transition-normal:all 0.2s ease;--transition-smooth:all 0.2s cubic-bezier(0.4,0,0.2,1)}*,:after,:before{box-sizing:border-box}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;padding:0;font-family:var(--font-primary);font-size:var(--text-base);line-height:1.5;color:var(--text-primary);background-color:var(--bg-primary)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}::selection{background-color:var(--accent-muted);color:var(--accent)}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.text-tertiary{color:var(--text-tertiary)}.text-accent{color:var(--accent)}.text-success{color:var(--success)}.text-error{color:var(--error)}.text-warning{color:var(--warning)}.bg-primary{background-color:var(--bg-primary)}.bg-secondary{background-color:var(--bg-secondary)}.bg-elevated{background-color:var(--bg-elevated)}.font-primary{font-family:var(--font-primary)}.font-mono{font-family:var(--font-mono)}.dna-card{background:linear-gradient(135deg,var(--bg-elevated) 0,#141414 100%);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-inset-highlight)}.dna-card:hover{border-color:var(--accent-border);background:linear-gradient(135deg,var(--bg-hover) 0,#1a1a1a 100%);transform:translateY(-1px);box-shadow:var(--shadow-inset-highlight),var(--shadow-elevation-md)}.dna-btn-primary{position:relative;background:linear-gradient(135deg,var(--accent-hover) 0,var(--accent) 100%);color:var(--bg-primary);padding:.5rem 1rem;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--weight-medium);border:1px solid hsla(0,0%,100%,.1);box-shadow:var(--shadow-inset-highlight),var(--shadow-elevation-sm),var(--shadow-glow-sm);cursor:pointer;transition:var(--transition-fast)}.dna-btn-primary:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 hsla(0,0%,100%,.3),var(--shadow-elevation-md),var(--shadow-glow-md)}.dna-btn-secondary{position:relative;background:linear-gradient(135deg,#1a1a1a 0,var(--bg-elevated) 100%);color:var(--text-primary);padding:.5rem 1rem;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--weight-medium);border:1px solid var(--border);box-shadow:inset 0 1px 0 hsla(0,0%,100%,.05);cursor:pointer;transition:var(--transition-fast)}.dna-btn-secondary:hover{background:linear-gradient(135deg,var(--bg-hover) 0,#1a1a1a 100%);border-color:var(--accent-border)}.dna-btn-ghost{background:transparent;color:var(--text-secondary);padding:.5rem 1rem;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--weight-medium);border:1px solid var(--border);box-shadow:inset 0 1px 0 hsla(0,0%,100%,.03);cursor:pointer;transition:var(--transition-fast)}.dna-btn-ghost:hover{color:var(--accent);border-color:var(--accent-border);background:var(--accent-muted)}.dna-input{padding:.625rem .875rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--text-base);color:var(--text-primary);box-shadow:var(--shadow-inset);transition:var(--transition-fast)}.dna-input:focus{border-color:var(--accent);background:var(--bg-elevated);box-shadow:var(--shadow-inset),var(--shadow-focus);outline:none}.dna-input::placeholder{color:var(--text-tertiary)}.dna-label{font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-tertiary);margin-bottom:var(--space-sm);display:block}.dna-badge,.dna-label{text-transform:uppercase;letter-spacing:var(--tracking-wider)}.dna-badge{padding:.25rem .625rem;background:var(--accent-muted);border:1px solid var(--accent-border);border-radius:var(--radius-sm);color:var(--accent);font-size:var(--text-2xs);font-weight:var(--weight-semibold)}.dna-badge-success{background:rgba(74,222,128,.08);border-color:rgba(74,222,128,.2);color:var(--success)}.dna-badge-error{background:hsla(0,91%,71%,.08);border-color:hsla(0,91%,71%,.2);color:var(--error)}.dna-badge-warning{background:rgba(251,191,36,.08);border-color:rgba(251,191,36,.2);color:var(--warning)}.dna-container{max-width:1400px;margin:0 auto;padding:var(--space-lg) var(--space-xl)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}@keyframes borderFlow{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}@keyframes ripplePulse{0%{box-shadow:0 0 0 0 rgba(250,204,21,.4)}70%{box-shadow:0 0 0 6px rgba(250,204,21,0)}to{box-shadow:0 0 0 0 rgba(250,204,21,0)}}@keyframes barPulse{0%,to{opacity:1}50%{opacity:.7}}@keyframes drawLine{0%{stroke-dashoffset:500}to{stroke-dashoffset:0}}@keyframes tickUp{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes accentGlow{0%,to{box-shadow:0 0 12px rgba(250,204,21,.15)}50%{box-shadow:0 0 20px rgba(250,204,21,.25)}}.dna-card-lg{background:linear-gradient(145deg,#151515,#0f0f0f);border:1px solid #1f1f1f;border-radius:12px;padding:1rem;transition:all .2s ease}.dna-card-lg:hover{border-color:#2a2a2a;box-shadow:0 8px 32px rgba(0,0,0,.3)}.dna-card-clickable:hover{border-color:rgba(250,204,21,.3);transform:translateY(-2px)}.dna-card-active{position:relative;background:linear-gradient(145deg,#151515,#0f0f0f);border-radius:12px}.dna-card-active:before{content:"";position:absolute;inset:0;border-radius:12px;padding:1px;background:linear-gradient(90deg,#0f0f0f,#facc15,#38bdf8,#facc15,#0f0f0f);background-size:200% 100%;animation:borderFlow 3s ease infinite;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.dna-pill{display:inline-flex;align-items:center;gap:.375rem;padding:.25rem .625rem;background:var(--accent-muted);border-radius:100px;font-size:11px;font-weight:600;letter-spacing:.04em}.dna-pill-count{color:var(--accent);font-family:var(--font-mono)}.dna-pill-label{color:var(--text-secondary)}.dna-status-dot{width:6px;height:6px;border-radius:50%;background:var(--text-tertiary)}.dna-status-dot-active{background:var(--success);animation:ripplePulse 2s ease-out infinite}.dna-status-dot-warning{background:var(--warning);animation:pulse 2s ease infinite}.dna-status-dot-error{background:var(--error)}.dna-section-header{font-size:10px;font-weight:600;color:#525252;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.75rem}.dna-metric-value{font-size:28px;letter-spacing:-.02em}.dna-metric-value,.dna-metric-value-sm{font-family:var(--font-mono);font-weight:600;line-height:1}.dna-metric-value-sm{font-size:24px}.dna-metric-value-xs{font-family:var(--font-mono);font-size:16px;font-weight:600}.dna-metric-label{color:var(--text-tertiary);margin-top:.5rem}.dna-metric-label,.dna-table-header{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.dna-table-header{background:#0a0a0a;color:#525252}.dna-table-row{height:36px;border-bottom:1px solid hsla(0,0%,100%,.04);transition:background .15s ease}.dna-table-row:hover{background:#0f0f0f}.dna-table-row-selected{background:rgba(250,204,21,.05);border-left:2px solid var(--accent)}.dna-progress-bar{height:4px;background:#262626;border-radius:2px;overflow:hidden}.dna-progress-fill{height:100%;border-radius:2px;background:var(--accent);animation:barPulse 2s ease infinite}.dna-icon-box{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center}.dna-icon-box-lg{width:48px;height:48px;border-radius:12px}.dna-icon-box-yellow{background:rgba(250,204,21,.15);color:#facc15}.dna-icon-box-cyan{background:rgba(56,189,248,.15);color:#38bdf8}.dna-icon-box-green{background:rgba(74,222,128,.15);color:#4ade80}.dna-icon-box-purple{background:rgba(167,139,250,.15);color:#a78bfa}.dna-icon-box-pink{background:rgba(251,113,133,.15);color:#fb7185}.dna-env-badge{font-size:9px;font-weight:600;font-family:var(--font-mono);text-transform:uppercase;padding:2px 6px;border-radius:4px}.dna-env-badge-dev{background:rgba(251,146,60,.15);color:#fb923c}.dna-env-badge-prod{background:rgba(74,222,128,.15);color:#4ade80}.dna-bento-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(60px,auto);grid-gap:.75rem;gap:.75rem}.dna-bento-3x2{grid-column:span 3;grid-row:span 2}.dna-bento-3x4{grid-column:span 3;grid-row:span 4}.dna-bento-4x2{grid-column:span 4;grid-row:span 2}.dna-bento-6x2{grid-column:span 6;grid-row:span 2}.dna-bento-6x3{grid-column:span 6;grid-row:span 3}.dna-bento-12x2{grid-column:span 12;grid-row:span 2}.dna-gradient-text{background:linear-gradient(135deg,#fde047,#facc15);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.dna-glow{box-shadow:0 0 20px rgba(250,204,21,.3)}.dna-glow-sm{box-shadow:0 0 12px rgba(250,204,21,.15)}@media (max-width:1100px){.dna-bento-3x2,.dna-bento-3x4,.dna-bento-4x2{grid-column:span 6}}@media (max-width:768px){.dna-bento-3x2,.dna-bento-3x4,.dna-bento-4x2,.dna-bento-6x2,.dna-bento-6x3{grid-column:span 12}}.dna-floating-bar{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#1a1a1a,#141414);border:1px solid #262626;border-radius:12px;padding:.75rem 1rem;box-shadow:0 8px 32px rgba(0,0,0,.5);z-index:100;animation:slideDown .15s ease}.dna-modal-backdrop{background:rgba(0,0,0,.8);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.dna-modal{background:#141414;border:1px solid #262626;border-radius:12px;box-shadow:0 16px 48px rgba(0,0,0,.5)}.dna-scroll-panel::-webkit-scrollbar{width:6px}.dna-scroll-panel::-webkit-scrollbar-track{background:transparent}.dna-scroll-panel::-webkit-scrollbar-thumb{background:hsla(0,0%,100%,.1);border-radius:3px}.dna-scroll-panel::-webkit-scrollbar-thumb:hover{background:hsla(0,0%,100%,.2)}