/* A quieter working version of the illustrated public-site palette. */
.rf-shell {
  --th-canvas:#fbfbf7; --th-card:#fff; --th-ink:#203b3b; --th-text:#344c4a;
  --th-muted:#687c79; --th-faint:#82928f; --th-line:#e0e9e4; --th-soft:#f4f8f5;
  --th-indigo:#28544e; --th-tint:#e3f2ed; --th-lime:#28544e; --th-lime-deep:#193d38;
  --th-lime-soft:#e3f2ed; --rf-indigo:#28544e; --rf-tint:#e3f2ed;
}
.rf-shell .rf-side{background:#fffefb;border-color:#e1eae5}
.rf-shell .rf-nav-item{color:#425955}
.rf-shell .rf-nav-item .ic{color:#506b65}
.rf-shell .rf-nav-item.is-active{background:#dff1eb;color:#173e38}
.rf-shell .rf-nav-item.is-active .ic{color:#28544e}
.rf-shell .rf-nav-item.is-active::before{background:#28544e}
.rf-shell .rf-main,.rf-shell #app-content{background:#fff}
.rf-shell .rf-header{background:#fff;border-bottom:1px solid #e5ede7}
.rf-shell .rf-header .rf-search,.rf-shell .rf-header .rf-select,.rf-shell .rf-bell,.rf-shell .rf-account{border-color:#e0e9e4}
.rf-shell .rf-btn.dark{background:#203b3b;border-color:#203b3b;color:#fff}
.rf-shell .rf-btn.dark:hover{background:#315b53;border-color:#315b53}
.rf-shell .rf-content .rf-card{border-color:#e0e9e4}

/* Websites: a brief introduction, then an uncluttered set of projects. */
.ws-page{max-width:1480px}
.ws-breadcrumb{margin:4px 0 14px;color:#718681}
.ws-welcome{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:150px;margin-bottom:18px;padding:20px 30px;border:1px solid #d6e9e7;border-radius:20px;background:#eaf7f9;overflow:hidden}
.ws-welcome>div{position:relative;z-index:1;max-width:660px}
.ws-eyebrow{display:block;margin-bottom:10px;color:#5b7772;font-size:10px;font-weight:750;letter-spacing:.13em}
.ws-eyebrow span{color:#d27a63;font-size:14px}
.ws-welcome h1{margin:0;color:#203b3b;font-size:clamp(26px,2.7vw,36px);line-height:1.1;letter-spacing:-.045em}
.ws-welcome p{margin:9px 0 17px;color:#536e68;font-size:13px;line-height:1.6}
.ws-welcome .rf-btn{min-height:42px;padding-inline:17px}
.ws-welcome img{width:190px;max-height:135px;flex:none;object-fit:contain;mix-blend-mode:multiply}
.ws-demo-note{margin:0 0 18px;background:#f3edfc;color:#5c5279;border:1px solid #e8e0f3}
.ws-summary{gap:14px 30px;margin:0 0 25px;padding:15px 18px;border-color:#e0e9e4;background:#fffefb;border-radius:14px}
.ws-summary .ic{color:#577e72}.ws-summary strong{color:#203b3b}
.ws-summary>a{color:#496b61}
.ws-toolbar{align-items:center;gap:16px}
.ws-search,.ws-filters select{border-color:#dce8e1;background:#fffefb}
.ws-search:focus-within{outline-color:#458a76}
.ws-result-count{margin:17px 0 12px;color:#71837d}
.ws-site-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.ws-site-card{display:flex;flex-direction:column;min-width:0;padding:22px;border:1px solid #dfe9e2;border-radius:17px;background:#fffefb;box-shadow:none}
.ws-site-card:hover{border-color:#9fcabb;box-shadow:0 8px 22px #1d43380a}
.ws-site-card.is-selected{border-color:#82b8a5}
.ws-card-heading{display:flex;align-items:center;gap:14px;min-width:0}
.ws-site-mark{width:48px;height:48px;flex:none;border:1px solid #cfe4dc;border-radius:14px;background:#e2f2eb;color:#28564b}
.ws-site-card:nth-child(4n+2) .ws-site-mark{background:#f3e9fa;border-color:#e7daf1;color:#725b86}
.ws-site-card:nth-child(4n+3) .ws-site-mark{background:#fcebe0;border-color:#f3dacc;color:#9d644e}
.ws-site-identity{min-width:0;flex:1;margin:0}
.ws-site-identity h2{font-size:18px;line-height:1.25;letter-spacing:-.03em}
.ws-site-identity button:hover{color:#3c826d}
.ws-site-identity p{margin:5px 0 0;color:#72827e;font-size:12px}
.ws-status{flex:none;white-space:nowrap}.ws-status.synced{background:#e8f5ec;color:#346a4b}.ws-status.pending{background:#fff2d4;color:#805b20}
.ws-site-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:20px 0 0;padding:17px 0;border-color:#e9efeb}
.ws-site-metrics dt{font-size:11px}.ws-site-metrics dd{font-size:clamp(16px,1.45vw,20px);overflow-wrap:anywhere;letter-spacing:-.035em}
.ws-sync-time{margin:12px 0 16px;color:#72847d}
.ws-card-actions{margin-top:auto}.ws-card-actions .rf-btn{flex:0 1 auto;height:40px;min-width:112px}
.ws-add-card{display:flex;min-height:0;flex-direction:row;justify-content:flex-start;gap:14px;width:100%;margin-top:16px;padding:17px 20px;border:1px dashed #bfd8ca;border-radius:16px;background:#f4faf5;text-align:left}
.ws-add-card:hover{border-color:#6f9f8c;background:#eaf6ed}
.ws-add-card>span:first-child{width:40px;height:40px;flex:none;background:#ddefe5;color:#28544e;font-size:24px}
.ws-add-card>span:nth-child(2){display:grid;place-items:start;width:auto;height:auto;gap:4px;border-radius:0;background:transparent;color:inherit;font-size:inherit;font-weight:inherit}.ws-add-card strong{color:#25453f}.ws-add-card small{color:#6e837b}
.ws-add-card .ws-add-arrow{margin-left:auto;color:#426d60;font-size:20px}
.ws-source-note{margin:18px 0;color:#71847c}
.ws-empty{background:#fffefb;border-color:#dfe9e2}

/* The same project context appears above both the preview and live overview. */
.ws-project-context{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:4px 0 20px;color:#71847c;font-size:12px}
.ws-project-context button{display:inline-flex;align-items:center;gap:6px;padding:0;border:0;background:none;color:#285e50;font:inherit;cursor:pointer}
.ws-project-context button:hover{text-decoration:underline}
.ws-project-context .ic{width:15px;height:15px}
.ws-project-context strong{color:#28443e;overflow-wrap:anywhere}
.ws-project-context small{color:#71847c;font-size:12px}
.ws-project-metrics article{border-color:#dfe9e2;background:#fffefb}
.ws-project-metrics article:nth-child(1){background:#eaf7f9}
.ws-project-metrics article:nth-child(2){background:#f2edfa}
.ws-project-metrics article:nth-child(3){background:#fdf1e5}
.ws-project-metrics article:nth-child(4){background:#eaf5ed}
.ws-project-metrics strong{color:#203b3b;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.ws-panel-head{border-color:#e7eee8}.ws-panel-head h2{color:#203b3b}
.ws-query-list article{border-color:#e7eee8}

/* Add website: show the sequence without changing the connection or permissions. */
#site-dialog{border-color:#d9e9e0;background:#fffefb;color:#203b3b}
#site-dialog::backdrop{background:#1c383366}
#site-dialog .dialog-header{padding:22px 28px 17px;background:#eaf7f9;border-color:#d9e9e3}
#site-dialog .dialog-header h2{color:#203b3b}
#site-dialog .dialog-eyebrow{color:#4c7168}
#site-dialog .dialog-mark{background:#dcefe6;color:#28544e;border-color:#c5e0d3}
#site-dialog .dialog-close{border-color:#d2e4dc;color:#42635a}
#site-dialog .dialog-close:hover{background:#e3f2eb;color:#28544e}
.ws-dialog-steps{display:flex;gap:12px 24px;flex-wrap:wrap;margin:16px 28px 0;color:#526f67;font-size:12px;font-weight:600}
.ws-dialog-steps span{display:flex;align-items:center;gap:8px}.ws-dialog-steps b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#e4f2eb;color:#28544e;font-size:11px}
#site-dialog .dialog-fields{gap:14px;padding:16px 28px 18px}
#site-dialog .dialog-field input,#site-dialog .dialog-field select{border-color:#d8e6de}
#site-dialog .dialog-actions{padding:14px 28px;background:#f8fbf7;border-color:#e4eee6}
#site-dialog .dialog-actions .primary-button{width:auto;min-width:135px;flex:0 0 auto;background:#203b3b;border-color:#203b3b}
#site-dialog :is(input,select,button):focus-visible{outline-color:#4a8b78}
.ws-dialog-status{margin-top:14px;padding:11px 14px;border-color:#d8e8dd;background:#f2f8f2;color:#426458}
.ws-dialog-status.is-error{background:#fff4f1;border-color:#f4d2c9;color:#9b392a}
.ws-dialog-status button{border-color:#c9ded1;color:#28544e}
.ws-dialog-helper{color:#70847b}.ws-dialog-cancel{border-color:#d8e6de;color:#425b53}

@media(max-width:1100px){.ws-toolbar{align-items:stretch}.ws-filters{justify-content:flex-start}}
@media(max-width:800px){.ws-welcome{padding:24px}.ws-welcome img{width:145px}.ws-site-grid{grid-template-columns:1fr}.ws-project-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.ws-welcome{min-height:0;padding:22px}.ws-welcome h1{font-size:27px}.ws-welcome img{width:90px;align-self:flex-end}.ws-welcome p{max-width:32ch}.ws-card-heading{flex-wrap:wrap}.ws-site-identity{flex:1 1 calc(100% - 64px)}.ws-status{margin-left:62px}.ws-site-card{padding:18px}.ws-site-metrics dd{font-size:17px}.ws-add-card{padding:15px}.ws-dialog-steps{margin:18px 22px 0}#site-dialog .dialog-actions{flex-direction:row;align-items:center}#site-dialog .dialog-actions p{flex-basis:100%}#site-dialog .dialog-actions .primary-button{width:auto;flex:1}}
@media(max-width:380px){.ws-welcome img{display:none}.ws-site-metrics{gap:6px}.ws-site-metrics dd{font-size:15px}}

/* Overview: a compact welcome and restrained color for data and next steps. */
.ov-welcome{display:flex;align-items:center;justify-content:space-between;gap:20px;min-width:0;margin:0 0 20px;padding:20px 28px;border:1px solid #d6e9e7;border-radius:20px;background:#eaf7f9;overflow:hidden}
.ov-welcome-copy{min-width:0;flex:1}
.ov-welcome-kicker{display:block;margin:0 0 9px;color:#5b7772;font-size:10px;font-weight:750;letter-spacing:.13em}
.ov-welcome-kicker span{color:#d27a63;font-size:14px}
.rf-shell .ov-welcome :is(.rf-page-head,.page-heading){margin:0;gap:18px}
.rf-shell .ov-welcome :is(h1,h2){margin:0;color:#203b3b;font-size:30px;line-height:1.12;letter-spacing:-.04em}
.rf-shell .ov-welcome :is(.rf-page-title p,.page-heading p){margin:7px 0 0;color:#536e68;font-size:13px;line-height:1.5}
.ov-welcome img{width:152px;max-height:110px;flex:none;object-fit:contain;mix-blend-mode:multiply}
.ov-period{display:inline-flex;align-items:center;min-height:38px;padding:0 12px;border:1px solid #cfe3dd;border-radius:10px;background:#fffefb;color:#4e6c64;font-size:12px;white-space:nowrap}
.dashboard-demo .metrics{align-items:stretch}
.rf-shell .dashboard-demo .metric{border-color:#dfe9e2;box-shadow:none}
.rf-shell .dashboard-demo .metric:nth-child(4n+1){background:#eaf7f9}
.rf-shell .dashboard-demo .metric:nth-child(4n+2){background:#f2edfa}
.rf-shell .dashboard-demo .metric:nth-child(4n+3){background:#fdf1e5}
.rf-shell .dashboard-demo .metric:nth-child(4n+4){background:#eaf5ed}
.dashboard-demo .metric strong{font-variant-numeric:tabular-nums}
.dashboard-demo .dashboard-card,.dashboard-demo .competitor-panel,.dashboard-demo .dashboard-lower>.panel{border-color:#e0e9e4;border-radius:18px}
.dashboard-demo .dashboard-banner{border-color:#d6e9e0;background:#f1f8f1}
.pg-overview .ov-next-card{border-color:#dfe9e2;background:#fbfdf9}
.pg-overview .ov-next-card:nth-child(3n+1) .ov-next-number{background:#e0f1ec;color:#28544e}
.pg-overview .ov-next-card:nth-child(3n+2) .ov-next-number{background:#f1eafa;color:#725b86}
.pg-overview .ov-next-card:nth-child(3n+3) .ov-next-number{background:#fff0df;color:#93613d}
.pg-overview .ov-next-do{background:#f0f7f1}
.pg-overview .ov2-hero-side{background:#f6faf7}
.pg-overview .ov2-hero,.pg-overview .ov-next{border-color:#dfe9e2}
.pg-overview .ov-action-icon{background:#e3f2ed;color:#28544e}
@media(max-width:800px){.ov-welcome{padding:20px 22px}.ov-welcome img{width:110px}.rf-shell .ov-welcome :is(h1,h2){font-size:27px}}
@media(max-width:600px){.ov-welcome{align-items:flex-start;padding:19px}.ov-welcome img{display:none}.rf-shell .ov-welcome :is(.rf-page-head,.page-heading){align-items:flex-start;flex-wrap:wrap}.ov-period{min-height:34px}.dashboard-demo .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-demo .metric{min-width:0}.dashboard-demo .metric strong{overflow-wrap:anywhere}}
@media(max-width:380px){.rf-shell .dashboard-demo .metric strong{font-size:22px;white-space:nowrap;overflow-wrap:normal}}
@media(max-width:900px){.rf-shell .rf-promo:has(.rf-planmeter){display:none}}
@media(min-width:901px) and (max-height:820px){.rf-shell .rf-promo:has(.rf-planmeter){display:none}}
