/* fail-in-plan: one book chapter.
   A single page of a book on a paper-2 desk: chapter opening with a sink and a gate
   ornament (Workday's five phases with a gate between each), a running head and folio,
   small-caps first lines, indented paragraphs, roman section numbers under an ornament,
   and a handful of Dave's sentences set very large across the measure.
   Motion: a gold highlighter stroke drawn behind key sentences (see fail-in-plan.js).
   Every rule is scoped to body.bk. */

.bk{--bk-gold:#B8862F;--bk-hl:rgba(184,134,47,.36);--bk-pad:clamp(20px,7vw,96px);}
.bk main{background:var(--paper-2);}
.bk ::selection{background:rgba(184,134,47,.34);color:var(--ink);}
.bk main a:focus-visible{outline:2px solid #16304F;outline-offset:3px;}
.bk .art-rail{display:none !important;}
.bk-defs{position:absolute;width:0;height:0;overflow:hidden;}

/* ---------- the page ---------- */
.bk main > section.bk-opener,.bk main > section.bk-body{padding:0;}
.bk main > section.bk-opener{padding-top:clamp(0px,3vw,2.6rem);}
.bk-slab{width:min(1060px,100%);margin:0 auto;padding:0 var(--bk-pad);
  background:linear-gradient(90deg,rgba(22,21,15,.07),rgba(22,21,15,0) 34px) var(--paper);}
.bk-slab-top{padding-top:1.5rem;}
.bk-slab-text{padding-bottom:clamp(3.5rem,8vw,6.5rem);}
.bk main > section.bk-cta{padding:clamp(3rem,6vw,4.5rem) 0;}

/* ---------- chapter opening ---------- */
.bk .bk-opener .back-link{margin:0;}
.bk-sink{text-align:center;padding:clamp(3.5rem,11vh,8rem) 0 clamp(2.4rem,5vw,3.6rem);}
.bk-orn-big{display:block;width:min(360px,80%);height:auto;margin:0 auto 2.6rem;overflow:visible;}
.bk-eyebrow,.bk-rh,.bk-born,.bk-found,.bk-name{font-family:var(--serif);font-variant-caps:all-small-caps;
  letter-spacing:.11em;font-weight:500;}
.bk-eyebrow{font-size:1.06rem;color:var(--muted);margin:0 0 1.4rem;}
.bk .bk-opener h1{max-width:none;margin:0 auto;font-weight:400;letter-spacing:-.03em;line-height:1;}
.bk-h1a{display:block;font-style:italic;font-size:clamp(1.3rem,1rem + 1.4vw,2.05rem);color:var(--ink-2);
  letter-spacing:-.01em;line-height:1.2;}
.bk-h1b{display:block;font-size:clamp(2.75rem,1.2rem + 6.4vw,6.4rem);line-height:.98;margin-top:.22em;color:var(--ink);}
.bk .bk-by{justify-content:center;gap:.7rem;margin:2.2rem 0 0;padding:0;border:0;font-family:var(--serif);
  font-size:1rem;color:var(--muted);font-weight:400;}
.bk-name{font-size:1.1rem;color:var(--ink);}
.bk-when{white-space:nowrap;}
.bk-argument{max-width:31em;margin:2.6rem auto 0;font-family:var(--serif);font-style:italic;font-size:1.06rem;
  line-height:1.75;color:var(--ink-2);text-wrap:balance;}
.bk-argument a{color:var(--ink-2);text-decoration:none;background-image:linear-gradient(var(--bk-gold),var(--bk-gold));
  background-size:0 1px;background-position:0 100%;background-repeat:no-repeat;transition:background-size .2s;}
.bk-argument a:hover{background-size:100% 1px;color:var(--ink);}

/* ---------- running head and folio ---------- */
.bk-rh{position:sticky;top:64px;z-index:6;display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  background:var(--paper);border-bottom:1px solid var(--rule);padding:.95rem 0 .55rem;margin:0 0 clamp(2.6rem,6vw,4rem);
  font-size:.98rem;color:var(--muted);line-height:1.2;}
.bk-rh-r{display:flex;gap:1.1rem;align-items:baseline;margin-left:auto;}
.bk-rh-f{color:var(--ink);min-width:2.2em;text-align:right;}
.bk-rh-f:empty{display:none;}

/* ---------- the text ---------- */
.bk-text{font-family:var(--serif);font-size:clamp(1.07rem,.98rem + .38vw,1.24rem);line-height:1.72;color:var(--ink);
  font-variant-numeric:oldstyle-nums proportional-nums;font-kerning:normal;hyphens:manual;}
.bk-text p,.bk-list,.bk-fig,.bk-break{max-width:34em;margin-left:auto;margin-right:auto;}
.bk-text p{margin-top:0;margin-bottom:0;}
.bk-sec p + p{text-indent:1.6em;}
.bk-sec p.bk-set,.bk-sec p.bk-deck,.bk-sec p.bk-note,.bk-sec .bk-set + p,.bk-sec .bk-list + p,.bk-sec .bk-fig + p,
.bk-sec .bk-orn-end + p{text-indent:0;}
.bk-sec .bk-deck + p{text-indent:0;} /* QA: first paragraph after a section deck opens flush, like every other section */
.bk-first > p:first-child::first-line,.bk-sec > h2 + p:not(.bk-set):not(.bk-deck)::first-line,.bk-deck + p::first-line{
  font-variant-caps:small-caps;letter-spacing:.035em;}
/* QA: Chrome drops the gold stroke on the small-caps first line, so a section that opens on a highlighted sentence keeps the highlight instead */
.bk-deck + p:has(> mark.bk-hl:first-child)::first-line,.bk-sec > h2 + p:has(> mark.bk-hl:first-child)::first-line{font-variant-caps:normal;letter-spacing:normal;}
.bk-text a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--bk-gold);text-decoration-thickness:1.5px;
  text-underline-offset:.18em;}
.bk-text a:hover{color:#16304F;}

/* section break: the gate ornament and a roman number */
.bk-break{display:flex;flex-direction:column;align-items:center;gap:.85rem;margin-top:4.4em;margin-bottom:1.5em;}
.bk-orn{display:block;width:200px;height:22px;overflow:visible;}
.bk-num{font-family:var(--serif);font-size:1.2rem;letter-spacing:.14em;color:var(--muted);line-height:1;font-variant-numeric:lining-nums;}
.bk-text h2{font-size:clamp(1.5rem,1.15rem + 1.35vw,2.15rem);font-weight:400;line-height:1.16;letter-spacing:-.018em;
  text-align:center;max-width:21em;margin:0 auto .95em;color:var(--ink);font-variant-numeric:lining-nums;}
.bk-deck{font-style:italic;text-align:center;color:var(--ink-2);margin-top:-.45em !important;margin-bottom:1.6em !important;font-size:1.06em;}

/* ---------- set pieces: his sentences across the measure ---------- */
.bk-text p.bk-set{max-width:15.5em;margin:clamp(2.6rem,7vw,5.2rem) auto;text-align:center;font-weight:400;color:var(--ink);
  font-size:clamp(1.95rem,1.05rem + 3.7vw,3.95rem);line-height:1.06;letter-spacing:-.028em;text-wrap:balance;
  font-variant-numeric:lining-nums;}
.bk-set-thesis .bk-s1{display:block;font-size:.5em;font-style:italic;letter-spacing:-.01em;color:var(--ink-2);line-height:1.25;}
.bk-set-thesis .bk-s2{display:block;font-size:1.55em;line-height:1;margin-top:.12em;letter-spacing:-.04em;}
.bk-set-three span{display:block;}
.bk-set-three span:nth-child(2){font-style:italic;}
.bk-set-quote .bk-q{display:block;font-style:italic;}
.bk-set-quote .bk-qt{display:block;font-size:max(.48em,1.12rem);line-height:1.35;letter-spacing:-.008em;color:var(--ink-2);
  max-width:24em;margin:.75em auto 0;}
.bk-set-broken em{font-style:italic;}

/* ---------- figure: where failure is born and found ---------- */
.bk-fig{margin-top:2.2em;margin-bottom:2.3em;}
.bk-phases{position:relative;display:grid;grid-template-columns:repeat(5,1fr);row-gap:.85rem;}
.bk-born,.bk-found{position:relative;text-align:center;font-size:.98rem;color:var(--ink-2);line-height:1.2;}
.bk-born{grid-column:1 / 3;grid-row:1;padding-bottom:.55rem;border-bottom:1px solid var(--bk-gold);}
.bk-found{grid-column:4 / 6;grid-row:3;padding-top:.55rem;border-top:1px solid var(--bk-gold);}
.bk-born::before,.bk-born::after,.bk-found::before,.bk-found::after{content:"";position:absolute;width:1px;height:.5rem;background:var(--bk-gold);}
.bk-born::before{left:0;bottom:0;} .bk-born::after{right:0;bottom:0;}
.bk-found::before{left:0;top:0;} .bk-found::after{right:0;top:0;}
.bk-ph{grid-column:1 / -1;grid-row:2;display:grid;grid-template-columns:repeat(5,1fr);list-style:none;margin:0;padding:0;
  border-top:1px solid var(--ink-2);border-bottom:1px solid var(--ink-2);}
.bk-ph li{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;padding:.8rem .35rem;
  font-family:var(--sans);font-size:.8rem;font-weight:500;line-height:1.3;color:var(--ink-2);font-variant-numeric:normal;}
.bk-ph li + li{border-left:1.5px solid var(--ink-2);}
.bk-fig figcaption{max-width:30em;margin:1.3em auto 0;text-align:center;font-style:italic;font-size:.86em;line-height:1.55;color:var(--muted);}

/* ---------- images ----------
   Frontispiece: the cover runs wider than the text measure, out into the page margins.
   Plate: a poster tipped in on its own sheet of darker paper, caption set like the figure. */
.bk-frontis{margin:0 calc(var(--bk-pad) * -.6) clamp(2.2rem,5vw,3.6rem);}
.bk-frontis img{width:100%;height:auto;}
.bk-plate{max-width:36em;margin:2.6em auto 0;}
.bk-plate-sheet{background:var(--paper-2);border:1px solid var(--rule);padding:clamp(10px,2.4vw,26px);}
.bk-plate img{width:100%;height:auto;}
.bk-plate figcaption{max-width:30em;margin:1.1em auto 0;text-align:center;font-style:italic;font-size:.86em;line-height:1.55;color:var(--muted);}

/* ---------- lists ---------- */
.bk-list{list-style:none;padding:0 0 0 1.6em;margin-top:.7em;margin-bottom:.9em;}
.bk-list li{position:relative;padding-left:1.4em;margin:.18em 0;}
.bk-list li::before{content:"";position:absolute;left:.15em;top:.68em;width:.36em;height:.36em;background:var(--bk-gold);transform:rotate(45deg);}
.bk-ol{counter-reset:bk;}
.bk-ol li{counter-increment:bk;}
.bk-ol li::before{content:counter(bk) ".";background:none;transform:none;width:auto;height:auto;top:0;left:0;color:var(--muted);}

/* ---------- close ---------- */
.bk-break-close{margin-top:5em;}
.bk-break-close .bk-orn{width:260px;height:28px;}
.bk-orn-end{width:200px;height:22px;margin:3.2rem auto 0;--bk-orn-fill:#B8862F;}
.bk-text p.bk-note{font-size:.88em;line-height:1.65;color:var(--ink-2);margin-top:2.4rem;padding-top:1.3rem;border-top:1px solid var(--rule);}

/* ---------- the highlighter ----------
   Finished state (no JS, reduced motion, print): the stroke is already drawn. */
.bk mark.bk-hl{color:inherit;padding:0 .06em;border-radius:.18em;
  background:linear-gradient(to bottom,transparent 30%,var(--bk-hl) 30%,var(--bk-hl) 90%,transparent 90%);
  -webkit-box-decoration-break:clone;box-decoration-break:clone;-webkit-print-color-adjust:exact;print-color-adjust:exact;}

@media screen and (prefers-reduced-motion:no-preference){
  /* JS splits each marked sentence into words; the gold sweeps behind them left to right */
  .bk mark.bk-hl.bk-arm{background:linear-gradient(to bottom,transparent 30%,rgba(184,134,47,.07) 30%,rgba(184,134,47,.07) 90%,transparent 90%);}
  .bk mark.bk-hl.bk-arm.bk-done{background:linear-gradient(to bottom,transparent 30%,var(--bk-hl) 30%,var(--bk-hl) 90%,transparent 90%);}
  .bk-hw{position:relative;isolation:isolate;}
  .bk-hw::before{content:"";position:absolute;left:0;right:0;top:30%;bottom:10%;z-index:-1;background:var(--bk-hl);
    transform:scaleX(0);transform-origin:0 50%;transition:transform var(--t,.2s) linear var(--d,0s);}
  .bk mark.bk-on .bk-hw::before{transform:scaleX(1);}
  .bk mark.bk-done .bk-hw::before{transition:none;opacity:0;}
}

/* ---------- phones ---------- */
@media (max-width:640px){
  .bk-slab{background:var(--paper);}
  .bk-rh-l{display:none;}
  .bk .bk-by{flex-direction:column;gap:.35rem;}
  .bk-by .bk-dot{display:none;}
  .bk-rh{font-size:.92rem;}
  .bk-sec p + p{text-indent:1.2em;}
  .bk-list{padding-left:.4em;}
  .bk-ph li{font-size:.72rem;padding:.7rem .15rem;}
  .bk-born,.bk-found{font-size:.9rem;}
  .bk-frontis{margin-left:0;margin-right:0;}
}

/* ---------- print ---------- */
@media print{
  .bk .reveal{opacity:1 !important;transform:none !important;}
  .bk main{background:#fff;}
  .bk-slab{background:#fff;width:100%;padding:0 1.2cm;}
  .bk-rh{position:static;background:none;}
  .bk-sink{padding-top:2rem;}
}

/* ---------- Color 2026-10-09: electric blue leads (the 9Nation blue), gold stays the highlighter, red only where failure is found ---------- */
.bk{--bk-bl:#0003cc;--bk-blt:#ececfb;--bk-bld:#0002a8;--bk-rd:#A93A3A;--bk-rdt:#FDF3F3;}
/* chapter opening: a blue endpaper wash that settles into the page */
.bk-slab-top{background:
  linear-gradient(90deg,rgba(22,21,15,.07),rgba(22,21,15,0) 34px),
  radial-gradient(rgba(0,3,204,.10) 1px,transparent 1.2px) 0 0/18px 18px,
  linear-gradient(180deg,var(--bk-blt) 0%,var(--bk-blt) 46%,var(--paper) 78%);
  -webkit-mask-image:none;}
.bk-slab-top{background-color:var(--paper);}
.bk-slab-top .bk-frontis{position:relative;}
.bk-orn-big g[stroke="#33312a"]{stroke:var(--bk-bl);}
.bk-eyebrow{color:var(--bk-bld);}
.bk-h1b{color:var(--ink);}
.bk-argument a{background-image:linear-gradient(var(--bk-bl),var(--bk-bl));}
/* section breaks: blue gates between the gold phases, blue roman numerals */
.bk-text{--bk-orn-gate:var(--bk-bl);}
.bk-num{color:var(--bk-bl);font-weight:500;}
.bk-rh-f{color:var(--bk-bl);}
.bk-text a{text-decoration-color:var(--bk-bl);}
/* the thesis lands in blue */
.bk-set-thesis .bk-s2{color:var(--bk-bl);}
.bk-80{color:var(--bk-bl);}
/* the 80% set piece sits on a blue band that runs to the page edges */
.bk-slab-text{overflow-x:clip;}
.bk-text p.bk-set-quote{position:relative;isolation:isolate;padding:clamp(2.2rem,5vw,3.4rem) 0;}
.bk-text p.bk-set-quote::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:50%;width:1060px;transform:translateX(-50%);
  background:repeating-linear-gradient(180deg,transparent 0 27px,rgba(0,3,204,.07) 27px 28px) var(--bk-blt);
  -webkit-print-color-adjust:exact;print-color-adjust:exact;}
.bk-set-quote .bk-qt{color:var(--ink-2);}

/* figure I: born in blue, found in red */
.bk-born{color:var(--bk-bld);border-bottom-color:var(--bk-bl);}
.bk-born::before,.bk-born::after{background:var(--bk-bl);}
.bk-found{color:var(--bk-rd);border-top-color:var(--bk-rd);}
.bk-found::before,.bk-found::after{background:var(--bk-rd);}
.bk-ph li:nth-child(-n+2){background:var(--bk-blt);color:var(--bk-bld);font-weight:600;}
.bk-ph li:nth-child(n+4){background:var(--bk-rdt);color:var(--bk-rd);font-weight:600;}
.bk-ph li{-webkit-print-color-adjust:exact;print-color-adjust:exact;}

/* figure II: the numbers he counted, set as a row of blue figures */
.bk-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:2.4em;margin-bottom:2.4em;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);}
.bk-stats div{padding:1.3rem 1.1rem 1.25rem;text-align:center;}
.bk-stats div + div{border-left:1px solid var(--rule);}
.bk-stats b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(2.9rem,2rem + 3vw,4.3rem);line-height:1;
  letter-spacing:-.03em;color:var(--bk-bl);font-variant-numeric:lining-nums tabular-nums;}
.bk-stats span{display:block;max-width:13em;margin:.6rem auto 0;font-family:var(--sans);font-size:.8rem;line-height:1.4;color:var(--muted);}

/* figure III: decision velocity, ten a week against three */
.bk-vel{margin-top:2.2em;margin-bottom:2.4em;padding:1.3rem 0 1.4rem;border-top:1px solid var(--ink-2);border-bottom:1px solid var(--rule);}
.bk-text .bk-vel p.bk-vel-h{max-width:none;margin:0 0 1rem;font-family:var(--sans);font-size:.8rem;font-weight:600;color:var(--ink-2);text-indent:0;}
.bk-vel-row{display:grid;grid-template-columns:10.5rem minmax(0,1fr) 2.6rem;align-items:center;gap:1rem;}
.bk-vel-row + .bk-vel-row{margin-top:.7rem;}
.bk-vel-l{font-family:var(--sans);font-size:.84rem;font-weight:500;line-height:1.3;color:var(--ink-2);}
.bk-vel-bar{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:4px;height:1.6rem;}
.bk-vel-bar i{display:block;background:var(--bk-bl);-webkit-print-color-adjust:exact;print-color-adjust:exact;}
.bk-vel-b .bk-vel-bar i{background:repeating-linear-gradient(135deg,var(--bk-rd) 0 2px,var(--bk-rdt) 2px 6px);outline:1px solid var(--bk-rd);outline-offset:-1px;}
.bk-vel-row b{font-family:var(--serif);font-weight:400;font-size:1.9rem;line-height:1;font-variant-numeric:lining-nums tabular-nums;text-align:right;}
.bk-vel-a b{color:var(--bk-bl);} .bk-vel-b b{color:var(--bk-rd);}
.bk-vel-l{text-indent:0;}

@media (max-width:640px){
  .bk-slab-top{background:
    radial-gradient(rgba(0,3,204,.09) 1px,transparent 1.2px) 0 0/16px 16px,
    linear-gradient(180deg,var(--bk-blt) 0%,var(--bk-blt) 40%,var(--paper) 72%);background-color:var(--paper);}
  .bk-stats div{padding:1rem .45rem 1rem;}
  .bk-stats span{font-size:.74rem;}
  .bk-vel-row{grid-template-columns:minmax(0,1fr) 2.2rem;row-gap:.35rem;}
  .bk-vel-l{grid-column:1 / -1;}
  .bk-vel-bar{height:1.3rem;gap:3px;}
}
@media print{
  .bk-slab-top{-webkit-print-color-adjust:exact;print-color-adjust:exact;}
  .bk-stats,.bk-vel{break-inside:avoid;}
}
/* lower half: the ordered risks counted in blue, the one broken word in red, the plate tipped in on blue paper */
.bk-ol li::before{color:var(--bk-bl);font-variant-numeric:lining-nums;font-weight:500;}
.bk-set-broken em{color:var(--bk-rd);}
.bk-plate-sheet{background:var(--bk-blt);border-color:rgba(0,3,204,.18);-webkit-print-color-adjust:exact;print-color-adjust:exact;}
.bk-orn-end{--bk-orn-fill:#0003cc;}

/* ---------- QA 2026-10-10 ---------- */
/* the blue tint read lavender on warm paper; a cooler, quieter blue tint for the wash, figure I, the 80% band and the plate sheet */
.bk{--bk-blt:#eaeff8;}
/* the frontispiece's bottom margin collapsed out of the opening sheet, so the cover sat flush on the sheet's edge with desk showing below it */
.bk-slab-top{display:flow-root;}
/* the 80% band: the notebook rules ran through the display quote; the band keeps its tint without them */
.bk-text p.bk-set-quote::before{background:var(--bk-blt);}
/* stat labels: wide enough that "life" and "roughly" do not drop to a line of their own */
.bk-stats span{max-width:16em;}

/* 2026-10-10 (Dave): the decision velocity poster returns with its baked-in prompt labels removed. It is tipped in at the end of chapter III on plain paper, so it doesn't read as a twin of the closing plate, and wide enough that its baked-in text stays readable. */
.bk-plate-vel{max-width:36em;margin-top:2.2em;}
.bk-plate-vel .bk-plate-sheet{background:var(--paper-2);border-color:var(--rule);}

/* 2026-10-10 (Dave): the regenerated napkin sketch is tipped in at the end of chapter VI as a loose photograph: a white print border and a slight turn, so it doesn't read as a third plate. */
.bk-photo{max-width:34em;margin:2.6em auto 0;}
.bk-photo img{display:block;width:100%;height:auto;background:#fff;padding:clamp(6px,1.2vw,12px);border:1px solid var(--rule);transform:rotate(-.8deg);}
.bk-photo figcaption{max-width:30em;margin:1.3em auto 0;text-align:center;font-style:italic;font-size:.86em;line-height:1.55;color:var(--muted);}
@media print{.bk-photo img{transform:none;}}