@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--green:#087c54;--deep:#07543e;--mint:#eaf6ef;--mint2:#d6ecdf;--ink:#1d2923;--muted:#718078;--line:#e6ebe7;--paper:#fff;--bg:#f5f8f5;--orange:#e89b65;--shadow:0 14px 40px #123b2410}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:14px}button,input,textarea,select{font:inherit}button{cursor:pointer}.app-frame{max-width:1080px;margin:0 auto;min-height:100vh;background:var(--paper);box-shadow:0 0 70px #173a2410;position:relative;padding-bottom:88px}.topbar{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 42px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#ffffffef;backdrop-filter:blur(12px);z-index:10}.brand{display:flex;align-items:center;gap:11px}.brand img{width:39px;height:39px;object-fit:cover;border-radius:12px}.brand div{display:flex;flex-direction:column;gap:2px}.brand b{font:800 17px Manrope;letter-spacing:2px;color:var(--green)}.brand span{font-size:9px;letter-spacing:2px;color:#6b7b71}.avatar{border:0;border-radius:50%;width:40px;height:40px;background:var(--mint);color:var(--green);font-weight:800}.view{display:none;padding:30px 42px 46px;animation:fade .2s ease}.view.active{display:block}@keyframes fade{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:none}}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:Manrope,sans-serif;letter-spacing:-.04em}h1{font-size:clamp(30px,4vw,46px);line-height:1.12;margin-bottom:12px}h2{font-size:23px;margin-bottom:7px}h3{font-size:16px;margin-bottom:0}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:800;color:#d8f1e1}.eyebrow.green{color:var(--green)}.hero{border-radius:26px;background:linear-gradient(115deg,#07543e 0%,#087c54 66%,#4caa7b 100%);min-height:330px;overflow:hidden;position:relative;display:flex;align-items:center;padding:38px 42px;color:white}.hero-copy{position:relative;z-index:2;max-width:52%}.hero h1{margin:16px 0;font-size:clamp(36px,5vw,54px)}.hero h1 em{font-style:normal;color:#c9f0d6}.hero p{line-height:1.7;color:#e0f1e6;max-width:410px;margin-bottom:23px}.btn{border:0;border-radius:12px;padding:12px 17px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:18px;transition:.15s}.btn:hover{transform:translateY(-1px)}.btn-light{background:#fff;color:var(--deep)}.btn-primary{background:var(--green);color:white;box-shadow:0 7px 15px #087c5420}.btn-outline{background:#fff;color:var(--green);border:1px solid #c8dfd1}.btn.small-btn{padding:9px 12px;font-size:12px}.btn.full{width:100%}.hero-art{position:absolute;right:5%;top:0;width:42%;height:100%;overflow:hidden}.sun{position:absolute;width:190px;height:190px;border-radius:50%;background:#d9efc5;right:55px;top:40px;opacity:.95}.face-art{position:absolute;width:156px;height:215px;border-radius:48% 48% 42% 42%;background:linear-gradient(130deg,#eac4a3,#b97c58);right:80px;top:84px;transform:rotate(-5deg);box-shadow:inset -18px -10px 0 #8f624a25}.face-art:before{content:'';position:absolute;top:85px;left:34px;width:12px;height:4px;border-radius:50%;background:#594337;box-shadow:54px -2px #594337}.face-art:after{content:'';position:absolute;top:130px;left:62px;width:28px;height:10px;border-bottom:2px solid #86513c;border-radius:50%}.face-art span{position:absolute;left:0;top:0;width:100%;height:55px;background:#3e3c2b;border-radius:60% 55% 25% 25%}.leaf{position:absolute;width:60px;height:125px;border-radius:100% 0 100% 0;background:#a7d8a5;transform:rotate(30deg);right:12px;bottom:18px}.leaf-two{right:0;bottom:50px;transform:rotate(75deg);background:#d5e9a9}.section-head{display:flex;align-items:flex-end;justify-content:space-between;margin:32px 0 16px;gap:14px}.section-head.compact{margin-top:29px}.sub,.page-title p{color:var(--muted);line-height:1.6;margin-bottom:0}.status-dot{font-size:10px;padding:7px 10px;border-radius:20px;background:var(--mint);color:var(--green);white-space:nowrap}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.metric{border:1px solid var(--line);border-radius:17px;padding:17px;text-align:left;background:white;display:grid;grid-template-columns:38px 1fr;align-items:center;column-gap:9px;box-shadow:0 3px 14px #123b2404}.metric-icon{grid-row:span 2;width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:var(--mint);color:var(--green);font-size:20px}.metric b{font:800 22px Manrope}.metric small{font-size:11px;color:var(--muted)}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.feature-card{position:relative;text-align:left;padding:14px;border:1px solid var(--line);border-radius:18px;background:white;min-height:148px}.feature-art{width:54px;height:54px;border-radius:17px;display:grid;place-items:center;font-size:26px;margin-bottom:14px}.art-profile{background:#e7f3e8;color:#39835b}.art-history{background:#f7e9dc;color:#9b6745}.art-routine{background:#e9e7f5;color:#6d61a6}.art-scan{background:#e0f0ee;color:#287c75}.feature-card b,.feature-card small{display:block}.feature-card b{font-size:13px;margin-bottom:5px}.feature-card small{font-size:10px;color:var(--muted)}.arrow{position:absolute;right:13px;top:14px;color:#8a9b90}.next-card{margin-top:20px;border-radius:18px;padding:19px;display:flex;align-items:center;gap:15px;background:#f4f8f3;border:1px solid #e8efe8}.next-icon{width:45px;height:45px;flex:none;border-radius:14px;background:#dceede;color:var(--green);display:grid;place-items:center;font-size:22px}.next-copy{flex:1}.next-copy b{display:block;margin:5px 0}.next-copy p{font-size:12px;line-height:1.5;color:var(--muted);margin:0}.circle-arrow{width:39px;height:39px;border:0;border-radius:50%;background:var(--green);color:white;font-size:19px}.demo-foot,.form-note{font-size:10px;color:#87938b;line-height:1.5;margin:18px 0 0}.page-title{margin:6px 0 25px}.page-title h1{margin:9px 0}.panel{border:1px solid var(--line);border-radius:20px;padding:23px;background:#fff;box-shadow:var(--shadow)}.profile-banner{display:flex;align-items:center;gap:15px;padding:19px;border-radius:20px;background:#f0f7f0;margin-bottom:18px}.profile-avatar{width:58px;height:58px;border-radius:19px;background:linear-gradient(140deg,#d2ead7,#80bd95);display:grid;place-items:center;color:#07543e;font:800 18px Manrope}.profile-banner div:nth-child(2){flex:1}.profile-banner h2{font-size:18px;margin:0 0 4px}.profile-banner p{font-size:11px;color:var(--muted);margin-bottom:8px}.pill{font-size:10px;color:var(--green);background:#dcefe1;padding:5px 9px;border-radius:20px}.form-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px;gap:12px}.mini-label{font-size:9px;letter-spacing:1.2px;color:#8a9b90;font-weight:800}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}label{display:block;font-size:12px;font-weight:700;color:#405047;margin-bottom:15px}input:not([type=radio]):not([type=checkbox]):not([type=file]),textarea,select{display:block;width:100%;border:1px solid #dfe7e0;border-radius:10px;background:#fbfdfb;padding:12px 13px;margin-top:7px;color:var(--ink);outline:none;min-height:43px}textarea{resize:vertical}input:focus,textarea:focus,select:focus{border-color:#75b793!important;box-shadow:0 0 0 3px #e3f3e8}hr{border:0;border-top:1px solid var(--line);margin:21px 0}.info-strip{display:flex;gap:11px;padding:14px;background:#f4f7f3;border-radius:13px;margin-top:15px;color:#7b8b80}.info-strip span{font-size:18px;color:var(--green)}.info-strip p{font-size:11px;line-height:1.55;margin:0}.filter-row{display:flex;align-items:center;gap:8px;margin-bottom:20px;flex-wrap:wrap}.filter{border:1px solid var(--line);background:#fff;border-radius:30px;padding:9px 14px;font-size:11px;color:#68796e}.filter.active{background:var(--deep);color:white;border-color:var(--deep)}.filter-row .small-btn{margin-left:auto}.timeline{display:grid;gap:14px}.history-item{border:1px solid var(--line);border-radius:18px;padding:18px;position:relative;display:grid;grid-template-columns:1fr auto;gap:9px}.history-item:before{content:'';position:absolute;left:0;top:18px;bottom:18px;width:3px;border-radius:3px;background:var(--green)}.history-main{padding-left:7px}.history-type{font-size:9px;letter-spacing:1.3px;color:var(--green);font-weight:800}.history-item h3{margin:7px 0;font-size:17px}.history-item p{font-size:12px;color:var(--muted);line-height:1.6;margin:4px 0}.history-date{font-size:10px;color:#809087;white-space:nowrap}.history-products{padding:10px 12px;background:#f4f8f4;border-radius:10px;margin-top:10px;font-size:11px;line-height:1.5}.history-item button{align-self:start}.access-card{display:flex;gap:13px;padding:17px;border:1px solid #dcebe0;background:#f3f8f3;border-radius:16px;margin-top:18px}.access-icon{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:12px;background:#dcefe1;color:var(--green);font-size:21px}.access-card b{font-size:12px}.access-card p{font-size:11px;color:var(--muted);line-height:1.6;margin:5px 0 0}.routine-tabs{display:flex;gap:8px;background:#f1f6f1;padding:5px;border-radius:13px;margin-bottom:17px}.routine-tab{flex:1;border:0;border-radius:10px;background:transparent;padding:12px;color:#65756a;font-size:12px;font-weight:700}.routine-tab.active{background:white;color:var(--green);box-shadow:0 2px 8px #163c1b0b}.routine-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.routine-step{padding:15px;border:1px solid var(--line);border-radius:16px}.step-num{width:28px;height:28px;border-radius:9px;background:var(--mint);color:var(--green);display:grid;place-items:center;font-weight:800;margin-bottom:13px}.routine-step b{font-size:12px;display:block;margin-bottom:6px}.routine-step p{font-size:11px;color:var(--muted);line-height:1.5;margin:0}.product-list{display:grid;gap:13px}.product{display:grid;grid-template-columns:130px 1fr;border:1px solid var(--line);border-radius:17px;overflow:hidden}.product-visual{min-height:140px;position:relative;display:grid;place-items:center;overflow:hidden}.product-visual>span{position:absolute;top:10px;left:11px;font-size:10px;font-weight:800;color:#57705f}.product-one{background:#eaf3e8}.product-two{background:#f5ece2}.product-three{background:#e5f0e9}.bottle{width:39px;height:75px;border-radius:8px 8px 12px 12px;background:linear-gradient(90deg,#d2d8d1,#fff,#c4d2c5);box-shadow:0 8px 15px #264e2b18;position:relative}.bottle:before{content:'';position:absolute;width:17px;height:13px;background:#7f9385;top:-11px;left:11px;border-radius:3px 3px 0 0}.bottle:after{content:'LRP';position:absolute;top:32px;left:7px;font-size:8px;color:#537b64}.jar{width:68px;height:43px;border-radius:7px 7px 14px 14px;background:linear-gradient(90deg,#e6d9c8,#fff,#d7c6b4);position:relative;box-shadow:0 9px 17px #5a3b1b12}.jar:before{content:'';position:absolute;left:-3px;top:-9px;width:74px;height:12px;border-radius:5px;background:#ded0bf}.green-jar{background:linear-gradient(90deg,#c0d7c7,#fff,#a8cdb6)}.green-jar:before{background:#9abda7}.product-detail{padding:17px}.product-tag{font-size:9px;color:var(--green);letter-spacing:1.2px;font-weight:800}.product-detail h3{font-size:15px;margin:7px 0}.product-detail p{font-size:11px;line-height:1.5;color:var(--muted);margin-bottom:10px}.product-detail a{font-size:11px;color:var(--green);font-weight:800;text-decoration:none}.booking-progress{display:flex;align-items:center;gap:10px;margin-bottom:19px}.progress-step{display:flex;align-items:center;gap:8px;color:#a2aea5;font-size:11px;font-weight:800}.progress-step.active{color:var(--green)}.progress-step small{font-size:10px;font-weight:500}.booking-progress i{height:1px;background:#dbe6dc;flex:1}.service-options{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:19px}.service-option{position:relative;border:1px solid var(--line);border-radius:14px;padding:15px;display:grid;grid-template-columns:35px 1fr;align-items:center;column-gap:10px;margin:0;cursor:pointer}.service-option:has(input:checked){border-color:#65aa80;background:#f2f9f3}.service-option input{position:absolute;right:12px;top:12px;accent-color:var(--green)}.service-symbol{grid-row:span 2;width:35px;height:35px;border-radius:11px;background:var(--mint);display:grid;place-items:center;color:var(--green);font-size:20px}.service-option b{font-size:12px}.service-option small{font-size:10px;color:var(--muted);font-weight:400}.time-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0 20px}.time-slot{border:1px solid #dfe8e0;background:white;border-radius:9px;padding:10px 4px;font-size:11px;color:#526257}.time-slot.selected{background:var(--green);color:white;border-color:var(--green)}.staff-heading{margin-top:4px}.staff-list{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:18px}.staff-option{display:flex;align-items:center;gap:10px;border:1px solid var(--line);padding:11px;border-radius:12px;margin:0;cursor:pointer}.staff-option:has(input:checked){border-color:#65aa80;background:#f3f9f4}.staff-option input{accent-color:var(--green)}.staff-avatar{width:38px;height:38px;border-radius:13px;background:#e2eee2;display:grid;place-items:center;color:var(--green);font-weight:800;flex:none}.staff-copy{flex:1}.staff-copy b{display:block;font-size:11px}.staff-copy small{display:block;color:var(--muted);font-size:9px;margin-top:3px}.check-row{display:flex;align-items:flex-start;gap:9px;font-size:11px;font-weight:500;line-height:1.5;margin:4px 0 18px}.check-row input{margin-top:2px;accent-color:var(--green)}.success-panel{text-align:center;padding:28px;border-radius:20px;background:#f1f8f2;margin-top:18px}.success-check{width:45px;height:45px;border-radius:50%;background:var(--green);color:white;display:grid;place-items:center;font-size:25px;margin:0 auto 12px}.success-panel p{color:var(--muted);line-height:1.6}.hidden{display:none!important}.scan-layout{display:grid;grid-template-columns:1fr 1fr;gap:15px}.camera-card{padding:16px;border:1px solid var(--line);border-radius:19px;background:#f7faf7;text-align:center}.camera-frame{height:270px;border:1px dashed #a8cdb4;border-radius:16px;position:relative;background:radial-gradient(circle at 50% 35%,#edf7ed,#e4f0e6);display:flex;align-items:center;justify-content:center;flex-direction:column;overflow:hidden}.camera-face{width:115px;height:157px;border-radius:48% 48% 45% 45%;background:linear-gradient(120deg,#e7c5a5,#c18d6b);position:relative;color:#8e6249;font-size:25px;display:grid;place-items:center}.camera-face:before{content:'•';position:absolute;top:50px;left:28px;color:#654938;box-shadow:50px 0 #654938}.camera-face span{position:absolute;top:8px;right:-9px;width:24px;height:24px;border-radius:50%;background:white;display:grid;place-items:center;color:var(--green)}.camera-frame p{font-size:10px;color:#698273;margin:14px 0 0}.scan-corners{position:absolute;inset:25px;border:1px solid #72aa86;border-radius:18px;opacity:.6}.file-button{margin-top:13px;position:relative;overflow:hidden}.file-button input{position:absolute;inset:0;opacity:0;cursor:pointer}.scan-notes h3{margin-bottom:17px}.photo-preview{margin-top:15px;border:1px solid var(--line);padding:12px;border-radius:15px}.photo-preview img{max-width:100%;max-height:280px;display:block;border-radius:10px;margin:0 auto}.scan-history{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.scan-card{border:1px solid var(--line);border-radius:15px;padding:11px}.scan-card img{width:100%;height:110px;object-fit:cover;border-radius:10px;background:#edf4ed}.scan-card b{font-size:11px;display:block;margin:9px 0 4px}.scan-card p{font-size:10px;color:var(--muted);line-height:1.4;margin:0}.ai-card{display:flex;gap:15px;padding:20px;border-radius:18px;background:#f2f7f2;margin-top:20px}.ai-orb{width:50px;height:50px;flex:none;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#b5dfc2,#e5f4e8);color:var(--green);font-size:25px}.ai-card h3{margin:7px 0}.ai-card p{font-size:11px;color:var(--muted);line-height:1.6}.ai-result{padding:12px;border-radius:12px;background:#fff;border:1px solid var(--line);font-size:12px;line-height:1.6;margin-top:12px}.reminder-actions{display:flex;gap:10px;margin-bottom:15px;flex-wrap:wrap}.reminder-list{display:grid;gap:10px;margin-top:15px}.reminder-item{display:flex;align-items:center;gap:12px;padding:15px;border:1px solid var(--line);border-radius:14px}.reminder-icon{width:38px;height:38px;display:grid;place-items:center;background:#f8ebdd;color:#986b45;border-radius:12px}.reminder-item div:nth-child(2){flex:1}.reminder-item b{font-size:12px;display:block}.reminder-item p{font-size:10px;color:var(--muted);margin:5px 0 0}.reminder-item button{border:0;background:none;color:#9a6d5a}.role-switch{display:flex;align-items:center;gap:8px;padding:8px;border-radius:14px;background:#f1f6f1;margin-bottom:15px}.role-switch>span{font-size:11px;color:var(--muted);margin:0 auto 0 7px}.role-btn{border:0;background:transparent;padding:9px 12px;border-radius:9px;font-size:11px}.role-btn.active{background:white;color:var(--green);box-shadow:0 2px 9px #183f2010;font-weight:800}.settings-list{border:1px solid var(--line);border-radius:17px;overflow:hidden}.settings-list button{display:flex;align-items:center;gap:13px;width:100%;padding:17px;border:0;border-bottom:1px solid var(--line);background:white;text-align:left}.settings-list button:last-child{border:0}.settings-list button>span:first-child{width:35px;height:35px;display:grid;place-items:center;border-radius:11px;background:var(--mint);color:var(--green);font-size:18px}.settings-list button div{flex:1}.settings-list b,.settings-list small{display:block}.settings-list b{font-size:12px}.settings-list small{font-size:10px;color:var(--muted);margin-top:4px}.settings-list button>span:last-child{color:var(--muted)}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(1080px,100%);height:75px;background:#ffffffef;backdrop-filter:blur(14px);border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-around;padding:6px 20px calc(6px + env(safe-area-inset-bottom));z-index:15}.nav-btn{border:0;background:transparent;color:#89958d;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:58px}.nav-btn>span{font-size:21px;line-height:1.1}.nav-btn small{font-size:9px}.nav-btn.active{color:var(--green);font-weight:800}.nav-book{width:32px;height:32px;border-radius:12px;background:var(--green);color:white;display:grid;place-items:center;margin-top:-12px;box-shadow:0 5px 12px #087c5430}.toast{position:fixed;left:50%;bottom:91px;transform:translateX(-50%);background:#193d2d;color:white;padding:12px 18px;border-radius:12px;font-size:12px;box-shadow:var(--shadow);display:none;z-index:50;max-width:90vw}.empty-state{text-align:center;padding:28px;color:var(--muted);border:1px dashed #d6e2d7;border-radius:15px;font-size:12px;line-height:1.6}
@media(max-width:700px){.topbar{height:65px;padding:0 19px}.view{padding:20px 18px 35px}.hero{padding:26px 22px;min-height:370px;align-items:flex-start}.hero-copy{max-width:100%;padding-bottom:165px}.hero h1{font-size:39px}.hero p{max-width:340px;font-size:12px}.hero-art{width:100%;height:190px;top:auto;bottom:0;right:0}.sun{width:125px;height:125px;right:60px;top:0}.face-art{width:103px;height:140px;right:82px;top:43px}.face-art:before{top:55px;left:22px;box-shadow:38px 0 #594337}.face-art:after{top:86px;left:41px}.face-art span{height:36px}.leaf{height:90px;right:10px;bottom:0}.leaf-two{right:0;bottom:23px}.section-head{align-items:flex-start;margin-top:25px}.section-head h2{font-size:20px}.sub{font-size:11px}.metric-grid{gap:8px}.metric{padding:11px 9px;grid-template-columns:1fr;gap:5px}.metric-icon{width:31px;height:31px;font-size:17px;grid-row:auto}.metric b{font-size:20px}.metric small{font-size:9px;line-height:1.4}.feature-grid{grid-template-columns:repeat(2,1fr);gap:10px}.feature-card{min-height:135px}.feature-art{width:45px;height:45px}.next-card{padding:13px;gap:10px}.next-copy p{font-size:10px}.next-icon{width:38px;height:38px}.circle-arrow{width:33px;height:33px}.profile-banner{padding:13px;gap:10px}.profile-avatar{width:45px;height:45px}.profile-banner h2{font-size:14px}.profile-banner .btn{font-size:10px;padding:9px}.form-grid{grid-template-columns:1fr;gap:0}.panel{padding:17px}.routine-steps{grid-template-columns:1fr}.routine-step{display:grid;grid-template-columns:34px 1fr;column-gap:10px;padding:12px}.step-num{grid-row:span 2;margin:0}.routine-step b{align-self:end}.routine-step p{align-self:start}.product{grid-template-columns:98px 1fr}.product-visual{min-height:145px}.product-detail{padding:12px}.product-detail h3{font-size:13px}.product-detail p{font-size:10px}.service-options{gap:8px}.service-option{padding:11px;grid-template-columns:30px 1fr}.service-symbol{width:30px;height:30px}.time-slots{grid-template-columns:repeat(4,1fr);gap:6px}.time-slot{font-size:10px;padding:9px 1px}.staff-list{grid-template-columns:1fr}.scan-layout{grid-template-columns:1fr}.camera-frame{height:235px}.scan-history{grid-template-columns:repeat(2,1fr)}.ai-card{padding:15px;gap:11px}.ai-orb{width:40px;height:40px}.history-item{grid-template-columns:1fr}.history-date{grid-row:1}.filter-row .small-btn{margin-left:0}.bottom-nav{height:70px;padding-left:7px;padding-right:7px}.nav-btn{min-width:48px}.nav-btn small{font-size:8px}.page-title h1{font-size:34px}.booking-progress{gap:6px}.progress-step{gap:4px;font-size:10px}.progress-step small{font-size:9px}.role-switch{flex-wrap:wrap}.role-switch>span{width:100%;margin:2px 7px}.reminder-actions .btn{flex:1;font-size:11px;padding:10px}.history-item h3{font-size:15px}}