.csv-safe { max-width: 1024px; }
.csv-safe .hero h1 { max-width: 800px; margin: 0 auto 18px; }
.csv-safe .hero .sub { max-width: 700px; }
.safe-panel { padding: 24px; margin: 22px 0; background: #fff; border: 1px solid #dfe6e1; border-radius: 16px; }
.safe-panel h2 { margin: 0 0 16px; font-size: 21px; letter-spacing: -.02em; }
.safe-panel h3 { font-size: 17px; margin: 22px 0 12px; }
.safe-demo { background: #edf5ef; border-color: #cbe5d6; }
.safe-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.csv-safe button, .csv-safe select, .safe-primary { font: inherit; font-size: 14px; border-radius: 8px; padding: 10px 14px; border: 1px solid #c5d2c9; background: #fff; color: #244932; }
.csv-safe button, .safe-primary { cursor: pointer; }
.csv-safe button:hover, .safe-primary:hover { border-color: #1a7a4f; background: #edf5ef; text-decoration: none; }
.csv-safe .safe-primary { background: #1a7a4f; color: #fff; border-color: #1a7a4f; display: inline-block; }
.csv-safe .safe-primary:hover { background: #125f3c; }
.csv-safe button:disabled { opacity: .5; cursor: not-allowed; }
.safe-settings { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 20px 0 16px; }
.safe-settings label { font-size: 14px; font-weight: 600; }
.safe-settings select { display: block; width: 100%; margin-top: 8px; }
.csv-safe input[type=file] { width: 100%; font: inherit; font-size: 14px; }
.csv-safe input::file-selector-button { font: inherit; padding: 10px 14px; border: 1px solid #c5d2c9; background: #edf5ef; color: #244932; border-radius: 8px; margin-right: 12px; cursor: pointer; }
.csv-safe .small-note { font-size: 13px; color: #58665e; }
.safe-scroll { max-height: 420px; overflow: auto; border: 1px solid #dfe6e1; border-radius: 8px; }
.safe-scroll:empty { display: none; }
.safe-scroll table { border-collapse: collapse; width: 100%; font: 12px/1.6 'IBM Plex Mono', monospace; }
.safe-scroll th, .safe-scroll td { padding: 10px 12px; text-align: left; border-bottom: 1px solid #e4e9e5; border-right: 1px solid #e4e9e5; min-width: 80px; max-width: 280px; overflow-wrap: anywhere; white-space: pre-wrap; }
.safe-scroll th { background: #edf5ef; font-weight: 500; position: sticky; top: 0; }
.safe-counts { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap: 10px; }
.safe-count { border: 1px solid #dfe6e1; border-radius: 8px; padding: 12px; font-size: 13px; }
.safe-count strong { display: block; font-size: 22px; color: #1a7a4f; }
.safe-warning, #safe-error, #safe-compare-error { color: #7b341c; padding: 14px; border: 1px solid #edd0b8; background: #fff4e9; border-radius: 8px; }
#safe-summary, #safe-status { overflow-wrap: anywhere; }
.safe-cta { margin: 30px 0; }
.csv-safe [hidden] { display: none !important; }
.csv-safe :focus-visible { outline: 3px solid #225da7; outline-offset: 3px; }
@media (max-width: 600px) { .safe-panel { padding: 18px 14px; } .safe-settings { grid-template-columns: 1fr; } .csv-safe .hero h1 { font-size: 32px; } .csv-safe { padding: 28px 16px 50px; } .safe-actions > * { max-width: 100%; } }