/* ch-atlas: the Atlas chapter (Amazing Companies). Every rule sits under #ch-atlas or an .at-* class, since the chapter's
   own classes (.ch, .ch-head, .tag) are builder A's. The clips are drawn by ch-atlas.js on components/motion/ and
   components/clips/: a canvas of fixed design size (a wide 1200 by 515 for the opening, a 600 square for each step)
   scaled to its frame, so every size below is a design pixel. What is drawn inside is a picture of the product, so it
   wears the product's own colours (Atlas's CARTA: white paper on a pastel wash, the indigo #4c59e6, one tint per
   project), not the site's. */

/* ---------- the page ---------- */
#ch-atlas .atlas-open{position:relative}
#ch-atlas .atlas-sec{padding-block:clamp(56px,7vw,112px) 0}
#ch-atlas .atlas-sec .cl-h2{max-width:14ch}
#ch-atlas .atlas-sec .cl-p{max-width:44ch}

/* ---------- the frames: a picture of the product on black ---------- */
.at-frame.cl-frame{background:radial-gradient(80% 90% at 50% 0%,#17171d,#0b0b0e 70%);box-shadow:inset 0 0 0 1px rgb(255 255 255/.07)}
.at-frame{
  --a-wash:oklch(96.9% .014 292);--a-s:#fff;--a-s2:oklch(98.2% .006 290);--a-s3:oklch(95.4% .012 290);--a-s4:oklch(92% .014 290);
  --a-ink:oklch(21% .012 280);--a-ink2:oklch(37% .012 280);--a-ink3:oklch(50% .014 280);--a-ink4:oklch(62% .012 280);
  --a-brand:#4c59e6;--a-brand2:#3a46c4;--a-soft:oklch(93.5% .05 288);
  --a-ok:oklch(60% .15 155);--a-ok-soft:oklch(94.5% .04 155);--a-ok-ink:#177245;
  --a-warn:oklch(70% .14 70);--a-warn-soft:oklch(95% .035 80);--a-warn-ink:#9a5a08;
  --a-hair:oklch(28% .03 292/.09);--a-hair2:oklch(28% .03 292/.16);
  --t1:oklch(90.5% .065 295);--t1i:oklch(36% .14 295);--t2:oklch(91.5% .05 245);--t2i:oklch(37% .11 250);
  --t3:oklch(92.5% .06 160);--t3i:oklch(36% .10 165);--t4:oklch(93% .075 95);--t4i:oklch(40% .10 75);--t5:oklch(91.5% .055 20);--t5i:oklch(38% .13 20);
  --a-ring:0 0 0 1px oklch(32% .06 292/.07),0 1px 2px oklch(30% .09 292/.08);
  --a-lift:0 0 0 1px oklch(32% .06 292/.07),0 12px 30px -10px oklch(30% .09 292/.28);
}
.at-frame .cl-cv{color:var(--a-ink)}

/* ---------- the opening: a browser full of tabs, then one window ---------- */
.at-brow{position:absolute;left:0;top:0;width:1200px;height:515px;background:#16161b}
.at-strip{position:absolute;left:0;top:0;width:1200px;height:42px;background:#0f0f13;box-shadow:inset 0 -1px 0 rgb(255 255 255/.06)}
.at-comb{position:absolute;left:8px;top:9px;right:8px;height:33px;display:flex;gap:2px}
.at-tab{position:relative;flex:none;height:33px;border-radius:9px 9px 0 0;background:#25252c;overflow:hidden;transform-origin:50% 100%}
.at-tab i{position:absolute;left:6px;top:11px;width:9px;height:9px;border-radius:3px;background:var(--c,#888)}
.at-tab b{position:absolute;left:19px;right:5px;top:14px;height:3px;border-radius:2px;background:#4a4a55}
.at-tab.on{background:#34343d}
.at-tab.big{display:flex;align-items:center;gap:8px;padding:0 14px 0 12px;border-radius:10px 10px 0 0;background:#f7f6fb;color:var(--a-ink);font-size:14px;font-weight:600;width:176px}
.at-tab.big .at-mark{position:static;width:18px;height:18px;border-radius:6px;font-size:11px}
.at-url{position:absolute;left:210px;top:7px;height:28px;width:520px;border-radius:14px;background:#25252c;color:#8f8fa0;font-size:13px;display:flex;align-items:center;padding:0 14px;opacity:0}
.at-page{position:absolute;left:0;top:42px;width:1200px;height:473px;overflow:hidden}
.at-mark{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:linear-gradient(160deg,#6a76f2,#3a46c4);color:#fff;font-weight:700;font-size:15px;letter-spacing:-.02em;flex:none}

/* the pile: five apps, none of them ours */
.at-app{position:absolute;border-radius:12px;background:#f1f1f4;color:#2a2a33;box-shadow:0 30px 60px -24px rgb(0 0 0/.8),0 0 0 1px rgb(255 255 255/.08);rotate:var(--r,0deg);overflow:hidden}
.at-app>header{display:flex;align-items:center;gap:8px;height:30px;padding:0 12px;background:var(--c,#999);color:#fff;font-size:13px;font-weight:620;letter-spacing:.01em}
.at-app>header svg{width:14px;height:14px;stroke-width:2.2}
.at-app>header em{margin-left:auto;display:grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:#fff;color:var(--c);font-style:normal;font-size:11px;font-weight:700}
.at-app .bd{padding:10px 12px;display:grid;gap:8px}
.at-bar{height:7px;border-radius:4px;background:#c9c9d2}
.at-bar.s{width:46%}.at-bar.m{width:70%}.at-bar.l{width:92%}
.at-row{display:flex;align-items:center;gap:9px}
.at-row .dot{width:22px;height:22px;border-radius:50%;background:#d6d6de;flex:none}
.at-row .col{display:grid;gap:5px;flex:1}
.at-row.un .at-bar:first-child{background:#6f6f7d}
.at-bub{width:62%;padding:9px 10px;border-radius:10px;background:#dcdce4;display:grid;gap:5px}
.at-bub.me{margin-left:auto;background:var(--c,#7a5cff);}
.at-bub.me .at-bar{background:rgb(255 255 255/.7)}
.at-wk{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;padding:8px 10px;height:calc(100% - 30px)}
.at-wk span{position:relative;border-radius:5px;background:#e4e4ea}
.at-wk span i{position:absolute;left:3px;right:3px;border-radius:4px;background:var(--c)}
.at-sh{display:grid;grid-template-columns:30px repeat(4,1fr);gap:1px;padding:8px 10px;background:#f1f1f4}
.at-sh span{height:17px;background:#fff;border-radius:2px}
.at-sh span.hd{background:#dfe8e2}
.at-sh span.nu::after{content:"";display:block;margin:6px 5px 0 auto;width:40%;height:5px;border-radius:3px;background:#b8b8c4}
.at-ck{display:flex;align-items:center;gap:9px}
.at-ck u{width:15px;height:15px;border-radius:5px;border:2px solid #b4b4c0;flex:none;text-decoration:none}
.at-ck.dn u{background:var(--c);border-color:var(--c)}
.at-ck.dn .at-bar{background:#dedee6}
.at-badge{position:absolute;right:10px;top:8px;width:14px;height:14px;border-radius:50%;background:#ff4d4d;box-shadow:0 0 0 3px rgb(0 0 0/.0);animation:at-ping 1.6s infinite}
@keyframes at-ping{0%{box-shadow:0 0 0 0 rgb(255 77 77/.6)}70%,100%{box-shadow:0 0 0 9px rgb(255 77 77/0)}}
.at-bob{animation:at-bob 3.2s ease-in-out infinite alternate}
@keyframes at-bob{from{translate:0 -3px}to{translate:0 4px}}

/* the caption, over everything */
.at-cap{position:absolute;left:50%;bottom:22px;translate:-50% 0;z-index:35;width:max-content;max-width:90%;padding:11px 20px;border-radius:999px;background:rgb(12 12 16/.78);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px rgb(255 255 255/.12);color:#fff;font-size:19px;font-weight:540;letter-spacing:-.01em;white-space:nowrap}
.at-cap em{font-style:normal;color:#aab2ff}
.sq-cap.at-cap{bottom:18px;font-size:17px;padding:9px 17px}

/* ---------- Atlas itself ---------- */
.at-shell{position:absolute;left:0;top:42px;width:1200px;height:473px;display:grid;grid-template-columns:184px 1fr;gap:10px;padding:10px;background:var(--a-wash)}
.at-side{display:grid;grid-template-rows:auto 1fr auto;align-content:start;gap:14px;padding:6px 4px}
.at-brand{display:flex;align-items:center;gap:9px;padding:2px 6px;font-weight:650;font-size:16px;letter-spacing:-.02em}
.at-nav{display:grid;gap:2px;align-content:start}
.at-nav>span{display:flex;align-items:center;gap:10px;height:34px;padding:0 10px;border-radius:9px;font-size:14.5px;font-weight:540;color:var(--a-ink2);transition:background-color .2s,box-shadow .2s}
.at-nav>span svg{width:17px;height:17px;stroke:var(--a-ink3);stroke-width:1.9;flex:none}
.at-nav>span.on{background:var(--a-s);box-shadow:var(--a-ring);color:var(--a-ink)}
.at-nav>span.on svg{stroke:var(--a-brand)}
.at-nav>span.hover{background:oklch(24% .02 268/.06)}
.at-me{display:flex;align-items:center;gap:9px;padding:4px 6px;font-size:14px;font-weight:560;color:var(--a-ink2)}
.at-me img{width:28px;height:28px;border-radius:50%;object-fit:cover}
.at-main{position:relative;min-width:0;border-radius:14px;background:var(--a-s);box-shadow:var(--a-ring);overflow:hidden;display:grid;grid-template-rows:auto 1fr}
.at-top{display:flex;align-items:center;gap:12px;height:50px;padding:0 18px;border-bottom:1px solid var(--a-hair)}
.at-top h3{font-size:17px;font-weight:650;letter-spacing:-.02em;margin:0}
.at-seg{display:inline-flex;padding:2px;border-radius:9px;background:var(--a-s3)}
.at-seg span{padding:5px 11px;border-radius:7px;font-size:13px;font-weight:580;color:var(--a-ink3)}
.at-seg span.on{background:var(--a-s);box-shadow:var(--a-ring);color:var(--a-ink)}
.at-grow{margin-left:auto}
.at-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:30px;padding:0 13px;border-radius:9px;background:var(--a-s);box-shadow:var(--a-ring);font-size:13.5px;font-weight:600;color:var(--a-ink);white-space:nowrap;transition:background-color .15s,transform .12s}
.at-btn svg{width:14px;height:14px;stroke-width:2.2}
.at-btn.go{background:var(--a-brand);color:#fff;box-shadow:0 1px 2px oklch(30% .15 280/.4)}
.at-btn.go.hover{background:var(--a-brand2)}
.at-btn.hover{background:var(--a-s3)}
.at-btn.sm{height:26px;padding:0 10px;font-size:12.5px;border-radius:8px}
.at-btn.press{transform:scale(.94)}
.at-chip{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:7px;font-size:12px;font-weight:600;white-space:nowrap;background:var(--a-s3);color:var(--a-ink2)}
.at-chip i{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.at-chip svg{width:12px;height:12px;stroke-width:2.3}
.at-chip.t1{background:var(--t1);color:var(--t1i)}.at-chip.t2{background:var(--t2);color:var(--t2i)}.at-chip.t3{background:var(--t3);color:var(--t3i)}
.at-chip.t4{background:var(--t4);color:var(--t4i)}.at-chip.t5{background:var(--t5);color:var(--t5i)}
.at-chip.ok{background:var(--a-ok-soft);color:var(--a-ok-ink)}.at-chip.warn{background:var(--a-warn-soft);color:var(--a-warn-ink)}
.at-chip.brand{background:var(--a-soft);color:var(--a-brand2)}
.at-cartiglio{font-family:ui-monospace,"SF Mono",Menlo,monospace;font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--a-brand2)}

/* the board: the days of a week as columns (To Do) */
.at-board{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding:14px 16px;min-height:0}
.at-col{display:grid;grid-auto-rows:min-content;gap:8px;align-content:start;min-width:0}
.at-col>h4{margin:0;display:flex;align-items:center;gap:6px;height:24px;font-size:13px;font-weight:620;color:var(--a-ink3);padding:0 2px 2px}
.at-col>h4 b{font-weight:650;color:var(--a-ink)}
.at-col.today>h4 b{display:inline-grid;place-items:center;height:21px;padding:0 8px;border-radius:11px;background:var(--a-brand);color:#fff}
.at-col.today>h4 em{font-style:normal;color:var(--a-brand2)}
.at-task{display:grid;gap:7px;padding:10px 11px;border-radius:11px;background:var(--a-s);box-shadow:var(--a-ring);min-width:0}
.at-task p{margin:0;font-size:13.5px;font-weight:570;line-height:1.28;color:var(--a-ink);letter-spacing:-.005em}
.at-task .m{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--a-ink3)}
.at-task .m .src{margin-left:auto;display:grid;place-items:center;width:20px;height:20px;border-radius:6px;background:var(--a-s3);color:var(--a-ink3)}
.at-task .m .src svg{width:12px;height:12px;stroke-width:2.2}
.at-task.pend{background:var(--a-s2);box-shadow:none;border:1.5px dashed oklch(55% .12 285/.5)}

/* a proposal: Atlas's, always waiting (law 3) */
.at-prop{position:relative;display:grid;grid-template-columns:34px 1fr auto;gap:0 12px;align-items:center;padding:11px 13px;border-radius:12px;background:var(--a-s);border:1.5px dashed oklch(55% .12 285/.5);transition:background-color .35s,border-color .35s,box-shadow .35s}
.at-prop .ic{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--a-soft);color:var(--a-brand2)}
.at-prop .ic svg{width:17px;height:17px;stroke-width:2}
.at-prop b{display:block;font-size:14.5px;font-weight:620;letter-spacing:-.01em;line-height:1.25}
.at-prop small{display:block;margin-top:2px;font-size:12.5px;color:var(--a-ink3)}
.at-prop q{display:inline;font-style:italic;quotes:"\00ab" "\00bb"}
.at-prop .act,.at-prop .done{grid-column:3;grid-row:1}
.at-prop .act{display:flex;gap:6px;align-items:center}
.at-prop.yes{background:var(--a-ok-soft);border:1.5px solid oklch(60% .15 155/.55)}
.at-prop.yes .ic{background:var(--a-ok);color:#fff}
.at-prop .done{display:none;align-items:center;gap:5px;font-size:12.5px;font-weight:650;color:var(--a-ok-ink)}
.at-prop .done svg{width:14px;height:14px;stroke-width:3}
.at-prop.yes .act{display:none}.at-prop.yes .done{display:flex}

/* ---------- step 1: a mail files itself ---------- */
.at-mw{position:absolute;left:16px;top:22px;width:568px;height:556px;border-radius:18px;background:var(--a-wash);box-shadow:0 40px 80px -30px #000,0 0 0 1px rgb(255 255 255/.08);display:grid;grid-template-rows:auto 1fr;padding:8px;gap:8px}
.at-mw .at-top{height:44px;border:0;border-radius:12px 12px 0 0;background:var(--a-s);box-shadow:var(--a-ring)}
.at-mbody{display:grid;grid-template-columns:212px 1fr;gap:8px;min-height:0}
.at-list{border-radius:12px;background:var(--a-s);box-shadow:var(--a-ring);padding:6px;display:grid;grid-auto-rows:min-content;gap:2px;align-content:start;overflow:hidden}
.at-li{position:relative;display:grid;grid-template-columns:30px minmax(0,1fr);gap:3px 9px;padding:12px 8px;border-radius:9px;transition:background-color .2s}
.at-li img{grid-row:1/3;width:30px;height:30px;border-radius:50%;object-fit:cover}
.at-li b{display:flex;justify-content:space-between;gap:6px;font-size:13px;font-weight:600;color:var(--a-ink3)}
.at-li b span{font-weight:500;font-size:11.5px;color:var(--a-ink4)}
.at-li p{margin:0;font-size:13px;line-height:1.3;color:var(--a-ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.at-li.un b{color:var(--a-ink)}.at-li.un p{color:var(--a-ink2)}
.at-li.un::before{content:"";position:absolute;left:1px;top:19px;width:6px;height:6px;border-radius:50%;background:var(--a-brand)}
.at-li.sel{background:var(--a-soft)}
.at-li .read{display:flex;align-items:center;gap:6px;margin-top:2px;grid-column:2}
.at-load{color:transparent;background:linear-gradient(90deg,oklch(50% .01 280/.35) 20%,oklch(30% .02 280/.9) 50%,oklch(50% .01 280/.35) 80%) 0 0/250% 100%;-webkit-background-clip:text;background-clip:text;animation:cl-shine 1.5s linear infinite;font-size:12.5px;white-space:nowrap}
.at-read{border-radius:12px;background:var(--a-s);box-shadow:var(--a-ring);padding:16px 16px;display:grid;grid-auto-rows:min-content;gap:14px;align-content:start;overflow:hidden;position:relative}
.at-read .empty{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:8px;font-size:13.5px;color:var(--a-ink4)}
.at-read .empty svg{width:26px;height:26px;stroke:var(--a-ink4);stroke-width:1.6}
.at-from{display:flex;align-items:center;gap:10px}
.at-from img{width:34px;height:34px;border-radius:50%;object-fit:cover}
.at-from b{display:block;font-size:15.5px;font-weight:640;letter-spacing:-.01em}
.at-from small{display:block;font-size:12.5px;color:var(--a-ink3)}
.at-subj{margin:0;font-size:19px;font-weight:650;letter-spacing:-.02em;line-height:1.2}
.at-syn{display:grid;gap:9px;padding:13px 14px;border-radius:11px;background:var(--a-s2);box-shadow:inset 0 0 0 1px var(--a-hair)}
.at-syn p{margin:0;font-size:15px;line-height:1.4;color:var(--a-ink2)}
.at-syn .chips{display:flex;gap:6px;flex-wrap:wrap}
.at-fold{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--a-ink4)}
.at-fold svg{width:13px;height:13px;stroke-width:2.2}
.at-draft{display:grid;gap:11px;padding:13px 14px;border-radius:11px;background:var(--a-s);border:1.5px dashed oklch(55% .12 285/.5)}
.at-draft .bd{min-height:100px;font-size:15px;line-height:1.45;color:var(--a-ink)}
.at-draft .row{display:flex;align-items:center;gap:7px}
.at-caret{display:inline-block;width:2px;height:1.1em;margin-left:1px;vertical-align:-.2em;background:var(--a-brand);animation:mg-blink 1s steps(1) infinite}
.at-toast{position:absolute;left:50%;bottom:16px;translate:-50% 0;z-index:5;display:flex;align-items:center;gap:8px;padding:9px 15px;border-radius:11px;background:var(--a-ink);color:#fff;font-size:13.5px;font-weight:600;white-space:nowrap;box-shadow:0 14px 30px -10px rgb(0 0 0/.5)}
.at-toast svg{width:15px;height:15px;stroke:#7ee2a8;stroke-width:3}
.at-toast u{text-decoration:none;opacity:.6;font-weight:500}

/* ---------- step 2: it proposes, and waits for a yes ---------- */
.at-card{position:absolute;border-radius:16px;background:var(--a-s);box-shadow:var(--a-lift)}
.at-q{padding:14px 17px;display:grid;gap:9px;left:24px;top:18px;width:552px}
.at-q .at-from{gap:11px}
.at-q .tx{margin:0;font-size:16px;line-height:1.45;color:var(--a-ink2)}
.at-q mark{background:oklch(92% .11 95);color:var(--a-ink);border-radius:4px;padding:1px 3px}
.at-props{left:24px;top:158px;width:552px;padding:12px;display:grid;gap:9px;background:var(--a-wash)}
.at-props .hd{display:flex;align-items:center;gap:9px;padding:0 3px}
.at-props .hd span:last-child{margin-left:auto;font-size:12.5px;color:var(--a-ink3)}
.at-cal{left:24px;top:366px;width:552px;height:176px;overflow:hidden;display:grid;grid-template-columns:44px 1fr 1fr;grid-template-rows:30px 24px 1fr}
.at-cal .dh{display:flex;align-items:center;padding:0 12px;font-size:13px;font-weight:620;color:var(--a-ink3);border-bottom:1px solid var(--a-hair)}
.at-cal .dh b{color:var(--a-ink);margin-left:5px}
.at-cal .ad{position:relative;border-left:1px solid var(--a-hair)}
.at-cal .hrs{grid-row:3;display:grid;grid-template-rows:repeat(4,1fr);font-size:11px;color:var(--a-ink4);text-align:right;padding:0 7px 0 0}
.at-cal .hrs span{padding-top:2px}
.at-cal .day{position:relative;grid-row:3;border-left:1px solid var(--a-hair);background:linear-gradient(var(--a-hair) 1px,transparent 1px) 0 0/100% 30.5px}
.at-blk{position:absolute;left:5px;right:5px;border-radius:8px;padding:5px 9px;background:var(--t2);color:var(--t2i);font-size:12.5px;font-weight:640;line-height:1.25;box-shadow:inset 3px 0 0 var(--a-brand);overflow:hidden}
.at-blk small{display:block;font-weight:520;font-size:11.5px;opacity:.8}
.at-blk.ghost{border:1.5px dashed oklch(55% .12 285/.5);background:var(--a-s2);box-shadow:none;color:var(--a-ink3)}
.at-allday{position:absolute;left:5px;right:5px;top:2px;height:21px;border-radius:7px;background:var(--t3);color:var(--t3i);font-size:12px;font-weight:640;display:flex;align-items:center;padding:0 9px;white-space:nowrap;overflow:hidden}

/* ---------- step 3: loops all night, the morning shows what happened ---------- */
.at-nw{position:absolute;left:16px;top:22px;width:568px;height:556px;border-radius:18px;background:var(--a-wash);box-shadow:0 40px 80px -30px #000,0 0 0 1px rgb(255 255 255/.08);display:grid;grid-template-rows:auto 1fr;padding:8px;gap:8px;overflow:hidden}
.at-nw .at-top{height:48px;border:0;border-radius:12px;background:var(--a-s);box-shadow:var(--a-ring)}
.at-clock{display:inline-flex;align-items:center;gap:8px;height:28px;padding:0 12px 0 9px;border-radius:14px;background:oklch(24% .05 270);color:#dfe3ff;font-size:14px;font-weight:640;font-variant-numeric:tabular-nums;letter-spacing:.01em;transition:background-color .6s,color .6s}
.at-clock svg{width:15px;height:15px;stroke-width:2.2}
.at-clock.day{background:oklch(92% .09 90);color:oklch(38% .09 70)}
.at-nbody{position:relative;display:grid;grid-template-rows:auto 1fr;gap:8px;min-height:0}
.at-lanes{position:relative;border-radius:12px;background:var(--a-s);box-shadow:var(--a-ring);padding:10px 14px 12px;display:grid;gap:0;overflow:hidden}
.at-ln{display:grid;grid-template-columns:150px 1fr;align-items:center;height:36px;border-bottom:1px solid var(--a-hair)}
.at-ln:last-of-type{border-bottom:0}
.at-ln b{display:block;font-size:13px;font-weight:620;letter-spacing:-.005em;line-height:1.15}
.at-ln small{display:block;font-size:11.5px;color:var(--a-ink3)}
.at-trk{position:relative;height:100%}
.at-tick{position:absolute;top:50%;width:5px;height:16px;margin:-8px 0 0 -2px;border-radius:3px;background:var(--a-ink4);opacity:.22;transform-origin:50% 50%}
.at-tick.on{background:var(--a-brand);opacity:1}
.at-tick.hit{background:var(--a-ok);height:22px;margin-top:-11px;opacity:1}
.at-sweep{position:absolute;top:10px;bottom:12px;width:2px;margin-left:-1px;background:var(--a-brand);box-shadow:0 0 14px oklch(55% .2 270/.55);z-index:3}
.at-hours{display:grid;grid-template-columns:150px 1fr;height:18px;font-size:11px;color:var(--a-ink4)}
.at-hours div{position:relative}.at-hours span{position:absolute;top:0;translate:-50% 0}
.at-wait{border-radius:12px;background:var(--a-s);box-shadow:var(--a-ring);padding:10px;display:grid;gap:7px;grid-auto-rows:min-content;align-content:start;overflow:hidden}
.at-wait .hd{display:flex;align-items:center;gap:9px;padding:2px 4px 3px}
.at-wait .hd span:last-child{margin-left:auto;font-size:12.5px;color:var(--a-ink3)}
.at-from-chip{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--a-s3);color:var(--a-ink2)}
.at-from-chip svg{width:15px;height:15px;stroke-width:2.1}
.at-prop.slim{grid-template-columns:38px 1fr auto;padding:15px 14px;align-items:center}
.at-prop.slim .ic{width:38px;height:38px;border-radius:11px}
.at-prop.slim b{font-size:15.5px}.at-prop.slim small{margin-top:2px;font-size:13px}
.at-wait{gap:9px}

/* ---------- on a phone ---------- */
@media (max-width:699px){
  #ch-atlas .atlas-sec .cl-h2{max-width:none}
}
@media (prefers-reduced-motion:reduce){
  .at-bob,.at-badge{animation:none}
}