@charset "UTF-8";

/* Production interaction + visual layer. Neutral light/dark surfaces keep the app calm;
   Homigo navy and pink are reserved for accents, actions and state. */
:root{
  --content-max:680px;
  --hairline:rgba(31,42,61,.075);
  --press-scale:.985;
}
html{overscroll-behavior-y:none;background:var(--cream)}
body{min-height:100dvh;overscroll-behavior-y:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,a,input,select,textarea{touch-action:manipulation}
button,a{user-select:none;-webkit-user-select:none}
button:focus-visible,a:focus-visible{outline:3px solid rgba(255,107,157,.32);outline-offset:2px}

.app-header{height:calc(64px + var(--safe-top));padding:var(--safe-top) 12px 0;background:color-mix(in srgb,var(--surface) 96%,transparent);color:var(--text);border-bottom:1px solid color-mix(in srgb,var(--border) 90%,transparent);box-shadow:0 5px 20px rgba(25,34,48,.07)}
.brand-logo-image--header{width:96px;height:42px}
.app-header__title{font-size:.96rem;letter-spacing:-.018em}
.page-host{max-width:var(--content-max);padding:calc(64px + var(--safe-top) + 16px) 16px calc(82px + var(--safe-bottom) + 28px)}
.bottom-nav{height:68px;left:10px;right:10px;bottom:calc(8px + var(--safe-bottom));border-radius:21px;padding:5px;background:color-mix(in srgb,var(--surface) 94%,transparent);box-shadow:0 12px 34px rgba(13,27,61,.15)}
.bottom-nav a{border-radius:16px;font-size:.64rem;gap:3px}
.bottom-nav a svg{width:19px;height:19px}
.bottom-nav a.active{background:var(--pink-soft);color:var(--text)}

.card,.stat-card,.quick-action,.profile-menu a,.profile-menu button{border-color:var(--hairline);box-shadow:0 5px 20px rgba(13,27,61,.065)}
.card{border-radius:20px;padding:17px}
.card:has(> .list-item){padding:16px}
.section-head{margin:24px 1px 11px;align-items:center}
.section-title{font-size:1.08rem;letter-spacing:-.025em}
.eyebrow{font-size:.68rem;letter-spacing:.14em}
.button{min-height:50px;border-radius:14px;font-size:.9rem;letter-spacing:-.008em;transition:transform .12s ease,filter .14s ease,box-shadow .14s ease}
.button:active:not(:disabled){transform:scale(var(--press-scale));filter:brightness(.97)}
.button--large{min-height:54px;font-size:.94rem}
.button:disabled{opacity:.58;filter:saturate(.7)}
.input,.select,.textarea,.native-control-trigger{border-radius:14px;border-color:var(--border);background:var(--surface);min-height:51px}
.input--large{min-height:55px;font-size:1rem}
.field label{font-size:.78rem;color:var(--text);font-weight:780}
.form-note{font-size:.72rem}
.spinner{width:18px;height:18px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite;opacity:.8}
.icon-button--surface{background:var(--surface-2);color:var(--text);border:1px solid var(--border)}

/* Network state is visible but never steals the screen. */
.network-banner{position:fixed;z-index:12000;left:50%;top:calc(var(--safe-top) + 8px);transform:translate(-50%,-140%);opacity:0;pointer-events:none;background:#8b2f3d;color:#fff;border-radius:999px;padding:8px 13px;font-size:.75rem;font-weight:800;box-shadow:0 8px 24px rgba(0,0,0,.22);transition:.22s var(--ease)}
.network-banner.is-visible{transform:translate(-50%,0);opacity:1}

/* Authentication */
.auth-screen{position:relative;overflow:hidden;background:radial-gradient(circle at 12% 0,rgba(240,107,152,.11),transparent 28%),radial-gradient(circle at 94% 5%,rgba(30,42,68,.055),transparent 30%),var(--cream);padding:0}
.auth-wrap{position:relative;z-index:2;width:min(100%,500px);margin:0 auto;padding:calc(var(--safe-top) + 28px) 18px calc(var(--safe-bottom) + 28px);min-height:100dvh;display:flex;flex-direction:column}
.auth-ambient{position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none}.auth-ambient--one{width:260px;height:260px;right:-110px;top:-70px;background:rgba(240,107,152,.08)}.auth-ambient--two{width:170px;height:170px;left:-90px;top:180px;background:rgba(30,42,68,.035)}
.login-brand{margin:0 0 32px;display:flex;align-items:center;justify-content:space-between;min-height:56px}
.brand-logo-image--login{width:178px;max-height:82px;object-position:left center;filter:drop-shadow(0 10px 18px rgba(0,0,0,.12))}
.partner-pill{font-size:.67rem;font-weight:850;letter-spacing:.05em;text-transform:uppercase;color:var(--navy);border:1px solid var(--border);background:color-mix(in srgb,var(--surface) 88%,transparent);padding:7px 10px;border-radius:999px;backdrop-filter:blur(10px)}
.auth-card{margin:0;background:var(--surface);padding:25px 21px 22px;border-radius:26px;border:1px solid var(--border);box-shadow:0 20px 50px rgba(25,34,48,.10)}
.auth-card h1{font-size:1.55rem;line-height:1.12;letter-spacing:-.045em;margin:5px 0 8px;color:var(--text)}
.auth-copy{font-size:.86rem;color:var(--muted);line-height:1.55;margin-bottom:20px}
.auth-icon{width:46px;height:46px;border-radius:15px;background:var(--pink-soft);color:var(--pink-2);display:grid;place-items:center;margin-bottom:16px}.auth-icon svg{width:22px}.auth-icon--success{background:var(--success-soft);color:var(--success)}
.auth-back{display:inline-flex;align-items:center;gap:6px;background:none;color:var(--muted);font-size:.79rem;font-weight:800;padding:3px 0;margin-bottom:17px}.auth-back svg{width:17px}
.auth-trust{margin-top:17px;padding:11px 12px;border-radius:13px;background:var(--surface-2);display:flex;gap:9px;color:var(--muted);font-size:.72rem;line-height:1.45}.auth-trust svg{width:18px;flex:0 0 18px;color:var(--success)}
.otp-input{text-align:center;font-size:1.42rem;letter-spacing:.36em;font-weight:900;padding-left:calc(14px + .36em)}
.auth-footer{text-align:center;color:color-mix(in srgb,var(--muted) 78%,transparent);font-size:.68rem;margin-top:auto;padding-top:22px}

/* Home dashboard */
.home-page{padding-top:3px}.home-loading{display:grid;gap:12px}
.home-welcome-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:2px 2px 16px}.home-welcome-row h1{font-size:1.55rem;letter-spacing:-.045em;line-height:1.08;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:72vw}.home-kicker{font-size:.76rem;color:var(--muted);font-weight:720;margin-bottom:3px}.avatar--home{width:50px;height:50px;border-radius:17px;box-shadow:0 6px 18px rgba(13,27,61,.12)}
.work-status-card{border-radius:25px;padding:19px;background:linear-gradient(145deg,var(--surface),var(--surface-accent));color:var(--text);border:1px solid var(--border);box-shadow:var(--shadow-sm);overflow:hidden;position:relative}.work-status-card::before{content:"";position:absolute;left:0;top:20px;bottom:20px;width:3px;border-radius:0 3px 3px 0;background:linear-gradient(var(--navy),var(--pink))}.work-status-card::after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-88px;top:-96px;background:radial-gradient(circle,rgba(240,107,152,.08),transparent 70%);pointer-events:none}
.work-status-card__top{display:flex;align-items:center;justify-content:space-between;gap:12px;position:relative;z-index:2}.live-state{display:flex;align-items:center;gap:10px}.live-state__dot{width:11px;height:11px;border-radius:50%;background:#7b879e;box-shadow:0 0 0 5px rgba(31,42,61,.055)}.live-state__dot.is-online{background:#53d99b;box-shadow:0 0 0 5px rgba(83,217,155,.13)}.live-state small{display:block;font-size:.59rem;letter-spacing:.13em;color:var(--muted);font-weight:850}.live-state strong{display:block;font-size:1.05rem;margin-top:2px}.work-status-card>p{position:relative;z-index:2;color:var(--muted);font-size:.76rem;line-height:1.5;margin:11px 0 13px}
.toggle--large{width:58px;height:34px}.toggle--large .toggle-track::after{width:26px;height:26px}.toggle--large input:checked+.toggle-track::after{transform:translateX(24px)}
.gps-status{position:relative;z-index:2;display:grid;grid-template-columns:38px minmax(0,1fr) 38px;align-items:center;gap:10px;padding:10px;border:1px solid var(--border);background:color-mix(in srgb,var(--surface-2) 86%,transparent);border-radius:16px}.gps-status__icon{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:var(--surface);color:var(--navy);border:1px solid var(--border)}.gps-status__icon svg{width:18px}.gps-status strong{display:block;font-size:.78rem}.gps-status small{display:block;color:var(--muted);font-size:.66rem;line-height:1.35;margin-top:2px}.gps-status[data-tone="good"] .gps-status__icon{background:rgba(83,217,155,.18);color:#76e4b3}.gps-status[data-tone="warn"] .gps-status__icon{background:rgba(255,198,91,.16);color:#ffd37b}.gps-status[data-tone="bad"] .gps-status__icon{background:rgba(255,120,135,.16);color:#ff9dab}.gps-status .icon-button{width:36px;height:36px;border-radius:12px;background:var(--surface);border-color:var(--border);color:var(--navy)}
.home-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:11px}.metric-tile{background:var(--surface);border:1px solid var(--hairline);border-radius:17px;padding:11px 10px;display:flex;gap:8px;align-items:center;box-shadow:0 4px 15px rgba(13,27,61,.055)}.metric-tile__icon{width:31px;height:31px;flex:0 0 31px;border-radius:10px;background:var(--pink-soft);color:var(--pink-2);display:grid;place-items:center}.metric-tile__icon svg{width:16px}.metric-tile small{display:block;color:var(--muted);font-size:.61rem;white-space:nowrap}.metric-tile strong{display:block;font-size:.78rem;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.approval-banner{margin-top:11px}.notice--action{display:flex;align-items:center;justify-content:space-between;gap:12px;text-decoration:none}.notice--action>div{display:grid;gap:2px}.notice--action strong{font-size:.78rem}.notice--action span{font-size:.7rem;opacity:.9}.notice--action>svg{width:18px;flex:0 0 18px}
.booking-card--featured{padding:17px;transition:transform .14s ease,box-shadow .14s ease}.booking-card--featured:active{transform:scale(.99)}.booking-open{display:inline-flex;align-items:center;gap:2px;color:var(--pink-2);font-size:.76rem;font-weight:850}.booking-open svg{width:16px}.empty-state--compact{padding:24px 16px}
.quick-actions--home{grid-template-columns:1fr 1fr}.quick-actions--home .quick-action{min-height:76px;padding:14px 12px;position:relative}.quick-actions--home .quick-action>span:nth-child(2){min-width:0;flex:1}.quick-action__arrow{margin-left:auto;color:var(--muted)}.quick-action__arrow svg{width:16px}

/* Setup */
.setup-page{min-height:100dvh;padding:calc(var(--safe-top) + 20px) 16px calc(var(--safe-bottom) + 28px);max-width:680px;margin:0 auto}.setup-topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin:2px 2px 16px}.setup-topbar h1{font-size:1.55rem;letter-spacing:-.045em;margin:3px 0 5px}.setup-topbar p:last-child{font-size:.79rem;line-height:1.45;color:var(--muted);max-width:470px}.setup-progress-card{background:var(--surface);border:1px solid var(--hairline);box-shadow:var(--shadow-sm);border-radius:19px;padding:14px 15px;margin-bottom:13px}.setup-progress-head{display:flex;justify-content:space-between;gap:12px;font-size:.74rem;color:var(--muted);font-weight:760;margin-bottom:9px}.setup-progress-head strong{color:var(--pink-2)}.progress--thick{height:9px}.setup-step-dots{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:9px}.setup-step-dots span{height:4px;border-radius:999px;background:var(--surface-2)}.setup-step-dots span.done{background:var(--success)}.setup-skeletons,.setup-sections{display:grid;gap:12px}.setup-card{background:var(--surface);border:1px solid var(--hairline);box-shadow:var(--shadow-sm);border-radius:22px;overflow:hidden}.setup-card__head{display:grid;grid-template-columns:36px 1fr 28px;gap:11px;align-items:center;padding:16px;border-bottom:1px solid var(--border)}.setup-number{width:34px;height:34px;border-radius:11px;background:var(--pink-soft);color:var(--pink-2);font-weight:900;display:grid;place-items:center}.setup-card__head h2{font-size:.98rem;letter-spacing:-.02em}.setup-card__head p{font-size:.7rem;color:var(--muted);margin-top:2px}.setup-card__body{padding:16px}.setup-check{display:grid;place-items:center}.setup-check--done{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:var(--success-soft);color:var(--success);font-weight:950}.setup-check--pending{font-size:1.5rem;color:var(--border)}.read-only-field{min-height:51px;border-radius:14px;background:var(--surface-2);display:flex;align-items:center;padding:0 13px;font-weight:800;font-size:.84rem;color:var(--muted)}
.service-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:13px}.service-choice{border:1px solid var(--border);background:var(--surface);border-radius:15px;padding:11px;display:flex;align-items:center;gap:9px;cursor:pointer;position:relative}.service-choice input{position:absolute;opacity:0;pointer-events:none}.service-choice__check{width:23px;height:23px;border-radius:8px;background:var(--surface-2);color:transparent;display:grid;place-items:center;font-size:.72rem;font-weight:950}.service-choice.selected{border-color:rgba(255,107,157,.45);background:var(--pink-soft)}.service-choice.selected .service-choice__check{background:var(--pink-2);color:#fff}.service-choice strong{display:block;font-size:.79rem}.service-choice small{display:block;font-size:.64rem;color:var(--muted);margin-top:2px}
.document-setup-list{display:grid;gap:8px;margin-bottom:12px}.document-setup-row{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:10px;padding:9px 10px;border:1px solid var(--border);border-radius:14px}.document-setup-icon{width:34px;height:34px;border-radius:11px;background:var(--surface-2);display:grid;place-items:center;color:var(--muted)}.document-setup-icon svg{width:17px}.document-setup-row strong{font-size:.76rem}.document-setup-row small{display:block;font-size:.64rem;color:var(--muted);margin-top:2px}.document-upload-inline{display:grid;grid-template-columns:1fr;gap:9px;padding-top:2px}.file-pick{min-height:48px;border:1px dashed var(--border);border-radius:14px;display:flex;align-items:center;justify-content:center;gap:8px;color:var(--muted);font-size:.76rem;font-weight:800;cursor:pointer;padding:10px}.file-pick input{position:absolute;opacity:0;width:1px;height:1px}.file-pick svg{width:18px;color:var(--pink-2)}
.location-permission-panel{margin-bottom:11px}.location-state{border:1px solid var(--border);background:var(--surface-2);border-radius:14px;padding:11px 12px}.location-state strong{display:block;font-size:.78rem}.location-state span{display:block;font-size:.68rem;color:var(--muted);line-height:1.4;margin-top:3px}.location-state--good{background:var(--success-soft);border-color:color-mix(in srgb,var(--success) 28%,transparent)}.location-state--warn{background:var(--warning-soft)}.location-state--bad{background:var(--danger-soft)}.setup-finish{text-align:center;padding:6px 1px 0}.setup-finish p{font-size:.7rem;color:var(--muted);margin-top:8px}

/* Better generic empty/error states and list pages */
.page-state{background:var(--surface);border:1px solid var(--border);border-radius:22px;padding:28px 20px;text-align:center;box-shadow:var(--shadow-sm);margin-top:8px}.page-state .state-icon{width:52px;height:52px;border-radius:17px;background:var(--danger-soft);color:var(--danger);display:grid;place-items:center;font-size:1.3rem;font-weight:950;margin:0 auto 13px}.page-state h2{font-size:1.08rem}.page-state p{font-size:.78rem;color:var(--muted);line-height:1.5;margin:6px auto 17px;max-width:380px}
.document-card{display:flex;gap:12px;align-items:center}.document-icon{width:42px;height:42px;border-radius:14px;background:var(--surface-2);color:var(--pink-2);display:grid;place-items:center;flex:0 0 42px}.document-body{min-width:0;flex:1}.document-name{font-size:.86rem;font-weight:850}
.chat-composer{bottom:calc(8px + var(--safe-bottom));border:1px solid var(--border);border-radius:18px;padding:7px;box-shadow:0 12px 34px rgba(13,27,61,.13)}
.toast-host{z-index:15000}.toast{border-radius:16px;box-shadow:0 14px 40px rgba(13,27,61,.23)}

@media(max-width:390px){
  .page-host{padding-left:13px;padding-right:13px}.home-metrics{gap:6px}.metric-tile{padding:9px 7px;gap:6px}.metric-tile__icon{display:none}.quick-actions--home{grid-template-columns:1fr}.service-choice-grid{grid-template-columns:1fr}.setup-page{padding-left:13px;padding-right:13px}.auth-wrap{padding-left:14px;padding-right:14px}.auth-card{padding-left:18px;padding-right:18px}
}
@media(min-width:640px){.quick-actions--home{grid-template-columns:repeat(2,1fr)}}
@media(prefers-color-scheme:dark){
  :root{--hairline:rgba(255,255,255,.075)}
  .auth-screen{background:radial-gradient(circle at 12% 0,rgba(240,107,152,.08),transparent 28%),radial-gradient(circle at 94% 5%,rgba(78,104,148,.07),transparent 30%),var(--cream)}
  .auth-card{border-color:rgba(255,255,255,.07)}
  .metric-tile,.setup-card,.setup-progress-card{border-color:var(--border)}
}

/* Production polish across secondary screens. */
.standard-page{width:100%;padding-bottom:4px}
.standard-page>.section-head:first-child{margin-top:0!important;padding:2px 1px 3px}
.refresh-button{width:42px;height:42px;border-radius:14px;flex:0 0 42px;box-shadow:0 4px 14px rgba(13,27,61,.07)}
.refresh-button:disabled{opacity:.65}
.page-state--inline{margin:0;padding:24px 18px}.page-state--inline .state-icon{width:45px;height:45px;border-radius:14px;margin-bottom:10px}.page-state--inline p{margin-bottom:0}

/* Schedule + booking history */
.schedule-date{margin:2px -3px 1px;padding:4px 3px 9px;scroll-snap-type:x proximity}
.date-chip{min-width:64px;background:var(--surface);border-color:var(--hairline);box-shadow:0 3px 12px rgba(13,27,61,.045);scroll-snap-align:start;transition:transform .12s ease,background .14s ease,color .14s ease,border-color .14s ease}
.date-chip:active{transform:scale(.97)}
.date-chip.active{background:var(--navy);border-color:var(--navy);box-shadow:0 8px 19px rgba(13,27,61,.18)}
.booking-card{position:relative;overflow:hidden;text-decoration:none;transition:transform .12s ease,box-shadow .14s ease,border-color .14s ease;padding:16px 16px 14px}
.booking-card::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:0 3px 3px 0;background:var(--pink);opacity:.85}
.booking-card:active{transform:scale(.988)}
.booking-card__service{font-size:.95rem;letter-spacing:-.02em;padding-left:2px}
.booking-card__meta{margin-top:4px;line-height:1.48}
.booking-card__bottom{border-top:1px solid var(--hairline);padding-top:11px;margin-top:1px}
.booking-card__bottom .money{font-size:.82rem}.booking-card__bottom>svg{width:17px;color:var(--muted)}

/* Earnings */
.earnings-page>.card--navy:first-child{border-radius:25px;min-height:150px;display:flex;flex-direction:column;justify-content:center;padding:21px;background:linear-gradient(145deg,var(--surface),var(--surface-accent));color:var(--text);border:1px solid var(--border);box-shadow:var(--shadow-sm);overflow:hidden;position:relative}
.earnings-page>.card--navy:first-child::after{content:"";position:absolute;width:180px;height:180px;right:-85px;top:-90px;border-radius:50%;background:radial-gradient(circle,rgba(240,107,152,.09),transparent 70%)}
.earnings-page #earningsStats .stat-card{min-height:102px;padding:14px;border-radius:17px}.earnings-page #earningsStats .stat-card small{font-size:.68rem;line-height:1.3}.earnings-page #earningsStats .stat-card strong{font-size:1rem;margin-top:8px}
.earnings-page #earningsList>.card{padding:14px 15px}.earnings-page #earningsList .list-item__title{font-size:.88rem}

/* Profile and settings */
.profile-page #profileHeader{padding:18px;border-radius:24px;background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--surface-2) 42%,var(--surface)))}
.profile-page .profile-head{align-items:center}.profile-page .profile-head__body h1{font-size:1.18rem;letter-spacing:-.03em}
.profile-page .avatar--lg{border-radius:18px;box-shadow:0 7px 18px rgba(13,27,61,.12)}
.profile-page #profileApproval .notice{border-radius:16px}
.profile-page #profileForm{gap:15px}
.profile-menu{display:grid;gap:8px}.profile-menu a,.profile-menu button{background:var(--surface);border:1px solid var(--hairline);border-radius:17px!important;padding:12px 13px!important;min-height:66px;transition:transform .12s ease,background .14s ease}.profile-menu a:active,.profile-menu button:active{transform:scale(.99);background:var(--surface-2)}
.profile-menu__icon{width:39px!important;height:39px!important;border-radius:13px!important;background:var(--pink-soft)!important;color:var(--pink-2)!important}.profile-menu__icon svg{width:18px}.profile-menu__body strong{font-size:.82rem}.profile-menu__body small{font-size:.68rem;line-height:1.35;margin-top:2px}

/* Documents, services and support forms */
.documents-page>.card--pink-soft:first-child,.skills-page>.card:first-child,.support-page>.card--navy:first-child{border-radius:23px;padding:18px 18px 19px}
.documents-page #documentForm,.support-page #supportForm{gap:15px}
.documents-page #documentList,.support-page #supportList,.skills-page #skillsList{gap:9px}
.skills-page #saveSkillsButton{position:sticky;bottom:calc(14px + var(--safe-bottom));z-index:10;box-shadow:0 12px 30px rgba(13,27,61,.18);margin-top:16px!important}
.document-card{padding:13px 14px}.document-body small{line-height:1.4}

/* Notifications */
.notification-item{width:100%;text-align:left;cursor:pointer;display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:11px;padding:13px 13px;border-radius:18px;transition:transform .12s ease,opacity .14s ease,background .14s ease}
.notification-item:active{transform:scale(.99)}.notification-item:disabled{cursor:default;opacity:.72}
.notification-item.unread{background:linear-gradient(100deg,var(--pink-soft),var(--surface) 46%);border-color:color-mix(in srgb,var(--pink) 20%,var(--border))}
.notification-item__icon{width:42px;height:42px;border-radius:14px;background:var(--surface-2);color:var(--pink-2);display:grid;place-items:center}.notification-item__icon svg{width:19px}
.notification-item__body{min-width:0}.notification-item__body strong{display:block;font-size:.83rem;line-height:1.3}.notification-item__body p{font-size:.72rem;color:var(--muted);line-height:1.42;margin-top:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.notification-item__body small{display:block;font-size:.62rem;color:var(--muted);margin-top:5px}.notification-item__chevron{color:var(--muted)}.notification-item__chevron svg{width:17px}

/* Booking workflow */
.booking-page #bookingDetail>.card:first-child{border-radius:23px;padding:18px}.booking-detail-head h1{font-size:1.25rem}.booking-id{font-weight:700}
.booking-page .customer-row{padding:1px}.booking-page .location-card{background:var(--surface-2);border-radius:16px;padding:13px}.booking-page .timeline-item{min-height:61px}.booking-page .journey-actions{position:sticky;bottom:calc(12px + var(--safe-bottom));z-index:9;background:color-mix(in srgb,var(--cream) 90%,transparent);backdrop-filter:blur(12px);padding:8px;border-radius:18px;margin:-2px -8px 0}.booking-page .journey-actions>.button:first-child{box-shadow:0 10px 25px rgba(13,27,61,.14)}

/* Chat keeps the conversation visually stable while the composer stays reachable. */
.chat-page{min-height:calc(100dvh - 150px);padding-bottom:72px}.chat-page #chatBookingSummary{position:sticky;top:calc(64px + var(--safe-top) + 2px);z-index:3;background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(11px);border-radius:16px;box-shadow:0 5px 18px rgba(13,27,61,.08)}
.chat-list{padding:5px 1px 10px}.chat-message{border-radius:17px 17px 17px 5px;box-shadow:0 3px 12px rgba(13,27,61,.055)}.chat-message.mine{border-radius:17px 17px 5px 17px}
.chat-composer{left:max(12px,calc((100vw - var(--content-max))/2 + 12px));right:max(12px,calc((100vw - var(--content-max))/2 + 12px));background:color-mix(in srgb,var(--surface) 96%,transparent);backdrop-filter:blur(14px)}
.chat-composer .input{border:0;background:transparent;box-shadow:none}.chat-composer .button{min-height:45px;height:45px;width:45px;border-radius:14px;padding:0}

@media(prefers-color-scheme:dark){
  .date-chip{background:var(--surface)}
  .booking-page .journey-actions{background:color-mix(in srgb,var(--cream) 88%,transparent)}
  .notification-item.unread{background:linear-gradient(100deg,color-mix(in srgb,var(--pink-soft) 72%,var(--surface)),var(--surface) 52%)}
}
.fatal-start{min-height:100dvh;display:grid;place-items:center;padding:24px;background:var(--cream);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text)}.fatal-start>div{width:min(100%,420px);background:var(--surface);border:1px solid var(--border);border-radius:24px;padding:25px;text-align:center;box-shadow:var(--shadow)}.fatal-start img{width:150px;height:auto;margin:0 auto 18px}.fatal-start h1{font-size:1.3rem;letter-spacing:-.03em}.fatal-start p{font-size:.82rem;color:var(--muted);line-height:1.55;margin:8px 0 18px}.fatal-start button{min-height:50px;width:100%;border:0;border-radius:14px;background:var(--navy);color:#fff;font-weight:850}.fatal-start pre{margin-top:14px;text-align:left;white-space:pre-wrap;font-size:.68rem;max-height:180px;overflow:auto;background:var(--surface-2);padding:10px;border-radius:10px}

/* Density + widescreen layout pass: fuller composition, stronger grouping,
   and laptop-friendly use of space without breaking mobile flows. */
.home-dashboard,.page-split,.page-main-stack,.page-side-stack,.skills-form-stack{display:grid;gap:14px}
.home-dashboard__main,.home-dashboard__aside{display:grid;gap:14px;align-content:start}
.dashboard-panel{position:relative;background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 96%,transparent),color-mix(in srgb,var(--surface-accent) 52%,var(--surface)));border:1px solid var(--hairline);border-radius:24px;padding:17px;box-shadow:var(--shadow-sm);overflow:hidden}
.dashboard-panel::before{content:"";position:absolute;inset:auto -46px -58px auto;width:170px;height:170px;border-radius:50%;background:radial-gradient(circle,rgba(240,107,152,.08),transparent 68%);pointer-events:none}
.dashboard-panel::after{content:"";position:absolute;left:-22px;top:-28px;width:112px;height:112px;border-radius:50%;background:radial-gradient(circle,rgba(30,42,68,.035),transparent 72%);pointer-events:none}
.dashboard-panel>.section-head:first-child,.page-main-stack>.section-head:first-child,.page-side-stack>.section-head:first-child{margin-top:0}
.dashboard-panel .section-head{margin-bottom:14px}
.dashboard-panel .card-stack,.page-main-stack .card-stack,.page-side-stack .card-stack{gap:12px}
.page-main-stack>.card:first-child,.page-side-stack>.card:first-child,.skills-info-card{position:relative;overflow:hidden}
.page-main-stack>.card:first-child::after,.page-side-stack>.card:first-child::after,.skills-info-card::after{content:"";position:absolute;right:-64px;top:-72px;width:170px;height:170px;border-radius:50%;background:radial-gradient(circle,rgba(240,107,152,.08),transparent 68%);pointer-events:none}
.page-main-stack>.card:first-child::before,.page-side-stack>.card:first-child::before,.skills-info-card::before{content:"";position:absolute;left:-44px;bottom:-64px;width:156px;height:156px;border-radius:50%;background:radial-gradient(circle,rgba(30,42,68,.03),transparent 70%);pointer-events:none}
.page-side-stack--listing{align-content:start}
.home-dashboard #nextBooking,.home-dashboard #adsSection #adsList{position:relative;z-index:1}
.home-dashboard .quick-actions--home{grid-template-columns:repeat(2,minmax(0,1fr))}
.home-dashboard .quick-action{min-height:88px;align-items:flex-start}
.home-dashboard .quick-action__icon{width:44px;height:44px;border-radius:14px}
.work-status-card,.metric-tile,.dashboard-panel,.page-main-stack>.card:first-child,.page-side-stack>.card:first-child,.skills-info-card{backdrop-filter:saturate(1.03)}
.metric-tile{padding:13px 12px;min-height:82px;align-items:flex-start}
.metric-tile strong{font-size:.9rem;line-height:1.25;white-space:normal}
.metric-tile small{font-size:.64rem}
.home-metrics{gap:11px}
.booking-card,.document-card,.notification-item,.profile-menu a,.profile-menu button{background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 98%,transparent),color-mix(in srgb,var(--surface-accent) 26%,var(--surface)))}
#scheduleList .booking-card,#bookingList .booking-card,#earningsList>.card,#documentList>.card,#supportList>.card,#notificationList>.card{min-height:100%}
#scheduleList,#bookingList,#notificationList{gap:14px}
#earningsStats{gap:14px}
#earningsStats .stat-card{min-height:116px}
#earningsStats .stat-card strong{font-size:1.08rem}
.skills-info-card{padding:20px;border-radius:23px}
.skills-info-points{display:grid;gap:11px;margin-top:14px;position:relative;z-index:1}
.skills-info-points>div{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start;padding:12px 12px;border-radius:16px;background:color-mix(in srgb,var(--surface-2) 74%,transparent);border:1px solid var(--border)}
.skills-info-points span{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:var(--pink-soft);color:var(--pink-2)}
.skills-info-points span svg{width:17px}
.skills-info-points strong{display:block;font-size:.82rem;line-height:1.25}
.skills-info-points small{display:block;font-size:.7rem;color:var(--muted);line-height:1.45;margin-top:2px}
.page-split--earnings #earningsList{gap:12px}
.page-split--earnings #earningsList>.card{padding:15px}
.page-split--content .page-main-stack>.section-head,.page-split--content .page-side-stack>.section-head{padding-inline:2px}
.documents-page #documentForm,.support-page #supportForm,.profile-page #profileForm{position:relative;overflow:hidden}
.documents-page #documentForm::after,.support-page #supportForm::after,.profile-page #profileForm::after{content:"";position:absolute;right:-50px;bottom:-60px;width:148px;height:148px;border-radius:50%;background:radial-gradient(circle,rgba(240,107,152,.06),transparent 69%);pointer-events:none}
.skills-page #skillsList{gap:10px}
.skills-page #skillsList>.card,.documents-page #documentList>.card,.support-page #supportList>.card,.notifications-page #notificationList>.card{border-radius:18px}
.login-brand{gap:14px}

@media(min-width:768px){
  .home-dashboard .quick-actions--home{grid-template-columns:repeat(2,minmax(0,1fr))}
  #scheduleList,#bookingList,#notificationList{grid-template-columns:repeat(2,minmax(0,1fr))}
  .service-choice-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .setup-card__body .grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(min-width:1024px){
  :root{--content-max:1180px}
  .app-header{padding-left:max(16px,calc((100vw - var(--content-max))/2 + 16px));padding-right:max(16px,calc((100vw - var(--content-max))/2 + 16px))}
  .page-host{padding-left:24px;padding-right:24px;padding-top:calc(64px + var(--safe-top) + 22px)}
  .bottom-nav{left:50%;right:auto;transform:translateX(-50%);width:min(720px,calc(100vw - 64px));bottom:18px;padding:6px 8px}
  .bottom-nav a{font-size:.68rem}

  .auth-wrap{width:min(100%,1100px);grid-template-columns:minmax(320px,1fr) minmax(440px,520px);grid-template-areas:"brand card" "brand footer";align-content:center;align-items:center;column-gap:42px;row-gap:18px;padding-left:24px;padding-right:24px}
  .login-brand{grid-area:brand;align-items:flex-start;justify-content:center;min-height:420px;padding:34px;border:1px solid var(--hairline);border-radius:32px;background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 96%,transparent),color-mix(in srgb,var(--surface-accent) 52%,var(--surface)));box-shadow:var(--shadow-md);position:relative;overflow:hidden}
  .login-brand::before{content:"HELPER APP";display:inline-flex;align-items:center;justify-content:center;font-size:.68rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:var(--pink-2);border:1px solid var(--border);border-radius:999px;background:color-mix(in srgb,var(--surface) 88%,transparent);padding:7px 10px}
  .login-brand::after{content:"Go online, manage bookings, track earnings and keep your account ready — without the clutter.";display:block;max-width:28ch;font-size:1.05rem;line-height:1.6;color:var(--muted);margin-top:4px}
  .login-brand img{width:220px;max-width:100%;margin-top:10px}
  .partner-pill{order:3;margin-top:0}
  .auth-card{grid-area:card;max-width:520px;justify-self:end}
  .auth-footer{grid-area:footer;text-align:left;padding-top:0;padding-left:6px;margin-top:0}

  .home-dashboard{grid-template-columns:minmax(0,1.16fr) minmax(350px,.84fr);gap:18px}
  .home-dashboard__main,.home-dashboard__aside{gap:18px}
  .home-dashboard .home-welcome-row{margin-bottom:2px}
  .home-dashboard .work-status-card{min-height:246px;padding:22px}
  .home-dashboard .dashboard-panel{padding:18px 18px 17px}
  .home-dashboard .quick-actions--home{grid-template-columns:1fr 1fr}
  .home-dashboard .quick-action{min-height:96px;padding:16px 14px}
  .home-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .metric-tile{min-height:94px;padding:14px}

  .page-split{grid-template-columns:minmax(0,1fr) minmax(340px,.92fr);gap:20px;align-items:start}
  .page-side-stack{position:sticky;top:calc(70px + var(--safe-top));align-self:start}
  .page-split--earnings{grid-template-columns:minmax(0,1.02fr) minmax(360px,.98fr)}
  .page-split--earnings .page-side-stack{position:static}
  .profile-page .page-split{grid-template-columns:minmax(0,1fr) minmax(320px,.88fr)}

  .schedule-page,.bookings-page,.notifications-page{max-width:none}
  .schedule-page #scheduleList,.bookings-page #bookingList,.notifications-page #notificationList{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  .schedule-page #scheduleList .page-state,.bookings-page #bookingList .page-state,.notifications-page #notificationList .page-state{grid-column:1/-1}
  .schedule-date{position:sticky;top:calc(66px + var(--safe-top));z-index:5;background:linear-gradient(180deg,var(--cream),color-mix(in srgb,var(--cream) 76%,transparent));padding-top:8px;margin-top:-2px}

  .setup-page{max-width:1180px;padding-left:24px;padding-right:24px}
  .setup-topbar{margin-bottom:18px}
  .setup-progress-card{padding:16px 18px}
  .setup-sections{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .setup-finish{grid-column:1/-1;padding-top:6px}
  .setup-card{min-height:100%}
  .service-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}

  .chat-page{max-width:980px;margin:0 auto;padding-bottom:90px}
  .chat-list{gap:11px}
  .chat-message{max-width:74%}
}

@media(min-width:1320px){
  :root{--content-max:1260px}
  .home-dashboard{grid-template-columns:minmax(0,1.2fr) minmax(380px,.8fr)}
  .page-split{grid-template-columns:minmax(0,1.06fr) minmax(380px,.94fr)}
  .schedule-page #scheduleList,.bookings-page #bookingList,.notifications-page #notificationList{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(prefers-color-scheme:dark){
  .dashboard-panel,.login-brand,.booking-card,.document-card,.notification-item,.profile-menu a,.profile-menu button{background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 96%,transparent),color-mix(in srgb,var(--surface-accent) 48%,var(--surface)))}
  .skills-info-points>div{background:color-mix(in srgb,var(--surface-2) 84%,transparent)}
}

/* Layout-stability pass: reserve the final UI footprint before API data arrives.
   Skeletons mirror the real cards instead of collapsing dynamic containers. */
.skeleton{display:block;border-radius:9px;min-width:1px;min-height:1px}
.skeleton-grow{min-width:0;flex:1;display:grid;gap:7px;align-content:center}
.skeleton-row{display:flex;align-items:center;gap:11px;min-width:0}
.skeleton-line{height:10px;width:100%}
.skeleton-line--xs{width:34%;height:8px}
.skeleton-line--sm{width:48%;height:9px}
.skeleton-line--mid{width:68%}
.skeleton-line--md{width:58%;height:13px}
.skeleton-line--wide{width:88%;height:9px}
.skeleton-line--title{width:min(260px,72%);height:21px}
.skeleton-line--hero{width:min(230px,65%);height:34px;margin-top:12px}
.skeleton-circle{border-radius:50%;flex:0 0 auto}
.skeleton-circle--dot{width:12px;height:12px}
.skeleton-circle--icon{width:38px;height:38px;border-radius:13px}
.skeleton-circle--avatar{width:50px;height:50px;border-radius:17px}
.skeleton-circle--profile{width:82px;height:82px;border-radius:20px}
.skeleton-circle--step{width:34px;height:34px;border-radius:11px}
.skeleton-pill{width:72px;height:26px;border-radius:999px;flex:0 0 auto}
.skeleton-pill--toggle{width:58px;height:34px}
.skeleton-pill--button{width:72px;height:38px;border-radius:12px}
.skeleton-input{height:51px;border-radius:14px}
.skeleton-area{height:110px;border-radius:14px}
.skeleton-button{height:50px;border-radius:14px}
.skeleton-choice{height:58px;border-radius:15px}
.skeleton-notice{height:54px;border-radius:15px;width:100%}
.skeleton-card{position:relative;overflow:hidden;background:var(--surface);border:1px solid var(--hairline);box-shadow:var(--shadow-sm)}
.skeleton-card::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 24%,rgba(255,255,255,.48) 40%,transparent 58%);transform:translateX(-120%);animation:stableCardShimmer 1.35s linear infinite;pointer-events:none}
@keyframes stableCardShimmer{to{transform:translateX(120%)}}

.stable-home-loading{min-height:560px}
.home-dashboard--skeleton{align-items:start}
.loading-welcome{min-height:52px}
.loading-work-card{min-height:220px;display:grid;align-content:start;gap:12px}
.loading-gps{margin-top:auto;min-height:59px}
.loading-metrics .loading-metric{min-height:82px}
.loading-dashboard-panel{min-height:190px}
.loading-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:38px;margin-bottom:14px}
.loading-section-head>div{display:grid;gap:7px;flex:1}
.loading-action{pointer-events:none}

.stable-slot--earnings,.earnings-page #earningsSummary{min-height:150px}
.stable-slot--profile,.profile-page #profileHeader{min-height:210px}
.stable-slot--notice,.profile-page #profileApproval{min-height:54px}
.stable-slot--chat-summary,.chat-page #chatBookingSummary{min-height:68px}
.stable-grid{align-items:stretch}
.stat-skeleton{min-height:116px;display:grid;align-content:center;gap:12px}
.list-skeleton{min-height:118px}
.booking-skeleton{min-height:132px;border-radius:20px;padding:17px;display:grid;align-content:space-between;gap:22px}
.booking-skeleton:empty{background:
  linear-gradient(var(--surface),var(--surface)) padding-box,
  linear-gradient(90deg,var(--border),transparent) border-box}
.document-skeleton{min-height:96px;border-radius:18px}
.ticket-skeleton{min-height:152px;border-radius:18px}
.notification-skeleton{min-height:96px;border-radius:18px}
.skill-skeleton{min-height:72px;border-radius:18px}

/* Real content receives the same minimum footprint as its initial shell. */
.booking-card{min-height:132px}
.documents-page .document-card{min-height:96px}
.support-page #supportList>.card{min-height:152px}
.notifications-page .notification-item{min-height:96px}
.skills-page #skillsList>label.card{min-height:72px}
.earnings-page #earningsList>.card{min-height:118px}
.earnings-page #earningsStats .stat-card{min-height:116px}
.date-chip--skeleton{height:59px;padding:0;pointer-events:none;border:0}
.stable-date-strip{min-height:70px}

.booking-detail-skeleton{display:grid;gap:12px;min-height:620px}
.booking-detail-skeleton__hero{min-height:205px;padding:18px;display:grid;align-content:start;gap:10px}
.booking-detail-skeleton__card{min-height:165px}
.booking-detail-skeleton__timeline{min-height:280px}
.skeleton-section-title{display:grid;gap:7px;min-height:48px;align-content:end;padding:0 2px}
.booking-page #bookingDetail{min-height:560px}

.setup-skeletons--stable .setup-card-skeleton{min-height:100%}
.setup-card-skeleton .setup-card__head>div{display:grid;gap:7px}
.setup-card-skeleton .setup-card__body{display:grid;gap:14px}

.stable-chat-list{min-height:clamp(280px,46vh,520px);transition:opacity .12s ease}
.stable-chat-list:not(.is-ready){background:linear-gradient(180deg,color-mix(in srgb,var(--surface-2) 62%,transparent),transparent 68%);border-radius:20px;position:relative;overflow:hidden}
.stable-chat-list:not(.is-ready)::before,.stable-chat-list:not(.is-ready)::after{content:"";position:absolute;height:54px;border-radius:16px;background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-sm)}
.stable-chat-list:not(.is-ready)::before{left:0;top:24px;width:min(72%,390px)}
.stable-chat-list:not(.is-ready)::after{right:0;top:92px;width:min(61%,330px)}

/* Refetch without deleting the current layout. */
.stable-list,.schedule-page #scheduleList,.bookings-page #bookingList,.documents-page #documentList,.notifications-page #notificationList{transition:opacity .14s ease,filter .14s ease}
.is-refreshing{opacity:.72;filter:saturate(.88)}
.is-refreshing>*{pointer-events:none}

@media(max-width:767px){
  .stable-home-loading{min-height:920px}
  .loading-dashboard-panel{min-height:188px}
  .booking-detail-skeleton{min-height:720px}
  .booking-detail-skeleton__timeline{min-height:270px}
}

@media(min-width:1024px){
  .stable-home-loading{min-height:600px}
  .loading-work-card{min-height:246px}
  .loading-dashboard-panel:first-child{min-height:210px}
  .loading-dashboard-panel:nth-child(2){min-height:255px}
  .page-split--content .stable-list{min-height:220px}
  .booking-detail-skeleton{max-width:980px;margin:0 auto;min-height:620px}
  .stable-chat-list{min-height:520px}
}

@media(prefers-color-scheme:dark){
  .skeleton-card::after{background:linear-gradient(100deg,transparent 24%,rgba(255,255,255,.055) 40%,transparent 58%)}
  .stable-chat-list:not(.is-ready){background:linear-gradient(180deg,color-mix(in srgb,var(--surface-2) 68%,transparent),transparent 68%)}
}

/* Fully validated account gate for job search. */
.work-status-card[data-job-search-locked="true"]{border-color:color-mix(in srgb,var(--warning) 28%,var(--border));background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--warning-soft) 30%,var(--surface)))}
.work-status-card[data-job-search-locked="true"]::before{background:linear-gradient(var(--warning),var(--pink))}
.work-status-card[data-job-search-locked="true"] .toggle{opacity:.48;filter:saturate(.55)}
.work-status-card[data-job-search-locked="true"] .toggle-track{cursor:not-allowed}

/* 2.1.14 login layout repair. The desktop authentication layout now explicitly
   becomes a grid instead of relying on grid-area declarations on a flex parent. */
.login-brand__top{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%}
.auth-desktop-copy{display:none}
@media(min-width:1024px){
  .auth-wrap{display:grid!important;grid-template-columns:minmax(320px,1fr) minmax(440px,520px);grid-template-areas:"brand card" "brand footer";align-content:center;align-items:center;column-gap:42px;row-gap:18px}
  .login-brand{grid-area:brand;display:flex;flex-direction:column;align-items:stretch;justify-content:center;min-height:440px;margin:0;padding:36px;border:1px solid var(--hairline);border-radius:32px;background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 96%,transparent),color-mix(in srgb,var(--surface-accent) 52%,var(--surface)));box-shadow:var(--shadow-md);position:relative;overflow:hidden}
  .login-brand::before,.login-brand::after{content:none!important;display:none!important}
  .login-brand__top{justify-content:flex-start;align-items:center;flex-wrap:wrap}
  .login-brand img{width:220px;max-width:100%;margin:0}
  .partner-pill{margin-left:auto}
  .auth-desktop-copy{display:block;margin-top:34px;max-width:520px}
  .auth-desktop-copy h2{font-size:1.7rem;line-height:1.16;letter-spacing:-.04em;margin:7px 0 10px;color:var(--text)}
  .auth-desktop-copy>p:last-of-type{font-size:.9rem;line-height:1.62;color:var(--muted);max-width:48ch}
  .auth-feature-list{display:grid;gap:10px;margin-top:22px}
  .auth-feature-list>div{display:grid;grid-template-columns:42px minmax(0,1fr);gap:11px;align-items:center;padding:11px 12px;border:1px solid var(--border);border-radius:15px;background:color-mix(in srgb,var(--surface) 78%,transparent)}
  .auth-feature-list>div>span{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:var(--pink-soft);color:var(--pink-2)}
  .auth-feature-list svg{width:19px;height:19px}
  .auth-feature-list strong{display:block;font-size:.82rem}
  .auth-feature-list small{display:block;color:var(--muted);font-size:.69rem;line-height:1.4;margin-top:2px}
  .auth-card{grid-area:card;width:100%;max-width:520px;justify-self:end;margin:0}
  .auth-footer{grid-area:footer;text-align:left;padding:0 0 0 6px;margin:0}
}
