:root {
    color-scheme: dark;
    --color-bg: #000000;
    --color-panel: #0c0d10;
    --color-panel-border: #1f2128;
    --color-panel-hover: #16171d;
    --color-text: rgba(255, 255, 255, 0.92);
    --color-text-muted: rgba(255, 255, 255, 0.55);
    --color-accent: #0ec3c9;
    --color-accent-soft: rgba(14, 195, 201, 0.15);
    --color-danger: #ff5b5b;
    --color-danger-soft: rgba(255, 91, 91, 0.12);
    font-family: 'Inter', 'Segoe UI', Arial, Helvetica, sans-serif;
}

* {
    box-sizing: border-box;
}

html,
body,
#root {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
}

body {
    background-color: var(--color-bg);
    color: var(--color-text);
    overflow: hidden;
}

#root {
    display: block;
}

input,
button,
select,
textarea {
    font-family: inherit;
}

button {
    cursor: pointer;
}

button:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

#game-container {
    width: 100vw;
    height: 100vh;
    background: #000;
}

#game-container canvas {
    display: block;
}