/* Qom 6.6: consolidated experience stylesheet. Priority: base > fixes > balanced theme. */

/* --- experience-v60.css --- */
/* Qom 5.8: GPU-friendly panoramic photo layers, functional controls and contextual install panel. */
.qom-live-hero .hero-scene>img.scene-active{opacity:0!important;animation:none!important}
.qom-live-hero .hero-scene .qom-live-layers{position:absolute;inset:-10px;z-index:1;transform:translate3d(var(--scene-x,0px),var(--scene-y,0px),0);transition:transform .35s ease-out;pointer-events:none}
.qom-live-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 43%;opacity:0;transform:scale(1.065);transition:opacity 1.2s ease,transform 9s ease;pointer-events:none}
.qom-live-photo[data-active=true]{opacity:1;transform:scale(1.0)}
.qom-live-hero .hero-scene{background:linear-gradient(125deg,#a8dce1,#d6e7c5)}
.qom-live-hero .hero-scene::before{content:'';z-index:2;position:absolute;inset:0;pointer-events:none;background:linear-gradient(150deg,#e6b96b16,transparent 45%,#0f769126)}
.qom-live-hero .hero-scene-controls{display:none!important}
.qom-live-controls{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:8px;margin:14px auto 4px;flex-wrap:wrap;max-width:100%;color:#153d4b}
.qom-live-title{font-size:12px;font-weight:700;text-align:center;max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qom-live-button,.qom-live-gallery{display:inline-flex;align-items:center;justify-content:center;min-width:35px;min-height:35px;border:1px solid #abd7da;border-radius:999px;background:#ffffffe7;color:#125773;font:inherit;cursor:pointer;box-shadow:0 4px 12px #205f7513}
.qom-live-button{font-size:19px}.qom-live-pause{font-size:15px}
.qom-live-gallery{min-width:0;padding:5px 12px;font-size:12px;font-weight:700;text-decoration:none}
.qom-live-button:focus-visible,.qom-live-gallery:focus-visible{outline:3px solid #087fa5;outline-offset:2px}
.qom-install-dialog{position:fixed;z-index:10050;direction:rtl;inset:auto 50% max(18px,env(safe-area-inset-bottom)) auto;transform:translateX(50%);width:min(470px,calc(100% - 30px));display:grid;grid-template-columns:50px 1fr 25px;gap:11px 12px;align-items:start;padding:18px 16px 16px;border:1px solid #c4e8e5;border-radius:25px;background:linear-gradient(128deg,#fffffff7,#e4f9f5f7);color:#164252;box-shadow:0 14px 48px #123f5060;animation:qom-arrive .32s ease-out;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px)}
.qom-install-dialog>img{grid-column:1;width:48px;height:48px;object-fit:contain;border-radius:13px}
.qom-install-copy{grid-column:2;display:grid;gap:4px;min-width:0}.qom-install-copy strong{font-size:14px;line-height:1.6}.qom-install-copy p{font-size:12px;color:#476874;line-height:1.8;margin:0}
.qom-install-actions{grid-column:1/4;display:flex;align-items:center;gap:9px;margin-top:4px}.qom-install-actions button{border-radius:999px;min-height:42px;padding:9px 17px;font:inherit;cursor:pointer;font-size:13px;font-weight:700}.qom-install-primary{border:1px solid #0781a0;background:var(--qom-sdk-accent,#087fa5);color:white}.qom-install-later{border:1px solid #c4dcd9;background:white;color:#315d6a}
.qom-install-close{grid-column:3;grid-row:1;border:0;background:transparent;color:#416a76;font-size:23px;cursor:pointer;width:27px;height:30px}
.qom-sdk-extras{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:12px;border-top:1px solid #d9e8e6;padding-top:12px}.qom-sdk-extras-label{flex-basis:100%;font-size:12px;color:#456b75}.qom-sdk-extras button{border:1px solid #b9deda;border-radius:999px;background:#f3faf8;color:#12657c;padding:9px 13px;font:inherit;font-size:12px;cursor:pointer}
html[data-qom-host=eitaa] .qom-install-dialog{bottom:calc(95px + max(env(safe-area-inset-bottom),var(--eitaa-bottom,0px)))}
@keyframes qom-arrive{from{opacity:0;transform:translate(50%,14px)}to{opacity:1;transform:translate(50%,0)}}
@media (min-width:900px){.qom-live-hero .qom-live-photo{object-position:50% 48%}}
@media (max-width:380px){.qom-live-title{max-width:135px;font-size:11px}.qom-live-controls{gap:5px}.qom-live-gallery{font-size:11px;padding:5px 7px}}
@media (prefers-reduced-motion:reduce){.qom-live-photo,.qom-live-hero .qom-live-layers,.qom-install-dialog{animation:none!important;transition:none!important}}
html[data-motion=minimal] .qom-live-photo,html[data-motion=minimal] .qom-live-hero .qom-live-layers,html[data-motion=minimal] .qom-install-dialog{animation:none!important;transition:none!important}
html[data-performance=optimized] .qom-live-hero .qom-live-layers{transform:none!important;transition:none!important}
/* Override original .hero-scene img rules from the legacy compiled theme. */
.qom-live-hero .hero-scene .qom-live-photo{opacity:0!important;animation:none!important;transform:scale(1.065)}
.qom-live-hero .hero-scene .qom-live-photo[data-active="true"]{opacity:1!important;transform:scale(1)}
@media(prefers-reduced-motion:reduce){.qom-live-hero .hero-scene .qom-live-photo{transform:none!important}}
html[data-motion=minimal] .qom-live-hero .hero-scene .qom-live-photo{transform:none!important}


/* --- experience-v63.css --- */
/* v6.2 — a single photographic, softly blended hero; no decorative shrine cutouts. */
.qom-v62-hero.immersive-hero{
  isolation:isolate;position:relative;overflow:hidden;
  min-height:clamp(525px,51vw,620px);margin:0 -22px 14px;
  padding:90px 28px 34px;border:0;border-radius:0;box-shadow:none;
  background:linear-gradient(150deg,#f4fbf9 0%,#f4f9fb 42%,#f9f5e8 100%);
}
.qom-v62-hero .hero-scene{
  position:absolute!important;z-index:-1!important;
  inset:-40px -25px auto!important;width:calc(100% + 50px)!important;
  height:clamp(430px,46vw,570px)!important;
  overflow:hidden;background:transparent!important;
  -webkit-mask-image:radial-gradient(ellipse 68% 76% at 51% 42%,black 40%,transparent 100%)!important;
  mask-image:radial-gradient(ellipse 68% 76% at 51% 42%,black 40%,transparent 100%)!important;
}
.qom-v62-hero .hero-scene>img.scene-active{
  display:block!important;position:absolute!important;inset:0;width:100%;height:100%;
  opacity:.90!important;object-fit:cover;object-position:center 50%;
  filter:saturate(1.1) contrast(1.025);animation:none!important;transform:none!important;
}
.qom-v62-hero .hero-scene::before,
.qom-v62-hero .hero-scene::after{display:none!important}
.qom-v62-hero .qom-dome-layer,.qom-v62-hero .qom-live-controls,
.qom-v62-hero .qom-live-layers,.qom-v62-hero .hero-scene-controls{display:none!important}
.qom-v62-hero .hero-topline{
  position:relative;z-index:2;max-width:320px;margin:0 auto;
  border:1px solid #ffffffcc;background:#ffffffd7;
  box-shadow:0 4px 18px #2b5b7015;
}
.qom-v62-hero .hero-content{
  position:relative;z-index:2;width:100%;max-width:650px;
  margin:0 auto;padding:clamp(205px,24vw,290px) 16px 0;
  text-align:center;
}
.qom-v62-hero .hero-content h1.qom-wordmark{margin-inline:auto!important;justify-content:center!important}
.qom-v62-hero .hero-title-rule{margin:10px auto 16px}
.qom-v62-hero .hero-content .sky-search{
  width:100%;max-width:540px;min-height:60px;
  background:#fffffff0;border-color:#ffffffed;
  box-shadow:0 6px 22px #205a771a;
}
.qom-v62-hero .hero-links{display:none!important}
.qom-v62-hero-links{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:15px}
.qom-v62-hero-links a{
  display:inline-flex;align-items:center;min-height:39px;
  padding:8px 17px;border-radius:999px;border:1px solid #fff;
  background:#ffffffdc;color:#18536c;font-size:13px;font-weight:650;
  text-decoration:none;box-shadow:0 3px 12px #17587410;
}
.qom-v62-hero-links a:hover,.qom-v62-hero-links a:focus-visible{color:#0d5e83;background:#fff}
/* Maintain a wide, frameless photograph on desktop; feather all edges, especially bottom. */
@media(min-width:950px){
  .qom-v62-hero.immersive-hero{min-height:585px;padding-top:90px;border-radius:0}
  .qom-v62-hero .hero-scene{inset:-48px -30px auto!important;height:560px!important}
  .qom-v62-hero .hero-content{padding-top:275px;max-width:650px}
}
@media(max-width:649px){
  .qom-v62-hero.immersive-hero{min-height:565px;margin-inline:-16px;padding:88px 17px 30px;border:0;border-radius:0 0 23px 23px}
  .qom-v62-hero .hero-scene{
    inset:-12px -28px auto!important;width:calc(100% + 56px)!important;
    height:418px!important;
    -webkit-mask-image:radial-gradient(ellipse 73% 69% at 50% 36%,black 37%,transparent 100%)!important;
    mask-image:radial-gradient(ellipse 73% 69% at 50% 36%,black 37%,transparent 100%)!important;
  }
  .qom-v62-hero .hero-scene>img.scene-active{object-position:50% 41%;opacity:.93!important}
  .qom-v62-hero .hero-content{padding:275px 0 0}
  .qom-v62-hero .hero-content .sky-search{min-height:57px}
  .qom-v62-hero-links a{font-size:12px;padding:8px 13px;min-height:37px}
}
@media(max-width:380px){
  .qom-v62-hero.immersive-hero{min-height:548px}
  .qom-v62-hero .hero-content{padding-top:267px}
  .qom-v62-hero .hero-scene{height:395px!important}
}
/* Permanent shortcuts replace the arbitrary recommendation and old location-finder card. */
.qom-v62-hidden-pick{display:none!important}
.home-lists>.qom-v62-actions{grid-column:auto;min-width:0;
  border:1px solid #dde8e9!important;border-radius:26px!important;
  padding:22px!important;background:#fffefcf4!important;
  box-shadow:0 8px 26px #1c53680b!important;backdrop-filter:none!important;
}
.qom-v62-actions-head{margin-bottom:16px}
.qom-v62-actions-head h2{margin:0 0 6px;color:var(--ink,#15364e);font-size:18px;font-weight:750}
.qom-v62-actions-head p{margin:0;color:var(--muted,#527181);font-size:12px;line-height:1.9}
.qom-v62-actions-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.qom-v62-action{display:flex;gap:11px;align-items:center;text-align:right;min-height:72px;
  padding:11px;border-radius:17px;border:1px solid #dce8e9;
  background:linear-gradient(145deg,#f5fafc,#f0f8f4);color:#194d66;text-decoration:none;
  transition:background .16s ease,border-color .16s ease,transform .16s ease}
.qom-v62-action svg{width:21px;height:21px;flex-shrink:0;color:#13869a}
.qom-v62-action-copy{display:flex;flex-direction:column;min-width:0;gap:4px}
.qom-v62-action strong{font-size:12.5px;font-weight:750;color:#163f56;line-height:1.5}
.qom-v62-action small{font-size:10.5px;color:#607685;line-height:1.5}
.qom-v62-action:nth-child(2){background:linear-gradient(140deg,#fffaf0,#fff2e2);border-color:#f0dfc6}
.qom-v62-action:nth-child(2) svg{color:#ab7027}
.qom-v62-action:nth-child(3) svg{color:#cb6270}
.qom-v62-action:hover,.qom-v62-action:focus-visible{background:#e7f7f3;border-color:#8dc6bd;transform:translateY(-1px)}
.qom-v62-action:focus-visible,.qom-v62-hero-links a:focus-visible{outline:2px solid #117da4;outline-offset:2px}
@media(max-width:649px){
  .home-lists>.qom-v62-actions{padding:17px!important;border-radius:22px!important}
  .qom-v62-actions-grid{gap:8px}
  .qom-v62-action{min-height:67px;padding:10px 8px;gap:7px}
  .qom-v62-action strong{font-size:12px}
  .qom-v62-action small{font-size:10px}
  .qom-v62-action svg{width:20px;height:20px}
}
@media(max-width:370px){.qom-v62-action{align-items:flex-start;flex-direction:column;gap:6px}}
@media(prefers-reduced-motion:reduce){.qom-v62-action{transition:none!important;transform:none!important}}
html[data-motion=minimal] .qom-v62-action,html[data-performance=optimized] .qom-v62-action{transition:none!important;transform:none!important}

/* v6.3 — transparent photographic feather. Never a rectangular hero backdrop.
   The source photos are documentary local files, no synthetic imagery. */
.qom-v62-hero.qom-v63-hero.immersive-hero {
  background:transparent!important;background-image:none!important;
  border:0!important;box-shadow:none!important;isolation:isolate;
  overflow:visible!important;
}
.qom-v63-hero .hero-scene {
  position:absolute!important;z-index:0!important;pointer-events:none;
  inset:-36px -36px auto!important;width:calc(100% + 72px)!important;
  height:clamp(410px,46vw,590px)!important;
  background:none!important;background-image:none!important;
  overflow:hidden!important;border:0!important;border-radius:0!important;
  /* Pixels already contain gradual transparency: CSS mask is only an extra safety net. */
  -webkit-mask-image:none!important;mask-image:none!important;
}
.qom-v63-hero .hero-scene .qom-v63-photo,
.qom-v63-hero .hero-scene .qom-v63-photo>img,
.qom-v63-hero .hero-scene>img.scene-active {
  display:block!important;position:absolute!important;inset:0!important;
  width:100%!important;height:100%!important;max-width:none!important;
  transform:none!important;filter:none!important;opacity:1!important;
  animation:none!important;transition:none!important;
}
.qom-v63-hero .hero-scene .qom-v63-photo>img, .qom-v63-hero .hero-scene>img.scene-active{object-fit:fill!important}
.qom-v63-hero .hero-scene::before,.qom-v63-hero .hero-scene::after{
  display:none!important;content:none!important;
}
.qom-v63-hero .hero-topline,.qom-v63-hero .hero-content{position:relative;z-index:2}
@media(min-width:950px){
  .qom-v62-hero.qom-v63-hero.immersive-hero{min-height:580px!important}
  .qom-v63-hero .hero-scene{inset:-40px -36px auto!important;height:560px!important}
}
@media(max-width:649px){
  .qom-v62-hero.qom-v63-hero.immersive-hero{min-height:570px!important;background:transparent!important}
  .qom-v63-hero .hero-scene{
    inset:-24px -24px auto!important;width:calc(100% + 48px)!important;
    height:440px!important;
  }
  .qom-v63-hero .hero-content{padding-top:282px!important}
}
@media(max-width:380px){.qom-v63-hero .hero-scene{height:425px!important}}


/* --- experience-v64.css --- */
/* v6.4 — single source of final responsive layout overrides. No overlays of synthetic architecture. */
:root{--qom-rail-width:224px}
html{overflow-x:clip;max-width:100%}
body{overflow-x:clip;max-width:100%;min-width:0}
#root,.app-column,.home-main,.inner-main,.home-four,.home-shell,.home-lists,.home-jobs,.route-enter{min-width:0;max-width:100%}
.app-column{box-sizing:border-box}
.home-four,.home-main{overflow-x:clip}
.home-lists>*{min-width:0}
/* Exact user-supplied wordmark trace, resized proportionally instead of the previous freehand reconstruction. */
body .app-header .brand-wordmark{width:clamp(132px,15vw,186px);height:auto;max-width:100%;max-height:42px;object-fit:contain}
body .hero-content h1.qom-wordmark img{width:clamp(235px,40vw,358px);max-width:100%;height:auto;max-height:82px}
/* Fluid photo and soft natural edges: no oval mask, no hard rectangular frame, no squashing. */
.qom-v62-hero.qom-v63-hero.qom-v64-hero.immersive-hero{
  position:relative!important;isolation:isolate;overflow:hidden!important;
  background:transparent!important;border:0!important;box-shadow:none!important;
  width:100%;max-width:100%;margin:0 0 12px!important;
  min-height:clamp(490px,48vw,600px);padding:70px clamp(14px,2.5vw,28px) 32px!important;
}
.qom-v64-hero .hero-scene{
  position:absolute!important;inset:0 0 auto 0!important;
  width:100%!important;height:clamp(390px,44vw,520px)!important;
  overflow:hidden!important;z-index:0!important;
  background:transparent!important;border:0!important;border-radius:0!important;
  -webkit-mask-image:none!important;mask-image:none!important;pointer-events:none!important;
}
.qom-v64-hero .hero-scene picture,.qom-v64-hero .hero-scene .qom-v63-photo{position:absolute!important;inset:0!important;display:block!important;width:100%!important;height:100%!important;max-width:100%!important}
.qom-v64-hero .hero-scene img.scene-active,.qom-v64-hero .hero-scene .qom-v63-photo>img{
  position:absolute!important;inset:0!important;display:block!important;
  width:100%!important;height:100%!important;max-width:100%!important;
  object-fit:cover!important;object-position:center 40%!important;
  opacity:1!important;transform:none!important;filter:none!important;
  animation:none!important;transition:none!important;
}
.qom-v64-hero .hero-topline{z-index:2;position:relative;max-width:max-content;margin-inline:auto}
.qom-v64-hero .hero-content{
  display:flex;flex-direction:column;align-items:center;position:relative;z-index:2;
  width:min(100%,620px);max-width:620px;margin-inline:auto!important;
  padding:clamp(225px,27vw,300px) 8px 0!important;text-align:center;
}
.qom-v64-hero .hero-content h1.qom-wordmark{display:flex;justify-content:center;width:100%;max-width:100%;margin:0 auto!important}
.qom-v64-hero .hero-title-rule{margin:8px auto 15px}
.qom-v64-hero .sky-search,.qom-v64-hero .hero-content .sky-search{
  position:relative;display:flex;align-items:center;justify-content:center;text-align:center;
  width:min(100%,510px)!important;max-width:510px;min-width:0;
  min-height:60px;margin-inline:auto!important;padding:11px 56px!important;
  background:linear-gradient(135deg,#fffffff8,#f4fffcf1)!important;
  border:1px solid #cee8e2!important;box-shadow:0 8px 26px #207e7f22!important;
  border-radius:999px;
}
.qom-v64-hero .sky-search>b{display:block;flex:0 1 auto;min-width:0;margin-inline:auto;text-align:center!important}
.qom-v64-hero .sky-search>span{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:grid;place-items:center;margin:0}
.qom-v64-hero .qom-v62-hero-links,.qom-v64-hero .qom-v63-hero-links{justify-content:center;margin:15px auto 0!important}
.qom-v64-hero a[href^='/watch'],.qom-v64-hero a[href^='\/watch']{display:none!important}
/* Gentle moving color halos, GPU translated only; obey reduced motion and Eitaa performance mode. */
body .ocean-atmosphere{position:fixed!important;inset:0;max-width:100vw;overflow:hidden!important;pointer-events:none;background:linear-gradient(145deg,#f8fcfa,#eaf7f4 55%,#f4f9fc)!important}
body .ocean-atmosphere i,html[data-performance="optimized"] body .ocean-atmosphere i{
  display:block!important;position:absolute!important;opacity:.69!important;
  width:64vmax!important;height:64vmax!important;top:-20vmax!important;left:-20vmax!important;
  will-change:transform;background:radial-gradient(circle,#80daca4d 0%,#7abbe527 40%,transparent 69%)!important;
  animation:qom-v64-halo-a 27s ease-in-out infinite alternate!important;
}
body .ocean-atmosphere i+i,html[data-performance="optimized"] body .ocean-atmosphere i+i{
  width:62vmax!important;height:62vmax!important;left:auto!important;right:-23vmax!important;top:30vmax!important;
  background:radial-gradient(circle,#f3c98563 0%,#ffdca226 42%,transparent 72%)!important;
  animation:qom-v64-halo-b 34s ease-in-out infinite alternate!important;
}
@keyframes qom-v64-halo-a{from{transform:translate3d(0,0,0)}to{transform:translate3d(4.8vw,3vh,0) scale(1.035)}}
@keyframes qom-v64-halo-b{from{transform:translate3d(0,0,0)}to{transform:translate3d(-4vw,-2.5vh,0) scale(1.045)}}
/* Desktop rail is persistent, all existing routes still open in the main pane. */
@media(min-width:1120px){
  body{padding-right:256px}
  .app-column{width:calc(100% - 40px);max-width:1160px;margin-inline:auto}
  .app-header{min-width:0;padding-inline:clamp(16px,2vw,30px)}
  .app-header .desktop-navigation{
    position:fixed!important;inset:85px 16px auto auto!important;
    width:var(--qom-rail-width)!important;max-width:calc(100vw - 32px);
    height:auto;display:flex!important;flex-direction:column;align-items:stretch!important;justify-content:flex-start!important;
    gap:6px!important;z-index:90;padding:18px 12px 18px!important;
    border:1px solid #d6eae6;background:linear-gradient(155deg,#ffffffed,#eff8f6ec);
    border-radius:28px;box-shadow:0 15px 48px #295a6217;
    backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  }
  .app-header .desktop-navigation::before{content:'قم دوست‌داشتنی';display:block;padding:5px 12px 14px;margin:0 2px 5px;color:#1a5768;font-weight:800;font-size:14px;border-bottom:1px solid #cbe2df}
  .app-header .desktop-navigation>a{
    width:100%;min-height:49px;height:auto;display:flex!important;gap:12px;
    justify-content:flex-start!important;align-items:center!important;
    text-align:right;padding:11px 16px!important;border-radius:15px!important;
    color:#446777;font-size:14px;font-weight:650;
  }
  .app-header .desktop-navigation>a svg{display:block;width:20px;height:20px;flex:0 0 20px}
  .app-header .desktop-navigation>a.active{color:#076e83!important}
  .app-header .desktop-navigation .nav-track{border-radius:14px!important;background:linear-gradient(100deg,#c9f1e7,#e7f7ff)!important;border-color:#c5e8e5!important}
  .home-shell .app-header{background:transparent!important}
  .home-main{padding-inline:clamp(18px,2vw,38px)}
  .app-footer{padding-bottom:35px}
}
/* Mobile: eliminate horizontal document overflow at its source and keep bottom bar always inside viewport. */
@media(max-width:1119px){
  html,body,#root,.app-column{width:100%;max-width:100%;margin-inline:0}
  body{padding-right:0}
}
@media(max-width:959px){
  .desktop-navigation{display:none!important}
  .bottom-navigation{
    position:fixed!important;z-index:100!important;
    left:50%!important;right:auto!important;
    transform:translateX(-50%)!important;
    bottom:calc(8px + env(safe-area-inset-bottom,0px) + var(--eitaa-bottom,0px))!important;
    width:calc(100dvw - 20px)!important;max-width:410px!important;
    box-sizing:border-box!important;margin:0!important;
    padding:6px 6px 6px!important;min-height:66px;
    display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;
    border-radius:24px!important;
  }
  .bottom-navigation>a{overflow:hidden;min-width:0!important;padding-inline:1px!important;min-height:52px!important}
  .bottom-navigation>a .nav-label{font-size:clamp(9px,2.7vw,11px);white-space:nowrap}
  .home-main,.inner-main{padding-bottom:calc(128px + env(safe-area-inset-bottom,0px) + var(--eitaa-bottom,0px))!important}
  .app-footer{padding-bottom:calc(115px + env(safe-area-inset-bottom,0px) + var(--eitaa-bottom,0px))!important}
}
@media(max-width:649px){
  body .app-header .brand-wordmark{width:clamp(111px,34vw,143px)}
  .app-header{max-width:100%;width:100%;padding-inline:14px!important;gap:7px!important}
  .header-actions{flex-shrink:0;gap:0!important}
  .brand{flex:1;min-width:0}
  .qom-v62-hero.qom-v63-hero.qom-v64-hero.immersive-hero{
    min-height:525px!important;margin:0 0 10px!important;padding:67px 12px 22px!important;
    width:100%;max-width:100%;overflow:hidden!important;
  }
  .qom-v64-hero .hero-scene{
    inset:0!important;width:100%!important;max-width:100%!important;
    height:400px!important;overflow:hidden!important;
  }
  .qom-v64-hero .hero-content{
    width:100%;max-width:100%;padding:255px 3px 0!important;margin-inline:auto!important;
  }
  .qom-v64-hero .hero-content .sky-search{min-height:55px;width:min(100%,440px)!important;padding:9px 48px!important}
  .qom-v64-hero .hero-content .sky-search>span{right:7px}
  .home-main{padding-inline:14px!important}
  .home-lists,.dashboard-widgets,.qom-gallery-grid,.capsule-shortcuts{max-width:100%;min-width:0}
  .qom-v62-actions-grid{min-width:0}
  .qom-v62-action{min-width:0;overflow:hidden}
}
@media(max-width:359px){
  .app-header{padding-inline:10px!important}
  .bottom-navigation{width:calc(100dvw - 12px)!important;max-width:100%!important}
  .qom-v64-hero .hero-content{padding-top:248px!important}
}
@media(prefers-reduced-motion:reduce){body .ocean-atmosphere i,body .ocean-atmosphere i+i{animation:none!important;transform:none!important;will-change:auto!important}}
html[data-motion="minimal"] body .ocean-atmosphere i,html[data-motion="minimal"] body .ocean-atmosphere i+i{animation:none!important;transform:none!important;will-change:auto!important}


/* --- experience-v66.css --- */
/* Qom 6.6 — Balanced Glass. Replaces (not stacks on) experience-v65.css.
   Low-cost paint: only nav/search/bottom-bar blur; cards use translucent paints and soft shadows. */
:root {
  --qom-rail-width: 238px;
  --qom-ink: #254b54;
  --qom-mint: #218e83;
  --qom-sky: #538fbb;
  --qom-gold: #c89951;
  --qom-pink: #cb8290;
  --qom-edge: rgba(255,255,255,.84);
  --qom-panel-shadow: 0 9px 25px rgba(50,85,89,.085),inset 0 1px 0 rgba(255,255,255,.9);
  --qom-panel: linear-gradient(145deg,rgba(255,255,255,.92),rgba(247,252,248,.82));
  --brand: #188d84;
  --brand-deep: #146d76;
  --surface-glass: var(--qom-panel);
  --card-radius: 27px;
  --radius: 27px;
  --glass-shadow: var(--qom-panel-shadow);
}
html,body,#root,.app-column,.home-four,.home-main {min-width:0;max-width:100%;}
html,body {overflow-x:clip;}
body {background:#f5f8f5!important;color:var(--qom-ink);}
/* Colorful sunlight, mint, lilac, rose and sky; blue is an accent, not a blanket. */
body .ocean-atmosphere {
  position:fixed!important;inset:0!important;z-index:-1;pointer-events:none;
  overflow:hidden!important;background:
    radial-gradient(ellipse at 82% 5%,rgba(164,205,239,.22),transparent 51%),
    radial-gradient(ellipse at 17% 73%,rgba(239,189,175,.17),transparent 49%),
    linear-gradient(135deg,#f7f9f4 0%,#eef8f3 43%,#f6f5fb 76%,#fbf8ee 100%)!important;
}
body .ocean-atmosphere i,html[data-performance="optimized"] body .ocean-atmosphere i{
  display:block!important;position:absolute!important;inset:auto!important;left:-20vmax!important;
  top:-16vmax!important;width:57vmax!important;height:57vmax!important;border-radius:50%;
  opacity:.55!important;filter:none!important;will-change:auto;
  background:radial-gradient(circle at 50% 48%,rgba(107,208,184,.35),rgba(149,208,224,.15) 47%,transparent 72%)!important;
  animation:qom-v66-halo-a 43s ease-in-out infinite alternate!important;
}
body .ocean-atmosphere i+i,html[data-performance="optimized"] body .ocean-atmosphere i+i{
  left:auto!important;right:-24vmax!important;top:36vh!important;width:56vmax!important;height:56vmax!important;
  opacity:.56!important;background:radial-gradient(circle at 50% 45%,rgba(235,183,154,.30),rgba(194,176,224,.17) 46%,transparent 73%)!important;
  animation:qom-v66-halo-b 49s ease-in-out infinite alternate!important;
}
body .ocean-atmosphere .atmosphere-arch{display:none!important;}
@keyframes qom-v66-halo-a{to{transform:translate3d(2vw,2vh,0)}}
@keyframes qom-v66-halo-b{to{transform:translate3d(-2vw,-2vh,0)}}
/* The page has no monolithic rectangular backplate. Individual elements form the design. */
body .home-main,body .home-four,body .home-glass,body .home-shell,
body .home-lists,body .dashboard-widgets,body .home-jobs{
  background:transparent!important;background-image:none!important;
  border:0!important;box-shadow:none!important;backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
body .home-main,body .home-four {border-radius:0!important;}
/* Header floats freely; visual chrome belongs to the controls, not to a header rectangle. */
body .app-header,body .home-shell .app-header {
  background:transparent!important;background-image:none!important;border:0!important;
  border-radius:0!important;box-shadow:none!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  filter:none!important;transform:none!important;
}
body .app-header::before,body .app-header::after {content:none!important;display:none!important;}
body .app-header .brand .brand-symbol{width:31px!important;height:31px!important;object-fit:contain;}
body .app-header .brand .brand-wordmark{width:clamp(130px,15vw,178px)!important;height:auto!important;object-fit:contain;}
/* Rounded, calm, lightly glassy widgets. No expensive blur layer behind every tile. */
body :is(.city-widget,.home-lists>.section,.home-jobs>.section,.qom-v62-actions,
 .capsule-shortcuts>a,.notification-capsule,.discovery-band,.panel,.now-surface,
 .inner-main .service-tile,.more-grid>a,.settings-section,.urban-highlight,.service-essentials){
  border-radius:var(--card-radius)!important;
  background:var(--qom-panel)!important;border:1px solid var(--qom-edge)!important;
  box-shadow:var(--qom-panel-shadow)!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
body .city-widget.widget-weather{background:linear-gradient(143deg,rgba(255,249,230,.96),rgba(255,255,255,.84))!important;}
body .city-widget.widget-air{background:linear-gradient(143deg,rgba(229,249,239,.95),rgba(255,255,255,.84))!important;}
body .city-widget.widget-prayer{background:linear-gradient(143deg,rgba(232,239,253,.94),rgba(255,252,246,.88))!important;}
body .capsule-shortcuts>a:nth-child(1){background:linear-gradient(140deg,#e4f6f0ed,#ffffffd9)!important;}
body .capsule-shortcuts>a:nth-child(2){background:linear-gradient(140deg,#eaf2feed,#ffffffd9)!important;}
body .capsule-shortcuts>a:nth-child(3){background:linear-gradient(140deg,#fff0dced,#ffffffd9)!important;}
body .capsule-shortcuts>a:nth-child(4){background:linear-gradient(140deg,#f5eafbde,#ffffffdb)!important;}
body .capsule-shortcuts svg,body .qom-v62-action svg{color:var(--qom-mint)!important;}
body .capsule-shortcuts>a:nth-child(2) svg{color:var(--qom-sky)!important;}
body .capsule-shortcuts>a:nth-child(3) svg{color:var(--qom-gold)!important;}
body .capsule-shortcuts>a:nth-child(4) svg{color:#9a75bd!important;}
body .qom-v62-actions{padding:clamp(15px,2vw,22px)!important;}
body .qom-v62-action{
  border-radius:19px!important;background:linear-gradient(135deg,rgba(250,255,252,.97),rgba(234,248,241,.88))!important;
  border:1px solid rgba(198,227,216,.75)!important;
  box-shadow:0 3px 10px rgba(43,82,79,.04)!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
body .qom-v62-action:nth-child(2){background:linear-gradient(135deg,#fff8eaeF,#fffdf8e9)!important;border-color:#eee0c6!important;}
body .qom-v62-action:nth-child(3){background:linear-gradient(135deg,#fff1f2f0,#fffdfdf4)!important;border-color:#f0dadd!important;}
body .qom-v62-action:nth-child(4){background:linear-gradient(135deg,#edf2fdf0,#ffffffeb)!important;border-color:#d8e0f2!important;}
body .qom-v62-action:hover,body .capsule-shortcuts>a:hover{background:#ffffffed!important;border-color:#a9d9cd!important;box-shadow:0 8px 19px #377f7f15!important;}
body .home-lists>.section,body .home-jobs>.section{padding:clamp(16px,2vw,24px)!important;overflow:hidden;}
body .section-heading h2,body .qom-v62-actions-head h2{color:#225b59!important;}
body .refresh-city,body .icon-button,body .gallery-more,body .button.secondary{
  background:rgba(255,255,255,.85)!important;border:1px solid rgba(214,229,221,.95)!important;
  color:#29676b!important;border-radius:999px!important;box-shadow:0 3px 11px rgba(59,85,77,.07)!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
body .button:not(.secondary),body .qom-install-primary{background:var(--qom-mint)!important;border-color:var(--qom-mint)!important;color:#fff!important;}
/* The Qom gallery is not one sharp, padded-to-the-edge colored slab.
   Give each photograph a truly clipped rounded edge and breathing room. */
body .qom-gallery{
  margin:28px 0 18px!important;padding:8px 8px 16px!important;
  background:transparent!important;border:0!important;box-shadow:none!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;border-radius:30px!important;
}
body .qom-gallery .section-heading{padding-inline:4px;margin-bottom:15px;}
body .qom-gallery-grid{gap:clamp(10px,1.3vw,16px)!important;padding:1px;}
body .qom-gallery-grid figure{border-radius:23px!important;overflow:hidden!important;isolation:isolate;
  background:#ebf3ec!important;border:1px solid rgba(255,255,255,.96)!important;
  box-shadow:0 6px 21px rgba(54,83,75,.11)!important;}
body .qom-gallery-grid img{border-radius:inherit!important;display:block;}
body .qom-gallery-grid figcaption{border-radius:0 0 22px 22px!important;}
/* The real photographic hero remains frameless, with subtle feather (no fake 3-D frame). */
body .qom-v65-hero.immersive-hero{background:transparent!important;border:0!important;box-shadow:none!important;isolation:isolate;}
body .qom-v65-hero .hero-scene{background:transparent!important;overflow:visible!important;border:0!important;border-radius:0!important;
  -webkit-mask-image:none!important;mask-image:none!important;}
body .qom-v65-hero .hero-scene img.scene-active{
  -webkit-mask-image:radial-gradient(ellipse 73% 75% at 50% 42%,black 14%,rgba(0,0,0,.94) 36%,rgba(0,0,0,.57) 60%,transparent 96%)!important;
  mask-image:radial-gradient(ellipse 73% 75% at 50% 42%,black 14%,rgba(0,0,0,.94) 36%,rgba(0,0,0,.57) 60%,transparent 96%)!important;
  -webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important;
}
body .qom-v65-hero .hero-topline{
  background:rgba(255,255,255,.72)!important;border:1px solid rgba(255,255,255,.9)!important;
  border-radius:999px!important;box-shadow:0 4px 12px rgba(52,100,89,.075)!important;
  padding:7px 15px!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
body .hero-content h1.qom-wordmark{display:flex!important;justify-content:center!important;align-items:center!important;margin:0 auto 5px!important;}
body .hero-content h1.qom-wordmark img{width:clamp(224px,36vw,345px)!important;max-height:84px;object-fit:contain;}
body .qom-v65-hero .sky-search{
  width:min(100%,510px)!important;min-width:0!important;margin-inline:auto!important;
  background:linear-gradient(135deg,rgba(255,255,255,.89),rgba(238,251,244,.82))!important;
  border:1px solid rgba(255,255,255,.94)!important;border-radius:999px!important;
  box-shadow:0 10px 24px rgba(47,91,85,.14),inset 0 1px 0 white!important;
  backdrop-filter:blur(9px) saturate(1.08)!important;-webkit-backdrop-filter:blur(9px) saturate(1.08)!important;
}
body .qom-v65-hero .sky-search>b{color:#245957!important;font-weight:700;}
body .qom-v65-hero .qom-v62-hero-links,body .qom-v65-hero .qom-v63-hero-links,
body .qom-v65-hero .qom-v64-hero-links{display:none!important;}
/* Sidebar: full viewport, quietly frosted, no big blue bevels or 3D highlights. */
@media(min-width:1120px){
  body{padding-right:calc(var(--qom-rail-width) + 22px)!important;}
  body .app-column{width:min(100%,1240px);max-width:1240px;margin-inline:auto;padding-top:0!important;}
  body .island-dock,body .city-island{display:none!important;}
  body .app-header{min-height:68px!important;height:68px!important;padding-inline:clamp(12px,2vw,26px)!important;position:relative!important;}
  body .app-header>.brand{display:none!important;}
  body .app-header .header-actions{margin-right:auto!important;}
  body .home-shell .app-header{top:0!important;}
  body .app-header .desktop-navigation{
    position:fixed!important;inset:0 0 0 auto!important;right:0!important;top:0!important;bottom:0!important;
    width:var(--qom-rail-width)!important;max-width:var(--qom-rail-width)!important;
    height:100vh!important;height:100dvh!important;min-height:100vh!important;
    padding:25px 13px 22px!important;margin:0!important;box-sizing:border-box!important;
    display:flex!important;flex-direction:column!important;align-items:stretch!important;
    justify-content:flex-start!important;gap:6px!important;
    overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior:contain;
    background:linear-gradient(155deg,rgba(255,255,255,.82),rgba(246,251,245,.79) 57%,rgba(239,245,250,.72))!important;
    border:1px solid rgba(255,255,255,.91)!important;border-right:0!important;
    border-radius:26px 0 0 26px!important;
    box-shadow:-7px 0 25px rgba(58,85,81,.105)!important;
    backdrop-filter:blur(13px) saturate(1.06)!important;
    -webkit-backdrop-filter:blur(13px) saturate(1.06)!important;
    z-index:110!important;
  }
  body .app-header .desktop-navigation::before{
    content:''!important;display:block!important;flex:0 0 73px!important;height:73px!important;
    margin:0 8px 15px!important;border-bottom:1px solid rgba(136,174,166,.25)!important;
    background:url('/brand-wordmark-v65.svg') center 7px/89% auto no-repeat!important;
  }
  body .app-header .desktop-navigation>a{
    display:flex!important;align-items:center!important;justify-content:flex-start!important;
    flex:0 0 auto;min-height:48px!important;max-height:55px!important;padding:10px 14px!important;
    border:1px solid transparent!important;border-radius:17px!important;
    color:#456963!important;background:transparent!important;box-shadow:none!important;
    font-size:14px!important;font-weight:650!important;
  }
  body .app-header .desktop-navigation>a svg{color:#458b83!important;}
  body .app-header .desktop-navigation>a:is(:hover,.active){
    background:linear-gradient(120deg,rgba(220,245,231,.81),rgba(238,242,251,.69))!important;
    border-color:rgba(191,225,209,.85)!important;color:#18695f!important;
  }
  body .app-header .desktop-navigation .nav-track{opacity:.16!important;background:#8cd5bc!important;}
  .qom-v65-rail-extra{display:flex;flex-direction:column;gap:3px;margin-top:15px;
    padding-top:14px;border-top:1px solid rgba(128,166,158,.25);}
  .qom-v65-rail-heading{margin:0 12px 8px;font-size:11px;color:#67877d;font-weight:650;}
  .qom-v65-rail-extra>a{display:block;padding:10px 14px;border-radius:14px!important;
    text-decoration:none;color:#52726b;font-size:13px;transition:background-color .16s ease;}
  .qom-v65-rail-extra>a:is(:hover,.active){background:rgba(221,242,233,.86);color:#176f64;}
  body .app-header .desktop-navigation::-webkit-scrollbar{width:5px;}
  body .app-header .desktop-navigation::-webkit-scrollbar-thumb{background:rgba(85,141,124,.24);border-radius:10px;}
}
@media(min-width:960px) and (max-width:1119px){
 body .island-dock,body .city-island{display:none!important;}
 body .app-column{padding-top:0!important;}
 body .home-shell .app-header{top:0!important;}
}
@media(max-width:1119px){.qom-v65-rail-extra{display:none!important;}}
@media(max-width:649px){
 body .app-header{width:100%!important;max-width:100%!important;margin:0!important;padding-inline:clamp(11px,3.4vw,18px)!important;}
 body .app-header .brand .brand-wordmark{width:clamp(106px,33vw,146px)!important;}
 body .app-header .brand .brand-symbol{width:29px!important;height:29px!important;}
 body .home-main{padding-inline:clamp(12px,3.5vw,18px)!important;}
 body .qom-v65-hero .hero-scene{width:100%!important;inset:0!important;}
 body .qom-v65-hero .hero-scene img.scene-active{
  -webkit-mask-image:radial-gradient(ellipse 83% 75% at 50% 38%,#000 13%,rgba(0,0,0,.88) 34%,rgba(0,0,0,.45) 62%,transparent 96%)!important;
  mask-image:radial-gradient(ellipse 83% 75% at 50% 38%,#000 13%,rgba(0,0,0,.88) 34%,rgba(0,0,0,.45) 62%,transparent 96%)!important;
 }
 body .qom-v65-hero .hero-content{padding-top:249px!important;}
 body .hero-content h1.qom-wordmark img{width:clamp(225px,74vw,305px)!important;}
 body .qom-v65-hero .sky-search{width:min(100%,440px)!important;}
 body .qom-gallery{padding:7px 2px 12px!important;}
 body .qom-gallery-grid figure{border-radius:19px!important;}
 body .qom-v62-actions-grid{min-width:0;}
 body .bottom-navigation{
  width:calc(100dvw - 20px)!important;max-width:min(410px,calc(100dvw - 20px))!important;
  border-radius:26px!important;background:rgba(250,253,250,.84)!important;
  border:1px solid rgba(255,255,255,.98)!important;
  box-shadow:0 8px 26px rgba(48,81,76,.14)!important;
  backdrop-filter:blur(11px) saturate(1.06)!important;-webkit-backdrop-filter:blur(11px) saturate(1.06)!important;
 }
}
/* Performance-aware: turn costly filters off without removing shape, color and shadow. */
html[data-performance="optimized"] body .qom-v65-hero .sky-search,
html[data-performance="optimized"] body .desktop-navigation,
html[data-performance="optimized"] body .bottom-navigation{backdrop-filter:blur(5px)!important;-webkit-backdrop-filter:blur(5px)!important;}
html[data-performance="optimized"] body :is(.city-widget,.home-lists>.section,.qom-v62-actions,.capsule-shortcuts>a,.qom-gallery,.qom-gallery-grid figure){backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
html[data-motion="minimal"] body .ocean-atmosphere i,
html[data-motion="minimal"] body .ocean-atmosphere i+i{animation:none!important;transform:none!important;}
@media(prefers-reduced-motion:reduce){body .ocean-atmosphere i,body .ocean-atmosphere i+i{animation:none!important;transform:none!important;}}
/* Final photographic edge polish: dissolve the upper edge as well as the lower edge. */
body .qom-v65-hero .hero-scene picture{
 -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 15%,#000 69%,transparent 100%)!important;
 mask-image:linear-gradient(to bottom,transparent 0%,#000 15%,#000 69%,transparent 100%)!important;
 -webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important;
}
/* Avoid animated entrance/compositing of a whole grid of translucent cards. */
body .dashboard-widgets .city-widget,body .home-four>.sky-hero{animation:none!important;}
body :is(.city-widget,.home-lists>.section,.qom-gallery,.qom-gallery-grid figure,.qom-v62-actions){
 transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease!important;
}
@media(hover:hover){body .city-widget:hover,body .qom-gallery-grid figure:hover{transform:none!important;}}
@media(prefers-reduced-motion:reduce){body :is(.city-widget,.qom-v62-action,.capsule-shortcuts>a,.qom-gallery-grid figure){transition:none!important;animation:none!important;}}
/* Interior pages retain softly rounded surfaces, but not large live-blurred slabs. */
body .inner-main{
 border-radius:30px!important;
 background:linear-gradient(145deg,rgba(255,255,255,.67),rgba(250,253,249,.53))!important;
 border:1px solid rgba(255,255,255,.82)!important;
 box-shadow:0 6px 21px rgba(50,80,70,.075)!important;
 backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
body .city-island{border-radius:24px!important;backdrop-filter:blur(9px)!important;-webkit-backdrop-filter:blur(9px)!important;}
body .sheet{border-radius:28px 28px 0 0!important;backdrop-filter:blur(11px)!important;-webkit-backdrop-filter:blur(11px)!important;}
