/* kAPPeL.ru V4.1: RuStore-inspired geometry, original kAPPeL branding.
   Loaded AFTER kappel_app_v4.css. Scoped to application pages only. */
body.k4-app-body { font-family: Inter, 'Segoe UI', Arial, sans-serif; font-size:14px; color:#222; background:#fff; }
.k4-app-body .wrap { width:min(1080px, calc(100% - 48px)); max-width:none; }
.k4-app-body .k4-global-header .wrap { width:calc(100% - 80px); max-width:none; }
.k4-app-body .k4-global-header { position:relative; background:#fff; border-bottom:1px solid #f3f4f6; }
.k4-app-body .k4-header-inner { min-height:88px; gap:26px; }
.k4-app-body .k4-brand { font-size:26px; color:#191919!important; letter-spacing:-1.45px; font-weight:430; }
.k4-app-body .k4-brand strong { font-weight:900; color:#151515; }
.k4-app-body .k4-global-header nav { margin:0 auto; gap:27px; }
.k4-app-body .k4-global-header nav a { font-weight:500; font-size:14px; color:#161a21; }
.k4-app-body .k4-global-header nav a:first-child { color:#086eff; }
.k4-app-body .k4-header-search { margin-left:0; max-width:205px; flex:0 1 205px; height:43px; border-radius:11px; background:#f0f1f3; }
.k4-app-body .k4-header-link, .k4-app-body .k4-header-catalog { border-radius:11px; padding:12px 16px; font-size:13px; }
.k4-app-body .k4-page { padding:15px 0 70px; }
.k4-app-body .k4-crumbs { font-size:13px; line-height:1.5; margin-bottom:21px; gap:9px; }
.k4-app-body .k4-crumbs span[aria-current] { display:none; } /* RuStore-style breadcrumb ending with category */
.k4-app-body .k4-hero { padding:0; margin:0 0 35px; }
.k4-app-body .k4-hero-top { grid-template-columns:146px minmax(0,1fr); gap:35px; align-items:start; }
.k4-app-body .k4-icon { height:146px; width:146px; border-radius:32px; }
.k4-app-body .k4-icon img { padding:8px; }
.k4-app-body .k4-hero-copy { position:relative; min-width:0; }
.k4-app-body .k4-badges { position:absolute; top:-20px; left:0; height:18px; min-height:0; gap:5px; }
.k4-app-body .k4-badge { padding:1px 7px; font-size:10px; line-height:1.5; }
.k4-app-body .k4-page h1 { font-size:30px; font-weight:540; line-height:1.18; letter-spacing:-.017em; margin:0 0 13px; color:#242424; }
.k4-app-body .k4-subtitle { display:none; } /* Full text remains in description below. */
.k4-app-body .k4-stat-row { display:flex; justify-content:flex-start; align-items:flex-start; gap:34px; margin:0; width:auto; }
.k4-app-body .k4-stat-row>div { flex:0 0 auto; padding:0; border:0; }
.k4-app-body .k4-stat-row dd { font-size:15px; font-weight:520; color:#2b2b2b; line-height:1.25; overflow:visible; text-overflow:unset; }
.k4-app-body .k4-stat-row small { font-size:12px; line-height:1.4; color:#7e8896; }
.k4-app-body .k4-stat-row .k4-star { color:#222; }
.k4-app-body .k4-actions { display:flex; justify-content:flex-start; gap:14px; margin-top:14px; }
.k4-app-body .k4-btn { min-height:44px; border-radius:11px; font-size:14px; font-weight:530; padding:11px 17px; }
.k4-app-body .k4-btn-primary { background:#0872f9; box-shadow:none; }
.k4-app-body .k4-btn-secondary { background:#f0f1f3; }
.k4-app-body .k4-layout { display:grid; grid-template-columns:minmax(0,1fr) 326px; gap:24px; align-items:start; }
.k4-app-body .k4-primary { min-width:0; }
.k4-app-body .k4-sidebar { gap:8px; }
.k4-app-body .k4-gallery { margin:0 0 18px; }
.k4-app-body .k4-gallery-track { gap:15px; padding:0 0 4px; overscroll-behavior-inline:contain; }
.k4-app-body .k4-shot { width:156px; height:277px; flex:0 0 156px; border-radius:17px; background:#f5f6f7; cursor:zoom-in; transition:filter .14s ease; }
.k4-app-body .k4-shot:hover { filter:brightness(.96); }
.k4-app-body .k4-shot img { object-position:top; }
.k4-app-body .k4-gallery-next, .k4-app-body .k41-gallery-prev { position:absolute; display:grid; place-items:center; z-index:1; top:50%; transform:translateY(-50%); width:40px; height:40px; border-radius:13px; color:#262b32; background:#fff; box-shadow:0 4px 19px #00000019; border:0; cursor:pointer; font-size:29px; }
.k4-app-body .k4-gallery-next { right:-17px; }
.k4-app-body .k41-gallery-prev { left:-12px; opacity:0; pointer-events:none; }
.k4-app-body .k4-gallery:focus-within .k41-gallery-prev, .k4-app-body .k4-gallery:hover .k41-gallery-prev { opacity:1; pointer-events:auto; }
.k4-app-body .k4-tabs { gap:33px; margin:7px 0 5px; border:0; }
.k4-app-body .k4-tabs a { font-size:21px; color:#252525; font-weight:470; padding:9px 12px 10px; border-bottom:2px solid transparent; }
.k4-app-body .k4-tabs a:first-child { margin-left:0; }
.k4-app-body .k4-tabs a.k4-tab-active { border-color:#0878ff; color:#252525; }
.k4-app-body .k4-tabs a:hover { border-color:#0878ff; color:#0878ff; }
.k4-app-body .k4-section { scroll-margin-top:22px; }
.k4-app-body .k4-description { margin-top:7px; }
.k4-app-body .k4-description-text { font-size:14px; color:#545454; line-height:1.62; }
.k4-app-body .k4-description-text p { margin:5px 0 10px; }
.k4-app-body .k4-text-button { font-size:14px; font-weight:490; }
.k4-app-body .k4-platforms { margin:27px 0 20px; background:#f5f6f7; }
.k4-app-body .k4-side-card { border-radius:16px; padding:16px; background:#f6f6f6; }
.k4-app-body .k4-side-card h2 { font-size:16px!important; font-weight:530!important; margin:0 0 12px!important; letter-spacing:0; }
.k4-app-body .k4-side-tags > * { background:#e8eaed; color:#505050; font-size:12px; }
.k4-app-body .k4-safe-note { margin-top:13px; background:#dbf1dd; color:#399948; font-size:13px; }
.k4-app-body .k4-safe-note small { color:#688f6c; }
.k4-app-body .k4-developer-name { font-size:17px; font-weight:520; color:#282828; }
.k4-app-body .k4-side-card p { font-size:13px; }
.k4-app-body .k4-side-related > a { padding:6px 0; font-size:14px; }
.k4-app-body .k4-side-related img { width:46px; height:46px; }
.k4-app-body .k4-footer { margin-top:40px; }
.k4-app-body .k4-review-overview { grid-template-columns:205px minmax(0,1fr) auto; }
/* Full-screen lightbox, backdrop click, interactive filmstrip and image stage. */
.k4-app-body .k41-lightbox[hidden], .k4-app-body .k41-lightbox-error[hidden] { display:none!important; }
.k4-app-body .k41-lightbox { position:fixed; inset:0; z-index:10050; display:flex; align-items:stretch; justify-content:center; color:#fff; isolation:isolate; }
.k4-app-body .k41-lightbox-scrim { position:absolute; inset:0; background:rgba(9,12,20,.95); }
.k4-app-body .k41-lightbox-inner { position:relative; z-index:1; width:min(1250px,100%); height:100%; padding:16px 24px 14px; display:grid; grid-template-rows:46px minmax(0,1fr) 96px 21px; gap:10px; }
.k4-app-body .k41-lightbox-toolbar { display:flex; align-items:center; gap:16px; }
.k4-app-body .k41-lightbox-title { flex:1; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:16px; font-weight:600; }
.k4-app-body .k41-lightbox-counter { font-size:14px; color:#bec6d5; font-variant-numeric:tabular-nums; }
.k4-app-body .k41-lightbox-close { display:grid; place-items:center; height:40px; width:40px; background:#ffffff20; color:white; border:1px solid #ffffff22; border-radius:50%; font-size:30px; line-height:1; cursor:pointer; }
.k4-app-body .k41-lightbox-stage { min-height:0; display:grid; grid-template-columns:56px minmax(0,1fr) 56px; gap:10px; align-items:center; touch-action:pan-y; }
.k4-app-body .k41-lightbox-picture { display:grid; place-items:center; width:100%; min-height:0; height:100%; position:relative; overflow:hidden; }
.k4-app-body .k41-lightbox-image { max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; background:#151921; border-radius:14px; box-shadow:0 6px 30px #0005; }
.k4-app-body .k41-lightbox-error { font-size:13px; padding:18px; }
.k4-app-body .k41-lightbox-arrow { width:48px; height:58px; border:0; border-radius:14px; background:#ffffff19; color:white; font-size:43px; cursor:pointer; }
.k4-app-body .k41-lightbox-arrow:hover, .k4-app-body .k41-lightbox-close:hover { background:#ffffff35; }
.k4-app-body .k41-lightbox-thumbs { display:flex; align-items:center; justify-content:safe center; overflow-x:auto; gap:10px; scrollbar-width:thin; padding:5px; overscroll-behavior-inline:contain; }
.k4-app-body .k41-lightbox-thumb { flex:none; height:83px; width:54px; border:2px solid transparent; padding:1px; border-radius:9px; background:#ffffff20; opacity:.58; cursor:pointer; }
.k4-app-body .k41-lightbox-thumb[aria-current="true"] { opacity:1; border-color:#2384ff; }
.k4-app-body .k41-lightbox-thumb img { display:block; width:100%; height:100%; border-radius:6px; object-fit:cover; }
.k4-app-body .k41-lightbox-hint { color:#a8b0c0; font-size:12px; text-align:center; margin:0; }
@media(max-width:1200px){
 .k4-app-body .k4-global-header .wrap{width:calc(100% - 38px)}
 .k4-app-body .k4-global-header nav{gap:15px}
 .k4-app-body .k4-header-search{max-width:175px}
}
@media(max-width:900px){
 .k4-app-body .wrap{width:calc(100% - 36px)}
 .k4-app-body .k4-layout{grid-template-columns:minmax(0,1fr) 260px;gap:18px}
 .k4-app-body .k4-hero-top{gap:20px}
 .k4-app-body .k4-page h1{font-size:25px}
 .k4-app-body .k4-stat-row{gap:15px}
 .k4-app-body .k4-tabs{gap:12px}
 .k4-app-body .k4-tabs a{font-size:17px}
 .k4-app-body .k4-sidebar{display:grid;grid-template-columns:1fr;margin-top:0}
 .k4-app-body .k4-global-header nav{display:none}
}
@media(max-width:730px){
 .k4-app-body .k4-layout{display:block}
 .k4-app-body .k4-sidebar{margin-top:26px;grid-template-columns:repeat(2,minmax(0,1fr))}
 .k4-app-body .k4-sidebar>section:last-of-type{grid-column:1/-1}
 .k4-app-body .k4-global-header .wrap{width:calc(100% - 30px)}
 .k4-app-body .k4-hero{margin-bottom:23px}
 .k4-app-body .k4-header-search{margin-left:auto;flex:1}
}
@media(max-width:560px){
 .k4-app-body .wrap{width:calc(100% - 28px)}
 .k4-app-body .k4-header-inner{min-height:62px}
 .k4-app-body .k4-hero-top{grid-template-columns:86px minmax(0,1fr);gap:14px}
 .k4-app-body .k4-icon{width:86px;height:86px;border-radius:22px}
 .k4-app-body .k4-badges{position:static;min-height:18px;height:auto;margin-bottom:5px}
 .k4-app-body .k4-page h1{font-size:21px;line-height:1.18;margin-bottom:12px}
 .k4-app-body .k4-stat-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .k4-app-body .k4-stat-row dd{font-size:15px}
 .k4-app-body .k4-actions{display:flex;flex-wrap:wrap;gap:8px}
 .k4-app-body .k4-actions .k4-btn{font-size:12px;flex:1 1 170px;padding:9px 12px}
 .k4-app-body .k4-tabs{gap:7px}
 .k4-app-body .k4-tabs a{font-size:14px;padding:10px 8px}
 .k4-app-body .k4-shot{width:144px;height:257px;flex-basis:144px}
 .k4-app-body .k4-sidebar{grid-template-columns:1fr}
 .k4-app-body .k4-sidebar>section:last-of-type{grid-column:auto}
 .k4-app-body .k41-lightbox-inner{padding:10px 8px;grid-template-rows:45px minmax(0,1fr) 89px 17px;gap:6px}
 .k4-app-body .k41-lightbox-stage{grid-template-columns:34px minmax(0,1fr) 34px;gap:2px}
 .k4-app-body .k41-lightbox-arrow{width:32px;height:46px;font-size:30px}
 .k4-app-body .k41-lightbox-thumbs{gap:6px}
 .k4-app-body .k41-lightbox-thumb{height:78px;width:51px}
 .k4-app-body .k41-lightbox-hint{font-size:10px}
}
@media(prefers-reduced-motion:reduce){.k4-app-body .k4-shot{transition:none}}
/* RuStore-like condensed app action bar while reading long pages. */
.k4-app-body .k41-sticky-app[hidden] { display:none!important; }
.k4-app-body .k41-sticky-app { position:fixed; top:0; left:0; right:0; z-index:100; background:#ffffffed; backdrop-filter:blur(15px); border-bottom:1px solid #ebedf1; box-shadow:0 2px 12px #0000000d; }
.k4-app-body .k41-sticky-inner { display:flex; min-height:66px; align-items:center; gap:13px; }
.k4-app-body .k41-sticky-inner img { height:42px; width:42px; border:1px solid #edf0f2; border-radius:11px; object-fit:contain; }
.k4-app-body .k41-sticky-inner strong { font-size:16px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1; }
.k4-app-body .k41-sticky-rating { white-space:nowrap; color:#3a4149; }
.k4-app-body .k41-sticky-inner .k4-btn { margin-left:auto; white-space:nowrap; min-height:39px; }
@media(max-width:560px){
 .k4-app-body .k41-sticky-inner { min-height:59px; gap:8px; }
 .k4-app-body .k41-sticky-inner img { width:34px; height:34px; }
 .k4-app-body .k41-sticky-inner strong { font-size:12px; }
 .k4-app-body .k41-sticky-rating { display:none; }
 .k4-app-body .k41-sticky-inner .k4-btn { font-size:11px; padding:7px 10px; }
}
