/* MrKeyword product UI — reference design foundation. Loaded after app.css (legacy views, auth, dialogs). */
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url("/fonts/inter-latin-var.woff2") format("woff2")}
@font-face{font-family:"Caveat";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/caveat-500-latin.woff2") format("woff2")}

:root{
  --rf-font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --rf-bg:#fcfcfe;--rf-surface:#fff;--rf-ink:#0b0d17;--rf-text:#262c3d;--rf-muted:#646b80;--rf-faint:#959bae;
  --rf-line:#eaecf2;--rf-line-2:#f0f1f6;--rf-soft:#f5f6fa;
  --rf-indigo:#4338ca;--rf-indigo-2:#5b4ff0;--rf-violet:#8b80f9;--rf-lavender:#c3bdfa;--rf-tint:#eeeefe;
  --rf-green:#16a34a;--rf-green-soft:#e7f6ec;--rf-green-ink:#15803d;
  --rf-red:#ef4444;--rf-red-soft:#fdeced;--rf-red-ink:#dc2626;
  --rf-amber:#f5a524;--rf-amber-soft:#fff3dd;--rf-amber-ink:#b45309;
  --rf-blue:#7aa7f8;--rf-blue-soft:#eaf1ff;--rf-blue-ink:#2f6be0;
  --rf-shadow:0 1px 2px rgba(20,24,40,.035),0 1px 12px rgba(20,24,40,.02);
  /* Display face for titles only (its @font-face is in landing.css); Inter stays the UI and data font. */
  --rf-display:"Plus Jakarta Sans","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
body{font-family:var(--rf-font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.ic{width:18px;height:18px;flex:none}
.icon-svg{width:16px;height:16px;flex:none;vertical-align:-3px}

/* Shell */
.rf-shell{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:100vh;background:linear-gradient(90deg,#fff 0 219px,var(--rf-line-2) 219px 220px,var(--rf-bg) 220px);color:var(--rf-ink);font-family:var(--rf-font)}
.rf-side{position:sticky;top:0;display:flex;flex-direction:column;height:100vh;padding:22px 14px 22px 16px;border-right:1px solid var(--rf-line-2);background:#fff}
.rf-brand{display:inline-flex;align-items:center;min-height:52px;padding:0 8px;color:var(--rf-ink);text-decoration:none}
.rf-brand img{display:block;width:auto;height:clamp(46px,3.3vw,60px);max-width:190px;object-fit:contain}
.rf-nav{display:grid;gap:2px;margin-top:44px}
.rf-nav-item{display:flex;align-items:center;gap:13px;width:100%;height:42px;padding:0 12px;border:0;border-radius:10px;background:transparent;color:#232838;font:inherit;font-size:14.5px;font-weight:450;text-align:left;white-space:nowrap;cursor:pointer}
.rf-nav-item .ic{width:20px;height:20px;color:#1d2231;stroke-width:1.7}
.rf-nav-item:hover{background:#f7f7fd}
.rf-nav-item.is-active{background:var(--rf-tint);color:#3b35c9;font-weight:500}
.rf-nav-item.is-active .ic{color:#3b35c9}
.rf-promo{position:relative;margin-top:auto;min-height:224px;padding:22px 18px 20px;overflow:hidden;border-radius:14px;background:#f2f1ff url("/images/sidebar-growth-preview.webp") 70% 0/150% auto no-repeat}
.rf-promo::before{position:absolute;inset:0;background:linear-gradient(160deg,rgba(255,255,255,.72) 10%,rgba(246,245,255,.35) 60%,rgba(236,233,255,.55));content:""}
.rf-promo>*{position:relative}
.rf-promo .ic{width:22px;height:22px;color:#4f46e5}
.rf-promo p{margin:14px 0 18px;color:#141726;font-size:21px;font-weight:500;line-height:1.08}
.rf-promo .rf-btn{height:40px;padding:0 15px;border-color:#fff;box-shadow:0 2px 6px rgba(30,32,70,.08)}
.rf-main{display:flex;min-width:0;flex-direction:column}
.rf-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:18px;height:68px;padding:0 34px 0 30px;border-bottom:1px solid var(--rf-line-2);background:rgba(255,255,255,.94);backdrop-filter:blur(10px)}
.rf-search{display:flex;align-items:center;gap:12px;width:min(625px,100%);height:40px;padding:0 16px;border-radius:10px;background:#f4f5f9;color:#1b2030}
.rf-search .ic{width:19px;height:19px}
.rf-search input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:var(--rf-ink);font:inherit;font-size:13.5px}
.rf-search input::placeholder{color:#6d7489}
.rf-header-actions{position:relative;display:flex;align-items:center;gap:14px;margin-left:auto}
.rf-bell{position:relative;display:grid;place-items:center;width:38px;height:38px;border:0;border-radius:10px;background:transparent;color:#1b2030;cursor:pointer}
.rf-bell .ic{width:22px;height:22px;stroke-width:1.7}
.rf-bell::after{position:absolute;top:6px;right:8px;width:7px;height:7px;border-radius:50%;background:#8b7cf6;box-shadow:0 0 0 2px #fff;content:""}
.rf-vr{width:1px;height:36px;background:var(--rf-line)}
.rf-account{display:flex;align-items:center;gap:12px;padding:0;border:0;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer}
.rf-account .rf-avatar{width:44px;height:44px;font-size:14px}
.rf-account strong{display:block;color:#0f1220;font-size:14px;font-weight:600}
.rf-account small{display:block;margin-top:2px;color:#6b7288;font-size:12.5px}
.rf-account .ic{width:18px;height:18px;margin-left:26px;color:#30364a}
.rf-menu{position:absolute;top:52px;right:0;min-width:180px;padding:6px;border:1px solid var(--rf-line);border-radius:10px;background:#fff;box-shadow:0 12px 30px rgba(20,24,40,.12)}
.rf-menu button{display:flex;align-items:center;gap:10px;width:100%;height:36px;padding:0 10px;border:0;border-radius:7px;background:none;color:var(--rf-text);font:inherit;font-size:13px;text-align:left;cursor:pointer}
.rf-menu button:hover{background:var(--rf-soft)}
#app-content.rf-content{width:100%;max-width:none;padding:22px 34px 34px 30px}

/* Page header */
.rf-page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:20px}
.rf-page-title h1{margin:0;color:#090b14;font-family:var(--rf-display);font-size:38px;font-weight:700;line-height:1.12;letter-spacing:-.03em}
.rf-page-title p{margin:4px 0 0;color:#5a6177;font-size:16px;line-height:1.4}
.rf-page-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}

/* Cards */
.rf-card{min-width:0;border:1px solid var(--rf-line);border-radius:12px;background:#fff;box-shadow:var(--rf-shadow)}
.rf-card-head{display:flex;align-items:flex-start;gap:12px;padding:16px 18px 10px}
.rf-card-heading{min-width:0;flex:1}
.rf-card-head h2{display:flex;align-items:center;gap:8px;margin:0;color:#0b0d17;font-family:var(--rf-display);font-size:18px;font-weight:650;line-height:1.3;letter-spacing:-.015em}
.rf-card-head h2 .ic-info{width:16px;height:16px;color:#8d93a6;stroke-width:1.7}
.rf-card-head p{margin:2px 0 0;color:#6b7288;font-size:13px;line-height:1.35}
.rf-card-actions{display:flex;align-items:center;gap:8px;margin-left:auto}
.rf-card-icon{display:grid;place-items:center;width:40px;height:40px;flex:none;border-radius:10px;background:#f3f4f8;color:#1d2231}
.rf-card-icon .ic{width:20px;height:20px}
.rf-card-body{padding:0 18px 16px}
.rf-grid{display:grid;gap:14px;margin-bottom:14px}

/* Metric cards */
.rf-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}
.rf-metrics.cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.rf-metric{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:16px;row-gap:12px;align-content:start;min-height:114px;padding:16px 16px 14px;overflow:hidden}
.rf-metric-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:10px;background:var(--rf-tint);color:#3b35c9}
.rf-metric-icon .ic{width:23px;height:23px;stroke-width:2}
.rf-metric-icon.red{background:#fdeced;color:#e5484d}
.rf-metric-icon.amber{background:#fff3dd;color:#e08a00}
.rf-metric-icon.blue{background:#eaf1ff;color:#3b6fe0}
.rf-metric-icon.green{background:var(--rf-green-soft);color:var(--rf-green)}
.rf-metric-main{display:grid;gap:5px;min-width:0}
.rf-metric-label{display:flex;align-items:center;gap:6px;color:#5d6479;font-size:13px;line-height:1.25}
.rf-metric-label .ic{width:15px;height:15px;color:#8d93a6}
.rf-metric-value{color:#0b0d17;font-size:29px;font-weight:700;line-height:1.05;font-variant-numeric:tabular-nums;white-space:nowrap}
.rf-metric-foot{display:flex;grid-column:1/-1;align-items:center;gap:14px;min-height:26px;padding-right:112px}
.rf-metric-foot small{color:#8a90a3;font-size:12px;white-space:nowrap}
.rf-change{display:inline-flex;align-items:center;gap:3px;height:26px;padding:0 8px;border-radius:8px;background:var(--rf-green-soft);color:var(--rf-green-ink);font-size:12.5px;font-weight:600;white-space:nowrap}
.rf-change .ic{width:13px;height:13px;stroke-width:2.4}
.rf-change.red{background:var(--rf-red-soft);color:var(--rf-red-ink)}
.rf-change.gray{background:var(--rf-soft);color:var(--rf-muted)}
.rf-spark{position:absolute;right:14px;bottom:14px;width:112px;height:40px}

/* Buttons & controls */
.rf-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 16px;border:1px solid var(--rf-line);border-radius:10px;background:#fff;color:#161a29;font:inherit;font-size:13.5px;font-weight:550;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background .15s,border-color .15s}
.rf-btn:hover{border-color:#d9dce6;background:#fafbfd}
.rf-btn .ic{width:16px;height:16px;stroke-width:2}
.rf-btn.dark{border-color:#0b0d17;background:#0b0d17;color:#fff}
.rf-btn.dark:hover{border-color:#262a3b;background:#262a3b}
.rf-btn.white{border-color:#fff;background:#fff}
.rf-btn.sm{height:34px;padding:0 12px;border-radius:8px;font-size:12.5px}
.rf-btn.sm .ic{width:14px;height:14px}
.rf-btn.lg{height:48px;padding:0 20px;font-size:14.5px}
.rf-btn.link{height:auto;padding:0;border:0;background:none;color:#3b35c9;font-weight:500}
.rf-more{display:inline-grid;place-items:center;width:30px;height:30px;border:0;border-radius:8px;background:transparent;color:#3a3f52;cursor:pointer}
.rf-more:hover{background:var(--rf-soft)}
.rf-more .ic{width:18px;height:18px;stroke-width:2.6}
.rf-select{display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 14px;border:1px solid var(--rf-line);border-radius:10px;background:#fff;color:#1b2030;font:inherit;font-size:13.5px;text-align:left;white-space:nowrap;cursor:pointer}
.rf-select .ic{width:18px;height:18px;color:#1d2231}
.rf-select .ic-chevron{width:16px;height:16px;margin-left:auto;color:#3a3f52}
.rf-select-value{display:grid;gap:1px;min-width:0}
.rf-select-value small{color:#6b7288;font-size:12px}
.rf-select.sm{height:34px;padding:0 10px;border-radius:8px;font-size:12.5px;gap:8px}
.rf-select.sm .ic-chevron{width:14px;height:14px}
.rf-input{display:flex;align-items:center;gap:12px;height:48px;padding:0 16px;border:1px solid var(--rf-line);border-radius:10px;background:#fff;color:#1b2030}
.rf-input .ic{width:20px;height:20px}
.rf-input input{min-width:0;flex:1;height:100%;border:0;outline:0;background:transparent;color:var(--rf-ink);font:inherit;font-size:15px}
.rf-input input::placeholder{color:#8a90a3}
.rf-input:focus-within{border-color:#c9c5f7;box-shadow:0 0 0 3px #efeefe}
.rf-clear{display:grid;place-items:center;width:28px;height:28px;border:0;border-radius:7px;background:none;color:#4b5064;cursor:pointer}
.rf-clear .ic{width:16px;height:16px}
.rf-tabs{display:flex;gap:6px;border-bottom:1px solid var(--rf-line)}
.rf-tab{margin-bottom:-1px;padding:10px 14px 11px;border:0;border-bottom:2px solid transparent;background:none;color:#50576c;font:inherit;font-size:13.5px;font-weight:500;cursor:pointer}
.rf-tab:hover{color:#1b2030}
.rf-tab.is-current{border-color:#4338ca;color:#3b35c9;font-weight:600}
.rf-check{width:16px;height:16px;margin:0;border:1.5px solid #cfd3de;border-radius:4px;background:#fff;vertical-align:middle;appearance:none;cursor:pointer}
.rf-check:checked{border-color:#4f46e5;background:#4f46e5;box-shadow:inset 0 0 0 3px #fff}
.rf-toggle{position:relative;width:34px;height:20px;flex:none;padding:0;border:0;border-radius:999px;background:#d9dce5;cursor:pointer;transition:background .15s}
.rf-toggle::after{position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.18);content:"";transition:transform .15s}
.rf-toggle.on{background:#16a34a}
.rf-toggle.on::after{transform:translateX(14px)}

/* Pills, deltas, dots, meters */
.rf-pill{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:999px;background:var(--rf-soft);color:#50576c;font-size:12px;font-weight:550;line-height:1;white-space:nowrap}
.rf-pill.green{background:var(--rf-green-soft);color:var(--rf-green-ink)}
.rf-pill.amber{background:var(--rf-amber-soft);color:var(--rf-amber-ink)}
.rf-pill.red{background:var(--rf-red-soft);color:var(--rf-red-ink)}
.rf-pill.indigo{background:var(--rf-tint);color:#4338ca}
.rf-pill.blue{background:var(--rf-blue-soft);color:var(--rf-blue-ink)}
.rf-pill-dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.rf-delta{display:inline-flex;align-items:center;gap:3px;font-size:13px;font-weight:550;font-variant-numeric:tabular-nums;white-space:nowrap}
.rf-delta .ic{width:13px;height:13px;stroke-width:2.4}
.rf-delta.up{color:var(--rf-green)}
.rf-delta.down{color:var(--rf-red)}
.rf-delta.flat{color:var(--rf-faint)}
.rf-dot{display:inline-block;width:8px;height:8px;flex:none;border-radius:50%;background:var(--rf-faint)}
.rf-legend{display:flex;align-items:center;gap:18px;color:#50576c;font-size:12.5px;white-space:nowrap}
.rf-legend span{display:inline-flex;align-items:center;gap:7px}
.rf-meter{display:block;width:100%;height:8px;overflow:hidden;border-radius:999px;background:#eef0f5}
.rf-meter>i{display:block;width:0;height:100%;border-radius:inherit}
.bg-green{background:#16a34a}.bg-mint{background:#6fcf97}.bg-pale{background:#c9ecd5}.bg-indigo{background:#5b4ff0}.bg-violet{background:#8b80f9}.bg-lavender{background:#b3acf7}.bg-gray{background:#a4a9b9}.bg-light{background:#e3e6ee}.bg-red{background:#ef4444}.bg-amber{background:#f5a524}.bg-blue{background:#7aa7f8}.bg-sky{background:#9cc3ff}.bg-teal{background:#7dd3c0}

/* Tables */
.rf-table-wrap{overflow-x:auto}
.rf-table{width:100%;border-collapse:collapse;color:#262c3d;font-size:13px}
.rf-table th{padding:9px 12px;border-bottom:1px solid var(--rf-line-2);color:#646b80;font-size:12.5px;font-weight:500;text-align:left;white-space:nowrap}
.rf-table td{padding:9px 12px;border-bottom:1px solid var(--rf-line-2);vertical-align:middle;font-variant-numeric:tabular-nums}
.rf-table tbody tr:last-child td{border-bottom:0}
.rf-table tbody tr:hover td{background:#fbfbfe}
.rf-table.banded thead th{background:#f7f8fb}
.rf-table.banded thead th:first-child{border-radius:8px 0 0 8px}
.rf-table.banded thead th:last-child{border-radius:0 8px 8px 0}
.rf-table .num{text-align:right}
.rf-table .center{text-align:center}
.rf-table .rf-check-cell{width:36px;padding-right:0}
.rf-link{color:#3b35c9;text-decoration:none}
.rf-link:hover{text-decoration:underline}

/* Charts */
.rf-chart{display:block;width:100%;height:auto;overflow:visible}
.rf-grid line{stroke:#eef0f5;stroke-width:1}
.rf-axis{fill:#6e7489;font-family:var(--rf-font);font-size:11.5px}
.rf-bar-value{fill:#1d2231;font-family:var(--rf-font);font-size:12px;font-weight:600}
.rf-donut{display:block}
.rf-donut-value{fill:#0b0d17;font-family:var(--rf-font);font-size:24px;font-weight:700}
.rf-donut-label{fill:#5d6479;font-family:var(--rf-font);font-size:12px}

/* People & brands */
.rf-avatar{display:inline-grid;place-items:center;width:36px;height:36px;flex:none;border-radius:50%;color:#fff;font-size:13px;font-weight:600;letter-spacing:.01em}
.rf-avatar.av-0{background:linear-gradient(145deg,#d9a38b,#a86e5a)}
.rf-avatar.av-1{background:linear-gradient(145deg,#7f93b8,#4d5f82)}
.rf-avatar.av-2{background:linear-gradient(145deg,#c98f7a,#7d4c3f)}
.rf-avatar.av-3{background:linear-gradient(145deg,#8fa7a0,#52706a)}
.rf-avatar.av-4{background:linear-gradient(145deg,#a99be8,#6c5bc9)}
.rf-avatar.av-5{background:linear-gradient(145deg,#e1b77c,#b07c3c)}
.rf-brand-mark{display:inline-grid;place-items:center;width:28px;height:28px;flex:none}
.rf-brand-mark svg{display:block;width:100%;height:100%}

/* Handwriting & banners */
.rf-hand{margin:0;color:#1b1f2e;font-family:"Caveat","Bradley Hand","Segoe Print",cursive;font-size:23px;font-weight:500;line-height:1.02;transform:rotate(-7deg)}
.rf-hand-arrow{width:64px;height:40px;color:#1b1f2e}
.rf-banner{position:relative;display:flex;align-items:center;gap:24px;min-height:88px;margin-top:14px;padding:18px 22px 18px 26px;overflow:hidden;border:1px solid #ebeafc;border-radius:14px;background:radial-gradient(120% 180% at 100% 50%,#ece9ff 0,rgba(236,233,255,0) 55%),radial-gradient(90% 160% at 0% 100%,#efeefe 0,rgba(239,238,254,0) 60%),#f8f8ff}
.rf-banner::after{position:absolute;right:-60px;bottom:-90px;width:520px;height:180px;border-radius:50%;border-top:1px solid rgba(139,128,249,.25);transform:rotate(-8deg);content:"";pointer-events:none}
.rf-banner>*{position:relative;z-index:1}
.rf-banner-copy{flex:1}
.rf-banner-copy strong{display:block;color:#0d1020;font-size:23px;font-weight:700}
.rf-banner-copy p{margin:4px 0 0;color:#5a6177;font-size:14px}
.rf-banner .rf-btn.dark{height:44px;padding:0 20px;font-size:14px}

/* Legacy views rendered inside the new shell */
.rf-content .page-heading h2{font-family:var(--rf-display);font-size:34px;font-weight:700;letter-spacing:-.03em}

@media(max-width:1180px){
  .rf-metrics,.rf-metrics.cols-5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rf-account .rf-account-copy,.rf-account .ic{display:none}
}
/* Live data (real accounts): real controls, empty/loading/error states, lists */
.rf-native{position:relative;cursor:pointer}
.rf-native select{min-width:0;flex:1;height:100%;margin:0;padding:0 30px 0 0;border:0;outline:0;background:transparent;color:inherit;font:inherit;text-overflow:ellipsis;appearance:none;-webkit-appearance:none;cursor:pointer}
.rf-native .ic-chevron{margin-left:-34px;pointer-events:none}
.rf-native:focus-within{border-color:#c9c5f7;box-shadow:0 0 0 3px #efeefe}
.rf-site-picker{min-width:0;max-width:min(360px,100%);font-weight:550}
.rf-input.sm{height:36px;gap:8px;padding:0 12px;border-radius:8px}
.rf-input.sm .ic{width:16px;height:16px}
.rf-input.sm input{font-size:13px}
.rf-btn:disabled{opacity:.55;cursor:default}
.rf-btn.danger{color:var(--rf-red-ink)}
.rf-empty{display:grid;justify-items:center;gap:8px;padding:34px 20px;color:var(--rf-muted);text-align:center}
.rf-empty.compact{padding:22px 16px}
.rf-empty-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--rf-tint);color:#3b35c9}
.rf-empty-icon .ic{width:22px;height:22px}
.rf-empty strong{color:var(--rf-ink);font-size:16px;font-weight:650}
.rf-empty p{max-width:540px;margin:0;font-size:13.5px;line-height:1.5}
.rf-empty-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:8px}
.rf-empty.rf-error .rf-empty-icon{background:var(--rf-red-soft);color:var(--rf-red-ink)}
.rf-loading{display:flex;align-items:center;justify-content:center;gap:10px;min-height:260px;color:var(--rf-muted);font-size:14px}
.rf-spin{animation:rf-spin 1s linear infinite}
@keyframes rf-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.rf-spin{animation:none}}
.rf-source{display:flex;align-items:center;gap:7px;margin:0;padding:0 18px 14px;color:var(--rf-faint);font-size:12px;line-height:1.4}
.rf-source .ic{width:14px;height:14px}
.rf-notice{display:flex;align-items:flex-start;gap:12px;margin-bottom:14px;padding:14px 16px;border:1px solid #e6e3fd;border-radius:12px;background:#f8f8ff;font-size:13.5px;line-height:1.45}
.rf-notice>.ic{margin-top:1px;color:#4f46e5}
.rf-notice strong{display:block;color:var(--rf-ink);font-weight:600}
.rf-notice p{margin:2px 0 0;color:var(--rf-muted)}
.rf-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px}
.rf-cols.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.rf-cols.wide-left{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr)}
.rf-cols>.rf-card{align-self:start}
.rf-cols.stretch>.rf-card{align-self:stretch}
.rf-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.rf-toolbar .rf-input{width:240px;max-width:100%}
.rf-form{display:grid;gap:12px;padding:0 18px 16px}
.rf-form-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px}
.rf-field{display:grid;flex:1 1 180px;gap:6px;min-width:0}
.rf-field>span{color:var(--rf-muted);font-size:12.5px;font-weight:500}
.rf-field input,.rf-field select{width:100%;height:40px;padding:0 12px;border:1px solid var(--rf-line);border-radius:9px;background:#fff;color:var(--rf-ink);font:inherit;font-size:13.5px;outline:0}
.rf-field input:focus,.rf-field select:focus{border-color:#c9c5f7;box-shadow:0 0 0 3px #efeefe}
.rf-field input[readonly]{background:var(--rf-soft);color:var(--rf-muted)}
.rf-hint{margin:0;color:var(--rf-muted);font-size:12.5px;line-height:1.45}
.rf-error-text{margin:0;padding:10px 12px;border-radius:8px;background:var(--rf-red-soft);color:var(--rf-red-ink);font-size:13px;line-height:1.45}
.rf-list{display:grid;margin:0;padding:0 0 6px;list-style:none}
.rf-list>li{display:flex;align-items:flex-start;gap:12px;padding:11px 18px;border-top:1px solid var(--rf-line-2)}
.rf-list>li:first-child{border-top:0}
.rf-list-main{display:grid;flex:1;gap:3px;min-width:0}
.rf-list-main strong{color:var(--rf-ink);font-size:13.5px;font-weight:600;overflow-wrap:anywhere}
.rf-list-main small{color:var(--rf-muted);font-size:12.5px;line-height:1.4;overflow-wrap:anywhere}
.rf-list-side{display:flex;flex:none;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px;margin-left:auto}
.rf-list-side .rf-select{height:32px}
.rf-kv{display:grid;grid-template-columns:minmax(120px,max-content) minmax(0,1fr);margin:0;padding:0 18px 14px}
.rf-kv dt,.rf-kv dd{margin:0;padding:7px 0;border-bottom:1px solid var(--rf-line-2);font-size:13px;line-height:1.4}
.rf-kv dt{padding-right:18px;color:var(--rf-muted)}
.rf-kv dd{color:var(--rf-ink);overflow-wrap:anywhere}
.rf-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px 16px;color:var(--rf-muted);font-size:12.5px}
.rf-pager nav{display:flex;flex-wrap:wrap;align-items:center;gap:4px}
.rf-pager button{display:grid;place-items:center;min-width:32px;height:32px;padding:0 8px;border:1px solid var(--rf-line);border-radius:8px;background:#fff;color:var(--rf-text);font:inherit;font-size:12.5px;cursor:pointer}
.rf-pager button .ic{width:14px;height:14px}
.rf-pager button.is-current{border-color:#c9c5f7;background:var(--rf-tint);color:#3b35c9;font-weight:600}
.rf-pager button:disabled{opacity:.4;cursor:default}
.rf-pager nav>span{padding:0 4px}
.rf-url{display:inline-block;max-width:300px;overflow:hidden;color:var(--rf-muted);text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
.rf-table .strong{color:var(--rf-ink);font-weight:550}
.rf-chart-wrap{padding:4px 18px 12px 8px}
.rf-brief{max-height:440px;margin:0 18px 16px;padding:14px;overflow:auto;border:1px solid var(--rf-line);border-radius:10px;background:var(--rf-soft);color:var(--rf-text);font:12.5px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;overflow-wrap:anywhere}
.rf-copy-row{display:flex;gap:8px}
.rf-copy-row input{flex:1;min-width:0;height:36px;padding:0 10px;border:1px solid var(--rf-line);border-radius:8px;background:var(--rf-soft);color:var(--rf-text);font:12.5px ui-monospace,SFMono-Regular,Menlo,monospace}
.rf-onboard{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:4px 18px 18px}
.rf-step{display:grid;align-content:start;gap:10px;padding:18px;border:1px solid var(--rf-line);border-radius:12px;background:#fff}
.rf-step.is-done{border-color:#cdebd7;background:#f6fcf8}
.rf-step-num{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--rf-tint);color:#3b35c9;font-size:13px;font-weight:700}
.rf-step.is-done .rf-step-num{background:var(--rf-green);color:#fff}
.rf-step-num .ic{width:16px;height:16px;stroke-width:2.6}
.rf-step h3{margin:0;color:var(--rf-ink);font-size:16px;font-weight:650}
.rf-step p{margin:0;color:var(--rf-muted);font-size:13.5px;line-height:1.5}
.rf-step .rf-btn{justify-self:start}
.rf-menu{max-width:calc(100vw - 32px)}
.rf-menu-label{margin:4px 10px;color:var(--rf-faint);font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.rf-menu button small{margin-left:auto;padding-left:10px;color:var(--rf-faint);font-size:11.5px}
.rf-menu button.is-active{color:#3b35c9;font-weight:600}
.rf-menu hr{margin:6px 4px;border:0;border-top:1px solid var(--rf-line-2)}
.rf-menu-note{margin:4px 10px 6px;color:var(--rf-muted);font-size:12px}
.auth-invite-note{padding:10px 12px;border-radius:8px;background:#eeeefe;color:#3b35c9!important}
.rf-pad{margin:0;padding:8px 18px 14px}
.rf-source-page{padding:4px 2px 0}
.rf-card-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:0 18px 12px}
.rf-card-tools .rf-input{width:260px;max-width:100%}
.rf-form-card{display:grid;gap:10px;margin-bottom:14px;padding:16px 18px}
.rf-field-role{flex:0 1 150px}
.rf-row-actions{display:inline-flex;gap:6px}
.rf-live-table td.strong{min-width:160px;color:var(--rf-ink);font-weight:550}
.rf-list>li.is-current{background:#fafaff}
.rf-list-main small .ic{width:12px;height:12px;vertical-align:-2px}
.rf-counts,.rf-counts-inline{display:flex;flex-wrap:wrap;gap:6px}
.rf-counts{padding:0 18px 10px}
.rf-counts-inline{margin-top:3px}
.rf-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--rf-line-2)}
.rf-split>div+div{border-left:1px solid var(--rf-line-2)}
.rf-subhead{margin:0;padding:12px 18px 4px;color:var(--rf-muted);font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.rf-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0 18px 18px}
.rf-board-col{display:grid;align-content:start;gap:8px;min-width:0;padding:12px;border-radius:10px;background:var(--rf-soft)}
.rf-board-col h3{display:flex;align-items:center;justify-content:space-between;margin:0 0 2px;color:var(--rf-ink);font-size:13px;font-weight:650}
.rf-board-col h3 span{color:var(--rf-muted);font-weight:500}
.rf-task{display:grid;gap:5px;padding:10px 12px;border:1px solid var(--rf-line);border-radius:9px;background:#fff}
.rf-task strong{color:var(--rf-ink);font-size:13px;font-weight:600;overflow-wrap:anywhere}
.rf-task small{color:var(--rf-muted);font-size:12px;overflow-wrap:anywhere}
.rf-task .rf-btn{justify-self:start;margin-top:2px}
.rf-plans{display:grid;gap:8px;padding:0 18px 16px}
.rf-plan-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;min-height:52px;padding:8px 12px;border:1px solid var(--rf-line);border-radius:10px}
.rf-plan-row.is-current{border-color:#c9c5f7;background:#fafaff}
.rf-plan-row strong{color:var(--rf-ink);font-size:14px;font-weight:650}
.rf-plan-row b{margin-left:auto;color:var(--rf-ink);font-size:15px;font-weight:650}
.rf-plan-row b small{color:var(--rf-muted);font-size:12px;font-weight:500}
.rf-list>li>.rf-avatar,.rf-list>li>.rf-brand-mark{margin-top:2px}

/* Auth screens (sign in / create workspace). Overrides the legacy auth styles in app.css. */
.auth-shell{padding:40px 16px;background:radial-gradient(90% 55% at 50% 0%,#f0efff 0,rgba(240,239,255,0) 70%),var(--rf-bg);color:var(--rf-ink);font-family:var(--rf-font)}
.auth-panel{display:grid;justify-items:center;gap:18px;width:min(100%,440px)}
.auth-wordmark{color:var(--rf-ink);font-family:var(--rf-display);font-size:30px;font-weight:800;line-height:1;letter-spacing:-.04em;text-decoration:none}
.auth-card{width:100%;padding:32px;border:1px solid var(--rf-line);border-radius:16px;background:#fff;box-shadow:0 1px 2px rgba(20,24,40,.04),0 18px 48px rgba(36,40,90,.08)}
.auth-card h1,.auth-card .auth-title{margin:0;color:var(--rf-ink);font-family:var(--rf-display);font-size:28px;font-weight:700;line-height:1.15;letter-spacing:-.03em}
.auth-card>p.auth-kicker{margin:0 0 10px;color:#3b35c9;font-size:13px;font-weight:600;line-height:1.3}
.auth-card>p.auth-lead{margin:8px 0 0;color:var(--rf-muted);font-size:14px;line-height:1.5}
.auth-card>p.auth-invite-note,.auth-card>p.auth-plan-note,.auth-card>p.auth-error{margin:16px 0 0;padding:10px 12px;border-radius:9px;font-size:13px;line-height:1.45}
.auth-card>p.auth-invite-note{background:var(--rf-tint)}
.auth-card>p.auth-plan-note{background:var(--rf-tint);color:var(--rf-ink);font-weight:600}
.auth-card>p.auth-error{background:var(--rf-red-soft);color:var(--rf-red-ink)}
.auth-social{display:grid;gap:10px;margin-top:22px}
.auth-social-button{display:flex;align-items:center;justify-content:center;gap:10px;height:46px;padding:0 16px;border:1px solid var(--rf-line);border-radius:10px;background:#fff;color:var(--rf-ink);font-size:14.5px;font-weight:600;text-decoration:none;transition:background .15s,border-color .15s}
.auth-social-button:hover{border-color:#d9dce6;background:#fafbfd}
.auth-social-button:focus-visible{border-color:#c9c5f7;outline:0;box-shadow:0 0 0 3px #efeefe}
.auth-social-button .rf-brand-mark{width:20px;height:20px}
.auth-divider{display:flex;align-items:center;gap:12px;margin:8px 0 -4px;color:var(--rf-faint);font-size:12.5px}
.auth-divider::before,.auth-divider::after{flex:1;height:1px;background:var(--rf-line);content:""}
.auth-card label{display:grid;gap:6px;margin-top:16px;color:var(--rf-text);font-size:13px;font-weight:550}
.auth-card input{width:100%;height:44px;margin:0;padding:0 13px;border:1px solid var(--rf-line);border-radius:10px;background:#fff;color:var(--rf-ink);font:inherit;font-size:14.5px;font-weight:400;outline:0}
.auth-card input:focus{border-color:#c9c5f7;box-shadow:0 0 0 3px #efeefe}
.auth-card input::placeholder{color:#9aa0b2}
.auth-card .auth-submit{width:100%;margin-top:22px}
.auth-card>p.auth-switch{margin:18px 0 0;color:var(--rf-muted);font-size:13.5px;text-align:center}
.auth-link{padding:0;border:0;background:none;color:#3b35c9;font:inherit;font-weight:600;cursor:pointer}
.auth-link:hover{text-decoration:underline}
.auth-card .auth-demo{width:100%;margin-top:12px}
.auth-foot{margin:0;color:var(--rf-faint);font-size:12.5px;text-align:center}
.auth-card>p.auth-success{margin:16px 0 0;padding:10px 12px;border-radius:9px;background:var(--rf-green-soft);color:var(--rf-green-ink);font-size:13px;line-height:1.45}
.auth-card>p.auth-forgot{margin:8px 0 0;font-size:13px;text-align:right}
.auth-card .auth-sep{margin:0 6px;color:var(--rf-faint)}
.auth-card .auth-submit:disabled{opacity:.6;cursor:progress}
/* Verify-email banner: a slim strip between the app header and the page content. */
.rf-verify-banner{display:flex;align-items:center;gap:8px 12px;padding:8px 34px 8px 30px;border-bottom:1px solid #f6e3bd;background:var(--rf-amber-soft);color:var(--rf-text);font-size:13px;line-height:1.4}
.rf-verify-banner[hidden]{display:none}
.rf-verify-banner>.ic{width:16px;height:16px;color:var(--rf-amber-ink)}
.rf-verify-banner p{flex:1;min-width:0;margin:0;overflow-wrap:anywhere}
.rf-verify-banner strong{color:var(--rf-ink);font-weight:600}
.rf-verify-actions{display:flex;flex:none;align-items:center;gap:4px}
.rf-verify-banner .rf-btn.sm{height:30px;border-color:#f0d9a8;background:#fff}
.rf-verify-dismiss{display:inline-grid;place-items:center;width:30px;height:30px;padding:0;border:0;border-radius:8px;background:none;color:var(--rf-muted);cursor:pointer}
.rf-verify-dismiss:hover{background:rgba(180,83,9,.08);color:var(--rf-ink)}
.rf-verify-dismiss .ic{width:16px;height:16px}
@media(max-width:900px){.rf-verify-banner{padding:8px 16px}}
@media(max-width:560px){.rf-verify-banner{flex-wrap:wrap}.rf-verify-banner p{flex-basis:calc(100% - 28px)}.rf-verify-actions{margin-left:28px}}
/* Toast (#notice, base rule in app.css): above sticky UI; on phones centred at the bottom inside 16px safe margins. */
#notice{z-index:60}
/* The desktop sidebar gradient would draw a stray vertical edge through stacked phone content. */
@media(max-width:900px){.rf-shell{background:var(--rf-bg)}}
@media(max-width:560px){#notice{left:16px;right:16px;bottom:max(16px,env(safe-area-inset-bottom));width:fit-content;max-width:calc(100% - 32px);margin:0 auto;text-align:center}}
@media(max-width:480px){.auth-shell{padding:24px 16px}.auth-card{padding:24px 20px;border-radius:14px}.auth-card h1,.auth-card .auth-title{font-size:24px}.auth-wordmark{font-size:26px}}
@media(max-width:900px){.rf-board{grid-template-columns:minmax(0,1fr)}}
@media(max-width:700px){
  /* Phones: tab rows scroll sideways and card-header controls wrap instead of widening the page. */
  .rf-tabs{overflow-x:auto;scrollbar-width:none}
  .rf-tabs::-webkit-scrollbar{display:none}
  .rf-tab{flex:none;margin-bottom:0}
  .rf-card-head{flex-wrap:wrap}
  .rf-card-heading{flex:1 1 200px}
  .rf-card-actions{flex-wrap:wrap;max-width:100%}
}
@media(max-width:560px){.rf-split{grid-template-columns:minmax(0,1fr)}.rf-split>div+div{border-top:1px solid var(--rf-line-2);border-left:0}.rf-card-tools .rf-input{width:100%}}
@media(max-width:1180px){.rf-cols.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.rf-cols,.rf-cols.cols-3,.rf-cols.wide-left,.rf-onboard{grid-template-columns:minmax(0,1fr)}}
@media(max-width:560px){.rf-list>li{flex-wrap:wrap}.rf-list-main{flex:1 1 200px}.rf-list-side{justify-content:flex-start;margin-left:0}.rf-kv{grid-template-columns:minmax(0,1fr)}.rf-kv dt{padding-bottom:0;border-bottom:0}.rf-toolbar .rf-input,.rf-toolbar .rf-select{width:100%}}

@media(max-width:900px){
  /* minmax(0,…) stops the side nav's min-content width from widening the page on phones. */
  .rf-shell{grid-template-columns:minmax(0,1fr)}
  .rf-side{position:static;height:auto;padding:14px 16px;border-right:0;border-bottom:1px solid var(--rf-line-2)}
  .rf-nav{display:flex;gap:4px;margin-top:12px;overflow-x:auto}
  .rf-nav-item{width:auto;flex:none}
  .rf-promo{display:none}
  .rf-header{padding:0 16px;gap:10px}
  .rf-vr{display:none}
  .rf-content{padding:18px 16px 28px}
  .rf-page-head{flex-direction:column}
  .rf-page-title h1{font-size:30px}
}
@media(max-width:560px){
  .rf-metrics,.rf-metrics.cols-5{grid-template-columns:1fr}
  .rf-banner{flex-direction:column;align-items:flex-start}
  .rf-bell{display:none}
}

/* Product workspace polish: one calm system shared by every authenticated view. */
:root{
  --rf-bg:#f4f7f5;
  --rf-surface:#fff;
  --rf-ink:#12211d;
  --rf-text:#33453f;
  --rf-muted:#62736e;
  --rf-faint:#899892;
  --rf-line:#dfe8e3;
  --rf-line-2:#e9efec;
  --rf-soft:#f1f5f3;
  --rf-indigo:#0d6f55;
  --rf-indigo-2:#128669;
  --rf-violet:#78b8a3;
  --rf-lavender:#b7ddcd;
  --rf-tint:#e5f3ec;
  --rf-green:#11865d;
  --rf-green-soft:#e6f5ed;
  --rf-green-ink:#08734d;
  --rf-shadow:0 1px 2px rgba(19,46,36,.04),0 8px 24px rgba(20,58,43,.035);
}
body{background:var(--rf-bg);color:var(--rf-ink)}
.rf-shell{grid-template-columns:248px minmax(0,1fr);background:var(--rf-bg)}
.rf-side{padding:20px 14px 18px 16px;background:#fbfdfc;border-right:1px solid var(--rf-line)}
.rf-brand{min-height:58px;padding:0 10px}
.rf-brand img{height:50px;max-width:184px}
.rf-nav{gap:4px;margin-top:26px}
.rf-nav-section-label{display:block;margin:20px 12px 6px;color:#82938d;font-size:10px;font-weight:700;letter-spacing:.08em;line-height:1.2;text-transform:uppercase}
.rf-nav-section-label:first-child{margin-top:0}
.rf-nav-item{height:40px;padding:0 12px;border:1px solid transparent;border-radius:10px;color:#4a5a55;font-size:13.5px;font-weight:500;transition:background .18s,border-color .18s,color .18s,transform .18s}
.rf-nav-item .ic{width:18px;height:18px;color:#71827c;stroke-width:1.8}
.rf-nav-item:hover{background:#eef5f1;color:var(--rf-ink);transform:translateX(2px)}
.rf-nav-item:hover .ic{color:var(--rf-indigo)}
.rf-nav-item.is-active{background:#e5f3ed;border-color:#cce8da;color:#0a6e50;font-weight:650;box-shadow:none}
.rf-nav-item.is-active .ic{color:#0a6e50}
.rf-promo{margin: auto 4px 0;min-height:184px;padding:18px 16px;border:1px solid #e1ebe5;border-radius:14px;background:#eaf5ef;color:var(--rf-text)}
.rf-promo::before{display:none}
.rf-promo strong{color:var(--rf-ink);font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.rf-promo p{margin:12px 0 16px;font-size:18px;line-height:1.12}
.rf-promo .rf-btn{border-color:#d6e7dc;background:#fff;color:var(--rf-ink);box-shadow:none}
.rf-main{background:var(--rf-bg)}
.rf-header{height:72px;padding:0 36px 0 32px;background:rgba(251,253,252,.97);border-color:var(--rf-line);box-shadow:0 1px 0 rgba(24,54,42,.025);backdrop-filter:none}
.rf-site-picker{border-color:var(--rf-line);background:#fff}
.rf-site-picker:hover{border-color:#b9d9ca}
.rf-account .rf-avatar{width:40px;height:40px;border-radius:12px}
.rf-menu{border-color:var(--rf-line);box-shadow:0 12px 30px rgba(19,46,36,.12)}
.rf-content,#app-content.rf-content{max-width:1480px;padding:30px 42px 44px 34px}
.rf-page-head{margin-bottom:26px}
.rf-page-title h1{font-size:42px;letter-spacing:-.035em;line-height:1.08}
.rf-page-title p{max-width:68ch;color:var(--rf-muted);line-height:1.55}
.rf-card{border-color:var(--rf-line);border-radius:14px;box-shadow:var(--rf-shadow)}
.rf-card-head{padding:18px 20px 11px}
.rf-card-head h2{font-size:17px;letter-spacing:-.015em}
.rf-card-body{padding:0 20px 18px}
.rf-metrics{gap:14px;margin-bottom:16px}
.rf-metric{min-height:124px;padding:18px 20px 16px;border-radius:14px}
.rf-metric-icon{border-radius:12px;background:var(--rf-tint);color:var(--rf-indigo)}
.rf-btn{border-radius:9px;transition:background .18s,border-color .18s,color .18s,box-shadow .18s,transform .18s}
.rf-btn:hover{border-color:#cbd8d2;background:#fbfdfc;transform:translateY(-1px)}
.rf-btn:active{transform:translateY(0) scale(.985)}
.rf-btn:focus-visible,.rf-nav-item:focus-visible,.rf-account:focus-visible{outline:3px solid #b8dfcd;outline-offset:2px}
.rf-btn.dark{border-color:#0f6b4e;background:#0f6b4e;color:#fff}
.rf-btn.dark:hover{border-color:#0b5a42;background:#0b5a42}
.rf-input,.rf-select{border-color:var(--rf-line);border-radius:9px;background:#fff;color:var(--rf-ink)}
.rf-input:focus,.rf-select:focus{border-color:#64ae8f;box-shadow:0 0 0 3px #e0f2e8;outline:0}
.rf-tabs .rf-tab.is-current{border-color:#0f8a64;color:#0f7656}
.rf-link{color:#0b7655}
.rf-table th{color:#71817b;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase}
.rf-table tbody tr:hover td{background:#f8f7ff}
.rf-empty-icon{background:#e7f4ed;color:#0a7654}
.rf-notice{border-color:#cfe6d9;background:#f3faf6}
.rf-banner{border-color:#cfe6da;background:#eaf6ef}
.rf-banner::after{display:none}
.pg-overview .ov-issue-label{color:var(--rf-indigo)}
.pg-overview .ov-issue-ai-button{border-color:#cce8da;color:var(--rf-indigo)}
.pg-overview .ov-issue-ai-button:hover{background:#eaf6ef}
.pg-overview .ov-issue-insight{border-color:#d5e9df;background:#fbfefc}
@media(max-width:1180px){.rf-content,#app-content.rf-content{padding-right:28px}}
@media(max-width:900px){
  .rf-side{padding:14px 16px;background:#fbfdfc}
  .rf-nav{gap:4px;margin-top:14px}
  .rf-nav-section-label{display:none}
  .rf-header{height:64px}
  .rf-content,#app-content.rf-content{padding:22px 16px 32px}
}
@media(max-width:560px){
  .rf-brand img{height:42px}
  .rf-page-title h1{font-size:32px}
  .rf-card,.rf-metric{border-radius:12px}
}
@media(prefers-reduced-motion:reduce){.rf-nav-item,.rf-btn{transition:none}.rf-nav-item:hover,.rf-btn:hover,.rf-btn:active{transform:none}}