/* H1: scoped supplied prototype; site typography and accessible controls. */
body[data-page=herbier]{
  --room:#121712; --room-2:#1A201A; --linen:#ECE5D6; --muted:#A9A595; --rule:#2F372F; --champagne:#D9BF8E; --leaf:#6C7766;
  --display:"EB Garamond","Noto Serif SC",Georgia,serif; --body:Inter,"Noto Sans SC",Arial,sans-serif; --mark:"Tenor Sans","Optima",sans-serif;
  --w:clamp(140px, calc((100vw - 56px) / 2), 290px); --h:calc(var(--w) * 210 / 148);
  color-scheme:dark;
}
.herbier-main *{box-sizing:border-box}
body[data-page=herbier]{background:var(--room);color:var(--linen);font-family:var(--body);font-weight:300;line-height:1.65;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:0 56px}
.herbier-main a{color:var(--champagne)}
.herbier-main .wrap{max-width:1040px;margin:0 auto}
.herbier-main .hero{position:relative;padding-top:64px!important;display:flex;flex-direction:column;align-items:center;gap:18px;padding-block:44px 28px;text-align:center}
.herbier-main .hero{isolation:isolate}
body[data-page=herbier]{background:radial-gradient(120% 80% at 50% 28%,#1F2822 0%,#141A16 45%,#0D110E 100%) fixed,var(--room)}
body[data-page=herbier]::after{content:"";position:fixed;inset:0;background:url(/assets/notebook/herbier/grain.png) 0 0/256px 256px;opacity:.06;mix-blend-mode:overlay;pointer-events:none;z-index:50}
.herbier-main .hero::after{content:"";position:absolute;left:50%;top:calc(64px + 200px);width:min(900px,120%);height:420px;transform:translateX(-50%);z-index:-2;background:radial-gradient(ellipse 50% 40% at 50% 62%,rgba(255,236,200,.07),transparent 70%);pointer-events:none}
.herbier-main .sun{position:absolute;left:50%;top:268px;width:min(1180px,150%);height:700px;transform:translateX(-46%) perspective(1400px) rotateX(16deg);transform-origin:50% 0;pointer-events:none;-webkit-mask-image:url(/assets/notebook/herbier/gobo2a.png);mask-image:url(/assets/notebook/herbier/gobo2a.png);-webkit-mask-size:100% 100%;mask-size:100% 100%;animation:herbier-breeze 22s ease-in-out infinite alternate}
.herbier-main .sun.back{z-index:-1;background:linear-gradient(160deg,rgba(255,222,170,.20),rgba(255,200,140,.12));mix-blend-mode:screen}
.herbier-main .sun.front{z-index:4;background:linear-gradient(160deg,rgba(255,196,120,.30),rgba(255,176,96,.22));mix-blend-mode:soft-light}
.herbier-main .sun.dust{z-index:5;mix-blend-mode:screen}
.herbier-main .sun.dust canvas{width:100%;height:100%;display:block}
body[data-page=herbier].t-herb .sun,body[data-page=herbier].t-herb::after{display:none}
body[data-page=herbier].t-herb .hero{overflow:hidden}
.herbier-main .hero>.eyebrow,.herbier-main .hero>h1,.herbier-main .hero>.lede,.herbier-main .hero>.badge,.herbier-main .hero>.hint,.herbier-main .hero>.controls,.herbier-main .hero>.themes{position:relative;z-index:6}
.herbier-main .hero>.themes{position:absolute}
body[data-page=herbier].t-herb{--room:#E6DECB;--room-2:#EFE8D8;--linen:#24302A;--muted:#625F52;--rule:#CDC3AC;--champagne:#86662C;color-scheme:light}
body[data-page=herbier].t-herb{background:url(/assets/notebook/herbier/paper.webp) 0 0/600px 600px,var(--room)}
body[data-page=herbier].t-herb .hero::after{display:none}
body[data-page=herbier].t-herb .hero::before{display:none}
body[data-page=herbier].t-herb .ground{box-shadow:0 26px 44px -16px rgba(60,45,25,.45),0 4px 10px rgba(60,45,25,.22)}
body[data-page=herbier].t-herb .cta button{color:#F4EEE2}
body[data-page=herbier].t-herb .cta input{color:var(--linen)}
.herbier-main .spec{position:absolute;pointer-events:none;z-index:-1;display:none;filter:drop-shadow(2px 4px 3px rgba(60,40,15,.28))}
body[data-page=herbier].t-herb .spec{display:block}
.herbier-main .spec.s1{width:clamp(120px,19vw,250px);left:-3%;top:28%}
.herbier-main .spec.s2{width:clamp(110px,17vw,230px);right:-1%;top:14%}
.herbier-main .spec.s3{width:clamp(110px,16vw,210px);right:6%;bottom:4%}
.herbier-main .tape{position:absolute;width:56px;height:18px;background:rgba(242,236,220,.78);box-shadow:0 1px 2px rgba(60,40,15,.15);display:none;z-index:-1}
body[data-page=herbier].t-herb .tape{display:block}
.herbier-main .tape.a{left:calc(-3% + clamp(120px,19vw,250px) * .30);top:calc(28% + clamp(120px,19vw,250px) * 1.62);transform:rotate(-8deg)}
.herbier-main .tape.c{right:calc(6% + clamp(110px,16vw,210px) * .62);bottom:calc(4% + clamp(110px,16vw,210px) * .12);transform:rotate(14deg)}
.herbier-main .tape.b{right:calc(-1% + clamp(110px,17vw,230px) * .52);top:calc(14% + clamp(110px,17vw,230px) * .04);transform:rotate(-24deg)}
.herbier-main .label-tag{position:absolute;left:2%;bottom:6%;display:none;z-index:0;text-align:left;font-family:"Courier Prime","Courier New",monospace;font-size:11.5px;line-height:1.55;color:#3A3A30;background:#F2ECDD;border:1px solid #B9AE93;padding:10px 14px 9px;box-shadow:0 3px 8px rgba(60,40,15,.15);transform:rotate(-1.2deg);letter-spacing:.02em}
.herbier-main .label-tag b{display:block;font-weight:400;letter-spacing:.16em;border-bottom:1px solid #B9AE93;margin-bottom:5px;padding-bottom:3px}
body[data-page=herbier].t-herb .label-tag{display:block}
@media (max-width:640px){.herbier-main .label-tag{display:none!important}
.herbier-main .spec.s3,.herbier-main .tape{display:none!important}
.herbier-main .spec.s1{width:92px;left:-9%;top:44%}
.herbier-main .spec.s2{width:84px;right:-8%;top:40%}}
.herbier-main .themes{position:absolute;top:12px;right:0;display:flex;gap:4px;padding:3px;border:1px solid var(--rule);border-radius:999px;z-index:2}
.herbier-main .themes button{font:inherit;font-size:12px;min-height:32px;padding:0 12px;border:0;border-radius:999px;background:transparent;color:var(--muted);cursor:pointer}
.herbier-main .themes button[aria-pressed="true"]{background:var(--linen);color:var(--room)}
.herbier-main .themes button:focus-visible{outline:1px solid var(--champagne);outline-offset:2px}
@keyframes herbier-breeze{0%{-webkit-mask-position:0 0;mask-position:0 0}50%{-webkit-mask-position:6px 3px;mask-position:6px 3px}100%{-webkit-mask-position:-4px 6px;mask-position:-4px 6px}}
@media (prefers-reduced-motion:reduce){.herbier-main .sun{animation:none}}
.herbier-main .eyebrow{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--champagne);font-weight:400}
.herbier-main h1{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(56px,10vw,104px);line-height:.95;letter-spacing:.01em}
.herbier-main .lede{margin:0;max-width:34ch;color:var(--muted);font-size:15px;text-wrap:balance}
.herbier-main .badge{display:inline-flex;gap:10px;align-items:center;font-size:12px;letter-spacing:.12em;color:var(--linen);border:1px solid var(--rule);padding:7px 14px;border-radius:999px}
.herbier-main .badge i{width:6px;height:6px;border-radius:50%;background:var(--champagne)}
.herbier-main .controls{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.herbier-main .controls button{font:inherit;font-size:13px;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--rule);background:transparent;color:var(--linen);cursor:pointer;letter-spacing:.04em}
.herbier-main .controls button[aria-pressed="true"]{border-color:var(--champagne);color:var(--champagne)}
.herbier-main .controls button:focus-visible,.herbier-main .cta button:focus-visible,.herbier-main .cta input:focus-visible{outline:1px solid var(--champagne);outline-offset:2px}
.herbier-main .stage img,.herbier-main .stage svg{pointer-events:none;-webkit-user-drag:none;user-select:none}
.herbier-main .hint{font-size:12px;color:var(--muted);letter-spacing:.06em;min-height:1.4em;margin:0}
.herbier-main section{padding-block:56px 8px;border-top:1px solid var(--rule)}
.herbier-main .sec-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:26px}
.herbier-main h2{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(32px,4.5vw,46px);line-height:1.05}
.herbier-main .sec-head p{margin:0;max-width:44ch;color:var(--muted);font-size:14px}
.herbier-main .crafts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.herbier-main .craft figure{margin:0;display:flex;flex-direction:column;gap:12px}
.herbier-main .craft img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:4px;display:block}
.herbier-main .craft h3{margin:0;font-family:var(--display);font-weight:500;font-size:22px;color:var(--linen)}
.herbier-main .craft p{margin:0;font-size:13.5px;color:var(--muted)}
.herbier-main .craft .n{font-family:var(--mark);font-size:11px;letter-spacing:.18em;color:var(--champagne)}
.herbier-main .pages{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px}
.herbier-main .pages figure{margin:0;display:flex;flex-direction:column;gap:8px}
.herbier-main .pages img{width:100%;aspect-ratio:148/210;object-fit:cover;border-radius:2px;display:block;box-shadow:0 8px 18px rgba(0,0,0,.35)}
.herbier-main .pages figcaption{font-size:12px;color:var(--muted)}
.herbier-main .pages figcaption b{display:block;color:var(--linen);font-weight:400;font-size:12.5px}
.herbier-main .specs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 48px}
.herbier-main .specs dl{margin:0;display:grid;grid-template-columns:120px minmax(0,1fr)}
.herbier-main .specs dt,.herbier-main .specs dd{margin:0;padding:12px 0;border-bottom:1px solid var(--rule);font-size:14px}
.herbier-main .specs dt{color:var(--muted)}
.herbier-main .tbd{color:var(--muted);font-style:italic}
.herbier-main .edition{display:flex;flex-direction:column;gap:14px;justify-content:center}
.herbier-main .edition .num{font-family:var(--display);font-style:italic;font-size:clamp(44px,6vw,64px);color:var(--champagne);line-height:1}
.herbier-main .edition p{margin:0;color:var(--muted);font-size:14px;max-width:40ch}
.herbier-main .cta{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.herbier-main .cta form{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;width:100%;max-width:520px}
.herbier-main .cta input{flex:1 1 240px;min-height:46px;padding:0 16px;font:inherit;font-size:16px;color:var(--linen);background:var(--room-2);border:1px solid var(--rule);border-radius:999px}
.herbier-main .cta input::placeholder{color:#7D7B70}
.herbier-main .cta button{min-height:46px;padding:0 22px;font:inherit;font-size:14px;letter-spacing:.06em;border-radius:999px;border:1px solid var(--champagne);background:var(--champagne);color:#1A1A14;cursor:pointer}
.herbier-main .cta .ok{font-size:13px;color:var(--champagne);min-height:1.4em;margin:0}
.herbier-main .foot{margin-top:40px;font-size:12px;color:#7D7B70;text-align:center}
@media (max-width:860px){.herbier-main .crafts{grid-template-columns:repeat(2,minmax(0,1fr))}
.herbier-main .pages{grid-template-columns:repeat(4,minmax(0,1fr))}
.herbier-main .specs{grid-template-columns:minmax(0,1fr);gap:28px}}
@media (max-width:480px){.herbier-main .pages{grid-template-columns:repeat(3,minmax(0,1fr))}
.herbier-main .specs dl{grid-template-columns:96px minmax(0,1fr)}}

@font-face{font-family:HerbierHand;src:url('/assets/notebook/herbier/hand-number.woff2') format('woff2');font-display:swap}
body[data-page=herbier]{margin:0;padding:0;min-width:0}
body[data-page=herbier].t-herb{--champagne:#795A25}
.herbier-main{padding:0 max(16px,env(safe-area-inset-left)) 56px;min-width:0;overflow:clip}
.herbier-main .hero{height:auto;min-height:0;max-height:none;max-width:100%;margin:0;background:none}
.herbier-main h1{font-size:clamp(46px,8vw,64px);font-family:'EB Garamond',serif;letter-spacing:.01em;line-height:1.05;color:var(--linen)}
.herbier-main h2{font-family:'EB Garamond','Noto Serif SC',serif;color:var(--linen);letter-spacing:0}
html:lang(zh) .herbier-main :is(h2,h3){font-family:SiteHan,'Noto Serif SC',serif;line-height:1.45}
.herbier-main .stage{display:block;border:0;padding:0;background:none;font:inherit;color:inherit;-webkit-tap-highlight-color:transparent;min-height:44px}
.herbier-main .stage:focus-visible{outline:2px solid var(--champagne);outline-offset:3px}
.herbier-main .wordmark{left:22%;right:auto;width:56%;height:6.5%;font-size:0;mask:url('/brand/wordmark.svg') center/contain no-repeat;-webkit-mask:url('/brand/wordmark.svg') center/contain no-repeat;background-clip:border-box;-webkit-background-clip:border-box;filter:drop-shadow(0 .6px 0 rgba(0,0,0,.45))}
.herbier-main .themes{border-radius:2px;max-width:100%;flex-wrap:wrap;background:var(--room-2)}
.herbier-main .themes button,.herbier-main .motion-toggle{min-width:44px;min-height:44px;line-height:1.4;white-space:normal;border-radius:2px;touch-action:manipulation}
.herbier-main .motion-toggle{position:relative;z-index:6;border:0;border-bottom:1px solid currentColor;background:none;font:inherit;font-size:12px;color:var(--muted);cursor:pointer}
.herbier-main .motion-toggle[hidden]{display:none}
.herbier-main .controls button{border-radius:2px;max-width:100%;padding:8px 14px;line-height:1.5;touch-action:manipulation;background:var(--room-2)}
.herbier-main .controls{gap:8px}
.herbier-main .badge{border-radius:2px;max-width:100%;line-height:1.6}
.herbier-carnet-crosslink{margin:56px 0 0;text-align:center;font-size:14px}.herbier-carnet-crosslink a{display:inline-flex;align-items:center;min-height:44px;color:var(--linen);text-decoration:underline;text-underline-offset:5px}.herbier-main #waitlist{scroll-margin-top:120px}
.herbier-main .mockup-note{margin:0;font-size:12px;color:var(--muted)}
.herbier-main .hint{max-width:65ch;min-height:1.6em;text-wrap:pretty}
.herbier-main .lede{max-width:48ch;line-height:1.75}
.herbier-main .cta input{width:auto;min-width:0;max-width:100%;margin:0;border-radius:2px;display:block}
.herbier-main .cta button{border-radius:2px;min-width:44px;max-width:100%}
.herbier-main .cta button:disabled{opacity:.65;cursor:wait}
.herbier-main .cta input::placeholder{color:var(--muted)}
.herbier-main .foot{color:var(--muted)}
.herbier-main .hero>.themes{z-index:7}
.herbier-main .pages figure,.herbier-main .craft{min-width:0}
.herbier-main .specs dd{overflow-wrap:break-word}
.herbier-main :is(button,input,a):focus-visible{outline:2px solid var(--champagne);outline-offset:3px}
.herbier-main .cta input[aria-invalid=true]{border-color:var(--champagne);outline:1px solid var(--champagne)}
body[data-page=herbier].light-paused .sun{animation-play-state:paused}
body[data-page=herbier] .site-header,body[data-page=herbier] .footer{color:var(--ink);background:var(--paper-warm)}
body[data-page=herbier].t-herb .label-tag{color:#3a3a30}
@media(hover:hover) and (pointer:fine){.herbier-main button:hover{border-color:var(--champagne)}.herbier-main .themes button:hover{color:var(--linen)}.herbier-main .themes button[aria-pressed=true]:hover{color:var(--room)}}
@media(max-width:640px){.herbier-main .hero{padding-top:76px!important}.herbier-main .themes{left:50%;right:auto;transform:translateX(-50%);width:max-content;max-width:100%}.herbier-main .sun{width:calc(100% + 32px);left:-16px;transform:perspective(1400px) rotateX(16deg)}.herbier-main .spec.s1{left:-9%;}.herbier-main .spec.s2{right:-8%}.herbier-main .cta form{flex-direction:column}.herbier-main .cta input{flex:auto;width:100%}.herbier-main .controls button{font-size:12px;padding:8px 10px}.herbier-main .crafts{gap:16px 12px}.herbier-main .craft h3{font-size:20px}}
@media(prefers-reduced-motion:reduce){.herbier-main .sun{animation:none}.herbier-main .sun.dust{display:none}.herbier-main .motion-toggle{display:none}}
