/* SpaceCall · the Earth design (Gal 27.10, canvas "הפלטפורמה בעיצוב החדש").
   Dark glass windows floating over a photo of the Earth, glass-marble buttons, a floating rail on the right and a floating header pill.
   Active when html[data-look=cosmos] (set by i18n.js before first paint). It only changes looks: no rule here hides something a screen needs.
   Built on the dark base (style.css + agent.css + workspace.css with data-theme=space). cosmos.js adds the decorative pieces (aria-hidden). */

:root{--cx-tx:#fff;--cx-mu:rgba(220,234,252,.74);--cx-sub:rgba(230,240,255,.8);--cx-mint:#20D99E;--cx-mint2:#7dffcf;--cx-blue:#4fb6e6;--cx-ice:#b5e6ff;
 --cx-gold:#d9a650;--cx-red:#e8664f;--cx-hot:#ff8a7a;--cx-warm:#ffc970;--cx-line:rgba(255,255,255,.12);
 --cx-win:linear-gradient(180deg,rgba(14,30,58,.50),rgba(6,14,32,.60));
 --cx-win-solid:linear-gradient(180deg,rgba(14,30,58,.9),rgba(6,14,32,.94));
 --cx-win-sh:inset 0 1px 0 rgba(255,255,255,.35),inset 0 0 0 1px rgba(255,255,255,.12),0 40px 80px -20px rgba(0,0,0,.55),0 12px 24px -8px rgba(0,0,0,.35);
 --cx-gl:rgba(255,255,255,.13);--cx-gl-sh:inset 0 1px 0 rgba(255,255,255,.28),inset 0 0 0 1px rgba(255,255,255,.06);
 --cx-rec:rgba(2,8,20,.38);--cx-rec-sh:inset 0 1px 2px rgba(0,0,0,.28);
 --cx-shine:radial-gradient(circle at 32% 20%,rgba(255,255,255,.85) 0%,rgba(255,255,255,0) 20%),radial-gradient(circle at 50% 56%,rgba(0,10,30,.30) 0%,rgba(0,10,30,.12) 38%,rgba(0,10,30,0) 62%),conic-gradient(from 210deg at 50% 58%,rgba(255,255,255,.10),rgba(180,210,255,.14),rgba(255,255,255,.06),rgba(180,210,255,.12),rgba(255,255,255,.10));
 --cx-m-blue:var(--cx-shine),radial-gradient(circle at 35% 30%,#dcefff,#3a7fc0 52%,#0d2c4f);
 --cx-m-green:var(--cx-shine),radial-gradient(circle at 35% 30%,#e3fff3,#20c98d 52%,#0a5e42);
 --cx-m-red:var(--cx-shine),radial-gradient(circle at 35% 30%,#ffe3da,#e8664f 52%,#7a2416);
 --cx-m-gold:var(--cx-shine),radial-gradient(circle at 35% 30%,#fff3dc,#d9a650 52%,#6b4a1c);
 --cx-m-wa:var(--cx-shine),radial-gradient(circle at 35% 30%,#e3ffec,#25d366 52%,#0b6b34);
 --cx-m-ai:radial-gradient(circle at 30% 22%,#fff 0%,rgba(255,255,255,0) 22%),conic-gradient(from 210deg at 50% 58%,rgba(170,235,255,.55),rgba(255,255,255,.35),rgba(120,200,255,.5),rgba(200,245,255,.4),rgba(170,235,255,.55)),radial-gradient(circle at 35% 30%,#e6fbff,#4fb6e6 52%,#0b4467);
 --cx-m-slate:var(--cx-shine),radial-gradient(circle at 35% 30%,#ffffff,#c8d6dd 55%,#5f7a87);
 --cx-m-sh:inset 0 -6px 10px rgba(0,0,0,.28),inset 0 3px 6px rgba(255,255,255,.5),0 6px 12px -4px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.12);
 --cx-num:'Unbounded',sans-serif;--cx-font:'Heebo','IBM Plex Sans Hebrew',-apple-system,'Segoe UI',Arial,sans-serif}

/* ---------- the page: the Earth photo, stars, the satellite ring ---------- */
html[data-look=cosmos] body{background:transparent}   /* a painted body would cover the Earth */
html[data-look=cosmos]{--bg:#000;--tx:#fff;--mu:rgba(220,234,252,.74);--ac:#7dd3fc;--ac2:#3a7fc0;--ok:#20D99E;--warn:#ffc970;--bad:#ff8a7a;--glass:rgba(255,255,255,.13);--line:rgba(255,255,255,.12);--r:26px;background:#000}
html[data-look=cosmos],html[data-look=cosmos] body{font-family:var(--cx-font);font-size:13px;color:#fff}
html[data-look=cosmos] body{text-shadow:0 1px 2px rgba(0,0,0,.35)}
html[data-look=cosmos] .stars{background:none}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .earthwrap{left:0;top:0;width:100vw;height:100vh;margin:0;opacity:1;contain:strict}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .earth{border-radius:0;background:#000 var(--cx-earth,url(cosmos/earth-marble.webp)) center/cover no-repeat;animation:none;transform:none}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .veil{background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,0) 22%,rgba(0,0,0,0) 85%,rgba(0,0,0,.15))}
@media (max-width:900px){html[data-look=cosmos] .earth{background-image:var(--cx-earth-sm,url(cosmos/earth-marble-sm.webp))}}
.cx-sky{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.cx-star{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff;box-shadow:0 0 6px 1px rgba(200,230,255,.9);animation:cx-tw 3.5s ease-in-out infinite}
@keyframes cx-tw{0%,100%{opacity:.15;transform:scale(.6)}50%{opacity:1;transform:scale(1)}}
.cx-ring{position:absolute;left:50%;top:50%;width:1440px;height:900px;margin:-450px 0 0 -720px;transform:scale(var(--cx-k,1));transform-origin:50% 50%}
.cx-ring>div{position:absolute;inset:0;transform:rotate(-13deg);transform-origin:990px 676px}
.cx-ring svg{position:absolute;inset:0;width:1440px;height:900px;overflow:visible}
.cx-ring .back{clip-path:inset(0 0 224px 0);-webkit-mask:radial-gradient(circle 421px at 990px 676px,transparent 99.6%,#000 100%);mask:radial-gradient(circle 421px at 990px 676px,transparent 99.6%,#000 100%)}
.cx-ring .front{clip-path:inset(676px 0 0 0)}
.cx-sat{position:absolute;left:0;top:0;width:34px;height:4px;border-radius:4px;offset-path:path('M 430 676 A 560 150 0 1 1 1550 676 A 560 150 0 1 1 430 676');offset-rotate:auto;offset-anchor:right center;background:linear-gradient(90deg,rgba(181,230,255,0),rgba(181,230,255,.7));animation:cx-sat 26s linear infinite}
.cx-sat::after{content:"";position:absolute;right:-3px;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:#fff;box-shadow:0 0 8px 2px rgba(181,230,255,.95),0 0 18px 4px rgba(79,182,230,.6)}
.cx-sat.g{background:linear-gradient(90deg,rgba(32,201,141,0),rgba(32,201,141,.75));animation-delay:-8.7s}.cx-sat.g::after{box-shadow:0 0 8px 2px rgba(150,255,210,.95),0 0 18px 4px rgba(32,201,141,.6)}
.cx-sat.s{background:linear-gradient(90deg,rgba(255,233,168,0),rgba(255,233,168,.75));animation-delay:-17.3s}.cx-sat.s::after{box-shadow:0 0 8px 2px rgba(255,233,168,.95),0 0 18px 4px rgba(217,166,80,.6)}
@keyframes cx-sat{from{offset-distance:0%}to{offset-distance:100%}}
@media (prefers-reduced-motion:reduce){.cx-star,.cx-sat,html[data-look=cosmos] *{animation-duration:0s!important;animation-iteration-count:1!important}}
/* the background picker (bottom corner, like the design's "רקע: …" chip) */
.cx-bg{position:fixed;left:20px;bottom:14px;z-index:30;height:32px;padding:0 12px;border-radius:99px;display:flex;align-items:center;gap:6px;font:600 11.5px var(--cx-font);color:#fff;
 background:rgba(3,8,20,.62);box-shadow:var(--cx-gl-sh);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);cursor:pointer;border:0;text-shadow:0 1px 2px rgba(0,0,0,.5)}
.cx-bg:hover{background:rgba(3,8,20,.78)}

/* ---------- glass, recessed, marbles: the shared pieces ---------- */
html[data-look=cosmos] .card,html[data-look=cosmos] .wcard,html[data-look=cosmos] .cx-win{position:relative;background:var(--cx-win);border:0;border-radius:26px;box-shadow:var(--cx-win-sh);
 backdrop-filter:blur(20px) saturate(175%) brightness(.92);-webkit-backdrop-filter:blur(20px) saturate(175%) brightness(.92);color:#fff}
html[data-look=cosmos] .wcard .wcard,html[data-look=cosmos] .card .wcard,html[data-look=cosmos] .card .card{background:var(--cx-rec);box-shadow:var(--cx-rec-sh);backdrop-filter:none;-webkit-backdrop-filter:none;border-radius:16px}
html[data-look=cosmos] .sb,html[data-look=cosmos] .lb,html[data-look=cosmos] small{color:var(--cx-mu)}
html[data-look=cosmos] .ch .t,html[data-look=cosmos] .wbar h2,html[data-look=cosmos] .card h3,html[data-look=cosmos] .wcard h3{font-weight:800;font-size:16px;color:#fff}
html[data-look=cosmos] .ch{gap:10px}
html[data-look=cosmos] .badge{background:rgba(255,255,255,.13);color:#fff;border:0;box-shadow:var(--cx-gl-sh);border-radius:99px;font-weight:600}
html[data-look=cosmos] .badge.hot{background:rgba(232,102,79,.28)}
html[data-look=cosmos] .badge.zero{background:rgba(255,255,255,.1);color:var(--cx-mu)}
/* numbers in the Unbounded face, like the design */
html[data-look=cosmos] .hk b,html[data-look=cosmos] .ktile b,html[data-look=cosmos] .kpi b,html[data-look=cosmos] .num,html[data-look=cosmos] .rstrip b,html[data-look=cosmos] .clock{font-family:var(--cx-num);font-weight:500;letter-spacing:-.01em}

/* buttons: glass pills; the main action is a white pill */
html[data-look=cosmos] .btn{background:rgba(255,255,255,.13);color:#fff;border:0;border-radius:999px;box-shadow:var(--cx-gl-sh);font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.4)}
html[data-look=cosmos] .btn:hover{background:rgba(255,255,255,.2)}
html[data-look=cosmos] .btn.g,html[data-look=cosmos] .btn.p,html[data-look=cosmos] .btn.primary,html[data-look=cosmos] .btn.wide{background:rgba(255,255,255,.95);color:#0b1626;text-shadow:none;font-weight:800;box-shadow:0 8px 20px -8px rgba(0,0,0,.5),inset 0 -2px 0 rgba(0,0,0,.08)}
html[data-look=cosmos] .btn.g:hover,html[data-look=cosmos] .btn.p:hover,html[data-look=cosmos] .btn.wide:hover{background:#fff}
html[data-look=cosmos] .btn.d,html[data-look=cosmos] .btn.danger,html[data-look=cosmos] .btn.bad{background:rgba(232,102,79,.3);color:#fff}
html[data-look=cosmos] .btn:disabled{opacity:.45}
html[data-look=cosmos] .ab{background:rgba(255,255,255,.13);color:#fff;border:0;border-radius:999px;box-shadow:var(--cx-gl-sh)}
html[data-look=cosmos] .ab:hover{background:rgba(255,255,255,.22)}
html[data-look=cosmos] .ab.p{background:rgba(255,255,255,.95);color:#0b1626;text-shadow:none;font-weight:700}
/* inputs are recessed into the glass */
html[data-look=cosmos] .f,html[data-look=cosmos] input:not([type=checkbox]):not([type=radio]):not([type=range]),html[data-look=cosmos] select,html[data-look=cosmos] textarea{background:rgba(2,8,20,.42);color:#fff;border:0;border-radius:14px;box-shadow:inset 0 1px 2px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.08)}
html[data-look=cosmos] input::placeholder,html[data-look=cosmos] textarea::placeholder{color:rgba(220,234,252,.55)}
html[data-look=cosmos] .f:focus,html[data-look=cosmos] input:focus,html[data-look=cosmos] select:focus,html[data-look=cosmos] textarea:focus{outline:0;box-shadow:inset 0 0 0 1.5px rgba(181,230,255,.8),0 0 16px rgba(79,182,230,.35)}
html[data-look=cosmos] select option{background:#0c1a33;color:#fff}
html[data-look=cosmos] :focus-visible{outline:2px solid var(--cx-ice);outline-offset:2px}
/* tabs and segmented controls: a glass track with a white selected pill */
html[data-look=cosmos] .tabs,html[data-look=cosmos] .tabs2,html[data-look=cosmos] .segs,html[data-look=cosmos] .subtabs,html[data-look=cosmos] .mode,html[data-look=cosmos] .bzseg{background:rgba(255,255,255,.1);border:0;border-radius:999px;padding:4px;box-shadow:var(--cx-gl-sh);gap:2px}
html[data-look=cosmos] .tabs button,html[data-look=cosmos] .tabs2 .t2,html[data-look=cosmos] .segs button,html[data-look=cosmos] .subtabs button,html[data-look=cosmos] .mode button,html[data-look=cosmos] .bzseg button{border-radius:999px;color:#fff;font-weight:600;background:none;border:0;box-shadow:none}
html[data-look=cosmos] .tabs button.on,html[data-look=cosmos] .tabs2 .t2.on,html[data-look=cosmos] .segs button.on,html[data-look=cosmos] .subtabs button.on,html[data-look=cosmos] .subtabs button[aria-selected=true],html[data-look=cosmos] .mode button.on,html[data-look=cosmos] .bzseg button.on{background:rgba(255,255,255,.95);color:#0b1626;text-shadow:none;font-weight:800;box-shadow:0 4px 10px -4px rgba(0,0,0,.4)}
/* tables float as rows of glass */
/* (the quote document is white paper: its table keeps its own colours and lines) */
html[data-look=cosmos] table:not(.qdoc table){color:#fff}
html[data-look=cosmos] th:not(.qdoc th){color:var(--cx-mu);font-weight:500;font-size:11px;border-color:rgba(255,255,255,.1)!important;background:none}
html[data-look=cosmos] td:not(.qdoc td){border-color:rgba(255,255,255,.07)!important}
html[data-look=cosmos] tr.click:hover td,html[data-look=cosmos] .tbl tbody tr:hover td{background:rgba(255,255,255,.06)}
/* scrollbars */
html[data-look=cosmos] .scroll,html[data-look=cosmos] .wpage{scrollbar-color:rgba(255,255,255,.22) transparent;scrollbar-width:thin}
/* round avatars are glass marbles with a coloured ring */
html[data-look=cosmos] .av{border-radius:50%;color:#fff;font-weight:700;text-shadow:0 1px 2px rgba(0,8,24,.85),0 0 6px rgba(0,8,24,.5);background:var(--cx-m-blue);box-shadow:var(--cx-m-sh),0 0 0 2px var(--cx-avring,rgba(181,230,255,.55))}
html[data-look=cosmos] .av svg,html[data-look=cosmos] .av img{border-radius:50%}
/* chips */
html[data-look=cosmos] .stg,html[data-look=cosmos] .chip,html[data-look=cosmos] .tag{background:rgba(255,255,255,.12);color:#fff;border:0;box-shadow:var(--cx-gl-sh)}
/* modal dialogs: a solid glass window */
html[data-look=cosmos] .modal{background:rgba(1,5,14,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
html[data-look=cosmos] .dlg{background:var(--cx-win-solid);border:0;border-radius:28px;box-shadow:var(--cx-win-sh);color:#fff}
html[data-look=cosmos] .toast{background:rgba(6,14,32,.92);color:#fff;border:0;border-radius:99px;box-shadow:var(--cx-win-sh);backdrop-filter:blur(14px)}
html[data-look=cosmos] .empty,html[data-look=cosmos] .empty2{color:var(--cx-sub)}

/* ---------- the shell: the floating rail on the right, the floating header pill on top ---------- */
html[data-look=cosmos] .app{grid-template-columns:1fr;position:relative}
html[data-look=cosmos] nav{position:fixed;z-index:20;right:20px;top:50%;transform:translateY(-50%);width:70px;max-height:calc(100vh - 40px);padding:12px 0;gap:10px;border:0;border-radius:999px;
 background:var(--cx-win);box-shadow:var(--cx-win-sh);backdrop-filter:blur(20px) saturate(175%) brightness(.92);-webkit-backdrop-filter:blur(20px) saturate(175%) brightness(.92);overflow-y:auto;scrollbar-width:none}
html[data-look=cosmos] nav::-webkit-scrollbar{display:none}
html[data-look=cosmos] nav .logo,html[data-look=cosmos] nav .ng,html[data-look=cosmos] nav .sp{display:none}
html[data-look=cosmos] nav .nv{width:auto;padding:0;gap:4px;background:none!important;font-size:11px;font-weight:600;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.7)}
html[data-look=cosmos] nav .nv .i{position:relative;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;color:#fff;background:var(--cx-m-blue);box-shadow:var(--cx-m-sh);transition:transform .2s,width .2s,height .2s}
html[data-look=cosmos] nav .nv .i::before{content:"";position:absolute;top:6%;right:24%;width:30%;height:16%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(255,255,255,0));transform:rotate(28deg);pointer-events:none;z-index:1}
html[data-look=cosmos] nav .nv .i .oi{position:relative;z-index:2;width:19px!important;height:19px!important;margin:0;filter:drop-shadow(0 1px 1.5px rgba(0,8,24,.85))}
html[data-look=cosmos] nav .nv:hover .i{transform:translateY(-1px) scale(1.04)}
html[data-look=cosmos] nav .nv.on{font-weight:700}
html[data-look=cosmos] nav .nv.on .i{width:48px;height:48px;box-shadow:var(--cx-m-sh),0 0 0 3px rgba(255,255,255,.18),0 0 22px rgba(79,182,230,.55)}
html[data-look=cosmos] nav .nv[data-nav=dial] .i{background:var(--cx-m-green)}
html[data-look=cosmos] nav .nv[data-nav=ai] .i{background:var(--cx-m-ai)}
html[data-look=cosmos] nav .nv[data-nav=team] .i,html[data-look=cosmos] nav .nv[data-nav=biz] .i{background:var(--cx-m-gold)}
html[data-look=cosmos] nav .nv#logout .i{background:var(--cx-m-slate);color:#0b1626}
html[data-look=cosmos] nav .nv.meav .i{background:none;box-shadow:none;width:40px;height:40px}
html[data-look=cosmos] nav .nv.meav .i::before{display:none}
html[data-look=cosmos] nav .nv.meav .i>*{width:40px;height:40px;border-radius:50%;box-shadow:var(--cx-m-sh)}
html[data-look=cosmos] nav .nv .nbadge,html[data-look=cosmos] nav .nv b{position:absolute}

html[data-look=cosmos] main{padding:104px 112px 18px 24px;gap:14px;grid-template-rows:minmax(0,1fr);position:relative}
html[data-look=cosmos] header{position:fixed;z-index:19;top:24px;left:calc(50% - 46px);transform:translateX(-50%);max-width:calc(100vw - 150px);display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:24px;flex-wrap:nowrap;
 background:var(--cx-win);box-shadow:var(--cx-win-sh);backdrop-filter:blur(20px) saturate(175%) brightness(.92);-webkit-backdrop-filter:blur(20px) saturate(175%) brightness(.92)}
html[data-look=cosmos] header>div:first-child{display:flex;align-items:center;gap:10px;min-width:0}
html[data-look=cosmos] header .cx-brand{display:flex;align-items:center;gap:8px;direction:ltr;flex:none;padding-left:12px;border-left:1px solid rgba(255,255,255,.18)}
html[data-look=cosmos] header .cx-brand span{font-family:var(--cx-num);font-weight:600;font-size:17px;letter-spacing:-.03em;color:#fff}
html[data-look=cosmos] header .h1{font-weight:700;font-size:14px;white-space:nowrap;order:1}
html[data-look=cosmos] header .over{font-size:11px;letter-spacing:0;color:var(--cx-mu);opacity:1;font-weight:500;white-space:nowrap;order:2}
html[data-look=cosmos] header>div:first-child>div:not(.cx-brand){display:flex;flex-direction:column;line-height:1.25}
html[data-look=cosmos] header .hkpis{display:flex;gap:0;align-items:center;padding-right:12px;border-right:1px solid rgba(255,255,255,.18)}
html[data-look=cosmos] header .hk{background:none!important;border:0!important;box-shadow:none!important;padding:2px 11px;min-width:0;text-align:center;border-radius:14px;backdrop-filter:none}
html[data-look=cosmos] header .hk span{display:block;font-size:11px;color:var(--cx-mu);font-weight:500;white-space:nowrap}
html[data-look=cosmos] header .hk b{display:block;font-family:var(--cx-num);font-weight:500;font-size:15px;line-height:1.35;color:#fff}
html[data-look=cosmos] header .hk.ok b,html[data-look=cosmos] header .hk b.ok{color:var(--cx-mint)}
html[data-look=cosmos] header .hk.bad b,html[data-look=cosmos] header .hk b.bad{color:var(--cx-hot)}
html[data-look=cosmos] header .hk.ob-more,html[data-look=cosmos] header .hk.more{background:rgba(255,255,255,.13)!important;box-shadow:var(--cx-gl-sh)!important}
html[data-look=cosmos] header .hk .hkbar,html[data-look=cosmos] header .hk i.bar{display:none}
html[data-look=cosmos] header .hl{display:flex;gap:8px;align-items:center}
html[data-look=cosmos] header .pill{height:34px;padding:0 12px;display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.13);border:0;border-radius:999px;box-shadow:var(--cx-gl-sh);color:#fff;font-weight:600;font-size:12.5px}
html[data-look=cosmos] header .pill:hover{background:rgba(255,255,255,.2)}
html[data-look=cosmos] header #meName,html[data-look=cosmos] header #lineState,html[data-look=cosmos] header .clock{display:none}
html[data-look=cosmos] header .inboxbtn,html[data-look=cosmos] header .helpbtn,html[data-look=cosmos] header .lang{position:relative;width:32px;height:32px;padding:0;justify-content:center;border-radius:50%;background:var(--cx-m-blue);box-shadow:var(--cx-m-sh);font-size:10px;font-weight:800}
html[data-look=cosmos] header .inboxbtn::before,html[data-look=cosmos] header .helpbtn::before,html[data-look=cosmos] header .lang::before{content:"";position:absolute;top:6%;right:24%;width:30%;height:16%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(255,255,255,0));transform:rotate(28deg);pointer-events:none}
html[data-look=cosmos] header .inboxbtn .oi{width:17px;height:17px;margin:0}
html[data-look=cosmos] header .inboxbtn b{position:absolute;top:-4px;left:-4px;z-index:2;min-width:15px;height:15px;border-radius:50%;background:radial-gradient(circle at 35% 28%,#ffd2b8,#f26a2e 60%,#b23c0b);font:700 9.5px/12px var(--cx-font);color:#fff;display:flex;align-items:center;justify-content:center;border:1.5px solid rgba(255,255,255,.8);padding:0 2px}
html[data-look=cosmos] header .inboxbtn b:empty{display:none}
html[data-look=cosmos] header .lbp .oi{color:#fff;width:15px;height:15px;margin:0}
html[data-look=cosmos] header .lbp::before{content:"";width:22px;height:22px;border-radius:50%;flex:none;margin-inline-start:-6px;background:var(--cx-m-gold);box-shadow:var(--cx-m-sh);order:-1}
html[data-look=cosmos] header .lbp{position:relative;padding-inline-start:10px}
html[data-look=cosmos] header .lbp .oi{position:absolute;inset-inline-start:9.5px;top:9.5px}
html[data-look=cosmos] header .presence{padding:0 10px 0 8px}
html[data-look=cosmos] header .qtoggle{background:rgba(255,255,255,.13);border-radius:999px;color:#fff;box-shadow:var(--cx-gl-sh)}
/* the person on the far left of the header (the design: a marble, name and role) */
html[data-look=cosmos] header .cx-me{display:flex;align-items:center;gap:7px;padding-right:8px;border-right:1px solid rgba(255,255,255,.18)}
html[data-look=cosmos] header .cx-me .av{width:32px;height:32px;font-size:12px;box-shadow:var(--cx-m-sh)}
html[data-look=cosmos] header .cx-me div{line-height:1.2}
html[data-look=cosmos] header .cx-me b{display:block;font-weight:600;font-size:12px}
html[data-look=cosmos] header .cx-me small{display:block;font-size:10px;color:#e9d5ff}
html[data-look=cosmos] .feedline{display:none}
/* screens sit below the header */
html[data-look=cosmos] .page{min-height:0}
html[data-look=cosmos] .wpage{padding:0}

/* ---------- narrow screens: the rail goes to the bottom, the header to the top edge ---------- */
@media (max-width:1100px){
 html[data-look=cosmos] header{left:12px;right:12px;transform:none;max-width:none;overflow-x:auto;scrollbar-width:none}
 html[data-look=cosmos] main{padding:94px 96px 18px 16px}
}
@media (max-width:760px){
 html[data-look=cosmos] nav{top:auto;bottom:10px;right:10px;left:10px;transform:none;width:auto;height:72px;flex-direction:row;justify-content:space-around;padding:0 10px;overflow-x:auto}
 html[data-look=cosmos] nav .nv .i{width:36px;height:36px}html[data-look=cosmos] nav .nv.on .i{width:42px;height:42px}
 html[data-look=cosmos] main{padding:84px 12px 96px 12px}
 html[data-look=cosmos] header{top:10px;left:10px;right:10px;border-radius:20px}
 .cx-bg{display:none}
}

/* ---------- line icons (orbit.js swaps the old text symbols for these; generated block, see tools/make_orbit_icons.py) ---------- */
html[data-orbit] .oi{margin-inline-end:.3em;overflow:hidden;white-space:nowrap;text-indent:-9999px;font-style:normal;pointer-events:none}
html[data-orbit] nav .i .oi,html[data-orbit] .cb .oi,html[data-orbit] .oc>span .oi,html[data-orbit] .tli2 .ic .oi,html[data-orbit] .pill .oi:only-child,html[data-orbit] button>.oi:only-child{margin:0}
/* ICONS:start (generated by tools/make_orbit_icons.py, do not edit by hand) */
.oi{display:inline-block;width:1.15em;height:1.15em;flex:none;vertical-align:-.2em;background:currentColor;-webkit-mask:var(--oi) center/contain no-repeat;mask:var(--oi) center/contain no-repeat}
.oi[data-i=phone]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8.1 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E")}
.oi[data-i=hangup]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.7 13.3a16 16 0 0 0 3.4 2.6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2v3a2 2 0 0 1-2.2 2A19.8 19.8 0 0 1 3 4.2 2 2 0 0 1 5 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.4 2.1L9 9.9'/%3E%3Cpath d='M22 2 2 22'/%3E%3C/svg%3E")}
.oi[data-i=home]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5 12 3l9 7.5'/%3E%3Cpath d='M5 9.5V21h14V9.5'/%3E%3Cpath d='M10 21v-6h4v6'/%3E%3C/svg%3E")}
.oi[data-i=planet]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Cpath d='M4.5 15.5C2.3 17.8 1.6 19.7 2.4 20.6c1.5 1.5 6.8-1 11.8-6s7.5-10.3 6-11.8c-.9-.8-2.8-.1-5.1 2.1'/%3E%3C/svg%3E")}
.oi[data-i=users]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3.5'/%3E%3Cpath d='M2.5 20v-1a5 5 0 0 1 5-5h3a5 5 0 0 1 5 5v1'/%3E%3Cpath d='M16 4.6a3.5 3.5 0 0 1 0 6.8M21.5 20v-1a5 5 0 0 0-3.5-4.8'/%3E%3C/svg%3E")}
.oi[data-i=calendar]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4.5' width='18' height='17' rx='3'/%3E%3Cpath d='M8 2.5v4M16 2.5v4M3 10h18'/%3E%3Ccircle cx='12' cy='15.5' r='1.4'/%3E%3C/svg%3E")}
.oi[data-i=spark]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.5l2.1 5.6 5.9 2.1-5.9 2.1L12 18l-2.1-5.7L4 10.2l5.9-2.1z'/%3E%3Cpath d='M19 15.5l.8 2 2 .8-2 .8-.8 2-.8-2-2-.8 2-.8z'/%3E%3C/svg%3E")}
.oi[data-i=radar]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Cpath d='M12 12 18.5 5.5'/%3E%3Ccircle cx='12' cy='12' r='1.2'/%3E%3C/svg%3E")}
.oi[data-i=sliders]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21v-7M4 10V3M12 21v-9M12 8V3M20 21v-5M20 12V3M1.5 14h5M9.5 8h5M17.5 16h5'/%3E%3C/svg%3E")}
.oi[data-i=logout]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5M21 12H9'/%3E%3C/svg%3E")}
.oi[data-i=sun]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4'/%3E%3C/svg%3E")}
.oi[data-i=moon]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 14.5A8.5 8.5 0 1 1 9.5 3.5a7 7 0 0 0 11 11z'/%3E%3C/svg%3E")}
.oi[data-i=check]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.oi[data-i=doc]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2.5H6.5a2 2 0 0 0-2 2v15a2 2 0 0 0 2 2h11a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 2.5V8h5.5M8.5 13h7M8.5 17h4.5'/%3E%3C/svg%3E")}
.oi[data-i=repeat]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 12a8.5 8.5 0 1 1-2.5-6'/%3E%3Cpath d='M20.5 3.5V8H16'/%3E%3C/svg%3E")}
.oi[data-i=ban]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M5.6 5.6l12.8 12.8'/%3E%3C/svg%3E")}
.oi[data-i=micoff]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 9v3a3 3 0 0 0 5.1 2.1M15 9.3V5a3 3 0 0 0-5.7-1.3'/%3E%3Cpath d='M19 11a7 7 0 0 1-1 3.6M5 11a7 7 0 0 0 11.3 5.5M12 18v3.5M2 2l20 20'/%3E%3C/svg%3E")}
.oi[data-i=pause]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='4.5' width='4' height='15' rx='1.2'/%3E%3Crect x='14' y='4.5' width='4' height='15' rx='1.2'/%3E%3C/svg%3E")}
.oi[data-i=swap]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 3l4 4-4 4M21 7H9M7 21l-4-4 4-4M3 17h12'/%3E%3C/svg%3E")}
.oi[data-i=more]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='5' cy='12' r='1.3'/%3E%3Ccircle cx='12' cy='12' r='1.3'/%3E%3Ccircle cx='19' cy='12' r='1.3'/%3E%3C/svg%3E")}
.oi[data-i=keypad]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='5' r='1.4'/%3E%3Ccircle cx='12' cy='5' r='1.4'/%3E%3Ccircle cx='18' cy='5' r='1.4'/%3E%3Ccircle cx='6' cy='11' r='1.4'/%3E%3Ccircle cx='12' cy='11' r='1.4'/%3E%3Ccircle cx='18' cy='11' r='1.4'/%3E%3Ccircle cx='6' cy='17' r='1.4'/%3E%3Ccircle cx='12' cy='17' r='1.4'/%3E%3Ccircle cx='18' cy='17' r='1.4'/%3E%3Ccircle cx='12' cy='22' r='1'/%3E%3C/svg%3E")}
.oi[data-i=backspace]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 5H9l-6.5 7L9 19h12a1.5 1.5 0 0 0 1.5-1.5v-11A1.5 1.5 0 0 0 21 5z'/%3E%3Cpath d='M17.5 9l-6 6M11.5 9l6 6'/%3E%3C/svg%3E")}
.oi[data-i=pip]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='4' width='19' height='16' rx='3'/%3E%3Crect x='12' y='11.5' width='7' height='6' rx='1.5'/%3E%3C/svg%3E")}
.oi[data-i=clipboard]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='18' rx='2.5'/%3E%3Cpath d='M9 2.5h6v3H9zM8.5 11h7M8.5 15h5'/%3E%3C/svg%3E")}
.oi[data-i=bulb]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6M10 21.5h4'/%3E%3Cpath d='M12 2.5a6.5 6.5 0 0 0-4 11.6c.7.6 1 1.4 1 2.4V17h6v-.5c0-1 .4-1.8 1-2.4A6.5 6.5 0 0 0 12 2.5z'/%3E%3C/svg%3E")}
.oi[data-i=trophy]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 21h8M12 17v4M7 3.5h10v5a5 5 0 0 1-10 0z'/%3E%3Cpath d='M17 5h3v2a3 3 0 0 1-3 3M7 5H4v2a3 3 0 0 0 3 3'/%3E%3C/svg%3E")}
.oi[data-i=inbox]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 13.5V18a2.5 2.5 0 0 0 2.5 2.5h13A2.5 2.5 0 0 0 21 18v-4.5'/%3E%3Cpath d='M3 13.5 5.8 5a2 2 0 0 1 1.9-1.5h8.6a2 2 0 0 1 1.9 1.5l2.8 8.5H15.5l-1 2.5h-5l-1-2.5z'/%3E%3C/svg%3E")}
.oi[data-i=list]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 6h13M8 12h13M8 18h13'/%3E%3Ccircle cx='3.5' cy='6' r='1'/%3E%3Ccircle cx='3.5' cy='12' r='1'/%3E%3Ccircle cx='3.5' cy='18' r='1'/%3E%3C/svg%3E")}
.oi[data-i=sort]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M6 12h12M10 18h4'/%3E%3C/svg%3E")}
.oi[data-i=plus]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E")}
.oi[data-i=redial]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3.5h5.5V9'/%3E%3Cpath d='M20.5 3.5 14 10'/%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8.1 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E")}
.oi[data-i=mic]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='2.5' width='6' height='12' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0M12 18v3.5'/%3E%3C/svg%3E")}
.oi[data-i=expand]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7'/%3E%3C/svg%3E")}
.oi[data-i=close]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E")}
.oi[data-i=sunrise]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v5M5.6 9.6l1.4 1.4M18.4 9.6 17 11M2 18h20M7 18a5 5 0 0 1 10 0'/%3E%3C/svg%3E")}
.oi[data-i=chart]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18M6 17V11M11 17V6M16 17v-8M21 17V3.5'/%3E%3C/svg%3E")}
.oi[data-i=mail]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='4.5' width='19' height='15' rx='2.5'/%3E%3Cpath d='M3 7l9 6 9-6'/%3E%3C/svg%3E")}
.oi[data-i=bolt]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2.5 4.5 14H12l-1 7.5L19.5 10H12z'/%3E%3C/svg%3E")}
.oi[data-i=flame]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22a7 7 0 0 0 7-7c0-4-3-6.5-4-10-2 2-2.5 4-2.5 5.5C11 9 10 7.5 10 6c-2.5 2-5 5-5 9a7 7 0 0 0 7 7z'/%3E%3C/svg%3E")}
.oi[data-i=target]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Ccircle cx='12' cy='12' r='1.3'/%3E%3C/svg%3E")}
.oi[data-i=rocket]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 15c-1.5 1.3-2 5-2 5s3.7-.5 5-2c.7-.8.7-2.1-.1-2.9a2.2 2.2 0 0 0-2.9-.1z'/%3E%3Cpath d='M12 15l-3-3a22 22 0 0 1 2-3.9A12.9 12.9 0 0 1 22 2c0 2.7-.8 7.5-6 11a22.4 22.4 0 0 1-4 2z'/%3E%3Cpath d='M9 12H4s.5-3 2-4c1.6-1.1 5 0 5 0M12 15v5s3-.5 4-2c1.1-1.6 0-5 0-5'/%3E%3C/svg%3E")}
.oi[data-i=eye]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E")}
.oi[data-i=lock]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='10.5' width='16' height='11' rx='2.5'/%3E%3Cpath d='M8 10.5V7a4 4 0 0 1 8 0v3.5'/%3E%3C/svg%3E")}
.oi[data-i=tag]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.6 13.4 13.4 20.6a2 2 0 0 1-2.8 0L3 13V3h10l7.6 7.6a2 2 0 0 1 0 2.8z'/%3E%3Ccircle cx='7.5' cy='7.5' r='1.3'/%3E%3C/svg%3E")}
.oi[data-i=pin]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21.5s7-6.2 7-12a7 7 0 0 0-14 0c0 5.8 7 12 7 12z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E")}
.oi[data-i=star]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.8l2.8 5.8 6.4.9-4.6 4.5 1.1 6.3L12 17.3l-5.7 3 1.1-6.3L2.8 9.5l6.4-.9z'/%3E%3C/svg%3E")}
.oi[data-i=warn]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.3 3.9 1.9 18a2 2 0 0 0 1.7 3h16.8a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/%3E%3Cpath d='M12 9v4.5M12 17.5h.01'/%3E%3C/svg%3E")}
.oi[data-i=hand]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 11.5V6a1.8 1.8 0 0 0-3.6 0v4.5M14.4 10V4a1.8 1.8 0 0 0-3.6 0v6M10.8 10.5V5.5a1.8 1.8 0 0 0-3.6 0V14'/%3E%3Cpath d='M18 9.5a1.8 1.8 0 0 1 3.6 0V14a8 8 0 0 1-8 8h-1.9a8 8 0 0 1-5.7-2.4L3.2 16.8a1.8 1.8 0 0 1 2.5-2.6L7.2 15.6'/%3E%3C/svg%3E")}
.oi[data-i=headset]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 14v-2a9 9 0 0 1 18 0v2'/%3E%3Cpath d='M21 15a2 2 0 0 1-2 2h-1.5v-6H19a2 2 0 0 1 2 2zM3 15a2 2 0 0 0 2 2h1.5v-6H5a2 2 0 0 0-2 2z'/%3E%3C/svg%3E")}
.oi[data-i=wave]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12h2M6 8v8M10 4v16M14 7v10M18 9.5v5M22 12h0'/%3E%3C/svg%3E")}
.oi[data-i=money]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='6' width='19' height='12' rx='2.5'/%3E%3Ccircle cx='12' cy='12' r='2.6'/%3E%3Cpath d='M6 9.5v.01M18 14.5v.01'/%3E%3C/svg%3E")}
.oi[data-i=globe]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18'/%3E%3C/svg%3E")}
.oi[data-i=pencil]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20h4L19 9a2.8 2.8 0 0 0-4-4L4 16z'/%3E%3Cpath d='M13.5 6.5l4 4'/%3E%3C/svg%3E")}
.oi[data-i=history]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 2.6-6.4L3 8'/%3E%3Cpath d='M3 3.5V8h4.5M12 7.5V12l3 2'/%3E%3C/svg%3E")}
.oi[data-i=upload]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15V3.5M7 8l5-5 5 5'/%3E%3Cpath d='M4 15v3.5A2.5 2.5 0 0 0 6.5 21h11a2.5 2.5 0 0 0 2.5-2.5V15'/%3E%3C/svg%3E")}
.oi[data-i=whisper]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 15a8 8 0 0 0 3 2.5L6 21l4-2a8 8 0 1 0-6-4z'/%3E%3Cpath d='M9 12h.01M12 12h.01M15 12h.01'/%3E%3C/svg%3E")}
.oi[data-i=takeover]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.5l8 4v5c0 5-3.4 8.6-8 10-4.6-1.4-8-5-8-10v-5z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E")}
.oi[data-i=card]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='5' width='19' height='14' rx='2.5'/%3E%3Cpath d='M2.5 10h19M6.5 15h3'/%3E%3C/svg%3E")}
.oi[data-i=megaphone]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5v3a1.5 1.5 0 0 0 1.5 1.5H7l7 4.5v-15L7 9H4.5A1.5 1.5 0 0 0 3 10.5z'/%3E%3Cpath d='M18 9a4 4 0 0 1 0 6M8 15l1.5 5'/%3E%3C/svg%3E")}
.oi[data-i=flow]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='5' cy='6' r='2.5'/%3E%3Ccircle cx='19' cy='6' r='2.5'/%3E%3Ccircle cx='12' cy='18' r='2.5'/%3E%3Cpath d='M7.5 6h9M6.5 8.2l4.2 7.6M17.5 8.2l-4.2 7.6'/%3E%3C/svg%3E")}
.oi[data-i=rec]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Ccircle cx='12' cy='12' r='3.5'/%3E%3C/svg%3E")}
.oi[data-i=shield]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.5l8 3.5v5.5c0 5-3.4 8.6-8 10-4.6-1.4-8-5-8-10V6z'/%3E%3C/svg%3E")}
.oi[data-i=building]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21.5V4.5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v17M16 9.5h2a2 2 0 0 1 2 2v10M2.5 21.5h19'/%3E%3Cpath d='M8 7h4M8 11h4M8 15h4'/%3E%3C/svg%3E")}
.oi[data-i=receipt]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 2.5h14v19l-2.5-1.5-2.3 1.5-2.2-1.5-2.2 1.5-2.3-1.5L5 21.5z'/%3E%3Cpath d='M9 8h6M9 12h6M9 16h3'/%3E%3C/svg%3E")}
.oi[data-i=chat]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.4 8.4 0 0 1-12.3 7.5L3 21l2-5.3A8.5 8.5 0 1 1 21 11.5z'/%3E%3C/svg%3E")}
.oi[data-i=play]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 4.5v15l12-7.5z'/%3E%3C/svg%3E")}
.oi[data-i=pawn]{--oi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='5.6' r='2.6'/%3E%3Cpath d='M9.6 9.6h4.8M10.4 9.6c0 3.4-.6 6-1.9 8.4h7c-1.3-2.4-1.9-5-1.9-8.4'/%3E%3Cpath d='M7.5 18h9c.6 0 1 .5 1 1v2h-11v-2c0-.5.4-1 1-1z'/%3E%3C/svg%3E")}
/* ICONS:end */

/* =================================== THE DIAL SCREEN (canvas: חייגן) ===================================
   Queue on the right, the dialer and SAN in the middle, the customer card on the left. The side windows lean in a little (the cockpit). */
html[data-look=cosmos] #page-dial.grid{justify-content:center;gap:26px;perspective:1700px}
@media (min-width:1151px){html[data-look=cosmos] #page-dial.grid{grid-template-columns:minmax(260px,330px) minmax(440px,600px) minmax(280px,330px)!important}}
@media (min-width:1280px){
 html[data-look=cosmos] #page-dial .col.r{transform:rotateY(-12deg) translateZ(-20px);transform-origin:left center}
 html[data-look=cosmos] #page-dial .col.l{transform:rotateY(12deg) translateZ(-20px);transform-origin:right center}
}
html[data-look=cosmos] #page-dial .col.c{gap:16px!important}
html[data-look=cosmos] #page-dial .col.c .card.dialer{margin-bottom:0!important}
html[data-look=cosmos] #page-dial .card{box-shadow:var(--cx-win-sh)!important}

/* --- the queue --- */
html[data-look=cosmos] #page-dial .col.r .card{padding:16px 12px}
html[data-look=cosmos] #page-dial .col.r .ch{padding:0 6px 2px}
html[data-look=cosmos] #page-dial .col.r .ch .t{font-size:17px;font-weight:700}
html[data-look=cosmos] .qauto{margin:0 6px 6px}
html[data-look=cosmos] .qauto .auto{color:#fff!important;font-weight:600}
html[data-look=cosmos] .auto .sw{background:rgba(2,8,20,.38)!important;box-shadow:inset 0 1px 2px rgba(0,0,0,.28)}
html[data-look=cosmos] .auto .sw::after{background:radial-gradient(circle at 35% 28%,#ffffff,#c8d6dd 55%,#5f7a87)!important;box-shadow:0 2px 4px rgba(0,0,0,.4)!important}
html[data-look=cosmos] .auto.on .sw::after{background:radial-gradient(circle at 35% 28%,#e3fff3,#20c98d 45%,#0a5e42)!important}
html[data-look=cosmos] .qsearch{gap:6px}
html[data-look=cosmos] .qsearch input{height:34px;border-radius:999px!important;padding:0 14px}
html[data-look=cosmos] .qsearch .ab{width:34px;height:34px;border-radius:50%;background:var(--cx-m-blue);box-shadow:var(--cx-m-sh)}
html[data-look=cosmos] #queue{display:flex;flex-direction:column;gap:2px;padding-top:6px}
html[data-look=cosmos] #queue .q{display:flex;align-items:center;gap:9px!important;padding:5px 8px;border:0;border-radius:18px;background:none;color:#fff;text-align:start;box-shadow:none;min-height:56px}
html[data-look=cosmos] #queue .q:hover{background:rgba(255,255,255,.07)}
html[data-look=cosmos] #queue .q.sel{padding:10px;margin:4px 0;background:rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 0 0 1px rgba(255,255,255,.18)}
html[data-look=cosmos] #queue .q.done{opacity:.55}
html[data-look=cosmos] #queue .q .nm{font-weight:500;font-size:13px}
html[data-look=cosmos] #queue .q.sel .nm{font-weight:700}
html[data-look=cosmos] #queue .q .sb{font-size:12px;color:var(--cx-sub)}
/* the avatar: a dark marble inside a ring that shows the deal's heat */
html[data-look=cosmos] #queue .q .av{--c1:#b5e6ff;--c2:#4fb6e6;--gl:rgba(79,182,230,.55);position:relative;width:38px;height:38px;flex:none;margin:4px;font-size:0;
 background:radial-gradient(circle at 32% 20%,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 22%),radial-gradient(circle at 35% 30%,#4a5566,#1c2433 55%,#070b14);
 box-shadow:inset 0 -6px 10px rgba(0,0,0,.3),inset 0 3px 6px rgba(255,255,255,.5),0 0 0 2px rgba(6,14,32,.9),0 0 0 4px var(--c2),0 0 14px var(--gl)}
html[data-look=cosmos] #queue .q .av::after{content:attr(data-ini);font-size:11.5px;font-weight:700;color:#fff;position:relative;z-index:2}
html[data-look=cosmos] #queue .q .av .mbr{display:none}
html[data-look=cosmos] #queue .q.sel .av{width:43px;height:43px}
html[data-look=cosmos] #queue .q.h-hot .av{--c2:#e8664f;--gl:rgba(232,102,79,.75)}
html[data-look=cosmos] #queue .q.h-warm .av{--c2:#e0883a;--gl:rgba(224,136,58,.7)}
html[data-look=cosmos] #queue .q.h-new .av{--c2:#4fb6e6;--gl:rgba(79,182,230,.65)}
html[data-look=cosmos] #queue .q.h-cold .av{--c2:#8fa6c4;--gl:rgba(143,166,196,.35)}
html[data-look=cosmos] #queue .q .qtag{display:flex;flex-direction:column;align-items:flex-end;gap:1px;flex:none;margin-inline-start:auto}
html[data-look=cosmos] #queue .q .qtag b{font-size:11px;font-weight:600;color:#a9c8ff}
html[data-look=cosmos] #queue .q.h-hot .qtag b{color:#ffb4b4}
html[data-look=cosmos] #queue .q.h-warm .qtag b{color:#ffc29a}
html[data-look=cosmos] #queue .q .qtag i{font-style:normal;font-size:10px;color:var(--cx-mu)}
html[data-look=cosmos] #queue .q .qtag em{order:-1;font-style:normal;font-size:10.5px;font-weight:700;color:#1c1917;background:rgba(255,255,255,.9);border-radius:99px;padding:1px 8px;text-shadow:none}

/* --- the dialer window --- */
html[data-look=cosmos] #page-dial .card.dialer{padding:18px 20px!important;gap:10px!important;align-items:stretch;min-height:0!important}
html[data-look=cosmos] #page-dial .numrow{position:relative;gap:10px}
html[data-look=cosmos] body #page-dial .numrow .big{flex:1;flex-direction:column-reverse!important;align-items:center!important;justify-content:center!important;gap:2px!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important;min-height:0}
html[data-look=cosmos] body #page-dial .numrow .big .numin{width:100%;background:none!important;box-shadow:none!important;border:0;text-align:center;direction:ltr;font:700 27px/1.2 var(--cx-font);letter-spacing:.6px;color:#fff;padding:0;height:auto}
html[data-look=cosmos] body #page-dial .numrow .big .numin::placeholder{font-size:20px;font-weight:600;letter-spacing:0;color:rgba(220,234,252,.55)}
html[data-look=cosmos] body #page-dial .numrow .big small{order:0!important;max-width:100%!important;font-size:12px!important;font-weight:400!important;color:var(--cx-sub)!important;text-align:center}
html[data-look=cosmos] #page-dial .numrow .cb,html[data-look=cosmos] #page-dial .card.dialer .cb{position:relative;width:32px;height:32px;border-radius:50%!important;border:0!important;background:var(--cx-m-blue)!important;box-shadow:var(--cx-m-sh)!important;color:#fff!important;display:flex;align-items:center;justify-content:center}
html[data-look=cosmos] #page-dial .card.dialer .cb::before,html[data-look=cosmos] .cx-marble::before{content:"";position:absolute;top:6%;right:24%;width:30%;height:16%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(255,255,255,0));transform:rotate(28deg);pointer-events:none;z-index:1}
html[data-look=cosmos] #page-dial .card.dialer .cb .oi{position:relative;z-index:2;width:17px!important;height:17px!important;filter:drop-shadow(0 1px 1.5px rgba(0,8,24,.85))}
html[data-look=cosmos] #page-dial .card.dialer .cb:disabled{opacity:.45}
html[data-look=cosmos] #page-dial .numrow #bFloat{width:auto;height:26px;border-radius:999px!important;padding:0 12px;background:rgba(255,255,255,.13)!important;box-shadow:var(--cx-gl-sh)!important;font-size:12px;position:absolute;top:-38px;left:0}
html[data-look=cosmos] #page-dial .numrow #bFloat::before{display:none}
html[data-look=cosmos] #page-dial .numrow #bFloat span{display:inline!important;font-size:12px}
html[data-look=cosmos] #page-dial .numrow #bFloat .oi{display:none}
html[data-look=cosmos] #page-dial .card.dialer .pad{gap:8px;max-width:300px;margin:0 auto}
html[data-look=cosmos] #page-dial .card.dialer .pad button{height:44px;border-radius:999px;background:rgba(255,255,255,.1);box-shadow:var(--cx-gl-sh);border:0;color:#fff;font-family:var(--cx-num)}
html[data-look=cosmos] #page-dial .card.dialer .pad button:hover{background:rgba(255,255,255,.2)}
/* the status line: "ready" pill on the right, the outgoing number in the middle */
html[data-look=cosmos] #page-dial .lineinfo{background:none!important;border:0!important;box-shadow:none!important;padding:0!important;min-height:0!important}
html[data-look=cosmos] #page-dial .lineinfo .ob-orbit{display:none}
html[data-look=cosmos] #page-dial .lineinfo .lrow{display:flex;align-items:center;justify-content:space-between;gap:8px}
html[data-look=cosmos] #page-dial .lineinfo .lmain{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}
html[data-look=cosmos] #page-dial .lineinfo .phase{display:inline-flex;align-items:center;gap:6px;padding:3px 12px 3px 8px;border-radius:999px;background:rgba(255,255,255,.13)!important;box-shadow:var(--cx-gl-sh);color:#fff!important;font-size:12px;font-weight:600}
html[data-look=cosmos] #page-dial .lineinfo .phase .dot{width:11px;height:11px;border-radius:50%;background:radial-gradient(circle at 35% 28%,#e3fff3,#20c98d 45%,#0a5e42);box-shadow:0 0 6px rgba(32,201,141,.7)}
html[data-look=cosmos] #page-dial .lineinfo .sb{font-size:11px;color:var(--cx-mu)}
html[data-look=cosmos] #page-dial .lineinfo .person{font-weight:700}
html[data-look=cosmos] #page-dial .lineinfo .dur{font-family:var(--cx-num);font-weight:500;font-size:15px;color:#fff;opacity:1!important}
html[data-look=cosmos] body[data-st=call] #page-dial .lineinfo .dur{font-size:26px!important;color:var(--cx-mint2)}
html[data-look=cosmos] .cardguard{border-radius:14px;background:rgba(217,166,80,.2);box-shadow:inset 0 0 0 1px rgba(255,201,112,.45);color:#ffe2c2}
/* the controls: marbles with a label under each, the call marble in the middle */
html[data-look=cosmos] #page-dial .dialrow{display:flex!important;align-items:flex-end!important;justify-content:center;gap:16px!important;margin:4px 0 2px!important;flex-wrap:wrap}
html[data-look=cosmos] #page-dial .dialrow .cb{width:46px!important;height:46px!important;flex-direction:column;overflow:visible}
html[data-look=cosmos] #page-dial .dialrow .cb .oi{width:19px!important;height:19px!important;stroke-width:2.3}
html[data-look=cosmos] #page-dial .dialrow .cb span{display:block!important;position:absolute;top:calc(100% + 4px);left:50%;transform:translateX(-50%);font-size:11.5px!important;font-weight:600;color:#fff;white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.7)}
html[data-look=cosmos] #page-dial .dialrow{padding-bottom:20px}
html[data-look=cosmos] #page-dial .dialrow #bMute{background:var(--cx-m-red)!important}
html[data-look=cosmos] #page-dial .dialrow #bHold{background:var(--cx-m-gold)!important}
html[data-look=cosmos] #page-dial .dialrow #bTransfer,html[data-look=cosmos] #page-dial .dialrow #bMore{background:var(--cx-m-blue)!important}
html[data-look=cosmos] #page-dial .dialrow #bMute{order:1}html[data-look=cosmos] #page-dial .dialrow #bHold{order:2}html[data-look=cosmos] #page-dial .dialrow .callnow{order:4}
html[data-look=cosmos] #page-dial .dialrow #bTransfer{order:5}html[data-look=cosmos] #page-dial .dialrow #bMore{order:7}html[data-look=cosmos] #page-dial .dialrow .nocallbtn{order:8}
html[data-look=cosmos] body #page-dial .dialrow .callnow{position:relative;flex:none!important;width:86px!important;height:86px!important;margin:0 6px;padding:0;border-radius:50%!important;border:0;font-size:0!important;color:#fff;overflow:visible;animation:none!important;
 background:var(--cx-shine),radial-gradient(circle at 35% 30%,#e3fff3,#20c98d 52%,#0a5e42)!important;
 box-shadow:inset 0 -10px 16px rgba(0,50,20,.4),inset 0 5px 8px rgba(255,255,255,.6),0 0 0 6px rgba(255,255,255,.14),0 0 40px rgba(32,201,141,.55),0 16px 28px -10px rgba(0,0,0,.55)!important;transition:transform .2s}
html[data-look=cosmos] body #page-dial .dialrow .callnow:hover{transform:scale(1.04)}
html[data-look=cosmos] body #page-dial .dialrow .callnow::before{content:"";position:absolute;top:6%;right:24%;width:30%;height:16%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(255,255,255,0));transform:rotate(28deg);z-index:1}
html[data-look=cosmos] body #page-dial .dialrow .callnow::after{content:"חייג";position:absolute;top:calc(100% + 4px);left:50%;transform:translateX(-50%);font-size:11px;font-weight:700;color:#fff;white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.7)}
html[data-look=cosmos] body #page-dial .dialrow .callnow .oi{width:32px!important;height:32px!important;margin:0!important;color:#fff!important;filter:drop-shadow(0 1px 2px rgba(0,30,10,.7))!important;position:relative;z-index:2}
html[data-look=cosmos] body #page-dial .dialrow .callnow .mbr{display:none}
html[data-look=cosmos] body #page-dial .dialrow .callnow.wait{background:var(--cx-shine),radial-gradient(circle at 35% 30%,#fff3dc,#d9a650 52%,#6b4a1c)!important;box-shadow:inset 0 -10px 16px rgba(60,30,0,.4),inset 0 5px 8px rgba(255,255,255,.6),0 0 0 6px rgba(255,255,255,.14),0 0 40px rgba(217,166,80,.6)!important}
html[data-look=cosmos] body #page-dial .dialrow .callnow.wait::after{content:"מחייג…"}
html[data-look=cosmos] body #page-dial .dialrow .callnow.live{background:var(--cx-shine),radial-gradient(circle at 35% 30%,#ffe3da,#e8664f 52%,#7a2416)!important;box-shadow:inset 0 -10px 16px rgba(60,10,0,.4),inset 0 5px 8px rgba(255,255,255,.6),0 0 0 6px rgba(255,255,255,.14),0 0 40px rgba(232,102,79,.6)!important}
html[data-look=cosmos] body #page-dial .dialrow .callnow.live::after{content:"נתק"}
html[data-look=cosmos] body #page-dial .dialrow .callnow:disabled{opacity:.5}
html[data-look=cosmos] body[data-st=call] #page-dial .dialrow{display:flex!important;grid-template-columns:none!important}
html[data-look=cosmos] body[data-st=call] #page-dial .dialrow .cb{width:46px!important;height:46px!important;border-radius:50%!important}
html[data-look=cosmos] body[data-st=call] #page-dial .dialrow .callnow{height:86px!important;border-radius:50%!important}
html[data-look=cosmos] body[data-st=before] #page-dial .dialrow #bMore{width:46px!important;height:46px!important}
html[data-look=cosmos] body[data-st=before] #page-dial .dialrow .callnow{height:86px!important;font-size:0!important}
/* "update without a call": a glass pill beside the controls */
html[data-look=cosmos] body[data-st=before] #page-dial .nocallbtn{align-self:center;height:38px!important;padding:0 14px!important;border-radius:999px!important;border:0!important;background:rgba(255,255,255,.13)!important;box-shadow:var(--cx-gl-sh)!important;color:#fff!important;font-size:12.5px!important;font-weight:600}
html[data-look=cosmos] body.nocall[data-st=wrap] #page-dial .nocallback{color:var(--cx-ice)}
/* how the call ended: a recessed track of five pills, the picked one is white */
html[data-look=cosmos] #page-dial .wrapbar{border-top:0!important;padding-top:0!important;gap:8px!important}
html[data-look=cosmos] body[data-st=wrap] #page-dial .wrapbar::before{color:#fff;font-size:15px}
html[data-look=cosmos] #page-dial .wrapbar .outcomes,html[data-look=cosmos] body[data-st=wrap] #page-dial .wrapbar .outcomes{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px!important;padding:4px;border-radius:999px;background:var(--cx-rec);box-shadow:var(--cx-rec-sh)}
html[data-look=cosmos] #page-dial .wrapbar .oc,html[data-look=cosmos] body[data-st=wrap] #page-dial .wrapbar .oc{flex-direction:row!important;justify-content:center;align-items:center;gap:6px!important;height:34px!important;min-height:0!important;padding:0 6px!important;border-radius:999px!important;border:0!important;background:none!important;box-shadow:none!important;color:#fff!important;font-size:12.5px!important;font-weight:600}
html[data-look=cosmos] #page-dial .wrapbar .oc:hover{background:rgba(255,255,255,.1)!important}
html[data-look=cosmos] #page-dial .wrapbar .oc>span{font-size:0!important;width:11px;height:11px;border-radius:50%;flex:none;box-shadow:0 0 6px rgba(0,0,0,.3)}
html[data-look=cosmos] #page-dial .wrapbar .oc>span .oi{display:none!important}
html[data-look=cosmos] #page-dial .wrapbar .oc.won>span{background:radial-gradient(circle at 35% 28%,#e3fff3,#20c98d 45%,#0a5e42)}
html[data-look=cosmos] #page-dial .wrapbar .oc.quote>span{background:radial-gradient(circle at 35% 28%,#fff3dc,#d9a650 50%,#6b4a1c)}
html[data-look=cosmos] #page-dial .wrapbar .oc.fu>span{background:radial-gradient(circle at 35% 28%,#dcefff,#3a7fc0 50%,#0d2c4f)}
html[data-look=cosmos] #page-dial .wrapbar .oc.na>span{background:radial-gradient(circle at 35% 28%,#b5e6ff,#4fb6e6 52%,#0b4467)}
html[data-look=cosmos] #page-dial .wrapbar .oc.no>span{background:radial-gradient(circle at 35% 28%,#ffe3da,#e8664f 50%,#7a2416)}
html[data-look=cosmos] #page-dial .wrapbar .oc.picked{background:rgba(255,255,255,.88)!important;color:#1c1917!important;text-shadow:none;box-shadow:0 4px 10px -4px rgba(0,0,0,.45)!important}
html[data-look=cosmos] #page-dial .wrapbar .oc.picked::after{display:none}
html[data-look=cosmos] #page-dial .wraprow{display:flex;gap:8px;align-items:center}
html[data-look=cosmos] #page-dial .notebar{flex:1;display:flex;gap:8px;margin:0}
html[data-look=cosmos] #page-dial .notebar input{flex:1;height:38px;border-radius:999px!important;padding:0 14px;font-size:12.5px}
html[data-look=cosmos] #page-dial .notebar .ab{height:38px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.13);color:#fff;font-weight:600}
html[data-look=cosmos] #page-dial .nextbtn,html[data-look=cosmos] body[data-st=wrap] #page-dial .nextbtn{width:auto!important;flex:none;height:38px!important;padding:0 14px!important;border-radius:999px;background:rgba(255,255,255,.9);color:#1c1917;font-weight:600;font-size:13px!important;text-shadow:none;box-shadow:0 6px 14px -6px rgba(0,0,0,.5)}
html[data-look=cosmos] .savebar{border-radius:16px;background:rgba(32,201,141,.16);box-shadow:inset 0 0 0 1px rgba(125,255,207,.35);color:#fff}
html[data-look=cosmos] .xferbar{border-radius:16px;background:rgba(2,8,20,.38);box-shadow:var(--cx-rec-sh)}

/* --- SAN: one glass window with the heat bar and the six stages --- */
html[data-look=cosmos] #page-dial .card.nova{padding:14px 18px!important;border-radius:26px!important;gap:10px;display:flex;flex-direction:column}
html[data-look=cosmos] #page-dial .card.actions{border-radius:26px!important}
html[data-look=cosmos] .novahead{display:flex;align-items:center;gap:10px}
html[data-look=cosmos] .novahead .sanring{width:32px;height:32px;flex:none;border-radius:50%;background:var(--cx-shine),radial-gradient(circle at 35% 30%,#e6fbff,#4fb6e6 52%,#0b4467);box-shadow:var(--cx-m-sh)}
html[data-look=cosmos] .novahead .sanring svg{display:none}
html[data-look=cosmos] .novahead .novat{flex:1}
html[data-look=cosmos] .novahead .novat .t{font-weight:600;font-size:13px;color:#fff}
html[data-look=cosmos] .novahead .heathead{display:flex;align-items:center;gap:6px}
html[data-look=cosmos] .novahead .heathead b{font-family:var(--cx-num);font-weight:500;font-size:14px;color:#ffc970}
html[data-look=cosmos] .sanwave{display:none}
html[data-look=cosmos] .stages{display:flex!important;gap:5px}
html[data-look=cosmos] .stages span{flex:1;text-align:center;padding:6px 2px;font-size:11.5px;border-radius:999px;color:rgba(230,240,255,.7);background:var(--cx-rec);box-shadow:var(--cx-rec-sh);border:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-look=cosmos] .stages span.done{color:#9ff0d0;background:rgba(32,201,141,.16);box-shadow:inset 0 0 0 1px rgba(125,255,207,.3)}
html[data-look=cosmos] .stages span.done::before{content:"✓ ";font-weight:800}
html[data-look=cosmos] .stages span.on,html[data-look=cosmos] .stages span.cur{color:#fff;font-weight:700;background:rgba(79,182,230,.32);box-shadow:inset 0 0 0 1px rgba(181,230,255,.6),0 0 12px rgba(79,182,230,.4)}
html[data-look=cosmos] .coach{border-radius:16px;background:linear-gradient(180deg,rgba(224,136,58,.14),rgba(2,8,20,.35));box-shadow:inset 0 0 0 1px rgba(240,170,100,.35);color:#fff}
html[data-look=cosmos] #novaFeed .sg,html[data-look=cosmos] .pinned .sg{border-radius:18px;background:var(--cx-rec);box-shadow:var(--cx-rec-sh);border:0;color:#fff}
html[data-look=cosmos] #novaFeed .sg.warn,html[data-look=cosmos] .pinned .sg.warn{background:linear-gradient(180deg,rgba(224,136,58,.16),rgba(2,8,20,.35));box-shadow:inset 0 0 0 1px rgba(240,170,100,.4)}
html[data-look=cosmos] #novaFeed .empty::before{display:none}

/* --- the customer card --- */
html[data-look=cosmos] #cust{padding:18px!important}
html[data-look=cosmos] #cust .custhead{gap:12px;align-items:center}
html[data-look=cosmos] #cust #cAv{width:50px;height:50px;font-size:15px;flex:none}
html[data-look=cosmos] #cust #cAv .mbr{display:none}
html[data-look=cosmos] #cust .nm{font-weight:800;font-size:18px}
html[data-look=cosmos] #cust .cons .cs{display:inline-flex;align-items:center;gap:5px;margin-top:4px;padding:2px 10px 2px 7px;border-radius:999px;background:rgba(255,255,255,.13);box-shadow:var(--cx-gl-sh);color:#fff;font-size:11px;border:0}
html[data-look=cosmos] #cust .cons .cs.ok .oi{color:var(--cx-mint)}
html[data-look=cosmos] #cust .cons .cs.no{background:rgba(232,102,79,.28)}
html[data-look=cosmos] #cust .cedit{width:32px;height:32px;border-radius:50%;border:0!important;background:var(--cx-m-blue)!important;box-shadow:var(--cx-m-sh);color:#fff!important}
/* the four quick actions: marbles with a label under each */
html[data-look=cosmos] #cust .custacts{display:flex!important;justify-content:space-between;gap:4px!important;margin:6px 0 0!important}
html[data-look=cosmos] #cust .cact{flex:1;flex-direction:column;height:auto!important;gap:5px!important;padding:0;border:0!important;background:none!important;box-shadow:none!important;color:#fff!important;font-size:11px!important;font-weight:600}
html[data-look=cosmos] #cust .cact svg{width:38px!important;height:38px!important;padding:10px;border-radius:50%;color:#fff!important;background:var(--cx-m-blue);box-shadow:var(--cx-m-sh);filter:none;transition:transform .2s}
html[data-look=cosmos] #cust .cact:hover svg{transform:translateY(-1px) scale(1.05)}
html[data-look=cosmos] #cust .cact.wa svg{background:var(--cx-m-wa)}
html[data-look=cosmos] #cust .cact.mail svg{background:var(--cx-m-blue)}
html[data-look=cosmos] #cust .cact.sms svg{background:var(--cx-m-gold)}
html[data-look=cosmos] #cust .cact.hand svg{background:var(--cx-m-blue)}
html[data-look=cosmos] #cust .cact span{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* the four facts on a recessed strip */
html[data-look=cosmos] .ob-cfile{display:grid;grid-template-columns:repeat(4,1fr);margin:10px 0 2px;padding:9px 4px;border-radius:16px;background:var(--cx-rec);box-shadow:var(--cx-rec-sh)}
html[data-look=cosmos] .ob-cfile>div{position:relative;text-align:center;min-width:0;padding:0 4px}
html[data-look=cosmos] .ob-cfile>div+div::before{content:"";position:absolute;inset-inline-start:0;top:12%;bottom:12%;width:1px;background:rgba(255,255,255,.12)}
html[data-look=cosmos] .ob-cfile span{display:block;font-size:11px;color:var(--cx-mu)}
html[data-look=cosmos] .ob-cfile b{display:block;font:500 15px/1.4 var(--cx-num);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-look=cosmos] .ob-cfile b.tx{font-family:var(--cx-font);font-weight:700;font-size:13px}
html[data-look=cosmos] .ob-cfile .warm b{color:#ffc970}html[data-look=cosmos] .ob-cfile .hot b{color:#ff8a7a}
html[data-look=cosmos] #cust .stats,html[data-look=cosmos] #cust .facts{display:none}
html[data-look=cosmos] #cust .tabs{margin:12px 0 10px!important}
/* the brief and the history */
html[data-look=cosmos] #tl .brief{border-radius:18px;background:none;border:0;padding:0;box-shadow:none}
html[data-look=cosmos] #tl .brief .bh{font-weight:700;font-size:13px;margin-bottom:8px}
html[data-look=cosmos] #tl .brief .br{padding:10px 12px;margin-bottom:8px;border-radius:16px;background:var(--cx-rec);box-shadow:var(--cx-rec-sh);border:0}
html[data-look=cosmos] #tl .brief .br small{display:block;font-size:11px;color:var(--cx-mu)}
html[data-look=cosmos] #tl .brief .br[data-obw]{background:linear-gradient(180deg,rgba(224,136,58,.22),rgba(2,8,20,.35));box-shadow:inset 0 0 0 1px rgba(240,170,100,.35)}
html[data-look=cosmos] #tl .brief .br.open{background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
html[data-look=cosmos] #tl .brief .br.open div{color:#fff;font-weight:500}
html[data-look=cosmos] #tl .btip{border-radius:14px;background:rgba(2,8,20,.3);color:var(--cx-sub);border:0}
html[data-look=cosmos] #tl .hist{color:var(--cx-mu);font-size:11px}
html[data-look=cosmos] #tl .tli2 .bd{border-radius:16px;background:var(--cx-rec);box-shadow:var(--cx-rec-sh);border:0}
html[data-look=cosmos] #tl .tli2 .ic{background:var(--cx-m-blue);box-shadow:var(--cx-m-sh);color:#fff;border:0}
html[data-look=cosmos] #tl .tl2::before{background:rgba(255,255,255,.14)}
html[data-look=cosmos] #tl time{color:var(--cx-mu)}
html[data-look=cosmos] .chip{border-radius:999px}
html[data-look=cosmos] .chip.ok{background:rgba(32,201,141,.2);color:#9ff0d0}
html[data-look=cosmos] .chip.ac{background:rgba(255,255,255,.13);color:#fff}
/* the dialer's own order (top to bottom): status line, the number, keypad, controls, how it ended */
html[data-look=cosmos] #page-dial .card.dialer{display:flex!important;flex-direction:column!important}
html[data-look=cosmos] #page-dial .card.dialer .dialside{display:contents!important}
html[data-look=cosmos] #page-dial .card.dialer .lineinfo{order:1}
html[data-look=cosmos] #page-dial .card.dialer .numrow{order:2}
html[data-look=cosmos] #page-dial .card.dialer .pad{order:3}
html[data-look=cosmos] #page-dial .card.dialer .savebar{order:4}
html[data-look=cosmos] #page-dial .card.dialer .dialrow{order:5}
html[data-look=cosmos] #page-dial .card.dialer .xferbar{order:6}
html[data-look=cosmos] #page-dial .card.dialer .wrapbar{order:7}
html[data-look=cosmos] #page-dial .card.dialer .quickdial{order:0}
html[data-look=cosmos] #page-dial .lineinfo .lrow{flex-direction:row}
html[data-look=cosmos] #page-dial .lineinfo .lmain{flex:1;justify-content:space-between;flex-wrap:nowrap}
html[data-look=cosmos] #page-dial .lineinfo .lmain .sb{flex:1;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-look=cosmos] #page-dial .numrow #bFloat{position:static;order:-1}
html[data-look=cosmos] #page-dial .numrow #bFloat:disabled{opacity:.5}
html[data-look=cosmos] #page-dial .numrow #bPad{order:9}
html[data-look=cosmos] #page-dial .numrow #bClear{order:10}
html[data-look=cosmos] #page-dial .dialrow{margin-top:6px!important}
@media (min-width:1151px){html[data-look=cosmos] #page-dial.grid{grid-template-columns:minmax(250px,310px) minmax(420px,570px) minmax(270px,330px)!important}}
html[data-look=cosmos] #cust .tabs button{font-size:12px;padding:6px 8px;white-space:nowrap}
html[data-look=cosmos] #cust .tabs button b,html[data-look=cosmos] #cust .tabs button .n{font-size:10px}
html[data-look=cosmos] #page-dial .lineinfo .lmain{display:flex!important;flex-direction:row!important;align-items:center!important}
html[data-look=cosmos] body[data-st=before] #page-dial .dialrow #bMore{order:3}
html[data-look=cosmos] body[data-st=before] #page-dial .dialrow .callnow{order:4}
html[data-look=cosmos] body[data-st=before] #page-dial .dialrow .nocallbtn{order:5}

/* =================================== HOME (canvas: בית של הבעלים) =================================== */
html[data-look=cosmos] #page-home.on{display:block;overflow:auto}
html[data-look=cosmos] .homewrap.cxh{display:grid!important;grid-template-columns:minmax(260px,300px) minmax(0,1fr) minmax(280px,330px);grid-template-rows:minmax(0,1fr);gap:24px;height:100%;min-height:600px;max-width:1340px;margin:0 auto;align-items:start}
html[data-look=cosmos] .cxh>.today{padding:18px;display:flex;flex-direction:column;gap:12px}
html[data-look=cosmos] .cxh>.needs{padding:18px;display:flex;flex-direction:column;gap:10px;max-height:100%;overflow:auto}
html[data-look=cosmos] .cxh .ch .t{font-size:17px;font-weight:800}
html[data-look=cosmos] .cxh .thero{display:flex;align-items:center;gap:14px}
html[data-look=cosmos] .cxh .tring{position:relative;width:96px;height:96px;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center}
html[data-look=cosmos] .cxh .tring svg{position:absolute;inset:0;width:100%;height:100%}
html[data-look=cosmos] .cxh .tring .tr{fill:none;stroke:rgba(255,255,255,.12);stroke-width:7}
html[data-look=cosmos] .cxh .tring .ta{fill:none;stroke:url(#cxGoal);stroke:#4fd8c4;stroke-width:7;stroke-linecap:round;filter:drop-shadow(0 0 6px rgba(79,216,196,.6))}
html[data-look=cosmos] .cxh .tring b{font:500 22px/1 var(--cx-num)}
html[data-look=cosmos] .cxh .tring span{font-size:10.5px;color:var(--cx-mu)}
html[data-look=cosmos] .cxh .tsum{display:flex;flex-direction:column;gap:2px;flex:1;text-align:start}
html[data-look=cosmos] .cxh .tsum .kl{font-size:11px;color:var(--cx-mu)}
html[data-look=cosmos] .cxh .tsum .kv{font:500 30px/1.1 var(--cx-num);color:#fff}
html[data-look=cosmos] .cxh .tsum .ks{font-size:11.5px;color:var(--cx-sub)}
html[data-look=cosmos] .cxh .kstrip{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
html[data-look=cosmos] .cxh .kstrip .kt{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:16px;background:var(--cx-rec);box-shadow:var(--cx-rec-sh);border:0;min-height:0}
html[data-look=cosmos] .cxh .kstrip .kl{font-size:11px;color:var(--cx-mu)}
html[data-look=cosmos] .cxh .kstrip .kv{font:500 22px/1.2 var(--cx-num);color:#fff}
html[data-look=cosmos] .cxh .kstrip .ks{font-size:11px;color:var(--cx-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-look=cosmos] .cxh em{font-style:normal}html[data-look=cosmos] .cxh em.up{color:var(--cx-mint)}html[data-look=cosmos] .cxh em.down{color:var(--cx-hot)}
html[data-look=cosmos] .cxh .hch{margin-top:2px}html[data-look=cosmos] .cxh .hch .t{font-size:14px}
html[data-look=cosmos] .cxh .hbars{display:flex;align-items:flex-end;gap:5px;height:130px;padding-bottom:16px}
html[data-look=cosmos] .cxh .hb{position:relative;flex:1;height:100%;display:flex;align-items:flex-end}
html[data-look=cosmos] .cxh .hb i{display:block;width:100%;border-radius:6px 6px 3px 3px;background:linear-gradient(180deg,#9fd0ff,#3a7fc0);box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
html[data-look=cosmos] .cxh .hb.top i{background:linear-gradient(180deg,#9ff0d0,#20c98d);box-shadow:0 0 14px rgba(32,201,141,.5),inset 0 1px 0 rgba(255,255,255,.6)}
html[data-look=cosmos] .cxh .hb span{position:absolute;bottom:-16px;left:50%;transform:translateX(-50%);font-size:9px;color:var(--cx-mu);white-space:nowrap}
/* the centre: no window, the team floats over the Earth */
html[data-look=cosmos] .cxh>.ctl{display:flex!important;flex-direction:column;align-items:stretch;gap:12px;background:none!important;border:0!important;box-shadow:none!important;overflow:visible;height:auto;min-height:0}
html[data-look=cosmos] .cxh .orbit{height:440px!important;flex:none;overflow:visible;background:none}
html[data-look=cosmos] .cxh .orbit .orb-l{stroke:rgba(181,230,255,.28)!important;stroke-dasharray:2 6}
html[data-look=cosmos] .cxh .orbit .orb-t{fill:rgba(220,234,252,.7)!important;font-size:11px}
html[data-look=cosmos] .cxh .orbit .sig-l{stroke:rgba(125,255,207,.55)!important}
html[data-look=cosmos] .cxh .hub{width:120px!important;height:120px!important;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;
 background:radial-gradient(circle at 32% 20%,rgba(255,255,255,.9) 0%,rgba(255,255,255,0) 24%),radial-gradient(circle at 40% 35%,#dff4ff,#4fb6e6 48%,#0b4467 100%)!important;
 box-shadow:inset 0 -14px 24px rgba(0,30,60,.45),inset 0 6px 12px rgba(255,255,255,.6),0 0 0 8px rgba(255,255,255,.08),0 0 60px rgba(79,182,230,.55)!important;border:0!important;color:#fff;text-shadow:0 2px 6px rgba(0,30,60,.6)}
html[data-look=cosmos] .cxh .hub svg{display:none}
html[data-look=cosmos] .cxh .hub b{font:600 36px/1 var(--cx-num);color:#fff}
html[data-look=cosmos] .cxh .hub span{font-size:12px;font-weight:700;color:#fff}
html[data-look=cosmos] .cxh .sat .dot{width:46px;height:46px;border-radius:50%;background:radial-gradient(circle at 32% 20%,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 22%),radial-gradient(circle at 35% 30%,#4a5566,#1c2433 55%,#070b14);color:#fff;
 box-shadow:inset 0 -6px 10px rgba(0,0,0,.3),inset 0 3px 6px rgba(255,255,255,.5),0 0 0 2px rgba(6,14,32,.9),0 0 0 4px var(--ring,#8fa6c4),0 0 14px var(--ringgl,rgba(143,166,196,.3))}
html[data-look=cosmos] .cxh .sat.live .dot{--ring:#20c98d;--ringgl:rgba(32,201,141,.7)}
html[data-look=cosmos] .cxh .sat.available .dot{--ring:#4fb6e6;--ringgl:rgba(79,182,230,.6)}
html[data-look=cosmos] .cxh .sat.wrap .dot,html[data-look=cosmos] .cxh .sat.break .dot{--ring:#d9a650;--ringgl:rgba(217,166,80,.6)}
html[data-look=cosmos] .cxh .sat.offline .dot{--ring:rgba(143,166,196,.5);--ringgl:transparent;opacity:.85}
html[data-look=cosmos] .cxh .sat.ai .dot{background:var(--cx-m-ai);--ring:rgba(181,230,255,.9);--ringgl:rgba(79,182,230,.6)}
html[data-look=cosmos] .cxh .sat .lb{display:inline-block;padding:2px 9px;border-radius:999px;background:rgba(3,8,20,.62);box-shadow:var(--cx-gl-sh);font-size:11px;font-weight:600;color:#fff;line-height:1.35}
html[data-look=cosmos] .cxh .sat .lb .mu{color:var(--cx-mu)}html[data-look=cosmos] .cxh .sat .lb .sig{color:var(--cx-mint2)}
html[data-look=cosmos] .cxh .orb-key{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
html[data-look=cosmos] .cxh .orb-key span{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px 0 8px;border-radius:999px;background:rgba(3,8,20,.55);box-shadow:var(--cx-gl-sh);font-size:11px;color:#fff}
html[data-look=cosmos] .cxh .orb-key .k{width:10px;height:10px;border-radius:50%;border:0}
html[data-look=cosmos] .cxh .orb-key .k.live{background:radial-gradient(circle at 35% 28%,#e3fff3,#20c98d 45%,#0a5e42)}
html[data-look=cosmos] .cxh .orb-key .k.avail{background:radial-gradient(circle at 35% 28%,#dcefff,#3a7fc0 50%,#0d2c4f)}
html[data-look=cosmos] .cxh .orb-key .k.wrap{background:radial-gradient(circle at 35% 28%,#fff3dc,#d9a650 50%,#6b4a1c)}
html[data-look=cosmos] .cxh .orb-key .k.off{background:rgba(143,166,196,.5)}
html[data-look=cosmos] .cxh .orb-key .k.ai{background:var(--cx-m-ai)}
html[data-look=cosmos] .cxh .ctlside{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;padding:0;background:none;border:0;width:auto}
html[data-look=cosmos] .cxh .ctln{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--cx-sub)}
html[data-look=cosmos] .cxh .ctln .num{font:500 16px var(--cx-num);color:#fff}html[data-look=cosmos] .cxh .ctln .num.sig{color:var(--cx-hot)}
html[data-look=cosmos] .cxh .ctlbtn{height:30px;padding:0 12px;border-radius:999px;background:rgba(255,255,255,.13);box-shadow:var(--cx-gl-sh);color:#fff;font-weight:600;font-size:12px;border:0}
html[data-look=cosmos] .cxh .ctlbtn:hover{background:rgba(255,255,255,.22)}
html[data-look=cosmos] .cxh .kt.team{padding:16px 20px;display:flex;flex-direction:column;gap:10px;border-radius:26px}
html[data-look=cosmos] .cxh .flow3{display:flex;align-items:center;justify-content:space-around;gap:6px}
html[data-look=cosmos] .cxh .flow3>span{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11.5px;color:var(--cx-sub);text-align:center}
html[data-look=cosmos] .cxh .flow3 b{font:500 24px/1.1 var(--cx-num);color:#fff}
html[data-look=cosmos] .cxh .flow3 .mb{width:48px;height:48px;border-radius:50%;box-shadow:var(--cx-m-sh)}
html[data-look=cosmos] .cxh .flow3 .mb.ai{background:var(--cx-m-ai)}html[data-look=cosmos] .cxh .flow3 .mb.gold{background:var(--cx-m-gold)}html[data-look=cosmos] .cxh .flow3 .mb.green{background:var(--cx-m-green)}
html[data-look=cosmos] .cxh .flow3>em{flex:1;max-width:80px;height:2px;border-radius:2px;background:linear-gradient(90deg,rgba(181,230,255,.1),rgba(181,230,255,.6),rgba(181,230,255,.1))}
/* what needs you: rows with a marble, the text, and a pill */
html[data-look=cosmos] .cxh .att2{display:flex;flex-direction:column;gap:8px}
html[data-look=cosmos] .cxh .ai2{display:flex;align-items:center;gap:10px;padding:10px;border-radius:18px;background:var(--cx-rec);box-shadow:var(--cx-rec-sh);border:0}
html[data-look=cosmos] .cxh .ai2 .ad{position:relative;width:36px;height:36px;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:var(--cx-m-sh);background:var(--cx-m-blue)}
html[data-look=cosmos] .cxh .ai2 .ad.gold{background:var(--cx-m-gold)}html[data-look=cosmos] .cxh .ai2 .ad.red{background:var(--cx-m-red)}html[data-look=cosmos] .cxh .ai2 .ad.green{background:var(--cx-m-green)}
html[data-look=cosmos] .cxh .ai2 .ad.orange{background:var(--cx-shine),radial-gradient(circle at 35% 30%,#ffe6cc,#e0883a 52%,#7a3e10)}
html[data-look=cosmos] .cxh .ai2 .ad .oi{width:16px;height:16px;margin:0;color:#fff;filter:drop-shadow(0 1px 1.5px rgba(0,8,24,.85))}
html[data-look=cosmos] .cxh .ai2 .at{flex:1;min-width:0}
html[data-look=cosmos] .cxh .ai2 .at b{display:block;font-size:13px;font-weight:700}
html[data-look=cosmos] .cxh .ai2 .at .sb{font-size:11.5px;color:var(--cx-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-look=cosmos] .cxh .ai2 .ab{flex:none;height:30px;padding:0 12px;border-radius:999px;font-weight:700;font-size:12px}
html[data-look=cosmos] .cxh .onb2{border-radius:18px;background:rgba(3,8,20,.55);box-shadow:var(--cx-gl-sh);padding:8px 12px}
@media (max-width:1180px){html[data-look=cosmos] .homewrap.cxh{grid-template-columns:1fr 1fr}html[data-look=cosmos] .cxh>.ctl{grid-column:1/-1;order:-1}}
@media (max-width:760px){html[data-look=cosmos] .homewrap.cxh{grid-template-columns:1fr}html[data-look=cosmos] .cxh .orbit{height:340px!important}}
html[data-look=cosmos] .cxh .orb-key{position:static;padding:0;pointer-events:auto}
html[data-look=cosmos] .cxh .ctlside{flex:none!important;flex-direction:row!important;border:0!important;padding:0!important;gap:8px 14px!important}
html[data-look=cosmos] .cxh .ctlbtn{margin:0;align-self:center}
html[data-look=cosmos] .cxh .orbit{height:400px!important}
html[data-look=cosmos] .cxh .kt.team{padding:12px 18px;gap:6px}
html[data-look=cosmos] .cxh .flow3 .mb{width:40px;height:40px}
html[data-look=cosmos] .cxh .flow3 b{font-size:20px}
html[data-look=cosmos] .cxh .kt.team .ks:empty{display:none}

/* =================================== THE REP'S HOME (canvas: בית של הנציג) =================================== */
html[data-look=cosmos] #page-home .rhome{display:grid;grid-template-columns:minmax(300px,420px) minmax(0,460px) minmax(280px,380px);gap:20px;justify-content:center;align-items:start;max-width:1340px;margin:0 auto}
html[data-look=cosmos] .rhome .wcard{padding:18px 20px;display:flex;flex-direction:column;gap:12px}
html[data-look=cosmos] .rhome h2{font-size:24px;font-weight:800;margin:0}
html[data-look=cosmos] .rhome .rhero{display:flex;align-items:center;gap:16px;flex-direction:row-reverse;justify-content:flex-end}
html[data-look=cosmos] .rhome .tring{position:relative;width:132px;height:132px;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center}
html[data-look=cosmos] .rhome .tring svg{position:absolute;inset:0;width:100%;height:100%}
html[data-look=cosmos] .rhome .tring .tr{fill:none;stroke:rgba(255,255,255,.12);stroke-width:8}
html[data-look=cosmos] .rhome .tring .ta{fill:none;stroke:#4fd8a8;stroke-width:8;stroke-linecap:round;filter:drop-shadow(0 0 8px rgba(32,217,158,.6))}
html[data-look=cosmos] .rhome .tring b{font:600 30px/1 var(--cx-num)}html[data-look=cosmos] .rhome .tring span{font-size:11px;color:var(--cx-mu)}
html[data-look=cosmos] .rhome .tsum{display:flex;flex-direction:column;gap:3px;text-align:start}
html[data-look=cosmos] .rhome .tsum .kl{font-size:11px;color:var(--cx-mu)}html[data-look=cosmos] .rhome .tsum .kv{font:500 28px/1.1 var(--cx-num)}
html[data-look=cosmos] .rhome .tsum .ks{font-size:12px;color:var(--cx-sub)}
html[data-look=cosmos] .rhome .rtiles,html[data-look=cosmos] .rhome .ltiles{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
html[data-look=cosmos] .rhome .ltiles{grid-template-columns:1fr 1fr}
html[data-look=cosmos] .rhome .lt{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:16px;background:var(--cx-rec);box-shadow:var(--cx-rec-sh);text-align:start}
html[data-look=cosmos] .rhome .lt span{font-size:11px;color:var(--cx-mu)}html[data-look=cosmos] .rhome .lt b{font:500 22px/1.2 var(--cx-num)}
html[data-look=cosmos] .rhome .lt small{font-size:12px;color:var(--cx-mu)}
html[data-look=cosmos] .rhome .lt.low{box-shadow:inset 0 0 0 1px rgba(255,138,122,.55)}html[data-look=cosmos] .rhome .lt.low b,html[data-look=cosmos] .rhome .lt.bad b{color:var(--cx-hot)}
html[data-look=cosmos] .rhome .ch .t{font-size:15px;font-weight:800}
html[data-look=cosmos] .rhome .rank{display:flex;flex-direction:column;gap:4px}
html[data-look=cosmos] .rhome .rk{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:14px}
html[data-look=cosmos] .rhome .rk.me{background:rgba(32,201,141,.16);box-shadow:inset 0 0 0 1px rgba(125,255,207,.4)}
html[data-look=cosmos] .rhome .rk .rn{width:16px;font:500 13px var(--cx-num);color:var(--cx-gold)}
html[data-look=cosmos] .rhome .rk b{flex:1;font-weight:600}html[data-look=cosmos] .rhome .rk .rv{font:500 13px var(--cx-num)}
html[data-look=cosmos] .rhome .mb.av{width:30px;height:30px;font-size:10.5px;--cx-avring:#d9a650;background:radial-gradient(circle at 32% 20%,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 22%),radial-gradient(circle at 35% 30%,#4a5566,#1c2433 55%,#070b14)}
html[data-look=cosmos] .rhome .mb{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;flex:none;color:#fff;font-weight:700;box-shadow:var(--cx-m-sh)}
html[data-look=cosmos] .rhome .mb.av{box-shadow:inset 0 -6px 10px rgba(0,0,0,.3),inset 0 3px 6px rgba(255,255,255,.5),0 0 0 2px rgba(6,14,32,.9),0 0 0 3.5px var(--cx-avring)}
html[data-look=cosmos] .rhome .mb.av.big{width:76px;height:76px;font-size:22px}
html[data-look=cosmos] .rhome .mb.av.hot{--cx-avring:#e8664f;box-shadow:inset 0 -6px 10px rgba(0,0,0,.3),inset 0 3px 6px rgba(255,255,255,.5),0 0 0 3px rgba(6,14,32,.9),0 0 0 6px #e8664f,0 0 22px rgba(232,102,79,.7)}
html[data-look=cosmos] .rhome .mb.av.warm{--cx-avring:#e0883a}html[data-look=cosmos] .rhome .mb.av.cold{--cx-avring:#4fb6e6}
html[data-look=cosmos] .rhome .mb.green{width:38px;height:38px;background:var(--cx-m-green)}
html[data-look=cosmos] .rhome .mb .oi{width:17px;height:17px;margin:0;filter:drop-shadow(0 1px 1.5px rgba(0,8,24,.85))}
html[data-look=cosmos] .rhome .rh-mid{display:flex;flex-direction:column;gap:20px}
html[data-look=cosmos] .rhome .nxl{display:flex;align-items:center;gap:16px;flex-direction:row-reverse;justify-content:flex-end}
html[data-look=cosmos] .rhome .nxt{text-align:start}html[data-look=cosmos] .rhome .nxt b{font-size:20px;font-weight:800}
html[data-look=cosmos] .rhome .nxh{font-size:12px;font-weight:700;color:#a9c8ff;margin-top:2px}html[data-look=cosmos] .rhome .nxh.hot{color:#ffb4b4}html[data-look=cosmos] .rhome .nxh.warm{color:#ffc29a}
html[data-look=cosmos] .rhome .nxtip{padding:10px 14px;border-radius:16px;background:rgba(2,8,20,.38);box-shadow:inset 0 0 0 1px rgba(181,230,255,.25);font-size:12.5px;color:var(--cx-sub)}
html[data-look=cosmos] .rhome .nxtip b{color:#9fd8ff}
html[data-look=cosmos] .rhome .cxgo{display:flex;align-items:center;justify-content:center;gap:12px;height:56px;margin-top:6px;border-radius:999px;background:rgba(255,255,255,.95);color:#0b1626;font-size:16px;font-weight:800;text-shadow:none;box-shadow:0 0 0 3px rgba(32,201,141,.35),0 10px 24px -8px rgba(0,0,0,.5)}
html[data-look=cosmos] .rhome .cxgo:hover{background:#fff}
html[data-look=cosmos] .rhome .ev2{display:grid;grid-template-columns:52px 14px 1fr auto;align-items:center;gap:8px;padding:5px 2px;font-size:12.5px}
html[data-look=cosmos] .rhome .ev2 .et{font:500 13px var(--cx-num)}html[data-look=cosmos] .rhome .ev2.late .et{color:var(--cx-hot)}
html[data-look=cosmos] .rhome .ev2 .dot{width:11px;height:11px;border-radius:50%;background:radial-gradient(circle at 35% 28%,#dcefff,#3a7fc0 50%,#0d2c4f)}
html[data-look=cosmos] .rhome .ev2 .dot.green{background:radial-gradient(circle at 35% 28%,#e3fff3,#20c98d 45%,#0a5e42)}
html[data-look=cosmos] .rhome .ev2 .dot.gold{background:radial-gradient(circle at 35% 28%,#fff3dc,#d9a650 50%,#6b4a1c)}
html[data-look=cosmos] .rhome .ev2 .dot.red{background:radial-gradient(circle at 35% 28%,#ffe3da,#e8664f 50%,#7a2416)}
html[data-look=cosmos] .rhome .ev2 .sb{font-size:11px;color:var(--cx-mu)}
html[data-look=cosmos] .rhome .wide2{height:44px;border-radius:999px;font-weight:800}
html[data-look=cosmos] .rhome .askon{padding:10px 14px;border-radius:999px;background:rgba(32,201,141,.14);box-shadow:inset 0 0 0 1px rgba(125,255,207,.35);font-size:12.5px;text-align:center}
html[data-look=cosmos] .rhome .msg{padding:10px 12px;border-radius:16px;background:var(--cx-rec);box-shadow:var(--cx-rec-sh);font-size:12.5px}
html[data-look=cosmos] .rhome .msg.new{box-shadow:inset 0 0 0 1px rgba(255,201,112,.45)}
html[data-look=cosmos] .rhome .msg .mt{display:block;font-size:11px;font-weight:700;color:#ffc970;margin-bottom:2px}
html[data-look=cosmos] .lnk{color:var(--cx-ice);font-weight:600;font-size:12px}
html[data-look=cosmos] .empty2.sm{font-size:12px;padding:8px}
@media (max-width:1180px){html[data-look=cosmos] #page-home .rhome{grid-template-columns:1fr 1fr}html[data-look=cosmos] .rhome .rh-mid{grid-column:1/-1;order:-1}}
@media (max-width:760px){html[data-look=cosmos] #page-home .rhome{grid-template-columns:1fr}}

/* the page tabs (לידים · רשימות חיוג · הקלטות …): a glass track on the right, above the page (cosmos.js moves it out of the header) */
html[data-look=cosmos] main>.subtabs{justify-self:start;display:flex;height:44px;padding:4px;margin:0 0 -2px;background:rgba(255,255,255,.1);border-radius:999px;box-shadow:var(--cx-gl-sh);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
html[data-look=cosmos] main>.subtabs .stb{height:36px;padding:0 18px;border-radius:999px;color:#fff;font-weight:600;font-size:13px;white-space:nowrap}
html[data-look=cosmos] main>.subtabs .stb:hover{background:rgba(255,255,255,.1)}
html[data-look=cosmos] main>.subtabs .stb.on{background:rgba(255,255,255,.95);color:#0b1626;font-weight:800;text-shadow:none;box-shadow:0 4px 10px -4px rgba(0,0,0,.4)}
html[data-look=cosmos] main{grid-template-rows:auto minmax(0,1fr)}
html[data-look=cosmos] main:has(>.subtabs[hidden]){grid-template-rows:minmax(0,1fr)}

/* =================================== MY ORDER (canvas: הסדר שלי) =================================== */
html[data-look=cosmos] #page-myday .wbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
html[data-look=cosmos] #page-myday .wbar h2{display:none}
html[data-look=cosmos] .mdsum{flex:1;font-size:13px;color:var(--cx-sub)}html[data-look=cosmos] .mdsum b{font:500 18px var(--cx-num);color:#fff}
html[data-look=cosmos] .mdgrid{display:flex!important;flex-direction:column;gap:10px;counter-reset:md;padding:16px;border-radius:26px;background:var(--cx-win);box-shadow:var(--cx-win-sh);backdrop-filter:blur(20px) saturate(175%) brightness(.92);-webkit-backdrop-filter:blur(20px) saturate(175%) brightness(.92)}
html[data-look=cosmos] .mdgrid .mdsec{counter-increment:md;display:grid;grid-template-columns:minmax(150px,190px) 1fr;align-items:center;gap:10px;padding:10px 14px;border-radius:18px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-look=cosmos] .mdgrid .mdsec:first-child:has(.mdk.bad){background:rgba(232,102,79,.14);box-shadow:inset 0 0 0 1px rgba(255,138,122,.5)}
html[data-look=cosmos] .mdgrid .mdsec:has(.mdh .mdk.warn){background:rgba(217,166,80,.1);box-shadow:inset 0 0 0 1px rgba(255,201,112,.4)}
html[data-look=cosmos] .mdsec .mdh{display:flex;align-items:center;gap:8px;font-weight:800;font-size:13.5px;color:#fff;background:none;border:0;text-align:start;flex-wrap:wrap}
html[data-look=cosmos] .mdsec .mdh::before{content:counter(md);width:22px;height:22px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font:500 11px var(--cx-num);background:rgba(255,255,255,.13);box-shadow:var(--cx-gl-sh)}
html[data-look=cosmos] .mdsec .mdh .mdk{display:none}
html[data-look=cosmos] .mdsec .mdh .badge{background:none;box-shadow:none;color:var(--cx-mu);font-weight:500;font-size:11px;padding:0}
html[data-look=cosmos] .mdsec .mdh .badge::after{content:" לידים"}
html[data-look=cosmos] .mdsec:has(.mdh .mdk.bad) .mdh{color:#ffb4a8}html[data-look=cosmos] .mdsec:has(.mdh .mdk.warn) .mdh{color:#ffd58f}html[data-look=cosmos] .mdsec:has(.mdh .mdk.hot) .mdh{color:#ffc29a}html[data-look=cosmos] .mdsec:has(.mdh .mdk.ac) .mdh{color:#9fd8ff}html[data-look=cosmos] .mdsec:has(.mdh .mdk.ok) .mdh{color:#9ff0d0}
html[data-look=cosmos] .mdis{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
html[data-look=cosmos] .mdis:empty{display:none}
html[data-look=cosmos] .mdis .mdi{display:flex;align-items:center;gap:10px;width:auto;max-width:260px;padding:6px 6px 6px 10px;border-radius:999px;background:rgba(2,8,20,.38);box-shadow:var(--cx-rec-sh);border:0}
html[data-look=cosmos] .mdis .mdi .mdk{position:relative;width:38px;height:38px;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 32% 20%,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 22%),radial-gradient(circle at 35% 30%,#4a5566,#1c2433 55%,#070b14);box-shadow:inset 0 -6px 10px rgba(0,0,0,.3),inset 0 3px 6px rgba(255,255,255,.5),0 0 0 2px rgba(6,14,32,.9),0 0 0 3.5px var(--r,#4fb6e6)}
html[data-look=cosmos] .mdis .mdi .mdk::after{content:attr(data-ini);font-size:11px;font-weight:700;color:#fff}
html[data-look=cosmos] .mdk.bad{--r:#e8664f}html[data-look=cosmos] .mdk.warn{--r:#d9a650}html[data-look=cosmos] .mdk.hot{--r:#e0883a}html[data-look=cosmos] .mdk.ok{--r:#20c98d}html[data-look=cosmos] .mdk.mu{--r:#8fa6c4}html[data-look=cosmos] .mdk.ac{--r:#4fb6e6}
html[data-look=cosmos] .mdis .mdi .mdt{min-width:0;flex:1;line-height:1.3}
html[data-look=cosmos] .mdis .mdi .mdt b{font-size:12.5px;font-weight:700}
html[data-look=cosmos] .mdis .mdi .mdt .ph{display:none}
html[data-look=cosmos] .mdis .mdi .mdt .sb{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
html[data-look=cosmos] .mdis .mdi .stg{display:none}
html[data-look=cosmos] .mdis .mdi .acts{display:flex;gap:4px}
html[data-look=cosmos] .mdis .mdi .acts .ab{width:32px;height:32px;padding:0;border-radius:50%;display:flex;align-items:center;justify-content:center}
html[data-look=cosmos] .mdis .mdi .acts .ab.p{background:var(--cx-m-green);box-shadow:var(--cx-m-sh);color:#fff}
html[data-look=cosmos] .mdis .mdi .acts .ab .oi{margin:0;width:15px;height:15px}
html[data-look=cosmos] .stk{border-radius:26px}
html[data-look=cosmos] .gauge{background:var(--cx-rec);box-shadow:var(--cx-rec-sh)}
html[data-look=cosmos] .gauge i{background:linear-gradient(90deg,#20c98d,#9ff0d0)}html[data-look=cosmos] .gauge.mid i{background:linear-gradient(90deg,#d9a650,#ffe9a8)}html[data-look=cosmos] .gauge.low i{background:linear-gradient(90deg,#e8664f,#ffb4a8)}
html[data-look=cosmos] .stk-n b{font-family:var(--cx-num);color:#fff}html[data-look=cosmos] .stk.low .stk-n b{color:var(--cx-hot)}
html[data-look=cosmos] .stk.low{box-shadow:var(--cx-win-sh),inset 0 0 0 1px rgba(255,138,122,.45)}
html[data-look=cosmos] .mdgrid .mdsec{display:grid!important;grid-template-columns:minmax(150px,190px) minmax(0,1fr)!important;width:100%;align-self:stretch}
html[data-look=cosmos] .mdgrid .mdsec>.mdh{grid-column:1}html[data-look=cosmos] .mdgrid .mdsec>.mdis{grid-column:2}

/* =================================== LEADS (canvas: לידים) =================================== */
html[data-look=cosmos] .wpage>.wbar,html[data-look=cosmos] .wpage .wbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
html[data-look=cosmos] .wpage .wbar>h2{display:none}
html[data-look=cosmos] .wbar .f{height:40px;border-radius:999px!important;padding:0 14px}
html[data-look=cosmos] .wbar #lQ,html[data-look=cosmos] .wbar input[type=search]{min-width:220px;flex:1;max-width:340px}
html[data-look=cosmos] .wbar .btn{height:40px;padding:0 16px}
html[data-look=cosmos] .wbar #lNew,html[data-look=cosmos] .wbar .btn:last-child:not(.g){background:rgba(255,255,255,.95);color:#0b1626;text-shadow:none;font-weight:800}
html[data-look=cosmos] .chk{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 12px;border-radius:999px;background:rgba(255,255,255,.1);box-shadow:var(--cx-gl-sh);font-size:12.5px;font-weight:600;color:#fff}
html[data-look=cosmos] input[type=checkbox]{accent-color:#20c98d;width:16px;height:16px}
/* the table: each lead is a row of glass */
html[data-look=cosmos] .wpage table.tbl,html[data-look=cosmos] .wpage .ltbl{border-collapse:separate;border-spacing:0 6px}
html[data-look=cosmos] .wpage .tbl tbody tr td{background:rgba(255,255,255,.045);border:0!important;padding-top:9px;padding-bottom:9px}
html[data-look=cosmos] .wpage .tbl tbody tr td:first-child{border-radius:0 18px 18px 0}
html[data-look=cosmos] .wpage .tbl tbody tr td:last-child{border-radius:18px 0 0 18px}
html[data-look=cosmos] .wpage .tbl tbody tr:hover td{background:rgba(255,255,255,.09)}
html[data-look=cosmos] .wpage .tbl tbody tr:has(input[data-pick]:checked) td{background:rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -1px 0 rgba(255,255,255,.1)}
html[data-look=cosmos] .wpage .tbl thead th{border:0!important;font-size:11px;padding-bottom:2px}
html[data-look=cosmos] .lav{float:right;margin-inline-end:10px;position:relative;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 32% 20%,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 22%),radial-gradient(circle at 35% 30%,#4a5566,#1c2433 55%,#070b14);box-shadow:inset 0 -6px 10px rgba(0,0,0,.3),inset 0 3px 6px rgba(255,255,255,.5),0 0 0 2px rgba(6,14,32,.9),0 0 0 3.5px var(--r,#4fb6e6),0 0 12px var(--g,rgba(79,182,230,.4))}
html[data-look=cosmos] .lav::after{content:attr(data-ini);font-size:11.5px;font-weight:700;color:#fff}
html[data-look=cosmos] .lav.h-hot{--r:#e8664f;--g:rgba(232,102,79,.6)}html[data-look=cosmos] .lav.h-warm{--r:#e0883a;--g:rgba(224,136,58,.5)}html[data-look=cosmos] .lav.h-new{--r:#4fb6e6}html[data-look=cosmos] .lav.h-cold{--r:#8fa6c4;--g:transparent}
html[data-look=cosmos] .ltbl td b{font-size:13.5px}
html[data-look=cosmos] .hbar{background:var(--cx-rec);box-shadow:var(--cx-rec-sh)}
html[data-look=cosmos] .hbar i{background:linear-gradient(90deg,#4fb6e6,#b5e6ff)}html[data-look=cosmos] .hbar.warm i{background:linear-gradient(90deg,#d9a650,#ffe9a8)}html[data-look=cosmos] .hbar.hot i{background:linear-gradient(90deg,#e8664f,#ffb4a8)}
html[data-look=cosmos] .hcell .num{font:500 15px var(--cx-num)}
html[data-look=cosmos] .ob-star{display:none}
html[data-look=cosmos] .stg.hot{background:rgba(232,102,79,.25);color:#ffd0c8}
html[data-look=cosmos] .otag{background:rgba(255,255,255,.08);border:0;box-shadow:var(--cx-gl-sh)}
/* row actions: a green call marble, then "⋯" that opens the rest */
html[data-look=cosmos] .tbl .acts{position:relative;display:flex;gap:6px;justify-content:flex-end;align-items:center}
html[data-look=cosmos] .tbl .acts .ab{width:36px;height:36px;padding:0;border-radius:50%;display:inline-flex;align-items:center;justify-content:center}
html[data-look=cosmos] .tbl .acts .ab .oi{margin:0;width:16px;height:16px}
html[data-look=cosmos] .tbl .acts .ab.p{background:var(--cx-m-green);box-shadow:var(--cx-m-sh);color:#fff}
html[data-look=cosmos] .tbl .acts .ob-dots{background:var(--cx-m-blue);box-shadow:var(--cx-m-sh)}
html[data-look=cosmos] .tbl .acts .ob-menu{display:none}
html[data-look=cosmos] .tbl .acts.ob-open .ob-menu{display:flex;flex-direction:column;gap:2px;position:absolute;top:calc(100% + 6px);left:0;z-index:40;min-width:200px;padding:6px;border-radius:18px;background:var(--cx-win-solid);box-shadow:var(--cx-win-sh)}
html[data-look=cosmos] .tbl .acts .ob-menu .ab{display:flex!important;align-items:center;justify-content:flex-start!important;gap:10px;width:100%!important;height:38px!important;padding:0 12px!important;border-radius:12px!important;background:none!important;box-shadow:none!important;color:#fff;font-weight:600;font-size:12.5px}
html[data-look=cosmos] .tbl .acts .ob-menu .ab:hover{background:rgba(255,255,255,.1)!important}
html[data-look=cosmos] .tbl .acts .ob-menu .ab::after{content:attr(data-obl)}
html[data-look=cosmos] .tbl .acts .ob-menu .ab[data-dnc]{color:#ffb4a8}
html[data-look=cosmos] .pager,html[data-look=cosmos] .pg{color:var(--cx-sub)}

/* =================================== SIGN-IN (canvas: כניסה) ===================================
   The Earth behind, one dark glass window in the middle. Used by the app (#login) and the owner console (.auth). */
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) body:has(#login:not([hidden])) .stars,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) body:has(#login:not([hidden])) .earthwrap,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) body:has(#login:not([hidden])) .veil{display:block}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .auth{background:radial-gradient(700px 520px at 50% 48%,rgba(2,6,16,.75),rgba(2,6,16,.35) 60%,rgba(2,6,16,.1))!important;color:#fff;color-scheme:dark}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .lgx{display:none}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login .lbox,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .auth .card{background:var(--cx-win-solid)!important;border:0!important;border-radius:32px!important;box-shadow:var(--cx-win-sh)!important;color:#fff;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);padding:30px 32px}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login h1,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .auth h1{color:#fff!important;font-weight:800;font-size:22px}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login .lb,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .auth .lb{color:var(--cx-mu)!important;font-size:11px;font-weight:500}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login .f,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .auth .f{height:46px;background:rgba(2,8,20,.42)!important;color:#fff!important;border:0!important;border-radius:14px!important;box-shadow:inset 0 1px 2px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1)!important}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login .f:focus,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .auth .f:focus{box-shadow:inset 0 0 0 1.5px rgba(181,230,255,.8),0 0 16px rgba(79,182,230,.35)!important}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login .btn,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .auth .btn{height:52px;border-radius:999px!important;background:rgba(255,255,255,.95)!important;color:#0b1626!important;font-weight:800;font-size:15px;text-shadow:none;box-shadow:0 0 0 3px rgba(32,201,141,.3),0 12px 24px -10px rgba(0,0,0,.5)!important;border:0!important}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login .sb,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login .swap,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login .demo{color:var(--cx-sub)!important}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login a,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .auth a{color:var(--cx-ice)!important}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login code,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login .demo b,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login kbd{background:rgba(2,8,20,.42)!important;color:#fff!important;border:0!important}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login .err,:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .auth .err{color:#ffb4a8}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login .brandlogo{content:url(brand/logo-dark.svg);filter:none}   /* the white logo with its green c (Gal 31.10), not a filtered copy */
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .auth .logo img{filter:brightness(0) invert(1)}:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .auth .logo b{color:#fff}
:is(html[data-look=cosmos],html[data-look=cosmos-owner]) .login .chk2{color:var(--cx-sub)}

/* =================================== THE OWNER CONSOLE (canvas: חדר הבקרה · SpaceCall) ===================================
   server/owner_ui (its own app). The same Earth, glass and marbles; the side menu becomes the floating rail. */
html[data-look=cosmos-owner]{--bg:transparent;--panel:rgba(2,8,20,.38);--panel2:rgba(255,255,255,.06);--line:rgba(255,255,255,.1);--line2:rgba(255,255,255,.16);--tx:#fff;--mu:rgba(220,234,252,.74);--mu2:rgba(220,234,252,.6);
 --ocean:#7dd3fc;--ocean2:#b5e6ff;--land:#20D99E;--land2:#7dffcf;--warn:#ffc970;--warnbg:rgba(217,166,80,.18);--bad:#ff8a7a;--badbg:rgba(232,102,79,.18);--sh:none;background:#000;color-scheme:dark}
html[data-look=cosmos-owner],html[data-look=cosmos-owner] body{background:transparent;color:#fff;font-family:var(--cx-font);font-size:13px}
html[data-look=cosmos-owner] body{text-shadow:0 1px 2px rgba(0,0,0,.35)}
html[data-look=cosmos-owner] .shell{display:block;min-height:100vh}
/* the rail */
html[data-look=cosmos-owner] .side{position:fixed;z-index:20;right:20px;top:50%;transform:translateY(-50%);width:74px;height:auto;max-height:calc(100vh - 40px);padding:12px 0;gap:8px;align-items:center;border-radius:999px;
 background:var(--cx-win)!important;box-shadow:var(--cx-win-sh);backdrop-filter:blur(20px) saturate(175%) brightness(.92);-webkit-backdrop-filter:blur(20px) saturate(175%) brightness(.92);overflow-y:auto;scrollbar-width:none}
html[data-look=cosmos-owner] .side .brand,html[data-look=cosmos-owner] .side .sp,html[data-look=cosmos-owner] .side .who{display:none}
html[data-look=cosmos-owner] .side .nv{position:relative;width:auto;flex-direction:column;gap:4px;padding:0;background:none!important;box-shadow:none!important;font-size:10.5px;font-weight:600;color:#fff;text-align:center;line-height:1.15}
html[data-look=cosmos-owner] .side .nv svg{width:40px;height:40px;padding:11px;border-radius:50%;color:#fff!important;background:var(--cx-m-blue);box-shadow:var(--cx-m-sh);filter:none;transition:transform .2s}
html[data-look=cosmos-owner] .side .nv:hover svg{transform:translateY(-1px) scale(1.05)}
html[data-look=cosmos-owner] .side .nv.on svg{width:48px;height:48px;padding:13px;box-shadow:var(--cx-m-sh),0 0 0 3px rgba(255,255,255,.18),0 0 22px rgba(79,182,230,.55)}
html[data-look=cosmos-owner] .side .nv[data-go=money] svg{background:var(--cx-m-gold)}
html[data-look=cosmos-owner] .side .nv[data-go=live] svg,html[data-look=cosmos-owner] .side .nv[data-go=system] svg{background:var(--cx-m-green)}
html[data-look=cosmos-owner] .side .nv[data-go=agents] svg{background:var(--cx-m-ai)}
html[data-look=cosmos-owner] .side .nv#out svg{background:var(--cx-m-slate);color:#0b1626!important}
html[data-look=cosmos-owner] .side .nv .cnt{position:absolute;top:-3px;left:6px;margin:0;min-width:16px;height:16px;padding:0 4px;border-radius:99px;font:700 9.5px/16px var(--cx-font);background:radial-gradient(circle at 35% 28%,#ffd2b8,#f26a2e 60%,#b23c0b);color:#fff;border:1.5px solid rgba(255,255,255,.8)}
html[data-look=cosmos-owner] .side .nv .hdot{position:absolute;top:0;right:8px}
/* the page */
html[data-look=cosmos-owner] main{display:block;padding:24px 116px 30px 28px;max-width:1500px;margin:0 auto}
html[data-look=cosmos-owner] .top,html[data-look=cosmos-owner] .hero,html[data-look=cosmos-owner] .ov-hero{background:var(--cx-win)!important;color:#fff;border:0;border-radius:24px;box-shadow:var(--cx-win-sh);backdrop-filter:blur(20px) saturate(175%) brightness(.92);-webkit-backdrop-filter:blur(20px) saturate(175%) brightness(.92)}
html[data-look=cosmos-owner] .top::before,html[data-look=cosmos-owner] .top::after,html[data-look=cosmos-owner] .hero::before,html[data-look=cosmos-owner] .hero::after{display:none}
html[data-look=cosmos-owner] .panel,html[data-look=cosmos-owner] .kpi,html[data-look=cosmos-owner] .wcd,html[data-look=cosmos-owner] .wal,html[data-look=cosmos-owner] .ov-money,html[data-look=cosmos-owner] .ov-todo,html[data-look=cosmos-owner] .ov-do,html[data-look=cosmos-owner] .story,html[data-look=cosmos-owner] .ledger,html[data-look=cosmos-owner] .agrid>*,html[data-look=cosmos-owner] .tbl-wrap{
 background:var(--cx-win)!important;color:#fff;border:0!important;border-radius:24px;box-shadow:var(--cx-win-sh)!important;backdrop-filter:blur(20px) saturate(175%) brightness(.92);-webkit-backdrop-filter:blur(20px) saturate(175%) brightness(.92)}
html[data-look=cosmos-owner] .panel .panel,html[data-look=cosmos-owner] .panel .kpi,html[data-look=cosmos-owner] .tbl-wrap .tbl-wrap{background:var(--cx-rec)!important;box-shadow:var(--cx-rec-sh)!important;backdrop-filter:none;-webkit-backdrop-filter:none;border-radius:16px}
html[data-look=cosmos-owner] h1,html[data-look=cosmos-owner] h2,html[data-look=cosmos-owner] h3,html[data-look=cosmos-owner] b,html[data-look=cosmos-owner] strong{color:#fff}
html[data-look=cosmos-owner] .sb,html[data-look=cosmos-owner] small,html[data-look=cosmos-owner] .mu,html[data-look=cosmos-owner] .lb,html[data-look=cosmos-owner] label{color:var(--cx-mu)}
html[data-look=cosmos-owner] .num{font-family:var(--cx-num);font-weight:500}
html[data-look=cosmos-owner] table{color:#fff}html[data-look=cosmos-owner] th{color:var(--cx-mu);background:none!important;border-color:rgba(255,255,255,.1)!important}
html[data-look=cosmos-owner] td{border-color:rgba(255,255,255,.07)!important}html[data-look=cosmos-owner] tr:hover td{background:rgba(255,255,255,.05)}
html[data-look=cosmos-owner] .btn{background:rgba(255,255,255,.13);color:#fff;border:0;border-radius:999px;box-shadow:var(--cx-gl-sh);font-weight:600}
html[data-look=cosmos-owner] .btn:hover{background:rgba(255,255,255,.2)}
html[data-look=cosmos-owner] .btn.p,html[data-look=cosmos-owner] .btn.g,html[data-look=cosmos-owner] .btn.primary{background:rgba(255,255,255,.95);color:#0b1626;text-shadow:none;font-weight:800}
html[data-look=cosmos-owner] .btn.d,html[data-look=cosmos-owner] .btn.bad,html[data-look=cosmos-owner] .btn.danger{background:rgba(232,102,79,.3);color:#fff}
html[data-look=cosmos-owner] .f,html[data-look=cosmos-owner] input:not([type=checkbox]):not([type=radio]),html[data-look=cosmos-owner] select,html[data-look=cosmos-owner] textarea{background:rgba(2,8,20,.42);color:#fff;border:0;border-radius:14px;box-shadow:inset 0 1px 2px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.1)}
html[data-look=cosmos-owner] select option{background:#0c1a33}
html[data-look=cosmos-owner] .tabs,html[data-look=cosmos-owner] .mtabs,html[data-look=cosmos-owner] .seg{background:rgba(255,255,255,.1);border:0;border-radius:999px;padding:4px;box-shadow:var(--cx-gl-sh)}
html[data-look=cosmos-owner] .tabs button,html[data-look=cosmos-owner] .mtabs button,html[data-look=cosmos-owner] .seg button{border-radius:999px;color:#fff;background:none;border:0}
html[data-look=cosmos-owner] .tabs .on,html[data-look=cosmos-owner] .mtabs .on,html[data-look=cosmos-owner] .seg .on{background:rgba(255,255,255,.95)!important;color:#0b1626!important;text-shadow:none;font-weight:800}
html[data-look=cosmos-owner] .tag,html[data-look=cosmos-owner] .pill,html[data-look=cosmos-owner] .ov-chip{background:rgba(255,255,255,.12);color:#fff;border:0;box-shadow:var(--cx-gl-sh)}
html[data-look=cosmos-owner] .gauge,html[data-look=cosmos-owner] .bar{background:var(--cx-rec);box-shadow:var(--cx-rec-sh)}
html[data-look=cosmos-owner] .dlg{background:var(--cx-win-solid);color:#fff;border:0;border-radius:28px;box-shadow:var(--cx-win-sh)}
html[data-look=cosmos-owner] .modal{background:rgba(1,5,14,.55)}
html[data-look=cosmos-owner] .toast{background:rgba(6,14,32,.92);color:#fff;border-radius:99px;box-shadow:var(--cx-win-sh)}
html[data-look=cosmos-owner] .empty{color:var(--cx-sub)}
html[data-look=cosmos-owner] a{color:var(--cx-ice)}
/* the overview's orbit of businesses */
html[data-look=cosmos-owner] .ov-orbit,html[data-look=cosmos-owner] .orbit{background:none!important;box-shadow:none!important}
html[data-look=cosmos-owner] .ov-core{border-radius:50%;background:radial-gradient(circle at 32% 20%,rgba(255,255,255,.9) 0%,rgba(255,255,255,0) 24%),radial-gradient(circle at 40% 35%,#dff4ff,#4fb6e6 48%,#0b4467 100%)!important;box-shadow:inset 0 -14px 24px rgba(0,30,60,.45),inset 0 6px 12px rgba(255,255,255,.6),0 0 60px rgba(79,182,230,.55)!important;color:#fff!important;border:0}
html[data-look=cosmos-owner] .sat .dot,html[data-look=cosmos-owner] .ov-orbit .dot{background:radial-gradient(circle at 32% 20%,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 22%),radial-gradient(circle at 35% 30%,#4a5566,#1c2433 55%,#070b14)!important;color:#fff!important;box-shadow:inset 0 -6px 10px rgba(0,0,0,.3),inset 0 3px 6px rgba(255,255,255,.5),0 0 0 2px rgba(6,14,32,.9),0 0 0 4px #4fb6e6!important}
@media (max-width:760px){html[data-look=cosmos-owner] .side{top:auto;bottom:10px;left:10px;right:10px;transform:none;width:auto;height:76px;flex-direction:row;justify-content:space-around;overflow-x:auto}html[data-look=cosmos-owner] main{padding:16px 12px 100px}}
/* pages without style.css (the owner console) still need the background layers placed */
html[data-look=cosmos-owner] .earthwrap{position:fixed;inset:0;z-index:-2;pointer-events:none}
html[data-look=cosmos-owner] .earth{position:absolute;inset:0}
html[data-look=cosmos-owner] .veil{position:fixed;inset:0;z-index:-1;pointer-events:none}
html[data-look=cosmos-owner] .ov-t{background:var(--cx-win)!important;border:0!important;border-radius:22px;box-shadow:var(--cx-win-sh)!important;backdrop-filter:blur(20px) saturate(175%) brightness(.92);-webkit-backdrop-filter:blur(20px) saturate(175%) brightness(.92);color:#fff}
html[data-look=cosmos-owner] .ov-orbit{border:0!important;box-shadow:none!important;outline:0}
html[data-look=cosmos-owner] .ov-k,html[data-look=cosmos-owner] .ov-hero p{color:var(--cx-sub)}
html[data-look=cosmos-owner] .ov-date{color:var(--cx-ice)}
html[data-look=cosmos-owner] .stack{background:var(--cx-rec)!important;box-shadow:var(--cx-rec-sh)!important}
html[data-look=cosmos-owner] .hc{background:var(--cx-rec)!important;border:0!important;box-shadow:var(--cx-rec-sh)!important;color:#fff}
html[data-look=cosmos-owner] .hc.ok{box-shadow:inset 0 0 0 1px rgba(125,255,207,.35)!important}html[data-look=cosmos-owner] .hc.off{box-shadow:inset 0 0 0 1px rgba(255,138,122,.45)!important}
html[data-look=cosmos-owner] .sw{background:rgba(2,8,20,.42)!important;box-shadow:var(--cx-rec-sh)!important}
html[data-look=cosmos-owner] .note{background:var(--cx-rec)!important;border:0!important;color:var(--cx-sub)!important;border-radius:14px}
html[data-look=cosmos-owner] .note.warn,html[data-look=cosmos-owner] .note.warn *{color:#ffd58f!important}html[data-look=cosmos-owner] .note.warn{background:rgba(217,166,80,.16)!important}
html[data-look=cosmos-owner] .note.bad,html[data-look=cosmos-owner] .note.bad *{color:#ffb4a8!important}
html[data-look=cosmos-owner] em{color:var(--cx-warm)}
/* phones: the header pill sits in the page (not floating), with only the title, presence, inbox and the person */
@media (max-width:760px){
 html[data-look=cosmos] header{position:relative;top:auto;left:auto;right:auto;transform:none;max-width:none;margin:0 0 4px;flex-wrap:wrap;gap:8px;padding:8px 10px;overflow:visible}
 html[data-look=cosmos] header .hkpis,html[data-look=cosmos] header .lbp,html[data-look=cosmos] header .lang,html[data-look=cosmos] header .helpbtn,html[data-look=cosmos] header .over{display:none!important}
 html[data-look=cosmos] header .cx-brand span{font-size:14px}html[data-look=cosmos] header .cx-brand svg{width:24px;height:24px}
 html[data-look=cosmos] header .hl{margin-inline-start:auto;gap:6px}
 html[data-look=cosmos] main{padding:10px 10px 96px;grid-template-rows:auto minmax(0,1fr)!important}
 html[data-look=cosmos] main:has(>.subtabs:not([hidden])){grid-template-rows:auto auto minmax(0,1fr)!important}
 html[data-look=cosmos] main>.subtabs{max-width:100%;overflow-x:auto;scrollbar-width:none}
 html[data-look=cosmos] .wpage .tbl{min-width:640px}
}
@media (max-width:760px){
 html[data-look=cosmos] #page-dial.on{justify-content:flex-start!important;align-content:flex-start!important;height:auto!important;min-height:0;perspective:none}
 html[data-look=cosmos] #page-dial .col.c,html[data-look=cosmos] #page-dial .col.l{flex:none!important}
}
@media (max-width:760px){html[data-look=cosmos] header .cx-me div{display:none}html[data-look=cosmos] header .cx-me{padding-right:6px}}
html[data-look=cosmos] .cxh .orbit .orb-more{position:absolute;bottom:6px;left:50%;transform:translateX(-50%);z-index:3;height:28px;padding:0 12px;border-radius:999px;background:rgba(3,8,20,.62);box-shadow:var(--cx-gl-sh);color:#fff;font-size:11.5px;font-weight:600;border:0}
/* premium.js marks in the queue and the history (information, kept in the Earth design) */
html[data-look=cosmos] #queue .q{flex-wrap:wrap}
html[data-look=cosmos] #queue .q>div:nth-child(2){flex:1;min-width:0}
html[data-look=cosmos] #queue .pq-ev{font-size:11px;font-weight:600;color:#9fd8ff;margin-top:1px}
html[data-look=cosmos] #queue .q[data-ev=meeting] .pq-ev{color:#9ff0d0}
html[data-look=cosmos] #queue .q.soon .pq-ev{color:#ffd58f}
html[data-look=cosmos] #queue .pq-next{position:absolute;top:4px;left:10px;font-size:10px;font-weight:700;color:#1c1917;background:rgba(255,255,255,.9);border-radius:99px;padding:0 7px;text-shadow:none}
html[data-look=cosmos] #queue .q{position:relative}
html[data-look=cosmos] .pq-oc{margin-inline-start:6px;font-size:11px;font-weight:700;padding:1px 8px;border-radius:99px;background:rgba(255,255,255,.12);color:#fff}
html[data-look=cosmos] .tli2[data-oc=won] .pq-oc{background:rgba(32,201,141,.25);color:#9ff0d0}html[data-look=cosmos] .tli2[data-oc=no] .pq-oc{background:rgba(232,102,79,.25);color:#ffd0c8}
html[data-look=cosmos] .pq-nextstep b{color:#9ff0d0}html[data-look=cosmos] .pq-block b{color:#ffc29a}
html[data-look=cosmos] .pm-orb{position:relative;display:inline-block;width:34px;height:34px;flex:none;border-radius:50%;background:var(--cx-m-ai);box-shadow:var(--cx-m-sh)}
html[data-look=cosmos] .pm-orb>i{display:none}
/* the dialer keeps one height in every stage (Gal 25.10: no jumping): the controls step aside while choosing how the call ended */
html[data-look=cosmos] body[data-st=wrap] #page-dial .dialrow{display:none!important}
html[data-look=cosmos] #page-dial .card.dialer{min-height:300px!important;justify-content:flex-start}
html[data-look=cosmos] body[data-st=wrap] #page-dial .card.dialer .wrapbar{margin-top:auto}
/* short laptop windows: everything a bit tighter so nothing is cut and nothing scrolls */
@media (max-height:760px){
 html[data-look=cosmos] main{padding-top:92px}
 html[data-look=cosmos] header{top:16px;padding:6px 10px}
 html[data-look=cosmos] #page-dial .col.c{gap:10px!important}
 html[data-look=cosmos] #page-dial .card.dialer{padding:12px 16px!important;min-height:270px!important;gap:6px!important}
 html[data-look=cosmos] body[data-st] #page-dial .dialrow .callnow{width:72px!important;height:72px!important}
 html[data-look=cosmos] #page-dial .dialrow .cb{width:40px!important;height:40px!important}
 html[data-look=cosmos] #page-dial .card.nova{padding:10px 14px!important;gap:6px}
 html[data-look=cosmos] #page-dial .card.actions{padding:12px 14px}
 html[data-look=cosmos] #novaFeed .empty{font-size:12px;line-height:1.4;padding:4px 0}
}
html[data-look=cosmos] body #page-dial .numrow .big .numin{font-size:clamp(19px,2.1vw,27px)}
/* the header spans the same width as the row of windows under it: centred on the page (Gal 01.11) with its edges lined up with the
   windows (Gal 31.10). So the page never jumps while it fills in (the numbers and the person arrive
   a moment later), it stays invisible until cosmos.js says it is filled (html.cx-head-ready, at most 1.5 seconds) */
@media (min-width:1101px){html[data-look=cosmos] main>header{left:24px;right:112px;transform:none;width:auto;max-width:none;justify-content:space-between}
 html[data-look=cosmos]:not(.cx-head-ready) main>header{visibility:hidden}}
/* the number stays on screen while choosing how the call ended: a new number can be typed right away (and the canvas shows it) */
html[data-look=cosmos] body[data-st=wrap] #page-dial .numrow{display:flex!important}
html[data-look=cosmos] body.nocall[data-st=wrap] #page-dial .numrow{display:none!important}
/* decorations never take a click (some handlers read e.target) */
html[data-look=cosmos] .oi,html[data-look=cosmos] .mbr,html[data-look=cosmos] .ob-star,html[data-look=cosmos] .ob-g,html[data-look=cosmos] .ob-sky,html[data-look=cosmos] .ob-orbit,html[data-look=cosmos] .ob-aur,html[data-look=cosmos] .ob-path{pointer-events:none}
html[data-look=cosmos] nav .ob-path,html[data-look=cosmos] nav .ob-g{display:none}
@media (min-width:1151px){html[data-look=cosmos] #page-dial.grid{grid-template-columns:minmax(272px,330px) minmax(420px,600px) minmax(270px,330px)!important}}
/* the header shows four numbers; "עוד +N" opens the rest in a small glass panel under it (orbit.js adds the button) */
html[data-look=cosmos] #hudTiles .hk:nth-child(4){display:block!important}
html[data-look=cosmos] header .hkpis{position:relative}
html[data-look=cosmos][data-ob-kopen] #hudTiles .hk:nth-child(n+5){display:block!important;position:absolute;top:calc(100% + 14px);z-index:70;width:112px;padding:8px 10px;border-radius:16px;background:var(--cx-win-solid)!important;box-shadow:var(--cx-win-sh)!important}
html[data-look=cosmos][data-ob-kopen] #hudTiles .hk:nth-child(5){left:0}html[data-look=cosmos][data-ob-kopen] #hudTiles .hk:nth-child(6){left:118px}
html[data-look=cosmos][data-ob-kopen] #hudTiles .hk:nth-child(7){left:236px}html[data-look=cosmos][data-ob-kopen] #hudTiles .hk:nth-child(8){left:354px}html[data-look=cosmos][data-ob-kopen] #hudTiles .hk:nth-child(9){left:472px}
html[data-look=cosmos] header #obMore{cursor:pointer;color:#fff}
html[data-look=cosmos] header #obMore[aria-expanded=true]{background:rgba(255,255,255,.24)!important}
html[data-look=cosmos] header #obMore{display:block!important}
html[data-look=cosmos] main>header{z-index:45}
html[data-look=cosmos] main>header{overflow:visible!important}
html[data-look=cosmos] #saOrb{width:44px!important;height:44px!important}
/* windows narrower than a laptop: the header sits in the page and wraps, so nothing sticks out of the window */
@media (max-width:1100px){
 html[data-look=cosmos] main>header{position:relative;top:auto;left:auto;right:auto;transform:none;max-width:none;flex-wrap:wrap;overflow:visible!important;margin:0 0 4px}
 html[data-look=cosmos] main{padding-top:16px;grid-template-rows:auto minmax(0,1fr)!important}
 html[data-look=cosmos] main:has(>.subtabs:not([hidden])){grid-template-rows:auto auto minmax(0,1fr)!important}
 html[data-look=cosmos] header .hkpis{flex-wrap:wrap;min-width:0;max-width:100%}
 html[data-look=cosmos] header .hl{flex-wrap:wrap;min-width:0}
}
/* Gal 31.10: "things don't sit in place, text is not straight". The side windows stand straight (the 3D lean slanted every line of text),
   the three columns fill the width so their right edge lines up with the header, and the queue search sits on one line with its sort button */
@media (min-width:1151px){
 html[data-look=cosmos] #page-dial.grid{perspective:none}
 html[data-look=cosmos] #page-dial .col.r,html[data-look=cosmos] #page-dial .col.l{transform:none!important}
}
@media (min-width:1441px){html[data-look=cosmos] #page-dial.grid{justify-content:stretch;grid-template-columns:minmax(272px,400px) minmax(420px,1fr) minmax(270px,400px)!important}}
html[data-look=cosmos] .qsearch{align-items:center}
html[data-look=cosmos] .qsearch input{height:34px!important;min-height:0!important;padding-block:0!important;box-sizing:border-box}
html[data-look=cosmos] .qsearch .ab{flex:none;margin:0!important}
/* Gal 31.10: the background chip covered the corner of the customer card. On laptop and desktop it becomes a small round button
   under the side menu (the full name stays in its tooltip and for screen readers) */
@media (min-width:1101px){
 html[data-look=cosmos] .cx-bg{left:auto;right:35px;bottom:18px;width:40px;height:40px;padding:0;justify-content:center;font-size:0;border-radius:50%;
  background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.55),rgba(255,255,255,0) 30%),radial-gradient(circle at 40% 40%,#5fb0e8,#1d5f9c 55%,#0b2a4d);box-shadow:var(--cx-m-sh,0 4px 12px rgba(0,0,0,.4))}
 html[data-look=cosmos] .cx-bg::before{content:"";width:20px;height:20px;background:#fff;-webkit-mask:var(--g) center/contain no-repeat;mask:var(--g) center/contain no-repeat;
  --g:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2.5'/%3E%3Cpath d='M3 16l5-5 4 4 3-3 6 6'/%3E%3Ccircle cx='15.5' cy='9' r='1.5'/%3E%3C/svg%3E")}
}
@media (min-width:1101px) and (max-height:759px){html[data-look=cosmos] .cx-bg{right:40px;bottom:8px;width:30px;height:30px}html[data-look=cosmos] .cx-bg::before{width:15px;height:15px}}
@media (min-width:1101px) and (max-height:699px){html[data-look=cosmos] .cx-bg{right:auto;left:2px;bottom:2px}html[data-look=cosmos] body:has(#page-dial.on) .cx-bg{display:none}}
/* Gal 31.10: the letter inside an avatar marble sat on its right edge (centered top-to-bottom only) */
html[data-look=cosmos] .av{justify-content:center;text-align:center}

/* the brand: the c of "call" in spacecall is green, everywhere (Gal 10.11) */
.cx-c{color:#20D99E!important;font-style:normal;-webkit-text-fill-color:#20D99E}

/* owner nav (Gal 08.11): everyday pages first, then setup and maintenance */
html[data-look=cosmos-owner] .side .nvsep{width:40px;height:1px;margin:2px auto;background:rgba(255,255,255,.28);flex:none}

/* the key under the orbit, readable for a manager (Gal 12.11): a number and a word for every colour */
.orb-key.okx{gap:8px}
.orb-key.okx .okc{height:34px;padding:0 14px 0 12px;gap:8px;font-size:14px;font-weight:500}
.orb-key.okx .okc b{font:600 17px var(--cx-num,inherit);letter-spacing:-.01em}
.orb-key.okx .okc.zero{opacity:.62}
.orb-key.okx .k{width:11px;height:11px}
.ctln.okhot{font-size:14px;color:#fff}
.ctln.okhot .num{font-size:18px;font-weight:600}
@media (max-width:760px){.orb-key.okx .okc{height:32px;padding:0 11px 0 10px;font-size:13px}.orb-key.okx .okc b{font-size:15px}}