*{box-sizing:border-box}
:root{
  --bg:#f7f7fb; --fg:#111; --muted:#666; --accent:#2563eb;
  --card:#fff; --border:#e6e6ef; --warn:#b45309; --shadow:0 10px 25px rgba(0,0,0,.08);
}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font:16px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu}
.topbar{display:flex;justify-content:space-between;align-items:end;gap:16px;padding:20px 24px;background:var(--card);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10}
.topbar h1{margin:0;font-size:20px}
.topbar .limits{display:flex;gap:12px;color:var(--muted);font-size:14px}
main{max-width:1100px;margin:18px auto;padding:0 16px}
.uploader{margin:8px 0 18px}
.dropzone{position:relative;border:2px dashed var(--border);border-radius:18px;background:var(--card);padding:22px;box-shadow:var(--shadow);transition:.15s}
.dropzone:focus-within,.dropzone:hover{border-color:var(--accent);box-shadow:0 10px 30px rgba(37,99,235,.15)}
.drop-inner{display:flex;align-items:center;gap:16px}
.dropzone .icon{font-size:28px}
.dropzone .text{font-size:15px}
.dropzone .hint{color:var(--muted);font-size:13px;margin-top:6px}
#fileInput{position:absolute;inset:0;opacity:0;cursor:pointer}
.linklike{background:none;border:none;color:var(--accent);text-decoration:underline;cursor:pointer;padding:0;font:inherit}
.config details{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:12px;box-shadow:var(--shadow)}
.config .cfg-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.btn{background:var(--accent);color:white;border:none;border-radius:12px;padding:10px 14px;font-weight:600;cursor:pointer;box-shadow:var(--shadow)}
.btn:hover{filter:brightness(.95)}
.stats{display:flex;flex-wrap:wrap;gap:14px;margin:16px 0;color:#222}
.stat{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:10px 12px}
.stat.warn{color:#fff;background:#f59e0b;border-color:#f59e0b}
.table-wrap{background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);overflow:hidden}
.file-table{width:100%;border-collapse:collapse}
.file-table th,.file-table td{padding:12px 10px;border-bottom:1px solid var(--border);vertical-align:top;font-size:14px}
.file-table th{background:#fafafa;text-align:left}
.file-table tr:last-child td{border-bottom:none}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.tag{display:inline-block;padding:3px 8px;border-radius:999px;border:1px solid var(--border);font-size:12px;color:#333;background:#fafafa}
.tag.ok{color:#065f46;background:#d1fae5;border-color:#10b981}
.tag.no{color:#991b1b;background:#fee2e2;border-color:#ef4444}
.iconbtn{background:#eee;border:1px solid var(--border);border-radius:10px;padding:6px 10px;cursor:pointer}
.iconbtn:hover{background:#e8e8e8}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.5);display:grid;place-items:center;padding:24px}
.modal-inner{width:min(100%,1000px);height:min(90vh,800px);background:var(--card);border-radius:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden}
.modal-head{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-bottom:1px solid var(--border)}
#previewFrame{width:100%;height:100%;border:0;flex:1 1 auto;min-height:0}
textarea{width:100%;resize:vertical;min-height:100px;border:1px solid var(--border);border-radius:12px;padding:10px}
code{background:#eee;padding:2px 6px;border-radius:8px}
footer{max-width:1100px;margin:16px auto;padding:0 16px;color:var(--muted)}
@media (max-width:840px){
  .config .cfg-grid{grid-template-columns:1fr}
}