/* The Lancetek Bake-off (lancetek-website#49). Built on style.css's tokens, so both themes work unchanged:
   orange (--acc) is a fill and the "light in the room", ink is the structure. One decorative nod to the tent,
   the bunting; everything else is the site's own type and grid. Designed with Impeccable's craft floor
   (contrast, states, focus, tabular numerals, no eyebrows, no gradient text) and Taste's anti-slop rules. */
.bake{--bk-gap:clamp(16px,2vw,24px)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
::selection{background:var(--acc);color:var(--on-acc)}
.bake .num,.bake td.num,.bk-facts dd,.bk-score button,.bk-chart text{font-variant-numeric:tabular-nums}

/* crumbs: the section's own nav */
.crumbs{display:flex;gap:6px 22px;flex-wrap:wrap;padding-top:18px;font-size:14px;color:var(--mute)}
.crumbs a{text-decoration:none;padding:4px 0;border-bottom:2px solid transparent}
.crumbs a:hover{color:var(--ink)}
.crumbs a[aria-current=page]{color:var(--ink);border-color:var(--acc)}

/* bunting */
.bunting{display:block;width:100%;height:44px;margin:0 0 8px}
.bunting .line{stroke:var(--ink);stroke-width:1.5;opacity:.5}
.bunting .f0{fill:var(--acc)}.bunting .f1{fill:var(--ink)}.bunting .f2{fill:var(--tint);stroke:var(--acc);stroke-width:1.5}
.bk-home .bunting .line{stroke:var(--on-band)}.bk-home .bunting .f1{fill:var(--on-band)}.bk-home .bunting .f2{fill:transparent}

/* hero */
.bk-hero{padding-top:40px}
.bk-hero h1{font-family:var(--display);font-weight:750;font-size:clamp(44px,7vw,104px);line-height:.95;letter-spacing:-.035em;margin:12px 0 0;max-width:13ch;text-wrap:balance}
.bk-hero.sm h1{font-size:clamp(38px,5vw,72px);max-width:20ch}
.bk-hero h1 em{color:var(--acc-ink);font-style:normal;font-family:inherit;font-weight:inherit;letter-spacing:inherit}
.bk-hero .lead{margin-top:24px;max-width:60ch;text-wrap:pretty}
.bk-hero .cta{margin-top:32px}
.bk-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:56px 0 0;border-top:1.5px solid var(--ink)}
.bk-facts div{padding:18px 18px 0 0}.bk-facts div+div{padding-left:18px;border-left:1px solid var(--line)}
.bk-facts dt{font-size:14px;color:var(--mute)}
.bk-facts dd{margin:4px 0 0;font:600 clamp(22px,2.6vw,34px)/1.1 var(--display);letter-spacing:-.02em}

/* sections and prose */
.bk-sec{padding-top:96px}
.bk-sec h2,.bk-tools h2,.bk-submit h2,.bk-help h2,.bk-results h2{font-family:var(--display);font-weight:650;font-size:clamp(28px,3.4vw,46px);line-height:1.05;letter-spacing:-.03em;margin:0 0 20px;text-wrap:balance}
.prose{max-width:68ch}.prose p,.prose li{color:var(--ink2)}.prose h2{margin-top:48px}
.prose strong{color:var(--ink)}
.bk-sub,.bk-note,.bk-small,.bk-meta{color:var(--mute);font-size:15px;max-width:72ch}
.bk-note{margin-top:28px}
.bk-why .prose p:first-child{font-size:20px;color:var(--ink)}
.bk-rules{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1.5px solid var(--ink);counter-reset:r}
.bk-rules li{padding:24px 22px 8px 0;counter-increment:r}
.bk-rules li+li{padding-left:22px;border-left:1px solid var(--line)}
.bk-rules h3{font-size:19px;margin:0 0 8px;letter-spacing:-.01em}
.bk-rules h3::before{content:counter(r);display:block;font:700 15px var(--sans);color:var(--acc-ink);margin-bottom:10px}
.bk-rules p{margin:0;color:var(--ink2);font-size:15.5px}

/* recipes table */
.bk-table-wrap{overflow-x:auto;border-top:1.5px solid var(--ink)}
.bk-table{width:100%;border-collapse:collapse;font-size:15px;min-width:900px}
.bk-table th,.bk-table td{text-align:left;vertical-align:top;padding:16px 14px 16px 0;border-bottom:1px solid var(--line)}
.bk-table thead th{font-size:13px;font-weight:600;color:var(--mute);padding-top:12px}
.bk-table .num{text-align:right;white-space:nowrap}
.bk-table small{display:block;color:var(--mute);font-size:12px}
.bk-table tbody th{font-weight:650;max-width:34ch}
.bk-table .recipe{font-weight:400;color:var(--ink2);margin:6px 0 0;font-size:14px}
.pid{display:inline-block;font:600 12px var(--code-font);background:var(--ink);color:var(--bg);padding:2px 6px;margin-right:4px}
.ver{font-weight:400;color:var(--mute);font-size:13px}
.bk-table code,.bk-tools code{font:12px var(--code-font);color:var(--mute)}
.bk-table a,.bk-tools a,.prose a,.bk-note a,.bk-small a,.bk-consent a{color:var(--acc-ink);text-underline-offset:3px}

/* bakes (what's in the tent) */
.bk-bakes{display:grid;grid-template-columns:2fr 1fr;gap:var(--bk-gap)}
.bk-bake{display:flex;flex-direction:column;gap:10px;padding:32px;background:var(--band);color:var(--on-band);text-decoration:none;border-radius:var(--r);min-height:240px;transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.bk-bake:hover{transform:translateY(-3px)}
.bk-bake h3{font-family:var(--display);font-size:clamp(26px,2.6vw,36px);margin:0;letter-spacing:-.02em}
.bk-bake p{margin:0;color:var(--d-soft)}.bk-bake .bk-meta{color:var(--d-mute)}
.bk-bake .go{margin-top:auto;color:var(--acc);font-weight:600}
.bk-bake.soon{background:var(--card);color:var(--ink);border:1px dashed var(--line)}
.bk-bake.soon p{color:var(--ink2)}.bk-bake.soon .go{color:var(--mute)}

/* briefs index */
.bk-briefs{list-style:none;padding:0;margin:0;display:grid;gap:56px}
.bk-brief{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px;align-items:center}
.bk-brief h2{margin:0 0 10px}.bk-brief h2 a{text-decoration:none}.bk-brief h2 a:hover{color:var(--acc-ink)}
.bk-brief p{color:var(--ink2);max-width:46ch}
.bk-brief-shots{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.bk-brief-shots img,.bk-home-shots img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:top;display:block;border:1px solid var(--line);background:var(--card)}
.bk-brief-shots img:nth-child(2){transform:translateY(18px)}

/* brief page */
.bk-brief-head{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;padding-top:48px;align-items:start}
.bk-tools h2{font-size:clamp(22px,2.2vw,28px);margin-bottom:10px}
.bk-tools p{color:var(--ink2);margin:0 0 14px;max-width:62ch}
.bk-tools ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
.bk-tools li{border:1px solid var(--line);background:var(--card);padding:6px 10px;font-size:14px}
.bk-brieftext{border-top:1.5px solid var(--ink);padding-top:14px}
.bk-brieftext summary{cursor:pointer;font-weight:600}
.bk-brieftext pre{white-space:pre-wrap;overflow-wrap:anywhere;font:13px/1.55 var(--code-font);color:var(--ink2);max-height:420px;overflow:auto;background:var(--code);padding:14px;margin:12px 0 0}

.bk-judge{padding-top:40px}
.bk-bar{position:sticky;top:68px;z-index:5;display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:12px 0;background:var(--bg);border-bottom:1px solid var(--line);margin-bottom:24px}
.bk-progress{flex:1 1 240px;font-weight:600}
.bk-bar .btn{padding:9px 16px}
.bk-grid{display:grid;align-items:start;grid-template-columns:repeat(auto-fill,minmax(min(330px,100%),1fr));gap:var(--bk-gap)}
.bk-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px;display:flex;flex-direction:column;gap:12px;scroll-margin-top:140px;transition:border-color .2s,box-shadow .2s}
.bk-card.star{border-color:var(--acc);box-shadow:0 18px 40px -28px var(--shadow),inset 0 0 0 1px var(--acc)}
.bk-card header{display:flex;align-items:center;gap:12px}
.bk-card h2{margin:0;line-height:1}
.bk-letter{display:inline-grid;place-items:center;width:46px;height:46px;background:var(--ink);color:var(--bg);font:700 26px var(--display);border-radius:calc(var(--r) / 2)}
.bk-card.star .bk-letter{background:var(--acc);color:var(--on-acc)}
.bk-open{margin-left:auto;font-size:14px;font-weight:600;color:var(--acc-ink);text-underline-offset:3px}
.bk-shots{display:grid;grid-template-columns:minmax(0,1fr) 88px;gap:10px;align-items:start}
.bk-shots a{display:block;text-decoration:none;color:var(--mute);font-size:12px}
.bk-shots img{display:block;width:100%;height:auto;object-fit:cover;object-position:top;border:1px solid var(--line);background:var(--bg);transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.bk-shots .wide img{aspect-ratio:4/5}.bk-shots .phone img{aspect-ratio:160/346}
.bk-shots a:hover img{transform:translateY(-2px)}
.bk-shots span{display:block;margin-top:4px}
.bk-flag{margin:0;font-size:13px;font-weight:600;color:var(--acc-ink)}
.bk-score{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}
.bk-score button,.bk-star,.bk-showp{font:600 15px var(--sans);border:1px solid var(--line);background:var(--bg);color:var(--ink);cursor:pointer;min-height:44px;border-radius:calc(var(--r) / 3)}
.bk-score button:hover{border-color:var(--ink)}
.bk-score button.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.bk-score button.on.top{background:var(--acc);border-color:var(--acc);color:var(--on-acc)}
.bk-star{display:flex;align-items:center;justify-content:center;gap:8px}
.bk-star svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}
.bk-star[aria-pressed=true]{background:var(--acc);color:var(--on-acc);border-color:var(--acc)}
.bk-star[aria-pressed=true] svg{fill:currentColor}
.bk-showp{font-weight:500;font-size:14px;color:var(--ink2);min-height:38px}
.bk-showp:hover,.bk-star:hover{border-color:var(--ink)}
.bk-showp[aria-expanded=true]{color:var(--mute)}
.bk-reveal{font-size:14px;border-top:1px dashed var(--line);padding-top:12px;display:grid;gap:8px}
.bk-reveal h3{margin:0;font-size:16px}
.bk-reveal p{margin:0;color:var(--ink2)}
.bk-reveal dl{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:0}
.bk-reveal dt{color:var(--mute)}.bk-reveal dd{margin:0}
.bk-reveal ol{margin:0;padding-left:20px;color:var(--ink2)}
.bk-reveal code{font:12px var(--code-font)}
.bk-reveal a{color:var(--acc-ink)}

/* submit */
.bk-submit{padding-top:88px;max-width:820px}
.bk-submit>p{color:var(--ink2)}
.bk-form{display:grid;gap:16px;margin-top:20px}
.bk-form .two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.bk-form label{display:grid;gap:6px;font-weight:600;font-size:15px}
.bk-form input[type=text],.bk-form input[type=email]{font:inherit;font-weight:400;padding:12px 14px;border:1px solid var(--o-line);background:var(--card);color:var(--ink);border-radius:calc(var(--r) / 3);caret-color:var(--acc)}
.bk-form input:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
.bk-form input[aria-invalid=true]{border-color:#C62828}
.bk-consent{grid-template-columns:auto 1fr !important;align-items:start;font-weight:400 !important}
.bk-consent input{width:20px;height:20px;margin-top:3px;accent-color:var(--acc)}
.bk-form .btn{justify-self:start;font-size:16px;padding:14px 24px}
.bk-form .btn:disabled{opacity:.6;cursor:progress}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.bk-status{margin:0;font-weight:600;min-height:1.6em}
.bk-status.bad{color:light-dark(#B3261E,#FF8A80)}
.bk-status.ok{color:var(--ink)}

/* your scores against everyone's, and the results page */
.bk-yours,.bk-results{padding-top:24px}
.bk-results{padding-bottom:24px}
.bk-results section{padding-top:64px}
.bk-results .bk-chart,.bk-yours .bk-chart{max-width:980px}
.bk-results h2+p,.bk-yours h3+p{color:var(--ink2);max-width:68ch;margin:0 0 20px}
.bk-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:0;border-top:1.5px solid var(--ink);margin:0}
.bk-kpis div{padding:16px 16px 0 0}
.bk-kpis dt{font-size:14px;color:var(--mute)}
.bk-kpis dd{margin:4px 0 0;font:600 26px/1.15 var(--display);letter-spacing:-.02em}
.bk-kpis dd small{display:block;font:400 14px var(--sans);color:var(--ink2);letter-spacing:0;margin-top:4px}
.bk-chart{width:100%;height:auto;display:block;overflow:visible}
.bk-chart .bar{fill:var(--acc)}
.bk-chart .bar.you{fill:var(--ink)}
.bk-chart .bar:hover,.bk-chart .dot:hover{opacity:.8}
.bk-chart .grid{stroke:var(--line);stroke-width:1}
.bk-chart .axis{stroke:var(--ink);stroke-width:1}
.bk-chart text{fill:var(--ink2);font:13px var(--sans)}
.bk-chart text.lbl{fill:var(--ink);font-weight:600}
.bk-chart .dot{fill:var(--acc);stroke:var(--bg);stroke-width:2}
.bk-chart .tick{fill:var(--mute);font-size:12px}
.bk-legend{display:flex;gap:18px;flex-wrap:wrap;font-size:14px;color:var(--ink2);margin:0 0 10px;padding:0;list-style:none}
.bk-legend i{display:inline-block;width:12px;height:12px;margin-right:6px;vertical-align:-1px}
.bk-legend .c-acc{background:var(--acc)}.bk-legend .c-ink{background:var(--ink)}
.bk-tip{position:fixed;z-index:30;pointer-events:none;background:var(--band);color:var(--on-band);font-size:13px;padding:8px 10px;max-width:260px;border-radius:6px;box-shadow:0 10px 30px -10px var(--shadow)}
.bk-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(360px,100%),1fr));gap:40px}
.bk-cols h3,.bk-stack h3{margin:0 0 8px;font-size:19px}
.bk-stack{display:grid;gap:40px;max-width:980px}
details.bk-data{margin-top:12px;font-size:14px}
details.bk-data summary{cursor:pointer;color:var(--mute)}
details.bk-data table{border-collapse:collapse;margin-top:8px}
details.bk-data td,details.bk-data th{padding:4px 14px 4px 0;border-bottom:1px solid var(--line);text-align:left}
.bk-empty{background:var(--tint);padding:20px 22px;border-radius:var(--r);max-width:68ch}
.bk-loading{color:var(--mute)}

/* help band (above the footer) */
.bk-help{margin-top:120px;padding:64px 0;background:var(--card);border-top:1px solid var(--line)}
.bk-help p{color:var(--ink2);max-width:60ch}
.bk-help-links{list-style:none;padding:0;margin:24px 0 0;display:flex;gap:12px;flex-wrap:wrap}
.bk-help+footer{border-top:0}

/* homepage blurb (index.html, between the bakeoff:home markers) */
.bk-home{background:var(--band);color:var(--on-band);margin-top:120px;padding:24px 0 72px;overflow:hidden}
.bk-home .wrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:48px;align-items:center}
.bk-home .bunting{grid-column:1/-1}
.bk-home h2{font-family:var(--display);font-weight:650;font-size:clamp(30px,3.6vw,52px);line-height:1.04;letter-spacing:-.03em;margin:0;text-wrap:balance}
.bk-home h2 em{color:var(--acc);font-style:normal;font-family:inherit;font-weight:inherit;letter-spacing:inherit}
.bk-home p{color:var(--d-soft);max-width:54ch;margin:20px 0 28px}
.bk-home .cta{display:flex;gap:12px;flex-wrap:wrap}
.bk-home-shots{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;perspective:1200px}
.bk-home-shots img{border-color:var(--d-line);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.bk-home-shots img:nth-child(1){transform:rotate(-4deg) translateY(10px)}
.bk-home-shots img:nth-child(3){transform:rotate(4deg) translateY(10px)}
.bk-home-shots:hover img{transform:none}

@media (max-width:960px){
 .bk-rules{grid-template-columns:1fr 1fr}.bk-rules li:nth-child(3){padding-left:0;border-left:0}
 .bk-brief,.bk-brief-head,.bk-home .wrap,.bk-bakes{grid-template-columns:1fr}
 .bk-facts{grid-template-columns:1fr 1fr}.bk-facts div:nth-child(3){padding-left:0;border-left:0}
}
@media (max-width:640px){
 .wrap{padding-left:16px;padding-right:16px}
 .bk-sec{padding-top:64px}
 .bk-rules{grid-template-columns:1fr}.bk-rules li+li{padding-left:0;border-left:0;border-top:1px solid var(--line)}
 .bk-form .two{grid-template-columns:1fr}
 .bk-bar{top:60px}
 .bk-bar .bk-revealall{display:none}
 .bk-hero{padding-top:20px}
}
@media (prefers-reduced-motion:reduce){.bake *,.bk-home *{transition:none !important}.bk-home-shots img{transform:none !important}}
