/* ---------- the public pages in Daylight, a visitor (Aryan's picks of rounds 2 to 4, 15 Oct 2026): the landing's header and
   footer and the rounds' parts, made by public-pages-daylight/port.py from public-pages-options/pub.css and
   public-pages-daylight/pd.css, every rule scoped to these pages; the draft's own additions follow it ---------- */
.dl :where(.app[data-pv="d"]) .crumb:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;padding-top:18px;font-size:var(--t-meta);color:var(--fg3)}
.dl :where(.app[data-pv="d"]) .crumb a:where(:not(.v16-root *)){display:inline-flex;align-items:center;min-height:32px}
.dl :where(.app[data-pv="d"]) .crumb .i:where(:not(.v16-root *)){font-size:13px}
.dl :where(.app[data-pv="d"]) .crumb b:where(:not(.v16-root *)){font-weight:500;color:var(--fg2)}
.dl :where(.app[data-pv="d"]) .stack:where(:not(.v16-root *)){display:grid;gap:var(--gap)}
.dl :where(.app[data-pv="d"]) .crumb a:where(:not(.v16-root *)){min-height:44px}
.dl :where(.app[data-pv="d"]) .crumb-back:where(:not(.v16-root *)){display:none}
@media (max-width:759px){.dl :where(.app[data-pv="d"]) .crumb:where(:not(.v16-root *)){display:none}
.dl :where(.app[data-pv="d"]) .crumb-back:where(:not(.v16-root *)){display:inline-flex;align-items:center;gap:4px;min-height:44px;margin-top:8px;font-size:var(--t-small);color:var(--fg2)}
.dl :where(.app[data-pv="d"]) .crumb-back .i:where(:not(.v16-root *)){font-size:17px}}
.dl :where(.app[data-pv="d"]):where(:not(.v16-root *)){--t-pdisplay:clamp(2.375rem,5.2vw,4.25rem);--t-ptitle:clamp(1.75rem,2.8vw,2.5rem);--t-lead:clamp(1.0625rem,1.35vw,1.1875rem); --t-price:clamp(1.5rem,2.25vw,2rem);--sec:clamp(72px,9vw,128px);--head-gap:clamp(28px,3.2vw,44px); --bezel:#0f1a27;--screen:#eef1f4; --stage:radial-gradient(120% 90% at 50% 0%,#f3efe4 0%,#ebe6d9 60%,#e5dfd0 100%); --sun-1:255,156,86;--sun-2:255,192,150;--sky-1:112,170,240;--sky-2:110,208,188;--warm-1:255,172,112;--warm-2:248,204,110; --sea-1:110,204,182;--sea-2:132,184,245;--dusk-1:250,168,150;--dusk-2:252,206,128;--air-1:112,164,235;--air-2:255,184,132; --tick-green:#00a36c}
.dl :where(.app[data-pv="d"]) .scr:where(:not(.v16-root *)){overflow-x:clip}
.dl :where(.app[data-pv="d"]) .pdisplay:where(:not(.v16-root *)){font-size:var(--t-pdisplay);font-weight:var(--w-head);letter-spacing:-.03em;line-height:1.04;text-wrap:balance}
.dl :where(.app[data-pv="d"]) .ptitle:where(:not(.v16-root *)){font-size:var(--t-ptitle);font-weight:var(--w-head);letter-spacing:-.025em;line-height:1.1;text-wrap:balance}
.dl :where(.app[data-pv="d"]) .plead:where(:not(.v16-root *)){font-size:var(--t-lead);line-height:1.5;color:var(--fg2);text-wrap:pretty}
.dl :where(.app[data-pv="d"]) .fine:where(:not(.v16-root *)){font-size:var(--t-meta);line-height:1.5;color:var(--fg3);text-wrap:pretty}
.dl :where(.app[data-pv="d"]) .link:where(:not(.v16-root *)){display:inline-flex;align-items:center;gap:4px;min-height:44px;font-size:var(--t-small);font-weight:var(--w-ui);color:var(--fg)}
.dl :where(.app[data-pv="d"]) .link .i:where(:not(.v16-root *)){font-size:16px;stroke-width:2;transition:transform .2s var(--ease)}
@media (hover:hover) and (pointer:fine){.dl :where(.app[data-pv="d"]) .link:hover .i:where(:not(.v16-root *)){transform:translateX(3px)}}
.dl :where(.app[data-pv="d"]) .link:active:where(:not(.v16-root *)){opacity:.6}
.dl :where(.app[data-pv="d"]) .glowbox:where(:not(.v16-root *)){position:relative;isolation:isolate;--g1:var(--sun-1);--g2:var(--sun-2)}
.dl :where(.app[data-pv="d"]) .glowbox:where(:not(.v16-root *))::before{content:"";position:absolute;z-index:-1;pointer-events:none;inset:var(--gi,8% -9% max(-16%,-88px) -9%);filter:blur(var(--gb,40px)); background:radial-gradient(34% 44% at 14% 60%,rgba(var(--g1),.74),rgba(var(--g1),0) 72%),radial-gradient(36% 46% at 86% 54%,rgba(var(--g2),.74),rgba(var(--g2),0) 72%), radial-gradient(58% 36% at 52% 90%,rgba(var(--g1),.48),rgba(var(--g1),0) 72%)}
@media (max-width:899px){.dl :where(.app[data-pv="d"]) .glowbox:where(:not(.v16-root *))::before{--gb:30px;inset:var(--gi,6% -7% max(-10%,-56px) -7%)}}
.dl :where(.app[data-pv="d"]) .g-sky:where(:not(.v16-root *)){--g1:var(--sky-1);--g2:var(--sky-2)}
.dl :where(.app[data-pv="d"]) .pb .hero:where(:not(.v16-root *)){display:grid;justify-items:center;gap:16px;text-align:center;padding-block:28px 40px}
.dl :where(.app[data-pv="d"]) .pb .hero .crumb:where(:not(.v16-root *)){justify-content:center;padding-top:0}
.dl :where(.app[data-pv="d"]) .pb .hero .pdisplay:where(:not(.v16-root *)){max-width:15ch}
.dl :where(.app[data-pv="d"]) .pb .hero .plead:where(:not(.v16-root *)){max-width:44ch}
.dl :where(.app[data-pv="d"]) .pb .hero .acts:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 18px;margin-top:6px}
.dl :where(.app[data-pv="d"]) .pb .pvsec:where(:not(.v16-root *)){padding-top:var(--sec)}
.dl :where(.app[data-pv="d"]) .pb .pvsec.first:where(:not(.v16-root *)){padding-top:0}
.dl :where(.app[data-pv="d"]) .shead:where(:not(.v16-root *)){display:grid;gap:10px;justify-items:center;text-align:center;margin-bottom:var(--head-gap)}
.dl :where(.app[data-pv="d"]) .shead .plead:where(:not(.v16-root *)){max-width:46ch;text-wrap:balance}
.dl :where(.app[data-pv="d"]) .closeb:where(:not(.v16-root *)){display:grid;justify-items:center;text-align:center;gap:18px}
.dl :where(.app[data-pv="d"]) .closeb .pdisplay:where(:not(.v16-root *)){max-width:12ch}
.dl :where(.app[data-pv="d"]) .closeb .plead:where(:not(.v16-root *)){max-width:46ch;text-wrap:balance}
.dl :where(.app[data-pv="d"]) .pdl:where(:not(.v16-root *)){display:grid;gap:0}
@media (min-width:1100px){.dl :where(.app[data-pv="d"]) .pdl:where(:not(.v16-root *)){grid-template-columns:268px minmax(0,1fr);gap:56px;align-items:start}}
.dl :where(.app[data-pv="d"]) .dpanel:where(:not(.v16-root *)){display:none}
@media (min-width:1100px){.dl :where(.app[data-pv="d"]) .dpanel:where(:not(.v16-root *)){display:grid;gap:4px;position:sticky;top:76px;margin-top:22px;padding:14px;border-radius:var(--r-card);background:var(--card);box-shadow:var(--card-shadow)}}
.dl :where(.app[data-pv="d"]) .dpanel .ph:where(:not(.v16-root *)){padding:6px 10px 8px;font-size:var(--t-meta);font-weight:var(--w-ui);color:var(--fg3)}
.dl :where(.app[data-pv="d"]) .dpanel a:where(:not(.v16-root *)){display:flex;align-items:center;gap:10px;min-height:44px;padding:0 10px;border-radius:12px;font-size:var(--t-small);color:var(--fg2)}
.dl :where(.app[data-pv="d"]) .dpanel a.on:where(:not(.v16-root *)){background:var(--sunk);color:var(--fg);font-weight:var(--w-ui)}
.dl :where(.app[data-pv="d"]) .dpanel a:active:where(:not(.v16-root *)){background:rgba(13,27,42,.06)}
.dl :where(.app[data-pv="d"]) .dart:where(:not(.v16-root *)){max-width:700px;width:100%;margin-inline:auto}
@media (min-width:1100px){.dl :where(.app[data-pv="d"]) .dart:where(:not(.v16-root *)){margin-inline:0}}
.dl :where(.app[data-pv="d"]) .dart .dhead:where(:not(.v16-root *)){display:grid;gap:14px;padding-block:20px 8px}
.dl :where(.app[data-pv="d"]) .dart .dhead h1:where(:not(.v16-root *)){font-size:var(--t-pdisplay);font-weight:var(--w-head);letter-spacing:-.03em;line-height:1.05;text-wrap:balance}
.dl :where(.app[data-pv="d"]) .dart .dhead .by:where(:not(.v16-root *)){display:flex;align-items:center;gap:10px;font-size:var(--t-meta);color:var(--fg3)}
.dl :where(.app[data-pv="d"]) .dart .dhead .by .tmark:where(:not(.v16-root *)){width:24px;height:24px}
.dl :where(.app[data-pv="d"]) .dart .dhead .by .tmark svg:where(:not(.v16-root *)){width:14px;height:14px}
.dl :where(.app[data-pv="d"]) .dart .lead-row:where(:not(.v16-root *)){display:grid;gap:22px;align-items:center}
@media (min-width:700px){.dl :where(.app[data-pv="d"]) .dart .lead-row:where(:not(.v16-root *)){grid-template-columns:minmax(0,1fr) auto;gap:32px}}
.dl :where(.app[data-pv="d"]) .dprose:where(:not(.v16-root *)){display:grid;gap:16px;font-size:1.125rem;line-height:1.7;margin-top:12px}
.dl :where(.app[data-pv="d"]) .dprose h2:where(:not(.v16-root *)){font-size:var(--t-ptitle);font-weight:var(--w-head);letter-spacing:-.022em;line-height:1.12;margin-top:30px;text-wrap:balance;scroll-margin-top:84px}
.dl :where(.app[data-pv="d"]) .dprose p:where(:not(.v16-root *)){color:var(--fg);text-wrap:pretty}
.dl :where(.app[data-pv="d"]) .dlist:where(:not(.v16-root *)){display:grid;gap:10px;padding-left:4px}
.dl :where(.app[data-pv="d"]) .dlist li:where(:not(.v16-root *)){display:flex;gap:12px;font-size:1.0625rem;line-height:1.55}
.dl :where(.app[data-pv="d"]) .dlist li:where(:not(.v16-root *))::before{content:"";flex:none;width:6px;height:6px;margin-top:.62em;border-radius:50%;background:var(--fg)}
.dl :where(.app[data-pv="d"]) .otp:where(:not(.v16-root *)){display:flex;justify-content:flex-start;padding:16px 0 0}
.dl :where(.app[data-pv="d"]) .otp button:where(:not(.v16-root *)){display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 16px;border-radius:999px;background:var(--card);box-shadow:0 0 0 1px var(--line2) inset,0 10px 24px -16px rgba(13,27,42,.4);font-size:var(--t-small);font-weight:var(--w-ui)}
.dl :where(.app[data-pv="d"]) .otp button .i:where(:not(.v16-root *)){font-size:16px;color:var(--fg2)}
@media (min-width:1100px){.dl :where(.app[data-pv="d"]) .otp:where(:not(.v16-root *)){display:none}}
.dl :where(.app[data-pv="d"]) .crumb a:where(:not(.v16-root *)){position:relative}
.dl :where(.app[data-pv="d"]) .crumb a:where(:not(.v16-root *))::after{content:"";position:absolute;inset:0 -10px}
.dl :where(.app[data-pv="d"]) .onlinks:where(:not(.v16-root *)){display:flex;flex-wrap:wrap;justify-content:center;gap:0 20px}
/* the draft's own additions, none of which the rounds could draw: a link to a place on the page lands its heading clear of the
   header; the phone's On this page opens the page's contents under it; the calculator's note for an empty field; the decoder's keys
   and examples press like every button in the app */
.dl :where(.app[data-pv="d"]) .scr [id]:where(:not(.v16-root *)){scroll-margin-top:84px}
.dl :where(.app[data-pv="d"]) .otp:where(:not(.v16-root *)){flex-wrap:wrap}
.dl :where(.app[data-pv="d"]) .otp button[aria-expanded="true"] .i:last-child:where(:not(.v16-root *)){transform:rotate(180deg)}
.dl :where(.app[data-pv="d"]) .otp-list:where(:not(.v16-root *)){flex-basis:100%;display:grid;gap:2px;margin-top:10px;padding:8px;border-radius:var(--r-card);background:var(--card);box-shadow:var(--card-shadow)}
.dl :where(.app[data-pv="d"]) .otp-list[hidden]:where(:not(.v16-root *)){display:none}
.dl :where(.app[data-pv="d"]) .otp-list a:where(:not(.v16-root *)){display:flex;align-items:center;min-height:44px;padding:0 12px;border-radius:12px;font-size:var(--t-small);color:var(--fg2)}
.dl :where(.app[data-pv="d"]) .otp-list a:active:where(:not(.v16-root *)){background:var(--sunk)}
html:has(.dl :is(.pd,.pb)){scroll-padding-top:84px}
.dl .dpanel:where(:not(.v16-root *)){transition:opacity .2s var(--ease),visibility .2s}
.dl .dpanel[data-away]:where(:not(.v16-root *)){opacity:0;visibility:hidden}
@media (prefers-reduced-motion:reduce){.dl .dpanel:where(:not(.v16-root *)){transition:none}}
.dl .dpanel a:where(:not(.v16-root *)){padding-block:9px;line-height:1.35}
.dl .dprose :is(p,li) a:where(:not(.v16-root *)),.dl .fine a:where(:not(.v16-root *)){text-decoration:underline;text-decoration-color:var(--line2);text-underline-offset:4px}
.dl .dprose .dlist b:where(:not(.v16-root *)){font-weight:var(--w-head)}
.dl .dprose .dlist li:where(:not(.v16-root *)){display:block;position:relative;padding-left:18px}
.dl .dprose .dlist li:where(:not(.v16-root *))::before{position:absolute;left:0;top:0}
.dl .kept:where(:not(.v16-root *)){--k-card:var(--card);--k-line:var(--line);--k-night:var(--night);--k-cream:var(--cream)}
.dl .kept .tsp:where(:not(.v16-root *)){--paper:var(--bg);--card:var(--k-card);--tint:var(--sunk);--ink:var(--fg);--ink-deep:var(--fg);--soft:var(--fg2);
  --muted:var(--fg3);--line:var(--k-line);--rule:var(--k-line);--night:var(--k-night);--cream:var(--k-cream);
  --on:var(--sunk);--on-line:var(--line2);--on-edge:var(--fg);--good:var(--ok);--good-fill:var(--ok-fill);--bad:var(--no);
  --bad-fill:var(--no-fill);font-family:var(--font)}
.dl .kept .tsp .ts-card:where(:not(.v16-root *)),.dl .kept.tools .panel:where(:not(.v16-root *)){box-shadow:var(--card-shadow)}
.dl .kept.tools:where(:not(.v16-root *)){--ink:var(--fg);--ink-soft:var(--fg2);--ink-faint:var(--fg3);--tint:var(--sunk);--paper:var(--bg);
  --glow:var(--accent);--glow-soft:var(--line2);--good:var(--ok);--good-fill:var(--ok-fill);--good-line:var(--ok-line);
  --bad:var(--no);--bad-fill:var(--no-fill);--bad-line:var(--no-line);display:block;padding:0;font-family:var(--font)}
.dl .kept.tools .panel:where(:not(.v16-root *)){margin-top:0}
.dl .glowbox:has(> .kept.sim):where(:not(.v16-root *)){max-width:720px;margin-inline:auto}
.dl .pvsec > .fine:where(:not(.v16-root *)){max-width:760px;margin:28px auto 0;text-align:center;color:var(--fg2)}