.ddt-page { width: min(1520px, calc(100% - 36px)); margin: 0 auto; padding: 28px 0 48px; color: var(--text-primary); }
.ddt-page-header { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; margin-bottom: 20px; }
.ddt-page-header h1 { margin: 0; font-size: clamp(1.7rem, 3vw, 2.35rem); }
.ddt-page-header p { margin: 7px 0 0; color: var(--text-secondary); }
.ddt-eyebrow { display: block; margin-bottom: 7px; color: #7aa9ff; font-size: 11px; font-weight: 900; letter-spacing: .16em; }
.ddt-card { margin-bottom: 18px; padding: 20px; border: 1px solid var(--border); border-radius: 18px; background: var(--surface); box-shadow: var(--shadow-md); }
.ddt-section-title { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.ddt-section-title > span { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 10px; background: #214674; color: #a9c9ff; font-size: 12px; font-weight: 900; }
.ddt-section-title h2 { margin: 0; font-size: 16px; }
.ddt-section-title p { margin: 4px 0 0; color: var(--text-muted); font-size: 11px; }
.ddt-upload-grid, .ddt-meta-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.ddt-upload-grid label, .ddt-meta-grid label { display: grid; gap: 7px; color: var(--text-secondary); font-size: 10px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.ddt-upload-grid b, .ddt-meta-grid b { color: #f87171; }
.ddt-upload-grid input, .ddt-upload-grid select, .ddt-upload-grid textarea, .ddt-meta-grid input, .ddt-meta-grid select, .ddt-meta-grid textarea { width: 100%; min-height: 43px; padding: 0 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-soft); color: var(--text-primary); outline: none; box-sizing: border-box; }
.ddt-upload-grid textarea, .ddt-meta-grid textarea { padding-top: 10px; resize: vertical; }
.ddt-span-2 { grid-column: span 2; }
.ddt-form-actions, .ddt-confirm-actions { display: flex; align-items: center; justify-content: flex-end; gap: 12px; }
.ddt-primary, .ddt-secondary { min-height: 43px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 15px; border-radius: 10px; font: inherit; font-size: 10px; font-weight: 900; text-decoration: none; cursor: pointer; }
.ddt-primary { border: 1px solid #4b8bf5; background: #3778dd; color: #fff; }
.ddt-secondary { border: 1px solid var(--border); background: var(--surface-soft); color: var(--text-secondary); }
.ddt-primary:disabled { opacity: .55; cursor: wait; }
#upload-message, #confirm-message { margin-right: auto; color: #fda4af; font-size: 11px; font-weight: 800; }
.ddt-file-info { padding: 11px 13px; border: 1px solid var(--border); border-radius: 10px; background: #101b2b; color: var(--text-secondary); font-size: 11px; }
.ddt-warning { margin-top: 14px; padding: 12px 14px; border: 1px solid #775d27; border-radius: 10px; background: #332a17; color: #facc6b; font-size: 11px; line-height: 1.5; }
.ddt-lines-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; }
.ddt-inline-actions { display: flex; gap: 8px; }
.ddt-table-scroll { overflow-x: auto; }
.ddt-lines-table, .ddt-history-table { width: 100%; border-collapse: collapse; }
.ddt-lines-table { min-width: 1450px; }
.ddt-history-table { min-width: 900px; }
.ddt-lines-table th, .ddt-history-table th { padding: 10px 8px; border-bottom: 1px solid var(--border); background: var(--surface-soft); color: #91a3bc; font-size: 9px; font-weight: 900; text-align: left; text-transform: uppercase; white-space: nowrap; }
.ddt-lines-table td, .ddt-history-table td { padding: 9px 8px; border-bottom: 1px solid rgba(43,59,82,.76); color: var(--text-secondary); font-size: 11px; vertical-align: middle; }
.ddt-lines-table input, .ddt-lines-table select { width: 100%; min-height: 36px; padding: 0 8px; border: 1px solid var(--border); border-radius: 8px; background: #101b2b; color: var(--text-primary); font: inherit; font-size: 10px; box-sizing: border-box; }
.ddt-lines-table .ddt-code { min-width: 125px; }
.ddt-lines-table .ddt-description { min-width: 230px; }
.ddt-lines-table .ddt-product { min-width: 260px; }
.ddt-lines-table .ddt-number { width: 90px; text-align: right; }
.ddt-lines-table tr.ddt-difference td { background: rgba(245,158,11,.09); }
.ddt-lines-table tr.ddt-error td { background: rgba(239,68,68,.08); }
.ddt-lines-table tr.ddt-ignored { opacity: .48; }
.ddt-status { display: inline-flex; padding: 5px 7px; border-radius: 999px; font-size: 8px; font-weight: 900; white-space: nowrap; }
.ddt-status-ok { background: #17372f; color: #83e6bd; }
.ddt-status-review { background: #332a17; color: #facc6b; }
.ddt-status-error { background: #3a2028; color: #fda4af; }
.ddt-status-ignored { background: #263243; color: #9aa9bc; }
.ddt-row-actions { display: flex; gap: 6px; }
.ddt-row-actions button, .ddt-row-actions a { min-height: 32px; padding: 0 8px; display: inline-flex; align-items: center; border: 1px solid var(--border); border-radius: 8px; background: #172b45; color: #a9c9ff; font: inherit; font-size: 9px; font-weight: 800; text-decoration: none; cursor: pointer; white-space: nowrap; }
.ddt-summary { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-bottom: 18px; }
.ddt-summary-item { padding: 13px; border: 1px solid var(--border); border-radius: 11px; background: #101b2b; }
.ddt-summary-item strong, .ddt-summary-item span { display: block; }
.ddt-summary-item strong { color: var(--text-primary); font-size: 19px; }
.ddt-summary-item span { margin-top: 4px; color: var(--text-muted); font-size: 9px; font-weight: 850; text-transform: uppercase; }
.ddt-summary-card.ddt-has-errors { border-color: #753a43; }
.ddt-difference-label { display: block; margin-top: 4px; color: #facc6b; font-size: 8px; font-weight: 900; }
.ddt-history-empty { padding: 28px !important; text-align: center; color: var(--text-muted) !important; }
.ddt-toast { position: fixed; right: 22px; bottom: 22px; z-index: 13000; max-width: 420px; padding: 13px 16px; border: 1px solid #276752; border-radius: 11px; background: #17372f; color: #83e6bd; font-size: 12px; font-weight: 800; opacity: 0; pointer-events: none; transform: translateY(12px); transition: .2s ease; }
.ddt-toast.ddt-show { opacity: 1; transform: translateY(0); }
.ddt-toast.ddt-error-toast { border-color: #753a43; background: #3a2028; color: #fda4af; }
[hidden] { display: none !important; }
@media (max-width: 900px) { .ddt-page-header, .ddt-lines-header { align-items: stretch; flex-direction: column; } .ddt-summary { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .ddt-page { width: calc(100% - 20px); } .ddt-upload-grid, .ddt-meta-grid, .ddt-summary { grid-template-columns: 1fr; } .ddt-span-2 { grid-column: auto; } .ddt-form-actions, .ddt-confirm-actions { align-items: stretch; flex-direction: column; } .ddt-inline-actions { flex-direction: column; } }