*,
*::before,
*::after {
    box-sizing: border-box;
}

:root {
    /* Light Theme */
    --bg-app: #f5f5f5;
    --bg-panel: #ffffff;
    --border-color: #e5e5e5;
    --text-main: #333333;
    --text-muted: #666666;
    --primary: #166534;
    --primary-hover: #14532d;

    --drop-overlay-bg: rgba(255, 255, 255, 0.9);

    --diff-add-bg: #dcfce7;
    --diff-add-text: #166534;
    --diff-del-bg: #fee2e2;
    --diff-del-text: #991b1b;

    --toolbar-height: 80px;
    --font-size-base: 16px;

    /* Z-Index Hierarchy */
    --z-drop-overlay: 20;
    --z-scroll-btn: 100;
    --z-toast: 1000;
    --z-loading: 9999;

    /* Border Radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 0.5rem;
    /* 8px equivalent */
    --radius-full: 50%;
    --radius-pill: 999px;

    /* Box Shadows */
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.2);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -2px rgba(0, 0, 0, 0.1);
    --shadow-btn-scroll: 0 4px 6px -1px rgba(0, 0, 0, 0.2), 0 2px 4px -1px rgba(0, 0, 0, 0.1);
}

[data-theme="dark"] {
    --bg-app: #171717;
    --bg-panel: #262626;
    --border-color: #404040;
    --text-main: #e5e5e5;
    --text-muted: #a3a3a3;
    --primary: #FCA5A5;
    --primary-hover: #fecaca;

    --diff-add-bg: #052e16;
    --diff-add-text: #86efac;
    --diff-del-bg: #450a0a;
    --diff-del-text: #fca5a5;

    --drop-overlay-bg: rgba(15, 17, 21, 0.9);
}

* {
    margin: 0;
    padding: 0;
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background-color: var(--bg-app);
    color: var(--text-main);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

/* Helper Utilities */
.text-highlight {
    color: var(--primary) !important;
}