:root { color-scheme:light; --red:#d8232a; --red-dark:#a9151b; --red-soft:#fff1f1; --ink:#25272a; --muted:#687078; --soft:#f5f6f7; --line:#dfe2e5; --green:#168451; --shadow:0 18px 50px rgba(23,27,31,.1) }
    * { box-sizing:border-box }
    html,body { min-height:100% }
    body { margin:0; color:var(--ink); background:#fff; font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased }
    button,select { font:inherit }
    .utility-bar { min-height:31px; padding:7px 20px; color:#fff; background:#33383d; text-align:center; font-size:12px; letter-spacing:.015em }
    .site-header { border-bottom:1px solid var(--line); background:#fff }
    .header-inner,.page-shell,.footer-inner { width:min(1220px,calc(100% - 40px)); margin:0 auto }
    .header-inner { display:flex; align-items:center; justify-content:space-between; min-height:78px; gap:24px }
    .brand { display:inline-flex; align-items:center; gap:12px; color:var(--ink); text-decoration:none }
    .brand-mark { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; color:#fff; background:var(--red); box-shadow:inset 0 0 0 5px rgba(255,255,255,.18) }
    .brand-mark svg { width:24px; height:24px }
    .brand-copy strong { display:block; font-size:19px; letter-spacing:-.025em }
    .brand-copy span { display:block; margin-top:1px; color:var(--muted); font-size:11px; letter-spacing:.08em; text-transform:uppercase }
    .header-note { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:13px }
    .status-dot { width:8px; height:8px; border-radius:50%; background:#28a568; box-shadow:0 0 0 4px rgba(40,165,104,.12) }
    .page-shell { padding:22px 0 46px }
    .breadcrumb { margin:0 0 20px; color:#7b8288; font-size:12px }
    .breadcrumb b { color:#454a4f; font-weight:600 }
    .product-layout { display:grid; grid-template-columns:minmax(310px,.72fr) minmax(0,1.55fr); gap:34px; align-items:start }
    .gallery { min-width:0; border:1px solid var(--line); border-radius:8px; background:#fff; box-shadow:var(--shadow); overflow:hidden }
    .gallery { grid-column:2; grid-row:1 }
    .view-tabs { display:flex; align-items:stretch; border-bottom:1px solid var(--line); background:#fafafa }
    .view-tab { position:relative; min-width:105px; min-height:49px; padding:0 19px; border:0; border-right:1px solid var(--line); color:#555c62; background:transparent; font-size:13px; font-weight:700; cursor:pointer }
    .view-tab:hover { color:var(--red); background:#fff }
    .view-tab[aria-selected="true"] { color:var(--red); background:#fff }
    .view-tab[aria-selected="true"]::after { content:""; position:absolute; left:17px; right:17px; bottom:-1px; height:3px; background:var(--red) }
    .viewer-toolbar { display:flex; align-items:center; gap:6px; min-height:49px; margin-left:auto; padding:0 12px }
    .viewer-toolbar[hidden] { display:none }
    .tool-button { display:grid; place-items:center; width:31px; height:31px; border:1px solid #d5d9dc; border-radius:4px; color:#50565c; background:#fff; font-weight:700; cursor:pointer }
    .tool-button:hover { color:var(--red); border-color:#c9aaac }
    .viewer-frame { position:relative; height:clamp(490px,60vw,680px); max-height:72vh; min-height:490px; overflow:hidden; background:radial-gradient(circle at 44% 35%,#f8f9fa 0,#e8ebed 60%,#dfe3e6 100%) }
    .view-panel { position:absolute; inset:0 }
    .view-panel[hidden] { display:none }
    model-viewer { width:100%; height:100%; --poster-color:transparent; --progress-bar-color:var(--red); background:transparent }
    .orbit-help,.pan-help { position:absolute; z-index:3; left:16px; bottom:14px; padding:7px 10px; border:1px solid rgba(57,63,69,.12); border-radius:4px; color:#666d73; background:rgba(255,255,255,.88); box-shadow:0 3px 14px rgba(0,0,0,.06); font-size:11px; pointer-events:none; backdrop-filter:blur(6px) }
    .svg-canvas { display:grid; place-items:center; width:100%; height:100%; overflow:hidden; cursor:grab; touch-action:none; user-select:none }
    .svg-canvas.dragging { cursor:grabbing }
    .svg-canvas img { position:absolute; left:50%; top:50%; display:block; width:94%; height:94%; max-width:none; max-height:none; object-fit:contain; pointer-events:none }
    .asset-loading { position:absolute; z-index:5; inset:0; display:grid; place-items:center; color:#757c82; background:rgba(245,246,247,.8); font-size:13px; pointer-events:none; transition:opacity 160ms ease }
    .asset-loading.is-ready { opacity:0 }
    .asset-loading span::before { content:""; display:inline-block; width:12px; height:12px; margin-right:8px; border:2px solid #d1d5d8; border-top-color:var(--red); border-radius:50%; vertical-align:-2px; animation:spin 700ms linear infinite }
    @keyframes spin { to { transform:rotate(360deg) } }
    .gallery-caption { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:47px; padding:9px 15px; border-top:1px solid var(--line); color:#70777d; background:#fff; font-size:11px }
    .gallery-caption b { color:#41464b }
    .product-info { grid-column:1; grid-row:1; min-width:0; padding-top:2px }
    .category { margin:0 0 8px; color:var(--red); font-size:12px; font-weight:800; letter-spacing:.095em; text-transform:uppercase }
    h1 { margin:0; font-size:clamp(31px,3vw,43px); line-height:1.04; letter-spacing:-.045em }
    .sku-line { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:13px 0 18px; color:#777e84; font-size:12px }
    .ready { display:inline-flex; align-items:center; gap:6px; color:var(--green); font-weight:700 }
    .ready::before { content:"✓"; display:grid; place-items:center; width:17px; height:17px; border-radius:50%; color:#fff; background:var(--green); font-size:11px }
    .description { margin:0 0 22px; color:#555d64; font-size:14px; line-height:1.64 }
    .config-card { padding:20px; border:1px solid var(--line); border-radius:7px; background:var(--soft) }
    .config-card h2 { margin:0 0 16px; font-size:17px; letter-spacing:-.015em }
    .field { margin-bottom:15px }
    .field:last-of-type { margin-bottom:0 }
    .field label { display:block; margin-bottom:7px; color:#4a5055; font-size:12px; font-weight:700 }
    select { width:100%; height:43px; padding:0 38px 0 12px; border:1px solid #cfd4d8; border-radius:4px; outline:none; color:#2f3337; background:#fff; font-size:14px; cursor:pointer }
    select:hover { border-color:#aeb5ba }
    select:focus { border-color:var(--red); box-shadow:0 0 0 3px rgba(216,35,42,.1) }
    select:disabled { color:#747b81; border-color:#dfe2e5; background:#eceff1; cursor:not-allowed }
    .selection-note { min-height:34px; margin:14px 0 0; padding-top:12px; border-top:1px solid #dde1e4; color:#687078; font-size:11px; line-height:1.45 }
    .resources { margin-top:31px; padding-top:27px; border-top:1px solid var(--line) }
    .resources h2 { margin:0 0 13px; font-size:24px; letter-spacing:-.03em }
    .resource-list { margin:0; padding-left:21px; color:#687078; font-size:14px; line-height:1.9 }
    .resource-list a { color:var(--red-dark); font-weight:700; text-underline-offset:3px }
    .resource-list a:hover { color:var(--red) }
    footer { border-top:1px solid var(--line); background:#2f3438 }
    .footer-inner { display:flex; justify-content:space-between; gap:20px; padding:24px 0; color:#cbd0d4; font-size:11px }
    .footer-inner b { color:#fff }
    @media (max-width:940px) { .product-layout{grid-template-columns:1fr}.product-info{grid-column:1;grid-row:1;padding-top:0}.gallery{grid-column:1;grid-row:2}.viewer-frame{max-height:none} }
    @media (max-width:620px) { .header-inner,.page-shell,.footer-inner{width:min(100% - 24px,1220px)}.header-note{display:none}.brand-copy span{display:none}.product-layout{gap:22px}.viewer-frame{height:470px;min-height:470px}.view-tab{min-width:0;flex:1;padding:0 8px}.viewer-toolbar{position:absolute;z-index:10;top:57px;right:8px;padding:0}.gallery-caption{align-items:flex-start;flex-direction:column;gap:3px}.footer-inner{flex-direction:column} }

.site-nav { display:flex; align-items:center; gap:6px; flex-wrap:wrap }
.site-nav a { padding:10px 12px; border-radius:4px; color:var(--muted); font-size:13px; font-weight:700; text-decoration:none }
.site-nav a:hover { color:var(--red); background:var(--red-soft) }
.site-nav a[aria-current="page"] { color:var(--red-dark); background:var(--red-soft) }
.site-nav a:focus-visible,.tool-button:focus-visible { outline:2px solid var(--red); outline-offset:3px }
@media (max-width:760px) { .header-inner { flex-wrap:wrap; gap:8px; padding:16px 0 12px }.site-nav { width:100% }.site-nav a { padding:9px 10px } }

.ddr-page .viewer-toolbar { position:static }
.pcb-view-label { display:flex; align-items:center; cursor:default; color:var(--red) }
.asset-loading[hidden] { display:none }

    .ddr-page .ready.unrouted { color:#8a570c }
    .ddr-page .ready.unrouted::before { content:"i"; background:#8a570c }