.csv-workspace{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
.csv-why{display:grid;grid-template-columns:1fr 1.12fr;column-gap:30px;align-items:center;padding:19px 23px 15px;margin:-2px 0 27px;border:1px solid var(--ink);background:var(--surface)}
.csv-why h2{font-size:22px;line-height:1.2;letter-spacing:-.045em;margin:6px 0 8px}.csv-why p{font-size:13px;line-height:1.65;color:var(--muted);margin:0}.csv-why-flow{display:flex;align-items:center;justify-content:space-between;gap:8px}.csv-why-flow span{display:block;min-width:0}.csv-why-flow small{display:block;font:10px/1.45 var(--mono);color:var(--muted);white-space:nowrap}.csv-why-flow b{display:block;font:23px/1.4 var(--mono);letter-spacing:-.04em}.csv-why-flow span:first-child b{background:var(--yellow);padding:0 4px}.csv-why-flow i{font:17px var(--mono);font-style:normal;color:var(--muted)}.csv-why .csv-why-alt{grid-column:1/-1;border-top:1px solid var(--line);padding-top:11px;margin-top:13px}.csv-why-alt strong{color:var(--ink)}
.csv-drop{padding:27px 16px;border:1px dashed var(--ink);background:var(--paper);text-align:center;transition:background .15s}
.csv-drop.drag-over{background:#f5e8a1;outline:2px solid var(--ink);outline-offset:-3px}
.csv-file-icon{width:40px;height:46px;margin-bottom:12px}
.csv-drop strong{display:block;font-size:19px;letter-spacing:-.04em;margin-bottom:8px}
.csv-drop p{font-size:13px;line-height:1.65;color:var(--muted);margin:0 0 16px}
.csv-drop .btn{min-width:150px}.csv-drop .hint{margin-top:12px}
.csv-options{display:flex;align-items:end;gap:20px;margin:20px 0;flex-wrap:wrap}.csv-options>div{flex:1;min-width:135px}.csv-options .check{padding-bottom:11px}
.csv-rule{border-top:1px solid var(--line);padding-top:17px;font-size:13px;line-height:1.7}.csv-rule strong{display:block;margin-bottom:3px}.csv-rule p{margin:0;color:var(--muted)}
.csv-file{font:12px/1.7 var(--mono);overflow-wrap:anywhere;margin:12px 0 0;color:var(--muted)}
.csv-idle{padding:8px 0 15px}.csv-idle>p{font-size:14px;color:var(--muted);line-height:1.7;margin:0 0 18px}
.csv-demo-row{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding:15px 0;font:14px/1.5 var(--mono)}.csv-demo-row:last-child{border-bottom:1px solid var(--line)}.csv-demo-row span:last-child{background:#f4edce;padding:4px 8px}.csv-demo-row i{font-style:normal;color:var(--muted);font-size:12px}
.csv-empty-note{font:11px/1.6 var(--mono)!important;margin-top:15px!important}
.csv-metrics{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);margin:0 0 17px}.csv-metrics>div{padding:13px}.csv-metrics>div+div{border-left:1px solid var(--line)}.csv-metrics strong{display:block;font-size:23px;letter-spacing:-.04em}.csv-metrics span{font:10px/1.6 var(--mono);color:var(--muted)}
.csv-risk-list{display:flex;gap:6px;flex-wrap:wrap;margin:13px 0}.csv-risk{font:11px/1.5 var(--mono);border:1px solid var(--line);padding:5px 8px;background:var(--paper)}.csv-risk.active{background:#f4edce;border-color:#c8b973}
.csv-table-scroll{max-width:100%;overflow:auto;border:1px solid var(--line);max-height:315px}.csv-table{border-collapse:collapse;width:100%;font:12px/1.6 var(--mono);text-align:left}.csv-table th,.csv-table td{padding:10px 12px;border-bottom:1px solid var(--line);border-right:1px solid var(--line);white-space:pre-wrap;overflow-wrap:anywhere;min-width:105px;max-width:250px}.csv-table th{background:var(--paper);font-weight:400}.csv-table td.flagged{background:#faf2ce}.csv-table td:last-child,.csv-table th:last-child{border-right:0}.csv-table tr:last-child td{border-bottom:0}.csv-table .row-number{min-width:36px;color:var(--muted);text-align:right;background:var(--paper)}
.csv-ready{margin:17px 0 0;padding:13px 15px;background:#edf1e7;border:1px solid #b6c3a5;font-size:13px;line-height:1.7}.csv-ready strong{display:block}.csv-export-row{padding-top:18px;border-top:1px solid var(--line);margin-top:20px}.csv-export-row .actions-row{margin-top:14px}.csv-export-row .btn.primary{flex:1}.csv-output .panel-heading{justify-content:space-between}.csv-text-badge{font:10px/1.5 var(--mono);padding:4px 7px;border:1px solid var(--ink);background:var(--yellow);white-space:nowrap}
.csv-examples{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.csv-examples h3{font-size:17px;margin:0 0 7px}.csv-examples code{font:14px var(--mono);background:#f4edce;padding:3px 6px}.csv-examples p{font-size:14px;margin-bottom:0}
.csv-table{width:max-content;min-width:100%}.csv-table td,.csv-table th{white-space:pre;overflow-wrap:normal}
@media(max-width:850px){.csv-workspace{grid-template-columns:1fr}.csv-workspace .panel+.panel{border-left:0;border-top:1px solid var(--ink)}}
@media(max-width:700px){.csv-why{grid-template-columns:1fr;gap:14px}.csv-why-flow{justify-content:flex-start;gap:13px}.csv-why .csv-why-alt{margin-top:0}}
@media(max-width:550px){.csv-examples{grid-template-columns:1fr;gap:22px}.csv-metrics>div{padding:10px}.csv-metrics strong{font-size:21px}.csv-text-badge{font-size:9px}.csv-output .panel-heading{gap:8px}.csv-demo-row{font-size:12px}.csv-demo-row span:last-child{padding:4px}.csv-options{gap:12px}.csv-options .check{font-size:12px}.csv-export-row .btn{width:100%}}
@media(max-width:400px){.csv-why{padding:16px}.csv-why-flow{gap:7px}.csv-why-flow small{font-size:8px}.csv-why-flow b{font-size:18px}}
@media(max-width:400px){.csv-demo-row{font-size:10px;gap:5px}.csv-output .panel-heading{flex-wrap:wrap}.csv-text-badge{margin-left:auto}}
