body{font-family:system-ui,Segoe UI,Roboto,Arial,sans-serif;margin:0;background:#f8fafc;color:#111}
.header{display:flex;gap:12px;align-items:center;padding:12px 16px;background:#fff;border-bottom:1px solid #e5e7eb}
.header img{height:28px}
.container{max-width:1100px;margin:20px auto;padding:0 16px}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:16px}
.grid{display:grid;gap:16px}.grid-2{grid-template-columns:1fr 1fr}
.label{font-size:12px;color:#374151;margin-bottom:4px}
.input,select{width:100%;padding:10px 12px;border-radius:8px;border:1px solid #d1d5db;background:#fff}
.button{background:#0f172a;color:#fff;border:none;padding:10px 14px;border-radius:10px;cursor:pointer}
.badge{padding:2px 8px;border-radius:999px;font-size:12px;color:#fff;display:inline-block}
.badge.green{background:#10b981}.badge.yellow{background:#f59e0b}.badge.red{background:#ef4444}
.small{font-size:12px;color:#6b7280}
.warn{background:#fff7ed;border:1px solid #fed7aa;border-radius:8px;padding:10px}
.preview-box{display:flex;gap:16px;align-items:flex-start}
.preview-panel{width:400px;height:400px;object-fit:cover;border:1px solid #e5e7eb;border-radius:8px}
.range-row{display:flex;align-items:center;gap:8px;margin:6px 0}