:root{--teal:#165a5a;--orange:#e67e22;--bg:#f6f8fb;--card:#ffffff;--muted:#64748b}
*{box-sizing:border-box;font-family:Inter,ui-sans-serif,system-ui,Arial,Helvetica,sans-serif}
body{margin:0;background:var(--bg);color:#0f172a}
.wrap{max-width:1100px;margin:18px auto;padding:18px}
.header{background:var(--orange);color:#fff;padding:16px;border-radius:10px;text-align:center;box-shadow:0 8px 24px rgba(16,24,40,.08)}
.card{background:var(--card);padding:14px;border-radius:12px;box-shadow:0 8px 20px rgba(2,6,23,.06);margin-top:14px}
.grid{display:grid;grid-template-columns:220px 1fr;gap:10px;align-items:center}
.grid label{font-weight:700;color:var(--muted)}
input,select,textarea{padding:10px;border:1px solid #e6eef5;border-radius:8px;width:100%}
.btn{display:inline-block;padding:8px 12px;background:#2563eb;color:#fff;border-radius:8px;border:none;text-decoration:none;cursor:pointer}
.table{width:100%;border-collapse:collapse;margin-top:10px}
.table th,.table td{border:1px solid #e6eef5;padding:8px;text-align:left}
.topnav{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.small{font-size:13px;color:#475569}
.note{background:#fff7ed;padding:8px;border-radius:6px;border:1px solid #f5d0a9;color:#92400e}
.footer{margin-top:18px;text-align:center;color:#94a3b8}
.preview img{max-width:100%;border-radius:8px}