:root {
    --color-primary: #2F7D3C;
    --color-primary-dark: #205C2B;
    --color-primary-light: #E8F3EA;
    --color-primary-softer: #F4FAF4;
    --color-background: #F8FAF8;
    --color-surface: #FFFFFF;
    --color-text: #1F2933;
    --color-text-muted: #667085;
    --color-border: #E4E9E4;
    --color-success: #2E8B57;
    --color-success-bg: #E7F5EC;
    --color-warning: #D98B21;
    --color-warning-bg: #FBF1E2;
    --color-danger: #C94C4C;
    --color-danger-bg: #FBEAEA;
    --color-info: #3E7CB1;
    --color-info-bg: #EAF2F9;
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 18px;
    --shadow-sm: 0 1px 2px rgba(31,41,51,.04), 0 1px 3px rgba(31,41,51,.06);
    --shadow-md: 0 4px 14px rgba(31,41,51,.07);
}

* { box-sizing: border-box; }

html, body {
    margin: 0;
    padding: 0;
    background: var(--color-background);
    color: var(--color-text);
    font-family: "Segoe UI", "Inter", system-ui, -apple-system, sans-serif;
    -webkit-font-smoothing: antialiased;
}

button, input { font-family: inherit; }

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 10px;
    border: 1px solid transparent;
    font-size: 14px;
    font-weight: 600;
    padding: 12px 18px;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease;
    width: 100%;
}
.btn-primary { background: var(--color-primary); color: #fff; }
.btn-primary:hover { background: var(--color-primary-dark); }
.btn-ghost { background: transparent; color: var(--color-text-muted); border-color: var(--color-border); }
.btn-ghost:hover { background: var(--color-background); }

.form-group { margin-bottom: 16px; text-align: left; }
.form-group label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.form-group input {
    width: 100%;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    padding: 11px 13px;
    font-size: 14px;
    color: var(--color-text);
    background: var(--color-surface);
}
.form-group input:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--color-primary-light);
}

.alert {
    border-radius: var(--radius-md);
    padding: 11px 14px;
    font-size: 13px;
    margin-bottom: 16px;
    text-align: left;
}
.alert-danger { background: var(--color-danger-bg); color: var(--color-danger); }
