#shoprilAIButton{position:absolute;z-index:5;right:18px;bottom:calc(100px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:9px;padding:10px 15px 10px 10px;border-radius:40px;background:#202c3b;color:#fff;font-size:14px;font-weight:750;box-shadow:0 5px 24px #202c3b35}#shoprilAIButton[hidden]{display:none}.ai-orb{display:block;width:34px;height:34px;border-radius:50%;background:conic-gradient(from 20deg,#ff8000,#ffcb70,#ff8000,#f34b22,#ff8000);box-shadow:inset 0 0 9px #fff8;animation:ai-breathe 3s ease-in-out infinite}.ai-orb.large{width:70px;height:70px;margin:8px auto 16px}.ai-panel{position:absolute;inset:0;z-index:30;background:#fff;color:#202c3b;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top)}.ai-panel[hidden]{display:none}.ai-head{display:flex;align-items:center;gap:10px;padding:18px 18px 12px;border-bottom:1px solid #edf0f3}.ai-head div{flex:1}.ai-head strong{font-size:18px}.ai-head small{display:block;font-size:12px;color:#727a84}.ai-close{background:#f1f3f6;border-radius:50%;width:40px;height:40px;font-size:24px;color:#202c3b}.ai-scroll{flex:1;min-height:0;overflow:auto;padding:20px 16px;overscroll-behavior:contain}.ai-welcome{text-align:center;padding:12px 12px 22px}.ai-welcome h2{font-size:23px;margin:0 0 8px}.ai-welcome p{font-size:14px;line-height:1.6;color:#737b85;margin:0}.ai-prompts{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:16px 0}.ai-prompts button{font-size:14px;background:#fff5e9;border:1px solid #ffe0b9;color:#874000;border-radius:20px;padding:9px 12px}.ai-message{font-size:15px;line-height:1.6;margin:10px 0;padding:12px 14px;background:#f2f4f7;border-radius:16px;overflow-wrap:anywhere;white-space:pre-wrap}.ai-message.user{background:#fff0dc;margin-left:30px}.ai-message.assistant{margin-right:20px}.ai-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0}.ai-controls{padding:12px 16px calc(16px + env(safe-area-inset-bottom));border-top:1px solid #edf0f3;background:white}.ai-status{font-size:14px;min-height:22px;text-align:center;margin:0 0 12px;color:#68717c}.ai-call-buttons{display:flex;gap:10px;justify-content:center;margin-bottom:12px}.ai-call-buttons button{border-radius:24px;padding:11px 18px;font-size:14px;font-weight:750;background:#202c3b;color:white}.ai-call-buttons .ai-end{background:#fff0ee;color:#bf3e30}.ai-call-buttons button:disabled{opacity:.5;cursor:default}.ai-text-form{display:flex;gap:8px}.ai-text-form input{min-width:0;flex:1;border:1px solid #e1e5ea;border-radius:24px;padding:12px 15px;font:inherit;color:#202c3b;background:#f7f8fa}.ai-text-form button{background:#ff8000;color:white;font-size:14px;font-weight:750;border-radius:24px;padding:0 16px}.ai-panel[data-state=speaking] .ai-orb{animation:ai-breathe .5s ease-in-out infinite}.ai-panel[data-state=connecting] .ai-orb{animation:ai-spin 2s linear infinite}.ai-note{font-size:12px;text-align:center;color:#8b939e;margin:8px 0 0}@keyframes ai-breathe{50%{transform:scale(.86);filter:brightness(1.2)}}@keyframes ai-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.ai-orb,.ai-panel .ai-orb{animation:none!important}}
.ai-preferences{display:flex;gap:10px;margin:16px 0 8px;text-align:left}.ai-preferences label{flex:1;min-width:0;font-size:14px;color:#526071}.ai-preferences select{display:block;width:100%;margin-top:6px;padding:10px 8px;border-radius:10px;border:1px solid #e1e5ea;background:white;color:#202c3b;font:inherit}.ai-welcome .ai-pairing-note{font-size:12px;line-height:1.5;color:#7a838e}
.ai-voice-mode{margin-top:14px;text-align:left}.ai-voice-mode label{font-size:14px;color:#526071}.ai-voice-mode select{display:block;width:100%;margin-top:6px;padding:10px;border-radius:10px;border:1px solid #e1e5ea;background:white;color:#202c3b;font:inherit}

.ai-panel[data-input-mode=voice] .ai-message{display:none}.ai-results .explore-video-card{min-width:0;position:relative;grid-column:auto!important;grid-row:auto!important}.ai-results .explore-open-video{width:100%;aspect-ratio:3/4;height:auto;overflow:hidden}.ai-results .explore-open-video video,.ai-results .product-thumbnail-cover{width:100%;height:100%;object-fit:cover}.ai-results .explore-card-title{max-width:100%}

.ai-results{display:flex;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:14px;background:#fb8b18;border-radius:14px;touch-action:pan-x pan-y;scrollbar-width:thin}.ai-results .explore-video-card{flex:0 0 218px;width:218px;scroll-snap-align:start;background:white;border-radius:12px;overflow:hidden}.ai-results .explore-open-video{border-radius:0;aspect-ratio:3/4}.ai-results .explore-card-title{text-align:left;width:100%;padding:8px 10px;font-size:13px}.ai-results .explore-card-meta{padding:0 10px 10px}.ai-results .explore-image-cart{position:absolute;top:250px;right:8px}.ai-results .explore-basket-button{width:34px;height:34px;background:#ffdf39;color:#202c3b;border-radius:11px}.ai-results .explore-basket-button svg{width:22px;height:22px}@media(max-width:480px){.ai-results .explore-video-card{flex-basis:180px;width:180px}.ai-results .explore-image-cart{top:204px}}

.ai-results .explore-image-cart{display:block;position:absolute;top:0;left:0;right:auto;width:100%;aspect-ratio:3/4;pointer-events:none;z-index:4}.ai-results .explore-image-cart .explore-basket-button{position:absolute;bottom:8px;right:8px;pointer-events:auto;margin:0}

.ai-live-buttons{display:none}.ai-top-language select{padding:9px;border:1px solid #eee;border-radius:18px;background:#fff7ed;color:#202c3b;font:inherit;font-size:14px}.ai-preferences{display:none}.ai-product-popup{position:absolute;inset:0;z-index:5;background:#fff;overflow:auto;padding:18px 16px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:14px}.ai-product-video{width:100%;max-height:48dvh;min-height:200px;object-fit:contain;background:#141414;border-radius:18px}.ai-product-back{position:absolute;right:24px;top:26px;border-radius:50%;width:40px;height:40px;background:#fff;color:#202c3b;font-size:26px;box-shadow:0 2px 10px #0003}.ai-product-options{display:grid;gap:12px}.ai-product-options h2{font-size:20px;margin:0}.ai-product-options small{color:#727a84}.ai-product-options label{display:grid;gap:6px;font-size:14px}.ai-product-options select,.ai-product-options input{padding:12px;border:1px solid #dde2e7;border-radius:12px;background:white;font:inherit;width:100%;box-sizing:border-box}.ai-product-total{color:#e36e00}.ai-product-add{padding:14px;border-radius:14px;background:#ff8000;color:white;font-weight:750}.ai-product-add:disabled{opacity:.5}
@media(max-width:1099px){.ai-panel[data-input-mode=voice]{position:fixed;inset:0;height:100dvh;max-height:100dvh;background:#202c3b;padding-top:env(safe-area-inset-top);z-index:100}.ai-panel[data-input-mode=voice] .ai-head{background:white;padding:18px 20px;border:0;flex:none}.ai-panel[data-input-mode=voice] .ai-head .ai-orb{width:26px;height:26px}.ai-panel[data-input-mode=voice] .ai-head strong{font-size:24px}.ai-panel[data-input-mode=voice] .ai-head small,.ai-panel[data-input-mode=voice] .ai-close{display:none}.ai-panel[data-input-mode=voice] .ai-scroll{background:white;border-radius:0 0 38px 38px;padding:20px 12px;position:relative}.ai-panel[data-input-mode=voice] .ai-welcome{display:none}.ai-panel[data-input-mode=voice] .ai-scroll:after{content:'';display:block;height:140px;background:radial-gradient(ellipse at 50% 100%,#ff9a38aa,transparent 70%);position:absolute;bottom:0;left:0;right:0;pointer-events:none}.ai-panel[data-input-mode=voice] .ai-conversation{position:relative;z-index:1}.ai-panel[data-input-mode=voice] .ai-results{background:#fff;padding:0 0 12px;margin:8px 0;scrollbar-width:thin}.ai-panel[data-input-mode=voice] .ai-controls{background:#202c3b;border:0;padding:16px 20px calc(24px + env(safe-area-inset-bottom));flex:none}.ai-panel[data-input-mode=voice] .ai-status{color:#fff;font-size:13px}.ai-panel[data-input-mode=voice] .ai-text-form,.ai-panel[data-input-mode=voice] .ai-call-buttons,.ai-panel[data-input-mode=voice] .ai-note{display:none}.ai-panel[data-input-mode=voice] .ai-live-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.ai-live-buttons button{height:60px;border-radius:32px;background:#354354;color:white;display:grid;place-items:center}.ai-live-buttons svg{width:27px;height:27px}.ai-live-buttons .ai-live-close{background:#ff8000;font-size:38px}.ai-live-buttons .ai-live-mic.muted{background:#99512d}.ai-product-popup{padding-top:calc(18px + env(safe-area-inset-top))}.ai-product-back{top:calc(26px + env(safe-area-inset-top))}}

.ai-live-buttons .ai-live-mic.hearing{background:#ff8000;box-shadow:0 0 0 5px #ff800033}.ai-live-buttons .ai-live-mic.muted{box-shadow:none}

/* Compact Explore cards and an in-Live product sheet. */
.ai-panel .ai-results{background:white;padding:0 0 12px;gap:12px}
.ai-panel .ai-results .explore-video-card{flex:0 0 min(44vw,180px);width:min(44vw,180px);border:1px solid #e0e0e0;border-radius:16px;background:#f4f5f6}
.ai-panel .ai-results .explore-card-title{font-size:14px;line-height:1.35;font-weight:750;padding:10px 8px 5px;min-height:0;background:#f4f5f6}
.ai-panel .ai-results .explore-card-meta{display:flex!important;padding:5px 8px 10px;font-size:12px!important;background:#f4f5f6}
.ai-panel .ai-results .explore-image-cart{display:block!important}
.ai-panel .ai-results .explore-basket-button{width:40px;height:40px;border-radius:12px;background:#ffdf39;color:#111}
.ai-panel .ai-results .product-rating-count{top:auto!important;bottom:43px!important;left:8px!important;right:auto!important;background:#0009;border-radius:20px;color:#ffdf39;padding:4px 7px;font-size:12px}
.ai-panel .ai-results .ai-card-likes{position:absolute;bottom:8px;left:8px;background:#0009;color:white;border-radius:20px;padding:4px 7px;font-size:12px}
.ai-panel .ai-results .product-view-count,.ai-panel .ai-results .product-town-label,.ai-panel .ai-results .explore-play{display:none!important}
.ai-panel .ai-product-popup{inset:0;padding:16px;background:#0006;display:flex;justify-content:center;align-items:center;overflow:auto}
.ai-product-sheet{position:relative;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:16px;padding:16px;border-radius:24px;background:#fffaf1;width:100%;max-width:680px;max-height:90dvh;overflow:auto}
.ai-product-surface{position:relative;min-width:0;align-self:start;border-radius:14px;overflow:hidden;background:#111}
.ai-panel .ai-product-video{display:block;width:100%;min-height:0;max-height:65dvh;aspect-ratio:9/16;object-fit:cover;border-radius:0}
.ai-product-full{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);background:#0009;color:white;padding:8px 12px;border-radius:24px;font-size:12px;white-space:nowrap}
.ai-product-sheet .ai-product-options{align-content:center;gap:12px;padding:18px 0 0}
.ai-product-sheet .ai-product-options h2{font-size:17px;line-height:1.3}
.ai-product-sheet .ai-product-options small{font-size:14px;color:#222}
.ai-product-sheet .ai-product-total{font-size:20px}.ai-product-rating{font-size:13px;color:#846500;margin:0}
.ai-product-details,.ai-product-choose{padding:12px 8px;border-radius:12px;font-weight:750;font-size:14px;background:#fff;border:1px solid #ddd;color:#202c3b;text-align:left}
.ai-product-choose{background:#ff8000;border-color:#ff8000;color:#111;text-align:center}
.ai-product-sheet .ai-product-back{top:8px;right:8px;width:32px;height:32px;font-size:24px;box-shadow:none;background:#f2f3f4}
.ai-product-choices{display:grid;gap:12px;grid-column:1/-1}.ai-product-choices[hidden],.ai-product-description[hidden]{display:none}
.ai-product-description{grid-column:1/-1;font-size:14px}.ai-product-sheet:fullscreen,.ai-product-surface:fullscreen{background:#111}.ai-product-surface:fullscreen video{object-fit:contain;max-height:100dvh;height:100dvh}

/* Use the existing Trending card contents without relocating the shop label. */
.ai-panel .ai-results .explore-basket-button{display:flex!important;align-items:center;justify-content:center;padding:8px;pointer-events:auto}
.ai-panel .ai-results .product-rating-count{transform:none!important}
.ai-panel .ai-results .video-view-count{display:none!important}
.ai-panel .ai-results .explore-card-meta{justify-content:flex-start!important;margin:0!important;min-height:0!important}
.ai-panel .ai-results .marketplace-shop-name{position:static!important;transform:none!important;padding:0!important;background:none!important;color:#727971!important;font-size:12px!important}
.ai-panel .ai-results .shop-video-likes{bottom:8px!important;left:8px!important;font-size:12px!important}
.ai-panel .ai-product-choices label{display:grid;gap:6px;font-size:14px}
.ai-panel .ai-product-choices select,.ai-panel .ai-product-choices input{display:block;width:100%;min-height:44px;padding:10px 12px;box-sizing:border-box;border:1px solid #dde2e7;border-radius:12px;background:white;color:#202c3b;font:inherit}
.ai-panel .ai-product-choices{gap:12px}

.ai-product-step{position:absolute;inset:0;z-index:8;background:#0007;display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box}
.ai-product-step-box{width:100%;max-width:480px;max-height:85dvh;overflow:auto;overscroll-behavior:contain;background:#fffaf1;border-radius:24px;padding:18px;box-sizing:border-box;box-shadow:0 12px 40px #0003}
.ai-product-step-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.ai-product-step-head h2{font-size:20px;margin:0}.ai-step-close{flex:none;background:#f0f1f2;color:#202c3b;width:38px;height:38px;font-size:26px;border-radius:50%}
.ai-product-step .ai-product-description{display:block}.ai-product-step .product-details-body{display:block!important;max-height:none;overflow:visible}.ai-product-step .ai-product-choices{display:grid;gap:16px}
.ai-cart-confirmation{display:grid;gap:16px}.ai-cart-confirmation p{margin:0;font-size:16px}.ai-cart-confirmation strong{color:#dc7200;font-size:20px}.ai-cart-confirmation button{width:100%;text-align:center}

/* Ruby is a main page; the bottom menu stays available in both text and voice. */
.ruby-view{position:absolute;inset:0 0 calc(83px + env(safe-area-inset-bottom));z-index:3;background:white;color:#202c3b}
.ruby-view.hidden{display:none!important}
#rubyView .ai-panel,#rubyView .ai-panel[data-input-mode=voice]{position:absolute;inset:0;height:100%;max-height:100%;z-index:1}
#mainNav{gap:0;justify-content:space-around}
#mainNav .nav-btn{flex:1;min-width:0}
#mainNav .ruby-nav{gap:3px;font-weight:750}
#mainNav .ruby-nav-icon{width:40px;height:40px;animation:none;box-shadow:inset 0 0 9px #fff8,0 2px 9px #ff800033}
#mainNav .ruby-nav.active .ruby-nav-icon{box-shadow:inset 0 0 9px #fff8,0 0 0 3px #ff800033}
@media(max-width:1099px){#shoprilAIButton{display:none!important}}
@media(min-width:1100px){.ruby-view{bottom:calc(62px + env(safe-area-inset-bottom))}}

/* The centre assistant entry uses the orb alone. */
#mainNav .ruby-nav{align-self:stretch;align-content:center;gap:0;min-height:48px}
#mainNav .ruby-nav-icon{animation:ruby-nav-motion 6s ease-in-out infinite;will-change:transform}
@keyframes ruby-nav-motion{0%{transform:rotate(0deg) scale(.94)}50%{transform:rotate(180deg) scale(1.04)}100%{transform:rotate(360deg) scale(.94)}}
@media(prefers-reduced-motion:reduce){#mainNav .ruby-nav-icon{animation:none;will-change:auto}}

.ruby-introduction{position:absolute;left:16px;right:16px;bottom:calc(83px + env(safe-area-inset-bottom));z-index:8;display:flex;align-items:center;gap:12px;min-height:88px;padding:16px;background:#fff;color:#202c3b;border-radius:20px 20px 0 0;box-shadow:0 -8px 30px #0003}
.ruby-introduction[hidden]{display:none}.ruby-introduction .ai-orb{flex:none;width:38px;height:38px}.ruby-introduction div{flex:1;min-width:0}.ruby-introduction strong{font-size:18px}.ruby-introduction p{font-size:14px;margin:3px 0}.ruby-introduction small{display:block;font-size:14px;color:#68717c}.ruby-introduction button{flex:none;width:32px;height:32px;background:#f1f3f6;border-radius:50%;font-size:23px;color:#202c3b}
#mainNav .ruby-nav{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
#mainNav .ruby-holding .ruby-nav-icon{animation:ruby-nav-motion 1s ease-in-out infinite}
.ruby-activation-glow{position:absolute;inset:0;z-index:120;pointer-events:none;border-radius:inherit;opacity:0;transition:opacity .2s;box-shadow:inset 4px 0 14px #ff8000,inset -4px 0 14px #a678ff,inset 0 -6px 22px #ff8b2a,inset 0 3px 12px #54b5ff}
.ruby-activation-glow.active{opacity:1;animation:ruby-edge-glow .8s ease-in-out infinite alternate}
@keyframes ruby-edge-glow{to{filter:hue-rotate(45deg);box-shadow:inset 5px 0 20px #ff8000,inset -5px 0 20px #a678ff,inset 0 -10px 32px #ff8b2a,inset 0 4px 18px #54b5ff}}
@media(min-width:1100px){.ruby-introduction{bottom:calc(62px + env(safe-area-inset-bottom));max-width:480px;margin:auto}}
@media(prefers-reduced-motion:reduce){.ruby-activation-glow.active{animation:none}.ruby-activation-glow{transition:none}}
/* Transparent Ruby brand mark across the assistant surfaces. */
.ai-orb{background:transparent url('/ruby-icon.png') center/contain no-repeat;border-radius:0;box-shadow:none}
#mainNav .ruby-nav-icon,#mainNav .ruby-nav.active .ruby-nav-icon{width:52px;height:52px;border-radius:0;box-shadow:none;animation:ruby-brand-dance 8s cubic-bezier(.45,0,.55,1) infinite;filter:drop-shadow(0 1px 2px #ffffff80)}
#mainNav .ruby-holding .ruby-nav-icon{animation:ruby-brand-awaken .65s ease-out forwards}
@keyframes ruby-brand-dance{0%{transform:rotate(0deg) scale(.94);filter:drop-shadow(0 1px 2px #ffffff80)}35%{transform:rotate(120deg) scale(1.04);filter:drop-shadow(0 0 4px #ff800080)}70%{transform:rotate(240deg) scale(.96);filter:drop-shadow(0 1px 2px #ffffff80)}100%{transform:rotate(360deg) scale(.94);filter:drop-shadow(0 1px 2px #ffffff80)}}
@keyframes ruby-brand-awaken{to{transform:rotate(160deg) scale(1.15);filter:drop-shadow(0 0 8px #ff8000aa)}}
@media(prefers-reduced-motion:reduce){#mainNav .ruby-nav-icon,#mainNav .ruby-holding .ruby-nav-icon{animation:none}}

/* Compact Ruby welcome with only the main shopping controls. */
.ai-welcome{padding:8px 4px 12px}
.ai-welcome h2{font-size:22px;line-height:1.3;margin:0 0 14px}
.ai-welcome .ai-orb.large{width:60px;height:60px;margin:4px auto 18px}
.ai-prompts{margin:12px 0;gap:8px}
.ai-scroll{padding:16px 14px}
.ai-controls{padding:12px 16px 16px}
.ai-head{padding:14px 16px;gap:10px}
.ai-head div{min-width:0}
/* The supplied transparent orb rotates while its inner light flows separately. */
.ai-orb{position:relative;background-image:url('/ruby-orb.png');isolation:isolate;animation:ruby-orb-turn 14s linear infinite;overflow:visible}
.ai-orb::after{content:'';position:absolute;inset:13%;border-radius:50%;background:transparent url('/ruby-orb.png') center/contain no-repeat;mix-blend-mode:screen;opacity:.38;pointer-events:none;animation:ruby-inner-flow 5s ease-in-out infinite}
#mainNav .ruby-nav-icon,#mainNav .ruby-nav.active .ruby-nav-icon{background-image:url('/ruby-orb.png');animation:ruby-orb-turn 14s linear infinite;filter:drop-shadow(0 0 3px #ff800070)}
#mainNav .ruby-holding .ruby-nav-icon{animation:ruby-orb-awaken .65s ease-out forwards}
.ai-panel[data-state=speaking] .ai-orb::after{animation-duration:1.6s}
@keyframes ruby-orb-turn{from{transform:rotate(0deg) scale(.97)}50%{transform:rotate(180deg) scale(1.03)}to{transform:rotate(360deg) scale(.97)}}
@keyframes ruby-inner-flow{0%,100%{transform:rotate(0deg) scale(.92);opacity:.25}50%{transform:rotate(-180deg) scale(1.1);opacity:.5}}
@keyframes ruby-orb-awaken{to{transform:rotate(110deg) scale(1.15);filter:drop-shadow(0 0 9px #ff8000aa)}}
@media(prefers-reduced-motion:reduce){.ai-orb,.ai-orb::after,#mainNav .ruby-nav-icon,#mainNav .ruby-holding .ruby-nav-icon{animation:none!important}}

@media(max-width:1099px){.ai-welcome .ruby-desktop-welcome{display:none}}
/* Meet the compact menu directly, without an exposed device background. */
.ruby-view{bottom:62px}
.ruby-introduction{bottom:62px}
@media(min-width:1100px){.ruby-view{bottom:0}}
/* Smaller Live and Ruby header title. */
.ai-panel .ai-head .ai-heading,.ai-panel[data-input-mode=voice] .ai-head .ai-heading{font-size:18px;line-height:1.25}
/* Draw an activation line beneath the menu, above system navigation. */
.ruby-activation-glow{inset:auto 0 0;height:4px;border-radius:3px;box-shadow:none;background:linear-gradient(90deg,#ff8000,#ffcc54,#f65896,#936bff,#4caaff,#ff8000);background-size:200% 100%;transform:scaleX(0);transform-origin:center;transition:none;filter:none}
.ruby-activation-glow.active{opacity:1;box-shadow:none;animation:ruby-line-draw .65s ease-out forwards,ruby-line-colours 1.5s linear infinite}
@keyframes ruby-line-draw{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes ruby-line-colours{to{background-position:200% 0}}
@media(prefers-reduced-motion:reduce){.ruby-activation-glow.active{animation:none;transform:scaleX(1)}}

@media(min-width:1100px){
 .desktop-shop-header #shoprilAIButton{position:static;flex:none;display:flex;align-items:center;gap:7px;padding:7px 12px;font-size:14px;white-space:nowrap;background:#fff3e5;color:#202c3b;box-shadow:none;border:1px solid #ffdfb7;margin-left:-10px}
 .desktop-shop-header #shoprilAIButton .ai-orb{width:30px;height:30px}
 .desktop-shop-header .desktop-search-slot{flex:1 1 260px;min-width:120px}
}
/* One viewport and one menu height on phones and tablets, including Android WebView. */
@media(max-width:1099px){
 .stage{padding:0!important;height:100dvh;min-height:0;align-items:stretch}
 .stage .device{width:100%;height:100dvh!important;min-height:0!important;max-height:none;border-radius:0;box-shadow:none}
 .device{--mobile-menu-height:calc(62px + env(safe-area-inset-bottom,0px))}
 #mainNav{height:var(--mobile-menu-height);min-height:var(--mobile-menu-height);box-sizing:border-box;padding:0 0 env(safe-area-inset-bottom,0px);align-items:stretch;overflow:hidden}
 #mainNav .nav-btn{height:62px;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:4px 0;box-sizing:border-box;line-height:1.15;font-size:12px}
 #mainNav .nav-btn svg{width:23px;height:23px;flex:none}
 #mainNav .ruby-nav-icon{width:48px;height:48px;flex:none}
 #rubyView{bottom:var(--mobile-menu-height)}
 #rubyView .ai-panel,#rubyView .ai-panel[data-input-mode=voice]{height:auto;max-height:none;padding-top:0;box-sizing:border-box;overflow:hidden}
 #rubyView .ai-head{flex:0 0 64px;min-height:64px;box-sizing:border-box;padding:12px 16px}
 #rubyView .ai-scroll{min-height:0}
 .ruby-introduction{bottom:var(--mobile-menu-height)}
}
/* Older Android WebViews need a measured viewport fallback for svh/dvh. */
@media(max-width:1099px){
 .stage,.stage .device{height:var(--shopril-viewport-height,100vh)!important}
 .device{--mobile-menu-height:62px}
 #feed:not(.single-video-view) .purchase-dock{bottom:calc(var(--mobile-menu-height) + 10px)!important}
 #feed:not(.single-video-view) .details{bottom:calc(var(--mobile-menu-height) + 62px)!important}
 #feed:not(.single-video-view) .actions{bottom:calc(var(--mobile-menu-height) + 78px)!important}
}
@supports(padding-bottom:env(safe-area-inset-bottom)){
 @media(max-width:1099px){.device{--mobile-menu-height:calc(62px + env(safe-area-inset-bottom))}}
}
/* Native Android already keeps the WebView above the system navigation bar. */
@media(max-width:1099px){
 html.shopril-native-android .device{--mobile-menu-height:62px!important}
 html.shopril-native-android #mainNav{height:62px!important;min-height:62px!important;max-height:62px!important;padding:0!important}
 html.shopril-native-android #rubyView .ai-controls{padding-bottom:16px}
 html.shopril-native-android #rubyView .ai-panel[data-input-mode=voice] .ai-controls{padding-bottom:24px}
}
/* Bring feed navigation higher on tall or larger mobile screens. */
@media(max-width:1099px) and (min-height:740px), (min-width:400px) and (max-width:1099px){
 #feed>.topbar{top:14px;top:calc(14px + env(safe-area-inset-top))}
 html.shopril-native-android #feed>.topbar{top:14px}
}
/* A little more breathing room above navigation on tall mobile screens. */
@media(max-width:1099px) and (min-height:740px){
 #feed>.topbar{top:24px;top:calc(24px + env(safe-area-inset-top))}
 html.shopril-native-android #feed>.topbar{top:24px}
}
/* Float Ruby's introduction clear of the menu with four visible corners. */
.ruby-introduction{border-radius:20px;border:1px solid #edf0f3}
@media(max-width:1099px){.ruby-introduction{bottom:calc(var(--mobile-menu-height,62px) + 12px)}}
@media(min-width:1100px){.ruby-introduction{bottom:calc(74px + env(safe-area-inset-bottom))}}
/* The Android wrapper already excludes system bars: do not reserve them twice. */
@media(max-width:1099px){
 html.shopril-native-android #feed.single-video-view .explore-product-strip{bottom:8px}
 html.shopril-native-android #feed.single-video-view .similar-items-label{bottom:83px}
 html.shopril-native-android #feed.single-video-view .purchase-dock{bottom:12px!important}
 html.shopril-native-android #feed.single-video-view .details{bottom:76px!important}
 html.shopril-native-android #feed.single-video-view .actions{bottom:112px!important}
 html.shopril-native-android #feed.single-video-view.with-product-strip .purchase-dock{bottom:108px!important}
 html.shopril-native-android #feed.single-video-view.with-product-strip .details{bottom:172px!important}
 html.shopril-native-android #feed.single-video-view.with-product-strip .actions{bottom:160px!important}
}

/* Related shop products fit above the menu on tall portrait home feeds. */
@media(max-width:1099px) and (max-aspect-ratio:3/5){
 #feed:not(.single-video-view).home-related-strip .explore-product-strip{bottom:calc(var(--mobile-menu-height) + 8px)}
 #feed:not(.single-video-view).home-related-strip .similar-items-label{bottom:calc(var(--mobile-menu-height) + 83px)}
 #feed:not(.single-video-view).home-related-strip .purchase-dock{bottom:calc(var(--mobile-menu-height) + 108px)!important}
 #feed:not(.single-video-view).home-related-strip .details{bottom:calc(var(--mobile-menu-height) + 168px)!important}
 #feed:not(.single-video-view).home-related-strip .actions{bottom:calc(var(--mobile-menu-height) + 166px)!important}
 #feed:not(.single-video-view).home-related-strip .playback-controls{top:34%}
}
/* Keep the home feed concise when related products are present. */
#feed.home-related-strip:not(.single-video-view) .details .video-description,
#feed.home-related-strip:not(.single-video-view) .details .expand-desc{display:none!important}

@media(max-width:1099px){
 .ai-panel .ai-results{display:grid;grid-template-columns:repeat(var(--ruby-columns,3),minmax(0,180px));justify-content:start;gap:8px;overflow-x:visible;scroll-snap-type:none}
 .ai-panel .ai-results .explore-video-card{width:100%;min-width:0;max-width:none;flex:none;border-radius:12px}
 .ai-panel .ai-results .explore-card-title{font-size:12px;padding:8px 6px 4px;overflow-wrap:anywhere}
 .ai-panel .ai-results .marketplace-shop-name{font-size:10px!important;min-width:0}
 .ai-panel .ai-results .explore-basket-button{width:30px;height:30px}
 .ai-panel .ai-results .explore-card-meta{font-size:10px;padding-left:6px;padding-right:6px;min-width:0}
}

#feed.ruby-product-reel #shopFeedBack,#feed.ruby-product-reel #shopFeedName{display:none!important}
.ruby-reel-back{position:absolute;z-index:25;bottom:16px;left:16px;right:16px;width:calc(100% - 32px);height:48px;border:1px solid #e1e1e1;border-radius:12px;background:#fff;color:#202b39;font-family:inherit;font-size:16px;font-weight:700;box-shadow:0 2px 8px #0002;cursor:pointer}
#feed.ruby-product-reel .details{bottom:84px!important}
#feed.ruby-product-reel .actions{bottom:170px!important}
/* Ruby brand mark supplied by the owner. */
.ai-orb,#mainNav .ruby-nav-icon,#mainNav .ruby-nav.active .ruby-nav-icon{background:transparent url('/ruby-logo-v2.webp') center/contain no-repeat;border-radius:0;box-shadow:none;filter:none;animation:ruby-logo-breathe 5s ease-in-out infinite}
.ai-orb::after{content:none;display:none}
#mainNav .ruby-holding .ruby-nav-icon{animation:ruby-logo-breathe 1s ease-in-out infinite}
@keyframes ruby-logo-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@media(prefers-reduced-motion:reduce){.ai-orb,#mainNav .ruby-nav-icon,#mainNav .ruby-holding .ruby-nav-icon{animation:none!important}}

/* The navigation mark follows the same size and state colour as adjacent icons. */
#mainNav .ruby-nav{gap:3px;font-weight:400}
#mainNav .ruby-nav.active{font-weight:700}
#mainNav .ruby-nav-icon,#mainNav .ruby-nav.active .ruby-nav-icon,#mainNav .ruby-holding .ruby-nav-icon{width:23px;height:23px;flex:none;background:currentColor;background-image:none;-webkit-mask:url('/ruby-logo-v2.webp') center/130% no-repeat;mask:url('/ruby-logo-v2.webp') center/130% no-repeat;animation:none!important;transform:none;filter:none;box-shadow:none;will-change:auto}
#mainNav .ruby-nav-label{font:inherit;line-height:inherit;color:inherit}
