.di-page{--di-border:#e5e7ec;--di-surface:#fff;--di-soft:#f7f7fa;--di-muted:#697386;--di-accent:#6d28d9;display:grid;gap:24px}.dark .di-page{--di-border:#34353d;--di-surface:#222326;--di-soft:#2a2b30;--di-muted:#a7abb4;--di-accent:#b095f4}.di-page h2{font-size:18px;font-weight:600}.di-page h3{font-size:15px;font-weight:600}.di-muted{color:var(--di-muted);font-size:14px;line-height:1.6}.di-toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;justify-content:space-between}.di-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.di-steps{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:24px;font-size:13px;color:var(--di-muted)}.di-steps span{padding:8px 12px;border-radius:8px;background:var(--di-soft)}.di-steps [aria-current=step]{color:var(--di-accent);font-weight:600;background:color-mix(in srgb,var(--di-accent) 9%,var(--di-surface))}.di-upload{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(240px,1fr);gap:28px}.di-dropzone{border:1px dashed #a59ac0;border-radius:12px;background:var(--di-soft);padding:28px;display:grid;gap:14px;align-content:center}.di-dropzone strong{font-size:17px}.di-form{display:grid;gap:18px;min-width:0}.di-form label{display:grid;gap:8px;font-size:14px}.di-form input,.di-form select{width:100%;min-height:44px}.di-form fieldset{display:contents}.di-page .btn{min-height:44px;white-space:normal}.di-note{padding:14px 16px;border-radius:10px;background:var(--di-soft);font-size:14px;line-height:1.6}.di-note[role=alert]{border:1px solid #f0ad43;color:inherit}.di-note:empty{display:none}.di-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.di-stat{border:1px solid var(--di-border);border-radius:12px;background:var(--di-surface);padding:18px}.di-stat span{display:block;color:var(--di-muted);font-size:13px}.di-stat strong{display:block;font-size:28px;font-weight:650;margin-top:8px}.di-progress{display:grid;gap:10px;margin-top:18px}.di-progress progress{width:100%;height:8px;accent-color:var(--di-accent)}.di-table{overflow-x:auto;max-width:100%}.di-table table{width:100%}.di-table th,.di-table td{text-align:left;padding:14px 16px;vertical-align:middle;border-bottom:1px solid var(--di-border)}.di-table th{font-size:12px;font-weight:500;color:var(--di-muted);background:var(--di-soft)}.di-table td{font-size:14px}.di-table td:nth-child(3){min-width:180px;overflow-wrap:anywhere}.di-table td small{display:block;max-width:340px;line-height:1.5;color:var(--di-muted);font-size:12px;margin-top:5px}.di-badge{display:inline-flex;padding:5px 9px;border-radius:7px;font-size:12px;font-weight:550;background:var(--di-soft);color:var(--di-muted)}.di-badge[data-kind=ready],.di-badge[data-kind=applied],.di-badge[data-kind=completed]{background:#10b98115;color:#087e59}.dark .di-badge[data-kind=ready],.dark .di-badge[data-kind=applied],.dark .di-badge[data-kind=completed]{color:#60d7ae}.di-badge[data-kind=invalid],.di-badge[data-kind=failed]{background:#dc262615;color:#c13f3f}.dark .di-badge[data-kind=invalid],.dark .di-badge[data-kind=failed]{color:#f48b8b}.di-badge[data-kind=needs_match],.di-badge[data-kind=needs_confirmation],.di-badge[data-kind=completed_with_issues]{background:#f59e0b15;color:#946004}.dark .di-badge[data-kind=needs_match],.dark .di-badge[data-kind=needs_confirmation],.dark .di-badge[data-kind=completed_with_issues]{color:#edbf64}.di-filter{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.di-filter select{min-height:44px;min-width:190px}.di-empty{text-align:center;padding:40px 16px;color:var(--di-muted)}.di-dialog{color:inherit;background:var(--di-surface);border:1px solid var(--di-border);border-radius:16px;box-shadow:0 16px 64px #0004;padding:0;width:min(900px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto;margin:auto}.di-dialog::backdrop{background:#11182780}.di-modal-head,.di-modal-foot{padding:20px 24px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--di-border);background:var(--di-surface)}.di-modal-foot{border-top:1px solid var(--di-border);border-bottom:0;position:sticky;bottom:0;z-index:1;flex-wrap:wrap}.di-modal-body{padding:20px 24px;display:grid;gap:18px}.di-section{background:var(--di-soft);border:1px solid var(--di-border);border-radius:12px;padding:20px;display:grid;gap:14px}.di-section label{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.5}.di-section input[type=checkbox],.di-section input[type=radio]{width:18px;min-height:18px;margin-top:2px;accent-color:var(--di-accent)}.di-section select,.di-section input[type=search]{min-height:44px;width:100%}.di-diff{display:grid;grid-template-columns:140px minmax(0,1fr) minmax(0,1fr);gap:12px;align-items:start;padding:12px 0;border-top:1px solid var(--di-border);font-size:13px;overflow-wrap:anywhere}.di-diff strong{font-size:13px}.di-pager{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:18px}.di-files{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:12px}.di-page [hidden]{display:none!important}.di-page [aria-busy=true]{opacity:.65}.di-page :focus-visible{outline:2px solid var(--di-accent);outline-offset:3px}.di-dialog .di-wide-label{display:grid;gap:8px}.di-dialog .di-table{border-radius:8px}.di-dialog .di-diff-head{font-size:12px;color:var(--di-muted)}
@media(min-width:1600px){.di-upload{grid-template-columns:minmax(0,1.6fr) minmax(300px,1fr)}.di-dialog{width:960px}}
@media(max-width:700px){.di-upload{grid-template-columns:1fr}.di-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.di-stat{padding:14px}.di-table table,.di-table tbody,.di-table tr,.di-table td{display:block}.di-table thead{display:none}.di-table tr{padding:12px 0;border-bottom:1px solid var(--di-border)}.di-table td{padding:6px 14px;border:0}.di-table td:before{content:attr(data-label);display:block;color:var(--di-muted);font-size:12px;margin-bottom:4px}.di-table td:nth-child(3){min-width:0}.di-dialog{width:calc(100% - 16px);max-height:calc(100dvh - 16px)}.di-modal-head,.di-modal-foot,.di-modal-body{padding:16px}.di-section{padding:14px}.di-diff{grid-template-columns:1fr;gap:7px}.di-diff-head{display:none}.di-diff [data-side]:before{content:attr(data-side) ': ';color:var(--di-muted)}.di-actions .btn{flex:1}.di-steps{gap:6px}.di-steps span{padding:7px 9px}.di-dropzone{padding:22px}.di-pager{align-items:stretch}.di-pager .btn{flex:1}}
