/* Mixxing (mixxing.com): grown-up mid-century, "atomic brights" (round 3 mockups). Bump MX_CSS_VERSION in mx/mx.php after
   changing this file or js/mx.js (a new URL, so no purge is needed). */
@font-face{font-family:'Josefin Sans';src:url(/fonts/josefin-sans-latin-600-normal.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Josefin Sans';src:url(/fonts/josefin-sans-latin-700-normal.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url(/fonts/dm-sans-latin-400-normal.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url(/fonts/dm-sans-latin-500-normal.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url(/fonts/dm-sans-latin-700-normal.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap}
:root{--navy:#1F2A33;--teal:#1D6B66;--tealD:#124744;--coral:#E37352;--mustard:#E2A932;--gold:#F2C766;--cream:#FFF9F0;--rust:#A63F22;--mute:#5C5244;
 --line:#E6DCCB;--line2:#EFE7D9;--rule:#E0D4C0;--sub:#37434C}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#FFF9F0;color:var(--navy);font:17px/1.6 'DM Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--teal)}
a:hover{color:var(--tealD)}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0}
img,svg{max-width:100%}
button{font:inherit}
:focus-visible{outline:3px solid var(--mustard);outline-offset:2px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.page{background-color:#FFF9F0;background-image:radial-gradient(rgba(31,42,51,.055) 1px,transparent 1.3px);background-size:14px 14px;overflow-x:clip}
@supports not (overflow-x:clip){.page{overflow-x:hidden}}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}

/* textures */
.navy{background-color:#1F2A33;background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,rgba(255,255,255,.02) 0 1px,transparent 1px 3px);color:var(--cream)}
.hero{background-color:#1D6B66;background-image:radial-gradient(ellipse 70% 90% at 18% 0%,rgba(255,255,255,.13),transparent 70%),repeating-linear-gradient(45deg,rgba(255,255,255,.035) 0 1px,transparent 1px 8px),linear-gradient(180deg,#22766F,#175957);color:var(--cream)}
.coral{background-color:#EA7E56;background-image:radial-gradient(rgba(255,255,255,.16) 1px,transparent 1.4px),linear-gradient(135deg,#EF8C64,#E37352);background-size:12px 12px,100% 100%}
.mustard{background-color:#F6E8C1;background-image:repeating-linear-gradient(-45deg,rgba(166,63,34,.06) 0 1px,transparent 1px 7px)}
.tealtint{background-color:#D7E8E5;background-image:repeating-linear-gradient(-45deg,rgba(29,107,102,.07) 0 1px,transparent 1px 7px)}
.coraltint{background-color:#F6DDD3;background-image:repeating-linear-gradient(-45deg,rgba(166,63,34,.06) 0 1px,transparent 1px 7px)}
.backbar{background-color:#15504D;background-image:radial-gradient(ellipse 80% 70% at 50% 0%,rgba(255,240,200,.14),transparent 70%),repeating-linear-gradient(90deg,rgba(0,0,0,.08) 0 1px,transparent 1px 22px)}
.trim{height:8px;background-color:#5A3720;background-image:repeating-linear-gradient(180deg,rgba(255,225,185,.12) 0 1px,transparent 1px 3px,rgba(0,0,0,.2) 3px 4px,transparent 4px 6px);box-shadow:inset 0 1px 0 rgba(255,225,185,.28),inset 0 -1px 0 rgba(0,0,0,.45)}
.clay{height:8px;background-color:#A63F22;background-image:repeating-linear-gradient(180deg,rgba(255,220,190,.16) 0 1px,transparent 1px 3px,rgba(0,0,0,.14) 3px 4px,transparent 4px 6px);box-shadow:inset 0 1px 0 rgba(255,220,190,.3),inset 0 -1px 0 rgba(0,0,0,.35)}
.ledge{height:14px;background-color:#5A3720;background-image:linear-gradient(180deg,rgba(255,225,185,.25),transparent 40%,rgba(0,0,0,.25)),repeating-linear-gradient(180deg,rgba(255,225,185,.12) 0 1px,transparent 1px 3px,rgba(0,0,0,.2) 3px 4px,transparent 4px 7px);box-shadow:0 8px 12px rgba(0,0,0,.28)}

/* type */
.js{font-family:'Josefin Sans',system-ui,sans-serif;font-weight:600;letter-spacing:.005em}
.lab{font:600 12px/1.5 'Josefin Sans',system-ui,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--rust)}
.lab.gold{color:var(--gold)}
.lab.ink{color:var(--navy)}
.lab.tl{color:var(--tealD)}
.lede{font-size:19px;color:#E1EFEC;max-width:34em}
.dhero .lede,.lede.dark{color:var(--sub)}
.more{font-weight:700;font-size:15px;white-space:nowrap}
.mt{margin-top:14px}
.mt2{margin-top:36px}
.card{text-decoration:none;color:var(--navy);background:#FFF;border:1px solid var(--line);border-radius:6px}
a.card:hover{border-color:#CDBFA6;color:var(--navy)}
.fine{font-size:12px;color:var(--mute);margin-top:10px}
.note{font-size:14px;color:var(--mute);margin-top:14px}

/* header and footer */
.hdrin{display:flex;flex-wrap:wrap;gap:10px 32px;align-items:center;padding-top:14px;padding-bottom:14px}
.hdrin .nav{margin-left:auto}
.brand{display:flex;align-items:center;text-decoration:none}
.brand .lg{height:40px;width:auto;display:block}
.hdr{position:relative;z-index:20}
.nav{display:flex;align-items:center;gap:6px 30px;font:600 13px/1.4 'Josefin Sans',system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase}
.nav>a,.navmore summary{color:var(--cream);text-decoration:none;padding:6px 0;border-bottom:2px solid transparent;cursor:pointer}
.nav>a:hover,.navmore summary:hover{color:var(--gold)}
.nav>a[aria-current],.navmore summary.cur{border-bottom-color:var(--mustard)}
.navmore{position:relative}
.navmore summary{list-style:none;display:flex;align-items:center;gap:7px}
.navmore summary::-webkit-details-marker{display:none}
.navmore[open] summary svg{transform:rotate(180deg)}
.navdrop{position:absolute;top:calc(100% + 12px);right:-18px;min-width:280px;background:var(--cream);border-radius:10px;box-shadow:0 12px 32px rgba(0,0,0,.28);padding:8px;display:grid;z-index:30}
.navdrop a{display:block;padding:10px 12px;border-radius:7px;color:var(--navy);text-decoration:none;letter-spacing:.14em}
.navdrop a span{display:block;font:400 13px/1.35 'DM Sans',system-ui,sans-serif;letter-spacing:0;text-transform:none;color:var(--mute);margin-top:2px}
.navdrop a:hover,.navdrop a[aria-current]{background:rgba(29,107,102,.1)}
.fmenu{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;padding-top:36px;padding-bottom:30px;border-bottom:1px solid rgba(255,249,240,.1)}
.fmenu .fh{font:600 11.5px 'Josefin Sans',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--mustard);margin:0 0 12px}
.fmenu a{display:block;color:#E1EFEC;text-decoration:none;font-size:15px;padding:4px 0}
.fmenu a:hover{color:var(--gold)}
.navbtns{display:flex;gap:10px;font:600 13px/1 'Josefin Sans',system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase}
@media (max-width:1180px){.nav{gap:6px 22px;letter-spacing:.12em}.hdrin{gap:10px 22px}}
.nbtn{color:var(--cream);text-decoration:none;padding:8px 16px;border:1.5px solid rgba(255,249,240,.45);border-radius:999px;line-height:1}
.nbtn:hover{border-color:var(--gold);color:var(--gold)}
.nbtn.hot{background:var(--coral);border-color:var(--coral);color:#fff}
.nbtn.hot:hover{filter:brightness(1.07);color:#fff}
.nbtn[aria-current]{border-color:var(--mustard)}
.foot{margin-top:0}
.footin{display:flex;flex-wrap:wrap;gap:16px 32px;justify-content:space-between;align-items:center;padding-top:28px;padding-bottom:28px;font-size:15px}
.fbrand .lg{height:30px;width:auto;display:block}
.fnote{color:#DCE3E6}
.fnav{display:flex;gap:20px}
.fnav a{color:var(--mustard)}
.fnav a:hover{color:var(--gold)}

/* the logo's hover: the two X's stir in opposite directions and the spark flares, once per hover (js/mx.js adds .play) */
.brand .lx1,.brand .lx2,.brand .lsp{transform-box:view-box}
.brand .lg{overflow:visible}
@media (prefers-reduced-motion:no-preference){
 .brand.play .lx1{animation:mxstir1 .9s cubic-bezier(.45,0,.25,1)}
 .brand.play .lx2{animation:mxstir2 .9s cubic-bezier(.45,0,.25,1)}
 .brand.play .lsp{animation:mxflare .9s ease-out}
}
@keyframes mxstir1{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes mxstir2{from{transform:rotate(0)}to{transform:rotate(-360deg)}}
@keyframes mxflare{0%{transform:scale(1) rotate(0)}35%{transform:scale(1.7) rotate(45deg)}100%{transform:scale(1) rotate(90deg)}}

/* shelf art */
.btl{font-family:'Josefin Sans',sans-serif;font-weight:700;letter-spacing:.1em}

/* stars */
.star{position:absolute;pointer-events:none}
.sechead .star,.labrow .star{position:static;flex:none}
.hs{display:contents}

/* search */
.srch{position:relative;display:flex;max-width:540px;background:var(--cream);border-radius:999px;padding:4px;box-shadow:0 6px 18px rgba(0,0,0,.18);margin-top:26px}
.srch input{flex:1;min-width:0;height:48px;padding:0 18px;border:0;background:transparent;font:inherit;font-size:17px;color:var(--navy);border-radius:999px}
.srch input:focus{outline:none}
.srch:focus-within{box-shadow:0 0 0 3px var(--mustard),0 6px 18px rgba(0,0,0,.18)}
.sbtn{height:48px;padding:0 24px;border:0;border-radius:999px;color:var(--navy);font:700 13px 'Josefin Sans',sans-serif;letter-spacing:.18em;text-transform:uppercase;cursor:pointer}
.ac{position:absolute;left:12px;right:12px;top:calc(100% + 6px);z-index:30;list-style:none;margin:0;padding:4px 0;background:#fff;color:var(--navy);border:1px solid var(--line);border-radius:8px;box-shadow:0 10px 24px -8px rgba(31,42,51,.35);text-align:left}
.ac[hidden]{display:none}
.ac li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:8px 16px;cursor:pointer;font-size:16px}
.ac li b{font-weight:700}
.ac li small{font-size:13px;color:var(--mute);white-space:nowrap}
.ac li[aria-selected=true],.ac li:hover{background:#F6E8C1}

/* pills and toggles */
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{display:inline-flex;align-items:center;gap:8px;font:500 15px 'DM Sans',sans-serif;padding:0 16px 0 10px;min-height:44px;border-radius:999px;border:1px solid #C9BDA8;background:#FFF;color:var(--navy);cursor:pointer;transition:background-color .12s,color .12s,border-color .12s}
.pill:hover{border-color:var(--navy)}
.pill[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.pill .ic{flex:none}
.tog{font:600 13px 'Josefin Sans',sans-serif;letter-spacing:.1em;min-width:44px;min-height:40px;padding:0 14px;border:0;border-radius:999px;background:transparent;color:var(--navy);cursor:pointer}
.tog[aria-pressed="true"]{background:var(--navy);color:var(--cream)}
.tg{display:flex;background:#F2EADB;border-radius:999px;padding:3px}
.tbtn{font:600 12px 'Josefin Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;min-height:36px;padding:0 14px;border:1px solid #C9BDA8;border-radius:999px;background:#FFF;color:var(--navy);cursor:pointer}
.tbtn:hover{border-color:var(--navy)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.chip{display:inline-flex;align-items:center;gap:7px;font:500 14px 'DM Sans',sans-serif;min-height:36px;padding:0 14px;border:1px solid #C9BDA8;border-radius:999px;background:#FFF;color:var(--navy);cursor:pointer}
.chip i{display:inline-block;width:10px;height:10px;border-radius:50%}
.chip[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:var(--cream)}

/* ads */
.adbox{margin:24px auto 0;min-height:90px;text-align:center}
.side .adbox{margin:0;width:100%;min-height:250px}
.side .adbox.ad-tall{min-height:600px}
.main .adbox{margin:0}
.dlist .adbox,.frows .adbox{margin:0;padding:12px 10px;border-bottom:1px solid var(--line);min-height:100px}

/* layout */
.sec{padding-top:48px;padding-bottom:44px}
.cols{display:flex;flex-wrap:wrap;gap:40px;align-items:flex-start;padding-top:0;padding-bottom:64px}
.main{flex:999 1 560px;min-width:0;display:flex;flex-direction:column;gap:44px}
.side{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;gap:24px;align-items:stretch;max-width:100%}
.sechead{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.sechead h2{margin:0;font-size:34px;line-height:1.15;white-space:nowrap}
.sechead .h2s,.h2s{font-size:28px;line-height:1.2}
.sechead .rule{flex:1;height:1px;background:var(--rule);min-width:20px}

/* home hero */
.herohome{position:relative;overflow:hidden}
.homein{display:flex;flex-wrap:wrap;gap:48px;align-items:center;position:relative;padding-top:56px;padding-bottom:64px}
.homecopy{flex:1 1 480px;min-width:0}
.homecopy .lab{margin-bottom:14px}
.h1home{font-size:54px;line-height:1.08;margin-bottom:18px}
.barwidget{flex:1 1 420px;min-width:0;border-radius:8px;overflow:hidden;box-shadow:0 14px 34px rgba(5,25,25,.32);background:#FFF;color:var(--navy)}
.bbtop{padding:16px 22px 0}
.bbhead{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.bbcount{font-size:13px;color:#BFD9D5}
.bbshelf{display:flex;align-items:flex-end;justify-content:space-around;gap:6px;height:118px;padding:0 4px;overflow:hidden}
.bbshelf .si{display:block;height:auto}
.bbitem[hidden]{display:none}
.bbitem{display:flex;align-items:flex-end}
.bbempty{display:flex;align-items:flex-end;justify-content:space-around;gap:18px;width:100%;opacity:.5;color:#E1EFEC;font-size:14px;padding-bottom:8px}
.bbempty[hidden]{display:none}
.bbtop .ledge{margin:0 -22px}
.bbbody{padding:18px 22px 20px}
.bbres{border-top:1px solid #EDE4D4;margin-top:16px;padding-top:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.bbmake{font-size:20px;line-height:1.35;margin-top:4px}
.bbaway{font-size:15px;margin-top:4px}
.bbmore{margin-top:12px;font-size:14px;font-weight:700}
.bbitem .si{max-height:104px}

/* families */
.famgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.famcard{padding:18px;display:flex;gap:16px;align-items:center}
.famic{width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none}
.famn{display:block;font-size:20px;line-height:1.25}
.famt{display:block;font-size:14px;color:var(--mute)}
.famx{display:block;font-size:13px;color:var(--mute);margin-top:4px}
.famgrid.big{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}

/* featured drink */
.feat{border-radius:8px;overflow:hidden;box-shadow:0 6px 18px rgba(120,50,20,.15)}
.featin{color:var(--navy);padding:32px;display:flex;flex-wrap:wrap;gap:28px;align-items:center;position:relative;overflow:hidden}
.featglass{width:132px;height:132px;border-radius:50%;background:var(--cream);display:flex;align-items:center;justify-content:center;flex:none;box-shadow:inset 0 -6px 0 rgba(0,0,0,.06)}
.featcopy{flex:1 1 300px;min-width:0;position:relative}
.featn{font-size:36px;margin:2px 0 8px}
.featd{margin-bottom:14px}
.featlink{margin-top:14px}
.featlink a{color:var(--navy);font-weight:700}

/* ratio bars */
.rbar{display:flex;gap:2px;font:700 13px 'Josefin Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;border-radius:999px;overflow:hidden;box-shadow:0 3px 10px rgba(0,0,0,.08)}
.rbar span{height:54px;display:flex;align-items:center;justify-content:center;min-width:0;overflow:hidden}
.rbar b{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 8px}
.rbar span{min-width:max-content;cursor:default}
.rbar.tight{letter-spacing:.03em}
.rbar.tight b{padding:0 5px;font-size:.88em}
.rbar.tighter span{min-width:0}
.rtip{position:fixed;z-index:50;pointer-events:none;background:var(--navy);color:var(--cream);font:700 12px/1 'Josefin Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;padding:8px 11px;border-radius:6px;box-shadow:0 4px 14px rgba(0,0,0,.2);white-space:nowrap;transform:translate(-50%,-100%)}
.rtip[hidden]{display:none}
.rbar.small{font-size:12px;box-shadow:none}
.rbar.small span{height:30px}

/* drink rows (home list) */
.dlist{border-top:2px solid var(--navy);background:#FFF}
.drow{display:grid;grid-template-columns:44px 1fr 170px;gap:14px;align-items:center;padding:12px 10px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--navy)}
.drow:hover{background:#FBF5EA;color:var(--navy)}
.drow .gl{justify-self:center}
.dn{font-size:19px}
.dm{font-size:14px;color:var(--mute)}

/* promos */
.promo{display:block;width:100%;text-decoration:none;color:var(--navy);border-radius:8px;padding:22px;position:relative;overflow:hidden}
.promo.mustard{border:1px solid #EAD8A6}
.promo h3{margin:4px 0 6px;font-size:21px}
.promo p:last-child{font-size:15px}
.promodark{color:var(--cream)}
.promodark p:last-child{color:#E1EFEC}
.promo:hover{color:inherit;filter:brightness(1.02)}

/* drink page */
.dhero{position:relative;padding-top:24px;padding-bottom:36px}
.crumbs{font-size:14px;color:var(--mute);margin-bottom:20px;position:relative}
.dtop{display:flex;flex-wrap:wrap;gap:40px;align-items:center;position:relative}
.dshelf{flex:0 1 380px;min-width:280px;border-radius:8px 8px 0 0;padding:20px 20px 0;overflow:hidden;box-shadow:0 12px 28px rgba(5,25,25,.25)}
.dshelfin{display:flex;align-items:flex-end;justify-content:space-around;gap:6px;height:160px}
.dshelfin svg{flex:none;height:auto;max-height:150px}
.dshelf .ledge{margin:0 -20px}
.ishelf{flex-basis:300px}
.ishelf .dshelfin{justify-content:center}
.dtitle{flex:1 1 360px;min-width:0}
.dtitle .lab{margin-bottom:6px}
.dname{font-size:72px;line-height:.95;margin-bottom:12px;overflow-wrap:anywhere}
.stats{margin-top:32px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;position:relative}
.stats>div{border-radius:6px;padding:14px 18px}
.stats dd{font-size:28px;line-height:1.3}
.recipe{overflow:hidden;box-shadow:0 4px 14px rgba(60,40,20,.06)}
.recin{padding:30px 32px}
.rechead{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;margin-bottom:12px}
.rechead h2{font-size:28px}
.togs{display:flex;flex-wrap:wrap;gap:10px}
.ings{list-style:none;margin:0 0 24px}
.ings li{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--line2)}
.ico{flex:none;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.amt{flex:none;width:118px;font-size:24px;line-height:1.2;color:var(--rust)}
.ings li[data-kind=count] .amt,.ings li[data-kind=text] .amt{font-size:19px}
.iname{flex:1;min-width:0;font-size:19px;line-height:1.35}
.iname a{font-weight:700;color:var(--navy)}
.iname a:hover{color:var(--teal)}
.iname .alt a{font-weight:500}
.alt,.opt{font-size:15px;color:var(--mute)}
.oth{flex:none;font-size:14px;color:var(--mute);text-align:right;white-space:nowrap}
.steps{list-style:none;margin:10px 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.steps li{display:flex;gap:10px}
.num{flex:none;width:28px;height:28px;border-radius:50%;background:var(--mustard);display:flex;align-items:center;justify-content:center;font-size:14px;line-height:1;padding-top:2px}
.garn{margin-top:18px;font-size:16px}
.garn+.garn{margin-top:8px}
.garn.note{color:var(--mute);font-size:15px}
.labrow{display:flex;align-items:center;gap:12px}
.rtext{font-size:44px;line-height:1.1;margin:4px 0 8px}
.rline{max-width:40em;color:var(--sub);margin-bottom:16px}
.cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.cgrid.wide{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.ccard{padding:16px 18px;border-top:4px solid var(--teal)}
.ccn{font-size:21px;margin-top:2px;line-height:1.25}
.ccr{font-size:14px;color:var(--mute)}
.dcard{display:flex;gap:12px;align-items:center;padding:14px 16px;border-top:4px solid var(--teal)}
.dcard .gl{flex:none}
.dcn{display:block;font-size:19px;line-height:1.25}
.dcm{display:block;font-size:14px;color:var(--mute)}
.riffs{list-style:none}
.riffs li{padding:13px 0;border-bottom:1px solid var(--line)}
.riffs a{font-size:19px}
.riffs span{color:var(--mute)}
.nums{border-radius:8px;padding:28px 30px;position:relative;overflow:hidden}
.numhead{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;position:relative}
.numhead h2{font-size:24px}
.numhead p{font-size:14px;color:#C9D2D8}
.numgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));margin-top:16px;border-top:1px solid #3A4A55;position:relative}
.numgrid>div{padding:14px 0}
.numgrid .js{font-size:32px;line-height:1.3}
.kbar{display:flex;height:10px;border-radius:999px;overflow:hidden;margin-top:8px;position:relative}
.kline{margin-top:10px;font-size:14px;color:#DCE3E6;position:relative;display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center}
.kline i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px}
.kline a{color:var(--gold)}
.needs{padding:22px;border-top:5px solid var(--mustard)}
.needs h3,.batch h3{font-size:20px;margin:2px 0 10px}
.needs ul{list-style:none;font-size:15px}
.needs li{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid var(--line2)}
.needs li:last-child{border-bottom:1px solid var(--line2)}
.needs li a:first-child{color:var(--navy)}
.shop{font-weight:700;white-space:nowrap}
.shop.big{font-size:17px}
.batch{border-radius:8px;padding:22px;font-size:15px}
.iba{padding:22px;font-size:15px}
.zero{padding:22px;font-size:15px;margin-top:18px;border-top:5px solid #2E8B7A}
.zero p{margin:6px 0 0}
.others{padding:22px;font-size:15px}
.others ul{list-style:none;columns:2;column-gap:18px;margin-top:6px}
.others li{padding:3px 0;break-inside:avoid}

/* family page */
.famhero{flex:none;width:200px;height:200px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 -8px 0 rgba(0,0,0,.05)}
.tmpl{margin-top:14px;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px}
.tmpl .js{font-size:24px}
.frows{border-top:2px solid var(--navy);background:#FFF}
.frow{display:grid;grid-template-columns:44px minmax(0,1fr) 200px;gap:16px;align-items:center;padding:14px 12px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--navy)}
.frow:hover{background:#FBF5EA;color:var(--navy)}
.frn .js{display:block;font-size:20px;line-height:1.25}
.frd{display:block;font-size:14px;color:var(--mute);line-height:1.45}
.frm{display:flex;flex-direction:column;gap:5px}
.frr{font-size:16px}
.pbar{display:flex;height:8px;border-radius:999px;overflow:hidden;gap:1px}
.frs{font-size:13px;color:var(--mute)}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:12px;font-size:13px;color:var(--mute)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px}

/* slim heroes (index pages) */
.slimhero{position:relative;overflow:hidden}
.slimhero .wrap{padding-top:44px;padding-bottom:48px;position:relative}
.slimhero h1{font-size:50px;line-height:1.08;margin:6px 0 12px}

/* A to Z */
.fcount{font-size:14px;color:var(--mute);margin:4px 0 14px}
.azgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px;border-top:2px solid var(--navy)}
.azrow{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px 8px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--navy);background:rgba(255,255,255,.6)}
.azrow[hidden]{display:none}
.azrow:hover{background:#FFF;color:var(--navy)}
.azn .js{display:block;font-size:19px;line-height:1.25}
.azm{display:block;font-size:13.5px;color:var(--mute)}
.azs{text-align:right;font-size:13px;color:var(--mute);display:flex;flex-direction:column}
.azs .js{font-size:15px;color:var(--navy)}

/* ingredients */
.igrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:18px;align-items:start}
.igrp{padding:20px 22px}
.igrp h2{font-size:22px;display:flex;align-items:center;gap:10px;margin-bottom:8px}
.dot{display:inline-block;width:16px;height:16px;border-radius:50%;border:1px solid rgba(0,0,0,.1)}
.igrp ul{list-style:none}
.igrp li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid var(--line2)}
.igrp li:last-child{border-bottom:0}
.igrp li a{display:flex;align-items:center;gap:10px;color:var(--navy);text-decoration:none;font-weight:500}
.igrp li a:hover span{text-decoration:underline}
.igrp li a .ic{color:var(--teal)}
.igrp small,.ilist small{color:var(--mute);font-size:13px;white-space:nowrap}
.ilist{list-style:none;columns:3;column-gap:24px}
.ilist li{padding:4px 0}
.unlock{overflow:hidden}
.unin{padding:24px 28px}
.unmsg{margin:6px 0 12px;color:var(--sub)}
.unlist{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.unlist a{display:inline-block;padding:6px 12px;border-radius:6px;background:#F6E8C1;color:var(--navy);text-decoration:none;font-weight:500}
.unlist a:hover{background:#F2DDA0}

/* My Bar page */
.barhero .lede{max-width:46em}
.mybar{padding-top:28px;padding-bottom:64px}
.bigbar{border-radius:8px 8px 0 0;padding:16px 22px 0;box-shadow:0 12px 28px rgba(5,25,25,.25)}
.bigbar .ledge{margin:0 -22px}
.bbshelf.wraps{height:auto;min-height:122px;flex-wrap:wrap;justify-content:flex-start;align-items:flex-end;gap:12px 14px;padding:0 4px;margin-top:8px;
 background-image:repeating-linear-gradient(180deg,transparent 0 122px,#7A4C2C 122px 124px,#5A3720 124px 131px,#3E2614 131px 134px)}
.bbshelf.wraps .bbitem{height:122px}
.bigbar .bbempty{justify-content:flex-start;font-size:15px;opacity:.8;min-height:100px;align-items:center}
.barcols{display:flex;flex-wrap:wrap;gap:28px;align-items:flex-start;margin-top:28px}
.barpick{flex:1 1 440px;min-width:0;padding:22px 24px}
.pickhead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}
.pgrp{border:0;margin:0;padding:12px 0 6px;border-top:1px solid var(--line2);min-width:0}
.pgrp:first-of-type{border-top:0}
.pgrp legend{padding:0;margin-bottom:8px}
.pgrp .pill{min-height:40px;font-size:14px;padding:0 14px 0 9px}
.barout{flex:1 1 440px;min-width:0;display:flex;flex-direction:column;gap:20px}
.bres{overflow:hidden}
.bresin{padding:20px 24px 22px}
.bres h2{margin-bottom:10px}
.bcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px}
.bcards a{display:block;padding:9px 12px;border-radius:6px;background:#FBF5EA;border:1px solid var(--line2);color:var(--navy);text-decoration:none;font-weight:500;line-height:1.3}
.bcards a:hover{border-color:#CDBFA6}
.bcards a small{display:block;font-size:12.5px;color:var(--mute);font-weight:400}
.bswap li,.baway li{padding:8px 0;border-bottom:1px solid var(--line2);list-style:none;font-size:15.5px}
.bswap li:last-child,.baway li:last-child{border-bottom:0}
.baway b,.bswap b{font-weight:700}
.baway .plus{font:700 14px 'Josefin Sans',sans-serif;letter-spacing:.06em;color:var(--rust);margin-right:6px}
.baway button{border:0;background:none;color:var(--teal);font-weight:700;cursor:pointer;padding:0;text-decoration:underline}
.mute{color:var(--mute)}

/* ratio map */
.mapwrap{display:flex;flex-wrap:wrap;gap:28px;align-items:flex-start;padding-top:28px;padding-bottom:20px}
.mapcol{flex:3 1 560px;min-width:0;padding:16px 16px 10px}
.mapbox{position:relative}
.rmap{display:block;width:100%;height:auto;touch-action:manipulation}
.hexf{fill:#FBF5EA;stroke:#CDBFA6;stroke-width:1.5}
.ring{fill:none;stroke:#E6DCCB;stroke-width:1;stroke-dasharray:4 4}
.spoke{stroke:#E6DCCB;stroke-width:1}
.anc{stroke:#FFF;stroke-width:2}
.alab{font:600 14px 'Josefin Sans',sans-serif;letter-spacing:.14em;text-transform:uppercase;fill:#5C5244}
.dots circle{stroke:#FFF;stroke-width:1.5;transition:r .12s,opacity .12s}
.dots a:hover circle,.dots a:focus circle,.dots a.on circle{stroke:#1F2A33;stroke-width:3}
.dots a:focus{outline:none}
.dots.hl a circle{opacity:.18}
.dots.hl a.lit circle{opacity:1}
.dots a.near circle{stroke:#1F2A33;stroke-width:2.5}
.youring{fill:rgba(226,169,50,.25);stroke:#1F2A33;stroke-width:2}
.yourays{stroke:#1F2A33;stroke-width:1.6;stroke-linecap:round}
.youdot{fill:#E37352}
.mtip{position:absolute;z-index:3;pointer-events:none;background:#1F2A33;color:#FFF9F0;border-radius:6px;padding:6px 10px;font-size:14px;line-height:1.35;white-space:nowrap;transform:translate(-50%,calc(-100% - 14px))}
.mtip b{font-family:'Josefin Sans',sans-serif;font-weight:600;font-size:16px;display:block}
.mtip[hidden]{display:none}
.famchips{margin:10px 0 0}
.famchips .chip{font-size:13px;min-height:32px;padding:0 11px}
.mapside{flex:1 1 320px;min-width:0;display:flex;flex-direction:column;gap:20px}
.sliders,.near{overflow:hidden}
.slin{padding:20px 22px 22px}
.presets{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 14px}
.presets .tbtn{font-size:11px;min-height:32px;padding:0 10px;letter-spacing:.08em}
.sl{display:grid;grid-template-columns:150px minmax(0,1fr) 40px;gap:10px;align-items:center;padding:4px 0;font-size:15px}
.sll{display:flex;align-items:center;gap:8px;white-space:nowrap}
.sll i{display:inline-block;width:12px;height:12px;border-radius:50%;flex:none}
.sl input{width:100%;accent-color:#1D6B66}
.sl output{text-align:right;font-size:18px}
.sltext{margin-top:10px;font-size:22px;min-height:1.4em}
.near ol{list-style:none;counter-reset:n}
.near li{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:8px 0;border-bottom:1px solid var(--line2)}
.near li:last-child{border-bottom:0}
.near li a{font-family:'Josefin Sans',sans-serif;font-weight:600;font-size:18px;color:var(--navy)}
.near li small{color:var(--mute);font-size:13.5px;white-space:nowrap}
.prose p{max-width:46em}
.prose p+p{margin-top:10px}
.pcard{padding:26px 30px;margin-bottom:20px}
.pcard h2{margin-bottom:10px}
.pcard ul{padding-left:1.2em}
.pcard li{margin-top:8px}

/* calories */
.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:28px}
.kpi{padding:20px 22px;border-radius:6px}
.kpi ol{list-style:none;margin-top:6px}
.kpi li{display:flex;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px solid var(--line2);font-size:15.5px}
.kpi li:last-child{border-bottom:0}
.kpi li a{font-weight:700;color:var(--navy)}
.kpi li span{color:var(--mute);white-space:nowrap}
.kpi.mustard p:last-child{font-size:15px;margin-top:4px}
.tscroll{overflow-x:auto}
.ktable{width:100%;border-collapse:collapse;background:#FFF;border-top:2px solid var(--navy);font-variant-numeric:tabular-nums}
.ktable th,.ktable td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.ktable thead th{padding:0;border-bottom:1px solid #CDBFA6}
.ktable thead button{display:block;width:100%;text-align:inherit;border:0;background:none;padding:10px 12px;font:600 12px 'Josefin Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--rust);cursor:pointer}
.ktable thead button[aria-sort]::after{content:" \2193"}
.ktable thead button[aria-sort=descending]::after{content:" \2191"}
.ktable tbody th{font-weight:400}
.ktable tbody th a{display:flex;align-items:center;gap:9px;color:var(--navy);font-weight:700;text-decoration:none}
.ktable tbody th a:hover{text-decoration:underline}
.ktable tbody th i{width:10px;height:10px;border-radius:50%;flex:none}
.ktable tr[hidden]{display:none}
.kc{width:40%}
.kc b{display:inline-block;min-width:3ch;text-align:right;margin-left:10px}
.kb{display:inline-block;width:calc(100% - 50px);max-width:300px;height:10px;border-radius:999px;background:#F2EADB;vertical-align:middle;overflow:hidden}
.kb span{display:block;height:100%;background:linear-gradient(90deg,#E2A932,#E37352);border-radius:999px}

/* rankings */
.crumbs.lt{color:#CFE3DF}
.crumbs.lt a{color:var(--gold)}
.rgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.rcard{padding:20px 22px;border-top:4px solid var(--coral)}
.rcard:nth-child(even){border-top-color:var(--teal)}
.rcard h2{font-size:22px;line-height:1.2;margin:4px 0 8px}
.rcard h2 a{color:var(--navy);text-decoration:none}
.rcard h2 a:hover{text-decoration:underline}
.rcard ol{list-style:none;margin-bottom:10px}
.rcard li{display:flex;gap:8px;align-items:baseline;padding:5px 0;border-bottom:1px solid var(--line2);font-size:15px}
.rcard li a{flex:1;min-width:0;font-weight:700;color:var(--navy)}
.rcard li span:last-child{color:var(--mute);white-space:nowrap}
.rk{font:600 14px 'Josefin Sans',sans-serif;color:var(--rust);min-width:1.6em}
.kpi .big{font-size:26px;line-height:1.25;margin:4px 0 2px}
.kpi .big a{color:var(--navy)}
.rnote{font-size:17px;max-width:46em;margin:-8px 0 22px;color:var(--sub)}
.rtable thead th>span{display:block;padding:10px 12px;font:600 12px 'Josefin Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--rust)}
.rtable thead th.on>span{color:var(--navy)}
.rtable td.rk{width:3.2em;font-size:16px}
.rtable tbody th .sub{display:block;margin-left:19px;font-size:13px;color:var(--mute);font-weight:400}
.rtable td.on{min-width:200px}
.rtable td.on .kb{width:calc(100% - 64px);max-width:220px;margin-right:8px}
.rtable tr:target{background:#FFF4D6}
.spc h3{font-size:24px;margin:2px 0 6px}
.spc ul{list-style:none}
.spc li{padding:6px 0;border-bottom:1px solid var(--line2);font-size:15.5px}
.spc li:last-child{border-bottom:0}
.spc a{color:var(--teal);font-weight:700}
.rlinks{list-style:none;display:flex;flex-wrap:wrap;gap:8px 10px}
.rlinks a{display:inline-block;padding:7px 14px;border:1px solid var(--rule);border-radius:999px;background:#FFF;color:var(--navy);text-decoration:none;font-size:15px}
.rlinks a:hover{border-color:var(--teal);color:var(--teal)}
.ranks{margin-top:14px;position:relative;display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:14px;color:#DCE3E6}
.ranks a{display:inline-block;padding:4px 12px;border:1px solid rgba(242,199,102,.55);border-radius:999px;color:var(--gold);text-decoration:none;font-weight:700}
.ranks a:hover{background:rgba(242,199,102,.12)}

/* IBA badge, recipe sources */
.ibab{display:inline-block;margin-left:6px;padding:1px 8px;border:1px solid currentColor;border-radius:999px;font-size:10.5px;letter-spacing:.16em;vertical-align:1px}
.ibat{font-weight:700;color:var(--teal);letter-spacing:.06em}
.srcs p+p{margin-top:8px}
.srcl{font-size:14.5px;line-height:1.5}
.srcl a{color:var(--teal);word-break:break-word}

/* head to head */
.vsintro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start;padding-bottom:28px}
.vsintro .vstext:only-child{grid-column:1/-1;max-width:52em}
.vsnote{padding:24px 26px;border-top:4px solid var(--coral)}
.vsnote .js{font-size:21px;line-height:1.45;margin-top:6px;color:var(--navy)}
.vstext p+p{font-size:17px;color:var(--sub);margin-top:8px}
.vsgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;padding-bottom:40px}
.vside{padding:24px 26px;border-top:4px solid var(--teal)}
.vshead{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.vsgl{flex:none}
.vshead h2{font-size:30px;line-height:1.1}
.vshead h2 a{color:var(--navy);text-decoration:none}
.vshead h2 a:hover{text-decoration:underline}
.vsfam{font-size:14px;color:var(--mute);margin-top:2px}
.vstats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:6px}
.vstats dd{font-size:24px;line-height:1.2}
.vsings{margin-bottom:14px}
.vsings li{padding:9px 6px}
.vsings .amt{width:84px;font-size:20px}
.vsings .iname{font-size:17px}
.vsings li.diff{background:#FDEEE6;border-radius:4px}
.vsings li.diff .iname a{color:var(--rust)}
.vsmeta{font-size:15px;color:var(--sub);margin-bottom:14px}
.vside .rbar{margin-top:6px}
.vsbot{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:40px;align-items:start}
.vsmap{padding:10px}
.pmo{fill:#DCD2C1}
.pdot{stroke:#1F2A33;stroke-width:3}
.plab{font:700 19px 'Josefin Sans',sans-serif;fill:#1F2A33;paint-order:stroke;stroke:#FBF5EA;stroke-width:5px;stroke-linejoin:round}
.mb{margin-bottom:30px}
.sechead .dot{vertical-align:middle;margin-right:4px}

/* responsive */
/* cocktails on screen */
.scns{display:grid;gap:14px}
.scn{display:flex;gap:16px;padding:18px 22px;border-left:4px solid var(--coral)}
.scn:nth-child(even){border-left-color:var(--teal)}
.scg{flex:0 0 auto;padding-top:6px}
.scb{min-width:0;flex:1}
.scb h3{font-size:21px;line-height:1.25;margin:0 0 4px}
.scb h3 a{color:var(--navy);text-decoration:none}
.scb h3 a:hover{text-decoration:underline}
.scb .lab{margin:0 0 6px}
.scb .lab a{color:inherit}
.scb p{margin:0 0 8px}
.scq{margin:6px 0 10px;padding:8px 14px;border-left:3px solid var(--mustard);background:rgba(226,169,50,.09);font-style:italic;color:var(--sub)}
.scb .more{white-space:normal;margin:0 0 6px}
.scb .srcl.fine{font-size:12.5px;margin:4px 0 0}
.stl{list-style:none;margin:0;padding:0}
.stl li{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;padding:11px 0;border-bottom:1px solid var(--line)}
.stl a{font-size:19px;color:var(--navy)}
.stl .yr{color:var(--mute);font-size:14px}
.stl .dl{margin-left:auto;text-align:right;color:var(--sub);font-size:15px}
.scc .scgl{display:block;margin-bottom:6px}
.more.lt{white-space:normal;margin-top:14px}
.more.lt a{color:var(--gold)}
/* occasions and quiz */
.occ{display:block;text-decoration:none;color:var(--navy)}
.occ h3{font-size:22px;margin:4px 0 6px}
.occ p:last-child{color:var(--sub);font-size:15px;margin:0}
.occ:hover h3{text-decoration:underline}
.occl{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.occi{display:flex;gap:16px;padding:18px 22px;border-left:4px solid var(--teal)}
.occi h2{font-size:23px;line-height:1.2;margin:0 0 4px}
.occi h2 a{color:var(--navy);text-decoration:none}
.occi h2 a:hover{text-decoration:underline}
.occs .rlinks{margin-top:6px}
.qform{padding:22px 26px}
.qform fieldset{border:0;margin:0 0 22px;padding:0}
.qform legend{font-size:20px;margin-bottom:10px;padding:0}
.qopts{display:flex;flex-wrap:wrap;gap:8px}
.qopts label{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1.5px solid var(--rule);border-radius:999px;cursor:pointer;font-size:15.5px;background:#fff}
.qopts input{accent-color:var(--teal);margin:0}
.qopts label:has(input:checked){border-color:var(--teal);background:rgba(29,107,102,.08)}
.qbtn{font:700 14px/1 'Josefin Sans',system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;padding:14px 22px;border:0;border-radius:999px;background:var(--coral);color:#fff;cursor:pointer}
.qbtn.alt{background:var(--teal);margin:4px 8px 0 0}
.qbtn:hover{filter:brightness(1.06)}
.qmore{margin-top:16px}
.syr{margin:28px 0}
.syrmeta{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:15px;color:var(--sub);margin:4px 0 14px}
.syrmeta b{font:600 11.5px 'Josefin Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--rust);margin-right:6px}
.syrings{list-style:none;margin:0 0 18px;padding:0}
.syrings li{padding:9px 0;border-bottom:1px solid var(--line);font-size:17px}
@media (max-width:1000px){
 .h1home{font-size:46px}
 .dname{font-size:60px}
 .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .kpis{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:900px){
 .azgrid{grid-template-columns:minmax(0,1fr)}
 .side{flex-basis:100%;align-items:stretch}
 .frow{grid-template-columns:40px minmax(0,1fr)}
 .frm{grid-column:2}
}
@media (max-width:640px){
 .stl .dl{margin-left:0;text-align:left;width:100%}
 .scn{padding:16px;gap:12px}

 body{font-size:16px}
 .wrap{padding:0 16px}
 .hdrin{padding-top:10px;padding-bottom:10px;gap:8px}
 .brand .lg{height:32px}
 .nav{width:100%;flex-wrap:nowrap;justify-content:space-between;gap:10px;font-size:11.5px;letter-spacing:.06em;padding-bottom:2px}
 .nav a,.navmore summary{white-space:nowrap}
 .navmore{position:static}
 .navdrop{position:absolute;left:12px;right:12px;top:100%;min-width:0}
 .navbtns{margin-left:auto;gap:8px;order:2}
 .hdrin .nav{order:3;margin-left:0}
 .nbtn{padding:7px 12px}
 .fmenu{grid-template-columns:1fr 1fr;gap:22px;padding-top:28px}
 .navbtns{font-size:12px;letter-spacing:.12em}
 .homein{padding-top:34px;padding-bottom:40px;gap:30px}
 .h1home{font-size:36px}
 .lede{font-size:17px}
 .srch{margin-top:20px}
 .srch input{height:44px;font-size:16px;padding:0 14px}
 .sbtn{height:44px;padding:0 16px;letter-spacing:.12em}
 .bbtop{padding:14px 16px 0}
 .bbtop .ledge{margin:0 -16px}
 .bbbody{padding:16px}
 .bbres{grid-template-columns:minmax(0,1fr)}
 .bbshelf{height:100px}
 .bbitem .si{max-height:88px}
 .sec{padding-top:34px;padding-bottom:30px}
 .sechead h2{font-size:26px;white-space:normal}
 .sechead .h2s,.h2s{font-size:23px}
 .sechead .more{display:none}
 .featin{padding:22px;gap:18px}
 .featglass{width:96px;height:96px}
 .featglass svg{width:52px;height:auto}
 .featn{font-size:30px}
 .drow{grid-template-columns:34px 1fr;gap:10px}
 .drow .dm{grid-column:2}
 .cols{gap:30px;padding-bottom:40px}
 .main{gap:34px}
 .dhero{padding-top:16px;padding-bottom:24px}
 .dtop{gap:22px}
 .dshelf{flex-basis:100%;min-width:0;padding:14px 12px 0}
 .dshelf .ledge{margin:0 -12px}
 .dshelfin{height:120px}
 .dshelfin svg{max-height:112px;width:auto}
 .dname{font-size:46px}
 .stats{margin-top:22px;gap:8px}
 .stats>div{padding:10px 12px}
 .stats dd{font-size:21px}
 .recin{padding:20px 16px}
 .ings li{gap:10px;flex-wrap:wrap}
 .amt{width:auto;min-width:72px;font-size:20px}
 .iname{font-size:17px;flex-basis:calc(100% - 140px)}
 .oth{display:none}
 .ico{width:30px;height:30px}
 .rtext{font-size:34px}
 .rbar span{height:46px}
 .rbar{font-size:11px;letter-spacing:.06em}
 .nums{padding:22px 18px}
 .numgrid .js{font-size:26px}
 .numgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .famhero{width:120px;height:120px}
 .famhero svg{width:46px;height:auto}
 .slimhero .wrap{padding-top:30px;padding-bottom:34px}
 .slimhero h1{font-size:36px}
 .famgrid.big{grid-template-columns:minmax(0,1fr)}
 .igrid{grid-template-columns:minmax(0,1fr)}
 .ilist{columns:1}
 .sl{grid-template-columns:118px minmax(0,1fr) 34px;font-size:13.5px}
 .sll{white-space:normal;line-height:1.25}
 .mapcol{padding:8px}
 .alab{font-size:17px}
 .pcard{padding:20px 18px}
 .footin{padding-top:22px;padding-bottom:26px}
 .ktable th,.ktable td{padding:8px 8px}
 .ktable .nm{display:none}
 .kb{display:none}
 .rtable td.on{min-width:0}
 .rtable td.rk{width:auto}
 .rtable tbody th .sub{margin-left:0;white-space:normal}
 .rcard{padding:18px}
 .vsintro,.vsgrid,.vsbot{grid-template-columns:minmax(0,1fr)}
 .vside,.vsnote{padding:18px 16px}
 .vshead h2{font-size:26px}
 .vstats dd{font-size:20px}
 .vsnote .js{font-size:18px}
 .kc{width:auto}
 .others ul{columns:1}
 .vstats{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:12px}
}
@media (prefers-reduced-motion:reduce){
 .pill,.dots circle{transition:none}
}