/* Shared app chrome. Existing business layouts and brand tokens remain intact. */
:root { --app-shell-bar:rgba(22,22,24,.94); }
html { scroll-padding-top:88px; }
body { -webkit-font-smoothing:antialiased; }
button,a,input,select { touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
.topbar { position:sticky; top:0; z-index:20; background:var(--app-shell-bar); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.sidebar { background:#101012; }
.workspace-switch { border:0; background:#202024; border-radius:8px; }
.main-nav a { border-radius:8px; min-height:44px; }
.main-nav a.active { background:#26314e; color:#eef2ff; }
.main-nav a.active .icon { opacity:1; }
.button,.icon-button,input,select,textarea { border-radius:8px; }
.button.primary { box-shadow:none; }
.page-heading h2 { font-size:28px; line-height:1.25; letter-spacing:0; }
.metric > strong { font-size:29px; letter-spacing:0; }
.portal-summary { gap:12px; border:0; margin:26px 0; }
.portal-summary > div { padding:20px; background:#202023; border:1px solid #323236; border-radius:8px; min-height:114px; }
.portal-summary strong { font-size:24px; font-weight:550; }
.portal-list > li { min-height:58px; }
.portal-check { min-height:44px; padding:0 4px; }
.portal-check input { accent-color:#2d5bff; }
.app-workspaces { display:flex; flex-wrap:wrap; border-top:1px solid #343439; border-bottom:1px solid #343439; margin:8px 0 22px; gap:0 28px; }
.app-workspaces a { min-height:58px; display:flex; align-items:center; gap:10px; color:#b4b3bb; }
.app-workspaces a:hover { color:#f5f2ed; }
.app-workspaces a > .icon:last-child { width:15px; }
.platform-logo { display:inline-flex; align-items:center; justify-content:center; width:58px; height:58px; border-radius:8px; background:#f5f6f7; flex-shrink:0; }
.platform-logo img { width:32px; height:32px; object-fit:contain; }
.platform-snapchat { background:#fffc00; }
.platform-gorgias img { width:42px; height:42px; }
.platform-detail { display:flex; align-items:flex-start; gap:20px; min-width:0; }
.platform-detail > div { min-width:0; }
.platform-name { display:flex; align-items:center; gap:14px; }
.portal-activation .platform-logo { width:38px; height:38px; }
.portal-activation .platform-logo img { width:25px; height:25px; }
.portal-activation .platform-gorgias img { width:30px; height:30px; }
.portal-connection { min-height:128px; }
.media-tabs { display:flex; align-items:center; border-bottom:1px solid #343439; gap:28px; overflow-x:auto; scrollbar-width:thin; }
.media-tabs a { display:flex; gap:8px; align-items:center; min-height:50px; border-bottom:2px solid transparent; padding:0 2px; color:#b4b3bb; white-space:nowrap; font-size:14px; }
.media-tabs a.active { color:#f5f2ed; border-bottom-color:#2d5bff; }
.media-tabs a span { color:#94939d; font-size:12px; font-variant-numeric:tabular-nums; }
.media-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding:20px 0 10px; }
.media-toolbar label { min-width:0; }
.media-search { flex:1 1 280px; position:relative; }
.media-search .icon { position:absolute; left:13px; top:13px; width:18px; height:18px; opacity:.65; }
.media-search input { width:100%; padding-left:40px; }
.media-toolbar .form-error { flex-basis:100%; margin:0; }
.media-result-count { color:#94939d; font-size:13px; padding:8px 0 20px; }
.media-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px; }
.media-tile { min-width:0; content-visibility:auto; contain-intrinsic-size:auto 350px; }
.media-preview { width:100%; aspect-ratio:4/3; border-radius:8px; overflow:hidden; background:#252529; border:1px solid #343439; }
.media-preview:has(img) { background-color:#747780; background-image:linear-gradient(45deg,#646770 25%,transparent 25%),linear-gradient(-45deg,#646770 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#646770 75%),linear-gradient(-45deg,transparent 75%,#646770 75%); background-size:24px 24px; background-position:0 0,0 12px,12px -12px,-12px 0; }
.media-preview img,.media-preview video { display:block; width:100%; height:100%; object-fit:contain; }
.media-preview video { background:#0c0c0e; }
.media-document { display:flex; width:100%; height:100%; flex-direction:column; justify-content:center; align-items:center; gap:16px; color:#b4b3bb; font-size:13px; }
.media-document .icon { width:36px; height:36px; opacity:.65; }
.media-caption { display:flex; align-items:flex-start; gap:6px; padding:13px 0 4px; }
.media-caption > div { flex:1; min-width:0; }
.media-caption strong { display:block; font-size:13px; font-weight:500; line-height:1.5; overflow-wrap:anywhere; }
.media-caption small { display:block; margin-top:5px; color:#94939d; font-size:12px; overflow-wrap:anywhere; }
.media-caption .icon-button { width:32px; height:32px; min-width:32px; padding:6px; border:0; background:transparent; }
.media-caption .icon { width:16px; height:16px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.app-tabbar { display:none; }
.action-dialog,.lead-dialog { overscroll-behavior:contain; }
@media(min-width:801px) { .sidebar {padding-top:24px;} .view {padding-top:32px;} }
@media(max-width:1200px) { .media-grid {grid-template-columns:repeat(3,minmax(0,1fr));} }
@media(max-width:800px) {
  .app-tabbar:not([hidden]) { display:flex; position:fixed; left:0; right:0; bottom:0; z-index:35; background:rgba(25,25,28,.96); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); border-top:1px solid #343439; padding:8px 8px calc(8px + env(safe-area-inset-bottom)); gap:4px; }
  .app-tabbar a { flex:1; min-width:0; min-height:48px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; color:#b4b3bb; font-size:11px; border-radius:8px; }
  .app-tabbar a[aria-current="page"] { color:#d6e0ff; background:#26314e; }
  .app-tabbar .icon { width:20px; height:20px; }
  .app-tabbar a[aria-current="page"] .icon { filter:brightness(0) saturate(100%) invert(90%) sepia(20%) saturate(900%) hue-rotate(190deg); }
  .view { padding-bottom:calc(96px + env(safe-area-inset-bottom)); }
  .topbar { padding-top:env(safe-area-inset-top); }
  .nav-open .sidebar {z-index:50;}
  .nav-open .app-tabbar {visibility:hidden;}
  .media-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px;}
  .media-caption {flex-wrap:wrap;}
  .media-caption > div {flex-basis:100%;}
  .media-caption .icon-button {min-width:44px;min-height:44px;}
  .media-preview {aspect-ratio:4/5;}
  .portal-summary > div {padding:16px;min-height:112px;}
  .portal-summary strong {font-size:21px;}
  .portal-summary {gap:10px;}
  .platform-detail {gap:14px;}
  .portal-connection h3 {font-size:19px;}
  .media-tabs {gap:22px;}
  .page-heading h2 {font-size:25px;}
}
@media(prefers-reduced-motion:reduce) { html {scroll-behavior:auto;} .button,.icon-button,.main-nav a {transition:none;} }