/* VO RWD 11.10.2026. The canonical 390/1440 composition stays the anchor.

   Additional widths use fluid tracks and centered, bounded compositions. */

:root{--vo-rwd-content:1200px;--vo-rwd-scene:1440px;--vo-rwd-safe-bottom:env(safe-area-inset-bottom,0px)}

.vo-site :is(a,button,summary):focus-visible{outline:2px solid var(--accent);outline-offset:3px}

.vo-site .vo-field:focus-within{border-color:var(--accent)}

/* Avoid a photo/copy overlap and a 50px copy jump at the 480px band. */

@media(max-width:850px){.home-page .home-hero__copy{padding-top:calc(82px + 94.4871795%)}}

/* A scene is rendered once. Its subject and background keep the same aspect ratio. */

@media(min-width:851px){

 .home-page main{width:min(100%,var(--vo-rwd-scene));margin-inline:auto}

 .home-page .home-hero{background-image:none;background-color:#f8e7dc}

}

@media(min-width:1251px){

 .home-page .home-hero picture>img{inset:0;width:100%;height:100%;object-fit:cover;object-position:center;mask-image:none;-webkit-mask-image:none}

}

/* The intermediate desktop uses a single portrait subject beside the copy. */

@media(min-width:851px) and (max-width:1250px){

 .home-page .home-hero picture>img{height:100%;width:50%;object-fit:contain;object-position:center;mask-image:linear-gradient(to left,#000 70%,transparent);-webkit-mask-image:linear-gradient(to left,#000 70%,transparent)}

}

/* Small phones: let controls and text determine their block size. */

@media(max-width:389px){

 .vo-site :is(.vo-btn,.vo-chip){height:auto;white-space:normal;max-width:100%;overflow-wrap:anywhere}

 .vo-site .vo-product-card .vo-btn{padding:8px 6px;font-size:12px}

 .vo-site :is(.vo-product-card__title,.vo-product-card__price,.vo-product-card__body,.vo-cat-card__title){overflow-wrap:anywhere}

 .vo-site .vo-product-card .vo-product-card__title{white-space:normal;overflow:visible;max-height:none;height:auto;text-overflow:clip;overflow-wrap:anywhere}

 .vo-site .vo-black-banner__copy{max-width:100%;min-width:0}

 .vo-site .vo-black-banner__copy h2{white-space:normal}

 .vo-site .vo-black-banner--with-art .vo-black-banner__copy .vo-btn--action{white-space:normal;padding:8px;min-height:44px;font-size:11px}

 .home-page .home-hero__copy{padding-inline:20px}

 .home-page .home-hero__copy>.home-phone>p{white-space:normal;font-size:clamp(18px,5.9vw,23px)}

 .home-page .home-made{gap:8px}

 .home-page .home-made .home-word{max-width:48%}

 .home-page :is(.home-example-tabs,.home-platforms){flex-wrap:wrap}

 .home-page .vo-promo .vo-btn{height:auto;white-space:normal;padding-block:8px}

 .home-page .home-paths .home-path{min-width:0}

 .home-page section.home-paths .home-path.home-path--create{padding-left:clamp(100px,calc(100vw - 222px),168px)}

 .home-page section.home-paths .home-path.home-path--create h3{font-size:22px;overflow-wrap:normal}

 .home-page section.home-paths .home-path.home-path--create .vo-btn{font-size:13px;gap:6px;white-space:normal}

 .home-page .vo-cat-card__title{font-size:14px;line-height:1.3;overflow-wrap:anywhere}

 .home-page .home-game h3,.home-page .vo-promo h3{overflow-wrap:anywhere}

 .home-page .home-game-mood{font-size:18px}

 .home-page .home-game-mood strong{font-size:24px}

 .home-page section.home-games .home-game :is(h3,p){overflow-wrap:anywhere;white-space:normal}

 .home-page section.home-games .home-game-mood{font-size:16px}

 .home-page section.home-games .home-game-mood strong{font-size:28px}

 .home-page section.home-games .home-game-mood em{font-size:15px}

 .home-page section.home-story .vo-btn--outline{min-width:0;white-space:normal;height:auto;padding:8px 10px;font-size:13px}

 .home-page section.home-story .home-story-strip{flex-wrap:wrap;gap:12px}

 .home-page section.home-story .home-story-strip p{white-space:normal}

 .home-page section.home-club h3{flex-wrap:wrap;white-space:normal}

 .home-page .home-contact-phone{font-size:clamp(21px,7vw,28px)}

 .ab__pack{grid-template-columns:minmax(0,1fr) minmax(0,46%)}

 .ab__pack h3{white-space:normal}

 .ab__taste-word{max-width:100%}

 .ab__title{font-size:20px;overflow-wrap:anywhere}

 .ab__stats b{font-size:17px}

 .works-promo{min-width:0;padding:12px}

 .works-promo h3{font-size:14px;line-height:20px;overflow-wrap:anywhere}

 .bl__title,.bl__list-h{white-space:normal;overflow-wrap:anywhere}

 .dl__pickup h2{font-size:20px;white-space:normal;overflow-wrap:anywhere}

 .vo-cookie--settings .vo-cookie__actions{margin-top:28px}

 .p404{width:100%;grid-template-columns:minmax(0,1fr)}

 .p404>:is(svg,img,figure,div,h1,p){min-width:0;max-width:100%}

 .p404__title{font-size:clamp(27px,8.4vw,33px);overflow-wrap:anywhere}

 .ab__stats{grid-template-columns:repeat(3,minmax(0,1fr))}

 .ab__stats li{min-width:0}

 .ab__stats span{overflow-wrap:anywhere}

 .ct__row{grid-template-columns:28px minmax(0,1fr);gap:8px}

 .ct__row .ct__btn{grid-column:2;width:100%;margin-top:4px}

 .ct__value{overflow-wrap:anywhere}

 .dl__stats>div,.dl__fragile li{min-width:0;overflow-wrap:anywhere}

 .dl__stats b{font-size:12px;white-space:normal}

 .dl__stats,.dl__benefits{grid-template-columns:repeat(3,minmax(0,1fr))}

 .em-wrap,.em-wrap table{table-layout:fixed;max-width:100%}

 .em-wrap td{overflow-wrap:anywhere}

 .em-wrap img{max-width:100%;height:auto}

}

/* Larger phones and tablets gain readable gutters without stretching cards. */

@media(min-width:480px) and (max-width:850px){

 .vo-site :is(.vo-page,.catalog-content,.category-content,.o3-wrap,.o6-content){margin-inline:clamp(20px,4vw,34px)}

 .catalog-page .products{gap:16px}

 .catalog-page .vo-product-card__photo{height:auto;aspect-ratio:1.35;object-fit:cover}

 .home-page .home-hero__copy{padding-top:calc(82px + 94.4871795%);padding-inline:30px}

}

@media(min-width:600px) and (max-width:850px){

 .catalog-page .products{grid-template-columns:repeat(3,minmax(0,1fr))}

 .catalog-page .catalog-content>h1{font-size:28px}

 .catalog-page .subtitle{font-size:14px;white-space:normal}

 .vo-site .vo-product-card .vo-btn{height:auto;min-height:44px;padding:8px 10px}

 .home-page .home-work-grid{gap:16px}

}

/* Tight desktop widths: navigation may collapse before it collides. */

@media(min-width:851px) and (max-width:1023px){

 .vo-site .topbar .nav{display:none}

 .vo-site .topbar .head-actions{margin-left:auto}

 .vo-site .topbar .head-action.menu{display:grid}

 .vo-site .topbar .head-action{width:36px;min-height:44px}

 .vo-cart .cart-layout{grid-template-columns:minmax(0,1fr) 320px;gap:24px}

 .home-page section.home-games{height:auto;min-height:0;padding-bottom:48px}

 .home-page section.home-games .home-games-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}

}

@media(min-width:851px) and (max-width:1199px){

 .category-page .vo-product-card .vo-product-card__title{white-space:normal;overflow:visible;text-overflow:clip;max-height:none;height:auto;overflow-wrap:anywhere}

 .category-page .vo-product-card__body > .vo-btn{margin-top:auto}

 .vo-site .vo-subcat-panel--bento{grid-template-columns:repeat(2,minmax(0,1fr))}

 .vo-site .vo-subcat-panel--bento .vo-subcat--invite{grid-column:1/-1}

 .vo-site .vo-subcat-panel--bento .vo-subcat--collage .vo-subcat-photos{width:100%;max-width:min(460px,100%)}

 .vo-site .vo-subcat-panel--bento .vo-subcat--collage .vo-subcat-photos img{width:150px;max-width:calc((100% - 8px)/3);min-width:0;height:auto;aspect-ratio:150/190;flex:0 1 150px}

 .catalog-page .products{grid-template-columns:repeat(3,minmax(0,1fr))}

 .catalog-page .desktop-filters{flex-wrap:wrap;gap:12px}

 .catalog-page .filters{gap:16px}

 .vo-site .ab__hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}

 .vo-site .ab__title{font-size:clamp(26px,3.1vw,41px);margin-top:48px}

 .vo-site .ab__btns{flex-wrap:wrap;margin-top:24px}

 .vo-site .ab__btns .ab__btn{width:100%;height:auto;min-height:44px;padding:10px 28px}

 .vo-site .ab__steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}

 .vo-site .ab__taste{grid-template-columns:minmax(0,1.2fr) repeat(2,minmax(0,1fr))}

 .vo-site .ab__facts{grid-template-columns:minmax(0,1fr);gap:24px}

 .vo-site .ab__pack{padding-left:0;border-left:0}

}

@media(min-width:851px) and (max-width:1250px){

 .product-page .product-heading h1{white-space:normal;overflow-wrap:anywhere}

 .home-page .home-save__grid{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1fr);gap:20px}

 .home-page .home-save__grid h3{font-size:clamp(20px,2.5vw,30px);overflow-wrap:anywhere}

 .home-page .home-save__grid p{font-size:15px;line-height:1.5;overflow-wrap:anywhere}

 .home-page .home-game h3{font-size:clamp(18px,2.1vw,24px);overflow-wrap:anywhere}

 .home-page .home-game p{font-size:15px;overflow-wrap:anywhere}

 .home-page .home-subcats .vo-promo h3{white-space:normal;overflow-wrap:anywhere}

 .home-page section[data-block^="home-subcats"] .vo-promo h3{white-space:normal;overflow-wrap:anywhere}

 .home-page section.home-games .home-game :is(h3,p){overflow-wrap:anywhere;white-space:normal}

}

@media(min-width:1251px) and (max-width:1439px){

 .reviews-photo{left:auto;right:0;width:min(403px,34%)}

}

@media(min-width:1441px){

 .reviews-photo{left:auto;right:0;width:403px}

}

/* Short/landscape windows: the whole dialog remains reachable above the dock. */

@media(max-height:600px){

 .vo-site :is(.vo-menu,.vo-shell-dialog,.vo-cart-picker){top:12px;bottom:auto;max-height:calc(100dvh - 24px);overflow-y:auto}

 .vo-site .vo-cookie--banner{max-height:calc(100dvh - 12px);overflow-y:auto}

}

@supports(padding:env(safe-area-inset-bottom)){

 .mobile-dock{margin-bottom:var(--vo-rwd-safe-bottom)}

 @media(max-width:850px){.vo-footer{padding-bottom:calc(110px + var(--vo-rwd-safe-bottom))}}

}



@media(max-width:389px){.account-home .account-bag{width:84px;top:32px}.account-home [data-block="next"] :is(h2,h3,p){max-width:calc(100% - 92px)}}



@media(max-width:389px){.dl__stats{grid-template-columns:1fr}.dl__stat{min-height:44px;gap:10px}.dl__stat p,.dl__stat b{font-size:12px;white-space:normal;overflow-wrap:normal}}



@media(max-width:850px){.vo-site .vo-filter-actions{display:grid;grid-template-columns:minmax(100px,.8fr) minmax(0,1.4fr);gap:10px}.vo-site .vo-filter-actions .vo-btn{padding:10px 12px;height:auto;min-height:44px;white-space:normal;overflow-wrap:normal;word-break:normal}}



.vo-site .o3-field-hint [data-char-count]{white-space:nowrap;flex:none}



.o6-mood-result{min-width:0;max-width:100%}

@media(max-width:389px){.vo-site .vo-music-genre-card{grid-template-columns:minmax(84px,32%) minmax(0,1fr);gap:10px}.vo-site .vo-music-genre-card>img{width:100%;height:auto;aspect-ratio:1}.vo-site .vo-music-genre-card>:not(img){min-width:0}}



/* Text fixes observed in real frames. Canonical source remains in separate working folders. */

@media(max-width:389px){

 .home-page section[data-block] .vo-cat-card--wide{grid-template-columns:45% minmax(0,1fr)}

 .home-page section[data-block] .vo-cat-card .vo-cat-card__title{font-size:14px;line-height:18px;white-space:normal;word-break:normal;overflow-wrap:normal}

 .home-page section[data-block] .vo-cat-card .vo-btn{width:100%;max-width:100%;padding:6px 8px;gap:6px;height:auto;min-height:36px;font-size:13px;line-height:1.3;white-space:normal;word-break:normal;overflow-wrap:normal}

 .home-page section.home-works .home-work-grid>.vo-promo{grid-column:1/-1;min-height:0;height:auto;display:flex;flex-direction:column;gap:12px;padding:16px}

 .home-page section.home-works .home-work-grid>.vo-promo>div{display:contents}

 .home-page section.home-works .home-work-grid>.vo-promo>img{position:static;order:2;width:min(220px,100%);height:auto;max-height:220px;object-fit:contain;margin-inline:auto}

 .home-page section.home-works .home-work-grid>.vo-promo h3{font-size:20px;line-height:1.25;white-space:normal;word-break:normal;overflow-wrap:normal;margin:0}

 .home-page section.home-works .home-work-grid>.vo-promo p{font-size:13px;line-height:1.5;margin:0}

 .home-page section.home-works .home-work-grid>.vo-promo .vo-btn{position:static;order:3;width:100%;height:auto;min-height:44px;padding:10px 12px;font-size:14px;line-height:1.3;gap:6px;white-space:normal;word-break:normal;overflow-wrap:normal;margin-top:0}

 .catalog-page .filters{gap:6px}

 .catalog-page .filters .today{font-size:12px;line-height:16px;height:auto;min-height:36px;white-space:nowrap;gap:5px;padding:6px 7px}

 .catalog-page .filters .today i{font-size:14px;flex:none}

}

@media(max-width:850px){

 .home-page section.home-contacts .home-contacts-grid>div+div .vo-btn{line-height:1.4;height:auto;min-height:36px;padding:6px 0;gap:8px}

 .catalog-page .catalog-banner .vo-btn{font-size:12px;white-space:normal;min-height:44px;height:auto;line-height:1.3;padding:8px 10px}

}

@media(min-width:851px) and (max-width:1250px){

 .home-page section.home-games{height:auto;min-height:0;padding-bottom:48px}

 .home-page section.home-games .home-games-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}

}

@media(min-width:1024px) and (max-width:1279px){.ct__btn{font-size:13px;gap:4px;padding-inline:6px}}



@media(max-width:850px){.vo-cart .vo-cart-when .vo-btn{font-size:12px;line-height:1.3;min-height:36px;padding-inline:8px}.vo-cart .hint .vo-btn{font-size:12px;line-height:16px;min-height:36px;padding-block:4px;white-space:normal}}

.vo-music-soon-action{font-size:12px}



@media(max-width:389px){.home-page section.home-works .home-work-group[data-work-group] .home-work-grid>.vo-promo{grid-column:1/-1;grid-row:auto}.home-page section.home-works .home-work-group[data-work-group] .home-work-grid>.home-work{grid-column:auto;grid-row:auto}}



@media(max-width:850px){.vo-cart .vo-cart-when .ch{font-size:12px;line-height:1.3;min-height:36px;padding-inline:6px}}

.vo-site .vo-music-circle.vo-music-soon-action{font-size:12px}



@media(min-width:851px) and (max-width:1250px){.vo-site .o6-music .vo-music-moods{grid-template-columns:repeat(3,minmax(0,1fr))}}



@media(max-width:389px){.vo-site[data-page="GENERATE"] .o3-tabs{flex-wrap:wrap;overflow:visible;gap:6px 12px}.vo-site[data-page="GENERATE"] .o3-tabs button,.vo-site[data-page="GENERATE"] .o3-tabs a{flex:0 0 auto}}



.vo-site.listing-pending .products{min-block-size:calc(100svh - 80px)}

.vo-site.listing-pending .products:empty:before{content:"Загружаем товары…";display:block;color:var(--muted);font-size:14px;padding:32px 16px;border-radius:12px;background:linear-gradient(100deg,#f3ebe6,#faf6f2,#f3ebe6)}


/* LEGAL-HUB: inline phone SVG needs the same size as the contact icon font. */
.vo-site .legal-hub__contacts svg.i{width:24px;height:24px;max-width:24px;max-height:24px;flex:0 0 24px}
@media(max-width:479px){
 .vo-site .legal-hub__contacts{grid-template-columns:minmax(0,1fr);gap:4px}
 .vo-site .legal-hub__contacts a{gap:12px;min-width:0}
 .vo-site .legal-hub__contacts .vo-icon{width:24px;flex:0 0 24px}
 .vo-site .legal-hub__contacts a span{white-space:nowrap}
}
@media(min-width:1024px){.vo-site .legal-hub__contacts svg.i{display:none}}


/* F12-1: accepted scene and full-width ambient surfaces. */

@media(max-width:850px){
 .home-page .home-hero{background:linear-gradient(180deg,#f6dccb 0,#f8e2d4 330px,var(--canvas) 470px)}
 .home-page .home-hero picture>img[data-embed="dissolve"]{top:66px;left:0;width:100%;height:auto;aspect-ratio:780/737;object-fit:contain;mask-image:linear-gradient(to bottom,transparent 0,#000 8%,#000 96%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 8%,#000 96%,transparent 100%)}
 .home-page .home-hero__copy{padding-top:calc(82px + 94.4871795%)}
}
@media(min-width:851px){
 .home-page .home-hero{background-image:none;background-color:#f8e7dc}
 .home-page .home-hero picture>img[data-embed="dissolve"]{inset:0;width:100%;height:100%;object-fit:cover;object-position:center;mask-image:none;-webkit-mask-image:none}
}
@media(min-width:1024px){.vo-site.catalog-page .products{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:851px) and (max-width:1439px){
 .home-page .home-hero{height:max(520px,calc(100vw * 624 / 1440));background:linear-gradient(180deg,#f6dccb,var(--canvas) calc(100vw * 624 / 1440))}
 .home-page .home-hero picture>img[data-embed="dissolve"]{height:auto;aspect-ratio:1440/624;object-fit:contain;object-position:center top;mask-image:linear-gradient(to bottom,#000 calc(100% - 24px),transparent);-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 24px),transparent)}
 .home-page .home-hero__copy{padding-top:clamp(125px,11.4583vw,165px)}
}
@media(min-width:1441px){
 .home-page main{width:100%;max-width:none}
 .home-page section[data-block^="home"]{width:1440px;max-width:100%;margin-inline:auto;overflow:visible;isolation:isolate}
 .home-page section.home-hero{width:100%;background:linear-gradient(180deg,#f6dccb 0%,#f8e6d8 58%,var(--canvas) 100%);overflow:hidden}
 .home-page .home-hero picture>img[data-embed="dissolve"]{left:50%;right:auto;transform:translateX(-50%);width:1440px;mask-image:linear-gradient(to right,transparent,#000 120px,#000 calc(100% - 120px),transparent);-webkit-mask-image:linear-gradient(to right,transparent,#000 120px,#000 calc(100% - 120px),transparent)}
 .home-page .home-hero__copy{margin-left:calc((100% - 1440px)/2)}
 .home-page section.home-paths::after{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);background:radial-gradient(ellipse 900px 550px at calc(50% - 520px) 55%,#fbe2e4aa,transparent 75%);pointer-events:none}
 .home-page section.home-paths .home-path__cream-pic{mask-image:radial-gradient(ellipse,#000 45%,transparent 75%);-webkit-mask-image:radial-gradient(ellipse,#000 45%,transparent 75%)}
 .home-page section>.home-tech{right:calc((1440px - 100vw)/2);mask-image:linear-gradient(to bottom,#000 65%,transparent);-webkit-mask-image:linear-gradient(to bottom,#000 65%,transparent)}
 .home-page section.home-paths .home-paths__continuous-tech{right:calc((1440px - 100vw)/2)}
 .home-page section.home-music::before{left:calc((1440px - 100vw)/2);right:calc((1440px - 100vw)/2)}
 .vo-site.catalog-page,.vo-site.category-page,.vo-site.product-page,.vo-site.vo-cart{background:radial-gradient(ellipse 70vw 720px at 80% 250px,rgba(255,222,201,.4),transparent 75%),var(--canvas)}
}