/* Doteira Social — brand theme.
   Dark (default): Phantom Epoch space navy with Doteira cyan. Light: publisher cream / navy / cyan.
   Game colours: Phantom Epoch = wordmark orange, Adventures = purple→orange, fulfillment lane = signal red. */
:root {
  --navy-900: #071020; --navy-800: #0b1a2e; --navy-700: #112640; --navy-600: #183556;
  --cyan: #19a9d8; --cyan-deep: #0a6fb5; --royal: #0d3f8a;
  --pe: #f2a65a; --pe-deep: #c77a2a; --adv: #8b2fc9; --adv-deep: #4b2a9e; --adv-sun: #f5a623;

  --bg: var(--navy-900); --bg-img: url(/brand/galaxy.jpg);
  --panel: #0f1f38; --panel-solid: #10203a; --ink: #e9f0fa; --muted: #9db0c8; --line: rgba(120, 160, 210, .22);
  --accent: var(--cyan); --accent-ink: #061322; --accent-soft: rgba(25, 169, 216, .16);
  --warn-bg: rgba(242, 166, 90, .18); --warn: #ffc98a; --danger: #ff8a8f; --danger-bg: rgba(255, 90, 100, .18);
  --ok: #6fe3a5; --ok-bg: rgba(60, 200, 130, .16); --chip: rgba(140, 175, 220, .14); --shadow: 0 6px 24px rgba(0, 0, 0, .35);
  --top-bg: linear-gradient(90deg, #0b1a2e 0%, #0d2f5a 60%, #0a4f8a 100%);
  --pe-chip-bg: rgba(242, 166, 90, .18); --pe-chip-ink: #ffc98a;
  --adv-chip-bg: rgba(139, 47, 201, .22); --adv-chip-ink: #d9b8ff;
  --ful-chip-bg: rgba(255, 90, 100, .18); --ful-chip-ink: #ffb3b7;
  color-scheme: dark;
}
/* Theme is resolved by a tiny script in index.html: data-theme = saved choice, else the device setting. */
:root[data-theme="light"] {
    --bg: #f6f1e7; --bg-img: none;
    --panel: #ffffff; --panel-solid: #ffffff; --ink: #0f2440; --muted: #5a6b80; --line: #dcd6c8;
    --accent: var(--cyan-deep); --accent-ink: #ffffff; --accent-soft: rgba(10, 111, 181, .10);
    --warn-bg: #fff0d6; --warn: #8a4b00; --danger: #a4262c; --danger-bg: #fde7e9;
    --ok: #1b7f3b; --ok-bg: #e3f5e8; --chip: #ece6d8; --shadow: 0 1px 3px rgba(15, 36, 64, .10);
    --top-bg: linear-gradient(90deg, #0b1a2e 0%, #0d3f8a 70%, #0a6fb5 100%);
    --pe-chip-bg: #ffe8cf; --pe-chip-ink: #8a4b00;
    --adv-chip-bg: #eadcff; --adv-chip-ink: #4b2a9e;
    --ful-chip-bg: #fde7e9; --ful-chip-ink: #7f1d1d;
    color-scheme: light;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--ink); font: 15px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif; min-height: 100%; }
body { min-height: 100vh; background-image: var(--bg-img); background-size: cover; background-position: center; background-attachment: fixed; }
body::before { content: ""; position: fixed; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(7, 16, 32, .86) 0%, rgba(7, 16, 32, .94) 40%, rgba(7, 16, 32, .985) 100%); pointer-events: none; }
.quick { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.quick button { border-radius: 999px; padding: 6px 12px; }
.quick button.active { background: var(--accent-soft); border-color: var(--accent); color: var(--accent); font-weight: 600; }
.quick button b { margin-left: 4px; }
.flag.wait { background: var(--warn-bg); color: var(--warn); }
.post-head h1 { font-size: 20px; } .post-head .code { font-size: 13px; letter-spacing: .06em; }
details > summary { cursor: pointer; }
.approve-row details { margin-top: 4px; white-space: pre-wrap; }
:root[data-theme="light"] body::before { display: none; }
.nav button.theme { background: transparent; border-color: rgba(255, 255, 255, .25); color: #d6e4f5; padding: 4px 9px; font-size: 15px; line-height: 1; }
.nav button.theme:hover { border-color: var(--cyan); color: #fff; }
.login .wordmark.wm-light { display: none; }
:root[data-theme="light"] .login .wordmark.wm-dark { display: none; }
:root[data-theme="light"] .login .wordmark.wm-light { display: block; }
a { color: var(--accent); }
button, select, input, textarea { font: inherit; color: inherit; }
button { background: var(--panel-solid); border: 1px solid var(--line); border-radius: 8px; padding: 8px 12px; cursor: pointer; }
button:hover { border-color: var(--accent); }
button.primary { background: linear-gradient(180deg, var(--cyan) 0%, var(--cyan-deep) 100%); color: #fff; border-color: transparent; font-weight: 600; text-shadow: 0 1px 1px rgba(0, 0, 0, .25); }
button.danger { background: var(--danger-bg); color: var(--danger); border-color: var(--danger); }
button:disabled { opacity: .5; cursor: not-allowed; }
input, select, textarea { background: var(--panel-solid); border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; width: 100%; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--accent); outline-offset: 0; border-color: var(--accent); }
textarea { min-height: 110px; resize: vertical; white-space: pre-wrap; }
label { display: block; font-size: 12px; color: var(--muted); margin: 10px 0 4px; text-transform: uppercase; letter-spacing: .06em; }

.top { position: sticky; top: 0; z-index: 5; background: var(--top-bg); color: #e9f0fa; border-bottom: 1px solid rgba(25, 169, 216, .35); display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; padding: 8px 14px; box-shadow: 0 2px 12px rgba(0, 0, 0, .25); }
.brand { font-weight: 700; display: flex; align-items: center; gap: 9px; white-space: nowrap; letter-spacing: .08em; text-transform: uppercase; font-size: 14px; }
.brand .brand-name b { color: var(--cyan); font-weight: 800; }
.logo { width: 30px; height: 30px; object-fit: contain; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .4)); }
.banner { font-size: 13px; padding: 6px 10px; border-radius: 8px; text-align: center; }
.banner.hold { background: rgba(242, 166, 90, .22); color: #ffd9a8; font-weight: 600; border: 1px solid rgba(242, 166, 90, .45); }
.banner.kill { background: rgba(255, 90, 100, .3); color: #ffd0d3; font-weight: 700; border: 1px solid rgba(255, 90, 100, .6); }
.banner.clear { background: rgba(60, 200, 130, .22); color: #c6f5d9; font-weight: 600; border: 1px solid rgba(60, 200, 130, .45); }
.nav { display: flex; gap: 4px; }
.nav a { text-decoration: none; padding: 6px 10px; border-radius: 8px; color: #d6e4f5; }
.nav a.active { background: rgba(25, 169, 216, .22); color: #fff; font-weight: 600; box-shadow: inset 0 -2px 0 var(--cyan); }

main { max-width: 1200px; margin: 0 auto; padding: 14px; }
.toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 12px; }
.toolbar select, .toolbar input { width: auto; }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 14px; box-shadow: var(--shadow); margin-bottom: 12px; }
.muted { color: var(--muted); font-size: 13px; }
.chip { display: inline-block; background: var(--chip); border-radius: 999px; padding: 2px 9px; font-size: 12px; margin-right: 4px; }
.chip.adventures { background: var(--adv-chip-bg); color: var(--adv-chip-ink); } .chip.phantom_epoch { background: var(--pe-chip-bg); color: var(--pe-chip-ink); } .chip.fulfillment { background: var(--ful-chip-bg); color: var(--ful-chip-ink); }
.chip.doteira { background: var(--accent-soft); color: var(--accent); }
.status { display: inline-block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; padding: 2px 7px; border-radius: 5px; background: var(--chip); }
.status.idea { color: var(--muted); } .status.draft { color: var(--accent); } .status.in_review { background: var(--warn-bg); color: var(--warn); }
.status.changes_requested { background: var(--danger-bg); color: var(--danger); } .status.approved { background: var(--ok-bg); color: var(--ok); }
.status.scheduled { background: var(--accent-soft); color: var(--accent); } .status.published { background: var(--ok); color: #062a14; } .status.missed, .status.archived { background: var(--danger-bg); color: var(--danger); }
.flag { font-size: 11px; padding: 1px 6px; border-radius: 4px; background: var(--danger-bg); color: var(--danger); font-weight: 600; }
.flag.ok { background: var(--ok-bg); color: var(--ok); }
.dest { font-size: 11px; font-weight: 700; padding: 1px 5px; border-radius: 4px; border: 1px solid var(--line); margin-right: 3px; }

/* game marks (wordmarks) */
.game-mark { height: 18px; width: auto; vertical-align: middle; object-fit: contain; }
.game-mark.adventures { height: 34px; }
.legend { display: flex; flex-wrap: wrap; gap: 10px; margin-left: auto; font-size: 12px; color: var(--muted); align-items: center; }
.legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 4px; vertical-align: -1px; }
.legend .adventures i { background: var(--adv); } .legend .phantom_epoch i { background: var(--pe); } .legend .fulfillment i { background: var(--danger); }

/* list */
.row { display: grid; grid-template-columns: 90px 1fr auto; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); cursor: pointer; }
.row:last-child { border-bottom: 0; }
.row:hover .title { color: var(--accent); }
.row .date { font-variant-numeric: tabular-nums; font-weight: 600; }
.row .title { font-weight: 600; }
.row .meta { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-top: 3px; }

/* calendar */
.cal-head { display: grid; grid-template-columns: repeat(7, 1fr); font-size: 12px; color: var(--muted); text-align: center; margin-bottom: 4px; text-transform: uppercase; letter-spacing: .06em; }
.cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.day { min-height: 92px; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 4px; font-size: 12px; }
.day.other { opacity: .45; } .day.today { outline: 2px solid var(--accent); }
.day .n { font-weight: 700; color: var(--muted); }
.ev { display: flex; gap: 6px; align-items: flex-start; margin-top: 3px; padding: 3px 5px; border-radius: 5px; background: var(--chip); color: var(--ink); text-decoration: none; font-size: 11px; line-height: 1.25; overflow: hidden; border-left: 3px solid var(--muted); }
.ev.adventures { border-left-color: var(--adv); background: var(--adv-chip-bg); } .ev.phantom_epoch { border-left-color: var(--pe); background: var(--pe-chip-bg); } .ev.fulfillment { border-left-color: var(--danger); background: var(--ful-chip-bg); }
.ev.scheduled { outline: 1px solid var(--accent); } .ev.approved { outline: 1px solid var(--ok); }
.ev .th { flex: none; width: 34px; height: 34px; object-fit: cover; border-radius: 4px; background: rgba(0, 0, 0, .35); }
.ev .th.none { display: grid; place-items: center; font-size: 14px; opacity: .6; }
.ev-body { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ev-title { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.ev-meta { display: flex; flex-wrap: wrap; gap: 3px; align-items: center; }
.ev-meta .status { font-size: 9px; padding: 0 4px; letter-spacing: .03em; } .ev-meta .dest { font-size: 9px; padding: 0 3px; margin: 0; }
.ev-meta .flag { font-size: 9px; padding: 0 4px; }
.ev.md { flex-direction: column; gap: 6px; padding: 6px; font-size: 12px; }
.ev.md .th { width: 100%; height: 110px; border-radius: 6px; }
.ev.md .ev-meta .status, .ev.md .ev-meta .dest, .ev.md .ev-meta .flag { font-size: 10px; }
.modes { margin-left: auto; margin-bottom: 0; }
.week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.wk-day { min-height: 180px; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 6px; }
.wk-day.today { outline: 2px solid var(--accent); }
.wk-head { font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; margin-bottom: 4px; }
.wk-head b { color: var(--ink); font-size: 16px; margin-left: 4px; }
.agenda-day { display: grid; grid-template-columns: 120px 1fr; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.agenda-day:last-child { border-bottom: 0; }
.agenda-day.past { opacity: .55; }
.agenda-day .d { font-weight: 600; font-variant-numeric: tabular-nums; } .agenda-day .d small { display: block; color: var(--muted); font-weight: 400; }
.agenda-day .ev { margin-top: 0; margin-bottom: 6px; font-size: 13px; } .agenda-day .ev .th { width: 56px; height: 56px; }
.backlog { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; }
.backlog .ev { margin: 0; }

/* detail */
.detail { display: grid; grid-template-columns: 1.4fr 1fr; gap: 14px; }
.cols { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.caption-head { display: flex; justify-content: space-between; align-items: center; margin-top: 12px; }
.counter { font-size: 12px; color: var(--muted); }
.preview { width: 100%; max-height: 420px; background: #000; border-radius: 10px; object-fit: contain; }
.asset-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.asset-grid .card { margin: 0; }
.asset-grid .preview { max-height: 240px; }
.gates { font-size: 13px; }
.gates li { list-style: none; padding: 3px 0; }
.gates .pass::before { content: "✔ "; color: var(--ok); } .gates .fail::before { content: "✖ "; color: var(--danger); }
pre { background: var(--chip); padding: 10px; border-radius: 8px; overflow: auto; font-size: 12px; white-space: pre-wrap; }
.actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.toast { position: fixed; bottom: 18px; left: 50%; transform: translateX(-50%); background: var(--navy-700); color: #fff; border: 1px solid var(--accent); padding: 10px 16px; border-radius: 10px; z-index: 20; max-width: 90vw; box-shadow: var(--shadow); }
.toast.err { background: var(--danger); color: #fff; border-color: transparent; }
.approve-panel { border: 2px solid var(--ok); border-radius: 10px; padding: 10px; margin-top: 8px; background: var(--ok-bg); }
.approve-row { display: block; text-transform: none; letter-spacing: 0; font-size: 14px; color: var(--ink); padding: 6px 0; border-bottom: 1px dashed var(--line); }
.approve-row.blocked { opacity: .6; }
.approve-row .excerpt { font-size: 12px; color: var(--muted); white-space: pre-wrap; margin-left: 22px; }
button.big { font-size: 16px; padding: 12px 18px; width: 100%; }
.rev { font-size: 12px; border-top: 1px dashed var(--line); padding: 6px 0; }
.kv { display: grid; grid-template-columns: 150px 1fr; gap: 4px 10px; font-size: 13px; }
.kv > span, .kv > b { min-width: 0; overflow-wrap: anywhere; } /* long provider errors must wrap, not widen the page */
h1 { font-size: 22px; margin: 4px 0 10px; letter-spacing: .02em; } h2 { font-size: 15px; margin: 0 0 8px; text-transform: uppercase; letter-spacing: .08em; color: var(--accent); } h3 { font-size: 14px; margin: 12px 0 6px; }

/* asset picker */
.attached { display: flex; flex-direction: column; gap: 6px; margin: 8px 0; }
.attached .row-a { display: grid; grid-template-columns: 56px 1fr auto; gap: 10px; align-items: center; padding: 6px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel-solid); }
.attached .row-a img, .picker .pick img { width: 56px; height: 56px; object-fit: cover; border-radius: 6px; background: #000; }
.attached .row-a .t { font-weight: 600; } .attached .row-a .m { font-size: 12px; color: var(--muted); }
.attached .row-a .ctl { display: flex; gap: 4px; } .attached .row-a .ctl button { padding: 4px 8px; }
.attached .row-a.primary { border-color: var(--accent); }
.modal-back { position: fixed; inset: 0; background: rgba(3, 8, 18, .7); z-index: 30; display: flex; align-items: flex-start; justify-content: center; padding: 30px 12px; overflow: auto; }
.modal { background: var(--panel-solid); border: 1px solid var(--line); border-radius: 14px; width: min(980px, 100%); padding: 14px; box-shadow: var(--shadow); }
.modal .toolbar input { flex: 1; min-width: 160px; }
.picker { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; max-height: 60vh; overflow: auto; margin-top: 8px; }
.picker .pick { display: grid; grid-template-columns: 56px 1fr; gap: 8px; align-items: center; padding: 8px; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; background: var(--panel); text-align: left; }
.picker .pick:hover { border-color: var(--accent); }
.picker .pick.used { opacity: .5; cursor: default; }
.picker .pick .t { font-weight: 600; font-size: 13px; } .picker .pick .m { font-size: 11px; color: var(--muted); }
.dest-opts { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin: 6px 0 10px; }
.dest-opts label { margin: 0 0 2px; }
.dest-opts input, .dest-opts select { width: 100%; }
@media (max-width: 760px) { .dest-opts { grid-template-columns: 1fr; } .picker { grid-template-columns: 1fr; } }

/* inbox */
.nav-count { display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 4px; border-radius: 999px; background: var(--pe); color: #1a0d00; font-size: 11px; font-weight: 700; text-align: center; vertical-align: 1px; }
.inb { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: start; padding: 10px 0; border-bottom: 1px solid var(--line); }
.inb:last-child { border-bottom: 0; }
.inb.done, .inb.ignored { opacity: .6; }
.inb .who { font-weight: 600; } .inb .txt { white-space: pre-wrap; margin: 2px 0; }
.inb .meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 12px; color: var(--muted); }
.inb .meta .chip { margin: 0; }
.inb .ctl { display: flex; flex-direction: column; gap: 4px; align-items: stretch; }
.inb .ctl button, .inb .ctl select { padding: 4px 8px; font-size: 12px; }
.inb .kindmark { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 14px; background: var(--chip); }
.inb.comment .kindmark { background: var(--adv-chip-bg); } .inb.message .kindmark { background: var(--pe-chip-bg); } .inb.mention .kindmark { background: var(--accent-soft); }
.inb .note { font-size: 12px; color: var(--muted); font-style: italic; }
.sync-note { font-size: 12px; color: var(--muted); }
.inb .sent { font-size: 13px; margin: 4px 0; padding-left: 8px; border-left: 3px solid var(--ok); }
.inb .w { font-size: 12px; color: var(--muted); }
.reply-box { margin-top: 6px; } .reply-box textarea { min-height: 54px; font-size: 13px; }
.reply-box .actions { margin-top: 4px; align-items: center; }
.sync-note .warn { color: var(--warn); }

/* outcomes */
.metrics { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 6px; margin: 6px 0; }
.metrics label { margin: 0 0 2px; } .metrics input { width: 100%; padding: 5px 8px; }
.out-dest { border-top: 1px dashed var(--line); padding: 8px 0; }
.out-dest h3 { margin: 0 0 4px; }
.conv { padding: 6px 0; border-bottom: 1px dashed var(--line); font-size: 13px; }
.conv .w { color: var(--muted); font-size: 12px; }
.conv.fu { border-left: 3px solid var(--pe); padding-left: 8px; }
table.out { width: 100%; border-collapse: collapse; font-size: 13px; }
table.out th, table.out td { text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
table.out th { color: var(--muted); font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; }
table.out td.num { text-align: right; font-variant-numeric: tabular-nums; }
.tracked { font-size: 12px; word-break: break-all; }

/* health */
.health .warn { background: var(--warn-bg); color: var(--warn); border-radius: 6px; padding: 6px 10px; margin-bottom: 6px; font-size: 13px; }
.health .kv { grid-template-columns: 130px 1fr; }

/* needs */
.need { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: start; padding: 8px 0; border-bottom: 1px dashed var(--line); text-transform: none; letter-spacing: 0; font-size: 14px; color: var(--ink); margin: 0; }
.need:last-of-type { border-bottom: 0; }
.need.done .need-text { text-decoration: line-through; opacity: .6; }
.need-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.need-meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 12px; }
.need-meta .chip { margin: 0; }
.need-del { background: transparent; border-color: transparent; color: var(--muted); padding: 2px 6px; }
.need-del:hover { color: var(--danger); border-color: var(--danger); }
.need-form { display: grid; grid-template-columns: 1fr auto auto auto auto; gap: 6px; align-items: center; margin-top: 10px; }
.need-form select, .need-form input { width: auto; }
.need-form input { width: 100%; }
.flag.need-badge { background: var(--pe-chip-bg); color: var(--pe-chip-ink); }
details.card summary { cursor: pointer; font-weight: 600; }
@media (max-width: 760px) { .need-form { grid-template-columns: 1fr 1fr; } .need-form input { grid-column: 1 / -1; } }

/* login */
.login { max-width: 440px; margin: 40px auto; text-align: center; }
.login .wordmark { display: block; width: 240px; max-width: 70%; margin: 0 auto 6px; border-radius: 12px; }
.login h1 { margin-top: 0; }
.login input { text-align: center; letter-spacing: .08em; }
.login .pe-strip { display: flex; justify-content: center; gap: 18px; align-items: center; margin-top: 18px; opacity: .85; }
.login .pe-strip img { height: 16px; } .login .pe-strip img.adventures { height: 34px; }

@media (max-width: 760px) {
  .top { grid-template-columns: auto 1fr; gap: 6px; padding: 6px 10px; }
  .brand { font-size: 13px; gap: 6px; }
  .banner { grid-column: 1 / -1; order: 3; font-size: 12px; padding: 5px 8px; }
  .nav { justify-content: flex-end; gap: 2px; min-width: 0; }
  .nav a { padding: 5px 6px; font-size: 13px; }
  .detail, .cols { grid-template-columns: 1fr; }
  .row { grid-template-columns: 70px 1fr; } .row > :last-child { grid-column: 2; }
  .day { min-height: 64px; } .ev { font-size: 10px; }
  .day .ev .th, .day .ev .ev-meta { display: none; }
  .agenda-day .ev .th { width: 44px; height: 44px; }
  .week { grid-template-columns: 1fr; } .wk-day { min-height: 0; }
  .agenda-day { grid-template-columns: 1fr; gap: 4px; }
  .modes { margin-left: 0; }
  .legend { margin-left: 0; width: 100%; }
  body { background-attachment: scroll; }
  main { padding: 10px; }
}
@media (max-width: 430px) { .brand-name { display: none; } }

/* team (Status page, owner-only) */
.team-row { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line); }
.team-row:last-child { border-bottom: 0; }
.team-row.disabled { opacity: .55; }
.team-row .ctl { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.team-row .ctl select, .team-row .ctl button { width: auto; padding: 4px 8px; font-size: 12px; }
.team-add { grid-template-columns: 1fr auto auto; }
.token-modal { width: min(560px, 100%); }
.token-modal input { font-family: ui-monospace, Consolas, monospace; font-size: 13px; }
body.viewer main button:disabled, body.viewer main input:disabled, body.viewer main textarea:disabled, body.viewer main select:disabled { opacity: .6; }
@media (max-width: 760px) { .team-row { grid-template-columns: 1fr; } .team-row .ctl { justify-content: flex-start; } }

/* uploads (Assets page) */
.upload-progress { display: flex; gap: 10px; align-items: center; margin-top: 10px; }
.upload-progress .bar { flex: 1; height: 8px; border-radius: 999px; background: var(--chip); overflow: hidden; }
.upload-progress .bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--cyan), var(--cyan-deep)); transition: width .2s; }