/* App screen replicas (inc/replicas.php). A calm app window that scales with
   its box like a screenshot: every size inside is in em, and the base size
   follows the replica's width (container query units). --k is the module
   colour; --t a row's or pill's tone. */
.rp{container-type:inline-size;position:relative;width:100%;aspect-ratio:16/10.4;border-radius:16px;overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:0 40px 80px -48px rgba(12,22,56,.45);text-align:left;color:var(--ink)}
.rp-side,.rp-main{--u:clamp(7px,1.5cqw,15px);font-size:var(--u)}
.rp{display:grid;grid-template-columns:3.9em 1fr}
.rp .sb-icon{width:1.15em;height:1.15em}
.rp-side{background:#F6F7FB;border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;gap:.9em;padding:1.1em 0}
.rp-logo{width:2.2em;height:2.2em;display:grid;place-items:center;margin-bottom:.5em;color:var(--royal)}
.rp-logo .sb-mark{width:1.9em;height:auto;display:block}
.rp-nav{width:2.3em;height:2.3em;border-radius:.7em;display:grid;place-items:center;color:#7A849A}
.rp-nav.on{background:color-mix(in srgb,var(--k) 14%,#fff);color:var(--k);--ic-accent:var(--k)}
.rp-chip{margin-top:auto;width:2.3em;height:2.3em;border-radius:50%;display:grid;place-items:center;background:var(--royal-soft)}
.rp-chip .chipi{width:1.3em;height:1.3em}
.rp-main{display:flex;flex-direction:column;min-width:0;min-height:0}
.rp-top{display:flex;align-items:center;gap:1em;padding:1.3em 1.6em .8em}
.rp-top>div{display:grid;gap:.15em;margin-right:auto;min-width:0}
.rp-top b{font-family:var(--fd);font-size:1.55em;letter-spacing:-.02em;line-height:1.1}
.rp-top small{color:var(--muted);font-size:.9em}
.rp-search{display:flex;gap:.5em;align-items:center;color:#9AA3B5;border:1px solid var(--line);border-radius:.7em;padding:.45em .9em;font-size:.9em;min-width:9em}
.rp-btn{display:inline-flex;align-items:center;gap:.4em;background:var(--royal);color:#fff;border-radius:.7em;padding:.55em 1em;font-weight:700;font-size:.9em;white-space:nowrap}
.rp-tabs{display:flex;gap:1.6em;padding:0 1.6em;border-bottom:1px solid var(--line);font-size:.95em;color:var(--muted);overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
.rp-kpis[hidden]{display:none}
.rp-tabs span{padding:.55em 0;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.rp-tabs .on{color:var(--ink);font-weight:700;border-color:var(--k)}
.rp-body{flex:1;min-height:0;overflow:hidden;padding:1.1em 1.6em;display:grid;align-content:start;gap:1em;background:linear-gradient(#fff,#FBFCFE)}
/* shared bits */
.rp .pd-lead{width:1.9em;height:1.9em;flex:none;font-size:1em}
.rp .pd-lead-txt{font-size:.8em;width:2.3em;height:2.3em}
.rp .pd-lead .sb-icon,.rp .pd-lead .sb-brand{width:1.1em;height:1.1em}
.rp-pill{display:inline-flex;align-items:center;padding:.2em .7em;border-radius:99px;font-weight:700;font-size:.8em;white-space:nowrap;background:color-mix(in srgb,var(--t) 16%,#fff);color:color-mix(in srgb,var(--t) 70%,#0C1638)}
/* table (monday-style groups) */
.rp-group{--t:var(--k);display:grid;gap:.4em}
.rp-gname{color:var(--t);font-family:var(--fd);font-size:1.05em}
.rp-table{width:100%;border-collapse:separate;border-spacing:0;font-size:.92em;table-layout:fixed;border-left:.3em solid var(--t);border-radius:.3em}
.rp-table th{font-weight:600;color:var(--muted);font-size:.85em;text-align:center;padding:.35em .5em;border-bottom:1px solid var(--line)}
.rp-table th:first-child{text-align:left;width:34%}
.rp-table td{padding:0 .6em;height:2.35em;border-bottom:1px solid var(--line);border-right:1px solid var(--line);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;background:#fff}
.rp-table td:first-child{text-align:left}
.rp-c-person .pd-lead{margin:auto;width:1.7em;height:1.7em}
.rp-c-status{padding:0!important}
.rp-c-status span{display:grid;place-items:center;height:100%;min-height:2.35em;background:var(--t);color:#fff;font-weight:700;font-size:.9em}
.rp-c-tag span{display:inline-block;border:1.5px solid var(--t);color:color-mix(in srgb,var(--t) 75%,#0C1638);border-radius:.4em;padding:.1em .6em;font-size:.85em}
.rp-c-prog i{display:block;height:.6em;border-radius:99px;background:#E8EBF2;overflow:hidden}
.rp-c-prog b{display:block;height:100%;background:var(--k)}
.rp-c-check .sb-icon{color:#00B67A}
.rp-c-money{font-weight:700;font-variant-numeric:tabular-nums}
.rp-c-date{color:var(--ink-2)}
.rp-c-chan .pd-lead{margin:auto}
/* board */
.rp-board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:.8em;align-items:start}
.rp-bcol{background:#F4F6FA;border-radius:.8em;padding:.6em;display:grid;gap:.5em}
.rp-bhead{display:flex;align-items:center;gap:.5em;font-weight:700;font-size:.9em}
.rp-bhead i{width:.7em;height:.7em;border-radius:50%;background:var(--t)}
.rp-bhead em{margin-left:auto;font-style:normal;color:var(--muted);font-weight:600}
.rp-bcard{background:#fff;border:1px solid var(--line);border-radius:.6em;padding:.65em;display:grid;gap:.35em;box-shadow:0 1px 2px rgba(12,22,56,.05)}
.rp-bcard b{font-size:.92em;line-height:1.25}
.rp-bcard small{color:var(--muted);font-size:.82em}
.rp-bfoot{display:flex;justify-content:space-between;align-items:center}
.rp-bfoot .pd-lead{width:1.6em;height:1.6em}
/* stats */
.rp-kpis{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:.8em}
.rp-kpis>div{border:1px solid var(--line);border-radius:.8em;padding:.8em .9em;background:#fff;display:grid;gap:.2em}
.rp-kpis small{color:var(--muted);font-size:.82em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-kpis b{font-family:var(--fd);font-size:1.6em;letter-spacing:-.02em;white-space:nowrap}
.rp-kpis em{font-style:normal;font-weight:700;font-size:.8em}
.rp-kpis em.up{color:#00A06A}.rp-kpis em.down{color:#E5484D}
.rp-stats-row{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:.8em;min-height:0}
.rp-stats-row:has(>:only-child){grid-template-columns:minmax(0,1fr)}
.rp-chart{border:1px solid var(--line);border-radius:.8em;padding:.9em;background:#fff;display:grid;gap:.5em;align-content:start}
.rp-chart small{font-weight:700;font-size:.85em}
.rp-bars{height:9em;display:flex;align-items:flex-end;gap:.45em}
.rp-bars i{flex:1;border-radius:.35em .35em .1em .1em;background:linear-gradient(var(--k),color-mix(in srgb,var(--k) 55%,#fff))}
.rp-chart svg{width:100%;height:9em}
.rp-line{fill:none;stroke:var(--k);stroke-width:1.4;vector-effect:non-scaling-stroke}
.rp-area{fill:color-mix(in srgb,var(--k) 14%,transparent);stroke:none}
.rp-xl{display:flex;justify-content:space-between;color:var(--muted);font-size:.75em}
.rp-chart-donut{grid-template-columns:auto 1fr;align-items:center}
.rp-chart-donut small{grid-column:1/-1}
.rp-donut{width:7.5em;height:7.5em;border-radius:50%;display:grid;place-items:center}
.rp-donut i{width:62%;height:62%;border-radius:50%;background:#fff}
.rp-legend{list-style:none;margin:0;padding:0;display:grid;gap:.35em;font-size:.85em}
.rp-legend i{display:inline-block;width:.7em;height:.7em;border-radius:.2em;margin-right:.4em}
.rp-side-list .rp-list{border:1px solid var(--line);border-radius:.8em;padding:.6em .8em;background:#fff}
/* list */
.rp-list{display:grid;gap:.1em}
.rp-list-t{font-weight:700;font-size:.85em;padding:.2em 0 .4em}
.rp-row{display:flex;align-items:center;gap:.7em;padding:.5em .2em;border-bottom:1px solid var(--line)}
.rp-row:last-child{border-bottom:0}
.rp-row>div{display:grid;min-width:0;flex:1}
.rp-row b{font-size:.92em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-row small{color:var(--muted);font-size:.8em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-row time{color:var(--muted);font-size:.8em;white-space:nowrap}
/* inbox */
.rp-inbox{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.2fr);gap:0;border:1px solid var(--line);border-radius:.8em;overflow:hidden;background:#fff;height:100%}
.rp-body:has(>.rp-inbox),.rp-body:has(>.rp-chatapp),.rp-body:has(>.rp-cal),.rp-body:has(>.rp-page){padding-bottom:0;align-content:stretch}
.rp-threads{border-right:1px solid var(--line)}
.rp-thread{position:relative;display:flex;gap:.6em;align-items:center;padding:.65em .8em;border-bottom:1px solid var(--line)}
.rp-thread.on{background:color-mix(in srgb,var(--k) 8%,#fff);box-shadow:inset .25em 0 0 var(--k)}
.rp-thread>div{display:grid;min-width:0;flex:1}
.rp-thread b{font-size:.9em;display:flex;align-items:center;gap:.35em}
.rp-thread small{color:var(--muted);font-size:.8em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-thread time{font-size:.75em;color:var(--muted);align-self:flex-start}
.rp-chan .pd-lead{width:1.3em;height:1.3em}
.rp-dot{position:absolute;right:.8em;bottom:.8em;width:.55em;height:.55em;border-radius:50%;background:var(--k)}
.rp-conv{display:flex;flex-direction:column;min-width:0}
.rp-conv-h{padding:.7em .9em;border-bottom:1px solid var(--line);display:grid}
.rp-conv-h small{color:var(--muted);font-size:.8em}
.rp-msgs{flex:1;padding:.8em;display:flex;flex-direction:column;gap:.5em;background:#FBFCFE}
.rp-m{margin:0;max-width:82%;padding:.5em .75em;border-radius:.9em;font-size:.88em;line-height:1.35}
.rp-m-in{background:#fff;border:1px solid var(--line);border-bottom-left-radius:.2em}
.rp-m-out{align-self:flex-end;background:var(--royal);color:#fff;border-bottom-right-radius:.2em}
.rp-m-chip{align-self:flex-end;background:var(--royal-soft);border-bottom-right-radius:.2em}
.rp-chiptag{display:flex;align-items:center;gap:.3em;font-weight:800;font-size:.8em;color:var(--royal);margin-bottom:.2em}
.rp-chiptag .chipi{width:1.1em;height:1.1em}
.rp-compose{margin:.6em;border:1px solid var(--line);border-radius:.7em;padding:.5em .8em;color:#9AA3B5;font-size:.88em;display:flex;justify-content:space-between;align-items:center;background:#fff}
.rp-compose span{color:var(--royal)}
/* calendar */
.rp-cal{border:1px solid var(--line);border-radius:.8em;overflow:hidden;background:#fff;display:grid;grid-template-rows:auto 1fr;height:100%}
.rp-cal-h{display:grid;grid-template-columns:3.4em repeat(var(--n),minmax(0,1fr));border-bottom:1px solid var(--line)}
.rp-cal-h b{padding:.5em;font-size:.85em;text-align:center}
.rp-cal-b{display:grid;grid-template-columns:3.4em 1fr;min-height:14em}
.rp-cal-hours{display:grid;color:var(--muted);font-size:.72em;padding:.2em .4em;border-right:1px solid var(--line)}
.rp-cal-grid{position:relative;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));background:repeating-linear-gradient(#fff 0 calc(20% - 1px),#EEF1F6 calc(20% - 1px) 20%)}
.rp-cal-col{border-right:1px solid var(--line)}
.rp-ev{position:absolute;width:calc(100% / var(--n) - 6px);border-radius:.4em;background:color-mix(in srgb,var(--t) 16%,#fff);border-left:.25em solid var(--t);font-size:.75em;font-weight:700;padding:.3em .45em;overflow:hidden;line-height:1.2;color:color-mix(in srgb,var(--t) 60%,#0C1638)}
/* cards */
.rp-cards{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:.8em}
.rp-card{border:1px solid var(--line);border-radius:.8em;padding:.9em;background:#fff;display:grid;gap:.35em;align-content:start}
.rp-cic .pd-lead{background:color-mix(in srgb,var(--t) 14%,#fff);color:var(--t);--ic-accent:var(--t);border-radius:.6em}
.rp-card b{font-size:.95em}
.rp-card small{color:var(--muted);font-size:.8em;line-height:1.35}
.rp-card .rp-pill{justify-self:start}
/* doc */
.rp-doc{border:1px solid var(--line);border-radius:.8em;background:#fff;padding:1.2em 1.4em;display:grid;gap:.8em;max-width:42em}
.rp-doc-h{display:flex;justify-content:space-between;align-items:flex-start}
.rp-doc-h>div{display:grid}
.rp-doc-h b{font-family:var(--fd);font-size:1.3em}
.rp-doc-h small,.rp-doc-party,.rp-doc-note{color:var(--muted);font-size:.85em;margin:0}
.rp-stamp{border:2px solid #00B67A;color:#00A06A;border-radius:.4em;padding:.15em .6em;font-weight:800;font-size:.85em;transform:rotate(-4deg)}
.rp-lines{width:100%;border-collapse:collapse;font-size:.9em}
.rp-lines th{text-align:left;color:var(--muted);font-weight:600;font-size:.85em;border-bottom:1px solid var(--line);padding:.35em 0}
.rp-lines td{padding:.45em 0;border-bottom:1px solid var(--line)}
.rp-lines th:last-child,.rp-lines td:last-child{text-align:right}
.rp-total{display:flex;justify-content:space-between;align-items:baseline}
.rp-total b{font-family:var(--fd);font-size:1.5em}
/* flow */
.rp-flow{display:grid;justify-items:center;gap:0;padding-top:.4em}
.rp-step{display:flex;gap:.7em;align-items:center;min-width:22em;border:1px solid var(--line);background:#fff;border-radius:.8em;padding:.6em .9em;box-shadow:0 1px 2px rgba(12,22,56,.05)}
.rp-step>span{width:2.2em;height:2.2em;border-radius:.6em;display:grid;place-items:center;background:color-mix(in srgb,var(--t) 14%,#fff);color:var(--t);--ic-accent:var(--t)}
.rp-step>div{display:grid}
.rp-step small{color:var(--muted);font-size:.78em}
.rp-step b{font-size:.92em}
.rp-flow-line{width:2px;height:1.2em;background:var(--line)}
/* form */
.rp-form{border:1px solid var(--line);border-radius:.8em;background:#fff;padding:1.1em 1.3em;display:grid;gap:.7em;max-width:34em;justify-self:center;width:100%}
.rp-form-h{font-family:var(--fd);font-size:1.2em}
.rp-form label{display:grid;gap:.3em;font-size:.85em;font-weight:600}
.rp-form em{font-style:normal;font-weight:400;border:1px solid var(--line);border-radius:.5em;padding:.5em .7em;color:var(--ink-2)}
.rp-form em.area{min-height:3.5em}
.rp-choices{display:flex;gap:.4em;flex-wrap:wrap}
.rp-choices i{font-style:normal;font-weight:500;border:1px solid var(--line);border-radius:99px;padding:.3em .8em}
.rp-choices i:first-child{border-color:var(--k);background:color-mix(in srgb,var(--k) 10%,#fff)}
.rp-form .rp-btn{justify-self:start}
/* page */
.rp-page{display:grid;justify-items:center;height:100%}
.rp-page-in{width:100%;border:1px solid var(--line);border-radius:.8em;overflow:hidden;background:#fff;display:grid;align-content:start}
.rp-page.phone .rp-page-in{width:17em;border-radius:1.6em;border-width:.35em;border-color:#0C1638}
.rp-page-nav{display:flex;justify-content:space-between;align-items:center;padding:.7em 1em;font-size:.85em;border-bottom:1px solid var(--line)}
.rp-page-nav span{color:var(--muted)}
.rp-page-hero{padding:1.4em 1.2em;display:grid;gap:.5em;justify-items:start;background:linear-gradient(135deg,color-mix(in srgb,var(--k) 16%,#fff),#fff)}
.rp-page.phone .rp-page-hero{justify-items:center;text-align:center}
.rp-page-hero b{font-family:var(--fd);font-size:1.6em;line-height:1.05;letter-spacing:-.02em;max-width:14ch}
.rp-page-hero p{margin:0;color:var(--ink-2);font-size:.85em;max-width:34ch}
.rp-page-hero .rp-btn{background:var(--k)}
.rp-prods{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6em;padding:.9em}
.rp-page.phone .rp-prods{grid-template-columns:1fr 1fr}
.rp-prods div{display:grid;gap:.2em;font-size:.8em}
.rp-prods i{aspect-ratio:1;border-radius:.5em;background:linear-gradient(135deg,hsl(var(--h) 60% 86%),hsl(var(--h) 55% 72%))}
.rp-prods small{color:var(--muted)}
.rp-pblocks{display:grid;gap:.5em;padding:.9em}
.rp-pblocks div{display:flex;gap:.6em;align-items:center;border:1px solid var(--line);border-radius:.6em;padding:.55em .7em;font-size:.85em}
.rp-pblocks .sb-icon{color:var(--k);--ic-accent:var(--k)}
.rp-pblocks small{color:var(--muted);margin-left:auto}
/* team chat */
.rp-chatapp{display:grid;grid-template-columns:minmax(0,.6fr) minmax(0,2fr);border:1px solid var(--line);border-radius:.8em;overflow:hidden;background:#fff;height:100%}
.rp-rooms{background:#F6F7FB;border-right:1px solid var(--line);padding:.6em;display:grid;align-content:start;gap:.2em;font-size:.88em}
.rp-rooms span{padding:.35em .6em;border-radius:.5em;color:var(--ink-2)}
.rp-rooms .on{background:color-mix(in srgb,var(--k) 14%,#fff);color:var(--ink);font-weight:700}
.rp-feed{display:flex;flex-direction:column;min-width:0}
.rp-post{display:flex;gap:.6em;padding:.6em .9em}
.rp-post b{font-size:.9em}
.rp-post time{color:var(--muted);font-weight:400;font-size:.85em;margin-left:.3em}
.rp-post p{margin:.15em 0 0;font-size:.88em;color:var(--ink-2);line-height:1.4}
.rp-feed .rp-compose{margin-top:auto}
/* Live call (view 'room'): a light stage, like the app's room, never a dark panel */
.rp-body:has(>.rp-room){align-content:stretch;grid-template-rows:minmax(0,1fr)}
.rp-room{display:grid;grid-template-columns:minmax(0,1fr);gap:.8em;height:100%;min-height:0}
.rp-room.has-panel{grid-template-columns:minmax(0,1fr) minmax(0,.46fr)}
.rp-stagewrap{display:flex;flex-direction:column;gap:.6em;min-height:0;background:#F1F3F8;border:1px solid var(--line);border-radius:.9em;padding:.7em}
.rp-consent{display:flex;align-items:center;gap:.5em;align-self:center;background:#fff;border:1px solid color-mix(in srgb,#E5484D 30%,var(--line));color:var(--ink);border-radius:99px;padding:.35em .9em;font-size:.8em;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.rp-consent i{flex:none;width:.6em;height:.6em;border-radius:50%;background:#E5484D;box-shadow:0 0 0 .2em color-mix(in srgb,#E5484D 22%,transparent)}
.rp-stage{flex:1;min-height:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5em}
.rp-stage[style*="--n:1"]{grid-template-columns:minmax(0,1fr)}
.rp-tile{position:relative;display:grid;place-items:center;border-radius:.7em;background:linear-gradient(160deg,#E4E8F2,#D5DBE8);min-height:4.5em;overflow:hidden}
.rp-tile.speaking{box-shadow:inset 0 0 0 .18em var(--k)}
.rp .rp-tile .av[data-p],.rp-tile .pd-lead{width:calc(var(--u) * 3.6);height:calc(var(--u) * 3.6)}
.rp-tname{position:absolute;left:.45em;bottom:.4em;display:inline-flex;align-items:center;gap:.3em;background:rgba(255,255,255,.92);border-radius:.4em;padding:.15em .45em;font-size:.72em;font-weight:600}
.rp-tname .sb-icon{width:1em;height:1em;color:#E5484D}
.rp-stage-share{grid-template-columns:minmax(0,1fr) 5.4em}
.rp-screen{display:grid;align-content:start;gap:.5em;background:#fff;border:1px solid var(--line);border-radius:.7em;padding:.7em}
.rp-screen small{display:flex;align-items:center;gap:.35em;font-size:.72em;color:var(--muted);font-weight:600}
.rp-screen i{display:block;height:.9em;border-radius:.3em;background:#E8EBF2}
.rp-screen i:nth-of-type(1){width:60%;height:1.3em;background:color-mix(in srgb,var(--k) 22%,#fff)}
.rp-screen i:nth-of-type(2){width:88%}
.rp-screen i:nth-of-type(3){width:72%}
.rp-strip{display:grid;gap:.4em;align-content:start}
.rp-strip .rp-tile{min-height:3.6em}
.rp-strip .rp-tile .av[data-p],.rp-strip .rp-tile .pd-lead{width:calc(var(--u) * 2.2);height:calc(var(--u) * 2.2)}
.rp-strip .rp-tname{font-size:.62em}
.rp-controls{display:flex;justify-content:center;align-items:center;gap:.4em;flex-wrap:nowrap}
.rp-ctl{display:inline-flex;align-items:center;gap:.3em;background:#fff;border:1px solid var(--line);border-radius:99px;padding:.35em .6em;font-size:.72em;font-weight:600;white-space:nowrap}
.rp-ctl em{font-style:normal}
.rp-ctl .chipi{width:1.1em;height:1.1em}
.rp-leave{background:#E5484D;border-color:#E5484D;color:#fff}
.rp-rpanel{display:grid;align-content:start;gap:.5em;border:1px solid var(--line);border-radius:.9em;padding:.8em;background:#fff;min-width:0;overflow:hidden}
.rp-rpanel b{font-size:.9em}
.rp-rpanel p{margin:0;font-size:.78em;line-height:1.35;color:var(--ink-2)}
.rp-rpanel strong{display:flex;align-items:center;gap:.3em;color:var(--ink);font-size:.95em}
.rp-rpanel .rp-rchip{background:var(--royal-soft);border-radius:.6em;padding:.45em .55em}
.rp-rpanel small{color:var(--muted);font-size:.72em}
@container (max-width:620px){.rp-ctl em{display:none}.rp-room.has-panel{grid-template-columns:minmax(0,1fr)}.rp-rpanel{display:none}}
/* full-screen replica (no sidebar) and the drop-in bar in team chat */
.rp.rp-full{grid-template-columns:minmax(0,1fr)}
.rp-dropbar{display:flex;align-items:center;gap:.55em;margin:.6em .9em 0;padding:.45em .6em;border-radius:.7em;background:color-mix(in srgb,var(--k) 10%,#fff);border:1px solid color-mix(in srgb,var(--k) 30%,var(--line));font-size:.82em}
.rp-dropbar>.sb-icon{color:var(--k);--ic-accent:var(--k)}
.rp-dropav{display:flex}
.rp-dropav>*{margin-left:-.35em;box-shadow:0 0 0 .15em #fff;border-radius:50%}
.rp-dropav>*:first-child{margin-left:0}
.rp .rp-dropav .av[data-p]{width:calc(var(--u) * 1.6);height:calc(var(--u) * 1.6)}
.rp-droptxt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
.rp-dropbar .rp-btn{padding:.35em .8em}
/* split */
.rp-split{display:grid;gap:.9em;min-height:0}
.rp-split>div{display:grid;gap:.8em;align-content:start;min-width:0}
.pd.pd-replica{border:0;background:none;box-shadow:none;overflow:visible;padding:0;border-radius:16px}

/* dev gallery (?sb_replicas, not on production) */
.rp-gallery{display:grid;gap:40px;padding:40px 24px;max-width:1500px;margin:0 auto}
.rp-gallery article{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 340px;gap:20px;align-items:start}
.rp-gallery h2{grid-column:1/-1;font-size:18px;margin:0}
.rp-gallery img{width:100%;border:1px solid var(--line);border-radius:12px}
/* small replicas: keep the title bar to one clean line */
@container (max-width:520px){
  .rp-search,.rp-top small{display:none}
  .rp-top b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
@container (max-width:360px){.rp-top .rp-btn{display:none}}
/* photo avatars: the site sets their font-size to 0 !important, so size them from --u, not em */
.rp .av[data-p]{width:calc(var(--u) * 1.9);height:calc(var(--u) * 1.9)}
.rp .rp-c-person .av[data-p]{width:calc(var(--u) * 1.7);height:calc(var(--u) * 1.7)}
.rp .rp-bfoot .av[data-p]{width:calc(var(--u) * 1.6);height:calc(var(--u) * 1.6)}
/* header extras and a vertical section rail (a client portal's tabs) */
.rp-top .rp-crumbs{font-size:.78em;color:var(--muted)}
.rp-top b .rp-pill{font-family:var(--fb,inherit);font-size:.5em;letter-spacing:0;vertical-align:.35em;margin-left:.3em}
.rp-btn-ghost{background:#fff;color:var(--ink);border:1px solid var(--line);font-weight:600}
.rp-body-rail{display:grid;grid-template-columns:8.6em minmax(0,1fr);gap:1.2em;padding:0 1.6em 0 1.2em;border-top:1px solid var(--line)}
.rp-rail{display:grid;align-content:start;gap:.15em;padding:1em .8em 1em 0;border-right:1px solid var(--line);font-size:.88em;color:var(--muted)}
.rp-rail span{padding:.45em .7em;border-radius:.6em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-rail .on{background:color-mix(in srgb,var(--k) 12%,#fff);color:var(--ink);font-weight:700}
.rp-railview{display:grid;align-content:start;gap:1em;padding:1em 0;min-width:0;overflow:hidden}
@container (max-width:520px){.rp-top .rp-btn-ghost{display:none}}
@container (max-width:380px){
  .rp-body-rail{grid-template-columns:minmax(0,1fr)}
  .rp-rail{display:none}
}
