/* 4BRANDS PREMIUM PRODUCT DESIGN — ROUND 02
   Bounded overrides after desktop + iPhone visual judge.
   Applies only to .fbt-* product surfaces. */

.fbt-app{--paper:#f8f8f5;--soft:#efefeb;--line:rgba(11,11,12,.10)}
.fbt-topbar{background:#fff;backdrop-filter:none}
.fbt-button--light{background:#fff;color:#0b0b0c!important}
.fbt-button--soft{background:#efefeb;color:#0b0b0c}

/* Make the economic overview read as one instrument, not four generic SaaS cards. */
.fbt-metric-rail{grid-template-columns:repeat(4,minmax(0,1fr));gap:0;background:#fff;border:1px solid rgba(11,11,12,.055);border-radius:24px;overflow:hidden}
.fbt-metric{background:transparent;border:0;border-radius:0;box-shadow:none;min-height:108px;padding:17px 19px}
.fbt-metric+.fbt-metric{border-left:1px solid var(--line)}
.fbt-metric strong{font-weight:520}

/* More editorial restraint in the primary control room. */
.fbt-hero-card{box-shadow:none}
.fbt-state-card{box-shadow:none}
.fbt-surface,.fbt-company-card{box-shadow:none}
.fbt-contextbar{margin-bottom:20px}
.fbt-view-head{margin-bottom:24px}
.fbt-state-score strong{font-weight:480}

/* Quieter navigation: one active soft state, no dashboard chrome. */
.fbt-sidebar nav button{border-radius:999px;padding:10px 13px}
.fbt-sidebar nav button.is-active{background:#eeeeff}
.fbt-company-switch{background:#f2f2ef}

@media(max-width:760px){
  /* Mobile is a product in its own right: persistent five-destination dock. */
  .fbt-mobile-menu{display:none!important}
  .fbt-frame{height:calc(100svh - 60px)}
  .fbt-sidebar,
  .fbt-sidebar.is-open{position:fixed;z-index:160;left:10px;right:10px;top:auto;bottom:max(10px,env(safe-area-inset-bottom));width:auto;height:64px;min-height:64px;padding:6px;background:#fff;border:1px solid rgba(11,11,12,.10);border-radius:22px;box-shadow:0 18px 50px rgba(15,15,18,.14);transform:none;display:block}
  .fbt-sidebar nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;height:100%}
  .fbt-sidebar nav button{min-width:0;height:100%;padding:0 4px;border-radius:16px;justify-content:center;text-align:center;font-size:9px;font-weight:650;line-height:1.05;color:#696963}
  .fbt-sidebar nav button:nth-child(5),
  .fbt-sidebar nav button:nth-child(6){display:none}
  .fbt-sidebar nav button.is-active{background:#ededff;color:#2e2eff}
  .fbt-sidebar nav button small{position:absolute;transform:translate(20px,-12px);min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:#2e2eff;color:#fff;display:grid;place-items:center;font-size:7px}
  .fbt-sidebar__bottom{display:none}
  .fbt-workspace{padding:18px 16px calc(96px + env(safe-area-inset-bottom))}

  .fbt-topbar{padding:0 12px;grid-template-columns:minmax(88px,1fr) auto minmax(88px,1fr)}
  .fbt-topbar__left{min-width:0}
  .fbt-topbar__actions{min-width:0}
  .fbt-topbar__actions .fbt-button{min-height:38px;padding:0 13px}
  .fbt-company-switch{min-width:0;padding:8px 10px}
  .fbt-company-switch strong{max-width:92px}

  .fbt-contextbar{margin-bottom:16px}
  .fbt-contextbar span{font-size:8px}
  .fbt-contextbar>button{font-size:10px}
  .fbt-view-head{margin-bottom:18px}
  .fbt-view-head h1{font-size:42px;line-height:.98}
  .fbt-view-head>div>p:last-child{margin-top:12px;font-size:13px}

  /* One compact horizontal economic instrument instead of a 2×2 card wall. */
  .fbt-metric-rail{display:flex;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;border-radius:21px;margin-bottom:14px;scrollbar-width:none}
  .fbt-metric-rail::-webkit-scrollbar{display:none}
  .fbt-metric{flex:0 0 145px;min-height:88px;padding:13px 14px;scroll-snap-align:start}
  .fbt-metric strong{font-size:20px}
  .fbt-metric small{font-size:8px}

  .fbt-hero-card{min-height:310px;border-radius:26px;padding:23px}
  .fbt-hero-card h2{font-size:35px;line-height:.99;margin:34px 0 14px}
  .fbt-hero-card>p{font-size:12.5px;line-height:1.48}
  .fbt-card-actions{padding-top:24px;gap:12px}
  .fbt-card-actions .fbt-button{min-height:42px;padding:0 17px;font-size:11px}
  .fbt-card-actions .fbt-text-button{font-size:11px}
  .fbt-state-card{min-height:280px;margin-top:12px;border-radius:26px;padding:22px}
  .fbt-state-score{margin:30px 0 20px}
  .fbt-state-score strong{font-size:54px}

  /* Search remains the dominant first action; supporting examples recede. */
  .fbt-entry__copy{padding-top:42px}
  .fbt-search-card{margin-top:36px;border-radius:27px;box-shadow:0 18px 50px rgba(15,15,18,.07)}
  .fbt-quick{gap:7px}
  .fbt-quick button{min-height:58px;padding:12px 15px;border-radius:17px;background:#f3f3ef}

  .fbt-opportunity-detail{max-height:none;padding-bottom:30px}
  .fbt-opportunity-list{scrollbar-width:none}
  .fbt-opportunity-list::-webkit-scrollbar{display:none}
  .fbt-drawer{padding-bottom:calc(28px + env(safe-area-inset-bottom))}
}

@media(max-width:430px){
  .fbt-entry h1{font-size:clamp(56px,17vw,72px)}
  .fbt-entry__copy>div:first-child>p:last-child{font-size:15px}
  .fbt-topbar__actions .fbt-button{font-size:9px;padding:0 11px}
  .fbt-company-switch strong{max-width:78px}
}