:root {
    --ortak-primary: #6699FF;
    --ortak-primary-deep: #3D6BB3;
    --ortak-primary-light: #8AB4FF;
    --ortak-accent: #FF6D00;
    --ortak-surface: #ECECEC;
    --ortak-card: #FFFFFF;
    --ortak-border: #D8D8D8;
    --ortak-text: #525450;
    --ortak-muted: #757575;
    --ortak-alarm-critical: #FF0000;
    --ortak-alarm-warning: #FB8C00;
    --ortak-status-ok: #99CC00;
    --ortak-sensor-temp: #FF0000;
    --ortak-sensor-humidity: #00CCFF;
    --ortak-sensor-co2: #666666;
    --ortak-sensor-pressure: #00FFCC;
    --ortak-sensor-feed: #FFCC00;
    --ortak-sensor-air: #0000FF;
    --ortak-sensor-water: #9999FF;
    --ortak-mode-ev: #FB8C00;
    --ortak-mode-outdoor: #2770AA;
    --ortak-square-green: #99CC00;
    --ortak-square-blue: #33B5E5;
    --ortak-square-violet: #AA66CC;
    --ortak-sidebar-width: 260px;
    --ortak-sidebar-collapsed: 72px;
    --ortak-topbar-height: 56px;
    --ortak-radius: 12px;
    --ortak-radius-sm: 8px;
    --ortak-shadow: 0 1px 3px rgba(82, 84, 80, 0.12), 0 4px 12px rgba(82, 84, 80, 0.06);
    --ortak-font: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}

[data-theme="dark"] {
    --ortak-primary: #8AB4FF;
    --ortak-primary-deep: #2A4F8F;
    --ortak-primary-light: #A8C8FF;
    --ortak-accent: #FF8A33;
    --ortak-surface: #1A1A1A;
    --ortak-card: #2A2A2A;
    --ortak-border: #404040;
    --ortak-text: #ECECEC;
    --ortak-muted: #AAAAAA;
    --ortak-shadow: 0 1px 3px rgba(0, 0, 0, 0.3), 0 4px 12px rgba(0, 0, 0, 0.2);
    color-scheme: dark;
}

html {
    color-scheme: light;
}

html[data-theme="dark"] {
    color-scheme: dark;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
}

body {
    margin: 0;
    font-family: var(--ortak-font);
    color: var(--ortak-text);
    background: var(--ortak-surface);
    line-height: 1.5;
}

a {
    color: var(--ortak-primary);
    text-decoration: none;
}

a:hover {
    color: var(--ortak-primary-deep);
}

h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--ortak-text);
}

.ortak-tabular {
    font-variant-numeric: tabular-nums;
}
