.mix{margin:1.2rem 0 0;padding:1.1rem 1.2rem 1.2rem;border:2px solid var(--line);border-radius:22px;background:var(--surface);min-width:0}.mix-h{float:inline-start;width:100%;padding:0;margin:0 0 .9rem;font-family:Heebo,sans-serif;line-height:1.45}.mix-h+*{clear:both}.mix-h b{display:block;font-family:Suez One,serif;font-weight:400;font-size:var(--step-1);color:var(--ink)}.mix-h span{font-size:var(--step--1);color:var(--ink-soft)}.mix-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:.8rem}.mix-t{position:relative;display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;align-items:center;column-gap:.9rem;padding:.7rem .9rem;border:2px solid var(--line);border-radius:18px;background:var(--cream);transition:border-color .2s,box-shadow .2s}.mix-t.on{border-color:var(--red);box-shadow:0 0 0 4px color-mix(in srgb,var(--red) 14%,transparent)}.mix-img{grid-row:1/3;display:block;width:52px;height:66px}.mix-img img{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 4px 8px rgba(0,0,0,.18))}.mix-t b{align-self:end;font-family:Suez One,serif;font-weight:400;font-size:var(--step-0);line-height:1.2}.mix-t small{align-self:start;white-space:nowrap;font-family:Heebo,sans-serif;font-size:.8rem;color:var(--ink-soft)}.mix-add,.mix-q{grid-column:3;grid-row:1/3;height:2.5rem;min-width:7.2rem}.mix-add{font:800 .92rem/1 Heebo,sans-serif;color:var(--red);background:transparent;border:2px solid var(--red);border-radius:999px;cursor:pointer;padding:0 1rem}.mix-add:hover{background:var(--red);color:#fff}.mix-q{display:flex;align-items:center;justify-content:space-between;border-radius:999px;background:var(--red);color:#fff;padding:0 .25rem}.mix-q[hidden],.mix-add[hidden]{display:none}.mix-q button{width:2rem;height:2rem;border:0;border-radius:50%;background:#ffffff2e;color:#fff;font:800 1.15rem/1 Heebo,sans-serif;cursor:pointer}.mix-q button:disabled{opacity:.35;cursor:default}.mix-q span{font:800 1.05rem/1 Heebo,sans-serif}.mix :focus-visible{outline:3px solid var(--gold);outline-offset:2px}.mix-nudge{margin:.35rem 0 0;font-family:Heebo,sans-serif;font-size:var(--step--1);color:var(--ink-soft)}.mix-nudge b{color:var(--red)}@media(max-width:720px){.mix{padding:1rem .9rem}.mix-row{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:.7rem;margin-inline:-.9rem;padding:0 .9rem .3rem;scrollbar-width:none}.mix-row::-webkit-scrollbar{display:none}.mix-t{flex:0 0 46%;scroll-snap-align:start;grid-template-columns:1fr;grid-template-rows:auto;justify-items:center;text-align:center;row-gap:.15rem;padding:.8rem .6rem .9rem}.mix-img{grid-row:auto;width:64px;height:80px;margin-bottom:.3rem}.mix-add,.mix-q{grid-column:auto;grid-row:auto;width:100%;min-width:0;margin-top:.5rem}}.cd .xs-strip{margin:.6rem 1.3rem 1rem;padding:.8rem .9rem;border-radius:16px;background:var(--surface,#FBF4E4);border:1.5px solid var(--line,rgba(43,29,22,.16))}.cd .xs-strip>p{margin:0 0 .6rem;font:800 .92rem/1.3 Heebo,sans-serif}.cd .xs-strip>p span{display:block;font-weight:400;font-size:.8rem;color:var(--ink-soft,#67503F)}.cd .xs-row{display:flex;gap:.6rem;overflow-x:auto;scrollbar-width:none}.cd .xs-row::-webkit-scrollbar{display:none}.cd .xs-tile{flex:0 0 31%;min-width:92px;display:grid;justify-items:center;gap:.2rem;text-align:center;padding:.55rem .4rem .6rem;border-radius:14px;background:var(--cream,#FFF8EC);border:1.5px solid var(--line,rgba(43,29,22,.16))}.cd .xs-tile img{width:44px;height:56px;object-fit:contain}.cd .xs-tile b{font:800 .82rem/1.2 Heebo,sans-serif}.cd .xs-tile button{width:100%;margin-top:.2rem;font:800 .8rem/1 Heebo,sans-serif;padding:.5rem .3rem;border-radius:999px;border:1.5px solid var(--red,#A3121B);color:var(--red,#A3121B);background:transparent;cursor:pointer}.cd .xs-tile button:hover{background:var(--red,#A3121B);color:#fff}.cd .xs-tile button[aria-busy=true]{opacity:.6;pointer-events:none}
/*# sourceMappingURL=/cdn/shop/t/10/assets/yansh-mix.css.map */