@font-face{ font-family: Eugusto; src: url(https://67a6c5ee-79b3-4d13-b994-62ada632a987.selstorage.ru/sitemapphoto/newtest/EugustoFreePersonalUse-Regular.otf); }
.kbn{
  --ink: #141414; --muted: #7a7a7a; --line: #e7e5e1; --paper: #fff; --cream: #f4f1ec; --accent: #8a1c1c;
  --f: Montserrat, -apple-system, Helvetica, Arial, sans-serif;
}
.kbn, .kbn *{ box-sizing: border-box; margin: 0; padding: 0; }
.kbn{ background: #d9d6d0; font-family: var(--f); color: var(--ink); }
.kbn img{ display: block; width: 100%; height: 100%; object-fit: cover; }
.kbn a{ color: inherit; text-decoration: none; cursor: pointer; }
.kbn svg{ width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.kbn svg.fill{ fill: currentColor; stroke: none; }
.kbn{ background: var(--paper); overflow: hidden; position: relative; box-shadow: 0 20px 60px rgba(0,0,0,.18); }
.kbn.m{ width: 390px; border-radius: 28px; padding-bottom: 72px; }
.kbn.d{ width: 1440px; }
.kbn .brand{ font-family: Eugusto; font-size: 26px; letter-spacing: .02em; }
.kbn .btn{ display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 48px; padding: 0 26px; font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.kbn .btn.sm{ height: 40px; padding: 0 18px; font-size: 11px; }
.kbn .btn svg{ width: 18px; height: 18px; }
.kbn .btn.light{ background: #fff; color: var(--ink); }
.kbn .btn.dark{ background: var(--ink); color: #fff; }
.kbn .btn.ghost{ border: 1px solid currentColor; color: inherit; }
.kbn .block{ padding: 36px 16px 8px; }
.kbn .head{ display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; margin-bottom: 16px; }
.kbn h2{ font-size: 20px; font-weight: 600; letter-spacing: -.01em; }
.kbn .sub{ font-size: 12px; color: var(--muted); margin-top: 4px; }
.kbn .more{ display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 500; white-space: nowrap; border-bottom: 1px solid var(--ink); padding-bottom: 2px; }
.kbn .more svg{ width: 14px; height: 14px; }
.kbn .badge{ position: absolute; top: -4px; right: -6px; background: var(--ink); color: #fff; font-size: 9px; width: 16px; height: 16px; border-radius: 50%; display: grid; place-items: center; }
.kbn .ticker{ background: var(--ink); color: #fff; font-size: 10px; font-weight: 500; letter-spacing: .1em; height: 30px; display: flex; align-items: center; gap: 32px; white-space: nowrap; overflow: hidden; padding: 0 16px; }
.kbn .ticker span::before{ content: '●'; margin-right: 32px; opacity: .4; font-size: 6px; vertical-align: middle; }
.kbn .ticker span:first-child::before{ display: none; }
.kbn .nav{ height: 56px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; border-bottom: 1px solid var(--line); background: #fff; position: relative; }
.kbn .nav .ic{ display: flex; gap: 16px; position: relative; }
.kbn .stories{ display: flex; gap: 12px; padding: 14px 16px 12px; overflow: hidden; }
.kbn .st{ width: 68px; flex: none; text-align: center; font-size: 10px; font-weight: 500; }
.kbn .ring{ width: 64px; height: 64px; border-radius: 50%; padding: 2px; background: linear-gradient(135deg, #141414, #8a1c1c 60%, #c9a27a); margin: 0 auto 6px; }
.kbn .ring img{ border-radius: 50%; border: 2px solid #fff; }
.kbn .st.seen .ring{ background: var(--line); }
.kbn .hero{ position: relative; height: 560px; margin: 0 0 0; overflow: hidden; color: #fff; }
.kbn .hero::after{ content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,0) 30%, rgba(0,0,0,.55)); }
.kbn .bars{ position: absolute; z-index: 2; top: 12px; left: 16px; right: 16px; display: flex; gap: 4px; }
.kbn .bars i{ flex: 1; height: 2px; background: rgba(255,255,255,.4); }
.kbn .bars i.on{ background: #fff; }
.kbn .hero-txt{ position: absolute; z-index: 2; left: 16px; right: 16px; bottom: 92px; }
.kbn .kicker{ font-size: 12px; letter-spacing: .12em; text-transform: uppercase; opacity: .9; margin-bottom: 8px; }
.kbn h1{ font-size: 30px; line-height: 1.05; font-weight: 600; letter-spacing: .01em; margin-bottom: 18px; }
.kbn .hero-next{ position: absolute; z-index: 2; left: 16px; right: 16px; bottom: 16px; display: flex; gap: 8px; }
.kbn .hero-next div{ flex: 1; display: flex; align-items: center; gap: 8px; background: rgba(0,0,0,.35); backdrop-filter: blur(8px); padding: 6px; font-size: 9px; font-weight: 600; letter-spacing: .05em; }
.kbn .hero-next img{ width: 34px; height: 44px; }
.kbn .hero-d{ display: grid; grid-template-columns: 2fr 1fr; gap: 8px; height: 720px; padding: 8px; }
.kbn .hd-main{ position: relative; overflow: hidden; color: #fff; min-height: 0; }
.kbn .hd-main > img, .kbn .hd-side img{ position: absolute; inset: 0; }
.kbn .hd-side{ min-height: 0; }
.kbn .hd-main::after{ content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.45), rgba(0,0,0,0) 55%); }
.kbn .hd-main .hero-txt{ left: 56px; bottom: 64px; right: auto; }
.kbn .hd-main h1{ font-size: 56px; }
.kbn .hd-main .bars{ top: auto; bottom: 28px; left: 56px; right: auto; width: 200px; }
.kbn .btns{ display: flex; gap: 12px; }
.kbn .btns .ghost{ color: #fff; }
.kbn .hd-side{ display: grid; grid-template-rows: 1fr 1fr; gap: 8px; }
.kbn .hd-side div{ position: relative; overflow: hidden; color: #fff; }
.kbn .hd-side span{ position: absolute; left: 24px; bottom: 24px; font-size: 16px; font-weight: 600; letter-spacing: .04em; text-shadow: 0 1px 12px rgba(0,0,0,.4); }
.kbn .hd-side em{ display: flex; align-items: center; gap: 6px; font-style: normal; font-size: 12px; font-weight: 500; margin-top: 6px; }
.kbn .hd-side em svg{ width: 14px; height: 14px; }
.kbn .chips{ display: flex; gap: 8px; padding: 16px; overflow: hidden; border-bottom: 1px solid var(--line); }
.kbn .chips a{ flex: none; height: 34px; padding: 0 14px; border: 1px solid var(--line); border-radius: 17px; font-size: 12px; font-weight: 500; display: flex; align-items: center; }
.kbn .chips a.on{ background: var(--ink); color: #fff; border-color: var(--ink); }
.kbn .chips a.sale{ color: var(--accent); border-color: var(--accent); }
.kbn .row{ display: flex; gap: 8px; overflow: hidden; }
.kbn .card{ flex: none; width: 168px; }
.kbn .card-img{ position: relative; aspect-ratio: 3/4; background: #f5f5f5; }
.kbn .tag{ position: absolute; top: 8px; left: 8px; background: #fff; font-size: 9px; font-weight: 700; letter-spacing: .08em; padding: 4px 7px; }
.kbn .tag.new{ background: var(--ink); color: #fff; }
.kbn .fav{ position: absolute; top: 6px; right: 6px; background: none; border: 0; color: var(--ink); }
.kbn .fav svg{ width: 20px; height: 20px; }
.kbn .dots{ position: absolute; bottom: 8px; left: 0; right: 0; display: flex; justify-content: center; gap: 4px; }
.kbn .dots i{ width: 4px; height: 4px; border-radius: 50%; background: #c8c8c8; }
.kbn .dots i.on{ background: var(--ink); }
.kbn .card-body{ padding: 10px 2px 0; }
.kbn .price{ font-size: 14px; font-weight: 600; }
.kbn .split{ font-size: 10px; color: var(--muted); margin-top: 2px; }
.kbn .name{ font-size: 12px; line-height: 1.35; margin-top: 6px; }
.kbn .sizes{ font-size: 10px; color: var(--muted); margin-top: 6px; word-spacing: 4px; }
.kbn .sizes s{ opacity: .5; }
.kbn .cat-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.kbn .cat{ position: relative; aspect-ratio: 3/4; overflow: hidden; color: #fff; }
.kbn .cat.big{ grid-column: span 2; aspect-ratio: 4/3.4; }
.kbn .cat::after{ content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(0,0,0,.55)); }
.kbn .cat-txt{ position: absolute; z-index: 1; left: 12px; bottom: 12px; }
.kbn .cat-txt b{ display: block; font-size: 15px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.kbn .cat-txt span{ font-size: 11px; opacity: .85; }
.kbn .cat-more{ display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.kbn .cat-more a{ font-size: 12px; padding: 9px 14px; background: var(--cream); }
.kbn .trust{ display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--line); margin: 36px 16px 0; border: 1px solid var(--line); }
.kbn .tr{ background: #fff; padding: 16px 14px; display: flex; flex-direction: column; gap: 4px; }
.kbn .tr svg{ margin-bottom: 6px; }
.kbn .tr b{ font-size: 13px; font-weight: 600; }
.kbn .tr span{ font-size: 11px; color: var(--muted); }
.kbn .look-body{ display: flex; flex-direction: column; gap: 12px; }
.kbn .look-img{ position: relative; aspect-ratio: 3/4; overflow: hidden; }
.kbn .hot{ position: absolute; width: 26px; height: 26px; border-radius: 50%; background: rgba(255,255,255,.9); box-shadow: 0 0 0 6px rgba(255,255,255,.3); transform: translate(-50%, -50%); }
.kbn .hot::after{ content: '+'; position: absolute; inset: 0; display: grid; place-items: center; font-size: 16px; }
.kbn .hot b{ position: absolute; left: 34px; top: 2px; background: #fff; font-size: 10px; font-weight: 600; padding: 4px 8px; white-space: nowrap; }
.kbn .look-items{ display: flex; flex-direction: column; gap: 10px; }
.kbn .li{ display: flex; gap: 12px; align-items: center; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.kbn .li img{ width: 84px; height: 112px; background: #f5f5f5; }
.kbn .li .name{ margin: 0 0 4px; }
.kbn .li .btn{ margin-top: 8px; }
.kbn .ugc-grid{ display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 150px; gap: 6px; }
.kbn .u{ position: relative; overflow: hidden; grid-row: span 1; }
.kbn .u.tall{ grid-row: span 2; }
.kbn .u .who{ position: absolute; left: 8px; bottom: 8px; color: #fff; font-size: 10px; font-weight: 600; text-shadow: 0 1px 6px rgba(0,0,0,.6); }
.kbn .u .sku{ position: absolute; right: 8px; top: 8px; background: rgba(255,255,255,.92); font-size: 9px; font-weight: 600; padding: 3px 6px; }
.kbn .ugc-cta{ display: flex; flex-direction: column; gap: 12px; background: var(--cream); padding: 16px; margin-top: 10px; }
.kbn .ugc-cta b{ display: block; font-size: 13px; margin-bottom: 4px; }
.kbn .ugc-cta span{ font-size: 11px; color: var(--muted); }
.kbn .ugc-cta .btn{ align-self: flex-start; }
.kbn .reel{ position: relative; flex: none; width: 136px; aspect-ratio: 9/16; overflow: hidden; color: #fff; }
.kbn .reel .play{ position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; border-radius: 50%; background: rgba(0,0,0,.35); display: grid; place-items: center; }
.kbn .reel .play svg{ width: 14px; height: 14px; }
.kbn .reel .rt{ position: absolute; left: 8px; right: 8px; bottom: 8px; font-size: 10px; font-weight: 600; text-shadow: 0 1px 6px rgba(0,0,0,.6); }
.kbn .size{ margin: 36px 16px 0; background: var(--ink); color: #fff; padding: 24px 20px; display: flex; flex-direction: column; gap: 16px; }
.kbn .size h3, .kbn .sub-box h3{ font-size: 18px; font-weight: 600; margin-bottom: 6px; }
.kbn .size p, .kbn .sub-box p{ font-size: 12px; opacity: .8; line-height: 1.45; }
.kbn .size-btns{ display: flex; gap: 8px; flex-wrap: wrap; }
.kbn .size .ghost{ color: #fff; }
.kbn .sub-box{ margin: 36px 16px 0; text-align: center; }
.kbn .sub-box p{ color: var(--muted); opacity: 1; }
.kbn .field{ display: flex; border: 1px solid var(--ink); margin-top: 14px; height: 42px; align-items: center; justify-content: space-between; padding-left: 14px; font-size: 12px; color: var(--muted); }
.kbn .field .btn{ height: 40px; }
.kbn .foot{ margin-top: 40px; background: var(--cream); padding: 28px 16px; }
.kbn .foot .cols{ display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 18px; font-size: 12px; line-height: 1.8; color: #444; }
.kbn .foot b{ display: block; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink); margin-bottom: 4px; }
.kbn .tabbar{ position: absolute; left: 0; right: 0; bottom: 0; height: 72px; background: rgba(255,255,255,.96); border-top: 1px solid var(--line); display: flex; justify-content: space-around; padding-top: 10px; }
.kbn .tabbar a{ position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: 9px; color: var(--muted); }
.kbn .tabbar a.on{ color: var(--ink); font-weight: 600; }
.kbn .tabbar .badge{ top: -4px; right: 4px; }
.kbn.d .ticker{ justify-content: center; }
.kbn.d .nav{ height: 72px; padding: 0 48px; }
.kbn.d .brand{ font-size: 32px; }
.kbn.d .menu{ display: flex; gap: 22px; font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; }
.kbn.d .menu a.on{ border-bottom: 1px solid var(--ink); }
.kbn.d .menu .sale{ color: var(--accent); }
.kbn.d .nav .ic{ gap: 20px; }
.kbn.d .chips{ padding: 20px 48px; justify-content: flex-start; }
.kbn.d .block{ padding: 64px 48px 8px; }
.kbn.d h2{ font-size: 30px; }
.kbn.d .sub{ font-size: 14px; }
.kbn.d .head{ margin-bottom: 24px; }
.kbn.d .card{ width: calc((1344px - 4 * 16px) / 5); }
.kbn.d .row{ gap: 16px; }
.kbn.d .price{ font-size: 16px; }
.kbn.d .name{ font-size: 13px; }
.kbn.d .cat-grid{ grid-template-columns: repeat(6, 1fr); gap: 12px; }
.kbn.d .cat{ aspect-ratio: 9/16; }
.kbn.d .cat-txt{ left: 20px; bottom: 20px; }
.kbn.d .cat-txt b{ font-size: 16px; }
.kbn.d .trust{ grid-template-columns: repeat(4, 1fr); margin: 64px 48px 0; }
.kbn.d .tr{ padding: 28px 24px; }
.kbn.d .look-body{ flex-direction: row; gap: 48px; align-items: center; }
.kbn.d .look-img{ width: 640px; flex: none; }
.kbn.d .look-items{ flex: 1; gap: 20px; }
.kbn.d .li img{ width: 150px; height: 200px; }
.kbn.d .li .name{ font-size: 16px; }
.kbn.d .li .price{ font-size: 18px; }
.kbn.d .ugc-grid{ grid-template-columns: repeat(6, 1fr); grid-auto-rows: 300px; gap: 10px; }
.kbn.d .ugc-cta{ flex-direction: row; justify-content: space-between; align-items: center; padding: 24px 28px; margin-top: 16px; }
.kbn.d .ugc-cta b{ font-size: 16px; }
.kbn.d .ugc-cta span{ font-size: 13px; }
.kbn.d .reels .row{ gap: 16px; }
.kbn.d .reel{ width: calc((1344px - 3 * 16px) / 4); aspect-ratio: 4/5; }
.kbn.d .reel .rt{ font-size: 14px; left: 20px; bottom: 20px; }
.kbn.d .size{ margin: 64px 48px 0; flex-direction: row; justify-content: space-between; align-items: center; padding: 40px 48px; }
.kbn.d .size h3, .kbn.d .sub-box h3{ font-size: 26px; }
.kbn.d .size p, .kbn.d .sub-box p{ font-size: 14px; }
.kbn.d .sub-box{ margin: 64px auto 0; width: 560px; }
.kbn.d .foot{ padding: 48px; display: flex; gap: 120px; }
.kbn.d .foot .cols{ grid-template-columns: repeat(3, 220px); margin-top: 0; font-size: 13px; }
.kbn .row, .kbn .ugc-row{ overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.kbn .row::-webkit-scrollbar, .kbn .ugc-row::-webkit-scrollbar, .kbn .slides::-webkit-scrollbar{ display: none; }
.kbn .card{ scroll-snap-align: start; }
.kbn .slides{ display: flex; width: 100%; height: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.kbn .slides img{ flex: none; width: 100%; scroll-snap-align: start; }
.kbn.d .slides{ scroll-snap-type: none; overflow: hidden; }
.kbn .st{ cursor: pointer; }
.kbn [data-id]{ scroll-margin-top: 12px; }
.kbn .hero-next div{ flex: 1; height: 64px; background: center 30% / cover; backdrop-filter: none; padding: 0; position: relative; overflow: hidden; border: 1px solid rgba(255,255,255,.5); }
.kbn .hero-next div::before{ content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.65), rgba(0,0,0,.1)); }
.kbn .hero-next span{ position: absolute; left: 10px; right: 10px; bottom: 9px; font-size: 9px; line-height: 1.25; }
.kbn .hero-next em{ display: block; font-style: normal; opacity: .7; font-weight: 500; margin-bottom: 2px; }
.kbn .cat-txt .go{ display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 500; border-bottom: 1px solid rgba(255,255,255,.7); padding-bottom: 1px; opacity: 1; }
.kbn .cat-txt .go svg{ width: 12px; height: 12px; }
.kbn .season{ display: grid; gap: 8px; margin-top: 12px; }
.kbn .season a{ display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: 12px; padding: 14px 16px; border: 1px solid var(--line); }
.kbn .season a.on{ background: var(--ink); color: #fff; border-color: var(--ink); }
.kbn .season b{ font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.kbn .season span{ grid-column: 1; font-size: 11px; opacity: .7; margin-top: 3px; }
.kbn .season svg{ grid-row: 1 / 3; grid-column: 2; width: 18px; height: 18px; }
.kbn.d .season{ grid-template-columns: 1fr 1fr; gap: 12px; }
.kbn .ugc-row{ display: flex; gap: 8px; }
.kbn .ugc-row .u{ flex: none; width: 240px; aspect-ratio: 3/4; scroll-snap-align: start; }
.kbn.d .ugc-row{ gap: 12px; }
.kbn.d .ugc-row .u{ width: calc((1344px - 4 * 12px) / 5); }
.kbn .foot{ background: var(--ink); color: #fff; }
.kbn .foot .cols{ color: rgba(255,255,255,.7); }
.kbn .foot b{ color: #fff; }
.kbn .foot .brand{ color: #fff; }
.kbn .hero-txt{ bottom: 36px; }
.kbn .mosaic{ grid-template-columns: 1fr 1fr; grid-template-areas: "a a" "b c" "b d" "e e" "f f"; grid-auto-rows: 170px; }
.kbn .mosaic .cat{ aspect-ratio: auto; }
.kbn .mosaic .a{ grid-area: a; height: 260px; }
.kbn .mosaic .b{ grid-area: b; }
.kbn .mosaic .c{ grid-area: c; }
.kbn .mosaic .d{ grid-area: d; }
.kbn .mosaic .e{ grid-area: e; }
.kbn .mosaic .f{ grid-area: f; height: 220px; }
.kbn .mosaic .e img{ object-position: center 35%; }
.kbn .cat.summer{ background: #f2efe9; color: var(--ink); }
.kbn .cat.summer::after{ display: none; }
.kbn .cat.summer img{ object-fit: contain; width: 62%; margin-left: auto; mix-blend-mode: multiply; }
.kbn .cat.summer .cat-txt{ left: 20px; bottom: auto; top: 50%; transform: translateY(-50%); }
.kbn .cat.summer b{ font-size: 28px; letter-spacing: .12em; margin-bottom: 8px; }
.kbn .cat.summer .go{ border-color: var(--ink); }
.kbn.d .mosaic{ grid-template-columns: repeat(4, 1fr); grid-template-areas: "a a b c" "a a b d" "e e f f"; grid-auto-rows: 300px; }
.kbn.d .mosaic .a, .kbn.d .mosaic .f{ height: auto; }
.kbn .tr .dl{ width: 92px; height: auto; margin: 2px 0 6px; }
.kbn .post-top{ display: flex; align-items: center; gap: 10px; padding: 0 0 10px; font-size: 12px; }
.kbn .ava{ width: 30px; height: 30px; border-radius: 50%; background: var(--ink); color: #fff; font-family: Eugusto; display: grid; place-items: center; font-size: 15px; }
.kbn .post-top .loc{ color: var(--muted); font-size: 10px; margin-left: auto; }
.kbn .post-img{ position: relative; aspect-ratio: 4/5; overflow: hidden; }
.kbn .post-img .cnt{ position: absolute; top: 10px; right: 10px; background: rgba(0,0,0,.55); color: #fff; font-size: 10px; padding: 3px 8px; border-radius: 10px; }
.kbn .post-dots{ position: static; margin: 10px 0 12px; }
.kbn .post-dots i.on{ background: #3897f0; }
.kbn .post .li{ border: 0; border-top: 1px solid var(--line); padding-top: 12px; }
.kbn .post .li > div{ flex: 1; }
.kbn .post .li .btn{ margin: 0; }
.kbn.d .post{ width: 560px; margin: 0 auto; }
.kbn .looks-head{ padding: 20px 16px 4px; }
.kbn .crumbs{ font-size: 11px; color: var(--muted); margin-bottom: 10px; }
.kbn .looks-head h1{ font-size: 26px; margin-bottom: 6px; }
.kbn .looks-grid{ display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 200px; grid-auto-flow: dense; gap: 4px; padding: 0 4px; }
.kbn .lk{ position: relative; overflow: hidden; }
.kbn .lk.tall{ grid-row: span 2; }
.kbn .lk .sku{ position: absolute; right: 8px; top: 8px; background: rgba(255,255,255,.92); font-size: 9px; font-weight: 600; padding: 3px 6px; }
.kbn .lk .who{ position: absolute; left: 8px; bottom: 8px; color: #fff; font-size: 10px; font-weight: 600; text-shadow: 0 1px 6px rgba(0,0,0,.6); }
.kbn .looks-more{ text-align: center; padding: 24px; }
.kbn.d .looks-head{ padding: 40px 48px 8px; }
.kbn.d .looks-head h1{ font-size: 40px; }
.kbn.d .looks-grid{ grid-template-columns: repeat(5, 1fr); grid-auto-rows: 340px; gap: 8px; padding: 0 48px; }
.kbn .mosaic{ grid-template-rows: 260px 180px 180px 200px 220px; grid-auto-rows: auto; }
.kbn .mosaic .a, .kbn .mosaic .f{ height: auto; }
.kbn.d .mosaic{ grid-template-rows: 300px 300px 300px; }
.kbn .stories{ overflow-x: auto; scrollbar-width: none; }
.kbn .stories::-webkit-scrollbar{ display: none; }
.kbn .mosaic{ grid-template-areas: "a a" "d b" "d c" "e e" "f f"; }
.kbn.d .mosaic{ grid-template-areas: "a a d b" "a a d c" "e e f f"; }
.kbn .tr svg, .kbn .tr .dl{ height: 22px; margin: 0 0 8px; }
.kbn .tr .dl{ width: auto; height: 15px; margin: 4px 0 11px; align-self: flex-start; }
.kbn .tr{ justify-content: flex-start; }
.kbn .ava{ width: 34px; height: 34px; background: #000; box-shadow: 0 0 0 2px #fff, 0 0 0 3px #c9c9c9; overflow: hidden; padding: 5px; }
.kbn .ava img{ object-fit: contain; }
.kbn .post .li{ color: inherit; }
.kbn .sku-s{ font-size: 10px; color: var(--muted); letter-spacing: .06em; }
.kbn .eu{ font-family: Eugusto; font-weight: 400; letter-spacing: .02em; }
.kbn .chips a, .kbn .season a, .kbn .cat-more a{ border-radius: 0; }
.kbn .ticker{ padding: 0; justify-content: flex-start !important; }
.kbn .tk{ display: flex; gap: 32px; white-space: nowrap; animation: tk 40s linear infinite; padding-left: 16px; }
.kbn .tk span::before{ content: '●'; margin-right: 32px; opacity: .4; font-size: 6px; vertical-align: middle; }
.kbn .ticker span:first-child::before{ display: inline; }
@keyframes tk{ to { transform: translateX(-50%); } }
.kbn .eu{ -webkit-text-stroke: .7px currentColor; }
.kbn.d .stories{ justify-content: center; gap: 28px; padding: 22px 48px 18px; }
.kbn.d .st{ width: 92px; font-size: 12px; }
.kbn.d .ring{ width: 84px; height: 84px; }
.kbn .hero-wide{ height: 760px; margin: 0; }
.kbn .hero-wide .hero-txt{ left: 56px; bottom: 64px; right: auto; }
.kbn .hero-wide h1{ font-size: 64px; }
.kbn .hero-wide .kicker{ font-size: 14px; }
.kbn .hero-wide .bars{ left: 56px; right: 56px; top: 20px; }
.kbn .hero-wide img{ object-position: center 35%; }
.kbn.d .post{ width: auto; display: grid; grid-template-columns: 620px 1fr; column-gap: 56px; align-items: start; }
.kbn.d .post-img{ grid-column: 1; grid-row: 1 / 4; }
.kbn.d .post-dots{ grid-column: 1; grid-row: 4; }
.kbn.d .post-top{ grid-column: 2; grid-row: 1; font-size: 15px; padding: 8px 0 24px; }
.kbn.d .post-top .loc{ font-size: 12px; margin-left: 12px; }
.kbn.d .post .li{ grid-column: 2; grid-row: 2; border-top: 1px solid var(--line); padding: 24px 0; gap: 24px; }
.kbn.d .post .li img{ width: 180px; height: 240px; }
.kbn.d .post .li .name{ font-size: 18px; }
.kbn.d .post .li .price{ font-size: 22px; margin-top: 6px; }
.kbn.d .post .li .split{ font-size: 13px; }
.kbn.d .post .li .btn{ height: 48px; padding: 0 28px; }
.kbn.d .ava{ width: 44px; height: 44px; }
.kbn .tr .dl{ height: 22px; width: auto; max-width: 64px; object-fit: contain; object-position: left center; margin: 0 0 10px; }
.kbn .tr .dl[alt="Долями"]{ height: 15px; margin: 4px 0 13px; max-width: none; }
.kbn .post .li{ border: 1px solid var(--line); padding: 12px; margin-top: 4px; }
.kbn.d .post .li{ border: 1px solid var(--line); padding: 20px; }
.kbn .foot-top{ display: flex; flex-direction: column; gap: 20px; }
.kbn .foot .cols .btn{ display: flex; width: max-content; margin-top: 12px; color: #fff; border-color: rgba(255,255,255,.5); }
.kbn .foot-legal{ display: flex; flex-direction: column; gap: 6px; margin-top: 24px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.15); font-size: 10px; color: rgba(255,255,255,.5); }
.kbn.d .foot{ display: block; }
.kbn.d .foot-top{ flex-direction: row; justify-content: space-between; }
.kbn.d .foot-legal{ flex-direction: row; justify-content: space-between; font-size: 12px; }
.kbn .foot-about{ margin-top: 28px; display: flex; flex-direction: column; gap: 6px; font-size: 11px; color: rgba(255,255,255,.7); }
.kbn .fa-t{ font-size: 16px; font-weight: 500; color: #fff; }
.kbn .soc{ display: flex; gap: 22px; margin-top: 18px; }
.kbn .soc a{ color: #fff; }
.kbn .soc svg{ width: 28px; height: 28px; }
.kbn .foot-legal{ flex-direction: column; gap: 14px; }
.kbn .foot-legal > div:first-child{ display: flex; flex-direction: column; gap: 4px; line-height: 1.5; }
.kbn .foot-legal b{ color: #fff; font-size: 14px; font-weight: 500; }
.kbn .fl-links{ color: rgba(255,255,255,.7); }
.kbn.d .foot-about{ max-width: 480px; }
.kbn.d .foot-legal{ align-items: flex-end; }
.kbn.d .fl-links{ text-align: right; max-width: 380px; }
.kbn .hero-wide img{ object-position: center 78%; }
.kbn .fa-t{ text-transform: none; letter-spacing: 0; margin-bottom: 0; }
.kbn .foot-legal b{ text-transform: none; letter-spacing: 0; }
.kbn .hero-wide{ height: 900px; }
.kbn .hero-wide img{ object-position: center 62%; }
.kbn .foot .fa-t, .kbn .foot .foot-legal b{ text-transform: none; letter-spacing: 0; font-size: 16px; }
.kbn .foot{ padding-top: 32px; padding-bottom: 20px; }
.kbn .foot-left{ display: flex; flex-direction: column; }
.kbn .foot-left .brand{ line-height: 1; }
.kbn .foot-about{ margin-top: 14px; gap: 4px; }
.kbn .foot .fa-t{ font-size: 14px; }
.kbn .soc{ margin-top: 14px; gap: 18px; }
.kbn .soc svg{ width: 24px; height: 24px; }
.kbn .foot .cols > div{ display: flex; flex-direction: column; line-height: 1.75; }
.kbn .foot .cols .btn{ margin-top: auto; }
.kbn .foot-legal{ margin-top: 20px; padding-top: 14px; }
.kbn.d .foot{ padding: 40px 48px 24px; }
.kbn.d .foot-top{ display: grid; grid-template-columns: 1fr 660px; align-items: stretch; }
.kbn.d .foot-left .soc{ margin-top: auto; padding-top: 16px; }
.kbn.d .foot .cols{ grid-template-columns: repeat(3, 1fr); align-items: stretch; }
.kbn.d .foot-left .brand, .kbn.d .foot .cols b{ margin-top: 0; }
.kbn.d .foot .cols b{ line-height: 26px; margin-bottom: 6px; }
.kbn.d .foot-left .brand{ font-size: 26px; height: 26px; margin-bottom: 6px; }
.kbn.d .foot .cols .btn{ margin-top: auto; height: 32px; }
.kbn .foot .cols > div{ line-height: 2.1; }
.kbn .foot .cols b{ margin-bottom: 10px; }
.kbn .foot .cols .btn{ margin-top: 14px; }
.kbn.d .foot .cols .btn{ margin-top: 14px; }
.kbn.d{ overflow: clip; }
.kbn .dh{ position: sticky; top: 0; z-index: 30; background: #fff; border-bottom: 1px solid var(--line); --e: cubic-bezier(.22,1,.36,1); }
.kbn .dh-top{ height: 58px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 40px; border-bottom: 1px solid var(--line); transition: border-color .22s ease; }
.kbn .dh-left, .kbn .dh-right{ display: flex; align-items: center; height: 100%; }
.kbn .dh-left{ justify-self: start; gap: 46px; padding-right: 40px; border-right: 1px solid var(--line); }
.kbn .dh-right{ justify-self: end; gap: 20px; padding-left: 40px; border-left: 1px solid var(--line); }
.kbn .dh-right svg{ transition: opacity .2s ease, transform .25s var(--e); }
.kbn .dh-right svg:hover{ opacity: .55; transform: translateY(-1px); }
.kbn .dh .brand{ font-size: 34px; letter-spacing: 0; }
.kbn .dh-cat, .kbn .dh-link{ font-size: 12px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; }
.kbn .dh-cat{ display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 14px; margin-left: -14px; transition: background-color .22s ease, color .22s ease; }
.kbn .dh-cat:hover, .kbn .dh.hover .dh-cat{ background: #111; color: #fff; }
.kbn .plus{ position: relative; width: 12px; height: 12px; flex: none; transition: transform .35s var(--e); }
.kbn .plus::before, .kbn .plus::after{ content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 1.4px; margin-top: -.7px; background: currentColor; }
.kbn .plus::after{ transform: rotate(90deg); transition: transform .35s var(--e); }
.kbn .dh-cat:hover .plus, .kbn .dh.hover .dh-cat .plus{ transform: rotate(90deg); }
.kbn .dh-bottom{ height: 48px; display: flex; align-items: center; gap: 44px; padding: 0 40px; overflow: hidden; transition: height .48s var(--e), opacity .3s ease; }
.kbn .dh-bottom nav{ display: flex; gap: 26px; }
.kbn .dh-bottom a{ position: relative; font-size: 11px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: #555; transition: opacity .3s ease, transform .4s var(--e); }
.kbn .dh-bottom .acc a{ color: var(--ink); font-weight: 600; }
.kbn .dh-bottom .acc a:first-child{ padding: 0; transition: background-color .22s ease, color .22s ease, box-shadow .22s ease; }
.kbn .dh-bottom .acc a:first-child:hover{ background: #111; color: #fff; box-shadow: 0 0 0 8px #111; }
.kbn .dh-contacts{ margin-left: auto; color: var(--ink) !important; font-size: 12px !important; }
.kbn .dh-bottom nav:first-child a::after, .kbn .dh-contacts::after{ content: ''; position: absolute; left: 0; right: 0; bottom: -5px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .28s var(--e); }
.kbn .dh-bottom nav:first-child a:hover::after, .kbn .dh-contacts:hover::after{ transform: scaleX(1); transform-origin: left; }
.kbn .dh.compact .dh-top{ border-bottom-color: transparent; }
.kbn .dh.compact .dh-bottom{ height: 0; opacity: 0; pointer-events: none; }
.kbn .dh.compact .dh-bottom a{ transform: translateY(-7px); }
.kbn .bagw{ position: relative; display: flex; }
.kbn .bagw .badge{ top: -6px; right: -8px; }
.kbn .burger{ display: flex; cursor: pointer; }
.kbn .dr-wrap{ position: absolute; left: 0; right: 0; top: 0; height: 844px; z-index: 50; pointer-events: none; overflow: hidden; border-radius: 28px 28px 0 0; --e: cubic-bezier(.22,1,.36,1); }
.kbn .phone .dr-wrap{ border-radius: 28px; }
.kbn .dr-wrap.open{ pointer-events: auto; }
.kbn .dr-shade{ position: absolute; inset: 0; background: rgba(20,20,20,.42); backdrop-filter: blur(3px); opacity: 0; transition: opacity .4s ease; }
.kbn .dr-wrap.open .dr-shade{ opacity: 1; }
.kbn .drawer{ position: absolute; top: 0; bottom: 0; left: 0; width: 342px; background: #fff; display: flex; flex-direction: column; transform: translateX(-100%); transition: transform .55s var(--e); box-shadow: 24px 0 60px rgba(0,0,0,.18); }
.kbn .dr-wrap.open .drawer{ transform: none; }
.kbn .dr-head{ height: 60px; flex: none; display: flex; align-items: center; justify-content: space-between; padding: 0 12px 0 20px; border-bottom: 1px solid var(--line); }
.kbn .dr-head .brand{ font-size: 24px; }
.kbn .dr-x{ width: 40px; height: 40px; display: grid; place-items: center; border: 0; background: none; color: var(--ink); cursor: pointer; border-radius: 50%; transition: background-color .2s ease, transform .35s var(--e); }
.kbn .dr-x:hover{ background: var(--cream); transform: rotate(90deg); }
.kbn .dr-scroll{ flex: 1; overflow-y: auto; padding: 16px 20px 28px; scrollbar-width: none; }
.kbn .dr-scroll::-webkit-scrollbar{ display: none; }
.kbn .dh-top{ border-bottom: 0; position: relative; }
.kbn .dh-top::after{ content: ''; position: absolute; left: 40px; right: 40px; bottom: 0; height: 1px; background: var(--line); transition: opacity .22s ease; }
.kbn .dh.compact .dh-top::after{ opacity: 0; }
.kbn .dh-cat, .kbn .dh-link{ font-size: 13px; }
.kbn .dh-bottom{ gap: 26px; }
.kbn .dh-bottom nav{ gap: 16px; }
.kbn .dh-bottom a{ font-size: 10px; letter-spacing: .12em; }
.kbn .dr-search{ display: flex; align-items: center; gap: 10px; height: 44px; padding: 0 14px; background: var(--cream); font-size: 13px; color: var(--muted); }
.kbn .dr-search svg{ width: 18px; height: 18px; color: var(--ink); }
.kbn .dr-cats{ display: flex; flex-direction: column; margin-top: 18px; }
.kbn .dr-cats > a, .kbn .dr-more a{ display: flex; align-items: center; height: 44px; font-size: 15px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; }
.kbn .dr-cats > a, .kbn .dr-more-t{ opacity: 0; transform: translateX(-10px); transition: opacity .35s ease, transform .5s var(--e), padding .3s var(--e); }
.kbn .dr-wrap.open .dr-cats > a, .kbn .dr-wrap.open .dr-more-t{ opacity: 1; transform: none; transition-delay: calc(.16s + var(--d) * .035s); }
.kbn .dr-cats > a:hover, .kbn .dr-more a:hover{ padding-left: 4px; }
.kbn .dr-more{ display: grid; grid-template-rows: 0fr; transition: grid-template-rows .45s var(--e); }
.kbn .dr-more > div{ overflow: hidden; }
.kbn .dr-more a{ font-size: 13px; height: 38px; color: #555; letter-spacing: .05em; }
.kbn .dr-cats.on .dr-more{ grid-template-rows: 1fr; }
.kbn .dr-more-t{ display: flex; align-items: center; gap: 10px; height: 40px; border: 0; background: none; font: 500 12px var(--f); letter-spacing: .04em; color: var(--muted); cursor: pointer; padding: 0; }
.kbn .dr-more-t .plus{ width: 10px; height: 10px; }
.kbn .dr-cats.on .dr-more-t .plus{ transform: rotate(135deg); }
.kbn .dr-cats .sale{ color: var(--accent); font-weight: 600; margin-top: 12px; }
.kbn .dr-cats .out{ font-weight: 600; }
.kbn .dr-service{ display: grid; grid-template-columns: 1fr 1fr; gap: 14px 12px; margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--line); }
.kbn .dr-service a{ font-size: 13px; color: #555; }
.kbn .dr-foot{ flex: none; padding: 14px 20px 18px; border-top: 1px solid var(--line); display: grid; gap: 10px; text-align: center; }
.kbn .dr-foot .btn{ width: 100%; }
.kbn .dr-foot span{ font-size: 11px; color: var(--muted); }
.kbn .fv-head{ padding: 20px 16px 8px; }
.kbn .crumbs{ font-size: 11px; color: var(--muted); margin-bottom: 10px; }
.kbn .fv-head h1, .kbn .ac h1, .kbn .lg h1{ font-size: 26px; margin-bottom: 6px; }
.kbn .fv-head sup, .kbn .ac h2 sup{ font-size: 12px; font-weight: 500; color: var(--muted); vertical-align: super; margin-left: 2px; }
.kbn .fv-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 24px 8px; padding: 12px 8px 32px; }
.kbn .fv-card{ display: flex; flex-direction: column; font-size: 12px; }
.kbn .fv-img{ position: relative; aspect-ratio: 3 / 4; background: #f3f2ef; margin-bottom: 10px; }
.kbn .fv-img .tag{ position: absolute; left: 8px; top: 8px; }
.kbn .fv-heart{ position: absolute; right: 6px; top: 6px; width: 34px; height: 34px; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgba(255,255,255,.9); color: var(--ink); cursor: pointer; transition: transform .25s var(--e); }
.kbn .fv-heart svg{ width: 18px; height: 18px; }
.kbn .fv-heart.on svg{ fill: var(--ink); }
.kbn .fv-heart:active{ transform: scale(.88); }
.kbn .fv-card .price{ font-size: 14px; font-weight: 600; padding: 0 4px; }
.kbn .fv-card .split, .kbn .fv-card .name{ padding: 0 4px; }
.kbn .fv-card .name{ margin-top: 4px; min-height: 2.6em; line-height: 1.3; margin-bottom: auto; }
.kbn .fv-sz{ display: flex; gap: 4px; padding: 10px 4px 8px; }
.kbn .fv-sz button{ flex: 1; height: 30px; border: 1px solid var(--line); background: #fff; font: 500 11px var(--f); color: var(--ink); cursor: pointer; transition: border-color .2s ease, background-color .2s ease, color .2s ease; }
.kbn .fv-sz button:hover, .kbn .fv-sz button.pick{ border-color: var(--ink); }
.kbn .fv-sz button.pick{ background: var(--ink); color: #fff; }
.kbn .fv-sz button.off{ color: #c3c0ba; text-decoration: line-through; pointer-events: none; }
.kbn .fv-add{ margin: 0 4px; width: calc(100% - 8px); }
.kbn .fv-empty{ margin: 0 16px 40px; padding: 32px 20px; border: 1px dashed var(--line); text-align: center; }
.kbn .fv-empty-ic{ width: 52px; height: 52px; margin: 0 auto 12px; border-radius: 50%; background: var(--cream); display: grid; place-items: center; }
.kbn .fv-empty b{ font-size: 14px; }
.kbn .fv-empty p{ font-size: 12px; color: var(--muted); margin: 6px 0 16px; }
.kbn.d .fv-head{ padding: 40px 48px 8px; }
.kbn.d .fv-head h1{ font-size: 40px; }
.kbn.d .fv-grid{ grid-template-columns: repeat(5, 1fr); gap: 40px 16px; padding: 24px 48px 48px; }
.kbn.d .fv-card{ font-size: 13px; }
.kbn.d .fv-empty{ margin: 0 48px 64px; }
.kbn .lg{ padding: 40px 24px 48px; text-align: center; }
.kbn .lg-ic{ width: 56px; height: 56px; margin: 0 auto 16px; border-radius: 50%; background: var(--cream); display: grid; place-items: center; }
.kbn .lg .sub{ font-size: 13px; line-height: 1.45; margin-bottom: 28px; }
.kbn .lg-field{ display: block; text-align: left; }
.kbn .lg-field span{ display: block; font-size: 11px; color: var(--muted); margin-bottom: 6px; letter-spacing: .04em; }
.kbn .lg-field input{ width: 100%; height: 50px; padding: 0 14px; border: 1px solid var(--ink); font: 500 15px var(--f); color: var(--ink); background: #fff; outline: none; }
.kbn .lg-btn{ width: 100%; margin-top: 12px; }
.kbn .lg-note{ font-size: 11px; color: var(--muted); margin: 12px 0 0; line-height: 1.4; }
.kbn .lg-step{ margin: 28px 0 20px; padding: 22px 16px; background: var(--cream); }
.kbn .lg-step span{ font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.kbn .lg-step b{ display: block; font-size: 15px; margin: 6px 0 14px; }
.kbn .lg-code{ display: flex; justify-content: center; gap: 10px; margin-bottom: 14px; }
.kbn .lg-code i{ width: 48px; height: 56px; display: grid; place-items: center; background: #fff; border: 1px solid var(--line); font: 600 22px var(--f); font-style: normal; }
.kbn .lg-code i.cur{ border-color: var(--ink); }
.kbn .lg-code i.cur::after{ content: ''; width: 1.5px; height: 24px; background: var(--ink); animation: blink 1s steps(1) infinite; }
@keyframes blink{ 50% { opacity: 0; } }
.kbn .lg-link{ display: inline-block; font-size: 12px; color: var(--muted); border-bottom: 1px solid currentColor; padding-bottom: 1px; }
.kbn .ac{ padding: 20px 16px 32px; }
.kbn .ac-hello{ display: flex; align-items: center; gap: 14px; margin-bottom: 8px; }
.kbn .ac-hello h1{ margin: 0; font-size: 22px; }
.kbn .ac-ava{ width: 52px; height: 52px; flex: none; border-radius: 50%; background: var(--ink); color: #fff; display: grid; place-items: center; font-family: Eugusto; font-size: 24px; }
.kbn .ac-block{ padding: 24px 0 4px; border-bottom: 1px solid var(--line); padding-bottom: 20px; }
.kbn .ac-order{ display: flex; align-items: center; gap: 12px; padding: 12px 0; border-top: 1px solid var(--line); }
.kbn .ac-order:first-of-type{ border-top: 0; }
.kbn .ac-thumbs{ display: flex; flex: none; width: 84px; }
.kbn .ac-thumbs img{ width: 52px; height: 68px; border: 2px solid #fff; background: #f3f2ef; }
.kbn .ac-thumbs img + img{ margin-left: -22px; }
.kbn .ac-o-txt{ flex: 1; display: grid; gap: 3px; font-size: 12px; }
.kbn .ac-o-txt b{ font-size: 13px; }
.kbn .ac-o-txt span{ color: var(--muted); }
.kbn .ac-order > svg{ width: 16px; height: 16px; color: var(--muted); }
.kbn .ost{ justify-self: start; white-space: nowrap; font-style: normal; font-size: 11px; font-weight: 600; display: inline-flex; align-items: center; gap: 6px; }
.kbn .ost::before{ content: ''; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.kbn .ost.way{ color: #b07a2c; }
.kbn .ost.done{ color: #3d7a4f; }
.kbn .ac-favs{ display: flex; gap: 6px; overflow: hidden; }
.kbn .ac-favs img{ width: 72px; height: 96px; flex: none; background: #f3f2ef; }
.kbn .ac-data dl{ display: grid; grid-template-columns: 96px 1fr; gap: 8px 12px; font-size: 12px; }
.kbn .ac-data dt{ color: var(--muted); }
.kbn .ac-data .sub{ margin-top: 12px; }
.kbn .ac-menu{ margin-top: 12px; }
.kbn .ac-menu a{ display: flex; align-items: center; gap: 12px; height: 52px; border-bottom: 1px solid var(--line); font-size: 13px; font-weight: 500; }
.kbn .ac-menu a svg{ width: 18px; height: 18px; }
.kbn .ac-menu a svg:last-child{ width: 16px; height: 16px; margin-left: auto; color: var(--muted); }
.kbn .ac-out{ color: var(--muted) !important; font-weight: 500; }
.kbn .ac-d{ display: grid; grid-template-columns: 260px 1fr; gap: 64px; padding: 48px 48px 72px; }
.kbn .ac-side{ display: flex; flex-direction: column; gap: 2px; position: sticky; top: 140px; align-self: start; }
.kbn .ac-side a{ display: flex; align-items: center; gap: 12px; height: 46px; padding: 0 14px; font-size: 13px; font-weight: 500; transition: background-color .2s ease; }
.kbn .ac-side a svg{ width: 18px; height: 18px; }
.kbn .ac-side a:hover{ background: var(--cream); }
.kbn .ac-side a.on{ background: var(--ink); color: #fff; }
.kbn .ac-side .ac-out{ margin-top: 16px; }
.kbn .ac-d .ac-hello h1{ font-size: 32px; }
.kbn .ac-d .ac-main{ display: grid; grid-template-columns: 1fr 1fr; column-gap: 48px; align-content: start; }
.kbn .ac-d .ac-hello{ grid-column: 1 / -1; margin-bottom: 16px; }
.kbn .ac-d .ac-block:first-of-type{ grid-row: span 2; }
.kbn .ac-d .ac-favs img{ width: 88px; height: 116px; }
.kbn .cat-grid.white .cat{ background: linear-gradient(180deg, #f2f2f2, #ececec); color: var(--ink); }
.kbn .cat-grid.white .cat::after{ display: none; }
.kbn .cat-grid.white .cat img{ object-fit: contain; padding: 44px 6px 6px; box-sizing: border-box; transition: transform .6s cubic-bezier(.22,1,.36,1);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 18%, #000 82%, transparent); mask-image: linear-gradient(90deg, transparent, #000 18%, #000 82%, transparent); }
.kbn .cat-grid.white .cat:hover img{ transform: scale(1.04); }
.kbn .cat-grid.white .go{ border-color: var(--ink); }
.kbn .cat-grid.white .cat-txt{ left: 14px; top: 12px; bottom: auto; }
.kbn .cat-grid.white .cat-txt b{ font-size: 13px; margin-bottom: 4px; }
.kbn .u, .kbn .lk{ display: block; cursor: pointer; }
.kbn .u img, .kbn .lk img{ transition: transform .6s cubic-bezier(.22,1,.36,1); }
.kbn .u:hover img, .kbn .lk:hover img{ transform: scale(1.04); }
.kbn .lk-cnt{ position: absolute; top: 8px; right: 8px; display: flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 12px; background: rgba(0,0,0,.42); backdrop-filter: blur(6px); color: #fff; font-size: 10px; font-weight: 600; }
.kbn .lk-cnt svg{ width: 11px; height: 11px; }
.kbn .lk-txt{ position: absolute; left: 0; right: 0; bottom: 0; padding: 36px 10px 10px; background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.6)); color: #fff; font-size: 11px; }
.kbn .lk-txt b{ display: block; font-weight: 600; line-height: 1.25; margin-bottom: 3px; }
.kbn .lk-txt span{ opacity: .9; }
.kbn.d .lk-txt{ font-size: 12px; padding: 48px 14px 14px; }
.kbn .up{ position: absolute; left: 0; right: 0; top: 0; height: 100%; z-index: 60; opacity: 0; pointer-events: none; transition: opacity .3s ease; --e: cubic-bezier(.22,1,.36,1); }
.kbn .up.open{ opacity: 1; pointer-events: auto; }
.kbn .up-shade{ position: absolute; inset: 0; background: rgba(12,12,12,.62); backdrop-filter: blur(6px); }
.kbn .up-box{ position: absolute; overflow: hidden; transition: transform .5s var(--e); }
.kbn .up-media{ position: relative; background: #111; min-height: 0; }
.kbn .up-slides{ display: flex; height: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.kbn .up-slides::-webkit-scrollbar{ display: none; }
.kbn .up-slides img{ flex: none; width: 100%; height: 100%; object-fit: cover; scroll-snap-align: start; }
.kbn .up-bars{ position: absolute; z-index: 2; top: 12px; left: 12px; right: 12px; display: flex; gap: 4px; }
.kbn .up-bars i{ flex: 1; height: 2px; border-radius: 1px; background: rgba(255,255,255,.35); transition: background-color .3s ease; }
.kbn .up-bars i.on{ background: #fff; }
.kbn .up-nav{ position: absolute; z-index: 2; top: 50%; width: 38px; height: 38px; margin-top: -19px; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgba(255,255,255,.88); color: var(--ink); cursor: pointer; transition: transform .25s var(--e); }
.kbn .up-nav.prev{ left: 12px; }
.kbn .up-nav.prev svg{ transform: rotate(180deg); }
.kbn .up-nav.next{ right: 12px; }
.kbn .up-nav:hover{ transform: scale(1.08); }
.kbn .up-nav svg{ width: 18px; height: 18px; }
.kbn .up-top{ display: flex; align-items: center; gap: 10px; }
.kbn .up-top .ava{ width: 34px; height: 34px; flex: none; border-radius: 50%; background: var(--ink); display: grid; place-items: center; }
.kbn .up-top .ava img{ width: 62%; height: auto; object-fit: contain; }
.kbn .up-top b{ display: block; font-size: 13px; }
.kbn .up-top span{ font-size: 11px; opacity: .75; }
.kbn .up-x{ margin-left: auto; width: 36px; height: 36px; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgba(255,255,255,.16); color: inherit; cursor: pointer; }
.kbn .up-label{ font-size: 10px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; }
.kbn .up-prod{ display: flex; align-items: center; gap: 12px; padding: 10px; background: var(--cream); }
.kbn .up-prod img{ width: 58px; height: 76px; flex: none; object-fit: cover; background: #f1f1f1; }
.kbn .up-prod > div{ flex: 1; }
.kbn .up-prod .name{ font-size: 13px; font-weight: 500; line-height: 1.3; }
.kbn .up-prod .price{ font-size: 15px; font-weight: 600; margin-top: 4px; }
.kbn .up-go{ width: 36px; height: 36px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: #fff; }
.kbn .up-go svg{ width: 16px; height: 16px; }
.kbn .up-btn{ width: 100%; margin-top: 10px; }
.kbn.m .up-box{ inset: 0; display: flex; flex-direction: column; background: #111; transform: translateY(30px); }
.kbn.m .up.open .up-box{ transform: none; }
.kbn.m .up-media{ flex: 1; }
.kbn.m .up-nav{ display: none; }
.kbn.m .up-info{ background: #fff; border-radius: 18px 18px 0 0; margin-top: -18px; padding: 16px 16px 18px; z-index: 3; }
.kbn.m .up-top{ position: absolute; z-index: 3; top: 26px; left: 12px; right: 12px; color: #fff; text-shadow: 0 1px 8px rgba(0,0,0,.4); }
.kbn.m .up-thumbs{ display: none; }
.kbn.d .up-box{ left: 50%; top: 50%; width: 1040px; height: min(720px, calc(100% - 80px)); transform: translate(-50%, -46%); display: grid; grid-template-columns: 1fr 400px; background: #fff; box-shadow: 0 30px 80px rgba(0,0,0,.35); }
.kbn.d .up.open .up-box{ transform: translate(-50%, -50%); }
.kbn.d .up-info{ display: flex; flex-direction: column; padding: 24px; }
.kbn.d .up-x{ background: var(--cream); }
.kbn.d .up-thumbs{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 20px 0; }
.kbn.d .up-thumbs img{ aspect-ratio: 3 / 4; object-fit: cover; opacity: .5; cursor: pointer; transition: opacity .2s ease; }
.kbn.d .up-thumbs img.on, .kbn.d .up-thumbs img:hover{ opacity: 1; }
.kbn.d .up-label{ margin-top: auto; }
.kbn .cat-grid.cards{ grid-template-columns: 1fr 1fr; gap: 6px; }
.kbn .cat-grid.cards .cat{ aspect-ratio: 3 / 4; }
.kbn .cat-grid.cards .cat img{ transition: transform .8s cubic-bezier(.22,1,.36,1); }
.kbn .cat-grid.cards .cat:hover img{ transform: scale(1.04); }
.kbn .cat-grid.cards .cat::after{ background: linear-gradient(180deg, rgba(0,0,0,.28), rgba(0,0,0,0) 30%, rgba(0,0,0,0) 62%, rgba(0,0,0,.42)); }
.kbn .cat-grid.cards .cat-txt{ left: 12px; bottom: 12px; }
.kbn .cat-grid.cards .cat-txt b{ font-size: 14px; letter-spacing: .12em; margin-bottom: 4px; }
.kbn.d .cat-grid.cards{ grid-template-columns: repeat(3, 1fr); gap: 10px; }
.kbn.d .cat-grid.cards .cat-txt{ left: 22px; bottom: 22px; }
.kbn.d .cat-grid.cards .cat-txt b{ font-size: 18px; }
.kbn.d .up-box{ width: auto; grid-template-columns: auto 400px; }
.kbn.d .up-media{ height: 100%; aspect-ratio: 3 / 4; }
.kbn .post-img .up-nav{ opacity: 0; transition: opacity .25s ease, transform .25s var(--e, ease); }
.kbn .post-img:hover .up-nav{ opacity: 1; }
.kbn.m .post-img .up-nav{ display: none; }
.kbn .post-img .slides{ display: flex; height: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.kbn .dh-bottom .acc a:first-child:hover{ background: none; color: var(--ink); box-shadow: none; }
.kbn .dh-bottom .acc a::after{ content: ''; position: absolute; left: 0; right: 0; bottom: -5px; height: 2px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .35s cubic-bezier(.22,1,.36,1); }
.kbn .dh-bottom .acc a:hover::after{ transform: scaleX(1); transform-origin: left; }
.kbn .foot .cols > div{ line-height: 2; }
.kbn .fl-links{ line-height: 1.9; }
.kbn .fav.on svg, .kbn .fv-heart.on svg{ fill: currentColor; }
.kbn .fav svg{ transition: transform .2s ease; }
.kbn .fav:active svg{ transform: scale(.85); }
.kbn .looks-chips a{ cursor: pointer; }
.kbn .looks-grid [data-cat].hide{ display: none; }
.kbn .fv-head h1{ font-size: 20px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; }
.kbn.d .fv-head h1{ font-size: 28px; }
.kbn .fv-head sup{ letter-spacing: 0; }
.kbn .looks-chips{ overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.kbn .looks-chips::-webkit-scrollbar{ display: none; }
.kbn .crumbs .home{ cursor: pointer; }
.kbn .crumbs .home:hover{ color: var(--ink); }
/* --- живая страница --- */
.kbn { --f: MontserratKB, Montserrat, -apple-system, Helvetica, Arial, sans-serif; background: #fff; font-family: var(--f); color: var(--ink); box-shadow: none; overflow: clip; }
.kbn.m { width: 100%; border-radius: 0; padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
.kbn.d { width: 1440px; }
.kbn a.card { display: block; }
.kbn .nav { position: sticky; top: 0; z-index: 40; }
.kbn.m .tabbar { position: fixed; z-index: 50; height: calc(72px + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); }
.kbn .dr-wrap { position: fixed; inset: 0; height: 100%; border-radius: 0; z-index: 9990; }
.kbn .dr-wrap:not(.open) { pointer-events: none; }
.kbn .up { position: fixed; inset: 0; height: 100%; z-index: 9995; }
.kbn .up.from-down .up-box { animation: kbnUpIn .4s cubic-bezier(.22,1,.36,1); }
.kbn .up.from-up .up-box { animation: kbnDownIn .4s cubic-bezier(.22,1,.36,1); }
.kbn .up.to-up .up-box { transform: translateY(-100%) !important; transition: transform .4s cubic-bezier(.22,1,.36,1); }
.kbn .up.to-down .up-box { transform: translateY(100%) !important; transition: transform .4s cubic-bezier(.22,1,.36,1); }
.kbn .up.to-up .up-shade, .kbn .up.to-down .up-shade { display: none; }
@keyframes kbnUpIn { from { transform: translateY(100%); } }
@keyframes kbnDownIn { from { transform: translateY(-100%); } }
.kbn .up-media { touch-action: pan-x; }
.kbn .fv-live { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 8px; padding: 12px 8px 32px; overflow: visible; }
.kbn.d .fv-live { grid-template-columns: repeat(5, 1fr); gap: 40px 16px; padding: 24px 48px 48px; }
.kbn .fv-live .card { width: auto; }
.kbn .foot .cols > div br { display: none; }  /* в живой версии пункты — ссылки, перенос не нужен */
.kbn .foot .cols > div > span { white-space: nowrap; }