.guide-app-surface{--background:#101722;--foreground:#eef2f8;--card:#1b2433;--border:#3a4a63;--muted:#2a3548;--accent:#364357;--danger:#ef4444;--color-background:var(--background);--color-foreground:var(--foreground);--color-card:var(--card);--color-card-foreground:var(--foreground);--color-primary:#5b9aff;--color-primary-foreground:#fff;--color-muted:var(--muted);--color-muted-foreground:#b8c5d9;--color-border:var(--border);--color-accent:var(--accent);--color-accent-foreground:var(--foreground);--color-destructive:var(--danger);--color-popover:var(--card);--color-popover-foreground:var(--foreground);color:var(--color-foreground);background:var(--color-background);font-family:var(--font-inter,"Inter"), ui-sans-serif, system-ui, sans-serif;isolation:isolate;font-size:1rem;line-height:1.6}.guide-app-surface .text-foreground{color:var(--color-foreground)}.guide-app-surface .text-muted-foreground{color:var(--color-muted-foreground)}.guide-app-surface .text-primary{color:var(--color-primary)}.guide-app-surface .bg-background{background-color:var(--color-background)}.guide-app-surface .bg-card{background-color:var(--color-card)}.guide-app-surface .bg-muted{background-color:var(--color-muted)}.guide-app-surface .bg-accent{background-color:color-mix(in srgb, var(--color-primary) 18%, var(--color-card))}.guide-app-surface .bg-primary{background-color:var(--color-primary)}.guide-app-surface .border-border{border-color:color-mix(in srgb, var(--color-border) 72%, transparent)}.guide-app-surface .hover\:bg-accent:hover{background-color:color-mix(in srgb, var(--color-primary) 14%, var(--color-card))}.guide-app-surface .hover\:bg-accent\/30:hover{background-color:color-mix(in srgb, var(--color-primary) 10%, var(--color-card))}.guide-app-surface .hover\:bg-accent\/50:hover{background-color:color-mix(in srgb, var(--color-primary) 14%, var(--color-card))}.guide-app-surface .hover\:bg-accent\/60:hover{background-color:color-mix(in srgb, var(--color-primary) 16%, var(--color-card))}.guide-app-surface .bg-muted\/15{background-color:color-mix(in srgb, var(--color-muted) 55%, transparent)}.guide-app-surface .bg-muted\/20{background-color:color-mix(in srgb, var(--color-muted) 65%, transparent)}.guide-app-surface .bg-muted\/25{background-color:color-mix(in srgb, var(--color-muted) 70%, transparent)}.guide-app-surface .bg-muted\/50{background-color:color-mix(in srgb, var(--color-muted) 88%, transparent)}.guide-app-surface .bg-primary\/8{background-color:color-mix(in srgb, var(--color-primary) 14%, transparent)}.guide-app-surface .bg-primary\/10{background-color:color-mix(in srgb, var(--color-primary) 18%, transparent)}.guide-app-surface .panel-surface{background:var(--color-card);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--color-border) 55%, transparent)}.guide-app-surface .surface-header{background:color-mix(in srgb, var(--color-muted) 55%, var(--color-card));border-bottom:1px solid color-mix(in srgb, var(--color-border) 70%, transparent)}.guide-app-surface .surface-splitter{background:color-mix(in srgb, var(--color-border) 45%, var(--color-card));transition:background .15s}.guide-app-surface .surface-splitter-x{border-left:1px solid color-mix(in srgb, var(--color-border) 65%, transparent);border-right:1px solid color-mix(in srgb, var(--color-border) 65%, transparent)}.guide-app-surface .surface-splitter-y{border-top:1px solid color-mix(in srgb, var(--color-border) 65%, transparent);border-bottom:1px solid color-mix(in srgb, var(--color-border) 65%, transparent)}.guide-app-surface .surface-splitter:hover,.guide-app-surface .surface-splitter.is-dragging{background:color-mix(in srgb, var(--color-primary) 12%, var(--color-card))}.guide-app-surface .surface-splitter-grip{border:1px solid color-mix(in srgb, var(--color-primary) 28%, transparent);background:var(--color-card);color:var(--color-muted-foreground);transition:border-color .15s,background .15s,color .15s}.guide-app-surface .surface-splitter:hover .surface-splitter-grip,.guide-app-surface .surface-splitter.is-dragging .surface-splitter-grip{border-color:color-mix(in srgb, var(--color-primary) 45%, transparent);background:color-mix(in srgb, var(--color-primary) 12%, var(--color-card));color:var(--color-primary)}.guide-app-surface .app-scrollbar{scrollbar-width:thin;scrollbar-color:color-mix(in srgb, var(--color-border) 80%, transparent) transparent}.guide-app-surface .app-scrollbar::-webkit-scrollbar{width:8px;height:8px}.guide-app-surface .app-scrollbar::-webkit-scrollbar-track{background:0 0}.guide-app-surface .app-scrollbar::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--color-border) 85%, transparent);border-radius:999px}.guide-app-surface .app-scrollbar::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb, var(--color-primary) 35%, var(--color-border))}
