:root {
    --bg: #f4f7f8;
    --surface: #ffffff;
    --text: #16313a;
    --muted: #6c8189;
    --line: #dbe5e8;
    --primary: #0a7f6f;
    --primary-dark: #075d53;
    --danger: #d9534f;
    --warning: #d88a17;
    --shadow: 0 20px 60px rgba(8, 36, 42, 0.08);
    --radius: 20px;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: "Segoe UI", Tahoma, sans-serif; background: radial-gradient(circle at 12% 8%, rgba(10,127,111,.12), transparent 30%), linear-gradient(180deg, #eef7f5 0%, var(--bg) 100%); color: var(--text); }
body.modal-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
.container { width: min(1180px, calc(100% - 32px)); margin: 0 auto; }
.site-header { position: sticky; top: 0; background: rgba(244,247,248,.9); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(219,229,232,.8); z-index: 10; }
.nav-shell { display: flex; align-items: center; justify-content: space-between; padding: 18px 0; gap: 20px; }
.brand { font-size: 1.4rem; font-weight: 800; letter-spacing: .02em; }
.main-nav { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.main-nav a { padding: 10px 14px; border-radius: 999px; color: var(--muted); }
.main-nav a.active, .main-nav a:hover, .button-link { background: var(--surface); color: var(--text); box-shadow: var(--shadow); }
.page-shell { padding-bottom: 48px; }
.hero { padding: 56px 0 24px; }
.hero-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 24px; align-items: stretch; }
.hero-simple { padding-bottom: 8px; }
.hero-compact { display: grid; grid-template-columns: 1fr; gap: 18px; }
.hero-copy { max-width: 760px; }
.home-hero { padding: 54px 0 12px; position: relative; overflow: hidden; }
.home-hero::before { content: ""; position: absolute; width: 420px; height: 420px; right: -140px; top: -180px; border-radius: 50%; background: radial-gradient(circle, rgba(10,127,111,.18), rgba(10,127,111,0) 68%); pointer-events: none; }
.home-hero::after { content: ""; position: absolute; width: 240px; height: 240px; left: -90px; bottom: -140px; border-radius: 50%; background: radial-gradient(circle, rgba(216,138,23,.12), rgba(216,138,23,0) 72%); pointer-events: none; }
.home-hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 760px); justify-content: center; gap: 0; align-items: center; }
.hero-copy-home { max-width: 680px; text-align: left; }
.eyebrow { display: inline-block; padding: 8px 12px; border-radius: 999px; background: #dff6ee; color: var(--primary-dark); font-size: .85rem; font-weight: 700; }
h1, h2, h3 { margin: 0 0 14px; line-height: 1.1; }
h1 { font-size: clamp(2rem, 4vw, 3.8rem); }
.lead { font-size: 1.05rem; color: var(--muted); max-width: 60ch; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 18px; border-radius: 14px; border: 0; cursor: pointer; font-weight: 700; }
.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--primary-dark); }
.btn-secondary { background: #fff; color: var(--text); border: 1px solid var(--line); }
.btn-danger { background: var(--danger); color: #fff; }
.btn-small { padding: 8px 12px; font-size: .85rem; }
.hero-card, .card, .facility-card, .table-card { background: var(--surface); border: 1px solid rgba(219,229,232,.9); border-radius: var(--radius); box-shadow: var(--shadow); }
.hero-card { padding: 28px; }
.metric-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; }
.compact-list { margin-top: 14px; }
.metric-list li { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 1px solid var(--line); padding-bottom: 12px; }
.metric-list strong { font-size: 1.4rem; }
.info-dropdown { margin-top: 18px; background: var(--surface); border: 1px solid rgba(219,229,232,.9); border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px 18px; }
.info-dropdown summary { cursor: pointer; font-weight: 700; }
.section { padding: 24px 0; }
.section-head { display: flex; justify-content: space-between; gap: 16px; align-items: end; margin-bottom: 20px; }
.home-status-section { padding-top: 12px; }
.home-section-head { padding: 20px 22px; border: 1px solid rgba(219,229,232,.8); border-radius: 26px; background: rgba(255,255,255,.66); backdrop-filter: blur(10px); box-shadow: 0 16px 44px rgba(8, 36, 42, .06); }
.facility-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 18px; }
.home-facility-grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.facility-card { padding: 22px; }
.facility-link-card { padding: 0; overflow: hidden; }
.facility-link-overlay { display: block; padding: 22px; }
.home-facility-card { min-height: 100%; background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; position: relative; }
.home-facility-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 5px; background: linear-gradient(90deg, var(--primary), #f0b94b); opacity: .9; }
.home-facility-card:hover { transform: translateY(-4px); box-shadow: 0 24px 70px rgba(8, 36, 42, .12); }
.block-card { margin-bottom: 18px; }
.facility-top { display: flex; justify-content: space-between; gap: 16px; align-items: start; margin-bottom: 18px; }
.facility-top-wrap { align-items: center; }
.facility-top-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.badge { padding: 8px 10px; border-radius: 999px; background: #eef4f5; color: var(--muted); white-space: nowrap; }
.slot-mini-list, .slot-grid { display: grid; gap: 10px; }
.slot-grid { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.slot-chip, .slot-card { border-radius: 16px; padding: 12px 14px; border: 1px solid transparent; display: flex; flex-direction: column; gap: 6px; transition: transform .15s ease, box-shadow .15s ease; }
.context-label { margin-bottom: 12px; color: var(--muted); font-size: .92rem; font-weight: 700; }
.slot-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.slot-card[data-disabled="1"] { pointer-events: none; }
.slot-action { display: inline-flex; align-items: center; align-self: flex-start; margin-top: 2px; padding: 6px 10px; border-radius: 999px; background: rgba(255,255,255,.72); color: var(--primary-dark); font-size: .82rem; font-weight: 800; }
.slot-owner { display: inline-flex; align-items: center; align-self: flex-start; padding: 5px 8px; border-radius: 999px; background: rgba(255,255,255,.7); color: #52666f; font-size: .8rem; font-weight: 700; }
.facility-history-card .slot-grid { gap: 12px; grid-template-columns: repeat(auto-fit, minmax(178px, 1fr)); }
.facility-history-card .slot-card { position: relative; overflow: hidden; min-height: 116px; padding: 14px; border-radius: 18px; border-color: #dfeae8; background: linear-gradient(160deg, #ffffff 0%, #f7fbfa 100%); box-shadow: 0 12px 28px rgba(16,58,61,.05); }
.facility-history-card .slot-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 5px; background: #b8c8cc; opacity: .9; }
.facility-history-card .slot-card-time { display: inline-flex; align-items: center; width: fit-content; padding: 6px 9px; border-radius: 999px; background: rgba(255,255,255,.78); color: #55727a; border: 1px solid rgba(211,224,227,.85); font-size: .78rem; font-weight: 800; }
.prime-slot-badge { position: absolute; top: 12px; right: 12px; z-index: 2; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #fff4d9; color: #9a6511; border: 1px solid #efd7a4; box-shadow: 0 8px 18px rgba(154,101,17,.14); font-size: 1rem; font-weight: 900; line-height: 1; }
.prime-slot-note { display: inline-flex; align-items: center; gap: 8px; width: fit-content; max-width: 100%; margin-top: -4px; padding: 10px 12px; border-radius: 14px; background: #fffaf0; color: #6f5a28; border: 1px solid #efe0bd; font-size: .9rem; font-weight: 750; line-height: 1.35; }
.prime-slot-note span { display: inline-grid; place-items: center; flex: 0 0 auto; width: 24px; height: 24px; border-radius: 50%; background: #fff4d9; color: #9a6511; border: 1px solid #efd7a4; font-size: .82rem; line-height: 1; }
.facility-history-card .slot-card-status { margin-top: 2px; color: #173f43; font-size: 1.04rem; line-height: 1.1; }
.facility-history-card .slot-owner { margin-top: auto; background: rgba(255,255,255,.74); border: 1px solid rgba(214,225,226,.8); color: #4f6970; }
.facility-history-card .slot-card:hover { transform: translateY(-3px); box-shadow: 0 18px 36px rgba(16,58,61,.11); }
.status-available { background: #e3f9f2; color: #116355; border-color: #bcebdc; }
.facility-history-card .status-available { background: linear-gradient(160deg, #f7fffb 0%, #e9f8f0 100%); border-color: #caead7; color: #145f4f; }
.facility-history-card .status-available::before { background: #4fbf82; }
.facility-history-card .status-available .slot-card-time { color: #176c58; background: rgba(255,255,255,.82); border-color: #caead7; }
.status-reserved, .status-checked_in, .status-checked, .status-no_show { background: #eef2f5; color: #405761; border-color: #dde5ea; }
.facility-history-card .status-reserved,
.facility-history-card .status-checked_in,
.facility-history-card .status-checked,
.facility-history-card .status-no_show { background: linear-gradient(160deg, #fffdf7 0%, #fff3d9 100%); border-color: #f0dfb7; color: #6f5219; }
.facility-history-card .status-reserved::before,
.facility-history-card .status-checked_in::before,
.facility-history-card .status-checked::before,
.facility-history-card .status-no_show::before { background: #efb34a; }
.facility-history-card .status-reserved .slot-card-status,
.facility-history-card .status-checked_in .slot-card-status,
.facility-history-card .status-checked .slot-card-status,
.facility-history-card .status-no_show .slot-card-status { color: #7a5512; }
.facility-history-card .status-reserved .slot-card-time,
.facility-history-card .status-checked_in .slot-card-time,
.facility-history-card .status-checked .slot-card-time,
.facility-history-card .status-no_show .slot-card-time { color: #8a6418; border-color: #efdcb1; }
.status-closed, .status-blocked { background: #f2f4f6; color: #667b84; border-color: #d6dfe5; }
.facility-history-card .status-closed,
.facility-history-card .status-blocked { background: linear-gradient(160deg, #fbfcfc 0%, #edf2f2 100%); border-color: #d8e2e2; color: #63797e; }
.facility-history-card .status-closed::before,
.facility-history-card .status-blocked::before { background: #a7b8bc; }
.facility-history-card .status-closed .slot-card-status,
.facility-history-card .status-blocked .slot-card-status { color: #60777d; }
.status-maintenance, .status-event { background: #fff5df; color: #986100; border-color: #f1d896; }
.facility-link-footer { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); color: var(--primary-dark); font-weight: 800; }
.facility-link-footer span { display: inline-flex; align-items: center; gap: 8px; }
.facility-link-footer span::after { content: "→"; width: 24px; height: 24px; display: inline-grid; place-items: center; border-radius: 999px; background: #e3f9f2; }
.reservation-players { margin: 18px 0; display: grid; gap: 12px; }
.reservation-builder-card { max-width: 760px; margin: 0 auto; padding: 32px; }
.reservation-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 18px; }
.summary-pill { padding: 14px 16px; border-radius: 18px; border: 1px solid var(--line); background: linear-gradient(180deg, #ffffff 0%, #f6fbfb 100%); }
.summary-pill span { display: block; color: var(--muted); font-size: .86rem; margin-bottom: 6px; }
.builder-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; margin-bottom: 10px; }
.fancy-builder { padding: 18px; border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(180deg, #fbfefe 0%, #f5faf9 100%); }
.player-stack { display: grid; gap: 12px; }
.player-chip-card { padding: 14px; border: 1px solid #cfdbe0; border-radius: 18px; background: #fff; box-shadow: 0 10px 24px rgba(8, 36, 42, 0.05); }
.player-chip-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; font-weight: 700; color: var(--primary-dark); }
.player-detail-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.player-lookup-field { grid-column: 1 / -1; }
.mini-field-label { display: grid; gap: 6px; font-size: .86rem; font-weight: 700; color: var(--muted); }
.mini-field-label span { font-size: .76rem; font-weight: 500; color: #8a9aa1; line-height: 1.35; }
.field-status { font-size: .82rem; color: var(--muted); min-height: 1.2em; }
.field-status[data-state="available"] { color: #197447; }
.field-status[data-state="taken"], .field-status[data-state="error"] { color: #a71932; }
input[data-lookup-state="available"] { border-color: #35a66d; background: #effbf3; box-shadow: 0 0 0 3px rgba(53, 166, 109, .12); }
input[data-lookup-state="taken"], input[data-lookup-state="error"] { border-color: #d9534f; background: #fff3f2; box-shadow: 0 0 0 3px rgba(217, 83, 79, .1); }
.player-detail-fields .is-private:disabled { opacity: 1; color: #6d7f86; -webkit-text-fill-color: #6d7f86; background: #f1f5f5; border-style: dashed; cursor: not-allowed; font-weight: 700; letter-spacing: .08em; }
@media (max-width: 640px) { .builder-head { align-items: stretch; flex-direction: column; } .builder-head .btn, .player-actions-bottom .btn { width: 100%; } .player-detail-fields { grid-template-columns: 1fr; } .reservation-builder-card { padding: 20px; } }
.player-remove { border: 0; background: #edf3f5; color: #56717a; width: 32px; height: 32px; border-radius: 999px; cursor: pointer; font-size: 1.1rem; }
.btn:disabled { opacity: .55; cursor: not-allowed; }
.alert { padding: 14px 16px; border-radius: 14px; margin-bottom: 16px; }
.alert-success { background: #e2f8ee; color: #1f6b4f; }
.alert-error { background: #fdeceb; color: #9b2d27; }
.alert-warning { background: #fff4dd; color: #8b5c00; }
.alert-info { background: #e7f2f8; color: #245d75; }
.auth-shell { padding: 36px 0 60px; display: flex; justify-content: center; }
.form-card { width: min(560px, 100%); padding: 28px; }
.register-card { width: min(860px, 100%); }
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
label { display: grid; gap: 8px; font-weight: 600; color: var(--text); }
input, textarea, select { width: 100%; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--line); background: #fff; font: inherit; }
input[type="tel"], input[type="text"], input[type="date"] { min-height: 48px; font-size: 1rem; }
input[data-username-state="available"] { border-color: #35a66d; background: #effbf3; box-shadow: 0 0 0 3px rgba(53, 166, 109, .12); }
input[data-username-state="taken"], input[data-username-state="error"] { border-color: #d9534f; background: #fff3f2; box-shadow: 0 0 0 3px rgba(217, 83, 79, .1); }
textarea { min-height: 100px; resize: vertical; }
.checkbox { display: flex; align-items: center; gap: 10px; margin: 14px 0; }
.checkbox input { width: auto; }
.text-link-button { display: inline; padding: 0; border: 0; background: none; color: var(--primary-dark); font: inherit; font-weight: 700; text-decoration: underline; cursor: pointer; }
.text-link-button:hover { color: #a71932; }
.narrow-card { max-width: 540px; margin: 0 auto; padding: 28px; }
.inline-form { display: flex; gap: 10px; align-items: center; }
.table-card, .profile-card { padding: 18px; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 14px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.my-reservations-card { overflow-x: auto; }
.my-reservations-table td { overflow-wrap: anywhere; }
.muted { color: var(--muted); }
.profile-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.profile-grid span { display: block; color: var(--muted); font-size: .9rem; margin-bottom: 6px; }
.info-page { max-width: 900px; }
.info-card { padding: clamp(24px, 5vw, 48px); line-height: 1.7; }
.info-card h1 { margin-top: 12px; }
.info-card h2 { margin-top: 32px; font-size: 1.35rem; }
.info-card ul { padding-left: 22px; }
.info-card li + li { margin-top: 8px; }
.rules-page { display: grid; gap: 18px; }
.rules-hero { padding: clamp(26px, 5vw, 54px); background: linear-gradient(145deg, rgba(255,255,255,.86), rgba(235,248,244,.82)); border-color: rgba(187, 217, 209, .9); }
.rules-hero h1 { max-width: 840px; margin: 8px 0 12px; color: #143c43; font: 800 clamp(2.2rem, 6vw, 4.4rem)/.98 Georgia, serif; letter-spacing: -.06em; }
.rules-hero p { max-width: 760px; color: var(--muted); font-size: 1.05rem; line-height: 1.55; }
.rules-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.rule-card { position: relative; overflow: hidden; min-height: 210px; padding: 22px; border: 1px solid rgba(215, 229, 226, .95); border-radius: 22px; background: rgba(255,255,255,.72); box-shadow: 0 18px 38px rgba(16,58,61,.07); }
.rule-card::after { content: ""; position: absolute; width: 120px; height: 120px; right: -40px; bottom: -50px; border-radius: 50%; background: #83cdbd; opacity: .12; }
.prime-rule-card { border-color: #ead8b8; background: linear-gradient(145deg, rgba(255,255,255,.82), rgba(255,250,240,.72)); }.prime-rule-card::after { background: #e2b45d; opacity: .14; }
.rule-card span { display: inline-flex; margin-bottom: 18px; color: #1e8174; font: 800 .78rem/1 "Segoe UI", sans-serif; letter-spacing: .12em; }
.rule-card h2 { margin: 0 0 10px; color: #173f43; font-size: 1.24rem; }
.rule-card p { margin: 0; color: #5f777d; line-height: 1.55; }
.rule-card strong, .rules-detail-list strong { color: #143c43; }
.rules-detail-card { display: grid; grid-template-columns: minmax(240px, .8fr) minmax(0, 1.4fr); gap: 20px; padding: clamp(22px, 4vw, 36px); background: rgba(255,255,255,.74); }
.rules-detail-card h2 { margin: 8px 0 0; color: #143c43; font-size: clamp(1.6rem, 3vw, 2.4rem); }
.rules-detail-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.rules-detail-list div { padding: 16px; border: 1px solid #dce9e5; border-radius: 16px; background: rgba(247,252,250,.82); }
.rules-detail-list p { margin: 7px 0 0; color: #617a80; line-height: 1.5; }
.mtesis-facility-card { position: relative; overflow: hidden; isolation: isolate; padding: 25px; border-color: #d6e8e3; background: linear-gradient(145deg, #ffffff 0%, #f2faf7 65%, #e8f5f0 100%); text-decoration: none; color: inherit; }.mtesis-facility-card::before { content: ""; position: absolute; z-index: -1; width: 170px; height: 170px; top: -86px; right: -58px; border-radius: 50%; background: radial-gradient(circle, rgba(139, 215, 188, .34), transparent 68%); transition: transform .25s ease; }.mtesis-facility-card::after { content: ""; position: absolute; z-index: -1; right: 0; bottom: 0; width: 100%; height: 4px; background: linear-gradient(90deg, #1e8a7d, #b9d46e); transform: scaleX(.28); transform-origin: left; transition: transform .24s ease; }.mtesis-facility-card:hover { transform: translateY(-7px); box-shadow: 0 27px 58px rgba(16,58,61,.16); }.mtesis-facility-card:hover::before { transform: scale(1.25); }.mtesis-facility-card:hover::after { transform: scaleX(1); }.mtesis-card-top { padding-bottom: 15px; border-bottom: 1px solid #dfece8; }.mtesis-court-number { color: #99bcb3; font-size: 2.1rem; }.mtesis-type { background: #dff5ed; box-shadow: 0 5px 12px rgba(22,113,100,.08); }.mtesis-facility-card h3 { margin-top: 18px; font-size: 1.6rem; }.mtesis-card-meter { margin-top: 20px; border-top: 0; }.mtesis-slot { padding: 10px 12px; border: 1px solid transparent; }.mtesis-slot.is-available { border-color: #d2eddd; }.mtesis-slot.is-reserved, .mtesis-slot.is-checked_in, .mtesis-slot.is-checked { border-color: #f5ddb2; }.mtesis-card-link { margin-top: 16px; padding: 14px 15px; border-radius: 13px; background: #173f43; color: #fff; transition: background .2s ease, transform .2s ease; }.mtesis-card-link span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #d9f588; color: #173f43; }.mtesis-facility-card:hover .mtesis-card-link { background: #1f7169; }.mtesis-facility-card:hover .mtesis-card-link span { transform: translateX(3px); }
.mtesis-info-strip { color: #21464a; background: radial-gradient(circle at 8% 110%, rgba(192, 234, 220, .75), transparent 35%), linear-gradient(115deg, #f7fbfa 0%, #e8f4f0 52%, #edf5ed 100%); border: 1px solid #d5e7e1; box-shadow: 0 20px 48px rgba(16,58,61,.09); }.mtesis-info-strip h2 { color: #163e42; }.mtesis-info-strip .mtesis-kicker { color: #287d70; }.mtesis-info-strip > p { color: #587278; }.mtesis-info-strip .btn-primary { color: #fff; background: linear-gradient(135deg, #ad1739, #d33e58); border-color: #ad1739; box-shadow: 0 13px 24px rgba(173,23,57,.27); }.mtesis-info-strip .btn-primary:hover { background: linear-gradient(135deg, #c21b43, #e14b63); transform: translateY(-2px); }.mtesis-info-strip .btn-secondary { color: #173e43; background: #fff; border-color: #cddfdb; box-shadow: 0 10px 20px rgba(8,36,42,.07); }
.mtesis-facility-image, .facility-hero-image, .facility-inline-image { display: block; width: 100%; object-fit: cover; object-position: center 62%; background: #eaf3f1; }
.mtesis-facility-image { height: 132px; margin: -8px -8px 15px; width: calc(100% + 16px); border-radius: 17px; }
.facility-hero-image { height: clamp(150px, 19vw, 230px); margin: -4px 0 16px; border-radius: 18px; box-shadow: 0 14px 34px rgba(16,58,61,.08); }
.facility-inline-image { height: clamp(120px, 16vw, 190px); border-radius: 16px; }
.facility-detail-head.has-image { align-items: center; padding: 18px; border: 1px solid #d7e8e3; border-radius: 24px; background: rgba(255,255,255,.7); box-shadow: 0 14px 34px rgba(16,58,61,.06); }
.facility-detail-head .facility-hero-image { flex: 0 0 min(32vw, 420px); width: min(32vw, 420px); height: 210px; margin: 0; border-radius: 18px; box-shadow: none; }
.facility-detail-head h1 { font-size: clamp(2.6rem, 6vw, 5.3rem); }
.facility-detail-head h2 { margin-bottom: 6px; }
@media (min-width: 960px) {
    .mtesis-facility-card.has-facility-image { display: grid; grid-template-columns: minmax(280px, 380px) minmax(0, 1fr); grid-template-rows: auto auto 1fr auto; gap: 0 24px; align-items: start; }
    .mtesis-facility-card.has-facility-image::before { width: 120px; height: 120px; top: -55px; right: -36px; }
    .mtesis-facility-card.has-facility-image::after { z-index: 2; }
    .mtesis-facility-image { grid-column: 1; grid-row: 1 / span 4; width: 100%; height: 260px; margin: 0; border-radius: 16px; object-position: center 54%; filter: saturate(1.03) contrast(1.02); }
    .mtesis-facility-card.has-facility-image .mtesis-card-top { grid-column: 1; grid-row: 1; z-index: 2; padding: 14px; border-bottom: 0; }
    .mtesis-facility-card.has-facility-image .mtesis-court-number { color: rgba(255,255,255,.82); text-shadow: 0 2px 10px rgba(0,0,0,.35); }
    .mtesis-facility-card.has-facility-image .mtesis-type { color: #0d6a5e; background: rgba(225,250,240,.92); box-shadow: 0 6px 16px rgba(0,0,0,.12); }
    .mtesis-facility-card.has-facility-image h3 { grid-column: 1; grid-row: 3; z-index: 2; align-self: end; margin: 0 16px 5px; color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.5); }
    .mtesis-facility-card.has-facility-image > p { grid-column: 1; grid-row: 4; z-index: 2; min-height: 0; margin: 0 16px 16px; color: rgba(255,255,255,.9); text-shadow: 0 2px 10px rgba(0,0,0,.48); }
    .mtesis-facility-card.has-facility-image .mtesis-card-meter { grid-column: 2; grid-row: 1; margin: 0 0 16px; padding: 0 0 14px; border-bottom: 1px solid #dfece8; }
    .mtesis-facility-card.has-facility-image .mtesis-slot-list { grid-column: 2; grid-row: 2 / span 3; align-self: stretch; }
    .mtesis-facility-card .mtesis-card-link { grid-column: 1 / -1; }
}
@media (max-width: 820px) {
    .facility-detail-head.has-image { display: grid; padding: 14px; border-radius: 22px; }
    .facility-detail-head .facility-hero-image { width: 100%; height: clamp(150px, 34vw, 240px); }
}
.mtesis-prime-rule { display: grid; grid-template-columns: minmax(220px, .8fr) minmax(0, 1.2fr); gap: 18px; align-items: center; margin-top: 22px; padding: 22px 24px; border: 1px solid #ead8b8; border-radius: 20px; background: linear-gradient(115deg, #fffaf0 0%, #f4fbf8 100%); box-shadow: 0 16px 38px rgba(16,58,61,.07); }.mtesis-prime-rule h2 { margin: 0; color: #173f43; font: 800 clamp(1.55rem, 3vw, 2.2rem)/1.02 Georgia, serif; letter-spacing: -.04em; }.mtesis-prime-rule p:not(.mtesis-kicker) { margin: 0; color: #5f777d; line-height: 1.6; font-weight: 700; }.mtesis-prime-rule .mtesis-kicker { color: #a56b12; }
.mtesis-prime-status { display: grid; grid-template-columns: minmax(0, 1fr) 104px; gap: 16px; align-items: center; margin-top: 18px; padding: 18px 20px; border-radius: 18px; border: 1px solid #d7e8e3; background: linear-gradient(115deg, #fbfdfc 0%, #eef8f5 100%); box-shadow: 0 10px 24px rgba(16,58,61,.05); }.mtesis-prime-status.is-exhausted { border-color: #efd8d8; background: linear-gradient(115deg, #fffafa 0%, #f8fbfa 100%); }.mtesis-prime-status h2 { margin: 0; color: #173f43; font: 800 clamp(1.3rem, 3vw, 1.85rem)/1.04 Georgia, serif; letter-spacing: -.04em; }.mtesis-prime-reset { margin: 7px 0 0; color: #60777d; font-size: .9rem; font-weight: 800; }.mtesis-prime-meter { display: grid; place-items: center; min-height: 86px; border-radius: 15px; background: #245b5c; color: #fff; text-align: center; }.mtesis-prime-meter strong { font: 800 2.25rem/.8 Georgia, serif; letter-spacing: -.06em; }.mtesis-prime-meter span { margin-top: 7px; color: #d8eee8; font-weight: 800; font-size: .78rem; }.mtesis-prime-status.is-exhausted .mtesis-prime-meter { background: #b21d3c; }

.mtesis-card-meter { display: flex; gap: 12px; padding: 13px 0; }
.mtesis-card-meter span { padding: 8px 11px; border-radius: 999px; background: #e8f8ee; color: #216f51; font-size: .84rem; font-weight: 900; }

/* Auth page final overrides */
.auth-page .auth-card, .auth-page .register-card.auth-card { position: relative; width: 100%; padding: clamp(22px, 3vw, 34px); border: 1px solid #d7e7e3; border-radius: 24px; background: rgba(255,255,255,.97); box-shadow: 0 26px 68px rgba(8,36,42,.15); }
.auth-page .auth-card::before, .auth-page .register-card.auth-card::before { background: linear-gradient(90deg, #1e8a7d, #dff4a5); }
.auth-page .auth-card input:focus, .auth-page .register-card.auth-card input:focus { border-color: #1e8a7d; box-shadow: 0 0 0 4px rgba(30,138,125,.12); }
.auth-page .auth-card .btn-primary, .auth-page .register-card.auth-card .btn-primary { width: 100%; min-height: 52px; margin-top: 4px; color: #fff; background: linear-gradient(180deg, #0f7f72 0%, #0c6c60 100%); box-shadow: 0 14px 28px rgba(15,127,114,.2); }
.auth-page .auth-card .btn-primary:hover, .auth-page .register-card.auth-card .btn-primary:hover { background: linear-gradient(180deg, #119182 0%, #0d7568 100%); transform: translateY(-1px); }
.auth-page .auth-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 620px) {
    .auth-page .auth-form-grid { grid-template-columns: 1fr; }
    .auth-page .auth-card, .auth-page .register-card.auth-card { padding: 21px 17px; border-radius: 20px; }
}

/* Auth pages */
.auth-page { position: relative; overflow: hidden; padding: clamp(28px, 6vw, 72px) 0 76px; }
.auth-page::before { content: ""; position: absolute; inset: 0 0 auto; height: 360px; background: radial-gradient(circle at 78% 18%, rgba(223, 244, 165, .22), transparent 24%), radial-gradient(circle at 12% 8%, rgba(84, 211, 186, .2), transparent 30%), linear-gradient(122deg, #102a32, #144e54 58%, #146468); z-index: -2; }
.auth-page::after { content: ""; position: absolute; inset: 292px 0 0; background: linear-gradient(180deg, rgba(244,247,248,0), var(--bg) 120px); z-index: -1; }
.auth-layout { display: grid; grid-template-columns: minmax(260px, .82fr) minmax(0, 1fr); gap: 22px; align-items: start; }
.auth-layout-login { grid-template-columns: minmax(260px, .72fr) minmax(320px, 520px); justify-content: center; }
.auth-layout-register { grid-template-columns: minmax(260px, .62fr) minmax(0, 1.38fr); }
.auth-intro { min-height: 100%; padding: clamp(24px, 4vw, 36px); border: 1px solid rgba(255,255,255,.2); border-radius: 24px; background: rgba(8,38,43,.28); color: #effff9; box-shadow: 0 24px 70px rgba(5,26,30,.18); backdrop-filter: blur(12px); }
.auth-intro h1 { margin: 0; color: #fff; font: 800 clamp(2.6rem, 5vw, 4.8rem)/.9 Georgia, serif; letter-spacing: -.075em; }
.auth-intro > p:not(.mtesis-kicker) { max-width: 430px; margin: 18px 0 0; color: rgba(240,255,250,.78); line-height: 1.62; }
.auth-intro-list { display: grid; gap: 9px; margin-top: 28px; }
.auth-intro-list span { display: flex; align-items: center; gap: 9px; color: #cce4df; font-size: .9rem; font-weight: 800; }
.auth-intro-list span::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #dff4a5; box-shadow: 0 0 0 5px rgba(223,244,165,.13); flex: 0 0 auto; }
.auth-card, .register-card.auth-card { position: relative; width: 100%; padding: clamp(22px, 3vw, 34px); border: 1px solid #d7e7e3; border-radius: 24px; background: rgba(255,255,255,.97); box-shadow: 0 26px 68px rgba(8,36,42,.15); overflow: hidden; }
.auth-card::before, .register-card.auth-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 5px; background: linear-gradient(90deg, #1e8a7d, #dff4a5); }
.auth-card-head { margin-bottom: 20px; }
.auth-card-head span { display: inline-flex; margin-bottom: 8px; color: #217368; font-size: .76rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.auth-card-head h2 { margin: 0; color: #163e42; font: 800 clamp(1.8rem, 4vw, 2.75rem)/1 Georgia, serif; letter-spacing: -.055em; }
.auth-card label { color: #29464a; font-size: .94rem; }
.auth-card input { min-height: 50px; border-radius: 14px; border-color: #d4e2e0; background: #fbfdfd; }
.auth-card input:focus { outline: 0; border-color: #1e8a7d; background: #fff; box-shadow: 0 0 0 4px rgba(30,138,125,.12); }
.auth-card .btn-primary { width: 100%; min-height: 52px; margin-top: 4px; border-radius: 15px; color: #fff; background: linear-gradient(180deg, #0f7f72 0%, #0c6c60 100%); box-shadow: 0 14px 28px rgba(15,127,114,.2); }
.auth-card .btn-primary:hover { background: linear-gradient(180deg, #119182 0%, #0d7568 100%); transform: translateY(-1px); }
.auth-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.auth-form-grid label { min-width: 0; }
.auth-form-grid label:last-child:nth-child(odd) { grid-column: span 1; }
.auth-consent { margin: 18px 0 10px; padding: 14px; border: 1px solid #dce8e6; border-radius: 18px; background: linear-gradient(145deg, #f8fcfb, #eef7f4); color: #526f76; }
.auth-consent p { margin: 0 0 10px; line-height: 1.55; }
.auth-consent .checkbox { margin: 0; color: #29464a; }
.auth-links { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 16px; padding-top: 16px; border-top: 1px solid #e2ebe9; }
.auth-links a { color: #176a61; font-size: .92rem; font-weight: 900; }
.auth-links a:hover { text-decoration: underline; }
.auth-card .field-status { min-height: 1.1rem; font-size: .78rem; }
.register-card.auth-card .field-status[data-state="available"] { color: #197447; }
.register-card.auth-card .field-status[data-state="taken"], .register-card.auth-card .field-status[data-state="error"] { color: #a71932; }
@media (max-width: 900px) {
    .auth-layout, .auth-layout-login, .auth-layout-register { grid-template-columns: 1fr; }
    .auth-intro { min-height: 0; }
    .auth-intro h1 { font-size: clamp(2.5rem, 10vw, 4rem); }
}
@media (max-width: 620px) {
    .auth-page { padding: 18px 0 42px; }
    .auth-page::before { height: 300px; }
    .auth-intro, .auth-card, .register-card.auth-card { border-radius: 20px; }
    .auth-form-grid { grid-template-columns: 1fr; }
    .auth-card .btn-primary, .auth-links a { width: 100%; justify-content: center; text-align: center; }
    .auth-links { gap: 10px; }
    .auth-consent .checkbox { align-items: flex-start; line-height: 1.45; }
    .auth-consent .checkbox input { margin-top: 4px; }
}
.facility-history-section { padding-top: 0; }.compact-section-head { margin-bottom: 18px; }.history-day-picker { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }.history-item { display: block; text-decoration: none; color: inherit; border-color: #dce9e5; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }.history-item:hover { transform: translateY(-3px); border-color: #8dcabc; box-shadow: 0 14px 28px rgba(16,58,61,.09); }.history-item.is-selected { border: 2px solid #1d8174; background: linear-gradient(145deg, #f8fffc, #e8f7f1); box-shadow: 0 13px 28px rgba(25,119,105,.12); }.history-open-label { display: block; margin-top: 13px; color: #197466; font-size: .84rem; font-weight: 800; }
.facility-history-layout { display: grid; grid-template-columns: 1.2fr 1fr; gap: 18px; }
.history-list { display: grid; gap: 14px; }
.history-item { padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: #fbfdfd; }
.history-item-head { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.history-bars { display: flex; flex-wrap: wrap; gap: 8px; }
.history-badge { display: inline-flex; padding: 8px 10px; border-radius: 999px; font-size: .92rem; font-weight: 700; }
.history-badge.available { background: #e3f9f2; color: #116355; }
.history-badge.reserved { background: #eef2f5; color: #405761; }
.history-badge.closed { background: #f2f4f6; color: #667b84; }
.history-badge.maintenance { background: #fff5df; color: #986100; }
.facility-history-card { display: grid; gap: 22px; }
.facility-history-embed { position: relative; overflow: hidden; padding: 18px; border: 1px solid #d8e9e5; border-radius: 22px; background: linear-gradient(145deg, #fbfdfc 0%, #edf8f4 100%); box-shadow: 0 16px 38px rgba(16,58,61,.06); }
.history-summary { display: flex; justify-content: space-between; gap: 18px; align-items: center; cursor: pointer; list-style: none; }
.history-summary::-webkit-details-marker { display: none; }
.history-summary h2 { margin: 4px 0 8px; font-size: clamp(1.5rem, 3vw, 2.15rem); }
.history-summary p { margin: 0; }
.history-summary-action,
.history-today-link { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 11px 16px; border-radius: 999px; background: #173f43; color: #fff; font-size: .86rem; font-weight: 900; white-space: nowrap; box-shadow: 0 12px 26px rgba(23,63,67,.16); }
.history-summary-action { min-width: 134px; background: #1f7a70; color: #fff; box-shadow: 0 13px 28px rgba(31,122,112,.18); }
.history-action-close, .facility-history-embed[open] .history-action-open { display: none; }
.facility-history-embed[open] .history-action-close { display: inline; }
.history-summary-actions { display: flex; justify-content: flex-end; padding: 16px 0 12px; }
.history-scroll { display: grid; grid-template-columns: repeat(auto-fit, minmax(138px, 1fr)); gap: 10px; }
.history-chip { position: relative; display: grid; gap: 5px; min-height: 108px; padding: 14px 14px 13px; border: 1px solid #d7e4e2; border-radius: 17px; background: rgba(255,255,255,.82); color: inherit; text-decoration: none; transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease; }
.history-chip strong { font-size: .94rem; color: #173f43; }
.history-chip span { font-size: .8rem; color: var(--muted); font-weight: 800; }
.history-chip span:last-child { align-self: end; width: fit-content; margin-top: 4px; padding: 5px 9px; border-radius: 999px; background: #eef7f4; color: #1d756a; }
.history-chip:hover { transform: translateY(-2px); border-color: #8dcabc; box-shadow: 0 14px 28px rgba(16,58,61,.08); }
.history-chip.is-selected { border-color: #1d8174; background: linear-gradient(145deg, #f8fffc, #e4f7ef); box-shadow: 0 13px 28px rgba(25,119,105,.12); }
.history-chip.is-selected::after { content: ""; position: absolute; inset: auto 14px 0; height: 3px; border-radius: 999px 999px 0 0; background: #1d8174; }
.modal-shell { position: fixed; inset: 0; display: none; z-index: 50; }
.modal-shell.is-open { display: block; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(10, 27, 34, 0.55); backdrop-filter: blur(4px); }
.modal-card { position: relative; width: min(760px, calc(100% - 24px)); max-height: calc(100vh - 48px); overflow: auto; margin: 24px auto; background: var(--surface); border-radius: 24px; padding: 22px; box-shadow: 0 28px 80px rgba(8, 36, 42, 0.2); }
.modal-head { display: flex; justify-content: space-between; gap: 16px; align-items: start; margin-bottom: 16px; }
.modal-close { border: 0; background: #edf3f5; color: var(--text); width: 40px; height: 40px; border-radius: 999px; font-size: 1.4rem; cursor: pointer; }
.modal-info-card { padding: 0; box-shadow: none; border: 0; background: transparent; }
.auth-modal-card { width: min(880px, calc(100% - 24px)); }
.auth-modal-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 16px; }
.auth-modal-form { padding: 6px 0 0; }
.auth-modal-side { border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(180deg, #f9fcfb 0%, #eef7f4 100%); padding: 18px; display: grid; gap: 12px; align-content: start; }
.cancel-modal-card { width: min(620px, calc(100% - 24px)); }
.cancel-summary { display: grid; gap: 14px; margin-bottom: 18px; }
.cancel-note { padding: 16px; border-radius: 18px; background: linear-gradient(180deg, #fff8e9 0%, #fffdf5 100%); border: 1px solid #f0ddac; color: #7b5800; line-height: 1.5; }
.site-toast { position: fixed; right: 24px; bottom: 24px; z-index: 70; display: none; max-width: 420px; }
.site-toast.is-visible { display: block; }
.site-toast-card { background: #173946; color: #fff; border-radius: 20px; padding: 18px; box-shadow: 0 24px 60px rgba(8, 36, 42, 0.28); }
.site-toast-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 10px; }
.site-toast-close { border: 0; background: rgba(255,255,255,.14); color: #fff; width: 34px; height: 34px; border-radius: 999px; cursor: pointer; font-size: 1.1rem; }
.site-toast p { margin: 0; line-height: 1.5; color: rgba(255,255,255,.92); }
.site-footer { padding: 28px 0 34px; border-top: 1px solid rgba(219,229,232,.86); background: linear-gradient(180deg, rgba(255,255,255,.48), rgba(238,247,245,.9)); }
.footer-grid { display: grid; grid-template-columns: 1.2fr auto 1fr; gap: 14px; align-items: center; }
.footer-brand-inline, .footer-credit { display: grid; gap: 4px; }
.footer-brand-inline strong { font-size: 1.05rem; }
.footer-brand-inline span, .footer-credit span { color: var(--muted); font-size: .92rem; }
.footer-links { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 12px 16px; border-radius: 999px; background: rgba(255,255,255,.78); border: 1px solid rgba(219,229,232,.88); box-shadow: 0 10px 28px rgba(8, 36, 42, .05); white-space: nowrap; }
.footer-links a { color: var(--primary-dark); font-weight: 800; }
.footer-links a:hover { text-decoration: underline; }
.footer-credit { text-align: right; }
.footer-credit a { color: var(--primary-dark); text-decoration: none; }
.footer-credit a:hover { color: var(--green); text-decoration: underline; }
.footer-credit strong { font-size: 1rem; }
@keyframes fadeUp {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 820px) {
    .hero-grid, .home-hero-grid, .form-grid, .facility-history-layout, .reservation-summary { grid-template-columns: 1fr; }
    .container { width: min(100% - 24px, 1180px); }
    .site-header { position: static; }
    .home-hero { padding: 34px 0 6px; }
    .hero-copy-home { max-width: none; }
    .hero-copy-home h1 { margin-bottom: 10px; }
    .lead { font-size: .98rem; }
    .home-section-head { align-items: stretch; padding: 16px; border-radius: 20px; }
    .home-facility-grid { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr; }
    .footer-links { width: 100%; flex-wrap: wrap; white-space: normal; justify-content: flex-start; border-radius: 18px; }
    .footer-credit { text-align: left; }
    .auth-modal-grid { grid-template-columns: 1fr; }
    .rules-grid, .rules-detail-card, .rules-detail-list { grid-template-columns: 1fr; }
    .section-head, .nav-shell { align-items: start; flex-direction: column; }
    .nav-shell { gap: 12px; }
    .main-nav {
        width: 100%;
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        gap: 8px;
        padding-bottom: 6px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .main-nav::-webkit-scrollbar { display: none; }
    .main-nav a, .button-link {
        width: auto;
        flex: 0 0 auto;
        white-space: nowrap;
        padding: 10px 14px;
        border-radius: 999px;
        justify-content: center;
        text-align: center;
    }
    .facility-link-overlay { padding: 18px; }
    .slot-mini-list { gap: 8px; }
    .slot-chip, .slot-card { padding: 11px 12px; border-radius: 14px; }
    .slot-grid { grid-template-columns: 1fr 1fr; }
    .facility-top-actions { width: 100%; }
    .facility-top-actions .btn, .facility-top-actions .btn-secondary { width: 100%; }
    .history-scroll { grid-template-columns: 1fr 1fr; }
    .history-summary { align-items: start; flex-direction: column; }
    .inline-form { width: 100%; flex-direction: column; align-items: stretch; }
    .inline-form select, .inline-form button { width: 100%; }
    .builder-head { flex-direction: column; }
    .site-toast { left: 12px; right: 12px; bottom: 12px; max-width: none; }
}
@media (max-width: 720px) {
    .my-reservations-card { overflow: visible; padding: 0; border: 0; background: transparent; box-shadow: none; }
    .my-reservations-table, .my-reservations-table tbody, .my-reservations-table tr, .my-reservations-table td { display: block; width: 100%; }
    .my-reservations-table thead { display: none; }
    .my-reservations-table tr { margin-bottom: 14px; padding: 14px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--shadow); }
    .my-reservations-table td { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
    .my-reservations-table td:last-child { border-bottom: 0; }
    .my-reservations-table td::before { content: attr(data-label); color: var(--muted); font-weight: 800; font-size: .84rem; }
    .my-reservations-table .btn { width: 100%; justify-content: center; }
}

@media (max-width: 560px) {
    h1 { font-size: clamp(1.8rem, 9vw, 2.7rem); }
    .btn, .btn-small { width: 100%; }
    .hero-actions { width: 100%; }
    .slot-grid { grid-template-columns: 1fr; }
    th, td { padding: 12px 8px; }
    .modal-card { width: calc(100% - 16px); margin: 12px auto; padding: 18px; }
    .footer-links a, .footer-links span { font-size: .92rem; }
    .history-scroll { grid-template-columns: 1fr; }
}

/* mTesis public home */
.brand { display: inline-flex; align-items: center; gap: 9px; color: #143c43; font: 800 1.35rem/1 Georgia, serif; letter-spacing: -.06em; }
.brand img { display: block; width: 32px; height: 32px; border-radius: 9px; object-fit: cover; box-shadow: 0 5px 12px rgba(16, 36, 44, .16); }
.mtesis-hero { position: relative; overflow: hidden; padding: 72px 0 64px; background: radial-gradient(circle at 87% 16%, rgba(218, 255, 143, .25), transparent 20%), radial-gradient(circle at 65% 105%, rgba(39, 188, 168, .28), transparent 33%), linear-gradient(122deg, #102a32, #144e54 60%, #146468); color: #effff9; }
.mtesis-hero::before { content: ""; position: absolute; width: 560px; height: 560px; left: -330px; bottom: -410px; border: 1px solid rgba(235,255,250,.16); border-radius: 50%; box-shadow: 0 0 0 32px rgba(235,255,250,.04), 0 0 0 64px rgba(235,255,250,.035); }
.mtesis-hero::after { content: ""; position: absolute; width: 14px; height: 14px; right: 48%; top: 24%; border-radius: 50%; background: #dffb8d; box-shadow: 42px 80px 0 -4px rgba(223,251,141,.72), -98px 185px 0 -6px rgba(223,251,141,.55); }
.mtesis-hero-grid { position: relative; z-index: 1; display: block; }
.mtesis-kicker { margin: 0 0 12px; color: #aaf0dd; font: 800 .68rem/1 sans-serif; letter-spacing: .15em; }
.mtesis-hero h1 { max-width: 640px; margin: 0; font: 800 clamp(3.2rem, 7vw, 6.8rem)/.87 Georgia, serif; letter-spacing: -.075em; }.mtesis-hero h1 em { color: #dcfb8e; font-style: italic; }
.mtesis-hero-copy > p:not(.mtesis-kicker) { max-width: 555px; margin: 24px 0 0; color: rgba(240,255,250,.77); font-size: 1.08rem; line-height: 1.65; }
.mtesis-hero .btn-primary { background: #dffb8d; color: #173b3d; }.mtesis-hero .btn-primary:hover { background: #f3ffbd; }
.mtesis-text-link { display: inline-flex; align-items: center; gap: 10px; color: #e8fff9; font-weight: 800; }.mtesis-text-link span { font-size: 1.2rem; transition: transform .18s ease; }.mtesis-text-link:hover span { transform: translateX(4px); }
.mtesis-trust-row { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 34px; color: #bfe0d9; font-size: .78rem; font-weight: 700; }.mtesis-trust-row span::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: #dffb8d; vertical-align: middle; }
.mtesis-pulse-card { padding: 22px; border: 1px solid rgba(223,251,141,.28); border-radius: 25px; background: rgba(8,38,43,.3); box-shadow: 0 28px 70px rgba(5,26,30,.27); backdrop-filter: blur(14px); }.pulse-top { display: flex; justify-content: space-between; gap: 10px; }.pulse-top span, .pulse-next > span { display: block; color: #a8d9ce; font: 800 .62rem/1 sans-serif; letter-spacing: .13em; }.pulse-top strong { display: block; margin-top: 7px; font-size: .92rem; }.pulse-top i { width: 9px; height: 9px; margin-top: 5px; border-radius: 50%; background: #dffb8d; box-shadow: 0 0 0 5px rgba(223,251,141,.14); }
.pulse-number { display: flex; align-items: baseline; gap: 10px; margin: 27px 0 11px; }.pulse-number strong { font: 800 3.7rem/.8 Georgia, serif; letter-spacing: -.09em; }.pulse-number span { color: #bcd9d2; font-size: .83rem; }.pulse-bar { height: 8px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.12); }.pulse-bar span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #54d3ba, #dffb8d); }
.pulse-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,.12); }.pulse-stats strong, .pulse-stats span { display: block; }.pulse-stats strong { font: 800 1.35rem/1 Georgia, serif; }.pulse-stats span { margin-top: 4px; color: #a7c7c0; font-size: .7rem; }
.pulse-next { display: grid; gap: 9px; padding-top: 18px; }.pulse-next div { display: flex; justify-content: space-between; gap: 10px; color: #eafff8; font-size: .82rem; }.pulse-next small { color: #b5d6ce; font-size: .76rem; }
.mtesis-status-section { padding: 64px 0; }.mtesis-section-head { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 26px; }.mtesis-section-head h2, .mtesis-info-strip h2 { margin: 0; color: #143c43; font: 800 clamp(2rem, 4vw, 3rem)/.98 Georgia, serif; letter-spacing: -.06em; }.mtesis-section-head p:not(.mtesis-kicker) { max-width: 570px; margin: 10px 0 0; color: var(--muted); line-height: 1.55; }
.mtesis-facility-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(265px, 1fr)); gap: 16px; }.mtesis-facility-card { display: flex; flex-direction: column; padding: 22px; min-height: 100%; border: 1px solid #dce8e6; border-radius: 23px; background: linear-gradient(150deg, #fff, #f3f9f7); box-shadow: 0 16px 38px rgba(16,58,61,.07); transition: transform .2s ease, box-shadow .2s ease; }.mtesis-facility-card:hover { transform: translateY(-5px); box-shadow: 0 24px 54px rgba(16,58,61,.12); }.mtesis-card-top { display: flex; justify-content: space-between; align-items: center; }.mtesis-court-number { color: #bad0ca; font: 800 1.8rem/1 Georgia, serif; letter-spacing: -.08em; }.mtesis-type { padding: 6px 9px; border-radius: 999px; background: #dff5ed; color: #167164; font-size: .7rem; font-weight: 800; text-transform: uppercase; }.mtesis-facility-card h3 { margin: 19px 0 8px; color: #163e42; font: 800 1.45rem/1 Georgia, serif; letter-spacing: -.04em; }.mtesis-facility-card > p { min-height: 42px; margin: 0; color: #698187; font-size: .87rem; line-height: 1.5; }.mtesis-card-meter { display: flex; justify-content: space-between; align-items: center; margin: 18px 0 13px; padding: 11px 0; border-top: 1px solid #e4ecea; border-bottom: 1px solid #e4ecea; color: #587177; font-size: .78rem; font-weight: 700; }.mtesis-card-meter span { display: inline-flex; align-items: center; gap: 6px; }.mtesis-card-meter i { width: 7px; height: 7px; border-radius: 50%; background: #42b878; }.mtesis-card-meter strong { color: #143c43; font: 800 1.1rem/1 Georgia, serif; }
.mtesis-slot-list { display: grid; gap: 7px; }.mtesis-slot { display: flex; justify-content: space-between; gap: 8px; padding: 9px 10px; border-radius: 10px; font-size: .78rem; }.mtesis-slot.is-available { background: #e8f8ee; color: #287253; }.mtesis-slot.is-reserved, .mtesis-slot.is-checked_in, .mtesis-slot.is-checked { background: #fff2d7; color: #9a6511; }.mtesis-slot.is-closed, .mtesis-slot.is-maintenance, .mtesis-slot.is-blocked { background: #edf1f1; color: #71858a; }.mtesis-card-link { display: flex; justify-content: space-between; align-items: center; margin-top: auto; padding-top: 19px; color: #176a61; font-weight: 800; font-size: .84rem; }.mtesis-card-link span { font-size: 1.1rem; }
.mtesis-info-strip {
    display: grid;
    grid-template-columns: 1fr 1.1fr auto;
    gap: 28px;
    align-items: center;
    margin-bottom: 64px;
    padding: 30px;
    border-radius: 24px;
    color: #eff8f6;
    background: linear-gradient(125deg, #133840, #1d5b58 56%, #266d64);
    box-shadow: 0 26px 60px rgba(14, 53, 58, .16);
}
.mtesis-info-strip h2 { color: #fff; font-size: 1.85rem; }
.mtesis-info-strip .mtesis-kicker { color: #dff4a5; }
.mtesis-info-strip > p { margin: 0; color: #d1e6e1; line-height: 1.6; }
.mtesis-info-strip .btn-primary {
    white-space: nowrap;
    color: #133b40;
    background: linear-gradient(180deg, #dff4a5 0%, #c8ee86 100%);
    box-shadow: 0 14px 26px rgba(223, 244, 165, .18);
}
.mtesis-info-strip .btn-primary:hover { background: linear-gradient(180deg, #e7f7ba 0%, #d5f09d 100%); }
.mtesis-info-strip .btn-secondary {
    white-space: nowrap;
    color: #173e43;
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.3);
    box-shadow: 0 12px 24px rgba(8, 36, 42, .08);
}
.mtesis-info-strip .btn-secondary:hover { background: #fff; }
.mtesis-welcome-strip { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 30px; padding: 16px 18px; border: 1px solid #d6e6e3; border-radius: 18px; background: linear-gradient(110deg, #f9fcfb, #eaf5f1); box-shadow: 0 12px 30px rgba(16,58,61,.05); }.mtesis-welcome-strip p { margin: 0 0 4px; color: #5d747a; font-size: .9rem; }.mtesis-welcome-strip strong { color: #163e42; font-size: .95rem; }.mtesis-welcome-actions { display: flex; gap: 10px; flex: 0 0 auto; }.mtesis-welcome-actions .btn { padding: 11px 16px; border-radius: 13px; font-size: .93rem; min-width: 138px; box-shadow: 0 12px 26px rgba(8, 36, 42, .1); }.mtesis-welcome-actions .btn-primary { background: linear-gradient(180deg, #0f7f72 0%, #0c6c60 100%); color: #fff; }.mtesis-welcome-actions .btn-primary:hover { background: linear-gradient(180deg, #119182 0%, #0d7568 100%); }.mtesis-welcome-actions .btn-secondary { background: rgba(255,255,255,.84); }
@media (max-width: 820px) { .mtesis-hero { padding: 46px 0 38px; }.mtesis-hero-grid { grid-template-columns: 1fr; gap: 34px; }.mtesis-hero h1 { font-size: clamp(3.2rem, 13vw, 5.4rem); }.mtesis-section-head, .mtesis-info-strip, .mtesis-prime-rule, .mtesis-prime-status { grid-template-columns: 1fr; align-items: start; }.mtesis-section-head { flex-direction: column; }.mtesis-info-strip { gap: 16px; margin-bottom: 38px; }.mtesis-info-strip .btn { width: 100%; }.mtesis-prime-meter { width: 100%; min-height: 96px; } }
@media (max-width: 560px) { .mtesis-hero { padding: 38px 0 32px; }.mtesis-hero-copy > p:not(.mtesis-kicker) { font-size: 1rem; }.mtesis-hero .hero-actions { flex-direction: column; }.mtesis-text-link { justify-content: center; min-height: 44px; }.mtesis-trust-row { display: grid; gap: 8px; }.mtesis-status-section { padding: 42px 0; }.mtesis-facility-grid { grid-template-columns: 1fr; }.mtesis-section-head .btn { width: 100%; }.pulse-stats { gap: 4px; } }

@media (max-width: 820px) {
    .site-header { background: rgba(244,247,248,.96); }
    .nav-shell { align-items: center; padding: 14px 0 12px; }
    .main-nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: visible; gap: 7px; padding: 0; }
    .main-nav a, .button-link { min-width: 0; width: 100%; padding: 10px 7px; border: 1px solid transparent; font-size: .84rem; line-height: 1.15; white-space: normal; }
    .main-nav a.active, .main-nav a:hover, .button-link { border-color: #dce8e6; box-shadow: 0 6px 16px rgba(16,58,61,.07); }
    .main-nav .nav-about, .main-nav .nav-utility { display: none; }
    .main-nav .nav-home { font-weight: 800; }
    .mtesis-welcome-strip { align-items: stretch; flex-direction: column; margin-top: 18px; padding: 16px; gap: 14px; }
    .mtesis-welcome-actions { width: 100%; }
    .mtesis-welcome-actions .btn { width: 100%; }
}

@media (max-width: 380px) {
    .brand { font-size: 1.22rem; }
    .brand img { width: 29px; height: 29px; }
    .main-nav a, .button-link { font-size: .78rem; padding: 9px 5px; }
    .mtesis-welcome-actions { display: grid; grid-template-columns: 1fr; }
}
.about-page-image { display: block; width: 100%; max-height: 420px; margin: 0 0 30px; border-radius: 20px; object-fit: cover; }

/* mTesis membership form */
.auth-shell { position: relative; padding: clamp(28px, 6vw, 72px) 0; }.auth-shell::before { content: ""; position: fixed; inset: 0 0 auto; height: 330px; z-index: -1; background: radial-gradient(circle at 82% 18%, rgba(167, 26, 48, .16), transparent 26%), linear-gradient(125deg, #12383d, #164e4d); }
.register-card { position: relative; overflow: hidden; border: 1px solid rgba(177, 31, 50, .16); border-radius: 26px; background: rgba(255,255,255,.97); box-shadow: 0 28px 75px rgba(8, 36, 42, .18); }.register-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 5px; background: linear-gradient(90deg, #a71932, #db6a70 45%, #153e42); }.register-card h1 { margin-top: 8px; color: #163e42; font: 800 clamp(2rem, 5vw, 3rem)/1 Georgia, serif; letter-spacing: -.06em; }.register-card > p { color: #667f83; line-height: 1.55; }.register-card label { color: #29464a; }.register-card input:focus { outline: 0; border-color: #a71932; box-shadow: 0 0 0 3px rgba(167,25,50,.12); }.register-card .btn-primary { width: 100%; margin-top: 6px; background: #a71932; }.register-card .btn-primary:hover { background: #82182a; }.register-card .field-status[data-state="available"] { color: #197447; }.register-card .field-status[data-state="taken"], .register-card .field-status[data-state="error"] { color: #a71932; }
@media (max-width: 560px) { .auth-shell { padding: 18px 0 36px; }.register-card { padding: 21px 17px; border-radius: 20px; }.register-card .form-grid { gap: 12px; }.register-card .checkbox { align-items: flex-start; line-height: 1.45; }.register-card .checkbox input { margin-top: 4px; } }

/* Homepage card and membership-strip refinements. Kept last so they override legacy homepage styles. */
.mtesis-facility-card { position: relative; overflow: hidden; isolation: isolate; padding: 25px; border-color: #d6e8e3; background: linear-gradient(145deg, #ffffff 0%, #f2faf7 65%, #e8f5f0 100%); text-decoration: none; color: inherit; }.mtesis-facility-card::before { content: ""; position: absolute; z-index: -1; width: 170px; height: 170px; top: -86px; right: -58px; border-radius: 50%; background: radial-gradient(circle, rgba(139, 215, 188, .34), transparent 68%); transition: transform .25s ease; }.mtesis-facility-card::after { content: ""; position: absolute; z-index: -1; right: 0; bottom: 0; width: 100%; height: 4px; background: linear-gradient(90deg, #1e8a7d, #b9d46e); transform: scaleX(.28); transform-origin: left; transition: transform .24s ease; }.mtesis-facility-card:hover { transform: translateY(-7px); box-shadow: 0 27px 58px rgba(16,58,61,.16); }.mtesis-facility-card:hover::before { transform: scale(1.25); }.mtesis-facility-card:hover::after { transform: scaleX(1); }.mtesis-card-top { padding-bottom: 15px; border-bottom: 1px solid #dfece8; }.mtesis-court-number { color: #99bcb3; font-size: 2.1rem; }.mtesis-type { background: #dff5ed; box-shadow: 0 5px 12px rgba(22,113,100,.08); }.mtesis-facility-card h3 { margin-top: 18px; font-size: 1.6rem; }.mtesis-card-meter { margin-top: 20px; border-top: 0; }.mtesis-slot { padding: 10px 12px; border: 1px solid transparent; }.mtesis-slot.is-available { border-color: #d2eddd; }.mtesis-slot.is-reserved, .mtesis-slot.is-checked_in, .mtesis-slot.is-checked { border-color: #f5ddb2; }.mtesis-card-link { margin-top: 16px; padding: 14px 15px; border-radius: 13px; background: #173f43; color: #fff; transition: background .2s ease, transform .2s ease; }.mtesis-card-link span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #d9f588; color: #173f43; }.mtesis-facility-card:hover .mtesis-card-link { background: #1f7169; }.mtesis-facility-card:hover .mtesis-card-link span { transform: translateX(3px); }
.mtesis-info-strip { color: #21464a; background: radial-gradient(circle at 8% 110%, rgba(192, 234, 220, .75), transparent 35%), linear-gradient(115deg, #f7fbfa 0%, #e8f4f0 52%, #edf5ed 100%); border: 1px solid #d5e7e1; box-shadow: 0 20px 48px rgba(16,58,61,.09); }.mtesis-info-strip h2 { color: #163e42; }.mtesis-info-strip .mtesis-kicker { color: #287d70; }.mtesis-info-strip > p { color: #587278; }.mtesis-info-strip .btn-primary { color: #fff; background: linear-gradient(135deg, #ad1739, #d33e58); border-color: #ad1739; box-shadow: 0 13px 24px rgba(173,23,57,.27); }.mtesis-info-strip .btn-primary:hover { background: linear-gradient(135deg, #c21b43, #e14b63); transform: translateY(-2px); }.mtesis-info-strip .btn-secondary { color: #173e43; background: #fff; border-color: #cddfdb; box-shadow: 0 10px 20px rgba(8,36,42,.07); }
