/* Hive Workshops craft signature "baeckerei" — counter illustration + order builder + flip cards + word-building cards. Everything visible without JS; html.cf-js gates the start states. */
.bk{max-width:560px;margin:0 auto}
.bk [hidden]{display:none!important}
.bk-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bk-stage{position:relative;aspect-ratio:7/5;border-radius:18px;overflow:hidden;background:var(--sig-bg)}
.bk-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.bk-bub{position:absolute;max-width:58%;padding:10px 14px;background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:0 6px 16px rgba(34,55,47,.12)}
.bk-bub::after{content:"";position:absolute;bottom:-6px;width:10px;height:10px;background:var(--paper);border:solid var(--line);transform:rotate(45deg)}
.bk-you{left:4%;top:6%;max-width:68%}.bk-you::after{left:18px;border-width:0 1px 1px 0}
.bk-them{right:3%;top:52%;max-width:41%}.bk-them::after{right:18px;border-width:0 1px 1px 0}
.bk-line{margin:0;font:600 clamp(18px,2.6vw,24px)/1.15 var(--f-hand);color:var(--ink)}
.bk-bub small{display:block;margin-top:4px;font:600 12.5px/1.3 var(--f-body);color:var(--mute)}
.bk-gloss{margin:10px 0 0;text-align:center;font-size:15px;color:var(--mute)}
.bk-q{margin:14px 0 8px;font:800 12px/1.3 var(--f-disp);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink)}
.bk-row{display:flex;flex-wrap:wrap;gap:8px}
.bk-tile{display:inline-flex;flex-direction:column;align-items:flex-start;gap:1px;min-height:46px;padding:7px 14px;border:1.5px solid #DCCFB8;border-radius:12px;background:var(--paper);color:var(--ink);font:600 17px/1.1 var(--f-hand);cursor:pointer;transition:transform .15s ease,background-color .2s,border-color .2s}
.bk-tile small{font:600 11.5px/1.2 var(--f-body);color:var(--mute)}
.bk-none{justify-content:center;font:600 14px/1.1 var(--f-body)}
.bk-tile[aria-pressed=true]{background:var(--accent-ink);border-color:var(--accent-ink);color:#fff}
.bk-tile[aria-pressed=true] small{color:#F6DCDE}
.bk-tile:focus-visible,.bk-card:focus-visible,.bk-again:focus-visible,.bk-hear:focus-visible{outline:3px solid var(--accent-ink);outline-offset:2px}
.bk-please{margin:14px 0 0;font-size:14.5px;color:var(--mute)}
.bk-please b{font:600 20px/1 var(--f-hand);color:var(--accent-ink);margin-right:8px}
.bk-act{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.bk-again,.bk-hear{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:6px 16px;border:1.5px dashed #DCCFB8;border-radius:999px;background:var(--paper);color:var(--ink);font:600 15px/1 var(--f-body);cursor:pointer}
.bk-ritual{margin:8px 0 0;font:600 14px/1.4 var(--f-body);color:var(--accent-ink)}
.bk-hear-note,.bk-cap{margin:10px 0 0;font-size:13.5px;color:var(--mute)}
.bk-cards-w,.bk-words-w{margin-top:26px}
.bk-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.bk-words{grid-template-columns:repeat(2,minmax(0,1fr))}
.bk-card{position:relative;min-height:124px;padding:0;border:0;background:none;cursor:pointer;perspective:900px;-webkit-perspective:900px;text-align:left}
.bk-card-in{position:absolute;inset:0;transform-style:preserve-3d;-webkit-transform-style:preserve-3d;transition:transform .6s cubic-bezier(.4,.1,.2,1)}
.bk-card[aria-pressed=true] .bk-card-in{transform:rotateY(180deg)}
.bk-card-f,.bk-card-b{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:14px;border-radius:12px;border:1px solid var(--line);background:var(--paper);box-shadow:0 6px 16px rgba(34,55,47,.1);backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:rotateY(0deg) translateZ(1px);-webkit-transform:rotateY(0deg) translateZ(1px)}
.bk-card-f b{font:600 clamp(20px,2.4vw,24px)/1.1 var(--f-hand);color:var(--accent-ink)}
.bk-card-f small{font:600 11px/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.bk-card-b{transform:rotateY(180deg) translateZ(1px);-webkit-transform:rotateY(180deg) translateZ(1px);background:var(--pop3)}
.bk-card-f,.bk-card-b{transition:opacity 0s .3s}.bk-card-b{opacity:0}.bk-card[aria-pressed=true] .bk-card-b{opacity:1}.bk-card[aria-pressed=true] .bk-card-f{opacity:0}
.bk-word .bk-card-f b{font-size:clamp(18px,2.2vw,22px)}
.bk-card-b b{font:800 15px/1.2 var(--f-body);color:var(--ink)}
.bk-card-b small{font:500 12.5px/1.3 var(--f-body);color:var(--ink)}
/* motion: JS-armed only */
.cf-js .bk-plate{transform:translateX(150px);opacity:0;will-change:transform}
.cf-js .bk-go .bk-plate{transform:none;opacity:1;will-change:auto;transition:transform .7s cubic-bezier(.34,1.56,.64,1) .55s,opacity .3s ease .55s}
.cf-js .bk-them{opacity:0;transform:translateY(10px) scale(.92)}
.cf-js .bk-go .bk-them{opacity:1;transform:none;transition:opacity .4s ease .95s,transform .45s cubic-bezier(.34,1.56,.64,1) .95s}
.cf-js .bk-w{display:inline-block;opacity:0;transform:translateY(6px)}
.cf-js .bk-go .bk-w{opacity:1;transform:none;transition:opacity .3s ease calc(var(--i)*90ms),transform .35s ease calc(var(--i)*90ms)}
.bk-st{transform-box:fill-box}
.cf-js .bk-st{opacity:0}
.bk-live.bk-go .bk-st{animation:bk-steam 2.8s ease-in-out infinite}
.bk-live.bk-go .bk-st2{animation-delay:-.9s}.bk-live.bk-go .bk-st3{animation-delay:-1.8s}
@keyframes bk-steam{0%{opacity:0;transform:translateY(6px)}30%{opacity:.8}100%{opacity:0;transform:translateY(-18px)}}
.bk-spark{opacity:0;transform-box:fill-box;transform-origin:50% 50%}
.bk-thanked .bk-spark{animation:bk-pop .7s cubic-bezier(.34,1.56,.64,1) both}
@keyframes bk-pop{0%{opacity:0;transform:scale(.3)}40%{opacity:1;transform:scale(1.15)}100%{opacity:0;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.cf-js .bk-plate,.cf-js .bk-them,.cf-js .bk-w{transform:none!important;opacity:1!important;transition:none!important}.bk-st,.bk-spark{animation:none!important}.bk-card-in,.bk-card-f,.bk-card-b{transition:none!important}}
@media (max-width:420px){.bk-bub{padding:7px 10px}.bk-them{max-width:43%}.bk-line{font-size:16px}.bk-bub small{font-size:11.5px}}
html:lang(ja) .bk-q{text-transform:none;letter-spacing:.04em}
html:lang(ja) .bk-card-b b,html:lang(ja) .bk-card-b small,html:lang(ja) .bk-bub small{font-family:inherit}
html:lang(ja) .bk-tile small,html:lang(ja) .bk-card-f small{font-family:inherit}