/* Role: compatibility layer. Only remove or narrow rules; avoid adding fresh design work here. */

/* Compatibility / transition layer
 * Purpose:
 * - Keep high-risk header/mobile/global compatibility rules out of main.css
 * - Preserve existing behaviour while main.css is reduced to base/global responsibilities
 * - New feature styles must not be added here
 */

/* Extracted from main.css: region hero + mobile nav compatibility */
/* --- 2026-03-24 bugfix pass: mobile nav, trust banner, iOS menu visibility --- */
.site-header{overflow:visible;isolation:isolate}
.site-header__inner{position:relative}
.region-hero__trust-banner{display:flex;align-items:flex-start;gap:10px;max-width:min(100%,56rem);padding:14px 18px;border-radius:20px;border:1px solid var(--site-accent-glow);background:rgba(216,180,108,.08);color:var(--klsv-ui-accent-strong);line-height:1.55}
.region-hero__trust-star{display:inline-flex;align-items:center;justify-content:center;min-width:18px;font-size:15px;line-height:1.2;transform:translateY(1px)}
.region-hero__trust-text{flex:1;min-width:0;font-size:15px;font-weight:600;letter-spacing:.01em}

@media(max-width:1100px){
body .site-header__nav{display:flex!important;position:absolute;top:calc(100% + 1px);left:-18px;right:-18px;bottom:auto;max-height:calc(100dvh - 64px);padding:18px 18px calc(24px + env(safe-area-inset-bottom));background:rgba(12,12,15,.985);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--site-line);border-top:1px solid rgba(255,255,255,.04);box-shadow:0 20px 44px rgba(0,0,0,.34);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-10px);transition:opacity .2s ease,transform .2s ease,visibility .2s ease;overflow-y:auto;-webkit-overflow-scrolling:touch;z-index:240}
body .site-header__nav.site-header__nav--open{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
body .site-header__toggle{position:relative;z-index:260}
body .site-header__link,body .site-header__region-toggle,body .site-header__region-item,body .site-header__mobile-btn{min-height:44px}
}

@media(max-width:767px){
body .site-header__nav{top:calc(100% + 1px);left:-14px;right:-14px;max-height:calc(100dvh - 60px);padding:18px 14px calc(22px + env(safe-area-inset-bottom));border-radius:0 0 18px 18px}
.region-hero__trust-banner{padding:13px 14px;border-radius:18px;gap:8px}
.region-hero__trust-text{font-size:14px;line-height:1.6}
}

@media(max-width:400px){
.region-hero__trust-banner{padding:12px 13px}
}

/* --- v6.2.0 region UX / SEO alignment --- */
.region-hero__meta{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;margin-top:16px}
.region-hero__trust-inline{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;border:1px solid var(--site-line);background:rgba(255,255,255,.03);color:var(--site-text);font-size:13px;font-weight:600}
.site-actions--region-hero{margin-top:18px}
.site-link-quiet--region-secondary{margin-top:14px;max-width:max-content}
.region-results-summary{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 16px}
.region-results-summary span{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;border:1px solid var(--site-line);background:rgba(255,255,255,.03);font-size:13px;color:var(--site-muted)}
.site-region-grid-fallback{display:grid;gap:8px}
.site-block--region-decision{padding-top:24px}
@media(max-width:1024px){
.region-hero__meta{align-items:flex-start}
}
@media(max-width:768px){
.site-actions--region-hero{flex-direction:column;align-items:stretch}
.site-actions--region-hero .site-btn,.site-actions--region-hero .site-link-quiet{width:100%;justify-content:center}
.region-hero__trust-inline{width:100%;justify-content:center}
.region-results-summary span{width:100%;justify-content:center}
}


/* Extracted from main.css: global mobile structure repair */
/* v20260327-r8 mobile structure repair */
html,
body{
  max-width:100%;
  overflow-x:clip;
}
body.developer-starter{
  overscroll-behavior-x:none;
}
.site-main,
.site-wrap,
.site-hero,
.site-block,
.site-card,
.site-header,
.site-header__inner{
  max-width:100%;
}
body .site-header__nav,
body .site-header__nav *{
  max-width:100%;
}
@media (max-width: 1100px){
  body .site-header__nav{
    display:none !important;
    position:fixed;
    top:72px;
    left:max(12px, env(safe-area-inset-left));
    right:max(12px, env(safe-area-inset-right));
    width:auto;
    max-height:calc(100dvh - 84px - env(safe-area-inset-bottom));
    padding:16px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:24px;
    background:rgba(12,12,15,.985);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    box-shadow:0 20px 44px rgba(0,0,0,.34);
    overflow-y:auto;
    overflow-x:hidden;
    visibility:visible;
    opacity:1;
    pointer-events:auto;
    transform:none;
    z-index:260;
  }
  body .site-header__nav.site-header__nav--open{
    display:flex !important;
    flex-direction:column;
    align-items:stretch;
    gap:12px;
  }
  body .site-header__mobile-extras,
  body .site-header__region-dropdown,
  body .site-header__mobile-cta{
    width:100%;
    min-width:0;
  }
  body .site-header__region-list{
    max-width:100%;
  }
}
@media (max-width: 767px){
  .site-wrap{
    padding-inline:10px;
    gap:18px;
  }
  .site-main{
    padding-top:10px;
  }
  .site-hero,
  .site-block{
    overflow:hidden;
  }
  .site-hero__content{
    padding:18px 14px 16px;
  }
  .site-hero__grid{
    gap:14px;
  }
  .site-hero__title{
    max-width:11ch;
    gap:4px;
  }
  .site-hero__title-line{
    display:block;
    max-width:none !important;
    font-size:clamp(34px, 9.8vw, 44px);
    line-height:.92;
    letter-spacing:-.04em;
    text-wrap:balance;
  }
  .site-hero__title-line--lead{
    max-width:8.9ch !important;
  }
  .site-hero__title-line--scope{
    max-width:9.4ch !important;
  }
  .site-hero__title-line--action{
    max-width:8.2ch !important;
  }
  .site-hero__title-line--action-final{
    max-width:9.2ch !important;
    color:var(--site-accent);
  }
  .site-hero__lead{
    max-width:24ch;
    font-size:14px;
    line-height:1.48;
  }
  .site-actions--hero{
    gap:8px;
  }
  .site-actions--hero .site-btn,
  .site-link-quiet--telegram-hero{
    width:100%;
    min-width:0;
  }
  .site-jump-nav{
    display:grid;
    grid-template-columns:1fr;
  }
  .site-block{
    padding:16px 14px;
  }
  .site-footer{
    padding-inline:14px;
  }
  .site-footer__inner--rich,
  .site-footer__content,
  .site-footer__nav-grid{
    gap:12px;
  }
  .site-footer__actions-wrap,
  .site-footer__intro,
  .site-footer__group{
    border-radius:18px;
  }
}
@media (max-width: 560px){
  .site-wrap{
    padding-inline:8px;
  }
  body .site-header__nav{
    top:68px;
    left:max(8px, env(safe-area-inset-left));
    right:max(8px, env(safe-area-inset-right));
    max-height:calc(100dvh - 78px - env(safe-area-inset-bottom));
    padding:14px;
    border-radius:22px;
  }
  .site-header__region-toggle,
  .site-header__mobile-btn,
  .site-header__mobile-link,
  .site-header__link{
    min-width:0;
  }
}


/* Extracted from main.css: header browse shelf compatibility */
/* Phase 3 Round 2 — header browse shelf */
.site-header__browse-shelf{
    border-top:1px solid rgba(255,255,255,.05);
    background:linear-gradient(180deg, rgba(17,19,24,.98), rgba(13,15,19,.94));
}
.site-header__browse-shelf-inner{
    max-width:var(--site-container);
    margin:0 auto;
    padding:12px 24px 14px;
    display:grid;
    gap:12px;
}
.site-header__browse-routes{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}
.site-header__browse-route{
    display:grid;
    gap:4px;
    min-height:68px;
    padding:14px 16px;
    border-radius:18px;
    border:1px solid rgba(212,175,55,.12);
    background:linear-gradient(180deg, rgba(26,29,38,.9), rgba(18,20,27,.96));
    transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.site-header__browse-route:hover{
    transform:translateY(-1px);
    border-color:rgba(212,175,55,.28);
    background:linear-gradient(180deg, rgba(30,34,44,.96), rgba(20,23,31,.98));
}
.site-header__browse-route-title{
    color:#fff4da;
    font-size:14px;
    font-weight:700;
    line-height:1.25;
}
.site-header__browse-route-meta{
    color:rgba(241,231,205,.74);
    font-size:12px;
    line-height:1.45;
}
.site-header__browse-chips{
    display:flex;
    align-items:center;
    gap:10px;
    overflow-x:auto;
    scrollbar-width:none;
    padding-bottom:2px;
}
.site-header__browse-chips::-webkit-scrollbar{display:none}
.site-header__browse-chips-label{
    flex:0 0 auto;
    color:rgba(241,231,205,.68);
    font-size:11px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.site-header__browse-chip{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    min-height:34px;
    padding:0 14px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.03);
    color:#f7efd7;
    font-size:13px;
    font-weight:600;
    white-space:nowrap;
    transition:background .18s ease,border-color .18s ease,color .18s ease;
}
.site-header__browse-chip:hover{
    border-color:rgba(212,175,55,.24);
    background:rgba(212,175,55,.08);
    color:#fff7df;
}
.site-header__browse-chip--all{
    color:#121316;
    border-color:transparent;
    background:linear-gradient(180deg,#f0ddb4,#d8b46c);
}
@media(max-width:1180px){
    .site-header__browse-routes{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:767px){
    .site-header__browse-shelf-inner{padding:10px 14px 12px}
    .site-header__browse-routes{
        display:flex;
        overflow-x:auto;
        gap:10px;
        scroll-snap-type:x proximity;
        padding-bottom:2px;
    }
    .site-header__browse-route{
        min-width:220px;
        scroll-snap-align:start;
    }
}

/* Phase 3 Round 3 — header browse shelf visual QA */
.site-header__browse-shelf{
    backdrop-filter:saturate(140%) blur(8px);
}
.site-header__browse-shelf-inner{
    gap:10px;
}
.site-header__browse-shelf-intro{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
}
.site-header__browse-shelf-copy{
    display:grid;
    gap:4px;
    min-width:0;
}
.site-header__browse-shelf-eyebrow{
    color:rgba(240,215,138,.92);
    font-size:11px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.site-header__browse-shelf-note{
    margin:0;
    max-width:62ch;
    color:rgba(241,231,205,.74);
    font-size:12px;
    line-height:1.45;
}
.site-header__browse-shelf-link{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    min-height:36px;
    padding:0 14px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.03);
    color:#fff4da;
    font-size:13px;
    font-weight:700;
}
.site-header__browse-shelf-link:hover{
    border-color:rgba(212,175,55,.24);
    background:rgba(212,175,55,.08);
}
.site-header__browse-routes{
    gap:8px;
}
.site-header__browse-route{
    min-height:62px;
    padding:12px 14px;
    gap:3px;
}
.site-header__browse-route-eyebrow{
    color:rgba(240,215,138,.9);
    font-size:10px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.site-header__browse-route-title{
    font-size:13px;
}
.site-header__browse-route-meta{
    font-size:11px;
    line-height:1.35;
}
.site-header__browse-chips{
    gap:8px;
}
.site-header__browse-chip{
    min-height:32px;
    padding:0 12px;
    font-size:12px;
}
@media(max-width:767px){
    .site-header__browse-shelf-intro{
        align-items:flex-start;
        flex-direction:column;
    }
    .site-header__browse-shelf-note{
        max-width:none;
    }
    .site-header__browse-route{
        min-width:210px;
    }
}