/* FINAL APPROVED DESIGN CONTRACT */

/* Permanent project rules */
*,*:before,*:after{box-shadow:none!important;text-shadow:none!important}

/* Brand */
.brand{display:flex!important;align-items:center!important;padding-top:12px!important;padding-bottom:12px!important}
.brand img{width:172px!important;height:auto!important;max-height:56px!important;object-fit:contain!important;object-position:left center!important;border-radius:0!important}

/* Desktop alignment and catalog grid */
@media(min-width:781px){
 .header-inner{max-width:1400px!important;margin-left:auto!important;margin-right:auto!important;padding-left:28px!important;padding-right:28px!important}
 .page{max-width:1400px!important;padding-left:28px!important;padding-right:28px!important}
 .catalog-layout{grid-template-columns:200px minmax(0,1fr)!important;gap:36px!important}
 .grid{grid-template-columns:repeat(3,minmax(245px,1fr))!important;gap:16px!important}
}
@media(min-width:1500px){.grid{grid-template-columns:repeat(4,minmax(245px,1fr))!important}}

/* Bento */
.card{display:flex!important;flex-direction:column!important;height:100%!important;border-radius:14px!important;overflow:hidden!important}
.card:hover{box-shadow:none!important}
.cover{aspect-ratio:16/10!important}
.cover img{width:100%!important;height:100%!important;object-fit:cover!important}
.iconbtn{top:10px!important;right:10px!important;width:30px!important;height:28px!important;min-width:30px!important;min-height:28px!important;border-radius:9px!important}
.body{display:flex!important;flex-direction:column!important;flex:1 1 auto!important;padding:14px 16px 13px!important}
.body h3{min-height:0!important;margin:0!important}
.area,.tag,.tag.technical,.tags .tag,.detailtags .tag,.ri b{font-size:12px!important;font-weight:400!important;line-height:1.25!important;color:#5F6864!important}
.area{min-height:0!important;margin-top:5px!important}
.difficulty{margin-top:17px!important;font-size:12px!important}
.card-metrics{margin-top:10px!important;font-size:12px!important}
.card-metrics .metric-duration{font-size:12px!important}
.tags,.detailtags{margin-left:0!important;padding-left:0!important;text-indent:0!important;justify-content:flex-start!important}
.tags{margin-top:14px!important;gap:7px!important;flex-wrap:wrap!important}
.tag,.tag.technical,.tags .tag,.detailtags .tag{margin-left:0!important;padding:0!important;background:transparent!important;border:0!important;border-radius:0!important}
.tag:before,.tag:after,.card-metrics span+span:before{content:none!important}

/* Favorite */
.card .heart.on,.card .iconbtn.heart.on{background:rgba(255,255,255,.94)!important;border-color:rgba(255,255,255,.78)!important;color:var(--danger)!important}
.card .heart.on svg,.card .iconbtn.heart.on svg{color:var(--danger)!important;fill:var(--danger)!important}

/* GPX verified surfaces: same neutral surface as Favorite, download button excluded */
.verified,.verified-filter,.verified-inline,.verified-info,.verified-note{background:rgba(255,255,255,.93)!important}
.verified{top:10px!important;left:10px!important;display:inline-flex!important;align-items:center!important;gap:5px!important;font-size:0!important;border-radius:9px!important}
.verified::before{content:"✓"!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;width:16px!important;height:16px!important;flex:0 0 16px!important;border-radius:50%!important;background:#DDF0A8!important;color:#4E741C!important;font-size:11px!important;font-weight:800!important;line-height:16px!important}
.verified::after{content:"GPX"!important;font-size:10px!important;font-weight:700!important;line-height:16px!important}

/* Filters */
.filter-section{border:0!important}
.filter-label{font-size:12px!important;font-weight:700!important}
.region{font-size:13px!important;font-weight:650!important}
.filter-chip{font-size:12px!important;font-weight:500!important}
.filter-chip.active{font-weight:650!important}
html[lang="ru"] .filter-chips-actions,html[lang="en"] .filter-chips-actions{display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important;align-items:flex-start!important;justify-content:flex-start!important;gap:8px!important}
html[lang="ru"] .filter-chips-actions .filter-chip,html[lang="en"] .filter-chips-actions .filter-chip{flex:0 0 auto!important;width:auto!important;margin:0!important;padding-left:9px!important;padding-right:9px!important}
.filter-chips-actions .filter-card-icon{display:none!important}
@media(min-width:781px){
 .filters>.reset{width:100%!important;margin-top:12px!important;padding-top:16px!important;padding-bottom:0!important;border-top:1px solid var(--line)!important;color:var(--muted)!important;font:inherit!important;font-size:12px!important;font-weight:500!important;line-height:1.35!important;text-align:left!important}
}
.fab,.favpanel{display:none!important}

/* Desktop top-right GPX legend */
@media(min-width:781px){
 .verified-inline{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:7px!important}
 .verified-inline>span{align-self:center!important}
 .verified-inline b{font-size:12px!important;line-height:1.1!important}
 .verified-inline small{font-size:10px!important;line-height:1.15!important}
}

/* Route drawer */
.sheet,.sheethead,.detail{background:var(--surface)!important}
.sheethead span{display:none!important}
@media(min-width:781px){
 .sheet{width:clamp(560px,39vw,620px)!important;min-width:560px!important;max-width:620px!important}
 .sheethead{height:48px!important;min-height:48px!important}
 .sheethead button{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important}
 .detail{padding:24px 24px 30px!important}
 .detail-sub{margin-bottom:7px!important}
 .detail h2{margin-bottom:11px!important}
 .detail-difficulty{margin-bottom:9px!important}
 .detailtags{margin-bottom:17px!important}
 .gallery{width:100%!important;aspect-ratio:16/10!important;border-radius:14px!important;overflow:hidden!important}
 .gallery img{width:100%!important;height:100%!important;object-fit:cover!important}
 .actions{display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:8px!important;margin-top:12px!important}
 .stats{grid-template-columns:repeat(5,minmax(0,1fr))!important;padding:15px 0!important;margin:20px 0 24px!important}
 .stat span{margin-bottom:6px!important}
 .box{margin:24px 0!important}
 .box h4{margin-bottom:11px!important}
 .box p,.detail p{line-height:1.55!important}
 .routeinfo{margin:22px 0 24px!important}
 .ri{grid-template-columns:100px minmax(0,1fr)!important;min-height:44px!important;padding:11px 0!important;align-items:center!important}
 .profile{width:100%!important;height:165px!important;margin-top:12px!important}
}

/* Route action buttons: one geometry, one icon/text distance */
.actions .btn,.actions .btn.passed,.actions .source-btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;column-gap:6px!important}
.actions .btn>svg,.actions .source-btn>.external-link-icon{position:static!important;display:block!important;flex:0 0 auto!important;margin:0!important;transform:none!important;align-self:center!important;order:0!important}
.actions .btn>span,.actions .source-btn>span{position:static!important;display:inline-block!important;width:auto!important;margin:0!important;transform:none!important;text-align:center!important;order:1!important}
.actions .btn.passed{grid-template-columns:none!important;justify-items:normal!important;padding-left:12px!important;padding-right:12px!important}
.actions .btn.passed>svg,.actions .btn.passed>span{grid-column:auto!important;grid-row:auto!important;justify-self:auto!important}
.actions .source-btn{border:0!important;background:transparent!important;width:auto!important;min-width:auto!important;padding-left:6px!important;padding-right:6px!important}
.actions .source-btn::after{content:none!important}
.actions .source-btn .external-link-icon{width:14px!important;height:14px!important;flex:0 0 14px!important}
.actions .btn.gpx .download-full{display:inline!important;position:static!important;margin:0!important}
.completed{display:inline-flex!important;align-items:center!important;justify-content:center!important;line-height:1.1!important}
.completed svg{display:block!important;align-self:center!important;transform:none!important}

/* Mobile component rules. Main page/grid composition remains from the accepted foundation. */
@media(max-width:780px){
 .brand{padding-top:10px!important;padding-bottom:10px!important}
 .brand img{width:138px!important;height:auto!important;max-height:46px!important;border-radius:0!important}

 .filter-chips,.filter-row-multi{display:flex!important;flex-wrap:wrap!important;column-gap:10px!important;row-gap:8px!important}
 .filter-chip,.filter-chips-actions .filter-chip{flex:0 0 auto!important;width:auto!important;min-width:0!important;padding-left:8px!important;padding-right:8px!important}
 .mobile-filter-resetbar{display:none!important}
 .mobile-filter-resetbar.show{display:block!important;position:sticky!important;bottom:calc(-14px - env(safe-area-inset-bottom))!important;z-index:20!important;margin:18px -14px calc(-14px - env(safe-area-inset-bottom))!important;padding:12px 14px calc(12px + env(safe-area-inset-bottom))!important;background:var(--surface)!important;border-top:1px solid var(--line)!important}
 .mobile-filter-resetbar button{width:100%!important;min-height:46px!important;border:1px solid var(--line)!important;border-radius:12px!important;background:var(--surface-2)!important;color:var(--text)!important;font:inherit!important;font-size:13px!important;font-weight:600!important}

 .card .heart.on,.card .iconbtn.heart.on{background:rgba(255,255,255,.94)!important;color:var(--danger)!important}

 .verified-inline{width:auto!important;min-width:0!important;height:34px!important;min-height:34px!important;padding:0 9px!important;display:flex!important;align-items:center!important;gap:5px!important}
 .verified-inline>div{display:block!important}
 .verified-inline small{display:none!important}
 html[lang="ru"] .verified-inline b{font-size:10px!important;line-height:1!important;text-transform:none!important}
 html[lang="ru"] .verified-inline b::after{content:" проверен"!important}
 html[lang="en"] .verified-inline b{font-size:10px!important;line-height:1!important;text-transform:none!important}
 html[lang="en"] .verified-inline b::after{content:" verified"!important}

 .actions .btn,.actions .btn.passed,.actions .source-btn{display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;column-gap:6px!important}
 .actions .btn.passed{grid-template-columns:none!important;padding-left:8px!important;padding-right:8px!important}
 .actions .source-btn{grid-template-columns:none!important;min-height:40px!important;padding:0 12px!important;border:1px solid var(--line)!important;border-radius:var(--r-md)!important;background:var(--surface)!important;color:var(--text)!important}
 .actions .source-btn .external-link-icon{order:0!important}
 .actions .source-btn span{order:1!important}
}