@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url("../fonts/ibm-plex-YHB-bFe.woff2") format("woff2")}@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400 600;font-display:swap;src:url("../fonts/ibm-plex-YHB-bFe.woff2") format("woff2")}
:root{--bg:#f4f1ea;--surface:#fffdf8;--surface-2:#f8f5ee;--ink:#111;--muted:#645f57;--line:#d7d0c7;--accent:#c93126;--accent-soft:#f7e5e1;--green:#24764e;--green-soft:#e4f3e9;--amber:#a25c00;--amber-soft:#fff1d6;--blue:#245ca5;--blue-soft:#e7effc;--danger:#a32626;--shadow:0 20px 60px rgba(17,17,17,.07);--radius:24px;--wrap:min(1420px,calc(100vw - 40px));color-scheme:light;font-family:"IBM Plex Sans","Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}
:root[data-theme=dark]{--bg:#171614;--surface:#22201d;--surface-2:#2c2925;--ink:#f7f2e9;--muted:#c1b8aa;--line:#4a443c;--accent:#ff776c;--accent-soft:#482724;--green:#73c89a;--green-soft:#203b2d;--amber:#ffc36d;--amber-soft:#483719;--blue:#82b5ff;--blue-soft:#243650;--danger:#ff8b8b;--shadow:0 20px 60px rgba(0,0,0,.28);color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(to right,rgba(17,17,17,.035) 1px,transparent 1px) 0 0/24px 24px,var(--bg);min-height:100vh}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}p{line-height:1.55}h1,h2,h3,p{margin-top:0}h1,h2,h3{letter-spacing:-.035em}.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}.skip-link{position:fixed;left:-9999px}.skip-link:focus{left:16px;top:16px;z-index:9999;background:var(--surface);padding:12px 18px;border:2px solid var(--accent);border-radius:12px}.mono{font-family:"IBM Plex Mono",monospace}.muted{color:var(--muted)}
.topbar{position:sticky;top:0;z-index:100;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(18px)}.topbar__inner{width:var(--wrap);min-height:76px;margin:auto;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px}.brand{display:flex;align-items:center;gap:12px;font-weight:700;line-height:1.05}.brand__mark{width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:#111!important;color:#fff!important;font:600 13px "IBM Plex Mono",monospace}.brand small{display:block;margin-top:5px;color:var(--muted);font-size:10px;letter-spacing:.08em;text-transform:uppercase}.persona-nav{display:flex;justify-content:center;gap:6px;flex-wrap:wrap}.persona-nav a{padding:9px 13px;border-radius:999px;color:var(--muted);font-size:14px;font-weight:600}.persona-nav a:hover,.persona-nav a[aria-current=page]{color:var(--ink);background:var(--surface-2)}.topbar__status{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px}.connection-dot,.health-dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px var(--green-soft)}.icon-button{min-width:38px;height:38px;border:1px solid var(--line);border-radius:50%;background:var(--surface);font-weight:700}.theme-toggle{display:inline-flex;align-items:center;justify-content:center;width:40px;min-width:40px;height:40px;padding:0;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--ink);cursor:pointer;transition:background-color .15s ease,border-color .15s ease,color .15s ease,transform .15s ease;flex-shrink:0;box-sizing:border-box}.theme-toggle:hover{background:var(--surface-2);border-color:var(--ink);color:var(--ink);transform:translateY(-1px)}.theme-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.theme-toggle:active{transform:translateY(0)}.theme-toggle__icon{width:20px;height:20px;stroke:currentColor;fill:none;flex-shrink:0;display:block}:root[data-theme=dark] .theme-toggle__sun{display:block}:root[data-theme=dark] .theme-toggle__moon{display:none}:root:not([data-theme=dark]) .theme-toggle__sun{display:none}:root:not([data-theme=dark]) .theme-toggle__moon{display:block}@media(prefers-color-scheme:dark){:root:not([data-theme=light]):not([data-theme=dark]) .theme-toggle__sun{display:block}:root:not([data-theme=light]):not([data-theme=dark]) .theme-toggle__moon{display:none}}
.workspace{width:var(--wrap);margin:auto;padding:38px 0 84px}.page-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin:10px 0 28px}.page-heading h1{margin:7px 0 8px;font-size:clamp(2.25rem,5vw,4.8rem);line-height:.96}.page-heading p{margin:0;color:var(--muted);font-size:1.08rem;max-width:720px}.eyebrow,.eyebrow-text{font:600 11px "IBM Plex Mono",monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}.eyebrow{display:flex;align-items:center;gap:10px}.eyebrow:before{content:"";width:32px;height:2px;background:currentColor}.eyebrow--light{color:#fff}.section{margin-top:72px}.section-head,.card__head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}.section-head{align-items:flex-end;margin-bottom:22px}.section-head h2,.card__head h2{margin:6px 0 0}.section-head h2{font-size:clamp(2rem,4vw,3.5rem)}.card__head p{margin:7px 0 0;color:var(--muted)}
.button,.link-button,.pagination button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #111;border-radius:999px;padding:0 18px;background:#111;color:#fff;font-weight:700;text-decoration:none;transition:transform .15s,opacity .15s}.button:hover{transform:translateY(-1px)}.button:disabled{opacity:.45;cursor:not-allowed;transform:none}.button--ghost{background:transparent;color:var(--ink);border-color:var(--line)}.button--light{background:#fff;color:#111;border-color:#fff}.button--outline-light{background:rgba(255,255,255,.05);color:#fff;border-color:rgba(255,255,255,.4)}.button--block{width:100%}.button--small{min-height:36px;padding:0 13px;font-size:13px}.link-button{min-height:auto;padding:3px;border:0;border-radius:0;background:transparent;color:var(--accent);font-size:13px}.button-group,.hero-actions,.form-actions,.page-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.grow{flex:1 1 260px}.file-button{position:relative;overflow:hidden}.file-button input{position:absolute;inset:0;opacity:0;cursor:pointer}
.public-hero{min-height:650px;border-radius:34px;padding:clamp(30px,6vw,78px);display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.5fr);align-items:end;gap:40px;color:#fff;background:radial-gradient(circle at 76% 22%,rgba(201,49,38,.7),transparent 31%),linear-gradient(125deg,#111 0%,#24201c 68%,#111 100%);box-shadow:var(--shadow)}.public-hero__copy{max-width:860px}.public-hero h1{font-size:clamp(3rem,7vw,7rem);line-height:.88;margin:18px 0 24px}.public-hero p{max-width:680px;color:rgba(255,255,255,.78);font-size:1.15rem}.public-hero__facts{display:grid;gap:1px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.2);border-radius:24px;overflow:hidden}.public-hero__facts div{display:grid;padding:20px;background:rgba(17,17,17,.64);backdrop-filter:blur(14px)}.public-hero__facts strong{font-size:1.35rem}.public-hero__facts span{color:rgba(255,255,255,.7);font-size:13px}.split-callout{padding:42px;border:1px solid var(--line);border-radius:30px;background:var(--surface);display:flex;justify-content:space-between;align-items:center;gap:30px}.split-callout h2{font-size:2.2rem;margin:8px 0}.split-callout p{margin:0;color:var(--muted)}
.product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.product-card{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:24px;background:var(--surface);box-shadow:var(--shadow)}.product-card__media{aspect-ratio:4/3;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent-soft),var(--surface-2));border-bottom:1px solid var(--line)}.product-card__media span{width:80px;height:80px;display:grid;place-items:center;border-radius:24px;background:rgba(255,255,255,.7);font:600 30px "IBM Plex Mono";color:var(--accent)}.product-card__body{padding:18px;display:grid;gap:13px}.product-card h3{font-size:1.14rem;margin:0}.product-card__body p{margin:0}.product-card__meta{padding-top:12px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted);font-size:13px}.product-card__meta strong{color:var(--ink);font-size:1.08rem}
.tabs-shell{margin-top:24px}.tablist{display:flex;gap:6px;overflow:auto;padding:6px;margin-bottom:16px;border:1px solid var(--line);border-radius:999px;background:var(--surface);width:max-content;max-width:100%;scrollbar-width:none}.tablist button{min-height:42px;padding:0 16px;border:0;border-radius:999px;background:transparent;color:var(--muted);white-space:nowrap;font-weight:600}.tablist button[aria-selected=true]{background:var(--ink);color:var(--surface)}.counter{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;margin-left:5px;border-radius:10px;background:var(--accent);color:#fff;font-size:11px}.card,.toolbar-card,.metric-grid article,.scanner-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow)}.card{padding:24px}.card .card{box-shadow:none}.content-grid{display:grid;gap:16px}.content-grid--aside{grid-template-columns:minmax(0,1.5fr) minmax(290px,.5fr)}.content-grid--wide{grid-template-columns:repeat(2,minmax(0,1fr))}.filterbar{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;margin:20px 0}.filterbar label{margin:0}.search-field{min-height:46px;display:flex;align-items:center;border:1px solid var(--line);border-radius:999px;background:var(--surface);padding:0 16px}.search-field input{width:100%;border:0;outline:0;background:transparent}.search-field kbd{color:var(--muted);white-space:nowrap}.filterbar select,.filterbar>label:not(.search-field) input,.toolbar-card select{min-height:46px;border:1px solid var(--line);border-radius:14px;background:var(--surface);padding:0 14px}.filterbar>label:not(.search-field),.toolbar-card label{display:grid;gap:5px;font-size:12px;color:var(--muted)}
.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:24px}.metric-grid article{padding:20px;display:grid;gap:6px}.metric-grid span,.metric-grid small{color:var(--muted);font-size:13px}.metric-grid strong{font-size:1.75rem;letter-spacing:-.05em}.positive{color:var(--green)!important}.warning-text{color:var(--danger)!important}.toolbar-card{display:flex;align-items:end;gap:18px;padding:18px;margin-bottom:16px}.toolbar-card label{flex:1}.toolbar-card__summary{display:grid;gap:4px;padding:0 20px;border-left:1px solid var(--line)}.toolbar-card__summary span{font-size:12px;color:var(--muted)}.mode-grid{display:grid;grid-template-columns:230px minmax(0,1fr);gap:16px}.mode-nav{align-self:start;position:sticky;top:96px;padding:9px;border:1px solid var(--line);border-radius:22px;background:var(--surface)}.mode-nav__label{display:block;padding:10px 12px;color:var(--muted);font:600 10px "IBM Plex Mono";letter-spacing:.1em;text-transform:uppercase}.mode-nav button{width:100%;min-height:46px;display:flex;align-items:center;gap:10px;padding:0 12px;border:0;border-radius:14px;background:transparent;text-align:left;font-weight:600}.mode-nav button[aria-selected=true]{background:#111;color:#fff}.scanner-card{padding:24px}.scanner-drop{min-height:350px;display:grid;place-content:center;justify-items:center;text-align:center;padding:28px;border:2px dashed var(--line);border-radius:20px;background:var(--surface-2)}.scanner-drop__icon{width:72px;height:72px;display:grid;place-items:center;border-radius:22px;background:var(--accent-soft);color:var(--accent);font-size:34px}.scanner-drop h2{margin:18px 0 8px;font-size:2rem}.scanner-drop p{max-width:580px;margin:0 0 20px;color:var(--muted)}.scanner-drop video{width:min(600px,100%);margin-top:18px;border-radius:16px}.recognition-review{display:grid;gap:18px;margin-top:18px;padding-top:22px;border-top:1px solid var(--line)}.evidence-note{display:grid;gap:5px;padding:15px;border-radius:14px;background:var(--amber-soft);color:var(--amber)}.evidence-note span{font-size:13px}.evidence-list{padding:14px}.evidence-list p{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding-bottom:10px}.batch-queue{display:grid;gap:8px;margin:18px 0}.queue-item,.draft-card,.job-row{display:flex;align-items:center;gap:14px;padding:14px;border:1px solid var(--line);border-radius:16px}.queue-item__thumb{width:44px;height:44px;display:grid;place-items:center;border-radius:10px;background:var(--surface-2);font-family:"IBM Plex Mono"}.queue-item>div,.draft-card>div:first-child,.job-row>div:first-child{display:grid;gap:3px;flex:1}.queue-item small,.draft-card p,.job-row small{margin:0;color:var(--muted)}
.recognition-evidence{display:grid;gap:12px;padding:18px;border:1px solid var(--line);border-radius:18px;background:var(--surface-2)}.recognition-evidence h3,.recognition-evidence p{margin:0}.recognition-evidence[data-provenance=observed]{border-color:var(--green);background:var(--green-soft)}.recognition-evidence[data-provenance=estimated]{border-color:#b97713;background:var(--amber-soft)}.recognition-evidence[data-provenance=unavailable]{border-color:var(--danger)}.save-state[data-state=stale]{color:var(--amber)}.save-state[data-state=offline]{color:var(--danger)}
.evidence-list{display:grid;gap:14px;min-width:0}.evidence-source{display:grid;gap:6px;min-width:0;overflow-wrap:anywhere}.evidence-source+.evidence-source{border-top:1px solid var(--line);padding-top:12px}.recognition-evidence[data-pricing-mode=similar_items]{border:2px solid #b42318}.recognition-evidence[data-pricing-mode=similar_items] h3{color:var(--danger)}.recognition-evidence[data-pricing-mode=similar_items] .evidence-note{color:#9c1c13}.recognition-evidence[data-pricing-mode=similar_items] .evidence-note{background:#fff0ef;font-weight:600}
.form-grid{display:grid;gap:16px}.form-grid--two{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid label,.checkout label{display:grid;gap:7px;font-weight:600;font-size:13px}.form-grid input,.form-grid select,.form-grid textarea,.checkout input,.checkout textarea,.inline-field input,.inline-field select{width:100%;min-width:0;min-height:46px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);padding:10px 13px}.form-grid textarea,.checkout textarea{resize:vertical}.form-actions{padding-top:4px}.save-state{color:var(--muted);font-size:13px}.form-grid[data-dirty=true]{box-shadow:0 0 0 3px var(--amber-soft)}.inline-field{width:min(620px,100%);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin-top:18px}.form-note{margin:8px 0 0;color:var(--muted);font-size:12px}.recognition-review[hidden],.recognition-review [hidden]{display:none!important}
.line-items{display:grid}.line-items>div{display:flex;justify-content:space-between;gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}.order-total,.checkout{align-self:start;position:sticky;top:100px}.order-total>span{color:var(--muted)}.order-total>strong,.checkout__total{display:block;margin:6px 0 22px;font-size:2.5rem;letter-spacing:-.06em}.order-total label{display:grid;gap:7px;margin-bottom:14px;font-size:13px;font-weight:600}.order-total input{min-height:46px;border:1px solid var(--line);border-radius:12px;padding:0 12px}.checkout{display:grid;gap:16px}.checkout fieldset{border:0;padding:0;margin:0}.checkout legend{font-size:13px;font-weight:700;margin-bottom:8px}.segmented{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.segmented input{position:absolute;opacity:0}.segmented span{min-height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:12px}.segmented input:checked+span{background:#111;color:#fff;border-color:#111}.check{display:flex!important;align-items:center;gap:8px!important;min-height:46px}.check input{width:auto!important;min-height:auto!important}
.table-wrap{overflow:auto;margin:18px -4px 0}.table-wrap table{width:100%;border-collapse:collapse;min-width:760px}.table-wrap th,.table-wrap td{padding:14px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}.table-wrap th{color:var(--muted);font:600 10px "IBM Plex Mono";letter-spacing:.08em;text-transform:uppercase}.table-wrap td{font-size:14px}.table-wrap td strong,.table-wrap td small{display:block}.table-wrap td small{margin-top:4px;color:var(--muted)}.editable-table input:not([type=checkbox]),.editable-table select{width:110px;min-height:38px;border:1px solid transparent;border-radius:9px;background:var(--surface-2);padding:0 8px}.editable-table input:focus,.editable-table select:focus{border-color:var(--accent);outline:0}.table-footer{display:flex;justify-content:space-between;align-items:center;padding-top:16px;color:var(--muted);font-size:13px}.pagination{display:flex;gap:4px}.pagination button,.pagination strong{width:34px;height:34px;min-height:34px;padding:0;border-color:var(--line);background:transparent;color:var(--ink);display:grid;place-items:center}.status{display:inline-flex;align-items:center;gap:7px;width:max-content;padding:6px 9px;border-radius:999px;background:var(--surface-2);font-size:11px;font-weight:700;white-space:nowrap}.status>span{width:7px;height:7px;border-radius:50%;background:var(--muted)}.status--success,.status--ready{background:var(--green-soft);color:var(--green)}.status--success>span,.status--ready>span{background:var(--green)}.status--queued,.status--review{background:var(--amber-soft);color:var(--amber)}.status--queued>span,.status--review>span{background:var(--amber)}.status--danger{background:#fae4e4;color:var(--danger)}.status--danger>span{background:var(--danger)}.tag{display:inline-flex;padding:5px 8px;border-radius:8px;background:var(--surface-2);font-size:11px}.timeline{list-style:none;padding:8px 0;margin:0}.timeline li{display:grid;grid-template-columns:46px 14px 1fr;gap:12px;position:relative;padding:12px 0}.timeline time{font:400 12px "IBM Plex Mono";color:var(--muted)}.timeline__dot{width:10px;height:10px;margin-top:3px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.timeline__dot:after{content:"";position:absolute;width:1px;height:calc(100% - 18px);top:28px;margin-left:4px;background:var(--line)}.timeline li:last-child .timeline__dot:after{display:none}.timeline p{margin:3px 0;color:var(--muted);font-size:13px}
.bar-chart{height:280px;display:grid;grid-template-columns:repeat(7,1fr);align-items:end;gap:10px;padding-top:30px}.bar-chart div{height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px}.bar-chart div span{width:min(44px,80%);min-height:8px;border-radius:10px 10px 3px 3px;background:var(--accent)}.bar-chart small{color:var(--muted)}.attention-list{list-style:none;margin:8px 0 0;padding:0}.attention-list li{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.attention-list li:last-child{border:0}.attention-list div{display:grid}.attention-list small{color:var(--muted);margin-top:3px}.attention-list button{border:0;background:transparent;color:var(--accent);font-weight:700}.attention-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:var(--accent-soft);color:var(--accent);font-weight:800}.report-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:18px}.report-grid button{display:grid;gap:5px;text-align:left;padding:18px;border:1px solid var(--line);border-radius:16px;background:var(--surface-2)}.report-grid span{color:var(--muted);font-size:12px}.progress{height:8px!important;max-width:180px;background:var(--surface-2);border-radius:5px;overflow:hidden}.progress span{display:block;height:100%;background:var(--accent)}
.panel-layout{display:grid;grid-template-columns:235px minmax(0,1fr);gap:18px}.panel-nav{position:sticky;top:96px;align-self:start;display:grid;gap:4px;padding:10px;border:1px solid var(--line);border-radius:22px;background:var(--surface)}.panel-nav>span{padding:12px;color:var(--muted);font:600 10px "IBM Plex Mono";letter-spacing:.1em;text-transform:uppercase}.panel-nav button{min-height:43px;padding:0 12px;border:0;border-radius:12px;background:transparent;text-align:left;font-weight:600}.panel-nav button[aria-selected=true]{background:#111;color:#fff}.summary-list{display:grid;margin-top:14px}.summary-list a{display:flex;justify-content:space-between;gap:20px;padding:15px 0;border-bottom:1px solid var(--line)}.summary-list a:last-child{border:0}.summary-list span{color:var(--muted);font-size:13px;text-align:right}.system-map{display:flex;align-items:center;gap:13px;margin-top:20px}.system-map>div{flex:1;display:grid;gap:4px;padding:17px;border:1px solid var(--line);border-radius:15px}.system-map__master{border-color:var(--accent)!important;background:var(--accent-soft)}.system-map span{color:var(--muted);font-size:12px}.system-arrow{font-size:22px}.integration-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.key-values{display:grid;margin:16px 0}.key-values div{display:flex;justify-content:space-between;gap:20px;padding:11px 0;border-bottom:1px solid var(--line)}.key-values dt{color:var(--muted)}.key-values dd{margin:0;font-weight:600;text-align:right}.health-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:18px}.health-grid>div{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;align-items:center;padding:15px;border:1px solid var(--line);border-radius:14px}.health-grid small{grid-column:2;color:var(--muted)}.health-dot{grid-row:1/3}.health-dot--off{background:var(--muted);box-shadow:0 0 0 4px var(--surface-2)}.empty-state{padding:44px 20px;text-align:center}.empty-state__icon{width:58px;height:58px;margin:auto auto 14px;display:grid;place-items:center;border-radius:18px;background:var(--surface-2);font-size:25px}.empty-state p{max-width:580px;margin:0 auto;color:var(--muted)}.bitrix-banner{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px;border-radius:24px;background:#111;color:#fff}.bitrix-banner h1{margin:7px 0 5px}.bitrix-banner p{margin:0;color:rgba(255,255,255,.7)}.toast-stack{position:fixed;right:18px;bottom:18px;z-index:200;max-width:min(390px,calc(100vw - 36px));padding:0}.toast-stack:not(:empty){padding:13px 16px;border-radius:14px;background:#111;color:#fff;box-shadow:var(--shadow)}
:focus-visible{outline:3px solid #2463eb;outline-offset:3px}@media(max-width:1100px){.product-grid{grid-template-columns:repeat(2,1fr)}.metric-grid{grid-template-columns:repeat(2,1fr)}.topbar__inner{grid-template-columns:auto 1fr auto}.topbar__status>.connection-dot,.topbar__status>span{display:none}.persona-nav{justify-content:flex-end}.content-grid--wide{grid-template-columns:1fr}.panel-layout{grid-template-columns:1fr}.panel-nav{position:static;display:flex;overflow:auto;scrollbar-width:none}.panel-nav>span{display:none}.panel-nav button{white-space:nowrap}.integration-grid{grid-template-columns:1fr}}@media(max-width:760px){:root{--wrap:calc(100vw - 24px);--radius:19px}.workspace{padding-top:22px}.topbar__inner{min-height:auto;grid-template-columns:1fr;padding:12px 0}.brand{justify-content:center}.persona-nav{justify-content:flex-start;overflow:auto;flex-wrap:nowrap;scrollbar-width:none}.persona-nav a{white-space:nowrap}.topbar__status{justify-content:center}.page-heading{align-items:flex-start;flex-direction:column}.page-heading h1{font-size:2.6rem}.public-hero{min-height:620px;grid-template-columns:1fr;padding:26px;border-radius:24px}.public-hero h1{font-size:3.25rem}.public-hero__facts{grid-template-columns:repeat(3,1fr)}.public-hero__facts div{padding:13px}.public-hero__facts strong{font-size:1rem}.public-hero__facts span{font-size:10px}.section{margin-top:48px}.section-head{align-items:flex-start;flex-direction:column}.product-grid{grid-template-columns:1fr 1fr}.product-card__body{padding:14px}.metric-grid{grid-template-columns:1fr 1fr}.metric-grid article{padding:16px}.metric-grid strong{font-size:1.4rem}.content-grid--aside,.mode-grid{grid-template-columns:1fr}.order-total,.checkout,.mode-nav{position:static}.mode-nav{display:flex;overflow:auto;scrollbar-width:none}.mode-nav__label{display:none}.mode-nav button{width:auto;white-space:nowrap}.toolbar-card{align-items:stretch;flex-direction:column}.toolbar-card__summary{border-left:0;border-top:1px solid var(--line);padding:12px 0 0}.scanner-card,.card{padding:18px}.scanner-drop{min-height:300px;padding:18px}.form-grid--two{grid-template-columns:1fr}.tablist{border-radius:16px;width:100%}.tablist button{flex:0 0 auto}.card__head{align-items:flex-start;flex-direction:column}.filterbar{align-items:stretch}.filterbar>*{width:100%}.filterbar .button{width:100%}.table-wrap{margin-inline:-18px;padding-inline:18px}.system-map{align-items:stretch;flex-direction:column}.system-arrow{transform:rotate(90deg)}.health-grid{grid-template-columns:1fr}.split-callout{align-items:flex-start;flex-direction:column;padding:26px}.report-grid{grid-template-columns:1fr}.inline-field{grid-template-columns:1fr}.bitrix-banner{align-items:flex-start;flex-direction:column}}@media(max-width:460px){.product-grid{grid-template-columns:1fr}.metric-grid{grid-template-columns:1fr}.public-hero__facts{grid-template-columns:1fr}.public-hero__facts div{grid-template-columns:auto 1fr;gap:8px;align-items:baseline}.button-group>.button{flex:1}.segmented{grid-template-columns:1fr}.page-heading h1{font-size:2.2rem}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.catalog-categories{display:grid;gap:12px;margin-top:18px}.catalog-category{border:1px solid var(--line);border-radius:20px;background:var(--surface);overflow:hidden}.catalog-category>summary{min-height:56px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 18px;cursor:pointer;font-weight:700;list-style:none}.catalog-category>summary::-webkit-details-marker{display:none}.catalog-category>summary:after{content:"+";font-size:1.35rem;color:var(--muted)}.catalog-category[open]>summary:after{content:"−"}.catalog-category__grid{padding:0 14px 14px}.catalog-more{display:flex;justify-content:center;margin-top:16px}.product-card__media img{width:100%;height:100%;object-fit:cover}.cart-line{display:grid!important;grid-template-columns:minmax(140px,1fr) auto auto auto;align-items:center}.cart-line__name{font-weight:600}.quantity-control{display:grid;grid-template-columns:44px 70px 44px;align-items:center;border:1px solid var(--line);border-radius:14px;overflow:hidden}.quantity-control button{min-height:44px;border:0;background:var(--surface-2);font-size:1.2rem}.quantity-control input{width:70px;min-height:44px;border:0;border-inline:1px solid var(--line);text-align:center;background:#fff}.order-history__list{display:grid;margin-top:12px}.order-history__item{display:grid;grid-template-columns:minmax(170px,1fr) auto auto;align-items:center;gap:18px;padding:17px 0;border-bottom:1px solid var(--line)}.order-history__item>div:first-child{display:grid;gap:4px}.order-history__item small{color:var(--muted)}.order-success{display:flex;align-items:center;gap:16px;margin-top:18px;padding:16px;border:1px solid #b9dec6;border-radius:16px;background:var(--green-soft)}.order-success>div:nth-child(2){display:grid;gap:3px;flex:1}.order-success__icon{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:var(--green);color:#fff;font-size:1.4rem}.order-print{background:#fff;color:#111}.order-print main{width:min(980px,calc(100vw - 32px));margin:0 auto;padding:32px 0}.order-print__actions{display:flex;gap:10px;justify-content:flex-end;margin-bottom:28px}.order-print__header{display:flex;justify-content:space-between;gap:30px;align-items:flex-start}.order-print__header h1{margin:8px 0;font-size:2.8rem}.order-print__header dl{margin:0;display:grid;gap:10px}.order-print__header dl div{display:grid;grid-template-columns:auto auto;gap:20px}.order-print__header dt{color:#666}.order-print__header dd{margin:0;font-weight:700}.order-print__note{margin-top:24px;color:#555}
@media(max-width:760px){.cart-line,.order-history__item{grid-template-columns:1fr}.quantity-control{width:max-content}.order-history__item .button-group{justify-content:flex-start}.order-success{align-items:flex-start;flex-wrap:wrap}.order-success .button-group{width:100%}.order-print__header{display:grid}}
@media print{.order-print main{width:100%;padding:0}.order-print__actions,[data-print-actions]{display:none!important}.order-print .table-wrap{overflow:visible;margin:18px 0;padding:0}.order-print table{min-width:0}.order-print a{color:#111}.order-print{font-size:11pt}}
.business-table__new{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin:18px 0;padding:16px;border:1px dashed var(--line);border-radius:16px}.business-table__new label{display:grid;gap:6px;font-size:13px;font-weight:600}.business-table__new input,.business-table__new select,.business-table input,.business-table select{min-height:42px;border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:7px 10px}.business-table input{min-width:180px}.buyer-list{display:grid;gap:12px}.buyer-card{padding:18px;border:1px solid var(--line);border-radius:16px;background:var(--surface-2)}.buyer-card [data-buyer-details]{display:grid;gap:8px;margin-top:12px}.buyer-card [data-buyer-details][hidden]{display:none}
@media(max-width:760px){.business-table__new{align-items:stretch;flex-direction:column}.business-table__new>*{width:100%}.business-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.business-table tr{display:grid;margin-bottom:12px;border:1px solid var(--line);border-radius:14px;padding:8px}.business-table td{display:grid;grid-template-columns:minmax(90px,35%) 1fr;gap:8px;border:0}.business-table td:before{font-weight:700}.business-table td:nth-child(1):before{content:'Артикул'}.business-table td:nth-child(2):before{content:'Товар'}.business-table td:nth-child(3):before{content:'Категория'}.business-table td:nth-child(4):before{content:'Остаток'}.business-table td:nth-child(5):before{content:'Цена'}.business-table td:nth-child(6):before{content:'Продано'}.business-table td:nth-child(7):before{content:'Действия'}}
.queue-item{align-items:flex-start;flex-wrap:wrap}.queue-item__content{min-width:0;flex-basis:230px!important;overflow-wrap:anywhere}.queue-item__stage{font-weight:600;color:var(--ink)!important}.queue-item__details{margin:4px 0;padding-left:18px;font-size:13px;color:var(--muted)}.queue-item__details li+li{margin-top:4px}.queue-item>.button-group{flex:0 1 auto;align-self:center}.queue-item__thumb{object-fit:cover;flex-shrink:0}.queue-item:focus{outline:2px solid var(--accent);outline-offset:2px}
.queue-item__content strong{overflow-wrap:anywhere}.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* Seller intake: pallet context first, intake second, full-width inventory below. */
.seller-intake-layout [data-intake-only][hidden]{display:none!important}
.pallet-context .card__head .button{min-height:44px}
.pallet-products label{display:grid;gap:6px;min-width:0;font-size:13px;color:var(--muted)}.pallet-products .job-row{align-items:end}
.seller-workbench .page-heading{margin:0 0 20px}.seller-workbench .page-heading h1{font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.15}.seller-workbench .page-heading p{font-size:1rem}
.seller-workbench .tablist{width:100%;border-radius:14px;gap:4px;scrollbar-width:thin}.seller-workbench .tablist button{min-height:44px;border-radius:9px;color:var(--ink)}.seller-workbench .tablist button[aria-selected=true]{color:var(--surface)}
.seller-intake-layout{display:grid;grid-template-columns:minmax(300px,360px) minmax(0,1fr);gap:20px;align-items:start}.seller-intake-layout>*{min-width:0}.seller-intake-layout .card,.seller-intake-layout .scanner-card{border-radius:18px;box-shadow:none}
.pallet-context .card__head{gap:12px;align-items:center}.pallet-context .card__head h2{margin-top:5px}.pallet-context__selection{margin-top:20px}.pallet-context .save-state{margin:10px 0 16px}.pallet-context__actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.pallet-context__actions[hidden]{display:none}.pallet-context__actions .button{min-height:44px;padding:8px;font-size:13px;border-radius:10px}
.pallet-tags{margin-top:22px;padding-top:20px;border-top:1px solid var(--line)}.pallet-tags h3{margin-bottom:4px;font-size:1.1rem}.pallet-tags__list{display:grid;gap:8px;margin:14px 0}.pallet-tags__list:empty:before{content:'Тегов пока нет. Добавьте первый ниже.';font-size:13px;color:var(--muted)}.pallet-tags__list .job-row{flex-wrap:wrap;gap:8px;padding:10px}.pallet-tags__list .check{flex:1 1 100%;font-size:14px}.pallet-tags__list .button{min-height:44px;padding:6px 10px;font-size:12px}.pallet-tags__new{margin-top:18px;gap:8px}.pallet-tags__new .button{justify-self:start}.button--danger{color:var(--danger)}
.seller-intake-layout .scanner-card>.form-grid{margin-top:20px}.seller-intake-layout .scanner-drop{margin-top:16px;min-height:230px;padding:20px;gap:12px}.seller-intake-layout .scanner-drop__icon{width:42px;height:42px;border-radius:12px;font-size:25px}.seller-intake-layout .scanner-drop h3,.seller-intake-layout .scanner-drop p{margin:0}.seller-intake-layout .scanner-drop .button-group{justify-content:center}.seller-intake-layout .file-picker{display:grid;gap:8px;max-width:100%;font-size:14px}.seller-intake-layout input[type=file]{max-width:100%;font-size:13px}.seller-intake-layout input[type=file]::file-selector-button{min-height:44px;margin-right:10px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);cursor:pointer}
.intake-code{margin:22px 0;padding:20px 0;border-block:1px solid var(--line)}.intake-code h3{margin-bottom:12px;font-size:1.1rem}.intake-code .inline-field{width:100%;margin:0 0 12px;grid-template-columns:minmax(120px,.7fr) minmax(0,1fr) auto}.intake-code select{padding-inline:10px}.seller-intake-layout .recognition-review{margin-top:0;border-top:0}.seller-intake-layout .recognition-review h2{margin:8px 0}.seller-intake-layout .price-references{margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}
.pallet-products{grid-column:1/-1}.pallet-products [data-seller-warehouse-target=products]{display:grid;gap:12px;margin-top:18px}.pallet-products [data-seller-warehouse-target=products]:not(:empty)+.pallet-products__empty{display:none}.pallet-products .job-row{display:grid;grid-template-columns:minmax(180px,1fr) minmax(80px,.25fr) minmax(80px,.25fr) auto auto auto;gap:10px}.pallet-products input{min-width:0;width:100%;min-height:44px;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink)}.pallet-products .button{padding:8px 12px;font-size:13px}.seller-workbench :is(input,textarea)::placeholder{color:var(--muted);opacity:1}.seller-workbench option{background:var(--surface);color:var(--ink)}
:root[data-theme=dark] .seller-workbench .button:not(.button--ghost){background:var(--ink);border-color:var(--ink);color:var(--surface)}
@media(max-width:1100px){.seller-intake-layout{grid-template-columns:minmax(280px,320px) minmax(0,1fr);gap:16px}.pallet-products .job-row{grid-template-columns:minmax(0,1fr) minmax(90px,.4fr) minmax(90px,.4fr)}.pallet-products .job-row .button{width:100%}}
@media(max-width:860px){.seller-intake-layout{grid-template-columns:1fr}.pallet-context .card__head{flex-direction:row}.pallet-context>form{grid-template-columns:1fr 1fr}.pallet-context>form .button{grid-column:1/-1}.pallet-context__actions{grid-template-columns:repeat(4,1fr)}.pallet-tags__new{grid-template-columns:1fr auto;align-items:end}.pallet-tags__list{grid-template-columns:repeat(2,minmax(0,1fr))}.seller-workbench .tablist{padding-bottom:8px}}
@media(max-width:520px){.seller-intake-layout .scanner-card,.seller-intake-layout .card{padding:16px}.pallet-context>form,.pallet-tags__new,.pallet-tags__list{grid-template-columns:1fr}.pallet-context__actions{grid-template-columns:1fr 1fr}.pallet-products .job-row{grid-template-columns:1fr 1fr}.pallet-products .job-row>div{grid-column:1/-1}.pallet-products .job-row>.button:last-child{grid-column:1/-1}.intake-code .inline-field{grid-template-columns:1fr}.seller-intake-layout .scanner-drop{padding:16px}.seller-intake-layout .scanner-drop .button-group{width:100%}.seller-intake-layout .scanner-drop .button{flex:1 1 150px;min-height:44px;padding:8px 12px}.seller-workbench .tablist button{padding-inline:12px}}

/* ==========================================================================
   Cabinet App Shell & Sidebar Navigation
   ========================================================================== */
.cabinet-shell{display:flex;min-height:100vh;background:linear-gradient(to right,rgba(17,17,17,.035) 1px,transparent 1px) 0 0/24px 24px,var(--bg);position:relative}
.cabinet-sidebar{width:280px;flex-shrink:0;min-height:100vh;background:var(--surface);border-right:1px solid var(--line);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow-y:auto;scrollbar-width:thin;z-index:120;transition:transform .24s cubic-bezier(.16,1,.3,1)}
.cabinet-sidebar__brand{padding:20px 20px 16px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--line);text-decoration:none;color:inherit}
.cabinet-sidebar__brand-mark{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:var(--ink);color:var(--surface);font:700 13px "IBM Plex Mono",monospace;flex-shrink:0}
.cabinet-sidebar__brand-text{display:flex;flex-direction:column;font-weight:700;font-size:15px;line-height:1.15;color:var(--ink)}
.cabinet-sidebar__brand-text small{font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:3px}
.cabinet-switcher{padding:14px 16px 12px;display:flex;flex-direction:column;gap:7px;border-bottom:1px solid var(--line);background:var(--surface-2)}
.cabinet-switcher__label{font:600 10px "IBM Plex Mono",monospace;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);padding-left:4px}
.cabinet-switcher__links{display:flex;gap:4px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:3px}
.cabinet-switcher__link{flex:1;text-align:center;padding:7px 8px;border-radius:9px;font-size:12px;font-weight:600;color:var(--muted);transition:all .15s ease;white-space:nowrap;text-decoration:none}
.cabinet-switcher__link:hover{color:var(--ink);background:var(--surface-2)}
.cabinet-switcher__link[aria-current=page]{background:var(--ink);color:var(--surface)}
.cabinet-nav{flex:1;padding:16px 12px;display:flex;flex-direction:column;gap:18px}
.cabinet-nav-group{display:flex;flex-direction:column;gap:3px}
.cabinet-nav-label{display:block;padding:4px 10px 6px;font:600 10px "IBM Plex Mono",monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.cabinet-nav-button{width:100%;min-height:42px;display:flex;align-items:center;gap:11px;padding:8px 12px;border:0;border-radius:12px;background:transparent;color:var(--ink);font-size:13.5px;font-weight:600;text-align:left;transition:all .15s ease;position:relative;cursor:pointer}
.cabinet-nav-button:hover{background:var(--surface-2);color:var(--ink)}
.cabinet-nav-button[aria-selected=true]{background:var(--ink);color:var(--surface);box-shadow:0 2px 10px rgba(17,17,17,.12)}
.cabinet-nav-icon{width:20px;height:20px;display:grid;place-items:center;flex-shrink:0;font-size:14px;opacity:.9}
.cabinet-nav-badge{margin-left:auto;font-size:11px;font-family:"IBM Plex Mono",monospace;font-weight:700;padding:2px 7px;border-radius:999px;background:var(--surface-2);color:var(--muted)}
.cabinet-nav-button[aria-selected=true] .cabinet-nav-badge{background:rgba(255,255,255,.2);color:#fff}
.cabinet-sidebar__footer{padding:16px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:12px;background:var(--surface)}
.cabinet-sidebar__status{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.cabinet-sidebar__actions{display:flex;align-items:center;justify-content:space-between;gap:8px}
.cabinet-main{flex:1;min-width:0;display:flex;flex-direction:column;min-height:100vh}
.cabinet-content{flex:1;width:min(1380px,calc(100% - 48px));margin:0 auto;padding:28px 0 80px}
.cabinet-mobile-topbar{display:none;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:110}
.cabinet-mobile-toggle{min-height:38px;padding:0 14px;display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);color:var(--ink);font-size:13px;font-weight:600;cursor:pointer}
.cabinet-mobile-title{font-size:14px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cabinet-backdrop{display:none;position:fixed;inset:0;background:rgba(17,17,17,.45);backdrop-filter:blur(3px);z-index:115;opacity:0;transition:opacity .2s ease}
@media(max-width:1024px){
.cabinet-sidebar{position:fixed;top:0;left:0;bottom:0;transform:translateX(-100%);visibility:hidden;box-shadow:var(--shadow)}
.cabinet-sidebar.is-open{transform:translateX(0);visibility:visible}
.cabinet-sidebar:not(.is-open) *{visibility:hidden}
.cabinet-backdrop.is-visible{display:block;opacity:1}
.cabinet-mobile-topbar{display:flex}
.cabinet-content{width:calc(100% - 32px);padding:20px 0 60px}
}
@media(max-width:768px){
.cabinet-content{width:calc(100% - 24px);padding:16px 0 50px}
}
:root[data-theme=dark] .cabinet-switcher__link[aria-current=page]{background:var(--ink);color:var(--surface)}
:root[data-theme=dark] .cabinet-nav-button[aria-selected=true]{background:var(--ink);color:var(--surface);box-shadow:0 2px 10px rgba(0,0,0,.35)}
:root[data-theme=dark] .cabinet-nav-button[aria-selected=true] .cabinet-nav-badge{background:rgba(0,0,0,.3);color:#fff}

/* ==========================================================================
   Storefront Styles (Merged)
   ========================================================================== */
.persona--public {
    --storefront-wrap: min(1440px, calc(100vw - 40px));
    --storefront-dark: #111111;
    --storefront-light: #fffdf8;
    --storefront-card: var(--surface);
    --storefront-shadow: 0 20px 60px rgba(17, 17, 17, 0.08);
}

.persona--public .workspace {
    width: 100%;
    padding: 0;
}

.persona--public .topbar {
    z-index: 1200;
    background: color-mix(in srgb, var(--bg) 92%, transparent);
}

.persona--public .topbar__inner {
    width: var(--storefront-wrap);
    min-height: 0;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 10px 24px;
    padding: 12px 0;
}

.persona--public .brand {
    grid-column: 1;
    grid-row: 1;
}

.brand .brand__mark,
.persona--public .brand .brand__mark {
    background: #111111 !important;
    color: #ffffff !important;
}

.persona--public .topbar__contact {
    display: flex;
    grid-column: 2;
    grid-row: 1;
    justify-content: flex-end;
    align-items: center;
    gap: 16px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.35;
}

.persona--public .topbar__contact a,
.persona--public .topbar__contact > span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    color: var(--muted);
}

.persona--public .topbar__contact a {
    min-height: 36px;
    padding: 6px 10px;
    border-radius: 8px;
    transition: color 0.15s, background-color 0.15s;
}

.persona--public .topbar__contact a:hover {
    color: var(--ink);
    background: var(--surface-2);
}

.persona--public .topbar__contact > span {
    min-height: 36px;
    padding: 6px 0;
}

.persona--public .topbar__contact svg {
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
}

.persona--public .nav {
    display: flex;
    grid-column: 1;
    grid-row: 2;
    align-items: center;
    gap: 6px;
    min-width: 0;
    flex-wrap: wrap;
}

.persona--public .nav a {
    padding: 8px 14px;
    border-radius: 999px;
    color: var(--muted);
    font-size: 14px;
    font-weight: 600;
}

.persona--public .nav a:hover,
.persona--public .nav a.is-active,
.persona--public .nav a[aria-current="page"] {
    color: var(--ink);
    background: var(--surface-2);
}

.persona--public .topbar__actions {
    display: inline-flex;
    grid-column: 2;
    grid-row: 2;
    align-items: center;
    justify-self: end;
    gap: 10px;
}

.persona--public .topbar__actions > .button {
    min-width: 190px;
}

.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    min-width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: var(--surface);
    color: var(--ink);
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
    flex-shrink: 0;
    box-sizing: border-box;
}

.theme-toggle:hover {
    background: var(--surface-2);
    border-color: var(--ink);
    color: var(--ink);
    transform: translateY(-1px);
}

.theme-toggle:focus-visible {
    outline: 2px solid var(--accent, #c93126);
    outline-offset: 2px;
}

.theme-toggle:active {
    transform: translateY(0);
}

.theme-toggle__icon {
    width: 20px;
    height: 20px;
    stroke: currentColor;
    fill: none;
    flex-shrink: 0;
    display: block;
}

:root[data-theme="dark"] .theme-toggle__sun {
    display: block;
}

:root[data-theme="dark"] .theme-toggle__moon {
    display: none;
}

:root:not([data-theme="dark"]) .theme-toggle__sun {
    display: none;
}

:root:not([data-theme="dark"]) .theme-toggle__moon {
    display: block;
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]):not([data-theme="dark"]) .theme-toggle__sun {
        display: block;
    }
    :root:not([data-theme="light"]):not([data-theme="dark"]) .theme-toggle__moon {
        display: none;
    }
}

.storefront {
    overflow: clip;
    padding-top: 24px;
}

.storefront-hero,
.storefront-section,
.storefront-footer__inner,
.storefront-footer__bottom-inner,
.storefront-breadcrumbs,
.storefront-detail,
.storefront-category-hero {
    width: var(--storefront-wrap);
    margin-inline: auto;
}

.storefront-hero {
    display: grid;
    gap: 16px;
}

.storefront-hero__main {
    position: relative;
    min-height: 76svh;
    overflow: hidden;
    border-radius: 34px;
    background: #26231f;
    box-shadow: var(--storefront-shadow);
}

.storefront-hero__slider,
.storefront-hero-slide,
.storefront-hero-slide__media,
.storefront-hero-slide__overlay {
    position: absolute;
    inset: 0;
}

.storefront-hero__slider:focus-visible {
    outline: 3px solid #ffffff;
    outline-offset: -6px;
}

.storefront-hero-slide[hidden] {
    display: none;
}

.storefront-hero-slide__media picture,
.storefront-hero-slide__picture {
    display: block;
    width: 100%;
    height: 100%;
}

.storefront-hero-slide__media img,
.storefront-hero-slide__picture img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: linear-gradient(135deg, #2b2824, #55483d);
}

.storefront-hero-slide__overlay {
    background:
        linear-gradient(180deg, rgba(17, 17, 17, 0.16) 0%, rgba(17, 17, 17, 0.88) 100%),
        linear-gradient(90deg, rgba(17, 17, 17, 0.78) 0%, rgba(17, 17, 17, 0.12) 58%, rgba(17, 17, 17, 0.48) 100%);
}

.storefront-hero-slide__content {
    position: absolute;
    right: 28px;
    bottom: 28px;
    top: auto;
    left: auto;
    z-index: 3;
    display: grid;
    gap: 10px;
    width: 100%;
    max-width: 420px;
    padding: 22px 24px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 20px;
    background: rgba(17, 17, 17, 0.65);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    color: rgba(255, 255, 255, 0.95);
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.32);
    pointer-events: none;
}

.storefront-hero-slide__content p {
    margin: 0;
    color: rgba(255, 255, 255, 0.65);
    font: 600 12px "IBM Plex Mono", monospace;
    letter-spacing: 0.08em;
}

.storefront-hero-slide__content span {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.42;
    color: rgba(255, 255, 255, 0.82);
}

.storefront-hero-slide__content h2 {
    margin: 0;
    font-size: clamp(1.15rem, 1.55vw, 1.45rem);
    font-weight: 600;
    line-height: 1.25;
    color: #ffffff;
}

.storefront-hero__controls {
    position: absolute;
    top: 24px;
    right: 24px;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: 8px;
}

.storefront-hero__controls button,
.storefront-scroller__controls button {
    min-width: 48px;
    height: 48px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: 999px;
    background: rgba(17, 17, 17, 0.45);
    color: #ffffff;
    backdrop-filter: blur(12px);
}

.storefront-hero__controls button:disabled,
.storefront-scroller__controls button:disabled {
    opacity: 0.42;
    cursor: default;
}

.storefront-hero__counter {
    min-width: 48px;
    color: #ffffff;
    text-align: center;
    font: 600 12px "IBM Plex Mono", monospace;
}

.storefront-hero__controls .storefront-hero__pause {
    width: auto;
    padding-inline: 16px;
    font-size: 13px;
}

.storefront-hero__headline {
    position: absolute;
    inset: auto auto 28px 28px;
    z-index: 3;
    display: grid;
    gap: 18px;
    max-width: min(720px, calc(100% - 470px));
    color: #ffffff;
}

.storefront-hero__headline h1 {
    max-width: 680px;
    margin: 0;
    font-size: clamp(2.35rem, 4.4vw, 4.2rem);
    line-height: 1.02;
    letter-spacing: -0.02em;
}

.storefront-hero__headline p {
    max-width: 600px;
    margin: 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: clamp(1rem, 1.25vw, 1.15rem);
    line-height: 1.45;
}

.storefront-hero__headline .eyebrow {
    color: #ffffff;
}

.storefront-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.storefront-hero__actions .button:first-child {
    border-color: #ffffff;
    background: #ffffff;
    color: #111111;
}

.storefront-hero__actions .button--ghost {
    border-color: rgba(255, 255, 255, 0.6);
    color: #ffffff;
}

.storefront-highlights {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.storefront-highlights article,
.storefront-benefits article,
.storefront-category-empty,
.storefront-catalog-empty,
.storefront-contact-card,
.storefront-contact-form {
    border: 1px solid var(--line);
    border-radius: 24px;
    background: var(--storefront-card);
    box-shadow: var(--storefront-shadow);
}

.storefront-highlights article {
    display: grid;
    gap: 12px;
    padding: 22px;
}

.storefront-highlights p {
    margin: 0;
    color: var(--accent);
    font: 600 12px "IBM Plex Mono", monospace;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.storefront-highlights strong {
    font-size: 1.18rem;
    line-height: 1.28;
}

.storefront-section {
    padding-top: 84px;
    scroll-margin-top: 150px;
}

.storefront-section__head,
.storefront-scroller__head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 24px;
}

.storefront-section__head h2 {
    margin: 8px 0 0;
    font-size: clamp(2.2rem, 5vw, 4.4rem);
    line-height: 1.04;
}

.storefront-section__head > p {
    max-width: 44rem;
    margin: 0;
    color: var(--muted);
    font-size: clamp(1rem, 1.35vw, 1.14rem);
}

.storefront-category-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.storefront-category {
    position: relative;
    min-height: 300px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 28px;
    box-shadow: var(--storefront-shadow);
    color: #ffffff;
    display: block;
}

.storefront-category__picture,
.storefront-category__picture img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.storefront-category__shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(17, 17, 17, 0.08), rgba(17, 17, 17, 0.86));
}

.storefront-category__body {
    position: absolute;
    inset: auto 24px 24px;
    z-index: 1;
    display: grid;
    gap: 8px;
}

.storefront-category__body > span {
    font: 600 11px "IBM Plex Mono", monospace;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.storefront-category__body strong {
    font-size: clamp(1.5rem, 3vw, 2.4rem);
    line-height: 1.08;
}

.storefront-category__body small {
    color: rgba(255, 255, 255, 0.82);
    font-size: 14px;
}

.storefront-category-empty,
.storefront-catalog-empty {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding: 32px;
}

.storefront-category-empty h3,
.storefront-catalog-empty h3 {
    margin: 0 0 8px;
    font-size: 1.65rem;
}

.storefront-category-empty p,
.storefront-catalog-empty p {
    margin: 0;
    color: var(--muted);
}

.storefront-benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.storefront-benefits article {
    display: grid;
    gap: 13px;
    padding: 26px;
}

.storefront-benefits article > span {
    color: var(--accent);
    font: 600 12px "IBM Plex Mono", monospace;
}

.storefront-benefits strong {
    font-size: 1.38rem;
}

.storefront-benefits p {
    margin: 0;
    color: var(--muted);
}

.storefront-search {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(220px, 0.42fr) auto;
    align-items: end;
    gap: 12px;
    margin-bottom: 26px;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: 24px;
    background: var(--surface);
    box-shadow: var(--storefront-shadow);
}

.storefront-search label,
.storefront-form-grid label {
    display: grid;
    gap: 7px;
    color: var(--ink);
    font-size: 13px;
    font-weight: 600;
}

.storefront-search input,
.storefront-search select,
.storefront-form-grid input,
.storefront-form-grid textarea {
    width: 100%;
    min-height: 48px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: var(--surface-2);
    padding: 10px 13px;
}

.storefront-form-grid textarea {
    min-height: 130px;
    resize: vertical;
}

.storefront-search__actions {
    display: flex;
    gap: 8px;
}

.storefront-scroller {
    display: grid;
    gap: 18px;
}

.storefront-scroller__head {
    margin: 0;
}

.storefront-scroller__head p {
    margin: 0;
    color: var(--muted);
    font-size: 14px;
}

.storefront-scroller__controls {
    display: flex;
    align-items: center;
    gap: 8px;
}

.storefront-scroller__controls button {
    border-color: var(--line);
    background: var(--surface);
    color: var(--ink);
}

.storefront-scroller__track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 48px) / 4);
    gap: 16px;
    overflow-x: auto;
    padding: 4px 2px 14px;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
    scrollbar-color: var(--line) transparent;
    overscroll-behavior-x: contain;
}

.storefront-scroller__track > * {
    scroll-snap-align: start;
}

.storefront-product {
    display: grid;
    grid-template-rows: auto 1fr;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 24px;
    background: var(--surface);
    box-shadow: var(--storefront-shadow);
}

.storefront-product__media {
    aspect-ratio: 4 / 3;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-bottom: 1px solid var(--line);
    background: linear-gradient(135deg, var(--accent-soft), var(--surface-2));
}

.storefront-product__media picture {
    display: block;
    width: 100%;
    height: 100%;
}

.storefront-product__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.storefront-product:hover .storefront-product__media img {
    transform: scale(1.025);
}

.storefront-product__media > span {
    width: 76px;
    height: 76px;
    display: grid;
    place-items: center;
    border-radius: 22px;
    background: color-mix(in srgb, var(--surface) 76%, transparent);
    color: var(--accent);
    font: 600 30px "IBM Plex Mono", monospace;
}

.storefront-product__body {
    display: grid;
    grid-template-rows: auto auto 1fr auto;
    gap: 13px;
    padding: 18px;
}

.storefront-product__category {
    margin: 0;
    color: var(--accent);
    font: 600 11px "IBM Plex Mono", monospace;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.storefront-product h3 {
    margin: 0;
    font-size: 1.18rem;
    line-height: 1.2;
}

.storefront-product__meta {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 12px;
    padding-top: 13px;
    border-top: 1px solid var(--line);
}

.storefront-product__meta span {
    color: var(--muted);
    font-size: 12px;
    text-align: right;
}

.storefront-contact-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 16px;
}

.storefront-contact-card,
.storefront-contact-form {
    padding: clamp(24px, 4vw, 42px);
}

.storefront-contact-card > h2,
.storefront-contact-form > h2 {
    margin: 12px 0;
    font-size: clamp(2rem, 4vw, 3.6rem);
    line-height: 1.04;
}

.storefront-contact-card > p,
.storefront-contact-form > p {
    color: var(--muted);
}

.storefront-contact-card__meta {
    display: grid;
    margin: 26px 0;
}

.storefront-contact-card__meta div {
    display: grid;
    grid-template-columns: minmax(90px, 0.32fr) 1fr;
    gap: 18px;
    padding: 14px 0;
    border-bottom: 1px solid var(--line);
}

.storefront-contact-card__meta dt {
    color: var(--muted);
}

.storefront-contact-card__meta dd {
    margin: 0;
    font-weight: 700;
}

.storefront-map {
    display: grid;
    gap: 10px;
}

.storefront-map iframe {
    width: 100%;
    min-height: 360px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--surface-2);
}

.storefront-map__placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 360px;
    padding: 32px 20px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--surface-2);
    text-align: center;
}

.storefront-map__icon {
    font-size: 32px;
}

.storefront-map__info {
    display: grid;
    gap: 4px;
}

.storefront-map__info strong {
    font-size: 16px;
    color: var(--ink);
}

.storefront-map__info span {
    font-size: 13px;
    color: var(--muted);
}

.storefront-map > a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    color: var(--accent);
    font-weight: 700;
}

.storefront-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
    margin-top: 26px;
}

.storefront-form-grid__full {
    grid-column: 1 / -1;
}

.storefront-form-grid em {
    color: var(--accent);
    font-style: normal;
}

.storefront-honeypot {
    position: absolute !important;
    left: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

.storefront-consent {
    display: flex !important;
    grid-template-columns: none;
    align-items: start;
    gap: 10px !important;
    font-weight: 400 !important;
    line-height: 1.4;
}

.storefront-consent input {
    width: 20px;
    min-height: 20px;
    margin: 1px 0 0;
    flex: 0 0 20px;
}

.storefront-form-actions {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-top: 20px;
}

.storefront-form-actions p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
}

.storefront-form-actions p[data-state="success"] {
    color: var(--green);
}

.storefront-form-actions p[data-state="error"] {
    color: var(--danger);
}

.storefront-footer {
    margin-top: 96px;
    border-top: 1px solid var(--line);
    background: var(--surface);
    color: var(--ink);
}

.storefront-footer__inner {
    display: grid;
    grid-template-columns: 2fr 1fr 1.3fr 1.3fr;
    align-items: start;
    gap: 48px;
    padding-block: 56px 40px;
}

.storefront-footer__brand {
    display: grid;
    gap: 14px;
    max-width: 360px;
}

.storefront-footer__brand .brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.storefront-footer__desc {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--muted);
}

.storefront-footer__col {
    display: grid;
    gap: 14px;
}

.storefront-footer__heading {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--muted);
}

.storefront-footer__nav {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 10px;
}

.storefront-footer__nav a {
    display: inline-block;
    font-size: 14px;
    color: var(--ink);
    text-decoration: none;
    transition: color 0.15s ease;
}

.storefront-footer__nav a:hover {
    color: var(--accent);
}

.storefront-footer__contacts {
    display: grid;
    gap: 8px;
    font-style: normal;
}

.storefront-footer__phone {
    font-size: 15px;
    font-weight: 700;
    color: var(--ink);
    text-decoration: none;
    transition: color 0.15s ease;
}

.storefront-footer__phone:hover {
    color: var(--accent);
}

.storefront-footer__email {
    font-size: 13.5px;
    color: var(--muted);
    text-decoration: none;
    transition: color 0.15s ease;
}

.storefront-footer__email:hover {
    color: var(--ink);
}

.storefront-footer__address {
    font-size: 13px;
    color: var(--muted);
    line-height: 1.45;
}

.storefront-footer__legal {
    display: grid;
    gap: 6px;
    font-size: 13px;
    text-align: left;
}

.storefront-footer__legal strong {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink);
}

.storefront-footer__legal .mono {
    font-size: 12px;
    color: var(--muted);
    letter-spacing: 0.02em;
}

.storefront-footer__badge {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 3px 8px;
    margin-top: 4px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: var(--surface-2);
    font-size: 11px;
    font-weight: 600;
    color: var(--muted);
}

.storefront-footer__bottom {
    border-top: 1px solid color-mix(in srgb, var(--line) 55%, transparent);
    padding-block: 20px;
    font-size: 12.5px;
    color: var(--muted);
}

.storefront-footer__bottom-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.storefront-footer__bottom-inner p {
    margin: 0;
}

@media (max-width: 1180px) {
    .persona--public .topbar__inner {
        grid-template-columns: auto 1fr auto;
        gap: 14px;
    }

    .persona--public .topbar__contact {
        display: none;
    }

    .persona--public .nav {
        grid-column: 1 / -1;
        grid-row: 2;
        justify-content: flex-start;
        padding-right: 0;
    }

    .persona--public .topbar__actions {
        grid-column: 3;
        grid-row: 1;
    }

    .storefront-scroller__track {
        grid-auto-columns: calc((100% - 32px) / 3);
    }
}

@media (max-width: 860px) {
    .persona--public {
        --storefront-wrap: min(100% - 24px, 720px);
    }

    .persona--public .topbar__inner {
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 12px;
    }

    .persona--public .brand {
        justify-content: flex-start;
    }

    .persona--public .topbar__actions {
        grid-column: 2;
        grid-row: 1;
    }

    .persona--public .topbar__actions > .button {
        display: none;
    }

    .persona--public .nav {
        grid-column: 1 / -1;
        grid-row: 2;
        justify-content: flex-start;
        flex-wrap: nowrap;
        overflow-x: auto;
        padding: 0 0 2px;
        scrollbar-width: none;
    }

    .persona--public .nav a {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .storefront {
        padding-top: 14px;
    }

    .storefront-hero__main {
        min-height: 640px;
        border-radius: 26px;
    }

    .storefront-hero-slide__content {
        top: 20px;
        left: 20px;
        right: auto;
        bottom: auto;
        max-width: calc(100% - 220px);
        padding: 10px 14px;
        border-radius: 14px;
        gap: 4px;
    }

    .storefront-hero-slide__content h2 {
        font-size: 0.95rem;
        line-height: 1.2;
    }

    .storefront-hero-slide__content span {
        display: none;
    }

    .storefront-hero__headline {
        inset: auto 20px 20px 20px;
        max-width: 100%;
    }

    .storefront-hero__headline h1 {
        max-width: 100%;
        font-size: clamp(2.2rem, 7vw, 3.4rem);
    }

    .storefront-highlights,
    .storefront-benefits,
    .storefront-contact-layout {
        grid-template-columns: 1fr;
    }

    .storefront-section {
        padding-top: 64px;
    }

    .storefront-section__head {
        align-items: start;
        flex-direction: column;
    }

    .storefront-category-grid {
        grid-template-columns: 1fr;
    }

    .storefront-search {
        grid-template-columns: 1fr 1fr;
    }

    .storefront-search__actions {
        grid-column: 1 / -1;
    }

    .storefront-scroller__track {
        grid-auto-columns: calc((100% - 16px) / 2);
    }

    .storefront-footer__inner {
        grid-template-columns: 1fr 1fr;
        gap: 36px 32px;
    }

    .storefront-footer__brand {
        max-width: 100%;
    }
}

@media (max-width: 560px) {
    .storefront-hero__main {
        min-height: 560px;
    }

    .storefront-hero-slide__content {
        display: none;
    }

    .storefront-hero__controls {
        top: 16px;
        right: 16px;
        bottom: auto;
        left: auto;
    }

    .storefront-hero__controls .storefront-hero__pause {
        width: 48px;
        overflow: hidden;
        padding: 0;
        color: transparent;
    }

    .storefront-hero__controls .storefront-hero__pause::before {
        content: "Ⅱ";
        color: #ffffff;
    }

    .storefront-hero__headline {
        inset: auto 16px 20px 16px;
        gap: 14px;
    }

    .storefront-hero__headline h1 {
        font-size: clamp(1.95rem, 8.5vw, 2.6rem);
        line-height: 1.06;
    }

    .storefront-hero__actions .button {
        width: 100%;
    }

    .storefront-category-empty,
    .storefront-catalog-empty {
        align-items: start;
        flex-direction: column;
        padding: 24px;
    }

    .storefront-search {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .storefront-search__actions {
        grid-column: auto;
        flex-direction: column;
    }

    .storefront-search__actions .button {
        width: 100%;
    }

    .storefront-scroller__head {
        align-items: center;
    }

    .storefront-scroller__head p {
        max-width: 190px;
    }

    .storefront-scroller__track {
        grid-auto-columns: 86%;
    }

    .storefront-form-grid {
        grid-template-columns: 1fr;
    }

    .storefront-form-grid__full {
        grid-column: auto;
    }

    .storefront-form-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .storefront-map iframe {
        min-height: 300px;
    }

    .storefront-footer {
        margin-top: 64px;
    }

    .storefront-footer__inner {
        grid-template-columns: 1fr;
        gap: 28px;
        padding-block: 40px 28px;
    }

    .storefront-footer__bottom-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
}

/* Breadcrumbs */
.storefront-breadcrumbs {
    padding: 16px 0;
    margin-bottom: 8px;
    font-size: 13px;
    color: var(--muted);
}

.storefront-breadcrumbs__inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.storefront-breadcrumbs__item a {
    color: var(--ink);
    text-decoration: none;
    transition: color 0.15s ease;
}

.storefront-breadcrumbs__item a:hover {
    color: var(--accent);
    text-decoration: underline;
}

.storefront-breadcrumbs__separator {
    margin-left: 8px;
    color: var(--line);
}

.storefront-breadcrumbs__current {
    color: var(--muted);
    font-weight: 500;
}

/* Category Hero */
.storefront-category-hero {
    margin-bottom: 32px;
    padding: 36px 32px;
    border: 1px solid var(--line);
    border-radius: 28px;
    background: linear-gradient(135deg, var(--surface) 60%, var(--surface-2));
    box-shadow: var(--storefront-shadow);
}

.storefront-category-hero__inner {
    display: grid;
    gap: 16px;
    max-width: 720px;
}

.storefront-category-hero h1 {
    margin: 0;
    font-size: clamp(2rem, 4vw, 2.8rem);
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.storefront-category-hero p {
    margin: 0;
    color: var(--muted);
    font-size: 16px;
    line-height: 1.5;
}

.storefront-category-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 8px;
}

/* Category Search Bar */
.storefront-search__bar {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
}

.storefront-search__bar input {
    flex: 1;
}

/* Product Detail */
.storefront-detail {
    margin-bottom: 48px;
    padding: 36px 32px;
    border: 1px solid var(--line);
    border-radius: 28px;
    background: var(--surface);
    box-shadow: var(--storefront-shadow);
}

.storefront-detail__grid {
    display: grid;
    grid-template-columns: minmax(320px, 1fr) minmax(360px, 1.15fr);
    gap: 40px;
    align-items: start;
}

.storefront-detail__gallery {
    display: grid;
    gap: 16px;
}

.storefront-detail__main-image {
    aspect-ratio: 4 / 3;
    max-height: 520px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--surface-2);
    display: grid;
    place-items: center;
}

.storefront-detail__picture {
    display: block;
    width: 100%;
    height: 100%;
}

.storefront-detail__picture img,
.storefront-detail__image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 16px;
}

.storefront-detail__placeholder {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    border-radius: 26px;
    background: color-mix(in srgb, var(--surface) 76%, transparent);
    color: var(--accent);
    font: 600 36px "IBM Plex Mono", monospace;
}

.product-placeholder {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

.storefront-detail__thumbs {
    display: flex;
    gap: 10px;
    overflow-x: auto;
}

.storefront-detail__thumbs img {
    width: 80px;
    height: 60px;
    object-fit: cover;
    border: 1px solid var(--line);
    border-radius: 10px;
    cursor: pointer;
    transition: opacity 0.15s ease, border-color 0.15s ease;
}

.storefront-detail__thumbs img:hover {
    border-color: var(--accent);
}

.storefront-detail__info {
    display: grid;
    gap: 20px;
}

.storefront-detail__category-badge {
    display: inline-block;
    align-self: start;
    padding: 4px 12px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--surface-2);
    color: var(--accent);
    font: 600 11px "IBM Plex Mono", monospace;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    transition: border-color 0.15s ease;
}

.storefront-detail__category-badge:hover {
    border-color: var(--accent);
}

.storefront-detail__title {
    margin: 0;
    font-size: clamp(1.8rem, 3.5vw, 2.5rem);
    line-height: 1.15;
    letter-spacing: -0.02em;
}

.storefront-detail__meta-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface-2);
}

.storefront-detail__meta-item {
    display: grid;
    gap: 4px;
}

.storefront-detail__meta-label {
    font-size: 11px;
    font-family: "IBM Plex Mono", monospace;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.storefront-detail__meta-val {
    font-size: 14px;
    font-weight: 600;
    color: var(--ink);
}

.storefront-detail__pricing {
    padding: 18px 24px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: linear-gradient(135deg, var(--surface-2), var(--accent-soft));
}

.storefront-detail__price-tag strong {
    font-size: clamp(1.8rem, 3vw, 2.2rem);
    color: var(--ink);
    letter-spacing: -0.02em;
}

.storefront-detail__desc-block {
    display: grid;
    gap: 8px;
}

.storefront-detail__desc-block h3 {
    margin: 0;
    font-size: 1.1rem;
    color: var(--ink);
}

.storefront-detail__description {
    color: var(--muted);
    font-size: 15px;
    line-height: 1.6;
}

.storefront-detail__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 8px;
}

.storefront-product__media-link {
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
}

.storefront-product h3 a {
    color: inherit;
    text-decoration: none;
    transition: color 0.15s ease;
}

.storefront-product h3 a:hover {
    color: var(--accent);
}

.storefront-product-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    margin-top: 24px;
}

.storefront-section--related {
    margin-top: 48px;
    margin-bottom: 48px;
}

@media (max-width: 1200px) {
    .storefront-product-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 16px;
    }
}

@media (max-width: 768px) {
    .storefront-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }
}

@media (max-width: 480px) {
    .storefront-product-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}

@media (max-width: 900px) {
    .storefront-detail__grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .storefront-detail,
    .storefront-category-hero {
        padding: 24px 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .persona--public .storefront-product__media img {
        transition: none;
    }
}