.hww-page{--sx-shot:0 1px 2px rgba(11,13,18,.06),0 18px 40px -24px rgba(11,13,18,.28);--hww-paper:#f5f4f0;--hww-ink:#0b0d12}
.hww-page :is(a,button,summary):focus-visible{outline:2px solid #ffd100;outline-offset:4px}.hww-page::selection{background:#ddd}
.hww-hero{padding:24px 0 64px}.hww-hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:64px;align-items:center;margin-top:40px}
.hww-section{padding:64px 0;border-top:1px solid var(--pf-line)}.hww-paper{background:var(--hww-paper);color:var(--hww-ink);border-color:rgba(11,13,18,.1)}.hww-paper .pf-h2{color:inherit}
.hww-page main p{font-size:18px;line-height:1.6}.hww-intro{margin-top:20px;max-width:66ch;color:var(--pf-t2)}.hww-paper .hww-intro{color:rgba(11,13,18,.7)}
.hww-two,.hww-three{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:32px}.hww-three{grid-template-columns:repeat(3,minmax(0,1fr))}.hww-page h3{font-size:20px;line-height:1.3}.hww-card{border:1px solid var(--pf-line);border-radius:14px;padding:28px}.hww-paper .hww-card{background:#fff;border-color:rgba(11,13,18,.1)}.hww-card p,.hww-contrast p{margin-top:16px;color:var(--pf-t2)}.hww-paper :is(.hww-card,.hww-contrast) p{color:rgba(11,13,18,.7)}.hww-card>svg{width:64px;height:64px;margin-bottom:20px}.hww-contrast article{padding:24px 0}.hww-contrast svg{height:80px;width:160px;margin-bottom:20px}.hww-muted{color:#62656b}.hww-page main .hww-turn{font-size:28px;line-height:1.35;letter-spacing:-.02em;margin-top:32px;max-width:960px}
.hww-ink{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.hww-ink *{vector-effect:non-scaling-stroke}
.hww-cover{position:relative;width:100%;max-width:360px;perspective:800px;color:#fff}.hww-cover>svg{width:100%}.hww-cover-lid{position:absolute;inset:0;transform-origin:16% 50%;animation:hww-cover-open 900ms ease 300ms both}.hww-cover-lid svg{width:100%;height:100%;fill:var(--pf-ink)}.hww-cover-lid span{position:absolute;top:40%;left:29%;font:32px Caveat,cursive;rotate:-4deg}@keyframes hww-cover-open{from{transform:rotateY(0)}to{transform:rotateY(-8deg)}}
.hww-notebook{margin-top:32px;position:relative}.hww-tabs:not([hidden]){display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.hww-tabs button{padding:10px 14px;border:1px solid rgba(11,13,18,.2);border-radius:6px;font-size:14px}.hww-tabs button[aria-pressed=true]{background:var(--hww-ink);color:white}
.hww-spread{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);background:#fffdf8;border:1px solid rgba(11,13,18,.16);border-radius:14px;box-shadow:var(--sx-shot);margin-bottom:24px;perspective:1400px;overflow:hidden}.hww-spread[hidden]{display:none}.hww-note-card,.hww-print{min-width:0;padding:48px 40px;min-height:390px}.hww-note-card{border-right:1px solid rgba(11,13,18,.18)}.hww-note-card,.hww-print{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='32'%3E%3Cpath d='M0 31.5H20' stroke='%230b0d12' stroke-opacity='.055'/%3E%3C/svg%3E")}.hww-sketch{position:relative;max-width:380px;margin:auto;min-height:280px;color:var(--hww-ink)}.hww-sketch>svg{width:100%;height:260px}.hww-page main .hww-hand{font:500 30px/1.15 Caveat,cursive;color:var(--hww-ink)}.hww-quotes .hww-hand{margin:20px 0;rotate:-2deg}.hww-quotes svg{position:absolute;inset:0;pointer-events:none}.hww-complaint{position:absolute;top:26px;left:20px}.hww-cause{position:absolute;top:140px;left:35px;max-width:260px;text-align:center}.hww-margin{position:absolute;top:0;right:0;rotate:7deg}.hww-checklist{position:absolute;left:65px;top:40px;display:grid;gap:64px}.hww-box-labels{position:absolute;inset:0;font:30px Caveat,cursive}.hww-box-labels span{position:absolute}.hww-box-labels span:nth-child(1){left:14%;top:12%}.hww-box-labels span:nth-child(2){left:35%;top:45%}.hww-box-labels span:nth-child(3){left:19%;top:78%}
.hww-page main .hww-label{font:12px/1.5 var(--pf-mono);margin-bottom:24px;color:rgba(11,13,18,.55)}.hww-print h3{font-size:28px;line-height:1.25;letter-spacing:-.02em;margin-bottom:20px}.hww-print>p:last-child{color:rgba(11,13,18,.7)}.hww-corners:not([hidden]){display:flex;justify-content:space-between;align-items:center;margin-top:-64px;position:relative;padding:0 20px 12px;pointer-events:none}.hww-corners button{pointer-events:auto;border:1px solid rgba(11,13,18,.16);background:#fffdf8;width:36px;height:36px;border-radius:6px;font-size:24px}.hww-corners button:disabled{opacity:.3;cursor:default}.hww-status{font:11px var(--pf-mono);color:rgba(11,13,18,.5)}
.hww-real{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0;transition:opacity 600ms;background:#fffdf8}.hww-window{border:1px solid rgba(11,13,18,.16);border-radius:8px;overflow:hidden;box-shadow:var(--sx-shot)}.hww-window-bar{padding:8px 12px;font:11px var(--pf-mono);border-bottom:1px solid rgba(11,13,18,.1)}.hww-window img{width:100%;height:auto}.hww-real figcaption{font-size:13px;line-height:1.5;margin-top:12px}.hww-show-real .hww-real{opacity:1}
.hww-turning .hww-print{transform-origin:left center;animation:hww-page-turn 500ms ease both}.hww-enter .hww-print> *{animation:hww-fade 500ms ease both}.hww-enter .hww-ink [pathLength]{stroke-dasharray:1;animation:hww-draw 1000ms ease both}.hww-enter .hww-word{display:inline-block;animation:hww-fade 350ms ease both;animation-delay:var(--hww-delay)}@keyframes hww-page-turn{0%{transform:rotateY(0);opacity:1}50%{transform:rotateY(-80deg);opacity:.2}100%{transform:rotateY(0);opacity:1}}@keyframes hww-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}@keyframes hww-fade{from{opacity:0}to{opacity:1}}
.hww-partner-link{margin-top:20px;font-size:14px!important}.hww-partner-link a{text-decoration:underline;text-underline-offset:4px}.hww-paths{position:relative;width:320px;max-width:100%;margin-top:32px;color:white}.hww-paths span{position:absolute;font:13px var(--pf-mono)}.hww-paths span:nth-of-type(1){top:0;left:10px}.hww-paths span:nth-of-type(2){top:76%;left:10px}.hww-paths span:nth-of-type(3){top:28%;right:0}.hww-paths.hww-enter path{stroke-dasharray:1;animation:hww-draw 1200ms ease both}
@media(max-width:1023px){.hww-hero-grid{gap:32px}.hww-note-card,.hww-print{padding:40px 24px}.hww-page main .hww-hand{font-size:27px}}
@media(max-width:767px){.hww-page{--pf-gut:20px}.hww-hero-grid,.hww-two,.hww-three,.hww-spread{grid-template-columns:minmax(0,1fr)}.hww-hero-grid{gap:24px}.hww-cover{width:240px}.hww-section{padding:48px 0}.hww-tabs,.hww-corners{display:none!important}.hww-note-card{border-right:0;border-bottom:1px solid rgba(11,13,18,.12);min-height:320px;padding:28px}.hww-print{min-height:0;padding:28px}.hww-sketch{max-width:320px}.hww-spread{margin-bottom:24px}.hww-hero .pf-btn{max-width:100%}.hww-card{padding:24px}.hww-print h3{font-size:28px}.hww-complaint{font-size:25px!important;left:12px}.hww-cause{left:20px;top:130px;max-width:230px}}
.hww-page:not(.hww-enhanced) .hww-real{position:relative;opacity:1;margin-top:24px}
.hww-page:not(.hww-enhanced) .hww-spread{grid-template-columns:minmax(0,1fr)}.hww-page:not(.hww-enhanced) .hww-note-card{border-right:0;border-bottom:1px solid rgba(11,13,18,.12)}
@media(prefers-reduced-motion:reduce){html.pf-html:has(.hww-page){scroll-behavior:auto}.hww-page *{animation:none!important;transition:none!important;scroll-behavior:auto!important}.hww-real{position:relative;opacity:1;margin-top:24px}.hww-cover-lid{transform:none}}

/* architect pass: notebook details */
.hww-page .hww-complaint:not(#h){text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:var(--hww-ink)}
.hww-page .hww-cause:not(#h){left:50%;max-width:none;white-space:nowrap;translate:-50% 0;font-size:26px}
@media(max-width:767px){.hww-page .hww-cause:not(#h){font-size:23px}}
.hww-page .hww-checklist:not(#h){top:18px;gap:46px;left:62px}
.hww-page .hww-sketch>svg,.hww-page .hww-margin{transition:opacity 400ms}
@media(min-width:768px){.hww-page .hww-show-real .hww-sketch>svg:not(#h),.hww-page .hww-show-real .hww-margin:not(#h){opacity:0}}