/*
 * Account and player-home presentation layer.
 * Kept separate from tracker styles so portal updates cannot be hidden by a
 * stale cached copy of the original tracker stylesheet.
 */

.portal-view {
  min-height: 100vh;
  color: var(--text);
  background:
    radial-gradient(circle at 14% 10%, rgba(215,171,92,.09), transparent 30rem),
    radial-gradient(circle at 86% 84%, rgba(94,133,85,.09), transparent 34rem),
    var(--bg);
}

.portal-center {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}

.portal-loading {
  display: grid;
  justify-items: center;
  gap: 14px;
  color: var(--muted);
}

/* ---------- Authentication ---------- */
.auth-layout {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(420px, .65fr);
  gap: 20px;
  padding: 20px;
}

.auth-story {
  position: relative;
  isolation: isolate;
  min-height: calc(100vh - 40px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: clamp(30px, 4.2vw, 68px);
  border: 1px solid #35433a;
  border-radius: 24px;
  background:
    linear-gradient(130deg, rgba(22,34,27,.96), rgba(9,14,11,.98)),
    var(--panel);
  box-shadow: var(--shadow);
}

.auth-story::before {
  content: 'ᛉ';
  position: absolute;
  z-index: -1;
  right: -16px;
  top: 36px;
  color: rgba(215,171,92,.055);
  font-family: Georgia, serif;
  font-size: min(42vw, 520px);
  line-height: .8;
  transform: rotate(7deg);
}

.auth-story::after {
  content: '';
  position: absolute;
  z-index: -2;
  inset: 0;
  background:
    radial-gradient(circle at 15% 16%, rgba(215,171,92,.18), transparent 23rem),
    radial-gradient(circle at 78% 74%, rgba(93,137,83,.12), transparent 26rem);
}

.auth-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  width: max-content;
  color: var(--text);
  text-decoration: none;
}

.auth-brand strong,
.auth-brand small { display: block; }
.auth-brand strong { font-size: 14px; }
.auth-brand small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 10px;
}

.auth-copy {
  max-width: 850px;
  padding: clamp(40px, 8vh, 100px) 0 38px;
}

.auth-story h1 {
  max-width: 900px;
  margin: 10px 0 16px;
  font-family: Georgia, serif;
  font-size: clamp(42px, 5.5vw, 78px);
  font-weight: 600;
  letter-spacing: -.035em;
  line-height: .98;
}

.auth-story > div > p,
.auth-copy > p {
  max-width: 690px;
  margin: 0;
  color: #b3beb6;
  font-size: clamp(14px, 1.25vw, 18px);
  line-height: 1.7;
}

.auth-features {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
}

.auth-features div {
  min-height: 118px;
  padding: 17px;
  border: 1px solid rgba(67,84,72,.9);
  border-radius: 15px;
  background: rgba(6,11,8,.54);
  backdrop-filter: blur(10px);
}

.auth-feature-icon {
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  margin-bottom: 20px;
  border: 1px solid #6c5934;
  border-radius: 9px;
  color: var(--gold-2);
  background: #211c13;
  font-size: 13px;
}

.auth-features strong,
.auth-features span { display: block; }
.auth-features strong { font-size: 12px; }
.auth-features span {
  margin-top: 7px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.55;
}

.auth-panel {
  display: grid;
  align-content: center;
  min-width: 0;
  padding: clamp(16px, 3vw, 42px);
}

.auth-card {
  width: min(470px, 100%);
  margin: auto;
  padding: 24px;
  border: 1px solid #3b4a3f;
  border-radius: 20px;
  background:
    linear-gradient(160deg, rgba(24,34,27,.99), rgba(12,18,14,.99));
  box-shadow: 0 24px 80px rgba(0,0,0,.34);
}

.auth-card-heading { margin-bottom: 20px; }
.auth-card-heading h2 {
  margin: 6px 0 7px;
  font-family: Georgia, serif;
  font-size: 29px;
  font-weight: 600;
}
.auth-card-heading p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.55;
}

.auth-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
  margin-bottom: 20px;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #090e0b;
}

.auth-tabs button {
  min-height: 38px;
  padding: 9px;
  border: 0;
  border-radius: 9px;
  color: var(--muted);
  background: transparent;
  font-size: 11px;
  font-weight: 850;
}

.auth-tabs button.active {
  color: var(--text);
  background: linear-gradient(180deg, #263429, #1b271f);
  box-shadow: 0 1px 0 rgba(255,255,255,.04) inset;
}

.portal-form { display: grid; gap: 12px; }
.portal-form .field { margin: 0; }
.portal-form .field > span {
  margin-bottom: 7px;
  color: #cbd3cd;
  font-size: 10px;
  font-weight: 750;
}
.portal-form .field input,
.portal-form .field select {
  min-height: 43px;
  border-color: #344238;
  background: #0b110d;
}
.portal-form .field input:focus,
.portal-form .field select:focus {
  border-color: #806936;
  box-shadow: 0 0 0 3px rgba(215,171,92,.09);
}
.portal-form .field small { margin-top: 6px; }
.portal-submit {
  width: 100%;
  min-height: 43px;
  margin-top: 3px;
}

.form-error {
  margin: 0;
  padding: 10px;
  border: 1px solid #74403d;
  border-radius: 10px;
  color: #ffd7d4;
  background: #3b2321;
  font-size: 10px;
}

.invite-banner {
  margin-bottom: 17px;
  padding: 14px;
  border: 1px solid #725d34;
  border-radius: 12px;
  background: linear-gradient(145deg,#2a2316,#1c1911);
}
.invite-banner strong,
.invite-banner small { display:block; }
.invite-banner strong { margin-top: 6px; }
.invite-banner small {
  margin-top: 6px;
  color: #c9b98f;
  font-size: 10px;
  line-height: 1.45;
}
.invite-banner.error {
  border-color: #74403d;
  background: #3b2321;
}

.auth-footnote {
  margin: 17px 0 0;
  color: #6f7c73;
  font-size: 9px;
  line-height: 1.5;
  text-align: center;
}

/* ---------- Player home ---------- */
.portal-shell {
  width: min(1540px, 100%);
  margin: auto;
  padding: 18px 28px 60px;
}

.portal-header {
  position: sticky;
  top: 0;
  z-index: 10;
  min-height: 66px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(43,56,47,.85);
  background: rgba(9,13,11,.88);
  backdrop-filter: blur(18px);
}

.portal-account {
  display: flex;
  align-items: center;
  gap: 10px;
}
.portal-account > span strong,
.portal-account > span small { display:block; }
.portal-account > span strong { font-size: 11px; }
.portal-account > span small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 9px;
}

.avatar {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid #695730;
  border-radius: 11px;
  color: var(--gold-2);
  background: linear-gradient(145deg,#302718,#171711);
  font-size: 10px;
  font-weight: 900;
}

.portal-welcome {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 22px;
  margin: 20px 0 18px;
  padding: 29px;
  border: 1px solid #344239;
  border-radius: 20px;
  background: linear-gradient(120deg,rgba(31,44,35,.98),rgba(13,19,15,.98));
  box-shadow: var(--shadow);
}

.portal-welcome::after {
  content: 'ᛉ';
  position: absolute;
  right: 22px;
  top: -58px;
  color: rgba(215,171,92,.05);
  font-family: Georgia, serif;
  font-size: 220px;
  transform: rotate(7deg);
  pointer-events: none;
}
.portal-welcome > * { position: relative; z-index: 1; }
.portal-welcome h1 {
  margin: 7px 0 8px;
  font-family: Georgia, serif;
  font-size: clamp(35px, 4.6vw, 56px);
  font-weight: 600;
  letter-spacing: -.025em;
  line-height: 1;
}
.portal-welcome p {
  max-width: 720px;
  margin: 0;
  color: #aab6ad;
  line-height: 1.55;
}

.portal-grid {
  display: grid;
  grid-template-columns: minmax(0,1fr) 330px;
  gap: 18px;
}

.portal-main-column { min-width: 0; }
.section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.section-heading h2,
.section-heading h3 { margin: 4px 0 0; }
.section-heading h2 { font-size: 18px; }
.section-heading h3 { font-size: 15px; }
.section-heading > span {
  color: var(--muted);
  font-size: 10px;
}

.campaign-home-grid {
  position: relative;
  display: grid;
  gap: 12px;
}
.campaign-home-grid::before {
  content: '';
  position: absolute;
  left: 28px;
  top: 52px;
  bottom: 52px;
  width: 2px;
  background: linear-gradient(var(--gold), #465249);
  opacity: .42;
}

.campaign-home-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(210px,.95fr) minmax(280px,1.3fr) auto;
  align-items: center;
  gap: 20px;
  min-height: 156px;
  padding: 20px 20px 20px 78px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(155deg,rgba(24,33,27,.98),rgba(12,18,14,.98));
  box-shadow: 0 12px 36px rgba(0,0,0,.14);
}
.campaign-home-card::before {
  content: 'ᚠ';
  position: absolute;
  z-index: 1;
  left: 10px;
  top: 50%;
  width: 39px;
  height: 39px;
  display: grid;
  place-items: center;
  border: 1px solid #6a5730;
  border-radius: 50%;
  color: var(--gold-2);
  background: #211d14;
  transform: translateY(-50%);
  font-family: Georgia, serif;
  font-size: 15px;
}
.campaign-home-card:hover {
  border-color: #536050;
  transform: translateY(-1px);
}
.campaign-home-card > header {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.campaign-home-card h3 {
  margin: 6px 0 0;
  overflow: hidden;
  font-size: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.role-badge {
  display: inline-flex;
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 99px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.role-badge.owner { border-color:#806835; color:var(--gold-2); }
.role-badge.admin { border-color:#4d6d7b; color:#b9d5df; }

.campaign-card-middle { min-width: 0; }
.campaign-home-stats {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 8px;
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 9px;
}
.campaign-home-stats span {
  min-width: 0;
  padding: 9px;
  border: 1px solid rgba(43,56,47,.75);
  border-radius: 10px;
  background: rgba(6,10,7,.32);
}
.campaign-home-stats strong {
  display: block;
  margin-bottom: 2px;
  color: var(--text);
  font-size: 14px;
}

.compact-field {
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  align-items: center;
  gap: 8px;
  margin-top: 12px;
}
.compact-field span {
  color: var(--muted);
  font-size: 9px;
}
.compact-field select,
.field select,
.member-row select {
  min-width: 0;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--text);
  background: #0d130f;
  outline: 0;
}

.campaign-home-card footer {
  min-width: 155px;
  display: grid;
  justify-items: end;
  gap: 16px;
  margin: 0;
}
.campaign-home-card footer small {
  color: var(--muted);
  font-size: 8px;
}
.campaign-home-card footer > div {
  display: grid;
  gap: 7px;
  width: 100%;
}
.campaign-home-card footer .button { width: 100%; }

.character-panel {
  height: max-content;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(160deg,rgba(23,32,26,.97),rgba(13,19,15,.97));
}
.character-list { display:grid; gap:8px; }
.character-row {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:11px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#0c120e;
}
.character-rune {
  width:35px;
  height:35px;
  display:grid;
  place-items:center;
  border:1px solid #5e4e2d;
  border-radius:10px;
  color:var(--gold);
  background:#211c13;
}
.character-row strong,
.character-row small { display:block; }
.character-row small {
  margin-top:4px;
  color:var(--muted);
  font-size:8px;
}
.small-icon { width:31px; height:31px; }
.inline-create {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:7px;
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid var(--line);
}
.inline-create input {
  min-width:0;
  padding:10px;
  border:1px solid var(--line);
  border-radius:9px;
  color:var(--text);
  background:#0d130f;
  outline:0;
}

.portal-empty {
  display:grid;
  justify-items:center;
  padding:56px 20px;
  border:1px dashed var(--line-bright);
  border-radius:16px;
  text-align:center;
}
.portal-empty h3 { margin:14px 0 5px; }
.portal-empty p {
  max-width:420px;
  margin:0 0 16px;
  color:var(--muted);
}

/* Existing invite/member dialogs */
.portal-dialog { width:min(720px,calc(100vw - 24px)); }
.portal-dialog form { padding:22px; }
.two-field-row,
.three-field-row {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.three-field-row { grid-template-columns:repeat(3,minmax(0,1fr)); }
.field select { width:100%; }
.invite-page { background:radial-gradient(circle at center,rgba(215,171,92,.09),transparent 34rem); }
.invite-accept-card h1,
.invite-result h1 {
  margin:10px 0;
  font-family:Georgia,serif;
  font-size:34px;
  font-weight:600;
}
.invite-accept-card > p,
.invite-result p { color:var(--muted); line-height:1.6; }
.invite-restriction {
  margin:14px 0 4px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:9px;
  background:#0d130f;
  color:var(--muted);
  font-size:11px;
}
.invite-result { text-align:center; }
.invite-result .brand-rune { margin:auto; }

.account-pill {
  height:39px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 10px 0 5px;
  border:1px solid var(--line);
  border-radius:11px;
  color:var(--text);
  background:var(--panel);
}
.account-pill span {
  width:29px;
  height:29px;
  display:grid;
  place-items:center;
  border-radius:8px;
  color:var(--gold-2);
  background:#241f15;
  font-size:9px;
  font-weight:900;
}
.account-pill strong { font-size:10px; }
.wide-dialog {
  width:min(1060px,calc(100vw - 24px));
  max-height:calc(100vh - 30px);
  overflow:auto;
}
.manager-shell { padding:21px; }
.manager-shell .dialog-header p {
  margin:5px 0 0;
  color:var(--muted);
  font-size:10px;
}
.manager-settings { padding:0 0 17px!important; border-bottom:1px solid var(--line); }
.manager-settings .field { margin-top:9px; }
.manager-grid {
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:22px;
  margin-top:19px;
}
.member-list { display:grid; gap:7px; }
.member-row {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto auto auto;
  align-items:center;
  gap:8px;
  padding:9px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#0d130f;
}
.member-row strong,
.member-row small { display:block; }
.member-row small {
  margin-top:3px;
  color:var(--muted);
  font-size:9px;
}
.member-row select { padding:7px; font-size:10px; }
.invite-form { padding:0!important; }
.pending-invites {
  margin-top:18px;
  padding-top:15px;
  border-top:1px solid var(--line);
}
.pending-invites h4 { margin:0 0 9px; font-size:11px; }
.invite-history-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:9px 0;
  border-bottom:1px solid rgba(43,56,47,.7);
}
.invite-history-row strong,
.invite-history-row small { display:block; }
.invite-history-row strong { font-size:10px; }
.invite-history-row small {
  margin-top:3px;
  color:var(--muted);
  font-size:9px;
}
.new-invite-result {
  margin-top:13px;
  padding:12px;
  border:1px solid #55705a;
  border-radius:11px;
  background:#132018;
}
.new-invite-result > strong,
.new-invite-result > small { display:block; }
.new-invite-result > strong { margin-top:5px; }
.new-invite-result > small {
  margin-top:7px;
  color:var(--muted);
  font-size:9px;
}
.new-invite-result > div {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:7px;
  margin-top:9px;
}
.new-invite-result input {
  min-width:0;
  padding:9px;
  border:1px solid var(--line);
  border-radius:8px;
  color:var(--text);
  background:#0b100d;
}

@media (max-width: 1180px) {
  .auth-layout { grid-template-columns:minmax(0,1fr) minmax(390px,.72fr); }
  .auth-features { grid-template-columns:1fr; }
  .auth-features div { min-height:0; }
  .auth-feature-icon { display:none; }
  .campaign-home-card {
    grid-template-columns:minmax(190px,.9fr) minmax(250px,1.1fr);
  }
  .campaign-home-card footer {
    grid-column:1/-1;
    grid-template-columns:1fr auto;
    align-items:center;
    justify-items:start;
    min-width:0;
  }
  .campaign-home-card footer > div {
    grid-template-columns:auto auto;
    width:auto;
  }
}

@media (max-width: 980px) {
  .auth-layout { grid-template-columns:1fr; padding:14px; }
  .auth-story { min-height:auto; padding:28px; }
  .auth-copy { padding:70px 0 30px; }
  .auth-features { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .auth-panel { padding:25px 10px 35px; }
  .portal-grid { grid-template-columns:1fr; }
  .character-panel { order:-1; }
  .campaign-home-card { grid-template-columns:minmax(0,1fr); padding-left:72px; }
  .campaign-home-card footer { grid-column:auto; }
  .manager-grid { grid-template-columns:1fr; }
}

@media (max-width: 700px) {
  .auth-story { padding:24px 20px; border-radius:18px; }
  .auth-story h1 { font-size:40px; }
  .auth-copy { padding:55px 0 28px; }
  .auth-features { grid-template-columns:1fr; }
  .auth-features div { min-height:0; }
  .auth-panel { padding:18px 0 28px; }
  .auth-card { padding:19px; }
  .portal-shell { padding:12px 14px 45px; }
  .portal-header { align-items:flex-start; }
  .portal-account > span:not(.avatar) { display:none; }
  .portal-welcome { align-items:flex-start; display:grid; padding:22px; }
  .portal-welcome h1 { font-size:39px; }
  .campaign-home-grid::before { display:none; }
  .campaign-home-card { padding:18px; }
  .campaign-home-card::before { display:none; }
  .campaign-home-stats { grid-template-columns:repeat(3,1fr); }
  .campaign-home-card footer {
    display:grid;
    grid-template-columns:1fr;
  }
  .campaign-home-card footer > div { width:100%; grid-template-columns:1fr 1fr; }
  .two-field-row,
  .three-field-row { grid-template-columns:1fr; }
  .member-row { grid-template-columns:auto minmax(0,1fr) auto; }
  .member-row select,
  .member-row .small-icon { grid-row:2; grid-column:auto; }
  .account-pill strong { display:none; }
}


/* ---------- V3 homepage alignment, direct invitations, and notifications ---------- */
.portal-header-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;min-width:0}.header-action{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}.notification-action{position:relative}.notification-action b{min-width:19px;height:19px;display:grid;place-items:center;margin-left:2px;border-radius:99px;color:#17130b;background:var(--gold-2);font-size:9px}.campaign-home-grid{grid-template-columns:minmax(0,1fr)!important}.campaign-home-card{grid-template-columns:minmax(205px,.82fr) minmax(360px,1.55fr) minmax(165px,.55fr);align-items:stretch}.campaign-card-identity,.campaign-card-middle,.campaign-card-actions{min-width:0}.campaign-card-identity{align-self:center}.campaign-card-identity>div>small{display:block;margin-top:8px;color:var(--muted);font-size:8px}.campaign-card-middle{display:grid;grid-template-rows:auto auto auto;align-content:center;gap:10px}.campaign-home-stats{margin:0}.campaign-home-stats span{display:grid;align-content:center;min-height:56px;padding:10px 12px}.campaign-home-stats small{display:block;color:var(--muted);font-size:8px;text-transform:uppercase;letter-spacing:.07em}.compact-field{grid-template-columns:72px minmax(0,1fr);margin:0}.compact-field select{width:100%}.campaign-card-actions{align-self:stretch;display:grid!important;grid-template-rows:auto 1fr;justify-items:stretch!important;gap:11px!important;padding-left:17px;border-left:1px solid rgba(43,56,47,.75)}.campaign-card-actions>small{text-align:right}.campaign-card-actions>div{align-self:end;display:grid!important;grid-template-columns:1fr!important;width:100%!important}.campaign-card-actions .button{width:100%}.action-dialog .dialog-header p,.notifications-dialog .dialog-header p{max-width:560px;margin:6px 0 0;color:var(--muted);font-size:10px;line-height:1.5}.notification-shell{padding:22px}.notification-list{display:grid;gap:10px}.notification-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:13px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:13px;background:linear-gradient(155deg,rgba(24,33,27,.98),rgba(12,18,14,.98))}.notification-rune{width:42px;height:42px;display:grid;place-items:center;border:1px solid #6a5730;border-radius:12px;color:var(--gold-2);background:#211d14}.notification-copy h3{margin:4px 0 5px;font-size:15px}.notification-copy p{margin:0;color:#bac4bc;font-size:10px}.notification-copy>small{display:block;margin-top:5px;color:var(--muted);font-size:8px}.notification-character{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(160px,1fr);gap:7px;margin-top:10px}.notification-character select,.notification-character input{min-width:0;padding:9px;border:1px solid var(--line);border-radius:9px;color:var(--text);background:#0d130f}.notification-buttons{display:grid;gap:7px;min-width:90px}.compact-empty{padding:35px 20px}.portal-dialog.action-dialog{width:min(620px,calc(100vw - 24px))}.notifications-dialog{width:min(820px,calc(100vw - 24px))}
@media(max-width:1180px){.campaign-home-card{grid-template-columns:minmax(190px,.78fr) minmax(330px,1.35fr)}.campaign-card-actions{grid-column:1/-1;grid-template-columns:1fr auto!important;grid-template-rows:auto!important;align-items:center;padding:12px 0 0;border-left:0;border-top:1px solid rgba(43,56,47,.75)}.campaign-card-actions>div{grid-template-columns:repeat(3,auto)!important;width:auto!important;justify-self:end}.campaign-card-actions>small{text-align:left}}
@media(max-width:980px){.portal-header{align-items:flex-start}.portal-header-actions{flex-wrap:wrap}.campaign-home-card{grid-template-columns:minmax(0,1fr);padding-left:72px}.campaign-card-actions{grid-column:auto}.character-panel{order:0}}
@media(max-width:760px){.portal-header-actions{width:100%}.portal-header{flex-wrap:wrap}.header-action{flex:1;justify-content:center}.portal-account{width:100%;justify-content:flex-end}.campaign-home-card{padding:18px}.campaign-card-actions{grid-template-columns:1fr!important}.campaign-card-actions>div{grid-template-columns:1fr 1fr!important;width:100%!important}.campaign-card-actions>div .button:last-child{grid-column:1/-1}.notification-card{grid-template-columns:auto minmax(0,1fr)}.notification-buttons{grid-column:1/-1;grid-template-columns:1fr 1fr}.notification-character{grid-template-columns:1fr}.portal-welcome{display:grid;align-items:start}}


/* ---------- V4 archival, deletion, and roster controls ---------- */
.character-actions{display:flex;align-items:center;gap:5px}.danger-icon{border-color:#5f3734;color:#d8a09c;background:#241615}.danger-icon:hover{border-color:#8d4c47;color:#ffd7d4}.archive-section{margin-top:28px;padding-top:22px;border-top:1px solid var(--line)}.archived-campaign-grid{display:grid;gap:9px}.archived-campaign-card{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 16px;border:1px solid rgba(43,56,47,.78);border-radius:13px;background:linear-gradient(155deg,rgba(18,25,20,.82),rgba(10,14,12,.9));opacity:.88}.archived-campaign-identity{display:flex;align-items:center;gap:12px;min-width:0}.archived-campaign-identity h3{margin:4px 0 3px;font-size:15px}.archived-campaign-identity small{display:block;color:var(--muted);font-size:8px}.archive-rune{width:38px;height:38px;display:grid;place-items:center;flex:0 0 auto;border:1px solid #5c5544;border-radius:10px;color:#b8ae93;background:#1b1a15}.archived-campaign-actions{display:flex;align-items:center;gap:9px}.archive-banner{display:flex;align-items:center;gap:12px;margin:0 0 17px;padding:13px;border:1px solid #5b5545;border-radius:12px;background:#1a1914}.archive-banner strong,.archive-banner small{display:block}.archive-banner small{margin-top:4px;color:var(--muted);font-size:9px;line-height:1.45}.manager-danger-zone{margin-top:23px;padding-top:20px;border-top:1px solid #533735}.manager-danger-zone>.section-heading{margin-bottom:10px}.manager-danger-zone .eyebrow{color:#d58e88}.danger-action{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.75fr);align-items:center;gap:18px;padding:14px;border:1px solid #5f3734;border-radius:12px;background:linear-gradient(155deg,rgba(49,28,26,.68),rgba(24,17,16,.72))}.danger-action+.danger-action{margin-top:9px}.danger-action.safe-action{border-color:#3e5e45;background:linear-gradient(155deg,rgba(24,45,29,.55),rgba(15,25,18,.72))}.danger-action strong{display:block;font-size:11px}.danger-action p{margin:5px 0 0;color:var(--muted);font-size:9px;line-height:1.5}.danger-confirm{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px}.danger-confirm input{min-width:0;padding:10px;border:1px solid #69423e;border-radius:9px;color:var(--text);background:#140e0d;outline:0}.danger-note{margin:9px 2px 0;color:var(--muted);font-size:8px}.manager-danger-zone>.danger-action>.button{justify-self:end}
@media(max-width:760px){.archived-campaign-card{align-items:flex-start;display:grid}.archived-campaign-actions{justify-content:space-between}.danger-action{grid-template-columns:1fr}.danger-confirm{grid-template-columns:1fr}.manager-danger-zone>.danger-action>.button{justify-self:stretch;width:100%}.character-row{grid-template-columns:auto minmax(0,1fr) auto}.character-actions{align-self:start}}

/* v7.0.2 — mobile portal refinements */
@media(max-width:767px){
  .portal-center{padding:12px}
  .auth-layout{padding:12px;gap:12px}
  .auth-story{min-height:auto;padding:22px 18px;border-radius:18px}
  .auth-copy{padding:18px 0 8px}
  .auth-story h1{font-size:clamp(34px,10vw,46px);line-height:1.02}
  .auth-story > div > p,.auth-copy > p{font-size:15px;line-height:1.6}
  .auth-card{width:min(100%,460px);margin:0 auto;padding:18px;border-radius:18px}
  .portal-form .field input,.portal-form .field select,.inline-create input,.compact-field select,.field select,.member-row select,.new-invite-result input,.admin-confirm input{font-size:16px}
  .portal-submit,.button{min-height:44px}
  .portal-header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start}
  .portal-header-actions{width:100%;grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .portal-header-actions .button{width:100%}
  .portal-welcome{gap:12px;padding:24px 0 18px}
  .portal-welcome h1{font-size:clamp(30px,9vw,40px)}
  .section-heading{display:grid;gap:6px}
  .campaign-home-card{padding:16px}
  .campaign-home-card header{display:grid;gap:8px}
  .campaign-home-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .compact-field{display:grid;grid-template-columns:1fr;gap:6px}
  .campaign-home-card footer{display:grid;gap:10px}
  .campaign-home-card footer>div{display:grid;grid-template-columns:1fr;gap:8px}
  .campaign-home-card footer .button{width:100%}
  .character-panel{padding:15px}
  .character-row{grid-template-columns:auto minmax(0,1fr);align-items:start}
  .character-row .small-icon{grid-column:1/-1;width:100%}
  .inline-create{grid-template-columns:1fr}
  .portal-dialog,.wide-dialog{width:min(100vw - 10px, 1060px);max-height:calc(100dvh - 10px);border-radius:16px}
  .portal-dialog form,.manager-shell{padding:16px}
  .dialog-header{position:sticky;top:0;z-index:2;background:linear-gradient(180deg,rgba(16,23,19,.98),rgba(16,23,19,.94));padding-bottom:12px}
  .dialog-actions{display:grid;grid-template-columns:1fr;gap:8px}
  .dialog-actions .button{width:100%}
  .member-row{grid-template-columns:auto minmax(0,1fr);align-items:start}
  .member-row>div:last-child,.member-row .button,.member-row select,.member-row .small-icon{grid-column:1/-1;width:100%}
  .invite-history-row{display:grid;grid-template-columns:1fr;gap:8px}
  .new-invite-result>div{grid-template-columns:1fr}
}

/* v7.0.3 — compact phone tracker header */
@media(max-width:767px){
  .topbar{
    display:grid;
    grid-template-columns:44px 44px 44px minmax(44px,1fr);
    grid-template-rows:44px 44px;
    align-items:center;
    gap:8px;
    min-height:0;
    padding:10px 12px;
  }
  .topbar .mobile-menu{display:grid;grid-column:1;grid-row:1;width:44px;height:44px}
  .topbar .crumbs{display:none}
  .topbar .top-actions{display:contents}
  .topbar #homeButton{display:grid!important;grid-column:2;grid-row:1;width:44px;height:44px}
  .topbar #shareButton{grid-column:3;grid-row:1;width:44px;height:44px}
  .topbar .account-pill{
    grid-column:4;
    grid-row:1;
    justify-self:end;
    width:44px;
    min-width:44px;
    height:44px;
    padding:0;
    justify-content:center;
    border-radius:11px;
  }
  .topbar .account-pill span{width:32px;height:32px}
  .topbar .account-pill strong{display:none}
  .topbar .search-box{
    grid-column:1/-1;
    grid-row:2;
    width:100%;
    min-height:44px;
    margin:0;
  }
}

/* Public-beta and legal surfaces — v7.2.0 */
.public-beta-banner {
  display: flex;
  gap: .65rem;
  align-items: center;
  padding: .7rem .85rem;
  margin-bottom: 1rem;
  border: 1px solid rgba(221, 169, 78, .4);
  border-radius: 12px;
  background: rgba(117, 76, 24, .18);
  font-size: .86rem;
}
.public-beta-banner strong { color: #f2c46d; text-transform: uppercase; letter-spacing: .08em; font-size: .74rem; }
.public-beta-banner span { color: var(--muted, #a9b2ad); }
.turnstile-slot { min-height: 65px; display: flex; justify-content: center; margin: .25rem 0; }
.terms-check { display: flex; align-items: flex-start; gap: .65rem; color: var(--muted, #a9b2ad); font-size: .85rem; line-height: 1.45; }
.terms-check input { margin-top: .2rem; }
.terms-check a, .legal-links a, .legal-document a { color: #dcb263; }
.auth-tabs.single-tab { grid-template-columns: 1fr; }
.legal-links { display: flex; flex-wrap: wrap; gap: .9rem; align-items: center; font-size: .8rem; }
.legal-links a { text-decoration: none; }
.legal-links a:hover { text-decoration: underline; }
.portal-footer { display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: 1.25rem 0 2rem; border-top: 1px solid rgba(255,255,255,.08); margin-top: 2rem; }
.portal-footer > div { display: grid; gap: .5rem; }
.portal-footer small { color: var(--muted, #a9b2ad); }
.danger-text { color: #ef9a8c !important; }
.legal-page { min-height: 100vh; background: #0c100e; color: #e9eee9; }
.legal-document { width: min(780px, calc(100% - 2rem)); margin: 0 auto; padding: 3rem 0 5rem; line-height: 1.65; }
.legal-document .auth-brand { display: inline-flex; margin-bottom: 2.5rem; }
.legal-document h1 { margin: .4rem 0 1.25rem; font-size: clamp(2rem, 5vw, 3.4rem); }
.legal-document h2 { margin: 2rem 0 .55rem; font-size: 1.2rem; }
.legal-document p { color: #bdc6c0; }
.legal-document .legal-links { margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid rgba(255,255,255,.1); }
@media (max-width: 700px) {
  .portal-footer { align-items: flex-start; flex-direction: column; }
  .public-beta-banner { align-items: flex-start; flex-direction: column; }
}