#dtf-datencheck{--line:#dce3ed;--blue:#1769e0;--muted:#667085;font-family:Arial,Helvetica,sans-serif;box-sizing:border-box;color:#172033}#dtf-datencheck *{box-sizing:border-box}#dtf-datencheck .page{max-width:1220px;margin:auto;padding:28px 20px 50px}#dtf-datencheck h1{margin:0;font-size:29px}#dtf-datencheck .head p{margin:8px 0 20px;color:var(--muted)}#dtf-datencheck .card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:18px}#dtf-datencheck .upload{display:block;border:2px dashed #9db0ca;border-radius:12px;padding:28px;text-align:center;cursor:pointer;background:#fbfcfe}#dtf-datencheck .upload:hover,#dtf-datencheck .upload.drag{border-color:var(--blue);background:#f4f8ff}#dtf-datencheck .upload b{font-size:17px}#dtf-datencheck .upload div{margin-top:7px;color:var(--muted);font-size:13px}#dtf-datencheck .upload input{display:none}#dtf-datencheck .progressBox{display:none;margin-top:14px}#dtf-datencheck .progressTop{display:flex;justify-content:space-between;font-size:13px;font-weight:700;color:#44516a;margin-bottom:7px}#dtf-datencheck .progressTrack{height:9px;background:#e7ebf2;border-radius:999px;overflow:hidden}#dtf-datencheck .progressBar{height:100%;width:0;background:var(--blue);border-radius:999px;transition:width .15s}#dtf-datencheck .hidden{display:none}#dtf-datencheck .sizeIntro{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}#dtf-datencheck h2{font-size:19px;margin:0 0 14px}#dtf-datencheck .sizeIntro h2{margin-bottom:5px}#dtf-datencheck .sizeIntro p,#dtf-datencheck .sizeHint{margin:0;color:var(--muted);font-size:13px;line-height:1.45}#dtf-datencheck .optional{font-size:11px;background:#eef2f7;color:#5d6a7f;padding:4px 7px;border-radius:999px;vertical-align:2px}#dtf-datencheck .sizeFields{display:flex;align-items:end;gap:14px;margin-top:16px;flex-wrap:wrap}#dtf-datencheck .sizeFields label{font-size:12px;font-weight:700;color:#44516a}#dtf-datencheck .sizeFields label>span{display:flex;margin-top:6px;border:1px solid #ccd5e2;border-radius:9px;overflow:hidden;background:#fff}#dtf-datencheck .sizeFields input{display:block;width:130px;border:0;padding:10px 11px;font:inherit;outline:none}#dtf-datencheck .sizeFields em{font-style:normal;padding:10px;background:#f5f7fa;color:#667085;font-size:13px}#dtf-datencheck .lock{padding-bottom:10px;color:#667085;font-size:12px}#dtf-datencheck .sizeHint{margin-top:10px}#dtf-datencheck .linkBtn{border:0;background:transparent;color:#667085;padding:4px;white-space:nowrap}#dtf-datencheck .layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr);gap:18px}#dtf-datencheck .tabs{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}#dtf-datencheck button{font:inherit;font-weight:700;border:1px solid #d4dce8;background:#fff;color:#31415e;border-radius:9px;padding:9px 13px;cursor:pointer}#dtf-datencheck button.active{background:var(--blue);color:#fff;border-color:var(--blue)}#dtf-datencheck button:disabled{opacity:.45;cursor:not-allowed}#dtf-datencheck .previewShell{position:relative;border:1px solid var(--line);border-radius:11px;overflow:hidden;background:#fff;height:500px}#dtf-datencheck .viewport{width:100%;height:100%;overflow:auto;position:relative}#dtf-datencheck .viewport.pan{cursor:grab}#dtf-datencheck canvas{display:block;max-width:none;position:absolute;transform:translate(-50%,-50%)}#dtf-datencheck .zoom{position:absolute;right:12px;bottom:12px;display:flex;gap:5px;background:#fff;padding:6px;border:1px solid var(--line);border-radius:10px;box-shadow:0 3px 12px #0001}#dtf-datencheck .zoom button{padding:6px 10px;min-width:38px}#dtf-datencheck .zoom span{min-width:50px;text-align:center;align-self:center;font-size:12px;font-weight:700}#dtf-datencheck .help{font-size:13px;color:var(--muted);margin:10px 0 0;line-height:1.45}#dtf-datencheck .verdict{border-radius:12px;padding:17px;margin-bottom:14px}#dtf-datencheck .verdict.ok{background:#ecf8f1;color:#12633b}#dtf-datencheck .verdict.warn{background:#fff6e4;color:#7c5200}#dtf-datencheck .verdict.bad{background:#fff0ef;color:#9d251c}#dtf-datencheck .verdict strong{font-size:18px;display:block;margin-bottom:5px}#dtf-datencheck .verdict span{font-size:14px;line-height:1.5}#dtf-datencheck .simple{display:grid;gap:9px}#dtf-datencheck .row{border:1px solid var(--line);border-radius:10px;padding:13px}#dtf-datencheck .rowhead{display:flex;justify-content:space-between;gap:10px;align-items:center}#dtf-datencheck .row b{font-size:14px}#dtf-datencheck .pill{font-size:11px;font-weight:800;padding:4px 8px;border-radius:999px}#dtf-datencheck .pill.ok{background:#e8f6ee;color:#12643b}#dtf-datencheck .pill.warn{background:#fff2d5;color:#805500}#dtf-datencheck .pill.bad{background:#ffe7e5;color:#a1261e}#dtf-datencheck .pill.neutral{background:#eef2f7;color:#5d6a7f}#dtf-datencheck .row p{font-size:13px;color:var(--muted);line-height:1.45;margin:6px 0 0}#dtf-datencheck .details{margin-top:14px;border-top:1px solid var(--line);padding-top:13px}#dtf-datencheck details summary{cursor:pointer;font-size:13px;font-weight:700;color:#44516a}#dtf-datencheck .technical{font-size:12px;color:var(--muted);line-height:1.6;margin-top:9px}#dtf-datencheck .tip{font-size:13px;color:#526079;line-height:1.5;background:#f7f9fc;border-radius:10px;padding:12px;margin-top:14px}@media(max-width:850px){#dtf-datencheck .layout{grid-template-columns:1fr}#dtf-datencheck .previewShell{height:390px}#dtf-datencheck .page{padding:18px 12px 35px}}

#dtf-datencheck .previewHead{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px}
#dtf-datencheck .previewHead>h2{margin:0;padding-top:4px}
#dtf-datencheck .sizeCompact{width:330px;max-width:46%;padding:10px 12px;border:1px solid #dce4ef;border-radius:12px;background:#f8fafc;box-sizing:border-box}
#dtf-datencheck .sizeCompactTop{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;font-size:13px}
#dtf-datencheck .sizeCompactTop .optional{font-size:10px}
#dtf-datencheck .sizeCompact .linkBtn{font-size:12px;padding:0}
#dtf-datencheck .sizeFields.compact{display:grid;grid-template-columns:minmax(0,1fr) 18px minmax(0,1fr);align-items:end;gap:6px}
#dtf-datencheck .sizeFields.compact label{font-size:11px;gap:3px}
#dtf-datencheck .sizeFields.compact label span{min-width:0}
#dtf-datencheck .sizeFields.compact input{width:100%;min-width:0;padding:7px 24px 7px 8px;font-size:13px;box-sizing:border-box}
#dtf-datencheck .sizeFields.compact em{font-size:11px;right:7px}
#dtf-datencheck .sizeFields.compact .lock{font-size:13px;text-align:center;padding-bottom:8px}
#dtf-datencheck .sizeCompact .sizeHint{font-size:11px;line-height:1.3;margin:7px 0 0}
@media(max-width:820px){#dtf-datencheck .previewHead{display:block}#dtf-datencheck .sizeCompact{width:100%;max-width:none;margin-top:12px}}

#dtf-datencheck .rightColumn{display:flex;flex-direction:column;gap:16px;min-width:0}
#dtf-datencheck .rightColumn>.card{width:100%;box-sizing:border-box}
#dtf-datencheck .rightColumn .sizeCompact{max-width:none;width:100%;margin:0}
#dtf-datencheck .sideSize{padding:14px 16px}
#dtf-datencheck .checkCard{flex:1}
@media(max-width:820px){#dtf-datencheck .rightColumn{gap:12px}}
