/* 21y (owner's mock 10-31 + "target to reduce vertical space"): the price band as one row, rival chip + comparison panel.
   Its own file, loaded after shell.css; the selector out-ranks every tier there (the strongest is 0,4,1).
   c2 + c3 + their wrapper are display:contents, so price, chip, total, save and doors are five tracks of one grid. */
/* the fr shares hand the spare width to all five parts (owner 10-31, a wide window left a 350px hole after the chip); max-content keeps every part whole when there is none spare */
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip{display:grid;grid-template-columns:minmax(max-content,1fr) minmax(0,1.9fr) minmax(max-content,.9fr) minmax(max-content,.7fr) minmax(max-content,2.3fr);align-items:center;column-gap:14px;row-gap:6px;padding:6px 10px 6px 16px;border-radius:16px}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-c2,html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-cmp,html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-c3{display:contents}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-c[hidden]{display:none}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-c::before{display:none}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-more{display:flex;flex-direction:column;align-items:flex-start;gap:1px;align-self:center;width:auto;margin:0}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-c2 .dl-vc-us{font-size:25px;line-height:1.05}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-c2 .dl-vc-per{font-size:13px}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-c2 .dl-vc-for{font-size:12px;font-weight:500;line-height:1.2;color:#6e6e73;white-space:nowrap}

html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival{display:flex;align-items:center;gap:8px;width:100%;min-width:0;justify-self:stretch;margin:0;padding:5px 10px 5px 6px;border:0;border-radius:12px;background:#eef5ff;color:inherit;font:inherit;text-align:left;cursor:pointer}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival[hidden]{display:none}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival:hover{background:#e3eeff}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival:focus-visible{outline:2px solid #0071e3;outline-offset:2px}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-ric{flex:none;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:#e9e2fb;color:#6d3bd8;font-size:13px}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rbody{flex:1 1 auto;min-width:0;display:grid;grid-template-columns:auto minmax(0,auto) auto 1fr;align-items:center;column-gap:5px;row-gap:1px}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival .dl-vc-vs{grid-column:1;grid-row:1;padding:1px 5px;border:0;border-radius:6px;background:#dfe6f1;color:#515a68;font-size:10px;font-weight:600;letter-spacing:0;text-transform:none;line-height:1.3}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival .dl-vc-head{display:contents}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival .dl-vc-rname{grid-column:2;grid-row:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px;line-height:1.25;font-weight:600;color:#1d1d1f}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rinfo{grid-column:3;grid-row:1;font-size:11px;color:#0066cc}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival .dl-vc-rprice{grid-column:1 / -1;grid-row:2;white-space:nowrap;font-size:12px;line-height:1.2;color:#6e6e73}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival .dl-vc-them{font-size:15px;font-weight:700;color:#b64400}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rchev{flex:none;font-size:10px;color:#3a3a3c;transition:transform .15s}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival[aria-expanded="true"] .dl-vc-rchev{transform:rotate(180deg)}

html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip:not(.dl-vc-norival) .dl-vc-cmplink{display:none}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-cmplink{justify-self:start;font-size:13px;white-space:nowrap}

html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-cost{align-self:center;gap:1px;padding-left:14px;border-left:1px solid rgba(0,0,0,.09)}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-lead{font-size:11.5px;line-height:1.2;white-space:nowrap}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-costnum{font-size:23px;line-height:1.05}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-costper{font-size:12px}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-savebody{align-self:center;justify-self:center;display:flex;flex-direction:column;gap:0;padding:4px 12px;border:0;border-radius:12px;background:#edf9f0}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-unit{font-size:11.5px;line-height:1.2;font-weight:600;color:#1b6b34}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-num{font-size:22px;line-height:1.1}

html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-c5,html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-acts{grid-column:auto;grid-row:auto;display:flex;flex-direction:column;align-items:center;gap:3px;margin:0;padding:0 0 0 14px;border-left:1px solid rgba(0,0,0,.09)}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-btnrow{flex-wrap:nowrap;gap:6px}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-btn{height:32px;padding:0 14px;font-size:13px;gap:7px}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-facts{flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:center;column-gap:13px;margin:0;white-space:nowrap}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-fact{font-size:11px;line-height:1.25;padding:0;gap:4px}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-fact+.dl-vc-fact::before{left:-9px}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-fact i{display:inline-block;width:auto;font-size:10.5px}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-cw{display:inline}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-lock{grid-column:1 / -1;align-self:auto;margin:0;padding:0;border:0}

/* a tool with no rival has only a short link in that track, so it asks for less */
@container studiobar (min-width:831px){
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip.dl-vc-norival{grid-template-columns:minmax(max-content,1fr) minmax(max-content,1fr) minmax(max-content,.9fr) minmax(max-content,.7fr) minmax(max-content,2.3fr)}
}

/* no price at all (a host that sends no offer): facts beside the doors */
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip.dl-vc-noprice{grid-template-columns:1fr}
html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip.dl-vc-noprice .dl-vc-c5{flex-direction:row;justify-content:space-between;border-left:0;padding:0}

/* narrower bars: same one row, tighter, until it cannot hold. Floors are measured. */
@container studiobar (max-width:900px){
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip{column-gap:10px;padding-left:12px}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-ric{display:none}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival{padding-left:10px}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-cw{display:none}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-btn{padding:0 11px}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-cost{padding-left:10px}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-c5,html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-acts{padding-left:10px}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-fact i{display:none}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-facts{column-gap:11px}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-fact+.dl-vc-fact::before{left:-8px}
}
/* two rows: the numbers, then the doors with their facts beside them */
@container studiobar (max-width:830px){
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip{grid-template-columns:auto minmax(0,1fr) auto auto}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-c5,html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-acts{grid-column:1 / -1;flex-direction:row;justify-content:space-between;flex-wrap:wrap;gap:4px 12px;padding:0;border-left:0}
}
/* phone: price, total and save on a row; the chip full width; the doors; the facts */
@container studiobar (max-width:560px){
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip{grid-template-columns:minmax(0,1fr) auto auto;padding:8px 10px;row-gap:8px}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival,html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-cmplink{grid-column:1 / -1;grid-row:2}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-ric{display:inline-flex}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-cost{border-left:0;padding-left:0}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-c5,html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-acts{flex-direction:column;align-items:stretch;gap:5px}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-btnrow{width:100%}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-btn{flex:1 1 0;justify-content:center;height:36px}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-cw{display:inline}
  html body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-facts{flex-wrap:wrap}
}

html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-c2 .dl-vc-for{color:#a1a1a6}
html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival{background:#1d2a3d}
html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival:hover{background:#24344b}
html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-ric{background:#332a52;color:#c4b5fd}
html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival .dl-vc-vs{background:#3a4557;color:#d5dbe5}
html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival .dl-vc-rname{color:#f5f5f7}
html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rinfo{color:#6cb6ff}
html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival .dl-vc-rprice{color:#a1a1a6}
html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rival .dl-vc-them{color:#ff9f0a}
html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-rchev{color:#d5dbe5}
html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-cost,html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-c5,html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-acts{border-left-color:rgba(255,255,255,.12)}
html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-savebody{background:#16301f}
html.dark body .dl-wclock .dl-signup-strip.dl-signup-strip.dl-signup-strip .dl-vc-unit{color:#7ee2a0}

#dlCmpBox{display:none;position:absolute;z-index:99995;width:min(460px,calc(100vw - 24px));box-sizing:border-box;padding:16px;background:#fff;color:#1d1d1f;border:1px solid rgba(0,0,0,.1);border-radius:16px;box-shadow:0 16px 40px rgba(15,30,70,.18);font:400 13px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif;outline:0}
#dlCmpBox.on{display:block}
#dlCmpBox::before{content:"";position:absolute;top:-7px;left:var(--dl-rcmp-arrow,24px);width:12px;height:12px;background:inherit;border-left:1px solid rgba(0,0,0,.1);border-top:1px solid rgba(0,0,0,.1);transform:rotate(45deg)}
#dlCmpBox .dl-rcmp-x{position:absolute;top:10px;right:10px;width:28px;height:28px;border:0;border-radius:50%;background:none;color:#6e6e73;cursor:pointer;font-size:14px}
#dlCmpBox .dl-rcmp-x:hover{background:rgba(0,0,0,.06)}
#dlCmpBox .dl-rcmp-h{display:flex;align-items:center;gap:10px;margin:0 28px 12px 0}
#dlCmpBox .dl-rcmp-ic{flex:none;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;background:#7c3aed;color:#fff;font-size:15px}
#dlCmpBox h3{margin:0;font-size:16px;line-height:1.25;font-weight:700;color:inherit}
#dlCmpBox .dl-rcmp-h p{margin:1px 0 0;font-size:12.5px;color:#6e6e73}
#dlCmpBox .dl-rcmp-t{width:100%;border-collapse:collapse;table-layout:fixed;font-size:13px}
#dlCmpBox .dl-rcmp-t th,#dlCmpBox .dl-rcmp-t td{padding:6px 10px;border-bottom:1px solid rgba(0,0,0,.08);text-align:left;font-weight:400;vertical-align:middle}
#dlCmpBox .dl-rcmp-t th[scope="row"],#dlCmpBox .dl-rcmp-t thead th:first-child{width:38%}
#dlCmpBox .dl-rcmp-t thead th{font-weight:600;background:#f5f5f7}
#dlCmpBox .dl-rcmp-t tbody tr:last-child th,#dlCmpBox .dl-rcmp-t tbody tr:last-child td{border-bottom:0}
#dlCmpBox .dl-rcmp-t .dl-rcmp-us{background:#eef5ff;color:#0066cc;font-weight:600}
#dlCmpBox .dl-rcmp-yes{color:#248a3d}
#dlCmpBox .dl-rcmp-no{color:#6e6e73;font-weight:400}
#dlCmpBox .dl-rcmp-n{margin:10px 0 0;font-size:11.5px;line-height:1.45;color:#6e6e73}
#dlCmpBox .dl-rcmp-more{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-weight:600;color:#0066cc;text-decoration:none}
#dlCmpBox .dl-rcmp-more:hover{text-decoration:underline;text-underline-offset:2px}
#dlCmpBox .dl-rcmp-more i{font-size:11px}
html.dark #dlCmpBox{background:#1c1c1e;color:#f5f5f7;border-color:rgba(255,255,255,.14);box-shadow:0 16px 40px rgba(0,0,0,.55)}
html.dark #dlCmpBox::before{border-color:rgba(255,255,255,.14)}
html.dark #dlCmpBox .dl-rcmp-x{color:#a1a1a6}
html.dark #dlCmpBox .dl-rcmp-x:hover{background:rgba(255,255,255,.1)}
html.dark #dlCmpBox .dl-rcmp-h p,html.dark #dlCmpBox .dl-rcmp-no,html.dark #dlCmpBox .dl-rcmp-n{color:#a1a1a6}
html.dark #dlCmpBox .dl-rcmp-t th,html.dark #dlCmpBox .dl-rcmp-t td{border-bottom-color:rgba(255,255,255,.1)}
html.dark #dlCmpBox .dl-rcmp-t thead th{background:#2c2c2e}
html.dark #dlCmpBox .dl-rcmp-t .dl-rcmp-us{background:#1d2a3d;color:#6cb6ff}
html.dark #dlCmpBox .dl-rcmp-yes{color:#30d158}
html.dark #dlCmpBox .dl-rcmp-more{color:#6cb6ff}