:root {
    --forest: #245744;
    --leaf: #6e8b3d;
    --ink: #202a27;
    --muted: #53605b;
    --mist: #f3f7f5;
    --sky: #e7f0f4;
    --line: #d7e0dc;
    --warning: #fff4e5;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: #fff; font-family: "Segoe UI", Arial, sans-serif; }
a { color: inherit; }
.site-header { position: sticky; z-index: 20; top: 0; height: 68px; padding: 0 40px; display: flex; align-items: center; gap: 30px; background: rgba(255,255,255,.97); border-bottom: 1px solid rgba(215,224,220,.8); }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--forest); font-size: 21px; font-weight: 750; text-decoration: none; }
.brand-mark { display: grid; place-items: center; width: 28px; height: 28px; border: 2px solid var(--forest); border-radius: 50%; }
.brand-logo { width:36px; height:36px; object-fit:contain; border-radius:6px; flex:none; }
nav { display: flex; gap: 28px; margin-left: auto; }
nav a { color: var(--forest); text-decoration: none; }
nav a:hover { text-decoration: underline; text-underline-offset: 5px; }
.account-link { min-height: 42px; padding: 0 18px; display: inline-flex; align-items: center; gap: 9px; color: #fff; background: var(--forest); border-radius: 6px; font-weight: 650; text-decoration: none; }
.hero { position: relative; min-height: min(660px, 72vh); display: flex; align-items: center; background-image: url('/images/healthmassage-hero.png'); background-position: center; background-size: cover; }
.hero-inner { position: relative; z-index: 1; width: min(1180px, calc(100% - 96px)); margin: auto; }
.hero-inner > * { max-width: 550px; }
.eyebrow, .category { color: var(--forest); font-size: 13px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }
h1 { margin: 14px 0 20px; font-size: 56px; line-height: 1.06; letter-spacing: 0; }
.hero-copy { margin: 0 0 28px; font-size: 18px; line-height: 1.6; color: #38423f; }
.hero-actions, .contact-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.button { min-height: 46px; padding: 0 20px; display: inline-flex; align-items: center; justify-content: center; border-radius: 6px; font-weight: 650; text-decoration: none; }
.primary { color: #fff; background: var(--forest); }
.secondary, .hours { min-height: 42px; padding: 0 18px; display: inline-flex; align-items: center; border: 1px solid #8ba097; border-radius: 6px; color: var(--forest); background: rgba(255,255,255,.65); }
.status-band { padding: 14px 24px; text-align: center; background: var(--warning); color: #614b27; }
.section { padding: 72px 48px; scroll-margin-top: 68px; }
.section-inner { width: min(1180px, 100%); margin: auto; }
h2 { margin: 0 0 10px; font-size: 36px; line-height: 1.15; }
.section-lead { max-width: 680px; margin: 0 0 34px; color: var(--muted); font-size: 17px; line-height: 1.55; }
.services-section { background: #fff; }
.promotions-section { background: var(--mist); }
.contact-section { background: var(--sky); }
.service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.service-card { min-height: 220px; display: grid; grid-template-columns: 112px minmax(0, 1fr); overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.service-media { display: grid; place-items: center; min-height: 220px; color: var(--forest); background: var(--sky); font-size: 40px; }
.service-media img { width: 100%; height: 100%; object-fit: cover; }
.service-content { min-width: 0; padding: 18px; display: flex; flex-direction: column; }
.service-content h3, .promotion-card h3 { margin: 6px 0 8px; font-size: 20px; line-height: 1.3; }
.category { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--leaf); font-size: 11px; }
.service-description { display: -webkit-box; margin: 0 0 16px; overflow: hidden; color: var(--muted); line-height: 1.5; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.service-meta { display: flex; align-items: center; gap: 12px; margin-top: auto; color: var(--muted); font-size: 14px; }
.service-meta strong { margin-left: auto; color: var(--forest); white-space: nowrap; }
.promotion-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.promotion-card { padding: 22px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.promotion-card p { min-height: 48px; color: var(--muted); line-height: 1.5; }
.promotion-card strong { color: var(--forest); }
.offer-icon { display: grid; place-items: center; width: 34px; height: 34px; color: #fff; background: var(--leaf); border-radius: 50%; font-weight: 800; }
.empty-state { padding: 22px 0; color: var(--muted); }
footer { padding: 28px 24px; text-align: center; color: rgba(255,255,255,.75); background: var(--ink); }
.auth-page { min-height: 100vh; display: grid; grid-template-columns: minmax(360px, 520px) 1fr; }
.auth-panel { padding: 54px clamp(28px, 6vw, 72px); display: flex; flex-direction: column; justify-content: center; }
.auth-brand { margin-bottom: 64px; }
.auth-panel h1, .account-page h1, .page-heading h1 { margin: 0 0 12px; font-size: 40px; line-height: 1.15; }
.auth-panel > p { margin: 0 0 28px; color: var(--muted); line-height: 1.5; }
.auth-form { display: grid; gap: 8px; }
.auth-form label { margin-top: 8px; font-weight: 650; }
.auth-form input[type="text"], .auth-form input[type="password"], .auth-form input[type="tel"] { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid #9eaca6; border-radius: 6px; font: inherit; }
.check-row { display: flex; align-items: center; gap: 8px; margin: 8px 0 14px !important; font-weight: 400 !important; }
.check-row input { width: 18px; height: 18px; accent-color: var(--forest); }
.auth-form .button { border: 0; font: inherit; cursor: pointer; }
.form-error, .field-error { color: #9e2b25; }
.form-error { padding: 10px 12px; border-left: 3px solid #9e2b25; background: #fff0ef; }
.field-error { min-height: 18px; font-size: 13px; }
.back-link { margin-top: 24px; color: var(--forest); }
.auth-switch { margin:20px 0 0 !important; }.auth-switch a { color:var(--forest);font-weight:700; }
.auth-image { background: url('/images/healthmassage-hero.png') center/cover no-repeat; }
.dashboard-header { height: 68px; padding: 0 28px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); background: #fff; }
.dashboard-user { display: flex; align-items: center; gap: 14px; }
.icon-button { width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 6px; background: #fff; cursor: pointer; }
.dashboard-shell { min-height: calc(100vh - 68px); display: grid; grid-template-columns: 220px minmax(0, 1fr); background: #f7f9f8; }
.dashboard-nav { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 28px 18px; border-right: 1px solid var(--line); background: #fff; }
.dashboard-nav a, .dashboard-nav span { padding: 11px 12px; color: var(--muted); border-radius: 6px; text-decoration: none; }
.dashboard-nav a.active { color: #fff; background: var(--forest); }
.dashboard-nav span { color: #9ba49f; cursor: not-allowed; }
.dashboard-content { min-width: 0; padding: 42px; }
.page-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 28px; }
.page-heading .eyebrow, .account-page > .eyebrow { margin: 0 0 8px; }
.metric-grid, .account-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.metric-grid article, .account-summary > div { min-height: 126px; padding: 20px; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.metric-grid span, .account-summary span { color: var(--muted); }
.metric-grid strong, .account-summary strong { color: var(--forest); font-size: 28px; }
.dashboard-section { margin-top: 32px; padding-top: 26px; border-top: 1px solid var(--line); }
.dashboard-section h2 { font-size: 24px; }
.quick-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.quick-actions a { padding: 12px 16px; color: var(--forest); border: 1px solid #9eaca6; border-radius: 6px; background: #fff; text-decoration: none; }
.account-page { width: min(1100px, calc(100% - 40px)); margin: auto; padding: 56px 0 80px; }
.account-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 32px; }
.order-list { border-top: 1px solid var(--line); }
.order-list article { padding: 16px 4px; display: flex; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); }
.order-list article div { display: flex; flex-direction: column; gap: 5px; }
.order-list span { color: var(--muted); }
.simple-message { width: min(620px, calc(100% - 40px)); margin: 18vh auto; text-align: center; }

.admin-body { background: #f4f7f5; }
.admin-body * { transition-timing-function: cubic-bezier(.22,1,.36,1); }
.role-chip { padding: 5px 9px; border: 1px solid #b9ccc3; border-radius: 6px; color: var(--forest); font-size: 12px; font-weight: 700; }
.switch-account { color:var(--forest);font-size:13px;font-weight:650;text-underline-offset:4px; }
.nav-spacer { flex: 1; min-height: 24px; }
.page-description { margin: 0; color: var(--muted); }
.notice { margin-bottom: 20px; padding: 13px 16px; border-left: 3px solid; border-radius: 4px; animation: notice-in .38s cubic-bezier(.22,1,.36,1); transition: opacity .3s, transform .3s; }
.notice.notice-leave { opacity:0; transform:translateY(-8px); pointer-events:none; }
.notice.success { color: #18543b; background: #e8f5ee; border-color: #2c805b; }
.notice.error { color: #842d28; background: #fff0ef; border-color: #b6453e; }
.admin-form { max-width: 940px; display: grid; gap: 18px; }
.form-section, .data-panel { padding: 24px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.form-section h2, .panel-heading h2 { margin: 0; font-size: 21px; }
.form-section > h2 { margin-bottom: 20px; }
.form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.field { display: grid; align-content: start; gap: 7px; color: #34443e; font-size: 14px; font-weight: 650; }
.field-wide { grid-column: 1/-1; }
.field input, .field textarea, .field select { width: 100%; min-height: 43px; padding: 9px 11px; border: 1px solid #aab8b2; border-radius: 6px; color: var(--ink); background: #fff; font: inherit; font-weight: 400; }
.field textarea { resize: vertical; }
.field span { color: #9e2b25; font-size: 12px; }
.catalog-layout { display: grid; grid-template-columns: minmax(0,1fr); gap: 20px; align-items: start; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.panel-heading > span { color: var(--muted); font-size: 14px; }
.data-list { border-top: 1px solid var(--line); }
.data-row { min-height: 72px; display: grid; grid-template-columns: 42px minmax(150px,1fr) 110px 82px 38px 38px; gap: 12px; align-items: center; border-bottom: 1px solid var(--line); }
.service-thumb { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 6px; color: var(--forest); background: var(--sky); font-weight: 800; }
.service-thumb img { width:100%;height:100%;object-fit:cover;border-radius:6px; }
.row-main { min-width: 0; display: grid; gap: 4px; }.row-main span { overflow: hidden; color: var(--muted); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.row-price { text-align: right; color: var(--forest); font-weight: 750; white-space: nowrap; }
.status { font-size: 12px; font-weight: 700; }.status.on { color: #25704f; }.status.off { color: #7d8782; }
.row-action { display: grid; place-items: center; text-decoration: none; }.danger { color: #9e2b25; }
.compact-form { position: sticky; top: 20px; display: grid; gap: 14px; }.compact-form .form-grid { gap: 10px; }.compact-form .button { border: 0; cursor: pointer; }
.admin-modal { width:min(620px,calc(100% - 32px)); max-height:min(88vh,860px); padding:0; overflow:visible; border:0; border-radius:8px; background:transparent; opacity:0; transform:translateY(24px) scale(.98); transition:opacity .24s,transform .32s,overlay .32s allow-discrete,display .32s allow-discrete; }
.admin-modal[open] { opacity:1; transform:translateY(0) scale(1); }
.admin-modal::backdrop { background:rgba(18,32,27,.46); backdrop-filter:blur(3px); opacity:0; transition:opacity .25s,overlay .25s allow-discrete,display .25s allow-discrete; }.admin-modal[open]::backdrop { opacity:1; }
.modal-shell { position:relative; max-height:min(88vh,860px); overflow:auto; border-radius:8px; box-shadow:0 30px 90px rgba(27,55,44,.2); }.modal-shell .compact-form { position:static; margin:0; border:0; border-radius:8px; padding:28px; }.modal-close { position:absolute; z-index:2; top:18px; right:18px; width:36px;height:36px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);font-size:25px;line-height:1;cursor:pointer; }.modal-close:hover { color:#fff;background:var(--forest);transform:rotate(4deg); }
.category-modal-form { padding:28px; display:grid; grid-template-columns:1fr; gap:14px; background:#fff; }.category-modal-form h2 { margin:0 0 6px; }.category-modal-form .button { border:0; }.secondary-action { min-height:40px;border:1px solid #9eaca6;background:#fff;color:var(--forest);cursor:pointer; }
.upload-field input[type="file"] { padding:8px;background:#f7faf8;cursor:pointer; }.upload-field small { color:var(--muted);font-weight:400; }.upload-preview { width:100%;margin-top:4px;object-fit:cover;border:1px solid var(--line);border-radius:6px;background:#eef3f0; }.logo-preview { width:110px;height:110px;object-fit:contain; }.cover-preview { max-height:220px;aspect-ratio:16/7; }.service-preview { max-height:220px;aspect-ratio:4/3; }
.data-row,.order-admin-list article,.customer-list article,.promotion-admin-list article { animation:row-in .42s both; transition:background-color .2s,transform .2s; }.data-row:hover,.order-admin-list article:hover,.customer-list article:hover,.promotion-admin-list article:hover { background:#f7faf8; transform:translateX(3px); }
.button,.icon-button,.small-action { transition:transform .18s,background-color .18s,color .18s,border-color .18s; }.button:active,.icon-button:active,.small-action:active { transform:scale(.97); }
@keyframes row-in { from { opacity:0;transform:translateY(8px); } to { opacity:1;transform:none; } }
@keyframes notice-in { from { opacity:0;transform:translateY(-8px); } to { opacity:1;transform:none; } }
@starting-style { .admin-modal[open] { opacity:0;transform:translateY(24px) scale(.98); }.admin-modal[open]::backdrop { opacity:0; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important; } }
.admin-empty { min-height: 180px; display: grid; place-content: center; gap: 7px; text-align: center; color: var(--muted); }.admin-empty strong { color: var(--ink); }
.category-manager { margin-top: 20px; }.inline-form { display: grid; grid-template-columns: 1fr 1.5fr 100px auto; gap: 12px; align-items: end; }.inline-form .button { border: 0; }
.category-list { margin-top: 20px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }.category-list > div { padding: 12px; display: flex; justify-content: space-between; align-items: center; border: 1px solid var(--line); border-radius: 6px; }.category-list span { display: grid; gap: 4px; }.category-list small { color: var(--muted); }
.order-admin-list,.customer-list,.promotion-admin-list { display:grid; gap:0; border-top:1px solid var(--line); }
.order-admin-list article { padding:15px 0; display:grid; grid-template-columns:minmax(150px,1fr) 110px 100px 72px; gap:14px; align-items:center; border-bottom:1px solid var(--line); }
.order-code-link { color:var(--admin-dark);text-decoration:none; }.order-code-link:hover { text-decoration:underline;text-underline-offset:4px; }.view-action { display:grid;place-items:center;color:var(--forest);text-decoration:none;font-size:12px;font-weight:700; }
.order-filters { margin-bottom:16px;display:flex;gap:6px;overflow-x:auto; }.order-filters a { flex:none;padding:8px 12px;border:1px solid #d6e0dc;border-radius:6px;color:var(--muted);background:#fff;text-decoration:none;font-size:12px;font-weight:700; }.order-filters a.active { color:#fff;border-color:var(--admin-dark);background:var(--admin-dark); }
.order-detail-panel { margin-bottom:18px;padding:24px;border:1px solid #cfdcd6;border-radius:8px;background:#fff;box-shadow:0 12px 34px rgba(25,55,44,.06);animation:row-in .35s both; }.order-detail-head { padding-bottom:18px;display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid #e1e8e4; }.order-detail-head a { color:var(--forest);font-size:12px;font-weight:700; }.order-detail-head h2 { margin:9px 0 4px;font-size:25px; }.order-detail-head>div>span { color:var(--muted);font-size:12px; }.order-detail-grid { padding-top:20px;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr);gap:34px; }.order-lines h3 { margin:0 0 10px;font-size:14px; }.order-lines>div { padding:13px 0;display:flex;justify-content:space-between;gap:20px;border-top:1px solid #e5ebe8; }.order-lines span { display:grid;gap:4px; }.order-lines small { color:var(--muted); }.order-detail-grid aside { padding:18px;border-radius:7px;background:#f4f7f5; }.order-detail-grid dl { margin:0;display:grid;gap:11px; }.order-detail-grid dl>div { display:flex;justify-content:space-between;gap:16px; }.order-detail-grid dt { color:var(--muted);font-size:13px; }.order-detail-grid dd { margin:0;text-align:right;font-weight:700; }.order-detail-grid .grand-total { padding-top:12px;border-top:1px solid #d7e1dc; }.grand-total dd { color:var(--forest);font-size:20px; }.order-note { padding-top:13px;display:grid;gap:5px;border-top:1px solid #d7e1dc;color:var(--muted);font-size:13px;line-height:1.45; }.detail-actions { margin-top:16px;display:grid;gap:8px; }.detail-actions form { display:flex;gap:8px; }.detail-actions .button { flex:1;border:0;cursor:pointer; }.detail-actions select { min-height:42px;border:1px solid #aab8b2;border-radius:6px;background:#fff; }.danger-outline { color:#9b392d!important;border:1px solid #d8aaa2!important;background:#fff!important; }
.order-admin-list article>div:first-child,.customer-list article>div:not(.avatar),.promotion-admin-list article>div { display:grid; gap:4px; }.order-admin-list span,.customer-list span,.promotion-admin-list span { color:var(--muted); font-size:13px; }
.row-actions { display:flex; justify-content:flex-end; gap:6px; }.row-actions form { display:flex; gap:6px; }.row-actions select,.small-action { min-height:34px; border:1px solid #aab8b2; border-radius:6px; background:#fff; }.small-action { padding:0 10px; color:var(--forest); cursor:pointer; }
.service-picker { max-height:260px; overflow:auto; border-top:1px solid var(--line); }.service-picker>div { padding:9px 0; display:grid; grid-template-columns:1fr 58px; align-items:center; border-bottom:1px solid var(--line); }.service-picker span { display:grid; gap:2px; }.service-picker small { color:var(--muted); }.service-picker input { width:54px; min-height:36px; padding:5px; border:1px solid #aab8b2; border-radius:6px; }
.search-bar { margin-bottom:16px; display:flex; max-width:520px; }.search-bar input { flex:1; min-height:43px; padding:9px 12px; border:1px solid #aab8b2; border-radius:6px 0 0 6px; font:inherit; }.search-bar button { padding:0 16px; border:0; border-radius:0 6px 6px 0; color:#fff; background:var(--forest); }
.customer-list article { padding:13px 0; display:grid; grid-template-columns:42px minmax(150px,1fr) 150px 62px 38px; gap:12px; align-items:center; border-bottom:1px solid var(--line); }.avatar { width:38px;height:38px;display:grid;place-items:center;border-radius:50%;color:#fff;background:var(--forest);font-weight:800; }.point-action { display:grid;place-items:center;color:var(--forest);text-decoration:none;font-size:12px;font-weight:700; }
.point-customer-panel { margin-bottom:14px;padding:22px;display:grid;grid-template-columns:1fr auto auto;gap:24px;align-items:center;border-radius:8px;color:#fff;background:var(--admin-dark); }.point-customer-panel>div { display:grid;gap:4px; }.point-customer-panel a:first-child { color:#bcd2c9;font-size:12px; }.point-customer-panel h2 { margin:4px 0 0;font-size:23px; }.point-customer-panel span { color:#bcd2c9;font-size:13px; }.point-customer-panel>strong { font-size:28px; }.point-customer-panel>strong small { font-size:12px;font-weight:500; }.point-customer-panel .button { background:#fff;color:var(--admin-dark); }.point-history { margin-bottom:16px; }.point-history article { padding:12px 0;display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;border-top:1px solid #e3eae6; }.point-history article>div { display:grid;gap:3px; }.point-history small { color:var(--muted); }
.promotion-admin-list article { padding:14px 0;display:grid;grid-template-columns:minmax(180px,1fr) 80px 38px 38px;gap:12px;align-items:center;border-bottom:1px solid var(--line); }
.service-scope { max-height:180px; margin:0; padding:12px; display:grid; gap:8px; overflow:auto; border:1px solid var(--line); border-radius:6px; }.service-scope legend { padding:0 5px; font-size:14px; font-weight:700; }.service-scope small { color:var(--muted); }.service-scope label { display:flex; align-items:center; gap:7px; font-size:13px; }.service-scope input { accent-color:var(--forest); }
.loyalty-settings,.tier-section { max-width:1100px;margin-bottom:20px; }.loyalty-settings .button,.tier-section .button { border:0; }.toggle-stack { display:grid;align-content:center; }.tier-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px; }.tier-grid article { padding:16px;display:grid;gap:12px;border:1px solid var(--line);border-radius:6px;background:#f8faf9; }

@media (max-width: 980px) {
    .site-header { padding: 0 22px; }
    nav { display: none; }
    .account-link { margin-left: auto; }
    .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .promotion-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hero { min-height: min(580px, 72vh); background-position: 58% center; }
    .hero-inner { width: calc(100% - 44px); }
    h1 { font-size: 42px; }
    .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .catalog-layout { grid-template-columns: 1fr; }.compact-form { position: static; }.category-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .tier-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.order-admin-list article { grid-template-columns:minmax(150px,1fr) 100px; }.row-actions { grid-column:1/-1;justify-content:flex-start; }
}

@media (max-width: 620px) {
    .site-header { gap: 12px; padding: 0 18px; }
    .brand { font-size: 19px; }
    .account-link { width: 42px; padding: 0; justify-content: center; }
    .account-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .hero { min-height: min(560px, 68vh); background-position: 63% center; }
    .hero::before { content: ""; position: absolute; inset: 68px 0 auto; height: min(560px, 68vh); background: rgba(255,255,255,.6); }
    .hero-inner { position: relative; }
    h1 { font-size: 39px; }
    .hero-copy { font-size: 16px; }
    .section { padding: 60px 20px; }
    h2 { font-size: 32px; }
    .service-grid, .promotion-grid { grid-template-columns: 1fr; }
    .service-card { grid-template-columns: 100px minmax(0, 1fr); }
    .auth-page { grid-template-columns: 1fr; }
    .auth-image { display: none; }
    .auth-panel { padding: 36px 24px; }
    .auth-brand { margin-bottom: 52px; }
    .dashboard-shell { grid-template-columns: 1fr; }
    .dashboard-nav { flex-direction: row; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--line); }
    .dashboard-content { padding: 30px 20px; }
    .dashboard-user > span { display: none; }
    .metric-grid, .account-summary { grid-template-columns: 1fr; }
    .dashboard-header { padding: 0 16px; }.dashboard-user strong,.role-chip,.switch-account { display: none; }.dashboard-nav { padding: 10px 14px; }.dashboard-nav .nav-spacer { display: none; }
    .page-heading { align-items: start; gap: 18px; }.page-heading h1 { font-size: 32px; }.page-heading .button { min-width: max-content; }
    .form-grid,.category-list { grid-template-columns: 1fr; }.field-wide { grid-column: auto; }.inline-form { grid-template-columns: 1fr; }.data-panel { padding: 16px; }
    .data-row { grid-template-columns: 38px minmax(110px,1fr) 38px 38px; }.row-price { grid-column: 2; grid-row: 2; text-align: left; }.status { grid-column: 1; grid-row: 2; }.data-row .row-action { grid-column: 3; grid-row: 1/-1; }.data-row form { grid-column: 4; grid-row: 1/-1; }
    .tier-grid { grid-template-columns:1fr; }.customer-list article { grid-template-columns:38px minmax(120px,1fr) 38px; }.customer-list article>div:nth-child(3){grid-column:2;}.promotion-admin-list article{grid-template-columns:minmax(130px,1fr) 38px 38px}.promotion-admin-list .status{grid-column:1;grid-row:2}.order-admin-list article{grid-template-columns:1fr}.row-actions{grid-column:auto;flex-wrap:wrap}
}

/* Customer account additions */
.customer-brand>img { width:40px;height:40px;object-fit:contain;border-radius:7px; }
.account-notice { margin-bottom:16px; }
.profile-edit-button { margin-top:20px;padding:10px 14px;border:1px solid rgba(255,255,255,.35);border-radius:6px;color:#fff;background:transparent;font:inherit;font-size:13px;font-weight:700;cursor:pointer;transition:background .18s,transform .18s; }
.profile-edit-button:hover { background:rgba(255,255,255,.1); }.profile-edit-button:active { transform:translateY(1px); }
.customer-side-stack { display:grid;gap:16px;align-content:start; }.shop-contact dl { margin:4px 0 18px;display:grid; }.shop-contact dl>div { padding:12px 0;border-top:1px solid #e3eae6; }.shop-contact dt { margin-bottom:4px;color:var(--muted);font-size:11px;font-weight:700;text-transform:uppercase; }.shop-contact dd { margin:0;line-height:1.45; }.shop-contact a { color:var(--admin-dark);font-weight:700; }.contact-actions { display:flex;gap:8px;flex-wrap:wrap; }.contact-actions a { padding:9px 11px;border:1px solid #cad8d1;border-radius:6px;text-decoration:none;font-size:12px; }
.order-state.inprogress { color:#315f7b!important;background:#e7f0f5; }.order-state.cancelled { color:#7a5145!important;background:#f5ece8; }.order-state.draft { color:#755b20!important;background:#f8f0d9; }
.profile-dialog { width:min(520px,calc(100% - 28px));padding:0;border:0;border-radius:8px;background:#fff;box-shadow:0 28px 80px rgba(15,46,38,.28); }.profile-dialog::backdrop { background:rgba(10,30,24,.58);backdrop-filter:blur(3px); }.profile-dialog[open] { animation:dialog-in .2s ease-out; }.profile-form { padding:26px;display:grid;gap:17px; }.dialog-heading { display:flex;align-items:flex-start;justify-content:space-between;gap:20px; }.dialog-heading span { color:var(--accent);font-size:10px;font-weight:800;letter-spacing:1.2px; }.dialog-heading h2 { margin:5px 0 0;font-size:24px; }.dialog-heading .icon-button { color:#53645d;background:#edf2f0; }.dialog-actions { margin-top:4px;display:flex;justify-content:flex-end;gap:9px; }.dialog-actions .button { min-width:112px; }.field>span { color:#a13f31;font-size:12px; }.profile-form .field { gap:7px; }
@keyframes dialog-in { from { opacity:0;transform:translateY(10px) scale(.985); } to { opacity:1;transform:none; } }
@media(prefers-reduced-motion:reduce){.profile-dialog[open]{animation:none}.profile-edit-button{transition:none}}

/* Owner and member workspaces */
:root { --admin-bg:#f2f5f4; --admin-dark:#163c31; --admin-dark-2:#0f2e26; --accent:#d86b4b; --blue:#3d6f91; --surface:#ffffff; }
.admin-body { min-height:100vh; background:var(--admin-bg); font-family:"Segoe UI Variable","Segoe UI",sans-serif; }
.admin-app { min-height:100vh; display:grid; grid-template-columns:252px minmax(0,1fr); }
.admin-sidebar { position:sticky;top:0;height:100vh;padding:24px 16px 18px;display:flex;flex-direction:column;color:#eaf3ef;background:var(--admin-dark-2); }
.admin-brand { padding:0 10px 24px;display:flex;align-items:center;gap:11px;color:inherit;text-decoration:none; }.admin-brand>span { width:40px;height:40px;display:grid;place-items:center;border-radius:8px;color:var(--admin-dark-2);background:#e9f2ee;font-size:19px;font-weight:900; }.admin-brand>div,.sidebar-profile>div,.customer-user>div { min-width:0;display:grid;gap:2px; }.admin-brand strong { font-size:17px; }.admin-brand small,.sidebar-profile small { color:#91afa4;font-size:11px;letter-spacing:0; }
.admin-nav { display:flex;flex-direction:column;gap:3px;margin:0; }.admin-nav p { margin:22px 12px 7px;color:#73978a;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:1.4px; }.admin-nav a { min-height:43px;padding:0 12px;display:flex;align-items:center;gap:11px;border-radius:7px;color:#bdd0c9;text-decoration:none;font-size:14px;font-weight:600;transition:background .2s,color .2s,transform .2s; }.admin-nav a:hover { color:#fff;background:rgba(255,255,255,.07);transform:translateX(2px); }.admin-nav a.active { color:#173c31;background:#f2f6f4;box-shadow:0 8px 24px rgba(0,0,0,.12); }.nav-glyph { width:22px;color:#71978a;font:700 10px/1 "Segoe UI"; }.admin-nav a.active .nav-glyph { color:var(--accent); }
.sidebar-profile { margin-top:auto;padding:15px 10px 2px;display:flex;align-items:center;gap:10px;border-top:1px solid rgba(255,255,255,.1); }.sidebar-profile strong { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px; }.profile-avatar { flex:none;width:36px;height:36px;display:grid;place-items:center;border-radius:50%;color:#fff;background:var(--accent);font-weight:800; }
.admin-workspace { min-width:0; }.admin-topbar { height:72px;padding:0 clamp(24px,3vw,44px);display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.92);border-bottom:1px solid #dde5e1; }.admin-topbar>div:first-child { display:grid;gap:2px; }.admin-topbar strong { font-size:13px; }.admin-topbar span { color:#718079;font-size:12px; }.topbar-actions { display:flex;align-items:center;gap:9px; }.topbar-actions>a { padding:9px 11px;border-radius:6px;color:#41534c;text-decoration:none;font-size:13px;font-weight:650; }.topbar-actions>a:hover { background:#edf3f0; }
.dashboard-content { width:min(1480px,100%);margin:0 auto;padding:38px clamp(24px,3vw,48px) 64px; }.page-heading { align-items:center;margin-bottom:26px; }.page-heading h1 { font-size:34px;letter-spacing:0; }.page-heading .eyebrow { margin-bottom:7px;color:var(--accent);font-size:10px;letter-spacing:1.4px; }.page-description { font-size:14px; }.button.primary { border:0;background:var(--admin-dark);box-shadow:0 8px 22px rgba(22,60,49,.16); }.button.primary:hover { background:#225b49;transform:translateY(-1px); }
.owner-metrics { grid-template-columns:1.25fr repeat(3,1fr);gap:13px; }.owner-metrics article,.metric-grid article { min-height:148px;padding:21px;border:1px solid #dfe7e3;background:#fff;box-shadow:0 8px 26px rgba(25,55,44,.045); }.owner-metrics article span { font-size:13px;font-weight:650; }.owner-metrics article strong { font-size:29px;letter-spacing:0; }.owner-metrics article small { color:#84918c;font-size:12px; }.owner-metrics .metric-primary { color:#fff;border-color:var(--admin-dark);background:var(--admin-dark); }.owner-metrics .metric-primary span,.owner-metrics .metric-primary small,.owner-metrics .metric-primary strong { color:inherit; }.owner-metrics .metric-primary small { opacity:.7; }
.dashboard-columns { margin-top:18px;display:grid;grid-template-columns:1.25fr 1fr;gap:18px; }.dashboard-panel { min-height:320px;padding:24px;border:1px solid #dfe7e3;border-radius:8px;background:#fff;box-shadow:0 8px 28px rgba(25,55,44,.045); }.dashboard-panel .panel-heading>div { display:grid;gap:4px; }.dashboard-panel .panel-heading a { color:var(--forest);font-size:13px;font-weight:700; }.top-service-list { display:grid; }.top-service-list article { padding:15px 0;display:grid;grid-template-columns:34px 1fr auto;gap:12px;align-items:center;border-top:1px solid #e5ebe8; }.rank { width:28px;height:28px;display:grid;place-items:center;border-radius:6px;color:var(--forest);background:#eaf2ee;font-weight:800;font-size:12px; }.top-service-list article>div { display:grid;gap:3px; }.top-service-list small { color:var(--muted); }.action-grid { display:grid;grid-template-columns:1fr 1fr;gap:10px; }.action-grid a { min-height:104px;padding:16px;display:flex;flex-direction:column;justify-content:flex-end;gap:5px;border:1px solid #dfe7e3;border-radius:7px;color:var(--ink);background:#f8faf9;text-decoration:none;transition:transform .2s,border-color .2s,background .2s; }.action-grid a:hover { transform:translateY(-2px);border-color:#91ab9f;background:#fff; }.action-grid span { color:var(--muted);font-size:12px;line-height:1.4; }.compact-empty { min-height:210px; }
.form-section,.data-panel { border-color:#dfe7e3;box-shadow:0 8px 28px rgba(25,55,44,.04); }.field input,.field textarea,.field select { border-color:#c7d2cd;background:#fbfcfc;transition:border-color .18s,box-shadow .18s,background .18s; }.field input:focus,.field textarea:focus,.field select:focus { outline:0;border-color:#397561;background:#fff;box-shadow:0 0 0 3px rgba(57,117,97,.12); }.status { padding:5px 7px;border-radius:5px;text-align:center; }.status.on,.status.completed { color:#1d694d;background:#e7f4ed; }.status.off,.status.cancelled { color:#7a5145;background:#f5ece8; }.status.inprogress { color:#315f7b;background:#e7f0f5; }.status.draft { color:#755b20;background:#f8f0d9; }

.customer-body { min-height:100vh;color:#20322c;background:#f1f5f3;font-family:"Segoe UI Variable","Segoe UI",sans-serif; }.customer-header { height:76px;padding:0 max(24px,calc((100vw - 1240px)/2));display:flex;align-items:center;border-bottom:1px solid #dce6e1;background:rgba(255,255,255,.94); }.customer-brand { padding:0;color:var(--admin-dark); }.customer-brand>span { color:#fff;background:var(--admin-dark); }.customer-header nav { margin:auto;display:flex;gap:6px; }.customer-header nav a { padding:10px 14px;border-radius:6px;color:#607069;text-decoration:none;font-size:14px;font-weight:650; }.customer-header nav a.active,.customer-header nav a:hover { color:var(--admin-dark);background:#edf3f0;text-decoration:none; }.customer-user { display:flex;align-items:center;gap:10px; }.customer-user strong { font-size:13px; }.customer-user small { color:var(--muted);font-size:11px; }
.customer-shell { width:min(1240px,calc(100% - 48px));margin:auto;padding:36px 0 72px; }.member-hero { min-height:220px;padding:34px 38px;display:grid;grid-template-columns:1fr 310px;gap:32px;align-items:center;border-radius:8px;color:#fff;background:var(--admin-dark);overflow:hidden;position:relative; }.member-hero:after { content:"H";position:absolute;right:340px;bottom:-75px;color:rgba(255,255,255,.04);font-size:250px;font-weight:900; }.member-hero h1 { margin:8px 0 12px;font-size:36px; }.member-hero p { max-width:620px;margin:0;color:#c9ddd5;line-height:1.55; }.member-hero .eyebrow { color:#ffae92; }.member-card { min-height:150px;padding:22px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid rgba(255,255,255,.16);border-radius:8px;background:rgba(255,255,255,.08); }.member-card span,.member-card small { color:#c9ddd5; }.member-card strong { font-size:36px; }
.customer-metrics { margin:16px 0;display:grid;grid-template-columns:1fr 1fr 1.4fr;gap:14px; }.customer-metrics article { min-height:130px;padding:20px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid #dce5e1;border-radius:8px;background:#fff;box-shadow:0 8px 26px rgba(25,55,44,.04); }.customer-metrics span,.customer-metrics small { color:var(--muted);font-size:13px; }.customer-metrics strong { color:var(--admin-dark);font-size:27px; }.progress-track { height:7px;overflow:hidden;border-radius:4px;background:#e4ebe7; }.progress-track i { display:block;height:100%;border-radius:inherit;background:var(--accent); }
.customer-columns { display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.65fr);gap:16px; }.customer-panel { padding:24px;border:1px solid #dce5e1;border-radius:8px;background:#fff;box-shadow:0 8px 26px rgba(25,55,44,.04); }.customer-panel .panel-heading>div { display:grid;gap:4px; }.customer-panel h2 { font-size:21px; }.customer-order-list { border-top:1px solid #e3eae6; }.customer-order-list details { border-bottom:1px solid #e3eae6; }.customer-order-list summary { padding:17px 2px;display:grid;grid-template-columns:1fr auto 110px;gap:14px;align-items:center;cursor:pointer;list-style:none; }.customer-order-list summary::-webkit-details-marker { display:none; }.customer-order-list summary>div { display:grid;gap:4px; }.customer-order-list summary span { color:var(--muted);font-size:12px; }.order-state { padding:5px 7px;border-radius:5px;background:#e9f3ee;color:#28684f!important;font-weight:700; }.customer-order-list summary>strong { text-align:right; }.order-detail { padding:4px 12px 14px 18px;display:grid;gap:8px;border-left:2px solid #dbe7e1; }.order-detail div { display:flex;justify-content:space-between;color:var(--muted);font-size:13px; }
.point-list { display:grid; }.point-list article { padding:14px 0;display:flex;gap:11px;align-items:center;border-top:1px solid #e3eae6; }.point-sign { width:42px;height:34px;display:grid;place-items:center;border-radius:6px;font-size:12px;font-weight:800; }.point-sign.plus { color:#23684e;background:#e5f2eb; }.point-sign.minus { color:#8b4435;background:#f6e9e5; }.point-list article>div { display:grid;gap:3px; }.point-list small { color:var(--muted); }.account-empty { min-height:260px;display:grid;place-content:center;gap:7px;text-align:center;color:var(--muted); }.account-empty a { margin-top:8px;color:var(--forest);font-weight:700; }.account-empty.small { min-height:210px; }
.credential-notice { margin-bottom:18px;padding:20px 22px;display:grid;grid-template-columns:1fr auto;gap:14px 28px;border:1px solid #9cc6b4;border-radius:8px;background:#e9f5ef; }.credential-notice>div { display:grid;gap:5px; }.credential-notice span,.credential-notice small { color:#48675a;font-size:13px; }.credential-notice dl { margin:0;display:flex;gap:10px; }.credential-notice dl>div { min-width:150px;padding:9px 12px;border-radius:6px;background:#fff; }.credential-notice dt { color:var(--muted);font-size:10px;text-transform:uppercase;font-weight:800; }.credential-notice dd { margin:4px 0 0;font-weight:800; }.credential-notice code { color:#9b3f27;font-size:16px; }.credential-notice>small { grid-column:1/-1; }.form-hint { margin:0;padding:10px 12px;border-radius:6px;color:#466156;background:#edf4f1;font-size:12px;line-height:1.45; }

@media(max-width:1000px){.admin-app{grid-template-columns:210px minmax(0,1fr)}.owner-metrics{grid-template-columns:repeat(2,1fr)}.dashboard-columns{grid-template-columns:1fr}.customer-shell{width:min(100% - 32px,900px)}.member-hero{grid-template-columns:1fr 260px}.customer-columns{grid-template-columns:1fr}.customer-header{padding:0 18px}.customer-user>div{display:none}}
@media(max-width:700px){.admin-app{display:block}.admin-sidebar{position:static;width:100%;height:auto;padding:14px}.admin-brand{padding:0 4px 12px}.admin-nav{display:flex;flex-direction:row;overflow-x:auto;padding-bottom:2px}.admin-nav p,.sidebar-profile{display:none}.admin-nav a{flex:none}.nav-glyph{display:none}.admin-topbar{height:60px;padding:0 16px}.admin-topbar>div:first-child span,.topbar-actions>a{display:none}.dashboard-content{padding:24px 16px 48px}.owner-metrics{grid-template-columns:1fr}.dashboard-columns{grid-template-columns:1fr}.action-grid{grid-template-columns:1fr}.customer-header{height:64px}.customer-header nav{display:none}.customer-brand small,.customer-user>div{display:none}.customer-user{margin-left:auto}.customer-shell{width:calc(100% - 24px);padding:20px 0 48px}.member-hero{min-height:auto;padding:26px 22px;grid-template-columns:1fr}.member-hero h1{font-size:29px}.member-card{min-height:120px}.customer-metrics{grid-template-columns:1fr}.customer-panel{padding:18px}.customer-order-list summary{grid-template-columns:1fr auto}.customer-order-list summary>strong{grid-column:1;text-align:left}.page-heading{align-items:flex-start}.page-heading .button{flex:none}}
