:root{
  --bg:#f7f8fb;--card:#ffffff;--muted:#666;--accent:#2563eb;
}
body{font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:#111;margin:0}
.container{max-width:1000px;margin:20px auto;padding:16px}
.site-header{background:var(--card);border-bottom:1px solid #e6e9ef}
.site-header .container{display:flex;align-items:center;justify-content:space-between}
.brand a{color:var(--accent);text-decoration:none}
.nav a{margin-left:12px;color:var(--muted);text-decoration:none}
.table{width:100%;border-collapse:collapse;background:var(--card);margin-top:12px}
.table th,.table td{padding:8px;border-bottom:1px solid #eee;text-align:left}
.btn{background:var(--accent);color:#fff;border:none;padding:8px 12px;border-radius:6px;cursor:pointer}
.btn.ghost{background:transparent;color:var(--accent);border:1px solid #e1e7ff}
.btn.small{padding:4px 8px;font-size:90%}
.btn.danger{background:#e02424}
.form label{display:block;margin-bottom:8px}
.form input, .form-input, input[type="text"], input[type="password"], textarea{padding:8px;width:100%;box-sizing:border-box;margin-top:4px;border:1px solid #e6e9ef;border-radius:6px}
.form-input{max-width:100%}
.alert{background:#fee; padding:8px;border:1px solid #fcc;margin-bottom:8px}
.preview img,.preview video,.preview iframe{max-width:100%;height:auto}
.footer{color:#999;font-size:90%;padding:12px;margin-top:20px}
.card{background:var(--card);padding:12px;border-radius:8px;margin:12px 0;border:1px solid #eef}
.actions{margin-bottom:8px}
.progress{background:#eee;border-radius:6px;overflow:hidden;height:14px}
.progress > div{height:100%;background:var(--accent);width:0}
.link{margin-right:8px}