/* ---------- round 4 shared ---------- */
.dl .n-w4:where(:not(.v16-root *)){width:100%;max-width:1240px;margin-inline:auto;padding-left:max(var(--g),env(safe-area-inset-left,0px));padding-right:max(var(--g),env(safe-area-inset-right,0px))}
.dl .n-r4 [data-t]:where(:not(.v16-root *)){--tint:#f3f0e7;--tint2:#efebe0;--tink:var(--fg)}
.dl .n-r4 [data-tint="amber"]:where(:not(.v16-root *)){--tint:#ffe7cc;--tint2:#ffd6a8;--tink:#8a4a00}
.dl .n-r4 [data-tint="sky"]:where(:not(.v16-root *)){--tint:#dfe8f1;--tint2:#c7d7e6;--tink:#1d3d61}
.dl .n-r4 [data-tint="teal"]:where(:not(.v16-root *)){--tint:#dcefec;--tint2:#c2e3de;--tink:#0f6b64}
.dl .n-r4 [data-tint="lilac"]:where(:not(.v16-root *)){--tint:#ebe4f7;--tint2:#d9cdf0;--tink:#5b3fa0}
.dl .n-r4 [data-tint="mint"]:where(:not(.v16-root *)){--tint:#dcf2e8;--tint2:#bfe6d3;--tink:#007a52}
.dl .n-r4 [data-tint="peach"]:where(:not(.v16-root *)){--tint:#f6eddc;--tint2:#efdcbf;--tink:#8a4a00}
.dl .n-r4 [data-tint="paper"]:where(:not(.v16-root *)){--tint:#f6f3ea;--tint2:#ece7da;--tink:var(--fg2)}
.dl .n-r4 video:where(:not(.v16-root *)),.dl .n-r4 .n-still:where(:not(.v16-root *)){display:block;width:100%;height:100%;object-fit:cover}
.dl .n-live:where(:not(.v16-root *)){display:inline-flex;align-items:center;gap:8px;font-size:var(--t-small);font-weight:var(--w-ui);color:var(--fg2)}
.dl .n-live i:where(:not(.v16-root *)){position:relative;width:9px;height:9px;border-radius:50%;background:var(--ok-base)}
.dl .n-live i:where(:not(.v16-root *))::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid var(--ok-base);opacity:0}
@media (prefers-reduced-motion:no-preference){.dl .n-live i:where(:not(.v16-root *))::after{animation:ping 1.8s var(--ease) 3}}
@keyframes ping{0%{transform:scale(.4);opacity:.8}100%{transform:scale(1.4);opacity:0}}
/* Free and Pro, big: the one comparison */
.dl .n-cb:where(:not(.v16-root *)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.dl .n-cb > div:where(:not(.v16-root *)){display:grid;align-content:start;gap:4px;padding:18px 18px 20px;border-radius:var(--r-inner)}
.dl .n-cb .n-f:where(:not(.v16-root *)){background:var(--sunk);box-shadow:0 0 0 1px var(--line) inset}
.dl .n-cb .n-p:where(:not(.v16-root *)){background:var(--fg);color:var(--cream)}
.dl .n-cb h4:where(:not(.v16-root *)){display:flex;align-items:center;gap:6px;font-size:var(--t-meta);font-weight:600;letter-spacing:.02em;color:var(--fg2)}
.dl .n-cb .n-p h4:where(:not(.v16-root *)){color:var(--accent)}
.dl .n-cb .n-p h4 .i:where(:not(.v16-root *)){font-size:14px;stroke-width:2}
.dl .n-cb b:where(:not(.v16-root *)){font-size:clamp(2rem,6vw,2.75rem);font-weight:var(--w-head);letter-spacing:-.035em;line-height:1.02;text-wrap:balance}
.dl .n-cb > div > span:where(:not(.v16-root *)){font-size:var(--t-small);line-height:1.4;color:var(--fg2);text-wrap:pretty}
.dl .n-cb .n-p > span:where(:not(.v16-root *)){color:rgba(253,247,234,.76)}
.dl .n-cb .n-all:where(:not(.v16-root *)){grid-column:1 / -1;background:var(--ok-fill);box-shadow:0 0 0 1px var(--ok-line) inset}
.dl .n-cb .n-all h4:where(:not(.v16-root *)){color:var(--ok)}
/* what changed: dated lines */
.dl .n-lg:where(:not(.v16-root *)){display:grid;margin-top:6px}
.dl .n-lg li:where(:not(.v16-root *)){display:grid;grid-template-columns:64px minmax(0,1fr);gap:10px;padding:10px 0;box-shadow:0 -1px 0 var(--line) inset;font-size:var(--t-small);line-height:1.4}
.dl .n-lg li:last-child:where(:not(.v16-root *)){box-shadow:none}
.dl .n-lg time:where(:not(.v16-root *)){font-weight:600;color:var(--fg);font-variant-numeric:tabular-nums}
.dl .n-lg span:where(:not(.v16-root *)){color:var(--fg2);text-wrap:pretty}
.dl .n-acts4:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px}
.dl .n-r4a:where(:not(.v16-root *)){padding-bottom:8px}
/* the hero: one huge line, its 13 cut out of the RTR flight */
.dl .n-ah:where(:not(.v16-root *)){display:grid;gap:14px;padding-block:22px 26px}
.dl .n-ah .n-live:where(:not(.v16-root *)){order:-1}
.dl .n-ah .n-ah-h:where(:not(.v16-root *)){display:grid;gap:4px}
.dl .n-ko:where(:not(.v16-root *)){position:relative;display:block;height:clamp(220px,60vw,420px);margin-inline:-4px}
.dl .n-ko video:where(:not(.v16-root *)),.dl .n-ko .n-still:where(:not(.v16-root *)){position:absolute;inset:0}
.dl .n-ko-s:where(:not(.v16-root *)){position:absolute;width:0;height:0}
.dl .n-ko-t:where(:not(.v16-root *)){font-family:"Inter",ui-sans-serif,system-ui,sans-serif;font-weight:600;letter-spacing:-.075em}
.dl .n-ah-l:where(:not(.v16-root *)){font-size:clamp(2.125rem,8.6vw,4.25rem);font-weight:var(--w-head);letter-spacing:-.035em;line-height:1;text-wrap:balance}
@media (min-width:1000px){
  .dl .n-ah:where(:not(.v16-root *)){grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);grid-template-areas:"ko live" "ko l" "ko s" "ko bars" "ko free";align-items:end;column-gap:44px;row-gap:12px;padding-block:44px 40px}
  .dl .n-ah .n-ah-h:where(:not(.v16-root *)){display:contents}
  .dl .n-ah .n-live:where(:not(.v16-root *)){grid-area:live;align-self:end}
  .dl .n-ko:where(:not(.v16-root *)){grid-area:ko;height:470px;margin:0}
  .dl .n-ah-l:where(:not(.v16-root *)){grid-area:l}
  
  
}
/* the bento */
.dl .n-bento:where(:not(.v16-root *)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.dl .n-bt:where(:not(.v16-root *)){position:relative;display:grid;grid-template-rows:auto 1fr;grid-column:1 / -1;border-radius:var(--r-card);overflow:hidden;background:var(--card);
  box-shadow:var(--card-shadow);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.dl .n-bt-v:where(:not(.v16-root *)){position:relative;overflow:hidden;height:var(--vh,300px);background:radial-gradient(120% 90% at 0% 0%,var(--tint),transparent 70%),radial-gradient(120% 100% at 100% 100%,var(--tint2),var(--tint) 75%)}
.dl .n-bt-v .n-full:where(:not(.v16-root *)){position:absolute;inset:0}
.dl .n-bt-v .n-dev:where(:not(.v16-root *)){position:absolute;left:50%;top:26px;width:min(86%,360px);height:auto;transform:translateX(-50%);border-radius:22px 22px 0 0;overflow:hidden;
  box-shadow:0 0 0 1px rgba(13,27,42,.1),0 30px 60px -30px rgba(13,27,42,.55);background:var(--bg)}
.dl .n-bt-v .n-dev video:where(:not(.v16-root *)),.dl .n-bt-v .n-dev .n-still:where(:not(.v16-root *)){height:auto;aspect-ratio:var(--ar,520/934)}
.dl .n-bt-v .n-inst:where(:not(.v16-root *)){position:absolute;left:50%;top:50%;width:min(70%,280px);height:auto;transform:translate(-50%,-50%);border-radius:28px;overflow:hidden;
  box-shadow:0 30px 50px -28px rgba(13,27,42,.6)}
.dl .n-bt-v .n-inst video:where(:not(.v16-root *)),.dl .n-bt-v .n-inst .n-still:where(:not(.v16-root *)){height:auto;aspect-ratio:540/630}
.dl .n-bt-t:where(:not(.v16-root *)){display:grid;align-content:start;gap:8px;padding:16px 18px 18px}
.dl .n-bt h3:where(:not(.v16-root *)){font-size:clamp(1.375rem,2.2vw,1.875rem);font-weight:var(--w-head);letter-spacing:-.025em;line-height:1.08;text-wrap:balance;padding-right:46px}
.dl .n-bt-hit:where(:not(.v16-root *)){position:absolute;inset:0;z-index:2;border-radius:inherit}
.dl .n-bt-plus:where(:not(.v16-root *)){position:absolute;right:14px;bottom:14px;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--fg);color:var(--cream);
  transition:transform .25s var(--ease)}
.dl .n-bt-plus .i:where(:not(.v16-root *)){font-size:18px;stroke-width:2.2}
.dl .n-bt-hit:focus-visible:where(:not(.v16-root *)){outline:2px solid var(--fg);outline-offset:3px}
@media (hover:hover) and (pointer:fine){
  .dl .n-bt:hover:where(:not(.v16-root *)){transform:translateY(-3px);box-shadow:0 0 0 1px var(--line) inset,0 34px 60px -36px rgba(13,27,42,.5)}
  .dl .n-bt:hover .n-bt-plus:where(:not(.v16-root *)){transform:rotate(90deg)}
}
@media (max-width:999px){
  .dl .n-bt-exam:where(:not(.v16-root *)){--vh:340px}.dl .n-bt-rtr:where(:not(.v16-root *)){--vh:430px}.dl .n-bt-air:where(:not(.v16-root *)){--vh:250px}.dl .n-bt-learn:where(:not(.v16-root *)){--vh:330px}.dl .n-bt-exams:where(:not(.v16-root *)){--vh:300px}.dl .n-bt-airline:where(:not(.v16-root *)){--vh:300px}.dl .n-bt-look:where(:not(.v16-root *)){--vh:230px}
  .dl .n-bt-exams .n-dev:where(:not(.v16-root *)){width:min(80%,300px)}
}
@media (min-width:1000px){
  .dl .n-bento:where(:not(.v16-root *)){grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}
  .dl .n-bt:where(:not(.v16-root *)),.dl .n-bt.n-half:where(:not(.v16-root *)){grid-column:span var(--span)}
  .dl .n-bt-exam:where(:not(.v16-root *)){--span:5;--vh:420px}.dl .n-bt-rtr:where(:not(.v16-root *)){--span:7;--vh:420px}
  .dl .n-bt-air:where(:not(.v16-root *)){--span:7;--vh:360px}.dl .n-bt-learn:where(:not(.v16-root *)){--span:5;--vh:360px}
  .dl .n-bt-exams:where(:not(.v16-root *)){--span:4;--vh:280px}.dl .n-bt-airline:where(:not(.v16-root *)){--span:4;--vh:280px}.dl .n-bt-look:where(:not(.v16-root *)){--span:4;--vh:280px}
  .dl .n-bt-t:where(:not(.v16-root *)){padding:20px 24px 24px}
  .dl .n-bt.n-half .n-bt-t:where(:not(.v16-root *)){padding:18px 22px 22px}
  .dl .n-bt.n-half h3:where(:not(.v16-root *)){font-size:1.5rem;line-height:1.1;padding-right:46px}
  .dl .n-bt-exam .n-dev:where(:not(.v16-root *)){width:330px}
}
/* the sheet: tap a tile, and the comparison and the dated changes rise */
.dl .n-sh:where(:not(.v16-root *)){position:fixed;inset:0;z-index:80;display:grid;align-items:end;justify-items:center}
.dl .n-sh[hidden]:where(:not(.v16-root *)){display:none}
.dl .n-sh-scrim:where(:not(.v16-root *)){position:absolute;inset:0;background:rgba(13,27,42,.42);opacity:0;transition:opacity .3s var(--ease)}
.dl .n-sh.n-on .n-sh-scrim:where(:not(.v16-root *)){opacity:1}
.dl .n-sh-p:where(:not(.v16-root *)){position:relative;width:100%;max-height:92svh;overflow-y:auto;overscroll-behavior:contain;border-radius:28px 28px 0 0;background:var(--bg);
  box-shadow:0 -20px 60px -20px rgba(13,27,42,.5);transform:translateY(100%);transition:transform .42s var(--ease)}
.dl .n-sh.n-on .n-sh-p:where(:not(.v16-root *)){transform:none}
.dl .n-sh-v:where(:not(.v16-root *)){position:relative;height:clamp(200px,52vw,300px);overflow:hidden;background:radial-gradient(120% 100% at 100% 100%,var(--tint2),var(--tint) 75%)}
.dl .n-sh-v .n-dev:where(:not(.v16-root *)){position:absolute;left:50%;top:22px;width:min(78%,320px);transform:translateX(-50%);border-radius:20px;overflow:hidden;box-shadow:0 26px 50px -26px rgba(13,27,42,.55)}
.dl .n-sh-v .n-dev video:where(:not(.v16-root *)),.dl .n-sh-v .n-dev .n-still:where(:not(.v16-root *)){height:auto;aspect-ratio:var(--ar,520/934)}
.dl .n-sh-v .n-inst:where(:not(.v16-root *)){position:absolute;left:50%;top:50%;width:min(56%,230px);transform:translate(-50%,-50%);border-radius:24px;overflow:hidden}
.dl .n-sh-v .n-inst video:where(:not(.v16-root *)){height:auto;aspect-ratio:540/630}
.dl .n-sh-x:where(:not(.v16-root *)){position:absolute;top:12px;right:12px;z-index:3;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:rgba(13,27,42,.78);color:var(--cream);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.dl .n-sh-x .i:where(:not(.v16-root *)){font-size:20px;stroke-width:2.2}
.dl .n-sh-b:where(:not(.v16-root *)){display:grid;gap:14px;padding:20px var(--pad) calc(28px + env(safe-area-inset-bottom,0px))}
.dl .n-sh-b h2:where(:not(.v16-root *)){font-size:clamp(1.75rem,6vw,2.375rem);font-weight:var(--w-head);letter-spacing:-.03em;line-height:1.05;text-wrap:balance}
.dl .n-sh-b > p.n-l:where(:not(.v16-root *)){font-size:var(--t-body);color:var(--fg2);text-wrap:pretty}
@media (min-width:1000px){
  .dl .n-sh:where(:not(.v16-root *)){align-items:center}
  .dl .n-sh-p:where(:not(.v16-root *)){width:min(760px,calc(100% - 64px));max-height:min(860px,calc(100vh - 64px));border-radius:28px;transform:translateY(24px) scale(.98);opacity:0;
    transition:transform .38s var(--ease),opacity .25s var(--ease)}
  .dl .n-sh.n-on .n-sh-p:where(:not(.v16-root *)){transform:none;opacity:1}
  .dl .n-sh-v:where(:not(.v16-root *)){height:300px}
  .dl .n-sh-b:where(:not(.v16-root *)){padding:26px 34px 30px}
}
@media (prefers-reduced-motion:reduce){.dl .n-sh-p:where(:not(.v16-root *)),.dl .n-sh-scrim:where(:not(.v16-root *)){transition:none}}
/* ---------- option A, second edit: four parts, plain words, and the Emil pass (review-emil.md) ---------- */
/* the hero: three lines and the numeral */
.dl .n-ah:where(:not(.v16-root *)){gap:12px;padding-block:22px 28px}
.dl .n-ah-l:where(:not(.v16-root *)){text-wrap:balance}
@media (min-width:1000px){
  .dl .n-ah:where(:not(.v16-root *)){grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);grid-template-areas:"ko ." "ko live" "ko l" "ko s" "ko .";grid-template-rows:1fr auto auto auto 1fr;
    align-items:end;row-gap:14px;padding-block:48px 44px}
  .dl .n-ah .n-live:where(:not(.v16-root *)){align-self:end}
  .dl .n-ah-l:where(:not(.v16-root *)){font-size:5rem;letter-spacing:-.04em}
}
/* the tiles: the date stamp is the only label, inset by the same 18 or 24 px as the words under it */
.dl .n-stamp:where(:not(.v16-root *)){position:absolute;left:18px;top:18px;z-index:1;display:flex;align-items:center;gap:6px}
.dl .n-stamp time:where(:not(.v16-root *)),.dl .n-stamp b:where(:not(.v16-root *)){display:inline-flex;align-items:center;height:30px;padding:0 12px;border-radius:999px;font-size:13px;font-weight:600;line-height:1;
  letter-spacing:.06em;font-variant-numeric:tabular-nums;white-space:nowrap}
.dl .n-stamp time:where(:not(.v16-root *)){background:var(--fg);color:var(--cream);box-shadow:0 0 0 1px rgba(253,247,234,.18) inset,0 8px 18px -10px rgba(13,27,42,.7)}
.dl .n-stamp b:where(:not(.v16-root *)){background:var(--accent);color:var(--accent-ink);letter-spacing:.02em}
.dl .n-bt-v .n-dev:where(:not(.v16-root *)){top:64px}
.dl .n-bt-t:where(:not(.v16-root *)){gap:10px;padding:16px 18px 18px}
.dl .n-bt h3:where(:not(.v16-root *)){padding-right:48px}
@media (min-width:1000px){.dl .n-stamp:where(:not(.v16-root *)){left:24px;top:24px}.dl .n-stamp time:where(:not(.v16-root *)),.dl .n-stamp b:where(:not(.v16-root *)){height:32px;font-size:14px}.dl .n-bt-v .n-dev:where(:not(.v16-root *)){top:72px}
  .dl .n-bt-t:where(:not(.v16-root *)),.dl .n-bt.n-half .n-bt-t:where(:not(.v16-root *)){padding:20px 24px 24px}.dl .n-bt-plus:where(:not(.v16-root *)),.dl .n-bt.n-half .n-bt-plus:where(:not(.v16-root *)){right:24px;bottom:24px}}
.dl .n-bt-v .n-inst:where(:not(.v16-root *)){top:calc(50% + 24px);width:min(60%,230px)}
@media (min-width:1000px){.dl .n-bt-v .n-inst:where(:not(.v16-root *)){top:calc(50% + 22px);width:196px}.dl .n-bt-learn .n-bt-v .n-inst:where(:not(.v16-root *)){width:240px}}
/* press, and hover only where there is a pointer that hovers (review-emil.md 4, 9, 10, 11, 13) */
.dl .n-bt:where(:not(.v16-root *)){transition:transform .12s var(--ease)}
.dl .n-bt:has(.n-bt-hit:active):where(:not(.v16-root *)){transform:scale(.98)}
.dl .n-bt-plus:where(:not(.v16-root *)){transition:none}
@media (hover:hover) and (pointer:fine){.dl .n-bt:hover:where(:not(.v16-root *)){transform:none;box-shadow:var(--card-shadow)}.dl .n-bt:hover .n-bt-plus:where(:not(.v16-root *)){transform:none}}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.dl .n-bt:where(:not(.v16-root *)){transition:transform .2s var(--ease)}
  .dl .n-bt:hover:where(:not(.v16-root *)){transform:translateY(-3px)}.dl .n-bt:has(.n-bt-hit:active):where(:not(.v16-root *)){transform:translateY(-3px) scale(.98);transition-duration:.12s}}
@media (prefers-reduced-motion:reduce){.dl .n-bt:where(:not(.v16-root *)),.dl .n-bt:hover:where(:not(.v16-root *)),.dl .n-bt:has(.n-bt-hit:active):where(:not(.v16-root *)){transform:none}.dl .n-bt:where(:not(.v16-root *)){transition:opacity .12s ease}.dl .n-bt:has(.n-bt-hit:active):where(:not(.v16-root *)){opacity:.85}}
.dl .n-bt-hit:where(:not(.v16-root *)),.dl .n-showall:where(:not(.v16-root *)),.dl .n-sh-x:where(:not(.v16-root *)),.dl .n-r4a .btn:where(:not(.v16-root *)),.dl .n-r4a .go:where(:not(.v16-root *)){touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
/* the log: the date is the bold left column */
.dl .n-log:where(:not(.v16-root *)){margin-top:44px;padding:22px var(--pad) 8px;border-radius:var(--r-card);background:var(--card);box-shadow:var(--card-shadow-sm)}
.dl .n-log h2:where(:not(.v16-root *)){font-size:clamp(1.5rem,3vw,2rem);font-weight:var(--w-head);letter-spacing:-.025em;line-height:1.1;text-wrap:balance}
.dl .n-lg li:where(:not(.v16-root *)){grid-template-columns:68px minmax(0,1fr)}
.dl .n-lg time:where(:not(.v16-root *)){font-size:var(--t-small);font-weight:700;color:var(--fg);letter-spacing:.01em;font-variant-numeric:tabular-nums}
.dl .n-lg-all:where(:not(.v16-root *)){margin-top:10px}
.dl .n-lg-all li:where(:not(.v16-root *)){align-items:baseline;padding:13px 0;font-size:var(--t-body)}
.dl .n-lg-all time:where(:not(.v16-root *)){font-size:var(--t-body)}
.dl .n-lg-all span:where(:not(.v16-root *)){color:var(--fg)}
.dl .n-lg-all li:nth-last-child(1 of :not([hidden])):where(:not(.v16-root *)){box-shadow:none}
@media (min-width:760px){.dl .n-lg-all li:where(:not(.v16-root *)){grid-template-columns:96px minmax(0,1fr)}}
.dl .n-showall:where(:not(.v16-root *)){display:inline-flex;align-items:center;gap:8px;min-height:48px;margin:2px 0 8px;font-size:var(--t-small);font-weight:600;color:var(--fg);transition:opacity .1s var(--ease)}
.dl .n-showall:active:where(:not(.v16-root *)){opacity:.6}
.dl .n-showall .i:where(:not(.v16-root *)){font-size:18px;transition:transform .2s var(--ease)}
.dl .n-showall[aria-expanded="true"] .i:where(:not(.v16-root *)){transform:rotate(180deg)}
/* the closing band: two buttons */
.dl .n-end:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;margin-top:20px;padding:28px var(--pad);border-radius:var(--r-card);background:var(--fg)}
.dl .n-end .btn:where(:not(.v16-root *)){flex:1 1 160px;max-width:260px}
.dl .n-btn-line:where(:not(.v16-root *)){background:transparent;color:var(--cream);box-shadow:0 0 0 1.5px rgba(253,247,234,.42) inset}
@media (hover:hover) and (pointer:fine){.dl .n-btn-line:hover:where(:not(.v16-root *)){box-shadow:0 0 0 1.5px var(--cream) inset}}
/* the sheet: one picture, one line, the two cards, what changed, one button. Short, ease-out, interruptible */
.dl .n-cb > div:where(:not(.v16-root *)){gap:6px}
.dl .n-cb b:where(:not(.v16-root *)){font-size:clamp(1.625rem,5.4vw,2.375rem);line-height:1.05}
.dl .n-cb .n-all:where(:not(.v16-root *)){display:grid;padding:16px 18px}
.dl .n-cb .n-all b:where(:not(.v16-root *)){display:flex;align-items:center;gap:10px;color:var(--ok)}
.dl .n-cb .n-all .tick:where(:not(.v16-root *)){width:28px;height:28px;background:var(--ok)}
.dl .n-cb .n-all .tick svg:where(:not(.v16-root *)){width:16px;height:16px}
.dl .n-sh-b:where(:not(.v16-root *)){gap:16px}
.dl .n-sh-b > p.n-l:where(:not(.v16-root *)){font-size:var(--t-body);line-height:1.5;color:var(--fg)}
/* phone: a drawer from the bottom edge on the iOS drawer curve, out faster than in; laptop: a centred modal (review-emil.md 5, 6, 7, 8, 12) */
.dl .n-r4:where(:not(.v16-root *)){--ease-drawer:cubic-bezier(.32,.72,0,1)}
.dl .n-sh-scrim:where(:not(.v16-root *)){transition:opacity .24s var(--ease)}
.dl .n-sh.n-out .n-sh-scrim:where(:not(.v16-root *)){transition-duration:.16s}
.dl .n-sh.n-out:where(:not(.v16-root *)){pointer-events:none}
.dl .n-sh-p:where(:not(.v16-root *)){max-height:92dvh;border-radius:var(--r-card) var(--r-card) 0 0;transition:transform .3s var(--ease-drawer)}
.dl .n-sh.n-out .n-sh-p:where(:not(.v16-root *)){transition:transform .2s var(--ease)}
.dl .n-sh-p.n-drag:where(:not(.v16-root *)),.dl .n-sh.n-now .n-sh-p:where(:not(.v16-root *)),.dl .n-sh.n-now .n-sh-scrim:where(:not(.v16-root *)){transition:none!important}
.dl .n-sh-v:where(:not(.v16-root *)),.dl .n-sh-grab:where(:not(.v16-root *)){touch-action:none}
.dl .n-sh-grab:where(:not(.v16-root *)){position:absolute;left:50%;top:8px;z-index:3;width:40px;height:5px;margin-left:-20px;border-radius:999px;background:rgba(253,247,234,.85);
  box-shadow:0 1px 4px rgba(13,27,42,.35)}
.dl .n-sh-x:where(:not(.v16-root *)){transition:transform .12s var(--ease)}
.dl .n-sh-x:active:where(:not(.v16-root *)){transform:scale(.96)}
@media (min-width:1000px){
  .dl .n-sh-grab:where(:not(.v16-root *)){display:none}
  .dl .n-sh-v:where(:not(.v16-root *)){touch-action:auto}
  .dl .n-sh-p:where(:not(.v16-root *)){max-height:min(860px,calc(100dvh - 64px));border-radius:var(--r-card);opacity:0;transform:scale(.96);transition:transform .22s var(--ease),opacity .18s var(--ease)}
  .dl .n-sh.n-on .n-sh-p:where(:not(.v16-root *)){opacity:1;transform:none}
  .dl .n-sh.n-out .n-sh-p:where(:not(.v16-root *)){transition:transform .15s var(--ease),opacity .12s var(--ease)}
}
@media (prefers-reduced-motion:reduce){.dl .n-sh-p:where(:not(.v16-root *)),.dl .n-sh.n-out .n-sh-p:where(:not(.v16-root *)){transform:none!important;transition:opacity .16s ease!important;opacity:0}.dl .n-sh.n-on .n-sh-p:where(:not(.v16-root *)){opacity:1}}
/* ---------- third edit: one type scale, one spacing scale, one grid (review-emil-2.md) ---------- */
/* the scale. Type: 13 meta, 15 small, 17 body, 22 title S, 28 title M, 36 title L, 72 display. Space: 4, 8, 12, 16, 20, 24, 32, 48, 64 */
.dl .n-r4:where(:not(.v16-root *)){--fs-meta:13px;--fs-small:15px;--fs-body:17px;--fs-s:22px;--fs-m:28px;--fs-l:36px;--fs-hero:36px;--fs-tile:22px;--fs-card:22px;--fs-sheet:28px;
  --in:20px;--gap-b:12px}
@media (min-width:1000px){.dl .n-r4:where(:not(.v16-root *)){--fs-hero:72px;--fs-tile:28px;--fs-card:28px;--fs-sheet:36px;--in:24px;--gap-b:20px}}
/* the page shares the site's 1180 px column, so the nav, hero, tiles, log and band share two edges */
.dl .n-w4:where(:not(.v16-root *)){max-width:1180px}
/* hero: display size, tight leading and tracking */
.dl .n-ah:where(:not(.v16-root *)){gap:12px;padding-block:24px 32px}
.dl .n-ah-l:where(:not(.v16-root *)){font-size:var(--fs-hero);line-height:1;letter-spacing:-.03em}
.dl .n-live:where(:not(.v16-root *)){font-size:var(--fs-small);line-height:1.4}
@media (min-width:1000px){
  .dl .n-ah:where(:not(.v16-root *)){grid-template-areas:"ko ." "ko live" "ko l" "ko .";grid-template-rows:1fr auto auto 1fr;row-gap:16px;padding-block:48px}
  .dl .n-ah-l:where(:not(.v16-root *)){font-size:var(--fs-hero);letter-spacing:-.04em}
}
/* tiles: the stamp, the headline and the + sit on one inset (20 px phone, 24 px laptop) */
.dl .n-bento:where(:not(.v16-root *)){gap:var(--gap-b)}
.dl .n-bt-t:where(:not(.v16-root *)),.dl .n-bt.n-half .n-bt-t:where(:not(.v16-root *)){padding:16px var(--in) var(--in)}
@media (min-width:1000px){.dl .n-bt-t:where(:not(.v16-root *)),.dl .n-bt.n-half .n-bt-t:where(:not(.v16-root *)){padding:20px var(--in) var(--in)}}
.dl .n-bt h3:where(:not(.v16-root *)),.dl .n-bt.n-half h3:where(:not(.v16-root *)){font-size:var(--fs-tile);line-height:1.15;letter-spacing:-.015em;padding-right:52px;text-wrap:balance}
@media (min-width:1000px){.dl .n-bt h3:where(:not(.v16-root *)),.dl .n-bt.n-half h3:where(:not(.v16-root *)){line-height:1.1;letter-spacing:-.022em}}
.dl .n-stamp:where(:not(.v16-root *)){left:var(--in);top:var(--in)}
.dl .n-stamp time:where(:not(.v16-root *)),.dl .n-stamp b:where(:not(.v16-root *)){height:28px;font-size:var(--fs-meta);line-height:1}
.dl .n-stamp time:where(:not(.v16-root *)){padding:0 calc(12px - .06em) 0 12px;letter-spacing:.06em}
.dl .n-stamp b:where(:not(.v16-root *)){padding:0 10px;letter-spacing:.01em}
/* the + centres on the headline's last line: inset minus half the difference between its 36 px and the line box */
.dl .n-bt-plus:where(:not(.v16-root *)),.dl .n-bt.n-half .n-bt-plus:where(:not(.v16-root *)){right:var(--in);bottom:calc(var(--in) - 5px);width:36px;height:36px}
@media (min-width:1000px){.dl .n-bt-plus:where(:not(.v16-root *)),.dl .n-bt.n-half .n-bt-plus:where(:not(.v16-root *)){bottom:calc(var(--in) - 3px)}}
@media (min-width:1000px){.dl .n-bt-v .n-dev:where(:not(.v16-root *)){top:68px}}
/* the log: a fixed date column in tabular figures, even rows, and Show all on the same left edge */
.dl .n-log:where(:not(.v16-root *)){margin-top:48px;padding:24px var(--in) 12px}
.dl .n-log h2:where(:not(.v16-root *)){font-size:var(--fs-m);line-height:1.1;letter-spacing:-.022em}
.dl .n-lg-all:where(:not(.v16-root *)){margin-top:12px}
.dl .n-lg-all li:where(:not(.v16-root *)),.dl .n-lg li:where(:not(.v16-root *)){grid-template-columns:4.5rem minmax(0,1fr);column-gap:12px}
.dl .n-lg-all li:where(:not(.v16-root *)){padding:12px 0;font-size:var(--fs-body);line-height:1.4}
.dl .n-lg time:where(:not(.v16-root *)),.dl .n-lg-all time:where(:not(.v16-root *)){font-size:var(--fs-body);font-weight:600;letter-spacing:0}
.dl .n-lg-all span:where(:not(.v16-root *)){text-wrap:pretty}
.dl .n-showall:where(:not(.v16-root *)){min-height:48px;margin:4px 0 4px;font-size:var(--fs-small);line-height:1.4}
@media (min-width:1000px){.dl .n-log:where(:not(.v16-root *)){margin-top:64px;padding:32px var(--in) 16px}.dl .n-log h2:where(:not(.v16-root *)){font-size:var(--fs-l);line-height:1.05;letter-spacing:-.028em}}
/* the closing band: two equal buttons, stacked full width on a phone, side by side on a laptop */
.dl .n-end:where(:not(.v16-root *)){flex-direction:column;align-items:stretch;gap:12px;margin-top:16px;padding:24px var(--in)}
.dl .n-end .btn:where(:not(.v16-root *)){flex:none;width:100%;max-width:none;height:52px;font-size:var(--fs-small)}
@media (min-width:600px){.dl .n-end:where(:not(.v16-root *)){flex-direction:row;justify-content:center;padding:32px var(--in)}.dl .n-end .btn:where(:not(.v16-root *)){width:240px}}
@media (min-width:1000px){.dl .n-end:where(:not(.v16-root *)){margin-top:24px}}
/* the sheet: title, one sentence at a readable measure, then the two cards on shared rows */
.dl .n-sh-b:where(:not(.v16-root *)){gap:0;padding:20px var(--in) calc(24px + env(safe-area-inset-bottom,0px))}
.dl .n-sh-b h2:where(:not(.v16-root *)){font-size:var(--fs-sheet);line-height:1.1;letter-spacing:-.022em;text-wrap:balance}
.dl .n-sh-b > p.n-l:where(:not(.v16-root *)){margin-top:8px;max-width:31em;font-size:var(--fs-body);line-height:1.5;letter-spacing:0;color:var(--fg);text-wrap:balance}
.dl .n-sh-b .n-cb:where(:not(.v16-root *)){margin-top:20px}
.dl .n-sh-b .n-acts4:where(:not(.v16-root *)){margin-top:24px}
@media (min-width:1000px){.dl .n-sh-b:where(:not(.v16-root *)){padding:28px 32px 32px}.dl .n-sh-b h2:where(:not(.v16-root *)){line-height:1.05;letter-spacing:-.028em}}
/* the two cards share three rows (label, big words, small line), so heights and the big words' baseline match */
.dl .n-cb:where(:not(.v16-root *)){grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto auto auto;column-gap:12px;row-gap:0}
.dl .n-cb > div:where(:not(.v16-root *)){grid-row:span 3;display:grid;grid-template-rows:subgrid;row-gap:0;align-content:stretch;padding:16px 16px 18px}
.dl .n-cb h4:where(:not(.v16-root *)){align-self:start;margin-bottom:8px;font-size:var(--fs-meta);line-height:1.2;letter-spacing:.01em}
.dl .n-cb b:where(:not(.v16-root *)){align-self:end;font-size:var(--fs-card);line-height:1.1;letter-spacing:-.02em;text-wrap:balance}
.dl .n-cb > div > span:where(:not(.v16-root *)){align-self:start;margin-top:4px;font-size:var(--fs-small);line-height:1.35;text-wrap:pretty}
.dl .n-cb .n-f b:where(:not(.v16-root *)){color:var(--fg2)}
.dl .n-cb .n-p > span:where(:not(.v16-root *)){color:rgba(253,247,234,.82)}
.dl .n-cb .n-all:where(:not(.v16-root *)){grid-column:1 / -1;grid-row:auto;display:flex;padding:16px}
.dl .n-cb .n-all b:where(:not(.v16-root *)){align-self:center;font-size:var(--fs-card);color:var(--ok)}
@media (min-width:1000px){.dl .n-cb > div:where(:not(.v16-root *)){padding:20px 20px 22px}.dl .n-cb .n-all:where(:not(.v16-root *)){padding:20px}}
/* the sheet's film fills its frame; a wide sheet crops the tall animation film, so keep its aircraft (at about 40% height) in view */
.dl .n-sh-v .n-full:where(:not(.v16-root *)){position:absolute;inset:0}
.dl .n-sh-v video[data-film="anim"]:where(:not(.v16-root *)){object-position:50% 48%}
/* port 1: the numeral sized from its own box, in Inter held until it loads */
@font-face{font-family:"Inter Hold";font-style:normal;font-weight:400 600;font-display:block;src:url("/daylight/inter-opsz-v20-latin.woff2") format("woff2")}
.dl .n-ko:where(:not(.v16-root *)){container-type:size}
.dl .n-ko-t:where(:not(.v16-root *)){--ko:min(130cqh,calc(100cqw / 1.16));font-family:"Inter Hold","Inter",ui-sans-serif,system-ui,sans-serif;font-size:var(--ko);
  transform:translate(calc(var(--ko) * -.035),calc(50cqh + var(--ko) * .3635))}
/* port 2: a film's phone cut on a phone, its wide cut on a laptop */
@media (max-width:999px){.dl .n-r4 video.n-wd:where(:not(.v16-root *)){display:none}}
@media (min-width:1000px){.dl .n-r4 video.n-ph:where(:not(.v16-root *)){display:none}}
/* port 3: the numeral's film on a layer of its own, so WebKit draws the clip sharp */
.dl .n-ko video:where(:not(.v16-root *)){will-change:transform}
/* port 4: on a visitor's page, focus scrolls clear of the public bar */
html:has(.dl .app[data-out] .n-r4a){scroll-padding-top:84px}
