:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, sans-serif; background: #f5f7fb; color: #142033; }
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; }
header { background: linear-gradient(135deg, #0f766e, #14b8a6); color: white; padding: 2rem; display: flex; gap: 1rem; justify-content: space-between; }
nav { display: flex; flex-wrap: wrap; gap: .75rem; padding: 1rem 2rem; background: white; box-shadow: 0 1px 8px #dbe4f0; }
a { color: #0f766e; font-weight: 700; }
main { padding: 2rem; max-width: 1100px; margin: auto; }
.auth, .card, .form-card, .detail, .metrics div { border-radius: 18px; background: white; color: #142033; padding: 1rem; box-shadow: 0 8px 24px #d9e2ef; }
.auth { max-width: 280px; }
.eyebrow { text-transform: uppercase; letter-spacing: .08em; font-size: .8rem; opacity: .8; }
.metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; margin-bottom: 2rem; }
.metrics b { display: block; font-size: 2rem; color: #0f766e; }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
table { border-collapse: collapse; width: 100%; background: white; border-radius: 18px; overflow: hidden; }
.table-scroll { max-width: 100%; overflow-x: auto; border-radius: 18px; box-shadow: 0 8px 24px #d9e2ef; }
.table-scroll table { box-shadow: none; }
th, td { padding: .9rem; border-bottom: 1px solid #e5edf5; text-align: left; vertical-align: top; }
tr.waiting_on_info { background: #fff7ed; }
small { color: #b45309; font-weight: 700; }
.banner { border: 2px solid #f59e0b; background: #fffbeb; padding: 1rem; border-radius: 14px; margin: 1rem 0; font-weight: 700; }
dl { display: grid; grid-template-columns: 160px 1fr; gap: .5rem 1rem; }
dt { font-weight: 700; color: #475569; }
form { display: grid; gap: 1rem; }
label, .upload-field { display: grid; gap: .35rem; font-weight: 700; }
.field-label span, label span { color: #0f766e; font-size: .85rem; }
input, textarea, select { border: 1px solid #cbd5e1; border-radius: 12px; padding: .85rem; font: inherit; width: 100%; max-width: 100%; }
.upload-input { position: absolute; inline-size: 1px; block-size: 1px; opacity: 0; overflow: hidden; clip-path: inset(50%); }
.upload-cta { border: 2px dashed #0f766e; border-radius: 16px; background: #ecfdf5; color: #0f766e; padding: 1rem; text-align: center; cursor: pointer; font-weight: 900; }
.upload-input:focus + .upload-cta { outline: 3px solid #99f6e4; outline-offset: 3px; }
.upload-status { color: #475569; font-size: .95rem; }
textarea { min-height: 100px; }
button, .button { border: 0; border-radius: 999px; background: #0f766e; color: white; padding: .85rem 1.2rem; text-decoration: none; display: inline-block; font-weight: 800; }
.secondary { background: #e0f2f1; color: #0f766e; }
.action-panel, .asset-row, .upload-panel { border: 1px solid #d9e8e6; border-radius: 16px; padding: 1rem; margin: 1rem 0; background: #f8fffe; }
.action-panel { display: grid; grid-template-columns: minmax(180px, 1fr) 2fr; gap: 1rem; align-items: center; }
.button-row, .asset-actions { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.asset-list { display: grid; gap: .75rem; }
.asset-row { display: flex; justify-content: space-between; gap: 1rem; align-items: center; margin: 0; }
.asset-row span { display: block; color: #475569; margin-top: .25rem; }
.empty-state { border: 1px dashed #94a3b8; border-radius: 14px; padding: 1rem; color: #475569; }
@media (max-width: 640px) { header { display: block; padding: 1.25rem; } main, nav { padding: 1rem; } dl, .action-panel { grid-template-columns: 1fr; } table { font-size: .85rem; } .asset-row { display: grid; } button, .button { width: 100%; text-align: center; } }