:root {
  color-scheme: light;
  --paper: #eef0f2;
  --surface: #ffffff;
  --ink: #101112;
  --ink-2: #353c45;
  --muted: #646d78;
  --faint: #8a929c;
  --line: #e3e6ea;
  --line-2: #d2d7dd;
  --orange: #ff5a1f;
  --orange-soft: #fff0e8;
  --green: #11713b;
  --green-bg: #e3f2e9;
  --amber: #8a5600;
  --amber-bg: #fcefd6;
  --red: #ad2419;
  --red-bg: #fbe6e3;
  --blue: #1d4f9c;
  --blue-bg: #e5edf8;
  --grey-bg: #eef0f2;
  --focus: #174fa6;
  --radius: 4px;
  --shadow: 0 1px 2px #1017200d, 0 4px 16px #10172009;
  --display: Archivo, "Arial Narrow", Arial, sans-serif;
  --body: "DM Sans", Arial, sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--paper); color: var(--ink); font: 15px/1.5 var(--body); -webkit-font-smoothing: antialiased; }
a { color: inherit; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3, h4, p { margin: 0; }
h1, h2, h3 { font-family: var(--display); letter-spacing: -0.03em; line-height: 1.1; text-wrap: balance; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.num { font-family: var(--display); font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.muted { color: var(--muted); }
.small { font-size: 13px; }
.nowrap { white-space: nowrap; }
.hidden { display: none !important; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ---------- logo ---------- */
.logo { display: inline-flex; align-items: center; gap: 8px; font: 800 20px/1 var(--display); letter-spacing: -0.04em; text-decoration: none; }
.logo svg { width: 28px; height: 28px; flex: none; }

/* ---------- buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 8px 16px;
  border: 1.5px solid var(--ink);
  border-radius: 6px;
  background: var(--surface);
  font-weight: 700;
  font-size: 14px;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition: box-shadow 0.12s, transform 0.12s;
  white-space: nowrap;
}
.btn:hover { box-shadow: 0 3px 0 var(--ink); transform: translateY(-1px); }
.btn:active { box-shadow: none; transform: none; }
.btn.primary { background: var(--orange); border-color: var(--orange); color: var(--ink); }
.btn.primary:hover { box-shadow: 0 3px 0 var(--ink); }
.btn.danger { border-color: var(--red); color: var(--red); }
.btn.ghost { border-color: transparent; background: transparent; }
.btn.ghost:hover { background: var(--grey-bg); box-shadow: none; transform: none; }
.btn.sm { min-height: 32px; padding: 5px 11px; font-size: 13px; }
.btn[disabled] { opacity: 0.55; cursor: not-allowed; box-shadow: none; transform: none; }
.btn svg { width: 16px; height: 16px; }
.linkish { background: none; border: 0; padding: 0; color: var(--ink); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; font-weight: 600; }

/* ---------- forms ---------- */
.field { display: grid; gap: 6px; }
.field > span, .label { font-weight: 650; font-size: 13.5px; }
.field small, .hint { color: var(--muted); font-size: 12.5px; }
input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="url"], input[type="search"], select, textarea {
  width: 100%; min-height: 42px; padding: 9px 12px; border: 1px solid var(--line-2); border-radius: 6px; background: var(--surface); font-size: 15px;
}
textarea { min-height: 110px; resize: vertical; line-height: 1.5; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--focus); outline-offset: 0; border-color: var(--focus); }
input[type="file"] { font-size: 13.5px; max-width: 100%; }
.check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; line-height: 1.45; }
.check input { margin-top: 3px; width: 17px; height: 17px; accent-color: var(--ink); flex: none; }
.checks { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.form { display: grid; gap: 16px; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.form-error { padding: 10px 12px; border-radius: 6px; background: var(--red-bg); color: var(--red); font-weight: 600; font-size: 14px; }
.form-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.input-prefix { display: flex; align-items: stretch; }
.input-prefix > b { display: grid; place-items: center; padding: 0 10px; border: 1px solid var(--line-2); border-right: 0; border-radius: 6px 0 0 6px; background: var(--grey-bg); font-weight: 650; color: var(--ink-2); }
.input-prefix > input { border-radius: 0 6px 6px 0; }

/* ---------- blocks ---------- */
.section { display: grid; gap: 14px; }
.section-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.section-head h2 { font-size: 19px; font-weight: 800; }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; }
.panel.flush { padding: 0; overflow: hidden; }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.stat { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px; display: grid; gap: 6px; align-content: start; }
.stat .k { font-size: 12.5px; font-weight: 650; color: var(--muted); }
.stat .v { font: 800 26px/1.05 var(--display); letter-spacing: -0.035em; font-variant-numeric: tabular-nums; }
.stat .s { font-size: 12.5px; color: var(--muted); }
.stat.alert { border-color: #f3c3bd; background: #fff9f8; }
.stat.alert .v { color: var(--red); }
.callout { display: flex; gap: 14px; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: 14px 16px; border-radius: var(--radius); border: 1px solid #f6cdb9; background: var(--orange-soft); }
.callout.info { border-color: #c9d8ef; background: #f2f6fc; }
.callout.bad { border-color: #f3c3bd; background: #fff6f5; }
.callout p { color: var(--ink-2); }
.empty { padding: 28px 0; text-align: left; color: var(--muted); border-block: 1px solid var(--line-2); }
.kv { display: grid; grid-template-columns: max-content 1fr; gap: 8px 18px; font-size: 14px; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; font-weight: 600; }
.prose { white-space: pre-wrap; color: var(--ink-2); line-height: 1.6; }

/* ---------- tags ---------- */
.tag { display: inline-flex; align-items: center; gap: 5px; padding: 2px 7px; border-radius: 4px; font-size: 11.5px; font-weight: 750; letter-spacing: 0.02em; white-space: nowrap; background: var(--grey-bg); color: var(--ink-2); }
.tag.green { background: var(--green-bg); color: var(--green); }
.tag.amber { background: var(--amber-bg); color: var(--amber); }
.tag.red { background: var(--red-bg); color: var(--red); }
.tag.blue { background: var(--blue-bg); color: var(--blue); }
.tag.ink { background: var(--ink); color: #fff; }

/* ---------- tables ---------- */
.table-wrap { max-width:100%; min-width:0; overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th { text-align: left; font-size: 12px; font-weight: 700; color: var(--muted); padding: 10px 14px; border-bottom: 1px solid var(--line); background: #fafbfb; white-space: nowrap; }
td { padding: 11px 14px; border-bottom: 1px solid var(--line); vertical-align: top; }
tr:last-child td { border-bottom: 0; }
td.r, th.r { text-align: right; }
td .sub { display: block; font-size: 12.5px; color: var(--muted); margin-top: 2px; }
td a { font-weight: 650; text-decoration: none; }
td a:hover { text-decoration: underline; }
.row-actions { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; }
tr.overdue td:first-child { box-shadow: inset 3px 0 0 var(--red); }

/* ---------- dialog, toast ---------- */
dialog { border: 0; border-radius: 10px; padding: 0; width: min(480px, calc(100vw - 32px)); box-shadow: 0 20px 60px #10172040; }
dialog::backdrop { background: #10111266; }
dialog form { padding: 22px; display: grid; gap: 16px; }
dialog h3 { font-size: 21px; font-weight: 800; }
.toasts { position: fixed; right: 16px; bottom: 16px; display: grid; gap: 8px; z-index: 50; }
.toast { padding: 11px 14px; border-radius: 6px; background: var(--ink); color: #fff; font-weight: 600; font-size: 14px; max-width: 360px; box-shadow: var(--shadow); }
.toast.bad { background: var(--red); }


html {
  scroll-padding-top:105px;
}
body {
  min-width:0;
}
p,.prose {
  overflow-wrap:anywhere;
}
h1 {
  font-weight:850;
}
main:focus {
  outline:none;
}
.skip-link {
  position:fixed;
  top:-100px;
  left:16px;
  z-index:100;
  background:white;
  padding:12px;
}
.skip-link:focus {
  top:10px;
}
.eyebrow {
  display:block;
  font-size:10px;
  font-weight:800;
  letter-spacing:.14em;
  margin-bottom:14px;
}
.logo {
  font-size:23px;
  letter-spacing:-1.1px;
}
.logo svg {
  width:31px;
  height:31px;
}
.btn {
  min-height:44px;
  border-color:#aeb5bc;
  border-radius:4px;
  max-width:100%;
  white-space:normal;
  text-align:center;
}
.btn:hover {
  box-shadow:none;
  transform:none;
  background:#f7f8f9;
  border-color:var(--ink);
}
.btn.primary:hover {
  background:#f44e15;
  border-color:#f44e15;
  box-shadow:none;
}
.btn.sm {
  min-height:36px;
}
.btn.danger:hover {
  background:#fae5e1;
}
.shell {
  min-height:100vh;
}
.app-header {
  position:sticky;
  top:0;
  z-index:20;
  display:flex;
  align-items:center;
  gap:20px;
  padding:17px clamp(18px,3vw,48px);
  background:white;
  border-bottom:1px solid var(--line);
  min-height:80px;
}
.workspace-label {
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.12em;
  border-left:1px solid var(--line);
  padding-left:16px;
  color:var(--muted);
}
.desktop-nav {
  display:flex;
  align-self:stretch;
  align-items:center;
  gap:7px;
  margin-left:20px;
  min-width:0;
}
.desktop-nav a {
  height:100%;
  position:relative;
  display:flex;
  align-items:center;
  gap:7px;
  padding:8px 11px;
  text-decoration:none;
  font-size:13px;
  font-weight:700;
  white-space:nowrap;
}
.desktop-nav svg {
  display:none;
}
.desktop-nav a.on:after {
  content:"";
  position:absolute;
  bottom:-18px;
  height:3px;
  left:11px;
  right:11px;
  background:var(--orange);
}
.desktop-nav a:hover {
  color:#aa350c;
}
.account-tools {
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:14px;
  flex:none;
}
.header-balance {
  display:grid;
  text-align:right;
  text-decoration:none;
  max-width:160px;
  font-size:12px;
}
.header-balance span {
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted);
}
.header-balance b {
  overflow-wrap:anywhere;
}
.bell {
  position:relative;
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  text-decoration:none;
}
.bell svg {
  width:20px;
  height:20px;
}
.bell i {
  position:absolute;
  top:-3px;
  right:-4px;
  min-width:16px;
  padding:1px 4px;
  background:var(--orange);
  border-radius:3px;
  font-size:10px;
  font-style:normal;
  font-weight:800;
  text-align:center;
}
.account-menu {
  position:relative;
}
.account-menu summary {
  display:grid;
  place-items:center;
  list-style:none;
  width:34px;
  height:34px;
  background:#e5e8eb;
  border:1px solid #c5cbd0;
  border-radius:50%;
  font-weight:800;
  cursor:pointer;
}
.account-menu summary::-webkit-details-marker {
  display:none;
}
.account-menu>div {
  position:absolute;
  right:0;
  top:47px;
  width:260px;
  max-width:calc(100vw - 32px);
  display:grid;
  gap:9px;
  padding:20px;
  background:white;
  border:1px solid var(--line);
  box-shadow:0 12px 35px #10111218;
  border-radius:5px;
  overflow-wrap:anywhere;
}
.account-menu span {
  font-size:12px;
  color:var(--muted);
}
.account-menu a,.account-menu button {
  font-size:13px;
  text-align:left;
  padding:10px 0;
  background:none;
  border:0;
  border-top:1px solid var(--line);
  text-decoration:none;
}
.bottom-tabs {
  display:none;
}
.main {
  width:min(1440px,100%);
  margin:auto;
  min-width:0;
}
.head {
  padding:40px 40px 0;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:15px;
  flex-wrap:wrap;
}
.head h1 {
  font-size:clamp(29px,3.5vw,47px);
  letter-spacing:-.05em;
}
.head-actions {
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.crumb {
  display:block;
  font-size:12px;
  text-decoration:none;
  margin-bottom:14px;
  color:var(--muted);
}
.page-deck {
  flex-basis:100%;
  color:var(--muted);
  margin-top:-2px;
}
.page {
  padding:27px 40px 55px;
  display:grid;
  gap:30px;
  min-width:0;
  align-content:start;
}
.page>* {
  min-width:0;
}
.app-footer {
  margin:0 40px;
  padding:18px 0 28px;
  border-top:1px solid #cbd1d6;
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:11px;
  color:var(--muted);
}
.app-footer a {
  text-decoration:none;
}
.loading {
  padding:30px 0;
  color:var(--muted);
}
.panel {
  border:0;
  border-radius:3px;
  min-width:0;
}
.section {
  min-width:0;
}
.section-head h2 {
  font-size:23px;
}
.stats {
  display:flex;
  border-block:1px solid #bfc6cc;
  gap:0;
  flex-wrap:wrap;
}
.stat {
  flex:1 1 155px;
  display:flex;
  flex-direction:column;
  gap:7px;
  padding:22px 22px 22px 0;
  margin-right:22px;
  min-width:0;
  border:0;
  border-right:1px solid #d3d8dc;
  border-radius:0;
  background:transparent;
}
.stat:last-child {
  border-right:0;
  margin-right:0;
}
.stat .k {
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.stat .v {
  overflow-wrap:anywhere;
}
.empty h3 {
  color:var(--ink);
  font-size:23px;
  margin-bottom:9px;
}
.empty p {
  max-width:62ch;
  margin-bottom:16px;
}
.empty a {
  font-weight:700;
}
.callout {
  border:0;
  border-left:3px solid var(--orange);
  border-radius:0;
}
.callout.info {
  border-left:3px solid #6b8296;
}
.callout.bad {
  border-left:3px solid var(--red);
}
table {
  font-size:13px;
}
th {
  padding:14px 17px;
  font-size:11px;
}
td {
  padding:17px;
}
.tabs,.filter-tabs {
  display:flex;
  gap:0;
  overflow-x:auto;
  max-width:100%;
  border-bottom:1px solid var(--line);
  min-width:0;
}
.tabs a,.filter-tabs button {
  background:transparent;
  border:0;
  border-bottom:2px solid transparent;
  padding:12px 15px;
  white-space:nowrap;
  text-decoration:none;
  color:var(--muted);
  font-size:13px;
  font-weight:700;
}
.tabs a.on,.filter-tabs button[aria-pressed="true"] {
  color:var(--ink);
  border-bottom-color:var(--orange);
}
.filter-tabs button span {
  margin-left:5px;
  font-size:10px;
  background:#dce1e5;
  border-radius:3px;
  padding:2px 5px;
}
.filters {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}
.filters input[type=search] {
  max-width:320px;
}
.filters select {
  width:auto;
  min-width:130px;
}
.field {
  min-width:0;
}
.field input,.field select,.field textarea {
  min-width:0;
}
input[type=file] {
  width:100%;
}
input[type=file]::file-selector-button {
  font:inherit;
  padding:10px 12px;
  border:1px solid #bcc4ca;
  background:white;
  border-radius:3px;
  margin-right:10px;
  cursor:pointer;
}
.kv {
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
}
.kv dd {
  overflow-wrap:anywhere;
}
.summary {
  display:grid;
  gap:10px;
  padding:18px;
  background:#e8ecef;
  font-size:13px;
  border-radius:3px;
}
.summary>div {
  display:flex;
  justify-content:space-between;
  gap:15px;
}
.summary .total {
  border-top:1px solid #cbd1d6;
  padding-top:12px;
  font-weight:800;
}
.role-pick {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.role-pick label {
  position:relative;
  display:grid;
  gap:4px;
  padding:15px;
  border:1px solid #bcc4ca;
  background:white;
  cursor:pointer;
  border-radius:4px;
}
.role-pick input {
  position:absolute;
  opacity:0;
  width:1px;
  height:1px;
}
.role-pick label:has(input:checked) {
  border:2px solid var(--ink);
  padding:14px;
  background:#fff5ee;
}
.role-pick label:has(input:focus-visible) {
  outline:3px solid var(--focus);
  outline-offset:3px;
}
.role-pick b {
  font-size:15px;
}
.role-pick span {
  font-size:12px;
  color:var(--muted);
}

.balance-strip {
  display:flex;
  align-items:center;
  gap:30px;
  padding:14px 0;
  border-block:1px solid #ccd2d7;
  font-size:12px;
  color:var(--muted);
}
.balance-strip b {
  margin-left:9px;
  color:var(--ink);
  font-size:14px;
}
.balance-strip a {
  margin-left:auto;
  color:var(--ink);
  font-weight:700;
  text-decoration:none;
}
.discovery-tools {
  display:grid;
  grid-template-columns:minmax(200px,.9fr) minmax(0,1.6fr);
  gap:26px;
}
.feed-search>label,.feed-filters>label,.review-filters>label {
  display:grid;
  gap:7px;
  font-size:11px;
  color:var(--muted);
  font-weight:700;
}
.feed-filters {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.feed-filters select {
  font-size:12px;
  padding-left:10px;
}
.feed-search input {
  background:#fff;
}
.cards {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:26px;
}
.mcard {
  min-width:0;
  display:flex;
  flex-direction:column;
  background:white;
  text-decoration:none;
  border-radius:7px;
  overflow:hidden;
  border:1px solid #d6dce1;
  transition:box-shadow .15s,border-color .15s;
}
.mcard:hover {
  border-color:#7e8992;
  box-shadow:0 5px 0 #101112;
}
.mission-cover {
  position:relative;
  aspect-ratio:1.95;
  isolation:isolate;
  background:#ffc297;
  overflow:hidden;
  color:#171714;
  min-width:0;
}
.mission-cover>img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:1;
}
.cover-art {
  position:absolute;
  inset:0;
  padding:23px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.cover-art>span {
  font:850 clamp(23px,3vw,42px)/.98 var(--display);
  letter-spacing:-2px;
  max-width:55%;
  text-transform:uppercase;
}
.cover-art>b {
  position:absolute;
  right:10px;
  bottom:-21px;
  font:850 175px/.95 var(--display);
  letter-spacing:-15px;
  opacity:.17;
  transform:rotate(-9deg);
}
.cover-art>small {
  font-size:8px;
  font-weight:800;
  letter-spacing:.2em;
  margin-top:17px;
}
.cover-art>svg {
  position:absolute;
  width:48%;
  right:15px;
  bottom:20px;
  transform:rotate(-13deg);
}
.cover-category {
  position:absolute;
  z-index:2;
  right:13px;
  top:13px;
  background:white;
  color:var(--ink);
  padding:4px 8px;
  font-size:9px;
  font-weight:750;
  border-radius:2px;
}
.cover-podcast {
  background:#e9dba4;
}
.cover-music {
  background:#ffb886;
}
.cover-gaming {
  background:#b7c5f4;
}
.cover-film_ott {
  background:#d8c5e5;
}
.cover-creator {
  background:#bbd9cc;
}
.cover-brand {
  background:#c7d9e8;
}
.cover-sports {
  background:#d1dc9f;
}
.cover-other {
  background:#d8dcdf;
}
.mcard-content {
  padding:21px;
  display:flex;
  flex-direction:column;
  gap:17px;
  flex:1;
}
.brand-line {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:11px;
  color:var(--muted);
}
.brand-line>span:nth-child(2) {
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.brand-avatar {
  display:grid;
  place-items:center;
  background:#e8ebee;
  color:var(--ink);
  width:26px;
  height:26px;
  flex:none;
  font-family:var(--display);
  font-size:12px;
  font-weight:800;
  border-radius:50%;
  border:1px solid #d8dde0;
}
.live-dot {
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:5px;
  color:#396730;
  font-size:10px;
  white-space:nowrap;
}
.live-dot:before {
  content:"";
  width:5px;
  height:5px;
  background:#396730;
  border-radius:50%;
}
.mcard h3 {
  font-size:20px;
  font-weight:800;
  min-height:2.24em;
  overflow-wrap:anywhere;
}
.rate {
  display:flex;
  align-items:baseline;
  gap:8px;
  flex-wrap:wrap;
  font-variant-numeric:tabular-nums;
}
.rate b {
  font:850 34px/1.04 var(--display);
  letter-spacing:-1.8px;
}
.rate span {
  font-size:12px;
  color:var(--muted);
}
.mission-progress {
  margin-top:auto;
}
.meter {
  height:6px;
  background:#e9ecef;
  border-radius:2px;
  overflow:hidden;
}
.meter i {
  display:block;
  height:100%;
  background:var(--orange);
  border-radius:2px;
}
.meter-label {
  display:flex;
  justify-content:space-between;
  gap:8px;
  font-size:10px;
  color:var(--muted);
  margin-top:9px;
}
.meter-label b {
  color:var(--ink);
}
.card-foot {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  border-top:1px solid #eaedef;
  padding-top:13px;
  font-size:11px;
  font-weight:700;
}
.platforms {
  display:flex;
  align-items:center;
  gap:9px;
}
.platform {
  display:inline-grid;
  place-items:center;
  width:22px;
  height:22px;
}
.platform svg {
  width:18px;
  height:18px;
}
.feed-note {
  display:flex;
  gap:14px;
  align-items:baseline;
  padding:22px 0;
  border-top:1px solid #cbd2d7;
  font-size:12px;
  flex-wrap:wrap;
}
.feed-note span {
  color:var(--muted);
}
.feed-note a {
  margin-left:auto;
  font-weight:700;
}
.mission-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) 335px;
  gap:42px;
  align-items:start;
}
.mission-story {
  min-width:0;
}
.mission-story>.mission-cover {
  aspect-ratio:2.25;
  border-radius:5px;
}
.mission-story .cover-art>span {
  font-size:62px;
}
.mission-story .cover-art>b {
  font-size:270px;
}
.mission-byline {
  display:flex;
  gap:11px;
  align-items:center;
  padding:22px 0;
  flex-wrap:wrap;
  font-size:13px;
}
.mission-byline .platforms {
  margin-left:auto;
}
.detail-nav {
  display:flex;
  gap:25px;
  border-bottom:1px solid #bfc7cd;
  overflow-x:auto;
  white-space:nowrap;
}
.detail-nav a {
  font-size:12px;
  font-weight:700;
  text-decoration:none;
  padding:12px 0;
}
.detail-nav a:hover {
  color:#a5320b;
}
.story-section {
  padding:34px 0;
  border-bottom:1px solid #ccd3d8;
  display:grid;
  gap:19px;
  scroll-margin-top:20px;
  min-width:0;
}
.story-section .eyebrow {
  margin:0;
  color:#737c85;
}
.story-section h3 {
  font-size:17px;
  margin-top:8px;
}
.story-section .empty {
  padding:10px 0;
  border:0;
}
.story-section .prose {
  max-width:75ch;
}
.mission-terms {
  position:sticky;
  top:105px;
  background:white;
  border:1px solid #d4dbe0;
  border-radius:5px;
  padding:27px;
  display:grid;
  gap:19px;
}
.mission-terms .eyebrow {
  margin:0;
  color:var(--muted);
}
.mission-terms .rate b {
  font-size:43px;
}
.mission-terms .kv {
  border-top:1px solid #e0e5e9;
  padding-top:20px;
  font-size:12px;
}
.remaining-note {
  font-size:12px;
  font-weight:750;
  color:#3b672b;
  margin-top:-7px;
}
.submit-dock .btn {
  width:100%;
  min-height:50px;
}
.mobile-rate {
  display:none;
}
.asset-links {
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:9px;
}
.asset-links a {
  display:flex;
  align-items:center;
  gap:17px;
  padding:17px;
  background:white;
  border:1px solid #d7dee4;
  border-radius:3px;
  text-decoration:none;
}
.asset-links a>span:nth-child(2) {
  min-width:0;
}
.asset-links b {
  display:block;
  font-size:13px;
}
.asset-links small {
  display:block;
  font-size:11px;
  color:var(--muted);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  max-width:48ch;
}
.asset-links svg {
  width:17px;
  height:17px;
  margin-left:auto;
}
.asset-number {
  color:#8a939b;
  font:700 20px var(--display);
}
.label-note {
  padding:20px;
  background:#e3e8ec;
  display:grid;
  gap:10px;
}
.label-note p {
  font-size:12px;
  color:var(--muted);
}
.disclosure {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:12px;
  background:white;
  border:1px dashed #939da6;
  border-radius:3px;
  font-size:13px;
  font-weight:700;
}
.disclosure>span {
  overflow-wrap:anywhere;
  min-width:0;
}
.disclosure>.btn {
  flex:none;
}
.leaderboard .rank {
  font:800 19px var(--display);
  color:#7c8790;
}
.leaderboard .mine {
  background:#fff1e6;
}
.submission-extra {
  border-top:1px solid var(--line);
  padding-top:15px;
}
.submission-extra summary {
  font-size:12px;
  font-weight:700;
  cursor:pointer;
}
.submission-extra summary span {
  font-weight:400;
  color:var(--muted);
}
.submission-extra>.form {
  margin-top:18px;
}
.mission-editor {
  max-width:1050px;
  gap:25px;
}
.editor-intro {
  max-width:650px;
  padding-block:4px 10px;
}
.editor-intro p {
  color:var(--muted);
  margin-top:12px;
}
.editor-intro .eyebrow {
  color:#a83610;
}
.cover-upload {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
  align-items:center;
  background:white;
  padding:28px;
  border-radius:5px;
}
.cover-upload>div:first-child {
  display:grid;
  gap:14px;
}
#cover-preview {
  min-width:0;
}
#cover-preview>img {
  width:100%;
  aspect-ratio:1.95;
  object-fit:cover;
  border-radius:4px;
}
.managed-cover {
  display:flex;
  gap:25px;
  align-items:center;
}
.managed-cover>.mission-cover {
  width:280px;
  flex:none;
  border-radius:4px;
}
.managed-cover>div:last-child {
  display:grid;
  gap:12px;
}
.managed-cover .eyebrow {
  margin:0;
}
.managed-cover p {
  color:var(--muted);
  font-size:13px;
}
.managed-cover .btn {
  justify-self:start;
}
.links {
  display:grid;
  gap:10px;
  margin:0;
  padding-left:16px;
}
.links a {
  overflow-wrap:anywhere;
}

.campaign-strip {
  display:flex;
  gap:50px;
  padding-block:20px;
  border-block:1px solid #c1c8ce;
  flex-wrap:wrap;
}
.campaign-strip>div,.campaign-strip>a {
  display:grid;
  gap:6px;
  text-decoration:none;
}
.campaign-strip>a {
  margin-left:auto;
}
.campaign-strip span {
  font-size:11px;
  color:var(--muted);
}
.campaign-strip strong {
  font:800 27px var(--display);
  letter-spacing:-1px;
}
.review-banner {
  background:#dfe7dc;
  padding:18px 21px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  text-decoration:none;
  border-left:3px solid #6b835d;
  font-size:12px;
  font-weight:700;
}
.review-banner>div {
  display:flex;
  gap:15px;
  align-items:center;
}
.review-banner svg {
  width:25px;
  height:25px;
}
.review-banner b,.review-banner small {
  display:block;
}
.review-banner small {
  font-weight:400;
  color:#4b5c47;
  margin-top:3px;
}
.campaign-toolbar {
  display:flex;
  justify-content:space-between;
  gap:22px;
  align-items:center;
  min-width:0;
}
.campaign-toolbar>input {
  max-width:240px;
}
.campaign-table table {
  min-width:1100px;
}
.campaign-name {
  display:flex;
  gap:12px;
  align-items:center;
  min-width:280px;
  max-width:380px;
}
.campaign-name>span {
  min-width:0;
}
.campaign-name b {
  font-size:13px;
  display:block;
  overflow-wrap:anywhere;
}
.campaign-name small {
  display:block;
  margin-top:5px;
  font-size:10px;
  font-weight:400;
  color:var(--muted);
}
.cover-compact {
  width:58px;
  height:47px;
  aspect-ratio:auto;
  flex:none;
  border-radius:3px;
}
.cover-compact .cover-art {
  padding:4px;
}
.cover-compact .cover-art>span {
  font-size:9px;
  letter-spacing:-.3px;
}
.cover-compact .cover-art>b {
  font-size:51px;
  bottom:-6px;
  right:0;
  letter-spacing:-3px;
}
.cover-compact small,.cover-compact svg,.cover-compact .cover-category {
  display:none;
}
.queue-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:15px;
  font-size:13px;
}
.queue-heading strong {
  display:block;
  font-size:17px;
  margin-bottom:4px;
}
.review-filters {
  display:flex;
  align-items:flex-end;
  gap:15px;
  flex-wrap:wrap;
}
.review-filters>label {
  min-width:160px;
  max-width:300px;
  flex:1;
}
.review-filters>span {
  margin-left:auto;
  padding-bottom:12px;
}
.review-row {
  display:flex;
  gap:20px;
  align-items:center;
  justify-content:space-between;
  padding:20px;
  border-bottom:1px solid var(--line);
  background:white;
  min-width:0;
}
.clip-review-row {
  display:grid;
  grid-template-columns:80px minmax(0,1fr) 115px 190px;
  gap:22px;
  padding:24px;
}
.review-row.overdue {
  border-left:3px solid var(--red);
  padding-left:21px;
}
.review-queue {
  border-top:1px solid #c7cfd5;
}
.proof-preview {
  position:relative;
  display:grid;
  height:100px;
  overflow:hidden;
  text-decoration:none;
  background:#e6eaed;
  border:1px solid #c9d1d7;
  border-radius:3px;
}
.proof-preview img {
  width:100%;
  height:80px;
  object-fit:contain;
}
.proof-preview span {
  font-size:8px;
  text-align:center;
  align-self:end;
  background:#101112;
  color:white;
  padding:3px;
}
.proof-placeholder {
  height:100px;
  background:#f0f2f4;
  display:grid;
  align-content:center;
  justify-items:center;
  gap:9px;
}
.proof-placeholder span:last-child {
  font-size:8px;
  color:var(--muted);
}
.review-person {
  display:flex;
  align-items:center;
  gap:9px;
  flex-wrap:wrap;
  font-size:12px;
}
.review-person>span:not(.tag) {
  color:var(--muted);
  font-size:11px;
}
.review-post {
  margin-top:7px;
  font-weight:750;
  font-size:14px;
}
.review-post a {
  text-decoration:none;
}
.review-mission {
  display:block;
  font-size:12px;
  color:#56626b;
  margin-top:7px;
  text-decoration:none;
}
.review-row .meta {
  display:flex;
  gap:7px 14px;
  flex-wrap:wrap;
  font-size:10px;
  color:var(--muted);
  margin-top:8px;
}
.review-note {
  font-size:12px;
  color:var(--muted);
  margin-top:7px;
}
.review-numbers {
  display:grid;
  gap:2px;
  font-size:10px;
  text-align:right;
  color:var(--muted);
}
.review-numbers b {
  font:800 24px var(--display);
  color:var(--ink);
  letter-spacing:-1px;
}
.review-numbers small {
  font-size:10px;
}
.deadline-late {
  color:var(--red);
  font-weight:700;
}
.clip-review-row .row-actions {
  align-content:center;
}
.review-content {
  min-width:0;
}
.role-admin .head h1 {
  font-size:34px;
}
.role-admin .desktop-nav {
  gap:0;
  margin-left:5px;
}
.role-admin .desktop-nav a {
  padding-inline:8px;
  font-size:12px;
}
.role-admin .stats {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  background:white;
  border-top:2px solid var(--ink);
}
.role-admin .stat {
  padding:19px;
  border:0;
  border-bottom:1px solid var(--line);
  margin:0;
}
.role-admin .stat .v {
  font-size:25px;
}
.earnings-layout {
  display:grid;
  grid-template-columns:340px minmax(0,1fr);
  gap:45px;
  align-items:start;
}
.earnings-balance {
  display:grid;
  gap:18px;
  padding-right:34px;
  border-right:1px solid #c4ccd2;
}
.currency-switch {
  display:inline-flex;
  gap:0;
  justify-self:start;
  border:1px solid #bdc6cd;
  border-radius:4px;
  overflow:hidden;
  margin-bottom:14px;
}
.currency-switch a {
  padding:7px 21px;
  font-size:12px;
  font-weight:750;
  text-decoration:none;
  background:white;
}
.currency-switch .on {
  background:var(--ink);
  color:white;
}
.earnings-balance .eyebrow {
  margin:0;
  color:var(--muted);
}
.big-balance {
  font:850 clamp(34px,4vw,52px)/1.1 var(--display);
  letter-spacing:-2.3px;
  overflow-wrap:anywhere;
  font-variant-numeric:tabular-nums;
}
.balance-meta {
  display:grid;
  gap:9px;
  font-size:12px;
  color:var(--muted);
}
.balance-meta span {
  display:flex;
  justify-content:space-between;
  gap:12px;
}
.balance-meta b {
  color:var(--ink);
}
.withdraw {
  width:100%;
  min-height:49px;
}
.payout-destination {
  display:grid;
  gap:8px;
  border-top:1px solid #c9d0d6;
  padding-top:23px;
  margin-top:8px;
  font-size:12px;
}
.payout-destination span:not(.eyebrow) {
  color:var(--muted);
  overflow-wrap:anywhere;
}
.payout-destination a {
  font-weight:700;
  margin-top:3px;
}
.earnings-history {
  background:white;
  padding:30px;
  min-width:0;
  border-radius:4px;
}
.earnings-history .eyebrow {
  color:var(--muted);
  margin-bottom:13px;
}
.earnings-history h2 {
  font-size:30px;
}
.earnings-chart {
  width:100%;
  height:auto;
  display:block;
  margin-top:20px;
  overflow:visible;
}
.earnings-chart text {
  font-family:var(--body);
  font-size:10px;
  fill:#65717b;
}
.chart-grid {
  stroke:#e5e9ec;
  stroke-width:1;
}
.chart-data {
  border-top:1px solid #d6dce2;
  margin-top:20px;
  padding-top:15px;
}
.chart-data summary {
  font-size:11px;
  color:var(--muted);
  cursor:pointer;
}
.chart-data .table-wrap {
  margin-top:15px;
  max-height:260px;
}
.secret {
  font:700 18px/1.5 ui-monospace,Consolas,monospace;
  user-select:all;
  overflow-wrap:anywhere;
  background:#e9edf0;
  border:1px dashed #a4b0ba;
  padding:17px;
  border-radius:3px;
}
.auth {
  min-height:100vh;
  display:grid;
  grid-template-columns:1fr 1fr;
}
.auth-side {
  padding:48px clamp(24px,5vw,80px);
  display:flex;
  flex-direction:column;
  gap:60px;
  background:#e4e9ec;
  border-right:1px solid #c9d2d9;
  position:relative;
}
.auth-side h1 {
  font-size:clamp(42px,5.7vw,79px);
  line-height:1;
  max-width:10ch;
  letter-spacing:-.065em;
}
.auth-side h1:after {
  content:"";
  display:block;
  width:80px;
  height:8px;
  background:var(--orange);
  margin-top:26px;
  transform:rotate(-4deg);
}
.auth-side p {
  max-width:40ch;
  color:var(--muted);
}
.auth-main {
  display:grid;
  place-items:center;
  padding:45px 25px;
  background:white;
  min-width:0;
}
.auth-card {
  width:100%;
  max-width:425px;
  display:grid;
  gap:30px;
}
.auth-card h2 {
  font-size:32px;
}
.auth-card .form {
  gap:17px;
}
.auth-card .form-actions>.primary {
  width:100%;
  min-height:48px;
}
.ticket {
  background:#101112;
  color:white;
  padding:24px;
  border-radius:4px;
  margin-top:auto;
  display:grid;
  gap:18px;
  max-width:400px;
  transform:rotate(-2deg);
}
.ticket-row {
  display:flex;
  justify-content:space-between;
  gap:15px;
  font-size:11px;
  color:#b5bec6;
}
.ticket-row b {
  color:white;
}
.ticket-steps {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:9px;
}
.ticket-steps span {
  font-size:9px;
  padding-top:9px;
  border-top:3px solid #53595e;
}
.ticket-steps .on {
  border-color:var(--orange);
}
dialog {
  max-height:calc(100dvh - 40px);
  overflow-y:auto;
  border:1px solid #b8c1c8;
  border-radius:7px;
}
dialog form {
  padding:27px;
  gap:19px;
}
dialog h3 {
  font-size:25px;
}
dialog .form-actions {
  padding-top:12px;
  border-top:1px solid var(--line);
}
.toasts {
  max-width:calc(100vw - 40px);
  z-index:100;
}
.toast {
  overflow-wrap:anywhere;
}
.split {
  display:grid;
  grid-template-columns:minmax(0,1fr) 340px;
  gap:24px;
}
.sticky {
  position:sticky;
  top:100px;
}

@media(min-width:1500px){.cards{grid-template-columns:repeat(4,minmax(0,1fr))}.mcard-content{padding:18px}.mcard h3{font-size:19px}.rate b{font-size:31px}}
@media(max-width:1200px) {
  .workspace-label {
    display:none;
  }
  .app-header {
    gap:12px;
    padding-inline:24px;
  }
  .desktop-nav {
    margin-left:0;
    gap:0;
  }
  .header-balance {
    display:none;
  }
  .head {
    padding-inline:28px;
  }
  .page {
    padding-inline:28px;
  }
  .app-footer {
    margin-inline:28px;
  }
  .cards {
    gap:18px;
  }
  .mcard-content {
    padding:17px;
  }
  .mcard h3 {
    font-size:18px;
  }
  .rate b {
    font-size:30px;
  }
  .discovery-tools {
    grid-template-columns:1fr;
  }
  .feed-filters {
    max-width:700px;
  }
  .mission-layout {
    gap:25px;
    grid-template-columns:minmax(0,1fr) 300px;
  }
  .mission-terms {
    padding:22px;
  }
  .clip-review-row {
    grid-template-columns:65px minmax(0,1fr) 100px 150px;
    gap:16px;
    padding:20px;
  }
  .role-admin .app-header {
    flex-wrap:wrap;
  }
  .role-admin .desktop-nav {
    order:3;
    flex-basis:100%;
    overflow-x:auto;
  }
  .role-admin .desktop-nav a.on:after {
    bottom:-6px;
  }
  .earnings-layout {
    grid-template-columns:290px minmax(0,1fr);
    gap:28px;
  }
  .earnings-balance {
    padding-right:23px;
  }
}
@media(max-width:960px) {
  .cards {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .mission-layout {
    grid-template-columns:minmax(0,1fr) 270px;
    gap:20px;
  }
  .mission-terms {
    padding:20px;
  }
  .mission-terms .rate b {
    font-size:35px;
  }
  .mission-terms .kv {
    grid-template-columns:1fr;
    font-size:11px;
    gap:5px;
  }
  .mission-terms .kv dd {
    margin-bottom:7px;
  }
  .campaign-toolbar {
    flex-wrap:wrap;
  }
  .campaign-toolbar .filter-tabs {
    flex-basis:100%;
  }
  .campaign-toolbar>input {
    max-width:100%;
  }
  .clip-review-row {
    grid-template-columns:65px minmax(0,1fr) 110px;
  }
  .clip-review-row .row-actions {
    grid-column:2/-1;
    justify-content:flex-start;
  }
  .grid-3 {
    grid-template-columns:1fr 1fr;
  }
  .role-admin .grid-3 {
    grid-template-columns:1fr;
  }
  .earnings-layout {
    grid-template-columns:1fr;
  }
  .earnings-balance {
    border-right:0;
    max-width:540px;
    padding-right:0;
  }
  .earnings-history {
    padding:25px;
  }
  .auth-side {
    padding:35px 25px;
  }
  .auth-side h1 {
    font-size:52px;
  }
  .role-brand .desktop-nav a {
    padding-inline:8px;
  }
  .account-tools {
    gap:10px;
  }
  .split {
    grid-template-columns:1fr;
  }
  .sticky {
    position:static;
  }
}
@media(max-width:760px) {
  html {
    scroll-padding-top:90px;
  }
  .app-header {
    padding:15px 18px;
    gap:12px;
    min-height:69px;
    flex-wrap:wrap;
  }
  .logo {
    font-size:22px;
  }
  .logo svg {
    width:28px;
    height:28px;
  }
  .role-clipper .desktop-nav {
    display:none;
  }
  .role-brand .desktop-nav,.role-admin .desktop-nav {
    order:3;
    flex-basis:100%;
    overflow-x:auto;
    margin:0 -4px;
    padding:2px 0;
  }
  .desktop-nav a.on:after {
    bottom:0;
  }
  .desktop-nav a {
    padding:10px 12px;
  }
  .account-tools {
    margin-left:auto;
  }
  .bell {
    width:29px;
    height:29px;
  }
  .account-menu summary {
    width:30px;
    height:30px;
    font-size:12px;
  }
  .bottom-tabs {
    position:fixed;
    bottom:0;
    inset-inline:0;
    z-index:30;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    padding:8px 9px calc(8px + env(safe-area-inset-bottom));
    border-top:1px solid #c4ccd2;
    background:white;
    min-height:68px;
  }
  .bottom-tabs a {
    display:grid;
    place-items:center;
    gap:4px;
    padding:4px 0;
    text-decoration:none;
    font-size:10px;
    font-weight:700;
    color:#68747e;
  }
  .bottom-tabs svg {
    width:20px;
    height:20px;
  }
  .bottom-tabs a.on {
    color:var(--ink);
    background:#fff1e8;
    border-radius:4px;
  }
  .bottom-tabs a.on svg {
    color:#b43a0e;
  }
  .head {
    padding:27px 18px 0;
    gap:13px;
  }
  .head h1 {
    font-size:33px;
  }
  .page {
    padding:23px 18px 35px;
    gap:25px;
  }
  .role-clipper .app-footer {
    padding-bottom:95px;
  }
  .role-clipper:has(.submit-dock) .app-footer {
    padding-bottom:165px;
  }
  .app-footer {
    margin-inline:18px;
    font-size:10px;
  }
  .page-deck {
    font-size:13px;
  }
  .balance-strip {
    gap:12px;
    flex-wrap:wrap;
    font-size:10px;
  }
  .balance-strip b {
    font-size:12px;
    margin-left:5px;
  }
  .balance-strip a {
    font-size:10px;
  }
  .feed-filters {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .cards {
    gap:16px;
  }
  .mcard-content {
    padding:15px;
    gap:14px;
  }
  .brand-line {
    font-size:10px;
  }
  .brand-avatar {
    width:22px;
    height:22px;
    font-size:10px;
  }
  .live-dot {
    display:none;
  }
  .mcard h3 {
    font-size:18px;
  }
  .rate b {
    font-size:29px;
  }
  .rate span {
    font-size:10px;
  }
  .meter-label {
    font-size:9px;
  }
  .card-foot {
    font-size:10px;
  }
  .card-foot .platforms {
    gap:5px;
  }
  .cover-art {
    padding:16px;
  }
  .cover-art>span {
    font-size:25px;
  }
  .cover-art>b {
    font-size:120px;
    right:0;
    bottom:-15px;
    letter-spacing:-8px;
  }
  .cover-art small {
    font-size:6px;
    letter-spacing:.1em;
  }
  .cover-category {
    font-size:8px;
    right:8px;
    top:8px;
  }
  .feed-note {
    gap:8px;
    display:grid;
    font-size:11px;
  }
  .feed-note a {
    margin:7px 0 0;
  }
  .mission-layout {
    display:flex;
    flex-direction:column;
    gap:25px;
  }
  .mission-story {
    width:100%;
  }
  .mission-story>.mission-cover {
    aspect-ratio:1.85;
  }
  .mission-story .cover-art>span {
    font-size:40px;
  }
  .mission-story .cover-art>b {
    font-size:190px;
  }
  .mission-terms {
    position:static;
    width:100%;
    padding:23px;
  }
  .mission-terms .kv {
    grid-template-columns:1fr 1fr;
    gap:10px 14px;
    font-size:12px;
  }
  .mission-terms .kv dd {
    margin:0;
    text-align:right;
  }
  .submit-dock {
    position:fixed;
    left:0;
    right:0;
    bottom:calc(68px + env(safe-area-inset-bottom));
    z-index:25;
    padding:11px 18px;
    background:white;
    border-top:1px solid #c5cdd3;
    display:flex;
    align-items:center;
    gap:18px;
    box-shadow:0 -5px 20px #10111208;
  }
  .submit-dock .btn {
    width:auto;
    flex:1;
    min-height:46px;
  }
  .mobile-rate {
    display:grid;
    font:800 21px var(--display);
    letter-spacing:-.7px;
  }
  .mobile-rate small {
    font:400 10px var(--body);
    letter-spacing:0;
    color:var(--muted);
  }
  .detail-nav {
    gap:22px;
  }
  .story-section {
    padding-block:27px;
  }
  .story-section .prose {
    font-size:14px;
  }
  .story-section h2 {
    font-size:25px;
  }
  .asset-links small {
    max-width:29ch;
  }
  .mission-byline {
    font-size:12px;
  }
  .grid-2,.grid-3 {
    grid-template-columns:1fr;
  }
  .cover-upload {
    grid-template-columns:1fr;
    padding:21px;
    gap:22px;
  }
  .cover-upload #cover-preview {
    max-width:400px;
  }
  .panel {
    padding:21px;
  }
  .managed-cover {
    gap:17px;
  }
  .managed-cover>.mission-cover {
    width:120px;
    height:100px;
    aspect-ratio:auto;
  }
  .managed-cover .cover-art>span {
    font-size:18px;
  }
  .managed-cover h2 {
    font-size:22px;
  }
  .managed-cover p {
    font-size:11px;
  }
  .managed-cover .eyebrow {
    font-size:8px;
  }
  .campaign-strip {
    gap:20px;
  }
  .campaign-strip strong {
    font-size:23px;
  }
  .campaign-strip>a {
    margin:0;
  }
  .campaign-strip span {
    font-size:10px;
  }
  .review-banner {
    align-items:flex-start;
    padding:16px;
    flex-direction:column;
    gap:12px;
  }
  .review-banner>span {
    align-self:flex-end;
  }
  .review-banner svg {
    width:22px;
  }
  .campaign-toolbar {
    gap:16px;
  }
  .filter-tabs button {
    font-size:12px;
    padding:11px 13px;
  }
  .queue-heading {
    align-items:flex-start;
    flex-direction:column;
  }
  .review-filters>label {
    min-width:calc(50% - 15px);
  }
  .review-filters>span {
    margin-left:0;
    font-size:10px;
  }
  .clip-review-row {
    grid-template-columns:54px minmax(0,1fr);
    gap:12px;
    padding:18px 12px;
  }
  .proof-preview,.proof-placeholder {
    height:77px;
  }
  .proof-preview img {
    height:60px;
  }
  .review-numbers {
    grid-column:2;
    text-align:left;
    display:flex;
    align-items:baseline;
    gap:7px;
    flex-wrap:wrap;
  }
  .review-numbers b {
    font-size:22px;
  }
  .clip-review-row .row-actions {
    grid-column:2;
    gap:7px;
  }
  .review-person {
    gap:5px;
    font-size:12px;
  }
  .review-person .tag {
    font-size:8px;
  }
  .review-post {
    font-size:13px;
  }
  .review-row .meta {
    font-size:10px;
  }
  .review-mission {
    font-size:11px;
  }
  .review-note {
    font-size:11px;
  }
  .role-admin .stats {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .stats {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .stat {
    margin:0;
    padding:17px 12px 17px 0;
    border:0;
    border-bottom:1px solid #cbd2d8;
  }
  .stat .v {
    font-size:23px;
  }
  .stat .k {
    font-size:9px;
  }
  .stat .s {
    font-size:11px;
  }
  .earnings-balance {
    gap:17px;
  }
  .big-balance {
    font-size:51px;
  }
  .earnings-history {
    padding:20px 13px;
  }
  .earnings-history h2 {
    font-size:25px;
  }
  .earnings-chart {
    min-height:170px;
  }
  .earnings-history .section-head {
    padding-inline:5px;
  }
  .auth {
    display:block;
  }
  .auth-side {
    padding:22px;
    gap:22px;
    border:0;
  }
  .auth-side>div:not(.ticket) {
    display:none!important;
  }
  .auth-side .ticket {
    display:none;
  }
  .auth-main {
    padding:32px 22px 55px;
    min-height:calc(100vh - 73px);
  }
  .auth-card {
    gap:25px;
  }
  .auth-card h2 {
    font-size:31px;
  }
  dialog form {
    padding:23px 20px;
  }
  .toasts {
    right:15px;
    bottom:calc(86px + env(safe-area-inset-bottom));
    max-width:calc(100vw - 30px);
  }
  body:has(.submit-dock) .toasts {
    bottom:calc(150px + env(safe-area-inset-bottom));
  }
  .kv {
    font-size:12px;
  }
  .summary {
    font-size:12px;
  }
  .summary div {
    flex-wrap:wrap;
  }
  .clips-table {
    border:0;
    background:transparent;
    overflow:visible;
  }
  .clips-table table,.clips-table tbody {
    display:block;
  }
  .clips-table thead {
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
  }
  .clips-table tr {
    display:grid;
    grid-template-columns:1fr 1fr;
    background:white;
    border:1px solid var(--line);
    border-radius:4px;
    margin-bottom:14px;
    padding:15px;
    gap:12px;
  }
  .clips-table td {
    display:block;
    border:0;
    padding:0;
    white-space:normal;
    text-align:left!important;
    min-width:0;
  }
  .clips-table td:first-child {
    grid-column:1/-1;
    font-weight:700;
  }
  .clips-table td:before {
    content:attr(data-label);
    display:block;
    font-size:9px;
    font-weight:500;
    color:var(--muted);
    margin-bottom:4px;
  }
  .clips-table td:last-child {
    align-self:end;
  }
  .clips-table .sub {
    font-weight:400;
  }
  .clips-table td .btn {
    font-size:10px;
  }
  .role-brand .app-header,.role-admin .app-header {
    position:relative;
  }
  .role-admin .head h1 {
    font-size:30px;
  }
}
@media(max-width:480px) {
  .cards {
    grid-template-columns:1fr;
  }
  .mcard-content {
    padding:21px;
    gap:17px;
  }
  .mcard h3 {
    font-size:23px;
    min-height:0;
  }
  .mcard .rate b {
    font-size:37px;
  }
  .mcard .rate span {
    font-size:12px;
  }
  .mission-cover {
    aspect-ratio:2.05;
  }
  .cover-art {
    padding:25px;
  }
  .cover-art>span {
    font-size:37px;
  }
  .cover-art>b {
    font-size:176px;
    bottom:-20px;
    right:10px;
  }
  .cover-art small {
    font-size:8px;
  }
  .cover-category {
    font-size:10px;
    top:14px;
    right:14px;
  }
  .mcard .brand-line {
    font-size:12px;
  }
  .mcard .brand-avatar {
    width:25px;
    height:25px;
  }
  .mcard .live-dot {
    display:flex;
  }
  .card-foot {
    font-size:12px;
  }
  .meter-label {
    font-size:11px;
  }
  .balance-strip>a {
    margin-left:0;
  }
  .head h1 {
    font-size:31px;
  }
  .head-actions {
    width:100%;
  }
  .head-actions>.btn {
    flex:1;
  }
  .account-tools {
    gap:12px;
  }
  .cover-compact .cover-art {
    padding:4px;
  }
  .cover-compact .cover-art>span {
    font-size:9px;
  }
  .cover-compact .cover-art>b {
    font-size:51px;
    bottom:-6px;
    right:0;
  }
  .managed-cover>.mission-cover {
    width:95px;
    height:100px;
  }
  .managed-cover .cover-art {
    padding:10px;
  }
  .managed-cover .cover-art>b {
    font-size:90px;
  }
  .managed-cover .cover-category {
    display:none;
  }
  .review-filters select {
    font-size:13px;
  }
  .earnings-history .eyebrow {
    font-size:9px;
  }
  .app-footer {
    flex-direction:column;
    gap:7px;
  }
  .role-pick label {
    padding:12px;
  }
  .role-pick label:has(input:checked) {
    padding:11px;
  }
  .role-pick b {
    font-size:13px;
  }
  .role-pick span {
    font-size:11px;
  }
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

h1,h2,h3{overflow-wrap:anywhere}.head>div:first-child,.managed-cover>div:last-child{min-width:0;max-width:100%}.review-person b,.mission-byline b{max-width:100%;overflow-wrap:anywhere}.app-footer span{min-width:0;overflow-wrap:anywhere}.cover-upload .field{min-width:0}
.lifetime-note{margin-top:18px}.earnings-layout>div{min-width:0}

/* ---------- polish pass (Claude, 2 Oct) ---------- */
/* grid children with wide tables must not stretch the page on phones */
.page, .section, .story-section { grid-template-columns: minmax(0, 1fr); }
.earnings-chart .bar { fill: var(--orange); }
.earnings-chart .bar.zero { fill: var(--line-2); }
.earnings-chart .bar:hover { fill: var(--ink); }
@media (max-width: 760px) {
  .campaign-table .hide-sm { display: none; }
  .campaign-table table { min-width: 0; }
  .campaign-table th, .campaign-table td { padding: 10px 8px; }
  .campaign-name { min-width: 0; max-width: none; gap: 8px; }
  .campaign-name .mission-cover { display: none; }
  .campaign-name b { font-size: 13px; }
}
/* form rows: a hint under one field must not stretch its neighbours */
.grid-2, .grid-3 { align-items: start; }
/* page titles: product-sized, with real word spaces */
.head h1 { font-size: clamp(28px, 2.7vw, 38px); letter-spacing: -0.035em; }
@media (max-width: 760px) { .head h1 { font-size: 28px; } }