/* FITRICH App v48 — social-commerce Shop, editorial Routine and cinematic Profile. */

/* SHOP — one edge-to-edge unisex opener followed by a compact TikTok-like shop feed. */
#view-shop .shop-intro{
  min-height:clamp(430px,54svh,590px);margin:0!important;padding:34px 22px!important;border:0!important;
  display:flex!important;flex-direction:column;justify-content:flex-end;gap:14px;color:#fff;
  background:linear-gradient(180deg,rgba(6,8,7,.06) 16%,rgba(6,8,7,.18) 49%,rgba(6,8,7,.9) 100%),url("assets/lifestyle-haircare-v1.jpg") center 44%/cover no-repeat!important;
  isolation:isolate
}
#view-shop .shop-intro:after{display:none!important}
#view-shop .shop-intro>div span{color:var(--fitrich-sage)!important;font-size:10px;line-height:1.35;letter-spacing:.13em;text-shadow:0 2px 12px rgba(0,0,0,.45)}
#view-shop .shop-intro h2{max-width:370px;margin:10px 0 0;color:#fff;font-size:clamp(48px,13vw,66px);line-height:.86;letter-spacing:-.07em;text-wrap:balance}
#view-shop .shop-intro p{max-width:345px;margin:0;color:rgba(255,255,255,.79)!important;font-size:15px!important;line-height:1.5}
#view-shop .shop-tools{top:87px;margin:0;padding:10px 12px!important;border:0!important;border-bottom:1px solid rgba(11,13,12,.12)!important;background:rgba(249,249,246,.94)!important;box-shadow:0 6px 18px rgba(11,13,12,.04);backdrop-filter:blur(18px)}
#view-shop .app-filters{gap:7px}
#view-shop .app-filters button,#view-shop .bag-preview{min-height:42px;padding:0 15px;border:0!important;border-radius:999px!important;background:#e5e7e3!important;color:#333936!important;font-size:10px!important;letter-spacing:.08em}
#view-shop .app-filters button.active{background:var(--fitrich-black)!important;color:#fff!important}
#view-shop .bag-preview{background:var(--fitrich-sage)!important;color:#11241d!important}
#view-shop .bag-preview b{font-size:11px}
#view-shop .app-product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;margin:2px 0 0!important;background:#d9dcd8}
#view-shop .app-product{min-width:0;min-height:420px!important;border:0!important;background:#f8f8f5!important;box-shadow:none!important}
#view-shop .app-product-art{height:235px!important}
#view-shop .app-product-copy{padding:15px 14px 14px!important}
#view-shop .app-product-copy>span{color:var(--fitrich-sage-deep)!important;font-size:9px!important;line-height:1.3;letter-spacing:.12em}
#view-shop .app-product-copy h3{margin:8px 0 7px;font-size:18px!important;line-height:1.02!important;letter-spacing:-.045em}
#view-shop .app-product-copy p{min-height:35px;margin:0 0 12px;color:#6e7571!important;font-size:12px!important;line-height:1.42}
#view-shop .app-product-buy strong{font-size:15px;line-height:1}
#view-shop .app-product-buy small{font-size:8px!important;line-height:1.15}
#view-shop .app-product-copy .product-plus{width:42px!important;height:42px!important;border:0!important;background:var(--fitrich-black)!important;color:#fff!important;font-size:19px!important}
#view-shop .app-product-copy .product-plus:disabled{background:#d9dcd8!important;color:#858b87!important}
#view-shop .app-product-view{margin-top:15px!important;padding-top:12px!important;font-size:9px!important;line-height:1.25}
#view-shop .app-product-view b{font-size:18px!important}

/* ROUTINE — clear editorial choices and a cinematic result, not a form dashboard. */
#view-routine .routine-layout{display:block!important;margin:0!important;background:#fafaf7!important}
#view-routine .routine-builder{margin:0!important;padding:36px 20px 20px!important;border:0!important;background:#fafaf7!important}
#view-routine .routine-builder .card-head span{color:var(--fitrich-sage-deep)!important;font-size:10px!important;letter-spacing:.14em}
#view-routine .routine-builder .card-head h2{max-width:340px;margin:10px 0 0;font-size:clamp(42px,12vw,58px)!important;line-height:.88!important;letter-spacing:-.07em!important}
#view-routine .builder-row,#view-routine .builder-row:first-of-type{display:block!important;margin:0!important;padding:25px 0!important;border:0!important;border-top:1px solid rgba(11,13,12,.14)!important}
#view-routine .builder-row:first-of-type{margin-top:31px!important}
#view-routine .builder-row p{gap:12px}
#view-routine .builder-row p span{color:var(--fitrich-sage-deep)!important;font-size:11px!important;font-weight:800!important}
#view-routine .builder-row p b{color:#1c211f!important;font-size:12px!important;line-height:1.25;letter-spacing:.1em}
#view-routine .builder-row>div{justify-content:flex-start!important;gap:8px!important;margin-top:16px!important;padding-bottom:2px;overflow-x:auto;scrollbar-width:none}
#view-routine .builder-row>div::-webkit-scrollbar{display:none}
#view-routine .builder-row button{min-height:44px;padding:0 17px!important;border:0!important;border-radius:999px!important;background:#e6e8e4!important;color:#323936!important;font-size:11px!important;letter-spacing:.07em;white-space:nowrap}
#view-routine .builder-row button.active{background:var(--fitrich-black)!important;color:#fff!important}
#view-routine .routine-result{min-height:clamp(610px,78svh,760px)!important;margin:0!important;padding:44px 22px 38px!important;border:0!important;color:#fff!important;background:linear-gradient(180deg,rgba(5,7,6,.21),rgba(5,7,6,.48) 46%,rgba(5,7,6,.95) 100%),url("assets/lifestyle-facecare-v1.jpg") center/cover no-repeat!important}
#view-routine .result-orbit{width:176px!important;height:176px!important;border-color:rgba(143,225,207,.68)!important;background:rgba(7,10,8,.2);color:#fff!important;font-size:48px!important;backdrop-filter:blur(4px)}
#view-routine .result-orbit:before{border-color:rgba(255,255,255,.24)!important}
#view-routine .result-orbit i{background:var(--fitrich-sage)!important}
#view-routine .routine-result>small{margin-top:32px!important;color:var(--fitrich-sage)!important;font-size:10px!important;letter-spacing:.14em}
#view-routine .routine-result h2{max-width:350px;margin:12px 0 18px!important;color:#fff!important;font-size:clamp(42px,12vw,58px)!important;line-height:.88!important;letter-spacing:-.07em!important}
#view-routine .routine-result ol{width:min(100%,360px)!important;margin-bottom:22px!important;border:0!important}
#view-routine .routine-result li{padding:14px 0!important;border-color:rgba(255,255,255,.3)!important;color:rgba(255,255,255,.82)!important;font-size:14px!important;line-height:1.35}
#view-routine .routine-result li:before{color:var(--fitrich-sage)!important;font-size:9px!important}
#view-routine .routine-result>button{min-height:48px;padding:0 19px;border:1px solid rgba(255,255,255,.6)!important;border-radius:999px;background:rgba(7,10,8,.28)!important;color:#fff!important;font-size:11px!important;backdrop-filter:blur(9px)}

/* PROFILE — FITRICH identity as a full-screen portrait, followed by native list controls. */
#view-profile .profile-layout{display:block!important;margin:0!important;background:#fafaf7!important}
#view-profile .profile-card{min-height:clamp(560px,72svh,700px)!important;margin:0!important;padding:40px 22px 34px!important;border:0!important;align-items:flex-start!important;justify-content:flex-end!important;text-align:left!important;color:#fff;background:linear-gradient(180deg,rgba(5,7,6,.04) 22%,rgba(5,7,6,.17) 47%,rgba(5,7,6,.93) 100%),url("assets/hero-sovereign-v2-optimized.jpg") center 34%/cover no-repeat!important}
#view-profile .profile-avatar{width:auto!important;height:auto!important;border:0!important;border-radius:0!important;display:block!important;color:#fff!important;background:none!important;font-size:clamp(92px,28vw,138px)!important;line-height:.7!important;letter-spacing:-.12em;text-shadow:0 7px 28px rgba(0,0,0,.38)}
#view-profile .profile-card>span{margin-top:29px!important;color:var(--fitrich-sage)!important;font-size:10px!important;letter-spacing:.16em}
#view-profile .profile-card h2{margin:9px 0 6px!important;color:#fff!important;font-size:clamp(38px,10vw,50px)!important;line-height:.9!important;letter-spacing:-.065em!important}
#view-profile .profile-card p{max-width:310px;margin:0!important;color:rgba(255,255,255,.73)!important;font-size:14px!important;line-height:1.5}
#view-profile .profile-card button{min-height:47px;margin-top:21px!important;padding:0 17px!important;border:1px solid rgba(255,255,255,.58)!important;border-radius:999px;background:rgba(8,10,9,.27)!important;color:#fff!important;font-size:11px!important;backdrop-filter:blur(8px)}
#view-profile .settings-card{margin:0!important;padding:34px 20px 48px!important;border:0!important;background:#fafaf7!important}
#view-profile .settings-head{margin:0 0 26px!important}
#view-profile .settings-head span{color:var(--fitrich-sage-deep)!important;font-size:10px!important;letter-spacing:.14em}
#view-profile .settings-head h2{margin:10px 0 0;font-size:clamp(38px,10vw,48px)!important;line-height:.9;letter-spacing:-.065em}
#view-profile .setting-row{min-height:73px!important;padding:0 2px!important;border:0!important;border-top:1px solid rgba(11,13,12,.15)!important;color:#151a18!important}
#view-profile .setting-row:last-child{border-bottom:1px solid rgba(11,13,12,.15)!important}
#view-profile .setting-row>span{gap:13px!important;min-width:0}
#view-profile .setting-row i{width:40px!important;height:40px!important;border:0!important;border-radius:50%!important;background:#e2e6e1!important;color:#163b30!important;font-size:12px!important;flex:0 0 auto}
#view-profile .setting-row b{color:#151a18!important;font-size:12px!important;line-height:1.25;letter-spacing:.08em}
#view-profile .setting-row em{max-width:42%;overflow:hidden;color:#747b77!important;font-size:10px!important;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}

@media(min-width:761px){
  #view-shop .shop-intro,#view-shop .shop-tools,#view-shop .app-product-grid,#view-routine .routine-builder,#view-routine .routine-result,#view-profile .profile-card,#view-profile .settings-card{width:calc(100% + 30px);margin-inline:-15px!important}
}
@media(max-width:420px){
  #view-shop .shop-intro{min-height:49svh;padding:29px 19px!important;background-position:center 42%!important}
  #view-shop .shop-intro h2{font-size:49px}
  #view-shop .shop-intro p{font-size:14px!important}
  #view-shop .app-product{min-height:405px!important}
  #view-shop .app-product-art{height:220px!important}
  #view-shop .app-product-copy{padding:14px 12px!important}
  #view-shop .app-product-copy h3{font-size:17px!important}
  #view-shop .app-product-copy p{font-size:11px!important}
  #view-routine .routine-builder{padding-top:31px!important}
  #view-routine .routine-result{min-height:72svh!important}
  #view-profile .profile-card{min-height:68svh!important;background-position:center 34%!important}
}