:root {
    --bg-light: #f4f7fb;
    --bg-soft: #eef3f9;
    --surface: #ffffff;
    --text-dark: #1f2a37;
    --text-muted: #5f6f82;
    --border: #d9e3f0;
    --focus: #2f6ea8;
    --focus-strong: #235b8e;
    --btn: #1d9546;
    --btn-hover: #15823c;
    --card-bg: #ffffff;
    --shadow-soft: 0 10px 24px rgba(21, 41, 69, 0.08);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

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

body {
    font-family: "Kedebideri", sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    background: #ffffff;
    color: var(--text-dark);
}

main {
    min-height: calc(100vh - 150px);
    padding-bottom: 76px;
}

header {
    width: 100%;
    text-align: center;
    color: #f5fff7;
    margin-bottom: 16px;
    padding: 0;
    background: linear-gradient(180deg, #4daf5e 0%, #439d53 52%, #3d8f4b 100%);
    border-bottom: none;
    box-shadow: 0 6px 18px rgba(20, 40, 70, 0.07);
}

header h1 {
    margin: 0;
    padding: 12px 0;
    font-size: 24px;
    font-weight: 600;
    letter-spacing: 0.2px;
}