:root {
    --knot-black: #000;
    --knot-white: #fff;
    --knot-page: #fff;
    --knot-surface: #fff;
    --knot-surface-raised: #fff;
    --knot-surface-muted: #f5f5f5;
    --knot-surface-disabled: #f1f1f1;
    --knot-text: #111;
    --knot-muted: #686868;
    --knot-border: rgba(0,0,0,.16);
    --knot-border-strong: rgba(0,0,0,.34);
    --knot-control: #fff;
    --knot-primary: #111;
    --knot-on-primary: #fff;
    --knot-focus: #111;
    --knot-overlay: rgba(0,0,0,.50);
    --knot-danger: #b11226;
    --knot-success: #2d5f3f;
    --knot-ease: cubic-bezier(.2, .7, .2, 1);
    --knot-fast: 160ms;
    --knot-med: 240ms;
    --knot-nav-height: 62px;
    --navbar-scrolled-bg: #fff;
    --navbar-border: rgba(0,0,0,.10);
    --navbar-shadow: rgba(0,0,0,.08);
    --drawer-bg: #fff;
    --drawer-section-bg: #fff;
    --drawer-text: #111;
    --drawer-muted: #666;
    --drawer-border: rgba(0,0,0,.13);
    --drawer-control-bg: rgba(255,255,255,.14);
    --drawer-control-hover: rgba(0,0,0,.06);
    --drawer-overlay: rgba(10,10,10,.42);
    --glass-background: rgba(245,245,245,.22);
    --glass-background-strong: rgba(255,255,255,.38);
    --glass-border: rgba(255,255,255,.55);
    --glass-dark-border: rgba(20,20,20,.14);
    --glass-highlight: rgba(255,255,255,.72);
    --glass-shadow: rgba(0,0,0,.16);
    --glass-blur: 18px;
    --glass-saturation: 145%;
    --glass-radius: 28px;
    --store-drawer-width: 420px;
    --store-drawer-max-width: 88vw;
    --store-drawer-padding: 32px;
    color-scheme: light;
}

* { box-sizing: border-box; }
html { background: var(--knot-page); }
body { margin: 0; font-family: Arial, Helvetica, sans-serif; background: var(--knot-page); color: var(--knot-text); padding-bottom: 60px; overflow-x: hidden; transition: background-color var(--knot-fast) var(--knot-ease), color var(--knot-fast) var(--knot-ease); }
body.knot-cart-open { overflow: hidden; }
a { color: inherit; }
button, input, textarea, select { font: inherit; }
button, .knot-btn, .knot-viewall, .knot-cart-primary, .knot-cart-secondary, .knot-cart-empty button, .knot-pay-now, .size-btn, .knot-edit-product-btn, .knot-small-outline, .knot-pill { transition: color var(--knot-fast) var(--knot-ease), background-color var(--knot-fast) var(--knot-ease), border-color var(--knot-fast) var(--knot-ease), opacity var(--knot-fast) var(--knot-ease), transform var(--knot-fast) var(--knot-ease); }
button:not(:disabled):hover, .knot-btn:hover, .knot-viewall:hover, .knot-cart-primary:hover, .knot-cart-secondary:hover, .knot-cart-empty button:not(:disabled):hover, .knot-pay-now:not(:disabled):hover, .size-btn:not(:disabled):hover, .knot-edit-product-btn:not(:disabled):hover, .knot-small-outline:not(:disabled):hover, .knot-pill:hover { transform: translateY(-1px); }
button:not(:disabled):active, .knot-btn:active, .knot-viewall:active, .knot-cart-primary:active, .knot-cart-secondary:active, .knot-cart-empty button:not(:disabled):active, .knot-pay-now:not(:disabled):active, .size-btn:not(:disabled):active, .knot-edit-product-btn:not(:disabled):active, .knot-small-outline:not(:disabled):active, .knot-pill:active { transform: translateY(0); }
.container { width: min(1180px, calc(100% - 32px)); margin: 0 auto; }
.text-center, .knot-center { text-align: center; }
.py-4 { padding-block: 24px; }
.py-5 { padding-block: 48px; }

.knot-topbar { position: sticky; top: 0; z-index: 32; background: #fff; color: #111; border-bottom: 1px solid var(--navbar-border); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.knot-nav { width: min(1180px, calc(100% - 32px)); margin: 0 auto; height: var(--knot-nav-height); display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.knot-public-topbar .knot-nav { width: 100%; padding-inline: clamp(16px, 3vw, 44px); display: grid; grid-template-columns: 1fr auto 1fr; gap: 0; }
.knot-public-topbar .knot-brand { grid-column: 2; justify-self: center; }
.knot-public-topbar .knot-nav-links { grid-column: 3; justify-self: end; }
.knot-brand { display: inline-flex; align-items: center; flex: 0 0 auto; line-height: 1; text-decoration: none; }
.knot-logo { width: 112px; height: auto; display: block; }
.knot-nav-links { --nav-utility-gap: 14px; display: flex; align-items: center; gap: var(--nav-utility-gap); min-height: 44px; font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.knot-nav-links a { text-decoration: none; }
.knot-nav-links button, .knot-link-button, .knot-table-actions button { background: none; border: 0; padding: 0; cursor: pointer; font-weight: 700; text-decoration: underline; }
.knot-brand:focus-visible, .knot-nav-links a:focus-visible, .knot-nav-links button:focus-visible { outline: 2px solid var(--knot-focus); outline-offset: 4px; }
.knot-nav-links .knot-nav-icon-button { position: relative; width: 42px; height: 42px; display: inline-grid; place-items: center; flex: 0 0 42px; margin: 0; padding: 0; color: #111; border: 0; background: transparent; cursor: pointer; line-height: 0; text-decoration: none !important; vertical-align: middle; transition: color var(--knot-fast) var(--knot-ease), opacity var(--knot-fast) var(--knot-ease), transform var(--knot-fast) var(--knot-ease); }
.knot-nav-icon-button[hidden] { display: none; }
.knot-nav-icon-button:hover, .knot-nav-icon-button:focus-visible, .knot-nav-icon-button.is-active { color: var(--knot-primary); opacity: 1; }
.knot-nav-icon-button:hover, .knot-nav-icon-button:focus-visible { transform: translateY(-1px); }
.knot-nav-icon-button:active { transform: translateY(0); }
.knot-nav-icon { width: 21px; height: 21px; display: block; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.knot-desktop-search { position: relative; z-index: 5; width: 42px; height: 42px; flex: 0 0 42px; }
.knot-desktop-search-form { position: absolute; top: -2px; right: 0; width: 42px; height: 46px; display: flex; align-items: center; justify-content: flex-end; border: 1px solid transparent; border-radius: 999px; background: transparent; color: #111; overflow: hidden; transform-origin: right center; transition: width 360ms cubic-bezier(.22,1,.36,1), border-color 180ms ease, background-color 180ms ease; }
.knot-desktop-search.is-open .knot-desktop-search-form { width: min(360px, calc(100vw - 220px)); border-color: #111; background: #fff; }
.knot-desktop-search-form input { min-width: 0; flex: 1 1 auto; width: 0; height: 44px; padding: 0 10px 0 20px; border: 0; background: transparent; color: #111; outline: 0; opacity: 0; visibility: hidden; font: inherit; font-size: 14px; font-weight: 500; letter-spacing: .035em; text-transform: none; transition: opacity 180ms ease 80ms; }
.knot-desktop-search.is-open .knot-desktop-search-form input { opacity: 1; visibility: visible; }
.knot-desktop-search-form input::placeholder { color: #bdbdbd; opacity: 1; }
.knot-nav-links .knot-desktop-search-form button { width: 44px; height: 44px; display: grid; place-items: center; flex: 0 0 44px; padding: 0; border: 0; background: transparent; color: #111; cursor: pointer; text-decoration: none; }
.knot-desktop-search-form .knot-nav-icon { width: 24px; height: 24px; stroke-width: 1.75; }
.knot-desktop-search-form:focus-within { outline: 0; }
.knot-desktop-search-form button:hover { background: #f3f3f3; transform: none; outline: none; }
.knot-desktop-search-form button:focus-visible { background: #f3f3f3; box-shadow: inset 0 0 0 1px #111; outline: none; transform: none; }
.knot-cart-badge { position: absolute; top: 2px; right: 0; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 999px; background: #000; color: #fff; font-size: 11px; line-height: 18px; text-align: center; letter-spacing: 0; font-weight: 800; }
.knot-account-menu { position: relative; height: 40px; display: flex; align-items: center; }
.knot-account-panel { position: absolute; top: calc(100% + 8px); right: 0; min-width: 170px; padding: 8px; border: 1px solid var(--knot-border); background: var(--knot-surface-raised); z-index: 30; }
.knot-account-panel a, .knot-account-panel button { width: 100%; display: block; padding: 9px 10px; border: 0; background: var(--knot-surface-raised); color: var(--knot-text); text-align: left; text-decoration: none; font-size: 12px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; cursor: pointer; }
.knot-account-panel a:hover, .knot-account-panel button:hover, .knot-account-panel a:focus-visible, .knot-account-panel button:focus-visible { background: var(--knot-surface-muted); outline: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.knot-danger-link { color: var(--knot-danger); }
.admin-product-code { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; min-height: 25px; padding: 3px 8px; border: 1px solid var(--knot-border-strong); background: var(--knot-surface-muted); color: var(--knot-text); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 12px; font-weight: 800; letter-spacing: .12em; line-height: 1; }
.knot-admin-product-head { align-items: end; margin-top: 30px; }
.knot-admin-product-head h2 { margin: 0; }
.knot-admin-product-search { width: min(560px, 100%); display: flex; gap: 8px; }
.knot-admin-product-search input { min-width: 0; flex: 1 1 auto; }
.knot-admin-code-field { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 7px 12px; border-block: 1px solid var(--knot-border); padding: 14px 0; }
.knot-admin-code-field > span { font-weight: 800; }
.knot-admin-code-field small { grid-column: 1 / -1; color: var(--knot-muted); }
.knot-admin-product-code { display: flex; align-items: center; gap: 9px; margin: 2px 0 14px; color: var(--knot-muted); font-size: 12px; font-weight: 700; text-transform: uppercase; }

.knot-floating-categories { position: fixed; left: 0; right: 0; top: calc(var(--knot-nav-height) + 4px); z-index: 18; padding: 0 16px; pointer-events: none; transition: top var(--knot-fast) var(--knot-ease); }
.knot-floating-categories.is-scrolled { top: calc(var(--knot-nav-height) + 4px); }
.knot-floating-category-shell { position: relative; isolation: isolate; overflow: hidden; width: fit-content; max-width: min(1180px, 100%); margin: 0 auto; padding: 5px 9px; border: 1px solid var(--glass-border); border-radius: 999px; background: linear-gradient(135deg, rgba(255,255,255,.40), rgba(255,255,255,.12)); box-shadow: 0 10px 28px rgba(0,0,0,.14), inset 0 1px 0 var(--glass-highlight), inset 0 -1px 0 rgba(0,0,0,.08), inset 12px 0 22px rgba(255,255,255,.10), inset -12px 0 22px rgba(0,0,0,.035); backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation)) contrast(105%); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation)) contrast(105%); pointer-events: auto; --pointer-x: 50%; --pointer-y: 50%; }
.knot-floating-category-shell::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(circle at var(--pointer-x, 50%) var(--pointer-y, 50%), rgba(255,255,255,.54) 0%, rgba(255,255,255,.22) 22%, rgba(255,255,255,.05) 38%, transparent 58%); opacity: .76; transition: opacity var(--knot-fast) var(--knot-ease); }
.knot-floating-category-shell::after { content: ""; position: absolute; inset: 1px; z-index: -1; pointer-events: none; border-radius: inherit; background: linear-gradient(to bottom, rgba(255,255,255,.24), transparent 43%, rgba(255,255,255,.07)), radial-gradient(120% 180% at 50% -45%, rgba(255,255,255,.34), transparent 52%); box-shadow: inset 0 0 0 1px var(--glass-dark-border), inset 0 0 18px rgba(255,255,255,.12); }
.knot-floating-categories.is-scrolled .knot-floating-category-shell { background: rgba(245,245,245,.32); box-shadow: 0 12px 30px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.74), inset 0 -1px 0 rgba(0,0,0,.08); }
.knot-category-row.knot-floating-category-row { flex-wrap: nowrap; align-items: center; justify-content: flex-start; gap: 8px; margin-bottom: 0; max-width: 100%; min-height: 32px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; white-space: nowrap; }
.knot-floating-category-row::-webkit-scrollbar { display: none; }
.knot-floating-category-row .knot-pill { position: relative; overflow: hidden; isolation: isolate; flex: 0 0 auto; height: 32px; min-height: 32px; display: inline-flex; align-items: center; justify-content: center; padding: 0 15px; border-color: rgba(25,25,25,.28); background: rgba(255,255,255,.20); color: #111; line-height: 1; box-shadow: inset 0 1px 0 rgba(255,255,255,.60), inset 0 -1px 0 rgba(0,0,0,.07), 0 2px 7px rgba(0,0,0,.08); backdrop-filter: blur(10px) saturate(130%) contrast(103%); -webkit-backdrop-filter: blur(10px) saturate(130%) contrast(103%); transition: background var(--knot-fast) var(--knot-ease), border-color var(--knot-fast) var(--knot-ease), box-shadow var(--knot-fast) var(--knot-ease), transform var(--knot-fast) var(--knot-ease); --button-pointer-x: 50%; --button-pointer-y: 45%; }
.knot-floating-category-row .knot-pill::before { content: ""; position: absolute; inset: 1px; z-index: -1; border-radius: inherit; pointer-events: none; background: radial-gradient(circle at var(--button-pointer-x, 50%) var(--button-pointer-y, 45%), rgba(255,255,255,.62) 0%, rgba(255,255,255,.24) 28%, transparent 62%), linear-gradient(135deg, rgba(255,255,255,.42), transparent 48%, rgba(255,255,255,.10)); opacity: .68; }
.knot-floating-category-row .knot-pill::after { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none; background: linear-gradient(to bottom, rgba(255,255,255,.36), transparent 42%, rgba(0,0,0,.035)); box-shadow: inset 0 0 0 1px rgba(255,255,255,.20); }
.knot-floating-category-row .knot-pill:hover { border-color: rgba(10,10,10,.45); background: rgba(255,255,255,.34); box-shadow: inset 0 1px 0 rgba(255,255,255,.78), 0 5px 12px rgba(0,0,0,.11); }
.knot-floating-category-row .knot-pill.is-active { border-color: rgba(0,0,0,.46); background: linear-gradient(135deg, rgba(255,255,255,.58), rgba(255,255,255,.30)); box-shadow: inset 0 1px 0 rgba(255,255,255,.88), inset 0 -1px 0 rgba(0,0,0,.08), 0 4px 12px rgba(0,0,0,.12), 0 0 0 1px rgba(255,255,255,.22); font-weight: 800; }
.knot-floating-category-row .knot-pill:focus-visible { outline: 2px solid #111; outline-offset: 3px; }
.knot-listing-categories { position: sticky; top: calc(var(--knot-nav-height) + 10px); z-index: 14; display: flex; justify-content: center; margin: -12px 0 30px; padding: 8px 0; pointer-events: none; }
.knot-listing-categories .knot-floating-category-shell { max-width: 100%; pointer-events: auto; }

.knot-cart-overlay { position: fixed; inset: 0; z-index: 40; background: var(--drawer-overlay); opacity: 0; transition: opacity var(--knot-med) var(--knot-ease); }
.knot-cart-overlay.is-open { opacity: 1; }
.knot-cart-drawer, .knot-menu-drawer { width: min(var(--store-drawer-width), var(--store-drawer-max-width)); max-width: 100%; height: 100vh; height: 100dvh; }
.knot-cart-drawer { position: fixed; top: 0; right: 0; z-index: 41; min-width: 0; background: var(--drawer-bg); color: var(--drawer-text); display: flex; flex-direction: column; transform: translateX(100%); transition: transform var(--knot-med) var(--knot-ease); border-left: 1px solid var(--drawer-border); box-shadow: -16px 0 44px var(--navbar-shadow); backdrop-filter: saturate(125%) blur(12px); -webkit-backdrop-filter: saturate(125%) blur(12px); will-change: transform; }
.knot-cart-drawer.is-open { transform: translateX(0); }
.knot-cart-drawer[hidden], .knot-cart-overlay[hidden] { display: none; }
.knot-cart-drawer-head { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 28px var(--store-drawer-padding) 18px; border-bottom: 1px solid var(--drawer-border); }
.knot-cart-drawer-head h2 { margin: 0; font-size: 26px; }
.knot-drawer-close { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--drawer-border); background: var(--drawer-control-bg); color: var(--drawer-text); cursor: pointer; }
.knot-drawer-close:hover, .knot-drawer-close:focus-visible { background: var(--drawer-control-hover); }
.knot-cart-error { flex: 0 0 auto; margin: 12px var(--store-drawer-padding) 0; border: 1px solid #b11226; color: #b11226; padding: 9px 10px; font-size: 13px; font-weight: 700; }
.knot-cart-items { flex: 1 1 auto; min-height: 0; overflow-x: hidden; overflow-y: auto; padding: 0 var(--store-drawer-padding); }
.knot-cart-items.is-empty { display: grid; place-items: center; }
.knot-cart-row { display: grid; grid-template-columns: minmax(0, 1fr) 34px; gap: 14px 12px; padding: 20px 0; border-bottom: 1px solid var(--drawer-border); }
.knot-cart-product { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 12px; align-items: center; min-width: 0; }
.knot-cart-product img { width: 58px; height: 58px; object-fit: cover; border: 1px solid var(--knot-border); background: var(--knot-surface-muted); }
.knot-cart-product strong { display: block; font-size: 13px; line-height: 1.35; overflow-wrap: anywhere; }
.knot-cart-mobile-size { display: block; color: var(--drawer-muted); font-size: 12px; margin-top: 4px; }
.knot-cart-line-meta { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-left: 70px; }
.knot-cart-qty { display: inline-grid; grid-template-columns: 24px 26px 24px; align-items: center; height: 30px; border: 1px solid var(--knot-border-strong); }
.knot-cart-qty button { height: 28px; border: 0; background: var(--knot-control); color: var(--knot-muted); cursor: pointer; }
.knot-cart-qty button:disabled { opacity: .35; cursor: not-allowed; }
.knot-cart-qty span { text-align: center; font-size: 13px; }
.knot-cart-total { margin-left: auto; color: var(--drawer-text); font-size: 12px; font-weight: 700; white-space: nowrap; text-align: right; }
.knot-cart-remove { align-self: start; justify-self: end; width: 34px; height: 34px; display: grid; place-items: center; border: 0; background: transparent; color: var(--drawer-text); cursor: pointer; }
.knot-cart-empty { width: 100%; max-width: 340px; padding: 32px 10px; color: var(--drawer-text); text-align: center; }
.knot-cart-empty h3 { margin: 0 0 6px; font-size: 22px; line-height: 1.2; }
.knot-cart-empty p { margin: 0 0 26px; color: var(--drawer-muted); font-size: 13px; line-height: 1.45; }
.knot-cart-empty a { color: var(--drawer-text); text-underline-offset: 2px; }
.knot-cart-bottom { flex: 0 0 auto; margin-top: auto; padding: 18px var(--store-drawer-padding) 28px; border-top: 1px solid var(--drawer-border); background: var(--drawer-section-bg); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.knot-cart-subtotal { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 18px; font-size: 15px; }
.knot-cart-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.knot-cart-primary, .knot-cart-secondary, .knot-cart-empty button { min-height: 54px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--knot-primary); text-decoration: none; font-size: 17px; font-weight: 900; cursor: pointer; }
.knot-cart-primary { background: var(--knot-primary); color: var(--knot-on-primary); }
.knot-cart-secondary, .knot-cart-empty button { background: var(--knot-control); color: var(--knot-text); }
.knot-cart-empty button { width: auto; min-width: 190px; min-height: 46px; padding: 0 22px; border-radius: 0; background: var(--knot-primary); color: var(--knot-on-primary); font-size: 14px; }
.knot-drawer-close:focus-visible, .knot-cart-remove:focus-visible, .knot-cart-qty button:focus-visible, .knot-cart-primary:focus-visible, .knot-cart-secondary:focus-visible, .knot-cart-empty button:focus-visible { outline: 2px solid var(--knot-focus); outline-offset: 3px; }

.knot-alert { margin: 16px auto 0; width: min(1180px, calc(100% - 32px)); border: 1px solid var(--knot-border-strong); background: var(--knot-surface-raised); color: var(--knot-text); padding: 12px 14px; font-weight: 700; }
.knot-alert-error { border-color: var(--knot-danger); color: var(--knot-danger); }

.knot-hero { position: relative; width: 100%; overflow: visible; background: var(--knot-page); }
.knot-hero-slider { position: relative; width: 100%; aspect-ratio: 16 / 9; background: var(--knot-page); }
.knot-hero-slide { position: absolute; inset: 0; display: grid; place-items: center; opacity: 0; transform: scale(1.008); transition: opacity 620ms cubic-bezier(.22,1,.36,1), transform 700ms cubic-bezier(.22,1,.36,1); background: var(--knot-page); }
.knot-hero-slide.active { opacity: 1; transform: scale(1); }
.knot-hero-slide img { width: 100%; height: 100%; object-fit: cover; object-position: center center; display: block; }
.knot-collection { padding: 44px 0; }
.knot-category-row { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 24px; }
.knot-pill { border: 1px solid var(--knot-border-strong); padding: 8px 14px; border-radius: 999px; text-decoration: none; font-weight: 700; font-size: 12px; }
.knot-sub-pill { border-color: var(--knot-border); color: var(--knot-muted); }
.knot-heading { font-size: 24px; letter-spacing: .02em; margin: 0 0 28px; }
.knot-space { margin-top: 28px; }

.knot-product-grid-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.knot-product-grid-list.knot-product-grid-edge { width: 100%; gap: 0; }
.knot-product-grid-list.knot-product-grid-related { gap: 14px; }
.knot-card-link { min-width: 0; position: relative; display: block; aspect-ratio: 1 / 1; overflow: hidden; color: inherit; text-decoration: none; background: var(--knot-surface-muted); }
body.knot-animate-ready .knot-card-link { opacity: 0; transform: translateY(12px); transition: opacity var(--knot-med) var(--knot-ease), transform var(--knot-med) var(--knot-ease); }
body.knot-animate-ready .knot-card-link.is-visible { opacity: 1; transform: translateY(0); }
.knot-product-grid-edge .knot-card-link { border-right: 1px solid var(--knot-border); border-bottom: 1px solid var(--knot-border); }
.knot-card-link .knot-product-card { position: absolute; inset: 0; overflow: hidden; background: var(--knot-surface-muted); color: var(--knot-text); }
.knot-card-link .knot-product-imgwrap { position: absolute; inset: 0; overflow: hidden; background: var(--knot-surface-muted); }
.knot-card-link .knot-product-img { width: 100%; height: 100%; padding: 0; object-fit: contain; object-position: center; display: block; background: var(--knot-surface-muted); transition: none; }
.knot-card-link:hover .knot-product-img, .knot-card-link:focus-visible .knot-product-img { transform: none; filter: none; }
.knot-card-link:focus-visible { z-index: 2; outline: 2px solid var(--knot-focus); outline-offset: -3px; }
.knot-card-link .knot-discount { position: absolute; z-index: 2; top: 14px; left: 14px; background: #111; color: #fff; padding: 5px 8px; border-radius: 999px; font-size: 11px; font-weight: 800; }
.knot-card-link .knot-product-meta { position: absolute; z-index: 1; right: 0; bottom: 0; left: 0; min-height: 88px; display: flex; align-items: center; flex-direction: column; justify-content: center; padding: 8px 10px 10px; border-top: 1px solid var(--knot-border); background: var(--knot-surface); color: var(--knot-text); text-align: center; transform: translateY(calc(100% - 12px)); transition: transform 420ms cubic-bezier(.22,1,.36,1), background-color 220ms ease; }
.knot-card-link:hover .knot-product-meta, .knot-card-link:focus-visible .knot-product-meta { background: var(--knot-surface-raised); transform: translateY(0); }
.knot-product-category { display: none; }
.knot-product-name { width: 100%; margin: 0; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; color: var(--knot-text); font-family: Georgia, 'Times New Roman', serif; font-size: 14px; font-weight: 600; letter-spacing: .04em; line-height: 1.2; text-align: center; white-space: normal; transition: transform 320ms cubic-bezier(.22,1,.36,1); }
.knot-card-link:hover .knot-product-name, .knot-card-link:focus-visible .knot-product-name { transform: translateY(-2px); }
.knot-product-bottom { display: flex; align-items: center; flex-direction: column; justify-content: center; gap: 2px; margin-top: 5px; font-size: 11px; }
.knot-price { color: var(--knot-text); font-size: 12px; line-height: 1.2; font-weight: 700; letter-spacing: .06em; }
.knot-price s { display: inline; margin-left: 6px; color: var(--knot-muted); font-size: 10px; font-weight: 400; opacity: .58; text-decoration-thickness: 1px; }
.knot-save { margin-top: 1px; color: var(--knot-muted); font-size: 9px; line-height: 1.1; white-space: nowrap; }
.knot-empty { padding: 60px 0; text-align: center; color: var(--knot-muted); }
.knot-viewall, .knot-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 10px 22px; background: var(--knot-primary); color: var(--knot-on-primary); border: 1px solid var(--knot-primary); text-decoration: none; cursor: pointer; font-weight: 800; letter-spacing: .08em; }
.knot-btn.outline, .knot-viewall { background: var(--knot-control); color: var(--knot-text); }

.knot-tagline { border-top: 1px solid var(--knot-border); background: var(--knot-page); margin-top: 72px; }
.knot-tagline-text { letter-spacing: .45em; font-size: 13px; }
.knot-footer { background: #050505; color: #f5f5f5; margin-top: 0; }
.knot-footer-inner { width: min(1280px, 100%); margin: 0 auto; padding: 64px 32px 28px; }
.knot-footer-grid { display: grid; grid-template-columns: 1.1fr .8fr 1fr 1.45fr; gap: 48px; }
.knot-footer-section h2 { margin: 0 0 18px; color: #f5f5f5; font-size: 14px; letter-spacing: .12em; text-transform: uppercase; }
.knot-footer-brand h2 { font-size: 28px; letter-spacing: .08em; }
.knot-footer-section p, .knot-footer-section a, .knot-footer-bottom { color: #a3a3a3; }
.knot-footer-section p { margin: 0; line-height: 1.6; }
.knot-footer-section ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 11px; }
.knot-footer a { text-decoration: none; transition: color .18s ease, transform .18s ease; }
.knot-footer a:hover, .knot-footer a:focus-visible { color: #f5f5f5; transform: translateY(-1px); }
.knot-footer a:focus-visible { outline: 1px solid rgba(255,255,255,.72); outline-offset: 4px; }
.knot-footer-contact address { display: grid; gap: 12px; font-style: normal; }
.knot-footer-contact-row { display: grid; grid-template-columns: 22px 1fr; gap: 12px; align-items: start; line-height: 1.55; }
.knot-footer-contact-row:hover .knot-footer-icon, .knot-footer-social a:hover .knot-footer-icon { transform: translateY(-1px); stroke: #f5f5f5; }
.knot-footer-icon { width: 21px; height: 21px; stroke: #d6d6d6; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; transition: stroke .18s ease, transform .18s ease; }
.knot-footer-social { display: flex; flex-wrap: wrap; gap: 12px 18px; margin-top: 22px; }
.knot-footer-social a { display: inline-flex; align-items: center; gap: 8px; min-height: 30px; }
.knot-footer-bottom { border-top: 1px solid rgba(255,255,255,.12); margin-top: 48px; padding-top: 24px; display: flex; justify-content: space-between; gap: 24px; align-items: center; font-size: 13px; }
.knot-footer-bottom p { margin: 0; }
.knot-footer-bottom nav { display: flex; flex-wrap: wrap; gap: 16px; }
.knot-footer-mobile { display: none; }
.knot-static-page { max-width: 760px; }
.knot-static-page p { color: var(--knot-muted); line-height: 1.75; }

.knot-page { padding: 42px 0 34px; }
.knot-page-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.knot-page h1 { margin: 0 0 20px; font-size: 30px; }
.knot-listing-page.container { width: 100%; max-width: none; padding-inline: 0; }
.knot-listing-page .knot-page-head { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.knot-listing-page .knot-product-load-zone { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.knot-search { display: flex; gap: 8px; }
.knot-search input, .knot-form input, .knot-form textarea, .knot-form select { width: 100%; border: 1px solid var(--knot-border-strong); padding: 11px 12px; background: var(--knot-control); color: var(--knot-text); }
.knot-search button { border: 1px solid var(--knot-primary); background: var(--knot-primary); color: var(--knot-on-primary); padding: 0 16px; font-weight: 800; }
.knot-product-load-zone { min-height: 1px; text-align: center; }
.knot-product-load-sentinel { width: 100%; height: 1px; pointer-events: none; }
.knot-product-load-status { margin: 0; color: var(--knot-muted); font-size: 13px; }
.knot-product-load-zone.is-loading .knot-product-load-status { padding: 18px 0; }
.knot-product-load-zone.is-complete { display: none; }
.knot-product-load-retry { margin: 12px auto 0; border: 1px solid var(--knot-border-strong); background: var(--knot-control); color: var(--knot-text); min-height: 38px; padding: 7px 14px; cursor: pointer; font-weight: 800; }

.knot-pdp-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(340px, .75fr); gap: clamp(36px, 5vw, 80px); align-items: start; }
.knot-pdp-gallery-column, .knot-pdp-right { min-width: 0; min-height: 0; align-self: start; }
.knot-pdp-main { width: 100%; border: 1px solid var(--knot-border); padding: 14px; aspect-ratio: 1 / 1; }
.knot-pdp-main { background: var(--knot-surface); }
.knot-pdp-main img { width: 100%; height: 100%; object-fit: contain; display: block; background: var(--knot-surface-muted); transition: opacity var(--knot-fast) var(--knot-ease); }
.knot-pdp-main img.is-switching { opacity: .12; }
.knot-pdp-zoom-trigger { position: relative; display: block; color: var(--knot-text); cursor: zoom-in; overflow: hidden; }
.knot-pdp-zoom-trigger:hover, .knot-pdp-zoom-trigger:active { transform: none; }
.knot-pdp-zoom-trigger:focus-visible { outline: 2px solid var(--knot-focus); outline-offset: 3px; }
.knot-pdp-zoom-cue { position: absolute; right: 25px; bottom: 25px; width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--knot-border); background: color-mix(in srgb, var(--knot-surface) 86%, transparent); opacity: 0; transform: translateY(5px); transition: opacity var(--knot-fast) var(--knot-ease), transform var(--knot-fast) var(--knot-ease); }
.knot-pdp-zoom-trigger:hover .knot-pdp-zoom-cue, .knot-pdp-zoom-trigger:focus-visible .knot-pdp-zoom-cue { opacity: 1; transform: translateY(0); }
.knot-pdp-zoom-icon { width: 18px; height: 18px; stroke: currentColor; stroke-width: 1.7; }
.knot-pdp-thumbs { display: flex; gap: 12px; margin-top: 12px; flex-wrap: wrap; }
.knot-thumb-btn { width: 110px; aspect-ratio: 1; border: 1px solid var(--knot-border); background: var(--knot-control); padding: 8px; cursor: pointer; }
.knot-thumb-btn img { width: 100%; height: 100%; object-fit: contain; display: block; }
.knot-thumb-btn.active { border-color: var(--knot-text); }
body.knot-lightbox-open { overflow: hidden; }
.knot-product-lightbox { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 28px; opacity: 0; transition: opacity 220ms var(--knot-ease); }
.knot-product-lightbox[hidden] { display: none; }
.knot-product-lightbox.is-open { opacity: 1; }
.knot-product-lightbox-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.88); }
.knot-product-lightbox-panel { position: relative; z-index: 1; width: min(1100px, 94vw); height: min(88vh, 900px); display: grid; grid-template-columns: 56px minmax(0, 1fr) 56px; grid-template-rows: minmax(0, 1fr) auto; align-items: center; gap: 14px; color: #fff; }
.knot-product-lightbox-stage { grid-column: 2; grid-row: 1; width: 100%; height: 100%; margin: 0; display: grid; place-items: center; overflow: auto; cursor: zoom-in; }
.knot-product-lightbox-stage.is-zoomed { cursor: zoom-out; }
.knot-product-lightbox-stage img { width: 100%; height: 100%; display: block; object-fit: contain; transform: scale(1); transform-origin: center; transition: opacity 180ms var(--knot-ease), transform 240ms var(--knot-ease); }
.knot-product-lightbox-stage.is-zoomed img { transform: scale(1.8); }
.knot-product-lightbox-stage img.is-switching { opacity: .15; }
.knot-product-lightbox-close, .knot-product-lightbox-arrow { border: 1px solid rgba(255,255,255,.32); background: rgba(0,0,0,.22); color: #fff; cursor: pointer; }
.knot-product-lightbox-close:hover, .knot-product-lightbox-arrow:hover { border-color: rgba(255,255,255,.78); background: rgba(255,255,255,.1); }
.knot-product-lightbox-close { position: absolute; z-index: 2; top: 0; right: 0; width: 44px; height: 44px; display: grid; place-items: center; }
.knot-product-lightbox-arrow { width: 48px; height: 56px; display: grid; place-items: center; }
.knot-product-lightbox-arrow.previous { grid-column: 1; grid-row: 1; }
.knot-product-lightbox-arrow.next { grid-column: 3; grid-row: 1; }
.knot-product-lightbox-arrow[hidden] { display: none; }
.knot-product-lightbox-icon { width: 22px; height: 22px; stroke: currentColor; stroke-width: 1.5; }
.knot-product-lightbox-tools { grid-column: 2; grid-row: 2; display: flex; align-items: center; justify-content: center; gap: 24px; min-height: 42px; font-size: 12px; }
.knot-product-lightbox-tools button { border: 0; border-bottom: 1px solid rgba(255,255,255,.55); padding: 6px 0; background: transparent; color: #fff; cursor: pointer; }
.knot-p-badge { font-size: 12px; color: var(--knot-muted); letter-spacing: .08em; margin-bottom: 10px; }
.knot-pdp-title { font-size: 30px; margin: 0 0 12px; }
.knot-pdp-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.knot-edit-product-btn { border: 1px solid var(--knot-border-strong); background: var(--knot-control); color: var(--knot-text); min-height: 34px; padding: 7px 10px; font-weight: 800; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.knot-edit-product-btn:hover, .knot-edit-product-btn:focus-visible { border-color: var(--knot-primary); }
.knot-pdp-price { font-size: 22px; font-weight: 800; margin-bottom: 8px; }
.knot-pdp-price s { margin-left: 8px; color: var(--knot-muted); font-size: .72em; font-weight: 400; opacity: .58; text-decoration-thickness: 1px; }
.knot-pdp-stock { color: var(--knot-muted); line-height: 1.7; }
.knot-pdp-info-scroll { max-height: none; overflow: visible; padding-right: 0; margin-top: 18px; }
.knot-pdp-desc { margin-top: 22px; color: var(--knot-muted); line-height: 1.55; }
.knot-pdp-info-scroll .knot-pdp-desc { margin-top: 0; }
.knot-desc-section { margin-top: 18px; }
.knot-desc-section h2 { margin: 0 0 6px; font-size: 15px; font-weight: 500; letter-spacing: .02em; }
.knot-desc-section ul { margin: 0; padding-left: 22px; }
.knot-desc-section li { margin: 4px 0; }
.knot-size-row { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; width: 100%; margin-top: 16px; }
.knot-pdp-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; width: 100%; margin-top: 16px; }
.knot-actions-row { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.size-btn { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-width: 0; height: 44px; padding: 0 8px; border: 1px solid var(--knot-border-strong); background: var(--knot-control); color: var(--knot-text); font-weight: 800; cursor: pointer; }
.knot-pdp-actions .knot-btn { width: 100%; min-width: 0; min-height: 46px; height: 46px; padding-inline: 12px; }
.knot-pdp-actions .knot-add-to-cart { background: #fff; color: #111; border-color: #111; }
.knot-pdp-actions .knot-buy-now { background: #111; color: #fff; border-color: #111; }
.size-active { background: var(--knot-primary); color: var(--knot-on-primary); border-color: var(--knot-primary); }
.size-disabled { background: var(--knot-surface-disabled); color: var(--knot-muted); cursor: not-allowed; opacity: .62; }
.knot-pdp-qty { display: inline-grid; grid-template-columns: 38px 42px 38px; align-items: center; height: 36px; border: 1px solid var(--knot-border-strong); margin-top: 16px; background: var(--knot-control); }
.knot-pdp-qty input { width: 42px; border: 0; text-align: center; background: var(--knot-control); color: var(--knot-text); }
.knot-pdp-qty input::-webkit-outer-spin-button, .knot-pdp-qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.knot-stepper-btn { height: 34px; border: 0; background: var(--knot-control); color: var(--knot-muted); cursor: pointer; font-size: 16px; }
.knot-size-chart-disclosure { max-width: 380px; margin-top: 26px; border-top: 1px solid var(--knot-border); border-bottom: 1px solid var(--knot-border); }
.knot-size-chart-disclosure summary { position: relative; list-style: none; padding: 13px 26px 13px 0; color: var(--knot-text); font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.knot-size-chart-disclosure summary::-webkit-details-marker { display: none; }
.knot-size-chart-disclosure summary::after { content: "+"; position: absolute; top: 50%; right: 2px; transform: translateY(-50%); color: var(--knot-muted); font-size: 18px; font-weight: 400; }
.knot-size-chart-disclosure[open] summary::after { content: "\2212"; }
.knot-size-chart-disclosure summary:focus-visible { outline: 2px solid var(--knot-focus); outline-offset: 3px; }
.knot-size-chart { max-width: 380px; padding-bottom: 12px; }
.knot-size-chart table { width: 100%; border-collapse: collapse; border: 0; box-shadow: none; margin: 0; }
.knot-size-chart th, .knot-size-chart td { border: 0; border-bottom: 1px solid var(--knot-border); background: transparent; color: var(--knot-text); text-align: left; padding: 10px 8px; font-size: 14px; }
.knot-size-chart th { color: var(--knot-muted); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.knot-size-chart tbody tr:last-child td { border-bottom: 0; }
.knot-product-customize-cta { max-width: 380px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-top: 16px; }
.knot-product-customize-cta p { margin: 0; color: var(--knot-muted); font-size: 13px; }
.knot-product-customize-button { min-height: 38px; padding: 8px 17px; flex: 0 0 auto; }
.knot-inline-product-form { display: contents; }
.knot-inline-field { display: grid; gap: 6px; color: var(--knot-muted); font-size: 12px; font-weight: 700; margin: 10px 0; }
.knot-inline-field input, .knot-inline-field select, .knot-inline-field textarea, .knot-inline-size-row input, .knot-inline-image-row input { border: 1px dashed var(--knot-border-strong); padding: 9px 10px; background: var(--knot-control); color: var(--knot-text); width: 100%; }
.knot-inline-field textarea { resize: vertical; min-height: 92px; line-height: 1.55; }
.knot-inline-edit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.knot-inline-edit-panel { border: 1px solid var(--knot-border); padding: 14px; margin-top: 14px; background: var(--knot-surface-raised); }
.knot-inline-edit-panel h2 { margin: 0 0 12px; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; }
.knot-inline-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.knot-inline-size-list { display: grid; gap: 10px; }
.knot-inline-size-row { display: grid; grid-template-columns: 1fr 110px auto; gap: 10px; align-items: end; }
.knot-inline-size-row.is-disabled { opacity: .55; }
.knot-small-outline { border: 1px solid var(--knot-primary); background: var(--knot-control); color: var(--knot-text); min-height: 38px; padding: 7px 10px; cursor: pointer; font-weight: 800; }
.knot-inline-image-list { display: grid; gap: 10px; }
.knot-inline-image-row { display: grid; grid-template-columns: 62px auto 100px auto; gap: 10px; align-items: center; }
.knot-inline-image-row img { width: 62px; height: 62px; object-fit: cover; border: 1px solid var(--knot-border); }
.knot-inline-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.knot-inline-message { min-height: 22px; margin-top: 10px; font-size: 13px; font-weight: 700; color: var(--knot-success); }
.knot-inline-message:not(:empty) { border: 1px solid var(--knot-border); padding: 9px 10px; }
.knot-related { width: 100%; padding-top: 0; margin-top: clamp(64px, 7vw, 112px); }
.knot-related-heading { width: min(1380px, calc(100% - 80px)); margin: 0 auto 16px; }
.knot-related-title { margin: 0; letter-spacing: .25em; font-size: 13px; }

.knot-table-wrap { overflow-x: auto; }
.knot-table { width: 100%; border-collapse: collapse; background: var(--knot-surface); color: var(--knot-text); }
.knot-table th, .knot-table td { border-bottom: 1px solid var(--knot-border); padding: 13px 10px; text-align: left; vertical-align: middle; }
.knot-clickable-row { cursor: pointer; }
.knot-clickable-row:hover td { filter: brightness(.96); }
.knot-table tr.knot-order-delivered td { background: #9dbca8; color: #173526; }
.knot-table tr.knot-order-cancelled td { background: #b99a9a; color: #3a1f1f; }
.knot-table tr.knot-order-date-row td { background: var(--knot-page); color: var(--knot-text); border-bottom: 1px solid var(--knot-border-strong); padding-top: 28px; font-size: 13px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.knot-line-product { display: flex; align-items: center; gap: 12px; }
.knot-line-product img { width: 64px; height: 64px; object-fit: cover; border: 1px solid var(--knot-border); }
.knot-qty { display: inline-flex; align-items: center; gap: 10px; }
.knot-qty button { width: 30px; height: 30px; border: 1px solid var(--knot-primary); background: var(--knot-control); color: var(--knot-text); cursor: pointer; }
.knot-table-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.knot-admin-thumb { width: 46px; height: 46px; object-fit: cover; display: block; border: 1px solid var(--knot-border); background: var(--knot-surface-muted); }
.knot-status-check { width: 30px; height: 30px; accent-color: var(--knot-primary); cursor: pointer; }
.knot-status-check:disabled { cursor: not-allowed; opacity: .45; }

.knot-form { display: grid; gap: 16px; }
.knot-form label { display: grid; gap: 7px; font-weight: 800; font-size: 13px; }
.knot-form textarea { min-height: 120px; resize: vertical; }
.knot-auth-switch { margin: 18px 0 0; text-align: center; color: var(--knot-muted); }
.knot-auth-switch a { color: var(--knot-text); font-weight: 800; text-underline-offset: 4px; }
.knot-auth-recovery { margin: 14px 0 0; text-align: center; }
.knot-auth-recovery a { color: var(--knot-text); font-weight: 700; text-underline-offset: 4px; }
.knot-auth-copy { margin: 0 0 22px; color: var(--knot-muted); line-height: 1.6; }
.knot-field-title { font-weight: 800; font-size: 13px; margin-bottom: 8px; }
.knot-size-admin-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.knot-narrow { width: min(520px, calc(100% - 32px)); margin-inline: auto; }

.knot-admin-login-page {
    min-height: 100vh;
    margin: 0;
    background: #fff;
    color: #111;
    font-family: Arial, sans-serif;
}
.knot-admin-login-shell {
    min-height: 100vh;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 32px;
    padding: 32px 20px;
}
.knot-admin-login-brand img { display: block; width: auto; height: 42px; object-fit: contain; }
.knot-admin-login-panel { width: min(440px, 100%); }
.knot-admin-login-panel h1 { margin: 6px 0 28px; font-size: clamp(28px, 4vw, 38px); }
.knot-admin-login-eyebrow { margin: 0; font-size: 12px; font-weight: 800; letter-spacing: 0; }
.knot-admin-login-panel .knot-form input { background: #fff; color: #111; border-color: #777; }
.knot-admin-login-panel .knot-btn { width: 100%; background: #111; color: #fff; border-color: #111; }
.knot-admin-login-panel .knot-auth-switch a { color: #111; }
.knot-check { display: flex !important; align-items: center; grid-template-columns: auto 1fr; gap: 10px; }
.knot-check input { width: auto; }
.knot-checkout-grid { display: grid; grid-template-columns: 1fr 360px; gap: 34px; align-items: start; }
.knot-summary { border: 1px solid var(--knot-border); padding: 18px; background: var(--knot-surface); }
.knot-summary img { width: 100%; aspect-ratio: 1; object-fit: contain; border: 1px solid var(--knot-border); }
.knot-onepage-checkout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(340px, .9fr); min-height: calc(100vh - 68px); border-top: 1px solid var(--knot-border); }
.knot-checkout-left { padding: 30px 20px 52px max(20px, calc((100vw - 1180px) / 2)); }
.knot-checkout-right { background: var(--knot-surface-muted); border-left: 1px solid var(--knot-border); padding: 28px max(20px, calc((100vw - 1180px) / 2)) 52px 28px; }
.knot-checkout-form { width: min(624px, 100%); margin-left: 0; display: grid; gap: 26px; font-size: 1.2rem; }
.knot-express { text-align: center; }
.knot-express-label { color: var(--knot-muted); font-size: 11px; margin-bottom: 8px; }
.knot-paypal-btn { width: 260px; max-width: 100%; height: 42px; border: 0; border-radius: 8px; background: #ffc439; color: #003087; font-weight: 900; font-style: italic; }
.knot-divider { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; color: var(--knot-muted); font-size: 11px; }
.knot-divider::before, .knot-divider::after { content: ""; height: 1px; background: var(--knot-border); }
.knot-checkout-section { display: grid; gap: 12px; }
.knot-checkout-section h2 { font-size: 22px; margin: 0; }
.knot-checkout-title-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.knot-checkout-title-row a { font-size: 12px; font-weight: 700; }
.knot-checkout-form label { display: grid; gap: 5px; font-size: 13px; color: var(--knot-muted); }
.knot-checkout-form input, .knot-checkout-form select, .knot-checkout-form textarea { width: 100%; min-height: 50px; border: 1px solid var(--knot-border-strong); border-radius: 8px; padding: 11px 13px; background: var(--knot-control); color: var(--knot-text); font-size: 15px; }
.knot-checkout-form textarea { min-height: 104px; resize: vertical; }
.knot-checkout-two { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.knot-muted-box { background: var(--knot-surface-disabled); border-radius: 8px; padding: 16px; color: var(--knot-muted); font-size: 12px; text-align: center; }
.knot-checkout-note { margin: -4px 0 2px; color: var(--knot-muted); font-size: 14px; }
.knot-payment-option { grid-template-columns: auto 1fr; display: grid !important; align-items: center; gap: 12px !important; min-height: 54px; border: 1px solid var(--knot-border); padding: 14px; background: var(--knot-surface); color: var(--knot-text) !important; font-size: 16px !important; }
.knot-payment-option input { width: auto; min-height: auto; }
.knot-payment-card { grid-template-columns: 20px 1fr; cursor: pointer; border-radius: 6px; }
.knot-payment-card:has(input:checked) { border-color: var(--knot-text); background: var(--knot-surface-raised); }
.knot-payment-card strong, .knot-payment-card small { display: block; }
.knot-payment-card strong { color: var(--knot-text); font-size: 15px; }
.knot-payment-card small { margin-top: 4px; color: var(--knot-muted); font-size: 12px; font-weight: 400; }
.knot-online-payment { display: grid; gap: 14px; border: 1px solid var(--knot-border); padding: 16px; background: var(--knot-surface-muted); }
.knot-online-payment[hidden] { display: none; }
.knot-online-payment p { margin: 6px 0 0; color: var(--knot-muted); font-size: 12px; line-height: 1.5; }
.knot-provider-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.knot-provider-option { display: flex !important; grid-template-columns: none !important; align-items: center; justify-content: center; gap: 8px !important; min-height: 44px; border: 1px solid var(--knot-border-strong); padding: 8px 10px; background: var(--knot-control); color: var(--knot-text) !important; cursor: pointer; font-weight: 800 !important; }
.knot-provider-option:has(input:checked) { border-color: var(--knot-text); background: var(--knot-primary); color: var(--knot-on-primary) !important; }
.knot-provider-option input { width: auto !important; min-height: auto !important; }
.knot-online-amount { display: flex; justify-content: space-between; gap: 16px; border-top: 1px solid var(--knot-border); padding-top: 12px; font-size: 13px; }
.knot-disabled-payments { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.knot-payment-option.is-disabled { opacity: .55; background: var(--knot-surface-disabled); cursor: not-allowed; user-select: none; }
.knot-radio-dot { width: 13px; height: 13px; border: 1px solid var(--knot-border-strong); border-radius: 999px; display: inline-block; }
.knot-pay-now { width: 100%; min-height: 58px; border: 0; border-radius: 10px; background: var(--knot-primary); color: var(--knot-on-primary); font-weight: 900; cursor: pointer; font-size: 17px; }
.knot-pay-now-mobile { display: none; }
.knot-summary-line { display: grid; grid-template-columns: 77px 1fr auto; gap: 14px; align-items: start; margin-bottom: 22px; }
.knot-summary-thumb { position: relative; width: 77px; height: 77px; border: 1px solid var(--knot-border); border-radius: 10px; background: var(--knot-surface-raised); }
.knot-summary-thumb img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; display: block; }
.knot-summary-thumb span { position: absolute; top: -8px; right: -8px; width: 24px; height: 24px; border-radius: 999px; background: var(--knot-primary); color: var(--knot-on-primary); font-size: 13px; display: grid; place-items: center; }
.knot-summary-name { font-size: 14px; text-transform: uppercase; line-height: 1.35; }
.knot-summary-variant { margin-top: 5px; color: var(--knot-muted); font-size: 14px; }
.knot-summary-line strong { font-size: 14px; white-space: nowrap; }
.knot-discount-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin: 16px 0 24px; }
.knot-discount-row input { min-height: 50px; border: 1px solid var(--knot-border); border-radius: 10px; padding: 11px 13px; background: var(--knot-control); color: var(--knot-text); font-size: 15px; }
.knot-discount-row button { border: 0; border-radius: 10px; padding: 0 19px; color: var(--knot-text); background: var(--knot-surface-disabled); font-size: 15px; cursor: pointer; }
.knot-discount-row button:disabled { cursor: wait; opacity: .62; }
.knot-coupon-message { min-height: 20px; margin: -16px 0 18px; color: var(--knot-muted); font-size: 13px; font-weight: 700; }
.knot-coupon-message.is-success, .knot-discount-total { color: var(--knot-success); }
.knot-coupon-message.is-error { color: var(--knot-danger); }
.knot-order-totals { width: min(420px, 100%); margin: 24px 0 0 auto; display: grid; gap: 10px; }
.knot-order-totals span { display: flex; justify-content: space-between; gap: 24px; }
.knot-order-totals span:last-child { padding-top: 12px; border-top: 1px solid var(--knot-border); font-size: 18px; }
.knot-order-instructions { margin-top: 22px; border-left: 3px solid var(--knot-text); padding: 12px 16px; background: var(--knot-surface-muted); }
.knot-order-instructions p { margin: 6px 0 0; white-space: pre-line; color: var(--knot-muted); }
.knot-payment-review { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 380px); gap: 38px; align-items: start; margin-top: 48px; border-top: 1px solid var(--knot-border); padding-top: 28px; }
.knot-payment-review h2 { margin-top: 0; }
.knot-detail-list { display: grid; gap: 0; margin: 0; }
.knot-detail-list div { display: flex; justify-content: space-between; gap: 22px; border-bottom: 1px solid var(--knot-border); padding: 10px 0; }
.knot-detail-list dt { color: var(--knot-muted); }
.knot-detail-list dd { margin: 0; text-align: right; font-weight: 700; overflow-wrap: anywhere; }
.knot-preline { white-space: pre-line; line-height: 1.65; color: var(--knot-muted); }

.knot-custom-order-intro { max-width: 760px; margin-bottom: 34px; }
.knot-custom-order-intro h1 { margin-bottom: 12px; }
.knot-custom-order-intro > p:last-child { color: var(--knot-muted); line-height: 1.65; }
.knot-eyebrow { margin: 0 0 8px; color: var(--knot-muted); font-size: 11px; font-weight: 900; letter-spacing: .16em; }
.knot-custom-order-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 360px); gap: clamp(32px, 5vw, 72px); align-items: start; }
.knot-custom-order-form { display: grid; gap: 28px; }
.knot-custom-order-form fieldset { display: grid; gap: 14px; min-width: 0; margin: 0; border: 0; border-top: 1px solid var(--knot-border); padding: 24px 0 0; }
.knot-custom-order-form legend { padding: 0 18px 0 0; color: var(--knot-text); font-size: 18px; font-weight: 900; }
.knot-custom-order-form small { color: var(--knot-muted); font-weight: 400; }
.knot-form-two { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.knot-custom-order-summary { position: sticky; top: calc(var(--knot-nav-height) + 28px); display: grid; gap: 12px; border: 1px solid var(--knot-border); padding: 24px; background: var(--knot-surface-muted); }
.knot-custom-order-summary p, .knot-custom-order-summary span, .knot-custom-order-summary small { margin: 0; color: var(--knot-muted); }
.knot-custom-order-summary > strong { font-size: 25px; }
.knot-custom-order-summary small { border-top: 1px solid var(--knot-border); padding-top: 14px; line-height: 1.55; }
.knot-payment-guidance { display: grid; gap: 5px; border-left: 3px solid var(--knot-text); padding: 12px 15px; background: var(--knot-surface-muted); }
.knot-payment-guidance span { color: var(--knot-muted); font-size: 13px; }
.knot-color-field { display: grid; gap: 12px; }
.knot-color-field-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; color: var(--knot-text); font-size: 13px; font-weight: 800; }
.knot-color-chart-button { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--knot-border-strong); padding: 8px 11px; background: var(--knot-control); color: var(--knot-text); cursor: pointer; font-weight: 800; }
.knot-color-chart-button:hover, .knot-color-chart-button:focus-visible { border-color: var(--knot-text); }
.knot-color-chart-icon { width: 18px; height: 18px; stroke: currentColor; stroke-width: 1.6; }
.knot-color-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.knot-color-option { display: flex !important; grid-template-columns: none !important; align-items: center; gap: 9px !important; min-height: 46px; border: 1px solid var(--knot-border); padding: 8px 10px; background: var(--knot-control); color: var(--knot-text) !important; cursor: pointer; }
.knot-color-option:has(input:checked) { border-color: var(--knot-text); box-shadow: inset 0 0 0 1px var(--knot-text); }
.knot-color-option input { width: auto; }
.knot-color-swatch, .knot-order-color span, .knot-color-admin-swatch { flex: 0 0 auto; width: 24px; height: 24px; display: inline-block; border: 1px solid var(--knot-border-strong); background: var(--swatch-color); }
.knot-order-color { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; }
body.knot-color-chart-open { overflow: hidden; }
.knot-color-modal { position: fixed; inset: 0; z-index: 95; display: grid; place-items: center; padding: 24px; }
.knot-color-modal[hidden] { display: none; }
.knot-color-modal-backdrop { position: absolute; inset: 0; background: var(--drawer-overlay); }
.knot-color-modal-panel { position: relative; z-index: 1; width: min(820px, 94vw); max-height: 88vh; overflow: auto; border: 1px solid var(--drawer-border); padding: 24px; background: var(--drawer-bg-solid); color: var(--drawer-text); }
.knot-color-modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--knot-border); padding-bottom: 16px; }
.knot-color-modal-head h2 { margin: 0; }
.knot-color-chart-image-wrap { padding-top: 22px; }
.knot-color-chart-image { width: 100%; height: auto; max-height: calc(88vh - 130px); display: block; object-fit: contain; }
.knot-color-chart-admin { display: grid; grid-template-columns: minmax(280px, .9fr) minmax(320px, 1.1fr); gap: 26px; align-items: start; margin-bottom: 30px; border: 1px solid var(--knot-border); padding: 20px; background: var(--knot-surface); }
.knot-color-chart-admin-preview { border: 1px solid var(--knot-border); background: var(--knot-surface-muted); }
.knot-color-chart-admin-preview img { width: 100%; max-height: 360px; display: block; object-fit: contain; }
.knot-color-chart-admin-controls { display: grid; gap: 18px; }
.knot-color-chart-admin-controls h2 { margin: 4px 0 8px; }
.knot-color-chart-admin-controls p { color: var(--knot-muted); }
.knot-color-chart-admin-controls .knot-form { display: grid; gap: 12px; }
.knot-color-chart-admin-controls .knot-form label { display: grid; gap: 7px; color: var(--knot-text); font-weight: 800; }
.knot-color-chart-admin-controls input[type="file"] { min-height: 46px; border: 1px solid var(--knot-border-strong); padding: 9px; background: var(--knot-control); color: var(--knot-text); }
.knot-menu-drawer .knot-drawer-close,
.knot-menu-drawer .knot-drawer-close-icon,
.knot-menu-drawer .knot-drawer-close-icon img { touch-action: manipulation; }
.knot-menu-drawer .knot-drawer-close-icon,
.knot-menu-drawer .knot-drawer-close-icon img { pointer-events: none; }
@media (max-width: 760px) {
  .knot-color-chart-admin { grid-template-columns: 1fr; padding: 14px; }
}
.knot-design-links { display: flex; gap: 10px; flex-wrap: wrap; }
.knot-custom-design-preview { width: min(100%, 280px); display: grid; gap: 8px; margin: 18px 0; color: var(--knot-text); font-weight: 800; text-decoration: none; }
.knot-custom-design-preview img { width: 100%; aspect-ratio: 1; display: block; border: 1px solid var(--knot-border); background: var(--knot-surface-muted); object-fit: contain; }
.knot-custom-design-preview:hover span { text-decoration: underline; }
.knot-color-create-form { display: grid; grid-template-columns: minmax(180px, 1fr) 120px 110px auto auto; gap: 12px; align-items: end; border: 1px solid var(--knot-border); padding: 18px; background: var(--knot-surface-muted); }
.knot-color-admin-list { display: grid; gap: 10px; margin-top: 24px; }
.knot-color-admin-row { display: grid; grid-template-columns: 1fr auto; gap: 14px; align-items: center; border-bottom: 1px solid var(--knot-border); padding: 10px 0; }
.knot-color-admin-form { display: grid; grid-template-columns: 36px minmax(150px, 1fr) 110px 100px auto auto; gap: 12px; align-items: end; }
.knot-color-admin-form label { display: grid; gap: 5px; color: var(--knot-muted); font-size: 12px; font-weight: 700; }
.knot-color-admin-form input { width: 100%; min-height: 38px; border: 1px solid var(--knot-border-strong); padding: 7px 9px; background: var(--knot-control); color: var(--knot-text); }
.knot-color-admin-swatch { align-self: center; width: 30px; height: 30px; }
.knot-order-confirmation { max-width: 680px; padding-block: 72px; }
.knot-order-confirmation > p { line-height: 1.65; color: var(--knot-muted); }
.knot-confirmation-summary { display: grid; gap: 10px; margin: 28px auto; border-block: 1px solid var(--knot-border); padding: 18px 0; text-align: left; }
.knot-confirmation-summary span { display: flex; justify-content: space-between; gap: 20px; }
.knot-account-custom-orders { padding-top: 0; }
.knot-custom-admin-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 400px); gap: clamp(34px, 5vw, 72px); align-items: start; }
.knot-custom-admin-details { display: grid; gap: 30px; }
.knot-custom-admin-details section { border-top: 1px solid var(--knot-border); padding-top: 18px; }
.knot-custom-admin-details h2, .knot-custom-admin-details h3 { margin-top: 0; }
.knot-custom-admin-details h3 { margin: 22px 0 6px; font-size: 14px; }
.knot-custom-admin-form { position: sticky; top: calc(var(--knot-nav-height) + 24px); border: 1px solid var(--knot-border); padding: 22px; background: var(--knot-surface-muted); }
.knot-custom-admin-form h2 { margin-top: 0; }
.knot-payment-review-summary { display: grid; gap: 8px; border-block: 1px solid var(--knot-border); padding: 14px 0; }
.knot-payment-review-summary span { display: flex; justify-content: space-between; gap: 14px; }
.knot-total-row { display: flex; justify-content: space-between; gap: 16px; font-size: 16px; margin-top: 12px; }
.knot-total-final { margin-top: 22px; font-size: 22px; font-weight: 900; }
.knot-stats { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 32px; }
.knot-stats div { border: 1px solid var(--knot-border); background: var(--knot-surface); padding: 16px; }
.knot-stats strong { display: block; font-size: 26px; }
.knot-stats span { font-size: 12px; color: var(--knot-muted); text-transform: uppercase; font-weight: 800; }
.knot-banner-admin-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.knot-banner-admin-card { border: 1px solid var(--knot-border); background: var(--knot-surface); }
.knot-banner-admin-preview { aspect-ratio: 16 / 9; overflow: hidden; border-bottom: 1px solid var(--knot-border); background: var(--knot-surface-muted); display: grid; place-items: center; }
.knot-banner-admin-preview img { width: 100%; height: 100%; display: block; object-fit: contain; }
.knot-banner-admin-preview span { color: var(--knot-muted); font-weight: 700; }
.knot-banner-admin-content { display: grid; gap: 18px; padding: 18px; }
.knot-banner-admin-content h2 { margin: 0 0 5px; font-size: 18px; }
.knot-banner-admin-content p { margin: 0; color: var(--knot-muted); font-size: 13px; }

.knot-store-sale-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; align-items: start; gap: clamp(36px, 6vw, 84px); }
.knot-store-sale-form { min-width: 0; max-width: 720px; display: grid; gap: 22px; }
.knot-store-field { min-width: 0; margin: 0; padding: 0; border: 0; }
.knot-store-field > label, .knot-store-field > legend { display: block; margin-bottom: 8px; color: var(--knot-text); font-size: 13px; font-weight: 800; }
.knot-store-product-picker { position: relative; z-index: 4; }
.knot-store-product-picker > input { width: 100%; min-height: 48px; padding: 11px 13px; border: 1px solid var(--knot-border-strong); background: var(--knot-control); color: var(--knot-text); }
.knot-store-search-results { position: absolute; inset: calc(100% + 6px) 0 auto; max-height: 320px; overflow-y: auto; border: 1px solid var(--knot-border-strong); background: var(--knot-surface-raised); box-shadow: 0 14px 32px rgba(0,0,0,.18); }
.knot-store-search-option { width: 100%; min-height: 62px; display: grid; grid-template-columns: 48px 1fr; align-items: center; gap: 12px; padding: 7px 10px; border: 0; border-bottom: 1px solid var(--knot-border); background: var(--knot-surface-raised); color: var(--knot-text); text-align: left; cursor: pointer; }
.knot-store-search-option:last-child { border-bottom: 0; }
.knot-store-search-option:hover, .knot-store-search-option.is-active { background: var(--knot-surface-muted); transform: none; }
.knot-store-search-option img { width: 48px; height: 48px; object-fit: cover; background: var(--knot-surface-muted); }
.knot-store-search-option span { min-width: 0; display: grid; gap: 4px; }
.knot-store-search-option strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.knot-store-search-option small { color: var(--knot-muted); }
.knot-store-selected-product { min-height: 76px; display: grid; grid-template-columns: 64px 1fr; align-items: center; gap: 14px; padding-block: 10px; border-block: 1px solid var(--knot-border); }
.knot-store-selected-product img { width: 64px; height: 64px; object-fit: cover; background: var(--knot-surface-muted); }
.knot-store-selected-product div { display: grid; gap: 6px; }
.knot-store-selected-product span { color: var(--knot-muted); font-size: 13px; }
.knot-store-size-buttons { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.knot-store-size-button { min-width: 0; height: 44px; border: 1px solid var(--knot-border-strong); background: var(--knot-control); color: var(--knot-text); cursor: pointer; font-weight: 800; }
.knot-store-size-button.is-selected { border-color: var(--knot-primary); background: var(--knot-primary); color: var(--knot-on-primary); }
.knot-store-size-button:focus-visible { outline: 2px solid var(--knot-focus); outline-offset: 2px; }
.knot-store-size-field:disabled { opacity: .56; }
.knot-store-quantity { width: 132px; height: 42px; display: grid; grid-template-columns: 40px 52px 40px; border: 1px solid var(--knot-border-strong); background: var(--knot-control); }
.knot-store-quantity button, .knot-store-quantity input { min-width: 0; border: 0; background: transparent; color: var(--knot-text); text-align: center; }
.knot-store-quantity button { cursor: pointer; color: var(--knot-muted); }
.knot-store-quantity input { width: 52px; font-weight: 800; }
.knot-store-field > small { display: block; margin-top: 7px; color: var(--knot-muted); }
.knot-store-payment-buttons { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.knot-store-payment-button { min-width: 0; }
.knot-store-payment-button span { height: 44px; display: grid; place-items: center; border: 1px solid var(--knot-border-strong); background: var(--knot-control); color: var(--knot-text); cursor: pointer; font-weight: 800; }
.knot-store-payment-button:has(input:checked) span { border-color: var(--knot-primary); background: var(--knot-primary); color: var(--knot-on-primary); }
.knot-store-payment-button:has(input:focus-visible) span { outline: 2px solid var(--knot-focus); outline-offset: 2px; }
.knot-store-sale-total { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; padding-top: 18px; border-top: 1px solid var(--knot-border); font-size: 18px; }
.knot-store-sale-total strong { font-size: 24px; }
.knot-store-complete-button { width: 100%; min-height: 50px; }
.knot-store-complete-button:disabled { opacity: .46; cursor: not-allowed; }
.knot-store-daily-report { position: sticky; top: calc(var(--knot-nav-height) + 26px); padding-left: 24px; border-left: 1px solid var(--knot-border); }
.knot-store-daily-report h2 { margin: 0 0 22px; font-size: 22px; }
.knot-store-daily-report dl { margin: 0; }
.knot-store-daily-report dl div { display: flex; justify-content: space-between; gap: 18px; padding: 11px 0; border-bottom: 1px solid var(--knot-border); }
.knot-store-daily-report dt { color: var(--knot-muted); }
.knot-store-daily-report dd { margin: 0; font-weight: 800; }
.knot-store-daily-report .knot-store-report-total { margin-top: 10px; border-bottom: 0; color: var(--knot-text); font-size: 16px; }
.knot-store-daily-report .knot-store-report-total dt { color: var(--knot-text); font-weight: 800; }
.knot-store-recent-sales { margin-top: 72px; }
.knot-store-recent-sales h2 { margin-bottom: 18px; }

input::placeholder, textarea::placeholder { color: var(--knot-muted); opacity: .82; }
input, textarea, select { caret-color: var(--knot-text); }

@media (max-width: 920px) {
    .knot-nav-links { gap: 12px; }
    .knot-cart-drawer { min-width: 0; }
    .knot-product-grid-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
    .knot-pdp-grid, .knot-checkout-grid, .knot-onepage-checkout { grid-template-columns: 1fr; }
    .knot-custom-order-layout, .knot-custom-admin-grid, .knot-payment-review { grid-template-columns: 1fr; }
    .knot-custom-order-summary, .knot-custom-admin-form { position: static; }
    .knot-color-create-form { grid-template-columns: 1fr 1fr; }
    .knot-color-admin-row { grid-template-columns: 1fr; }
    .knot-color-admin-form { grid-template-columns: 36px 1fr 110px; }
    .knot-checkout-left, .knot-checkout-right { padding: 28px 20px; }
    .knot-checkout-form { margin-left: 0; width: 100%; }
    .knot-checkout-right { border-left: 0; border-top: 1px solid var(--knot-border); }
    .knot-pay-now-desktop { display: none; }
    .knot-pay-now-mobile { display: block; width: calc(100% - 40px); margin: 0 20px 28px; }
    .knot-stats { grid-template-columns: repeat(2, 1fr); }
    .knot-banner-admin-grid { grid-template-columns: 1fr; }
    .knot-page-head { align-items: flex-start; flex-direction: column; }
    .knot-size-admin-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .knot-store-sale-layout { grid-template-columns: minmax(0, 1fr) 260px; gap: 32px; }
    .knot-footer-inner { padding: 52px 32px 26px; }
    .knot-footer-grid { grid-template-columns: 1fr 1fr; gap: 38px 44px; }
    .knot-footer-contact { grid-column: span 2; }
}

@media (max-width: 576px) {
    :root { --knot-nav-height: 50px; }
    .knot-nav { height: var(--knot-nav-height); padding-block: 0; align-items: center; }
    .knot-logo { width: 84px; height: auto; }
    .knot-nav-links { --nav-utility-gap: 8px; flex-wrap: nowrap; justify-content: flex-end; font-size: 12px; }
    .knot-nav-links .knot-nav-icon-button { width: 42px; height: 42px; flex-basis: 42px; }
    .knot-nav-icon { width: 20px; height: 20px; }
    .knot-account-panel { right: -4px; }
    .knot-floating-categories { padding-inline: 10px; }
    .knot-floating-category-shell { width: 100%; padding: 5px 7px; border-radius: 18px; }
    .knot-category-row.knot-floating-category-row { gap: 6px; min-height: 32px; }
    .knot-floating-category-row .knot-pill { height: 32px; min-height: 32px; padding: 0 11px; font-size: 11px; }
    :root { --store-drawer-padding: 20px; }
    .knot-cart-drawer { min-width: 0; }
    .knot-cart-drawer-head { padding: 22px var(--store-drawer-padding) 14px; }
    .knot-cart-items { padding: 0 var(--store-drawer-padding); }
    .knot-cart-row { padding-block: 18px; }
    .knot-cart-line-meta { padding-left: 0; }
    .knot-cart-bottom { padding: 16px var(--store-drawer-padding) 22px; }
    .knot-cart-subtotal { justify-content: space-between; gap: 16px; }
    .knot-cart-actions { grid-template-columns: 1fr; }
    .knot-cart-primary, .knot-cart-secondary, .knot-cart-empty button { min-height: 52px; font-size: 18px; }
    .knot-cart-empty button { min-height: 46px; font-size: 14px; }
    .knot-pdp-grid > * { min-width: 0; }
    .knot-size-chart-disclosure, .knot-size-chart { max-width: 100%; }
    .knot-size-chart { overflow-x: auto; }
    .knot-product-img { height: 100%; padding: 10px; }
    .knot-product-bottom { flex-direction: column; }
    .knot-pdp-main img { height: 100%; }
    .knot-tagline-text { letter-spacing: .12em; }
    .knot-checkout-two { grid-template-columns: 1fr; }
    .knot-form-two, .knot-provider-grid { grid-template-columns: 1fr; }
    .knot-color-options, .knot-color-chart-grid, .knot-color-create-form, .knot-color-admin-form { grid-template-columns: 1fr; }
    .knot-color-field-head { align-items: flex-start; flex-direction: column; }
    .knot-color-modal { padding: 10px; }
    .knot-color-modal-panel { width: 100%; max-height: 94vh; padding: 18px; }
    .knot-summary-line { grid-template-columns: 56px 1fr; }
    .knot-summary-line strong { grid-column: 2; }
    .knot-pdp-title-row, .knot-inline-actions { flex-direction: column; align-items: stretch; }
    .knot-inline-edit-grid, .knot-inline-size-row, .knot-inline-image-row { grid-template-columns: 1fr; }
    .knot-store-sale-layout { grid-template-columns: 1fr; }
    .knot-store-sale-form { max-width: none; }
    .knot-store-payment-buttons { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .knot-store-size-buttons { gap: 6px; }
    .knot-store-size-button { padding-inline: 4px; font-size: 13px; }
    .knot-store-daily-report { position: static; padding: 28px 0 0; border-left: 0; border-top: 1px solid var(--knot-border); }
    .knot-store-recent-sales { margin-top: 52px; }
    .knot-tagline { display: none; }
    .knot-footer-desktop { display: none; }
    .knot-footer-mobile { display: block; width: 100%; text-align: center; }
    .knot-footer-mobile-brand { padding: clamp(18px, 6vw, 26px) 12px clamp(12px, 4vw, 18px); background: #050505; color: #f5f5f5; }
    .knot-footer-mobile-brand img { display: block; width: min(48%, 180px); height: auto; aspect-ratio: 1501 / 319; object-fit: contain; margin: 0 auto clamp(8px, 3vw, 13px); }
    .knot-footer-mobile-brand p { max-width: 340px; margin: 0 auto clamp(4px, 1.6vw, 8px); color: #f1f1f1; font-size: clamp(5.5px, 2.3vw, 9px); line-height: 1.25; }
    .knot-footer-mobile-brand strong { display: block; margin-top: clamp(7px, 2.5vw, 11px); color: #f5f5f5; font-size: clamp(6px, 2.3vw, 9px); font-weight: 500; letter-spacing: .02em; }
    .knot-footer-mobile-policies { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); padding: clamp(10px, 3vw, 13px) 8px; row-gap: clamp(8px, 2.7vw, 12px); background: #fff; }
    .knot-footer-mobile-policies a { grid-column: span 2; min-width: 0; color: #111; font-size: clamp(5.5px, 2.3vw, 9px); font-weight: 400; line-height: 1.15; }
    .knot-footer-mobile-policies a:nth-child(4) { grid-column: 2 / span 2; }
    .knot-footer-mobile-policies a:hover, .knot-footer-mobile-policies a:focus-visible { color: #111; transform: none; text-decoration: underline; }
    .knot-footer-mobile-policies a:focus-visible { outline: 1px solid #111; outline-offset: 3px; }
    .knot-footer-mobile-contact { padding: clamp(10px, 3.5vw, 14px) 12px clamp(8px, 3vw, 12px); background: #050505; color: #f5f5f5; }
    .knot-footer-mobile-contact h2 { margin: 0 0 clamp(4px, 1.8vw, 7px); color: #f5f5f5; font-size: clamp(8px, 3vw, 12px); line-height: 1.1; letter-spacing: 0; text-transform: none; }
    .knot-footer-mobile-contact address { max-width: 330px; margin: 0 auto; display: grid; justify-items: center; gap: 2px; font-style: normal; }
    .knot-footer-mobile-contact address a { display: block; color: #f1f1f1; font-size: clamp(6px, 2.3vw, 9px); line-height: 1.2; }
    .knot-footer-mobile-contact address a:hover, .knot-footer-mobile-contact address a:focus-visible { color: #fff; transform: none; }
    .knot-footer-mobile-contact .knot-footer-mobile-email { margin: 3px 0 2px; padding: 1px 6px; background: #171717; }
    .knot-footer-mobile-contact .knot-footer-mobile-address { color: #c9c9c9; }
    .knot-footer-mobile-social { display: flex; justify-content: center; gap: 7px; margin-top: clamp(5px, 1.8vw, 7px); }
    .knot-footer-mobile-social a { width: clamp(14px, 4.6vw, 18px); height: clamp(14px, 4.6vw, 18px); display: grid; place-items: center; border: 1px solid #777; border-radius: 50%; color: #f5f5f5; }
    .knot-footer-mobile-social .knot-footer-icon { width: clamp(8px, 2.8vw, 11px); height: clamp(8px, 2.8vw, 11px); }
    .knot-footer-mobile-social a:hover, .knot-footer-mobile-social a:focus-visible { color: #fff; border-color: #fff; transform: none; }
    .knot-footer-mobile-copyright { min-height: clamp(23px, 8vw, 34px); display: grid; place-items: center; padding: clamp(5px, 2vw, 8px) 12px; background: #fff; color: #111; font-size: clamp(6px, 2.3vw, 9px); }
}

@media (max-width: 380px) {
    .knot-public-topbar .knot-nav { width: 100%; padding-inline: 14px; }
    .knot-public-topbar .knot-logo { width: 80px; height: auto; }
    .knot-public-topbar .knot-nav-icon-button { width: 40px; height: 40px; }
    .knot-public-topbar .knot-nav-icon { width: 19px; height: 19px; }
    .knot-menu-toggle { --knot-menu-icon-width: 23px; width: 40px; height: 40px; }
    .knot-size-row { gap: 6px; }
    .size-btn { height: 42px; padding-inline: 4px; font-size: 14px; }
    .knot-pdp-actions { gap: 8px; }
}

@media (max-width: 340px) {
    .knot-pdp-actions { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 1ms !important;
    }

    button:not(:disabled):hover, .knot-nav-icon-button:hover, .knot-btn:hover, .knot-viewall:hover, .knot-cart-primary:hover, .knot-cart-secondary:hover, .knot-cart-empty button:not(:disabled):hover, .knot-pay-now:not(:disabled):hover, .size-btn:not(:disabled):hover, .knot-edit-product-btn:not(:disabled):hover, .knot-small-outline:not(:disabled):hover, .knot-pill:hover, .knot-footer a:hover {
        transform: none;
    }

    body.knot-animate-ready .knot-card-link {
        opacity: 1;
        transform: none;
    }

    body.knot-reveal-ready [data-reveal],
    body.knot-reveal-ready .knot-hero-content h1 span {
        opacity: 1 !important;
        transform: none !important;
        animation: none !important;
    }

    body.knot-reveal-ready .knot-hero-content { transform: translate(-50%, -50%) !important; }
    body.knot-reveal-ready .knot-home-categories { transform: translateX(-50%) !important; }
}

/* Physical store POS */
.knot-store-pos { --pos-ink: #111318; --pos-muted: #68707d; --pos-line: #dfe3e8; --pos-soft: #f6f7f9; --pos-green: #279847; min-height: 100vh; padding: 30px clamp(18px, 3vw, 48px) 64px; background: #f7f8fa; color: var(--pos-ink); font-family: Arial, Helvetica, sans-serif; }
.knot-store-pos *, .knot-receipt-page * { box-sizing: border-box; }
.knot-store-pos-header { max-width: 1500px; display: flex; align-items: end; justify-content: space-between; gap: 24px; margin: 0 auto 20px; }
.knot-store-pos-header h1 { margin: 2px 0 0; font-size: clamp(26px, 2vw, 34px); letter-spacing: 0; }
.knot-store-pos-header a { color: var(--pos-ink); font-size: 13px; font-weight: 700; }
.knot-store-kicker { margin: 0; color: var(--pos-muted); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.knot-store-pos-layout { max-width: 1500px; display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(360px, .95fr); align-items: start; gap: 24px; margin: 0 auto; }
.knot-store-pos-form { min-width: 0; display: grid; gap: 18px; }
.knot-pos-panel { min-width: 0; padding: 24px 28px; border: 1px solid #e3e6ea; border-radius: 8px; background: #fff; box-shadow: 0 4px 16px rgba(22, 28, 38, .035); color: var(--pos-ink); }
.knot-pos-panel h2 { margin: 0 0 20px; font: 700 16px/1.25 Arial, sans-serif; letter-spacing: 0; }
.knot-pos-panel h2 span { font-weight: 800; }
.knot-pos-panel h2 small { color: var(--pos-muted); font-size: 12px; font-weight: 500; }
.knot-pos-panel label, .knot-pos-panel legend { color: #4e5663; font: 500 12px/1.25 Arial, sans-serif; }
.knot-pos-panel input, .knot-pos-panel select, .knot-pos-panel textarea { width: 100%; min-height: 42px; margin-top: 7px; padding: 10px 12px; border: 1px solid #d7dce2; border-radius: 5px; background: #fff; color: var(--pos-ink); font: 500 14px/1.3 Arial, sans-serif; outline: 0; }
.knot-pos-panel input:focus, .knot-pos-panel select:focus, .knot-pos-panel textarea:focus { border-color: #69717c; box-shadow: 0 0 0 2px rgba(17, 19, 24, .08); }
.knot-pos-panel textarea { min-height: 66px; resize: vertical; }
.knot-pos-search-row { display: grid; grid-template-columns: minmax(220px, 1fr) auto auto; gap: 10px; }
.knot-pos-search { position: relative; min-width: 0; }
.knot-pos-search > input { height: 46px; margin: 0; padding-left: 45px; }
.knot-pos-search-icon { position: absolute; z-index: 2; top: 13px; left: 15px; width: 20px; height: 20px; color: #68707d; pointer-events: none; }
.knot-pos-tool-button, .knot-pos-add-another, .knot-pos-primary, .knot-pos-secondary { min-height: 44px; padding: 10px 18px; border: 1px solid #d2d7dd; border-radius: 5px; background: #fff; color: var(--pos-ink); font: 700 13px/1 Arial, sans-serif; cursor: pointer; }
.knot-pos-tool-button:hover, .knot-pos-secondary:hover, .knot-pos-add-another:hover { border-color: #7d8590; background: #fafafa; transform: none; }
.knot-pos-primary { border-color: #111; background: #111; color: #fff; }
.knot-pos-primary:hover { background: #292929; transform: none; }
.knot-pos-primary:disabled { opacity: .4; cursor: not-allowed; }
.knot-pos-search-results { position: absolute; z-index: 20; top: calc(100% + 6px); right: 0; left: 0; max-height: 340px; overflow-y: auto; border: 1px solid #d7dce2; border-radius: 6px; background: #fff; box-shadow: 0 12px 28px rgba(22, 28, 38, .14); }
.knot-pos-search-option { width: 100%; display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: center; gap: 12px; padding: 8px 10px; border: 0; border-bottom: 1px solid #e7e9ec; background: #fff; color: var(--pos-ink); text-align: left; cursor: pointer; }
.knot-pos-search-option[hidden] { display: none; }
.knot-pos-search-option:last-child { border-bottom: 0; }
.knot-pos-search-option:hover, .knot-pos-search-option.is-active { background: #f2f4f6; transform: none; }
.knot-pos-search-option img { width: 48px; height: 48px; object-fit: cover; border: 1px solid #e1e4e8; }
.knot-pos-search-option span { min-width: 0; display: grid; gap: 4px; }
.knot-pos-search-option strong, .knot-pos-search-option small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.knot-pos-search-option small { color: var(--pos-muted); }
.knot-pos-manual-form { margin-top: 14px; padding: 18px; border: 1px solid #d7dce2; border-radius: 6px; background: var(--pos-soft); }
.knot-pos-manual-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.knot-pos-manual-head button { width: 32px; height: 32px; border: 0; background: transparent; color: #111; font-size: 22px; cursor: pointer; }
.knot-pos-manual-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.knot-pos-manual-notes { grid-column: span 3; }
.knot-pos-manual-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 16px; }
.knot-pos-items { display: grid; gap: 12px; margin-top: 18px; }
.knot-pos-empty-items { margin: 0; padding: 24px; border: 1px dashed #cbd1d8; border-radius: 6px; color: var(--pos-muted); text-align: center; }
.knot-pos-item { border: 1px solid #e0e3e7; border-radius: 6px; background: #fff; overflow: hidden; }
.knot-pos-item-head { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto 36px; align-items: center; gap: 14px; padding: 10px 14px; background: #fbfbfc; }
.knot-pos-item-image { width: 64px; height: 64px; object-fit: cover; border: 1px solid #e3e5e8; background: #fff; }
.knot-pos-manual-badge { width: 64px; height: 44px; display: grid; place-items: center; border-radius: 4px; background: #eceff2; color: #525a66; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.knot-pos-item-identity { min-width: 0; display: grid; gap: 5px; }
.knot-pos-item-identity strong, .knot-pos-item-identity small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.knot-pos-item-identity small { color: var(--pos-muted); }
.knot-pos-item-price { white-space: nowrap; }
.knot-pos-item-remove { width: 34px; height: 34px; border: 0; background: transparent; color: #111; font-size: 22px; cursor: pointer; }
.knot-pos-item-controls { display: grid; grid-template-columns: repeat(4, minmax(120px, 1fr)); align-items: end; gap: 18px; padding: 14px; border-top: 1px solid #eceef0; }
.knot-pos-item-controls label > span, .knot-pos-readonly-field > span, .knot-pos-item-quantity > span { display: block; margin-bottom: 7px; color: var(--pos-muted); font-size: 11px; }
.knot-pos-item-controls select { margin: 0; }
.knot-pos-readonly-field { min-height: 42px; display: flex; flex-direction: column; justify-content: center; }
.knot-pos-readonly-field strong { font-size: 13px; }
.knot-pos-quantity-control { height: 42px; display: grid; grid-template-columns: 42px 54px 42px; border: 1px solid #d7dce2; border-radius: 5px; }
.knot-pos-quantity-control button, .knot-pos-quantity-control output { display: grid; place-items: center; border: 0; background: #fff; color: #111; }
.knot-pos-quantity-control button { cursor: pointer; font-size: 18px; }
.knot-pos-quantity-control button:disabled { color: #b9bec5; cursor: not-allowed; }
.knot-pos-add-another { width: 100%; margin-top: 14px; background: #fbfbfc; }
.knot-pos-two-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.knot-pos-payment fieldset { margin: 0; padding: 0; border: 0; }
.knot-pos-payment-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 7px; }
.knot-pos-payment-options span { min-height: 44px; display: grid; place-items: center; border: 1px solid #d7dce2; border-radius: 5px; color: #5a626e; cursor: pointer; font-weight: 700; }
.knot-pos-payment-options label:has(input:checked) span { border-color: #111; color: #111; box-shadow: inset 0 0 0 1px #111; }
.knot-pos-payment-fields { margin-top: 20px; }
.knot-pos-change { display: grid; gap: 7px; margin-top: 18px; }
.knot-pos-change span { color: var(--pos-muted); font-size: 12px; }
.knot-pos-change strong { color: var(--pos-green); font-size: 23px; }
.knot-pos-form-actions { display: grid; grid-template-columns: 130px minmax(220px, 320px); justify-content: space-between; gap: 14px; margin-top: 22px; }
.knot-pos-complete { font-size: 15px; }
.knot-store-pos-sidebar { position: sticky; top: calc(var(--knot-nav-height) + 20px); display: grid; gap: 18px; }
.knot-pos-summary dl { display: grid; gap: 14px; margin: 0 0 16px; }
.knot-pos-summary dl div, .knot-pos-summary-total { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; }
.knot-pos-summary dt, .knot-pos-summary dd { margin: 0; }
.knot-pos-discount-amount { color: #d34040; }
.knot-pos-summary > label { display: block; max-width: 240px; }
.knot-pos-custom-discount { margin-top: 10px; }
.knot-pos-summary-total { margin-top: 18px; padding-top: 16px; border-top: 1px solid #dfe3e8; font-size: 19px; font-weight: 800; }
.knot-pos-summary-total strong { font-size: 25px; }
.knot-pos-receipt { padding-bottom: 14px; }
.knot-pos-receipt-paper { padding: 10px 12px 0; color: #111; font: 12px/1.4 Arial, sans-serif; }
.knot-pos-receipt-paper > header { display: grid; justify-items: center; gap: 5px; padding-bottom: 13px; border-bottom: 1px dashed #7f858d; }
.knot-pos-receipt-paper > header strong { font-size: 19px; letter-spacing: .35em; }
.knot-pos-receipt-meta { display: grid; gap: 4px; padding: 12px 0; border-bottom: 1px solid #d9dde1; }
.knot-pos-receipt-table-head, .knot-pos-receipt-item { display: grid; grid-template-columns: minmax(100px, 1.7fr) .55fr .7fr .4fr .8fr .9fr; gap: 7px; align-items: start; }
.knot-pos-receipt-table-head { padding: 9px 0; border-bottom: 1px solid #d9dde1; font-weight: 800; }
.knot-pos-receipt-item { padding: 8px 0; border-bottom: 1px dashed #b6bbc1; }
.knot-pos-receipt-item span:nth-last-child(-n+3), .knot-pos-receipt-table-head span:nth-last-child(-n+3) { text-align: right; }
.knot-pos-receipt-table [data-receipt-items] > p { color: var(--pos-muted); text-align: center; }
.knot-pos-receipt-totals { margin: 10px 0 0; }
.knot-pos-receipt-totals div { display: flex; justify-content: space-between; gap: 16px; padding: 3px 0; }
.knot-pos-receipt-totals dt, .knot-pos-receipt-totals dd { margin: 0; }
.knot-pos-receipt-totals .total { margin-block: 6px; padding-block: 8px; border-block: 1px dashed #7f858d; font-weight: 800; }
.knot-pos-receipt-paper footer { margin-top: 13px; padding-top: 10px; border-top: 1px dashed #7f858d; text-align: center; }
.knot-pos-receipt-paper footer p { margin: 4px 0; }
.knot-pos-receipt-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 20px; }
.knot-pos-receipt-actions a { display: grid; place-items: center; text-decoration: none; }
.knot-pos-receipt-actions .is-disabled { opacity: .42; pointer-events: none; }
.knot-store-recent-sales { max-width: 1500px; margin: 32px auto 0; padding: 24px 28px; border: 1px solid #e3e6ea; border-radius: 8px; background: #fff; color: #111; }
.knot-store-history-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.knot-store-history-head h2 { margin: 3px 0 0; font: 700 20px/1.2 Arial, sans-serif; }
.knot-store-recent-sales .knot-table { color: #111; }
.knot-store-recent-sales .knot-table a { color: #111; }

.knot-receipt-page { margin: 0; padding: 20px; background: #eef0f3; color: #111; font-family: Arial, Helvetica, sans-serif; }
.knot-saved-receipt { width: 2in; max-width: 100%; margin: 0 auto; padding: .12in; background: #fff; box-shadow: 0 6px 24px rgba(22,28,38,.09); font-size: 9px; line-height: 1.3; }
.knot-saved-receipt > header { display: grid; justify-items: center; gap: 4px; padding-bottom: 8px; border-bottom: 1px dashed #777; text-align: center; }
.knot-saved-receipt > header strong { font-size: 14px; letter-spacing: .3em; }
.knot-saved-receipt-meta { display: grid; gap: 2px; padding-block: 7px; }
.knot-saved-receipt table { width: 100%; border-collapse: collapse; }
.knot-saved-receipt th, .knot-saved-receipt td { padding: 4px 2px; border-block: 1px solid #ddd; text-align: left; font-size: 8px; vertical-align: top; }
.knot-saved-receipt th:nth-child(n+2), .knot-saved-receipt td:nth-child(n+2) { text-align: right; white-space: nowrap; }
.knot-saved-receipt td small { display: block; margin-top: 1px; color: #666; font-size: 7px; line-height: 1.25; }
.knot-saved-receipt dl { margin: 8px 0; }
.knot-saved-receipt dl div { display: flex; justify-content: space-between; gap: 8px; padding: 2px 0; }
.knot-saved-receipt dt, .knot-saved-receipt dd { margin: 0; }
.knot-saved-receipt dd { text-align: right; }
.knot-saved-receipt dl .total { margin-block: 4px; padding-block: 5px; border-block: 1px dashed #777; font-size: 10px; font-weight: 800; }
.knot-saved-receipt footer { padding-top: 7px; border-top: 1px dashed #777; text-align: center; }
.knot-saved-receipt footer p { margin: 4px 0; }
.knot-saved-receipt-notes { overflow-wrap: anywhere; }
.knot-receipt-page-actions { display: flex; justify-content: center; gap: 12px; margin: 20px auto; }
.knot-receipt-page-actions button { min-height: 42px; padding: 9px 18px; border: 1px solid #111; background: #fff; color: #111; font-weight: 700; cursor: pointer; }
.knot-receipt-page-actions button:first-child { background: #111; color: #fff; }

@media (max-width: 1100px) {
  .knot-store-pos-layout { grid-template-columns: minmax(0, 1.35fr) minmax(330px, .9fr); }
  .knot-pos-search-row { grid-template-columns: 1fr 1fr; }
  .knot-pos-search { grid-column: 1 / -1; }
  .knot-pos-item-controls { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
  .knot-pos-manual-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .knot-pos-manual-notes { grid-column: span 2; }
}

@media (max-width: 820px) {
  .knot-store-pos { padding-inline: 12px; }
  .knot-store-pos-layout { grid-template-columns: 1fr; }
  .knot-store-pos-sidebar { position: static; }
  .knot-pos-panel { padding: 20px 16px; }
  .knot-pos-item-head { grid-template-columns: 54px minmax(0, 1fr) 34px; gap: 10px; }
  .knot-pos-item-image, .knot-pos-manual-badge { width: 54px; height: 54px; }
  .knot-pos-item-price { grid-column: 2; }
  .knot-pos-item-remove { grid-column: 3; grid-row: 1 / span 2; }
  .knot-pos-two-columns, .knot-pos-payment-options { grid-template-columns: 1fr; }
  .knot-pos-form-actions { grid-template-columns: 1fr; }
  .knot-pos-form-actions .knot-pos-secondary { order: 2; }
  .knot-store-history-head { align-items: start; flex-direction: column; }
}

@media (max-width: 520px) {
  .knot-store-pos-header { align-items: start; }
  .knot-pos-search-row, .knot-pos-manual-grid, .knot-pos-item-controls { grid-template-columns: 1fr; }
  .knot-pos-manual-notes { grid-column: auto; }
  .knot-pos-receipt-actions { grid-template-columns: 1fr; }
  .knot-pos-receipt-table { overflow-x: auto; }
  .knot-pos-receipt-table-head, .knot-pos-receipt-item { min-width: 470px; }
  .knot-store-recent-sales { padding-inline: 14px; }
}

@media print {
  html, body.knot-receipt-page { width: 2in; min-width: 2in; }
  .knot-receipt-page { padding: 0; background: #fff; }
  .knot-receipt-page-actions { display: none !important; }
  .knot-saved-receipt { width: 2in; max-width: 2in; margin: 0; padding: .08in; box-shadow: none; }
}

/* Editorial homepage */
body.knot-home { padding-bottom: 0; }
.knot-home main { position: relative; }
body.knot-reveal-ready [data-reveal]:not(.knot-hero-content):not(.knot-home-categories) { opacity: 0; transform: translateY(28px); transition: opacity 650ms cubic-bezier(.22,1,.36,1), transform 650ms cubic-bezier(.22,1,.36,1); }
body.knot-reveal-ready [data-reveal].is-visible:not(.knot-hero-content):not(.knot-home-categories) { opacity: 1; transform: translateY(0); }
body.knot-reveal-ready [data-reveal][data-reveal-delay="3"] { transition-delay: 180ms; }
body.knot-reveal-ready .knot-hero-content { opacity: 0; transform: translate(-50%, calc(-50% + 24px)); transition: opacity 980ms cubic-bezier(.22,1,.36,1), transform 980ms cubic-bezier(.22,1,.36,1); }
body.knot-reveal-ready .knot-hero-content.is-visible { opacity: 1; transform: translate(-50%, -50%); }
body.knot-reveal-ready .knot-home-categories { opacity: 0; transform: translate(-50%, 20px); transition: opacity 620ms cubic-bezier(.22,1,.36,1), transform 620ms cubic-bezier(.22,1,.36,1); }
body.knot-reveal-ready .knot-home-categories.is-visible { opacity: 1; transform: translate(-50%, 0); }
body.knot-reveal-ready .knot-hero-content h1 span { opacity: 0; transform: translateY(.28em); }
body.knot-reveal-ready .knot-hero-content.is-visible h1 span { animation: knot-headline-in 1150ms cubic-bezier(.22,1,.36,1) forwards; }
body.knot-reveal-ready .knot-hero-content.is-visible h1 span:nth-child(2) { animation-delay: 180ms; }
@keyframes knot-headline-in { to { opacity: 1; transform: translateY(0); } }
.knot-home-topbar, .knot-home-topbar.is-scrolled { position: sticky; inset: auto; top: 0; z-index: 32; background: #fff; color: #111; border-bottom: 1px solid var(--navbar-border); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.knot-menu-toggle { --knot-menu-icon-width: 27px; --knot-menu-icon-ease: cubic-bezier(.22,1,.36,1); position: relative; grid-column: 1; justify-self: start; width: 42px; height: 42px; display: grid; place-items: center; padding: 0; border: 0; background: transparent; color: #111; cursor: pointer; transition: opacity 160ms ease; }
.knot-menu-toggle:hover { opacity: .72; }
.knot-menu-toggle-icon { position: relative; display: block; width: var(--knot-menu-icon-width); height: 22px; }
.knot-menu-toggle-line { position: absolute; left: 0; width: 100%; height: 1.5px; background: currentColor; transform-origin: center; will-change: top, transform, opacity; transition: top 130ms ease, transform 210ms var(--knot-menu-icon-ease), opacity 90ms ease; }
.knot-menu-toggle-line-1 { top: 2px; }
.knot-menu-toggle-line-2 { top: 10px; }
.knot-menu-toggle-line-3 { top: 18px; }
.knot-menu-toggle.is-open .knot-menu-toggle-line-1 { top: 10px; transform: rotate(45deg); transition: top 120ms ease, transform 210ms 120ms var(--knot-menu-icon-ease); }
.knot-menu-toggle.is-open .knot-menu-toggle-line-2 { top: 10px; transform: rotate(-45deg); transition: top 120ms ease, transform 210ms 120ms var(--knot-menu-icon-ease); }
.knot-menu-toggle.is-open .knot-menu-toggle-line-3 { top: 10px; opacity: 0; transform: rotate(-45deg); transition: top 120ms ease, transform 210ms 120ms var(--knot-menu-icon-ease), opacity 80ms 150ms ease; }
.knot-menu-toggle:focus-visible { outline: 2px solid #111; outline-offset: 2px; }

.knot-menu-overlay { position: fixed; inset: 0; z-index: 60; background: var(--drawer-overlay); opacity: 0; transition: opacity 260ms ease; }
.knot-menu-overlay.is-open { opacity: 1; }
.knot-menu-drawer { position: fixed; inset: 0 auto 0 0; z-index: 61; display: flex; flex-direction: column; padding: 0; overflow: hidden; background: #fff; color: #111; border-right: 1px solid var(--drawer-border); box-shadow: 12px 0 30px rgba(0,0,0,.08); backdrop-filter: none; -webkit-backdrop-filter: none; transform: translateX(-100%); transition: transform 340ms cubic-bezier(.22,1,.36,1); }
.knot-menu-drawer.is-open { transform: translateX(0); }
.knot-menu-drawer .knot-menu-head { flex: 0 0 var(--knot-nav-height); min-height: var(--knot-nav-height); margin: 0 0 24px; padding: 0 var(--store-drawer-padding); background: rgba(7, 18, 28, .94); }
.knot-menu-head { display: flex; align-items: center; justify-content: flex-start; }
.knot-menu-drawer .knot-drawer-close { width: 50px; height: 50px; padding: 0; color: #fff; border: 0; background: transparent; outline: 0; box-shadow: none; transition: opacity 180ms ease, transform 240ms cubic-bezier(.22,1,.36,1); }
.knot-menu-drawer .knot-drawer-close:hover { background: transparent; color: #fff; outline: 0; box-shadow: none; opacity: .72; transform: rotate(7deg) scale(.96); }
.knot-menu-drawer .knot-drawer-close:focus-visible { background: transparent; color: #fff; outline: 0; box-shadow: none; opacity: .72; }
.knot-drawer-close-icon { display: grid; place-items: center; width: 50px; height: 50px; }
.knot-drawer-close-icon img { width: 50px; height: 50px; display: block; object-fit: contain; filter: brightness(0) invert(1); animation: knot-drawer-close-enter 360ms cubic-bezier(.22,1,.36,1) both; }
@keyframes knot-drawer-close-enter { from { opacity: 0; transform: rotate(-45deg) scale(.72); } to { opacity: 1; transform: rotate(0) scale(1); } }
.knot-sidebar-search { position: relative; width: auto; margin: 0 var(--store-drawer-padding) 34px; }
.knot-sidebar-search input { width: 100%; height: 44px; padding: 0 44px 0 13px; border: 1px solid var(--knot-border-strong); border-radius: 0; background: #fff; color: #111; font-size: 17.6px; outline: none; }
.knot-sidebar-search input:focus { border-color: #111; box-shadow: 0 0 0 1px #111; }
.knot-sidebar-search button { position: absolute; top: 1px; right: 1px; width: 42px; height: 42px; display: grid; place-items: center; padding: 0; border: 0; background: #fff; color: #111; cursor: pointer; }
.knot-sidebar-search button:hover, .knot-sidebar-search button:focus-visible { transform: none; background: #f3f3f3; outline: none; }
.knot-sidebar-search .knot-nav-icon { width: 19px; height: 19px; }
.knot-menu-links { display: grid; align-content: start; gap: 6px; flex: 1 1 auto; min-height: 0; margin: 0 var(--store-drawer-padding); overflow-y: auto; padding-right: 4px; }
.knot-menu-link, .knot-menu-category-row { min-height: 38px; }
.knot-menu-links a { color: inherit; text-decoration: none; }
.knot-menu-link { display: flex; align-items: center; font-size: 18.7px; font-weight: 500; line-height: 1.2; }
.knot-menu-category-row { display: grid; grid-template-columns: minmax(0, 1fr) 36px; align-items: center; gap: 8px; }
.knot-menu-category-toggle { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 0; background: transparent; color: #555; cursor: pointer; }
.knot-menu-category-toggle:hover, .knot-menu-category-toggle:focus-visible { background: transparent; color: #111; outline: 2px solid #111; outline-offset: -3px; transform: none; }
.knot-menu-chevron { width: 18px; height: 18px; stroke: currentColor; stroke-width: 1.9; transition: transform var(--knot-fast) var(--knot-ease); }
.knot-menu-category.is-open .knot-menu-chevron { transform: rotate(180deg); }
.knot-menu-subcategories { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows var(--knot-med) var(--knot-ease), opacity var(--knot-fast) var(--knot-ease); }
.knot-menu-subcategories-inner { min-height: 0; overflow: hidden; display: grid; gap: 6px; padding: 0 0 0 26px; }
.knot-menu-category.is-open .knot-menu-subcategories { grid-template-rows: 1fr; opacity: 1; }
.knot-menu-category.is-open .knot-menu-subcategories-inner { padding-block: 2px 8px; }
.knot-menu-links .knot-menu-sublink { color: #888; font-size: 16.5px; font-weight: 400; line-height: 1.3; }
.knot-menu-empty-subcategories { color: #999; font-size: 15.4px; font-style: italic; line-height: 1.3; }
.knot-menu-link:hover, .knot-menu-link:focus-visible, .knot-menu-links .knot-menu-sublink:hover, .knot-menu-links .knot-menu-sublink:focus-visible { color: #777; outline: none; }
.knot-menu-custom-order { flex: 0 0 auto; width: auto; min-height: 48px; display: grid; place-items: center; margin: 24px var(--store-drawer-padding) 28px; background: #000; color: #fff; text-decoration: none; font-size: 18.7px; font-weight: 500; }
.knot-menu-custom-order:hover, .knot-menu-custom-order:focus-visible { background: #222; color: #fff; outline: 2px solid #111; outline-offset: 3px; }
body.knot-menu-open { overflow: hidden; }

.knot-editorial-hero { position: relative; width: 100%; height: 60vh; height: 60svh; min-height: 0; aspect-ratio: auto; overflow: hidden; background: #000; color: #fff; }
.knot-editorial-hero .knot-hero-slider { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; background: #070707; }
.knot-editorial-hero .knot-hero-slide { background: #070707; }
.knot-editorial-hero .knot-hero-slide img { object-fit: cover; object-position: center center; background: #000; }
.knot-editorial-hero-shade { position: absolute; inset: 0; z-index: 2; pointer-events: none; background: linear-gradient(0deg, rgba(0,0,0,calc(var(--hero-overlay) + .42)) 0%, rgba(0,0,0,calc(var(--hero-overlay) * .68)) 46%, rgba(0,0,0,.16) 100%); }
.knot-hero-content { position: absolute; z-index: 4; left: 50%; top: 49%; width: min(720px, calc(100% - 80px)); transform: translate(-50%, -50%); text-align: center; }
.knot-hero-eyebrow { margin: 0 0 12px; color: rgba(255,255,255,.76); font-size: 10px; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; }
.knot-hero-content h1 { margin: 0 auto; max-width: 720px; font-size: clamp(42px, 4.5vw, 72px); line-height: .94; letter-spacing: .01em; font-weight: 900; font-style: italic; text-transform: uppercase; text-shadow: 0 2px 20px rgba(0,0,0,.3); }
.knot-hero-content h1 span { display: block; }
.knot-hero-copy { max-width: 480px; margin: 14px auto 0; color: rgba(255,255,255,.82); font-size: 14px; line-height: 1.5; }
.knot-hero-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 20px; }
.knot-hero-cta { min-width: 132px; min-height: 42px; display: inline-flex; align-items: center; justify-content: space-between; gap: 20px; padding: 0 16px; border: 1px solid rgba(255,255,255,.5); color: #fff; text-decoration: none; font-size: 10px; font-weight: 800; letter-spacing: .05em; }
.knot-hero-cta.primary { background: #f3eee6; color: #111; border-color: #f3eee6; }
.knot-hero-cta:hover, .knot-hero-cta:focus-visible { transform: translateY(-2px); outline: none; }
.knot-hero-cta.primary:hover, .knot-hero-cta.primary:focus-visible { background: #fff; }
.knot-home-categories { position: absolute; z-index: 5; left: 50%; bottom: 28px; width: min(100% - 32px, 760px); transform: translateX(-50%); }
.knot-home-categories .knot-floating-category-shell { max-width: 100%; margin: 0 auto; padding: 6px 10px; border-color: rgba(255,255,255,.22); background: rgba(8,8,8,.74); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.knot-home-categories .knot-floating-category-shell::before, .knot-home-categories .knot-floating-category-shell::after { display: none; }
.knot-home-categories .knot-category-row.knot-floating-category-row { justify-content: center; gap: 3px; }
.knot-home-categories .knot-floating-category-row .knot-pill { height: 34px; min-height: 34px; padding: 0 18px; border-color: transparent; background: transparent; color: rgba(255,255,255,.82); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; text-transform: uppercase; font-size: 11px; }
.knot-home-categories .knot-floating-category-row .knot-pill::before, .knot-home-categories .knot-floating-category-row .knot-pill::after { display: none; }
.knot-home-categories .knot-floating-category-row .knot-pill:hover { border-color: rgba(255,255,255,.24); background: rgba(255,255,255,.08); box-shadow: none; }
.knot-home-categories .knot-floating-category-row .knot-pill.is-active { border-color: #f3eee6; background: #f3eee6; color: #111; box-shadow: none; }
.knot-edit-hero-trigger { position: absolute; z-index: 6; top: 88px; right: 28px; min-height: 36px; padding: 0 14px; border: 1px solid rgba(255,255,255,.4); background: rgba(0,0,0,.58); color: #fff; cursor: pointer; font-weight: 700; }
.knot-edit-hero-trigger-fixed { position: fixed; z-index: 35; top: 82px; }

.knot-editorial-categories { overflow: hidden; padding: 78px 0 86px; background: var(--knot-page); color: var(--knot-text); }
.knot-editorial-header { width: min(1600px, calc(100% - 48px)); margin: 0 auto; }
.knot-editorial-heading-row { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 22px; }
.knot-editorial-heading-row h2 { margin: 0; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(27px, 2.4vw, 38px); font-weight: 400; letter-spacing: 0; }
.knot-editorial-heading-row > a { flex: 0 0 auto; color: inherit; text-decoration: none; font-size: 11px; font-weight: 800; letter-spacing: .06em; }
.knot-editorial-heading-row > a span { margin-left: 14px; font-size: 18px; }
.knot-editorial-grid { width: 100%; max-width: none; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-rows: repeat(2, clamp(270px, 19.5vw, 400px)); gap: 8px; margin: 0; padding: 0; }
.knot-editorial-card { position: relative; min-height: 0; overflow: hidden; background: #181818; color: #fff; text-decoration: none; }
.knot-editorial-card-slot-1 { grid-column: 1 / span 4; grid-row: 1 / span 2; }
.knot-editorial-card-slot-2 { grid-column: 5 / span 6; grid-row: 1; }
.knot-editorial-card-slot-3 { grid-column: 5 / span 4; grid-row: 2; }
.knot-editorial-card-slot-4 { grid-column: 9 / span 4; grid-row: 2; }
.knot-editorial-custom-wrap { position: relative; min-width: 0; grid-column: 11 / span 2; grid-row: 1; }
.knot-editorial-card-custom { width: 100%; height: 100%; display: block; }
.knot-editorial-card img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform 500ms var(--knot-ease), filter 300ms var(--knot-ease); }
.knot-editorial-card-shade { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.78), rgba(0,0,0,.05) 65%), linear-gradient(90deg, rgba(0,0,0,.25), transparent 65%); }
.knot-editorial-card-content { position: absolute; inset: auto 28px 25px; display: grid; justify-items: start; }
.knot-editorial-card-content strong { font-size: clamp(24px, 2vw, 34px); line-height: 1; text-transform: uppercase; }
.knot-editorial-card-content small { max-width: 210px; margin-top: 9px; color: rgba(255,255,255,.82); font-size: 14px; line-height: 1.35; }
.knot-editorial-card-content > span { margin-top: 20px; font-size: 21px; transition: transform var(--knot-fast) var(--knot-ease); }
.knot-editorial-card-custom .knot-editorial-card-content { inset-inline: 20px; }
.knot-editorial-card-custom .knot-editorial-card-content strong { font-size: clamp(20px, 1.7vw, 30px); }
.knot-editorial-card:hover img, .knot-editorial-card:focus-visible img { transform: scale(1.025); filter: brightness(1.08); }
.knot-editorial-card:hover .knot-editorial-card-content > span, .knot-editorial-card:focus-visible .knot-editorial-card-content > span { transform: translateX(4px); }
.knot-editorial-card:focus-visible { outline: 2px solid var(--knot-focus); outline-offset: 3px; }
.knot-edit-card-trigger { position: absolute; z-index: 3; top: 10px; right: 10px; min-height: 32px; padding: 0 11px; border: 1px solid rgba(255,255,255,.55); background: rgba(0,0,0,.68); color: #fff; cursor: pointer; font-weight: 800; }
.knot-home-card-editor { display: grid; gap: 14px; margin: 12px 0 0; border: 1px solid var(--knot-border); padding: 18px; }
.knot-home-card-editor legend { padding: 0 8px; font-weight: 900; }
.knot-home-card-editor small { color: var(--knot-muted); }

.knot-home-products { padding: 24px 0 48px; background: var(--knot-page); }
.knot-home-products > .container { width: 100%; max-width: none; padding-inline: 0; }
.knot-products-heading { width: min(1380px, calc(100% - 80px)); margin: 0 auto 24px; }
.knot-home-view-all { display: flex; justify-content: center; margin-top: 34px; }
.knot-home-view-all .knot-viewall { gap: 20px; }

.knot-home-carousel { overflow: hidden; padding: 52px 0 66px; border-top: 1px solid var(--knot-border); background: var(--knot-page); }
.knot-home-carousel-inner { width: 100%; margin: 0; }
.knot-carousel-heading { width: min(1380px, calc(100% - 80px)); display: flex; justify-content: space-between; align-items: end; gap: 24px; margin: 0 auto 24px; }
.knot-carousel-heading p { margin: 0 0 8px; color: var(--knot-muted); font-size: 10px; font-weight: 800; letter-spacing: .2em; }
.knot-carousel-heading h2 { margin: 0; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(27px, 2.4vw, 38px); font-weight: 400; letter-spacing: 0; }
.knot-carousel-controls { display: flex; gap: 8px; }
.knot-carousel-controls button { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--knot-border-strong); background: transparent; color: var(--knot-text); cursor: pointer; }
.knot-carousel-controls button:disabled { opacity: .28; cursor: default; }
.knot-carousel-controls button:not(:disabled):hover { background: var(--knot-primary); color: var(--knot-on-primary); }
.knot-carousel-icon { width: 19px; height: 19px; stroke: currentColor; stroke-width: 1.7; }
.knot-carousel-track { display: grid; grid-auto-flow: column; grid-auto-columns: 25%; gap: 0; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: inline mandatory; scroll-behavior: smooth; scrollbar-width: none; cursor: grab; }
.knot-carousel-track.is-dragging { cursor: grabbing; scroll-snap-type: none; scroll-behavior: auto; user-select: none; }
.knot-carousel-track::-webkit-scrollbar { display: none; }
.knot-carousel-track:focus-visible { outline: 2px solid var(--knot-focus); outline-offset: 4px; }
.knot-carousel-slide { position: relative; min-width: 0; aspect-ratio: 1 / 1; overflow: hidden; color: var(--knot-text); text-decoration: none; scroll-snap-align: start; border-right: 1px solid var(--knot-border); border-bottom: 1px solid var(--knot-border); background: var(--knot-surface-muted); cursor: pointer; }
.knot-carousel-image { position: absolute; inset: 0; display: block; overflow: hidden; background: var(--knot-surface-muted); }
.knot-carousel-image img { width: 100%; height: 100%; padding: 0; display: block; object-fit: contain; object-position: center; transition: none; }
.knot-carousel-meta { position: absolute; z-index: 1; right: 0; bottom: 0; left: 0; min-height: 88px; display: flex; align-items: center; flex-direction: column; justify-content: center; padding: 8px 10px 10px; border-top: 1px solid var(--knot-border); background: var(--knot-surface); color: var(--knot-text); text-align: center; transform: translateY(calc(100% - 12px)); transition: transform 420ms cubic-bezier(.22,1,.36,1), background-color 220ms ease; }
.knot-carousel-meta small { display: none; }
.knot-carousel-meta strong { width: 100%; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; color: var(--knot-text); font-family: Georgia, 'Times New Roman', serif; font-size: 14px; font-weight: 600; letter-spacing: .04em; line-height: 1.2; text-align: center; white-space: normal; transition: transform 320ms cubic-bezier(.22,1,.36,1); }
.knot-carousel-price { display: block; margin-top: 5px; color: var(--knot-text); font-size: 12px; line-height: 1.2; font-weight: 700; letter-spacing: .06em; }
.knot-carousel-price s { margin-left: 6px; color: var(--knot-muted); font-size: 10px; font-weight: 400; opacity: .58; text-decoration-thickness: 1px; }
.knot-carousel-slide:hover .knot-carousel-meta, .knot-carousel-slide:focus-visible .knot-carousel-meta { background: var(--knot-surface-raised); transform: translateY(0); }
.knot-carousel-slide:hover .knot-carousel-meta strong, .knot-carousel-slide:focus-visible .knot-carousel-meta strong { transform: translateY(-2px); }
.knot-carousel-slide:hover .knot-carousel-image img, .knot-carousel-slide:focus-visible .knot-carousel-image img { transform: none; filter: none; }
.knot-carousel-slide:focus-visible { outline: 2px solid var(--knot-focus); outline-offset: -2px; }
.knot-home .knot-tagline { margin-top: 0; }
.knot-category-admin-image { width: min(100%, 420px); aspect-ratio: 16 / 10; object-fit: cover; border: 1px solid var(--knot-border); }

.knot-hero-editor-backdrop { position: fixed; inset: 0; z-index: 70; background: rgba(0,0,0,.7); opacity: 0; transition: opacity var(--knot-med) var(--knot-ease); }
.knot-hero-editor-backdrop.is-open { opacity: 1; }
.knot-hero-editor { position: fixed; z-index: 71; top: 4vh; right: 4vw; bottom: 4vh; width: min(680px, 92vw); overflow-y: auto; padding: 26px; background: var(--knot-surface-raised); color: var(--knot-text); border: 1px solid var(--knot-border); transform: translateX(calc(100% + 5vw)); transition: transform var(--knot-med) var(--knot-ease); }
.knot-hero-editor.is-open { transform: translateX(0); }
.knot-hero-editor .knot-menu-head { margin-bottom: 22px; }
.knot-hero-editor-form { gap: 16px; }
.knot-two-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.knot-hero-editor-actions { display: flex; justify-content: flex-end; gap: 10px; }
.knot-hero-editor-actions .knot-btn { min-width: 120px; }

@media (max-width: 920px) {
    .knot-public-topbar .knot-nav { width: 100%; padding-inline: 18px; }
    .knot-public-topbar.is-search-open .knot-brand { opacity: 0; pointer-events: none; }
    .knot-public-topbar .knot-brand { transition: opacity 180ms ease; }
    .knot-hero-content { left: 50%; top: 49%; width: min(640px, calc(100% - 56px)); }
    .knot-hero-content h1 { font-size: clamp(40px, 6.5vw, 60px); }
    .knot-editorial-header { width: calc(100% - 40px); }
    .knot-editorial-grid { grid-template-columns: 1fr 1fr; grid-template-rows: 300px 240px 240px; }
    .knot-editorial-card-slot-1 { grid-column: 1; grid-row: 1 / 3; }
    .knot-editorial-card-slot-2 { grid-column: 2; grid-row: 1; }
    .knot-editorial-custom-wrap { grid-column: 2; grid-row: 2; }
    .knot-editorial-card-slot-3 { grid-column: 1; grid-row: 3; }
    .knot-editorial-card-slot-4 { grid-column: 2; grid-row: 3; }
    .knot-carousel-track { grid-auto-columns: 33.3333%; }
}

@media (max-width: 576px) {
    .knot-public-topbar .knot-nav { width: 100%; padding-inline: 16px; grid-template-columns: 1fr auto 1fr; }
    .knot-public-topbar .knot-brand { grid-column: 2; justify-self: center; }
    .knot-public-topbar .knot-nav-links { grid-column: 3; gap: 8px; }
    .knot-public-topbar .knot-desktop-search { display: none; }
    .knot-public-topbar.is-search-open .knot-brand { opacity: 1; pointer-events: auto; }
    .knot-listing-categories { top: calc(var(--knot-nav-height) + 6px); margin-top: -8px; padding-inline: 0; }
    .knot-menu-toggle { --knot-menu-icon-width: 24px; width: 42px; height: 42px; }
    .knot-editorial-hero .knot-hero-slide img { object-position: center center; }
    .knot-editorial-hero-shade { background: linear-gradient(0deg, rgba(0,0,0,calc(var(--hero-overlay) + .5)) 0%, rgba(0,0,0,calc(var(--hero-overlay) * .72)) 52%, rgba(0,0,0,.18) 100%); }
    .knot-hero-content { left: 50%; top: 51%; width: calc(100% - 36px); }
    .knot-hero-eyebrow { margin-bottom: 9px; font-size: 9px; }
    .knot-hero-content h1 { font-size: clamp(32px, 9.5vw, 44px); line-height: .96; }
    .knot-hero-copy { max-width: 320px; margin-top: 11px; font-size: 12px; line-height: 1.45; }
    .knot-hero-actions { gap: 8px; margin-top: 16px; }
    .knot-hero-cta { min-width: 116px; min-height: 40px; padding-inline: 13px; gap: 14px; font-size: 9px; }
    .knot-home-categories { bottom: 20px; width: calc(100% - 20px); }
    .knot-home-categories .knot-category-row.knot-floating-category-row { justify-content: flex-start; }
    .knot-home-categories .knot-floating-category-row .knot-pill { height: 31px; min-height: 31px; padding: 0 8px; font-size: 9px; }
    .knot-edit-hero-trigger { top: 72px; right: 14px; }
    .knot-editorial-categories { padding: 52px 0 58px; }
    .knot-editorial-header { width: calc(100% - 24px); }
    .knot-editorial-heading-row { align-items: start; }
    .knot-editorial-heading-row h2 { font-size: 27px; }
    .knot-editorial-heading-row > a { margin-top: 8px; font-size: 9px; }
    .knot-editorial-grid { width: calc(100% - 16px); grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-rows: repeat(2, clamp(150px, 46vw, 190px)); gap: 4px; margin-inline: 8px; }
    .knot-editorial-card-slot-1 { grid-column: 1 / span 4; grid-row: 1 / span 2; }
    .knot-editorial-card-slot-2 { grid-column: 5 / span 5; grid-row: 1; }
    .knot-editorial-custom-wrap { grid-column: 10 / span 3; grid-row: 1; }
    .knot-editorial-card-slot-3 { grid-column: 5 / span 4; grid-row: 2; }
    .knot-editorial-card-slot-4 { grid-column: 9 / span 4; grid-row: 2; }
    .knot-editorial-card-content { inset: auto 8px 9px; }
    .knot-editorial-card-content strong { font-size: clamp(10px, 3.4vw, 14px); line-height: 1; }
    .knot-editorial-card-content small { margin-top: 4px; font-size: 8px; line-height: 1.15; }
    .knot-editorial-card-content > span { margin-top: 8px; font-size: 14px; }
    .knot-editorial-card-custom .knot-editorial-card-content { inset-inline: 6px; }
    .knot-editorial-card-custom .knot-editorial-card-content strong { font-size: clamp(10px, 3vw, 13px); }
    .knot-editorial-custom-wrap .knot-edit-card-trigger { top: 4px; right: 4px; min-height: 24px; padding: 0 6px; font-size: 9px; }
    .knot-product-customize-cta { max-width: 100%; align-items: stretch; flex-direction: column; }
    .knot-product-customize-button { width: 100%; }
    .knot-home-products { padding-bottom: 46px; }
    .knot-home-view-all { margin-top: 28px; }
    .knot-home-carousel { padding: 42px 0 50px; }
    .knot-carousel-heading { align-items: center; }
    .knot-carousel-heading h2 { font-size: 27px; }
    .knot-carousel-controls button { width: 38px; height: 38px; }
    .knot-carousel-track { grid-auto-columns: 50%; }
    .knot-pdp-zoom-cue { right: 20px; bottom: 20px; opacity: 1; transform: none; }
    .knot-product-lightbox { padding: 12px; }
    .knot-product-lightbox-panel { width: 100%; height: 92vh; grid-template-columns: 42px minmax(0, 1fr) 42px; gap: 5px; }
    .knot-product-lightbox-arrow { width: 40px; height: 48px; }
    .knot-product-lightbox-stage.is-zoomed img { transform: scale(1.45); }
    .knot-two-columns { grid-template-columns: 1fr; }
    .knot-hero-editor { inset: 0; width: 100%; padding: 20px; }
}

@media (max-width: 1024px) {
    .knot-desktop-search.is-open .knot-desktop-search-form { width: min(320px, calc(100vw - 184px)); }
    .knot-product-grid-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
    .knot-product-grid-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .knot-listing-page .knot-page-head, .knot-listing-page .knot-product-load-zone { width: calc(100% - 24px); }
    .knot-products-heading, .knot-carousel-heading { width: calc(100% - 24px); }
    .knot-card-link { aspect-ratio: auto; overflow: visible; }
    .knot-card-link .knot-product-card { position: relative; inset: auto; display: block; }
    .knot-carousel-slide { aspect-ratio: auto; display: block; }
    .knot-card-link .knot-product-imgwrap, .knot-carousel-image { position: relative; inset: auto; min-height: 0; aspect-ratio: 1 / 1; }
    .knot-card-link .knot-product-meta, .knot-carousel-meta { position: relative; inset: auto; min-height: 0; padding: 8px; transform: none; }
    .knot-product-category, .knot-carousel-meta small { display: none; }
    .knot-product-name, .knot-carousel-meta strong { font-size: 12px; }
    .knot-product-bottom { gap: 1px; margin-top: 4px; font-size: 10px; }
    .knot-save { font-size: 9px; }
}

@media (hover: none) {
    .knot-card-link { aspect-ratio: auto; overflow: visible; }
    .knot-card-link .knot-product-card { position: relative; inset: auto; display: block; }
    .knot-carousel-slide { aspect-ratio: auto; display: block; }
    .knot-card-link .knot-product-imgwrap, .knot-carousel-image { position: relative; inset: auto; min-height: 0; aspect-ratio: 1 / 1; }
    .knot-card-link .knot-product-meta, .knot-carousel-meta { position: relative; inset: auto; min-height: 0; transform: none; }
    .knot-product-name, .knot-carousel-meta strong { transform: none; opacity: 1; }
}

@media (min-width: 1025px) {
    .knot-editorial-hero {
        height: 80vh;
        height: 80svh;
    }

    .knot-editorial-hero .knot-hero-slide img {
        object-fit: contain;
        object-position: center center;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .knot-editorial-hero {
        height: 70vh;
        height: 70svh;
    }
}

@media (max-width: 1024px) {
    .knot-editorial-hero .knot-hero-slide img {
        object-fit: cover;
        object-position: center center;
    }
}

@media (max-width: 380px) {
    .knot-public-topbar .knot-nav { padding-inline: 14px; }
    .knot-public-topbar .knot-logo { width: 80px; }
    .knot-menu-toggle { --knot-menu-icon-width: 23px; width: 40px; height: 40px; }
}

@media (prefers-reduced-motion: reduce) {
    .knot-desktop-search-form, .knot-desktop-search-form input, .knot-public-topbar .knot-brand, .knot-menu-toggle, .knot-menu-toggle-line, .knot-menu-drawer, .knot-menu-overlay { transition-duration: .01ms !important; }
    .knot-card-link .knot-product-meta, .knot-carousel-meta { transform: translateY(0); }
    .knot-product-name, .knot-carousel-meta strong { transform: none; opacity: 1; }
    .knot-card-link .knot-product-img, .knot-carousel-image img { transform: none !important; filter: none !important; }
}

/* Desktop homepage hero: keep the navigation over a full 16:9 banner. */
@media (min-width: 921px) {
    .knot-home-topbar,
    .knot-home-topbar.is-scrolled {
        position: fixed;
        inset: 0 0 auto;
        z-index: 32;
        background: rgba(7, 12, 18, .64);
        color: #fff;
        border-bottom-color: rgba(255, 255, 255, .16);
        backdrop-filter: blur(2px) saturate(110%);
        -webkit-backdrop-filter: blur(2px) saturate(110%);
    }

    .knot-home-topbar .knot-logo {
        filter: brightness(0) invert(1);
    }

    .knot-home-topbar .knot-menu-toggle,
    .knot-home-topbar .knot-nav-links .knot-nav-icon-button,
    .knot-home-topbar .knot-nav-links .knot-desktop-search-form,
    .knot-home-topbar .knot-nav-links .knot-desktop-search-form button {
        color: #fff;
    }

    .knot-home-topbar .knot-nav-icon-button:hover,
    .knot-home-topbar .knot-nav-icon-button:focus-visible,
    .knot-home-topbar .knot-nav-icon-button.is-active {
        color: #fff;
    }

    .knot-editorial-hero {
        height: auto;
        min-height: 0;
        aspect-ratio: 16 / 9;
    }

    .knot-editorial-hero .knot-hero-slide img {
        object-fit: contain;
        object-position: center center;
    }

    .knot-editorial-hero-shade {
        background: linear-gradient(90deg, rgba(0, 0, 0, calc(var(--hero-overlay) + .36)) 0%, rgba(0, 0, 0, calc(var(--hero-overlay) + .14)) 42%, rgba(0, 0, 0, .04) 72%, transparent 100%);
    }

    .knot-hero-content {
        left: clamp(64px, 13vw, 210px);
        top: 52%;
        width: min(570px, 40vw);
        transform: translateY(-50%);
        text-align: left;
    }

    .knot-hero-content h1,
    .knot-hero-copy {
        margin-left: 0;
        margin-right: 0;
    }

    .knot-hero-actions {
        justify-content: flex-start;
    }

    .knot-editorial-hero .knot-home-categories {
        display: none;
    }

    body.knot-reveal-ready .knot-hero-content {
        transform: translateY(calc(-50% + 24px));
    }

    body.knot-reveal-ready .knot-hero-content.is-visible {
        transform: translateY(-50%);
    }
}

@media (max-width: 920px) {
    .knot-home-topbar,
    .knot-home-topbar.is-scrolled {
        background: rgba(7, 12, 18, .75);
        color: #fff;
        border-bottom-color: rgba(255, 255, 255, .16);
        backdrop-filter: blur(2px) brightness(35%) saturate(90%);
        -webkit-backdrop-filter: blur(2px) brightness(35%) saturate(90%);
    }

    .knot-home-topbar .knot-logo {
        filter: brightness(0) invert(1);
    }

    .knot-home-topbar .knot-menu-toggle,
    .knot-home-topbar .knot-nav-links .knot-nav-icon-button,
    .knot-home-topbar .knot-nav-icon-button:hover,
    .knot-home-topbar .knot-nav-icon-button:focus-visible,
    .knot-home-topbar .knot-nav-icon-button.is-active {
        color: #fff;
    }

    .knot-home-topbar .knot-menu-toggle:focus-visible {
        outline-color: #fff;
    }
}

@media (min-width: 921px) and (prefers-reduced-motion: reduce) {
    body.knot-reveal-ready .knot-hero-content,
    body.knot-reveal-ready .knot-hero-content.is-visible {
        transform: translateY(-50%) !important;
    }
}