/* October feedback: compact chrome; original artwork and export remain unchanged. */
html[data-artizia-studio] .az-smart-group{position:relative;padding:0;border:0;border-radius:20px;background:transparent;min-width:0}
html[data-artizia-studio] .az-smart-group>.ilr-card{margin:0!important;width:100%!important;box-sizing:border-box}
html[data-artizia-studio] .az-smart-placements summary{min-height:44px;width:44px;margin:0 auto;padding:0;color:#5701ef;background:transparent;border:0;list-style:none}
html[data-artizia-studio] .az-smart-placements summary:before,html[data-artizia-studio] .az-smart-placements summary::-webkit-details-marker{display:none;content:none}
html[data-artizia-studio] .az-smart-placements[open] summary{background:#ede7ff;border-radius:50%}
html[data-artizia-studio] .az-smart-placements>.ilr-card{margin:6px 0!important}
html[data-artizia-studio] body.imp-configurator .controls-panel .bg-sw-row{--az-swatch-step:72px;padding-inline-end:calc(var(--az-swatch-step)/2 + 8px)!important}
html[data-artizia-studio] body.imp-configurator .controls-panel .bg-sw-row>:nth-child(even){transform:translateX(calc(var(--az-swatch-step)/2))!important}
html[data-artizia-studio][dir="rtl"] body.imp-configurator .controls-panel .bg-sw-row>:nth-child(even),html[data-artizia-studio] body.imp-configurator[data-az-lang="ar"] .controls-panel .bg-sw-row>:nth-child(even){transform:translateX(calc(var(--az-swatch-step)/-2))!important}
/* Paint the actual selected button. A separate travelling pill retained an old size. */
html[data-artizia-studio] body.imp-configurator .bg-toptabs>.tabpill{display:none!important}
html[data-artizia-studio] body.imp-configurator .controls-panel .bg-toptabs.has-travel .bg-toptab.on,
html[data-artizia-studio] body.imp-configurator .bg-toptabs .bg-toptab.on{background:#ede7ff!important;color:#5701ef!important;border:1px solid #5701ef!important;box-shadow:none!important}
html[data-artizia-studio] body.imp-configurator .bg-toptabs .bg-toptab.on *{color:inherit!important}
/* Shared continuous rail shell. All constituent fills are opaque; the finished
   union receives alpha once, avoiding a darker overlap beneath either toggle. */
html[data-artizia-studio] body.imp-configurator :is(.ilr-shape-union,.az-rail-shape){filter:url(#az-rail-goo)!important;opacity:.64!important}
html[data-artizia-studio] body.imp-configurator :is(.ilr-shape-rail,.ilr-shape-lobe,.az-rail-plate,.az-rail-lobe){background:#ebe7fb!important}
html[data-artizia-studio] body.imp-configurator #imp-layer-rail .ilr-shape-layer{opacity:1!important}
html[data-artizia-studio] body.imp-configurator #imp-layer-rail .ilr-shape-lobe{display:block!important;left:-48px!important;width:76px!important;height:56px!important;border-radius:28px 0 0 28px!important}
html[data-artizia-studio] body.imp-configurator #imp-layer-rail .ilr-lobes{left:-48px!important;width:56px!important}
html[data-artizia-studio] body.imp-configurator #imp-layer-rail .ilr-lobe{width:56px!important;height:56px!important;flex-basis:56px!important;display:grid!important;place-items:center!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;color:#5701ef!important}
html[data-artizia-studio] body.imp-configurator #imp-layer-rail .ilr-lobe-label{display:none!important}
html[data-artizia-studio] body.imp-configurator #imp-layer-rail .ilr-panel{background:transparent!important;border:0!important;box-shadow:none!important}
html[data-artizia-studio] #az-angle-toggle{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;min-width:56px;min-height:56px;padding:0;border:0;border-radius:50%;background:transparent;color:#5701ef;font:inherit;cursor:pointer;align-self:center;flex:none;box-shadow:none;position:relative;z-index:1}
html[data-artizia-studio] #az-angle-toggle::before{display:none!important}
html[data-artizia-studio] #az-angle-toggle:focus-visible{outline:3px solid #0048fd;outline-offset:2px}
html[data-artizia-studio] body.imp-configurator #mk-dots{display:flex!important;flex-direction:column!important;align-items:center!important;gap:0!important;padding:0 8px 8px!important;border-radius:0!important;box-shadow:none!important;background:transparent!important;border:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;overflow:visible!important;isolation:isolate;clip-path:inset(-20px -20px 0);pointer-events:none!important}
html[data-artizia-studio] #mk-dots .az-rail-shape{position:absolute;inset:0;z-index:0;pointer-events:none}
html[data-artizia-studio] #mk-dots .az-rail-plate{position:absolute;inset:56px 0 0;border-radius:28px}
html[data-artizia-studio] #mk-dots .az-rail-lobe{position:absolute;top:0;left:calc(50% - 28px);width:56px;height:76px;border-radius:28px 28px 0 0}
html[data-artizia-studio] #mk-dots .mk-dots-bar{position:relative;z-index:1;background:transparent!important;box-shadow:none!important}
/* One unchanged silhouette slides below its own bottom edge. No circle swap. */
html[data-artizia-studio] #mk-dots > :is(.az-rail-shape,#az-angle-toggle,.mk-dots-bar){translate:0 0;transition:translate .32s cubic-bezier(.2,.7,.2,1)}
html[data-artizia-studio] #mk-dots.az-angles-collapsed > :is(.az-rail-shape,#az-angle-toggle,.mk-dots-bar){translate:0 var(--az-angle-travel,108px)}
html[data-artizia-studio] #mk-dots :is(#az-angle-toggle,.mk-dots-bar){pointer-events:auto}
html[data-artizia-studio] #mk-dots.az-angles-collapsed .mk-dots-bar{pointer-events:none}
@media(prefers-reduced-motion:reduce){html[data-artizia-studio] #mk-dots > :is(.az-rail-shape,#az-angle-toggle,.mk-dots-bar){transition:none}}
html[data-artizia-studio] body.imp-configurator #mk-dots :is(.mk-arrow,.mk-dots-name){display:none!important}
html[data-artizia-studio] body.imp-configurator #mk-dots-row .mk-thumb.on{outline:0!important}
html[data-artizia-studio] body.az-journey-active #imp-cluster #az-save-status{width:44px!important;min-width:44px!important;max-width:44px!important;height:44px!important;min-height:44px!important;padding:0!important;display:inline-flex!important;align-items:center;justify-content:center;border-radius:50%!important}
html[data-artizia-studio] #az-save-status svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html[data-artizia-studio] #az-save-status .az-save-check{opacity:0}
html[data-artizia-studio] #az-save-status[data-save-state="saved"] .az-save-check{opacity:1}
html[data-artizia-studio] #az-save-status[data-save-state="saving"] svg{animation:az-save-pulse 1s ease-in-out infinite}
html[data-artizia-studio] #az-save-status[data-save-state="error"]{color:#a81e22!important}
html[data-artizia-studio] .az-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
html[data-artizia-studio] .az-saving-cover{align-content:center;gap:20px}
html[data-artizia-studio] .az-saving-cover>.az-journey-loading-label{margin:0;max-width:32ch;text-align:center}
html[data-artizia-studio] .az-saving-cover button{min-height:44px;padding:10px 22px;border:1px solid #ded9f1;border-radius:999px;background:#fff;color:#5701ef;font:inherit;cursor:pointer}
html[data-artizia-studio] .az-saving-cover button:focus-visible{outline:3px solid #0048fd;outline-offset:3px}
@keyframes az-save-pulse{50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){html[data-artizia-studio] #az-save-status[data-save-state="saving"] svg{animation:none}}
@media(max-width:699px), (max-width:1024px) and (orientation:portrait){
 html[data-artizia-studio] body.az-journey-active #imp-cluster{grid-template-columns:minmax(0,1fr) auto 44px 44px!important}
 html[data-artizia-studio] body.az-journey-active #imp-cluster #az-save-status{grid-area:1/2!important;width:auto!important}
 html[data-artizia-studio] body.az-journey-active #imp-cluster #az-share{grid-area:2/3/3/5!important}
 html[data-artizia-studio] body.az-journey-active #imp-cluster #az-studio-shortcuts{grid-area:2/1/3/3!important}
 html[data-artizia-studio] body.az-journey-active .controls-panel .bg-sw-row{--az-swatch-step:50px}
 html[data-artizia-studio] body.az-journey-active.in-preview #tag-mockup{inset:var(--az-preview-offset,0px) auto auto 50%!important;transform:translateX(-50%);object-position:top center!important;width:min(100vw,max(80px,calc(100dvh - var(--az-header) - 132px - env(safe-area-inset-bottom) - var(--az-active-sheet) - 56px)))!important}
}
@media(min-width:1025px), (min-width:700px) and (orientation:landscape){
 html[data-artizia-studio] body.az-journey-active.in-preview #tag-mockup{inset:0 auto auto 50%!important;transform:translateX(-50%);object-position:top center!important;width:min(100%,1200px,calc(100dvh - var(--az-header) - 56px))!important}
}
/* One measured band bounds the silhouette and every flex parent of its scroller.
   Keep the lobe outside the panel; only the actual layer list scrolls. */
html[data-artizia-studio] body.imp-configurator #imp-layer-rail[data-az-rail-bounded]{top:var(--az-layer-top)!important;right:var(--az-layer-right)!important;left:auto!important;bottom:auto!important;transform:var(--az-layer-transform)!important;max-height:var(--az-layer-height)!important}
html[data-artizia-studio] body.imp-configurator #imp-layer-rail[data-az-rail-bounded] .ilr-panel{box-sizing:border-box!important;max-height:var(--az-layer-height)!important;min-height:0!important}
html[data-artizia-studio] body.imp-configurator #imp-layer-rail[data-az-rail-bounded] :is(.ilr-pane,.ilr-pane-body){flex:1 1 auto!important;min-height:0!important;max-height:none!important}
html[data-artizia-studio] body.imp-configurator #imp-layer-rail[data-az-rail-bounded] .ilr-layers-list{min-height:0!important;overflow-y:auto!important;overscroll-behavior:contain}

/* Mode buttons already paint their own selected state; the legacy travelling
   marker otherwise leaves a black crescent, especially after RTL reordering. */
html[data-artizia-studio] body.imp-configurator #mode-toggle .mt-pill{display:none!important}
html[data-artizia-studio] body.imp-configurator #mode-toggle button.on{background:#ede7ff!important;color:#5701ef!important}
@media(max-width:420px){
 html[data-artizia-studio] body.az-designer-active[data-az-designer-lang="ar"] #site-header .site-header{display:grid!important;grid-template-columns:44px minmax(44px,1fr) auto;gap:4px!important;padding-inline:6px!important}
 html[data-artizia-studio] body.az-designer-active[data-az-designer-lang="ar"] #site-header #imp-back-btn{width:44px!important;min-width:44px!important;height:44px!important}
 html[data-artizia-studio] body.az-designer-active[data-az-designer-lang="ar"] #site-header .site-logo{min-width:0;width:100%;justify-content:center}
 html[data-artizia-studio] body.az-designer-active[data-az-designer-lang="ar"] #site-header .az-studio-wordmark{max-width:100%!important;height:28px!important}
 html[data-artizia-studio] body.az-designer-active[data-az-designer-lang="ar"] #site-header :is(.header-actions,#az-studio-shortcuts){gap:4px!important;margin-inline:0!important;min-width:0}
 html[data-artizia-studio] body.az-designer-active[data-az-designer-lang="ar"] #site-header :is(#az-studio-shortcuts button,.settings-btn,#az-designer-account){min-width:44px!important;min-height:44px!important;padding-inline:5px!important;font-size:12px!important}
}

/* Anchor the continuous collapsed lobe to the real workspace edge, just like
   the side rail. A floating clipping edge otherwise looks like a cut-off tab. */
html[data-artizia-studio] body.imp-configurator #mk-dots[data-az-edge]{position:fixed!important;top:auto!important;bottom:var(--az-angle-bottom)!important;left:var(--az-angle-left)!important;right:auto!important;transform:translateX(-50%)!important;max-width:var(--az-angle-width)!important}
html[data-artizia-studio] body.imp-configurator #mk-dots[data-az-edge] #mk-dots-row{max-width:calc(var(--az-angle-width) - 16px)!important}
/* Language controls can be Arabic even while the rest of the interface is English. */
html[data-artizia-studio] body.imp-configurator #az-studio-shortcuts button[lang="ar"]{font-family:ArtiziaStudioAlexandria,Arial,sans-serif!important}
html[data-artizia-studio] body.imp-configurator #az-studio-shortcuts button[lang="en"]{font-family:ArtiziaStudioOutfit,ArtiziaStudioAlexandria,Arial,sans-serif!important}
html[data-artizia-studio] body.imp-configurator .settings-dropdown :is(button,span){font-family:var(--imp-font,ArtiziaStudioOutfit),ArtiziaStudioAlexandria,Arial,sans-serif!important}
