@layer components{.specs-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0e141b8c;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:50}.specs-overlay.open{opacity:1;pointer-events:auto}.specs-drawer{position:fixed;top:0;right:0;bottom:0;width:560px;max-width:100vw;background:#fff;box-shadow:-4px 0 32px #0e141b33;transform:translate(100%);transition:transform .22s cubic-bezier(.22,.61,.36,1);z-index:51;display:flex;flex-direction:column}.specs-drawer.open{transform:translate(0)}@media (max-width: 639px){.specs-drawer{top:auto;left:0;right:0;bottom:0;width:100%;max-height:92dvh;transform:translateY(100%);border-radius:12px 12px 0 0;box-shadow:0 -4px 32px #0e141b33}.specs-drawer.open{transform:translateY(0)}}.specs-drawer header{padding:16px 20px 12px;border-bottom:1px solid var(--color-line, #E5E7EB);position:sticky;top:0;background:#fff;z-index:2;flex-shrink:0}.crumbs{font-size:11.5px;color:var(--color-ink-muted, #6B7480);font-family:var(--font-mono, ui-monospace, monospace);letter-spacing:.02em}.specs-drawer h2{margin:6px 0 4px;font-size:18px;line-height:1.3}.specs-drawer .sub{font-size:12.5px;color:var(--color-ink-soft, #3A4654)}.close-btn{position:absolute;top:12px;right:14px;background:none;border:0;padding:6px;cursor:pointer;color:var(--color-ink-muted, #6B7480);border-radius:4px;line-height:0}.close-btn:hover{background:var(--color-sunken, #F8FAFC);color:var(--color-ink, #0E141B)}.match-strip{display:flex;align-items:center;gap:8px;margin-top:10px}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;font-size:11px;font-weight:500;border-radius:999px;line-height:1.4}.badge.matched{background:#ecfdf5;color:var(--color-green, #15803d)}.badge.confidence{background:#fffbeb;color:var(--color-amber, #b45309)}.badge.manual{background:#eef2ff;color:var(--color-blue-deep, #1d4ed8)}.trim-switch{margin-left:auto;font-size:12px;color:var(--color-blue-deep, #1d4ed8);background:none;border:0;cursor:pointer;padding:4px;font-family:inherit}.trim-switch:hover{text-decoration:underline}.specs-drawer .body{overflow-y:auto;padding:16px 20px 80px;flex:1}.hero{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:18px}.kpi{background:linear-gradient(180deg,#fff 0%,var(--color-sunken, #F8FAFC) 100%);border:1px solid var(--color-line, #E5E7EB);border-radius:7px;padding:10px 12px}.kpi .label{font-size:10.5px;color:var(--color-ink-muted, #6B7480);text-transform:uppercase;letter-spacing:.06em}.kpi .value{font-family:var(--font-mono, ui-monospace, monospace);font-size:18px;margin-top:4px;font-weight:600;letter-spacing:-.01em}.kpi .unit{font-size:11px;color:var(--color-ink-muted, #6B7480);font-weight:400;margin-left:2px}.trim-picker{background:var(--color-sunken, #F8FAFC);border:1px solid var(--color-line, #E5E7EB);border-radius:7px;padding:10px 12px;margin-bottom:18px;display:none}.trim-picker.open{display:block}.trim-picker .hint{font-size:11.5px;color:var(--color-ink-muted, #6B7480);margin-bottom:8px}.trim-picker .row{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;border-radius:5px;cursor:pointer;font-size:12.5px}.trim-picker .row:hover{background:#2563eb0f}.trim-picker .row.selected{background:#2563eb1a;color:var(--color-blue-deep, #1d4ed8);font-weight:500}.trim-picker .row .meta{font-family:var(--font-mono, ui-monospace, monospace);font-size:11px;color:var(--color-ink-muted, #6B7480)}.section{margin-bottom:22px}.section h3{margin:0 0 8px;font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--color-ink-muted, #6B7480);font-weight:600;font-family:var(--font-mono, ui-monospace, monospace)}.specs-drawer .specs{display:grid;gap:1px;background:var(--color-line, #E5E7EB);border-radius:6px;overflow:hidden;border:1px solid var(--color-line, #E5E7EB)}.row{display:grid;grid-template-columns:1fr auto;gap:12px;padding:8px 12px;background:#fff;font-size:13px}.row .k{color:var(--color-ink-soft, #3A4654)}.row .v{font-family:var(--font-mono, ui-monospace, monospace);color:var(--color-ink, #0E141B);text-align:right}.row .v .unit-secondary{font-size:11px;color:var(--color-ink-muted, #6B7480);margin-left:6px}.row.locked .v{color:var(--color-ink-muted, #6B7480);font-style:italic;font-family:var(--font-sans, system-ui, sans-serif)}.specs-drawer footer{position:sticky;bottom:0;padding:12px 20px;background:#fff;border-top:1px solid var(--color-line, #E5E7EB);font-size:11.5px;color:var(--color-ink-muted, #6B7480);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0}.specs-drawer footer a{color:var(--color-blue-deep, #1d4ed8);text-decoration:none}.specs-drawer footer a:hover{text-decoration:underline}.btn-specs-open{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;background:var(--color-ink, #0E141B);color:#fff;border:0;border-radius:7px;font:600 13.5px/1 var(--font-sans, system-ui, sans-serif);cursor:pointer}.btn-specs-open svg{width:14px;height:14px}.btn-specs-open:hover{background:var(--color-blue-deep, #1d4ed8)}.specs-skeleton{padding:20px;display:flex;flex-direction:column;gap:12px}.specs-skeleton .skel-line{height:12px;background:linear-gradient(90deg,var(--color-line, #E5E7EB) 25%,#f3f4f6 50%,var(--color-line, #E5E7EB) 75%);background-size:200% 100%;animation:skel-shimmer 1.4s infinite;border-radius:4px}.specs-skeleton .skel-line.wide{width:70%}.specs-skeleton .skel-line.medium{width:50%}.specs-skeleton .skel-line.narrow{width:35%}@keyframes skel-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.specs-error{padding:32px 20px;text-align:center;color:var(--color-ink-muted, #6B7480);font-size:13px;line-height:1.6}.specs-error strong{display:block;font-size:15px;color:var(--color-ink, #0E141B);margin-bottom:6px}}