:root {
    color-scheme: light;
    --ink: #152b35;
    --muted: #6d7e84;
    --line: #e4ebea;
    --surface: #ffffff;
    --canvas: #f5f8f6;
    --green: #0d755d;
    --green-dark: #075b49;
    --mint: #e9f5ef;
    --yellow: #f2c56b;
    --red: #b94c42;
    font-family: 'DM Sans', 'Segoe UI', sans-serif;
    font-synthesis: none;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; background: var(--canvas); color: var(--ink); }
button, input, select, textarea { font: inherit; }
button, select { cursor: pointer; }
a { color: inherit; }
.page-shell { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.topbar { height: 82px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none; font: 800 16px/1.15 'Manrope', sans-serif; letter-spacing: -.035em; }
.brand small { display: block; margin-top: 4px; color: var(--muted); font: 600 10px 'DM Sans', sans-serif; letter-spacing: .11em; text-transform: uppercase; }
.brand-mark { width: 40px; height: 40px; display: grid; place-items: center; color: white; border-radius: 13px; background: var(--green); font: 800 13px 'Manrope', sans-serif; letter-spacing: -.04em; }
.quiet-link { color: #44645f; text-decoration: none; font-size: 13px; font-weight: 700; }
.quiet-link:hover, .back-link:hover { color: var(--green); }
.quiet-link span { margin-left: 5px; }
.account-actions { display: flex; align-items: center; gap: 16px; }
.account-name { max-width: 210px; overflow: hidden; color: #7c8c87; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.hero { min-height: 302px; display: flex; align-items: center; justify-content: space-between; padding: 48px 7.5%; margin: 30px 0 24px; border-radius: 22px; overflow: hidden; position: relative; color: #fff; background: #123d38; }
.hero::before { position: absolute; content: ''; width: 380px; height: 380px; right: 3%; top: -155px; border: 1px solid rgba(255,255,255,.11); border-radius: 50%; }
.hero::after { position: absolute; content: ''; width: 260px; height: 260px; right: 8%; top: -95px; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; }
.hero > div:first-child { position: relative; z-index: 1; max-width: 575px; }
.eyebrow { margin: 0 0 11px; color: #7c9a93; font-size: 9px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.hero .eyebrow { color: #a8d8bd; }
h1, h2, h3, p { margin-top: 0; }
.hero h1 { margin-bottom: 13px; font: 800 clamp(34px, 5vw, 52px)/1.1 'Manrope', sans-serif; letter-spacing: -.055em; }
.hero h1 em { color: #8fd0aa; font-style: normal; }
.hero-copy { max-width: 475px; margin: 0; color: #cadbd5; font-size: 14px; line-height: 1.75; }
.hero-art { position: relative; z-index: 1; width: 250px; height: 190px; margin-right: 2%; flex: 0 0 250px; }
.orbit { position: absolute; inset: 10px 25px; border: 1px solid rgba(182,222,197,.23); border-radius: 50%; transform: rotate(-26deg); }
.orbit-two { inset: 28px 0; transform: rotate(22deg); border-color: rgba(242,197,107,.3); }
.route-line { position: absolute; width: 135px; height: 1px; left: 57px; top: 94px; background: linear-gradient(90deg, #91d2ac, #f2c56b); transform: rotate(-29deg); }
.route-dot { position: absolute; width: 15px; height: 15px; z-index: 1; border: 4px solid #123d38; border-radius: 50%; background: #9de0b8; box-shadow: 0 0 0 1px #9de0b8; }
.dot-one { top: 55px; left: 50px; }
.dot-two { top: 113px; right: 44px; background: var(--yellow); box-shadow: 0 0 0 1px var(--yellow); }
.route-label { position: absolute; right: 18px; bottom: 10px; color: rgba(223,241,231,.63); font-size: 8px; font-weight: 700; letter-spacing: .15em; }
.notice { display: flex; align-items: flex-start; gap: 12px; padding: 14px 18px; border-radius: 12px; }
.notice p { margin: 0; font-size: 12px; line-height: 1.65; }
.notice-info { color: #315e51; border: 1px solid #d7e9df; background: #edf6f0; }
.notice-icon { width: 19px; height: 19px; flex: 0 0 19px; display: grid; place-items: center; border: 1px solid #7ea893; border-radius: 50%; font: 700 11px Georgia, serif; }
.content-grid { display: grid; grid-template-columns: minmax(0, 1.38fr) minmax(320px, .82fr); align-items: start; gap: 22px; margin: 22px 0 56px; }
.panel { border: 1px solid var(--line); border-radius: 17px; background: var(--surface); box-shadow: 0 8px 26px rgba(28,54,45,.035); }
.form-panel { padding: 29px 31px 26px; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 25px; }
.panel-heading .eyebrow { margin-bottom: 7px; }
.panel-heading h2 { margin: 0; font: 800 21px 'Manrope', sans-serif; letter-spacing: -.04em; }
.step-number { width: 35px; height: 35px; display: grid; place-items: center; border: 1px solid #dce9e2; border-radius: 50%; color: var(--green); background: #f2f8f4; font: 700 11px 'Manrope', sans-serif; }
.field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 14px; }
.field { min-width: 0; display: flex; flex-direction: column; gap: 7px; color: #334b50; font-size: 11px; font-weight: 700; }
.field input, .field select, .field textarea { width: 100%; min-height: 44px; border: 1px solid #dce5e3; border-radius: 8px; outline: none; padding: 0 12px; color: #263c40; background: #fff; font-size: 12px; font-weight: 500; transition: border-color .15s, box-shadow .15s; }
.field textarea { min-height: 70px; padding-top: 11px; resize: vertical; line-height: 1.5; }
.field select[multiple] { min-height: 130px; padding: 8px 10px; }
.field input::placeholder, .field textarea::placeholder { color: #a4b0b0; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: #70ac91; box-shadow: 0 0 0 3px rgba(43,137,98,.1); }
.field select:disabled { color: #a4afae; cursor: not-allowed; background: #f7f9f8; }
.field-wide { grid-column: 1 / -1; }
.section-divider { height: 1px; margin: 24px 0 21px; background: var(--line); }
.section-title { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; }
.section-title .eyebrow { margin-bottom: 6px; }
.section-title h3 { margin: 0; font: 800 16px 'Manrope', sans-serif; letter-spacing: -.035em; }
.fixed-pill { display: inline-flex; align-items: center; min-height: 27px; padding: 0 10px; border: 1px solid #d9e9df; border-radius: 50px; color: #367455; background: #f0f7f2; font-size: 10px; font-weight: 700; white-space: nowrap; }
.destination-title { margin-bottom: 14px; }
.field-help { margin: 5px 0 0; color: #899795; font-size: 11px; font-weight: 400; line-height: 1.5; }
.destination-builder { padding: 15px; border: 1px solid #e5ede8; border-radius: 11px; background: #fafcfb; }
.destination-builder .field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 0 17px; border: 0; border-radius: 8px; font-size: 12px; font-weight: 700; transition: transform .15s, background .15s, opacity .15s; }
.button:hover:not(:disabled) { transform: translateY(-1px); }
.button:disabled { cursor: wait; opacity: .68; }
.button-primary { color: #fff; background: var(--green); }
.button-primary:hover:not(:disabled) { background: var(--green-dark); }
.button-secondary { color: #28644e; border: 1px solid #cfe3d6; background: #edf6f0; }
.button-secondary:hover:not(:disabled) { background: #e2f0e7; }
.button-dark { width: 100%; color: #fff; background: #153d38; }
.button-dark:hover:not(:disabled) { background: #0c302b; }
.button-ghost { color: #4d6666; border: 1px solid var(--line); background: #fff; }
.add-destination { margin-top: 12px; min-height: 38px; font-size: 11px; }
.add-destination span { font-size: 17px; }
.selected-destinations { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; margin-top: 11px; }
.empty-inline { grid-column: 1 / -1; margin: 0; padding: 11px; border: 1px dashed #dce7e1; border-radius: 8px; color: #8b9994; text-align: center; font-size: 10px; }
.destination-chip { min-width: 0; display: flex; align-items: flex-start; gap: 9px; padding: 10px; border: 1px solid #e2ebe4; border-radius: 9px; background: #f7faf8; }
.chip-dot { width: 7px; height: 7px; flex: 0 0 7px; margin-top: 4px; border-radius: 50%; background: #65a883; }
.destination-chip > span:nth-child(2) { min-width: 0; flex: 1; color: #36534a; font-size: 10px; line-height: 1.4; }
.destination-chip strong { display: block; overflow-wrap: anywhere; }
.destination-chip small { display: block; margin-top: 3px; color: #84948b; font-size: 9px; }
.remove-destination { width: 20px; height: 20px; flex: 0 0 20px; display: grid; place-items: center; border: 0; border-radius: 50%; color: #82908a; background: transparent; font-size: 16px; line-height: 1; }
.remove-destination:hover { color: var(--red); background: #faeae7; }
.submit-profile { width: 100%; justify-content: space-between; min-height: 49px; margin-top: 19px; padding: 0 19px; font-size: 13px; }
.submit-profile > span:last-child { font-size: 18px; }
.form-note { margin: 11px 0 0; color: #98a4a0; text-align: center; font-size: 9px; line-height: 1.5; }
.side-column { display: grid; gap: 15px; }
.match-panel { padding: 25px 22px 20px; }
.match-panel .panel-heading { margin-bottom: 13px; }
.match-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; color: var(--green); background: var(--mint); font: 700 23px 'Manrope', sans-serif; }
.muted-text { color: var(--muted); font-size: 11px; line-height: 1.7; }
.match-panel > .muted-text { margin-bottom: 18px; }
.filter-field { margin-bottom: 13px; }
.filter-field select { min-height: 41px; }
.results { margin-top: 16px; }
.empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 165px; padding: 23px 18px; border: 1px dashed #dbe5e0; border-radius: 11px; text-align: center; }
.empty-state p { max-width: 270px; margin: 10px 0 0; color: #84938e; font-size: 11px; line-height: 1.65; }
.empty-symbol { color: #76a78d; font: 400 30px 'Manrope', sans-serif; }
.result-count { margin: 0 0 12px; color: #71817d; font-size: 10px; line-height: 1.5; }
.result-count strong { color: var(--green-dark); }
.match-card { margin-top: 10px; padding: 16px 15px 14px; border: 1px solid #dceae1; border-radius: 11px; background: linear-gradient(145deg,#fff,#f8fbf8); }
.match-card-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.match-card-top .eyebrow { margin-bottom: 5px; color: #53916f; font-size: 8px; }
.match-card h3 { margin: 0; font: 800 15px 'Manrope', sans-serif; }
.type-pill { padding: 5px 8px; border-radius: 50px; color: #516768; background: #edf1ef; font-size: 9px; font-weight: 700; }
.match-school { margin: 7px 0 13px; color: #54736a; font-size: 10px; line-height: 1.5; }
.match-school span { color: #b4c2bc; }
.match-facts { display: grid; gap: 9px; padding: 11px 0; border-top: 1px solid #e8efea; border-bottom: 1px solid #e8efea; }
.match-facts p { margin: 0; color: #405854; font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
.match-facts p > span { display: block; margin-bottom: 2px; color: #91a09a; font-size: 9px; }
.match-destination-fact { color: #405854; font-size: 10px; line-height: 1.5; }
.match-destination-fact > span { display: block; margin-bottom: 2px; color: #91a09a; font-size: 9px; }
.match-destination-fact ul { margin: 3px 0 0; padding-left: 15px; }
.match-destination-fact li + li { margin-top: 3px; }
.match-facts ul { margin: 3px 0 0; padding-left: 15px; }
.match-facts li + li { margin-top: 3px; }
.contact-button { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; padding: 10px 11px; border-radius: 8px; color: #1a684d; background: #e8f5ed; text-decoration: none; font-size: 10px; font-weight: 700; }
.contact-button:hover { background: #daf0e3; }
.contact-button strong { font-size: 10px; }
.help-card { display: flex; gap: 13px; padding: 18px; border: 1px solid #f0e7d2; border-radius: 13px; background: #fffaf0; }
.help-icon { width: 27px; height: 27px; flex: 0 0 27px; display: grid; place-items: center; border-radius: 9px; color: #926a22; background: #f8edce; }
.help-card h3 { margin: 0 0 5px; color: #5f512e; font: 700 12px 'Manrope', sans-serif; }
.help-card p { margin: 0 0 9px; color: #8a7d5e; font-size: 10px; line-height: 1.6; }
.help-card a { color: #7f642a; text-decoration: none; font-size: 10px; font-weight: 700; }
.help-card a:hover { text-decoration: underline; }
.footer { display: flex; justify-content: space-between; gap: 20px; padding: 19px 0 24px; border-top: 1px solid var(--line); color: #91a09b; font-size: 9px; }
.toast { position: fixed; z-index: 10; right: 24px; bottom: 24px; max-width: min(420px, calc(100vw - 48px)); padding: 13px 17px; border: 1px solid #d4e9db; border-radius: 9px; color: #285a43; background: #f0f8f2; box-shadow: 0 10px 34px rgba(20,44,36,.14); font-size: 12px; line-height: 1.5; opacity: 0; pointer-events: none; transform: translateY(8px); transition: opacity .2s, transform .2s; }
.toast-visible { opacity: 1; transform: translateY(0); }
.toast-error { border-color: #f0d4ce; color: #863e32; background: #fff4f1; }
.spinner { width: 23px; height: 23px; border: 2px solid #dce9e1; border-top-color: var(--green); border-radius: 50%; animation: spin .8s linear infinite; }
.is-loading { position: relative; }
@keyframes spin { to { transform: rotate(360deg); } }

.login-page { min-height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 28px 18px; background: radial-gradient(ellipse at 50% 20%, #e5f1e9 0%, transparent 45%), var(--canvas); }
.login-brand { margin-bottom: 24px; }
.login-panel { width: min(420px, 100%); padding: 30px; }
.login-panel h1 { margin: 0 0 9px; font: 800 27px 'Manrope', sans-serif; letter-spacing: -.05em; }
.login-panel > .muted-text { margin-bottom: 23px; }
.login-panel .field { margin-bottom: 14px; }
.full-button { width: 100%; margin-top: 4px; }
.back-link { display: inline-block; margin-top: 20px; color: #7c8d89; text-decoration: none; font-size: 11px; }
.login-panel .notice { margin: 16px 0; padding: 11px 12px; }
.notice-warning { border: 1px solid #f0e5c9; color: #745c26; background: #fffaf0; }
.notice-warning p { font-size: 10px; }
.notice-warning code { font-size: 10px; }
.field-error { margin: -5px 0 14px; color: var(--red); font-size: 11px; }

.admin-main { padding-top: 22px; }
.admin-main > .back-link { margin: 0 0 18px; }
.admin-intro { margin: 8px 0 23px; }
.admin-intro .eyebrow { margin-bottom: 8px; }
.admin-intro h1 { margin: 0 0 8px; font: 800 31px 'Manrope', sans-serif; letter-spacing: -.05em; }
.admin-intro > p:last-child { max-width: 650px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.admin-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr); align-items: start; gap: 20px; margin-bottom: 50px; }
.sudin-form-panel, .sudin-list-panel { padding: 25px; }
.sudin-form-panel .panel-heading, .sudin-list-panel .panel-heading { margin-bottom: 19px; }
.sudin-form-panel .field { margin-bottom: 19px; }
.district-select-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.district-select-heading h3 { margin: 0; font: 700 13px 'Manrope', sans-serif; }
.district-groups { max-height: 510px; overflow: auto; border: 1px solid #e3ebe7; border-radius: 9px; }
.district-group + .district-group { border-top: 1px solid #e9eeeb; }
.district-group summary { display: flex; justify-content: space-between; gap: 12px; padding: 12px 13px; color: #38584e; background: #f8faf8; cursor: pointer; list-style: none; font-size: 11px; font-weight: 700; }
.district-group summary::-webkit-details-marker { display: none; }
.district-group summary::after { content: '⌄'; margin-left: auto; color: #85a394; }
.district-group summary span { color: #95a39c; font-size: 9px; font-weight: 500; }
.district-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2px 6px; padding: 9px 11px 12px; }
.check-option { display: flex; align-items: center; gap: 8px; min-height: 30px; color: #526660; font-size: 10px; cursor: pointer; }
.check-option input { accent-color: var(--green); }
.form-actions { display: flex; gap: 9px; margin-top: 16px; }
.sudin-list { display: grid; gap: 10px; }
.sudin-card { padding: 14px; border: 1px solid #e4ebe7; border-radius: 10px; }
.sudin-card-heading { display: flex; justify-content: space-between; gap: 10px; }
.sudin-card-heading h3 { margin: 0 0 4px; font: 700 13px 'Manrope', sans-serif; }
.sudin-card-heading span { color: #8c9b95; font-size: 9px; }
.sudin-card-mark { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; color: #4e8969; background: #eef6f0; }
.sudin-district-list { margin: 10px 0 11px; color: #526760; font-size: 10px; line-height: 1.8; }
.sudin-district-list small { color: #9aa6a1; }
.sudin-card-actions { display: flex; gap: 14px; padding-top: 10px; border-top: 1px solid #edf0ee; }
.text-button { padding: 0; border: 0; color: #377254; background: transparent; font-size: 10px; font-weight: 700; }
.text-button:hover { text-decoration: underline; }
.text-danger { color: #a04e43; }
.empty-state.compact { min-height: 100px; }
.empty-state.compact p { margin-top: 0; }
.button-link { padding: 0; border: 0; background: transparent; }
.app-navigation { display: flex; align-items: center; gap: 7px; margin-left: auto; margin-right: 24px; }
.nav-link { padding: 10px 12px; border-radius: 8px; color: #60736e; text-decoration: none; font-size: 12px; font-weight: 700; }
.nav-link:hover, .nav-link-active { color: var(--green-dark); background: #eaf4ee; }
.dashboard-main, .profile-main { padding: 35px 0 52px; }
.dashboard-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 13px 0 24px; }
.dashboard-heading .eyebrow { margin-bottom: 8px; }
.dashboard-heading h1 { margin: 0 0 8px; font: 800 clamp(30px, 4vw, 40px)/1.15 'Manrope', sans-serif; letter-spacing: -.055em; }
.dashboard-heading p:last-child { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.dashboard-heading .button { flex: 0 0 auto; text-decoration: none; }
.match-summary { display: flex; align-items: center; gap: 23px; margin: 0 0 20px; padding: 17px 21px; border: 1px solid #dceae1; border-radius: 13px; background: #eff7f1; }
.match-summary > div { display: grid; gap: 5px; }
.match-summary span:not(.summary-arrow) { color: #789087; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.match-summary strong { color: #285c49; font-size: 12px; }
.summary-arrow { color: #62a17d; font-size: 19px; }
.dashboard-match-panel { padding: 27px; }
.dashboard-match-panel .panel-heading { margin-bottom: 9px; }
.dashboard-match-panel > .muted-text { margin-bottom: 18px; }
.dashboard-filter { display: flex; align-items: end; gap: 13px; max-width: 590px; margin-bottom: 18px; }
.dashboard-filter .field { flex: 1; }
.dashboard-empty { min-height: 235px; margin: 14px 0 35px; padding: 30px; }
.dashboard-empty h2 { margin: 14px 0 0; font: 800 19px 'Manrope', sans-serif; letter-spacing: -.03em; }
.dashboard-empty p { max-width: 430px; }
.dashboard-empty .button { margin-top: 16px; text-decoration: none; }
.dashboard-match-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.dashboard-match-grid .match-card { margin-top: 0; }
.profile-main > .back-link { margin: 0; }
.profile-heading { margin: 22px 0; }
.profile-form-panel { max-width: 850px; margin-bottom: 35px; }
.profile-form-panel .submit-profile { margin-top: 20px; }
.mutation-status-panel { max-width: 850px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 23px 26px; margin: 18px 0 34px; }
.mutation-status-panel h2 { margin: 0 0 7px; font: 800 18px 'Manrope', sans-serif; }
.mutation-status-panel .muted-text { margin: 0; }
.mutation-status-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; }
.mutation-status-actions select { min-height: 42px; padding: 0 10px; border: 1px solid #dce5e3; border-radius: 8px; color: #263c40; background: #fff; font-size: 11px; }
.admin-users-panel { padding: 24px; margin-bottom: 40px; }
.admin-users-list { display: grid; gap: 12px; }
.admin-user-card { display: grid; grid-template-columns: minmax(190px, .85fr) minmax(0, 1.15fr); gap: 17px; padding: 17px; border: 1px solid #e2ebe5; border-radius: 11px; background: #fbfdfb; }
.admin-user-identity h3 { margin: 0 0 5px; font: 800 14px 'Manrope', sans-serif; }
.admin-user-identity p { margin: 0 0 8px; color: #527366; font-size: 11px; }
.admin-user-identity > span { color: var(--muted); font-size: 10px; line-height: 1.5; }
.admin-email-verification { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin: 0 0 8px; }
.email-verification-status { display: inline-flex; align-items: center; min-height: 23px; padding: 0 8px; border: 1px solid; border-radius: 20px; font-size: 9px; font-weight: 700; }
.email-verification-status.is-verified { border-color: #d6e9dc; color: #397653; background: #eff7f1; }
.email-verification-status.is-unverified { border-color: #f0e5c9; color: #86692f; background: #fffaf0; }
.admin-email-verification .button { min-height: 28px; padding: 0 9px; font-size: 9px; }
.admin-user-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; gap: 10px; }
.admin-user-meta > span { color: #405854; font-size: 10px; line-height: 1.45; }
.admin-user-meta > span small { display: block; margin-bottom: 3px; color: #91a09a; font-size: 9px; }
.admin-user-meta .field { gap: 5px; }
.admin-user-meta select { min-height: 38px; padding: 0 8px; border: 1px solid #dce5e3; border-radius: 7px; font-size: 10px; }
.admin-user-meta .button { min-height: 38px; padding: 0 10px; font-size: 10px; }
.deletion-request-card { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 12px; border: 1px solid #f0e5c9; border-radius: 9px; background: #fffaf0; }
.deletion-request-card p { margin: 0; color: #745c26; font-size: 10px; line-height: 1.5; }
.deletion-request-card > div { display: flex; flex-wrap: wrap; gap: 7px; }
.deletion-request-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; }
.deletion-request-card .button { min-height: 35px; padding: 0 10px; font-size: 9px; }
.admin-pagination { margin-top: 17px; }
.admin-pagination-nav { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.admin-pagination-summary { margin: 0; color: #82918c; font-size: 10px; }
.admin-pagination-links { display: flex; align-items: center; gap: 4px; }
.admin-pagination-link { min-width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; padding: 0 8px; border: 1px solid var(--line); border-radius: 6px; color: #54736a; background: #fff; text-decoration: none; font-size: 10px; line-height: 1; }
a.admin-pagination-link:hover { border-color: #b9d5c3; color: var(--green-dark); background: #f2f8f4; }
.admin-pagination-link.is-current { border-color: var(--green); color: #fff; background: var(--green); }
.admin-pagination-link.is-disabled, .admin-pagination-ellipsis { color: #aab5b0; background: #f8faf8; }
.admin-pagination-arrow { min-width: 30px; padding: 0; font-size: 13px; font-weight: 700; }

.welcome-body { min-height: 100vh; background: #f7f9f6; }
.welcome-shell { width: min(1180px, calc(100% - 64px)); margin: 0 auto; }
.welcome-header { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid #e7ece8; }
.welcome-nav { display: flex; align-items: center; gap: 12px; }
.welcome-nav > a:not(.button) { padding: 10px 12px; color: #60756f; text-decoration: none; font-size: 12px; font-weight: 600; }
.welcome-nav > a:not(.button):hover { color: var(--green); }
.welcome-nav .button { min-height: 40px; font-size: 11px; text-decoration: none; }
.welcome-nav .button-ghost { padding: 0 14px; }
.welcome-nav .button-primary span, .welcome-actions .button span { font-size: 16px; }
.welcome-hero { min-height: 505px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(350px, .86fr); align-items: center; gap: 45px; padding: 53px 5.4% 63px; }
.welcome-copy { max-width: 560px; }
.welcome-copy .eyebrow { display: flex; align-items: center; gap: 9px; color: #527d6c; }
.welcome-live-dot { width: 7px; height: 7px; border-radius: 50%; background: #45a276; box-shadow: 0 0 0 4px #e3f1e7; }
.welcome-copy h1 { margin: 0 0 19px; color: #173c37; font: 800 clamp(43px, 5.4vw, 67px)/1.05 'Manrope', sans-serif; letter-spacing: -.065em; }
.welcome-copy h1 em { color: var(--green); font-style: normal; }
.welcome-lead { max-width: 485px; margin-bottom: 25px; color: #6b7e79; font-size: 14px; line-height: 1.85; }
.welcome-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 20px; }
.welcome-actions .button { min-height: 48px; padding: 0 20px; text-decoration: none; }
.welcome-secondary-link { color: #57756c; text-decoration: none; font-size: 11px; font-weight: 700; }
.welcome-secondary-link:hover { color: var(--green-dark); }
.welcome-assurance { display: flex; align-items: center; gap: 9px; margin-top: 28px; color: #81918b; font-size: 10px; line-height: 1.5; }
.assurance-icon { width: 20px; height: 20px; display: grid; place-items: center; flex: 0 0 20px; border-radius: 50%; color: #347958; background: #e6f2e9; font-size: 11px; font-weight: 700; }
.welcome-visual { height: 330px; position: relative; display: grid; place-items: center; overflow: hidden; border: 1px solid #e4eee7; border-radius: 26px; background: radial-gradient(ellipse at 50% 47%, #fff 5%, #f1f7f2 70%); }
.visual-orbit { position: absolute; width: 280px; height: 200px; border: 1px solid #d5e8dc; border-radius: 50%; transform: rotate(-30deg); }
.visual-orbit-two { width: 240px; height: 175px; border-color: #eadfbe; transform: rotate(31deg); }
.visual-route { position: absolute; width: 175px; height: 1px; background: linear-gradient(90deg, #64b084, #e6bc62); transform: rotate(-26deg); }
.visual-route span { position: absolute; top: -5px; width: 11px; height: 11px; border: 3px solid #fff; border-radius: 50%; background: #59a97a; box-shadow: 0 0 0 1px #59a97a; }
.visual-route span:last-child { right: 0; background: #e0b456; box-shadow: 0 0 0 1px #e0b456; }
.visual-route i { position: absolute; top: -3px; left: 50%; width: 7px; height: 7px; border-radius: 50%; background: #b7cfc0; }
.region-card { position: absolute; z-index: 1; display: flex; align-items: center; gap: 10px; min-width: 165px; padding: 12px; border: 1px solid #e4ebe6; border-radius: 12px; background: #fff; box-shadow: 0 12px 32px rgba(26,68,48,.09); }
.region-card-west { top: 68px; left: 8%; }
.region-card-east { right: 6%; bottom: 67px; }
.region-pin { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; color: #387658; background: #e9f4ec; font: 800 12px 'Manrope', sans-serif; }
.region-pin-gold { color: #8e6c27; background: #faf2df; }
.region-card small { display: block; margin-bottom: 4px; color: #95a49c; font-size: 8px; font-weight: 700; letter-spacing: .13em; }
.region-card strong { color: #334f47; font: 700 11px 'Manrope', sans-serif; }
.visual-center-mark { z-index: 1; width: 43px; height: 43px; display: grid; place-items: center; border: 1px solid #e7eee8; border-radius: 50%; color: var(--green); background: #fff; box-shadow: 0 4px 16px rgba(26,68,48,.08); font-size: 20px; }
.visual-caption { position: absolute; bottom: 22px; color: #99aaa1; font-size: 8px; font-weight: 700; letter-spacing: .15em; }
.welcome-benefits { padding: 32px 5.4% 47px; border-top: 1px solid #e7ece8; }
.benefits-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.benefits-heading .eyebrow { margin-bottom: 8px; }
.benefits-heading h2 { max-width: 430px; margin: 0; color: #1b3b36; font: 800 25px/1.25 'Manrope', sans-serif; letter-spacing: -.045em; }
.benefit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.benefit-card { min-height: 125px; display: flex; gap: 14px; padding: 20px 17px; border: 1px solid #e5ece7; border-radius: 13px; background: rgba(255,255,255,.72); }
.benefit-number { color: #7ea88e; font: 800 10px 'Manrope', sans-serif; letter-spacing: .08em; }
.benefit-card h3 { margin: 0 0 7px; color: #294940; font: 700 13px 'Manrope', sans-serif; }
.benefit-card p { margin: 0; color: #82918a; font-size: 10px; line-height: 1.7; }
.welcome-footer { display: flex; justify-content: space-between; gap: 15px; padding: 18px 5.4% 22px; border-top: 1px solid #e7ece8; color: #91a099; font-size: 9px; }

.auth-body { min-height: 100vh; background: #f5f8f6; }
.auth-layout { min-height: 100vh; display: grid; grid-template-columns: minmax(300px, .88fr) minmax(440px, 1.12fr); }
.auth-aside { min-height: 100vh; display: flex; flex-direction: column; justify-content: space-between; padding: 42px clamp(28px, 6vw, 90px); overflow: hidden; position: relative; color: #fff; background: #123d38; }
.auth-aside::before, .auth-aside::after { position: absolute; content: ''; border: 1px solid rgba(205,235,216,.1); border-radius: 50%; pointer-events: none; }
.auth-aside::before { width: 520px; height: 520px; right: -300px; bottom: -110px; }
.auth-aside::after { width: 380px; height: 380px; right: -230px; bottom: -38px; }
.auth-brand { color: #fff; position: relative; z-index: 1; }
.auth-brand small { color: #b4ccc1; }
.auth-brand .brand-mark { color: #16463c; background: #a5d5b5; }
.auth-aside-content { max-width: 460px; position: relative; z-index: 1; margin: auto 0; padding: 75px 0; }
.auth-aside-content .eyebrow { color: #a2d3b4; }
.auth-aside-content h1 { margin: 0 0 17px; font: 800 clamp(36px, 4vw, 54px)/1.1 'Manrope', sans-serif; letter-spacing: -.06em; }
.auth-aside-content h1 em { color: #9dd3ae; font-style: normal; }
.auth-aside-content > p:not(.eyebrow) { max-width: 390px; color: #c2d6ce; font-size: 13px; line-height: 1.85; }
.auth-aside-note { display: flex; align-items: center; gap: 11px; margin-top: 30px; color: #d2e4d9; font-size: 11px; }
.auth-aside-note > span:first-child { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid rgba(202,233,211,.25); border-radius: 10px; color: #b5dfc1; font-size: 18px; }
.auth-aside-footer { position: relative; z-index: 1; color: #9ab8a9; font-size: 10px; }
.auth-main { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 45px clamp(24px, 7vw, 100px); }
.auth-mobile-brand { display: none; width: min(450px, 100%); margin-bottom: 25px; }
.auth-card { width: min(450px, 100%); padding: 38px 40px; border: 1px solid #e6ece8; border-radius: 17px; background: #fff; box-shadow: 0 16px 55px rgba(28,54,45,.06); }
.auth-heading { margin-bottom: 26px; }
.auth-heading .eyebrow { margin-bottom: 9px; color: #4f8069; }
.auth-heading h2 { margin: 0 0 9px; color: #193b35; font: 800 27px/1.2 'Manrope', sans-serif; letter-spacing: -.05em; }
.auth-heading > p:last-child { margin: 0; color: #7b8a85; font-size: 12px; line-height: 1.7; }
.auth-form { display: grid; gap: 17px; }
.auth-form .field { gap: 7px; }
.auth-form .field label { color: #405750; font-size: 11px; font-weight: 700; }
.auth-input { width: 100%; min-height: 46px; padding: 0 13px; border: 1px solid #dce5e1; border-radius: 8px; outline: none; color: #263c40; background: #fff; font-size: 12px; transition: border-color .15s, box-shadow .15s; }
.auth-input:focus { border-color: #70ac91; box-shadow: 0 0 0 3px rgba(43,137,98,.1); }
.auth-input::placeholder { color: #a4b0b0; }
.auth-form-options { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: -2px; }
.auth-checkbox { display: inline-flex; align-items: center; gap: 8px; color: #72827b; font-size: 11px; cursor: pointer; }
.auth-checkbox input { width: 15px; height: 15px; margin: 0; accent-color: var(--green); }
.auth-link { color: var(--green); text-decoration: none; font-size: 11px; font-weight: 700; }
.auth-link:hover { color: var(--green-dark); text-decoration: underline; }
.auth-submit { width: 100%; min-height: 46px; margin-top: 3px; border: 0; color: white; text-transform: none; letter-spacing: 0; font-size: 12px; }
.auth-switch { margin: 23px 0 0; padding-top: 19px; border-top: 1px solid #edf0ee; color: #82908a; text-align: center; font-size: 11px; }
.auth-switch .auth-link { margin-left: 3px; }
.auth-status { margin: -8px 0 18px; padding: 11px 12px; border: 1px solid #d6e9dc; border-radius: 8px; color: #367251; background: #eff7f1; font-size: 11px; line-height: 1.55; }
.auth-status.notice { margin: 0 0 18px; }
.auth-form .field-error { margin: -2px 0 0; padding-left: 1px; color: var(--red); font-size: 10px; line-height: 1.45; }
.auth-footer { width: min(450px, 100%); margin: 17px 0 0; text-align: center; }
.auth-footer a { color: #899791; text-decoration: none; font-size: 10px; }
.auth-footer a:hover { color: var(--green); }
.auth-logout { display: block; margin: 17px auto 0; padding: 6px 10px; border: 0; color: #75867f; background: transparent; font-size: 11px; }
.auth-logout:hover { color: var(--green); }

@media (max-width: 850px) {
    .welcome-shell { width: min(100% - 40px, 700px); }
    .welcome-hero { min-height: auto; grid-template-columns: minmax(0, 1fr) minmax(280px, .8fr); gap: 25px; padding: 55px 2% 48px; }
    .welcome-visual { height: 285px; }
    .region-card { min-width: 145px; padding: 10px; }
    .region-card-west { left: 4%; }
    .region-card-east { right: 3%; }
    .benefits-heading h2 { font-size: 22px; }
    .auth-layout { grid-template-columns: minmax(260px, .78fr) minmax(420px, 1.22fr); }
    .auth-aside { padding: 35px 30px; }
    .auth-main { padding: 35px 28px; }
    .auth-card { padding: 32px 30px; }
    .hero { padding-left: 6%; padding-right: 5%; }
    .hero-art { width: 205px; flex-basis: 205px; transform: scale(.85); transform-origin: center right; margin-left: -20px; }
    .content-grid, .admin-grid { grid-template-columns: 1fr; }
    .side-column { grid-template-columns: minmax(0,1fr) minmax(240px,.8fr); align-items: start; }
    .sudin-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .dashboard-match-grid { grid-template-columns: 1fr; }
    .app-navigation { margin-right: 10px; }
    .nav-link { padding: 9px 8px; font-size: 11px; }
    .mutation-status-panel { align-items: stretch; flex-direction: column; }
    .mutation-status-actions { justify-content: flex-start; }
    .admin-user-card { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .welcome-shell { width: min(100% - 32px, 480px); }
    .welcome-header { min-height: 72px; }
    .welcome-header .brand { font-size: 12px; }
    .welcome-header .brand-mark { width: 34px; height: 34px; }
    .welcome-nav { gap: 5px; }
    .welcome-nav > a:not(.button) { display: none; }
    .welcome-nav .button { min-height: 36px; padding: 0 10px; font-size: 10px; }
    .welcome-nav .button-ghost { display: none; }
    .welcome-hero { grid-template-columns: 1fr; gap: 29px; padding: 49px 1% 37px; }
    .welcome-copy h1 { font-size: clamp(43px, 12vw, 58px); }
    .welcome-lead { font-size: 12px; }
    .welcome-actions { align-items: flex-start; flex-direction: column; gap: 14px; }
    .welcome-actions .button { min-height: 45px; }
    .welcome-assurance { margin-top: 20px; }
    .welcome-visual { height: 250px; border-radius: 19px; }
    .visual-orbit { width: 235px; height: 165px; }
    .visual-orbit-two { width: 205px; height: 145px; }
    .region-card-west { top: 43px; left: 2%; }
    .region-card-east { right: 2%; bottom: 49px; }
    .visual-caption { bottom: 14px; font-size: 7px; }
    .welcome-benefits { padding: 25px 1% 32px; }
    .benefits-heading { margin-bottom: 16px; }
    .benefits-heading h2 { font-size: 20px; }
    .benefit-grid { grid-template-columns: 1fr; gap: 9px; }
    .benefit-card { min-height: 0; padding: 15px; }
    .welcome-footer { flex-direction: column; gap: 6px; padding: 15px 1% 19px; font-size: 8px; }
    .auth-layout { display: block; min-height: 100vh; }
    .auth-aside { display: none; }
    .auth-main { min-height: 100vh; justify-content: flex-start; padding: 27px 18px 23px; }
    .auth-mobile-brand { display: block; margin-bottom: 22px; }
    .auth-card { padding: 27px 22px; border-radius: 14px; }
    .auth-heading { margin-bottom: 22px; }
    .auth-heading h2 { font-size: 24px; }
    .auth-form { gap: 15px; }
    .auth-footer { margin-top: 14px; }
    .page-shell { width: min(100% - 28px, 500px); }
    .topbar { height: 69px; }
    .brand { gap: 9px; font-size: 13px; }
    .brand-mark { width: 35px; height: 35px; border-radius: 11px; }
    .quiet-link { font-size: 10px; }
    .account-actions { gap: 9px; }
    .account-name { display: none; }
    .topbar { flex-wrap: wrap; height: auto; min-height: 69px; padding: 10px 0; }
    .app-navigation { order: 3; width: 100%; margin: 7px 0 0; border-top: 1px solid var(--line); padding-top: 6px; }
    .nav-link { flex: 1; text-align: center; }
    .dashboard-main, .profile-main { padding-top: 23px; }
    .dashboard-heading { align-items: flex-start; flex-direction: column; gap: 14px; margin: 17px 0; }
    .dashboard-heading h1 { font-size: 31px; }
    .match-summary { align-items: flex-start; flex-direction: column; gap: 10px; padding: 15px; }
    .summary-arrow { transform: rotate(90deg); }
    .dashboard-match-panel { padding: 20px 15px; }
    .dashboard-filter { align-items: stretch; flex-direction: column; }
    .admin-users-panel { padding: 19px 14px; }
    .admin-user-meta { grid-template-columns: 1fr; }
    .deletion-request-card { align-items: stretch; flex-direction: column; }
    .admin-pagination-nav { align-items: flex-start; flex-direction: column; }
    .admin-pagination-links { max-width: 100%; flex-wrap: wrap; }
    .hero { min-height: 258px; align-items: flex-start; margin: 19px 0 16px; padding: 34px 23px; border-radius: 17px; }
    .hero h1 { font-size: 37px; }
    .hero-copy { max-width: 340px; font-size: 12px; }
    .hero-art { position: absolute; right: -12px; bottom: -37px; opacity: .3; transform: scale(.7); }
    .notice { padding: 12px; }
    .notice p { font-size: 10px; }
    .content-grid { gap: 14px; margin-top: 15px; }
    .form-panel { padding: 22px 17px 19px; }
    .panel-heading h2 { font-size: 18px; }
    .field-grid, .destination-builder .field-grid { grid-template-columns: 1fr; gap: 13px; }
    .field-wide { grid-column: auto; }
    .location-grid .field-wide { grid-column: auto; }
    .section-divider { margin: 20px 0 17px; }
    .section-title h3 { font-size: 15px; }
    .destination-builder { padding: 12px; }
    .selected-destinations { grid-template-columns: 1fr; }
    .side-column { grid-template-columns: 1fr; }
    .match-panel { padding: 21px 17px 17px; }
    .footer { flex-direction: column; gap: 6px; font-size: 8px; }
    .admin-intro h1 { font-size: 27px; }
    .sudin-form-panel, .sudin-list-panel { padding: 19px 15px; }
    .sudin-list { grid-template-columns: 1fr; }
    .district-options { grid-template-columns: 1fr 1fr; }
}