:root {
    --bg: #f4f6f8;
    --panel: #ffffff;
    --text: #1f2933;
    --muted: #64748b;
    --line: #d9e2ec;
    --primary: #1f6feb;
    --primary-dark: #1557b0;
    --danger: #b42318;
    --success-bg: #e7f6ed;
    --error-bg: #fde8e7;
}

/* Product-library-first order binding */
.binding-library-table-wrap {
    max-height: 62vh;
}

.binding-library-table th,
.binding-library-table td {
    white-space: nowrap;
    vertical-align: middle;
}

.binding-library-table td:nth-child(1),
.binding-library-table td:nth-child(11) {
    white-space: normal;
    min-width: 180px;
}

.binding-library-table td small {
    display: block;
    margin-top: 4px;
    color: #64748b;
}

.binding-actions {
    min-width: 250px;
}

.binding-check {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.binding-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 80;
    background: rgba(15, 23, 42, .36);
}

.binding-drawer {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 81;
    width: min(920px, 92vw);
    height: 100vh;
    background: #f8fafc;
    box-shadow: -14px 0 38px rgba(15, 23, 42, .22);
    overflow: auto;
}

.binding-drawer-head {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 20px 24px;
    border-bottom: 1px solid #cbd5e1;
    background: #fff;
}

.binding-drawer-head h3,
.binding-drawer-head p {
    margin: 0;
}

.binding-drawer-head p {
    margin-top: 5px;
    color: #64748b;
}

.drawer-close {
    min-width: 38px;
    padding: 4px 10px;
    font-size: 25px;
    line-height: 1;
    background: #e2e8f0;
    color: #334155;
}

.binding-drawer-body {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 16px;
    padding: 18px;
}

.binding-current-card,
.binding-candidate-section,
.binding-preview {
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #fff;
    padding: 16px;
}

.binding-current-card {
    align-self: start;
}

.binding-current-card h4,
.binding-candidate-section h4,
.binding-preview h4 {
    margin: 0 0 12px;
}

.binding-current-card dl {
    margin: 0;
}

.binding-current-card dl div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid #e2e8f0;
}

.binding-current-card dt {
    color: #64748b;
}

.binding-current-card dd {
    margin: 0;
    text-align: right;
    font-weight: 600;
}

.binding-candidate-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.binding-candidate-head input {
    width: min(360px, 60%);
}

.binding-candidate-list {
    display: grid;
    gap: 8px;
    max-height: 48vh;
    overflow: auto;
}

.binding-candidate {
    display: grid;
    gap: 5px;
    width: 100%;
    padding: 12px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #fff;
    color: #0f172a;
    text-align: left;
}

.binding-candidate:hover,
.binding-candidate.selected {
    border-color: #2563eb;
    background: #eff6ff;
}

.binding-candidate.recommended {
    border-left: 4px solid #2563eb;
}

.binding-candidate span {
    display: block;
}

.binding-candidate span:not(:first-child) {
    color: #64748b;
    font-size: 13px;
}

.binding-candidate em {
    margin-left: 8px;
    padding: 2px 7px;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 12px;
    font-style: normal;
}

.binding-preview {
    grid-column: 1 / -1;
}

.binding-preview-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.binding-preview-grid > div {
    padding: 12px;
    border-radius: 8px;
    background: #f1f5f9;
}

.binding-preview-grid p {
    margin-bottom: 0;
}

.binding-preserve-note {
    color: #475569;
}

@media (max-width: 800px) {
    .binding-drawer-body,
    .binding-preview-grid {
        grid-template-columns: 1fr;
    }

    .binding-preview {
        grid-column: auto;
    }
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    background: var(--bg);
    color: var(--text);
    font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
    font-size: 14px;
}

a {
    color: var(--primary);
    text-decoration: none;
}

button,
.button,
.nav-link {
    border: 1px solid var(--primary);
    border-radius: 6px;
    background: var(--primary);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 14px;
    font: inherit;
    white-space: nowrap;
}

button:hover,
.button:hover,
.nav-link:hover {
    background: var(--primary-dark);
    color: #fff;
}

.secondary,
.nav-link {
    background: #fff;
    color: var(--primary);
}

.export {
    background: #246b4f;
    border-color: #246b4f;
}

.export:hover {
    background: #1b513c;
}

.warning {
    background: #b45309;
    border-color: #b45309;
}

.warning:hover {
    background: #92400e;
}

.topbar {
    background: #172033;
    color: #fff;
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 18px 28px;
}

.topbar h1 {
    font-size: 22px;
    margin: 0 0 6px;
}

.topbar p {
    color: #cbd5e1;
    margin: 0;
}

.topbar nav {
    display: flex;
    align-items: center;
    gap: 10px;
}

.container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 22px;
}

.panel {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 8px;
    margin-bottom: 16px;
    padding: 18px;
}

.panel h3 {
    border-bottom: 1px solid var(--line);
    font-size: 17px;
    margin: 0 0 16px;
    padding-bottom: 10px;
}

.search-bar,
.search-panel {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto auto auto;
    gap: 10px;
}

.search-panel {
    grid-template-columns: minmax(260px, 1.5fr) repeat(4, minmax(112px, 0.7fr)) auto auto auto auto;
}

.insert-search-panel {
    grid-template-columns: minmax(320px, 1fr) auto auto;
}

/* Compact, tabbed product and insert queries on the product-library home page. */
.unified-query-panel {
    padding: 0 14px 12px;
}

.query-tab-list {
    border-bottom: 1px solid var(--line);
    display: flex;
    gap: 20px;
    min-height: 40px;
}

.query-tab {
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    color: var(--muted);
    font-weight: 700;
    min-height: 40px;
    padding: 0 3px;
}

.query-tab:hover,
.query-tab.is-active {
    background: transparent;
    border-bottom-color: var(--primary);
    color: var(--primary);
}

.query-tab-panel {
    padding-top: 10px;
}

.query-tab-panel[hidden] {
    display: none;
}

.product-query-form {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(250px, 2.2fr) repeat(2, minmax(98px, .8fr)) minmax(112px, .9fr) repeat(4, minmax(100px, .8fr)) auto;
}

.product-query-form input,
.product-query-form select,
.product-query-form button,
.insert-query-form input,
.insert-query-form button,
.insert-query-form .button,
.query-clear-button,
.query-more-actions summary {
    height: 38px;
    min-height: 38px;
}

.product-query-form select {
    min-width: 0;
    padding-left: 8px;
    padding-right: 6px;
}

.product-query-submit {
    min-width: 72px;
}

.query-assist-row {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    margin-top: 8px;
    min-height: 38px;
}

.active-filter-list,
.query-secondary-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.active-filter-list {
    min-width: 0;
}

.active-filter-label {
    color: var(--muted);
    font-size: 12px;
    white-space: nowrap;
}

.filter-chip {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    color: #1d4ed8;
    display: inline-flex;
    font-size: 12px;
    gap: 5px;
    line-height: 1;
    max-width: 220px;
    overflow: hidden;
    padding: 6px 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.filter-chip:hover,
.filter-chip-attention {
    background: #dbeafe;
    color: #1d4ed8;
}

.filter-chip-quick {
    background: #fff;
    border-color: #cbd5e1;
    color: #475569;
}

.filter-chip b {
    font-size: 14px;
    line-height: 10px;
}

.query-secondary-actions {
    flex: 0 0 auto;
}

.query-clear-button,
.query-more-actions summary {
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    color: #475569;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    white-space: nowrap;
}

.query-clear-button:hover,
.query-more-actions summary:hover {
    background: #f8fafc;
    border-color: #94a3b8;
    color: #334155;
}

.query-more-actions summary {
    font-size: 14px;
    list-style: none;
}

.query-more-actions summary::-webkit-details-marker {
    display: none;
}

.more-actions-popover {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 7px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .14);
    display: grid;
    min-width: 190px;
    padding: 5px;
    position: absolute;
    right: 0;
    top: calc(100% + 5px);
    z-index: 20;
}

.query-more-actions .more-actions-popover a {
    background: transparent;
    border: 0;
    border-radius: 5px;
    box-shadow: none;
    color: #334155;
    padding: 9px 10px;
    position: static;
}

.query-more-actions .more-actions-popover a:hover {
    background: #f1f5f9;
    color: var(--primary);
}

.insert-query-form {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(360px, 1fr) auto auto;
}

.insert-query-results {
    margin-top: 10px;
}

.search-result-panel .table-wrap {
    margin-top: 0;
}

.view-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 14px;
}

.home-reminder-panel h3 {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.home-count {
    color: var(--muted);
    font-size: 13px;
    font-weight: 400;
}

.home-reminder-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

.home-reminder-grid.compact {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.all-products-panel {
    margin-top: 12px;
}

.home-week-pager {
    display: grid;
    gap: 8px;
}

.all-products-grid {
    align-content: start;
    gap: 8px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.all-products-grid .home-product-card {
    grid-template-rows: auto auto;
    min-height: 0;
}

.all-products-grid .home-thumb-wrap img {
    object-fit: contain;
}

.all-products-pager {
    grid-template-rows: auto auto;
}

.today-products-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.product-list-card[hidden] {
    display: none;
}

.week-pager-controls {
    align-items: center;
    border-top: 1px solid var(--line);
    color: var(--muted);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    min-height: 38px;
    padding-top: 8px;
}

.week-pager-controls button:disabled {
    background: #eef2f7;
    border-color: #cbd5e1;
    color: #94a3b8;
    cursor: not-allowed;
}

.compare-summary-bar {
    align-items: center;
    background: #f8fafc;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--muted);
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-bottom: 8px;
    padding: 8px 10px;
}

.compare-summary-bar form {
    margin: 0;
}

.home-product-card {
    background: #fff;
    border: 2px solid var(--line);
    border-radius: 8px;
    color: var(--text);
    display: grid;
    gap: 6px;
    grid-template-rows: auto auto 1fr auto;
    min-height: 198px;
    padding: 8px;
    position: relative;
    scroll-margin-top: 18px;
}

.home-product-card.selected {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.14);
}

.home-product-main {
    color: inherit;
    display: grid;
    gap: 8px;
    grid-template-columns: 88px minmax(0, 1fr);
    text-decoration: none;
}

.product-card-actions {
    align-items: center;
    border-top: 1px solid #e2e8f0;
    display: grid;
    gap: 5px;
    grid-template-columns: 1fr;
    padding-top: 6px;
}

.product-card-actions form {
    margin: 0;
}

.product-card-actions .button,
.product-card-actions button {
    font-size: 12px;
    min-height: 28px;
    padding: 4px 6px;
    text-align: center;
    width: 100%;
}

.product-card-actions .link-danger {
    border: 1px solid #f3b5af;
}

.home-product-card:hover {
    border-color: #9fc5ff;
    box-shadow: 0 3px 10px rgba(31, 111, 235, 0.12);
}

.series-part-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.series-part-card {
    grid-template-rows: auto auto auto auto;
    min-height: 238px;
}

.series-part-main {
    min-width: 0;
}

.series-part-thumb {
    height: 104px;
    width: 104px;
}

.series-part-status {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-height: 25px;
}

.series-part-counts {
    color: var(--muted);
    font-size: 11px;
}

.series-part-controls {
    align-items: end;
    border-top: 1px solid #e2e8f0;
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(0, 1fr) auto;
    padding-top: 7px;
}

.series-part-controls label {
    align-items: center;
    color: var(--muted);
    display: flex;
    font-size: 12px;
    gap: 6px;
}

.series-part-controls .sort-input {
    min-height: 30px;
    padding: 4px 7px;
    width: 72px;
}

.series-part-select {
    cursor: pointer;
    white-space: nowrap;
}

.series-part-actions {
    display: grid;
    gap: 6px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.series-part-actions .button {
    min-height: 30px;
    padding: 5px 8px;
    text-align: center;
}

.home-thumb-wrap {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #dbe4ef;
    border-radius: 6px;
    display: flex;
    height: 88px;
    justify-content: center;
    overflow: hidden;
    width: 88px;
}

.home-thumb-wrap img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.home-no-thumb {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.3;
    padding: 6px;
    text-align: center;
}

.home-product-info {
    display: grid;
    gap: 2px;
    min-width: 0;
    padding-right: 0;
}

.home-product-info strong {
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-product-info small {
    color: var(--muted);
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.card-status-row {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.card-status-row .tag {
    font-size: 12px;
    line-height: 1;
    padding: 3px 8px;
}

.today-products-grid .compact-today-card {
    align-content: start;
    gap: 4px;
    grid-template-rows: auto auto;
    min-height: 0;
    padding: 8px;
}

.today-products-grid .compact-today-card .home-product-main {
    grid-template-columns: 88px minmax(0, 1fr);
}

.today-products-grid .compact-today-card .home-thumb-wrap {
    height: 88px;
    width: 88px;
}

.today-products-grid .compact-today-card .home-thumb-wrap img {
    object-fit: contain;
}

.today-products-grid .compact-today-card .card-status-row {
    margin-top: 0;
}

.batch-panel h3 {
    margin-bottom: 12px;
}

.batch-grid {
    align-items: end;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.inline-form {
    align-items: end;
    display: grid;
    grid-template-columns: minmax(320px, 1fr) auto;
    gap: 12px;
}

.inner-table {
    margin-bottom: 12px;
}

.sort-input {
    max-width: 90px;
}

.series-summary {
    display: grid;
    gap: 16px;
}

.series-cover {
    background: #fff;
    border: 1px solid #dbe4ef;
    border-radius: 6px;
    display: block;
    max-height: 180px;
    object-fit: contain;
    width: 220px;
}

.series-link-panel {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.import-path-form {
    align-items: end;
    display: grid;
    grid-template-columns: minmax(360px, 1fr) auto auto;
    gap: 12px;
}

.import-guide {
    background: #eef6ff;
    border: 1px solid #bfdbfe;
    border-radius: 6px;
    color: #1e3a5f;
    display: grid;
    gap: 6px;
    margin-bottom: 14px;
    padding: 12px;
}

.drop-zone {
    align-items: center;
    background: #f8fafc;
    border: 2px dashed #94a3b8;
    border-radius: 10px;
    display: grid;
    gap: 8px;
    justify-items: center;
    margin-bottom: 16px;
    padding: 30px;
    text-align: center;
}

.import-customer-field {
    margin-bottom: 12px;
}

.import-customer-field input {
    border-color: #1f6feb;
    font-weight: 700;
}

.drop-zone.active {
    background: #eff6ff;
    border-color: #1f6feb;
}

.drop-zone strong {
    color: #172033;
    font-size: 20px;
}

.drop-zone span {
    color: #64748b;
}

.drop-zone .drop-warning {
    color: #b45309;
    font-weight: 700;
}

.upload-folder-label {
    margin-top: 4px;
}

.folder-picker-input {
    height: 1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    width: 1px;
    z-index: -1;
}

.import-divider {
    color: #64748b;
    margin: 8px 0 12px;
}

.help-text {
    color: #64748b;
    margin: 10px 0 0;
}

.import-table {
    min-width: 1500px;
}

.import-table input,
.import-table select {
    min-width: 120px;
}

.import-table input[type="checkbox"] {
    min-width: 0;
    width: auto;
}

.small-cell {
    color: #475569;
    line-height: 1.7;
    white-space: nowrap;
}

.result-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
    margin-top: 12px;
}

.result-grid div {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 14px;
}

.result-grid strong {
    color: #1f6feb;
    display: block;
    font-size: 26px;
}

.result-grid span {
    color: #475569;
}

.result-list {
    line-height: 1.8;
}

input,
textarea,
select {
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    color: var(--text);
    font: inherit;
    min-height: 36px;
    padding: 8px 10px;
    width: 100%;
}

textarea {
    resize: vertical;
}

.table-wrap {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 8px;
    overflow-x: auto;
}

table {
    border-collapse: collapse;
    min-width: 1120px;
    width: 100%;
}

th,
td {
    border-bottom: 1px solid var(--line);
    padding: 12px 10px;
    text-align: left;
    vertical-align: middle;
}

th {
    background: #edf2f7;
    color: #334155;
    font-weight: 700;
}

.actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.actions form {
    margin: 0;
}

.actions button:not(.link-danger) {
    background: none;
    border: 0;
    color: var(--primary);
    min-height: auto;
    padding: 0;
}

.actions button:not(.link-danger):hover {
    background: none;
    color: #0b4db3;
}

.link-danger {
    background: none;
    border: 0;
    color: var(--danger);
    min-height: auto;
    padding: 0;
}

.link-danger:hover {
    background: none;
    color: #7a1b13;
}

.tag {
    background: #e8eef7;
    border-radius: 999px;
    color: #334155;
    display: inline-block;
    padding: 3px 10px;
}

.tag.complete {
    background: #dcfce7;
    color: #166534;
}

.tag.incomplete {
    background: #fee2e2;
    color: #991b1b;
}

.tag.drawing-status {
    justify-self: start;
    font-weight: 700;
}

.tag.drawing-missing {
    background: #fee2e2;
    color: #991b1b;
}

.tag.drawing-ok {
    background: #dcfce7;
    color: #166534;
}

.empty {
    color: var(--muted);
    text-align: center;
}

.empty-inline {
    color: var(--muted);
    margin: 0;
}

.notice-inline {
    display: inline-block;
    color: #075985;
    background: #e0f2fe;
    border: 1px solid #bae6fd;
    border-radius: 8px;
    padding: 9px 12px;
    margin: 8px 0;
    font-weight: 700;
}

.help-text {
    color: var(--muted);
    margin: 6px 0 12px;
    font-size: 13px;
}

.no-inserts-check {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #0f172a;
    background: #f0f9ff;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    padding: 10px 12px;
    font-weight: 700;
}

.no-inserts-check input {
    width: 18px;
    height: 18px;
}

.compare-header-panel .page-heading {
    align-items: center;
    display: flex;
    justify-content: space-between;
    gap: 16px;
}

.compare-toolbar {
    align-items: center;
    border-top: 1px solid var(--line);
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 14px;
    padding-top: 14px;
}

.switch-line {
    align-items: center;
    display: inline-flex;
    gap: 8px;
    font-weight: 700;
}

.switch-line input {
    width: 18px;
    height: 18px;
}

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

.compare-side {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 14px;
}

.compare-product-head {
    align-items: start;
    border-bottom: 1px solid var(--line);
    display: flex;
    gap: 12px;
    justify-content: space-between;
    padding-bottom: 10px;
}

.compare-product-head h3 {
    margin: 0 0 4px;
}

.compare-product-head p {
    color: var(--muted);
    margin: 0;
}

.compare-head-actions {
    align-items: center;
    display: flex;
    gap: 8px;
}

.compare-head-actions form {
    margin: 0;
}

.compare-head-actions .button,
.compare-head-actions button {
    min-height: 34px;
    padding: 7px 12px;
}

.compare-info {
    display: grid;
    gap: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 12px 0;
}

.compare-info div {
    border: 1px solid var(--line);
    display: grid;
    grid-template-columns: 86px minmax(0, 1fr);
    margin: -1px 0 0 -1px;
    min-height: 38px;
}

.compare-info dt {
    background: #edf2f7;
    color: #334155;
    font-weight: 700;
    padding: 9px;
}

.compare-info dd {
    margin: 0;
    padding: 9px;
    word-break: break-word;
}

.compare-viewer-toolbar {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

.compare-viewer-toolbar button {
    min-height: 32px;
    padding: 6px 12px;
}

.compare-viewer {
    align-items: center;
    background: #0f172a;
    border: 1px solid #1e293b;
    border-radius: 8px;
    cursor: grab;
    display: flex;
    height: 520px;
    justify-content: center;
    overflow: hidden;
    position: relative;
    user-select: none;
}

.compare-viewer.dragging {
    cursor: grabbing;
}

.compare-viewer img {
    max-height: 96%;
    max-width: 96%;
    object-fit: contain;
    transform-origin: center center;
    transition: transform 0.04s linear;
    will-change: transform;
}

.compare-no-image {
    color: #cbd5e1;
    font-size: 18px;
}

.compare-thumbs {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
    margin-top: 10px;
}

.compare-thumbs button {
    background: #fff;
    border: 2px solid var(--line);
    border-radius: 6px;
    min-height: 68px;
    padding: 2px;
}

.compare-thumbs button.active {
    border-color: var(--primary);
}

.compare-thumbs img {
    border-radius: 4px;
    display: block;
    height: 62px;
    object-fit: cover;
    width: 100%;
}

.compare-selected-list {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.compare-selected-card {
    border: 1px solid var(--line);
    border-radius: 8px;
    display: grid;
    gap: 8px;
    padding: 12px;
}

.compare-picker-panel {
    padding: 12px 18px;
}

.compare-picker-bar {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
}

.compare-picker-bar h3 {
    margin: 0 0 4px;
}

.compare-picker-bar p {
    color: var(--muted);
    margin: 0;
}

.compare-shelf-panel h3,
.compare-table-panel h3 {
    margin-top: 0;
}

.compare-product-shelf {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    max-height: 292px;
    overflow-y: auto;
}

.compare-shelf-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 8px;
    display: grid;
    gap: 8px;
    padding: 8px;
}

.compare-shelf-main {
    background: transparent;
    border: 0;
    color: var(--text);
    display: grid;
    gap: 6px;
    min-height: 0;
    padding: 0;
    text-align: left;
}

.compare-shelf-main:hover {
    background: transparent;
}

.compare-shelf-image {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #dbe4ef;
    border-radius: 6px;
    display: flex;
    height: 92px;
    justify-content: center;
    overflow: hidden;
}

.compare-shelf-image img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.compare-shelf-main strong {
    color: #0f172a;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.compare-shelf-main small {
    color: var(--muted);
    line-height: 1.35;
}

.compare-shelf-actions {
    display: grid;
    gap: 6px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.compare-shelf-actions button,
.compare-shelf-card form button {
    min-height: 30px;
    padding: 5px 8px;
    width: 100%;
}

.compare-shelf-card form {
    margin: 0;
}

.compare-table-panel .table-wrap {
    margin-top: 0;
}

.list-photo-cell {
    width: 82px;
}

.list-thumb {
    background: #fff;
    border: 1px solid #dbe4ef;
    border-radius: 6px;
    display: block;
    height: 56px;
    object-fit: contain;
    width: 72px;
}

.no-thumb {
    background: #eef2f7;
    border-radius: 6px;
    color: #64748b;
    display: inline-flex;
    height: 56px;
    align-items: center;
    justify-content: center;
    width: 72px;
}

.messages {
    margin-bottom: 14px;
}

.message {
    border-radius: 6px;
    margin-bottom: 8px;
    padding: 10px 12px;
}

.message.format-notice {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px 14px;
    border-left: 4px solid #dc2626;
}

.message.format-notice strong {
    font-size: 14px;
    line-height: 1.3;
}

.message.format-notice span {
    font-size: 13px;
    line-height: 1.6;
}

.message.success {
    background: var(--success-bg);
    color: #20603d;
}

.message.error {
    background: var(--error-bg);
    color: #9f1d16;
}

.error-text {
    color: #475569;
    font-size: 16px;
    line-height: 1.8;
}

.form-head,
.detail-head,
.bottom-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 16px;
}

.form-head h2,
.detail-head h2 {
    font-size: 22px;
    margin: 0;
}

.detail-head p {
    color: var(--muted);
    margin: 6px 0 0;
}

.form-actions,
.bottom-actions {
    display: flex;
    gap: 10px;
}

.form-actions form,
.bottom-actions form {
    margin: 0;
}

.grid,
.detail-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.field span,
dt {
    color: #475569;
    display: block;
    font-weight: 700;
    margin-bottom: 6px;
}

.field b {
    color: var(--danger);
    margin-left: 2px;
}

.wide {
    grid-column: span 2;
}

.file-link {
    display: inline-block;
    margin-top: 6px;
    word-break: break-all;
}

.image-link {
    display: block;
    margin-top: 6px;
}

.thumb {
    background: #fff;
    border: 1px solid #dbe4ef;
    border-radius: 6px;
    display: block;
    height: 150px;
    max-width: 100%;
    object-fit: contain;
    width: 100%;
}

.thumb.small {
    height: 110px;
}

.photo-edit-grid,
.photo-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.photo-edit-card,
.photo-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    margin: 0;
    padding: 12px;
}

.photo-edit-card .field + .field {
    margin-top: 10px;
}

.delete-check {
    align-items: center;
    color: #b42318;
    display: inline-flex;
    font-weight: 700;
    gap: 6px;
    margin-top: 8px;
}

.delete-check input {
    min-height: auto;
    width: auto;
}

.cover-check {
    align-items: center;
    color: #1f6feb;
    display: flex;
    font-weight: 700;
    gap: 6px;
    margin-top: 8px;
}

.cover-check input {
    min-height: auto;
    width: auto;
}

.cover-tag {
    background: #dbeafe;
    border-radius: 999px;
    color: #1d4ed8;
    font-size: 12px;
    font-weight: 700;
    padding: 2px 8px;
}

.muted-cover-check {
    color: #64748b;
    font-weight: 400;
}

.image-button {
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: inherit;
    display: block;
    height: auto;
    margin: 0;
    min-height: 0;
    padding: 0;
    width: 100%;
}

.image-button:hover {
    background: transparent;
}

.gallery-image {
    background: #fff;
    border: 1px solid #dbe4ef;
    border-radius: 6px;
    display: block;
    height: 210px;
    object-fit: contain;
    width: 100%;
}

.photo-card figcaption {
    display: grid;
    gap: 4px;
    margin-top: 10px;
}

.photo-card figcaption span {
    color: #475569;
    word-break: break-word;
}

.subhead {
    color: #334155;
    font-size: 15px;
    margin: 18px 0 12px;
}

.drawing-file-list,
.drawing-upload-list,
.drawing-groups {
    display: grid;
    gap: 12px;
}

.drawing-file-head,
.drawing-file-row {
    display: grid;
    grid-template-columns: 1.2fr 150px 170px 1fr 1.2fr;
    gap: 10px;
    align-items: center;
}

.drawing-file-head {
    color: #475569;
    font-weight: 700;
    padding: 0 4px;
}

.drawing-file-row,
.drawing-upload-row,
.drawing-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 12px;
}

.drawing-file-row small,
.drawing-meta span {
    color: #64748b;
    display: block;
    margin-top: 4px;
}

.drawing-upload-row {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 160px 110px 120px 150px minmax(220px, 1fr) minmax(220px, 1fr);
    gap: 12px;
}

.insert-detail-list {
    display: grid;
    gap: 12px;
}

.insert-detail-head,
.insert-detail-row {
    display: grid;
    grid-template-columns: 80px 1fr 1fr 100px 1fr 1fr 110px minmax(220px, 1.4fr) 80px;
    gap: 10px;
    align-items: start;
}

.insert-detail-head {
    color: #475569;
    font-weight: 700;
    padding: 0 4px;
}

.insert-detail-row {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 12px;
}

.new-insert-row {
    grid-template-columns: 80px 1fr 1fr 100px 1fr 1fr 110px minmax(220px, 1.4fr);
}

.insert-photo-cell {
    display: grid;
    gap: 8px;
}

.insert-delete-check {
    margin-top: 28px;
}

.insert-preview-cell {
    min-width: 86px;
}

.insert-photo-grid,
.insert-preview-grid {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
}

.insert-photo-item {
    align-items: start;
    display: grid;
    gap: 5px;
}

.insert-preview-grid {
    grid-template-columns: repeat(2, 64px);
}

.insert-preview-grid .image-button {
    width: 64px;
}

.insert-preview-grid .list-thumb {
    height: 58px;
    width: 64px;
}

.drawing-version-fields {
    display: grid;
    gap: 8px;
}

.checkline {
    align-items: center;
    color: #475569;
    display: inline-flex;
    gap: 6px;
    font-weight: 700;
}

.checkline input {
    min-height: 0;
    width: auto;
}

.upload-checkline {
    align-self: end;
    min-height: 36px;
}

.drawing-group h4 {
    background: #edf2f7;
    border-radius: 6px;
    color: #334155;
    font-size: 15px;
    margin: 0 0 10px;
    padding: 8px 10px;
}

.drawing-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.drawing-card {
    display: grid;
    gap: 10px;
}

.latest-card {
    border-color: #1f6feb;
    box-shadow: 0 0 0 1px rgba(31, 111, 235, 0.2);
}

.void-card {
    background: #f1f5f9;
    opacity: 0.82;
}

.drawing-card-head {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.version-tag,
.latest-tag,
.status-tag {
    border-radius: 999px;
    display: inline-flex;
    font-weight: 700;
    line-height: 1;
    padding: 6px 10px;
}

.version-tag {
    background: #e8eef7;
    color: #334155;
}

.latest-tag {
    background: #1f6feb;
    color: #fff;
}

.status-tag {
    background: #dcfce7;
    color: #166534;
}

.status-tag.void {
    background: #fee2e2;
    color: #991b1b;
}

.old-drawing-files {
    margin-top: 12px;
}

.old-drawing-files summary {
    background: #fff7ed;
    border: 1px solid #fed7aa;
    border-radius: 6px;
    color: #9a3412;
    cursor: pointer;
    font-weight: 700;
    margin-bottom: 10px;
    padding: 10px 12px;
}

.drawing-preview iframe {
    background: #fff;
    border: 1px solid #dbe4ef;
    border-radius: 6px;
    height: 300px;
    width: 100%;
}

.drawing-image {
    background: #fff;
    border: 1px solid #dbe4ef;
    border-radius: 6px;
    display: block;
    height: 260px;
    object-fit: contain;
    width: 100%;
}

.file-icon {
    align-items: center;
    background: #eef2f7;
    border: 1px solid #dbe4ef;
    border-radius: 6px;
    color: #334155;
    display: flex;
    font-size: 22px;
    font-weight: 700;
    height: 120px;
    justify-content: center;
}

.drawing-meta strong {
    display: block;
    word-break: break-all;
}

.drawing-actions {
    display: flex;
    gap: 8px;
}

.drawing-actions form {
    margin: 0;
}

.danger-button {
    background: #fff;
    border-color: #f3b5af;
    color: var(--danger);
}

.danger-button:hover {
    background: #fde8e7;
    color: var(--danger);
}

.image-modal {
    align-items: center;
    background: rgba(15, 23, 42, 0.86);
    display: flex;
    flex-direction: column;
    gap: 14px;
    inset: 0;
    justify-content: center;
    padding: 28px;
    position: fixed;
    z-index: 1000;
}

.image-modal[hidden] {
    display: none;
}

.modal-image-stage {
    align-items: center;
    display: flex;
    height: 76vh;
    justify-content: center;
    max-width: 92vw;
    width: 92vw;
}

.image-modal img {
    background: #fff;
    border-radius: 8px;
    max-height: 76vh;
    max-width: 92vw;
    object-fit: contain;
    transform: rotate(var(--modal-image-rotation, 0deg));
    transition: transform 0.15s ease;
}

.image-modal img.is-sideways {
    max-height: 86vw;
    max-width: 76vh;
}

.image-modal p {
    color: #fff;
    font-size: 16px;
    margin: 0;
}

.modal-toolbar {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
    width: min(92vw, 960px);
}

.image-modal > .modal-close {
    align-self: flex-end;
}

.modal-tool-button,
.modal-close {
    background: #fff;
    border-color: #fff;
    color: #172033;
    min-height: 34px;
    padding: 0 12px;
}

.modal-tool-button:hover,
.modal-close:hover {
    background: #e2e8f0;
    color: #172033;
}

.modal-tool-button.secondary {
    background: transparent;
    border-color: rgba(255, 255, 255, 0.72);
    color: #fff;
}

.modal-tool-button.secondary:hover {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
}

.modal-tool-button.save {
    background: #246b4f;
    border-color: #246b4f;
    color: #fff;
}

.modal-tool-button.save:hover {
    background: #1b513c;
    color: #fff;
}

.modal-tool-button:disabled {
    background: rgba(255, 255, 255, 0.55);
    border-color: rgba(255, 255, 255, 0.55);
    color: #64748b;
    cursor: not-allowed;
}

.modal-nav {
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(255, 255, 255, 0.92);
    border-radius: 50%;
    color: #172033;
    font-size: 42px;
    height: 58px;
    line-height: 1;
    min-height: 58px;
    padding: 0;
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    width: 58px;
}

.modal-nav:hover {
    background: #e2e8f0;
    color: #172033;
}

.modal-nav[hidden] {
    display: none;
}

.modal-prev {
    left: 32px;
}

.modal-next {
    right: 32px;
}

.detail-grid {
    margin: 0;
}

.detail-grid div {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 10px;
}

dd {
    margin: 0;
    min-height: 22px;
    white-space: pre-wrap;
    word-break: break-word;
}

@media (max-width: 900px) {
    .topbar,
    .form-head,
    .detail-head,
    .bottom-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .search-bar,
    .search-panel {
        grid-template-columns: 1fr;
    }

    .product-query-form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .product-query-keyword {
        grid-column: 1 / -1;
    }

    .product-query-submit {
        grid-column: 1 / -1;
    }

    .query-assist-row {
        align-items: flex-start;
        flex-direction: column;
    }

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

    .all-products-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .series-part-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .import-path-form,
    .batch-grid,
    .inline-form,
    .result-grid {
        grid-template-columns: 1fr;
    }

    .grid,
    .detail-grid,
    .photo-edit-grid,
    .photo-gallery,
    .drawing-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .drawing-file-head {
        display: none;
    }

    .drawing-file-row,
    .drawing-upload-row,
    .insert-detail-head,
    .insert-detail-row,
    .new-insert-row {
        grid-template-columns: 1fr;
    }
}

/* One-screen readable production risk cards */
.schedule-risk-list-head,
.schedule-today-card-head,
.schedule-risk-card-head {
    display: flex;
    align-items: center;
    gap: 10px;
}

.schedule-risk-list-head {
    justify-content: space-between;
    margin-bottom: 12px;
}

.schedule-risk-list-head h3 {
    margin: 0;
}

.schedule-risk-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    color: var(--muted);
    font-size: 13px;
}

.schedule-risk-stats .danger-text {
    color: #b42318;
}

.schedule-risk-cards,
.schedule-today-cards {
    display: grid;
    gap: 10px;
}

.schedule-today-summary {
    padding: 0;
    overflow: hidden;
}

.schedule-today-summary > summary {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 18px;
    min-height: 52px;
    cursor: pointer;
    list-style: none;
    padding: 10px 16px;
    color: var(--muted);
    font-size: 13px;
}

.schedule-today-summary > summary::-webkit-details-marker {
    display: none;
}

.schedule-today-summary > summary > strong {
    color: var(--text);
    font-size: 16px;
}

.schedule-today-summary > summary b {
    color: var(--text);
}

.schedule-today-toggle {
    margin-left: auto;
    border: 1px solid var(--primary);
    border-radius: 6px;
    color: var(--primary);
    font-weight: 700;
    padding: 5px 9px;
}

.schedule-today-toggle i {
    font-style: normal;
}

.schedule-today-summary .when-open,
.schedule-today-summary[open] .when-closed {
    display: none;
}

.schedule-today-summary[open] .when-open {
    display: inline;
}

.schedule-today-compact-list {
    border-top: 1px solid var(--line);
    max-height: 330px;
    overflow-y: auto;
    padding: 0 16px;
}

.schedule-today-compact-row {
    display: flex;
    align-items: center;
    gap: 12px;
    border-bottom: 1px solid #edf1f5;
    padding: 9px 0;
}

.schedule-today-compact-row:last-child {
    border-bottom: 0;
}

.schedule-today-compact-main {
    display: flex;
    align-items: center;
    flex: 1;
    flex-wrap: wrap;
    gap: 5px 10px;
    min-width: 0;
    font-size: 12px;
}

.schedule-today-compact-main > span:not(.risk-tag) {
    color: var(--muted);
}

.schedule-today-compact-main .schedule-today-missing {
    color: #7e22ce;
    font-weight: 700;
}

.schedule-today-compact-actions {
    display: flex;
    gap: 6px;
    white-space: nowrap;
}

.schedule-today-compact-actions a,
.schedule-today-compact-actions button {
    border: 1px solid var(--line);
    border-radius: 5px;
    background: #fff;
    color: var(--primary);
    font-size: 11px;
    min-height: 0;
    padding: 4px 7px;
}

.schedule-risk-card,
.schedule-today-card {
    border: 1px solid var(--line);
    border-left: 5px solid #64748b;
    border-radius: 9px;
    background: #fff;
    padding: 13px 14px;
}

.risk-card-danger { border-left-color: #dc2626; }
.risk-card-urgent { border-left-color: #f97316; }
.risk-card-attention { border-left-color: #eab308; }
.risk-card-normal { border-left-color: #16a34a; }
.risk-card-stock { border-left-color: #64748b; }
.risk-card-missing { border-left-color: #7c3aed; }

.schedule-risk-card-head {
    position: relative;
    padding-right: 84px;
}

.schedule-risk-identity {
    min-width: 0;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 3px;
}

.schedule-data-gap-tag {
    border-radius: 999px;
    background: #f3e8ff;
    color: #7e22ce;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 7px;
}

.schedule-order-actions {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 4;
}

.schedule-order-actions summary {
    cursor: pointer;
    list-style: none;
    border: 1px solid var(--primary);
    border-radius: 6px;
    color: var(--primary);
    font-size: 12px;
    font-weight: 700;
    padding: 5px 9px;
    white-space: nowrap;
}

.schedule-order-actions > div {
    position: absolute;
    right: 0;
    top: calc(100% + 5px);
    display: grid;
    min-width: 150px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 9px 24px rgba(15, 23, 42, .16);
}

.schedule-order-actions a,
.schedule-order-actions button {
    display: block;
    width: 100%;
    border: 0;
    border-radius: 0;
    background: #fff;
    color: var(--text);
    font-size: 13px;
    font-weight: 500;
    padding: 9px 11px;
    text-align: left;
}

.schedule-order-actions a:hover,
.schedule-order-actions button:hover {
    background: #f1f5f9;
}

.schedule-risk-metrics {
    display: grid;
    grid-template-columns: repeat(7, minmax(80px, 1fr));
    gap: 8px;
    margin-top: 11px;
}

.schedule-risk-metrics > div {
    display: grid;
    gap: 3px;
    padding: 8px 10px;
    border-radius: 7px;
    background: #f8fafc;
}

.schedule-risk-metrics span {
    color: var(--muted);
    font-size: 11px;
}

.schedule-risk-metrics strong {
    font-size: 16px;
}

.schedule-risk-timing {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    margin-top: 10px;
    color: #475569;
    font-size: 13px;
}

.schedule-risk-timing strong {
    color: #0f172a;
}

.schedule-risk-suggestion,
.schedule-today-card > p {
    display: -webkit-box;
    overflow: hidden;
    margin: 10px 0 0;
    color: #334155;
    font-size: 13px;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.schedule-order-detail {
    margin-top: 9px;
    border-top: 1px dashed var(--line);
    padding-top: 7px;
}

.schedule-order-detail summary {
    cursor: pointer;
    color: var(--muted);
    font-size: 12px;
}

.schedule-order-detail-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px 16px;
    margin-top: 9px;
    font-size: 12px;
}

.schedule-order-detail-grid .wide {
    grid-column: 1 / -1;
}

.schedule-today-card-head strong {
    flex: 1;
    min-width: 0;
}

.schedule-today-data {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
    margin-top: 9px;
}

.schedule-today-data span {
    padding: 7px 9px;
    border-radius: 6px;
    background: #f8fafc;
    color: var(--muted);
    font-size: 12px;
}

.schedule-today-data strong {
    color: var(--text);
}

@media (max-width: 1000px) {
    .schedule-risk-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .schedule-order-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 650px) {
    .schedule-risk-list-head { align-items: flex-start; flex-direction: column; }
    .schedule-risk-card-head { align-items: flex-start; flex-direction: column; }
    .schedule-risk-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .schedule-today-data { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .schedule-order-detail-grid { grid-template-columns: 1fr; }
    .schedule-today-summary > summary { align-items: flex-start; flex-direction: column; gap: 5px; }
    .schedule-today-toggle { margin-left: 0; }
    .schedule-today-compact-row { align-items: flex-start; flex-direction: column; }
}

/* Order-first scheduling workbench */
.schedule-workbench-nav {
    align-items: center;
}

.schedule-advanced-nav {
    position: relative;
}

.schedule-advanced-nav > summary {
    cursor: pointer;
    list-style: none;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #fff;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    padding: 8px 12px;
}

.schedule-advanced-nav > div {
    position: absolute;
    z-index: 20;
    top: calc(100% + 5px);
    left: 0;
    display: grid;
    min-width: 160px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 10px 25px rgba(15, 23, 42, .15);
}

.schedule-advanced-nav > div a {
    border: 0;
    border-radius: 0;
    color: var(--text);
    font-size: 12px;
    padding: 9px 12px;
}

.schedule-workbench-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
    padding: 11px 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
}

.schedule-summary-grid {
    grid-template-columns: repeat(8, minmax(105px, 1fr));
}

.schedule-workbench-row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 9px;
}

.schedule-workbench-row-actions button,
.schedule-workbench-row-actions .button {
    min-height: 28px;
    border-radius: 5px;
    font-size: 11px;
    padding: 4px 8px;
}

.schedule-workbench-dialog {
    width: min(720px, calc(100vw - 30px));
    max-height: calc(100vh - 40px);
    overflow: auto;
    border: 0;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 24px 65px rgba(15, 23, 42, .28);
    padding: 0;
}

.schedule-workbench-dialog::backdrop {
    background: rgba(15, 23, 42, .46);
}

.schedule-workbench-dialog > form,
.schedule-binding-dialog {
    padding: 18px;
}

.schedule-dialog-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line);
}

.schedule-dialog-head h3 {
    margin: 0;
}

.schedule-dialog-head button {
    width: 32px;
    min-height: 32px;
    border: 0;
    background: transparent;
    color: var(--muted);
    font-size: 22px;
    padding: 0;
}

.schedule-dialog-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
}

.schedule-dialog-grid label,
.schedule-import-dialog label,
.schedule-quick-dialog label {
    display: grid;
    gap: 5px;
}

.schedule-dialog-grid label > span,
.schedule-import-dialog label > span,
.schedule-quick-dialog label > span {
    color: #334155;
    font-size: 12px;
    font-weight: 700;
}

.schedule-dialog-grid .wide {
    grid-column: 1 / -1;
}

.schedule-dialog-grid small,
.muted-note,
.schedule-dialog-order-code {
    color: var(--muted);
    font-size: 12px;
}

.schedule-dialog-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 16px;
}

.schedule-import-dialog form > label {
    margin-top: 10px;
}

.schedule-preview-dialog {
    width: min(1420px, calc(100vw - 48px));
}

.schedule-preview-dialog .schedule-dialog-head p {
    color: var(--muted);
    font-size: 12px;
    margin: 4px 0 0;
}

.schedule-preview-summary {
    display: grid;
    grid-template-columns: repeat(5, minmax(100px, 1fr));
    gap: 8px;
    margin: 14px 0;
}

.schedule-preview-summary div { background: #f8fafc; border: 1px solid var(--line); border-radius: 7px; display: grid; padding: 9px 12px; }
.schedule-preview-summary span { color: var(--muted); font-size: 12px; }
.schedule-preview-summary strong { color: var(--primary); font-size: 20px; }
.schedule-preview-summary div.is-update { background: #eff6ff; border-color: #93c5fd; }
.schedule-preview-summary div.is-update span,
.schedule-preview-summary div.is-update strong { color: #1d4ed8; }
.schedule-preview-table-wrap { border: 1px solid var(--line); border-radius: 7px; max-height: 52vh; overflow: auto; }
.schedule-preview-table { border-collapse: collapse; font-size: 12px; min-width: 1180px; width: 100%; }
.schedule-preview-table th { background: #f1f5f9; position: sticky; top: 0; z-index: 1; }
.schedule-preview-table th, .schedule-preview-table td { border-bottom: 1px solid var(--line); padding: 8px 9px; text-align: left; white-space: nowrap; }
.schedule-preview-table tr.is-update td { background: #eff6ff; border-bottom-color: #bfdbfe; }
.schedule-preview-table tr.is-update:hover td { background: #dbeafe; }
.schedule-preview-action.is-update { background: #2563eb; border-radius: 999px; color: #fff; display: inline-block; font-weight: 700; padding: 2px 8px; }
.schedule-preview-table .schedule-preview-duplicate { color: #1d4ed8; font-weight: 700; }
.schedule-preview-table tr.has-warning td:last-child { color: #b45309; font-weight: 700; }
.schedule-preview-errors { background: #fff7ed; border: 1px solid #fed7aa; border-radius: 7px; color: #9a3412; font-size: 12px; margin-top: 10px; padding: 10px 14px; }
.schedule-preview-errors ul { margin: 6px 0 0; padding-left: 20px; }

@media (max-width: 760px) {
    .schedule-preview-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.schedule-binding-filters {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(130px, .45fr) minmax(130px, .45fr);
    gap: 8px;
    margin: 12px 0;
}

.schedule-binding-candidates {
    display: grid;
    gap: 7px;
    max-height: 430px;
    overflow-y: auto;
}

.schedule-binding-candidate {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid var(--line);
    border-radius: 7px;
    padding: 9px 10px;
}

.schedule-binding-candidate > div {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.schedule-binding-candidate span {
    color: var(--muted);
    font-size: 11px;
}

.schedule-binding-candidate button {
    min-height: 29px;
    white-space: nowrap;
    font-size: 11px;
    padding: 5px 9px;
}

@media (max-width: 1100px) {
    .schedule-summary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 650px) {
    .schedule-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .schedule-dialog-grid,
    .schedule-binding-filters { grid-template-columns: 1fr; }
    .schedule-dialog-grid .wide { grid-column: auto; }
    .schedule-binding-candidate { align-items: flex-start; flex-direction: column; }
}

/* Independent retouch-image export */
.more-actions-menu {
    position: relative;
    align-self: center;
}

.more-actions-menu summary {
    cursor: pointer;
    color: var(--muted);
    font-size: 13px;
    list-style: none;
    padding: 7px 9px;
}

.more-actions-menu a {
    position: absolute;
    right: 0;
    z-index: 8;
    min-width: 120px;
    padding: 9px 12px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .12);
    white-space: nowrap;
}

.retouch-filter-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(160px, 1fr));
    gap: 12px;
}

.retouch-filter-grid label {
    display: grid;
    gap: 5px;
}

.retouch-filter-grid label span {
    color: var(--muted);
    font-size: 12px;
}

.retouch-filter-actions {
    display: flex;
    align-items: end;
    gap: 8px;
}

.retouch-empty-step {
    text-align: center;
    padding: 40px 20px;
}

.retouch-empty-step h3,
.retouch-empty-step p,
.retouch-product-summary h3,
.retouch-product-summary p {
    margin: 0;
}

.retouch-empty-step p,
.retouch-product-summary p {
    margin-top: 7px;
    color: var(--muted);
}

.retouch-image-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.retouch-image-toolbar h3,
.retouch-image-toolbar p {
    margin: 0;
}

.retouch-image-toolbar p {
    color: var(--muted);
    font-size: 13px;
}

.retouch-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.retouch-image-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 14px;
}

.retouch-image-card {
    position: relative;
    display: grid;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #fff;
    cursor: pointer;
}

.retouch-image-card > input {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 2;
    width: 20px;
    height: 20px;
}

.retouch-image-card > img {
    width: 100%;
    height: 190px;
    object-fit: contain;
    background: #f1f5f9;
}

.retouch-image-meta {
    display: grid;
    gap: 5px;
    padding: 12px;
}

.retouch-image-meta span {
    color: var(--muted);
    font-size: 12px;
}

.retouch-status {
    justify-self: start;
    padding: 3px 8px;
    border-radius: 999px;
    background: #e2e8f0;
}

.retouch-status-已导出待修图 { background: #fef3c7; color: #92400e !important; }
.retouch-status-已修图 { background: #dcfce7; color: #166534 !important; }

.retouch-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 18px;
}

@media (max-width: 900px) {
    .retouch-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
    .retouch-filter-grid { grid-template-columns: 1fr; }
    .retouch-image-toolbar { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 560px) {
    .container {
        padding: 14px;
    }

    .topbar {
        padding: 16px;
    }

    .grid,
    .detail-grid,
    .photo-edit-grid,
    .photo-gallery,
    .drawing-cards,
    .all-products-grid,
    .series-part-grid {
        grid-template-columns: 1fr;
    }

    .wide {
        grid-column: span 1;
    }
}

/* 交期排产模块 */
.schedule-page-head {
    margin-bottom: 12px;
}

.schedule-page-head p {
    color: var(--muted);
    margin: 5px 0 0;
}

.schedule-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.schedule-nav a {
    background: #fff;
    border: 1px solid var(--primary);
    border-radius: 6px;
    color: var(--primary);
    font-weight: 700;
    padding: 8px 14px;
}

.schedule-nav a.active,
.schedule-nav a:hover {
    background: var(--primary);
    color: #fff;
}


.schedule-summary-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-bottom: 14px;
}

.schedule-summary-card {
    background: #fff;
    border: 1px solid var(--line);
    border-left: 5px solid #64748b;
    border-radius: 6px;
    display: grid;
    gap: 5px;
    min-height: 76px;
    padding: 12px;
}

.schedule-summary-card span {
    color: var(--muted);
    font-size: 12px;
}

.schedule-summary-card strong {
    font-size: 24px;
}

.schedule-summary-card.risk-danger { border-left-color: #dc2626; }
.schedule-summary-card.risk-urgent { border-left-color: #ea580c; }
.schedule-summary-card.risk-attention { border-left-color: #eab308; }
.schedule-summary-card.risk-missing { border-left-color: #a855f7; }
.schedule-summary-card.risk-stock { border-left-color: #64748b; }

.schedule-filter-grid,
.schedule-capacity-form {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.schedule-filter-grid label,
.schedule-capacity-form label {
    display: grid;
    gap: 5px;
}

.schedule-filter-grid label > span,
.schedule-capacity-form label > span {
    color: #334155;
    font-size: 12px;
    font-weight: 700;
}

.schedule-filter-grid .schedule-check {
    align-items: center;
    align-self: end;
    display: flex;
    min-height: 38px;
}

.schedule-filter-grid .schedule-check input {
    height: 18px;
    width: 18px;
}

.schedule-filter-actions,
.schedule-form-actions {
    align-items: end;
    display: flex;
    gap: 8px;
}

.schedule-filter-panel { padding: 14px 16px; }
.schedule-filter-head { align-items: center; display: flex; flex-wrap: wrap; gap: 10px 18px; justify-content: space-between; }
.schedule-filter-head h3 { margin: 0; }
.schedule-quick-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.schedule-quick-filters a { background: #f1f5f9; border: 1px solid #dbe3ee; border-radius: 999px; color: #475569; font-size: 12px; font-weight: 700; padding: 5px 11px; text-decoration: none; }
.schedule-quick-filters a:hover,
.schedule-quick-filters a.active { background: #2563eb; border-color: #2563eb; color: #fff; }
.schedule-filter-form { border-top: 1px solid var(--line); margin-top: 10px; padding-top: 10px; }
.schedule-filter-primary { align-items: end; display: grid; gap: 9px; grid-template-columns: minmax(220px, 1.3fr) minmax(150px, .75fr) minmax(290px, 1.25fr) minmax(150px, .75fr) auto; }
.schedule-filter-primary label,
.schedule-advanced-filter label { display: grid; gap: 5px; }
.schedule-filter-primary label > span,
.schedule-advanced-filter label > span { color: #334155; font-size: 12px; font-weight: 700; }
.schedule-date-range > div { align-items: center; border: 1px solid var(--line); border-radius: 6px; display: grid; grid-template-columns: 1fr auto 1fr; min-height: 38px; overflow: hidden; }
.schedule-date-range > div:focus-within { border-color: var(--primary); box-shadow: 0 0 0 2px rgba(37, 99, 235, .12); }
.schedule-date-range input { border: 0; border-radius: 0; min-width: 0; }
.schedule-date-range input:focus { box-shadow: none; outline: 0; }
.schedule-date-range i { color: var(--muted); font-size: 12px; font-style: normal; }
.schedule-filter-primary .schedule-filter-actions { align-items: center; align-self: end; white-space: nowrap; }
.schedule-filter-primary .schedule-filter-actions button,
.schedule-filter-primary .schedule-filter-actions .button { min-height: 38px; padding: 7px 12px; }
.schedule-advanced-filter { margin-top: 9px; }
.schedule-advanced-filter summary { color: #475569; cursor: pointer; display: inline-flex; font-size: 12px; font-weight: 700; gap: 7px; }
.schedule-advanced-filter summary b { background: #dbeafe; border-radius: 999px; color: #1d4ed8; font-size: 10px; padding: 1px 6px; }
.schedule-advanced-filter > div { background: #f8fafc; border: 1px solid var(--line); border-radius: 7px; display: grid; gap: 9px; grid-template-columns: repeat(3, minmax(140px, 220px)); margin-top: 8px; padding: 10px; }
.schedule-active-filters { align-items: center; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.schedule-active-filters > span { color: var(--muted); font-size: 12px; }
.schedule-active-filters a { background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 999px; color: #1d4ed8; font-size: 12px; padding: 4px 9px; text-decoration: none; }
.schedule-active-filters a b { font-size: 14px; margin-left: 3px; }
.schedule-active-filters a.clear-all { background: transparent; border-color: transparent; color: #64748b; text-decoration: underline; }

.schedule-capacity-form .wide {
    grid-column: span 2;
}

.schedule-upload-form {
    align-items: center;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(260px, 1fr) auto;
}

.order-upload-form {
    align-items: end;
    grid-template-columns: minmax(220px, 0.8fr) minmax(320px, 1.2fr) auto;
}

.schedule-import-customer,
.schedule-import-file {
    color: var(--text);
    display: grid;
    font-size: 13px;
    font-weight: 600;
    gap: 6px;
}

.schedule-import-customer input,
.schedule-import-file input {
    font-weight: 400;
    width: 100%;
}

.schedule-column-help {
    color: var(--muted);
    font-size: 12px;
    margin: 10px 0 0;
}

.schedule-result-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.schedule-result-grid div {
    background: #f8fafc;
    border: 1px solid var(--line);
    border-radius: 6px;
    display: grid;
    padding: 10px;
}

.schedule-result-grid strong {
    color: var(--primary);
    font-size: 22px;
}

.schedule-result-grid span {
    color: var(--muted);
    font-size: 12px;
}

.schedule-import-errors {
    background: #fff1f2;
    border: 1px solid #fecdd3;
    color: #9f1239;
    margin: 10px 0 0;
    padding: 10px 10px 10px 30px;
}

.schedule-board-panel h3 {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.schedule-table-wrap {
    max-height: calc(100vh - 330px);
    min-height: 260px;
    overflow: auto;
}

.schedule-table {
    min-width: 1550px;
}

.schedule-table thead th {
    background: #eaf0f7;
    position: sticky;
    top: 0;
    z-index: 2;
}

.schedule-table th,
.schedule-table td {
    font-size: 12px;
    padding: 8px 7px;
    text-align: center;
    vertical-align: middle;
}

.schedule-risk-row.risk-danger { box-shadow: inset 4px 0 #dc2626; }
.schedule-risk-row.risk-urgent { box-shadow: inset 4px 0 #ea580c; }
.schedule-risk-row.risk-attention { box-shadow: inset 4px 0 #eab308; }
.schedule-risk-row.risk-normal { box-shadow: inset 4px 0 #16a34a; }
.schedule-risk-row.risk-stock { box-shadow: inset 4px 0 #64748b; background: #f8fafc; }
.schedule-risk-row.risk-missing { box-shadow: inset 4px 0 #a855f7; background: #fdf4ff; }

.schedule-editable-row {
    cursor: pointer;
}

.schedule-editable-row:hover td,
.schedule-editable-row:focus td {
    background-color: #eff6ff;
}

.schedule-inline-edit {
    color: var(--text);
    text-decoration: none;
}

.schedule-inline-edit:hover {
    color: var(--primary);
}

.schedule-edit-button {
    white-space: nowrap;
}

.schedule-product-code-cell {
    align-items: center;
    display: flex;
    gap: 6px;
    justify-content: center;
    white-space: nowrap;
}

.schedule-product-code-cell .match-tag {
    display: inline-block;
    margin-top: 0;
}

.schedule-edit-section-title {
    border-top: 1px solid var(--line);
    grid-column: 1 / -1;
    margin-top: 6px;
    padding-top: 14px;
}

.schedule-edit-section-title h3,
.schedule-edit-section-title p {
    margin: 0;
}

.schedule-edit-section-title p {
    color: var(--muted);
    font-size: 12px;
    margin-top: 4px;
}

.risk-tag,
.match-tag,
.priority-tag {
    border-radius: 999px;
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
    padding: 3px 8px;
    white-space: nowrap;
}

.risk-tag.risk-danger { background: #fee2e2; color: #b91c1c; }
.risk-tag.risk-urgent { background: #ffedd5; color: #c2410c; }
.risk-tag.risk-attention { background: #fef9c3; color: #854d0e; }
.risk-tag.risk-normal { background: #dcfce7; color: #166534; }
.risk-tag.risk-stock { background: #e2e8f0; color: #475569; }
.risk-tag.risk-missing { background: #f3e8ff; color: #7e22ce; }
.match-tag { display: block; margin-top: 4px; width: max-content; }
.match-tag.matched { background: #dcfce7; color: #166534; }
.match-tag.unmatched { background: #fce7f3; color: #9d174d; }
.priority-tag { background: #fee2e2; color: #b91c1c; margin-left: 5px; }
.missing-text { color: #7e22ce; font-weight: 700; }
.number-cell { text-align: center; }

.schedule-data-panel form,
.schedule-data-panel .actions form {
    display: inline-flex;
    margin: 0;
}

.schedule-data-panel .danger-button {
    min-height: 30px;
    padding: 4px 9px;
}

@media (max-width: 1100px) {
    .schedule-summary-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .schedule-filter-grid,
    .schedule-capacity-form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .schedule-filter-primary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .schedule-filter-primary .schedule-filter-actions { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
    .schedule-summary-grid,
    .schedule-result-grid,
    .schedule-filter-grid,
    .schedule-capacity-form,
    .schedule-upload-form {
        grid-template-columns: 1fr;
    }

    .schedule-capacity-form .wide {
        grid-column: span 1;
    }

    .schedule-filter-primary,
    .schedule-advanced-filter > div { grid-template-columns: 1fr; }
    .schedule-filter-head { align-items: flex-start; flex-direction: column; }
}

/* 交期排产工作台：强调可操作性与固定关键列 */
.schedule-page-head {
    align-items: end;
    display: flex;
    justify-content: space-between;
}

.schedule-buffer-form {
    align-items: end;
    display: flex;
    gap: 8px;
}

.schedule-buffer-form label {
    display: grid;
    font-size: 12px;
    font-weight: 700;
    gap: 4px;
    width: 110px;
}

.schedule-summary-card {
    color: var(--text);
    text-decoration: none;
}

.schedule-summary-card:hover {
    background: #f8fafc;
    color: var(--text);
}

.schedule-summary-card.risk-normal { border-left-color: #16a34a; }

.schedule-missing-card {
    position: relative;
}

.schedule-missing-card summary {
    cursor: pointer;
    display: grid;
    gap: 5px;
    list-style: none;
}

.schedule-missing-card summary::-webkit-details-marker { display: none; }

.schedule-missing-breakdown {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 7px;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.16);
    display: grid;
    gap: 4px;
    left: 0;
    min-width: 190px;
    padding: 8px;
    position: absolute;
    top: calc(100% + 6px);
    z-index: 20;
}

.schedule-missing-breakdown a {
    color: var(--text);
    display: flex;
    justify-content: space-between;
    padding: 6px 7px;
}

.schedule-missing-breakdown a:hover { background: #f3e8ff; }

.schedule-today-panel h3,
.schedule-panel-title {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.schedule-today-table { min-width: 1180px; }
.schedule-today-table th,
.schedule-today-table td { font-size: 12px; padding: 8px; text-align: center; }
.schedule-today-table thead th { position: sticky; top: 0; z-index: 2; }
.schedule-today-table-wrap { max-height: 260px; overflow: auto; }

.schedule-table-wrap {
    max-height: calc(100vh - 250px);
    min-height: 360px;
}

.schedule-table {
    min-width: 2050px;
}

.schedule-sticky-table th,
.schedule-sticky-table td {
    background: #fff;
    white-space: nowrap;
}

.schedule-sticky-table thead th { background: #eaf0f7; }

.schedule-sticky-table th:nth-child(1),
.schedule-sticky-table td:nth-child(1) {
    left: 0;
    min-width: 116px;
    position: sticky;
    width: 116px;
    z-index: 4;
}

.schedule-sticky-table th:nth-child(3),
.schedule-sticky-table td:nth-child(3) {
    left: 116px;
    min-width: 120px;
    position: sticky;
    width: 120px;
    z-index: 4;
}

.schedule-sticky-table th:nth-child(5),
.schedule-sticky-table td:nth-child(5) {
    left: 236px;
    min-width: 150px;
    position: sticky;
    width: 150px;
    z-index: 4;
}

.schedule-sticky-table th:nth-child(6),
.schedule-sticky-table td:nth-child(6) {
    box-shadow: 4px 0 5px rgba(15, 23, 42, 0.06);
    left: 386px;
    min-width: 120px;
    position: sticky;
    width: 120px;
    z-index: 4;
}

.schedule-sticky-table th:nth-child(2),
.schedule-sticky-table td:nth-child(2) {
    min-width: 200px;
    position: sticky;
    right: 62px;
    width: 200px;
    z-index: 4;
}

.schedule-sticky-table th:nth-child(16),
.schedule-sticky-table td:nth-child(16) {
    box-shadow: -4px 0 5px rgba(15, 23, 42, 0.06);
    min-width: 62px;
    position: sticky;
    right: 0;
    width: 62px;
    z-index: 4;
}

.schedule-sticky-table thead th:nth-child(1),
.schedule-sticky-table thead th:nth-child(2),
.schedule-sticky-table thead th:nth-child(3),
.schedule-sticky-table thead th:nth-child(5),
.schedule-sticky-table thead th:nth-child(6),
.schedule-sticky-table thead th:nth-child(16) { z-index: 7; }

.schedule-editable-row:hover td,
.schedule-editable-row:focus td { background: #eff6ff; }

.schedule-edit-button {
    font-size: 11px;
    min-height: 27px;
    padding: 3px 8px;
}

.schedule-data-tabs {
    border-bottom: 1px solid var(--line);
    display: flex;
    gap: 4px;
    margin-bottom: 14px;
}

.schedule-data-tabs a {
    border-bottom: 3px solid transparent;
    color: var(--muted);
    font-weight: 700;
    padding: 10px 14px;
}

.schedule-data-tabs a.active {
    border-bottom-color: var(--primary);
    color: var(--primary);
}

.schedule-data-tabs b {
    background: #e2e8f0;
    border-radius: 999px;
    font-size: 11px;
    margin-left: 4px;
    padding: 2px 7px;
}

.schedule-fix-table { min-width: 900px; }
.schedule-fix-table input,
.schedule-fix-table select { min-width: 150px; }
.schedule-batch-actions,
.schedule-validation-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 12px; }

.schedule-validation-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.schedule-validation-grid div {
    background: #f8fafc;
    border: 1px solid var(--line);
    border-radius: 7px;
    display: grid;
    gap: 4px;
    padding: 12px;
}

.schedule-validation-grid span { color: var(--muted); font-size: 12px; }
.schedule-validation-grid strong { font-size: 24px; }
.schedule-validation-grid .validation-warning { background: #fff7ed; border-color: #fed7aa; }

@media (max-width: 900px) {
    .schedule-page-head { align-items: stretch; flex-direction: column; gap: 10px; }
    .schedule-buffer-form { justify-content: flex-start; }
    .schedule-validation-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* AI product identification */
.ai-identify-hero{background:linear-gradient(135deg,#f4f8ff 0%,#fff 65%);border-color:#cfdbef}.ai-identify-heading,.ai-results-title,.ai-candidate-name-row{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}.ai-identify-heading h2,.ai-results-title h2{margin:4px 0 8px}.ai-identify-heading p,.ai-results-title p{margin:0;color:#647087}.ai-eyebrow{font-size:12px;font-weight:800;letter-spacing:.08em;color:#315c9b}.ai-method-note{max-width:360px;padding:10px 14px;border-radius:999px;background:#e9f1ff;color:#315c9b;font-size:13px}.ai-upload-form{margin-top:24px;display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:14px;align-items:stretch}.ai-drop-zone{min-height:190px;border:2px dashed #9db5d9;border-radius:14px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:18px;text-align:center;cursor:pointer;overflow:hidden}.ai-drop-zone:hover{border-color:#315c9b;background:#f8fbff}.ai-drop-zone input{position:absolute;width:1px;height:1px;opacity:0}.ai-drop-zone small{color:#738096}.ai-drop-zone img{max-width:100%;max-height:220px;border-radius:10px;margin-top:8px}.ai-upload-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#e9f1ff;color:#315c9b;font-size:28px}.ai-identify-submit{font-size:17px}.ai-result-panel{margin-top:20px}.ai-query-thumb{width:112px;height:112px;object-fit:contain;border:1px solid #d9e0ea;border-radius:12px;background:#f7f8fa}.ai-confirmed-banner{margin:18px 0;padding:13px 16px;border-radius:10px;background:#e9f7ef;color:#17663a;border:1px solid #bce1ca}.ai-candidate-list{display:grid;gap:14px;margin-top:22px}.ai-candidate-card{position:relative;display:grid;grid-template-columns:30px 190px minmax(0,1fr);gap:18px;padding:16px;border:1px solid #dce2ea;border-radius:14px;background:#fff}.ai-candidate-card.is-confirmed{border:2px solid #3c9b66;background:#fbfffc}.ai-rank{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#243b61;color:#fff;font-weight:800}.ai-standard-image{height:170px;border-radius:10px;background:#f3f5f8;display:grid;place-items:center;overflow:hidden;color:#8490a2}.ai-standard-image img{width:100%;height:100%;object-fit:contain}.ai-candidate-info h3{margin:3px 0 12px;font-size:20px}.ai-factory{font-size:13px;color:#65738a}.ai-score{text-align:right}.ai-score strong{display:block;font-size:25px;color:#315c9b}.ai-score span{font-size:12px;color:#7b8799}.ai-meta-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px;margin:0 0 12px}.ai-meta-grid div{display:grid;grid-template-columns:76px 1fr;gap:8px}.ai-meta-grid dt{color:#7b8799}.ai-meta-grid dd{margin:0;font-weight:600}.ai-mirror-hint{display:inline-block;margin-bottom:12px;padding:5px 9px;border-radius:6px;background:#fff3d6;color:#8a5a00;font-size:12px}.ai-candidate-actions{display:flex;flex-wrap:wrap;gap:9px;align-items:center}.ai-candidate-actions form{margin:0}.ai-candidate-actions button,.ai-candidate-actions .button{white-space:nowrap}
@media(max-width:760px){.ai-identify-heading,.ai-results-title{flex-direction:column}.ai-method-note{max-width:none}.ai-upload-form{grid-template-columns:1fr}.ai-identify-submit{min-height:52px}.ai-candidate-card{grid-template-columns:30px minmax(0,1fr)}.ai-standard-image{grid-column:2;height:210px}.ai-candidate-info{grid-column:2}.ai-meta-grid{grid-template-columns:1fr}.ai-query-thumb{width:100%;height:180px}}
.ai-pipeline{display:flex;align-items:center;gap:7px;overflow-x:auto;margin-top:18px;padding:12px;border-radius:10px;background:#edf3fb;color:#315c9b;scrollbar-width:thin}.ai-pipeline span{flex:0 0 auto;padding:6px 9px;border-radius:7px;background:#fff;border:1px solid #cfdbef;font-size:12px;font-weight:700}.ai-pipeline b{font-weight:400;color:#8ba1c3}.ai-query-images{display:flex;gap:10px}.ai-query-images figure{margin:0;text-align:center}.ai-query-images figcaption{margin-top:4px;color:#6f7d91;font-size:12px}.ai-category-banner{display:flex;align-items:center;gap:10px;margin:16px 0;padding:10px 14px;border-radius:9px;background:#eef7ff;border:1px solid #cce2f5}.ai-category-banner span,.ai-category-banner small{color:#68778b}.ai-category-banner strong{font-size:18px;color:#234f83}.ai-differences{margin:12px 0 15px;padding-top:12px;border-top:1px solid #e4e8ee}.ai-differences h4{margin:0 0 9px;font-size:14px}.ai-difference-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.ai-difference-item{padding:8px 10px;border-radius:8px;border-left:3px solid #d29b2c;background:#fff8e8}.ai-difference-item.close{border-left-color:#3b9961;background:#eef9f2}.ai-difference-item.different{border-left-color:#c34c4c;background:#fff0f0}.ai-difference-item>span{display:flex;justify-content:space-between;gap:8px}.ai-difference-item strong{font-size:12px}.ai-difference-item em{font-style:normal;font-size:12px;font-weight:700}.ai-difference-item small{display:block;margin-top:3px;color:#657083;line-height:1.35}@media(max-width:900px){.ai-difference-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.ai-difference-grid{grid-template-columns:1fr}.ai-query-images{width:100%}.ai-query-images figure{flex:1}.ai-category-banner{align-items:flex-start;flex-wrap:wrap}}
.ai-working{margin-top:14px;padding:14px 18px;border-radius:10px;background:#eaf2ff;border:1px solid #c9daf5;display:flex;align-items:center;justify-content:center;gap:13px;color:#234f83}.ai-working[hidden]{display:none}.ai-working div{display:flex;flex-direction:column;gap:2px}.ai-working small{color:#627797}.ai-spinner{width:28px;height:28px;border:3px solid #b9ccef;border-top-color:#246fe5;border-radius:50%;animation:ai-spin .8s linear infinite}@keyframes ai-spin{to{transform:rotate(360deg)}}.ai-identify-submit:disabled{opacity:.72;cursor:wait}
.ai-drop-zone.is-dragover{border-color:#1769dd;background:#eaf3ff;box-shadow:inset 0 0 0 3px rgba(36,111,229,.12);transform:scale(1.003)}.ai-drop-zone.is-dragover .ai-upload-icon{background:#246fe5;color:#fff;transform:scale(1.08)}.ai-drop-zone,.ai-upload-icon{transition:border-color .16s,background .16s,box-shadow .16s,transform .16s}
.ai-strict-filters{grid-column:1/-1;margin-top:2px;padding:10px 13px;border:1px solid #d7e0ec;border-radius:9px;background:#fff}.ai-strict-filters summary{cursor:pointer;font-weight:700;color:#315c9b}.ai-filter-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0 7px}.ai-filter-grid label{font-size:12px;color:#5f6d80}.ai-filter-grid input,.ai-filter-grid select{margin-top:4px}.ai-strict-filters>small{color:#7a8494}.ai-quality-message{margin:10px 0;padding:10px 13px;border-radius:8px;background:#eef8f2;color:#286442}.ai-quality-message.low{background:#fff1e8;color:#8a421a}.ai-match-checks{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.ai-match-checks span{display:flex;gap:7px;padding:7px 10px;border-radius:7px;background:#eef8f2;color:#286442;font-size:12px}.ai-match-checks span.warning{background:#fff3df;color:#875817}.ai-no-reliable{margin-top:18px;padding:24px;text-align:center;border:1px solid #e3c9c1;border-radius:10px;background:#fff8f5}.ai-no-reliable strong{font-size:18px;color:#8f3e2b}.ai-no-reliable p{margin:7px 0 0;color:#6f6f76}@media(max-width:760px){.ai-filter-grid{grid-template-columns:1fr}}
.ai-result-state{margin:12px 0;padding:10px 14px;border-radius:8px;font-weight:800}.ai-result-state.high{background:#eaf8ef;color:#24623b}.ai-result-state.low{background:#fff4dd;color:#805713}.ai-result-state.failed{background:#fff0ed;color:#913d2e}.ai-confidence{display:inline-block;margin-bottom:5px;padding:4px 8px;border-radius:999px;font-size:12px;font-weight:700}.ai-confidence.high{background:#eaf8ef;color:#24623b}.ai-confidence.low{background:#fff4dd;color:#805713}
.tag.process-parameter-status{border:1px solid transparent;font-weight:700}.tag.process-complete{background:#e7f7ed;border-color:#b9dfc7;color:#237342}.tag.process-missing{background:#f3f4f6;border-color:#d6dae0;color:#626b78}

/* Authentication */
.nav-admin{align-self:center;color:rgba(255,255,255,.78);font-size:13px}.nav-logout-form{display:inline-flex;margin:0}.nav-logout{appearance:none;background:transparent;border:0;cursor:pointer;font:inherit}.login-page{min-height:100vh;background:linear-gradient(135deg,#edf4f2,#f8faf9);display:grid;place-items:center;margin:0;padding:24px}.login-shell{width:min(420px,100%)}.login-card{background:#fff;border:1px solid #d7e2df;border-radius:16px;box-shadow:0 18px 50px rgba(17,60,50,.12);padding:32px}.login-card h1{margin:0 0 8px}.login-card>p{color:#66756f;margin:0 0 24px}.login-card form{display:grid;gap:10px}.login-card label{font-weight:700;margin-top:5px}.login-card input{min-height:44px;border:1px solid #bccdc8;border-radius:8px;padding:0 12px;font-size:16px}.login-card button{min-height:44px;margin-top:12px}
body.role-viewer main form[method="post"],
body.role-viewer main a[href*="/edit"],
body.role-viewer main a[href="/products/new"],
body.role-viewer main a[href="/import-products"],
body.role-viewer main a[href*="order-binding"] {
    display: none !important;
}

.account-create-form,
.account-actions {
    display: flex;
    align-items: end;
    gap: 12px;
    flex-wrap: wrap;
}

.account-create-form label {
    min-width: 240px;
}

.account-create-form input,
.account-actions input {
    display: block;
    margin-top: 6px;
}

.account-actions form {
    display: flex;
    gap: 6px;
}