/* HOME-PRO: isolated to the homepage. Original artwork remains the default. */
/* Homepage chrome owns its gutters; main.css remains shared by the other routes. */
.hp-home.layout .topbar{padding:0;backdrop-filter:none}
.hp-home .topbar .wrap{width:100%;padding:10px 24px;flex-wrap:nowrap}
.hp-home .topbar-coins{flex:1 1 0%;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding-inline:2px;scrollbar-width:thin;scrollbar-color:#c49b5859 transparent;padding:4px 2px}
.hp-home .topbar-coins .coin-pill{flex:none;scroll-snap-align:start}
.hp-home .topbar-coins .coin-pill img,.hp-home .topbar-coins .coin-fallback{width:50px;height:50px}
.hp-home .topbar-coins:focus-visible{outline:2px solid #ebce8f;outline-offset:2px}
.hp-home .topbar .btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center;line-height:1.3}
.hp-home .hmx-brand-copy{min-width:0}
@media(max-width:1023px){
  .hp-home .topbar .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto;column-gap:12px;row-gap:6px;padding:8px 12px}
  .hp-home .topbar .brand-title{grid-column:1;grid-row:1;min-width:0}
  .hp-home .topbar .auth-links{grid-column:2;grid-row:1;justify-self:end}
  .hp-home .topbar-coins{grid-column:1/-1;grid-row:2;display:flex;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;gap:8px;padding:6px 2px 4px;border-top:1px solid #ebce8f24;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#c49b5859 transparent;scroll-padding-inline:2px;background:linear-gradient(to right,#210c09,transparent) left/16px 100% no-repeat;background-attachment:scroll}
  .hp-home .topbar-coins::-webkit-scrollbar{height:3px}
  .hp-home .topbar-coins::-webkit-scrollbar-thumb{background:#c49b5859;border-radius:3px}
  .hp-home .topbar-coins .coin-name{display:none}
}
@media(max-width:767px){
  .hp-home .topbar .brand-title .welcome{display:none}
  .hp-home .topbar .btn{padding:8px 12px;font-size:15px;border-radius:10px}
  .hp-home .hmx-brand{width:calc(100% - 24px);gap:14px;padding:14px 0;margin:4px auto 12px}
  .hp-home .hmx-brand .logo{width:80px;height:80px}
  .hp-home .hmx-brand h1{font-size:25px;letter-spacing:.12em;margin:0 0 4px;line-height:1.3}
  .hp-home .hmx-brand p{font-size:15px;line-height:1.5;margin:0}
  .hp-home .hp-widget{margin-bottom:22px}
}
@media(max-width:359px){
  .hp-home .hmx-brand{gap:12px}
  .hp-home .hmx-brand .logo{width:68px;height:68px}
  .hp-home .hmx-brand h1{font-size:22px}
  .hp-home .hmx-brand p{font-size:14px}
}
.hp-home{overflow-x:clip;isolation:isolate}.hp-home *{box-sizing:border-box}.hp-home .hmx-home{position:relative;width:min(1480px,94%)}.hp-widget{min-width:0;margin-bottom:28px}.hp-node{min-width:0;max-width:100%;position:relative;overflow-wrap:anywhere;--hp-fit:contain;--hp-ratio:auto;--hp-focus-x:50%;--hp-focus-y:50%;transform:translate(var(--hp-x,0),var(--hp-y,0px))}.hp-node h2,.hp-node h3{color:inherit;font-family:inherit;margin:0 0 12px;font-weight:700;line-height:1.35}.hp-node h2{font-size:clamp(26px,3vw,44px)}.hp-node p{margin:0 0 16px}.hp-node img,.hp-node video{display:block;max-width:100%;width:100%;height:auto;object-fit:var(--hp-fit);object-position:var(--hp-focus-x) var(--hp-focus-y);aspect-ratio:var(--hp-ratio)}.hp-node picture{display:block}.hp-node .hp-button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:12px 22px;border-radius:8px;border:1px solid currentColor;background:var(--hp-button-bg,#a93e1b);color:var(--hp-button-color,#fff0cf);text-decoration:none;font:700 16px/1.3 Tajawal,Tahoma,sans-serif;max-width:100%;white-space:normal;overflow-wrap:anywhere;transition:background-color .2s,color .2s}.hp-node .hp-button:hover,.hp-node .hp-button:focus-visible{background:var(--hp-hover-bg,#6f280e);color:var(--hp-hover-color,#ffffff)}.hp-button span{display:inline-block}.hp-prose{line-height:inherit;font-size:inherit}.hp-prose :last-child{margin-bottom:0}.hp-prose a{color:inherit;text-decoration:underline}.hp-heading,.hp-text{color:#f2deb8}.hp-container,.hp-columns,.hp-gallery{display:grid;grid-template-columns:repeat(var(--hp-columns,2),minmax(0,1fr));gap:24px;align-items:start}.hp-container{grid-template-columns:1fr}.hp-button_group{display:flex;gap:12px;flex-wrap:wrap}.hp-hero{display:grid;isolation:isolate;align-items:center;gap:24px;background:#f3dfb5;color:#352016;border-radius:20px;padding:32px}.hp-hero>.hp-image,.hp-hero>.hp-video,.hp-hero>.hp-background{grid-area:1/1;width:100%;z-index:0}.hp-hero>.hp-overlay,.hp-hero>.hp-copy{grid-area:1/1;z-index:1;max-width:85%;margin:24px;padding:24px;background:#f5e6c4ed;border-radius:12px;justify-self:start;align-self:center}.hp-hero>.hp-visual{grid-area:1/1;max-height:680px;overflow:hidden}.hp-overlay{background:#f5e6c4ed;color:#3b2315;padding:24px;border-radius:16px;width:80%;max-width:640px}.hp-background{overflow:hidden;border-radius:inherit;z-index:0}.hp-background img,.hp-background video{height:100%;object-fit:cover}.hp-news,.hp-announcement,.hp-notice{padding:28px;background:#f3dfb8;color:#452817;border:1px solid #b6915433;border-radius:16px}.hp-news .hp-visual,.hp-announcement .hp-visual{margin-bottom:20px;max-height:500px;overflow:hidden;border-radius:10px}.hp-notice{border-inline-start:4px solid #bd8750;padding:18px 24px}.hp-notice h2{font-size:24px}.hp-image{overflow:hidden;border-radius:12px}.hp-image img,.hp-image picture,.hp-image>a{width:100%;display:block}.hp-video{background:#170d0b;border-radius:12px;overflow:hidden;min-height:120px}.hp-spacer{height:40px}.hp-divider{display:flex;align-items:center;justify-content:center;gap:20px;padding:12px}.hp-divider:before,.hp-divider:after{content:'';height:1px;background:#dfc38855;flex:1}.hp-divider img{width:42px;flex:none}.hp-media-empty,.hp-drop-hint{display:flex;align-items:center;justify-content:center;min-height:160px;background:#d9c49e26;color:#b89c75;border:1px dashed #b4915b;padding:24px;text-align:center;font-size:15px;border-radius:8px}.hp-feed-empty{color:#cbb488;padding:16px}.hp-games{display:grid;grid-template-columns:repeat(var(--hp-columns,4),minmax(0,1fr));gap:20px}.hp-game{display:flex;flex-direction:column;overflow:hidden;border-radius:18px;border:1px solid #d9ba742e;box-shadow:0 12px 26px #0003;margin:0;max-width:100%;background:#391e16;color:#f5e1b6;--hp-columns:4}.hp-game-quiz{background:#4c160f;--hp-button-bg:#b74220}.hp-game-hard_situation{background:#252244;--hp-button-bg:#655389}.hp-game-bidding{background:#142936;--hp-button-bg:#bd9750;--hp-button-color:#222}.hp-game-criminal{background:#333823;--hp-button-bg:#858654}.hp-game-art{display:block;aspect-ratio:1;overflow:hidden;flex:none}.hp-game-art img,.hp-game-art picture{width:100%;height:100%;object-fit:contain}.hp-game-copy{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1;min-width:0}.hp-game-copy h3{font-size:26px;margin:0}.hp-game-copy p{font-size:16px;line-height:1.65;flex:1;margin:0}.hp-game .hp-button{margin-top:6px;min-height:44px;font-size:16px}.hp-badge{font-size:11px;display:inline-flex;align-self:start;background:#f6dfa82a;border:1px solid #d7b67855;padding:2px 8px;border-radius:4px}.hp-service{display:flex;align-items:center;gap:20px;padding:20px 24px;max-width:650px;border:1px solid #caa76a66;border-radius:16px;background:#e3c791;color:#412613;margin-inline:auto}.hp-service h2{font-size:25px;margin-bottom:6px}.hp-service p{font-size:15px;margin-bottom:10px}.hp-service .hp-button{padding:8px 14px;min-height:44px;font-size:14px}.hp-service-art{width:80px;flex:none}.hp-service-art img{object-fit:contain;max-height:130px}.hp-carousel{overflow:hidden}.hp-carousel-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:thin;align-items:stretch}.hp-carousel-track>.hp-node{flex:0 0 calc((100% - 32px)/var(--hp-columns,1));scroll-snap-align:start;min-width:0;min-height:180px}.hp-carousel-nav{display:flex;align-items:center;justify-content:center;gap:16px;padding:12px}.hp-carousel-nav button{min-width:44px;min-height:44px;border:1px solid #d9b87555;background:#321c13;color:#ebce8f;border-radius:6px;font:inherit;cursor:pointer}.hp-carousel-dots{display:flex;gap:8px;flex-wrap:wrap}.hp-carousel-dots button{width:10px;min-width:10px;height:10px;min-height:10px;padding:0;border-radius:50%;background:#b5996e;border:0;position:relative}.hp-carousel-dots button:after{content:'';position:absolute;inset:-12px}.hp-carousel-dots button[aria-current=true]{background:#f5dca6;box-shadow:0 0 0 3px #d5b37f44}.hp-collection{display:grid;grid-template-columns:repeat(var(--hp-columns,3),minmax(0,1fr));gap:20px}.hp-collection h3{font-size:18px;margin:12px 0}.hp-collection-player{grid-template-columns:1fr;max-width:960px;margin-inline:auto}.hp-collection-carousel{display:flex;overflow-x:auto;scroll-snap-type:x mandatory}.hp-collection-carousel>article{flex:0 0 min(85%,360px);scroll-snap-align:start}.hp-youtube{position:relative;min-width:0;background:#160f0c;color:#f1d8ab;border-radius:12px;overflow:hidden}.hp-youtube-load{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;width:100%;aspect-ratio:16/9;border:0;color:#fff6df;background:#312117;cursor:pointer;gap:10px;font:700 16px Tajawal,Tahoma,sans-serif;isolation:isolate}.hp-youtube-load img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;z-index:-1}.hp-play{width:60px;height:44px;display:grid;place-items:center;border-radius:9px;background:#b33719;color:white;box-shadow:0 6px 18px #0004}.hp-youtube iframe{display:block;width:100%;aspect-ratio:16/9;border:0}.hp-third-party{padding:8px 12px!important;font:12px/1.5 Tajawal,Tahoma,sans-serif;margin:0!important}.hp-third-party a{color:inherit;text-decoration:underline}.hp-popup{width:min(90vw,650px);max-width:94vw;max-height:90dvh;margin:auto;padding:16px;border:1px solid #cbb17a;border-radius:18px;background:#f3dfb5;color:#3d2317;box-shadow:0 35px 80px #0008;overflow:auto;position:fixed;transform:none}.hp-popup::backdrop{background:#140c09b8}.hp-popup[data-popup-position=bottom],.hp-popup[data-popup-position=sheet]{margin-block-end:20px}.hp-popup[data-popup-position=sheet]{width:94vw;border-radius:18px 18px 6px 6px}.hp-popup-inner{padding:30px 12px 12px}.hp-popup-close{position:sticky;top:0;float:left;z-index:2;width:44px;height:44px;border:1px solid #bda176;border-radius:50%;background:#fff4de;color:#442514;font-size:26px;cursor:pointer}.hp-popup[open]{display:block}.hp-popup video{max-height:55dvh}.hp-page-video{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:#21100d}.hp-page-video video{width:100%;height:100%;object-fit:cover;opacity:.35}.hp-home a:focus-visible,.hp-home button:focus-visible,.hp-carousel-track:focus-visible{outline:3px solid #e3ad55;outline-offset:4px}.hp-home .footer a{color:#ebce8f}.hp-home .footer .social{display:flex;gap:18px;flex-wrap:wrap}.hp-edit .hp-node:hover{outline:2px dashed #d2a052;outline-offset:3px;cursor:pointer}.hp-edit .hp-node.hp-selected{outline:3px solid #eaba66;outline-offset:3px}.hp-edit [data-hp-part].hp-part-selected{outline:2px solid #eab453;outline-offset:3px}.hp-edit .hp-hidden{display:block!important;opacity:.35}.hp-edit .hp-popup:not([open]){display:none}.hp-edit [contenteditable=true]{outline:2px solid #efd19a!important;cursor:text!important;min-width:30px}.hp-edit [contenteditable=true]:focus{background-color:#ebce8f22}.hp-edit .hp-node.hp-locked:hover{outline-color:#999}.hp-edit .hp-paused{padding:20px;background:#55352b;color:#ffe3b4}.hp-edit .hp-resize-handle{position:absolute;bottom:0;left:0;width:22px;height:22px;background:#e9b762;border:2px solid #37210f;border-radius:4px;cursor:nwse-resize;touch-action:none;z-index:9}.hp-edit .hp-drag-handle{position:absolute;top:0;right:0;min-width:30px;min-height:30px;background:#e9b762;color:#38200f;border:1px solid #5e3c1d;cursor:move;z-index:9;touch-action:none}.hp-edit .hp-alignment-guides{outline:2px dashed #58bbad}.hp-edit .hp-size-indicator{position:absolute;bottom:24px;left:0;background:#38281b;color:#f1d6a2;font-size:11px;padding:3px 8px;pointer-events:none}.hp-edit .hp-widget{position:relative}.hp-edit .hp-selected{scroll-margin-top:40px}
@media(max-width:1023px){.hp-games{grid-template-columns:repeat(var(--hp-columns,2),minmax(0,1fr))}.hp-game-copy{padding:16px}.hp-game-copy h3{font-size:24px}.hp-container,.hp-columns{--hp-columns:2}.hp-collection{--hp-columns:2}}
@media(max-width:767px){.hp-columns,.hp-gallery{--hp-columns:1}.hp-hero{padding:12px;gap:12px}.hp-hero>.hp-overlay,.hp-hero>.hp-copy{max-width:94%;margin:12px;padding:18px}.hp-hero>.hp-image img,.hp-hero>.hp-video video{min-height:260px;object-fit:var(--hp-fit,cover)}.hp-overlay{width:92%}.hp-collection{--hp-columns:1}.hp-service{padding:16px;gap:12px}.hp-service-art{width:70px}.hp-service h2{font-size:23px}.hp-popup{padding:12px}.hp-home .footer{padding:18px 12px}.hp-home .footer .wrap{display:grid;gap:10px}.hp-home .footer .social{gap:14px;font-size:13px}.hp-hero .hp-copy h2{font-size:26px}.hp-carousel-track>.hp-node{flex-basis:90%}}
/* Home Studio device bands: small <360, mobile <600, mobile-wide <768, tablet <1024. */
@media(max-width:767px){
  .hp-home .hmx-home{width:calc(100% - 24px)}
  .hp-game-summary-mobile{display:none}
  .hp-game.hp-has-mobile-summary .hp-game-summary-full{display:none}
  .hp-game.hp-has-mobile-summary .hp-game-summary-mobile{display:block}
}
@media(max-width:599px){
  .hp-games{grid-template-columns:1fr;gap:14px}
  .hp-game{display:flex;flex-direction:var(--hp-card-flow,row);align-items:stretch;border-radius:16px;min-height:0}
  .hp-game-art{width:clamp(var(--hp-card-media-min-width,0%),var(--hp-card-image-width,34%),100%);aspect-ratio:var(--hp-card-art-ratio,auto);display:flex;align-items:center;justify-content:center;background:#0001;padding:8px;min-width:0}
  .hp-game-art picture{height:auto}
  .hp-game-art img{height:auto;max-height:180px;object-fit:contain}
  .hp-game-copy{padding:var(--hp-card-copy-padding,14px);gap:8px;display:flex}
  .hp-game-copy h3{font-size:22px;line-height:1.35;overflow-wrap:normal}
  .hp-game-copy p{font-size:14px;line-height:1.6;flex:none;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:var(--hp-card-description-lines,3);overflow:hidden}
  .hp-game-copy p.hp-game-summary-mobile{display:none}
  .hp-game.hp-has-mobile-summary .hp-game-summary-full{display:none}
  .hp-game.hp-has-mobile-summary .hp-game-summary-mobile{display:-webkit-box}
  .hp-game .hp-button{padding:10px 8px;font-size:15px;margin-top:auto;min-height:44px;line-height:1.4}
  .hp-node .hp-button{min-height:44px}
  .hp-popup-close{top:0}
  .hp-news,.hp-announcement{padding:20px}
  .hp-container,.hp-columns{--hp-columns:1}
}
@media(max-width:359px){
  .hp-game{flex-direction:var(--hp-card-flow,column)}
  .hp-game-art{width:clamp(var(--hp-card-media-min-width,100%),var(--hp-card-image-width,34%),100%);aspect-ratio:var(--hp-card-art-ratio,16/9)}
  .hp-game-art img{max-height:144px}
  .hp-game-copy h3{font-size:21px}
  .hp-game-copy{padding:var(--hp-card-copy-padding,12px)}
  .hp-service-art{width:50px}
  .hp-hero>.hp-overlay,.hp-hero>.hp-copy{padding:12px;margin:5px;max-width:98%}
}
@keyframes hp-fade{from{opacity:0}to{opacity:1}}@keyframes hp-slide{from{opacity:0;translate:0 20px}to{opacity:1;translate:0 0}}@keyframes hp-scale{from{opacity:0;scale:.96}to{opacity:1;scale:1}}
@media(prefers-reduced-motion:reduce){.hp-home *{animation:none!important;transition:none!important;scroll-behavior:auto!important}.hp-page-video{display:none}}@media(prefers-reduced-data:reduce){.hp-page-video{display:none}}
.hp-service-horizontal{max-width:none;flex-direction:row}.hp-service-horizontal>div:last-child{display:flex;align-items:center;flex-wrap:wrap;gap:14px}.hp-service-floating{max-width:330px;display:grid;justify-self:end;margin-inline-start:auto;margin-inline-end:0}.hp-service-floating .hp-service-art{width:85px}.hp-service-floating .hp-service-art img{max-height:90px}.hp-page-dim{position:fixed;inset:0;pointer-events:none;background:#000;z-index:-1}
.hp-game-summary-mobile{display:none}
.hp-game_card .hp-games{grid-template-columns:1fr;max-width:480px}.hp-cta{display:block;width:max-content;max-width:100%}.hp-cta>.hp-button{width:100%}

.hp-popup{min-width:min(280px,90vw)}.hp-home.hp-popup-open{overflow:hidden}

.hp-home .hp-legacy-deferred .hs-bg-layer,.hp-home .hp-legacy-deferred .side-image{background-image:none!important}
/* Corrective composition and motion. Existing v2 artwork and offsets are preserved. */
.hp-game{transition:transform .26s ease,box-shadow .26s ease,scale .26s ease}.hp-game-art{transition:scale .28s ease}.hp-game:hover,.hp-game:focus-within{transform:translate(var(--hp-x,0),calc(var(--hp-y,0px) - 3px));box-shadow:0 15px 32px #0004}.hp-game-art:hover,.hp-game-art:focus-visible{scale:1.025}.hp-game:active{scale:.99}
.hp-node[data-hp-composition=layered]{position:relative;isolation:isolate;display:block;overflow:visible}.hp-node[data-hp-composition=layered]>.hp-foreground{display:grid;grid-template-columns:repeat(var(--hp-columns,1),minmax(0,1fr));align-items:center;gap:var(--hp-gap,24px);position:relative;z-index:1;min-height:inherit}.hp-hero[data-hp-composition=layered]>.hp-foreground>.hp-copy{margin:0;max-width:none;padding:0;background:transparent}.hp-backdrop,.hp-backdrop-dim{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none;z-index:0}.hp-backdrop img,.hp-backdrop picture,.hp-backdrop video{width:100%;height:100%;object-fit:cover;min-height:0;border-radius:inherit}.hp-backdrop-dim{background:#000;opacity:0}.hp-backdrop .hp-playback-fallback{pointer-events:auto;position:absolute;left:12px;bottom:12px}.hp-foreground>.hp-node{min-width:0;grid-area:auto}.hp-home .hp-node img,.hp-home .hp-node picture,.hp-home .hp-game-art,.hp-home .hp-copy,.hp-home .hp-prose{position:relative}.hp-home .hp-node:has(>.hp-foreground){min-height:180px}.hp-home .hp-service-floating{width:min(330px,100%)}
.hp-youtube-load img{opacity:1}.hp-youtube-load:before{content:'';position:absolute;inset:0;background:#000;opacity:var(--hp-poster-dim,.08);z-index:0;pointer-events:none}.hp-youtube-load>.hp-play,.hp-youtube-load>span{position:relative;z-index:1}.hp-play{position:relative;overflow:hidden;transition:scale .24s ease,box-shadow .24s ease;background:#b13b20;box-shadow:0 5px 18px #0003}.hp-play:after{content:'';position:absolute;inset:-30% auto -30% -50%;width:28%;background:linear-gradient(90deg,transparent,#fff7,transparent);rotate:18deg;translate:-120% 0}.hp-youtube-load:hover .hp-play,.hp-youtube-load:focus-visible .hp-play{scale:1.06;box-shadow:0 7px 28px #c77a3a55}.hp-youtube-load:hover .hp-play:after,.hp-youtube-load:focus-visible .hp-play:after{animation:hp-button-shine .7s ease}.hp-youtube-load:active .hp-play{scale:.98}@keyframes hp-button-shine{from{translate:-120% 0}to{translate:700% 0}}
.hp-playback-fallback{border:1px solid #ba8e53;background:#3b2819;color:#f7ddac;border-radius:8px;min-height:42px;padding:8px 14px;font:700 14px Tajawal,Tahoma,sans-serif;cursor:pointer}.hp-playback-fallback[hidden]{display:none}.hp-youtube.is-blocked:after{content:'اضغط تشغيل للمتابعة';display:block;padding:8px 12px;font-size:13px;color:#edd3a7}.hp-youtube{min-height:200px}.hp-youtube iframe{min-height:200px}.hp-third-party{min-height:32px}
.hp-edit .hp-canvas-tools{position:absolute;inset:0;pointer-events:none;z-index:20}.hp-edit .hp-canvas-tools button{pointer-events:auto}.hp-edit .hp-selected{outline:2px solid #e3ba72;outline-offset:4px}.hp-edit .hp-handle{position:absolute;z-index:21;pointer-events:auto;border:1px solid #51371a;background:#dfbb78;color:#30200e;min-width:26px;min-height:26px;border-radius:5px;font:700 13px Tajawal,Tahoma,sans-serif;touch-action:none;cursor:grab}.hp-edit .hp-handle[data-hp-handle=resize]{width:20px;min-width:20px;height:20px;min-height:20px;bottom:-9px;left:-9px;cursor:nwse-resize}.hp-edit .hp-handle[data-hp-handle=move]{top:-13px;right:0}.hp-edit .hp-handle[data-hp-handle=split]{top:40%;left:50%;cursor:ew-resize;width:24px;height:52px;border-radius:12px}.hp-edit .hp-drop-target{outline:3px dashed #72c7b1;outline-offset:5px}.hp-edit .hp-dragging{opacity:.65;outline:2px dashed #dcb974}.hp-edit .hp-focus-pulse{animation:hp-focus-pulse .7s ease}.hp-edit .hp-size-indicator{z-index:22;bottom:20px}.hp-edit .hp-part-selected{position:relative}.hp-edit .hp-node{touch-action:pan-y}.hp-edit .hp-canvas-tools [data-hp-handle]{touch-action:none}
@keyframes hp-focus-pulse{50%{outline:4px solid #f9d58b;outline-offset:9px}}
@media(hover:none){.hp-game:hover{transform:translate(var(--hp-x,0),var(--hp-y,0px))}.hp-game-art:hover{scale:1}.hp-game:active .hp-game-art{scale:1.02}}
@media(max-width:767px){.hp-node[data-hp-composition=layered]>.hp-foreground{grid-template-columns:1fr}.hp-node[data-hp-composition=layered]>.hp-foreground>.hp-node{max-width:100%}.hp-home .hp-youtube{min-height:200px}.hp-backdrop .hp-playback-fallback{font-size:12px;min-height:36px}}
@media(prefers-reduced-motion:reduce){.hp-home *,.hp-home *:before,.hp-home *:after{animation:none!important;transition:none!important;scale:1!important;scroll-behavior:auto!important}.hp-game:hover{transform:translate(var(--hp-x,0),var(--hp-y,0px))!important}}
.hp-edit .hp-node:has(>.hp-canvas-tools){overflow:visible}

/* Explicit frame sizing preserves the media fit choice, independently of its grid cell. */
.hp-image:has(>picture),.hp-image:has(>a){display:block}.hp-image>picture,.hp-image>a,.hp-image>a>picture{height:inherit;min-height:inherit}.hp-image img{max-height:100%;height:inherit;min-height:inherit}.hp-video>video{height:inherit;max-height:100%;min-height:inherit}
.hp-edit .hp-snap-x:before,.hp-edit .hp-snap-y:after{content:'';position:absolute;inset:0;pointer-events:none;border:1px dashed #55c9b6;z-index:7}.hp-edit .hp-snap-x:before{border-block:0}.hp-edit .hp-snap-y:after{border-inline:0}

.hp-drag-ghost{pointer-events:none!important;opacity:.45;z-index:999;box-shadow:0 12px 32px #0006;outline:2px dashed #d8b574;overflow:hidden}

@media(prefers-reduced-motion:reduce){.hp-home .hp-node:hover,.hp-home [data-hp-part]:hover,.hp-home .hp-motion-test,.hp-home .hp-game:focus-within{transform:translate(var(--hp-x,0),var(--hp-y,0px))!important}}

.hp-node>.hp-backdrop-control{position:absolute;left:12px;bottom:12px;z-index:3;pointer-events:auto}

.hp-cta>.hp-button{height:inherit}

.hp-edit .hp-reveal{display:block!important;opacity:.65}

/* R2 media frames: poster positioning cannot be displaced by generic image rules. */
.hp-home .hp-node .hp-youtube-frame{position:relative;aspect-ratio:var(--hp-video-ratio,16/9);min-width:0;isolation:isolate;background:#160f0c}
.hp-home .hp-node .hp-youtube-frame>.hp-youtube-load,.hp-home .hp-node .hp-youtube-frame>iframe{position:absolute;inset:0;width:100%;height:100%;min-height:0;aspect-ratio:auto;margin:0;padding:0}
.hp-home .hp-node .hp-youtube-load>img.hp-youtube-poster{position:absolute;inset:0;width:100%;height:100%;min-height:0;max-height:none;object-fit:cover;aspect-ratio:auto;z-index:-1}
.hp-home .hp-node .hp-youtube,.hp-home .hp-node .hp-youtube iframe{min-height:0}
.hp-home .hp-node .hp-youtube-load>.hp-play{flex:none;line-height:1;min-width:60px}
.hp-home .hp-node .hp-youtube-load>span:last-child{font-size:clamp(12px,2vw,16px)}
.hp-home .hp-node .hp-third-party{min-height:0;line-height:1.6}
/* Composite children stay ordinary editable nodes. Playback never sits below an overlay. */
.hp-home .hp-composite{display:grid;grid-template-columns:var(--hp-media-layout,minmax(0,1fr));gap:var(--hp-composite-gap,20px);align-items:start;min-width:0;max-width:100%;isolation:isolate}
.hp-composite-stage{position:relative;isolation:isolate;min-width:0;display:grid;align-self:stretch;border-radius:inherit}
.hp-slot{min-width:0;max-width:100%}
.hp-composite-stage>.hp-slot-media{grid-area:1/1;position:relative;z-index:1;min-width:0}
.hp-slot-media>.hp-node{max-width:100%;margin:0}
.hp-slot-media>.hp-video:where(section){min-height:0;background:transparent}
.hp-slot-media>section.hp-video>video{width:100%;height:auto;min-height:0;aspect-ratio:var(--hp-ratio,16/9)}
.hp-composite-stage>.hp-slot-background{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;border-radius:inherit}
.hp-slot-background>.hp-image,.hp-slot-background img,.hp-slot-background picture{width:100%;height:100%;object-fit:cover}
.hp-composite-stage>.hp-slot-overlay{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:start;gap:16px;padding:clamp(12px,3vw,32px);pointer-events:none;overflow:visible}
.hp-slot-overlay>.hp-node{pointer-events:auto;max-width:100%;flex-shrink:0}
.hp-composite-body{display:flex;flex-direction:column;align-items:stretch;gap:16px;min-width:0;max-width:100%}
.hp-composite-body>.hp-node{min-width:0;flex-shrink:0}
.hp-composite .hp-node :where(h2,h3,p,a){overflow-wrap:anywhere;max-width:100%}
.hp-composite .hp-node.hp-cta{max-width:100%}
.hp-composite .hp-node.hp-cta>.hp-button{white-space:normal;min-height:44px}

.hp-edit .hp-drop-before{box-shadow:0 -4px 0 #72c7b1}.hp-edit .hp-drop-after{box-shadow:0 4px 0 #72c7b1}
.hp-edit .hp-overflow-warning{outline:2px dashed #ec9b56;outline-offset:4px}
.hp-home .hp-node .hp-youtube-load>.hp-play{position:absolute;left:50%;top:50%;translate:-50% -50%}
.hp-home .hp-node .hp-youtube-load>span:last-child{position:absolute;inset:auto 10px 8px;text-align:center;font-size:12px}
.hp-composite-stage>.hp-slot-overlay{position:relative;inset:auto;grid-area:1/1}
.hp-composite-stage:has(>.hp-slot-overlay)>.hp-slot-media>.hp-image{height:100%;display:grid}
.hp-composite-stage:has(>.hp-slot-overlay)>.hp-slot-media>.hp-image :where(img,picture,a){height:100%;min-height:100%}

/* R2C: stage stays singular; flow content and media groups use real layout. */
.hp-composite-above{grid-column:1/-1;min-width:0;display:flex;flex-direction:column;gap:var(--hp-body-gap,16px)}
.hp-composite-body{display:var(--hp-body-display,flex);flex-direction:var(--hp-body-flow,column);grid-template-columns:repeat(var(--hp-body-columns,2),minmax(0,1fr));gap:var(--hp-body-gap,16px)}
.hp-composite-body>.hp-node{flex:1 1 auto;min-width:0;max-width:100%}
.hp-home .hp-hero-media-flow{grid-template-columns:repeat(var(--hp-columns,2),minmax(0,1fr))}
.hp-home .hp-hero-media-flow>:is(.hp-image,.hp-video,.hp-youtube,.hp-playlist,.hp-background,.hp-overlay){grid-area:auto}
.hp-home .hp-hero-media-flow>.hp-copy{grid-area:auto;grid-column:1/-1;max-width:100%;margin:0}
.hp-home .hp-hero-media-flow>.hp-video video{min-height:0}
@media(max-width:767px){.hp-home .hp-hero-media-flow{--hp-columns:1}}

.hp-edit .hp-drop-invalid{outline:2px dashed #e88573;outline-offset:4px}

.hp-composite:not(:has(>.hp-composite-stage))>.hp-composite-body{grid-column:1/-1}

.hp-video:where(section){min-height:0}

.hp-composite-stage:has(>.hp-slot-background):not(:has(>.hp-slot-media,>.hp-slot-overlay)){min-height:240px}

/* R2E: avoid accidental overlap from separate image children in legacy image banner. */
.hp-home .hp-hero-media-flow>.hp-node{min-width:0;max-width:100%}
.hp-home :where(.hp-columns>.hp-node){min-width:0;max-width:100%}

/* R2E: horizontal drop zones within home preview; strict CSP compatible. */
.hp-edit .hp-drop-beside{outline:3px solid #d9a650!important;outline-offset:3px}

/* R2F: explicit media pairing inside a composite must occupy a real full row,
   even when the composite was previously in a two-column description layout.
   Other child rows are unchanged; no inline style/CSP relaxations. */
.hp-home .hp-composite-body > .hp-columns{grid-column:1/-1;min-width:0;width:100%;justify-self:stretch;align-self:stretch}
.hp-home .hp-composite:has(>.hp-composite-stage) > .hp-composite-body:has(>.hp-columns){grid-column:1/-1}
.hp-home .hp-composite-body > .hp-columns > .hp-node{min-width:0;max-width:100%}

/* R2G: A nested row in a legacy or layered hero MUST span its ancestor grid,
   otherwise 100% is only 100% of one HALF-width grid track. */
.hp-home .hp-hero > .hp-columns,
.hp-home .hp-hero > .hp-foreground > .hp-columns,
.hp-home .hp-container > .hp-columns:only-child {
  grid-column:1 / -1;
  min-width:0;
  justify-self:center;
  margin-inline:auto;
}
/* Respect media box width and expand both cells together; neither cell gets
   a per-item fixed width. Do not override user-selected unequal ratios. */
.hp-home .hp-columns > .hp-node {
  min-width:0;
  max-width:100%;
}
/* A dedicated center grip, visible whenever a row or either child is selected.
   Editing-only, accessible by pointer and keyboard; not rendered on live site. */
.hp-edit .hp-row-grow-handle {
  position:absolute;
  top:50%;left:50%;transform:translate(-50%,-50%);
  z-index:42;min-width:44px;min-height:44px;
  padding:4px 8px;border:2px solid #422c16;border-radius:13px;
  color:#24180d;background:#e9b762;box-shadow:0 3px 16px #0008;
  font:700 23px/1 Tajawal,Tahoma,sans-serif;cursor:ew-resize;
  touch-action:none;pointer-events:auto;
}
.hp-edit .hp-row-grow-handle:focus-visible {outline:3px solid #f9eccc;outline-offset:3px}
.hp-edit .hp-columns:has(> .hp-row-grow-handle){overflow:visible}
