:root {
    color-scheme: light;
    --site-header-height: 64px;
    --notification-row-height: 34px;
    --ink: #1d2a30;
    --muted: #66757c;
    --line: #dbe2e5;
    --paper: #ffffff;
    --accent: #e85d2a;
    --accent-dark: #b93e13;
    --interaction-red: #b42318;
    --interaction-red-hover: rgb(180 35 24 / 12%);
    --interaction-red-selected: rgb(180 35 24 / 24%);
    --wash: #f3f6f7;
}

.manu-activity { position: sticky; top: .45rem; z-index: 35; margin: .45rem auto 0; width: min(760px, calc(100% - 2rem)); min-height: 2.6rem; box-sizing: border-box; display: grid; grid-template-columns: auto minmax(0,1fr) minmax(90px,180px) auto; align-items: center; gap: .65rem; padding: .5rem .75rem; border: 1px solid var(--line); border-radius: .75rem; background: var(--paper); color: var(--ink); box-shadow: 0 4px 16px rgba(20,32,50,.12); }
.manu-activity[hidden] { display: none; }
.manu-activity-icon { width: 1rem; height: 1rem; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: manu-spin .8s linear infinite; }
.manu-activity-copy { min-width: 0; display: flex; flex-direction: column; }
.manu-activity-label { font-weight: 700; line-height: 1.2; }
.manu-activity-detail, .manu-activity-slow { line-height: 1.25; opacity: .78; }
.manu-activity-progress { width: 100%; accent-color: var(--primary, #1769aa); }
.manu-activity.is-success .manu-activity-icon { animation: none; border: 0; }
.manu-activity.is-success .manu-activity-icon::before { content: "✓"; color: #168044; font-weight: 800; }
.manu-activity.is-failure { border-color: #b64242; }
.manu-activity.is-failure .manu-activity-icon { animation: none; border: 0; }
.manu-activity.is-failure .manu-activity-icon::before { content: "!"; color: #b64242; font-weight: 800; }
@keyframes manu-spin { to { transform: rotate(360deg); } }
@media (max-width: 600px) { .manu-activity { position: relative; top: 0; width: calc(100% - 1rem); grid-template-columns: auto minmax(0,1fr) auto; } .manu-activity-progress { grid-column: 1 / -1; } }
@media (prefers-reduced-motion: reduce) { .manu-activity-icon { animation: none; border: 0; } .manu-activity.is-running .manu-activity-icon::before { content: "⌛"; } }

* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--wash); font: 16px/1.5 system-ui, sans-serif; }
.build-version { min-height: 25px; padding: 4px 4vw; display: flex; align-items: baseline; color: #d9e2e5; background: #0d1b21; font-size: .78rem; letter-spacing: .02em; }
.build-separator { flex: 0 0 auto; color: #82949b; }
.build-number { flex: 0 0 auto; color: #fff; font-weight: 800; letter-spacing: .08em; }
.build-summary { min-width: 0; overflow: hidden; color: #aebdc2; text-overflow: ellipsis; white-space: nowrap; }
.notification-row { position: sticky; top: var(--site-header-height); z-index: 30; min-height: var(--notification-row-height); padding: 3px 4vw; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid #c7d3d8; background: var(--paper); }
.notification-title { flex: 0 0 auto; color: var(--ink); font-size: .82rem; letter-spacing: .04em; text-transform: uppercase; }
.notification-content { min-width: 0; flex: 1 1 auto; }
.notification-message { min-height: 30px; padding: 4px 10px; display: flex; align-items: center; overflow-wrap: anywhere; border-left: 4px solid #1769aa; color: #0b3d66; background: #eaf4fd; line-height: 1.3; }
.notification-message.notification-error { border-color: #b3261e; color: #7d1712; background: #fff1ef; }
.notification-message.notification-warning { border-color: #b97800; color: #6b4500; background: #fff4d6; }
.notification-message.notification-success { border-color: #247a46; color: #17552f; background: #edf9f1; }
.notification-message.notification-info { border-color: #1769aa; color: #0b3d66; background: #eaf4fd; }
.notification-empty { display: block; min-height: 18px; }
a { color: inherit; }
.button-link { display: inline-block; text-decoration: none; }
.primary-button { padding: 10px 15px; border: 1px solid #126b78; border-radius: 6px; color: white; background: #126b78; font: inherit; font-weight: 700; cursor: pointer; }
.heading-actions { display: flex; align-items: center; gap: 10px; }
.form-card, .message-box { max-width: 760px; padding: 20px; border: 1px solid var(--line); border-radius: 10px; background: white; }
.form-card input[type="file"] { display: block; width: 100%; padding: 10px; border: 1px solid var(--line); border-radius: 6px; }
.help { color: var(--muted); font-size: .9rem; }
.message-box { margin-bottom: 18px; }
.message-box.error { border-left: 5px solid #b3261e; background: #fff5f4; }
.message-box.success { border-left: 5px solid #247a46; background: #f0faf3; }
.message-box.warning { border-left: 5px solid #b97800; background: #fff8e8; }
.preview-table { max-width: 100%; margin-bottom: 18px; border: 1px solid var(--line); background: white; }
.site-header { position: sticky; top: 0; z-index: 40; min-height: var(--site-header-height); padding: 0 4vw; display: flex; align-items: center; gap: 16px; color: white; background: #15272f; box-shadow: 0 3px 12px rgb(13 27 33 / 18%); }
.global-task-indicator { width: 20px; height: 20px; flex: 0 0 20px; display: grid; place-items: center; color: #d8f7df; text-decoration: none; }
.global-task-indicator span { width: 10px; height: 10px; border-radius: 50%; background: #82e99b; box-shadow: 0 0 0 2px rgb(130 233 155 / 18%); }
.global-task-indicator.is-active span { width: 16px; height: 16px; border-radius: 0; background: currentColor; box-shadow: none; clip-path: polygon(42% 0,58% 0,62% 18%,72% 22%,88% 12%,100% 28%,85% 40%,85% 60%,100% 72%,88% 88%,72% 78%,62% 82%,58% 100%,42% 100%,38% 82%,28% 78%,12% 88%,0 72%,15% 60%,15% 40%,0 28%,12% 12%,28% 22%,38% 18%); animation: global-task-spin 1.8s linear infinite; }
.global-task-indicator.is-active span::after { content: ""; width: 5px; height: 5px; display: block; margin: 5.5px; border-radius: 50%; background: #15272f; }
@keyframes global-task-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .global-task-indicator.is-active span { animation-duration: 4s; } }
.site-header .brand { font-size: 1.4rem; font-weight: 800; letter-spacing: .12em; text-decoration: none; }
.site-header .site-tagline { margin-right: auto; color: #b9c5ca; }
.header-cart { position: relative; width: 44px; height: 44px; flex: 0 0 44px; display: grid; place-items: center; color: white; text-decoration: none; border-radius: 8px; }
.header-cart:hover, .header-cart:focus-visible { background: #29434e; }
.header-cart:focus-visible { outline: 3px solid #f0a17f; outline-offset: 2px; }
.header-cart-icon { font-size: 1.8rem; line-height: 1; filter: grayscale(1) brightness(3); }
.header-cart-badge { position: absolute; top: 0; right: -2px; min-width: 1.25rem; padding: 2px 5px; border-radius: 999px; color: #15272f; background: #ffd6a3; font-size: .72rem; font-weight: 800; line-height: 1.2; text-align: center; }
.performance-toggle { width: 36px; height: 36px; margin-right: 4px; border: 0; border-radius: 8px; display: grid; place-items: center; color: #4caf67; background: transparent; cursor: pointer; font-size: 1.2rem; line-height: 1; }
.performance-toggle:hover, .performance-toggle:focus-visible { background: #29434e; }
.performance-toggle:focus-visible { outline: 3px solid #f0a17f; outline-offset: 2px; }
.performance-toggle.is-active { color: #ff4d5f; }
.site-navigation { min-width: 0; }
.site-navigation > summary { display: none; }
.navigation-groups { display: flex; align-items: center; gap: 5px; }
.nav-dropdown { position: relative; }
.nav-dropdown > summary, .site-navigation > summary { padding: 9px 10px; border-radius: 7px; cursor: pointer; list-style: none; white-space: nowrap; }
.nav-dropdown > summary::-webkit-details-marker, .site-navigation > summary::-webkit-details-marker { display: none; }
.nav-dropdown > summary:hover, .nav-dropdown[open] > summary, .nav-dropdown[data-active="true"] > summary { background: #29434e; }
.nav-chevron { display: inline-block; margin-left: 3px; transition: transform .15s ease; }
.nav-dropdown[open] > summary .nav-chevron, .site-navigation[open] > summary .nav-chevron { transform: rotate(180deg); }
.nav-panel { position: absolute; z-index: 80; top: calc(100% + 7px); left: 0; width: max-content; min-width: 210px; max-width: min(330px, calc(100vw - 24px)); padding: 7px; display: grid; gap: 2px; overflow-wrap: anywhere; border: 1px solid #60727a; border-radius: 9px; color: white; background: #15272f; box-shadow: 0 12px 32px rgb(0 0 0 / 32%); }
.nav-dropdown:nth-last-child(-n+2) .nav-panel { right: 0; left: auto; }
.nav-panel a { min-height: 42px; padding: 10px 11px; display: flex; align-items: center; justify-content: space-between; gap: 9px; border-radius: 6px; text-decoration: none; }
.nav-panel a:hover, .nav-panel a:focus-visible, .nav-panel a[aria-current="page"] { background: #29434e; }
.nav-panel form { margin: 0; }
.nav-panel .nav-link-button { width: 100%; min-height: 42px; padding: 10px 11px; border: 0; border-radius: 6px; color: white; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.nav-panel .nav-link-button:hover, .nav-panel .nav-link-button:focus-visible { background: #29434e; }
.nav-dropdown summary:focus-visible, .site-navigation > summary:focus-visible, .nav-panel a:focus-visible { outline: 3px solid #f0a17f; outline-offset: 2px; }
.nav-prominent { font-weight: 800; }
.experimental-badge, .nav-count { padding: 2px 6px; border-radius: 999px; color: #15272f; background: #ffd6a3; font-size: .68rem; font-weight: 800; line-height: 1.4; }
.history-navigation { min-height: 46px; padding: 5px 4vw; display: flex; align-items: center; justify-content: flex-start; gap: 8px; border-bottom: 1px solid var(--line); background: var(--paper); }
.history-back, .history-forward { min-height: 36px; flex: 0 0 auto; padding: 7px 10px; border: 1px solid var(--line); border-radius: 7px; color: var(--ink); background: var(--wash); font: inherit; font-size: .88rem; font-weight: 700; cursor: pointer; white-space: nowrap; }
.history-back:hover, .history-forward:hover { border-color: var(--muted); background: var(--line); }
.history-back:focus-visible, .history-forward:focus-visible { outline: 3px solid #f0a17f; outline-offset: 2px; }
.theme-toggle { width: 36px; height: 36px; flex: 0 0 36px; padding: 0; display: grid; place-items: center; border: 1px solid #60727a; border-radius: 7px; color: white; background: #203943; font: inherit; font-size: 1.05rem; line-height: 1; cursor: pointer; }
.theme-toggle:hover { background: #2b4a56; }
.theme-toggle:focus-visible { outline: 3px solid #f0a17f; outline-offset: 2px; }
.theme-toggle span { color: inherit; }
.viewport-preview-toggle { width: 36px; height: 36px; flex: 0 0 36px; padding: 0; display: grid; place-items: center; border: 1px solid #60727a; border-radius: 7px; color: white; background: #203943; cursor: pointer; }
.viewport-preview-toggle:hover { background: #2b4a56; }
.viewport-preview-toggle:focus-visible { outline: 3px solid #f0a17f; outline-offset: 2px; }
.viewport-preview-desktop-icon { position: relative; width: 17px; height: 12px; border: 2px solid currentColor; border-radius: 2px; }
.viewport-preview-desktop-icon::before { content: ""; position: absolute; top: 12px; left: 6px; width: 2px; height: 3px; background: currentColor; }
.viewport-preview-desktop-icon::after { content: ""; position: absolute; top: 15px; left: 3px; width: 8px; height: 2px; border-radius: 1px; background: currentColor; }
.viewport-preview-smartphone-icon { width: 10px; height: 17px; border: 2px solid currentColor; border-radius: 3px; }
.viewport-preview-stage { position: fixed; z-index: 1000; inset: 0; overflow: hidden; background: rgb(18 29 34 / 96%); color: white; }
.viewport-preview-chrome { position: absolute; z-index: 2; top: 0; right: 0; left: 0; min-height: 48px; box-sizing: border-box; padding: 8px 14px; display: flex; align-items: center; justify-content: center; gap: 10px; border-bottom: 1px solid #60727a; background: #15272f; box-shadow: 0 3px 14px rgb(0 0 0 / 24%); }
.viewport-preview-title { font-weight: 800; }
.viewport-preview-dimensions { color: #c8d7da; font-size: .82rem; }
.viewport-preview-status { color: #ffd89a; font-size: .78rem; }
.viewport-preview-chrome button { min-height: 32px; padding: 5px 10px; border: 1px solid #60727a; border-radius: 6px; color: white; background: #203943; font: inherit; font-size: .82rem; cursor: pointer; }
.viewport-preview-chrome button:disabled { cursor: default; opacity: .5; }
.viewport-preview-chrome button:hover, .viewport-preview-chrome button:focus-visible { background: #2b4a56; }
.viewport-preview-close { font-weight: 800; }
.viewport-preview-frame-area { position: absolute; inset: 49px 0 0; display: grid; place-items: center; }
.viewport-preview-frame-wrapper { width: 393px; height: 852px; flex: 0 0 auto; transform-origin: center center; }
.viewport-preview-frame { display: block; width: 393px; height: 852px; border: 0; outline: 1px solid #60727a; border-radius: 12px; background: var(--paper); box-shadow: 0 12px 36px rgb(0 0 0 / 35%); }
.viewport-preview-stage.is-loading .viewport-preview-frame { background: #f4f7f7; }
.workflow-mobile > summary { display: none; }
.mobile-view-tabs, .mobile-editor-tabs { display: none; }
main { padding: 28px 4vw 50px; }
.eyebrow { margin: 0 0 6px; color: var(--accent-dark); font-size: .78rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 0; font-size: clamp(1.8rem, 3vw, 2.7rem); line-height: 1.12; }
.breadcrumb { margin-bottom: 22px; color: var(--muted); font-size: .9rem; }
.catalog-heading { margin-bottom: 20px; display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.compact-workflow-heading { max-width: 760px; margin-bottom: 14px; }
.ccr-header { margin: 0 0 10px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); box-shadow: 0 3px 12px rgb(26 49 59 / 6%); }
.ccr-breadcrumb { margin-bottom: 4px; display: flex; flex-wrap: wrap; gap: 4px 7px; color: var(--muted); font-size: .76rem; }
.ccr-heading-row { display: flex; align-items: center; justify-content: space-between; gap: 10px 18px; }
.ccr-title-group { min-width: 15rem; }
.ccr-title-group .eyebrow { margin-bottom: 1px; }
.ccr-title-group h1 { font-size: clamp(1.35rem, 2.2vw, 1.9rem); }
.ccr-help { margin: 2px 0 0; color: var(--muted); font-size: .84rem; line-height: 1.3; }
.ccr-meta { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 5px; }
.ccr-meta > span { padding: 3px 7px; border: 1px solid var(--line); border-radius: 999px; background: var(--wash); font-size: .76rem; white-space: nowrap; }
.ccr-meta b { color: var(--muted); font-weight: 700; }
.ccr-legend { margin-top: 5px; padding-top: 5px; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 5px 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: .76rem; }
.ccr-legend span { display: inline-flex; align-items: center; gap: 4px; }
.ccr-legend i { width: 8px; height: 8px; border-radius: 50%; }
.ccr-legend i.safe { background: #247a46; }.ccr-legend i.doubtful { background: #b97800; }.ccr-legend i.problem { background: #b3261e; }
.ccr-tile-grid { flex: 0 0 auto; padding: 6px 4vw; display: grid; grid-template-columns: minmax(270px, 1.35fr) minmax(145px, .8fr) minmax(180px, 1fr) minmax(105px, .55fr) minmax(190px, 1fr) minmax(145px, .8fr); gap: 6px; border-bottom: 1px solid var(--line); background: var(--wash); }
.ccr-tile { min-width: 0; min-height: 58px; padding: 6px 9px; display: flex; flex-direction: column; justify-content: center; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); box-shadow: 0 2px 7px rgb(26 49 59 / 5%); }
.ccr-tile-label { margin-bottom: 2px; color: var(--muted); font-size: .66rem; font-weight: 800; letter-spacing: .07em; line-height: 1; text-transform: uppercase; }
.ccr-tile > strong { overflow: hidden; font-size: .88rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.ccr-tile > small { overflow: hidden; color: var(--muted); font-size: .7rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.ccr-tile-navigation { display: flex; align-items: center; gap: 4px; }
.ccr-tile-navigation :is(.history-back, .history-forward, .secondary-button) { min-height: 29px; padding: 4px 7px; font-size: .7rem; text-decoration: none; }
.ccr-status-tile { border-left: 4px solid #687980; }
.ccr-status-tile.is-draft { border-left-color: #b97800; background: #fffaf0; }
.ccr-status-tile.is-published { border-left-color: #247a46; background: #f1faf4; }
.ccr-status-tile > strong { font-size: 1rem; }
.ccr-tile.notification-row { position: static; min-height: 58px; padding: 6px 9px; display: flex; align-items: stretch; gap: 0; border: 1px solid var(--line); }
.ccr-tile .notification-content { display: flex; align-items: center; }
.ccr-tile .notification-message { width: 100%; min-height: 0; padding: 2px 5px; border-left-width: 3px; font-size: .7rem; line-height: 1.15; }
.ccr-tile .notification-empty { min-height: 0; color: var(--muted); font-size: .74rem; }
.ccr-activity-tile .editor-notice { position: static; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; color: var(--muted); font-size: .74rem; font-weight: 650; }
.ccr-activity-tile:has(.manu-activity:not([hidden])) .editor-notice { display: none; }
.ccr-activity-tile .manu-activity { position: static; width: 100%; min-height: 0; margin: 0; padding: 0; grid-template-columns: auto minmax(0, 1fr); gap: 5px; border: 0; border-radius: 0; box-shadow: none; font-size: .72rem; }
.ccr-activity-tile .manu-activity-icon { width: .75rem; height: .75rem; }
.ccr-activity-tile .manu-activity-progress { grid-column: 1 / -1; height: 4px; }
.ccr-activity-tile .manu-activity-retry { padding: 3px 5px; }
.ccr-activity-tile .manu-activity-detail, .ccr-activity-tile .manu-activity-slow { font-size: .66rem; }
.ccr-association-tile-grid { position: sticky; top: var(--site-header-height); z-index: 35; grid-template-columns: minmax(205px, 1.15fr) minmax(120px, .7fr) minmax(145px, .85fr) minmax(96px, .55fr) minmax(145px, .85fr) minmax(125px, .7fr) minmax(215px, 1.35fr); box-shadow: 0 4px 14px rgb(20 32 50 / 12%); }
.ccr-phase-actions-tile { justify-content: flex-start; }
.ccr-phase-actions-tile .analysis-workflow-status { min-width: 0; overflow: hidden; color: var(--muted); font-size: .7rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.association-save-statuses { display: flex; flex-wrap: wrap; gap: 3px; }
.association-save-status { padding: 2px 5px; border-radius: 999px; background: #eaf4fd; color: #0b3d66; font-size: .68rem; font-weight: 700; }
.association-save-status.is-saved { background: #edf9f1; color: #17552f; }
.association-save-status.is-error { background: #fff1ef; color: #7d1712; }
.ccr-phase-actions { display: flex; align-items: center; gap: 4px; min-width: 0; }
.ccr-phase-actions :is(button, a) { min-height: 29px; padding: 4px 6px; font-size: .68rem; }
.ccr-phase-actions .creator-next-action { position: static; min-height: 0; padding: 0; display: flex; border: 0; background: transparent; box-shadow: none; }
.ccr-phase-actions .creator-next-action .creator-previous-action { display: none; }
.creator-phase-picker { display: inline-flex; min-width: 0; }
.creator-phase-picker select { max-width: 225px; min-height: 29px; padding: 4px 25px 4px 7px; border: 1px solid var(--line); border-radius: 6px; background: var(--paper); color: var(--ink); font: inherit; font-size: .72rem; font-weight: 700; }
.creator-phase-picker select:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.ccr-phase-actions .prominent-action { font-weight: 800; }
.hotspot-editor-page .ccr-header { margin-bottom: 5px; padding-top: 5px; padding-bottom: 5px; }
.hotspot-editor-page .ccr-title-group .eyebrow { display: none; }
.hotspot-editor-page .ccr-title-group h1 { font-size: 1.25rem; }
.hotspot-editor-page .ccr-help { font-size: .74rem; }
.revision { padding: 7px 12px; border: 1px solid var(--line); border-radius: 999px; background: var(--paper); }
.public-catalog-header { margin: 0 0 7px; }
.public-catalog-breadcrumb { margin-bottom: 5px; display: flex; flex-wrap: wrap; gap: 3px 7px; color: var(--muted); font-size: .76rem; }
.public-catalog-breadcrumb a { font-weight: 700; }
.public-catalog-summary.ccr-tile-grid { padding: 0; grid-template-columns: minmax(210px, 1.2fr) minmax(115px, .55fr) minmax(115px, .5fr) minmax(300px, 1.2fr); border: 0; background: transparent; }
.public-catalog-title { min-width: 0; }
.public-catalog-title h1 { margin: 0; overflow: hidden; font-size: 1rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.public-catalog-meta { margin-top: 4px; display: flex; flex-wrap: wrap; gap: 4px 12px; color: var(--muted); font-size: .78rem; }
.public-catalog-meta b { color: var(--ink); }
.public-catalog-status { padding: 0; border: 0; font-size: .88rem; letter-spacing: .06em; line-height: 1.15; white-space: nowrap; }
.public-catalog-status.is-published { color: #176438; }
.public-catalog-status.is-draft { color: #7b4c00; }
.public-catalog-search { min-width: 0; }
.public-catalog-search label { display: block; margin-bottom: 3px; color: var(--muted); font-size: .75rem; font-weight: 800; }
.public-catalog-search > div { display: flex; gap: 6px; }
.public-catalog-search input[type="search"] { min-width: 0; width: 100%; padding: 7px 9px; border: 1px solid #b9c6cb; border-radius: 6px; font: inherit; font-size: .88rem; }
.public-catalog-search .primary-button { padding: 7px 12px; font-size: .88rem; }
.panel-ratio-control { margin-left: auto; display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: .75rem; font-weight: 700; }
.panel-ratio-control select { max-width: 100%; padding: 4px 6px; border: 1px solid var(--line); border-radius: 6px; color: var(--ink); background: var(--paper); font: inherit; font-size: .76rem; }
.public-viewer-layout { --filmstrip-width: 112px; min-height: 0; display: grid; grid-template-columns: minmax(88px, var(--filmstrip-width)) 14px minmax(0, 1fr); gap: 8px; }
.thumbnail-splitter { display: none; position: relative; z-index: 2; min-width: 14px; cursor: col-resize; touch-action: none; }
.thumbnail-splitter::after { position: absolute; top: 10px; bottom: 10px; left: 50%; width: 2px; border-radius: 2px; background: var(--line); content: ""; transform: translateX(-50%); }
.thumbnail-splitter:hover::after, .thumbnail-splitter:focus-visible::after, .public-viewer-layout.is-thumbnail-resizing .thumbnail-splitter::after { background: var(--accent-dark); }
.thumbnail-splitter:focus-visible { outline: 2px solid var(--accent-dark); outline-offset: -2px; }
.public-viewer-layout.is-thumbnail-resizing, .public-viewer-layout.is-thumbnail-resizing * { cursor: col-resize !important; user-select: none !important; }
.public-viewer-workspace { min-width: 0; min-height: 0; display: flex; flex-direction: column; gap: 5px; }
.public-viewer-bar { min-height: 34px; padding: 4px 8px; display: flex; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); }
.public-viewer-bar h2 { margin: 0; overflow: hidden; font-size: .92rem; text-overflow: ellipsis; white-space: nowrap; }
.public-filmstrip small { overflow: hidden; font-size: .62rem; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.public-filmstrip .filmstrip-drawing-name { display: block; font-size: .62rem; font-weight: 700; }
.catalog-layout { --drawing-share: 60%; display: grid; grid-template-columns: minmax(0, var(--drawing-share)) 14px minmax(0, calc(100% - var(--drawing-share) - 14px)); gap: 0; }
.catalog-splitter { position: relative; z-index: 2; min-width: 14px; cursor: col-resize; touch-action: none; }
.catalog-splitter::after { position: absolute; top: 10px; bottom: 10px; left: 50%; width: 2px; border-radius: 2px; background: var(--line); content: ""; transform: translateX(-50%); }
.catalog-splitter:hover::after, .catalog-splitter:focus-visible::after, .catalog-layout.is-resizing .catalog-splitter::after { background: var(--accent-dark); }
.catalog-splitter:focus-visible { outline: 2px solid var(--accent-dark); outline-offset: -2px; }
.catalog-layout.is-resizing, .catalog-layout.is-resizing * { cursor: col-resize !important; user-select: none !important; }
.drawing-panel, .parts-panel { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); box-shadow: 0 8px 28px rgb(26 49 59 / 7%); }
.drawing-panel { min-height: 0; padding: 0; display: flex; flex-direction: column; }
.drawing { position: relative; width: 100%; transform-origin: 0 0; user-select: none; }
.drawing img { display: block; width: 100%; height: auto; border: 1px solid var(--line); }
.hotspot { position: absolute; width: 22px; height: 18px; padding: 0; transform: translate(-50%, -50%); border: 1px solid transparent; border-radius: 4px; color: transparent; background: transparent; cursor: pointer; transition: .12s ease; }
.hotspot:hover, .hotspot.hover-linked { z-index: 2; border-color: var(--interaction-red); background: var(--interaction-red-hover); box-shadow: 0 0 0 2px rgb(255 255 255 / 80%); }
.hotspot.selected { z-index: 3; border: 2px solid var(--interaction-red); background: var(--interaction-red-selected); box-shadow: 0 0 0 2px white; }
.parts-panel { min-height: 0; display: flex; flex-direction: column; }
.parts-header { padding: 8px 10px; border-bottom: 1px solid var(--line); }
.parts-header h2 { margin-bottom: 5px; font-size: 1rem; }
.parts-header input { width: 100%; padding: 6px 8px; border: 1px solid #b9c6cb; border-radius: 6px; font: inherit; font-size: .82rem; }
.small-button { padding: 7px 9px; border: 1px solid #126b78; border-radius: 5px; color: #126b78; background: white; font-weight: 700; cursor: pointer; white-space: nowrap; }
.table-wrap { max-height: 610px; overflow: auto; }
.public-catalog-page .table-wrap { min-height: 0; flex: 1 1 auto; max-height: none; }
.public-catalog-page th, .public-catalog-page td { padding: 8px 7px; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 13px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { position: sticky; top: 0; z-index: 1; color: var(--muted); background: #f9fbfb; font-size: .78rem; letter-spacing: .04em; text-transform: uppercase; }
tbody tr { cursor: pointer; }
tbody tr:hover, tbody tr.hover-linked { background: var(--interaction-red-hover); }
tbody tr.selected { background: var(--interaction-red-selected); }
.position-number { display: inline-grid; min-width: 28px; height: 28px; place-items: center; border-radius: 50%; color: white; background: #126b78; font-weight: 800; }
.catalog-list { max-width: 960px; margin: 35px auto; }
.home-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.prominent-action { padding: 13px 20px; font-size: 1.05rem; }
.cards { margin-top: 25px; display: grid; gap: 15px; }
.card { padding: 22px; display: grid; gap: 4px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); text-decoration: none; }
.card:hover { border-color: var(--accent); }
.card strong { font-size: 1.2rem; }
.card span { color: var(--muted); }
.catalog-home-card { gap: 14px; }
.catalog-home-card > div:first-child { display: grid; }
.catalog-home-card-main { display: flex !important; align-items: center; justify-content: space-between; gap: 16px; }
.catalog-home-card-main > div { min-width: 0; display: grid; gap: 3px; }
.catalog-home-cover { flex: 0 0 112px; width: 112px; height: 112px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.catalog-home-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.catalog-home-cover-placeholder { display: grid; place-items: center; color: var(--muted); background: var(--wash); font-size: 2rem; }
.catalog-home-qr { flex: 0 0 112px; width: 112px; height: 112px; padding: 5px; border: 1px solid var(--line); border-radius: 8px; background: #fff; object-fit: contain; }
.catalog-quick-edit-trigger { padding: 6px 10px; font-size: .82rem; }
.catalog-quick-edit-dialog { width: min(420px, calc(100vw - 32px)); padding: 20px; border: 1px solid var(--line); border-radius: 12px; color: inherit; background: var(--paper); box-shadow: 0 16px 50px rgb(0 0 0 / 25%); }
.catalog-quick-edit-dialog::backdrop { background: rgb(0 0 0 / 38%); }
.catalog-quick-edit-dialog h2 { margin: 0; }
.catalog-quick-edit-context { color: var(--muted); }
.catalog-quick-edit-dialog label { display: grid; gap: 5px; margin: 12px 0; font-weight: 700; }
.catalog-quick-edit-dialog input { width: 100%; box-sizing: border-box; }
.smartphone-catalog-qr-dialog { width: min(420px, calc(100vw - 32px)); max-height: min(760px, calc(100vh - 32px)); overflow: auto; }
.smartphone-catalog-qr-composition { display: grid; gap: 12px; }
.smartphone-catalog-qr-composition h2 { margin: 0; }
.smartphone-catalog-qr-large { display: grid; place-items: center; min-height: 280px; padding: 10px; border: 1px solid var(--line); background: #fff; }
.smartphone-catalog-qr-large img { display: block; width: min(280px, 100%); height: auto; aspect-ratio: 1; image-rendering: pixelated; object-fit: contain; }
.smartphone-catalog-qr-large span { color: var(--muted); }
.smartphone-catalog-qr-cover { display: grid; place-items: center; min-height: 112px; padding: 8px; border: 1px solid var(--line); background: #fff; }
.smartphone-catalog-qr-cover img { display: block; width: 96px; height: 112px; object-fit: contain; }
.smartphone-catalog-qr-metadata { display: grid; gap: 7px; margin: 0; }
.smartphone-catalog-qr-metadata div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: 10px; padding: 8px 10px; background: var(--wash); overflow-wrap: anywhere; }
.smartphone-catalog-qr-metadata dt { color: var(--muted); font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.smartphone-catalog-qr-metadata dd { margin: 0; font-weight: 650; }
.smartphone-catalog-qr-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.smartphone-catalog-qr-actions button { min-height: 44px; padding: 8px 10px; }
.smartphone-catalog-qr-note { color: var(--muted); line-height: 1.35; }
@media print {
    .smartphone-catalog-qr-dialog { display: none !important; }
}
.catalog-extracted-data { padding-top: 14px; border-top: 1px solid var(--line); }
.catalog-extracted-data p { margin: 0; }
.catalog-extracted-subtitle { color: var(--muted); font-size: .88rem; }
.catalog-extracted-grid { margin: 12px 0 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.catalog-extracted-grid > div { min-width: 0; padding: 9px 10px; border-radius: 7px; background: var(--wash); }
.catalog-extracted-grid dt { color: var(--muted); font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.catalog-extracted-grid dd { margin: 3px 0 0; overflow-wrap: anywhere; font-weight: 700; }
.catalog-model-value { font-size: 1.05rem; }
.associated-codes-trigger { min-height: 38px; padding: 7px 10px; }
.associated-codes-dialog { width: min(560px, calc(100vw - 32px)); max-height: min(700px, calc(100vh - 32px)); overflow: auto; padding: 20px; border: 1px solid var(--line); border-radius: 12px; color: inherit; background: var(--paper); box-shadow: 0 16px 50px rgb(0 0 0 / 25%); }
.associated-codes-dialog::backdrop { background: rgb(0 0 0 / 38%); }
.associated-codes-dialog h2 { margin: 0; }
.associated-codes-list { display: grid; gap: 8px; margin-top: 14px; }
.associated-code-row { display: grid; grid-template-columns: minmax(80px, .35fr) minmax(0, 1fr); gap: 3px 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--wash); }
.associated-code-row strong { font-size: 1rem; }
.associated-code-row span { overflow-wrap: anywhere; }
.associated-code-row small { grid-column: 2; color: var(--muted); }
.catalog-meta { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.status-badge { width: fit-content; padding: 2px 9px; border-radius: 999px; background: #eef2f3; font-weight: 700; }
.status-badge.published { color: #176438; background: #e7f6eb; }
.codex-fixed-indicator { position: fixed; top: 8px; left: 50%; z-index: 1000; max-width: calc(100vw - 24px); padding: 6px 14px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); background: var(--paper); box-shadow: 0 4px 18px rgb(0 0 0 / 18%); font-size: .78rem; font-weight: 900; letter-spacing: .05em; text-align: center; white-space: nowrap; transform: translateX(-50%); }
.codex-fixed-indicator.status-idle, .codex-fixed-indicator[data-status-code="IDLE"] { border-color: #88d9a0; color: #123c21; background: #bdf1ca; box-shadow: 0 4px 18px rgb(0 0 0 / 14%), 0 0 0 3px rgb(136 217 160 / 18%); animation: none; }
.codex-fixed-indicator.status-received { border-color: #2676c9; color: #fff; background: #165fa8; }
.codex-fixed-indicator.status-validated { border-color: #168c91; color: #fff; background: #087176; }
.codex-fixed-indicator.status-queued { border-color: #8364d8; color: #fff; background: #6546b8; }
.codex-fixed-indicator.status-working { border-color: #ff5a52; color: #fff; background: #cf201b; }
.codex-fixed-indicator.status-verifying { border-color: #e39a22; color: #201500; background: #ffc35a; }
.codex-fixed-indicator.status-success { border-color: #2f9255; color: #fff; background: #247a46; }
.codex-fixed-indicator.status-failed { border-color: #e05a50; color: #fff; background: #851b17; }
.codex-fixed-indicator.status-blocked { border-color: #d68116; color: #fff; background: #8a4d08; }
.codex-fixed-indicator[data-status-code]:not([data-status-code="IDLE"]) { border-color: transparent; color: #fff; background: linear-gradient(110deg, #087176, #1769aa, #6546b8, #cf201b, #d17b08, #087176) 0 50% / 300% 100%; box-shadow: 0 4px 18px rgb(0 0 0 / 18%), 0 0 12px rgb(23 105 170 / 20%); animation: development-color-cycle 6s linear infinite; }
@keyframes development-color-cycle { to { background-position: 300% 50%; } }
.development-page { width: 100%; max-width: 1540px; margin: 0 auto; }
.development-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.development-heading h1 { margin-bottom: 0; }
.development-refresh { padding: 5px 9px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); background: var(--paper); white-space: nowrap; }
.development-dashboard { margin-top: 12px; display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: 12px; align-items: stretch; }
.development-changelog { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.development-changelog-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.development-changelog-heading h2 { margin: 0; }
.development-changelog-heading > small { color: var(--muted); }
.development-overview { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.development-micro-card, .development-task-card, .development-result-card, .development-quota-card { min-width: 0; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); box-shadow: 0 6px 20px rgb(26 49 59 / 6%); }
.development-micro-card { padding: 10px 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.development-micro-card span, .development-task-heading span, .development-result-card > div > span, .development-task-card dt, .development-result-card dt { color: var(--muted); font-size: .72rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.development-micro-card strong { overflow: hidden; font-size: 1rem; text-overflow: ellipsis; white-space: nowrap; }
.development-task-card { padding: 16px; border-top: 3px solid #126b78; }
.development-task-card.is-idle { border-top-color: var(--line); }
.development-task-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.development-task-heading h2 { margin: 2px 0 0; font-size: 1.15rem; }
.development-phase { padding: 4px 8px; border-radius: 999px; background: var(--wash); white-space: nowrap; }
.development-task-details { margin: 12px 0 0; display: grid; grid-template-columns: minmax(0, 1.8fr) repeat(2, minmax(110px, .7fr)); gap: 8px; }
.development-task-details > div { min-width: 0; padding: 8px 10px; border-radius: 7px; background: var(--wash); }
.development-task-card dd, .development-result-card dd { margin: 2px 0 0; overflow-wrap: anywhere; font-weight: 700; }
.development-task-id dd { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.development-task-description { min-height: 1.35em; margin: 10px 0 0; overflow: hidden; color: var(--muted); font-size: .85rem; text-overflow: ellipsis; white-space: nowrap; }
.development-channel { color: var(--muted); }
.development-progress { margin-top: 14px; padding: 5px 4px 2px; display: grid; grid-template-columns: repeat(5, 1fr); }
.development-progress span { position: relative; min-width: 0; display: grid; justify-items: center; gap: 7px; color: #78868c; }
.development-progress span::before { content: ""; position: absolute; top: 7px; right: 50%; left: -50%; height: 4px; border-radius: 999px; background: #cbd3d6; }
.development-progress span:first-child::before { display: none; }
.development-progress i { position: relative; z-index: 1; width: 18px; height: 18px; border: 3px solid var(--paper); border-radius: 50%; background: #aeb9bd; box-shadow: 0 0 0 2px #cbd3d6; }
.development-progress .is-complete i, .development-progress .is-complete::before, .development-progress .is-current::before { background: #278253; }
.development-progress .is-complete i { box-shadow: 0 0 0 2px #278253; }
.development-progress .is-current { color: var(--ink); font-weight: 900; }
.development-progress .is-current i { width: 20px; height: 20px; margin-top: -1px; border-width: 3px; background: linear-gradient(110deg, #087176, #1769aa, #6546b8, #cf201b, #d17b08, #087176) 0 50% / 300% 100%; box-shadow: 0 0 0 3px rgb(23 105 170 / 22%), 0 0 13px rgb(101 70 184 / 42%); animation: development-color-cycle 4s linear infinite, development-current-glow 1.8s ease-in-out infinite; }
.development-task-card.is-idle .development-progress .is-current i { background: #bdf1ca; box-shadow: 0 0 0 3px rgb(136 217 160 / 25%); animation: none; }
.development-progress small { max-width: 100%; overflow: hidden; font-size: .75rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
@keyframes development-current-glow { 50% { box-shadow: 0 0 0 4px rgb(23 105 170 / 16%), 0 0 17px rgb(207 32 27 / 48%); } }
@media (prefers-reduced-motion: reduce) { .codex-fixed-indicator[data-status-code]:not([data-status-code="IDLE"]), .development-progress .is-current i { animation: none; } }
.development-result-card { padding: 16px; display: grid; align-content: start; gap: 10px; }
.development-result-card h2 { margin: 2px 0 0; overflow: hidden; font-size: 1rem; text-overflow: ellipsis; white-space: nowrap; }
.development-result-card dl { margin: 0; display: grid; gap: 7px; }
.development-result-card dl > div { min-width: 0; padding: 7px 9px; border-radius: 7px; background: var(--wash); }
.development-result-card dd[data-outcome="SUCCESS"] { color: #3aa566; }
.development-result-card dd[data-outcome="FAILED"], .development-result-card dd[data-outcome="INVALID"] { color: #d94a40; }
.development-quota-card { grid-column: 1 / -1; padding: 12px 16px; display: grid; grid-template-columns: minmax(150px, .35fr) minmax(0, 1fr); gap: 14px; }
.development-quota-heading span { color: var(--muted); font-size: .72rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.development-quota-heading h2 { margin: 2px 0 0; font-size: 1rem; }
.development-quota-card [data-field="codex_usage"] { min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.codex-usage-window { min-width: 0; display: grid; gap: 4px; }
.codex-usage-window > div:first-child { display: flex; justify-content: space-between; gap: 10px; font-size: .78rem; }
.codex-usage-window > div:first-child span, .codex-usage-window small, .codex-usage-updated { color: var(--muted); }
.codex-usage-progress { height: 6px; overflow: hidden; border-radius: 999px; background: var(--wash); }
.codex-usage-progress > span { display: block; height: 100%; background: #126b78; }
.codex-usage-unavailable { margin: 0; color: var(--muted); }
.codex-usage-updated { grid-column: 1 / -1; }
.progress { height: 8px; overflow: hidden; border-radius: 999px; background: #e4eaec; }
.progress span { display: block; height: 100%; background: #247a46; }
.global-search { max-width: 760px; margin: 24px 0; padding: 18px; border-radius: 10px; background: white; }
.global-search label { display: block; margin-bottom: 8px; font-weight: 800; }
.global-search div { display: flex; gap: 8px; }
.global-search input { min-width: 0; flex: 1; padding: 10px 12px; border: 1px solid #aebbc0; border-radius: 6px; font: inherit; }
.desktop-home-searches { max-width: 760px; display: grid; gap: 12px; margin: 24px 0; }
.desktop-home-searches .global-search { max-width: none; margin: 0; }
.desktop-manu-ai-home { padding: 20px; border: 2px solid #6d4c9b; border-radius: 12px; background: #f4effb; }
.desktop-manu-ai-home label { display: block; margin-bottom: 8px; color: #442b6a; font-size: 1.15rem; font-weight: 800; }
.desktop-manu-ai-home div { display: flex; gap: 8px; }
.desktop-manu-ai-home input { min-width: 0; flex: 1; padding: 10px 12px; border: 1px solid #a998c2; border-radius: 6px; font: inherit; }
.desktop-manu-ai-home button { border-color: #573b80; background: #573b80; }
.view-navigation { margin-bottom: 20px; padding: 10px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 9px; background: white; }
.view-navigation a { padding: 7px 10px; border-radius: 6px; text-decoration: none; }
.view-navigation a:hover, .view-navigation a.active { color: white; background: #126b78; }
.view-title { margin-bottom: 12px; }
.search-results { display: grid; gap: 12px; }
.search-result { padding: 18px; border: 1px solid var(--line); border-radius: 9px; background: white; }
.search-result h3 { margin: 3px 0; }

.editor-heading { margin-bottom: 4px; }
.editor-heading h1 { margin-bottom: 4px; }
.editor-heading p { margin: 0; }
.quiet-action { padding: 5px 8px; color: var(--muted); font-size: .82rem; text-decoration: none; }
.quiet-action:hover { color: var(--ink); text-decoration: underline; }
.unified-hotspot-summary { position: sticky; top: var(--site-header-height); z-index: 24; margin-bottom: 4px; padding: 5px 9px; display: flex; flex-wrap: wrap; gap: 4px 14px; border: 1px solid var(--line); border-radius: 7px; background: var(--paper); box-shadow: 0 3px 10px rgb(20 32 50 / 10%); font-size: .84rem; }
.compact-coverage-status { margin: 0 0 4px; padding: 4px 8px; border-left: 3px solid #b97800; color: var(--muted); background: rgb(185 120 0 / 8%); font-size: .82rem; }
.compact-coverage-status.success { border-color: #247a46; background: rgb(36 122 70 / 8%); }
.proposal-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; color: var(--muted); font-size: .82rem; }
.proposal-legend i { width: 12px; height: 12px; border-radius: 50%; background: #247a46; }
.proposal-legend i.doubtful { background: #b97800; }
.proposal-legend i.problem { background: #b3261e; }
.editor-proposal { z-index: 4; }
.editor-proposal.problem-current span, .editor-position.problem-current { outline: 4px solid rgb(179 38 30 / 35%); outline-offset: 2px; }
.unified-hotspot-command-bar { position: fixed; z-index: 30; right: 0; bottom: 0; left: 0; min-height: 62px; padding: 7px max(18px, calc((100vw - 1500px) / 2)); display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; border-top: 1px solid var(--line); background: var(--paper); box-shadow: 0 -4px 16px rgb(0 0 0 / 12%); }
.unified-hotspot-command-bar :is(button, a) { white-space: nowrap; }
.command-zone { min-width: 0; display: flex; align-items: center; gap: 7px; }
.command-operations { justify-content: center; flex-wrap: wrap; }
.command-advance { justify-content: flex-end; }
.next-problem-action { border-color: #b97800; }
.unified-hotspot-command-bar .safe-return { margin-left: auto; }
.unified-hotspot-command-spacer { height: 78px; }
.editor-notice { position: sticky; top: var(--site-header-height); z-index: 20; margin-bottom: 6px; padding: 6px 10px; border-left: 3px solid #126b78; background: #e7f3f4; box-shadow: 0 3px 10px rgb(26 49 59 / 9%); font-size: .88rem; font-weight: 700; }
.editor-notice.error { border-color: #b3261e; color: #7e1711; background: #fdecea; }
.hotspot-editor-page { height: 100dvh; display: flex; flex-direction: column; overflow: hidden; }
.hotspot-editor-page > :not(main) { flex: 0 0 auto; }
.hotspot-editor-page main { min-height: 0; flex: 1 1 auto; padding-top: 8px; padding-bottom: 70px; display: flex; flex-direction: column; overflow: hidden; }
.hotspot-editor-page :is(.breadcrumb, .editor-heading, .view-navigation, .editor-notice) { flex: 0 0 auto; }
.hotspot-editor-page .breadcrumb { margin-bottom: 3px; }
.hotspot-editor-page .view-navigation { margin-bottom: 4px; padding: 5px 8px; }
.editor-layout { min-height: 0; flex: 1 1 auto; display: grid; grid-template-columns: 112px minmax(420px, 1fr) 320px; gap: 8px; align-items: stretch; overflow: hidden; }
.page-filmstrip { min-height: 0; padding: 7px; display: flex; flex-direction: column; gap: 8px; overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--line); border-radius: 10px; background: var(--wash); }
.filmstrip-thumbnail { flex: 0 0 auto; padding: 5px; display: grid; gap: 4px; border: 2px solid transparent; border-radius: 7px; color: var(--muted); background: var(--paper); font-size: .67rem; font-weight: 750; line-height: 1.15; text-align: center; text-decoration: none; }
.filmstrip-thumbnail img { width: 100%; height: 104px; display: block; object-fit: contain; background: white; }
.filmstrip-thumbnail:hover, .filmstrip-thumbnail:focus-visible { border-color: #6e9299; }
.filmstrip-thumbnail.is-loading { border-color: #f0a17f; opacity: .7; cursor: progress; }
.filmstrip-thumbnail.active { border-color: #126b78; color: #0d5964; background: #dff1f3; box-shadow: 0 0 0 2px rgb(18 107 120 / 16%); }
.filmstrip-thumbnail.unassociated { border-style: dashed; }
.position-panel, .editor-drawing-panel, .activity-panel { overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); box-shadow: 0 8px 28px rgb(26 49 59 / 7%); }
.position-panel, .editor-drawing-panel { min-height: 0; display: flex; flex-direction: column; }
.position-panel { position: static; }
.position-panel-header { padding: 10px 12px; display: flex; justify-content: space-between; align-items: baseline; border-bottom: 1px solid var(--line); }
.position-panel-header h2 { margin: 0; }
.position-panel-header span { color: var(--muted); font-size: .85rem; }
.position-summary { margin: 0; padding: 8px 12px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .82rem; line-height: 1.25; }
.position-summary strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.position-filters { padding: 7px; display: flex; flex-wrap: wrap; gap: 5px; border-bottom: 1px solid var(--line); }
.position-filters button { padding: 5px 8px; border: 1px solid #829399; border-radius: 999px; color: var(--ink); background: var(--paper); font: inherit; font-size: .76rem; font-weight: 750; cursor: pointer; }
.position-filters button[aria-pressed="true"] { border-color: #126b78; color: white; background: #126b78; }
.position-list { min-height: 0; flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; }
.hotspot-debug { flex: 0 0 auto; max-height: 180px; overflow: auto; border-top: 1px solid var(--line); color: var(--muted); font-size: .75rem; }
.hotspot-debug summary { padding: 7px 10px; cursor: pointer; font-weight: 800; }
.hotspot-debug-list article { padding: 5px 10px; border-top: 1px solid var(--line); }
.hotspot-debug-list small { display: block; overflow-wrap: anywhere; }
.editor-position { width: 100%; padding: 8px 10px; display: flex; gap: 8px; align-items: center; border: 0; border-bottom: 1px solid var(--line); color: var(--ink); background: white; text-align: left; font: inherit; cursor: pointer; }
.editor-position[hidden] { display: none; }
.editor-position:hover { background: #f4f8f8; }
.editor-position.selected { box-shadow: inset 4px 0 #126b78; background: #e9f4f5; }
.editor-position.missing { box-shadow: inset 4px 0 var(--accent); background: #fff8f4; }
.editor-position.missing.selected { box-shadow: inset 4px 0 #126b78; background: #e9f4f5; }
.position-copy { min-width: 0; display: grid; }
.position-copy strong { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-height: 1.25; }
.position-copy small { color: #22727d; font-weight: 800; }
.position-state { display: flex; gap: 5px; align-items: center; }
.state-label { width: 1.25rem; height: 1.25rem; display: inline-grid; place-items: center; border-radius: 50%; color: white; background: #22727d; }
.editor-position.missing .state-label { background: var(--accent); }
.editor-position.doubtful { box-shadow: inset 4px 0 #b97800; background: #fffaf0; }
.editor-position.doubtful .state-label { background: #b97800; }
.editor-position.missing .position-copy small { color: var(--accent-dark); font-weight: 700; }
.editor-position.manually-validated { box-shadow: inset 4px 0 #68558c; background: #f2eff8; }
.editor-position.manually-validated .state-label { background: #68558c; }
.editor-position.manually-validated .position-copy small { color: #4f3d72; font-weight: 700; }
.missing-validation-action { padding: 0 10px 8px; border-bottom: 1px solid var(--line); background: var(--paper); }
.missing-validation-action .secondary-button { padding: 4px 8px; font-size: .76rem; }
.editor-layout[data-bom-preview="true"] .hotspot-edit-only { display: none; }
.editor-layout[data-bom-preview="true"] .editor-position.bom-associated { border-left: 5px solid #167447; color: #123d29; background: #dff4e7; }
.editor-layout[data-bom-preview="true"] .editor-position.bom-associated .state-label { background: #167447; }
.editor-layout[data-bom-preview="true"] .editor-position.bom-missing { border-left: 5px solid #b75d00; color: #613000; background: #fff0db; }
.editor-layout[data-bom-preview="true"] .editor-position.bom-missing .state-label { background: #b75d00; }
.editor-layout[data-bom-preview="true"] .editor-position:focus-visible { outline: 3px solid #126b78; outline-offset: -3px; }
.editor-toolbar { min-height: 44px; padding: 6px 10px; display: flex; justify-content: space-between; align-items: center; gap: 12px; border-bottom: 1px solid var(--line); }
.editor-toolbar > strong { line-height: 1.3; }
.editor-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.create-button, .secondary-button { padding: 9px 13px; border-radius: 6px; font: inherit; font-weight: 700; cursor: pointer; }
.create-button { border: 1px solid #126b78; color: white; background: #126b78; }
.create-button:hover, .create-button.active { border-color: var(--accent-dark); background: var(--accent); }
.create-button.active { box-shadow: 0 0 0 4px rgb(232 93 42 / 22%); }
.secondary-button { border: 1px solid #8a989e; color: var(--ink); background: white; }
.secondary-button:hover { background: var(--wash); }
.danger-button { padding: 8px 11px; border: 1px solid #b3261e; border-radius: 6px; color: #9d1d16; background: white; font: inherit; cursor: pointer; }
.danger-button:hover:not(:disabled) { color: white; background: #b3261e; }
.danger-button:disabled { opacity: .4; cursor: default; }
.drawing-viewport { position: relative; min-height: 0; flex: 1 1 auto; overflow: hidden; background: #e6ebed; touch-action: none; }
.editor-canvas { position: relative; width: 100%; cursor: crosshair; user-select: none; touch-action: none; transform-origin: 0 0; }
.editor-layout:not(.creation-mode) .editor-canvas { cursor: default; }
.drawing-viewport.pan-mode, .drawing-viewport.pan-mode .editor-canvas { cursor: grab; }
.drawing-viewport.pan-mode:active, .drawing-viewport.pan-mode:active .editor-canvas { cursor: grabbing; }
.drawing-viewport.is-panning, .drawing-viewport.is-panning .editor-canvas { cursor: grabbing; }
.viewport-toolbar { padding: 8px 12px; display: flex; align-items: center; gap: 7px; border-bottom: 1px solid var(--line); background: #f8fafb; }
.viewport-toolbar button { padding: 6px 10px; border: 1px solid #9aa8ad; border-radius: 5px; background: white; font: inherit; cursor: pointer; }
.viewport-toolbar button.active, .viewport-toolbar button[aria-pressed="true"] { color: white; background: #126b78; }
.viewport-toolbar span { min-width: 52px; text-align: center; font-variant-numeric: tabular-nums; }
.viewer-secondary-action { margin-left: auto; padding: 8px 13px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid #22727d; border-radius: 6px; color: #175e67; background: white; font-size: .92rem; font-weight: 800; line-height: 1.2; text-decoration: none; white-space: nowrap; }
.viewer-secondary-action span { font-size: 1.2rem; line-height: .8; }
.viewer-secondary-action:hover, .viewer-secondary-action:focus-visible { color: white; background: #22727d; }
.try-your-luck-form { display: inline-flex; margin: 0; }
.try-your-luck-action { padding: 7px 11px; border: 1px solid #aa7419; border-radius: 6px; color: #714607; background: #fff7df; font: inherit; font-size: .82rem; font-weight: 800; line-height: 1.2; white-space: nowrap; cursor: pointer; }
.try-your-luck-action:hover, .try-your-luck-action:focus-visible { color: #fff; background: #9b6815; }
.creation-mode .editor-drawing-panel { border-color: var(--accent); box-shadow: 0 0 0 4px rgb(232 93 42 / 18%); }
.creation-mode .editor-canvas { cursor: crosshair; }
.editor-canvas img { display: block; width: 100%; height: auto; pointer-events: none; }
.editor-hotspot { position: absolute; width: 32px; min-width: 32px; height: 32px; min-height: 32px; padding: 0; transform: translate(-50%, -50%); border: 0; color: transparent; background: transparent; cursor: pointer; touch-action: none; }
.move-awaiting .editor-hotspot { cursor: pointer; }
.move-awaiting .editor-hotspot:hover, .move-awaiting .editor-hotspot:focus-visible { z-index: 6; outline: 3px solid #f08c00; outline-offset: 5px; transform: translate(-50%, -50%) scale(1.06); filter: drop-shadow(0 0 8px rgb(255 176 0 / 85%)); }
.move-awaiting .editor-hotspot:hover .hotspot-editor-marker, .move-awaiting .editor-hotspot:focus-visible .hotspot-editor-marker { border-style: dashed; box-shadow: 0 0 0 4px rgb(255 176 0 / 35%); }
.editor-hotspot::after { content: ""; position: absolute; inset: 11px; border: 1px solid rgb(18 107 120 / 58%); border-radius: 50%; background: rgb(255 255 255 / 10%); }
.editor-hotspot:hover, .editor-hotspot.position-selected { z-index: 2; }
.editor-hotspot:hover::after, .editor-hotspot.position-selected::after { border-color: #126b78; background: rgb(18 107 120 / 14%); }
.editor-hotspot.position-selected .hotspot-editor-marker { border-color: #0878ad; background: #159bd7; box-shadow: 0 0 0 4px rgb(21 155 215 / 30%); }
.editor-hotspot.position-selected .hotspot-editor-badge { background: #0878ad; }
.editor-hotspot.row-hover { z-index: 7; }
.editor-hotspot.row-hover::after { border-color: #b3261e; background: rgb(179 38 30 / 22%); }
.editor-hotspot.row-hover .hotspot-editor-marker { border-color: #8e1812; background: #d52b22; box-shadow: 0 0 0 5px rgb(213 43 34 / 30%); }
.editor-hotspot.row-hover .hotspot-editor-badge { background: #b3261e; }
.editor-hotspot.selected { z-index: 3; outline: 0; }
.editor-hotspot.selected::after { inset: 7px; border: 3px solid #126b78; background: rgb(18 107 120 / 18%); outline: 2px solid rgb(255 255 255 / 85%); }
.editor-hotspot.bbox-hotspot { border: 1px dashed rgb(18 107 120 / 42%); border-radius: 3px; }
.editor-hotspot.bbox-hotspot::after { display: none; }
.hotspot-editor-marker { position: absolute; top: 50%; left: 50%; width: 28px; height: 28px; display: grid; place-items: center; transform: translate(-50%, -50%); border: 2px solid #126b78; border-radius: 50%; color: white; background: rgb(18 107 120 / 88%); font-size: .7rem; font-weight: 800; line-height: 1; pointer-events: auto; }
.editor-canvas.markers-hidden :is(.editor-hotspot, .editor-proposal) { visibility: hidden; pointer-events: none; }
.editor-hotspot.move-target { z-index: 6; outline: 3px solid #ffb000; outline-offset: 5px; filter: drop-shadow(0 0 8px rgb(255 176 0 / 85%)); }
.editor-hotspot.move-target .hotspot-editor-marker { border-color: #7a4300; background: #f08c00; box-shadow: 0 0 0 4px rgb(255 176 0 / 35%); }
.hotspot-moving .drawing-viewport, .hotspot-moving .editor-canvas, .hotspot-moving .editor-hotspot { cursor: crosshair !important; }
.editor-hotspot.moving { z-index: 8; opacity: .88; filter: drop-shadow(0 0 12px rgb(255 128 0 / 95%)); animation: hotspot-moving-pulse .8s ease-in-out infinite alternate; pointer-events: none; }
@keyframes hotspot-moving-pulse { to { filter: drop-shadow(0 0 18px rgb(255 128 0 / 100%)); } }
.hotspot-editor-badge { position: absolute; left: 50%; bottom: calc(100% + 5px); display: none; transform: translateX(-50%); padding: 2px 5px; border-radius: 4px; color: white; background: #126b78; font-size: 10px; white-space: nowrap; pointer-events: none; }
.editor-hotspot.selected .hotspot-editor-badge { display: block; }
.empty-state { padding: 18px; color: var(--muted); }
.activity-panel { position: sticky; top: calc(var(--site-header-height) + 12px); }
.activity-header { padding: 15px; border-bottom: 1px solid var(--line); }
.activity-header h2 { margin: 0; }
.activity-header span { color: var(--muted); font-size: .82rem; }
.activity-list { min-height: 180px; max-height: calc(100vh - 255px); margin: 0; padding: 8px 12px 12px 36px; overflow-y: auto; }
.activity-list li { padding: 9px 3px; border-bottom: 1px solid var(--line); font-size: .88rem; }
.activity-list li::marker { color: #126b78; font-weight: 700; }
.activity-list .activity-empty { color: var(--muted); }
.command-progress { margin-right: auto; color: var(--muted); white-space: nowrap; }
.viewport-toolbar { flex-wrap: wrap; }
.tool-group { display: inline-flex; align-items: center; gap: 5px; }
.hotspot-tool-group { margin-left: auto; flex-wrap: wrap; justify-content: flex-end; }
.hotspot-tool-group :is(.secondary-button, .danger-button, .viewer-secondary-action) { padding: 6px 9px; font-size: .8rem; }
.cart-table { margin: 22px 0; border: 1px solid var(--line); background: white; }
.quantity-input { width: 85px; padding: 8px; font: inherit; }
.quantity-controls { display: flex; align-items: center; gap: 4px; }
.quantity-controls button { width: 36px; min-height: 38px; border: 1px solid var(--line); background: white; }
.line-note { width: 220px; max-width: 100%; padding: 7px; }
.request-summary { max-width: 900px; margin: 18px 0; padding: 20px; border: 1px solid var(--line); border-radius: 10px; background: white; }
.request-line-card { margin-bottom: 10px; padding: 13px; display: grid; gap: 3px; border-left: 4px solid #126b78; background: var(--wash); }
.request-line-card small { color: var(--muted); }
.request-filters { margin: 18px 0; display: flex; flex-wrap: wrap; gap: 8px; }
.request-filters input, .request-filters select, .status-form select { min-height: 42px; padding: 8px; border: 1px solid var(--line); border-radius: 6px; font: inherit; }
.maintenance-grid { margin-top: 20px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.maintenance-grid dl { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
.maintenance-grid dd { margin: 0; text-align: right; font-weight: 800; }
.agent-content-card, .news-card { max-width: 860px; margin: 18px 0; padding: 20px; border: 1px solid var(--line); border-radius: 10px; background: white; overflow-wrap: anywhere; }
.agent-content-card h2:not(:first-child) { margin-top: 24px; }
.agent-content-card li, .news-card li { margin-bottom: 7px; }
.news-card header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; }
.news-card header span, .news-card small { color: var(--muted); }
.news-meta small { display: flex; flex-wrap: wrap; gap: 4px 12px; color: var(--muted); }
.news-meta small span + span::before { content: "· "; }
.news-card.latest { border-left: 5px solid #126b78; }
.archive-heading { margin-top: 32px; }
.news-archive { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.news-archive .news-card { margin: 0; }
.form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ai-knowledge-page { width: 100%; max-width: 980px; margin: 0 auto; }
.ai-knowledge-page .page-heading { margin-bottom: 18px; }
.ai-knowledge-warning { margin-bottom: 16px; padding: 12px 14px; border-left: 4px solid var(--accent); background: var(--wash); color: var(--muted); }
.ai-knowledge-form { max-width: none; display: grid; gap: 10px; }
.ai-knowledge-form textarea { width: 100%; min-height: 28rem; padding: 12px; border: 1px solid var(--line); border-radius: 7px; font: 1rem/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; resize: vertical; }
.ai-knowledge-form small, .ai-knowledge-meta span, .ai-knowledge-revision span, .ai-knowledge-revision small { color: var(--muted); }
.ai-knowledge-meta, .ai-knowledge-history { margin-top: 18px; padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); }
.ai-knowledge-meta { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.ai-knowledge-history h2 { margin-top: 0; }
.ai-knowledge-revision { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 0; border-top: 1px solid var(--line); }
.ai-knowledge-revision div { display: grid; gap: 2px; }
.request-form label { display: block; margin-bottom: 4px; font-weight: 700; }
.request-form input, .request-form textarea { width: 100%; padding: 9px 11px; border: 1px solid #aebbc0; border-radius: 6px; font: inherit; }
.request-form .errorlist { color: #9d1d16; }
.empty-card, .success-card { max-width: 800px; margin-top: 22px; padding: 24px; border: 1px solid var(--line); border-radius: 10px; background: white; }
.success-card { border-top: 6px solid #247a46; }
.request-success-message { width: fit-content; max-width: 100%; margin-bottom: 20px; padding: 10px 16px; overflow-wrap: anywhere; border-radius: 10px; color: #145c32; background: #e1f5e7; font-size: clamp(2.5rem, 8vw, 4.5rem); font-weight: 900; line-height: 1.05; letter-spacing: -.03em; animation: request-success-pulse 1.3s ease-in-out infinite; transform-origin: left center; }
@keyframes request-success-pulse { 50% { opacity: .82; box-shadow: 0 0 0 7px rgb(36 122 70 / 16%); transform: scale(1.018); } }
@media (prefers-reduced-motion: reduce) {
    .request-success-message { animation: none; }
}
.pdf-notice { padding: 12px; color: #6e4100; background: #fff4d6; }
.pdf-view { width: 100%; min-height: 680px; border: 0; }
.workflow-steps { margin: 0 0 22px; padding: 0; display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; list-style: none; counter-reset: workflow; }
.workflow-steps li { min-width: 0; padding: 10px 8px; border-top: 4px solid #8aa0a8; background: white; color: var(--muted); font-size: .82rem; }
.workflow-steps li.done { border-color: #247a46; color: #176438; background: #f0faf3; }
.workflow-steps li.current { outline: 2px solid #126b78; color: #126b78; font-weight: 800; }
.workflow-steps a { text-decoration: none; }
.workflow-steps li::before { counter-increment: workflow; content: counter(workflow) ". "; font-weight: 800; }
.workflow-section { margin-bottom: 18px; padding: 20px; display: flex; align-items: end; gap: 20px; border: 1px solid var(--line); border-radius: 11px; background: white; }
.workflow-section > div:first-child { flex: 1; }
.workflow-section.block-section { display: block; }
.inline-upload { display: flex; align-items: end; gap: 10px; }
.inline-upload p { margin: 0; }
.inline-upload input { display: block; max-width: 310px; }
.workflow-table { overflow-x: auto; }
.page-selector { margin-bottom: 22px; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.page-choice { padding: 12px; display: grid; gap: 10px; border: 2px solid var(--line); border-radius: 9px; background: white; }
.page-choice:has(input:checked) { border-color: #126b78; background: #e9f4f5; }
.page-choice label { display: grid; gap: 4px; font-size: .9rem; }
.page-choice label:first-of-type { display: block; }
.page-choice input[type="text"], .page-choice input:not([type]) { width: 100%; padding: 7px; border: 1px solid #aebbc0; border-radius: 5px; }
.page-choice span { color: var(--muted); font-size: .86rem; }
.page-choice.imported { opacity: .65; cursor: default; }
.pdf-thumbnail { height: 180px; overflow: hidden; border: 1px solid var(--line); background: #f6f8f9; pointer-events: none; }
.pdf-thumbnail object { width: 100%; height: 100%; border: 0; }
.thumbnail-button { width: 100%; min-height: 180px; padding: 0; overflow: hidden; border: 1px solid var(--line); background: #f6f8f9; cursor: zoom-in; }
.thumbnail-button img, .bom-page img { display: block; width: 100%; height: 180px; object-fit: contain; }
.thumbnail-error { display: none; padding: 25px; }
.thumbnail-button.failed img { display: none; }
.thumbnail-button.failed .thumbnail-error { display: block; }
#page-preview { width: min(92vw, 1000px); padding: 14px; border: 0; border-radius: 10px; }
#page-preview::backdrop { background: rgb(0 0 0 / 65%); }
#page-preview img { display: block; max-width: 100%; max-height: 82vh; margin: 12px auto 0; }
.bom-page { cursor: pointer; }
.problem-row { background: #fff1ef; }
.preview-table input { min-width: 80px; width: 100%; padding: 6px; }
.selection-actions { margin-bottom: 14px; }
.workflow-cards { display: grid; gap: 10px; }
.plate-card { padding: 16px; display: grid; grid-template-columns: minmax(180px, 1fr) minmax(230px, 1fr) auto; align-items: center; gap: 18px; border: 1px solid var(--line); border-radius: 9px; }
.plate-card > div { display: grid; gap: 3px; }
.plate-card span { color: var(--muted); }
.plate-state { margin-top: 3px; color: #126b78; }
.verification-card { max-width: 760px; margin-bottom: 18px; padding: 8px 22px; border: 1px solid var(--line); border-radius: 10px; background: white; }
.verification-card dl { margin: 0; }
.verification-card dl div { padding: 12px 0; display: flex; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); }
.verification-card dl div:last-child { border: 0; }
.verification-card dt { font-weight: 700; }
.verification-card dd { margin: 0; font-variant-numeric: tabular-nums; }
.publish-check { max-width: 820px; margin: 0 auto; }
.publish-check-heading { margin: 0 0 16px; }
.publish-check-heading h1 { margin-bottom: 0; }
.publish-state { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: clamp(22px, 4vw, 36px); border: 1px solid var(--line); border-left-width: 6px; border-radius: 14px; background: var(--paper); }
.publish-state h2 { margin: 0 0 8px; font-size: clamp(1.45rem, 3vw, 2rem); }
.publish-state p { margin: 0; color: var(--muted); }
.publish-state-success { border-left-color: #247a46; }
.publish-state-error { border-left-color: #b3261e; }
.publish-state-muted { border-left-color: var(--muted); }
.publish-state-copy { min-width: 0; }
.publish-problems { margin: 18px 0; padding-left: 22px; }
.publish-warning-details { margin-top: 18px; }
.publish-warning-details summary { width: max-content; cursor: pointer; color: var(--accent); font-weight: 800; }
.publish-warning-details ul { margin-bottom: 0; padding-left: 22px; }
.publish-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.publish-actions form { margin: 0; }
.publish-technical-link { margin: 24px 0 0; text-align: right; font-size: .86rem; }
.publish-technical-link a { color: var(--muted); }
.workflow-form input { width: 100%; padding: 9px 11px; border: 1px solid #aebbc0; border-radius: 6px; font: inherit; }
.catalog-create-form { width: min(100%, 620px); }
.catalog-create-form > p { margin: 0 0 13px; }
.catalog-extracted-block { margin: 20px 0; padding: 18px; border: 1px solid #b9dce0; border-radius: 12px; background: #f3fbfc; }
.catalog-extracted-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.catalog-extracted-heading h2 { margin: 0 0 5px; font-size: 1.05rem; }
.catalog-extracted-heading p { margin: 0; color: var(--muted); font-size: .88rem; }
.catalog-extraction-badge { flex: 0 0 auto; padding: 5px 9px; border-radius: 999px; color: #126b78; background: #dff3f5; font-size: .75rem; font-weight: 800; white-space: nowrap; }
.catalog-metadata-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
.catalog-metadata-fields .catalog-field { min-width: 0; margin: 0 0 14px; }
.catalog-metadata-fields .catalog-field-model { grid-column: 1 / -1; }
.catalog-field label { display: block; margin-bottom: 5px; font-weight: 700; }
.catalog-field .errorlist { margin: 4px 0 0; }
.catalog-confirm-note { margin: 2px 0 0; color: var(--muted); font-size: .84rem; line-height: 1.45; }
.catalog-create-form > p:has(#id_initial_revision) { margin-top: 18px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: .88rem; }
.catalog-create-form #id_initial_revision { max-width: 8rem; }
.sequential-create-option { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.sequential-create-option summary { width: fit-content; color: var(--muted); font-size: .88rem; cursor: pointer; }
.sequential-create-option .form-help { margin: 9px 0; }
.creator-pdf-entry { min-height: calc(100dvh - var(--site-header-height) - 190px); display: grid; place-content: center; justify-items: center; text-align: center; }
.creator-pdf-entry form { display: grid; justify-items: center; }
.creator-pdf-entry .primary-button { min-width: 220px; padding: 16px 28px; font-size: 1.15rem; }
.creator-pdf-entry .errorlist { max-width: 520px; margin: 0 0 18px; color: #9d1d16; text-align: left; }
.creator-pdf-progress { position: fixed; top: calc(var(--site-header-height) + 28px); z-index: 34; width: min(720px, calc(100vw - 32px)); padding: 12px 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); box-shadow: 0 5px 18px rgb(0 0 0 / 12%); text-align: left; }
.creator-pdf-progress[hidden] { display: none; }
.creator-pdf-progress label { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; margin-top: 8px; }
.creator-pdf-progress progress { grid-column: 1 / -1; width: 100%; min-height: 1.35rem; accent-color: var(--primary); }
.association-preview-progress { position: relative; top: auto; width: auto; margin: 0 0 14px; padding: 14px 18px; border: 2px solid #126b78; border-radius: 12px; color: #12323a; background: #eefbfd; box-shadow: 0 4px 14px rgb(18 107 120 / 16%); }
.association-preview-progress strong { display: block; font-size: 1.05rem; }
.association-preview-progress label { font-weight: 700; }
.association-preview-progress progress { height: 1.45rem; border: 1px solid #126b78; border-radius: 999px; background: #d5e7ea; }
.association-preview-progress progress::-webkit-progress-bar { border-radius: 999px; background: #d5e7ea; }
.association-preview-progress progress::-webkit-progress-value { border-radius: 999px; background: #126b78; }
.association-preview-progress progress::-moz-progress-bar { border-radius: 999px; background: #126b78; }
.association-preview-progress.is-ready { border-color: #247a46; color: #185b35; background: #edf9f0; }
.association-preview-progress.is-ready progress { border-color: #247a46; accent-color: #247a46; }
.analysis-association-form.association-preparing { cursor: progress; }
.analysis-association-form.association-preparing > :not(#association-preview-progress) { pointer-events: none; }
.analysis-association-form.association-preparing .analysis-page { opacity: .72; }
@media (max-width: 600px) { .creator-pdf-entry { min-height: calc(100dvh - var(--site-header-height) - 210px); } .creator-pdf-entry .primary-button { width: min(280px, 80vw); } }
@media (max-width: 600px) { .catalog-extracted-heading { display: block; } .catalog-extraction-badge { display: inline-block; margin-top: 10px; } .catalog-metadata-fields { grid-template-columns: 1fr; } .catalog-metadata-fields .catalog-field-model { grid-column: auto; } }
.danger-confirm { max-width: 720px; padding: 26px; border: 2px solid #b3261e; border-radius: 12px; background: white; }
.danger-confirm dl { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.danger-confirm dl div { padding: 12px; border-radius: 8px; background: #fff1ef; }
.danger-confirm dt { color: var(--muted); font-size: .82rem; }
.danger-confirm dd { margin: 0; font-size: 1.5rem; font-weight: 800; }
.danger-solid { color: white; background: #b3261e; }
.detection-metrics { margin-bottom: 18px; display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
.detection-metrics div { padding: 14px; display: grid; border: 1px solid var(--line); border-radius: 8px; background: white; }
.detection-metrics strong { font-size: 1.45rem; }
.detection-metrics span { color: var(--muted); font-size: .8rem; }
.include-existing { margin-bottom: 16px; }
.detection-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; align-items: start; }
.detection-image, .proposal-list { overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: white; }
.proposal-canvas { position: relative; }
.proposal-canvas > img { display: block; width: 100%; }
.proposal-marker { position: absolute; transform: translate(-50%, -50%); cursor: pointer; }
.proposal-marker input { position: absolute; opacity: 0; }
.proposal-marker span { width: 34px; height: 34px; display: grid; place-items: center; border: 3px dashed #126b78; border-radius: 50%; color: white; background: rgb(18 107 120 / 78%); font-size: .72rem; font-weight: 800; }
.proposal-marker.ambiguous span { border-color: #7a4c00; background: rgb(185 120 0 / 78%); }
.proposal-marker.safe span { border-style: solid; border-color: #247a46; background: rgb(36 122 70 / 82%); }
.proposal-marker input:checked + span { border-style: solid; outline: 4px solid rgb(36 122 70 / 35%); background: #247a46; }
.proposal-list { max-height: 720px; overflow-y: auto; }
.proposal-list article { padding: 12px; border-bottom: 1px solid var(--line); }
.proposal-list p { margin: 4px 0 0; color: var(--muted); font-size: .88rem; }
.detection-actions { margin-top: 16px; }
.analysis-association-form { padding-bottom: 0; }
.analysis-association-form .ccr-heading-row { flex-wrap: nowrap; }
.analysis-association-form .ccr-title-group { min-width: 15rem; }
.analysis-workflow-status { max-width: 12rem; overflow: hidden; color: var(--muted); font-size: .72rem; font-weight: 700; text-overflow: ellipsis; }
.analysis-association-form .ccr-meta { flex: 0 0 auto; }
.duplicate-detection-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin: 0 0 8px; }
.duplicate-detection-bar :is(button, .danger-button) { padding: 6px 9px; font-size: .82rem; }
.duplicate-detection-summary { color: var(--muted); }
.analysis-filters { display: flex; flex-wrap: wrap; gap: 5px; margin: 0 0 8px; }
.analysis-filters button { padding: 5px 8px; font-size: .78rem; }
.analysis-filters .active { color: white; border-color: #247a46; background: #247a46; }
.analysis-association-form .analysis-page { position: relative; }
.analysis-pages { --association-row-gap: 8px; position: relative; margin-bottom: 10px; display: flex; flex-wrap: wrap; align-items: stretch; gap: var(--association-row-gap); }
.analysis-document-group { min-width: 0; max-width: 100%; display: flex; flex: 0 0 auto; align-items: stretch; gap: 8px; overflow-x: auto; scrollbar-width: thin; }
.analysis-document-group:empty { display: none; }
.association-connectors { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.association-connector { fill: none; stroke-linecap: square; stroke-linejoin: round; }
.analysis-page { position: relative; z-index: 1; flex: 0 0 245px; min-width: 245px; height: 100%; padding: 8px; display: flex; flex-direction: column; gap: 6px; border: 1px solid var(--line); border-radius: 8px; background: white; box-shadow: 0 2px 7px rgb(26 49 59 / 5%); }
.analysis-page-details { min-width: 0; display: grid; gap: 5px; }
.analysis-page-header { min-width: 0; padding-right: 72px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.analysis-page-header h2 { flex: 0 0 auto; margin: 0; }
.analysis-page-header .analysis-document-code { flex: 1 1 7rem; min-width: 0; margin: 0; }
.analysis-page-header .page-type-select { flex: 0 1 10rem; }
.analysis-page img { width: 100%; height: auto; aspect-ratio: 210 / 297; object-fit: contain; border: 1px solid var(--line); background: white; }
.analysis-thumbnail-image { display: block; width: 100%; height: auto; aspect-ratio: 297 / 210; object-fit: contain; border: 1px solid var(--line); background: white; }
.analysis-thumbnail-placeholder { display: block; width: 100%; aspect-ratio: 297 / 210; border: 1px solid var(--line); background: white; }
.analysis-pages.previews-loading { visibility: hidden; }
.analysis-page h2 { margin-bottom: 3px; font-size: 1rem; }
.analysis-document-code { display: block; margin: 0 0 6px; color: #c62828; font-size: .9rem; font-weight: 800; }
.analysis-drawing-name { display: block; overflow-wrap: anywhere; font-size: .88rem; line-height: 1.25; }
.analysis-document-code.missing { color: #7f1d1d; }
.analysis-page label { display: grid; gap: 4px; }
.analysis-page select { max-width: 100%; padding: 5px; font-size: .78rem; }
.analysis-reasons { margin: 7px 0 10px; padding-left: 18px; color: var(--muted); font-size: .88rem; }
.analysis-reasons li { margin-bottom: 3px; }
.analysis-page.undetermined { border-color: var(--line); }
.analysis-page.review { border-color: #c9a227; }
.analysis-page.associated { background: #e9f7ec; }
.analysis-page.selected-drawing { background: #dff3f7; }
.analysis-page.completed-drawing { border-color: #68a77b; box-shadow: inset 0 0 0 1px #68a77b; }
.analysis-page.filter-match { outline: 3px solid #247a46; outline-offset: -1px; box-shadow: 0 3px 12px rgb(36 122 70 / 24%); }
.analysis-page.filter-muted { opacity: .42; filter: saturate(.55); }
.analysis-page.filter-muted:hover, .analysis-page.filter-muted:focus-within { opacity: .72; }
.analysis-page.duplicate-page { border-color: #d5a900; background: #fff4b8; box-shadow: inset 0 0 0 2px rgb(213 169 0 / 35%); cursor: not-allowed; }
.analysis-page.document-color-red { border: 4px solid #d50000 !important; }
.analysis-page.document-color-black { border: 4px solid #111111 !important; }
.analysis-page.document-color-blue { border: 4px solid #008fe8 !important; }
.analysis-page.document-color-yellow { border: 4px solid #ffc400 !important; }
.analysis-page.duplicate-page :is(button, .analysis-thumbnail-action):not(.clear-page-duplicate-action) { pointer-events: none; }
.analysis-page.duplicate-page .clear-page-duplicate-action { pointer-events: auto; padding: 5px 8px; font-size: .76rem; cursor: pointer; }
:root[data-theme="dark"] .analysis-page.duplicate-page { color: #302500; background: #d8b83e; }
.analysis-thumbnail-action, .analysis-thumbnail-static { display: block; padding: 0; border: 0; background: transparent; }
.analysis-thumbnail-action { cursor: pointer; }
.analysis-thumbnail-action:disabled { cursor: default; }
.analysis-thumbnail-action:hover .analysis-thumbnail-image, .analysis-thumbnail-action:focus-visible .analysis-thumbnail-image { outline: 3px solid #247a46; }
.analysis-thumbnail { position: relative; width: 100%; }
.analysis-thumbnail-action, .analysis-thumbnail-static { width: 100%; }
.analysis-role-badges { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 2px; }
.analysis-role-badges span { padding: 2px 6px; border-radius: 999px; color: #174b2b; background: #c9ebd2; font-size: .72rem; font-weight: 700; }
.analysis-role-badges [data-role="duplicate"] { color: #513d00; background: #f4cf3c; }
.analysis-page-actions { display: flex; flex-wrap: nowrap; align-items: center; gap: 4px; }
.analysis-page-actions button { padding: 5px 7px; font-size: .78rem; }
.analysis-page-actions .drawing-action:not([hidden]), .analysis-page-actions .bom-action:not([hidden]) { border-color: #22727d; color: #175e67; }
.analysis-active-drawing-badge { padding: 2px 6px; border-radius: 999px; color: white; background: #247a46; font-size: .72rem; font-weight: 700; white-space: nowrap; }
.association-local-action { position: absolute; top: 8px; right: 8px; z-index: 2; padding: 5px 7px; border-color: #22727d; color: #175e67; font-size: .78rem; }
.association-local-action:disabled { border-color: #b8c1c4; color: #68757a; background: #e5e9ea; cursor: default; opacity: .8; }
.development-status-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; margin-top: .8rem; }
.development-status-summary > div { min-width: 0; padding: .7rem .8rem; border: 1px solid var(--border-color, #d7e0e2); border-radius: .65rem; background: var(--surface-muted, #f6f8f8); }
.development-status-summary span { display: block; color: var(--muted-text, #647277); font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; }
.development-status-summary strong { display: block; overflow-wrap: anywhere; margin-top: .2rem; }
@media (max-width: 760px) { .development-status-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.creator-bom-preview-form { padding-bottom: 88px; }
.creator-bom-summary { margin: -6px 0 10px; color: var(--muted); }
.creator-bom-summary strong { color: var(--ink); font-size: 1.05rem; }
.creator-bom-review-bar { position:sticky; top:calc(var(--site-header-height) + var(--notification-row-height)); z-index:20; margin:0 0 14px; padding:6px 9px; border:1px solid var(--line); border-radius:0 0 10px 10px; background:var(--paper); box-shadow:0 4px 14px rgb(20 32 50 / 12%); }
.creator-bom-review-bar .language-tabs { margin:0 0 5px; gap:5px; }
.creator-bom-review-bar .language-tab { padding:5px 8px; }
.language-empty-count:not([hidden])::before { content:" · "; }
.creator-bom-review-actions { display:flex; flex-wrap:wrap; align-items:center; gap:5px 8px; }
.creator-bom-review-actions button { padding:5px 8px; color:var(--muted); font-size:.84rem; font-weight:650; }
.creator-bom-review-actions strong { min-width:10rem; color:var(--muted); font-size:.88rem; }
.creator-bom-incomplete-toggle { display:flex; align-items:center; gap:5px; font-size:.88rem; white-space:nowrap; }
.empty-field-detected { border-color:#b45309 !important; outline:2px solid rgb(245 158 11 / 28%); background:#fff8e8; }
.empty-field-current { outline:3px solid #c2410c; outline-offset:2px; }
[data-bom-row][hidden] { display:none; }
.creator-bom-group { margin-bottom: 18px; }
.creator-next-action { position: fixed; z-index: 20; right: 0; bottom: 0; left: 0; min-height: 68px; padding: 10px max(18px, calc((100vw - 1180px) / 2)); display: flex; align-items: center; justify-content: flex-end; border-top: 1px solid var(--line); background: var(--paper); box-shadow: 0 -4px 16px rgb(0 0 0 / 10%); }
.creator-next-action [disabled] { cursor: not-allowed; opacity: .5; }
.warning-text { color: #9b4d16; }
.comac-table-card { border: 1px solid var(--line); border-radius: 9px; background: var(--paper); }
.comac-table-card > summary { display: flex; flex-wrap: wrap; gap: 8px 18px; padding: 15px; cursor: pointer; }
.comac-table-card > :not(summary) { margin-left: 15px; margin-right: 15px; }
.analysis-proposals { margin-top: 30px; }
.structure-proposal { margin-bottom: 12px; padding: 18px; border: 1px solid #84aeb4; border-radius: 10px; background: white; }
.structure-proposal.disabled { opacity: .7; border-color: var(--line); }
.structure-proposal dl { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
.structure-proposal dl div { padding: 8px; background: var(--wash); }
.structure-proposal dt { color: var(--muted); font-size: .78rem; }
.structure-proposal dd { margin: 0; font-weight: 800; }
.primary-button:disabled { opacity: .45; cursor: default; }
.prominent-search { padding: 20px; border: 2px solid #126b78; border-radius: 12px; background: #e9f4f5; }
.prominent-search label { font-size: 1.15rem; }
.search-results { display: grid; gap: 12px; }
.search-result { padding: 20px; border: 1px solid var(--line); border-radius: 10px; background: white; }
.search-result .result-code { color: #126b78; font-size: 1.25rem; }
.search-result h3 { margin: 5px 0 12px; }
.search-result dl { display: grid; grid-template-columns: repeat(4, minmax(120px, 1fr)); gap: 8px; }
.search-result dl div { padding: 8px; background: var(--wash); }
.search-result dt { color: var(--muted); font-size: .78rem; }
.search-result dd { margin: 3px 0 0; font-weight: 700; }
.hotspot.deep-link-pulse { animation: deep-link-pulse .7s ease-in-out 3; }
@keyframes deep-link-pulse { 50% { outline: 8px solid rgb(180 35 24 / 30%); background: var(--interaction-red-selected); } }
.hotspot-tooltip { position: fixed; z-index: 100; max-width: min(280px, calc(100vw - 28px)); padding: 9px 11px; border: 1px solid var(--interaction-red); border-radius: 7px; color: white; background: rgb(29 42 48 / 96%); box-shadow: 0 5px 18px rgb(0 0 0 / 20%); pointer-events: none; font-size: .82rem; line-height: 1.25; }
.hotspot-tooltip[hidden] { display: none; }
.hotspot-tooltip small { display: block; margin-bottom: 5px; color: #e8b7b2; }
.hotspot-tooltip > span { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 7px; }

/* Tema globale: i rossi funzionali di hotspot e selezioni restano invariati. */
:root[data-theme="dark"] {
    color-scheme: dark;
    --ink: #e8eef0;
    --muted: #aebbc0;
    --line: #40525a;
    --paper: #1c2b31;
    --accent: #f47a4d;
    --accent-dark: #ff9a74;
    --wash: #101a1f;
}
:root[data-theme="dark"] .build-version { color: #cbd6da; background: #091116; }
:root[data-theme="dark"] .site-header,
:root[data-theme="dark"] .navigation-groups,
:root[data-theme="dark"] .nav-panel { background: #0e2028; }
:root[data-theme="dark"] :is(.form-card, .message-box, .message, .preview-table, .global-search, .view-navigation, .search-result, .editor-position, .viewport-toolbar button, .small-button, .secondary-button, .danger-button, .cart-table, .quantity-controls button, .request-summary, .agent-content-card, .news-card, .empty-card, .success-card, .workflow-mobile, .workflow-steps li, .workflow-section, .page-choice, .verification-card, .danger-confirm, .detection-metrics div, .detection-image, .proposal-list, .analysis-page, .structure-proposal, .prominent-search, .development-status-card, dialog) { color: var(--ink); background: var(--paper); }
:root[data-theme="dark"] :is(input, textarea, select) { color: var(--ink); background-color: #142329; border-color: #53666e; }
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder { color: #93a4aa; }
:root[data-theme="dark"] th { background: #24353c; }
:root[data-theme="dark"] .status-badge { background: #304047; }
:root[data-theme="dark"] .status-badge.published,
:root[data-theme="dark"] .development-current strong[data-status-code="COMPLETED"],
:root[data-theme="dark"] .development-current strong[data-status-code="SUCCESS"] { color: #8dd6a6; background: #173e28; }
:root[data-theme="dark"] .development-current strong { color: #8ed2dc; background: #173941; }
:root[data-theme="dark"] .development-current strong[data-status-code="FAILED"] { color: #ffaaa3; background: #4b211e; }
:root[data-theme="dark"] .development-current strong[data-status-code="INVALID"],
:root[data-theme="dark"] .development-outcome strong[data-outcome="FAILED"],
:root[data-theme="dark"] .development-outcome strong[data-outcome="INVALID"] { color: #ffaaa3; background: #4b211e; }
:root[data-theme="dark"] .development-outcome strong[data-outcome="SUCCESS"] { color: #8dd6a6; background: #173e28; }
:root[data-theme="dark"] .development-drive-badge { color: #8dd6a6; background: #173e28; }
:root[data-theme="dark"] .development-drive-badge[data-drive-code="rate-limited"] { color: #ffd27a; background: #463719; }
:root[data-theme="dark"] .development-drive-badge[data-drive-code="degraded"] { color: #ffaaa3; background: #4b211e; }
:root[data-theme="dark"] .development-drive-badge[data-drive-code="unknown"] { color: var(--muted); background: #26383f; }
:root[data-theme="dark"] .development-return-badge { color: #8dd6a6; background: #173e28; }
:root[data-theme="dark"] .development-return-badge[data-return-state="STALE"], :root[data-theme="dark"] .development-return-badge[data-return-state="ERROR"] { color: #ffaaa3; background: #4b211e; }
:root[data-theme="dark"] .development-return-badge[data-return-state="NOT_CONFIGURED"], :root[data-theme="dark"] .development-return-badge[data-return-state="READY"] { color: var(--muted); background: #26383f; }
:root[data-theme="dark"] :is(.message-box.error, .message.error, .editor-notice.error) { color: #ffb3ad; background: #43201e; }
:root[data-theme="dark"] .message-box.success { background: #173824; }
:root[data-theme="dark"] .request-success-message { color: #b9efca; background: #173824; }
:root[data-theme="dark"] .message-box.warning { background: #403318; }
:root[data-theme="dark"] .notification-row { border-color: var(--line); background: var(--paper); }
:root[data-theme="dark"] .notification-message.notification-error { color: #ffb3ad; background: #43201e; }
:root[data-theme="dark"] .notification-message.notification-warning { color: #ffd27a; background: #403318; }
:root[data-theme="dark"] .notification-message.notification-success { color: #b9efca; background: #173824; }
:root[data-theme="dark"] .notification-message.notification-info { color: #a9dcff; background: #17344a; }
:root[data-theme="dark"] :is(.ccr-status-tile.is-draft, .ccr-status-tile.is-published) { background: var(--paper); }
:root[data-theme="dark"] .editor-notice { background: #173941; }
:root[data-theme="dark"] :is(.editor-position:hover, .editor-position.selected, .editor-position.missing.selected, .page-choice:has(input:checked), .prominent-search) { background: #173941; }
:root[data-theme="dark"] .desktop-manu-ai-home { background: #2c223d; border-color: #9474ba; }
:root[data-theme="dark"] .desktop-manu-ai-home label { color: #dac5f2; }
:root[data-theme="dark"] .editor-position.missing { background: #3b2922; }
:root[data-theme="dark"] .editor-position.manually-validated { background: #302943; }
:root[data-theme="dark"] .editor-position.manually-validated .state-label { color: #211a31; background: #bda8eb; }
:root[data-theme="dark"] .editor-position.manually-validated .position-copy small { color: #d9cef5; }
:root[data-theme="dark"] .editor-layout[data-bom-preview="true"] .editor-position.bom-associated { color: #c8f1d6; background: #173e28; border-left-color: #70d49a; }
:root[data-theme="dark"] .editor-layout[data-bom-preview="true"] .editor-position.bom-associated .state-label { color: #10251a; background: #70d49a; }
:root[data-theme="dark"] .editor-layout[data-bom-preview="true"] .editor-position.bom-missing { color: #ffe0ae; background: #4a3018; border-left-color: #f0a34d; }
:root[data-theme="dark"] .editor-layout[data-bom-preview="true"] .editor-position.bom-missing .state-label { color: #291807; background: #f0a34d; }
:root[data-theme="dark"] :is(.drawing-viewport, .progress) { background: #293a41; }
:root[data-theme="dark"] :is(.viewport-toolbar, th) { background-color: #24353c; }
:root[data-theme="dark"] :is(.pdf-thumbnail, .thumbnail-button) { background: #26363d; }
:root[data-theme="dark"] .problem-row { background: #43201e; }

@media (max-width: 480px) {
    .hotspot-editor-page { height: auto; min-height: 100dvh; display: block; overflow: auto; }
    .hotspot-editor-page main { height: auto; min-height: 0; padding-bottom: 210px; overflow: visible; }
    :root[data-theme="dark"] tbody tr,
    :root[data-theme="dark"] .mobile-view-tabs,
    :root[data-theme="dark"] .mobile-editor-tabs { background: var(--paper); }
}

@media (max-width: 1100px) {
    .ccr-tile-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .editor-layout { grid-template-columns: 90px minmax(0, 1fr); }
    .position-panel { grid-column: 1 / -1; }
    .position-panel, .activity-panel { position: static; }
    .position-list { max-height: 300px; }
    .activity-list { max-height: 260px; }
    .site-header .site-tagline { display: none; }
    .site-header { padding-right: 2vw; padding-left: 2vw; gap: 8px; }
    .site-header .brand { margin-right: auto; }
    .navigation-groups { gap: 1px; }
    .nav-dropdown > summary { padding-right: 7px; padding-left: 7px; }
    .workflow-steps { grid-template-columns: repeat(2, 1fr); }
    .workflow-section, .inline-upload { align-items: stretch; flex-direction: column; }
    .plate-card { grid-template-columns: 1fr; }
    .detection-metrics { grid-template-columns: repeat(2, 1fr); }
    .detection-layout { grid-template-columns: 1fr; }
    .structure-proposal dl { grid-template-columns: repeat(2, 1fr); }
    .search-result dl { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
}

@media (max-width: 700px) {
    .ccr-tile-grid { padding: 6px 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ccr-navigation-tile, .ccr-activity-tile { grid-column: 1 / -1; }
    .ccr-tile { min-height: 54px; }
    .ccr-tile-navigation { flex-wrap: wrap; }
    .public-catalog-summary { grid-template-columns: minmax(0, 1fr) auto; }
    .public-catalog-search { grid-column: 1 / -1; }
    .site-header { padding: 5px 12px; }
    .site-header .brand { margin-right: auto; }
    .history-navigation { min-height: 48px; padding: 4px 12px; }
    .history-back, .history-forward { min-height: 40px; padding: 7px 10px; font-size: .86rem; }
    .site-navigation { position: relative; order: 4; }
    .site-navigation > summary { min-height: 40px; padding: 8px 10px; display: grid; grid-auto-flow: column; place-items: center; gap: 3px; border: 1px solid #60727a; }
    .navigation-groups { position: absolute; z-index: 70; top: calc(100% + 6px); right: 0; width: min(320px, calc(100vw - 24px)); max-height: calc(100vh - 88px); padding: 7px; display: grid; align-items: stretch; gap: 3px; overflow-y: auto; border: 1px solid #60727a; border-radius: 9px; background: #15272f; box-shadow: 0 12px 32px rgb(0 0 0 / 32%); }
    .nav-dropdown > summary { min-height: 44px; padding: 11px; display: flex; align-items: center; justify-content: space-between; }
    .nav-panel, .nav-dropdown:nth-last-child(-n+2) .nav-panel { position: static; width: auto; min-width: 0; max-width: none; margin: 2px 5px 7px; padding: 3px; border: 0; border-left: 2px solid #60727a; border-radius: 0; background: transparent; box-shadow: none; }
    .nav-panel a { min-height: 44px; }
    .viewport-preview-toggle { order: 2; }
    .theme-toggle { order: 3; }
}

@media (min-width: 769px) {
    .public-catalog-page { height: 100dvh; display: flex; flex-direction: column; overflow: hidden; }
    .public-catalog-page > :not(main) { flex: 0 0 auto; }
    .public-catalog-page main { min-height: 0; flex: 1 1 auto; padding-top: 8px; padding-bottom: 12px; display: flex; flex-direction: column; overflow: hidden; }
    .public-catalog-page .public-viewer-layout, .public-catalog-page .catalog-layout { min-height: 0; flex: 1 1 auto; overflow: hidden; }
    .thumbnail-splitter { display: block; }
}

/* Smartphone: stessa interfaccia MANU, ricomposta per viewport 375–480 px. */
@media (max-width: 480px) {
    :root { --site-header-height: 48px; }
    .panel-ratio-control, .catalog-splitter { display: none; }
    html { overflow-x: hidden; font-size: 16px; }
    body { min-width: 0; overflow-x: hidden; }
    img, object, iframe, video { max-width: 100%; }
    .build-version { min-height: 20px; padding: 2px 12px; justify-content: center; font-size: .68rem; }
    .site-header { min-height: 48px; padding: 5px 10px; flex-wrap: nowrap; gap: 8px; }
    .site-header .brand { margin-right: auto; font-size: 1.18rem; }
    .notification-row { min-height: 42px; padding: 5px 12px; gap: 8px; }
    .notification-title { font-size: .72rem; }
    .notification-message { font-size: .88rem; }
    .theme-toggle { width: 38px; height: 38px; flex-basis: 38px; }
    .theme-toggle span { display: block; flex: none; }
    .viewport-preview-toggle { width: 38px; height: 38px; flex-basis: 38px; }
    main { width: 100%; padding: 16px 12px 32px; }
    h1 { font-size: 1.65rem; overflow-wrap: anywhere; }
    h2 { font-size: 1.25rem; }
    p, li, label, input, textarea, select, button { font-size: 1rem; }
    .breadcrumb { margin: -2px 0 14px; padding-bottom: 7px; overflow-x: auto; white-space: nowrap; font-size: .78rem; scrollbar-width: none; }
    .breadcrumb::-webkit-scrollbar { display: none; }
    .catalog-heading, .home-heading, .heading-actions { align-items: stretch; flex-direction: column; gap: 10px; }
    .catalog-heading { margin-bottom: 16px; }
    .public-catalog-summary.ccr-tile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .public-catalog-title h1 { white-space: normal; }
    .public-catalog-status { justify-self: start; }
    .public-catalog-search { grid-column: auto; }
    .revision { align-self: flex-start; padding: 5px 9px; }
    .catalog-list { margin: 8px auto; }
    .cards { margin-top: 14px; }
    .card, .form-card, .message-box, .workflow-section, .danger-confirm { width: 100%; min-width: 0; padding: 14px; }
    .catalog-meta { display: grid; gap: 4px; }
    .codex-fixed-indicator { top: 5px; max-width: calc(100vw - 90px); padding: 4px 9px; font-size: .66rem; }
    body:has(.development-page) { height: 100dvh; overflow: hidden; }
    body:has(.development-page) .build-version { display: none; }
    body:has(.development-page) .history-navigation { display: none; }
    body:has(.development-page) .notification-row:has(.notification-empty) { display: none; }
    body:has(.development-page) main { height: calc(100dvh - var(--site-header-height)); padding-top: 8px; padding-bottom: 8px; overflow: hidden; }
    .development-page { min-width: 0; height: 100%; overflow-y: auto; display: grid; grid-template-rows: auto auto auto; }
    .development-heading { align-items: center; flex-direction: row; gap: 8px; }
    .development-heading .eyebrow { display: none; }
    .development-heading h1 { font-size: 1.2rem; }
    .development-refresh { max-width: 145px; padding: 3px 6px; overflow: hidden; font-size: .65rem; text-overflow: ellipsis; white-space: nowrap; }
    .development-dashboard { min-height: 0; margin-top: 7px; grid-template-columns: 1fr; align-content: start; gap: 7px; }
    .development-overview { grid-column: auto; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
    .development-micro-card { min-height: 42px; padding: 6px 8px; display: grid; align-content: center; gap: 0; }
    .development-micro-card:last-child { grid-column: auto; }
    .development-micro-card span, .development-task-heading span, .development-result-card > div > span, .development-task-card dt, .development-result-card dt { font-size: .62rem; }
    .development-micro-card strong { font-size: .82rem; }
    .development-task-card, .development-result-card { padding: 9px; }
    .development-quota-card { padding: 8px 9px; grid-template-columns: 1fr; gap: 5px; }
    .development-quota-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
    .development-quota-heading span { font-size: .58rem; }
    .development-quota-heading h2 { font-size: .8rem; }
    .development-quota-card [data-field="codex_usage"] { gap: 7px; }
    .codex-usage-window > div:first-child { display: grid; gap: 0; font-size: .62rem; }
    .codex-usage-window small, .codex-usage-updated, .codex-usage-unavailable { font-size: .58rem; }
    .development-task-heading h2 { font-size: .92rem; }
    .development-task-heading { align-items: start; flex-wrap: wrap; }
    .development-task-heading > div { min-width: 0; flex: 1 1 100%; }
    .development-phase { margin-left: auto; }
    .development-phase { padding: 3px 6px; font-size: .61rem; }
    .development-task-details { margin-top: 7px; grid-template-columns: minmax(0, 1.5fr) repeat(2, minmax(0, 1fr)); gap: 5px; }
    .development-task-details > div { padding: 5px 6px; }
    .development-task-card dd, .development-result-card dd { font-size: .7rem; }
    .development-task-id dd { max-width: 100%; }
    .development-task-description { grid-column: 1 / -1; min-height: 2.4em; margin-top: 6px; padding: 5px 6px; border-radius: 7px; background: var(--wash); font-size: .7rem; line-height: 1.35; overflow: visible; text-overflow: clip; white-space: normal; overflow-wrap: anywhere; }
    .development-activities { display: flex; flex-wrap: wrap; gap: 4px; }
    .development-activities span { max-width: 100%; overflow-wrap: anywhere; }
    .development-progress { margin-top: 7px; }
    .development-progress small { font-size: .55rem; }
    .development-result-card { grid-template-columns: minmax(0, .8fr) minmax(0, 2fr); align-items: start; gap: 7px; }
    .development-result-card h2 { font-size: .75rem; }
    .development-result-card dl { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
    .development-result-card dl > div { padding: 5px; }
    .form-actions { align-items: stretch; flex-direction: column; }
    .form-actions > *, .form-actions form, .form-actions button, .form-actions .button-link,
    .heading-actions > *, .home-heading > .button-link { width: 100%; text-align: center; }
    .primary-button, .secondary-button, .danger-button, .create-button, .small-button, .button-link { min-height: 44px; }
    .global-search, .prominent-search, .catalog-search { width: 100%; margin: 16px 0; padding: 13px; }
    .desktop-home-searches { width: 100%; margin: 16px 0; gap: 10px; }
    .desktop-manu-ai-home { padding: 13px; }
    .desktop-manu-ai-home div { align-items: stretch; flex-direction: column; }
    .desktop-manu-ai-home input, .desktop-manu-ai-home button { width: 100%; min-height: 46px; }
    .global-search div { align-items: stretch; flex-direction: column; }
    .global-search input, .global-search button { width: 100%; min-height: 46px; }
    .public-viewer-layout { display: flex; flex-direction: column; gap: 8px; }
    .public-filmstrip { max-height: 118px; order: 0; }
    .public-filmstrip .filmstrip-thumbnail { width: 78px; }
    .public-filmstrip .filmstrip-thumbnail img { height: 70px; }
    .public-viewer-workspace { order: 1; }
    .public-viewer-bar { align-items: stretch; flex-direction: column; }
    .catalog-layout { display: flex; flex-direction: column; gap: 12px; }
    .drawing-panel { width: calc(100% + 24px); margin-left: -12px; padding: 6px; border-right: 0; border-left: 0; border-radius: 0; }
    .drawing-viewport { min-height: 280px; }
    .viewport-toolbar { padding: 6px; flex-wrap: wrap; justify-content: center; }
    .viewport-toolbar button { min-width: 44px; min-height: 42px; padding: 6px 8px; }
    .hotspot, .editor-hotspot { min-width: 30px; min-height: 30px; }
    .parts-header { padding: 12px; }
    .table-wrap { width: 100%; max-height: none; overflow: visible; }
    table, thead, tbody, tr, th, td { display: block; width: 100%; }
    thead { display: none; }
    tbody tr { margin-bottom: 10px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: white; }
    tbody td { min-width: 0; padding: 6px 4px; border: 0; overflow-wrap: anywhere; }
    tbody td::before { margin-right: 7px; color: var(--muted); font-size: .72rem; font-weight: 800; text-transform: uppercase; }
    .parts-panel tbody td:nth-child(1)::before { content: "Posizione"; }
    .parts-panel tbody td:nth-child(2)::before { content: "Codice"; }
    .parts-panel tbody td:nth-child(3)::before { content: "Descrizione"; }
    .parts-panel tbody td:nth-child(4)::before { content: "Qtà"; }
    .parts-panel tbody td:last-child form, .parts-panel tbody td:last-child button { width: 100%; }
    .cart-table { border: 0; background: transparent; }
    .cart-table tbody td:nth-child(1)::before { content: "Catalogo / rev."; }
    .cart-table tbody td:nth-child(2)::before { content: "Tavola"; }
    .cart-table tbody td:nth-child(3)::before { content: "Posizione"; }
    .cart-table tbody td:nth-child(4)::before { content: "Codice"; }
    .cart-table tbody td:nth-child(5)::before { content: "Descrizione"; }
    .cart-table tbody td:nth-child(6)::before { content: "Qtà distinta"; }
    .cart-table tbody td:nth-child(7)::before { content: "Quantità richiesta"; }
    .cart-table tbody td:nth-child(8)::before { content: "Nota riga"; }
    .cart-table .quantity-input, .cart-table button { width: 100%; min-height: 44px; }
    .quantity-controls button { width: 48px; }
    .line-note, .request-summary, .request-filters > *, .status-form, .status-form > * { width: 100%; }
    .maintenance-grid { grid-template-columns: 1fr; }
    .agent-content-card, .news-card { padding: 15px; }
    .development-changelog-heading { align-items: flex-start; flex-direction: column; gap: 4px; }
    .news-card header { display: grid; grid-template-columns: 1fr; gap: 4px; }
    .news-card header > span { min-width: 0; overflow-wrap: anywhere; }
    .news-archive { grid-template-columns: 1fr; }
    .preview-table { border: 0; background: transparent; }
    .preview-table tbody tr { overflow: hidden; }
    .preview-table input { min-width: 0; width: 100%; min-height: 42px; }
    .workflow-mobile { margin-bottom: 14px; border: 1px solid var(--line); border-radius: 8px; background: white; }
    .workflow-mobile > summary { min-height: 52px; padding: 8px 12px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; }
    .workflow-mobile > summary span { color: var(--muted); font-size: .8rem; }
    .workflow-mobile > summary strong { color: #126b78; }
    .workflow-steps { margin: 0; padding: 6px; display: grid; grid-template-columns: 1fr; gap: 3px; overflow: visible; }
    .workflow-steps li { min-width: 0; padding: 8px; }
    .workflow-section { margin-bottom: 12px; gap: 12px; }
    .inline-upload, .inline-upload p { width: 100%; }
    .inline-upload input { width: 100%; max-width: 100%; }
    .plate-card { padding: 12px; gap: 10px; }
    .page-selector, .analysis-pages { grid-template-columns: minmax(0, 1fr); }
    .page-choice { padding: 10px; }
    .thumbnail-button, .thumbnail-button img, .bom-page img { min-height: 0; height: 150px; }
    #page-preview { width: calc(100vw - 16px); max-width: none; max-height: calc(100dvh - 16px); padding: 8px; }
    #page-preview img { max-height: calc(100dvh - 70px); }
    .analysis-page { padding: 9px; gap: 7px; }
    .analysis-thumbnail-image { width: 100%; height: auto; }
    .structure-proposal { padding: 12px; }
    .structure-proposal dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .detection-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .detection-metrics div { padding: 9px; }
    .detection-layout { gap: 10px; }
    .proposal-list { max-height: 260px; }
    .proposal-marker span { width: 38px; height: 38px; }
    .editor-heading { margin-bottom: 10px; }
    .editor-notice { top: var(--site-header-height); margin-bottom: 8px; padding: 8px 10px; font-size: .85rem; }
    .editor-layout { display: flex; flex-direction: column; gap: 10px; }
    .page-filmstrip { max-height: 132px; flex-direction: row; overflow-x: auto; overflow-y: hidden; }
    .filmstrip-thumbnail { width: 82px; }
    .filmstrip-thumbnail img { height: 82px; }
    .unified-hotspot-command-bar { grid-template-columns: 1fr; max-height: 46dvh; overflow-y: auto; }
    .command-status, .command-advance { justify-content: center; }
    .command-advance .prominent-action { width: 100%; }
    .editor-drawing-panel { order: 1; width: calc(100% + 24px); margin-left: -12px; border-right: 0; border-left: 0; border-radius: 0; }
    .position-panel { order: 2; width: 100%; }
    .activity-panel { order: 3; width: 100%; }
    .position-panel, .activity-panel { position: static; }
    .position-list { max-height: 260px; }
    .editor-position { min-height: 54px; padding: 9px 10px; }
    .editor-toolbar { min-height: 0; padding: 8px; align-items: stretch; flex-direction: column; gap: 7px; }
    .editor-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
    .editor-actions button { width: 100%; min-height: 42px; padding: 6px; font-size: .78rem; line-height: 1.15; }
    .editor-canvas { min-width: 100%; }
    .activity-list { min-height: 100px; max-height: 180px; }
    .pdf-view { min-height: 65dvh; }
    .search-result { padding: 14px; }
    .search-result dl { grid-template-columns: minmax(0, 1fr); }
    .danger-confirm dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    dialog { max-width: calc(100vw - 16px); max-height: calc(100dvh - 16px); }
    .mobile-view-tabs, .mobile-editor-tabs { position: sticky; top: var(--site-header-height); z-index: 15; margin: 8px 0; padding: 4px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; border: 1px solid var(--line); border-radius: 9px; background: white; }
    .mobile-view-tabs button, .mobile-editor-tabs button { min-height: 44px; border: 0; border-radius: 6px; background: var(--wash); font-weight: 800; }
    .mobile-view-tabs button.active, .mobile-editor-tabs button.active { color: white; background: #126b78; }
    .catalog-layout[data-mobile-view="drawing"] .parts-panel { display: none; }
    .catalog-layout[data-mobile-view="parts"] .drawing-panel { display: none; }
    .editor-layout[data-mobile-view="drawing"] .position-panel, .editor-layout[data-mobile-view="drawing"] .activity-panel { display: none; }
    .editor-layout[data-mobile-view="positions"] .editor-drawing-panel, .editor-layout[data-mobile-view="positions"] .activity-panel { display: none; }
    .plate-card > div:first-child strong { font-size: 1.15rem; }
    .plate-card > div:nth-child(2) { grid-template-columns: 1fr 1fr; gap: 3px 8px; }
    .detection-actions { position: sticky; bottom: 0; z-index: 10; padding: 8px; background: rgb(243 246 247 / 96%); }
}

@media (min-width: 481px) and (max-width: 768px) {
    .hotspot-editor-page { height: auto; min-height: 100dvh; display: block; overflow: auto; }
    .hotspot-editor-page main { height: auto; min-height: 0; padding-bottom: 190px; overflow: visible; }
    main { padding: 22px 20px 40px; }
    .public-viewer-layout { display: flex; flex-direction: column; gap: 8px; }
    .public-filmstrip { max-height: 132px; flex-direction: row; overflow-x: auto; overflow-y: hidden; }
    .public-filmstrip .filmstrip-thumbnail { width: 82px; }
    .public-filmstrip .filmstrip-thumbnail img { height: 82px; }
    .editor-layout, .detection-layout { grid-template-columns: 1fr; }
    .unified-hotspot-command-bar { grid-template-columns: 1fr; }
    .command-status, .command-advance { justify-content: center; }
    .plate-card { grid-template-columns: 1fr; }
    .page-selector, .analysis-pages { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .form-actions { flex-wrap: wrap; }
}

@media (min-width: 481px) and (max-width: 600px) {
    .catalog-layout { grid-template-columns: 1fr; }
    .panel-ratio-control, .catalog-splitter { display: none; }
}

/* Controllo qualità revisione */
.quality-summary, .quality-inline { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 20px 0; padding: 20px; border: 2px solid var(--line); border-radius: 12px; background: var(--paper); }
.quality-summary dl { display: grid; grid-template-columns: repeat(4, minmax(110px, 1fr)); gap: 12px; margin: 0; }
.quality-summary dl div { padding: 10px; border-radius: 8px; background: var(--wash); }
.quality-summary dt, .quality-overall span { display: block; color: var(--muted); font-size: .78rem; font-weight: 800; text-transform: uppercase; }
.quality-summary dd { margin: 4px 0 0; font-size: 1.25rem; font-weight: 900; }
.quality-overall strong { display: block; font-size: 1.7rem; }
.quality-overall b { color: #a32626; }
.quality-status-errori { border-color: #c83b3b; }
.quality-status-attenzione { border-color: #b47b00; }
.quality-status-ok { border-color: #26865b; }
.quality-note { color: var(--muted); }
.quality-results { display: grid; gap: 12px; }
.quality-results > h2 { margin-bottom: 0; }
.quality-issue { padding: 18px; border: 1px solid var(--line); border-left: 5px solid #b47b00; border-radius: 10px; background: var(--paper); }
.quality-issue.severity-error { border-left-color: #c83b3b; }
.quality-issue h3 { margin: 8px 0 4px; }
.quality-issue p { margin: 4px 0 12px; }
.quality-issue-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.quality-severity { padding: 3px 7px; border-radius: 999px; color: white; background: #8b6000; font-size: .75rem; font-weight: 900; }
.severity-error .quality-severity { background: #a32626; }
.quality-context { font-weight: 800; }
.quality-passed { margin-top: 24px; padding: 16px; border: 1px solid var(--line); border-radius: 10px; }
.quality-passed summary { cursor: pointer; font-weight: 900; }
.quality-ok-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.quality-ok-grid article { display: grid; gap: 5px; padding: 12px; border-radius: 8px; background: var(--wash); }
.quality-ok-grid article span { color: #267153; font-size: .75rem; font-weight: 900; }
.quality-ok-grid article p { margin: 0; }

@media (max-width: 600px) {
    .quality-summary, .quality-inline { align-items: stretch; flex-direction: column; }
    .quality-summary dl, .quality-ok-grid { grid-template-columns: 1fr 1fr; }
    .quality-summary .button-link, .quality-inline .button-link { width: 100%; text-align: center; }
    .publish-state { align-items: stretch; flex-direction: column; }
    .publish-actions { align-items: stretch; flex-direction: column; }
    .publish-actions :is(.button-link, form, button) { width: 100%; text-align: center; }
}

@media (max-width: 390px) {
    .quality-summary dl, .quality-ok-grid { grid-template-columns: 1fr; }
}
.language-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0; }
.language-tab.active { border-color:var(--accent); background:var(--accent); color:white; }
.language-description { min-width:18rem; width:100%; }
.creator-bom-group textarea { display:block; width:min(100%, 34rem); margin-top:6px; }
.creator-bom-group { display:block; padding:14px; }
.creator-bom-context { display:grid; justify-items:start; gap:8px; margin-bottom:12px; }
.creator-bom-notes { display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px; }
.creator-bom-notes span { color:var(--muted); font-size:.88rem; }
.creator-bom-context label { width:min(100%, 34rem); font-size:.88rem; font-weight:700; }
.creator-bom-context textarea { min-height:2.6rem; padding:5px 7px; font:inherit; font-weight:400; }
.creator-bom-table th,.creator-bom-table td { padding:4px 5px; }
.creator-bom-table input:not([type="checkbox"]) { min-height:30px; padding:3px 5px; font-size:.86rem; }
.creator-bom-table th:nth-child(1) { width:5rem; }
.creator-bom-table th:nth-child(2) { width:5.5rem; }
.creator-bom-table th:nth-child(3) { width:9rem; }
.creator-bom-table th:nth-child(4) { width:4.5rem; }
.creator-bom-table th:nth-child(5) { width:45%; }
.creator-bom-table th:nth-child(6) { width:9rem; }
@media (max-width: 760px) { .creator-bom-review-actions strong { order:2; width:100%; } }
@media (max-width: 700px) {
    .ccr-heading-row { align-items: stretch; flex-direction: column; }
    .ccr-title-group { min-width: 0; }
    .analysis-workflow-status { width: 100%; max-width: none; }
    .ccr-meta, .ccr-legend { justify-content: flex-start; }
    .ccr-meta > span { white-space: normal; }
}
@media (max-width: 390px) {
    .ccr-header { padding: 7px 9px; }
    .ccr-meta { gap: 4px; }
    .ccr-meta > span { font-size: .72rem; }
}

/* Customer Home is enabled by smartphone.css only in Smartphone mode. */
.smartphone-home, .smartphone-navigation { display: none; }

/* MANU AI is also a usable desktop destination, not just a Smartphone home. */
.smartphone-home.manu-ai-page { display: block; }

.smartphone-cart { display: none; }

/* Development status: a single, calm reading flow on every viewport. */
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.development-heading-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.development-refresh { white-space: normal; }
.development-refresh b { color: var(--ink); font-weight: 700; }
.development-refresh-button { min-height: 38px; padding: 7px 11px; white-space: nowrap; }
.development-dashboard { grid-template-columns: minmax(0, 1fr); max-width: 1120px; margin-right: auto; margin-left: auto; }
.development-overview { gap: 12px; }
.development-micro-card { display: block; padding: 14px 16px; }
.development-micro-card > div { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.development-micro-card p { margin: 4px 0 0; color: var(--muted); font-size: .78rem; line-height: 1.3; }
.development-micro-card strong { color: var(--ink); }
.development-task-card, .development-result-card, .development-quota-card { grid-column: 1 / -1; }
.development-task-heading { align-items: flex-start; }
.development-task-badges { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 7px; }
.development-channel-badge { padding: 4px 9px; border-radius: 999px; color: #0b5963; background: #dff2f3; font-size: .7rem; letter-spacing: .05em; }
.development-task-description { min-height: 0; margin: 12px 0 0; padding: 10px 12px; overflow: visible; border: 1px solid var(--line); border-radius: 8px; background: var(--wash); white-space: normal; }
.development-task-description > span { display: block; margin-bottom: 3px; color: var(--muted); font-size: .7rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.development-task-description p { margin: 0; overflow-wrap: anywhere; color: var(--ink); font-size: .9rem; line-height: 1.4; }
.development-progress { padding-top: 8px; }
.development-progress small { overflow: visible; text-align: center; white-space: normal; }
.development-changelog { max-width: 1120px; margin-right: auto; margin-left: auto; padding: 24px 0 0; border-top: 2px solid var(--line); }
.development-changelog-heading { align-items: end; }
.development-changelog-heading small { padding: 5px 9px; border-radius: 999px; background: var(--wash); }
.development-empty-state { max-width: none; margin-top: 14px; padding: 28px; text-align: center; }
.development-empty-state strong { display: block; font-size: 1.05rem; }
.development-empty-state p { margin: 5px 0 0; color: var(--muted); }
.development-changelog-table-wrap { overflow-x: auto; margin-top: 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); }
.development-changelog-table { width: 100%; border-collapse: collapse; font-size: .82rem; }
.development-changelog-table th, .development-changelog-table td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
.development-changelog-table th { color: var(--muted); background: var(--wash); font-size: .7rem; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.development-changelog-table tr:last-child td { border-bottom: 0; }
.development-changelog-table td:first-child, .development-changelog-table td:nth-child(2), .development-changelog-table td:nth-child(3), .development-changelog-table td:last-child { white-space: nowrap; }
.development-status-badge { display: inline-block; padding: 3px 7px; border-radius: 999px; color: #14552b; background: #dff4e5; font-size: .68rem; font-weight: 900; letter-spacing: .04em; }
.development-status-badge.status-failed, .development-status-badge.status-aborted { color: #7b211c; background: #fde2df; }
:root[data-theme="dark"] .development-status-badge { color: #b9f0c6; background: #173d25; }
:root[data-theme="dark"] .development-status-badge.status-failed, :root[data-theme="dark"] .development-status-badge.status-aborted { color: #ffc2bc; background: #4a211e; }
.news-archive { grid-template-columns: 1fr; gap: 10px; }
.news-card { padding: 14px 16px; }
.news-card ul { margin-bottom: 0; }
:root[data-theme="dark"] .development-channel-badge { color: #b5e7e8; background: #173941; }
:root[data-theme="dark"] .development-refresh b { color: var(--ink); }

@media (max-width: 700px) {
    .development-heading-actions { min-width: 0; flex: 1; align-items: flex-end; flex-direction: column; gap: 5px; }
    .development-refresh { max-width: 100%; padding: 0; border: 0; background: transparent; font-size: .67rem; text-align: right; }
    .development-refresh-button { min-height: 36px; padding: 6px 10px; }
    .development-refresh-button span { display: inline; }
    .development-overview { gap: 6px; }
    .development-micro-card { padding: 9px 8px; }
    .development-micro-card > div { display: grid; gap: 1px; }
    .development-micro-card p { margin-top: 3px; font-size: .65rem; }
    .development-micro-card strong { font-size: .8rem; }
    .development-task-badges { width: 100%; justify-content: flex-start; }
    .development-task-description { margin-top: 8px; padding: 8px 9px; }
    .development-task-description p { font-size: .78rem; }
    .development-progress { gap: 0; }
    .development-progress small { min-height: 2.4em; font-size: .63rem; }
    .development-changelog { padding-top: 18px; }
}

/* === Desktop Home A: Smart-led dashboard (UI only) === */
.sr-only {
    position:absolute !important; width:1px !important; height:1px !important;
    padding:0 !important; margin:-1px !important; overflow:hidden !important;
    clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important;
}
.desktop-home-dashboard { display:none; }

@media (min-width: 601px) {
    body:has(.desktop-home-dashboard) {
        min-height:100dvh;
        background:#f4f7f8;
    }
    body:has(.desktop-home-dashboard) .build-version,
    body:has(.desktop-home-dashboard) .history-navigation,
    body:has(.desktop-home-dashboard) .notification-row,
    body:has(.desktop-home-dashboard) .site-header .global-task-indicator,
    body:has(.desktop-home-dashboard) .site-header .site-tagline,
    body:has(.desktop-home-dashboard) .site-header .performance-toggle,
    body:has(.desktop-home-dashboard) .site-header .header-cart,
    body:has(.desktop-home-dashboard) .site-header .viewport-preview-toggle,
    body:has(.desktop-home-dashboard) .site-header .site-navigation,
    body:has(.desktop-home-dashboard) > .smartphone-navigation {
        display:none !important;
    }
    body:has(.desktop-home-dashboard) .site-header {
        position:sticky;
        top:0;
        z-index:50;
        min-height:72px;
        padding:0 34px;
        color:#1d2a30;
        background:#fff;
        border-bottom:1px solid #e0e7e9;
        box-shadow:0 2px 10px rgb(22 40 48 / 5%);
    }
    body:has(.desktop-home-dashboard) .site-header .brand {
        margin-right:auto;
        color:#18262d;
        font-size:1.55rem;
        letter-spacing:.12em;
    }
    body:has(.desktop-home-dashboard) .site-header .theme-toggle {
        width:42px; height:42px; flex-basis:42px;
        color:#5d6d74;
        background:#f6f8f9;
        border:1px solid #d9e1e4;
        border-radius:11px;
    }
    body:has(.desktop-home-dashboard) .site-header .theme-toggle:hover {
        color:#e85d2a;
        background:#fff4ef;
    }
    body:has(.desktop-home-dashboard) main {
        width:100%;
        max-width:none;
        padding:0;
    }
    body:has(.desktop-home-dashboard) .smartphone-home:not(.manu-ai-page) {
        display:none !important;
    }

    .desktop-home-dashboard {
        min-height:calc(100dvh - 72px);
        display:grid;
        grid-template-columns:220px minmax(0, 1fr);
        background:#f4f7f8;
    }
    .desktop-home-sidebar {
        padding:34px 20px;
        background:#fff;
        border-right:1px solid #e0e7e9;
    }
    .desktop-home-sidebar-label {
        margin:0 12px 16px;
        color:#9aa7ac;
        font-size:.7rem;
        font-weight:800;
        letter-spacing:.14em;
        text-transform:uppercase;
    }
    .desktop-home-sidebar nav {
        display:grid;
        gap:8px;
    }
    .desktop-home-sidebar a {
        position:relative;
        min-height:52px;
        padding:0 13px;
        display:flex;
        align-items:center;
        gap:12px;
        border-radius:12px;
        color:#6b7b81;
        font-size:.92rem;
        font-weight:700;
        text-decoration:none;
    }
    .desktop-home-sidebar a:hover {
        color:#d85527;
        background:#fff6f1;
    }
    .desktop-home-sidebar a.is-current {
        color:#d85527;
        background:#fff0e9;
    }
    .desktop-home-sidebar .smartphone-icon {
        width:25px;
        height:25px;
        flex:0 0 25px;
    }
    .desktop-home-badge {
        min-width:22px;
        height:22px;
        margin-left:auto;
        padding:0 6px;
        display:grid;
        place-items:center;
        border-radius:999px;
        color:#fff;
        background:#ef7448;
        font-size:.72rem;
        line-height:1;
    }

    .desktop-home-content {
        width:min(1120px, calc(100% - 64px));
        margin:0 auto;
        padding:52px 0 64px;
    }
    .desktop-home-welcome {
        margin-bottom:28px;
    }
    .desktop-home-welcome .eyebrow {
        margin:0 0 7px;
        color:#e66d43;
        font-size:.72rem;
        letter-spacing:.12em;
    }
    .desktop-home-welcome h1 {
        margin:0;
        color:#1b252a;
        font-size:clamp(2rem, 3vw, 3rem);
        letter-spacing:-.035em;
    }
    .desktop-home-welcome > p:last-child {
        margin:8px 0 0;
        color:#849299;
        font-size:1rem;
    }

    .desktop-home-tiles {
        display:grid;
        grid-template-columns:repeat(3, minmax(0, 1fr));
        gap:18px;
    }
    .desktop-home-tile {
        position:relative;
        min-width:0;
        min-height:190px;
        padding:24px;
        display:flex;
        flex-direction:column;
        justify-content:space-between;
        gap:24px;
        overflow:hidden;
        border:1px solid #e0e6e8;
        border-radius:22px;
        color:#1e292e;
        background:#fff;
        box-shadow:0 9px 26px rgb(31 51 60 / 6%);
        text-decoration:none;
        transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
    }
    .desktop-home-tile:hover {
        transform:translateY(-2px);
        border-color:#f1b49e;
        box-shadow:0 14px 34px rgb(31 51 60 / 10%);
    }
    .desktop-home-tile::after {
        position:absolute;
        right:22px;
        bottom:20px;
        color:#aab5b9;
        content:"›";
        font-size:1.8rem;
        font-weight:500;
        line-height:1;
    }
    .desktop-home-tile-icon {
        width:48px;
        height:48px;
        display:grid;
        place-items:center;
        color:#ee7448;
    }
    .desktop-home-tile-icon .smartphone-icon {
        width:42px;
        height:42px;
    }
    .desktop-home-tile > span:last-of-type,
    .desktop-home-tile > summary > span:last-child {
        min-width:0;
        display:grid;
        gap:4px;
        padding-right:26px;
    }
    .desktop-home-tile strong {
        color:inherit;
        font-size:1.16rem;
        line-height:1.2;
    }
    .desktop-home-tile small {
        color:#8b989d;
        font-size:.82rem;
        font-weight:600;
        line-height:1.4;
    }

    details.desktop-home-tile {
        padding:0;
    }
    details.desktop-home-tile > summary {
        min-height:188px;
        padding:24px;
        display:flex;
        flex-direction:column;
        justify-content:space-between;
        gap:24px;
        list-style:none;
        cursor:pointer;
    }
    details.desktop-home-tile > summary::-webkit-details-marker { display:none; }
    details.desktop-home-tile::after { pointer-events:none; }
    details.desktop-home-tile[open] {
        grid-column:span 2;
        min-height:310px;
    }
    details.desktop-home-tile[open] > summary { min-height:auto; padding-bottom:12px; }
    details.desktop-home-tile[open]::after { display:none; }
    .desktop-home-tile .smartphone-qr-exit {
        position:absolute; top:18px; right:18px; z-index:2;
    }
    .desktop-home-tile .smartphone-qr-panel {
        margin:0 24px 24px;
    }
    .desktop-home-tile .smartphone-qr-video-wrap {
        max-width:360px;
        margin:auto;
    }

    .desktop-home-tile--qr {
        border-color:#ef7448;
        color:#fff;
        background:linear-gradient(145deg, #f07b51, #e9683d);
    }
    .desktop-home-tile--qr .desktop-home-tile-icon,
    .desktop-home-tile--qr small,
    .desktop-home-tile--qr::after { color:#fff; }
    .desktop-home-tile--qr small { opacity:.82; }

    .desktop-home-tile--development {
        border-color:#f0d7cd;
        background:#fff8f4;
    }
    .desktop-home-tile--development .desktop-home-tile-icon {
        color:#d95b30;
    }

    .desktop-home-ai {
        margin-top:24px;
        padding:24px 26px;
        display:grid;
        grid-template-columns:minmax(220px, .8fr) minmax(360px, 1.6fr);
        align-items:center;
        gap:28px;
        border:1px solid #e0e6e8;
        border-radius:22px;
        background:#fff;
        box-shadow:0 9px 26px rgb(31 51 60 / 5%);
    }
    .desktop-home-ai .eyebrow {
        margin-bottom:4px;
        color:#e66d43;
        font-size:.68rem;
    }
    .desktop-home-ai h2 {
        margin:0;
        font-size:1.25rem;
    }
    .desktop-home-ai p:last-child {
        margin:5px 0 0;
        color:#8b989d;
        font-size:.82rem;
    }
    .desktop-home-ai-input {
        min-width:0;
        display:grid;
        grid-template-columns:minmax(0, 1fr) auto;
        gap:10px;
    }
    .desktop-home-ai input {
        width:100%;
        min-width:0;
        min-height:50px;
        padding:0 16px;
        border:1px solid #ccd7da;
        border-radius:14px;
        color:#1e292e;
        background:#fbfcfc;
        font:inherit;
    }
    .desktop-home-ai button {
        min-width:104px;
        min-height:50px;
        padding:0 20px;
        border:0;
        border-radius:14px;
        color:#fff;
        background:#ed7449;
        font:inherit;
        font-weight:800;
        cursor:pointer;
    }
    .desktop-home-ai button:hover { background:#d95b30; }

    /* Development hub: usable on desktop, same content as Smart. */
    .desktop-development-hub.smartphone-home {
        width:min(1120px, calc(100% - 64px));
        margin:0 auto;
        padding:40px 0 64px;
        display:block !important;
    }
    .desktop-development-hub .smartphone-back {
        display:inline-flex;
        margin-bottom:18px;
        color:#65747a;
        font-weight:700;
    }
    .desktop-development-hub > h1 {
        margin-bottom:28px;
        font-size:2.2rem;
    }
    .desktop-development-hub .smartphone-development-groups {
        display:grid;
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:24px;
    }
    .desktop-development-hub .smartphone-development-groups > section,
    .desktop-development-hub .smartphone-development-danger {
        min-width:0;
        padding:22px;
        border:1px solid #e0e6e8;
        border-radius:20px;
        background:#fff;
        box-shadow:0 8px 24px rgb(31 51 60 / 5%);
    }
    .desktop-development-hub .smartphone-development-groups h2,
    .desktop-development-hub .smartphone-development-danger h2 {
        margin-bottom:14px;
        font-size:1rem;
    }
    .desktop-development-hub .smartphone-development-links {
        display:grid;
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:10px;
    }
    .desktop-development-hub .smartphone-development-links a,
    .desktop-development-hub .smartphone-development-links button {
        min-height:58px;
        padding:14px 15px;
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:10px;
        border:1px solid #e0e6e8;
        border-radius:13px;
        color:#202b30;
        background:#fafbfb;
        font:inherit;
        font-weight:750;
        text-align:left;
        text-decoration:none;
        cursor:pointer;
    }
    .desktop-development-hub .smartphone-development-links a:hover,
    .desktop-development-hub .smartphone-development-links button:hover {
        border-color:#f0b39c;
        background:#fff6f1;
    }
    .desktop-development-hub .smartphone-development-links form { margin:0; }
    .desktop-development-hub .smartphone-development-links form > button { width:100%; }
    .desktop-development-hub .smartphone-development-danger { margin-top:24px; border-color:#f0c8c3; }
    .desktop-development-hub .smartphone-development-danger .danger-button {
        color:#a3271f;
        background:#fff4f2;
        border-color:#edc0ba;
    }

    :root[data-theme="dark"] body:has(.desktop-home-dashboard) { background:#101a1f; }
    :root[data-theme="dark"] body:has(.desktop-home-dashboard) .site-header,
    :root[data-theme="dark"] .desktop-home-sidebar,
    :root[data-theme="dark"] .desktop-home-tile,
    :root[data-theme="dark"] .desktop-home-ai,
    :root[data-theme="dark"] .desktop-development-hub .smartphone-development-groups > section,
    :root[data-theme="dark"] .desktop-development-hub .smartphone-development-danger {
        color:var(--ink);
        background:var(--paper);
        border-color:var(--line);
    }
    :root[data-theme="dark"] .desktop-home-welcome h1,
    :root[data-theme="dark"] .desktop-home-tile strong,
    :root[data-theme="dark"] body:has(.desktop-home-dashboard) .site-header .brand {
        color:var(--ink);
    }
    :root[data-theme="dark"] .desktop-home-tile--qr {
        color:#fff;
        background:linear-gradient(145deg, #d96840, #bd4f2c);
        border-color:#d96840;
    }
    :root[data-theme="dark"] .desktop-home-tile--development { background:#2b211d; }
    :root[data-theme="dark"] .desktop-home-sidebar a.is-current { background:#3a2922; color:#ff9a74; }
    :root[data-theme="dark"] .desktop-home-ai input { color:var(--ink); background:#142329; border-color:#53666e; }
    :root[data-theme="dark"] .desktop-development-hub .smartphone-development-links a,
    :root[data-theme="dark"] .desktop-development-hub .smartphone-development-links button {
        color:var(--ink); background:#18272d; border-color:var(--line);
    }
}

@media (min-width: 601px) and (max-width: 980px) {
    .desktop-home-dashboard { grid-template-columns:84px minmax(0,1fr); }
    .desktop-home-sidebar { padding:28px 12px; }
    .desktop-home-sidebar-label,
    .desktop-home-sidebar a span { display:none; }
    .desktop-home-sidebar a { justify-content:center; padding:0; }
    .desktop-home-sidebar .desktop-home-badge { position:absolute; top:4px; right:5px; }
    .desktop-home-content { width:min(100% - 36px, 900px); padding-top:36px; }
    .desktop-home-tiles { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .desktop-home-ai { grid-template-columns:1fr; gap:16px; }
    .desktop-development-hub .smartphone-development-groups { grid-template-columns:1fr; }
}

@media (max-width: 600px) {
    .desktop-home-dashboard { display:none !important; }
    .desktop-development-hub.smartphone-home { width:auto; margin:0; padding:0; }
}

/* === Desktop rendering for Smart-led content routes === */
.customer-surface .shared-card { border:1px solid #e0e6e8; border-radius:20px; background:#fff; box-shadow:0 8px 24px rgb(31 51 60 / 6%); }
.machine-page .machine-search { display:grid; gap:7px; width:min(620px, 100%); margin:0 0 22px; }
.machine-page .machine-search label { color:#3f4d53; font-weight:700; }
.machine-page .machine-search > div { display:flex; gap:8px; min-width:0; }
.machine-page .machine-search input { flex:1; min-width:0; min-height:48px; padding:0 15px; border:1px solid #ccd7da; border-radius:13px; background:#fff; color:#1e292e; font:inherit; }
.machine-page .machine-search button { border-color:#e9774f; border-radius:13px; background:#e9774f; }
.machine-page .machine-row { min-height:98px; border-color:#e0e6e8; box-shadow:0 8px 24px rgb(31 51 60 / 6%); }
.machine-page .machine-row .smartphone-tile-icon { color:#e9774f; }
.machine-page .machine-row::after, .machine-page .machine-document::after { color:#e9774f; font-size:1.8rem; }
.machine-page .machine-documents { margin-top:22px; padding:20px; }
.machine-page .machine-documents h2 { margin:0 0 12px; color:#1d2a30; font-size:1.15rem; }
.machine-page .machine-documents .smartphone-product-rows { grid-template-columns:repeat(2,minmax(0,1fr)); }
.machine-page .machine-documents .machine-document { box-shadow:none; }
.machine-page .shared-empty-state { margin:0; border:1px dashed #d5dfe2; border-radius:14px; background:#f7f9fa; }
@media (min-width: 601px) {
    body:not(:has(.desktop-home-dashboard)) .smartphone-home {
        display:block;
    }

    body:not(:has(.desktop-home-dashboard)) .smartphone-products {
        width:min(1120px, calc(100% - 64px));
        margin:0 auto;
        padding:34px 0 64px;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-back {
        display:inline-flex;
        margin-bottom:16px;
        color:#65747a;
        font-weight:700;
        text-decoration:none;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-intro {
        margin-bottom:18px;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-intro h1 {
        margin:0 0 6px;
        color:#1d2a30;
        font-size:2rem;
        letter-spacing:-.025em;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-intro p {
        margin:0;
        color:#7d8b91;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products > label {
        width:min(620px, 100%);
        margin:0 0 20px;
        display:grid;
        gap:7px;
        color:#3f4d53;
        font-weight:700;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products > label input {
        width:100%;
        min-height:48px;
        padding:0 15px;
        border:1px solid #ccd7da;
        border-radius:13px;
        color:#1e292e;
        background:#fff;
        font:inherit;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-product-rows {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:16px;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-card {
        position:relative;
        min-width:0;
        min-height:0;
        height:auto;
        padding:18px;
        display:grid;
        grid-template-columns:72px minmax(0,1fr) 76px;
        grid-template-rows:auto auto;
        align-items:start;
        gap:14px;
        overflow:hidden;
        border:1px solid #e0e6e8;
        border-radius:20px;
        color:#1e292e;
        background:#fff;
        box-shadow:0 8px 24px rgb(31 51 60 / 6%);
        text-decoration:none;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-card:hover {
        border-color:#f0b39c;
        box-shadow:0 12px 30px rgb(31 51 60 / 10%);
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-card::after {
        display:none;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-admin-controls {
        display:none;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-thumbnail {
        grid-column:1;
        grid-row:1;
        width:72px;
        height:72px;
        display:grid;
        place-items:center;
        overflow:hidden;
        border:1px solid #e0e6e8;
        border-radius:13px;
        background:#f7f9fa;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-thumbnail img {
        width:100%;
        height:100%;
        object-fit:contain;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-copy {
        grid-column:2;
        grid-row:1;
        min-width:0;
        align-self:center;
        overflow-wrap:anywhere;
        font-size:1rem;
        font-weight:800;
        line-height:1.35;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-copy small {
        display:inline-block;
        margin-top:5px;
        color:#7e8c92;
        font-size:.8rem;
        font-weight:650;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-qr {
        grid-column:3;
        grid-row:1;
        width:76px;
        height:76px;
        display:grid;
        place-items:center;
        overflow:hidden;
        border:1px solid #e0e6e8;
        border-radius:13px;
        background:#fff;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-qr img {
        width:68px;
        height:68px;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-metadata {
        grid-column:1 / -1;
        grid-row:2;
        min-width:0;
        padding-top:13px;
        display:grid;
        gap:5px;
        border-top:1px solid #e7ecee;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-metadata > strong {
        font-size:.82rem;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-metadata > small {
        color:#89969b;
        font-size:.72rem;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-metadata-grid {
        margin-top:5px;
        display:grid;
        grid-template-columns:repeat(5,minmax(0,1fr));
        gap:7px;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-metadata-grid > span {
        min-width:0;
        padding:8px 9px;
        overflow-wrap:anywhere;
        border-radius:9px;
        color:#2d393e;
        background:#f5f7f8;
        font-size:.75rem;
        line-height:1.3;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-metadata-grid b {
        display:block;
        margin-bottom:3px;
        color:#859299;
        font-size:.62rem;
        letter-spacing:.04em;
        text-transform:uppercase;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-associated-control { grid-column:1 / -1; grid-row:3; justify-self:start; margin:0; min-height:40px; }

    body:not(:has(.desktop-home-dashboard)) .smartphone-catalog-tables .smartphone-product-rows {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-catalog-tables .smartphone-table-card {
        min-width:0;
        min-height:180px;
        padding:16px;
        display:grid;
        grid-template-columns:minmax(0,1fr) 132px;
        gap:14px;
        align-items:center;
        border:1px solid #e0e6e8;
        border-radius:18px;
        color:#1e292e;
        background:#fff;
        box-shadow:0 7px 20px rgb(31 51 60 / 6%);
        text-decoration:none;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-catalog-tables .smartphone-table-card-copy {
        min-width:0;
        display:grid;
        gap:5px;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-catalog-tables .smartphone-table-card-page {
        color:#8a979c;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-catalog-tables .smartphone-table-card-name {
        overflow-wrap:anywhere;
        font-size:1rem;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-catalog-tables .smartphone-table-preview {
        width:132px;
        height:112px;
        display:grid;
        place-items:center;
        overflow:hidden;
        border:1px solid #e0e6e8;
        border-radius:12px;
        background:#f8fafb;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-catalog-tables .smartphone-table-preview img {
        display:block;
        width:100%;
        height:100%;
        max-width:100%;
        max-height:100%;
        object-fit:contain;
        object-position:center center;
    }

    :root[data-theme="dark"] body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-intro h1 {
        color:var(--ink);
    }
    :root[data-theme="dark"] body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-card,
    :root[data-theme="dark"] body:not(:has(.desktop-home-dashboard)) .smartphone-catalog-tables .smartphone-table-card {
        color:var(--ink);
        background:var(--paper);
        border-color:var(--line);
    }
    :root[data-theme="dark"] body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-thumbnail,
    :root[data-theme="dark"] body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-qr,
    :root[data-theme="dark"] body:not(:has(.desktop-home-dashboard)) .smartphone-catalog-tables .smartphone-table-preview {
        background:#17262c;
        border-color:var(--line);
    }
    :root[data-theme="dark"] body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-metadata-grid > span {
        color:var(--ink);
        background:#26383f;
    }
    :root[data-theme="dark"] .machine-page .machine-documents { background:var(--paper); border-color:var(--line); }
    :root[data-theme="dark"] .machine-page .machine-documents h2 { color:var(--ink); }
    :root[data-theme="dark"] .machine-page .shared-empty-state { background:#26383f; border-color:var(--line); }
}

@media (min-width: 601px) and (max-width: 980px) {
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-product-rows {
        grid-template-columns:1fr;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-catalog-tables .smartphone-product-rows {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

/* Catalog card link participates in the card grid while keeping admin controls outside the link. */
:root[data-smartphone-ui="v2"] .smartphone-products .smartphone-catalog-main-link {
    display: contents;
    color: inherit;
    text-decoration: none;
}
@media (min-width: 601px) {
    body:not(:has(.desktop-home-dashboard)) .smartphone-products .smartphone-catalog-main-link {
        display: contents;
        color: inherit;
        text-decoration: none;
    }
}

/* === Keep MANU Smart catalog cards identical to Proposal 1 above 600px === */
@media (min-width: 601px) {
    body:not(:has(.desktop-home-dashboard)) .smartphone-products:not(.smartphone-catalog-tables) .smartphone-catalog-card {
        grid-template-columns:180px minmax(0,1fr);
        grid-template-rows:auto auto;
        gap:14px;
        padding:18px;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products:not(.smartphone-catalog-tables) .smartphone-catalog-thumbnail {
        grid-column:1;
        grid-row:1;
        width:180px;
        height:200px;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products:not(.smartphone-catalog-tables) .smartphone-catalog-thumbnail img {
        width:100%;
        height:100%;
        object-fit:cover;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products:not(.smartphone-catalog-tables) .smartphone-catalog-copy {
        grid-column:2;
        grid-row:1;
        align-self:start;
        padding:44px 0 0;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products:not(.smartphone-catalog-tables) .smartphone-catalog-qr {
        display:none !important;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products:not(.smartphone-catalog-tables) .smartphone-catalog-admin-controls {
        display:flex;
        position:absolute;
        top:18px;
        right:18px;
        z-index:4;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products:not(.smartphone-catalog-tables) .smartphone-catalog-metadata {
        grid-column:1 / -1;
        grid-row:2;
    }
    body:not(:has(.desktop-home-dashboard)) .smartphone-products:not(.smartphone-catalog-tables) .smartphone-catalog-metadata-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
.catalog-um-control { display:inline-flex; align-items:center; justify-content:center; min-width:2.2rem; min-height:2rem; padding:.25rem .55rem; border-radius:.45rem; background:#0b7285; color:#fff; font-weight:700; text-decoration:none; }
.catalog-um-control.is-disabled { background:#d0d4d8; color:#697078; cursor:not-allowed; pointer-events:none; }
.import-center .page-heading,.import-actions,.filter-bar{display:flex;gap:1rem;align-items:center;justify-content:space-between;flex-wrap:wrap}.import-actions form{display:inline-flex;gap:.5rem;align-items:center}.import-actions small{display:block}.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:1rem;margin:1.5rem 0}.kpi-grid>a,.kpi-grid>div{padding:1rem;border:1px solid var(--border-color,#ccd3db);border-radius:.5rem;text-decoration:none;color:inherit}.kpi-grid b{display:block;font-size:1.6rem}.table-wrap{overflow:auto}.import-center table{width:100%;border-collapse:collapse}.import-center th,.import-center td{padding:.65rem;border-bottom:1px solid var(--border-color,#ccd3db);text-align:left;vertical-align:top}.quality-dot{display:inline-block;width:.7rem;height:.7rem;border-radius:50%;margin-right:.35rem}.quality-dot.bad{background:#d94841}.quality-dot.good{background:#2b8a3e}.filter-bar input,.filter-bar select{min-height:2.3rem;padding:.35rem}.import-center details{margin-top:1rem;padding:1rem;border:1px solid var(--border-color,#ccd3db)}.import-center details label{display:block;margin:.5rem 0}.import-center details input{width:min(100%,32rem)}
@media(max-width:700px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.import-center .page-heading{align-items:flex-start}}
.smartphone-home.machine-page { display: block; max-width: 1080px; margin: 0 auto; }
.machine-search { display: grid; gap: 8px; margin: 18px 0 24px; }
.machine-search > div { display: flex; gap: 8px; }
.machine-search input { flex: 1; min-width: 0; padding: 11px 13px; border: 1px solid var(--line); border-radius: 8px; font: inherit; }
.machine-page .smartphone-product-rows { display: grid; gap: 12px; }
.machine-page .smartphone-tile { position: relative; min-height: 86px; padding: 16px 44px 16px 16px; display: flex; align-items: center; gap: 14px; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); background: var(--paper); text-decoration: none; }
.machine-page .smartphone-tile::after { content: "›"; position: absolute; top: 50%; right: 16px; color: var(--muted); font-size: 1.4rem; transform: translateY(-50%); }
.machine-page .smartphone-icon { width: 32px; height: 32px; }
.machine-row, .machine-document { justify-content: flex-start !important; text-align: left !important; }
.machine-row > span:last-child, .machine-document > span { display: grid; gap: 4px; min-width: 0; }
.machine-row small, .machine-document small { color: var(--muted); }
.machine-documents { margin-top: 28px; }
.machine-documents h2 { margin-bottom: 12px; }
@media (max-width: 640px) { .machine-page { padding-inline: 16px; } .machine-search > div { align-items: stretch; } .machine-page .smartphone-tile { height: auto; min-height: 104px; } }
.serial-context-bar{display:flex;align-items:center;justify-content:center;gap:1rem;padding:.55rem 1rem;background:#e8f3ff;color:#173b61;border-bottom:1px solid #b8d5ef}.serial-context-bar a{font-weight:700}.serial-page{max-width:760px;margin:2rem auto;padding:0 1rem}.serial-form,.serial-result,.serial-state{display:grid;gap:1rem;padding:1.25rem;margin:1rem 0;border:1px solid var(--border-color,#ccd5df);border-radius:14px;background:var(--surface,#fff)}.serial-form input{font-size:1.35rem;min-height:56px;padding:.75rem;border:2px solid #56748e;border-radius:10px}.serial-result dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.serial-result dl div{padding:.75rem;background:rgba(120,140,160,.1);border-radius:8px}.serial-result dt{font-size:.8rem}.serial-result dd{font-weight:700;margin:.2rem 0 0}.serial-actions{display:flex;gap:.75rem;flex-wrap:wrap}.serial-state--error{border-color:#b42318}.serial-state--warning{border-color:#b7791f}@media(max-width:600px){.serial-page{margin:1rem auto}.serial-result dl{grid-template-columns:1fr}.serial-actions>*{width:100%;text-align:center}.serial-context-bar{justify-content:space-between;font-size:.82rem}}

/* UM / document library */
.document-library { max-width: 1120px; margin: 0 auto; }
.document-library-search { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; margin: 14px 0 20px; }
.document-library-search label { display: grid; gap: 5px; }
.document-library-search input, .document-library-search select { min-height: 40px; }
.document-library-grid { display: grid; gap: 14px; }
.document-library-card { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 18px; padding: 16px; }
.document-library-preview { display: block; width: 150px; aspect-ratio: 3 / 4; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.document-library-preview img { display: block; width: 100%; height: 100%; object-fit: contain; background: #fff; }
.document-library-copy { min-width: 0; }
.document-library-copy h2 { margin: 4px 0 10px; }
.document-library-copy p { margin: 5px 0; }
.document-library-meta { font-weight: 700; color: var(--muted); }
.document-library-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.document-viewer-heading { display: flex; align-items: end; justify-content: space-between; gap: 12px; }
.document-viewer-fallback { color: var(--muted); font-size: .85rem; }
@media (max-width: 700px) {
  .document-library { width: 100%; }
  .document-library-search { display: grid; align-items: stretch; }
  .document-library-search label { width: 100%; }
  .document-library-card { grid-template-columns: 86px minmax(0, 1fr); gap: 12px; padding: 12px; }
  .document-library-preview { width: 86px; align-self: start; }
  .document-library-copy h2 { font-size: 1rem; }
  .document-library-meta, .document-library-copy p { font-size: .78rem; }
  .document-library-actions .button-link { flex: 1 1 auto; justify-content: center; }
  .document-viewer-heading { align-items: stretch; flex-direction: column; }
  .manu-document-frame { min-height: 68vh; }
}
.civ1-upload-progress { display: grid; gap: 4px; margin-top: 6px; min-width: 180px; }
.civ1-upload-progress progress { width: 100%; height: 9px; }