body {
    margin: 0;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: #17202a;
    background: #f4f6f8;
    font-size: 14px;
}

/* Pasture administration */
.pasture-admin-page {
    display: grid;
    gap: 24px;
    max-width: 1180px;
}

.pasture-admin-header { margin-bottom: 0; }
.pasture-admin-header h1 { margin-bottom: 5px; }
.pasture-admin-kicker,
.pasture-card-eyebrow {
    margin: 0 0 6px;
    color: #9a6810;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.pasture-header-actions { align-self: center; }
.pasture-settings-card,
.pasture-seasons-card {
    overflow: hidden;
    background: #fff;
    border: 1px solid #d8e2dd;
    border-radius: 12px;
    box-shadow: 0 18px 42px rgba(16, 51, 42, .07);
}

.pasture-card-heading {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 22px 24px;
    border-bottom: 1px solid #e2e9e5;
}

.pasture-card-heading h2 { margin: 0; color: #123b31; font-size: 21px; }
.pasture-card-heading p { margin: 5px 0 0; color: #63766f; line-height: 1.55; }
.pasture-card-icon {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 42px;
    height: 42px;
    color: #174b3e;
    background: #f2bf47;
    border-radius: 9px;
}
.pasture-card-icon svg { width: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.pasture-settings-form { padding: 24px; }
.pasture-url-block {
    margin-bottom: 24px;
    padding: 18px;
    color: #fff;
    background: linear-gradient(135deg, #0e352c, #195044);
    border-radius: 10px;
}
.pasture-url-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.pasture-field-label { display: block; font-weight: 820; }
.pasture-url-heading small { display: block; margin-top: 4px; color: rgba(255,255,255,.64); }
.pasture-url-status { display: inline-flex; align-items: center; gap: 7px; color: #d9eee6; font-size: 12px; font-weight: 750; }
.pasture-url-status i,
.pasture-season-status i { width: 7px; height: 7px; border-radius: 50%; background: #5fc68f; }
.pasture-url-preview { display: flex; align-items: center; gap: 10px; margin-top: 16px; }
.pasture-url-preview a {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    padding: 12px 14px;
    color: #173f35;
    background: #fff;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 7px;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pasture-copy-button {
    flex: 0 0 auto;
    min-height: 42px;
    padding: 0 15px;
    color: #102f28;
    background: #efb735;
    border: 0;
    border-radius: 7px;
    font: inherit;
    font-weight: 820;
    cursor: pointer;
}
.pasture-settings-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.pasture-field { display: grid; align-content: start; gap: 6px; margin: 0; }
.pasture-field-wide { grid-column: span 2; }
.pasture-field > span { color: #203d35; font-weight: 780; }
.pasture-field > small { min-height: 17px; color: #75857f; font-size: 12px; }
.pasture-field input { min-height: 45px; }
.pasture-code-card {
    display: grid;
    grid-template-columns: 1fr auto;
    align-content: center;
    gap: 5px 12px;
    padding: 15px 17px;
    background: #f7f9f6;
    border: 1px solid #dce5df;
    border-radius: 8px;
}
.pasture-code-card > span { color: #61736c; font-size: 12px; font-weight: 750; }
.pasture-code-card strong { grid-row: span 2; color: #163f35; font-family: Georgia, serif; font-size: 26px; }
.pasture-code-card small { color: #788780; font-size: 11px; line-height: 1.4; }
.pasture-slug-control,
.pasture-input-suffix { display: flex; align-items: stretch; }
.pasture-slug-control > span,
.pasture-input-suffix > span {
    display: flex;
    align-items: center;
    padding: 0 12px;
    color: #5d7169;
    background: #f2f5f3;
    border: 1px solid #bac9c2;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}
.pasture-slug-control > span { border-right: 0; border-radius: 7px 0 0 7px; }
.pasture-slug-control input { min-width: 120px; border-radius: 0 7px 7px 0; }
.pasture-input-suffix input { min-width: 0; border-radius: 7px 0 0 7px; }
.pasture-input-suffix > span { border-left: 0; border-radius: 0 7px 7px 0; }
.pasture-form-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 24px -24px -24px;
    padding: 16px 24px;
    background: #f8faf8;
    border-top: 1px solid #e0e8e3;
}
.pasture-form-actions > span { color: #6c7d76; font-size: 12px; }
.pasture-season-heading { align-items: center; justify-content: space-between; }
.pasture-season-count { padding: 6px 10px; color: #5c6e67; background: #eff4f1; border-radius: 999px; font-size: 12px; font-weight: 750; }
.pasture-table-wrap { padding: 0 22px 22px; }
.pasture-season-table { margin: 0; }
.pasture-season-table th { color: #6b7d76; font-size: 11px; letter-spacing: .045em; text-transform: uppercase; }
.pasture-season-table td { vertical-align: middle; }
.pasture-season-year { color: #153d33; font-family: Georgia, serif; font-size: 19px; }
.pasture-season-status { display: inline-flex; align-items: center; gap: 7px; padding: 5px 9px; border-radius: 999px; font-size: 12px; font-weight: 760; }
.pasture-season-status.is-open { color: #16643f; background: #e9f7ee; }
.pasture-season-status.is-draft { color: #7a5b16; background: #fff7dc; }
.pasture-season-status.is-draft i { background: #d8a62a; }
.pasture-season-status.is-closed { color: #61706b; background: #edf1ef; }
.pasture-season-status.is-closed i { background: #87958f; }
.pasture-coordinators { color: #40574f; }
.pasture-empty-state { display: grid; gap: 5px; margin: 0 22px 22px; padding: 26px; color: #62736d; background: #f8faf8; border: 1px dashed #c7d4cd; border-radius: 8px; text-align: center; }
.pasture-empty-state strong { color: #21443a; }

/* Public pasture application */
.pasture-public-shell {
    width: min(1120px, calc(100% - 48px));
    margin: 0 auto;
    padding: 54px 0 76px;
}
.pasture-public-intro {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    overflow: hidden;
    padding: 42px 46px;
    color: #fff;
    background: radial-gradient(circle at 85% 10%, rgba(231,169,40,.22), transparent 30%), linear-gradient(135deg, var(--public-forest-deep), var(--public-forest));
    border-radius: 16px 16px 0 0;
}
.pasture-public-intro::after { content: ""; position: absolute; right: -65px; bottom: -105px; width: 260px; height: 260px; opacity: .11; border: 32px double #fff; transform: rotate(30deg); }
.pasture-public-intro-copy { position: relative; z-index: 1; }
.pasture-public-intro .public-eyebrow { margin-bottom: 14px; }
.pasture-public-intro h1 { max-width: 720px; margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(36px, 5vw, 55px); font-weight: 500; line-height: 1.02; letter-spacing: -.04em; }
.pasture-public-intro-copy > p:not(.public-eyebrow) { max-width: 680px; margin: 18px 0 0; color: rgba(255,255,255,.72); line-height: 1.65; }
.pasture-public-meta { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 25px; }
.pasture-public-meta span { display: inline-flex; align-items: center; gap: 8px; color: rgba(255,255,255,.82); font-size: 13px; font-weight: 720; }
.pasture-public-meta svg { width: 18px; fill: none; stroke: var(--public-honey-light); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.pasture-public-price { position: relative; z-index: 1; display: grid; flex: 0 0 150px; place-items: center; padding: 22px 18px; color: var(--public-forest-deep); background: var(--public-honey-light); border-radius: 12px; box-shadow: 0 18px 34px rgba(0,20,15,.25); text-align: center; }
.pasture-public-price > span { font-size: 11px; font-weight: 850; letter-spacing: .11em; text-transform: uppercase; }
.pasture-public-price strong { margin-top: 7px; font-family: Georgia, serif; font-size: 32px; line-height: 1; }
.pasture-public-price strong small { font-family: inherit; font-size: 15px; }
.pasture-public-price em { margin-top: 5px; color: #6c551d; font-size: 12px; font-style: normal; }
.pasture-application-card { padding: 34px 38px 40px; background: var(--public-cream); border: 1px solid rgba(23,63,53,.14); border-top: 0; border-radius: 0 0 16px 16px; box-shadow: 0 30px 70px rgba(21,52,43,.12); }
.pasture-application-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 25px; padding-bottom: 26px; border-bottom: 1px solid var(--public-sage); }
.pasture-form-kicker { margin: 0 0 7px; color: #9a6810; font-size: 11px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.pasture-application-heading h2 { margin: 0; color: var(--public-forest-deep); font-size: 27px; letter-spacing: -.025em; }
.pasture-application-heading p:last-child { margin: 8px 0 0; color: var(--public-muted); font-size: 13px; }
.pasture-secure-note { display: inline-flex; align-items: center; gap: 7px; color: #3f6459; font-size: 12px; font-weight: 750; white-space: nowrap; }
.pasture-secure-note svg { width: 20px; fill: none; stroke: #a46d10; stroke-width: 1.6; }
.pasture-validation-summary:not(:empty) { margin-top: 20px; padding: 12px 14px; color: #842f26; background: #fff0ed; border: 1px solid #e7b6ae; border-radius: 7px; font-size: 13px; }
.pasture-validation-summary ul { margin: 0; padding-left: 18px; }
.pasture-application-layout { display: grid; grid-template-columns: minmax(0, 1fr) 285px; align-items: start; gap: 34px; margin-top: 30px; }
.pasture-form-main { display: grid; gap: 34px; }
.pasture-form-section { display: grid; grid-template-columns: 155px minmax(0, 1fr); gap: 24px; }
.pasture-form-section + .pasture-form-section { padding-top: 34px; border-top: 1px solid var(--public-sage); }
.pasture-form-section-heading { display: flex; align-items: flex-start; gap: 12px; }
.pasture-form-section-heading > span { display: grid; flex: 0 0 auto; place-items: center; width: 32px; height: 32px; color: var(--public-forest-deep); background: var(--public-honey-light); border-radius: 8px; font: 700 13px Georgia, serif; }
.pasture-form-section-heading h3 { margin: 1px 0 0; color: var(--public-forest-deep); font-size: 15px; }
.pasture-form-section-heading p { margin: 5px 0 0; color: var(--public-muted); font-size: 11px; line-height: 1.45; }
.pasture-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; }
.pasture-field-span-2 { grid-column: span 2; }
.pasture-public-field { display: grid; gap: 7px; }
.pasture-public-field label { color: #304b43; font-size: 13px; font-weight: 780; }
.pasture-public-field label b { color: #ae7111; }
.pasture-public-field label small { color: #82928c; font-weight: 500; }
.pasture-public-field input,
.pasture-public-field select,
.pasture-public-field textarea { width: 100%; min-height: 47px; padding: 0 13px; color: var(--public-ink); background: #fff; border: 1px solid #bfcfc7; border-radius: 7px; font: inherit; }
.pasture-public-field textarea { min-height: 104px; padding-top: 12px; resize: vertical; }
.pasture-public-field input::placeholder,
.pasture-public-field textarea::placeholder { color: #95a49e; }
.pasture-public-field input:focus,
.pasture-public-field select:focus,
.pasture-public-field textarea:focus { outline: 0; border-color: var(--public-forest-soft); box-shadow: 0 0 0 3px rgba(36,92,78,.12); }
.pasture-public-field > span { min-height: 14px; color: #a2352a; font-size: 11px; }
.pasture-summary-column { position: sticky; top: 22px; display: grid; gap: 13px; }
.pasture-summary-card { padding: 22px; color: #fff; background: var(--public-forest); border-radius: 11px; }
.pasture-summary-card .pasture-form-kicker { color: var(--public-honey-light); }
.pasture-summary-card h3 { margin: 0 0 20px; font-family: Georgia, serif; font-size: 23px; font-weight: 500; }
.pasture-summary-formula { display: grid; gap: 10px; padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,.15); }
.pasture-summary-formula div,
.pasture-summary-total { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.pasture-summary-formula span { color: rgba(255,255,255,.64); font-size: 12px; }
.pasture-summary-formula strong { font-size: 13px; }
.pasture-summary-total { padding: 17px 0 4px; }
.pasture-summary-total span { color: rgba(255,255,255,.76); font-weight: 720; }
.pasture-summary-total strong { color: var(--public-honey-light); font: 500 25px Georgia, serif; }
.pasture-summary-card > p:last-child { margin: 14px 0 0; color: rgba(255,255,255,.56); font-size: 11px; line-height: 1.5; }
.pasture-declaration-card { padding: 16px; background: #f2f6f2; border: 1px solid #d2dfd7; border-radius: 9px; }
.pasture-declaration-row { display: grid; grid-template-columns: 20px 1fr; gap: 10px; color: #536861; font-size: 11px; line-height: 1.5; cursor: pointer; }
.pasture-declaration-row input { width: 18px; height: 18px; margin-top: 1px; accent-color: var(--public-forest); }
.pasture-declaration-row strong { display: block; margin-bottom: 4px; color: var(--public-forest-deep); font-size: 12px; }
.pasture-declaration-card > span { display: block; margin-top: 6px; color: #a2352a; font-size: 11px; }
.pasture-submit-button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; width: 100%; min-height: 49px; padding: 0 18px; color: var(--public-forest-deep); background: var(--public-honey); border: 0; border-radius: 8px; box-shadow: 0 10px 20px rgba(23,63,53,.14); font: inherit; font-weight: 840; cursor: pointer; transition: transform 160ms ease, background 160ms ease; }
.pasture-submit-button:hover { background: var(--public-honey-light); transform: translateY(-1px); }
.pasture-submit-button svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 2; }
.pasture-submit-note { margin: -2px 6px 0; color: var(--public-muted); font-size: 10px; line-height: 1.45; text-align: center; }
.website-field { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; opacity: 0 !important; pointer-events: none !important; }

@media (max-width: 980px) {
    .pasture-settings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pasture-field-wide { grid-column: span 2; }
    .pasture-application-layout { grid-template-columns: 1fr; }
    .pasture-summary-column { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pasture-summary-column .pasture-submit-button,
    .pasture-summary-column .pasture-submit-note { grid-column: span 2; }
}

.admin-create-header {
    margin-bottom: 18px;
}

.admin-create-card {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    max-width: 920px;
    padding: 30px;
    background: #fff;
    border: 1px solid var(--portal-border, #d7ded8);
    border-radius: 12px;
    box-shadow: 0 18px 45px rgba(14, 55, 45, .08);
}

.admin-lookup-section {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}

.admin-step-number,
.admin-new-user-fields legend span {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: #f2b21b;
    color: #103d33;
    font-weight: 800;
    font-size: 13px;
}

.admin-step-content label {
    display: block;
    margin-bottom: 7px;
    font-weight: 750;
}

.admin-step-content input {
    width: 100%;
}

.admin-lookup-status {
    padding: 14px 16px;
    border: 1px solid #d9e1dc;
    border-radius: 9px;
    background: #f5f8f5;
    color: #466259;
    font-size: 14px;
}

.admin-lookup-status[data-state="existing"] {
    border-color: #9bc8b8;
    background: #eaf6f0;
    color: #164c3e;
}

.admin-lookup-status[data-state="new"] {
    border-color: #e5c870;
    background: #fff8df;
    color: #654d08;
}

.admin-lookup-status[data-state="error"] {
    border-color: #e1b0aa;
    background: #fff1ef;
    color: #7a3028;
}

.admin-new-user-fields {
    min-width: 0;
    margin: 0;
    padding: 22px;
    border: 1px solid #d9e1dc;
    border-radius: 10px;
    background: #fbfcfa;
}

.admin-new-user-fields[hidden] {
    display: none;
}

.admin-new-user-fields legend {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 8px;
    color: #103d33;
    font-size: 17px;
    font-weight: 800;
}

.admin-new-user-fields > p {
    margin: 0 0 18px;
    color: #687d75;
    font-size: 13px;
}

.admin-create-actions {
    padding-top: 4px;
    border-top: 1px solid #e3e8e4;
}

.member-admin-access {
    border-left: 4px solid #f2b21b;
}

@media (max-width: 760px) {
    .admin-create-card {
        grid-template-columns: 1fr;
        padding: 22px;
    }

    .admin-create-card .span-2 {
        grid-column: auto;
    }

    .admin-lookup-section {
        grid-template-columns: 1fr;
    }
    .pasture-admin-header,
    .pasture-url-heading,
    .pasture-form-actions,
    .pasture-season-heading { align-items: stretch; flex-direction: column; }
    .pasture-header-actions .button { flex: 1 1 auto; }
    .pasture-settings-grid { grid-template-columns: 1fr; }
    .pasture-field-wide { grid-column: auto; }
    .pasture-url-preview { align-items: stretch; flex-direction: column; }
    .pasture-slug-control { align-items: stretch; flex-direction: column; }
    .pasture-slug-control > span { overflow: hidden; min-height: 38px; border-right: 1px solid #bac9c2; border-bottom: 0; border-radius: 7px 7px 0 0; text-overflow: ellipsis; }
    .pasture-slug-control input { border-radius: 0 0 7px 7px; }
    .pasture-public-shell { width: min(100% - 28px, 1120px); padding: 28px 0 50px; }
    .pasture-public-intro { align-items: flex-start; flex-direction: column; padding: 34px 26px; }
    .pasture-public-price { grid-template-columns: auto auto auto; justify-content: start; gap: 8px; width: 100%; padding: 15px 17px; }
    .pasture-public-price strong { margin: 0; font-size: 25px; }
    .pasture-public-price em { margin: 0; }
    .pasture-application-card { padding: 27px 22px 32px; }
    .pasture-application-heading { flex-direction: column; }
    .pasture-form-section { grid-template-columns: 1fr; }
    .pasture-form-section-heading p { max-width: 340px; }
    .pasture-summary-column { grid-template-columns: 1fr; }
    .pasture-summary-column .pasture-submit-button,
    .pasture-summary-column .pasture-submit-note { grid-column: auto; }
}

@media (max-width: 540px) {
    .pasture-card-heading,
    .pasture-settings-form { padding-left: 17px; padding-right: 17px; }
    .pasture-form-actions { margin-left: -17px; margin-right: -17px; padding-left: 17px; padding-right: 17px; }
    .pasture-form-grid { grid-template-columns: 1fr; }
    .pasture-field-span-2 { grid-column: auto; }
}

/* Public CEBELICA site */
.public-page {
    --public-forest: #173f35;
    --public-forest-deep: #0d2d27;
    --public-forest-soft: #245c4e;
    --public-honey: #e7a928;
    --public-honey-light: #f3c65f;
    --public-ivory: #f8f5ec;
    --public-cream: #fffdf7;
    --public-sage: #dce6da;
    --public-ink: #18302a;
    --public-muted: #60736d;
    min-width: 320px;
    color: var(--public-ink);
    background: var(--public-ivory);
    font-size: 16px;
}

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

.public-skip-link {
    position: fixed;
    z-index: 100;
    top: 10px;
    left: 10px;
    padding: 10px 14px;
    color: #fff;
    background: var(--public-forest-deep);
    border-radius: 6px;
    transform: translateY(-150%);
}

.public-skip-link:focus { transform: translateY(0); }

.public-header {
    position: relative;
    z-index: 20;
    background: rgba(248, 245, 236, 0.96);
    border-bottom: 1px solid rgba(23, 63, 53, 0.12);
}

.public-header-inner,
.public-footer-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
}

.public-header-inner { min-height: 76px; }

.public-brand {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    color: var(--public-forest-deep);
    font-size: 16px;
    font-weight: 850;
    letter-spacing: 0.13em;
    text-decoration: none;
}

.public-brand-mark {
    width: 34px;
    height: 34px;
    overflow: visible;
    fill: var(--public-honey);
    stroke: var(--public-forest-deep);
    stroke-width: 1.3;
    stroke-linecap: round;
}

.public-brand-mark path + path { fill: none; stroke: rgba(13, 45, 39, 0.7); }

.public-nav { display: flex; align-items: center; gap: 24px; }

.public-nav-link,
.public-text-link {
    color: var(--public-forest-deep);
    font-weight: 720;
    text-decoration: none;
}

.public-nav-link:hover,
.public-text-link:hover { color: #9a6810; }

.public-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 48px;
    padding: 0 22px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.public-button-small { min-height: 42px; padding: 0 18px; color: #fff; background: var(--public-forest); }
.public-button-primary { color: var(--public-forest-deep); background: var(--public-honey); box-shadow: 0 10px 24px rgba(8, 32, 27, 0.22); }
.public-button:hover { transform: translateY(-2px); }
.public-button-small:hover { color: #fff; background: var(--public-forest-soft); }
.public-button-primary:hover { color: var(--public-forest-deep); background: var(--public-honey-light); }
.public-button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; }

.public-page a:focus-visible,
.public-page button:focus-visible,
.public-page input:focus-visible {
    outline: 3px solid var(--public-honey);
    outline-offset: 3px;
}

.public-main { overflow: hidden; }

.public-hero {
    position: relative;
    isolation: isolate;
    min-height: 650px;
    color: #fff;
    background:
        radial-gradient(circle at 76% 26%, rgba(73, 130, 111, 0.3), transparent 25%),
        linear-gradient(135deg, var(--public-forest-deep), var(--public-forest));
}

.public-hero-inner {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(430px, 0.98fr);
    align-items: center;
    gap: clamp(42px, 7vw, 96px);
    width: min(1180px, calc(100% - 48px));
    min-height: 650px;
    margin: 0 auto;
    padding: 72px 0 84px;
}

.public-eyebrow,
.public-kicker {
    margin: 0 0 18px;
    color: var(--public-honey-light);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.public-eyebrow { display: flex; align-items: center; gap: 10px; }
.public-eyebrow span { width: 30px; height: 1px; background: var(--public-honey); }

.public-hero h1 {
    max-width: 690px;
    margin: 0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(44px, 5.2vw, 72px);
    font-weight: 500;
    line-height: 0.99;
    letter-spacing: -0.045em;
}

.public-hero h1 em { color: var(--public-honey-light); font-style: normal; }

.public-hero-lead {
    max-width: 620px;
    margin: 28px 0 0;
    color: rgba(255, 255, 255, 0.76);
    font-size: 18px;
    line-height: 1.7;
}

.public-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; margin-top: 34px; }
.public-hero .public-text-link { color: #fff; }
.public-hero .public-text-link:hover { color: var(--public-honey-light); }

.public-hero-note {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 30px;
    color: rgba(255, 255, 255, 0.62);
    font-size: 13px;
}

.public-hero-note svg { width: 20px; height: 20px; fill: none; stroke: var(--public-honey-light); stroke-width: 1.6; }

.public-product-preview { position: relative; min-height: 430px; perspective: 1000px; }
.public-preview-glow { position: absolute; inset: 5% 4%; background: rgba(231, 169, 40, 0.16); filter: blur(55px); border-radius: 50%; }

.public-preview-window {
    position: absolute;
    inset: 30px 0 20px 20px;
    overflow: hidden;
    color: var(--public-ink);
    background: #fdfcf8;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 14px;
    box-shadow: 0 35px 80px rgba(0, 14, 11, 0.42);
    transform: rotateY(-4deg) rotateX(1deg);
}

.public-preview-bar { display: flex; align-items: center; justify-content: space-between; min-height: 56px; padding: 0 18px; border-bottom: 1px solid #e4e8e2; }
.public-preview-mini-brand { display: flex; align-items: center; gap: 7px; font-size: 9px; font-weight: 850; letter-spacing: 0.1em; }
.public-preview-mini-brand span { width: 16px; height: 18px; background: var(--public-honey); clip-path: polygon(50% 0, 100% 24%, 100% 76%, 50% 100%, 0 76%, 0 24%); }
.public-preview-avatar { width: 28px; height: 28px; border-radius: 50%; background: #d8e4dc; }
.public-preview-body { display: grid; grid-template-columns: 58px 1fr; min-height: 350px; }
.public-preview-sidebar { display: flex; flex-direction: column; align-items: center; gap: 18px; padding-top: 23px; background: #163f35; }
.public-preview-sidebar i { display: block; width: 18px; height: 5px; border-radius: 4px; background: rgba(255,255,255,0.34); }
.public-preview-sidebar i.active { height: 18px; background: var(--public-honey); clip-path: polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%); }
.public-preview-content { padding: 24px; }
.public-preview-heading { display: grid; gap: 8px; }
.public-preview-heading span { display: block; width: 130px; height: 10px; border-radius: 5px; background: #1c473c; }
.public-preview-heading span + span { width: 205px; height: 5px; background: #dce4df; }
.public-preview-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 23px; }
.public-preview-metrics div { display: grid; gap: 5px; padding: 13px; border: 1px solid #e0e6e1; border-radius: 7px; background: #fff; }
.public-preview-metrics small { color: #80918b; font-size: 7px; font-weight: 800; letter-spacing: 0.08em; }
.public-preview-metrics strong { color: #173f35; font-size: 20px; }
.public-preview-metrics span { width: 65%; height: 4px; border-radius: 3px; background: #e7eee9; }
.public-preview-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 12px; margin-top: 14px; }
.public-preview-list, .public-preview-chart { min-height: 150px; padding: 13px; border: 1px solid #e0e6e1; border-radius: 7px; background: #fff; }
.public-preview-list { display: grid; align-content: start; gap: 12px; }
.public-preview-list div { display: grid; grid-template-columns: 20px 1fr 35px; align-items: center; gap: 8px; }
.public-preview-list b { width: 20px; height: 20px; border-radius: 50%; background: #d9e8df; }
.public-preview-list span { height: 5px; border-radius: 3px; background: #dfe6e2; }
.public-preview-list em { height: 5px; border-radius: 3px; background: #f1cd77; }
.public-preview-chart { display: flex; align-items: end; justify-content: center; gap: 7px; }
.public-preview-chart span { width: 13px; height: 35%; border-radius: 3px 3px 0 0; background: #c8dbd0; }
.public-preview-chart span:nth-child(2) { height: 60%; }
.public-preview-chart span:nth-child(3) { height: 48%; }
.public-preview-chart span:nth-child(4) { height: 78%; background: var(--public-honey); }
.public-preview-chart span:nth-child(5) { height: 67%; }

.public-preview-chip {
    position: absolute;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 14px;
    color: #21443a;
    background: #fff;
    border: 1px solid rgba(23, 63, 53, 0.12);
    border-radius: 8px;
    box-shadow: 0 16px 35px rgba(0, 20, 16, 0.25);
    font-size: 11px;
    font-weight: 760;
}

.public-preview-chip span { display: grid; place-items: center; width: 24px; height: 24px; color: #fff; background: var(--public-forest-soft); border-radius: 50%; font-size: 10px; }
.public-preview-chip-top { top: 0; right: -20px; }
.public-preview-chip-bottom { bottom: 0; left: -10px; }
.public-preview-chip-bottom span { color: var(--public-forest-deep); background: var(--public-honey-light); }

.public-honeycomb {
    position: absolute;
    z-index: 1;
    right: -120px;
    bottom: -100px;
    width: 390px;
    height: 390px;
    opacity: 0.1;
    background: repeating-linear-gradient(60deg, transparent 0 30px, #fff 31px 32px);
    transform: rotate(12deg);
    mask-image: radial-gradient(circle, #000, transparent 70%);
}

.public-section { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.public-capabilities-section { padding: 104px 0; }
.public-section-heading { max-width: 680px; margin-bottom: 48px; }
.public-section-heading .public-kicker,
.public-workspaces .public-kicker,
.public-closing .public-kicker { color: #9a6810; }
.public-section-heading h2,
.public-workspaces h2,
.public-closing h2 { margin: 0; color: var(--public-forest-deep); font-family: Georgia, "Times New Roman", serif; font-size: clamp(34px, 4vw, 50px); font-weight: 500; line-height: 1.08; letter-spacing: -0.035em; }
.public-section-heading > p:last-child,
.public-workspaces-intro > p:last-child,
.public-closing div > p:last-child { color: var(--public-muted); line-height: 1.7; }
.public-section-heading > p:last-child { max-width: 580px; margin: 20px 0 0; }

.public-capabilities { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.public-capability-card { position: relative; min-height: 292px; padding: 27px 24px; background: rgba(255,255,255,0.58); border: 1px solid var(--public-sage); border-radius: 10px; }
.public-capability-card > span { position: absolute; top: 27px; right: 24px; color: #9aad9f; font-family: Georgia, serif; font-size: 13px; }
.public-capability-icon { display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: 46px; color: var(--public-forest); background: #e8eee7; border-radius: 9px; }
.public-capability-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.public-capability-card h3 { margin: 0 0 12px; color: var(--public-forest-deep); font-size: 19px; }
.public-capability-card p { margin: 0; color: var(--public-muted); font-size: 14px; line-height: 1.65; }
.public-capability-card-accent { color: #fff; background: var(--public-forest); border-color: var(--public-forest); }
.public-capability-card-accent > span { color: rgba(255,255,255,0.48); }
.public-capability-card-accent .public-capability-icon { color: var(--public-forest-deep); background: var(--public-honey); }
.public-capability-card-accent h3 { color: #fff; }
.public-capability-card-accent p { color: rgba(255,255,255,0.72); }

.public-workspaces { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: clamp(50px, 10vw, 130px); padding: 92px clamp(30px, 6vw, 74px); color: #fff; background: var(--public-forest-deep); border-radius: 16px; }
.public-workspaces h2 { color: #fff; }
.public-workspaces-intro > p:last-child { color: rgba(255,255,255,0.65); }
.public-workspace-list { display: grid; align-content: center; }
.public-workspace-list article { display: grid; grid-template-columns: 52px 1fr; gap: 20px; padding: 29px 0; border-top: 1px solid rgba(255,255,255,0.15); }
.public-workspace-list article:last-child { border-bottom: 1px solid rgba(255,255,255,0.15); }
.public-workspace-number { color: var(--public-honey-light); font-family: Georgia, serif; font-size: 18px; }
.public-workspace-list h3 { margin: 0 0 8px; font-size: 20px; }
.public-workspace-list p { margin: 0; color: rgba(255,255,255,0.64); font-size: 14px; line-height: 1.65; }

.public-closing { display: flex; align-items: center; justify-content: space-between; gap: 40px; padding: 100px 0; }
.public-closing div { max-width: 700px; }
.public-closing div > p:last-child { margin: 18px 0 0; }
.public-closing .public-button { flex: 0 0 auto; box-shadow: none; }

.public-footer { color: rgba(255,255,255,0.7); background: var(--public-forest-deep); }
.public-footer-inner { min-height: 92px; font-size: 13px; }
.public-footer-brand { color: var(--public-honey-light); font-weight: 850; letter-spacing: 0.13em; }

.public-login-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(380px, 470px);
    align-items: center;
    gap: clamp(56px, 10vw, 140px);
    width: min(1080px, calc(100% - 48px));
    min-height: calc(100vh - 168px);
    margin: 0 auto;
    padding: 72px 0;
}

.public-login-intro { position: relative; }
.public-login-intro::after {
    content: "";
    position: absolute;
    z-index: -1;
    top: -90px;
    left: -150px;
    width: 330px;
    height: 330px;
    opacity: 0.32;
    background: radial-gradient(circle, rgba(231, 169, 40, 0.26), transparent 68%);
}

.public-login-intro .public-eyebrow { color: #9a6810; }
.public-login-intro .public-eyebrow span { background: #b47a15; }
.public-login-intro h1 {
    max-width: 650px;
    margin: 0;
    color: var(--public-forest-deep);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(42px, 5vw, 62px);
    font-weight: 500;
    line-height: 1.02;
    letter-spacing: -0.045em;
}

.public-login-intro > p:not(.public-eyebrow) { max-width: 540px; margin: 24px 0 0; color: var(--public-muted); font-size: 17px; line-height: 1.7; }
.public-login-trust { display: flex; flex-wrap: wrap; gap: 16px 26px; margin: 34px 0 0; padding: 0; list-style: none; }
.public-login-trust li { display: flex; align-items: center; gap: 8px; color: #435c54; font-size: 13px; font-weight: 720; }
.public-login-trust svg { width: 20px; height: 20px; fill: none; stroke: #a46d10; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

.public-login-card-wrap { display: grid; gap: 20px; }
.public-login-card {
    padding: 38px;
    background: var(--public-cream);
    border: 1px solid rgba(23, 63, 53, 0.14);
    border-top: 4px solid var(--public-honey);
    border-radius: 12px;
    box-shadow: 0 26px 65px rgba(21, 52, 43, 0.13);
}

.public-login-card-heading { margin-bottom: 28px; }
.public-login-card-heading > span { display: block; margin-bottom: 10px; color: #a46d10; font-size: 11px; font-weight: 850; letter-spacing: 0.16em; }
.public-login-card-heading h2 { margin: 0; color: var(--public-forest-deep); font-size: 29px; letter-spacing: -0.025em; }
.public-login-card-heading p { margin: 8px 0 0; color: var(--public-muted); font-size: 14px; }
.public-login-card form { display: grid; gap: 18px; }
.public-login-card .field { display: grid; gap: 7px; }
.public-login-card .field label { color: #304b43; font-size: 13px; font-weight: 780; }
.public-login-card .field input {
    width: 100%;
    min-height: 48px;
    padding: 0 13px;
    color: var(--public-ink);
    background: #fff;
    border: 1px solid #bfcfc7;
    border-radius: 7px;
    font: inherit;
}
.public-login-card .field input::placeholder { color: #91a19b; }
.public-login-card .field input:focus { border-color: var(--public-forest-soft); box-shadow: 0 0 0 3px rgba(36, 92, 78, 0.12); }
.public-login-card .field span { color: #a2352a; font-size: 12px; }
.public-login-card .validation:not(:empty) { padding: 11px 13px; color: #842f26; background: #fff0ed; border: 1px solid #e7b6ae; border-radius: 7px; font-size: 13px; }
.public-login-card .validation ul { margin: 0; padding-left: 18px; }

.public-login-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    min-height: 48px;
    margin-top: 4px;
    padding: 0 20px;
    color: #fff;
    background: var(--public-forest);
    border: 1px solid var(--public-forest);
    border-radius: 7px;
    font: inherit;
    font-weight: 820;
    cursor: pointer;
    transition: transform 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}
.public-login-submit:hover { background: var(--public-forest-soft); box-shadow: 0 10px 24px rgba(23, 63, 53, 0.2); transform: translateY(-1px); }
.public-login-submit svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; }
.public-login-help { margin: 22px 0 0; padding-top: 18px; color: var(--public-muted); border-top: 1px solid var(--public-sage); font-size: 12px; line-height: 1.55; text-align: center; }
.public-login-back { display: inline-flex; align-items: center; justify-self: center; min-height: 44px; color: var(--public-forest); font-size: 13px; font-weight: 750; text-decoration: none; }
.public-login-back:hover { color: #9a6810; }

@media (max-width: 980px) {
    .public-hero-inner { grid-template-columns: 1fr; padding-bottom: 100px; }
    .public-hero-copy { max-width: 760px; }
    .public-product-preview { width: min(620px, 94%); margin: 0 auto; }
    .public-capabilities { grid-template-columns: repeat(2, 1fr); }
    .public-workspaces { grid-template-columns: 1fr; }
    .public-login-shell { grid-template-columns: 1fr; max-width: 650px; gap: 45px; padding: 58px 0 72px; }
    .public-login-intro { text-align: center; }
    .public-login-intro h1,
    .public-login-intro > p:not(.public-eyebrow) { margin-left: auto; margin-right: auto; }
    .public-login-intro .public-eyebrow,
    .public-login-trust { justify-content: center; }
}

@media (max-width: 760px) {
    .public-header-inner,
    .public-footer-inner,
    .public-hero-inner,
    .public-section { width: min(100% - 32px, 1180px); }
    .public-header-inner { min-height: 68px; }
    .public-nav { gap: 10px; }
    .public-nav-link { display: none; }
    .public-button-small { min-height: 40px; padding: 0 13px; font-size: 13px; }
    .public-hero-inner { min-height: auto; padding: 64px 0 78px; }
    .public-hero h1 { font-size: clamp(40px, 13vw, 58px); }
    .public-hero-lead { font-size: 16px; }
    .public-product-preview { min-height: 350px; width: 100%; }
    .public-preview-window { inset: 25px 0 15px; transform: none; }
    .public-preview-chip-top { right: -8px; }
    .public-preview-chip-bottom { left: -6px; }
    .public-preview-body { grid-template-columns: 42px 1fr; min-height: 290px; }
    .public-preview-content { padding: 17px; }
    .public-preview-metrics div { padding: 9px; }
    .public-preview-metrics strong { font-size: 16px; }
    .public-preview-grid { grid-template-columns: 1fr; }
    .public-preview-chart { display: none; }
    .public-capabilities-section { padding: 76px 0; }
    .public-capabilities { grid-template-columns: 1fr; }
    .public-capability-card { min-height: 240px; }
    .public-workspaces { padding: 64px 24px; border-radius: 12px; }
    .public-closing { align-items: flex-start; flex-direction: column; padding: 76px 0; }
    .public-footer-inner { align-items: flex-start; flex-direction: column; justify-content: center; gap: 7px; }
    .public-login-shell { width: min(100% - 32px, 650px); padding-top: 45px; }
    .public-login-intro h1 { font-size: clamp(36px, 11vw, 48px); }
    .public-login-intro > p:not(.public-eyebrow) { font-size: 15px; }
    .public-login-trust { display: grid; justify-content: center; }
    .public-login-card { padding: 30px 24px; }
}

@media (max-width: 420px) {
    .public-brand { gap: 7px; font-size: 14px; letter-spacing: 0.09em; }
    .public-brand-mark { width: 29px; height: 29px; }
    .public-hero-actions { align-items: flex-start; flex-direction: column; }
    .public-preview-chip { font-size: 9px; }
}

@media (prefers-reduced-motion: reduce) {
    .public-page *,
    .public-page *::before,
    .public-page *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

.topbar {
    display: flex;
    align-items: center;
    gap: 22px;
    min-height: 58px;
    padding: 0 28px;
    background: #ffffff;
    border-bottom: 1px solid #d8dee6;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.brand {
    color: #0f1f2e;
    font-size: 18px;
    font-weight: 800;
    text-decoration: none;
}

.nav {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.nav a {
    padding: 8px 10px;
    color: #435466;
    border-radius: 6px;
    text-decoration: none;
}

.nav a:hover {
    background: #eef3f8;
    color: #17202a;
}

.logout-form {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
}

.logout-form span {
    color: #526170;
}

.logout-form button {
    min-height: 30px;
}

.topbar-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-left: auto;
}

.context-switch {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px;
    border: 1px solid #d8dee6;
    border-radius: 8px;
    background: #f8fafc;
}

.context-switch a {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 6px;
    color: #435466;
    font-size: 13px;
    font-weight: 750;
    text-decoration: none;
    white-space: nowrap;
}

.context-switch a:hover {
    background: #eef3f8;
    color: #102033;
}

.context-switch a.active {
    background: #14748a;
    color: #ffffff;
}

.context-back-link {
    margin-left: auto;
    color: #0f5f73;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
}

.context-back-link:hover {
    text-decoration: underline;
}

.work-context-form {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
}

.work-context-label {
    color: #526170;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0;
}

.work-context-select {
    min-width: 230px;
    min-height: 34px;
    padding: 0 34px 0 10px;
    border: 1px solid #c5d0dc;
    border-radius: 6px;
    background: #ffffff;
    color: #17202a;
    font: inherit;
}

.society-context-bar {
    border-bottom: 1px solid #d8dee6;
    background: linear-gradient(90deg, #eef8fb, #ffffff);
}

.society-context-inner {
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: 1200px;
    min-height: 38px;
    margin: 0 auto;
    padding: 0 28px;
}

.society-context-inner span {
    color: #0f5f73;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0;
}

.society-context-inner strong {
    color: #102033;
    font-size: 14px;
}

.society-context-empty {
    background: #f8fafc;
}

/* Authenticated CEBELICA portal */
.portal-shell {
    --portal-forest: #173f35;
    --portal-forest-deep: #0d2d27;
    --portal-forest-soft: #245c4e;
    --portal-honey: #e7a928;
    --portal-honey-light: #f3c65f;
    --portal-wax: #f8f5ec;
    --portal-cream: #fffdf7;
    --portal-sage: #dce6da;
    --portal-ink: #18302a;
    --portal-muted: #60736d;
    min-width: 320px;
    color: var(--portal-ink);
    background:
        radial-gradient(circle at 96% 12%, rgba(231, 169, 40, 0.08), transparent 22rem),
        #f5f6f2;
}

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

.portal-skip-link {
    position: fixed;
    z-index: 1000;
    top: 10px;
    left: 10px;
    padding: 11px 16px;
    color: #fff;
    background: var(--portal-forest-deep, #0d2d27);
    border-radius: 7px;
    font-weight: 800;
    text-decoration: none;
    transform: translateY(-160%);
}

.portal-skip-link:focus { transform: translateY(0); }

.portal-header {
    position: relative;
    z-index: 30;
    color: #fff;
    background: var(--portal-forest-deep);
    box-shadow: 0 8px 26px rgba(13, 45, 39, 0.14);
}

.portal-utility,
.portal-primary-nav-inner {
    width: min(1440px, calc(100% - 48px));
    margin: 0 auto;
}

.portal-utility {
    display: flex;
    align-items: center;
    gap: 22px;
    min-height: 72px;
}

.portal-brand {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 10px;
    color: #fff;
    font-size: 16px;
    font-weight: 860;
    letter-spacing: 0.13em;
    text-decoration: none;
}

.portal-brand-mark {
    width: 31px;
    height: 34px;
    overflow: visible;
    fill: var(--portal-honey);
    stroke: var(--portal-forest-deep);
    stroke-linecap: round;
    stroke-width: 1.35;
}

.portal-brand-mark path + path { fill: none; stroke: rgba(13, 45, 39, 0.7); }

.portal-utility-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    min-width: 0;
    margin-left: auto;
}

.portal-shell .context-switch {
    border-color: rgba(255, 255, 255, 0.17);
    background: rgba(255, 255, 255, 0.07);
}

.portal-shell .context-switch a { min-height: 34px; color: rgba(255, 255, 255, 0.75); }
.portal-shell .context-switch a:hover { color: #fff; background: rgba(255, 255, 255, 0.1); }
.portal-shell .context-switch a.active { color: var(--portal-forest-deep); background: var(--portal-honey); }

.portal-shell .work-context-label,
.portal-shell .logout-form span { color: rgba(255, 255, 255, 0.64); }

.portal-shell .work-context-select {
    min-height: 40px;
    color: #fff;
    border-color: rgba(255, 255, 255, 0.22);
    background: #183f36;
}

.portal-shell .work-context-select option { color: var(--portal-ink); background: #fff; }

.portal-account-link {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 13px;
    font-weight: 750;
    text-decoration: none;
}

.portal-account-link:hover { color: var(--portal-honey-light); }

.portal-logout {
    min-height: 40px;
    padding-inline: 14px;
    color: #fff;
    border-color: rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.08);
}

.portal-logout:hover { color: var(--portal-forest-deep); border-color: var(--portal-honey); background: var(--portal-honey); }

.portal-menu-toggle { display: none; }

.portal-primary-nav {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    background: var(--portal-forest);
}

.portal-primary-nav-inner {
    display: flex;
    align-items: stretch;
    gap: 10px;
    min-height: 53px;
}

.portal-nav-group-label {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    padding: 0 10px 0 0;
    color: var(--portal-honey-light);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.portal-nav-group {
    display: flex;
    align-items: stretch;
    min-width: 0;
}

.portal-nav-group a {
    position: relative;
    display: inline-flex;
    align-items: center;
    min-height: 53px;
    padding: 0 11px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 13px;
    font-weight: 720;
    text-decoration: none;
    white-space: nowrap;
}

.portal-nav-group a:hover { color: #fff; background: rgba(255, 255, 255, 0.07); }

.portal-nav-group a.active { color: #fff; }
.portal-nav-group a.active::after {
    content: "";
    position: absolute;
    right: 11px;
    bottom: 0;
    left: 11px;
    height: 3px;
    background: var(--portal-honey);
    border-radius: 3px 3px 0 0;
}

.portal-shell .society-context-bar {
    border-bottom-color: rgba(23, 63, 53, 0.12);
    background: var(--portal-wax);
}

.portal-shell .society-context-inner {
    max-width: 1440px;
    min-height: 42px;
    padding-inline: 24px;
}

.portal-shell .society-context-inner span { color: #8b6317; letter-spacing: 0.08em; }
.portal-shell .society-context-inner strong { color: var(--portal-forest-deep); }
.portal-shell .context-back-link { color: var(--portal-forest); }

.portal-shell .page {
    max-width: 1440px;
    padding: 36px 24px 64px;
}

.portal-hero {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px;
    align-items: center;
    min-height: 280px;
    overflow: hidden;
    padding: clamp(38px, 5vw, 66px);
    color: #fff;
    background:
        radial-gradient(circle at 78% 15%, rgba(82, 139, 119, 0.32), transparent 24rem),
        linear-gradient(135deg, var(--portal-forest-deep), var(--portal-forest));
    border-radius: 14px;
    box-shadow: 0 24px 54px rgba(13, 45, 39, 0.16);
}

.portal-hero-personal {
    background:
        radial-gradient(circle at 76% 25%, rgba(231, 169, 40, 0.17), transparent 23rem),
        linear-gradient(135deg, #163c34, #245c4e);
}

.portal-hero-copy { position: relative; z-index: 2; max-width: 760px; }
.portal-eyebrow,
.portal-kicker {
    margin: 0 0 13px;
    color: var(--portal-honey-light);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.portal-eyebrow { display: flex; align-items: center; gap: 10px; }
.portal-eyebrow span { width: 28px; height: 1px; background: var(--portal-honey); }
.portal-hero h1 {
    margin: 0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(38px, 5vw, 60px);
    font-weight: 500;
    line-height: 1.02;
    letter-spacing: -0.04em;
}

.portal-hero-copy > p:last-child {
    max-width: 680px;
    margin: 20px 0 0;
    color: rgba(255, 255, 255, 0.7);
    font-size: 16px;
    line-height: 1.7;
}

.portal-hero-mark {
    position: relative;
    justify-self: end;
    width: 210px;
    height: 190px;
    opacity: 0.42;
}

.portal-hero-mark span {
    position: absolute;
    width: 72px;
    height: 80px;
    border: 2px solid rgba(243, 198, 95, 0.72);
    clip-path: polygon(50% 0, 100% 24%, 100% 76%, 50% 100%, 0 76%, 0 24%);
}

.portal-hero-mark span:nth-child(1) { top: 0; left: 69px; }
.portal-hero-mark span:nth-child(2) { top: 55px; left: 0; }
.portal-hero-mark span:nth-child(3) { top: 55px; left: 138px; }
.portal-hero-mark span:nth-child(4) { top: 110px; left: 69px; }
.portal-hero-mark span:nth-child(5) { top: 0; left: 207px; }
.portal-hero-mark span:nth-child(6) { top: 110px; left: -69px; }
.portal-hero-mark span:nth-child(7) { top: 110px; left: 207px; }

.portal-hero-bee { transform: rotate(6deg); }
.portal-hero-bee span:nth-child(odd) { background: rgba(231, 169, 40, 0.14); }

.portal-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 32px;
    margin: 48px 0 22px;
}

.portal-section-heading h2,
.portal-card-heading h2 {
    margin: 0;
    color: var(--portal-forest-deep);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 30px;
    font-weight: 600;
    letter-spacing: -0.025em;
}

.portal-section-heading .portal-kicker,
.portal-card-heading .portal-kicker { color: #9a6810; }
.portal-section-heading > p { max-width: 430px; margin: 0; color: var(--portal-muted); line-height: 1.6; text-align: right; }

.portal-quick-actions {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}

.portal-personal-actions { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.portal-action-card {
    position: relative;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    min-height: 255px;
    padding: 24px 22px;
    color: var(--portal-ink);
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid var(--portal-sage);
    border-radius: 10px;
    text-decoration: none;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.portal-action-card:hover {
    color: var(--portal-ink);
    border-color: #afc5b8;
    box-shadow: 0 16px 34px rgba(13, 45, 39, 0.1);
    transform: translateY(-3px);
}

.portal-action-card-featured { color: #fff; background: var(--portal-forest); border-color: var(--portal-forest); }
.portal-action-card-featured:hover { color: #fff; border-color: var(--portal-forest-soft); background: var(--portal-forest-soft); }
.portal-action-index { position: absolute; top: 22px; right: 20px; color: #92a69d; font-family: Georgia, serif; font-size: 12px; }
.portal-action-card-featured .portal-action-index { color: rgba(255, 255, 255, 0.45); }
.portal-action-icon {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    margin-bottom: 34px;
    color: var(--portal-forest);
    background: #e8eee7;
    border-radius: 9px;
}

.portal-action-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.portal-action-card-featured .portal-action-icon { color: var(--portal-forest-deep); background: var(--portal-honey); }
.portal-action-card strong { margin-bottom: 9px; font-size: 18px; }
.portal-action-card > span:not(.portal-action-index):not(.portal-action-icon) { color: var(--portal-muted); font-size: 13px; line-height: 1.55; }
.portal-action-card-featured > span:not(.portal-action-index):not(.portal-action-icon) { color: rgba(255, 255, 255, 0.68); }
.portal-action-card em { margin-top: auto; padding-top: 24px; color: #9a6810; font-size: 12px; font-style: normal; font-weight: 820; }
.portal-action-card-featured em { color: var(--portal-honey-light); }

.portal-content-card {
    margin-top: 42px;
    padding: 28px;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid var(--portal-sage);
    border-radius: 11px;
    box-shadow: 0 8px 22px rgba(13, 45, 39, 0.05);
}

.portal-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.portal-card-heading .portal-kicker { margin-bottom: 7px; }
.portal-shell .button { min-height: 42px; border-color: var(--portal-forest); background: var(--portal-forest); border-radius: 7px; }
.portal-shell .button:hover { border-color: var(--portal-forest-soft); background: var(--portal-forest-soft); }
.portal-shell .button.secondary { color: var(--portal-forest); border-color: #b9c9c0; background: #fff; }
.portal-shell .button.secondary:hover { border-color: var(--portal-forest); background: #eef3ef; }

.portal-table-wrap { overflow-x: auto; border: 1px solid var(--portal-sage); border-radius: 8px; }
.portal-shell .portal-table-wrap .data-table { border: 0; box-shadow: none; }
.portal-shell .data-table th { color: #385249; background: #eef2ec; }
.portal-shell .data-table td { border-bottom-color: #e7ece7; }
.portal-shell .data-table tbody tr:hover { background: #fffaf0; }
.portal-row-link { color: var(--portal-forest); font-weight: 800; text-decoration: none; white-space: nowrap; }
.portal-row-link:hover { color: #93620c; }
.portal-status { display: inline-flex; align-items: center; min-height: 26px; padding: 0 9px; color: #6c756f; background: #edf0ed; border-radius: 999px; font-size: 11px; font-weight: 800; }
.portal-status.is-active { color: #17633f; background: #e1f2e7; }
.portal-empty-state { padding: 30px; color: var(--portal-muted); background: var(--portal-wax); border: 1px dashed #c9d4ca; border-radius: 8px; text-align: center; }
.portal-empty-state strong { color: var(--portal-forest-deep); font-size: 17px; }
.portal-empty-state p { margin: 8px 0 0; }

.portal-shell a:focus-visible,
.portal-shell button:focus-visible,
.portal-shell input:focus-visible,
.portal-shell select:focus-visible,
.portal-shell textarea:focus-visible {
    outline: 3px solid var(--portal-honey);
    outline-offset: 3px;
}

@media (max-width: 1180px) {
    .portal-user-name,
    .portal-shell .work-context-label { display: none; }
    .portal-nav-group a { padding-inline: 8px; font-size: 12px; }
    .portal-quick-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .portal-personal-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 980px) {
    .portal-utility-actions { gap: 8px; }
    .portal-shell .work-context-select { min-width: 170px; }
    .portal-shell .context-switch a { padding-inline: 8px; }
}

@media (max-width: 760px) {
    .portal-utility,
    .portal-primary-nav-inner { width: min(100% - 32px, 1440px); }

    .portal-utility { min-height: 66px; }
    .portal-brand { font-size: 14px; }
    .portal-brand-mark { width: 28px; height: 31px; }

    .portal-menu-toggle {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        min-height: 44px;
        margin-left: auto;
        color: #fff;
        border-color: rgba(255, 255, 255, 0.22);
        background: rgba(255, 255, 255, 0.08);
    }

    .portal-menu-toggle:hover { color: var(--portal-forest-deep); border-color: var(--portal-honey); background: var(--portal-honey); }
    .portal-menu-icon { display: grid; gap: 3px; }
    .portal-menu-icon i { display: block; width: 17px; height: 2px; background: currentColor; border-radius: 2px; }

    .portal-utility-actions {
        display: none;
        position: absolute;
        top: 66px;
        right: 0;
        left: 0;
        align-items: stretch;
        flex-direction: column;
        padding: 16px;
        background: var(--portal-forest-deep);
        border-top: 1px solid rgba(255, 255, 255, 0.1);
    }

    .portal-header.menu-open .portal-utility-actions { display: flex; }
    .portal-shell .context-switch { width: 100%; }
    .portal-shell .context-switch a { justify-content: center; flex: 1; min-height: 44px; }
    .portal-shell .work-context-form { align-items: stretch; flex-direction: column; }
    .portal-shell .work-context-select { width: 100%; min-height: 44px; }
    .portal-shell .logout-form { justify-content: space-between; flex-wrap: wrap; }
    .portal-account-link,
    .portal-logout { min-height: 44px; }

    .portal-primary-nav { display: none; }
    .portal-header.menu-open .portal-primary-nav { display: block; }
    .portal-primary-nav-inner { align-items: stretch; flex-direction: column; gap: 0; padding: 12px 0 18px; }
    .portal-nav-group-label { min-height: 36px; padding: 10px 8px 4px; }
    .portal-nav-group { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .portal-nav-group a { min-height: 44px; padding: 0 10px; white-space: normal; }
    .portal-nav-group a.active { color: var(--portal-forest-deep); background: var(--portal-honey); border-radius: 6px; }
    .portal-nav-group a.active::after { display: none; }

    .portal-shell .society-context-inner { padding-inline: 16px; }
    .portal-shell .page { padding: 26px 16px 48px; }
    .portal-hero { grid-template-columns: 1fr; min-height: 0; padding: 38px 26px 44px; border-radius: 10px; }
    .portal-hero h1 { font-size: clamp(36px, 11vw, 48px); }
    .portal-hero-copy > p:last-child { font-size: 15px; }
    .portal-hero-mark { position: absolute; right: -95px; bottom: -70px; opacity: 0.2; }
    .portal-section-heading { align-items: flex-start; flex-direction: column; gap: 10px; margin-top: 38px; }
    .portal-section-heading > p { text-align: left; }
    .portal-quick-actions,
    .portal-personal-actions { grid-template-columns: 1fr; }
    .portal-action-card { min-height: 218px; }
    .portal-content-card { margin-top: 30px; padding: 20px 16px; }
    .portal-card-heading { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
    .portal-shell *,
    .portal-shell *::before,
    .portal-shell *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.page {
    max-width: 1200px;
    margin: 0 auto;
    padding: 28px;
}

.page-header {
    margin-bottom: 14px;
}

.page-header h1 {
    margin: 0 0 6px;
    font-size: 26px;
    line-height: 1.2;
    letter-spacing: 0;
}

.page-header p {
    margin: 0;
    color: #647386;
}

.page-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 18px;
    align-items: center;
}

.panel {
    margin-top: 18px;
}

.list-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
}

.list-toolbar h2 {
    margin: 0 0 4px;
}

.list-toolbar p {
    margin: 0;
    color: #647386;
}

.search-field {
    display: grid;
    gap: 5px;
    min-width: min(280px, 100%);
    color: #334155;
    font-weight: 650;
}

.search-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.search-row input {
    min-width: min(360px, 100%);
}

.member-search-toolbar {
    justify-content: flex-start;
}

.year-group {
    display: grid;
    gap: 8px;
    margin-top: 16px;
}

.year-group h3 {
    margin: 0;
    color: #334155;
    font-size: 16px;
}

.button,
button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid #1f5fbf;
    background: #1f5fbf;
    color: #ffffff;
    border-radius: 5px;
    text-decoration: none;
    font: inherit;
    font-weight: 650;
    cursor: pointer;
}

button:hover,
.button:hover {
    background: #194f9f;
    border-color: #194f9f;
}

.button.secondary {
    border-color: #b7c3d0;
    background: #ffffff;
    color: #17202a;
}

.button.secondary:hover {
    border-color: #9aa8b6;
    background: #eef3f8;
}

.button.danger,
button.danger {
    border-color: #ba1a1a;
    background: #ba1a1a;
    color: #ffffff;
}

.button.danger:hover,
button.danger:hover {
    border-color: #991b1b;
    background: #991b1b;
}

.compact-button {
    min-height: 30px;
    padding: 0 10px;
    font-size: 13px;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
    border: 1px solid #d8dee6;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.data-table th,
.data-table td {
    padding: 11px 12px;
    border-bottom: 1px solid #e8edf2;
    text-align: left;
    vertical-align: top;
}

.data-table th {
    background: #eef3f8;
    font-weight: 700;
    color: #334155;
}

.assessment-lines-table th,
.assessment-lines-table td {
    padding: 5px 8px;
    vertical-align: middle;
}

.assessment-lines-table .actions-column {
    width: 260px;
}

.assessment-lines-table {
    font-size: 13px;
}

.assessment-lines-table tbody tr {
    min-height: 38px;
}

.assessment-group-row > td {
    background: #fff;
}

.assessment-household-row > td {
    padding: 0;
    background: #f6fbff;
}

.assessment-group-details {
    display: block;
    border-left: 3px solid #14748a;
    outline: 0;
}

.assessment-group-details summary {
    display: grid;
    grid-template-columns: 24px minmax(170px, 1.1fr) minmax(170px, 1fr) 104px 112px minmax(126px, auto) minmax(170px, auto);
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 6px 8px;
    cursor: pointer;
    list-style: none;
    outline: 0;
}

.assessment-group-details summary::-webkit-details-marker {
    display: none;
}

.assessment-expand-icon {
    display: inline-grid;
    width: 18px;
    height: 18px;
    place-items: center;
    border: 1px solid #9eb4ca;
    border-radius: 5px;
    font-weight: 800;
    font-size: 13px;
    color: #14748a;
    background: #fff;
}

.assessment-group-details[open] .assessment-expand-icon {
    color: #0f766e;
}

.assessment-group-details[open] .assessment-expand-icon::before {
    content: "-";
}

.assessment-group-details[open] .assessment-expand-icon {
    font-size: 0;
}

.assessment-group-details[open] .assessment-expand-icon::before {
    font-size: 14px;
}

.assessment-group-member {
    font-weight: 800;
    color: #102033;
}

.assessment-group-type {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #536579;
    min-width: 0;
}

.assessment-group-type small {
    color: #647386;
    white-space: nowrap;
}

.assessment-household-badge {
    background: #e0f2fe;
    color: #075985;
    border: 1px solid #bae6fd;
}

.assessment-group-amount {
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
}

.assessment-group-actions {
    justify-content: flex-end;
}

.assessment-member-lines {
    display: grid;
    gap: 3px;
    padding: 0 8px 8px 30px;
}

.assessment-child-line {
    display: grid;
    grid-template-columns: minmax(190px, 1.1fr) minmax(160px, 1fr) 100px 100px minmax(128px, auto) auto;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 4px 7px;
    border: 1px solid #dbe5ef;
    border-radius: 6px;
    background: #fff;
}

.assessment-child-header {
    min-height: 28px;
    border-color: transparent;
    background: transparent;
    color: #647386;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.assessment-line-free td {
    background: #f2fbf5;
}

.assessment-child-line.assessment-line-free {
    background: #f2fbf5;
}

.assessment-free-badge {
    margin-left: 8px;
    background: #dff7e6;
    color: #166534;
}

.assessment-money-input {
    width: 88px;
    max-width: 88px;
    min-height: 28px;
    padding: 4px 7px;
    text-align: right;
}

.payment-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 24px;
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid #d8e2ed;
    background: #f7fafc;
    color: #334155;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

.payment-entry-summary {
    display: grid;
    grid-template-columns: minmax(220px, 1.4fr) repeat(3, minmax(120px, .6fr));
    gap: 10px;
    max-width: 906px;
    margin-bottom: 12px;
}

.payment-entry-summary > div {
    display: grid;
    gap: 3px;
    padding: 12px 14px;
    border: 1px solid #d8dee6;
    border-radius: 6px;
    background: #fff;
}

.payment-entry-summary span,
.payment-entry-summary small {
    color: #647386;
}

.payment-entry-summary strong {
    color: #102033;
}

.payment-entry-form {
    max-width: 906px;
}

.payment-history-voided {
    color: #64748b;
    background: #f8fafc;
}

.payment-history-voided strong {
    text-decoration: line-through;
}

.payment-dashboard-header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
}

.payment-header-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.payment-year-form {
    min-height: 38px;
    padding: 6px;
}

.payment-year-form input {
    width: 92px;
    min-height: 32px;
}

.payment-year-form button {
    min-height: 32px;
}

.payment-overview-strip {
    display: grid;
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    gap: 8px;
    margin: 10px 0 16px;
}

.payment-overview-strip > div {
    display: grid;
    gap: 3px;
    padding: 9px 11px;
    border: 1px solid #d8dee6;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.payment-overview-strip span {
    color: #647386;
    font-size: 12px;
    font-weight: 700;
}

.payment-overview-strip strong {
    color: #102033;
    font-size: 15px;
}

.payment-import-list-table {
    margin-bottom: 18px;
}

.payment-import-list-table th,
.payment-import-list-table td,
.payment-lines-table th,
.payment-lines-table td {
    padding: 7px 10px;
    vertical-align: middle;
}

.payment-lines-title {
    margin-top: 8px;
}

.payment-lines-table {
    font-size: 13px;
}

.payment-lines-table tbody tr:hover td {
    background: #f8fbff;
}

.payment-lines-table .table-actions {
    justify-content: flex-end;
}

.number-cell {
    text-align: right;
    white-space: nowrap;
}

.fee-total-label {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 10px;
    border-radius: 6px;
    background: #f8fafc;
    color: #102033;
    font-weight: 800;
    white-space: nowrap;
}

.card-heading-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.payment-status-pill small {
    color: inherit;
    font-size: 11px;
    font-weight: 700;
    opacity: .78;
}

.payment-status-paid {
    border-color: #bbf7d0;
    background: #ecfdf3;
    color: #166534;
}

.payment-status-partial {
    border-color: #fde68a;
    background: #fffbeb;
    color: #92400e;
}

.payment-status-unpaid {
    border-color: #e2e8f0;
    background: #f8fafc;
    color: #475569;
}

.payment-status-overpaid {
    border-color: #bfdbfe;
    background: #eff6ff;
    color: #1d4ed8;
}

.member-assessment-link {
    color: #102033;
    font-weight: 800;
    text-decoration: none;
}

.member-assessment-link:hover {
    color: #1f5fbf;
    text-decoration: underline;
}

.compact-button {
    min-height: 30px;
    padding: 6px 10px;
}

.compact-empty-state {
    padding: 12px;
}

.assessment-lines-table .compact-button,
.assessment-lines-table .row-actions button {
    min-height: 28px;
    padding: 0 8px;
    font-size: 12px;
}

.row-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    white-space: nowrap;
}

.row-actions form {
    margin: 0;
}

.compact-danger-button {
    background: #b42318;
    padding-inline: 10px;
}

.settings-section {
    display: grid;
    gap: 16px;
    margin-bottom: 28px;
}

.settings-section h2,
.settings-card h3 {
    margin: 0;
}

.settings-cards {
    display: grid;
    gap: 18px;
}

.settings-card {
    display: grid;
    gap: 14px;
    padding: 18px;
    background: #ffffff;
    border: 1px solid #d8dee6;
    border-top: 3px solid #14748a;
    border-radius: 6px;
    box-shadow: 0 10px 24px rgba(16, 24, 40, 0.06);
}

.notification-compose-grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(360px, 0.8fr);
}

.notification-preview pre {
    margin: 0;
    max-height: 180px;
    overflow: auto;
    white-space: pre-wrap;
    font-family: inherit;
    color: #334155;
}

.row-warning td {
    background: #fff7ed;
}

.row-soft-warning td {
    background: #fefce8;
}

.filter-card {
    margin-bottom: 14px;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.stats-grid article {
    display: grid;
    gap: 6px;
    padding: 14px;
    background: #ffffff;
    border: 1px solid #d8dee6;
    border-radius: 6px;
}

.stats-grid span {
    color: #526170;
    font-size: 13px;
}

.stats-grid strong {
    font-size: 24px;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 9px;
    border-radius: 999px;
    background: #e8edf2;
    color: #162033;
    font-weight: 750;
    font-size: 12px;
}

.checkline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 750;
}

.checkline input {
    width: auto;
    min-height: 0;
}

.notification-history-table th,
.notification-history-table td,
.notification-recipient-table th,
.notification-recipient-table td {
    padding: 7px 10px;
    vertical-align: middle;
}

.notification-recipient-table th:first-child,
.notification-recipient-table td:first-child {
    width: 34px;
}

.notification-recipient-table input[type="checkbox"] {
    width: 16px;
    min-height: 16px;
}

.notification-recipient-table .badge {
    min-height: 20px;
    padding-inline: 7px;
}

.notification-status-badge {
    background: #e8edf2;
    color: #334155;
    font-weight: 750;
}

.notification-type-hint {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 8px 0 14px;
    color: #526170;
    font-size: 13px;
}

.notification-type-hint strong {
    padding: 4px 10px;
    border: 1px solid #b6d7e3;
    border-radius: 999px;
    background: #eef8fb;
    color: #0f5f73;
}

.notification-header-editor {
    gap: 12px;
}

.notification-header-form {
    display: grid;
    gap: 10px;
}

.notification-header-form textarea {
    min-height: 130px;
}

.notification-header-form button {
    justify-self: start;
}

.notification-header-display {
    display: grid;
    gap: 12px;
}

.notification-header-display > div {
    display: grid;
    gap: 4px;
}

.notification-header-display .compact-button {
    justify-self: start;
}

.notification-select-all {
    min-height: 28px;
    margin: 10px 0 8px;
}

.notification-select-all input {
    width: 16px;
    min-height: 16px;
}

.field-hint {
    color: #647386;
    font-size: 12px;
    font-weight: 500;
}

.locked-field {
    border-color: #14748a;
    background: #f0fdfa;
}

.compact-form-grid {
    max-width: none;
    padding: 0;
    border: 0;
    box-shadow: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.settings-status {
    color: #526170;
    font-size: 13px;
}

.settings-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 16px;
}

.settings-tabs a {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 12px;
    border: 1px solid #c5d0dc;
    border-radius: 999px;
    background: #ffffff;
    color: #334155;
    font-weight: 700;
    text-decoration: none;
}

.settings-tabs a:hover {
    border-color: #14748a;
    color: #0f5f73;
    background: #eef8fb;
}

.settings-tabs a.active {
    border-color: #14748a;
    background: #14748a;
    color: #ffffff;
}

.code-list-card {
    margin-bottom: 18px;
}

.compact-table th,
.compact-table td {
    padding: 8px 10px;
    vertical-align: middle;
}

.compact-checkbox {
    min-height: 28px;
}

.code-list-actions {
    margin-top: 10px;
}

.code-list-create {
    align-items: end;
}

.code-list-create label {
    display: grid;
    gap: 5px;
    min-width: 220px;
    font-weight: 700;
}

.section-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.inline-selector select {
    min-width: 260px;
}

.table-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.table-actions form {
    margin: 0;
}

.table-actions a {
    font-weight: 650;
}

.sort-link {
    color: inherit;
    font-weight: 800;
    text-decoration: none;
}

.sort-link:hover {
    color: #1f5fbf;
    text-decoration: underline;
}

.member-row-active td {
    background: #f8fbff;
}

.member-row-exempt td {
    background: #f0fdf4;
}

.member-row-inactive td {
    background: #f1f5f9;
    color: #647386;
}

.member-group-row td {
    background: #dbeafe;
    color: #17345f;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0;
}

.member-group-row span {
    margin-left: 8px;
    color: #526170;
    font-weight: 700;
    text-transform: none;
}

.member-group-row-inactive td {
    background: #e2e8f0;
    color: #475569;
}

.member-name {
    font-weight: 500;
}

.member-name-link {
    color: #102033;
    text-decoration: none;
}

.member-name-link:hover {
    color: #1f5fbf;
    text-decoration: underline;
}

.member-name-portal {
    font-weight: 800;
}

.empty-state {
    padding: 18px;
    border: 1px dashed #b7c3d0;
    background: #ffffff;
    color: #526170;
}

.block {
    display: block;
}

.selection-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    max-width: 860px;
    margin-bottom: 10px;
}

.member-selection-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    max-width: 860px;
    max-height: 520px;
    overflow-y: auto;
    border: 1px solid #d8dee6;
    background: #d8dee6;
}

.member-selection-list label {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 12px;
    background: #ffffff;
    cursor: pointer;
}

.member-selection-list input {
    width: 18px;
    min-height: 18px;
    flex: 0 0 18px;
}

.member-selection-list span,
.member-selection-list small {
    display: block;
    min-width: 0;
}

.member-selection-list small {
    margin-top: 2px;
    color: #647386;
}

.line-edit-form {
    display: grid;
    grid-template-columns: 92px 92px minmax(150px, 1fr) auto;
    align-items: end;
    gap: 8px;
    min-width: 470px;
}

.line-edit-form label {
    display: grid;
    gap: 4px;
    color: #526170;
    font-size: 12px;
    font-weight: 650;
}

.line-edit-form input {
    min-height: 34px;
}

.money-input {
    max-width: 130px;
    text-align: right;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    max-width: 860px;
    padding: 22px;
    background: #ffffff;
    border: 1px solid #d8dee6;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.field {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.field label {
    color: #334155;
    font-weight: 650;
}

.span-2,
.validation,
.form-actions {
    grid-column: 1 / -1;
}

input,
select,
textarea {
    width: 100%;
    box-sizing: border-box;
    min-height: 38px;
    padding: 7px 10px;
    border: 1px solid #b7c3d0;
    border-radius: 5px;
    background: #ffffff;
    color: #17202a;
    font: inherit;
}

input:focus,
select:focus,
textarea:focus {
    outline: 2px solid rgba(31, 95, 191, 0.18);
    border-color: #1f5fbf;
}

.issue-form {
    max-width: 1080px;
}

.settings-form {
    display: grid;
    gap: 18px;
}

.settings-section {
    max-width: 1120px;
}

.settings-section-title h2 {
    margin: 0;
    color: #075985;
    font-size: 13px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.settings-actions {
    max-width: 1120px;
    padding: 0;
    border-top: 0;
}

.date-input-control {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38px;
    align-items: stretch;
}

.date-input-control input[data-date-input] {
    border-radius: 5px 0 0 5px;
}

.date-picker-button {
    width: 38px;
    min-height: 38px;
    border-left: 0;
    border-color: #b7c3d0;
    border-radius: 0 5px 5px 0;
    background: #f8fafc;
}

.date-picker-button:hover {
    border-color: #9aa8b6;
    background: #eef3f8;
}

.date-picker-button::before {
    content: "";
    width: 16px;
    height: 15px;
    border: 2px solid currentColor;
    border-top-width: 5px;
    border-radius: 3px;
    box-sizing: border-box;
}

.date-native-input {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 1px;
    min-height: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    opacity: 0;
    pointer-events: none;
}

textarea {
    min-height: 96px;
    resize: vertical;
}

.checkbox-line {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    font-weight: 650;
}

.checkbox-line input {
    width: auto;
    min-height: 0;
}

.notification-options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1.5rem;
    min-height: 2.5rem;
    align-items: center;
}

.field-label {
    display: block;
    font-weight: 700;
    margin-bottom: 0.4rem;
}

.checkbox-field {
    align-content: end;
}

.form-actions {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding-top: 4px;
    border-top: 1px solid #edf1f5;
}

.form-actions button,
.form-actions .button {
    min-width: 140px;
}

.action-panel {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    max-width: 860px;
    margin-top: 16px;
    padding: 18px 22px;
    background: #ffffff;
    border: 1px solid #d8dee6;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.action-panel h2 {
    margin: 0 0 4px;
    font-size: 18px;
}

.action-panel p {
    margin: 0;
    color: #647386;
}

.action-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.danger-button {
    border-color: #b42318;
    background: #b42318;
}

.danger-button:hover {
    border-color: #8a1f16;
    background: #8a1f16;
}

.check-list {
    display: grid;
    gap: 6px;
    max-height: 260px;
    overflow: auto;
    padding: 10px;
    border: 1px solid #d8dee6;
    border-radius: 5px;
    background: #f8fafc;
}

.check-list label {
    display: flex;
    align-items: center;
    gap: 8px;
}

.check-list input {
    width: auto;
    min-height: 0;
}

.inline-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 10px;
    background: #ffffff;
    border: 1px solid #d8dee6;
    border-radius: 6px;
}

.inline-form input {
    width: 130px;
}

.apiary-gps-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.apiary-count-section,
.apiary-count-history {
    max-width: 860px;
    margin-top: 18px;
}

.apiary-count-section h2,
.apiary-count-history h2 {
    margin: 0 0 10px;
    font-size: 18px;
}

.apiary-count-form {
    display: grid;
    grid-template-columns: 150px 150px minmax(180px, 1fr) auto;
    align-items: end;
    gap: 12px;
    padding: 16px;
    background: #ffffff;
    border: 1px solid #d8dee6;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.apiary-count-form button {
    min-width: 140px;
}

.hygiene-page-header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
}

.year-selector {
    display: grid;
    grid-template-columns: auto 96px auto;
    align-items: center;
    gap: 8px;
}

.year-selector label {
    font-weight: 650;
}

.documentation-section {
    max-width: 980px;
}

.documentation-table th:nth-child(2),
.documentation-table td:nth-child(2) {
    width: 90px;
}

.documentation-table th:nth-child(3),
.documentation-table td:nth-child(3) {
    width: 130px;
}

.documentation-table th:last-child,
.documentation-table td:last-child {
    width: 80px;
}

.documentation-status-complete {
    background: #dcfce7;
    color: #166534;
    font-weight: 750;
}

.documentation-start-form {
    display: inline;
}

.link-button {
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: #1f5fbf;
    font-weight: 650;
    text-decoration: underline;
}

.link-button:hover {
    border: 0;
    background: transparent;
    color: #194f9f;
}

.traceability-list,
.self-control-form {
    display: grid;
    gap: 16px;
    max-width: 1120px;
}

.traceability-lot,
.self-control-section {
    padding: 18px;
    background: #ffffff;
    border: 1px solid #d8dee6;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.traceability-lot-heading {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.traceability-lot-heading h2,
.self-control-section h2 {
    margin: 0 0 4px;
    font-size: 18px;
}

.traceability-lot-heading p {
    margin: 0;
    color: #647386;
}

.traceability-facts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 0 0 16px;
    padding: 12px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.traceability-facts div {
    min-width: 0;
}

.traceability-facts dt {
    color: #647386;
    font-size: 12px;
    font-weight: 700;
}

.traceability-facts dd {
    margin: 4px 0 0;
    overflow-wrap: anywhere;
}

.traceability-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.traceability-sample {
    grid-template-columns: minmax(190px, auto) minmax(0, 1fr);
    align-items: end;
}

.hygiene-form-note,
.hygiene-form-actions,
.hygiene-action-panel {
    max-width: 1120px;
    margin-top: 16px;
}

.hygiene-form-actions {
    padding: 14px 0 0;
}

.self-control-section {
    display: grid;
    gap: 0;
}

.self-control-question {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto minmax(180px, 0.65fr);
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    border-top: 1px solid #e8edf2;
}

.self-control-options {
    display: flex;
    gap: 10px;
}

.self-control-options label {
    display: flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

.self-control-options input {
    width: auto;
    min-height: 0;
}

.alert {
    border: 1px solid var(--border);
    border-radius: 8px;
    margin: 0 0 16px;
    padding: 10px 12px;
}

.alert.success {
    background: #ecfdf5;
    border-color: #86efac;
    color: #166534;
}

.alert.error {
    background: #fef2f2;
    border-color: #fecaca;
    color: #991b1b;
}

.app-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.app-modal.is-open {
    display: flex;
}

.app-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.48);
}

.app-modal-dialog {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 16px;
    width: min(520px, 100%);
    padding: 22px;
    border: 1px solid #d8dee6;
    border-top: 4px solid #14748a;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 22px 52px rgba(15, 23, 42, 0.26);
}

.app-modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.app-modal-header h2 {
    margin: 0;
    color: #102033;
    font-size: 20px;
}

.app-modal-message {
    margin: 0;
    color: #435466;
    line-height: 1.45;
}

.app-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 6px;
    border-top: 1px solid #e8edf2;
}

.admin-password-mail-warning {
    display: grid;
    gap: 8px;
    max-width: 1200px;
}

.admin-password-mail-warning .inline-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 12px;
    color: #7f1d1d;
}

.admin-password-mail-warning .compact-button {
    background: #ffffff;
    color: #7f1d1d;
    border-color: #fca5a5;
}

.detail-list dl {
    display: grid;
    gap: 12px 20px;
    grid-template-columns: minmax(160px, 220px) 1fr;
    margin: 0;
}

.detail-list dt {
    color: var(--muted);
    font-weight: 700;
}

.detail-list dd {
    margin: 0;
}

.auth-shell {
    min-height: calc(100vh - 114px);
    display: grid;
    place-items: center;
}

.auth-panel {
    width: min(420px, 100%);
    padding: 28px;
    background: #ffffff;
    border: 1px solid #d8dee6;
    box-shadow: 0 10px 30px rgba(16, 24, 40, 0.08);
}

.auth-heading {
    margin-bottom: 18px;
}

.auth-heading span {
    display: block;
    margin-bottom: 4px;
    color: #647386;
    font-weight: 700;
}

.auth-heading h1 {
    margin: 0;
    font-size: 28px;
}

.auth-panel form {
    display: grid;
    gap: 14px;
}

.auth-panel button {
    width: 100%;
    min-height: 42px;
}

.notice {
    margin: 12px 0;
    padding: 10px 12px;
    border: 1px solid #9ec5a6;
    background: #eaf7ef;
    color: #1f5130;
}

.subtle-notice {
    max-width: 906px;
    border-color: #d8e2ed;
    background: #f8fafc;
    color: #475569;
}

.icon-button {
    width: 30px;
    min-height: 30px;
    padding: 0;
    border-color: #9aa8b6;
    background: #ffffff;
    color: #17202a;
}

.detail-row td {
    background: #f8fafc;
}

.line-table {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
}

.line-table th,
.line-table td {
    padding: 8px 10px;
    border-bottom: 1px solid #e5e9ef;
    text-align: left;
}

.fee-type-regular { border-left: 4px solid #cbd5e1; }
.fee-type-family { border-left: 4px solid #60a5fa; }
.fee-type-disabled { border-left: 4px solid #8b8f98; }
.fee-type-age80 { border-left: 4px solid #eab308; }
.fee-type-honorary { border-left: 4px solid #22c55e; }
.fee-type-student { border-left: 4px solid #38bdf8; }
.fee-type-new { border-left: 4px solid #14b8a6; }
.fee-type-deceased { border-left: 4px solid #64748b; background: #f1f5f9; }
.fee-override { outline: 2px solid #f97316; }
.fee-exempt { background: #eaf7ef; }

.badge {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: #e2e8f0;
    color: #17202a;
    font-size: 12px;
}

.badge-warning {
    background: #ffedd5;
    color: #9a3412;
}

.badge-portal {
    background: #dbeafe;
    color: #1e40af;
    font-weight: 750;
}

.metrics-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
}

.summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
    margin: 12px 0;
}

.metric {
    display: grid;
    gap: 8px;
    padding: 16px;
    background: #ffffff;
    border: 1px solid #d8dee6;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.metric span {
    color: #526170;
}

.metric strong {
    font-size: 24px;
}

.summary-item {
    display: grid;
    gap: 6px;
    padding: 12px;
    background: #ffffff;
    border: 1px solid #d8dee6;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.summary-item span {
    color: #526170;
}

.notification-type-summary {
    border-top: 3px solid #14748a;
}

.notification-type-summary small {
    color: #647386;
    font-weight: 650;
}

.line-edit-form {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 8px;
}

.line-edit-form label {
    display: grid;
    gap: 4px;
    min-width: 110px;
    font-size: 13px;
    color: #526170;
}

.line-edit-form input {
    min-height: 34px;
}

.line-edit-form .reason-field {
    flex: 1 1 220px;
}

.beekeeper-dashboard-section {
    display: grid;
    gap: 12px;
    padding: 16px;
    border-top: 3px solid #14748a;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(16, 24, 40, 0.05);
}

.dashboard-section-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e3e8ef;
}

.dashboard-section-heading span {
    color: #005f73;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.dashboard-section-heading h2 {
    margin: 2px 0 0;
    font-size: 20px;
}

.issue-form {
    gap: 14px;
    max-width: 1180px;
    padding: 0;
    border: 0;
    background: transparent;
}

.issue-section {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid #d8dee6;
    border-top: 3px solid #14748a;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(16, 24, 40, 0.05);
}

.issue-section-heading {
    display: grid;
    gap: 3px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e3e8ef;
}

.issue-section-heading span {
    color: #005f73;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.issue-section-heading h2 {
    margin: 0;
    font-size: 18px;
}

.issue-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
}

.issue-lines-section {
    overflow-x: auto;
}

.issue-lines {
    display: grid;
    gap: 8px;
    overflow-x: auto;
}

.issue-lines-table th,
.issue-lines-table td {
    vertical-align: middle;
    padding: 7px 8px;
}

.issue-lines-table input,
.issue-lines-table select {
    min-height: 34px;
    padding: 6px 8px;
}

.issue-lines-table select {
    min-width: 0;
}

.issue-lines-table .number-column {
    width: 86px;
}

.issue-lines-table .stock-column {
    width: 210px;
}

.input-small {
    max-width: 76px;
    text-align: right;
}

.smgo-control {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 132px;
}

.smgo-checkbox {
    width: 20px;
    height: 20px;
    min-height: 0;
    margin: 0;
    flex: 0 0 auto;
    accent-color: #2563eb;
}

.smgo-label-select {
    width: 86px;
    min-height: 34px;
    padding: 5px 8px;
    font-size: 13px;
}

.smgo-label-select:disabled {
    color: #94a3b8;
    background: #f8fafc;
    border-color: #dbe3ee;
}

.smgo-toolbar-panel {
    padding: 12px 14px;
    background: #ffffff;
    border: 1px solid #d8dee6;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.smgo-stock-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin: 14px 0 18px;
}

.smgo-stock-card {
    display: grid;
    gap: 14px;
    padding: 16px;
    background: #ffffff;
    border: 1px solid #d8dee6;
    border-top: 3px solid #14748a;
    box-shadow: 0 8px 24px rgba(16, 24, 40, 0.06);
}

.smgo-stock-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.smgo-stock-card-header strong {
    font-size: 26px;
    line-height: 1;
}

.smgo-stock-type {
    color: #005f73;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.smgo-stock-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

.smgo-stock-metrics div {
    padding: 10px;
    background: #f8fafc;
    border: 1px solid #e3e8ef;
}

.smgo-stock-metrics dt {
    margin: 0 0 4px;
    color: #647386;
    font-size: 12px;
    font-weight: 650;
}

.smgo-stock-metrics dd {
    margin: 0;
    font-size: 16px;
    font-weight: 800;
}

.smgo-work-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

.smgo-work-card,
.smgo-history-card {
    padding: 16px;
    background: #ffffff;
    border: 1px solid #d8dee6;
    border-top: 3px solid #14748a;
    box-shadow: 0 8px 24px rgba(16, 24, 40, 0.06);
}

.smgo-section-heading {
    display: grid;
    gap: 3px;
    margin-bottom: 14px;
}

.smgo-section-heading h2 {
    margin: 0;
    font-size: 18px;
}

.smgo-section-heading p {
    margin: 0;
    color: #647386;
}

.smgo-form {
    padding: 12px;
    background: #fbfcfe;
    border: 1px solid #e3e8ef;
}

.smgo-history-card .data-table {
    margin-top: 8px;
}

.smgo-report-row-manual td {
    background: #fff7ed;
}

.line-stock-info {
    display: inline-block;
    max-width: 220px;
    color: #526170;
    font-size: 13px;
    line-height: 1.25;
}

.line-stock-info.stock-warning {
    color: #b42318;
    font-weight: 750;
}

.movement-locked {
    background: #f8fafc;
    color: #647386;
}

.muted {
    color: var(--muted);
}

.line-remove-button {
    color: #b42318;
}

.validation,
.field-validation-error {
    color: #b42318;
    font-size: 13px;
}

@media (max-width: 760px) {
    .topbar {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
        padding: 14px 18px;
    }

    .logout-form {
        margin-left: 0;
    }

    .topbar-actions {
        align-items: stretch;
        flex-direction: column;
        width: 100%;
        margin-left: 0;
    }

    .context-switch {
        justify-content: stretch;
        width: 100%;
    }

    .context-switch a {
        flex: 1 1 0;
        justify-content: center;
    }

    .work-context-select {
        width: 100%;
    }

    .page {
        padding: 18px;
    }

    .form-grid {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .smgo-stock-grid,
    .smgo-work-grid {
        grid-template-columns: 1fr;
    }

    .smgo-stock-metrics {
        grid-template-columns: 1fr;
    }

    .issue-field-grid {
        grid-template-columns: 1fr;
    }

    .span-2 {
        grid-column: auto;
    }

    .form-actions {
        justify-content: stretch;
        flex-direction: column-reverse;
    }

    .form-actions button,
    .form-actions .button,
    .action-row,
    .action-row button {
        width: 100%;
    }

    .list-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .data-table {
        display: block;
        overflow-x: auto;
    }

    .apiary-gps-fields,
    .apiary-count-form {
        grid-template-columns: 1fr;
    }

    .hygiene-page-header {
        align-items: stretch;
        flex-direction: column;
    }

    .traceability-facts,
    .traceability-fields,
    .traceability-sample,
    .self-control-question {
        grid-template-columns: 1fr;
    }

    .self-control-options {
        flex-wrap: wrap;
    }

    .year-selector {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .year-selector .button {
        grid-column: 1 / -1;
    }

    .apiary-count-form button {
        width: 100%;
    }

    .selection-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .member-selection-list {
        grid-template-columns: 1fr;
        max-height: none;
    }
}