@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root { font-family: Inter, Arial, sans-serif; color: #202022; background: #f4f5f7; font-synthesis: none; --red:#d32f2f; --dark:#1a1a1a; --muted:#72747a; --line:#e2e3e7; }
* { box-sizing: border-box; }
html,body,#root { margin:0; min-width:320px; min-height:100%; }
body { min-height:100vh; }
button,input,select,textarea { color:inherit; font:inherit; }
button { cursor:pointer; }
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid rgb(211 47 47 / 20%); outline-offset:2px; }
.app-shell { min-height:100vh; background:#f4f5f7; }
.sidebar { position:fixed; inset:0 auto 0 0; z-index:30; display:flex; flex-direction:column; width:238px; padding:28px 18px 20px; color:white; background:var(--dark); border-right:1px solid #303033; }
.brand { display:flex; flex-direction:column; align-items:flex-start; padding:4px 10px 26px; color:white; background:none; border:0; border-bottom:1px solid #363638; }
.brand-logo{display:block;width:180px;height:auto;object-fit:contain}
.brand small { margin-top:6px; color:#b6b6ba; font-size:10px; font-weight:400; letter-spacing:.03em; text-transform:uppercase; }
.sidebar nav { display:flex; flex-direction:column; gap:8px; margin-top:24px; }
.nav-label { margin:0 0 8px 12px; color:#69696e; font-size:10px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.sidebar nav button { display:flex; align-items:center; gap:9px; width:100%; min-height:44px; padding:8px 9px; color:#d6d6d6; font-size:13px; text-align:left; white-space:nowrap; background:transparent; border:1px solid transparent; border-radius:7px; transition:background 160ms ease,border-color 160ms ease,color 160ms ease,box-shadow 160ms ease; }
.sidebar nav button:hover { color:white; background:#242426; border-color:#353538; }
.sidebar nav button.active { color:white; font-family:"Geist:SemiBold",Inter,sans-serif; font-weight:600; background:#2b2b2e; border-color:#404043; box-shadow:inset 3px 0 0 #c70e12; }
.nav-icon{display:grid;width:26px;height:26px;flex:0 0 26px;place-items:center}
.help { display:flex; align-items:center; gap:10px; margin-top:auto; padding:14px 12px; background:#232325; border:1px solid #353538; border-radius:8px; }
.help div { display:flex; flex-direction:column; gap:3px; }.help b{font-size:11px}.help small{color:#85858a;font-size:10px}.online{width:7px;height:7px;background:#53aa6e;border-radius:50%}
main { min-height:100vh; margin-left:238px; }
.topbar { position:relative; z-index:20; display:flex; align-items:center; justify-content:space-between; min-height:112px; padding:22px 40px; background:white; border-bottom:1px solid var(--line); }
.eyebrow { margin:0 0 7px; color:#878990; font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:4px; color:#18181a; font-size:28px; line-height:1.15; letter-spacing:-.035em; }
.subhead { margin:0; color:var(--muted); font-size:12px; }
.header-actions { display:flex; align-items:center; gap:12px; }
.cart { display:flex; flex-direction:column; gap:3px; padding-right:18px; text-align:right; border-right:1px solid var(--line); }
.cart small { color:#8b8d93; font-size:9px; font-weight:700; text-transform:uppercase; }.cart strong{font-size:14px}
.account-wrap { position:relative; }
.account { display:flex; align-items:center; gap:10px; padding:6px 8px; background:transparent; border:0; border-radius:8px; }
.account:hover { background:#f5f5f6; }
.account>span:nth-child(2) { display:flex; flex-direction:column; align-items:flex-start; gap:2px; }
.account b{font-size:11px}.account small{color:#85878d;font-size:9px}.chev{color:#777}
.avatar,.large-avatar,.member-avatar { display:grid; place-items:center; color:white; font-weight:700; background:var(--red); border-radius:50%; }
.avatar { width:34px; height:34px; font-size:11px; }.large-avatar{width:58px;height:58px;font-size:17px}.member-avatar{width:43px;height:43px;font-size:12px}.member-avatar.dark{background:#252527}
.outline { padding:9px 14px; color:#424247; font-size:11px; font-weight:700; background:white; border:1px solid #d4d5d9; border-radius:6px; }
.outline:hover{border-color:#aaa;background:#fafafa}
.account-menu { position:absolute; top:54px; right:0; z-index:40; width:235px; padding:9px; background:white; border:1px solid #ddd; border-radius:9px; box-shadow:0 16px 36px rgb(20 20 22 / 18%); }
.account-menu>p { margin:4px 8px 6px; color:#92949a; font-size:9px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.account-menu button { display:flex; align-items:center; gap:11px; width:100%; padding:10px; text-align:left; background:white; border:0; border-radius:6px; }
.account-menu button:hover { background:#f4f5f7; }
.account-menu button>span:first-child { display:grid;width:26px;height:26px;place-items:center;color:var(--red);background:#fff0f0;border-radius:6px }
.account-menu button>span:last-child { display:flex;flex-direction:column;gap:2px }.account-menu b{font-size:11px}.account-menu small{color:#888;font-size:9px}
.menu-separator{height:1px;margin:7px 5px;background:#e7e7e9}
.account-menu .menu-logout>span:first-child{color:#696b70;background:#f1f1f2}
.account-menu .menu-logout b{color:#34353a}
.content { max-width:1320px; margin:0 auto; padding:28px 40px 54px; }
.card { background:white; border:1px solid #e1e2e5; border-radius:8px; box-shadow:0 2px 10px rgb(20 20 25 / 4%); }
.filters { display:grid; grid-template-columns:1.5fr 1fr 1fr auto; gap:14px; padding:22px; border-bottom:1px solid var(--line); }
.filters>div { display:flex; flex-direction:column; gap:7px; }.filters label,.modal label{color:#55575d;font-size:10px;font-weight:700}
.field { display:flex;align-items:center;justify-content:space-between;min-height:40px;padding:0 12px;text-align:left;background:white;border:1px solid #d8d9dd;border-radius:6px;font-size:11px}
.today { align-self:end; min-height:40px; padding:0 18px; color:var(--red); font-size:11px; font-weight:700; background:#fff; border:1px solid #e4b5b5; border-radius:6px; }
.week-nav { display:flex;justify-content:center;align-items:center;gap:20px;padding:17px 22px;border-bottom:1px solid var(--line)}
.week-nav div{display:flex;min-width:160px;flex-direction:column;align-items:center;gap:3px}.week-nav b{font-size:13px}.week-nav small{color:#8b8d93;font-size:9px}.week-nav button{width:30px;height:30px;background:white;border:1px solid #ddd;border-radius:5px}
.day-heading{display:flex;align-items:center;gap:14px;padding:18px 22px 10px}.day-heading>div{display:flex;width:46px;height:48px;flex-direction:column;align-items:center;justify-content:center;color:white;background:#242426;border-radius:6px}.day-heading span{font-size:8px;font-weight:800;letter-spacing:.12em}.day-heading strong{font-size:18px}.day-heading p{margin:0;font-size:12px;font-weight:700}.day-heading.second{border-top:1px solid var(--line);margin-top:8px}
.class-list{padding:0 22px 18px}.class-row{display:grid;grid-template-columns:110px 1.6fr 1fr 1fr 82px;align-items:center;gap:20px;min-height:72px;padding:12px 14px;border:1px solid #e5e6e9;border-bottom:0}.class-row:first-child{border-radius:7px 7px 0 0}.class-row:last-child{border-bottom:1px solid #e5e6e9;border-radius:0 0 7px 7px}.class-row>div{display:flex;flex-direction:column;gap:5px}.class-row small{color:#84868c;font-size:9px}.class-row strong{font-size:11px}.time strong{font-size:13px}.class-name{align-items:flex-start}
.pill,.status,.count{display:inline-flex;width:max-content;align-items:center;padding:4px 8px;font-size:8px;font-weight:800;border-radius:999px}.pill.green{color:#31734a;background:#e5f3e9}.pill.blue{color:#2d5e91;background:#e5effa}.pill.red{color:#a32424;background:#fde8e8}.pill.neutral{color:#585a60;background:#eeeef0}
.spots div{height:5px;overflow:hidden;background:#ececef;border-radius:999px}.spots div span{display:block;height:100%;background:var(--red);border-radius:inherit}
.primary{padding:10px 16px;color:white;font-size:10px;font-weight:800;background:var(--red);border:1px solid var(--red);border-radius:6px;box-shadow:0 2px 5px rgb(211 47 47 / 16%)}.primary:hover{background:#b92323}.primary.booked{background:#2f7447;border-color:#2f7447}
.tabs{display:flex;margin-bottom:24px;background:white;border:1px solid var(--line);border-radius:8px;box-shadow:0 2px 8px rgb(20 20 25 / 3%)}.tabs button{position:relative;padding:16px 24px;color:#777980;font-size:11px;font-weight:700;background:transparent;border:0}.tabs button.active{color:#1f2023}.tabs button.active:after{position:absolute;right:20px;bottom:-1px;left:20px;height:2px;background:var(--red);content:""}
.profile-grid{display:grid;grid-template-columns:minmax(350px,.85fr) minmax(460px,1.15fr);gap:24px}.account-card{height:max-content;padding:24px}.card-title,.section-title,.member-head,.modal-title{display:flex;align-items:flex-start;justify-content:space-between}.red-text{color:var(--red)}h2{margin-bottom:5px;font-size:18px;letter-spacing:-.025em}.identity{display:flex;align-items:center;gap:14px;margin:20px 0;padding:18px;background:#f7f7f8;border-radius:7px}.identity h3,.member h3{margin-bottom:4px;font-size:13px}.identity p,.member p,.section-title p,.modal-title p{margin-bottom:0;color:#85878e;font-size:10px}
dl{margin:0}dl>div{padding:14px 0;border-top:1px solid #ededee}dt{margin-bottom:5px;color:#888a90;font-size:9px;font-weight:700;text-transform:uppercase}dd{margin:0;font-size:11px;font-weight:600}.section-title{margin-bottom:14px}.section-title .add{align-self:center}.member{margin-bottom:12px;padding:18px}.member-head{justify-content:flex-start;gap:12px}.member-head .kebab{margin-left:auto;background:none;border:0}.band-box{display:flex;align-items:center;justify-content:space-between;margin-top:16px;padding:10px 12px;background:#f6f7f8;border-radius:6px}.band-box>span:first-child{color:#777980;font-size:9px;font-weight:700;text-transform:uppercase}.note{padding-top:13px!important}.new-member{animation:enter .25s ease}@keyframes enter{from{opacity:0;transform:translateY(7px)}}
.modal-backdrop{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px;background:rgb(10 10 12 / 58%);backdrop-filter:blur(2px)}.modal{width:min(520px,100%);padding:26px;background:white;border-radius:10px;box-shadow:0 28px 70px rgb(0 0 0 / 35%)}.modal-title{margin-bottom:22px}.close{padding:0;color:#777;font-size:28px;line-height:1;background:none;border:0}.modal>label,.form-row label{display:flex;flex-direction:column;gap:7px;margin-bottom:15px}.modal label span{color:#999;font-weight:400}.modal input,.modal select,.modal textarea{width:100%;padding:11px 12px;background:#fff;border:1px solid #d8d9dd;border-radius:6px;font-size:11px}.modal textarea{resize:vertical}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:8px;padding-top:18px;border-top:1px solid var(--line)}
.stack{display:flex;flex-direction:column;gap:22px}.panel{padding:24px}.section-title.compact{align-items:center;margin-bottom:18px}.count{color:#a32929;background:#fde9e9}.upcoming-list{border:1px solid #e4e5e8;border-radius:7px}.upcoming-row{display:flex;align-items:center;gap:20px;min-height:82px;padding:12px 14px;border-bottom:1px solid #e6e7e9}.upcoming-row:last-child{border-bottom:0}.upcoming-row>div:not(.date-block){display:flex;min-width:100px;flex-direction:column;gap:5px}.upcoming-row small{color:#898b91;font-size:9px}.upcoming-row strong{font-size:11px}.upcoming-row .grow{flex:1}.upcoming-row .grow span{color:#85878d;font-size:9px}.date-block{display:flex;width:72px;flex-direction:column;gap:3px;padding:9px;color:white;text-align:center;background:#242426;border-radius:6px}.date-block strong{font-size:10px}.date-block small{color:#aaa}.outline.danger{color:#b52727;border-color:#ebc5c5}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:10px}th{padding:11px 12px;color:#7e8086;font-size:9px;text-align:left;text-transform:uppercase;background:#f6f7f8;border-bottom:1px solid #ddd}td{padding:14px 12px;border-bottom:1px solid #e8e8ea;white-space:nowrap}.status.attended{color:#28683e;background:#e4f2e8}.status.refunded{color:#725c1f;background:#f6efda}.status.no-show{color:#a02727;background:#fae5e5}.toast{position:fixed;right:28px;bottom:28px;z-index:50;padding:12px 16px;color:white;font-size:11px;background:#202022;border-radius:7px;box-shadow:0 10px 30px #0003}.empty-state{display:flex;min-height:400px;flex-direction:column;align-items:center;justify-content:center;text-align:center}.empty-state>span{display:grid;width:52px;height:52px;place-items:center;margin-bottom:18px;color:var(--red);font-size:20px;font-weight:800;background:#fff0f0;border-radius:50%}.empty-state p{color:#777;font-size:11px}.empty-state .primary{margin-top:10px}
@media(max-width:1000px){.sidebar{width:196px}.brand-name{font-size:19px}main{margin-left:196px}.topbar,.content{padding-left:24px;padding-right:24px}.account>span:nth-child(2),.cart{display:none}.profile-grid{grid-template-columns:1fr}.class-row{grid-template-columns:90px 1.5fr 1fr 80px}.class-row>div:nth-child(3){display:none}}
@media(max-width:720px){.sidebar{position:relative;width:100%;min-height:auto}.app-shell{display:block}.sidebar nav{display:grid;grid-template-columns:1fr 1fr;margin-top:18px}.brand{padding-bottom:16px}main{margin-left:0}.topbar{align-items:flex-start;padding:20px}.content{padding:18px}.filters{grid-template-columns:1fr}.class-row{grid-template-columns:1fr 1fr}.class-row>div:nth-child(3),.class-row .spots{display:none}.profile-grid{grid-template-columns:1fr}.form-row{grid-template-columns:1fr}.upcoming-row{flex-wrap:wrap}.upcoming-row .grow{min-width:60%}.past-card{padding:16px}.tabs{overflow:auto}.tabs button{white-space:nowrap}}
.cms-status{display:flex;align-items:center;gap:10px;margin-top:auto;padding:13px 11px;background:#232325;border:1px solid #353538;border-radius:8px}.cms-status div{display:flex;flex-direction:column;gap:3px}.cms-status b{font-size:10px}.cms-status small{color:#85858a;font-size:9px}.logout{padding:9px 14px;color:#424247;font-size:11px;font-weight:700;background:white;border:1px solid #d4d5d9;border-radius:6px}.calendar-filters{grid-template-columns:repeat(4,1fr)}select.field{width:100%}.calendar-toolbar{display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid var(--line)}.calendar-toolbar .week-nav{border:0}.view-toggle{display:flex;padding:3px;background:#f0f1f3;border-radius:6px}.view-toggle button{padding:7px 11px;color:#73757b;font-size:9px;background:transparent;border:0;border-radius:4px}.view-toggle button.active{color:#fff;background:#242426}.booking-summary,.secure-box{display:flex;justify-content:space-between;margin:16px 0;padding:14px;color:#55575d;font-size:10px;background:#f6f7f8;border-radius:6px}.secure-box{line-height:1.5}.cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.offer-card,.plan-card,.product-card{padding:16px}.offer-card h2,.plan-card h2,.product-card h2{font-size:15px}.offer-card>p:not(.eyebrow),.plan-card>p{min-height:38px;color:#777980;font-size:10px;line-height:1.5}.offer-art{display:grid;height:150px;place-items:center;margin-bottom:18px;color:#fff;font-size:12px;font-weight:800;letter-spacing:.2em;background:linear-gradient(135deg,#27272a,#5b2224);border-radius:6px}.lesson-art{background:linear-gradient(135deg,#202123,#4c4d50)}.offer-meta{display:block;margin:10px 0;color:#3c3d41;font-size:10px}.offer-footer{display:flex;align-items:center;justify-content:space-between;margin-top:18px;padding-top:14px;border-top:1px solid #e7e7e9}.offer-footer span{color:#777980;font-size:9px}.page-tools{display:flex;justify-content:flex-end;margin-bottom:16px}.page-tools .field{width:210px}.waiver-card{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;padding:24px;border-left:3px solid var(--red)}.waiver-card p{margin:0;color:#777980;font-size:10px}.plans{grid-template-columns:repeat(4,1fr)}.plan-price{display:block;margin:20px 0;font-size:20px}.plan-card .primary{width:100%}.date-slots{display:flex;gap:8px;margin-bottom:16px}.date-slots button{flex:1;padding:10px;font-size:10px;background:#fff;border:1px solid #ddd;border-radius:6px}.date-slots button.active{color:#fff;background:#242426}.check-row{flex-direction:row!important;align-items:center}.check-row input{width:auto!important}.product-image{display:grid;height:170px;place-items:center;margin-bottom:16px;color:#999;font-size:11px;font-weight:800;letter-spacing:.15em;background:#f0f0f1;border-radius:6px}.info-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:20px}.info-form label{display:flex;flex-direction:column;gap:7px;margin-bottom:15px;color:#55575d;font-size:10px;font-weight:700}.info-form input,.info-form select{width:100%;padding:11px;border:1px solid #d8d9dd;border-radius:6px;background:#fff}.birth-row{display:grid;grid-template-columns:1.3fr .8fr 1fr;gap:8px}.wide{width:100%}.faq-panel button{display:flex;width:100%;justify-content:space-between;padding:15px 2px;color:#44464b;font-size:10px;font-weight:700;text-align:left;background:transparent;border:0;border-bottom:1px solid #e5e6e8}.staff-note{margin-top:8px!important;color:#999!important;font-size:8px!important}.security-banner{display:flex;gap:10px;margin-bottom:18px;padding:15px 18px;color:#355f43;font-size:10px;background:#eaf4ed;border:1px solid #cde3d3;border-radius:8px}.receipt-button{color:var(--red);font-size:9px;font-weight:700;background:none;border:0}.page-stack{display:flex;flex-direction:column;gap:20px}
@media(max-width:1100px){.cards-grid{grid-template-columns:repeat(2,1fr)}.plans{grid-template-columns:repeat(2,1fr)}.calendar-filters{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.cms-status{display:none}.logout{display:none}.calendar-toolbar{align-items:stretch;flex-direction:column}.view-toggle{margin-bottom:15px}.cards-grid,.plans,.info-layout{grid-template-columns:1fr}.waiver-card{align-items:flex-start;flex-direction:column;gap:16px}.birth-row{grid-template-columns:1fr}.security-banner{flex-direction:column}}
.private-lessons-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start;font-family:"Inter:Regular",Inter,sans-serif}.private-catalog{display:flex;min-width:0;flex-direction:column;gap:24px}.private-intro{display:flex;flex-direction:column;gap:6px}.private-intro h2{margin:0;font-family:"Inter:Semi Bold",Inter,sans-serif;font-size:18px;font-weight:600;line-height:1.45}.private-intro p{margin:0;color:#666;font-size:13px;line-height:1.45}.private-service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.private-service-card{display:flex;min-height:270px;flex-direction:column;align-items:flex-start;gap:18px;padding:18px;background:#fff;border:1px solid #d5d5d5;border-radius:8px}.private-service-card.selected{border-color:#202020}.private-service-card h3{margin:0;font-family:"Inter:Semi Bold",Inter,sans-serif;font-size:15px;font-weight:600;line-height:1.45}.service-description{min-height:35px}.service-description p{margin:0;color:#666;font-size:12px;line-height:1.45}.service-price{padding:4px 8px;font-family:"Inter:Medium",Inter,sans-serif;font-size:11px;font-weight:500;background:#f4f4f4;border:1px solid #d5d5d5;border-radius:4px}.service-duration{margin:0;color:#666;font-size:11px;line-height:1.45}.private-service-card>button{width:100%;min-height:40px;margin-top:auto;padding:10px 16px;font-family:"Inter:Semi Bold",Inter,sans-serif;font-size:13px;font-weight:600;background:#fff;border:1px solid #d5d5d5;border-radius:6px}.private-service-card>button.selected{color:#fff;background:#303030;border-color:#303030}.private-help{display:flex;flex-direction:column;gap:8px;width:100%;padding:18px;text-align:left;background:#fff;border:1px solid #d5d5d5;border-radius:8px}.private-help strong{font-family:"Inter:Semi Bold",Inter,sans-serif;font-size:13px;font-weight:600}.private-help span{color:#666;font-size:12px}.appointment-panel{display:flex;flex-direction:column;gap:20px;padding:20px;background:#fff;border:1px solid #d5d5d5;border-radius:8px}.appointment-title{display:flex;align-items:flex-start;justify-content:space-between}.appointment-title h2{margin:0;font-family:"Inter:Semi Bold",Inter,sans-serif;font-size:17px;font-weight:600;line-height:1.45}.appointment-title button{padding:0;color:#666;font-size:18px;background:transparent;border:0}.appointment-steps{margin:0;color:#666;font-size:11px;line-height:1.45}.selected-service{display:flex;flex-direction:column;gap:4px;padding:12px;background:#f4f4f4;border-radius:6px}.selected-service strong{font-family:"Inter:Semi Bold",Inter,sans-serif;font-size:14px;font-weight:600}.selected-service span{color:#666;font-size:12px}.mini-calendar{display:flex;flex-direction:column;gap:12px}.month-selector{display:flex;align-items:center;justify-content:space-between}.month-selector strong{font-family:"Inter:Semi Bold",Inter,sans-serif;font-size:14px;font-weight:600}.month-selector button{width:24px;height:24px;padding:0;color:#666;background:transparent;border:0}.weekday-row,.calendar-days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.weekday-row span{color:#666;font-size:10px;text-align:center}.calendar-days button{height:30px;padding:0;color:#666;font-size:11px;background:transparent;border:0;border-radius:4px}.calendar-days button.active{color:#fff;background:#303030}.appointment-section,.appointment-summary{display:flex;flex-direction:column;gap:7px;padding-top:20px;border-top:1px solid #d5d5d5}.appointment-section>strong,.appointment-summary>strong{font-family:"Inter:Semi Bold",Inter,sans-serif;font-size:13px;font-weight:600}.appointment-section>span,.appointment-summary>span{color:#666;font-size:11px;line-height:1.45}.time-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:5px}.time-grid button{min-height:40px;padding:10px 16px;font-family:"Inter:Semi Bold",Inter,sans-serif;font-size:13px;font-weight:600;background:#fff;border:1px solid #d5d5d5;border-radius:6px}.time-grid button.active{color:#fff;background:#303030;border-color:#303030}.confirm-appointment{width:100%;min-height:40px;padding:10px 16px;color:#fff;font-family:"Inter:Semi Bold",Inter,sans-serif;font-size:13px;font-weight:600;background:#303030;border:1px solid #303030;border-radius:6px}.confirm-appointment.confirmed{background:#38764c;border-color:#38764c}.appointment-note{margin:0;color:#666;font-size:11px;line-height:1.45}
@media(max-width:1200px){.private-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.private-lessons-layout{grid-template-columns:1fr}.appointment-panel{width:100%}.private-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.private-service-grid{grid-template-columns:1fr}}
.private-lessons-layout{font-family:Inter,Arial,sans-serif}.private-intro h2,.private-service-card h3,.private-service-card>button,.private-help strong,.appointment-title h2,.selected-service strong,.month-selector strong,.appointment-section>strong,.appointment-summary>strong,.time-grid button,.confirm-appointment{font-family:Inter,Arial,sans-serif}.private-service-card,.private-help,.appointment-panel{border-color:#e1e2e5;box-shadow:0 2px 10px rgb(20 20 25 / 4%)}.private-service-card{transition:border-color 160ms ease,box-shadow 160ms ease,transform 160ms ease}.private-service-card:hover{border-color:#d0d1d5;box-shadow:0 6px 18px rgb(20 20 25 / 7%);transform:translateY(-1px)}.private-service-card.selected{background:#fffafa;border-color:var(--red);box-shadow:0 5px 18px rgb(211 47 47 / 9%)}.service-price{color:#a32424;background:#fde8e8;border-color:#f0caca}.private-service-card>button{color:#424247;background:#fff;border-color:#d4d5d9}.private-service-card>button:hover{color:var(--red);background:#fffafa;border-color:#e4b5b5}.private-service-card>button.selected,.confirm-appointment{color:#fff;background:var(--red);border-color:var(--red);box-shadow:0 2px 5px rgb(211 47 47 / 16%)}.private-service-card>button.selected:hover,.confirm-appointment:hover{background:#b92323;border-color:#b92323}.private-help:hover{background:#fafafb;border-color:#d3d4d7}.appointment-panel{border-top:3px solid var(--red)}.selected-service{background:#f6f7f8;border-left:3px solid var(--red)}.calendar-days button:hover:not(:disabled){color:var(--red);background:#fff0f0}.calendar-days button.active,.time-grid button.active{color:#fff;background:var(--red);border-color:var(--red)}.time-grid button:hover:not(.active){color:var(--red);background:#fffafa;border-color:#e4b5b5}.confirm-appointment.confirmed{background:#2f7447;border-color:#2f7447}.appointment-title button:hover,.month-selector button:hover{background:#f4f5f7;border-radius:4px}
.memberships-page{display:flex;flex-direction:column;gap:24px}.membership-waiver{display:flex;align-items:center;gap:20px;padding:24px;background:#fff;border:1px solid #e1e2e5;border-left:3px solid var(--red);border-radius:8px;box-shadow:0 2px 10px rgb(20 20 25 / 4%)}.membership-waiver>div{flex:1}.membership-waiver h2{margin-bottom:5px;font-size:16px;font-weight:600}.membership-waiver p{margin:0;color:#666;font-size:13px;line-height:1.45}.membership-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.membership-heading h2{margin:0;font-size:18px;font-weight:600}.membership-heading span{color:#666;font-size:12px}.membership-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.membership-plan-card{display:flex;min-height:276px;flex-direction:column;align-items:flex-start;gap:16px;padding:24px;background:#fff;border:1px solid #e1e2e5;border-radius:8px;box-shadow:0 2px 10px rgb(20 20 25 / 4%);transition:border-color 160ms ease,box-shadow 160ms ease,transform 160ms ease}.membership-plan-card:hover{border-color:#d0d1d5;box-shadow:0 6px 18px rgb(20 20 25 / 7%);transform:translateY(-1px)}.membership-plan-card h3{margin:0;font-size:16px;font-weight:600;line-height:1.45}.membership-price{font-size:30px;font-weight:700;line-height:1.45}.membership-description{display:flex;flex-direction:column;gap:5px}.membership-description b{font-size:13px;font-weight:500}.membership-description p{margin:0;color:#666;font-size:12px;line-height:1.45}.membership-plan-card>button{width:100%;min-height:40px;margin-top:auto;padding:10px 16px;color:#424247;font-size:13px;font-weight:600;background:#fff;border:1px solid #d4d5d9;border-radius:6px}.membership-plan-card>button:hover{color:#fff;background:var(--red);border-color:var(--red);box-shadow:0 2px 5px rgb(211 47 47 / 16%)}@media(max-width:1050px){.membership-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.membership-waiver{align-items:flex-start;flex-wrap:wrap}.membership-waiver>div{min-width:calc(100% - 50px)}.membership-waiver .primary{width:100%}.membership-grid{grid-template-columns:1fr}.membership-heading{align-items:flex-start;flex-direction:column;gap:5px}}
.events-workspace{display:flex;flex-direction:column}.events-title{padding-bottom:14px;border-bottom:1px solid var(--line)}.events-title h2{margin:0;font-size:22px;font-weight:700}.events-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 0}.event-filters{display:flex;align-items:center;gap:8px}.event-filters button,.event-filters select,.event-sort{min-height:36px;padding:8px 13px;color:#5e6066;font-size:10px;font-weight:600;background:#fff;border:1px solid #d8d9dd;border-radius:6px}.event-filters button:hover,.event-filters button.active{color:#fff;background:#242426;border-color:#242426}.event-filters select,.event-sort{padding-right:30px}.event-result-count{margin:0 0 12px;color:#85878d;font-size:10px}.event-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.event-card{display:flex;min-height:182px;flex-direction:column;padding:20px;background:#fff;border:1px solid #e1e2e5;border-radius:8px;box-shadow:0 2px 10px rgb(20 20 25 / 4%);transition:border-color 160ms ease,box-shadow 160ms ease,transform 160ms ease}.event-card:hover{border-color:#d0d1d5;box-shadow:0 6px 18px rgb(20 20 25 / 7%);transform:translateY(-1px)}.event-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.event-category,.event-price-badge{padding:4px 8px;font-size:8px;font-weight:800;border-radius:999px}.event-category{color:#55575d;background:#eeeeef}.event-category.workshops{color:#915125;background:#f9eadf}.event-category.camps{color:#2d5e91;background:#e5effa}.event-price-badge{color:#a32424;background:#fde8e8}.event-card h3{margin:0 0 13px;font-size:14px;line-height:1.4}.event-card h3 span{color:#666;font-size:11px;font-weight:500}.event-date-line{display:flex;gap:5px;color:#666;font-size:10px}.event-date-line strong{color:#34353a}.event-card-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:18px}.event-card-bottom>span{color:#96989e;font-size:9px}.registration-details{display:flex;flex-direction:column;gap:12px}.registration-details>div{display:flex;flex-direction:column;gap:5px}.registration-details span{color:#85878d;font-size:9px;font-weight:700;text-transform:uppercase}.registration-details strong{font-size:11px}.registration-details select{padding:10px 12px;background:#fff;border:1px solid #d8d9dd;border-radius:6px;font-size:11px}.member-discount{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:18px;padding:14px;color:#666;font-size:10px;background:#f6f7f8;border-radius:6px}.member-discount strong,.member-discount b{text-align:right}.member-discount b{padding-top:10px;color:#202022;font-size:12px;border-top:1px solid #ddd}
@media(max-width:760px){.events-toolbar{align-items:stretch;flex-direction:column}.event-filters{flex-wrap:wrap}.event-sort{width:100%}.event-card-grid{grid-template-columns:1fr}}
.events-title{display:flex;align-items:center;justify-content:space-between;padding-bottom:0;border:0}.events-title h2{font-size:18px;font-weight:600}.events-title span{color:#666;font-size:12px}.events-toolbar{padding:16px 0}.event-filters button,.event-filters select,.event-sort{min-height:32px;padding:7px 13px;border-radius:16px}.event-sort{border-radius:6px}.events-table{overflow:hidden;background:#fff;border:1px solid #d5d5d5;border-radius:8px;box-shadow:0 2px 10px rgb(20 20 25 / 4%)}.events-table-head,.event-table-row{display:grid;grid-template-columns:74px minmax(280px,1fr) 108px 86px 90px;align-items:center;column-gap:14px;padding:0 20px}.events-table-head{min-height:40px;color:#7c7e84;font-size:9px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;background:#f4f4f4;border-bottom:1px solid #d5d5d5}.event-table-row{min-height:82px;border-bottom:1px solid #d5d5d5}.event-date-tile{display:flex;width:60px;height:52px;flex-direction:column;align-items:center;justify-content:center;background:#f7f7f8;border:1px solid #d5d5d5;border-radius:6px}.event-date-tile span{color:#666;font-size:8px}.event-date-tile strong{font-size:20px;line-height:1.2}.event-table-name{display:flex;min-width:0;flex-direction:column;gap:5px}.event-table-name strong{overflow:hidden;font-size:12px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.event-table-name span{color:#888a90;font-size:10px}.spaces-pill{display:inline-flex;min-width:78px;justify-content:center;padding:5px 10px;color:#666;font-size:9px;background:#f0f0f1;border-radius:999px}.event-table-price{font-size:13px}.event-register{min-height:40px;padding:10px 15px;color:#fff;font-size:10px;font-weight:700;background:var(--red);border:1px solid var(--red);border-radius:6px}.event-register:hover{background:#b92323;border-color:#b92323}.events-pagination{display:flex;align-items:center;justify-content:space-between;min-height:60px;padding:0 20px;color:#888a90;font-size:10px;background:#fafafa}.events-pagination>div{display:flex;align-items:center;gap:8px}.events-pagination button{padding:7px 11px;color:#666;background:#fff;border:1px solid #d5d5d5;border-radius:6px}.events-pagination button:disabled{cursor:not-allowed;opacity:.45}.events-pagination strong{display:grid;width:28px;height:28px;place-items:center;color:#fff;background:#303030;border-radius:6px}
@media(max-width:900px){.events-table-head{display:none}.event-table-row{grid-template-columns:66px 1fr auto;padding:14px}.event-table-name{grid-column:2}.spaces-pill{grid-column:2;justify-self:start}.event-table-price{grid-column:3;grid-row:1}.event-register{grid-column:3;grid-row:2}.events-pagination{align-items:flex-start;flex-direction:column;gap:12px;padding:15px 20px}}
@media(max-width:560px){.events-title{align-items:flex-start;flex-direction:column;gap:5px}.event-table-row{grid-template-columns:58px 1fr}.event-date-tile{grid-row:1/3}.event-table-price,.event-register{grid-column:2;grid-row:auto;justify-self:start}.spaces-pill{display:none}.events-pagination>span{display:none}}
.faq-accordion{margin-top:14px;border-top:1px solid #e5e6e8}.faq-accordion article{border-bottom:1px solid #e5e6e8}.faq-accordion article.open{background:#fffafa}.faq-panel .faq-accordion button{display:flex;width:100%;align-items:center;justify-content:space-between;padding:16px 10px;color:#34353a;font-size:11px;font-weight:700;line-height:1.4;text-align:left;background:transparent;border:0}.faq-panel .faq-accordion button:hover{color:var(--red);background:#fff7f7}.faq-panel .faq-accordion article.open button{color:var(--red)}.faq-panel .faq-accordion button b{font-size:14px;font-weight:500}.faq-answer{padding:0 28px 18px 10px;color:#4f5156;font-size:10px;line-height:1.65}.faq-answer p{margin:0 0 11px}.faq-answer p:last-child{margin-bottom:0}.faq-answer ul{margin:0;padding-left:17px}.faq-answer ul ul{margin:5px 0 8px;padding-left:18px}.faq-link{color:#1675a9;text-decoration:underline;text-underline-offset:2px}
.support-tabs{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px;padding:5px;background:#f0f1f3;border:1px solid #e1e2e5;border-radius:8px}.support-tabs:before{position:absolute;top:5px;bottom:5px;left:5px;width:calc((100% - 18px)/2);background:var(--red);border-radius:6px;box-shadow:0 3px 9px rgb(211 47 47 / 18%);content:"";transition:transform 280ms cubic-bezier(.22,1,.36,1)}.support-tabs.policies:before{transform:translateX(calc(100% + 8px))}.faq-panel .support-tabs button{position:relative;z-index:1;display:block;width:100%;padding:12px 16px;color:#676970;font-size:13px;font-weight:800;text-align:center;background:transparent;border:0;border-radius:6px;transition:color 220ms ease}.faq-panel .support-tabs button:hover{color:var(--red);background:transparent}.faq-panel .support-tabs button.active,.faq-panel .support-tabs button.active:hover{color:#fff;background:transparent;box-shadow:none}.support-hint{margin:10px 2px 0;color:#85878d;font-size:9px}
.faq-answer-wrap{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows 380ms cubic-bezier(.22,1,.36,1),opacity 240ms ease}.faq-answer-wrap>.faq-answer{min-height:0;overflow:hidden}.faq-accordion article.open .faq-answer-wrap{grid-template-rows:1fr;opacity:1}.faq-answer{padding-top:0;transition:padding 380ms cubic-bezier(.22,1,.36,1)}.faq-accordion article.open .faq-answer{padding-top:0}
.shop-layout{display:flex;flex-direction:column;gap:24px}.shop-item-count{align-self:flex-end;color:#666;font-size:12px}.shop-product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.shop-product-card{display:flex;min-width:0;flex-direction:column;gap:20px;padding:24px;background:#fff;border:1px solid #e1e2e5;border-radius:8px;box-shadow:0 2px 10px rgb(20 20 25 / 4%)}.shop-image-placeholder{display:flex;height:228px;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#666;font-size:12px;background:#f4f4f4;border:1px solid #d5d5d5;border-radius:6px}.shop-product-details{display:flex;flex-direction:column;align-items:flex-start;gap:10px}.shop-badge{padding:4px 8px;color:#202020;font-size:11px;font-weight:500;background:#f4f4f4;border:1px solid #d5d5d5;border-radius:4px}.shop-product-details h2{margin:0;font-size:18px;font-weight:600;line-height:1.45}.shop-product-details p{min-height:38px;margin:0;color:#666;font-size:13px;line-height:1.45}.shop-product-details>strong{font-size:24px;font-weight:600;line-height:1.45}.shop-note{display:flex;min-height:44px;align-items:center;margin:0;color:#666;font-size:12px}.gift-amount{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 12px;color:#666;border:1px solid #d5d5d5;border-radius:6px}.gift-amount input{width:100%;height:42px;background:transparent;border:0;outline:0;font-size:13px}.shop-purchase{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-top:auto;padding-top:20px;border-top:1px solid #d5d5d5}.quantity-control{display:flex;flex-direction:column;gap:6px}.quantity-control>span{color:#666;font-size:11px}.quantity-control>div{display:flex;align-items:center;gap:18px;padding:6px 10px;border:1px solid #d5d5d5;border-radius:6px}.quantity-control button{padding:0;color:#202020;font-size:16px;background:transparent;border:0}.quantity-control b{min-width:10px;font-size:13px;font-weight:400;text-align:center}.shop-purchase>.primary{min-height:40px}.shop-purchase>.primary:disabled{cursor:not-allowed;opacity:.45}.shop-guidance{display:flex;align-items:center;gap:8px;color:#666;font-size:12px}
@media(max-width:800px){.shop-product-grid{grid-template-columns:1fr}}@media(max-width:460px){.shop-product-card{padding:18px}.shop-purchase{align-items:stretch;flex-direction:column}.shop-purchase>.primary{width:100%}}
/* ---- portal additions (live data states, auth, cart, receipts) ---- */
.brand-mark{display:block;width:180px;height:auto}
.sidebar nav button img{width:18px;height:18px}
.muted{color:#85878d}.tiny{font-size:9px}.center{text-align:center}
.skeleton{position:relative;overflow:hidden;background:#eeeff1;border-radius:6px}.skeleton:after{position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgb(255 255 255 / 60%),transparent);transform:translateX(-100%);animation:shimmer 1.2s infinite;content:""}@keyframes shimmer{to{transform:translateX(100%)}}
.sk-row{height:72px;margin:0 22px 10px}.sk-card{height:220px}
.empty-note{padding:40px 22px;color:#777980;font-size:12px;text-align:center}
.error-note{margin:12px 0;padding:12px 14px;color:#8f1f1f;font-size:11px;line-height:1.5;background:#fdecec;border:1px solid #f3c9c9;border-radius:6px}
.ok-note{margin:12px 0;padding:12px 14px;color:#245c37;font-size:11px;line-height:1.5;background:#e7f4ea;border:1px solid #c4e3cc;border-radius:6px}
.info-note{margin:12px 0;padding:12px 14px;color:#3d4046;font-size:11px;line-height:1.5;background:#f4f5f7;border:1px solid #e1e2e5;border-radius:6px}
.primary:disabled,.outline:disabled,.event-register:disabled{cursor:not-allowed;opacity:.45;box-shadow:none}
.primary.full{color:#6b6d72;background:#eeeef0;border-color:#e1e2e5;box-shadow:none}
.spots small.low{color:var(--red);font-weight:700}
.class-row .class-name small{max-width:340px}
.class-row.is-full{background:#fafafa}
.pill.purple{color:#5b3aa6;background:#efe9fb}.pill.teal{color:#1f6f73;background:#e2f3f3}.pill.amber{color:#8a5a12;background:#fbf0dc}
.week-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;padding:18px 22px}
.week-col{min-height:220px;padding:8px;background:#fafafb;border:1px solid #e7e8ea;border-radius:7px}
.week-col>b{display:block;margin-bottom:8px;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#55575d}
.week-chip{display:block;width:100%;margin-bottom:6px;padding:7px 8px;font-size:9px;text-align:left;background:#fff;border:1px solid #e1e2e5;border-left:3px solid var(--red);border-radius:5px}
.week-chip:hover{border-color:#d0d1d5;box-shadow:0 3px 9px rgb(20 20 25 / 7%)}
.week-chip strong{display:block;font-size:9px;margin-bottom:2px}.week-chip span{color:#85878d}
.month-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;padding:18px 22px}
.month-grid .dow{color:#85878d;font-size:9px;font-weight:700;text-align:center;text-transform:uppercase}
.month-day{min-height:78px;padding:7px;text-align:left;background:#fff;border:1px solid #e5e6e9;border-radius:6px}
.month-day:hover:not(:disabled){border-color:var(--red)}.month-day:disabled{background:#fafafa;opacity:.5;cursor:default}
.month-day b{display:block;font-size:11px}.month-day span{display:inline-block;margin-top:6px;padding:2px 6px;color:#a32424;font-size:8px;font-weight:800;background:#fde8e8;border-radius:999px}
.month-day.today{border-color:#242426}
.modal.wide{width:min(680px,100%)}
.modal{max-height:calc(100vh - 40px);overflow:auto}
.elig{display:flex;gap:8px;align-items:flex-start;margin:-4px 0 14px;font-size:10px;line-height:1.5}
.elig.bad{color:#8f1f1f}.elig.good{color:#245c37}
.auth-tabs{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin-bottom:18px;padding:4px;background:#f0f1f3;border-radius:7px}
.auth-tabs button{padding:9px;color:#676970;font-size:11px;font-weight:700;background:transparent;border:0;border-radius:5px}
.auth-tabs button.active{color:#fff;background:var(--red)}
.signin-chip{display:flex;align-items:center;gap:8px;padding:9px 14px;color:#fff;font-size:11px;font-weight:800;background:var(--red);border:0;border-radius:7px}
.drawer-backdrop{position:fixed;inset:0;z-index:90;background:rgb(10 10 12 / 45%)}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:95;display:flex;width:min(420px,100%);flex-direction:column;background:#fff;box-shadow:-20px 0 50px rgb(0 0 0 / 25%);animation:slidein .25s ease}
@keyframes slidein{from{transform:translateX(30px);opacity:0}}
.drawer header{display:flex;align-items:center;justify-content:space-between;padding:22px;border-bottom:1px solid var(--line)}
.drawer .lines{flex:1;overflow:auto;padding:10px 22px}
.cart-line{display:grid;grid-template-columns:1fr auto;gap:6px 12px;padding:14px 0;border-bottom:1px solid #eee;font-size:11px}
.cart-line small{color:#85878d}
.cart-line .qty{display:flex;align-items:center;gap:10px}.cart-line .qty button{width:24px;height:24px;background:#fff;border:1px solid #ddd;border-radius:5px}
.drawer footer{padding:18px 22px;border-top:1px solid var(--line)}.drawer footer .row{display:flex;justify-content:space-between;margin-bottom:12px;font-size:12px}
.drawer footer .primary{width:100%;min-height:42px}
.cart{cursor:pointer;background:none;border-top:0;border-bottom:0;border-left:0}
.cart:hover strong{color:var(--red)}
.cart-badge{display:inline-grid;min-width:16px;height:16px;margin-left:6px;place-items:center;padding:0 4px;color:#fff;font-size:9px;background:var(--red);border-radius:999px}
.shop-filters{display:flex;flex-wrap:wrap;gap:8px}.shop-filters button{min-height:32px;padding:7px 13px;color:#5e6066;font-size:10px;font-weight:600;background:#fff;border:1px solid #d8d9dd;border-radius:16px}.shop-filters button.active{color:#fff;background:#242426;border-color:#242426}
.shop-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px}
.shop-product-grid.many{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1200px){.shop-product-grid.many{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:800px){.shop-product-grid.many{grid-template-columns:1fr}}
.size-select{width:100%;min-height:40px;padding:0 10px;background:#fff;border:1px solid #d5d5d5;border-radius:6px;font-size:12px}
.shop-image-placeholder .initials{display:grid;width:64px;height:64px;place-items:center;color:#fff;font-size:20px;font-weight:800;background:#242426;border-radius:50%}
.active-plans{display:grid;gap:10px}.active-plan{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;background:#fff;border:1px solid #e1e2e5;border-left:3px solid #2f7447;border-radius:8px;font-size:12px}
.active-plan.legacy{border-left-color:#d79a2a}
.receipt{font-size:12px;line-height:1.6}.receipt dl>div{display:flex;justify-content:space-between;padding:8px 0}.receipt dd{text-align:right}
.status.pending{color:#725c1f;background:#f6efda}.status.cancelled{color:#585a60;background:#eeeef0}
.level-list{display:flex;flex-wrap:wrap;gap:6px}
.history-tools{display:flex;gap:8px;align-items:center}
.history-tools select{min-height:34px;padding:0 10px;font-size:10px;background:#fff;border:1px solid #d5d5d5;border-radius:6px}
.member-menu{position:absolute;right:16px;z-index:5;margin-top:4px;padding:6px;background:#fff;border:1px solid #ddd;border-radius:7px;box-shadow:0 10px 24px rgb(0 0 0 / 12%)}.member-menu button{display:block;width:100%;padding:8px 12px;font-size:11px;text-align:left;background:none;border:0;border-radius:5px}.member-menu button:hover{background:#f4f5f7}
.member{position:relative}
.sig-input{font-family:"Brush Script MT","Segoe Script",cursive!important;font-size:20px!important}
.waiver-text{max-height:180px;overflow:auto;margin-bottom:14px;padding:12px;color:#4f5156;font-size:10px;line-height:1.6;background:#f7f7f8;border-radius:6px;white-space:pre-wrap}
.toast.error{background:#8f1f1f}.toast.success{background:#245c37}
.toast{animation:enter .25s ease;max-width:420px;line-height:1.45}
@media print{.sidebar,.topbar,.tabs,.modal-actions,.modal-backdrop .close,.toast{display:none!important}main{margin:0}.modal-backdrop{position:static;background:none;padding:0}.modal{box-shadow:none;max-height:none}.content>*:not(.modal-backdrop){display:none}}
a.brand{text-decoration:none}
.cart.show{display:flex}
.toast.live{display:block!important}
.modal-body>label,.modal-body>.form-row{margin-bottom:14px}
.modal-body label{display:block}
.week-chip:disabled{cursor:default;opacity:.55}
a.pill{text-decoration:none}
.elig a,.ok-note a,.info-note a,.empty-note a,.appointment-note a,.appointment-section a,.tiny a{color:var(--red);font-weight:700}
.history-tools{flex-wrap:wrap;justify-content:flex-end}
.event-filters select{min-height:32px}
.upcoming-row .status{margin-left:4px}
.calendar-days button:disabled{cursor:default}
.calendar-days button:not(:disabled):not(.active){font-weight:800;color:#202022}
@media(max-width:720px){.week-grid{grid-template-columns:1fr}.week-col{min-height:0}.month-day{min-height:54px}.history-tools{justify-content:flex-start}}
[hidden]{display:none!important}

/* =====================================================================================
   RESPONSIVE LAYER (laptops, tablets, phones). Added on top of the wireframe styles above,
   so the design itself is unchanged; these rules only adjust layout at smaller widths.
     > 1180px   the wireframe as designed (desktop)
     <= 1180px  small laptops / landscape tablets: two-column areas stack, toolbars wrap
     <= 1000px  narrower sidebar (logo and labels fit)
     <= 900px   tablets in portrait and phones: the sidebar becomes a dark top bar with a
                Menu button; the week view scrolls sideways inside its card
     <= 720px   phones: single-column cards, full-width buttons, 16px form text (stops
                iPhones zooming in when a field is tapped)
   ===================================================================================== */

/* Confirmation / error messages fade out (see toast() in js/ui.js). */
.toast { transition: opacity .4s ease, transform .4s ease; cursor: pointer; }
.toast.leaving { opacity: 0; transform: translateY(8px); pointer-events: none; }
.ok-note { transition: opacity .4s ease; }
.ok-note.leaving { opacity: 0; }

/* Grid and flex children may shrink below their content width (stops sideways overflow). */
.content, .content * { min-width: 0; }
.content img, .modal img { max-width: 100%; height: auto; }
.signin-chip, .header-actions .primary, .header-actions button { white-space: nowrap; }
.header-actions { flex-shrink: 0; }
.nav-toggle { display: none; }
/* Booking notices ("doesn't have a waiver… Complete it here") read as one sentence; as a flex
   row the link split off into its own narrow column. */
.elig { display: block; }

@media (max-width: 1180px) {
  .profile-grid { grid-template-columns: minmax(0, 1fr); }
  .section-title { flex-wrap: wrap; gap: 10px; }
  .topbar { gap: 16px; }
}

@media (max-width: 1100px) and (min-width: 721px) {
  /* Week view: keep seven readable columns and scroll them inside the card. */
  .week-grid { grid-template-columns: repeat(7, minmax(132px, 1fr)); overflow-x: auto; overscroll-behavior-x: contain; }
}

@media (max-width: 1000px) {
  .brand-mark { width: 100%; max-width: 160px; }
  .sidebar nav button { white-space: normal; line-height: 1.2; }
}

@media (max-width: 900px) {
  .app-shell { display: block; }
  .sidebar {
    position: sticky; inset: auto; top: 0; z-index: 60;
    width: 100%; min-height: 0;
    flex-direction: row; flex-wrap: wrap; align-items: center; gap: 0 12px;
    padding: 10px 20px;
    border-right: 0; border-bottom: 1px solid #303033;
  }
  .brand { flex-direction: row; align-items: center; gap: 12px; padding: 4px 0; border-bottom: 0; }
  .brand-mark { width: 132px; max-width: none; }
  .brand small { margin-top: 2px; }
  .nav-toggle {
    display: inline-flex; align-items: center; gap: 8px; margin-left: auto;
    min-height: 40px; padding: 8px 12px;
    color: #e4e4e6; font-size: 12px; font-weight: 700;
    background: #242426; border: 1px solid #38383b; border-radius: 7px;
  }
  .nav-toggle[aria-expanded="true"] { color: #fff; border-color: #4a4a4e; }
  .sidebar nav {
    display: none; width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px;
    margin: 10px 0 4px; padding-top: 10px; border-top: 1px solid #333336;
  }
  .sidebar.nav-open nav { display: grid; }
  .nav-label, .cms-status, .help { display: none; }
  main { margin-left: 0; }
  .topbar { min-height: 0; padding: 18px 20px; align-items: flex-start; }
  .content { padding: 20px; }
}

@media (max-width: 720px) {
  .sidebar { padding: 8px 16px; }
  .brand small { display: none; }
  .brand-mark { width: 118px; }
  .sidebar nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sidebar nav button { min-height: 44px; font-size: 13px; }
  .topbar { padding: 16px; }
  .topbar h1 { font-size: 24px; }
  .eyebrow { letter-spacing: .1em; }
  .content { padding: 14px; }

  /* Class list: time and class side by side, spots under the name, Book button full width. */
  .class-row { grid-template-columns: 76px minmax(0, 1fr); gap: 6px 14px; padding: 14px; }
  .class-row .spots { display: flex; grid-column: 2; }
  .class-row > button { grid-column: 1 / -1; width: 100%; }
  .class-list { padding: 0 14px 14px; }
  .day-heading { padding: 16px 14px 8px; }
  .week-nav { gap: 10px; padding: 14px; }
  .week-nav div { min-width: 0; flex: 1; text-align: center; }

  /* Forms: 16px text stops iPhones zooming in on tap; bigger touch targets. */
  input, select, textarea, .modal input, .modal select, .modal textarea { font-size: 16px; }
  .modal-backdrop { align-items: end; padding: 0; }
  .modal { width: 100%; max-height: 92vh; padding: 22px 18px; border-radius: 14px 14px 0 0; }
  .modal-actions { flex-wrap: wrap; }
  .modal-actions > * { flex: 1 1 auto; }
  .drawer { width: 100%; }
  .toast { right: 12px; left: 12px; bottom: 12px; max-width: none; }

  .tabs { overflow-x: auto; }
  .tabs button { flex: 1 0 auto; white-space: nowrap; }
  .table-wrap { margin: 0 -2px; -webkit-overflow-scrolling: touch; }
  .account-menu { right: -8px; width: min(260px, calc(100vw - 24px)); }
}

@media (max-width: 380px) {
  .sidebar nav { grid-template-columns: minmax(0, 1fr); }
  .topbar h1 { font-size: 22px; }
  .header-actions { gap: 6px; }
}

@media (prefers-reduced-motion: reduce) {
  .toast, .toast.leaving, .ok-note { transition: none; transform: none; }
}

/* ---- Profile completeness ("!" until the Primary Account is filled in) ---- */
.alert-dot { display: inline-grid; place-items: center; width: 16px; height: 16px; flex: 0 0 auto; color: #fff; font-size: 10px; font-weight: 800; line-height: 1; background: var(--red); border-radius: 50%; }
.alert-dot.inline { width: 14px; height: 14px; margin: 0 5px 0 4px; font-size: 9px; vertical-align: 1px; }
.avatar-wrap { position: relative; display: inline-flex; }
.avatar-wrap .alert-dot { position: absolute; top: -4px; right: -5px; width: 17px; height: 17px; background: #1f1f22; border: 2px solid #fff; }
.account-menu .needs-attention small { color: #a32424; }
.profile-alert { display: flex; align-items: flex-start; gap: 12px; margin: 0 0 18px; padding: 14px; background: #fff4f4; border: 1px solid #f1c6c6; border-radius: 8px; }
.profile-alert .alert-dot { width: 22px; height: 22px; font-size: 13px; }
.profile-alert b { display: block; margin-bottom: 4px; color: #8f1f1f; font-size: 12px; }
.profile-alert p { margin: 0; color: #6b3a3a; font-size: 11px; line-height: 1.5; }
.profile-alert .primary { margin-top: 10px; }
.profile-alert.compact { margin: 4px 0 6px; }
.missing-field { display: inline-flex; align-items: center; color: #a32424; font-weight: 700; }
.missing-field .alert-dot.inline { margin-left: 0; }
dl .is-missing dt { color: #a32424; }
.modal label.needs input, .modal label.needs select { background: #fffafa; border-color: #e3a3a3; }

/* ---- Emergency contact: name, relationship and phone as one group ---- */
.modal .emergency-group { margin: 4px 0 0; padding: 12px 14px 4px; border: 1px solid #e3e4e8; border-radius: 8px; }
.modal .emergency-group legend { padding: 0 6px; color: #55575d; font-size: 10px; font-weight: 700; }
.modal .emergency-group.needs { border-color: #e3a3a3; background: #fffafa; }
.modal .emergency-group > label { display: flex; flex-direction: column; gap: 7px; margin-bottom: 14px; }
@media (max-width: 720px) { .modal .emergency-group .form-row { row-gap: 0; } }

/* ---- Shop: gift card + expanding descriptions ---- */
.shop-product-grid { align-items: start; }
.shop-product-card { transition: box-shadow .3s ease, transform .3s ease; }
.shop-image-placeholder.has-image { background: #fff; }
.shop-image-placeholder.has-image img { width: 100%; height: 100%; object-fit: contain; }
.shop-product-details { width: 100%; }
.shop-desc { position: relative; display: flex; width: 100%; min-height: 38px; max-height: 40px; flex-direction: column; gap: 2px; overflow: hidden; color: #666; font-size: 13px; line-height: 1.45; transition: max-height .4s ease; }
.shop-desc.is-clamped::after { position: absolute; right: 0; bottom: 0; left: 0; height: 20px; content: ""; background: linear-gradient(rgb(255 255 255 / 0), #fff); transition: opacity .25s ease; pointer-events: none; }
.shop-product-card.expanded .shop-desc { max-height: var(--full, 600px); }
.shop-product-card.expanded .shop-desc::after { opacity: 0; }
.desc-toggle { margin-top: -6px; padding: 2px 0; color: var(--red); font-size: 11px; font-weight: 700; background: none; border: 0; text-decoration: underline; text-underline-offset: 2px; }
@media (hover: hover) and (pointer: fine) {
  /* Hovering (or tabbing into) a card with a long description opens it up to the full text.
     Touch screens get the "More details" button instead. */
  .shop-product-card.can-expand:hover, .shop-product-card.can-expand:focus-within { box-shadow: 0 16px 36px rgb(20 20 25 / 13%); transform: translateY(-3px); }
  .shop-product-card.can-expand:hover .shop-desc, .shop-product-card.can-expand:focus-within .shop-desc { max-height: var(--full, 600px); }
  .shop-product-card.can-expand:hover .shop-desc::after, .shop-product-card.can-expand:focus-within .shop-desc::after { opacity: 0; }
  .desc-toggle { display: none; }
}
@media (prefers-reduced-motion: reduce) { .shop-product-card, .shop-desc { transition: none; } .shop-product-card.can-expand:hover, .shop-product-card.can-expand:focus-within { transform: none; } }

.gift-visual { background: #f4f4f4; }
.gift-card-art { display: flex; width: min(300px, 84%); aspect-ratio: 1.586; flex-direction: column; justify-content: space-between; padding: 18px 20px; color: #fff; background: linear-gradient(135deg, #18181a 0%, #2b2b2f 58%, #4a1717 100%); border-radius: 14px; box-shadow: 0 14px 28px rgb(0 0 0 / 22%); }
.gift-brand { font-size: 21px; font-weight: 900; letter-spacing: .3px; line-height: 1; }
.gift-brand b { color: var(--red); font-weight: 900; }
.gift-label { margin-top: -18px; color: #b9b9bd; font-size: 10px; font-weight: 600; letter-spacing: 2.4px; text-transform: uppercase; }
.gift-card-art strong { align-self: flex-end; font-size: 30px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.gift-field { display: flex; flex-direction: column; gap: 6px; }
.gift-amount { background: #fff; }
.gift-amount span { color: #202020; font-weight: 600; }
.gift-amount:focus-within { border-color: #9a9ba0; }
.gift-amount.bad { background: #fffafa; border-color: #e3a3a3; }
.gift-help { color: #777; font-size: 11px; }
.gift-help.bad { color: #b42318; }
.gift-delivery { max-width: 230px; margin: 0; color: #666; font-size: 12px; line-height: 1.4; }
.cart-line .gift-qty span { color: #85878d; font-size: 11px; }

/* ---- Sidebar loading spinner (public/js/loading.js) ---- */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.page-loading { display: flex; align-items: center; min-height: 48px; margin-top: auto; padding: 13px 11px; }
.page-loading .spinner { width: 22px; height: 22px; border: 2.5px solid rgb(255 255 255 / 14%); border-top-color: var(--red); border-radius: 50%; opacity: 0; transition: opacity .2s ease; }
.page-loading.is-loading .spinner { opacity: 1; animation: ms-spin .8s linear infinite; }
@keyframes ms-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .page-loading.is-loading .spinner { animation-duration: 2.4s; } }
@media (max-width: 900px) {
  /* Top bar: the spinner sits just left of the Menu button. */
  .sidebar > .brand { order: 0; }
  .sidebar > .page-loading { order: 1; min-height: 0; margin: 0 0 0 auto; padding: 0; }
  .sidebar > .nav-toggle { order: 2; margin-left: 0; }
  .sidebar > nav { order: 3; }
}

/* ---- Greyed-out classes and events (booking window closed / no one has the band) ----
   The outer box stays still and the card inside turns over (hover with a mouse; tap or Enter on
   touch screens and keyboards), so the hover never flickers mid-turn. */
.flip-row { position: relative; perspective: 1400px; cursor: help; }
.flip-row:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; border-radius: 7px; }
.flip-card { display: grid; transform-style: preserve-3d; transition: transform .65s cubic-bezier(.25, .8, .25, 1); }
.flip-face { grid-area: 1 / 1; min-width: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.flip-back { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 12px 18px; color: #f4f4f5; text-align: left; background: #1f1f22; transform: rotateX(180deg); }
.flip-back p { max-width: 62ch; margin: 0; font-size: 12px; font-weight: 600; line-height: 1.45; }
.flip-back a { color: #ff8a80; font-weight: 800; white-space: nowrap; text-decoration: underline; text-underline-offset: 2px; }
.flip-icon { display: grid; flex: 0 0 auto; width: 28px; height: 28px; place-items: center; color: #fff; font-size: 14px; background: var(--red); border-radius: 50%; }
@media (hover: hover) and (pointer: fine) { .flip-row:hover .flip-card { transform: rotateX(180deg); } }
.flip-row.flipped .flip-card, .flip-row:focus-visible .flip-card { transform: rotateX(180deg); }
@media (prefers-reduced-motion: reduce) { .flip-card { transition: none; } }

/* Greyed front */
.is-greyed .flip-front { background: #f1f1f2; }
.is-greyed .flip-front > * { opacity: .5; }
.is-greyed .flip-front .pill { filter: grayscale(1); }

/* Class list: keep the joined-up borders of the list on both faces */
.class-list .flip-row .flip-face { border: 1px solid #e5e6e9; border-bottom: 0; border-radius: 0; }
.class-list .flip-row .flip-back { border-color: #1f1f22; }
.class-list .flip-row:first-child .flip-face { border-radius: 7px 7px 0 0; }
.class-list .flip-row:last-child .flip-face { border-bottom: 1px solid #e5e6e9; border-radius: 0 0 7px 7px; }
.class-list .flip-row:last-child .flip-back { border-bottom-color: #1f1f22; }
.class-list .flip-row:first-child:last-child .flip-face { border-radius: 7px; }

/* Week view chips */
.week-flip { margin-bottom: 6px; }
.week-flip .week-chip { margin: 0; cursor: help; }
.week-flip .flip-back { gap: 0; padding: 7px 8px; border-radius: 5px; }
.week-flip .flip-back p { font-size: 9px; line-height: 1.35; }
.week-flip .flip-icon { display: none; }

/* Events table */
.event-flip .flip-back { border-bottom: 1px solid #1f1f22; }

/* Classes nobody in the family has the band for: greyed, no flip, the band pill stands out */
.class-row.is-ineligible { background: #f1f1f2; }
.class-row.is-ineligible > * { opacity: .5; }
.class-row.is-ineligible > .class-name { opacity: 1; }
.class-row.is-ineligible > .class-name > strong { opacity: .5; }
.pill.unmet { color: #b3261e; font-weight: 800; background: #fde8e7; border: 1px solid #f3b4b0; }
.week-chip.is-ineligible { background: #f1f1f2; border-left-color: #c9c9cd; opacity: 1; }
.week-chip.is-ineligible strong, .week-chip.is-ineligible { color: #8b8b91; }
.week-chip.is-ineligible .unmet-text { display: block; margin-top: 2px; color: #b3261e; font-weight: 800; }

/* ---- Create Account: grouped sign-up form (account, about you, waiver) ---- */
.modal .signup-group { margin: 0 0 14px; padding: 12px 14px 2px; border: 1px solid #e3e4e8; border-radius: 8px; min-width: 0; }
.modal .signup-group legend { padding: 0 6px; color: #55575d; font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.modal .signup-group > label { display: flex; flex-direction: column; gap: 7px; margin-bottom: 14px; }
.modal .signup-group > label.check-row { flex-direction: row; align-items: flex-start; gap: 8px; }
.modal .signup-group > label.check-row input { width: auto; margin-top: 2px; }
.modal .signup-group .waiver-text { max-height: 240px; white-space: pre-wrap; }
.modal .signup-group .eyebrow { margin: 0 0 6px; }
@media (max-width: 720px) { .modal .signup-group .form-row { row-gap: 0; } }
.profile-alert .alert-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.profile-alert .alert-actions .primary { margin-top: 0; }

/* ---- Class Calendar: "Booking for" family switcher ---- */
.who-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 14px 20px; border-bottom: 1px solid var(--line); }
.who-label { color: #66686e; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.who-chips { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; }
.who-chip { display: inline-flex; align-items: center; gap: 9px; padding: 6px 12px 6px 6px; text-align: left; color: #202020; background: #fff; border: 1px solid #d8d9dd; border-radius: 999px; cursor: pointer; }
.who-chip:hover { border-color: #b9babf; }
.who-chip:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }
.who-chip b { display: block; font-size: 11px; line-height: 1.2; }
.who-chip small { display: block; color: #85878d; font-size: 9.5px; line-height: 1.2; }
.who-avatar { display: grid; width: 28px; height: 28px; flex: 0 0 auto; place-items: center; color: #fff; font-size: 10px; font-weight: 800; background: #9a9ba0; border-radius: 50%; }
.who-chip.active { background: #fff4f4; border-color: var(--red); box-shadow: 0 0 0 1px var(--red) inset; }
.who-chip.active .who-avatar { background: var(--red); }
.who-all { display: inline-flex; align-items: center; gap: 7px; margin-left: auto; color: #55575d; font-size: 11px; cursor: pointer; }
.who-all input { width: 15px; height: 15px; accent-color: var(--red); }
.who-warn { margin: 0; padding: 10px 20px; color: #7a5200; font-size: 11px; background: #fff8e6; border-bottom: 1px solid #f1dfae; }
.who-error { align-items: flex-start; background: #fff4f4; }
.who-error > div { flex: 1; min-width: 200px; }
.who-error b { display: block; color: #8f1f1f; font-size: 12px; }
.who-error p { margin: 3px 0 0; color: #6b3a3a; font-size: 11px; }
.who-icon { display: grid; width: 22px; height: 22px; flex: 0 0 auto; place-items: center; color: #fff; font-size: 13px; font-weight: 800; background: var(--red); border-radius: 50%; }
@media (max-width: 640px) {
  .who-bar { padding: 12px 14px; }
  .who-chips { flex-wrap: nowrap; overflow-x: auto; width: 100%; padding-bottom: 2px; scrollbar-width: thin; }
  .who-chip { flex: 0 0 auto; }
  .who-all { margin-left: 0; }
}

/* Booking links (staff only) */
.links-card{padding:18px 20px}
.links-card h3{margin:22px 0 8px;font-size:15px}
.links-card code{font-size:11px;word-break:break-all}
.links-search{margin:12px 0 4px;max-width:360px}
.link-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid #eceef1}
.link-row[hidden]{display:none}
.link-row>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.link-row small{color:#777980;font-size:11px}
.link-row code{color:#55575e}
.link-row button{flex:none}
@media (max-width:600px){.link-row{flex-direction:column;align-items:stretch}}

/* Search boxes (class calendar, events) */
.calendar-filters .cal-search{grid-column:1/-1}
.cal-search input[type=search],.events-search input{width:100%;font-size:12px}
.events-search{flex:1;max-width:340px}
.events-search input{min-height:32px;padding:7px 13px;color:#2a2b2f;background:#fff;border:1px solid #d8d9dd;border-radius:16px}
@media(max-width:760px){.events-search{max-width:none;width:100%}}

/* Request Info question box; Create Account parent/guardian note */
.info-form textarea{width:100%;padding:11px;border:1px solid #d8d9dd;border-radius:6px;background:#fff;resize:vertical;font-weight:400;line-height:1.5}
.info-form label .tiny{font-weight:400}
.signup-guardian{margin:0 0 12px;padding:12px 14px;color:#4a2323;font-size:11px;line-height:1.55;background:#fdf1f1;border:1px solid #f1caca;border-left:3px solid var(--red);border-radius:6px}
.signup-guardian b{display:block;margin-bottom:3px;color:#2a1414}

/* Monthly Membership: "who is it for?" */
.monthly-pick{margin:4px 0 14px;padding:12px 14px;background:#f6f7f8;border:1px solid #e3e4e7;border-left:3px solid var(--red);border-radius:6px}
.monthly-pick label{display:flex;flex-direction:column;gap:7px;margin:0 0 6px;font-weight:700}
.monthly-pick .tiny{margin:0;color:#66686e;line-height:1.5}