/* Deals and Black Friday (functions/_deals.js, _blackfriday.js): /deals, /black-friday, the home Deals window, the app page box
   and the maker's deal forms. MacPip's cleanup kit (cream paper, ink lines, pixel labels, the black main button with its
   rainbow edge), read from the kit's tokens when the page has them, with the same colours as fallbacks, so day and night
   both work under any shell. Logical properties only, for right-to-left pages. */
.dl{--dl-paper:var(--paper,#faf6ec);--dl-box:var(--box,#e6dfcd);--dl-box2:var(--box2,#d6cdb8);--dl-ink:var(--ink,#1d1b17);--dl-mute:var(--mute,var(--ink2,#5f5a4e));--dl-line:var(--line,#cfc6b1);
  --dl-serif:var(--serif,"EB Garamond","Iowan Old Style","Apple Garamond",Georgia,serif);--dl-sans:var(--sans,var(--font,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif));--dl-pixel:var(--pixel,Silkscreen,ui-monospace,Menlo,monospace);
  --dl-red:#e8483f;--dl-redink:#a32a22;--dl-green:#1d6b35;--dl-greenbg:#e3f3e6;--dl-gold:#fbeeb8;--dl-goldink:#5c4408;--dl-black:#1d1b17;--dl-cream:#faf6ec;
  --dl-stripes:var(--stripes,linear-gradient(90deg,#4fb06a 0 16.66%,#f3c63f 16.66% 33.33%,#f08a2c 33.33% 50%,#e8483f 50% 66.66%,#8a5bb8 66.66% 83.33%,#3e8fd6 83.33%));
  --dl-ease:cubic-bezier(.22,1,.36,1);
  max-width:1120px;margin:0 auto;padding:0 16px 40px;color:var(--dl-ink);font-family:var(--dl-sans)}
:root[data-theme="dark"] .dl,:root[data-theme="night"] .dl{--dl-paper:var(--paper,#2a261c);--dl-box:var(--box,#352f1f);--dl-box2:var(--box2,#433c29);--dl-line:var(--line,#48402d);--dl-greenbg:#1f3a26;--dl-green:#9fdcae;--dl-gold:#3a3015;--dl-goldink:#f1d784;--dl-redink:#ff8a80}
@media (prefers-color-scheme:dark){:root:not([data-theme]) .dl{--dl-paper:var(--paper,#2a261c);--dl-box:var(--box,#352f1f);--dl-box2:var(--box2,#433c29);--dl-line:var(--line,#48402d);--dl-greenbg:#1f3a26;--dl-green:#9fdcae;--dl-gold:#3a3015;--dl-goldink:#f1d784;--dl-redink:#ff8a80}}
.dl *{box-sizing:border-box}
.dl a{color:inherit}
.dl [hidden]{display:none!important}

/* Head */
.dl-head{padding:28px 0 16px;max-width:760px}
.dl-head h1,.dl-h1{margin:6px 0 10px;font:500 clamp(32px,5vw,44px)/1.05 var(--dl-serif);letter-spacing:-.01em}
.dl-head p{margin:0;color:var(--dl-mute);font-size:15px;line-height:1.55}
.dl-head .dl-kick{display:flex;align-items:center;flex-wrap:wrap;gap:8px;color:var(--dl-mute);font:10px/1.6 var(--dl-pixel);letter-spacing:.1em;text-transform:uppercase}
/* Pip the phone, small, before the label */
.dl-pip{display:inline-block;inline-size:14px;block-size:22px;border:1.5px solid var(--dl-ink);border-radius:4px;background:var(--dl-paper);position:relative}
.dl-pip::after{content:"";position:absolute;inset-inline:3px;inset-block-start:2px;block-size:2px;border-radius:2px;background:var(--dl-ink)}
.dl-h2{margin:30px 0 12px;font:500 26px/1.15 var(--dl-serif)}

/* The switch: All deals | BLACK FRIDAY */
.dl-tabs{padding-top:22px}
.dl-seg{display:inline-flex;gap:3px;padding:3px;background:var(--dl-paper);border:1.5px solid var(--dl-ink);border-radius:10px;box-shadow:2px 2px 0 var(--dl-box2)}
.dl-seg a{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 16px;border-radius:7px;text-decoration:none;font-size:14px;font-weight:600;transition:background .15s,color .15s}
.dl-seg a:hover{background:var(--dl-box)}
.dl-seg a[aria-current]{background:var(--dl-ink);color:var(--dl-paper)}
.dl-seg a b{font:400 11px/1 var(--dl-pixel);letter-spacing:.1em}
.dl-tab-bf[aria-current]{background:var(--dl-black);color:var(--dl-cream);box-shadow:inset 0 -3px 0 var(--dl-red)}
.dl-sorts{margin:0 0 14px}
.dl-sorts a{min-height:32px;font-size:13px;padding:0 12px}

/* Short answer */
.dl-answer{margin:0 0 18px;padding:14px 16px;background:var(--dl-paper);border:1px solid var(--dl-line);border-radius:10px;font-size:14px;line-height:1.55}
.dl-answer b{display:block;margin-bottom:4px;font:400 10px/1.6 var(--dl-pixel);letter-spacing:.1em;text-transform:uppercase;color:var(--dl-mute)}
.dl-answer p{margin:0}

/* Grid and cards */
.dl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.dl-card{position:relative;display:flex;flex-direction:column;gap:12px;padding:16px;background:var(--dl-paper);border:1.5px solid var(--dl-ink);border-radius:10px;box-shadow:3px 3px 0 var(--dl-box2);transition:transform .28s var(--dl-ease),box-shadow .28s var(--dl-ease)}
.dl-card:hover{transform:translate(-1px,-2px);box-shadow:4px 5px 0 var(--dl-box2)}
.dl-top{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:0}
.dl-ic{flex:none;inline-size:52px;block-size:52px;border-radius:12px;border:1px solid var(--dl-line);object-fit:cover;background:var(--dl-box)}
.dl-mini .dl-ic{inline-size:44px;block-size:44px;border-radius:10px}
.dl-tx{display:flex;flex-direction:column;min-width:0}
.dl-tx strong{font:500 19px/1.2 var(--dl-serif);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dl-top:hover strong{text-decoration:underline;text-underline-offset:3px}
.dl-tag{color:var(--dl-mute);font-size:13px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dl-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 12px}
.dl-row small{color:var(--dl-mute);font-size:12.5px;line-height:1.4;text-align:end}
.dl-deal{display:inline-flex;max-width:100%;padding:3px 9px;background:var(--dl-greenbg);color:var(--dl-green);border:1.5px solid currentColor;border-radius:6px;font:600 12.5px/1.4 var(--dl-sans)}
.dl-only{align-self:flex-start;padding:2px 8px;background:var(--dl-gold);color:var(--dl-goldink);border:1.5px solid currentColor;border-radius:6px;font:400 10px/1.6 var(--dl-pixel);letter-spacing:.06em;text-transform:uppercase}
.dl-fact{color:var(--dl-mute);font-size:12px}
.dl-seen::before{content:"\2713\00a0";color:var(--dl-green)}

/* The code: locked behind the free sign-up, or no code needed */
.dl-code{display:inline-block;max-width:100%}
.dl-code.wide{display:block}
.dl-codebtn{display:inline-flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 8px;min-height:40px;max-width:100%;padding:8px 12px;border:1.5px dashed var(--dl-ink);border-radius:8px;background:var(--dl-paper);color:var(--dl-ink);font:600 13px/1.2 ui-monospace,Menlo,monospace;letter-spacing:.04em;cursor:pointer;transition:background .2s}
.dl-code.wide .dl-codebtn{inline-size:100%}
.dl-codebtn:hover{background:var(--dl-box)}
.dl-codebtn:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(62,143,214,.35)}
.dl-codebtn.locked .dl-blur{filter:blur(4px);user-select:none}
.dl-lock{display:inline-flex;align-items:center;gap:5px;padding:3px 7px;background:#f3c63f;color:#1d1b17;border:1px solid #1d1b17;border-radius:5px;font:400 9px/1.4 var(--dl-pixel);letter-spacing:.06em;text-transform:uppercase}
.dl-lock svg{inline-size:8px;block-size:9px;fill:currentColor}
.dl-codebtn.copied{background:var(--dl-greenbg);color:var(--dl-green);border-style:solid}
.dl-nocode{text-decoration:none}
.dl-nocode .dl-codebtn{border-style:solid;background:var(--dl-greenbg);color:var(--dl-ink);font:500 13px/1.2 var(--dl-sans);letter-spacing:0;justify-content:space-between}
.dl-nocode .dl-codebtn b{font-weight:700}

/* Black Friday */
.dl-bftag{display:inline-block;padding:3px 8px 2px;background:var(--dl-red);color:#fff;border-radius:4px;font:400 10px/1.4 var(--dl-pixel);letter-spacing:.1em}
.dl-bfhead .dl-kick{color:var(--dl-redink)}
.dl-bf{border-color:var(--dl-black);box-shadow:3px 3px 0 var(--dl-red)}
.dl-bf:hover{box-shadow:4px 5px 0 var(--dl-red)}
.dl-bflabel{align-self:flex-start;margin:-4px 0;padding:2px 7px 1px;background:var(--dl-black);color:var(--dl-cream);border-radius:4px;font:400 9px/1.6 var(--dl-pixel);letter-spacing:.1em}
.dl-pct{display:inline-flex;align-items:baseline;gap:6px;padding:6px 11px;background:var(--dl-red);color:#fff;border:1.5px solid var(--dl-black);border-radius:8px;box-shadow:2px 2px 0 var(--dl-black);font:600 12px/1 var(--dl-sans);text-transform:uppercase;letter-spacing:.04em}
.dl-pct b{font:500 26px/1 var(--dl-serif);letter-spacing:0;text-transform:none}
.dl-soonlist{list-style:none;margin:0;padding:0;background:var(--dl-paper);border:1.5px solid var(--dl-ink);border-radius:10px;overflow:hidden}
.dl-soon{display:flex;align-items:center;gap:12px;padding:10px 14px}
.dl-soon+.dl-soon{border-top:1px solid var(--dl-line)}
.dl-soon>a{display:flex;align-items:center;gap:12px;flex:1;min-width:0;text-decoration:none}
.dl-soon .dl-ic{inline-size:40px;block-size:40px;border-radius:10px}
.dl-soon .dl-tx strong{font-size:17px}
.dl-soon .dl-tag{-webkit-line-clamp:1}
.dl-soonw{display:flex;flex-direction:column;align-items:flex-end;white-space:nowrap}
.dl-soonw b{color:var(--dl-redink);font-size:14px}
.dl-soonw small{color:var(--dl-mute);font-size:12px}
.dl-strip{display:flex;align-items:center;gap:12px;margin:0 0 16px;padding:11px 16px;background:var(--dl-black);color:var(--dl-cream)!important;border-radius:10px;box-shadow:3px 3px 0 var(--dl-red);text-decoration:none;font-size:14px;transition:transform .2s var(--dl-ease),box-shadow .2s var(--dl-ease)}
.dl-strip b{padding:3px 7px;background:var(--dl-red);color:#fff;border-radius:4px;font:400 10px/1.5 var(--dl-pixel);letter-spacing:.08em;white-space:nowrap}
.dl-strip i{margin-inline-start:auto;font-style:normal;font-size:18px}
.dl-strip:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--dl-red)}

/* Invite, alerts, empty, notes */
.dl-invite,.dl-alerts{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 14px;margin-top:18px;padding:14px 16px;border-radius:10px;font-size:14px;line-height:1.5}
.dl-invite{background:var(--dl-greenbg);border:1.5px dashed var(--dl-green)}
.dl-invite p,.dl-alerts p{margin:0;flex:1 1 280px}
.dl-alerts{background:var(--dl-paper);border:1.5px solid var(--dl-ink);box-shadow:3px 3px 0 var(--dl-box2)}
.dl-alerts img{flex:none}
.dl-alertsok{flex-basis:100%!important;color:var(--dl-green);font-size:13px}
.dl-empty{display:grid;justify-items:center;gap:8px;padding:34px 20px;text-align:center;background:var(--dl-paper);border:1.5px solid var(--dl-ink);border-radius:10px;box-shadow:3px 3px 0 var(--dl-box2)}
.dl-empty h3{margin:4px 0 0;font:500 26px/1.15 var(--dl-serif)}
.dl-empty p{margin:0 0 6px;max-width:460px;color:var(--dl-mute)}
.dl-fold{margin-top:28px;max-width:760px;border-top:1px solid var(--dl-line);padding-top:12px}
.dl-fold summary{display:flex;align-items:baseline;gap:10px;cursor:pointer;list-style:none;font:500 19px/1.3 var(--dl-serif)}
.dl-fold summary::-webkit-details-marker{display:none}
.dl-fold summary small{color:var(--dl-mute);font:13px var(--dl-sans)}
.dl-fold summary::after{content:"+";margin-inline-start:auto;font:400 20px var(--dl-sans)}
.dl-fold[open] summary::after{content:"\2212"}
.dl-fold ul{margin:12px 0;padding-inline-start:20px;color:var(--dl-mute);line-height:1.6}
.dl-fold p{color:var(--dl-mute)}

/* Buttons: one black main button with its rainbow edge, the rest ghost */
.dl-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:0 16px;overflow:hidden;border:1.5px solid var(--dl-ink);border-radius:8px;background:transparent;color:var(--dl-ink);font:600 14px/1 var(--dl-sans);text-decoration:none;white-space:nowrap;cursor:pointer;transition:transform .15s,background .15s}
.dl-btn:hover{background:var(--dl-box)}
.dl-btn:active{transform:translateY(1px)}
.dl-btn.ink{background:var(--dl-ink);color:var(--dl-paper)}
.dl-btn.ink::after{content:"";position:absolute;inset-inline:0;inset-block-end:0;block-size:3px;background:var(--dl-stripes)}
.dl-link{border:0;background:none;padding:0;color:var(--dl-mute);font:13px var(--dl-sans);text-decoration:underline;cursor:pointer}

/* The sign-up that opens under a locked code */
.dl-join{display:grid;gap:10px;padding:12px;background:var(--dl-box);border-radius:8px;font-size:13.5px;line-height:1.5}
.dl-alerts .dl-join{flex-basis:100%}
.dl-join p{margin:0}
.dl-jstep{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.dl-jstep input{flex:1 1 180px;min-height:40px;padding:0 12px;border:1.5px solid var(--dl-ink);border-radius:8px;background:var(--dl-paper);color:var(--dl-ink);font:15px var(--dl-sans)}
.dl-jstep input:focus{outline:none;box-shadow:0 0 0 3px rgba(62,143,214,.35)}
.dl-jsent{flex-basis:100%;color:var(--dl-mute)}
.dl-jerr{color:var(--dl-redink)}
.dl-jok{color:var(--dl-green);font-weight:600}

/* The home page's Deals window */
.dl-home{padding:0 16px;margin-block:24px}
.dl-win{background:var(--dl-paper);border:1.5px solid var(--dl-ink);border-radius:10px;box-shadow:5px 5px 0 var(--dl-ink);overflow:hidden}
.dl-wbar{position:relative;display:flex;align-items:center;justify-content:center;block-size:28px;border-bottom:1.5px solid var(--dl-ink);background:repeating-linear-gradient(180deg,var(--dl-ink) 0 1px,var(--dl-paper) 1px 3px)}
.dl-wbar span{position:absolute;inset-inline-start:10px;inline-size:12px;block-size:12px;border:1.5px solid var(--dl-ink);background:var(--dl-paper)}
.dl-wbar h2{margin:0;padding:0 10px;background:var(--dl-paper);font:400 10px/28px var(--dl-pixel);letter-spacing:.1em;text-transform:uppercase}
.dl-winb{padding:20px}
.dl-winh{display:flex;align-items:center;flex-wrap:wrap;gap:12px 16px;margin-bottom:16px}
.dl-winh>div{flex:1 1 260px}
.dl-winh h3{margin:0 0 4px;font:500 clamp(23px,3vw,28px)/1.15 var(--dl-serif)}
.dl-winh p{margin:0;color:var(--dl-mute);font-size:14px}
.dl-homegrid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.dl-mini{gap:10px;padding:14px;box-shadow:none}

/* The app page box */
.dl-onapp{padding:0;margin:14px 0 0;max-width:none}
.dl-appbox{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;margin-top:8px;padding:10px 12px;background:var(--dl-paper);border:1.5px solid var(--dl-ink);border-radius:10px;font-size:13.5px;color:var(--dl-mute)}
.dl-appbox .dl-deal{margin:0}
.dl-appbox a:last-child{margin-inline-start:auto;font-size:13px}
.dl-bfbox{border-color:var(--dl-black);box-shadow:2px 2px 0 var(--dl-red)}
.dl-bfbox .dl-pct{padding:3px 9px;box-shadow:1px 1px 0 var(--dl-black);font-size:11px}
.dl-bfbox .dl-pct b{font-size:18px}

/* The maker's forms on the status page and the /maker card line */
.dl-small{font-size:12.5px;margin:-4px 0 6px}
.dl-state{font-size:14px}
.dl-mkbf{border-top:3px solid #e8483f}
.dl-dash{margin:6px 0 0;font-size:13px}

@media (max-width:600px){
  .dl{padding-inline:12px}
  .dl-head{padding-top:20px}
  .dl-head h1,.dl-h1{font-size:32px}
  .dl-grid{grid-template-columns:1fr;gap:12px}
  .dl-card{padding:14px;box-shadow:2px 2px 0 var(--dl-box2)}
  .dl-bf{box-shadow:2px 2px 0 var(--dl-red)}
  .dl-seg{display:flex}
  .dl-seg a{flex:1;padding:0 10px}
  .dl-win{box-shadow:3px 3px 0 var(--dl-ink)}
  .dl-winb{padding:14px}
  .dl-home{padding:0 12px}
  .dl-soon{flex-wrap:wrap;row-gap:4px}
  .dl-soonw{flex-direction:row;align-items:baseline;gap:8px;inline-size:100%;padding-inline-start:52px}
}
@media (prefers-reduced-motion:reduce){.dl-card,.dl-strip,.dl-btn{transition:none}.dl-card:hover,.dl-strip:hover{transform:none}}
