:root { --bg:#f6f8fb; --card:#ffffff; --text:#172033; --muted:#637083; --primary:#14345B; --border:#d8e0ea; --ok:#16794c; --warn:#996500; --danger:#b42318; }
* { box-sizing: border-box; }
body { margin:0; font-family: Arial, Helvetica, sans-serif; background:var(--bg); color:var(--text); }
.topbar { background:var(--primary); color:#fff; padding:18px 32px; display:flex; justify-content:space-between; align-items:center; }
.topbar-left { display:flex; align-items:center; gap:16px; }
.topbar-logo { height:32px; filter: brightness(0) invert(1); }
.topbar-divider { width:1px; height:36px; background:rgba(255,255,255,.3); }
.brand { font-size:22px; font-weight:700; }
.subtitle { font-size:13px; opacity:.8; margin-top:4px; }
.topnav { display:flex; gap:14px; align-items:center; }
.topbar a, .topnav span { color:#fff; text-decoration:none; font-weight:700; }
.nav-user { opacity:.85; font-size:13px; }
.container { max-width:1280px; margin:24px auto; padding:0 20px; }
.card { background:var(--card); border:1px solid var(--border); border-radius:16px; padding:22px; margin-bottom:20px; box-shadow:0 8px 24px rgba(20,52,91,.06); }
.header-card { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; }
.split-card { display:grid; grid-template-columns:1fr 1fr; gap:30px; }
h1,h2 { margin:0 0 14px; }
p { color:var(--muted); }
.warning { color:var(--warn); font-weight:700; }
button, .button { display:inline-block; border:0; background:var(--primary); color:white; padding:10px 16px; border-radius:10px; text-decoration:none; cursor:pointer; font-weight:700; }
button.secondary, .button.secondary { background:#eef3f9; color:var(--primary); border:1px solid var(--border); }
button.danger, .button.danger { background:#fff1f0; color:var(--danger); border:1px solid #ffc9c4; }
.upload-form { display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
.table { width:100%; border-collapse:collapse; }
.table th, .table td { border-bottom:1px solid var(--border); padding:10px; text-align:left; vertical-align:top; }
.table th { color:#33445f; background:#f1f5fa; }
.compact td, .compact th { font-size:13px; padding:7px; }
.status { display:inline-block; background:#edf2f7; color:#263a52; border-radius:999px; padding:4px 10px; font-size:12px; font-weight:700; }
.status.signed, .status.released { background:#e5f7ed; color:var(--ok); }
.status.pending, .status.in-approval { background:#fff5d6; color:var(--warn); }
.status.rejected, .status.changes-requested { background:#fff1f0; color:var(--danger); }
.field-grid { display:grid; gap:12px; }
.field-row { display:grid; grid-template-columns:60px minmax(220px, 1fr) minmax(280px, 1.5fr) minmax(220px, 1fr) 240px; gap:10px; align-items:start; }
.field-header-row { background:#f1f5fa; border:1px solid var(--border); border-radius:10px; padding:8px 10px; font-weight:800; color:#263a52; }
.code { font-family: Consolas, monospace; color:#61738a; padding-top:8px; }
label { display:block; font-weight:700; color:#263a52; padding-top:8px; }
textarea, input[type=text], select { width:100%; padding:10px; border:1px solid var(--border); border-radius:10px; font:inherit; background:#fff; }
textarea { resize:vertical; min-height:44px; }
.actions { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.actions.left { justify-content:flex-start; margin:8px 0 16px; }
.inline { display:inline-flex; gap:8px; align-items:center; margin:0; }
.section-header { display:flex; justify-content:space-between; gap:16px; align-items:center; }
.section-rename { margin-bottom:14px; }
.row-actions { display:flex; gap:6px; flex-wrap:wrap; }
.sticky-save { position:sticky; bottom:16px; display:flex; justify-content:flex-end; margin-bottom:20px; z-index:5; }
#signature-pad { width:100%; max-width:640px; height:220px; border:2px dashed var(--border); background:#fff; border-radius:12px; display:block; margin:8px 0; }
.hero-card { background:linear-gradient(135deg, var(--primary) 0%, #1a4a7a 100%); color:#fff; border:none; border-radius:16px; padding:40px 36px; margin-bottom:24px; text-align:center; box-shadow:0 12px 32px rgba(20,52,91,.12); }
.hero-logo { height:48px; margin-bottom:16px; filter: brightness(0) invert(1); }
.hero-title { font-size:28px; font-weight:800; margin:0 0 8px; color:#fff; }
.hero-subtitle { color:rgba(255,255,255,.85); font-size:15px; margin:0; max-width:520px; margin-inline:auto; }
@media (max-width: 1000px) { .field-row { grid-template-columns:1fr; } .field-header-row div:last-child { display:none; } .header-card, .split-card { grid-template-columns:1fr; flex-direction:column; } .hero-card { padding:28px 20px; } .hero-logo { height:36px; } .hero-title { font-size:22px; } }

.actions-table { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.actions-table .inline { margin:0; }
.clone-inline input[type=text] { max-width:150px; }