/*
 * Staging UX and responsive audit — 2026-09-01
 * Standalone layer for clean rollback.
 */
.hint,.guide-load-status,.tool-entry-card small,.store-card p,.hp-list-head p,.cc-page-head p{color:#aeb8d1!important}
.hn-btn,.social-btn,.store-tab,.car-action,.tool-entry-card,.sub-btn{min-height:42px}
@media(max-width:1480px){
  header .header-inner{width:min(100% - 18px,1240px)!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-areas:"brand socials" "nav nav"!important;gap:7px 12px!important;padding:8px 0!important}
  header .header-inner>.brand{grid-area:brand!important}
  header .header-inner>.home-nav{grid-area:nav!important;width:100%!important;justify-content:flex-start!important;overflow-x:auto!important;overscroll-behavior-inline:contain;scrollbar-width:none;padding:2px 0!important}
  header .home-nav::-webkit-scrollbar{display:none}
  header .header-inner>.socials{grid-area:socials!important}
  header .hn-btn{flex:0 0 auto!important}
}
@media(max-width:560px){
  header .brand h1 small{display:none}
  header .social-btn{font-size:0!important;min-width:42px;justify-content:center}
  header .social-btn img{width:18px!important;height:18px!important;flex-basis:18px!important}
}
.home-quicklinks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:1120px;margin:16px auto 0}
.home-quicklink{display:flex;align-items:center;gap:13px;min-height:86px;padding:16px 18px;border:1px solid rgba(240,180,41,.18);border-radius:15px;background:linear-gradient(145deg,rgba(18,25,49,.94),rgba(9,14,29,.94));color:#f2f4fb;text-decoration:none;transition:transform .18s ease,border-color .18s ease}
.home-quicklink:hover{transform:translateY(-2px);border-color:rgba(240,180,41,.5)}
.home-quicklink-icon{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;border-radius:12px;background:rgba(240,180,41,.1);font-size:1.25rem}
.home-quicklink strong{display:block;color:#ffe19a;font-size:.9rem}
.home-quicklink small{display:block;margin-top:4px;color:#aab5cf;font-size:.7rem;line-height:1.45}
.guides-intro{width:min(100% - 24px,980px);margin:28px auto 14px;padding:18px 20px;border:1px solid rgba(240,180,41,.2);border-radius:16px;background:linear-gradient(145deg,rgba(18,25,49,.84),rgba(9,14,29,.84))}
.guides-intro h2{margin:0;color:#ffe09a;font:400 clamp(1.55rem,3vw,2.25rem) 'Lilita One',cursive}
.guides-intro p{margin:6px 0 0;color:#aeb8d1;font-size:.82rem;line-height:1.55}
#soonPanel .soon-box{width:min(100% - 24px,1040px);max-width:1040px}
#soonPanel .tools-grid{grid-template-columns:repeat(3,minmax(0,1fr));width:100%}
#soonPanel .tool-entry-card{min-width:0}
#soonPanel .tool-entry-card small{line-height:1.5}
.store-hero.store-hero-compact{padding:18px 24px!important}
.store-hero.store-hero-compact .store-eyebrow{font-size:.62rem}
.store-hero.store-hero-compact h2{font-size:clamp(1.65rem,3vw,2.25rem)!important}
.store-hero.store-hero-compact p{display:none}
.store-tabs{scroll-snap-type:x proximity}
.store-tab{scroll-snap-align:start}
body.tools-route #twitchFloat.off,body.guides-route #twitchFloat.off,html.route-store #twitchFloat.off{display:none!important}
.hp-card>strong{min-height:2.6em}
.hp-card{content-visibility:auto;contain-intrinsic-size:240px}
@media(max-width:1120px) and (min-width:721px){.hp-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:860px){.hp-filter-row,.hp-filters{align-items:stretch!important;flex-direction:column!important}.hp-search{max-width:none!important;width:100%!important}}
.cc-session-actions button,.cc-tier-btn,.cc-analyzer-btn{min-height:42px}
.cc-explanation,.cc-formula-note,.cc-help{font-size:max(.75rem,12px)!important;line-height:1.55!important}
@media(max-width:900px){.cc-layout{grid-template-columns:1fr!important}.cc-hunt{min-height:360px!important}}
@media(max-width:640px){.cc-charms{grid-template-columns:1fr!important}.cc-hunt{min-height:320px!important}}
@media(max-width:620px){
  .map-task-control{min-width:46px!important;width:46px!important;height:46px!important}
  .map-task-result{min-height:52px}
  .map-task-search{min-height:46px;font-size:16px!important}
  .map-task-sidebar{width:calc(100% - 82px)!important}
  .ranking-head{align-items:flex-start!important;flex-direction:column!important;gap:12px}
  .ranking-page-size{width:100%;justify-content:space-between}
  .ranking-switch{display:grid!important;grid-template-columns:1fr!important}
  .ranking-switch button{width:100%}
  .ranking-row{grid-template-columns:30px 38px minmax(0,1fr)!important;gap:9px!important;padding:12px 10px!important}
  .ranking-points{grid-column:3!important;justify-self:start}
}
@media(max-width:760px){
  .home-quicklinks{grid-template-columns:1fr;gap:9px;margin-top:12px}
  .home-quicklink{min-height:72px;padding:13px 14px}
  .guides-intro{margin-top:16px;padding:15px}
  #soonPanel .tools-grid{grid-template-columns:1fr}
  .store-hero.store-hero-compact{padding:15px 17px!important}
  .store-tabs{overflow-x:auto!important;flex-wrap:nowrap!important;scrollbar-width:none}
  .store-tabs::-webkit-scrollbar{display:none}
}
@media(max-width:430px){.home-quicklink small{font-size:.72rem}.guides-intro p{font-size:.78rem}}
@media(prefers-reduced-motion:reduce){.home-quicklink{transition:none}.home-quicklink:hover{transform:none}}


/* Desktop header density test — larger labels/icons without increasing total width. */
@media(min-width:1481px){
  header .header-inner{
    display:grid!important;
    grid-template-columns:auto max-content auto!important;
    align-items:center!important;
    gap:16px!important;
  }
  header .home-nav{
    width:max-content!important;
    min-width:0!important;
    justify-self:center!important;
    margin-left:0!important;
    padding:5px 7px!important;
    gap:3px!important;
  }
  header .hn-btn{
    min-height:40px!important;
    padding:7px 10px!important;
    gap:6px!important;
    font-size:.8rem!important;
    line-height:1!important;
  }
  header .hn-btn .nav-pixel-icon,
  header .hn-btn .nav-rubini-icon,
  header .hn-btn .nav-rubinot-brand{
    width:18px!important;
    height:18px!important;
    flex:0 0 18px!important;
  }
  header .socials{margin-left:0!important;justify-self:end!important;gap:7px!important}
  header .social-btn{padding:8px 11px!important;gap:6px!important;font-size:.78rem!important}
  header .social-btn img{width:17px!important;height:17px!important}
}


/* Reference pass: larger desktop navigation inside the same vertical bar. */
@media(min-width:1240px){
  header .header-inner{
    display:grid!important;
    grid-template-columns:auto max-content auto!important;
    grid-template-areas:"brand nav socials"!important;
    align-items:center!important;
    gap:14px!important;
    padding-top:8px!important;
    padding-bottom:8px!important;
  }
  header .header-inner>.brand{grid-area:brand!important}
  header .header-inner>.home-nav{
    grid-area:nav!important;
    width:max-content!important;
    min-width:0!important;
    justify-self:center!important;
    margin-left:0!important;
    padding:4px 6px!important;
    gap:2px!important;
  }
  header .header-inner>.socials{grid-area:socials!important;margin-left:0!important;justify-self:end!important}
  header .hn-btn{
    min-height:38px!important;
    padding:6px 9px!important;
    gap:6px!important;
    font-size:.88rem!important;
    line-height:1!important;
  }
  header .hn-btn .nav-pixel-icon,
  header .hn-btn .nav-rubini-icon,
  header .hn-btn .nav-rubinot-brand{
    width:20px!important;height:20px!important;flex:0 0 20px!important
  }
  header .social-btn{min-height:38px!important;padding:7px 10px!important;font-size:.8rem!important}
  header .social-btn img{width:18px!important;height:18px!important}
}

/* Compact Home carousel: preserve content, remove excessive vertical air. */
@media(min-width:761px){
  .home-section{padding-top:18px!important;padding-bottom:30px!important}
  .carousel{height:auto!important;min-height:0!important}
  .car-slide{
    min-height:470px!important;
    padding:28px 44px 30px!important;
    gap:9px!important;
    justify-content:center!important;
  }
  .car-slide h2{margin:0!important;line-height:1!important}
  .car-slide p{margin:0!important;line-height:1.45!important}
  .car-lead{margin-bottom:0!important}
  .home-rank-label{margin-top:0!important}
  .home-top-five{gap:5px!important;padding:6px!important}
  .home-rank-row{padding-top:6px!important;padding-bottom:6px!important}
  .home-rank-row.champion{padding-top:8px!important;padding-bottom:8px!important}
  .car-actions{margin-top:2px!important}
  .car-dots{bottom:12px!important}
}
@media(max-width:760px){
  .car-slide{min-height:500px!important;padding:28px 22px 34px!important;gap:9px!important}
  .car-slide h2{line-height:1!important}
  .car-slide p{line-height:1.45!important}
}


/* Keep the enlarged desktop menu inside the original slim header height. */
@media(min-width:1240px){
  header{min-height:64px!important}
  header .header-inner{
    min-height:64px!important;height:64px!important;
    padding-top:0!important;padding-bottom:0!important
  }
}
