*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"DM Sans",system-ui,sans-serif;background:#F3EEFF;color:#111;-webkit-font-smoothing:antialiased;line-height:1.5}
a{color:#111}h1,h2,h3{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-weight:800;letter-spacing:-.025em;line-height:1.05}
.wrap{max-width:920px;margin:0 auto;padding:0 18px}
.top{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 18px;border-bottom:2px solid #111;background:#F3EEFF;position:sticky;top:0;z-index:5}
.logo{display:flex;align-items:center;gap:9px;text-decoration:none;font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:20px}.logo svg{width:34px;height:34px}
.top nav{display:flex;gap:10px;align-items:center;font-weight:700;font-size:14px}
.btn-y{background:#FFD23F;border:2px solid #111;border-radius:10px;padding:6px 12px;text-decoration:none;box-shadow:2px 2px 0 #111}
.crumbs{font-size:13px;margin:16px 0 12px;color:#333}.crumbs a{font-weight:600}
.hero{display:flex;gap:16px;align-items:center;justify-content:space-between;border:2px solid #111;border-radius:22px;box-shadow:4px 4px 0 #111;padding:20px;background:color-mix(in srgb,var(--c) 45%,#fff)}
.hero h1{font-size:clamp(36px,9vw,60px);margin:10px 0 8px}.about{font-size:16px;font-weight:500;max-width:520px}
.hero-glass svg{width:110px;height:132px}
.tags{display:flex;gap:6px;flex-wrap:wrap}.tags span{border:2px solid #111;border-radius:8px;padding:1px 8px;font-size:12px;font-weight:800;background:#fff;text-transform:uppercase;letter-spacing:.04em}
.tags .y{background:#FFD23F}.tags .p{background:#FF6FB5}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:#111;border:2px solid #111;border-radius:14px;overflow:hidden;margin:16px 0;box-shadow:3px 3px 0 #111}
.facts div{background:#fff;padding:9px 6px;text-align:center}.facts small{display:block;font-size:11.5px;font-weight:600;color:#333}.facts b{font-size:15px}
.cols{display:grid;grid-template-columns:1fr;gap:14px}@media(min-width:760px){.cols{grid-template-columns:3fr 2fr}}
.box{background:#fff;border:2px solid #111;border-radius:18px;box-shadow:3px 3px 0 #111;padding:16px 18px;margin-bottom:14px}
.box h2{font-size:24px;margin-bottom:10px}
.ings{list-style:none}.ings li{display:flex;gap:14px;padding:9px 0;border-bottom:2px solid #111}.ings li:last-child{border:0}
.ings b{min-width:80px}.ings small{color:#444}.ings .tip{display:block;font-size:13px;margin-top:2px}
.note{font-size:13.5px;color:#333;margin-top:8px}
.toolchips{list-style:none;display:flex;flex-wrap:wrap;gap:8px}.toolchips li{border:2px solid #111;border-radius:10px;padding:5px 10px;font-weight:700;font-size:14px;background:#7CD3FF}
.toolchips li:nth-child(4n+2){background:#FF6FB5}.toolchips li:nth-child(4n+3){background:#FFD23F}.toolchips li:nth-child(4n){background:#B8F27A}
.steps{list-style:none;counter-reset:s}.steps li{counter-increment:s;display:flex;gap:12px;padding:8px 0;font-size:16px}
.steps li::before{content:counter(s);flex:none;width:30px;height:30px;border:2px solid #111;border-radius:9px;background:#FFD23F;font-weight:800;display:grid;place-items:center}
.garnish{margin-top:8px}
.cta{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 10px}
.btn,.btn-dark{font:700 15px "DM Sans",sans-serif;border:2px solid #111;border-radius:14px;padding:12px 16px;text-decoration:none;background:#fff;color:#111;cursor:pointer;min-height:48px}
.btn-dark{background:#111;color:#fff;box-shadow:4px 4px 0 #FFD23F}
.sec{font-size:26px;margin:22px 0 12px}
.rel{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.card{display:flex;flex-direction:column;border:2px solid #111;border-radius:16px;overflow:hidden;background:#fff;box-shadow:3px 3px 0 #111;text-decoration:none}
.card .art{height:110px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 40%,#fff)}.card .art svg{height:86px}
.card .cb{border-top:2px solid #111;padding:8px 10px}.card b{display:block}.card small{color:#444}
.big{font-size:clamp(36px,9vw,56px);margin:22px 0 6px}.lead{font-weight:500;margin-bottom:12px}
.letters{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}.letters a{border:2px solid #111;border-radius:8px;background:#fff;padding:2px 9px;font-weight:800;text-decoration:none}
.az{margin-bottom:16px}.az h2{font-size:28px;border-bottom:2px solid #111;margin-bottom:6px}.az ul{list-style:none;columns:2 220px}.az li{padding:3px 0;break-inside:avoid}.az a{font-weight:700}.az small{color:#444}
.ptab{overflow-x:auto;border:2px solid #111;border-radius:16px;box-shadow:3px 3px 0 #111;background:#fff;margin:12px 0}
.ptab table{border-collapse:collapse;width:100%;min-width:560px;font-size:14.5px}.ptab th,.ptab td{padding:10px 12px;border-bottom:2px solid #111;text-align:left;vertical-align:top}
.ptab thead th{background:#FFD23F;font-size:13px}.ptab thead small{display:block;font-weight:600}.ptab tr:last-child th,.ptab tr:last-child td{border-bottom:0}
.ptab td b{display:block;font-size:16px}.ptab td small{display:block;color:#333}.ptab td a{font-size:12.5px;font-weight:700}.na{color:#555}
.box{background:#fff;border:2px solid #111;border-radius:14px;padding:10px 14px}
.clist{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin:14px 0}.clist li{background:#fff;border:2px solid #111;border-radius:14px;box-shadow:3px 3px 0 #111;padding:10px 12px}.clist a{font-weight:800;font-size:17px}.clist small{display:block;color:#333}
footer{text-align:center;font-size:13px;color:#333;padding:36px 18px 30px;margin-top:20px;border-top:2px solid #111}footer p{margin:3px 0}