:root{
  --ink:#11131a;--paper:#f4f5f8;--surface:#fff;--muted:#6f7480;--line:#dfe3eb;--blue:#4f6bff;--blue-soft:#e9edff;--green:#18a66a;--red:#c84b56;--amber:#bc7a11;--r:26px;--shadow:0 30px 80px rgba(26,37,72,.14)
}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:#edf0f7}body{margin:0;color:var(--ink);font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI Variable","Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button,a{tap-highlight-color:transparent;-webkit-tap-highlight-color:transparent}button{color:inherit}a{color:inherit;text-decoration:none}img,svg{display:block;max-width:100%}::selection{background:var(--blue);color:#fff}:focus-visible{outline:3px solid rgba(79,107,255,.45);outline-offset:3px}.mono{font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;letter-spacing:.07em}.skip-link{position:fixed;left:16px;top:12px;z-index:1000;background:#11131a;color:#fff;padding:10px 14px;border-radius:10px;transform:translateY(-180%);transition:.2s}.skip-link:focus{transform:none}

/* Desktop presentation */
.demo-shell{min-height:100dvh;display:grid;grid-template-columns:minmax(320px,.72fr) minmax(540px,1.28fr);background:#edf0f7}.demo-brief{padding:clamp(42px,6vw,96px);display:flex;flex-direction:column;justify-content:space-between;position:sticky;top:0;height:100dvh}.brief-brand{display:flex;align-items:center;gap:11px;font-weight:900;letter-spacing:-.04em}.brief-brand i{width:11px;height:11px;border-radius:3px;background:var(--blue)}.brief-copy{max-width:560px}.brief-kicker{font-size:.68rem;color:#777f8f;text-transform:uppercase;margin-bottom:22px}.brief-copy h1{font-size:clamp(4.4rem,8vw,8.4rem);line-height:.78;letter-spacing:-.085em;margin:0}.brief-copy h1 span{color:var(--blue)}.brief-copy p{max-width:45ch;font-size:1.06rem;line-height:1.8;color:#646a76;margin:30px 0 0}.brief-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.brief-link{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 18px;border-radius:14px;border:1px solid #cfd4de;font-weight:760;background:rgba(255,255,255,.5)}.brief-link.primary{background:var(--ink);color:#fff;border-color:var(--ink)}.brief-foot{display:flex;justify-content:space-between;gap:18px;color:#8a909b;font-size:.64rem;text-transform:uppercase}.device-stage{min-width:0;display:grid;place-items:center;padding:54px;background:linear-gradient(135deg,#dce5ff,#eef1f8 46%,#e9eeff)}.phone-shell{width:min(430px,100%);height:min(860px,calc(100dvh - 108px));min-height:650px;border:8px solid #11131a;border-radius:54px;background:var(--paper);overflow:hidden;box-shadow:var(--shadow);position:relative}.phone-shell:before{content:"";position:absolute;z-index:20;top:10px;left:50%;transform:translateX(-50%);width:105px;height:25px;border-radius:0 0 16px 16px;background:#11131a;pointer-events:none}.phone-viewport{height:100%;overflow:hidden;background:var(--paper)}

/* App shell */
.app{height:100%;display:flex;flex-direction:column;min-width:0}.app-top{height:72px;flex:0 0 auto;padding:27px 22px 11px;display:flex;align-items:center;justify-content:space-between;background:rgba(244,245,248,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(223,227,235,.85);position:relative;z-index:6}.app-logo{display:flex;align-items:center;gap:8px;font-weight:900;letter-spacing:-.04em}.app-logo i{width:8px;height:8px;border-radius:2px;background:var(--blue)}.app-context{font-size:.62rem;color:#868c97;text-transform:uppercase}.app-main{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:18px 18px 112px;scrollbar-width:none}.app-main::-webkit-scrollbar{display:none}.bottom-nav{position:absolute;z-index:8;left:12px;right:12px;bottom:12px;display:grid;grid-template-columns:repeat(4,1fr);gap:4px;padding:6px;background:rgba(255,255,255,.92);backdrop-filter:blur(18px);border:1px solid rgba(210,215,224,.9);border-radius:20px;box-shadow:0 12px 35px rgba(22,34,66,.12)}.bottom-nav button{border:0;background:transparent;border-radius:14px;padding:9px 4px 8px;cursor:pointer;color:#878d98;font-size:.72rem;display:grid;gap:3px}.bottom-nav button small{font-size:.54rem}.bottom-nav button.active{background:#11131a;color:#fff}.screen{animation:screenIn .28s ease both}@keyframes screenIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* Common */
.eyebrow{font-size:.62rem;color:#7d8490;text-transform:uppercase;margin-bottom:10px}.screen-title{font-size:2.25rem;line-height:.95;letter-spacing:-.065em;margin:0}.screen-sub{color:#6d7380;line-height:1.65;font-size:.9rem;margin:12px 0 0}.section-title{display:flex;align-items:end;justify-content:space-between;gap:14px;margin:26px 0 12px}.section-title h2{font-size:1.08rem;letter-spacing:-.03em;margin:0}.section-title button,.text-link{border:0;background:none;padding:0;color:var(--blue);font-size:.78rem;font-weight:760;cursor:pointer}.card{background:#fff;border:1px solid #e1e5ec;border-radius:22px;padding:18px}.card.soft{background:var(--blue-soft);border-color:#d7defd}.chip{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:999px;background:#eef0f4;color:#5f6671;font-size:.68rem;font-weight:750}.chip.blue{background:#dfe5ff;color:#334fdd}.chip.green{background:#ddf5ea;color:#16754e}.chip.amber{background:#f8ecd2;color:#8f5b07}.btn{border:0;border-radius:16px;min-height:50px;padding:0 18px;font-weight:820;cursor:pointer;transition:transform .18s ease,background .18s ease}.btn:active{transform:scale(.985)}.btn:disabled{opacity:.42;cursor:not-allowed;transform:none}.btn.primary{background:#11131a;color:#fff}.btn.blue{background:var(--blue);color:#fff}.btn.ghost{background:#fff;border:1px solid #d9dde6}.btn.full{width:100%}.button-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.back-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.back-btn{border:0;background:#fff;border:1px solid #dfe3eb;border-radius:12px;min-height:38px;padding:0 12px;cursor:pointer;font-weight:760}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:7px;background:currentColor}.price{font-variant-numeric:tabular-nums;font-weight:900;letter-spacing:-.03em}.empty{padding:38px 20px;text-align:center;color:#7a808c}.empty strong{display:block;color:#262a33;margin-bottom:8px}

/* Home */
.hero-greeting{padding:10px 2px 2px}.hero-greeting h1{font-size:2.48rem;line-height:.96;letter-spacing:-.06em;margin:7px 0 16px}.hero-greeting h1 span{color:var(--blue)}.merchant-card{margin-top:18px;background:#11131a;color:#fff;border-radius:28px;padding:20px;position:relative;overflow:hidden}.merchant-card:after{content:"";position:absolute;width:210px;height:210px;right:-105px;top:-110px;border-radius:50%;background:var(--blue);opacity:.92}.merchant-card>*{position:relative;z-index:1}.merchant-card small{color:#abb0bc}.merchant-card h2{font-size:1.55rem;letter-spacing:-.045em;margin:8px 0 28px}.merchant-meta{display:flex;justify-content:space-between;gap:12px;font-size:.7rem;color:#b8bdc8}.next-card{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:end}.next-card .chip{display:flex;width:max-content;margin-bottom:10px}.next-date{font-size:2rem;line-height:.94;font-weight:900;letter-spacing:-.055em}.next-card p{margin:7px 0 0;color:#6d7480;font-size:.82rem}.service-strip{display:grid;gap:10px}.service-mini{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;background:#fff;border:1px solid #e1e5ec;border-radius:18px;padding:15px;cursor:pointer}.service-mini h3{font-size:.96rem;margin:0 0 5px}.service-mini p{font-size:.72rem;color:#848a95;margin:0}.service-mini strong{font-size:.88rem}

/* Services */
.service-list{display:grid;gap:12px;margin-top:22px}.service-card{background:#fff;border:1px solid #dfe3eb;border-radius:22px;padding:18px;cursor:pointer}.service-card-top{display:flex;justify-content:space-between;gap:12px}.service-card h2{font-size:1.25rem;letter-spacing:-.04em;margin:0}.service-card p{font-size:.82rem;line-height:1.6;color:#777e89;margin:8px 0 14px}.service-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:.72rem;color:#737a86}.service-hero{background:#11131a;color:#fff;border-radius:28px;padding:24px;margin-top:4px}.service-hero .eyebrow{color:#9fa5b1}.service-hero h1{font-size:2.5rem;line-height:.9;letter-spacing:-.065em;margin:8px 0 18px}.service-hero p{color:#c1c5cd;font-size:.88rem;line-height:1.65}.service-hero-foot{display:flex;justify-content:space-between;align-items:end;margin-top:30px}.service-hero-foot .price{font-size:1.8rem}.feature-list{display:grid;gap:0;margin-top:14px}.feature-list div{display:flex;justify-content:space-between;gap:20px;padding:14px 2px;border-bottom:1px solid #e0e4eb;font-size:.82rem}.feature-list span{color:#777e89}

/* Booking */
.progress{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:14px 0 22px}.progress i{height:4px;background:#dfe3eb;border-radius:99px}.progress i.on{background:var(--blue)}.date-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0}.date-btn{border:1px solid #dfe3eb;background:#fff;border-radius:16px;padding:13px 8px;display:grid;gap:4px;cursor:pointer}.date-btn small{font-size:.62rem;color:#848b96}.date-btn strong{font-size:1.12rem}.date-btn.selected{background:#11131a;color:#fff;border-color:#11131a}.date-btn.selected small{color:#bbc0ca}.time-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}.time-btn{border:1px solid #dfe3eb;background:#fff;border-radius:14px;min-height:44px;font-weight:760;cursor:pointer}.time-btn.selected{background:var(--blue);color:#fff;border-color:var(--blue)}.booking-summary{display:grid;gap:10px;margin:18px 0}.summary-row{display:flex;justify-content:space-between;gap:20px;font-size:.82rem;padding:10px 0;border-bottom:1px solid #e1e4ea}.summary-row span{color:#7b818c}.form-grid{display:grid;gap:12px;margin-top:18px}.field{display:grid;gap:7px}.field label{font-size:.72rem;color:#6f7681}.field input{width:100%;min-height:48px;border:1px solid #d9dee7;border-radius:14px;background:#fff;padding:0 14px;color:#11131a}.field input:focus{border-color:var(--blue);outline:3px solid rgba(79,107,255,.12)}.form-error{min-height:20px;color:var(--red);font-size:.72rem}.sticky-action{position:sticky;bottom:-1px;padding-top:14px;background:linear-gradient(transparent,#f4f5f8 30%)}

/* Success */
.success{text-align:center;padding:34px 8px}.success-mark{width:82px;height:82px;margin:10px auto 24px;border-radius:28px;background:#11131a;color:#fff;display:grid;place-items:center;font-size:2.5rem;font-weight:900}.success h1{font-size:2.35rem;letter-spacing:-.06em;margin:0}.success p{color:#747b87;line-height:1.65;font-size:.88rem}.success-code{margin:20px 0;background:#fff;border:1px solid #e1e5ec;border-radius:18px;padding:15px;font-size:.72rem;color:#777f8b}.success-code strong{display:block;color:#11131a;font-size:1rem;margin-top:5px}

/* Orders & member */
.order-list{display:grid;gap:10px;margin-top:20px}.order-card{background:#fff;border:1px solid #dfe3eb;border-radius:20px;padding:16px;cursor:pointer}.order-card-top{display:flex;justify-content:space-between;gap:12px}.order-card h3{font-size:1rem;margin:0}.order-card p{font-size:.74rem;color:#7c838f;margin:6px 0 0}.order-card .chip{margin-top:14px}.order-detail-hero{background:#fff;border:1px solid #e1e5ec;border-radius:24px;padding:20px}.order-detail-hero h1{font-size:1.7rem;letter-spacing:-.05em;margin:11px 0 5px}.member-hero{background:linear-gradient(135deg,#11131a,#252b3e);color:#fff;border-radius:28px;padding:22px;margin-top:8px}.member-name{font-size:2rem;font-weight:900;letter-spacing:-.055em}.member-level{display:flex;justify-content:space-between;align-items:end;margin-top:28px}.member-level strong{font-size:2.25rem;color:#91a2ff}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.stat-card{background:#fff;border:1px solid #e1e5ec;border-radius:18px;padding:16px}.stat-card strong{display:block;font-size:1.55rem;letter-spacing:-.04em}.stat-card span{color:#818793;font-size:.7rem}.settings-list{margin-top:20px;border-top:1px solid #dfe3eb}.settings-list button{width:100%;border:0;background:transparent;border-bottom:1px solid #dfe3eb;display:flex;justify-content:space-between;padding:16px 2px;cursor:pointer}

/* Admin */
.admin-page{min-height:100dvh;background:#f3f5f8}.admin-topbar{height:76px;background:#11131a;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,4vw,64px);position:sticky;top:0;z-index:20}.admin-brand{display:flex;align-items:center;gap:10px;font-weight:900}.admin-brand i{width:9px;height:9px;border-radius:2px;background:var(--blue)}.admin-top-actions{display:flex;align-items:center;gap:10px}.admin-top-actions a,.admin-top-actions button{border:1px solid #373b46;background:transparent;color:#fff;border-radius:12px;min-height:40px;padding:0 14px;cursor:pointer;font-size:.76rem}.admin-layout{width:min(1460px,calc(100% - 40px));margin:0 auto;padding:34px 0 70px}.admin-nav{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:30px}.admin-nav button{border:1px solid #d8dde6;background:#fff;border-radius:12px;min-height:42px;padding:0 15px;cursor:pointer;color:#5f6672}.admin-nav button.active{background:#11131a;color:#fff;border-color:#11131a}.admin-head{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end;margin-bottom:24px}.admin-head h1{font-size:clamp(2.6rem,5vw,5.5rem);line-height:.86;letter-spacing:-.07em;margin:0}.admin-head p{color:#767d88;max-width:50ch;line-height:1.65}.admin-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:16px}.panel{background:#fff;border:1px solid #e0e4eb;border-radius:22px;padding:22px}.panel h2{font-size:1rem;margin:0 0 18px}.metric-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:12px}.metric{min-height:145px;border-radius:18px;padding:18px;background:#edf0f5;display:flex;flex-direction:column;justify-content:space-between}.metric.primary{background:#11131a;color:#fff}.metric.blue{background:var(--blue);color:#fff}.metric span{font-size:.72rem;opacity:.7}.metric strong{font-size:2.4rem;letter-spacing:-.06em}.booking-table{width:100%;border-collapse:collapse;font-size:.8rem}.booking-table th{text-align:left;color:#7b828e;font-size:.68rem;font-weight:650;padding:0 10px 10px;border-bottom:1px solid #e1e5ec}.booking-table td{padding:13px 10px;border-bottom:1px solid #edf0f4;vertical-align:middle}.booking-table button{border:0;border-radius:9px;min-height:32px;padding:0 9px;cursor:pointer;font-size:.7rem}.booking-table .accept{background:#e1f4eb;color:#117349}.booking-table .cancel{background:#f7e5e7;color:#9b3440}.admin-list{display:grid;gap:10px}.admin-item{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;border-bottom:1px solid #e7eaf0;padding:12px 0}.admin-item:last-child{border-bottom:0}.admin-item h3{font-size:.9rem;margin:0}.admin-item p{font-size:.72rem;color:#818894;margin:4px 0 0}.switch{width:44px;height:25px;border:0;border-radius:99px;background:#d8dde6;padding:3px;cursor:pointer}.switch:after{content:"";display:block;width:19px;height:19px;border-radius:50%;background:#fff;transition:transform .2s}.switch.on{background:var(--blue)}.switch.on:after{transform:translateX(19px)}.filter-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}.filter-row button{border:1px solid #dce1e9;background:#fff;border-radius:10px;min-height:36px;padding:0 12px;cursor:pointer;font-size:.72rem}.filter-row button.active{background:#11131a;color:#fff}.admin-note{color:#7d8490;font-size:.72rem;line-height:1.6}.user-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.user-card{background:#fff;border:1px solid #e0e4eb;border-radius:18px;padding:18px}.user-card strong{font-size:1rem}.user-card p{font-size:.72rem;color:#7d8490;line-height:1.5}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.setting-block{background:#fff;border:1px solid #e0e4eb;border-radius:18px;padding:18px}.setting-block h3{margin:0 0 10px}.setting-block p{color:#7c838f;font-size:.78rem;line-height:1.6}.setting-block select{width:100%;min-height:42px;border:1px solid #dce1e9;border-radius:10px;padding:0 10px;background:#fff}

@media(max-width:980px){.demo-shell{grid-template-columns:1fr}.demo-brief{display:none}.device-stage{padding:0;background:var(--paper);display:block}.phone-shell{width:100%;height:100dvh;min-height:0;border:0;border-radius:0;box-shadow:none}.phone-shell:before{display:none}.app-top{padding-top:13px;height:58px}.bottom-nav{position:fixed}.admin-grid{grid-template-columns:1fr}.user-grid{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.admin-topbar{height:auto;min-height:68px;padding:12px 16px}.admin-top-actions .hide-mobile{display:none}.admin-layout{width:calc(100% - 24px);padding-top:22px}.admin-head{grid-template-columns:1fr}.admin-head h1{font-size:14vw}.admin-nav{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}.admin-nav::-webkit-scrollbar{display:none}.metric-grid,.settings-grid,.user-grid{grid-template-columns:1fr}.booking-table{min-width:680px}.table-scroll{overflow-x:auto}.panel{padding:16px}.admin-grid{gap:12px}}
@media(max-width:390px){.app-main{padding-left:14px;padding-right:14px}.screen-title{font-size:2rem}.hero-greeting h1{font-size:2.25rem;line-height:.98}.date-grid,.time-grid{grid-template-columns:repeat(3,1fr)}.date-btn{padding-inline:5px}.button-row{grid-template-columns:1fr}.bottom-nav{left:8px;right:8px;bottom:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.screen{animation:none}.btn,.switch:after{transition:none}}
