@import url('https://fonts.googleapis.com/css2?family=Teko:wght@500;700&family=Share+Tech+Mono&display=swap');

:root {
    --cs2-bg-dark: #0b0e13;
    --cs2-card-bg: #141821;
    --cs2-orange: #de9b35;
    --cs2-orange-bright: #ffb43a;
    --cs2-border: #2a3242;
    --cs2-text: #dcdedf;
    --cs2-red: #eb4b4b;
    --cs2-green: #5cbe42;
}

body {
    background-color: var(--cs2-bg-dark);
    color: var(--cs2-text);
    font-family: 'Share Tech Mono', monospace;
    background-image: radial-gradient(#1e2532 1px, transparent 0);
    background-size: 24px 24px;
}

.cs2-header {
    font-family: 'Teko', sans-serif;
    letter-spacing: 2px;
}

.cs2-panel {
    background: var(--cs2-card-bg);
    border: 1px solid var(--cs2-border);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
    border-left: 3px solid var(--cs2-orange);
}

.cs2-btn {
    background: linear-gradient(135deg, #de9b35 0%, #a8711e 100%);
    color: #000;
    font-family: 'Teko', sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    text-transform: uppercase;
    transition: all 0.2s ease;
}

.cs2-btn:hover {
    background: linear-gradient(135deg, #ffb43a 0%, #c48525 100%);
    box-shadow: 0 0 15px rgba(222, 155, 53, 0.4);
}

.cs2-input {
    background: #080a0e;
    border: 1px solid var(--cs2-border);
    color: #fff;
}

.cs2-input:focus {
    border-color: var(--cs2-orange);
    outline: none;
}