@layer bricks {.brxe-icon{font-size:60px}svg.brxe-icon{font-size:inherit}}@layer bricks {.brxe-text-link{gap:5px}.brxe-text-link,.brxe-text-link span{align-items:center;display:inline-flex}.brxe-text-link span{justify-content:center}.brxe-text-link .icon{flex-shrink:0}}@layer bricks {:where(.brxe-heading).has-separator{align-items:center;display:inline-flex;gap:20px}:where(.brxe-heading)>[contenteditable]{display:inline-block;text-decoration:inherit}:where(.brxe-heading) .separator{border-top:1px solid;flex-grow:1;flex-shrink:0;height:1px}}#brxe-kcs023 {gap: 4px; flex-direction: row-reverse}.brxe-kcs031 .brxe-kcs034.brxe-block {row-gap: 0px; flex-grow: 1; width: auto; min-width: 0px}.brxe-kcs031 .brxe-kcs032.brxe-block {align-items: center; column-gap: 10px; flex-direction: row; flex-wrap: nowrap}#brxe-kcs041 {align-items: center; column-gap: 10px; flex-direction: row; flex-wrap: nowrap; justify-content: center}#brxe-kcsa00 {align-items: center; column-gap: 6px; flex-direction: row; flex-wrap: nowrap}#brxe-kcsa10 {align-items: center; column-gap: 6px; flex-direction: row; flex-wrap: nowrap}#brxe-kcsa20 {align-items: center; column-gap: 6px; flex-direction: row; flex-wrap: nowrap}#brxe-kcsa30 {align-items: center; column-gap: 6px; flex-direction: row; flex-wrap: nowrap}#brxe-kcsa40 {align-items: center; column-gap: 6px; flex-direction: row; flex-wrap: nowrap}#brxe-kcsa50 {align-items: center; column-gap: 6px; flex-direction: row; flex-wrap: nowrap}.kb-csheet { inline-size: min(100%, 560px); max-block-size: 86dvh; margin-inline: auto; overflow-y: auto; overscroll-behavior: contain; gap: 14px; padding: 10px var(--kb-gutter, 16px) calc(20px + env(safe-area-inset-bottom, 0px)); border-radius: 28px 28px 0 0; background: var(--kb-surface, #fff); box-shadow: 0 -20px 50px rgb(4 37 31 / .22); } .brx-popup:not(.hide) .kb-csheet { animation: kb-csheet-in 560ms cubic-bezier(.22, 1, .36, 1) both; } .brx-popup.kb-closing .kb-csheet { animation: kb-csheet-out 600ms cubic-bezier(.64, 0, .78, 0) both; } .brx-popup.kb-closing { animation: kb-csheet-fade 900ms ease both; }@keyframes kb-csheet-in { from { translate: 0 105%; } to { translate: 0 0; } }@keyframes kb-csheet-out { from { translate: 0 0; } to { translate: 0 105%; } }@keyframes kb-csheet-fade { 0% { opacity: 1; } 60% { opacity: 0; } 100% { opacity: 0; } } .kb-csheet .kb-csheet__grab { align-self: center; inline-size: 40px; block-size: 4px; border-radius: 4px; background: var(--kb-border-strong, #c9d3cd); } .kb-csheet .kb-csheet__head { flex-direction: row; align-items: center; justify-content: space-between; } .kb-csheet .kb-csheet__head h2 { margin: 0; color: var(--kb-text-heading, #17241f); font-size: var(--text-l); font-weight: 700; } .kb-csheet .kb-csheet__x { position: relative; flex: none; inline-size: var(--kb-hit, 44px); block-size: var(--kb-hit, 44px); padding: 0; border: 0; border-radius: 50%; cursor: pointer; background: var(--kb-surface-alt, #f1f5f1) linear-gradient(45deg, transparent calc(50% - .75px), var(--kb-text, #17241f) calc(50% - .75px) calc(50% + .75px), transparent calc(50% + .75px)) center / 15px 15px no-repeat; } .kb-csheet .kb-csheet__x::after { content: ""; position: absolute; inset: 0; background: linear-gradient(-45deg, transparent calc(50% - .75px), var(--kb-text, #17241f) calc(50% - .75px) calc(50% + .75px), transparent calc(50% + .75px)) center / 15px 15px no-repeat; } .kb-csheet .kb-csheet__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; inline-size: 100%; margin: 0; padding: 0; list-style: none; align-items: stretch; } .kb-csheet .kb-ctile { flex-direction: row; align-items: center; gap: 10px; block-size: 100%; padding: 12px; border-radius: var(--kb-radius-m, 16px); background: linear-gradient(140deg, var(--kb-primary-tint, #e5f7f2), var(--kb-surface, #fff)); box-shadow: inset 0 0 0 1px var(--kb-primary-soft, #cfe6dd); color: var(--kb-text-heading, #17241f); text-decoration: none; } .kb-csheet .kb-ctile .brxe-text-basic { color: inherit; } .kb-csheet .kb-ctile__n { font-size: var(--text-s); font-weight: 700; line-height: 1.5; } .kb-csheet .kb-ctile__c { color: var(--kb-text-muted, #5c6b64); font-size: 11px; } .kb-csheet .kb-mcat { flex: none; display: grid; place-items: center; inline-size: 40px; block-size: 40px; border-radius: 12px; background: var(--kb-surface, #fff); box-shadow: inset 0 0 0 1px var(--kb-primary-soft, #cfe6dd); color: var(--kb-primary, #14544a); --kb-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E"); } .kb-csheet .kb-mcat::before { content: ""; inline-size: 20px; block-size: 20px; background: currentColor; -webkit-mask: var(--kb-ico) center / contain no-repeat; mask: var(--kb-ico) center / contain no-repeat; } .kb-csheet .kb-mcat[data-cat="cooking"] { --kb-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12h20'/%3E%3Cpath d='M20 12v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-8'/%3E%3Cpath d='m4 8 16-4'/%3E%3Cpath d='m8.86 6.78-.45-1.81a2 2 0 0 1 1.45-2.43l1.94-.48a2 2 0 0 1 2.43 1.46l.45 1.8'/%3E%3C/svg%3E"); } .kb-csheet .kb-mcat[data-cat="cleaning"] { --kb-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.94 15.5A2 2 0 0 0 8.5 14.06l-6.14-1.58a.5.5 0 0 1 0-.96L8.5 9.94A2 2 0 0 0 9.94 8.5l1.58-6.14a.5.5 0 0 1 .96 0l1.58 6.14a2 2 0 0 0 1.44 1.44l6.14 1.58a.5.5 0 0 1 0 .96l-6.14 1.58a2 2 0 0 0-1.44 1.44l-1.58 6.14a.5.5 0 0 1-.96 0z'/%3E%3C/svg%3E"); } .kb-csheet .kb-mcat[data-cat="garment-care"] { --kb-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.38 3.46 16 2a4 4 0 0 1-8 0L3.62 3.46a2 2 0 0 0-1.34 2.23l.58 3.47a1 1 0 0 0 .99.84H6v10c0 1.1.9 2 2 2h8a2 2 0 0 0 2-2V10h2.15a1 1 0 0 0 .99-.84l.58-3.47a2 2 0 0 0-1.34-2.23z'/%3E%3C/svg%3E"); } .kb-csheet .kb-csheet__sub { margin: 4px 0 0; color: var(--kb-text-subtle, #7b8a83); font-size: var(--text-xs); font-weight: 600; } .kb-csheet .kb-qgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; inline-size: 100%; margin: 0; padding: 0; list-style: none; } .kb-csheet .kb-qlink { justify-content: flex-start; min-inline-size: 0; padding: 10px 6px; border-radius: 14px; background: var(--kb-surface-alt, #f1f5f1); color: var(--kb-text, #17241f); text-decoration: none; } .kb-csheet .kb-qlink .brxe-icon { flex: none; color: var(--kb-accent-strong, #b86a12); font-size: 17px; line-height: 1; } .kb-csheet .kb-qlink .brxe-text-basic { min-inline-size: 0; overflow: hidden; color: inherit; font-size: 12px; font-weight: 500; line-height: 1.5; white-space: nowrap; text-overflow: ellipsis; }@media (hover: hover) { .kb-csheet :is(.kb-ctile, .kb-qlink):hover { box-shadow: inset 0 0 0 1px var(--kb-primary, #14544a); } } .kb-csheet :is(.kb-ctile, .kb-qlink):focus-visible { outline: 2px solid var(--kb-focus, #0d3a33); outline-offset: 2px; }@media (prefers-reduced-motion: reduce) { .brx-popup .kb-csheet, .brx-popup.kb-closing, .brx-popup.kb-closing .kb-csheet { animation: none; } }.brx-popup[data-popup-id="1307"] .brx-popup-content { position: fixed; inset: auto 0 0 0; inline-size: 100%; max-inline-size: 100%; padding: 0; overflow: visible; background: none; }.kb-csheet .kb-csheet__more { margin-inline-start: auto; margin-inline-end: 10px; color: var(--kb-primary, #14544a); font-size: var(--text-xs); font-weight: 600; text-decoration: none; } .kb-csheet .kb-csheet__more i { font-size: 12px; }.kb-csheet .kb-ctile { min-inline-size: 0; padding: 10px 12px; } .kb-csheet .kb-ctile .kb-mcat { inline-size: 36px; block-size: 36px; border-radius: 11px; } .kb-csheet .kb-ctile .kb-mcat::before { inline-size: 18px; block-size: 18px; } .kb-csheet .kb-ctile__n { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .kb-csheet .kb-csheet__all { grid-column: 1 / -1; } .kb-csheet .kb-csheet__all .kb-ctile { justify-content: center; padding-block: 9px; background: var(--kb-surface, #fff); } .kb-csheet .kb-qgrid { gap: 6px; }.kb-csheet .kb-mcat[data-cat="coffee-tea"] { --kb-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 2v2'/%3E%3Cpath d='M14 2v2'/%3E%3Cpath d='M16 8a1 1 0 0 1 1 1v8a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V9a1 1 0 0 1 1-1h14a4 4 0 1 1 0 8h-1'/%3E%3Cpath d='M6 2v2'/%3E%3C/svg%3E"); } .kb-csheet .kb-mcat[data-cat="food-prep"] { --kb-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 2v7c0 1.1.9 2 2 2h4a2 2 0 0 0 2-2V2'/%3E%3Cpath d='M7 2v20'/%3E%3Cpath d='M21 15V2a5 5 0 0 0-5 5v6c0 1.1.9 2 2 2h3Zm0 0v7'/%3E%3C/svg%3E"); } .kb-csheet .kb-mcat[data-cat="cooling-heating"] { --kb-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.827 16.379a6.082 6.082 0 0 1-8.618-7.002l5.412 1.45a6.082 6.082 0 0 1 7.002-8.618l-1.45 5.412a6.082 6.082 0 0 1 8.618 7.002l-5.412-1.45a6.082 6.082 0 0 1-7.002 8.618l1.45-5.412Z'/%3E%3Cpath d='M12 12v.01'/%3E%3C/svg%3E"); } .kb-csheet .kb-mcat[data-cat="beauty-health"] { --kb-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z'/%3E%3C/svg%3E"); }