* { box-sizing: border-box; }
body { margin: 0; font-family: Arial, Helvetica, sans-serif; color: var(--color-ink); background: var(--color-bg); }
.shell { width: min(920px, calc(100% - 32px)); margin: 64px auto; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 8px; padding: 32px; }
.eyebrow { color: var(--color-primary); font-weight: 700; text-transform: uppercase; font-size: 12px; }
h1 { margin: 0 0 16px; font-size: clamp(28px, 4vw, 44px); }
.muted { color: #617083; }
.form-grid { display: grid; gap: 16px; max-width: 560px; }
.field { display: grid; gap: 6px; font-weight: 700; }
.field input, .field select { width: 100%; min-height: 44px; border: 1px solid var(--color-border); border-radius: 8px; padding: 10px 12px; font: inherit; background: #fff; }
.check { display: flex; gap: 10px; align-items: flex-start; }
.button { min-height: 44px; border: 0; border-radius: 8px; padding: 10px 18px; background: var(--color-primary); color: #fff; font-weight: 700; cursor: pointer; }
.alert { border: 1px solid #c83e48; background: #fff1f2; color: #842029; border-radius: 8px; padding: 12px; }
.success { border-color: #16865d; background: #eefaf4; color: #0f5132; }
.toolbar { display: flex; gap: 12px; flex-wrap: wrap; margin: 18px 0; }
.link-button { display: inline-flex; align-items: center; min-height: 40px; border-radius: 8px; padding: 8px 14px; background: var(--color-ink); color: #fff; text-decoration: none; font-weight: 700; }
.table-wrap { overflow-x: auto; margin-top: 18px; }
table { width: 100%; border-collapse: collapse; background: #fff; }
th, td { border-bottom: 1px solid var(--color-border); padding: 10px; text-align: left; vertical-align: top; }
th { font-size: 12px; text-transform: uppercase; color: #617083; }
