:root{
  --brand:#E11937;
  --ink:#0f172a;
  --muted:#64748b;
  --paper:#f7f7f9;
  --stroke:#e5e7eb;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--paper);color:var(--ink);
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}

.header{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--stroke);z-index:10}
.wrap{max-width:1100px;margin:0 auto;padding:14px 18px;display:flex;align-items:center;gap:12px}
.badge{background:var(--brand);color:#fff;border-radius:10px;padding:10px 12px;font-weight:800}
.title{font-weight:800;font-size:18px}
.by{font-size:12px;color:var(--muted)}
.menu{margin-left:auto;position:relative}
.menu button{background:#fff;border:1px solid var(--stroke);border-radius:10px;padding:10px 12px;cursor:pointer}
.menu ul{position:absolute;right:0;list-style:none;margin:0;padding:8px;background:#fff;border:1px solid var(--stroke);border-radius:12px;min-width:230px;display:none}
.menu ul li a{color:var(--ink);text-decoration:none;padding:10px 12px;display:block;border-radius:8px}
.menu ul li a:hover{background:var(--paper)}

.container{max-width:1100px;margin:24px auto;padding:0 18px}
.card{background:#fff;border:1px solid var(--stroke);border-radius:14px;padding:22px}
h1{margin:0 0 8px;font-size:32px}
.lead{margin:0;color:var(--muted)}

.uploader{margin-top:16px;border:2px dashed var(--stroke);border-radius:14px;padding:24px;text-align:center}
.uploader input[type=file]{display:none}
.btn{background:#fff;border:1px solid var(--stroke);border-radius:12px;padding:12px 16px;cursor:pointer}
.primary{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:600}
.ghost{background:#fff;border-color:var(--stroke)}
.hint{margin-top:8px;color:var(--muted);font-size:12px}

.actions{margin-top:16px;display:flex;gap:10px;justify-content:center}

.footer{margin:24px auto 40px;padding:0 18px;color:var(--muted);font-size:12px;text-align:center}