/* Falmera Owner Dashboard — tokens and components from the Falmera Owner Dashboard design system
   (claude.ai/artifact/SM19eCcjcxC1kJuFB39PmN), built to the approved 1536×1024 reference.
   No inline styles: the page CSP allows only this stylesheet and Google Fonts. */
:root{color-scheme:dark;
 --bg-page:#070B1E;--bg-sidebar:#080D24;--surface-card:#0E1430;--surface-raised:#161E42;--surface-hover:#1B2450;
 --border-subtle:#1C2550;--border-strong:#25305F;--ink:#F5F7FF;--ink-muted:#A3ACCF;--ink-subtle:#7F89B3;--link:#4C8DFF;--focus-ring:var(--link);
 --brand-blue:#086BFF;--brand-violet:#6727E8;--brand-magenta:#C326D9;--brand-red:#FF3158;--brand-sand:#F3C49F;--brand-cream:#FFF1E4;--brand-navy:#10162A;
 --chart-bar-top:#3563FF;--chart-bar-bottom:#1B33B8;--chart-cyan:#3BB2FF;--chart-orange:#FF8A3D;--chart-teal:#2DD4BF;--chart-track:#1A2248;
 --success:#34D399;--success-bg:#0F2E28;--warning:#FBBF24;--warning-bg:#33260F;--danger:#FF4D6D;--danger-bg:#3A1020;
 --on-brand:#FFFFFF; /* text on brand-blue/magenta fills: 4.6:1 (ink would be 4.3:1) */
 --tile-blue:#12204A;--tile-teal:#0E2A30;--tile-violet:#1F1748;
 --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;
 --sidebar-width:248px;--topbar-height:54px;--rail-width:332px;--row-height:43px;
 --radius-sm:6px;--radius-md:8px;--radius-lg:10px;--radius-xl:12px;--radius-full:9999px;
 --shadow-card:0 1px 0 rgba(255,255,255,0.03) inset, 0 10px 30px rgba(2,4,16,0.45);
 --shadow-nav-active:0 6px 20px rgba(8,107,255,0.30);
 --font-sans:"Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
 /* Fixed service colours for charts */
 --series-blue:var(--brand-blue);--series-violet:var(--brand-violet);--series-red:var(--brand-red);--series-orange:var(--chart-orange);--series-cyan:var(--chart-cyan);--series-teal:var(--chart-teal);--series-gray:var(--ink-subtle);
}

/* Base */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--bg-page)}
body{margin:0;min-height:100vh;font-family:var(--font-sans);color:var(--ink);background:var(--bg-page);-webkit-font-smoothing:antialiased;font-size:14px;line-height:1.45}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer}
button:disabled{cursor:default;opacity:.55}
a{color:var(--link)}
h1,h2,h3,p{margin:0}
svg.lucide{width:20px;height:20px;flex:none}
svg.lucide.flip{transform:rotate(180deg)}
.fm-muted{color:var(--ink-muted)}
.fm-subtle{color:var(--ink-subtle)}
.skip,.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.skip:focus{position:fixed;inset:12px auto auto 12px;width:auto;height:auto;clip:auto;background:var(--surface-raised);color:var(--ink);padding:12px 16px;border-radius:var(--radius-md);z-index:50}

/* Status toast (live region; text always present for assistive tech) */
.fm-toast{position:fixed;right:20px;bottom:20px;z-index:40;max-width:min(420px,calc(100vw - 32px));padding:10px 14px;border-radius:var(--radius-md);background:var(--surface-raised);border:1px solid var(--border-strong);box-shadow:var(--shadow-card);font-size:13px;pointer-events:none}
/* Hidden toasts stay in the live region for assistive tech but are clipped, not faded. */
.fm-toast:not(.is-visible):not([data-error=true]){width:1px;height:1px;padding:0;border:0;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap}
.fm-toast[data-error=true]{border-color:var(--danger);color:var(--ink)}
.fm-toast:empty{display:none}

/* Buttons and fields */
.fm-btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:42px;padding:0 16px;border:1px solid var(--brand-blue);border-radius:var(--radius-md);background:linear-gradient(180deg,var(--chart-bar-top),var(--chart-bar-bottom));color:var(--on-brand);font-size:14px;font-weight:600;box-shadow:var(--shadow-nav-active);text-decoration:none}
.fm-btn-primary:hover:not(:disabled){filter:brightness(1.08)}
.fm-btn-primary svg.lucide{width:18px;height:18px}
.fm-btn-primary .fm-caret{width:14px;height:14px;margin-left:4px}
.fm-btn-secondary{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--surface-raised);color:var(--ink);font-size:13px;font-weight:600;text-decoration:none}
.fm-btn-secondary:hover:not(:disabled){background:var(--surface-hover)}
.fm-btn-secondary svg.lucide{width:16px;height:16px}
label{display:block;font-size:13px;font-weight:600;margin:14px 0 6px;color:var(--ink-muted)}
input:not([type=search]),textarea{display:block;width:100%;padding:10px 12px;border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--surface-raised);color:var(--ink)}
input:not([type=search])::placeholder,textarea::placeholder{color:var(--ink-subtle)}
form .fm-btn-primary{margin-top:18px}

/* Sign-in and activation */
.fm-auth{min-height:100vh;display:grid;place-items:center;padding:24px 16px;background:radial-gradient(1200px 600px at 85% -10%,var(--tile-violet),transparent 60%),var(--bg-page)}
.fm-auth-card{width:min(460px,100%);padding:32px;background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);box-shadow:var(--shadow-card)}
.fm-auth-logo{display:block;height:60px;width:auto;margin:-8px 0 18px -6px}
.fm-auth h1{font-size:30px;line-height:38px;font-weight:700;letter-spacing:-.01em;margin-bottom:8px}
.fm-auth form .fm-btn-primary{width:100%}
.fm-auth-note{font-size:12px;margin-top:18px}

/* Card */
.fm-card{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:var(--space-4);min-width:0}
.fm-card-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-3)}
.fm-card-title{font-size:18px;line-height:24px;font-weight:700;letter-spacing:-.005em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fm-card-title.sm{font-size:16px}
.fm-calls .fm-card-title{font-size:15px}
.fm-link{color:var(--link);font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap}
.fm-link:hover{text-decoration:underline;text-underline-offset:3px}
.fm-select{display:inline-flex;align-items:center;gap:var(--space-2);height:30px;padding:0 10px 0 12px;font-size:12px;font-weight:500;background:var(--surface-raised);border:1px solid var(--border-strong);border-radius:var(--radius-md)}
.fm-select:disabled{opacity:1;cursor:default}
.fm-select svg.lucide{width:14px;height:14px;color:var(--ink-muted)}

/* Shell */
.fm-shell{display:grid;grid-template-columns:var(--sidebar-width) minmax(0,1fr);min-height:100vh}
.fm-main{padding:8px 20px 16px 16px;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-3);align-content:start;min-width:0}
.fm-main:focus{outline:none}
.fm-view{min-width:0}

/* Sidebar */
.fm-sidebar{position:sticky;top:0;height:100vh;width:var(--sidebar-width);background:var(--bg-sidebar);border-right:1px solid var(--border-subtle);padding:22px 14px 34px;display:flex;flex-direction:column;gap:var(--space-3)}
.fm-sidebar-top{display:flex;align-items:center;justify-content:space-between}
.fm-sidebar-logo{display:block;height:44px;margin:-6px 0 0 4px}
.fm-sidebar-logo img{display:block;height:60px;width:auto;margin-top:-8px}
.fm-drawer-close{display:none}
.fm-nav{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:1px;margin:22px -6px 0;padding:0 6px 12px;scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent;-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(180deg,#000 calc(100% - 28px),transparent)}
.fm-nav a{display:flex;align-items:center;gap:14px;min-height:44px;padding:0 14px;border-radius:var(--radius-md);color:var(--ink);text-decoration:none;font-size:15px;font-weight:500;flex:none}
.fm-nav a svg.lucide{color:var(--ink-muted)}
.fm-nav a:hover{background:var(--surface-hover)}
.fm-nav a[aria-current=page]{color:var(--on-brand);background:linear-gradient(90deg,var(--brand-blue),var(--chart-bar-bottom) 55%,var(--brand-violet));box-shadow:var(--shadow-nav-active);font-weight:600}
.fm-nav a[aria-current=page] svg.lucide{color:var(--ink)}
.fm-nav-label{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fm-soon-pill{margin-left:-9px;font-size:8.5px;line-height:14px;font-weight:700;letter-spacing:0;color:var(--ink-muted);background:var(--surface-raised);border:1px solid var(--border-strong);border-radius:var(--radius-sm);padding:0 3px;text-transform:uppercase;flex:none}
.fm-nav a:has(.fm-soon-pill){padding-right:6px;gap:13px}
.fm-nav a[aria-current=page] .fm-soon-pill{color:var(--ink);background:transparent;border-color:var(--ink-muted)}
.fm-nav-group{margin:16px 14px 6px;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-subtle)}
.fm-nav-sub{display:flex;flex-direction:column;gap:1px}
.fm-sidebar-foot{display:grid;grid-template-columns:minmax(0,1fr);gap:42px;flex:none;min-width:0}

/* Nova placeholder + user */
.fm-nova{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:12px 14px 14px}
.fm-nova-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.fm-nova-orb{width:64px;height:64px;border-radius:var(--radius-full);background:radial-gradient(circle at 50% 38%,var(--surface-raised) 0 46%,transparent 47%),conic-gradient(from 200deg,var(--brand-blue),var(--brand-violet),var(--brand-magenta),var(--brand-blue));display:grid;place-items:center;flex:none}
.fm-nova-orb span{display:block;width:7px;height:9px;border-radius:var(--radius-full);background:var(--brand-magenta);box-shadow:14px 0 0 var(--brand-magenta);margin-right:14px}
.fm-nova-name{font-size:17px;font-weight:700;letter-spacing:.02em}
.fm-nova-role{font-size:13px;color:var(--ink-muted)}
.fm-nova-ask{width:100%;display:flex;align-items:center;gap:10px;height:42px;padding:0 14px;background:var(--surface-raised);border:1px solid var(--border-strong);border-radius:var(--radius-md);font-size:14px;font-weight:600}
.fm-nova-ask:disabled{opacity:1;cursor:not-allowed}
.fm-nova-ask svg.lucide{width:16px;height:16px;color:var(--link)}
.fm-nova-ask .fm-wave{margin-left:auto;color:var(--brand-violet);display:flex}
.fm-user{position:relative;min-width:0;display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg)}
.fm-user-text{min-width:0;flex:1}
.fm-user b{display:block;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fm-user span{display:block;font-size:13px;color:var(--ink-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fm-icon-plain{background:none;border:0;padding:4px;color:var(--ink-muted);border-radius:var(--radius-sm);display:grid;place-items:center}
.fm-icon-plain svg.lucide{width:16px;height:16px}
.fm-icon-plain:hover{color:var(--ink);background:var(--surface-hover)}

/* Menus */
.fm-menu{position:absolute;z-index:30;min-width:180px;padding:6px;background:var(--surface-raised);border:1px solid var(--border-strong);border-radius:var(--radius-md);box-shadow:var(--shadow-card)}
.fm-menu.up{left:0;right:0;bottom:calc(100% + 6px)}
.fm-new .fm-menu{right:0;top:calc(100% + 6px)}
.fm-menu button{width:100%;display:flex;align-items:center;gap:10px;padding:9px 10px;background:none;border:0;border-radius:var(--radius-sm);font-size:14px;font-weight:500;text-align:left}
.fm-menu button:hover{background:var(--surface-hover)}
.fm-menu svg.lucide{width:16px;height:16px;color:var(--ink-muted)}

/* Avatars */
.fm-avatar{width:42px;height:42px;border-radius:var(--radius-full);display:grid;place-items:center;font-size:14px;font-weight:700;background:var(--surface-raised);border:1px solid var(--border-strong);flex:none}
.fm-avatar.sm{width:36px;height:36px;border-color:var(--brand-sand)}
.fm-initials{width:32px;height:32px;border-radius:var(--radius-md);display:grid;place-items:center;font-size:13px;font-weight:700;color:var(--ink);flex:none}
.fm-initials.sm{width:20px;height:20px;border-radius:5px;font-size:9px}
.fm-initials.blue{background:var(--brand-blue);color:var(--on-brand)}
.fm-initials.violet{background:var(--brand-violet)}
.fm-initials.magenta{background:var(--brand-magenta);color:var(--on-brand)}
.fm-initials.orange{background:var(--chart-orange);color:var(--brand-navy)}
.fm-initials.light{background:var(--ink);color:var(--brand-violet)}

/* Top bar */
.fm-topbar{height:var(--topbar-height);display:flex;align-items:center;gap:var(--space-3)}
.fm-menu-btn{display:none;width:42px;height:42px;place-items:center;border-radius:var(--radius-md);background:var(--surface-card);border:1px solid var(--border-strong)}
.fm-search{flex:0 1 724px;min-width:0;height:42px;display:flex;align-items:center;gap:12px;margin:0;padding:0 16px;background:var(--surface-card);border:1px solid var(--border-strong);border-radius:var(--radius-md);color:var(--ink-subtle);font-size:14px;font-weight:500}
.fm-search:focus-within{border-color:var(--link)}
.fm-search input{flex:1;min-width:0;border:0;background:none;outline:none;padding:0;color:var(--ink);font-size:14px;-webkit-appearance:none;appearance:none}
.fm-search input::placeholder{color:var(--ink-subtle)}
.fm-topbar-actions{margin-left:auto;display:flex;align-items:center;gap:18px}
.fm-new{position:relative}
.fm-bell{position:relative;display:grid;place-items:center;padding:6px;color:var(--chart-bar-top);border-radius:var(--radius-md)}
.fm-bell svg.lucide{width:22px;height:22px;fill:currentColor}

/* Welcome banner */
.fm-banner{position:relative;overflow:hidden;height:132px;border-radius:var(--radius-xl);border:1px solid var(--border-subtle);background:linear-gradient(100deg,var(--surface-card) 0%,var(--surface-card) 40%,var(--tile-violet) 70%,var(--brand-violet) 100%);padding:var(--space-6);display:flex;align-items:center}
.fm-banner > div:first-child{position:relative;z-index:1}
.fm-banner h1{font-size:30px;line-height:38px;font-weight:700;letter-spacing:-.01em}
.fm-banner p{font-size:18px;line-height:26px;margin-top:6px;color:var(--ink-muted)}
.fm-banner-art{position:absolute;inset:0 0 0 auto;width:42%;height:100%;pointer-events:none}
.fm-banner-art .stop-blue{stop-color:var(--brand-blue)}.fm-banner-art .stop-violet{stop-color:var(--brand-violet)}.fm-banner-art .stop-magenta{stop-color:var(--brand-magenta)}.fm-banner-art .stop-red{stop-color:var(--brand-red)}
.fm-banner-art .ribbon-a{fill:url(#fm-banner-gradient);opacity:.55}
.fm-banner-art .ribbon-b{fill:url(#fm-banner-gradient);opacity:.8}
.fm-banner-art .ribbon-c{fill:none;stroke:var(--brand-magenta);stroke-width:10;opacity:.7}
.fm-banner-mark{position:absolute;left:44%;top:16px;text-align:center}
.fm-banner-mark img{height:66px;width:auto;display:block;margin:0 auto}
.fm-banner-mark small{display:block;margin-top:10px;font-size:11px;font-weight:600;letter-spacing:.2em;color:var(--ink-muted);white-space:nowrap}

/* KPI cards */
.fm-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-3)}
.fm-stat{display:grid;grid-template-columns:54px minmax(0,1fr) auto;align-items:start;gap:0 18px;padding:16px 16px 14px;min-height:114px;color:var(--ink);text-decoration:none}
.fm-stat:hover{border-color:var(--border-strong)}
.fm-tile{width:54px;height:54px;border-radius:var(--radius-xl);display:grid;place-items:center}
.fm-tile svg.lucide{width:26px;height:26px}
.fm-tile.blue{--tile-bg:var(--tile-blue);background:var(--tile-blue);color:var(--chart-bar-top)}
.fm-tile.teal{--tile-bg:var(--tile-teal);background:var(--tile-teal);color:var(--chart-teal)}
.fm-tile.red{--tile-bg:var(--danger-bg);background:var(--danger-bg);color:var(--brand-red)}
.fm-tile.violet{--tile-bg:var(--tile-violet);background:var(--tile-violet);color:var(--brand-violet)}
.fm-stat .fm-tile svg.lucide.solid{fill:currentColor;stroke:var(--tile-bg)}
.fm-stat-label{font-size:14px;font-weight:500;margin-top:2px;white-space:nowrap}
.fm-stat-value{font-size:26px;line-height:30px;font-weight:700;margin-top:2px;white-space:nowrap}
.fm-delta{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:700;color:var(--success)}
.fm-delta svg.lucide{width:14px;height:14px;stroke-width:3}
.fm-delta.down{color:var(--danger)}
.fm-stat-foot{grid-column:2/-1;font-size:13px;color:var(--ink-muted)}
.fm-spark{align-self:center;width:80px;height:34px;margin-top:22px}
.fm-spark path{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fm-spark .area{stroke:none;opacity:.18}
.fm-spark.blue .line{stroke:var(--chart-bar-top)}.fm-spark.blue .area{fill:var(--chart-bar-top)}
.fm-spark.teal .line{stroke:var(--chart-teal)}.fm-spark.teal .area{fill:var(--chart-teal)}
.fm-spark.red .line{stroke:var(--brand-red)}.fm-spark.red .area{fill:var(--brand-red)}

/* Revenue bars */
.fm-chart-total{display:flex;align-items:flex-start;gap:12px;margin:0 0 18px}
.fm-chart-total b{font-size:32px;line-height:38px;font-weight:700}
.fm-chart-total small{display:block;font-size:11px;color:var(--ink-muted);margin-top:2px}
.fm-bars{display:grid;grid-template-columns:44px 1fr;height:104px}
.fm-bars-y{display:flex;flex-direction:column;justify-content:space-between;font-size:12px;color:var(--ink-muted);margin:-6px 0}
.fm-bars-plot{position:relative;display:flex;align-items:flex-end;justify-content:space-around;border-left:1px solid var(--border-strong);border-bottom:1px solid var(--border-strong);background:repeating-linear-gradient(0deg,transparent 0 25px,var(--border-subtle) 25px 26px);padding:0 4%}
.fm-bar{width:48px;border-radius:3px 3px 0 0;background:linear-gradient(180deg,var(--chart-bar-top),var(--chart-bar-bottom))}
.fm-bar.current{background:linear-gradient(180deg,var(--brand-red),var(--brand-magenta) 60%,var(--brand-violet))}
.fm-plot-empty{align-self:center;max-width:280px;text-align:center;font-size:12px;color:var(--ink-muted)}
.fm-bars-x{display:flex;justify-content:space-around;margin-left:44px;padding:6px 4% 0;font-size:12px;color:var(--ink-muted);min-height:22px}
.fm-bars-x span{width:48px;text-align:center}
.fm-tooltip{position:absolute;padding:6px 12px;background:var(--surface-raised);border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-size:13px;font-weight:600;transform:translate(-50%,-100%);white-space:nowrap}
.fm-tooltip::after{content:"";position:absolute;left:50%;bottom:-6px;width:10px;height:10px;background:var(--surface-raised);border-right:1px solid var(--border-strong);border-bottom:1px solid var(--border-strong);transform:translateX(-50%) rotate(45deg)}

/* Donut */
.fm-donut-wrap{display:grid;grid-template-columns:172px minmax(0,1fr);gap:20px;align-items:center;margin-top:22px}
.fm-donut{position:relative;width:172px;height:172px;border-radius:var(--radius-full)}
.fm-donut.is-empty{background:var(--chart-track)}
.fm-donut::after{content:"";position:absolute;inset:34px;border-radius:var(--radius-full);background:var(--surface-card)}
.fm-donut-centre{position:absolute;inset:0;display:grid;place-content:center;text-align:center;z-index:1}
.fm-donut-centre b{font-size:22px;line-height:26px;font-weight:700}
.fm-donut-centre small{font-size:12px;color:var(--ink-muted)}
.fm-legend{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.fm-legend li{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:500;white-space:nowrap}
.fm-legend li i{width:12px;height:12px;border-radius:var(--radius-full);flex:none}
.fm-legend li span:last-child{margin-left:auto}
.dot-blue{background:var(--series-blue)}.dot-violet{background:var(--series-violet)}.dot-red{background:var(--series-red)}.dot-orange{background:var(--series-orange)}.dot-cyan{background:var(--series-cyan)}.dot-teal{background:var(--series-teal)}.dot-gray{background:var(--series-gray)}

/* Lists */
.fm-list{list-style:none;margin:0;padding:0}
.fm-row{display:flex;align-items:center;gap:12px;min-height:var(--row-height)}
.fm-row + .fm-row{margin-top:10px}
.fm-list.tight .fm-row{min-height:33px}
.fm-row-main{min-width:0;flex:1}
.fm-row-title{display:block;font-size:13px;line-height:17px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fm-row-sub{display:block;font-size:12px;line-height:16px;color:var(--ink-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fm-more{background:none;border:0;color:var(--ink-muted);padding:4px;display:grid;place-items:center}
.fm-more:disabled{opacity:1}
.fm-more svg.lucide{width:18px;height:18px}
.fm-date{width:42px;height:42px;border-radius:var(--radius-md);background:var(--surface-raised);border:1px solid var(--border-strong);display:grid;place-content:center;text-align:center;flex:none}
.fm-date small{font-size:10px;font-weight:600;letter-spacing:.04em;color:var(--ink-muted);line-height:12px}
.fm-date b{font-size:17px;line-height:18px;font-weight:700}
.fm-time{font-size:11px;color:var(--ink-muted);white-space:nowrap}
.fm-icon-btn{width:30px;height:30px;border-radius:var(--radius-full);display:grid;place-items:center;background:var(--tile-blue);border:0;color:var(--link);flex:none}
.fm-icon-btn svg.lucide{width:15px;height:15px}
.fm-icon-btn svg.lucide.solid{fill:currentColor}
.fm-empty{display:grid;place-items:center;text-align:center;gap:6px;padding:20px 12px;font-size:13px;color:var(--ink-muted);min-height:96px}

/* Badges */
.fm-badge{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 9px;border-radius:var(--radius-sm);font-size:11px;font-weight:600;white-space:nowrap}
.fm-badge.success{background:var(--success-bg);color:var(--success)}
.fm-badge.warning{background:var(--warning-bg);color:var(--warning)}
.fm-badge.danger{background:var(--danger-bg);color:var(--danger)}
.fm-badge.neutral{background:var(--surface-raised);color:var(--ink-muted)}

/* Tables */
.fm-table{width:100%;border-collapse:collapse;font-size:12px;text-align:left}
.fm-table th{background:var(--surface-raised);color:var(--ink-muted);font-weight:500;padding:6px 8px;white-space:nowrap}
.fm-table th:first-child{border-radius:var(--radius-sm) 0 0 var(--radius-sm)}
.fm-table th:last-child{border-radius:0 var(--radius-sm) var(--radius-sm) 0}
.fm-table td{padding:5px 8px;border-bottom:1px solid var(--border-subtle);white-space:nowrap}
.fm-table tr:last-child td{border-bottom:0}
.fm-table td.num,.fm-table th.num{text-align:right}
.fm-table td.num{font-variant-numeric:tabular-nums;font-weight:600}
.fm-table td.svc{color:var(--ink-muted)}
.fm-table .fm-client{display:flex;align-items:center;gap:8px;font-weight:500}
.fm-table .fm-badge{height:20px}
.fm-invoices{overflow-x:auto}
.fm-table td.fm-table-empty{white-space:normal;text-align:center;color:var(--ink-muted);padding:24px 8px}

/* Pipeline */
.fm-pipe-total{display:flex;align-items:baseline;gap:10px;margin-bottom:14px}
.fm-pipe-total b{font-size:28px;line-height:32px;font-weight:700}
.fm-pipe-total > span:not(.fm-delta){font-size:13px;color:var(--ink-muted)}
.fm-pipe{display:grid;grid-template-columns:104px 1fr 28px;align-items:center;gap:8px 12px;font-size:12px;font-weight:500}
.fm-pipe .track{height:9px;border-radius:var(--radius-sm);background:var(--chart-track);overflow:hidden}
.fm-pipe .fill{height:100%;border-radius:var(--radius-sm)}
.fm-pipe .fill.blue{background:var(--brand-blue)}.fm-pipe .fill.violet{background:var(--brand-violet)}.fm-pipe .fill.orange{background:var(--chart-orange)}.fm-pipe .fill.red{background:var(--brand-red)}.fm-pipe .fill.teal{background:var(--chart-teal)}
.fm-pipe .n{text-align:right;font-variant-numeric:tabular-nums}

/* Calls */
.fm-call{display:grid;grid-template-columns:24px minmax(0,1fr) auto auto 18px;align-items:center;gap:8px;font-size:12px;min-height:26px;white-space:nowrap}
.fm-call + .fm-call{margin-top:7px}
.fm-play{width:24px;height:24px;border-radius:var(--radius-full);background:var(--ink);color:var(--bg-page);display:grid;place-items:center;border:0;padding:0}
.fm-play:disabled{opacity:1}
.fm-play svg.lucide{width:11px;height:11px;margin-left:2px}
.fm-play svg.lucide.solid{fill:currentColor}
.fm-call b{font-weight:600;font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis}

/* Agent tiles */
.fm-agents{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-3)}
.fm-agent{display:grid;grid-template-columns:38px minmax(0,1fr) 8px;gap:10px;align-items:center;padding:8px 10px;background:var(--surface-raised);border:1px solid var(--border-strong);border-radius:var(--radius-lg)}
.fm-agent .fm-tile{width:38px;height:38px;border-radius:var(--radius-md)}
.fm-agent .fm-tile svg.lucide{width:22px;height:22px}
.fm-agent-label{font-size:11px;font-weight:600}
.fm-agent-count{font-size:14px;line-height:24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fm-agent-count b{font-size:20px;font-weight:700;margin-right:4px}
.fm-agent-foot{font-size:10.5px;color:var(--ink-muted);display:flex;align-items:center;gap:5px;white-space:nowrap;overflow:hidden}
.fm-agent-foot .fm-dot{width:6px;height:6px}
.fm-agent-foot span:last-child{overflow:hidden;text-overflow:ellipsis}
.fm-dot{width:8px;height:8px;border-radius:var(--radius-full);background:var(--ink-subtle);flex:none}
.fm-dot.ok{background:var(--success)}
.fm-dot.bad{background:var(--danger)}

/* Overview geometry (owner/admin) — matches the approved 1536×1024 reference */
#overview{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-3);align-content:start}
.fm-grid{display:grid;grid-template-columns:minmax(0,1fr) var(--rail-width);gap:var(--space-3)}
.fm-col{display:grid;gap:var(--space-3);align-content:start;min-width:0}
.fm-row2{display:grid;grid-template-columns:minmax(0,494fr) minmax(0,398fr);gap:var(--space-3)}
.fm-row3{display:grid;grid-template-columns:minmax(0,462fr) minmax(0,430fr);gap:var(--space-3)}
.fm-revenue,.fm-services{padding:16px 20px}
.fm-overview-flow{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr));gap:var(--space-3)}
@media (min-width:1280px){
 .fm-dash{grid-template-rows:132px 114px auto}
 .fm-dash .fm-col.left{grid-template-rows:261px 260px 118px}
 .fm-dash .fm-col.rail{grid-template-rows:261px 230px 148px}
 .fm-dash .fm-col > .fm-card,.fm-dash .fm-row2 > .fm-card,.fm-dash .fm-row3 > .fm-card{overflow:hidden}
 .fm-dash .fm-row3 > .fm-card,.fm-dash .fm-calls{padding:12px 16px}
 .fm-dash .fm-row3 .fm-card-head{margin-bottom:8px}
 .fm-dash .fm-agents-card{padding:10px 16px}
 .fm-dash .fm-agents-card .fm-card-head{margin-bottom:8px}
 .fm-dash .fm-calls .fm-card-head{margin-bottom:10px}
}

/* Coming soon */
.fm-soon{max-width:640px;margin:24px auto;padding:32px;display:grid;justify-items:start;gap:12px}
.fm-soon h1{font-size:26px;line-height:32px;font-weight:700}
.fm-soon p.fm-muted{font-size:15px;line-height:24px;max-width:56ch}
.fm-soon .fm-btn-secondary{margin-top:8px}

/* Records views (existing workspace sections) */
.fm-records-view{display:grid;gap:var(--space-3)}
.fm-view-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:6px 0 2px}
.fm-eyebrow{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-subtle)}
.fm-view-head h1{font-size:28px;line-height:34px;font-weight:700;letter-spacing:-.01em;margin-top:2px}
.fm-records{padding:12px 16px}
.table-wrap{overflow-x:auto}
.fm-records .fm-table{font-size:13px}
.fm-records .fm-table th{padding:8px 10px}
.fm-records .fm-table td{padding:10px;white-space:normal;max-width:30rem;overflow-wrap:anywhere;vertical-align:top}
.fm-records .fm-table td:last-child{white-space:nowrap;color:var(--ink-muted)}
.fm-records .fm-table td button{border:0;padding:0;background:none;color:var(--ink);font-weight:600;text-align:left;text-decoration:underline;text-decoration-color:var(--border-strong);text-underline-offset:4px}
.fm-records .fm-table td button:hover{color:var(--link);text-decoration-color:currentColor}
.fm-records .fm-table tr:hover td{background:var(--surface-hover)}
.pager{display:flex;gap:12px;align-items:center;justify-content:flex-end;font-size:12px;color:var(--ink-muted);padding-top:12px}
.detail dl{display:grid;grid-template-columns:minmax(120px,1fr) 3fr;gap:10px 16px;margin:0}
.detail dt{font-size:12px;font-weight:600;color:var(--ink-muted);text-transform:capitalize}
.detail dd{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6}
.detail #notes-form{margin-top:12px}
.detail #mark-read{margin-top:16px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}

/* Responsive */
@media (max-width:1279px){
 .fm-grid,.fm-row2,.fm-row3{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:1023px){
 .fm-shell{grid-template-columns:minmax(0,1fr)}
 .fm-sidebar{position:fixed;inset:0 auto 0 0;z-index:35;transform:translateX(-100%);transition:transform .2s ease;box-shadow:var(--shadow-card);visibility:hidden}
 .fm-shell.drawer-open .fm-sidebar{transform:none;visibility:visible}
 .fm-drawer-close{display:grid;place-items:center;width:36px;height:36px;border-radius:var(--radius-md);background:var(--surface-raised);border:1px solid var(--border-strong)}
 .fm-scrim{position:fixed;inset:0;z-index:34;background:rgba(2,4,16,.6)}
 .fm-menu-btn{display:grid}
 .fm-main{padding:8px 16px 16px}
 .fm-kpis,.fm-agents{grid-template-columns:repeat(2,minmax(0,1fr))}
 .fm-banner-mark,.fm-banner-art{display:none}
}
@media (max-width:599px){
 .fm-topbar{gap:8px}
 .fm-topbar-actions{gap:8px}
 .fm-search{padding:0 12px}
 .fm-search svg.lucide{display:none}
 .fm-btn-primary{padding:0 12px}
 .fm-topbar #avatar{display:none}
 .fm-kpis,.fm-agents{grid-template-columns:minmax(0,1fr)}
 .fm-banner{height:auto;min-height:112px;padding:18px}
 .fm-banner h1{font-size:24px;line-height:30px}
 .fm-banner p{font-size:15px;line-height:22px}
 .fm-donut-wrap{grid-template-columns:1fr;justify-items:center}
 .fm-legend{width:100%}
 .fm-call{grid-template-columns:24px minmax(0,1fr) auto 18px}
 .fm-call span:nth-of-type(2){display:none}
 .form-grid{grid-template-columns:1fr}
 .detail dl{grid-template-columns:1fr;gap:4px}
 .detail dd{margin-bottom:8px}
 .fm-records .fm-table{min-width:560px}
 .pager{justify-content:space-between}
 .fm-auth-card{padding:24px 20px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}

/* Record actions: lead conversion and manual payments */
.fm-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-subtle)}
.fm-actions p{font-size:13px;color:var(--ink-muted);flex-basis:100%}
.fm-linked{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--success)}
select{display:block;width:100%;padding:10px 12px;border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--surface-raised);color:var(--ink)}
.form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.fm-form-note{font-size:12px;color:var(--ink-subtle);margin-top:10px}
@media (max-width:599px){.form-grid.three{grid-template-columns:1fr}}
#appointment-form,.fm-resolve{margin-top:24px;padding-top:20px;border-top:1px solid var(--border-subtle)}
#appointment-form h3{margin:0 0 8px}
#appointment-form p,.fm-resolve p{margin:8px 0 16px}
#appointment-result:empty{display:none}
.fm-resolve button{margin-right:8px}

/* Proposal Builder (2026-10-14) */
.fm-proposal-view .fm-view-head{align-items:flex-start}
.fm-proposal-state{margin:6px 0 0;font-size:13px;color:var(--ink-muted)}
.fm-proposal-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:var(--space-4);align-items:start}
.fm-proposal-view select{display:block;width:100%;padding:10px 12px;border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--surface-raised);color:var(--ink)}
.fm-proposal-subhead{font-size:14px;font-weight:600;margin:22px 0 10px}
.fm-proposal-items{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.fm-proposal-item{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:12px 14px;border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--surface-raised)}
.fm-proposal-item div{display:grid;gap:2px;min-width:0}
.fm-proposal-item .fm-muted{font-size:12px;overflow-wrap:anywhere}
.fm-proposal-price{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.fm-proposal-add{margin:14px 0 0;padding:4px 16px 16px;border:1px dashed var(--border-strong);border-radius:var(--radius-md)}
.fm-proposal-add legend{padding:0 6px;font-size:13px;font-weight:600;color:var(--ink-muted)}
.fm-proposal-add #add-item{margin-top:14px}
.fm-check-inline{display:flex;align-items:center;gap:8px;font-weight:500;color:var(--ink)}
.fm-check-inline input{width:18px;height:18px;margin:0;accent-color:var(--brand-violet)}
.fm-proposal-summary{position:sticky;top:16px}
.fm-proposal-totals{display:grid;grid-template-columns:1fr auto;gap:8px 12px;margin:0}
.fm-proposal-totals dt{color:var(--ink-muted)}
.fm-proposal-totals dd{margin:0;font-size:20px;font-weight:600;font-variant-numeric:tabular-nums;text-align:right}
.fm-proposal-eligibility{margin:14px 0 0;padding:10px 12px;border-radius:var(--radius-md);font-size:13px;font-weight:600;background:var(--success-bg);color:var(--success)}
.fm-proposal-eligibility[data-review="true"]{background:var(--warning-bg);color:var(--warning)}
.fm-proposal-response{margin:12px 0 0;padding:10px 12px;border-radius:var(--radius-md);background:var(--surface-raised);font-size:13px;line-height:1.5}
.fm-proposal-history{margin:0;padding-left:18px;display:grid;gap:6px;font-size:13px;color:var(--ink-muted)}
#proposal-link-panel{margin-top:14px}
#proposal-link-panel .fm-actions{border-top:0;padding-top:0;margin-top:10px}
#proposal-revise{margin-top:14px}
@media (max-width:1279px){.fm-proposal-layout{grid-template-columns:minmax(0,1fr)}.fm-proposal-summary{position:static}}
@media (max-width:599px){.fm-proposal-item{grid-template-columns:minmax(0,1fr) auto}.fm-proposal-item button{grid-column:1/-1;justify-self:start}}
/* Invoice builder (invoice payments, 2026-10-14): reuses the proposal view layout. */
.fm-view-actions{margin:0;padding:0;border:0}
#invoice-link-panel .fm-actions{border-top:0;padding-top:0;margin-top:10px}
#invoice-link-panel{margin-top:16px}
#invoice-void{margin-top:16px}
#invoice-void-confirm{display:grid;gap:8px;justify-items:start;margin-top:16px}