Code Patterns

// Color formats
Background: #141c26;           // Solid color (RGB hex)
Background: #141c26(0.95);     // With alpha (95% opacity)
Background: #ffffff(0.5);      // Semi-transparent white

// Common dark theme colors
#0a1119  // Very dark (sidebar backgrounds)
#141c26  // Dark (main panel backgrounds)
#1b2532  // Dark pressed state
#2b3542  // Medium (dividers, secondary buttons)
#3b4552  // Medium hover state
#4a5568  // Muted text (hints, disabled)
#6e7da1  // Secondary text
#96a9be  // Light secondary text
#b6c9de  // Light hover text
#ffffff  // Primary text

// Accent colors
#3a7bd5  // Blue (primary actions)
#4a9eff  // Light blue (stats)
#4aff7f  // Green (success, positive stats)
#ffaa4a  // Orange (warnings, highlights)
#8b3a3a  // Red (cancel, danger)

// Label styling
Label {
    Text: "My Label";
    Anchor: (Height: 40);
    Style: (
        FontSize: 24,
        TextColor: #ffffff,
        HorizontalAlignment: Center,    // Left, Center, Right
        VerticalAlignment: Center,      // Top, Center, Bottom
        RenderBold: true,
        RenderUppercase: true,
        LetterSpacing: 2               // Space between letters
    );
}

// Text input styling
TextField {
    Text: "";
    PlaceholderText: "Enter text...";
    Anchor: (Height: 40);
    Style: (
        FontSize: 14,
        TextColor: #ffffff,
        PlaceholderColor: #6e7da1
    );
}

// Padding and margins
Group {
    Padding: (Full: 20);              // All sides
    Padding: (Left: 10, Right: 10);   // Specific sides
    Padding: (Top: 5, Bottom: 5);
}