/* v170 — supplemental topic guides only. All existing website styles stay unchanged. */
.bb-guide .bb-hero{grid-template-columns:minmax(0,1fr) minmax(220px,300px)}
.bb-guide .bb-around-hero h1{font-size:clamp(2.5rem,5.1vw,4.8rem)}
.bb-guide .bb-hero-illustration{max-width:295px;border-radius:16px}
.bb-guide .bb-around-jump{grid-template-columns:repeat(4,minmax(0,1fr))}
.bb-guide p,.bb-guide li{overflow-wrap:break-word}
.bb-guide a{overflow-wrap:anywhere}
.bb-guide .bb-lesson a,.bb-guide .bb-welcome a,.bb-guide .bb-finish a{color:#762b6d;font-weight:bold}
.bb-guide .bb-hero a{color:#ffe3b5}
.bb-guide .bb-lesson > p,.bb-guide .bb-lesson > ul{font-size:1.06rem;line-height:1.7}
.bb-guide .bb-lesson h3{font:700 1.48rem Georgia,serif;color:#6b2963;margin:15px 0 11px}
.bb-guide .bb-lesson h4{font:700 1.1rem Georgia,serif;color:#6b2963;margin:8px 0}
.bb-guide .bb-lesson ul{padding-left:25px}
.bb-guide .bb-steps{margin:18px 0 23px}
.bb-guide .bb-steps li{line-height:1.7}
.bb-guide .guide-panel{background:#fff9e9;border:2px solid #dbb47c;border-radius:16px;padding:20px;margin:22px 0}
.bb-guide .guide-panel h3{margin:0 0 10px}
.bb-guide .guide-note{background:#f7e9d2;border-left:5px solid #8b4f94;border-radius:0 12px 12px 0;padding:16px 21px;margin:20px 0;line-height:1.65;color:#5b4056}
.bb-guide .guide-danger{background:#fff0df;border-left-color:#b76947}
.bb-guide .guide-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:24px 0}
.bb-guide .guide-gallery.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.bb-guide .guide-file{background:#fff8e7;border:2px solid #d4ab70;border-radius:17px;overflow:hidden;box-shadow:0 7px 18px #280b3326}
.bb-guide .guide-file .preview{display:block;width:100%;aspect-ratio:1;object-fit:cover;background:#dac9da}
.bb-guide .guide-file .guide-file-body{padding:15px 17px 19px}
.bb-guide .guide-file h3{font:700 1.3rem Georgia,serif;color:#6a2b63;margin:0 0 8px}
.bb-guide .guide-file p{margin:0 0 15px;font:1rem/1.55 Georgia,serif}
.bb-guide .guide-file a,.bb-guide .guide-pill{display:inline-flex;align-items:center;text-decoration:none;border-radius:25px;padding:10px 17px;background:linear-gradient(150deg,#fff7e2,#edcd94);color:#58245b!important;font:700 1rem Georgia,serif;border:2px solid #c79550;box-shadow:0 4px 12px #532c5f20}
.bb-guide .guide-file a:hover,.bb-guide .guide-pill:hover{background:#ffe2b1;transform:translateY(-1px)}
.bb-guide .guide-linkgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px;margin:24px 0}
.bb-guide .guide-linkgrid>a{display:block;text-decoration:none;border:2px solid #d0a46e;border-radius:16px;background:linear-gradient(145deg,#fff7e6,#f0ddbc);padding:18px;color:#5a285c!important}
.bb-guide .guide-linkgrid>a:hover{border-color:#933f89;box-shadow:0 5px 17px #65315c3b}
.bb-guide .guide-linkgrid strong{display:block;font:700 1.36rem Georgia,serif;margin:5px 0 7px}
.bb-guide .guide-linkgrid span{display:block;line-height:1.46;font-size:.97rem;color:#654561}
.bb-guide .guide-callout{display:flex;gap:18px;align-items:center;margin:19px 0;padding:20px;background:#fffaef;border:2px solid #d6ad78;border-radius:15px}
.bb-guide .guide-callout .symbol{font-size:2.4rem;line-height:1}
.bb-guide .guide-callout p{margin:5px 0 0;line-height:1.55}
.bb-guide .guide-compare{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin:22px 0}
.bb-guide .guide-compare div{padding:17px;text-align:center;border-radius:15px;border:2px solid #d2ab71;background:#fff8e7}
.bb-guide .guide-compare h3{font:700 1.23rem Georgia,serif;margin:0 0 9px}
.bb-guide .guide-compare p{font-size:1rem;line-height:1.48;margin:0}
.bb-guide .guide-alpha-demo{position:relative;background:repeating-conic-gradient(#e1d1de 0% 25%,#f8edf4 0% 50%) 50% / 32px 32px;overflow:hidden;border:2px solid #d5ac76;border-radius:15px}
.bb-guide .guide-alpha-demo>img{display:block;width:100%;height:auto}
.bb-guide .guide-node-figure{margin:20px 0;background:#2c1b36;border:3px ridge #d2ab72;border-radius:16px;padding:17px;color:#ffe9bd}
.bb-guide .guide-node-figure svg{display:block;width:100%;height:auto;max-width:840px;margin:auto}
.bb-guide .guide-node-figure figcaption{text-align:center;font:italic .98rem/1.55 Georgia,serif;margin-top:12px}
.bb-guide .guide-faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;margin-top:20px}
.bb-guide .guide-faq article{padding:18px;background:#fff9ec;border:2px solid #d7b079;border-radius:15px}
.bb-guide .guide-faq h3{font:700 1.18rem Georgia,serif;margin:0 0 10px}
.bb-guide .guide-faq p{margin:0;line-height:1.55}
.bb-guide .guide-checklist{display:grid;gap:10px;padding:0;list-style:none}
.bb-guide .guide-checklist li{padding:12px 16px;background:#fff8e7;border-radius:10px;border:1px solid #e1c79d}
.bb-guide .guide-checklist li:before{content:'✧ ';color:#763b76}
@media(max-width:900px){.bb-guide .bb-around-jump{grid-template-columns:repeat(2,minmax(0,1fr))}.bb-guide .guide-linkgrid{grid-template-columns:1fr}.bb-guide .guide-gallery.three{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.bb-guide .guide-gallery,.bb-guide .guide-gallery.three,.bb-guide .guide-faq,.bb-guide .guide-compare{grid-template-columns:1fr}.bb-guide .bb-hero{grid-template-columns:1fr}.bb-guide .guide-file{max-width:480px;margin:auto;width:100%}}
@media(max-width:400px){.bb-guide .bb-around-jump{grid-template-columns:1fr}.bb-guide .guide-node-figure{padding:7px}.bb-guide .guide-callout{align-items:flex-start}}