:root {
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #03070b;
}

* { box-sizing: border-box; }
html, body { margin: 0; width: 100%; min-height: 100%; background: #03070b; overflow: hidden; }
button { font: inherit; }

.viewport {
  width: 100vw;
  height: 100vh;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 50% 0%, rgba(32, 47, 60, .16), transparent 40%),
    #03070b;
}

.stage {
  position: relative;
  width: min(100vw, calc(100vh * 1.5));
  aspect-ratio: 3 / 2;
  overflow: hidden;
  background: #091018;
  box-shadow: 0 0 0 1px rgba(255,255,255,.035), 0 18px 60px rgba(0,0,0,.7);
}

.dashboard-image {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: fill;
  user-select: none;
  pointer-events: none;
}

.hotspot {
  position: absolute;
  left: calc(var(--x) * 1%);
  top: calc(var(--y) * 1%);
  width: calc(var(--w) * 1%);
  height: calc(var(--h) * 1%);
  padding: 0;
  border: 0;
  border-radius: .38vw;
  appearance: none;
  background: transparent;
  cursor: pointer;
  outline: none;
}

.hotspot:hover { background: rgba(245, 174, 63, .055); }
.hotspot:active { background: rgba(245, 174, 63, .10); }
.hotspot:focus-visible { box-shadow: inset 0 0 0 2px rgba(255, 183, 66, .95), 0 0 0 2px rgba(0,0,0,.65); }

.modal-backdrop {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(2, 6, 9, .62);
  backdrop-filter: blur(3px);
  z-index: 50;
}
.modal-backdrop[hidden] { display: none; }

.modal {
  position: relative;
  width: min(430px, 72%);
  padding: 26px 28px 24px;
  border: 1px solid rgba(255, 191, 82, .34);
  border-radius: 8px;
  color: #ecf1f5;
  background: linear-gradient(180deg, rgba(17,25,32,.98), rgba(8,14,19,.99));
  box-shadow: 0 24px 80px rgba(0,0,0,.66), inset 0 1px rgba(255,255,255,.04);
}

.modal-kicker {
  margin-bottom: 6px;
  color: #f2b54d;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .16em;
}
.modal h2 { margin: 0 34px 8px 0; font-size: 24px; line-height: 1.15; }
.modal p { margin: 0 0 22px; color: #aeb9c6; font-size: 14px; line-height: 1.55; }
.modal-close {
  position: absolute;
  top: 12px;
  right: 14px;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 6px;
  color: #cbd3db;
  background: rgba(255,255,255,.055);
  cursor: pointer;
}
.modal-primary {
  min-width: 92px;
  padding: 10px 18px;
  border: 1px solid #b67b22;
  border-radius: 5px;
  color: #111;
  background: linear-gradient(#ffc765, #e8a43a);
  font-weight: 800;
  cursor: pointer;
}

@media (max-aspect-ratio: 3/2) {
  .stage { width: 100vw; height: auto; }
}
@media (min-aspect-ratio: 3/2) {
  .stage { height: 100vh; width: auto; }
}

/* Settings */
.settings-backdrop {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 4.5% 5%;
  background: rgba(2, 6, 9, .70);
  backdrop-filter: blur(4px);
  z-index: 60;
}
.settings-backdrop[hidden] { display: none; }

.settings-panel {
  width: min(920px, 80%);
  max-height: 88%;
  overflow: auto;
  border: 1px solid rgba(255, 191, 82, .30);
  border-radius: 9px;
  color: #ecf1f5;
  background: linear-gradient(180deg, rgba(17,25,32,.99), rgba(8,14,19,.995));
  box-shadow: 0 28px 90px rgba(0,0,0,.70), inset 0 1px rgba(255,255,255,.04);
}

.settings-header {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  gap: 24px;
  padding: 22px 26px 18px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: rgba(12, 19, 25, .97);
  backdrop-filter: blur(10px);
}
.settings-header h2 { margin: 0; font-size: 25px; }
.settings-header p { margin: 5px 0 0; color: #9eabb8; font-size: 13px; }
.settings-close { position: static; flex: 0 0 auto; }

.settings-section {
  padding: 22px 26px;
  border-bottom: 1px solid rgba(255,255,255,.07);
}
.settings-section h3 { margin: 0 0 4px; font-size: 15px; letter-spacing: .03em; }
.settings-help { margin: 0 0 16px; color: #91a0ae; font-size: 12px; line-height: 1.45; }
.section-title-row { display: flex; align-items: start; justify-content: space-between; gap: 18px; }
.field-label, .webhook-grid label { display: grid; gap: 7px; color: #ccd5dd; font-size: 12px; font-weight: 700; }

.secret-row { display: grid; grid-template-columns: 1fr auto; gap: 9px; }
.text-input {
  width: 100%;
  min-width: 0;
  height: 39px;
  padding: 0 12px;
  border: 1px solid rgba(178, 194, 207, .20);
  border-radius: 5px;
  outline: none;
  color: #edf3f7;
  background: rgba(2, 8, 13, .72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02);
}
.text-input::placeholder { color: #64717d; }
.text-input:focus { border-color: rgba(244, 177, 68, .72); box-shadow: 0 0 0 2px rgba(244, 177, 68, .10); }

.webhook-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
}

.small-button, .secondary-button {
  border: 1px solid rgba(188, 202, 213, .18);
  border-radius: 5px;
  color: #cbd4dc;
  background: rgba(255,255,255,.055);
  cursor: pointer;
}
.small-button { min-width: 70px; height: 39px; padding: 0 12px; font-size: 12px; font-weight: 700; }
.secondary-button { min-width: 92px; padding: 10px 18px; font-weight: 700; }
.small-button:hover, .secondary-button:hover { background: rgba(255,255,255,.09); }

.settings-notice {
  margin: 18px 26px 0;
  padding: 12px 14px;
  border: 1px solid rgba(243, 181, 77, .19);
  border-radius: 6px;
  color: #b9c4cd;
  background: rgba(243, 181, 77, .055);
  font-size: 12px;
  line-height: 1.48;
}
.settings-notice strong { color: #efb651; }

.settings-status {
  min-height: 20px;
  padding: 11px 26px 0;
  font-size: 12px;
  font-weight: 700;
}
.settings-status[data-state="success"] { color: #65d98a; }
.settings-status[data-state="error"] { color: #ff7f72; }

.settings-actions {
  position: sticky;
  bottom: 0;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 17px 26px 21px;
  border-top: 1px solid rgba(255,255,255,.07);
  background: rgba(10, 16, 21, .97);
  backdrop-filter: blur(10px);
}

@media (max-width: 850px) {
  .settings-panel { width: 92%; }
  .webhook-grid { grid-template-columns: 1fr; }
}

.message-input {
  height: auto;
  min-height: 118px;
  padding: 11px 12px;
  resize: vertical;
  line-height: 1.45;
  font-family: inherit;
}
.message-actions {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  margin-top: 10px;
}
.modal-primary:disabled { opacity: .62; cursor: wait; }

/* City Cap image composer */
.modal:has(.city-cap-composer:not([hidden])) {
  width: min(620px, 82%);
}
.city-cap-composer[hidden] { display: none; }
.city-cap-composer { margin: 8px 0 18px; }
.composer-grid {
  display: grid;
  grid-template-columns: 1.4fr .7fr 1fr;
  gap: 12px;
}
.composer-grid label {
  display: grid;
  gap: 6px;
  color: #cbd4dc;
  font-size: 12px;
  font-weight: 800;
}
.composer-note { grid-column: 1 / -1; }
.composer-help {
  margin: 11px 0 0 !important;
  color: #7f8e9a !important;
  font-size: 11px !important;
}
.city-cap-status {
  min-height: 18px;
  margin-top: 8px;
  color: #aeb9c6;
  font-size: 12px;
  font-weight: 700;
}
.city-cap-status[data-state="error"] { color: #ff7f72; }
@media (max-width: 700px) {
  .composer-grid { grid-template-columns: 1fr; }
  .composer-note { grid-column: auto; }
}

/* Supabase City Cap scheduling */
.city-cap-live {
  position: absolute;
  left: 17.35%;
  top: 43.05%;
  width: 15.8%;
  min-height: 3.15%;
  z-index: 8;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: .45vw;
  padding: .28vw .52vw;
  border: 1px solid rgba(101, 194, 255, .52);
  border-radius: .34vw;
  background: linear-gradient(90deg, rgba(4, 16, 27, .95), rgba(4, 34, 54, .9));
  box-shadow: 0 .22vw .65vw rgba(0,0,0,.48), inset 0 1px rgba(255,255,255,.05);
  pointer-events: none;
  color: #dff4ff;
}
.city-cap-live[hidden] { display: none; }
.city-cap-live-label { font-size: .54vw; font-weight: 900; letter-spacing: .10em; color: #76cfff; }
.city-cap-live strong { font-size: .84vw; letter-spacing: .03em; color: #fff; text-align: center; }
.city-cap-live span:last-child { font-size: .52vw; color: #a9c6d8; white-space: nowrap; }
.city-cap-live[data-urgent="true"] {
  border-color: rgba(255, 183, 66, .78);
  background: linear-gradient(90deg, rgba(37, 21, 3, .96), rgba(76, 42, 5, .9));
}
.city-cap-live[data-urgent="true"] .city-cap-live-label { color: #ffc15a; }

.modal:has(.city-cap-composer:not([hidden])) { width: min(760px, 88%); max-height: 90%; overflow: auto; }
.composer-grid-schedule { grid-template-columns: 1.35fr .55fr .9fr .75fr; }
.composer-grid-schedule .composer-note { grid-column: 1 / -1; }
.reminder-box {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 14px;
  padding: 12px 13px;
  border: 1px solid rgba(175, 192, 207, .14);
  border-radius: 6px;
  background: rgba(4, 10, 15, .58);
}
.reminder-box > div { margin-right: auto; min-width: 170px; }
.reminder-box strong { display:block; font-size:12px; color:#e6edf2; }
.reminder-box small { display:block; margin-top:2px; color:#72828f; font-size:10px; }
.reminder-box label, .send-now-row { color:#c5d0d8; font-size:11px; font-weight:700; }
.reminder-box input, .send-now-row input { accent-color:#e5a63a; }
.send-now-row { display:flex; align-items:center; gap:8px; margin-top:12px; }
.planned-caps {
  margin-top: 14px;
  border-top: 1px solid rgba(255,255,255,.07);
  padding-top: 13px;
}
.planned-title { display:flex; justify-content:space-between; gap:12px; align-items:end; margin-bottom:8px; }
.planned-title strong { font-size:12px; color:#e7edf2; }
.planned-title span { font-size:10px; color:#71818d; }
.planned-cap {
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:center;
  padding:9px 11px;
  margin-top:6px;
  border:1px solid rgba(170,188,202,.12);
  border-radius:6px;
  background:rgba(255,255,255,.025);
}
.planned-cap.is-next { border-color:rgba(244,181,71,.35); background:rgba(244,181,71,.055); }
.planned-cap strong { color:#f0f4f7; font-size:12px; }
.planned-cap span { color:#f4b547; font-size:11px; margin-left:5px; }
.planned-cap small { display:block; color:#7e8d99; font-size:10px; margin-top:2px; }
.planned-cap-info { min-width:0; }
.planned-cap-right { display:flex; align-items:center; gap:10px; }
.planned-countdown { min-width:72px; text-align:right; color:#78cff9; font-size:12px; font-weight:900; }
.planned-cap-actions { display:flex; gap:5px; }
.planned-action { border:1px solid rgba(171,190,204,.2); background:rgba(255,255,255,.035); color:#b9c7d1; border-radius:4px; padding:5px 7px; font:700 9px/1 inherit; cursor:pointer; }
.planned-action:hover { border-color:rgba(244,181,71,.55); color:#f4b547; background:rgba(244,181,71,.08); }
.planned-action.delete-cap:hover { border-color:rgba(255,101,91,.55); color:#ff756b; background:rgba(255,101,91,.08); }
.planned-action:disabled { opacity:.45; cursor:wait; }
.planned-cap.is-next .planned-countdown { color:#ffc158; }
.planned-empty { padding:10px 0 2px; color:#72818d; font-size:11px; }
.city-cap-status[data-state="success"] { color:#65d98a; }

@media (max-width: 700px) {
  .composer-grid-schedule { grid-template-columns: 1fr 1fr; }
  .composer-grid-schedule .composer-note { grid-column: 1 / -1; }
  .reminder-box { align-items:flex-start; }
  .planned-title { align-items:start; flex-direction:column; gap:3px; }
  .planned-cap { align-items:flex-start; }
  .planned-cap-right { flex-direction:column; align-items:flex-end; gap:6px; }
}


/* Supabase Announcements */
.announcement-live-badge{position:absolute;left:12.7%;top:16.25%;z-index:9;min-width:1.35%;height:2.15%;padding:0 .24vw;display:grid;place-items:center;border-radius:999px;border:1px solid rgba(255,190,70,.8);background:rgba(204,119,18,.96);box-shadow:0 .12vw .38vw rgba(0,0,0,.55);color:#fff;font-size:.58vw;font-weight:900;pointer-events:none}
.announcement-live-badge[hidden]{display:none}
.modal:has(.announcement-composer:not([hidden])){width:min(760px,88%);max-height:90%;overflow:auto}
.announcement-grid{grid-template-columns:1fr 180px}
.announcement-message-field{grid-column:1/-1}
.announcement-textarea{min-height:112px;resize:vertical;font-family:inherit;line-height:1.45;padding-top:10px}
.announcement-list-section{margin-top:15px}
.announcement-item{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-top:7px;padding:11px 12px;border:1px solid rgba(170,188,202,.12);border-radius:6px;background:rgba(255,255,255,.025)}
.announcement-item[data-priority="important"]{border-color:rgba(244,181,71,.34);background:rgba(244,181,71,.045)}
.announcement-item[data-priority="urgent"]{border-color:rgba(255,101,91,.38);background:rgba(255,101,91,.05)}
.announcement-copy{min-width:0;flex:1}.announcement-head{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.announcement-head strong{color:#eef3f6;font-size:12px}
.announcement-priority{padding:2px 6px;border-radius:999px;border:1px solid rgba(145,166,181,.18);color:#91a3b0;font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
.announcement-item[data-priority="important"] .announcement-priority{color:#f5bd56;border-color:rgba(245,189,86,.3)}.announcement-item[data-priority="urgent"] .announcement-priority{color:#ff837a;border-color:rgba(255,131,122,.32)}
.announcement-copy p{margin:5px 0 0!important;color:#aab7c1!important;font-size:11px!important;line-height:1.4;white-space:pre-wrap}.announcement-copy small{display:block;margin-top:6px;color:#6f808d;font-size:9px}
.announcement-actions{display:flex;gap:5px;flex:0 0 auto}.announcement-actions .delete-announcement:hover{border-color:rgba(255,101,91,.55);color:#ff756b;background:rgba(255,101,91,.08)}
@media(max-width:700px){.announcement-grid{grid-template-columns:1fr}.announcement-message-field{grid-column:auto}.announcement-item{flex-direction:column}.announcement-actions{align-self:flex-end}}

/* Live dashboard regions: Upcoming Events, Recent Activity, Alliance Time */
.live-panel,
.live-clock-panel {
  position: absolute;
  z-index: 6;
  color: #e8edf2;
  border: 1px solid rgba(111, 132, 148, .18);
  border-radius: .46vw;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025), 0 .35vw 1vw rgba(0,0,0,.24);
  overflow: hidden;
  pointer-events: none;
}

.live-activity-panel {
  left: 16.35%;
  top: 75.75%;
  width: 56.55%;
  height: 22.1%;
  padding: 1.0% 1.25% .8%;
  background: linear-gradient(180deg, rgba(10,19,27,.985), rgba(8,16,23,.99));
}

.live-events-panel {
  left: 74.05%;
  top: 44.2%;
  width: 24.7%;
  height: 32.6%;
  padding: 1.0% 1.15% .7%;
  background: linear-gradient(180deg, rgba(10,18,25,.985), rgba(7,15,21,.99));
}

.live-clock-panel {
  left: 74.05%;
  top: 78.05%;
  width: 24.7%;
  height: 19.25%;
  padding: 1.05% 1.2%;
  background: linear-gradient(90deg, rgba(11,17,23,.985) 0%, rgba(11,17,23,.93) 54%, rgba(11,17,23,.48) 72%, rgba(11,17,23,.17) 100%);
}

.live-panel-header,
.live-clock-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8vw;
  padding-bottom: .62vw;
  border-bottom: 1px solid rgba(150,170,185,.12);
}
.live-panel-header strong,
.live-clock-head strong {
  font-size: clamp(9px, 1.03vw, 17px);
  line-height: 1;
  letter-spacing: .025em;
}
.live-panel-header span,
.live-clock-head span {
  font-size: clamp(7px, .69vw, 11px);
  color: #6daec7;
}
.live-clock-head span {
  padding: .22vw .52vw;
  border-radius: .35vw;
  color: #d8dee4;
  background: rgba(255,255,255,.08);
}

.activity-table-head,
.live-activity-row {
  display: grid;
  grid-template-columns: 11% 22% 28% 39%;
  align-items: center;
  gap: 0;
}
.activity-table-head {
  padding: .58vw .75vw .38vw;
  color: #8292a0;
  font-size: clamp(6px, .57vw, 9.5px);
  letter-spacing: .035em;
}
.live-activity-row {
  min-height: 2.32vw;
  padding: .16vw .75vw;
  border-top: 1px solid rgba(133,153,168,.105);
  font-size: clamp(7px, .69vw, 11.5px);
}
.live-activity-row:first-child { border-top-color: rgba(133,153,168,.16); }
.live-activity-row > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-activity-row .activity-time { color: #aab6c0; }
.live-activity-row .activity-user { color: #70b9ff; font-weight: 650; }
.live-activity-row[data-kind="announcement"] .activity-user { color: #b99cff; }
.live-activity-row[data-kind="city_cap"] .activity-user { color: #65c7ee; }
.live-activity-row .activity-action { color: #e3e9ee; }
.live-activity-row .activity-details { color: #c4ced6; }

.live-events-list { padding-top: .28vw; }
.live-event-row {
  display: grid;
  grid-template-columns: 3.25vw 1fr auto;
  align-items: center;
  gap: .68vw;
  min-height: 5.55vw;
  border-bottom: 1px solid rgba(133,153,168,.115);
}
.live-event-row:last-child { border-bottom: 0; }
.live-event-date {
  display: grid;
  place-items: center;
  align-content: center;
  width: 3.15vw;
  height: 3.5vw;
  border-radius: .35vw;
  color: #eef2f5;
  background: linear-gradient(180deg, rgba(51,62,74,.62), rgba(28,37,47,.72));
  line-height: 1;
}
.live-event-date small { margin-bottom: .22vw; color: #c6d0d8; font-size: clamp(6px,.6vw,10px); font-weight: 800; }
.live-event-date strong { font-size: clamp(11px,1.38vw,22px); }
.live-event-copy { min-width: 0; }
.live-event-copy strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: clamp(8px,.78vw,13px); }
.live-event-copy span { display: block; margin-top: .28vw; color: #aab6c0; font-size: clamp(7px,.67vw,11px); white-space: nowrap; }
.live-event-badge {
  min-width: 2.8vw;
  padding: .34vw .5vw;
  border: 1px solid rgba(85,140,185,.35);
  border-radius: .35vw;
  color: #87bdec;
  background: rgba(25,75,118,.28);
  text-align: center;
  font-size: clamp(6px,.62vw,10px);
  font-weight: 750;
}
.live-event-badge[data-type="city_cap"] { color:#ffb07b; border-color:rgba(222,104,50,.55); background:rgba(129,54,25,.34); }
.live-event-badge[data-type="tm_start"] { color:#bab4ff; border-color:rgba(111,98,204,.4); background:rgba(56,49,107,.28); }
.live-event-badge[data-type="alliance_duel"] { color:#ffc15a; border-color:rgba(203,134,33,.48); background:rgba(110,70,16,.30); }
.live-event-badge[data-type="war_alert"] { color:#7ee5a0; border-color:rgba(52,173,91,.46); background:rgba(24,94,49,.28); }

.live-clock-time {
  margin-top: .62vw;
  font-size: clamp(22px, 2.7vw, 44px);
  line-height: .98;
  font-weight: 800;
  letter-spacing: -.035em;
  text-shadow: 0 .08vw .35vw rgba(0,0,0,.6);
}
.live-clock-date {
  margin-top: .46vw;
  font-size: clamp(8px,.82vw,13px);
  color: #d4dbe1;
}
.live-clock-quote {
  position: absolute;
  left: 1.2vw;
  bottom: 1.05vw;
  max-width: 70%;
  color: #e8ad45;
  font-size: clamp(7px,.67vw,11px);
  font-style: italic;
}
.live-empty {
  padding: 1vw .2vw;
  color: #738491;
  font-size: clamp(7px,.68vw,11px);
}

@media (max-width: 900px) {
  .live-activity-row { min-height: 2.45vw; }
  .live-event-row { min-height: 5.65vw; }
}

/* Notifications */
.notification-bell {
  position: absolute;
  z-index: 18;
  top: 1.42%;
  right: 25.9%;
  width: 3.1%;
  aspect-ratio: 1;
  border: 1px solid rgba(118,138,154,.35);
  border-radius: 50%;
  color: #f5f7fa;
  background: rgba(9,15,22,.88);
  box-shadow: 0 .18vw .55vw rgba(0,0,0,.35);
  display: grid;
  place-items: center;
  cursor: pointer;
}
.notification-bell:hover { border-color: rgba(242,174,62,.75); background: rgba(20,27,34,.95); }
.notification-bell-icon { font-size: clamp(11px,1.15vw,19px); line-height: 1; transform: translateY(-1px); }
.notification-badge {
  position: absolute;
  top: -.26vw;
  right: -.36vw;
  min-width: 1.28vw;
  height: 1.28vw;
  padding: 0 .25vw;
  border: 2px solid #0b1117;
  border-radius: 999px;
  color: #fff;
  background: #ef4e43;
  font-size: clamp(7px,.58vw,10px);
  font-weight: 850;
  line-height: calc(1.28vw - 4px);
  text-align: center;
}
.notification-panel {
  position: absolute;
  z-index: 40;
  top: 6.5%;
  right: 2.25%;
  width: min(31vw, 470px);
  max-height: 62%;
  overflow: hidden;
  border: 1px solid rgba(224,164,60,.45);
  border-radius: .7vw;
  color: #edf2f6;
  background: linear-gradient(180deg, rgba(16,24,32,.985), rgba(7,13,19,.985));
  box-shadow: 0 1vw 3vw rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.035);
}
.notification-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1vw 1.1vw .8vw;
  border-bottom: 1px solid rgba(132,151,166,.16);
}
.notification-panel-header strong { display:block; margin-top:.16vw; font-size: clamp(14px,1.18vw,20px); }
.notification-kicker { color:#e7ab43; font-size: clamp(7px,.58vw,10px); font-weight:800; letter-spacing:.13em; }
.notification-close { border:0; color:#aeb9c2; background:transparent; font-size: clamp(18px,1.45vw,24px); cursor:pointer; }
.notification-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1vw;
  padding:.65vw 1.1vw;
  border-bottom:1px solid rgba(132,151,166,.11);
  color:#8fa0ad;
  font-size: clamp(8px,.65vw,11px);
}
.notification-toolbar button {
  border:0;
  color:#eab04a;
  background:transparent;
  font:inherit;
  font-weight:750;
  cursor:pointer;
}
.notification-list { max-height: 29vw; overflow:auto; padding:.25vw .55vw .65vw; }
.notification-item {
  position:relative;
  display:grid;
  grid-template-columns: 2.4vw 1fr auto;
  gap:.7vw;
  align-items:start;
  padding:.82vw .65vw;
  border-bottom:1px solid rgba(132,151,166,.1);
  border-radius:.45vw;
  cursor:pointer;
}
.notification-item:hover { background:rgba(255,255,255,.025); }
.notification-item.unread { background:rgba(226,165,63,.055); }
.notification-item.unread::before {
  content:"";
  position:absolute;
  left:.08vw;
  top:1.05vw;
  width:.33vw;
  height:.33vw;
  min-width:4px;
  min-height:4px;
  border-radius:50%;
  background:#f0aa37;
  box-shadow:0 0 .45vw rgba(240,170,55,.55);
}
.notification-icon {
  width:2.1vw;
  height:2.1vw;
  border-radius:.45vw;
  display:grid;
  place-items:center;
  background:rgba(47,95,131,.25);
  border:1px solid rgba(82,139,181,.25);
  font-size: clamp(11px,1.03vw,17px);
}
.notification-item[data-type="announcement"] .notification-icon { background:rgba(93,62,150,.25); border-color:rgba(138,95,211,.3); }
.notification-item[data-type="city_cap"] .notification-icon { background:rgba(34,100,144,.25); border-color:rgba(63,145,203,.3); }
.notification-item[data-type="reminder"] .notification-icon { background:rgba(135,82,22,.25); border-color:rgba(212,143,52,.35); }
.notification-copy { min-width:0; }
.notification-copy strong { display:block; color:#f2f5f7; font-size: clamp(9px,.76vw,13px); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.notification-copy p { margin:.25vw 0 0; color:#aebac3; font-size: clamp(8px,.65vw,11px); line-height:1.35; }
.notification-time { color:#7f909d; font-size: clamp(7px,.57vw,10px); white-space:nowrap; }
.notification-empty { padding:1.35vw 1vw; color:#7f909d; text-align:center; font-size: clamp(8px,.67vw,11px); }
.notification-error { min-height:0; padding:0 1.1vw .85vw; color:#ff766d; font-size: clamp(7px,.61vw,10px); line-height:1.35; }

@media (max-width: 900px) {
  .notification-panel { width: 39vw; }
  .notification-list { max-height: 34vw; }
}

/* Generic Event planner / Calendar */
.modal:has(.event-composer:not([hidden])) { width: min(780px, 90%); max-height: 90%; overflow: auto; }
.event-composer[hidden] { display: none; }
.event-composer { margin: 8px 0 18px; }
.event-grid { grid-template-columns: 1.1fr 1.5fr .9fr .8fr; }
.event-grid label { display:grid; gap:6px; color:#cbd4dc; font-size:12px; font-weight:800; }
.event-note-field { grid-column: 1 / -1; }
.event-list-section { margin-top: 16px; }
.event-planner-row { display:grid; grid-template-columns: 88px 1fr auto; gap:12px; align-items:center; padding:10px 11px; margin-top:7px; border:1px solid rgba(170,188,202,.13); border-radius:6px; background:rgba(4,10,15,.48); }
.event-planner-row.is-next { border-color:rgba(243,181,77,.38); background:rgba(74,49,14,.16); }
.event-planner-when { text-align:center; }
.event-planner-when strong { display:block; color:#f3bd5c; font-size:14px; }
.event-planner-when small { display:block; color:#80909d; font-size:10px; margin-top:2px; }
.event-planner-copy strong { display:block; color:#e8eef3; font-size:12px; }
.event-planner-copy span { display:block; color:#81919e; font-size:10px; margin-top:3px; }
.event-planner-actions { display:flex; gap:6px; }
@media (max-width: 760px) { .event-grid { grid-template-columns:1fr 1fr; } .event-note-field { grid-column:1/-1; } .event-planner-row { grid-template-columns:72px 1fr; } .event-planner-actions { grid-column:1/-1; justify-content:flex-end; } }


/* Settings v16 structure */
.settings-tabs {
  position: sticky;
  top: 84px;
  z-index: 2;
  display: flex;
  gap: 7px;
  padding: 12px 20px;
  overflow-x: auto;
  border-bottom: 1px solid rgba(255,255,255,.07);
  background: rgba(10,16,21,.97);
}
.settings-tab {
  flex: 0 0 auto;
  padding: 9px 13px;
  border: 1px solid rgba(176,190,201,.14);
  border-radius: 5px;
  color: #95a4b2;
  background: rgba(255,255,255,.03);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}
.settings-tab:hover { color: #d7e0e7; background: rgba(255,255,255,.06); }
.settings-tab.is-active {
  color: #f3c269;
  border-color: rgba(243,181,77,.34);
  background: rgba(243,181,77,.08);
}
.settings-page[hidden] { display: none !important; }
.settings-page.is-active { display: block; }
.settings-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 14px 16px;
}
.owner-setting { position: relative; }
.owner-badge {
  display: inline-flex;
  margin: 0 0 10px;
  padding: 4px 7px;
  border: 1px solid rgba(243,181,77,.25);
  border-radius: 4px;
  color: #e9bb68;
  background: rgba(243,181,77,.06);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .12em;
}
.system-status-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
  margin-top: 16px;
}
.system-stat {
  display: grid;
  gap: 4px;
  padding: 14px;
  border: 1px solid rgba(181,195,207,.12);
  border-radius: 6px;
  background: rgba(255,255,255,.025);
}
.system-stat span { color: #8392a0; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.system-stat strong { color: #e7edf2; font-size: 14px; }
.system-stat small { color: #778693; font-size: 11px; }
@media (max-width: 760px) {
  .settings-grid, .system-status-grid, .webhook-grid { grid-template-columns: 1fr; }
  .settings-tabs { top: 78px; }
}

/* Calendar v17 */
.google-sync-check{margin-left:auto;white-space:nowrap}
.calendar-shell{margin-top:16px;border:1px solid rgba(175,193,208,.16);border-radius:8px;background:rgba(3,9,14,.52);overflow:hidden}
.calendar-toolbar{display:grid;grid-template-columns:auto auto 1fr minmax(140px,190px);gap:10px;align-items:center;padding:10px 11px;border-bottom:1px solid rgba(255,255,255,.07);background:rgba(17,25,32,.78)}
.calendar-view-switch{display:flex;gap:4px}.calendar-view-btn,.calendar-nav-btn,.calendar-today-btn{height:31px;border:1px solid rgba(183,199,211,.17);border-radius:5px;color:#b9c5cf;background:rgba(255,255,255,.045);cursor:pointer;font-weight:800;font-size:11px}.calendar-view-btn{padding:0 11px}.calendar-view-btn.is-active{color:#14100a;border-color:#b97d23;background:linear-gradient(#ffc765,#e8a43a)}
.calendar-nav{display:flex;gap:4px}.calendar-nav-btn{width:32px;font-size:19px}.calendar-today-btn{padding:0 10px}.calendar-period{min-width:0;color:#e9eef2;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.calendar-filter{height:32px;padding:0 9px;border:1px solid rgba(183,199,211,.17);border-radius:5px;color:#dce4ea;background:#081018;font-size:11px;font-weight:700}
.calendar-grid{min-height:280px;padding:8px}.calendar-weekdays,.calendar-month-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}.calendar-weekdays div{padding:5px 6px;color:#70808d;font-size:9px;font-weight:900;letter-spacing:.08em;text-align:center}.calendar-day{position:relative;min-height:82px;padding:5px;border:1px solid rgba(255,255,255,.055);background:rgba(5,11,16,.42);overflow:hidden}.calendar-day.is-outside{opacity:.4}.calendar-day.is-today{box-shadow:inset 0 0 0 1px rgba(243,181,77,.55)}.calendar-day-number{display:block;margin-bottom:4px;color:#96a4af;font-size:10px;font-weight:900}.calendar-day.is-today .calendar-day-number{color:#f3bd5c}.calendar-chip{display:block;width:100%;margin:2px 0;padding:3px 5px;border:1px solid rgba(110,173,213,.22);border-radius:4px;color:#dcecf7;background:rgba(24,65,91,.34);font-size:8px;line-height:1.25;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}.calendar-chip.is-past{opacity:.52}.calendar-chip[data-type="city_cap"]{border-color:rgba(222,104,50,.5);background:rgba(129,54,25,.28)}.calendar-chip[data-type="alliance_duel"]{border-color:rgba(203,134,33,.48);background:rgba(110,70,16,.28)}.calendar-chip[data-type="war_alert"]{border-color:rgba(52,173,91,.46);background:rgba(24,94,49,.24)}
.calendar-week-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}.calendar-week-column{min-height:238px;padding:6px;border:1px solid rgba(255,255,255,.065);border-radius:6px;background:rgba(5,11,16,.42)}.calendar-week-column.is-today{border-color:rgba(243,181,77,.44)}.calendar-week-head{margin-bottom:7px;text-align:center}.calendar-week-head strong{display:block;color:#dce4ea;font-size:11px}.calendar-week-head span{color:#71808b;font-size:9px}.calendar-list-view{display:grid;gap:6px}.calendar-list-item{display:grid;grid-template-columns:88px 1fr auto;gap:10px;align-items:center;padding:9px 10px;border:1px solid rgba(255,255,255,.065);border-radius:6px;background:rgba(5,11,16,.42);cursor:pointer}.calendar-list-item.is-past{opacity:.55}.calendar-list-item time{color:#f0b958;font-size:10px;font-weight:900}.calendar-list-copy strong{display:block;color:#e8eef3;font-size:11px}.calendar-list-copy span{display:block;margin-top:2px;color:#7f8f9b;font-size:9px}.calendar-status-badge{padding:4px 6px;border-radius:999px;border:1px solid rgba(99,194,128,.25);color:#73d999;background:rgba(36,108,62,.19);font-size:8px;font-weight:900;text-transform:uppercase}.calendar-status-badge.is-past{border-color:rgba(152,164,174,.2);color:#8998a4;background:rgba(89,98,106,.13)}
.event-detail{position:relative;margin-top:12px;padding:14px 15px;border:1px solid rgba(243,181,77,.25);border-radius:7px;background:linear-gradient(180deg,rgba(27,22,14,.55),rgba(6,12,17,.72))}.event-detail[hidden]{display:none}.event-detail-close{position:absolute;right:9px;top:8px;width:28px;height:28px;border:0;border-radius:5px;color:#cbd5dc;background:rgba(255,255,255,.055);cursor:pointer}.event-detail-kicker{color:#f0b958;font-size:9px;font-weight:900;letter-spacing:.14em}.event-detail h3{margin:4px 34px 5px 0;font-size:16px}.event-detail-meta{color:#94a3ae;font-size:10px}.event-detail p{margin:10px 0;color:#c7d0d7;font-size:11px}.event-detail-reminders{display:flex;gap:6px;flex-wrap:wrap}.event-detail-reminders span{padding:4px 6px;border:1px solid rgba(126,164,191,.18);border-radius:999px;color:#9bb2c3;background:rgba(52,83,104,.15);font-size:8px;font-weight:800}.event-detail-actions{display:flex;justify-content:flex-end;gap:6px;margin-top:10px}
@media(max-width:760px){.calendar-toolbar{grid-template-columns:1fr 1fr}.calendar-period{order:3}.calendar-filter{order:4}.calendar-day{min-height:68px}.calendar-list-item{grid-template-columns:70px 1fr}.calendar-status-badge{grid-column:2;justify-self:start}}


/* Activity Log v18 */
.modal:has(.activity-log-view:not([hidden])){width:min(820px,92%);max-height:88%;overflow:auto}
.activity-log-view[hidden]{display:none}
.activity-log-view{margin:8px 0 18px}
.activity-log-header{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 12px;border:1px solid rgba(180,197,209,.14);border-radius:7px 7px 0 0;background:rgba(13,21,28,.72)}
.activity-log-header strong{display:block;color:#e7edf2;font-size:13px}.activity-log-header span{display:block;margin-top:2px;color:#82919d;font-size:10px}
.activity-log-live{padding:4px 7px!important;margin:0!important;border:1px solid rgba(86,164,214,.25);border-radius:999px;color:#89c6ea!important;background:rgba(32,89,126,.2);font-size:8px!important;font-weight:900;letter-spacing:.09em}
.activity-log-columns{display:grid;grid-template-columns:128px 1fr 150px;gap:12px;padding:7px 11px;border-left:1px solid rgba(180,197,209,.14);border-right:1px solid rgba(180,197,209,.14);color:#687985;font-size:8px;font-weight:900;letter-spacing:.09em}
.activity-log-list{max-height:430px;overflow:auto;border:1px solid rgba(180,197,209,.14);border-radius:0 0 7px 7px;background:rgba(3,8,12,.5)}
.activity-log-row{display:grid;grid-template-columns:128px 1fr 150px;gap:12px;align-items:center;padding:10px 11px;border-bottom:1px solid rgba(255,255,255,.055)}
.activity-log-row:last-child{border-bottom:0}.activity-log-row time strong{display:block;color:#a7b4bd;font-size:10px}.activity-log-row time span{display:block;margin-top:2px;color:#6f808c;font-size:9px}
.activity-log-main strong{display:block;color:#e5ebef;font-size:11px}.activity-log-main span{display:block;margin-top:3px;color:#81919d;font-size:9px;line-height:1.35}.activity-log-actor{color:#d3b36d;font-size:10px;font-weight:800;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.activity-log-empty{padding:22px;color:#73838f;text-align:center;font-size:11px}
@media(max-width:700px){.activity-log-columns{display:none}.activity-log-row{grid-template-columns:82px 1fr}.activity-log-actor{grid-column:2;text-align:left}.activity-log-list{max-height:52vh}}

/* Home v19: announcement highlight + richer upcoming events */
.home-announcement {
  position:absolute; left:17.55%; top:22.25%; width:53.15%; height:4.15%; z-index:7;
  display:grid; grid-template-columns:auto minmax(0,1fr) auto; grid-template-rows:auto auto; align-items:center; column-gap:.72vw;
  padding:.38vw .72vw; border:1px solid rgba(241,178,72,.3); border-radius:.36vw;
  color:#eaf0f4; background:linear-gradient(90deg,rgba(7,14,20,.92),rgba(13,24,33,.88));
  box-shadow:0 .25vw .9vw rgba(0,0,0,.35),inset 0 1px rgba(255,255,255,.035); cursor:pointer; text-align:left;
}
.home-announcement[hidden]{display:none}.home-announcement:hover{border-color:rgba(241,178,72,.58);background:linear-gradient(90deg,rgba(9,18,25,.96),rgba(20,31,40,.93))}
.home-announcement-priority{grid-row:1/3;align-self:center;padding:.25vw .42vw;border-radius:.27vw;border:1px solid rgba(112,173,218,.25);color:#8bc8f3;background:rgba(37,91,132,.18);font-size:clamp(6px,.55vw,9px);font-weight:900;letter-spacing:.08em}
.home-announcement strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(8px,.76vw,13px)}
.home-announcement-message{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#aab7c1;font-size:clamp(6px,.61vw,10px)}
.home-announcement-meta{grid-row:1/3;grid-column:3;align-self:center;color:#788997;font-size:clamp(6px,.54vw,9px);white-space:nowrap}
.home-announcement[data-priority="important"]{border-color:rgba(244,181,71,.5);background:linear-gradient(90deg,rgba(30,21,8,.93),rgba(28,24,15,.88))}.home-announcement[data-priority="important"] .home-announcement-priority{color:#ffc65d;border-color:rgba(244,181,71,.38);background:rgba(173,103,17,.18)}
.home-announcement[data-priority="urgent"]{border-color:rgba(255,99,87,.58);background:linear-gradient(90deg,rgba(38,12,12,.94),rgba(31,16,16,.9))}.home-announcement[data-priority="urgent"] .home-announcement-priority{color:#ff8b82;border-color:rgba(255,99,87,.4);background:rgba(154,40,32,.2)}
.live-events-panel{pointer-events:auto}.live-event-row{width:100%;padding:0;border-top:0;border-left:0;border-right:0;color:inherit;background:transparent;text-align:left;cursor:pointer;font:inherit}.live-event-row:hover{background:rgba(255,255,255,.025)}
.live-event-row.is-next{background:linear-gradient(90deg,rgba(39,103,145,.08),transparent)}.live-event-row[data-urgent="true"]{background:linear-gradient(90deg,rgba(173,74,36,.12),transparent)}
.live-event-copy span{display:flex;align-items:center;gap:.44vw}.live-event-copy em{color:#e9b04e;font-size:clamp(6px,.59vw,9.5px);font-style:normal;font-weight:800}

/* v20 — dynamic Dimension / Daily Focus quick cards */
.quick-dynamic-overlay{position:absolute;z-index:9;pointer-events:none;display:flex;flex-direction:column;justify-content:flex-end;padding:0 1.25% 1.05%;box-sizing:border-box;background:linear-gradient(180deg,rgba(7,13,19,0) 0%,rgba(7,13,19,.34) 26%,rgba(7,13,19,.90) 55%,rgba(7,13,19,.96) 100%);color:#fff;text-shadow:0 1px 2px #000}
.quick-dynamic-overlay strong{font-size:clamp(11px,1.05vw,20px);line-height:1.05;letter-spacing:.02em;text-transform:uppercase}
.quick-dynamic-overlay span{margin-top:.35em;font-size:clamp(8px,.72vw,13px);color:#d5dde7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dimension-overlay{left:35.45%;top:39.9%;width:18.15%;height:7.45%}
.daily-focus-overlay{left:54.45%;top:54.65%;width:18.15%;height:7.45%}
.quick-dynamic-overlay[data-state="doomed"] strong{color:#ffd05a}
.quick-dynamic-overlay[data-state="homeworld"] strong{color:#e9eef5}
.daily-focus-overlay[data-day="enemy"] strong{color:#ff7d6b}
.dimension-config,.daily-focus-view{display:grid;gap:14px;margin-top:10px}
.dimension-config .config-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dimension-config label,.dimension-config .full{display:grid;gap:6px;font-weight:700;color:#d9e0e8}
.dimension-config .full{grid-column:1/-1}
.dimension-summary,.focus-block{border:1px solid #26323d;background:#091119;border-radius:10px;padding:14px}
.dimension-summary strong,.focus-block strong{display:block;color:#f6b841;margin-bottom:6px}
.focus-row{display:flex;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px solid #1c2933}
.focus-row:last-child{border-bottom:0}
.focus-row span:last-child{text-align:right;color:#d8e0e8}
.dimension-note{font-size:12px;color:#92a0af;line-height:1.45}
@media(max-width:760px){.dimension-config .config-grid{grid-template-columns:1fr}.dimension-config .full{grid-column:auto}}

/* v29 — minimal, recovered from v21 baseline. No Home announcement overlay. */
.home-announcement{display:none!important}

/* Keep Upcoming Events in its original right-rail slot, clearly below Alliance Roles. */
.live-events-panel{
  left:74.05%;
  top:44.85%;
  width:24.7%;
  height:31.95%;
}
.live-clock-panel{
  left:74.05%;
  top:78.05%;
  width:24.7%;
  height:19.25%;
}

/* Dynamic All Day tile artwork. */
.daily-focus-card-skin{
  position:absolute;
  left:54.45%; top:48.45%; width:18.15%; height:13.65%;
  z-index:7; pointer-events:none; overflow:hidden; border-radius:.42vw;
  background:linear-gradient(135deg,#4a2411,#9d5b27 55%,#2f160d);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05), inset 0 -3vw 4vw rgba(0,0,0,.42);
}
.daily-focus-card-skin::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,10,15,.10),rgba(4,10,15,.02) 50%,rgba(0,0,0,.20));pointer-events:none}
.daily-focus-card-icon{position:absolute;right:10%;top:18%;z-index:2;font-size:clamp(34px,4.1vw,74px);line-height:1;filter:drop-shadow(0 .28vw .36vw rgba(0,0,0,.62));opacity:.93}
.daily-focus-card-skin[data-focus="gathering"]{background:radial-gradient(circle at 72% 28%,rgba(140,232,171,.18),transparent 28%),linear-gradient(135deg,#0d3c30,#17684b 55%,#09271f)}
.daily-focus-card-skin[data-focus="building"]{background:radial-gradient(circle at 72% 28%,rgba(255,197,104,.19),transparent 28%),linear-gradient(135deg,#4b2b12,#99561f 55%,#32190c)}
.daily-focus-card-skin[data-focus="research"]{background:radial-gradient(circle at 72% 28%,rgba(153,178,255,.18),transparent 28%),linear-gradient(135deg,#17254b,#33478c 55%,#131a38)}
.daily-focus-card-skin[data-focus="recruitment"]{background:radial-gradient(circle at 72% 28%,rgba(207,167,255,.20),transparent 28%),linear-gradient(135deg,#30205a,#5b3b8e 55%,#21153e)}
.daily-focus-card-skin[data-focus="training"]{background:radial-gradient(circle at 72% 28%,rgba(255,153,126,.18),transparent 28%),linear-gradient(135deg,#4c1715,#8a3027 55%,#30100f)}
.daily-focus-card-skin[data-focus="enemy"]{background:radial-gradient(circle at 72% 28%,rgba(255,111,87,.22),transparent 28%),linear-gradient(135deg,#4c0f12,#8d1e24 55%,#29090b)}
.daily-focus-card-skin[data-focus="pregathering"]{background:radial-gradient(circle at 72% 28%,rgba(107,222,223,.18),transparent 28%),linear-gradient(135deg,#0b3940,#176b72 55%,#08262b)}

/* All Day info + tips modal. */
.focus-guide{border:1px solid #26323d;background:linear-gradient(180deg,#0b151e,#081018);border-radius:10px;padding:14px;color:#c9d3dc}
.focus-guide-head{display:flex;gap:13px;align-items:flex-start;padding-bottom:12px;border-bottom:1px solid #1d2a34}
.focus-guide-icon{display:grid;place-items:center;flex:0 0 46px;width:46px;height:46px;border-radius:10px;background:#121f2a;border:1px solid #2b3a46;font-size:25px}
.focus-guide-head strong{display:block;color:#f6b841;font-size:15px;margin:0 0 5px}
.focus-guide-head p{margin:0;color:#9eadb9;font-size:12px;line-height:1.5}
.focus-guide-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:14px;margin-top:13px}
.focus-guide-grid section{padding:12px;border:1px solid #1d2a34;border-radius:8px;background:#09121a}
.focus-guide-grid h3{margin:0 0 8px;color:#e7edf2;font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.focus-guide-grid ul{margin:0;padding-left:18px;color:#aebbc5;font-size:12px;line-height:1.55}
.focus-guide-grid li+li{margin-top:6px}
.focus-checklist{list-style:none;padding-left:0!important}
.focus-checklist li{position:relative;padding-left:20px}
.focus-checklist li::before{content:'✓';position:absolute;left:0;top:0;color:#55d58a;font-weight:900}
@media(max-width:760px){.focus-guide-grid{grid-template-columns:1fr}}


/* v30 — clean right rail: mask the old static reference cards first,
   then draw the live panels in fixed, non-overlapping positions. */
.right-live-mask{
  position:absolute;
  left:73.82%;
  top:43.55%;
  width:25.18%;
  height:54.15%;
  z-index:5;
  pointer-events:none;
  background:#081119;
  border-radius:.52vw;
}
.live-events-panel{
  left:74.05%;
  top:44.25%;
  width:24.7%;
  height:32.45%;
  background:#09131b;
  border-color:rgba(111,132,148,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 .35vw 1vw rgba(0,0,0,.28);
}
.live-clock-panel{
  left:74.05%;
  top:78.05%;
  width:24.7%;
  height:19.25%;
  background:linear-gradient(90deg,#0b1117 0%,#0b1117 54%,rgba(11,17,23,.96) 72%,rgba(11,17,23,.90) 100%);
  border-color:rgba(111,132,148,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 .35vw 1vw rgba(0,0,0,.28);
}
.live-events-list{background:transparent}


/* v32 — show device local time below the game clock without changing game-time logic. */
.live-local-time {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 8px;
  margin-top: 4px;
  color: rgba(222, 231, 240, .72);
  font-size: clamp(9px, .62vw, 12px);
  letter-spacing: .08em;
}
.live-local-time span {
  font-weight: 700;
  text-transform: uppercase;
}
.live-local-time strong {
  color: rgba(255,255,255,.92);
  font-size: clamp(11px, .78vw, 15px);
  letter-spacing: .04em;
}

/* v33 — restore the clock artwork and keep local time out of the main clock content. */
.live-clock-panel {
  background:
    linear-gradient(90deg, rgba(8,14,20,.96) 0%, rgba(8,14,20,.86) 50%, rgba(8,14,20,.40) 76%, rgba(8,14,20,.20) 100%),
    url('assets/game-clock-bg.jpg') center/cover no-repeat;
}
.live-clock-head {
  padding-right: 0;
}
.live-local-time {
  position: absolute;
  top: 2.55vw;
  right: 1.15vw;
  display: flex;
  align-items: center;
  gap: .42vw;
  margin: 0;
  padding: .22vw .48vw;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: .34vw;
  background: rgba(4,9,14,.58);
  backdrop-filter: blur(4px);
  color: rgba(208,220,230,.68);
  font-size: clamp(7px,.55vw,9px);
  line-height: 1;
  letter-spacing: .06em;
  white-space: nowrap;
}
.live-local-time span {
  font-weight: 700;
  text-transform: uppercase;
}
.live-local-time strong {
  color: rgba(255,255,255,.94);
  font-size: clamp(8px,.65vw,11px);
  letter-spacing: .02em;
}
.live-clock-quote {
  max-width: 62%;
}


/* v35 Preset Manager */
.preset-manager-launch{display:flex!important;align-items:center;gap:12px;padding-top:2px}.preset-manager-launch span{font-size:12px;color:#8f9ca9;font-weight:500}.inline-action{border:1px solid #78612a;background:linear-gradient(#3c3218,#231e11);color:#f3c966;border-radius:8px;padding:9px 14px;font-weight:800;cursor:pointer}.inline-action:hover{filter:brightness(1.12)}
.preset-manager{display:grid;gap:14px;margin-top:8px;max-height:64vh;overflow:auto;padding-right:4px}.preset-manager-toolbar{display:flex;align-items:end;justify-content:space-between;gap:14px}.preset-manager-toolbar label{display:grid;gap:6px;min-width:260px;color:#dce4ec;font-weight:800}.preset-manager-key{font-size:12px;color:#8e9baa}.preset-manager-key code,.preset-format-help code{color:#e8be59}.preset-meta-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:10px}.preset-meta-grid label,.preset-par-grid label,.preset-event-day{display:grid;gap:6px;color:#dce4ec;font-weight:700}.preset-section{border:1px solid #26323d;border-radius:10px;background:#081018;overflow:hidden}.preset-section>summary{cursor:pointer;padding:12px 14px;color:#f1c762;font-weight:900;background:#0d1720}.preset-section[open]>summary{border-bottom:1px solid #26323d}.preset-days{display:grid;grid-template-columns:1fr;gap:10px;padding:12px}.preset-day-card{border:1px solid #202b35;border-radius:9px;background:#0a121a;padding:10px}.preset-day-card header{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}.preset-day-card header strong{color:#f2c75e}.preset-day-card header span{font-size:11px;color:#8090a0;text-transform:uppercase;letter-spacing:.08em}.preset-day-grid{display:grid;grid-template-columns:90px 1fr;gap:8px}.preset-day-grid label{display:grid;gap:5px;color:#ccd5de;font-size:12px;font-weight:700}.preset-day-grid .full{grid-column:1/-1}.preset-small-textarea{min-height:58px;resize:vertical}.preset-par-grid{display:grid;grid-template-columns:1.5fr .5fr .5fr;gap:10px;padding:12px}.preset-par-list{min-height:130px;resize:vertical}.preset-format-help{padding:10px 12px 0;margin:0;color:#8d9aa7;font-size:12px;line-height:1.45}.preset-weekly-events{display:grid;grid-template-columns:1fr;gap:8px;padding:12px}.preset-event-day span{color:#f1c65f;font-size:12px}.preset-event-lines{min-height:62px;resize:vertical;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px}
@media(max-width:760px){.preset-manager-toolbar{align-items:stretch;flex-direction:column}.preset-manager-toolbar label{min-width:0}.preset-meta-grid,.preset-par-grid{grid-template-columns:1fr}.preset-day-grid{grid-template-columns:1fr}.preset-day-grid .full{grid-column:auto}}

/* v36 — fixed Alliance Roles. Member names will be assigned later. */
.modal:has(.alliance-role-grid){width:min(860px,92%);max-height:88%;overflow:auto}
.alliance-role-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:4px;text-align:left}
.alliance-role-card{border:1px solid #263743;border-radius:10px;background:linear-gradient(180deg,#0c1720,#091119);overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
.alliance-role-card[open]{border-color:#8a6830;background:linear-gradient(180deg,#101a22,#0b1218)}
.alliance-role-card summary{display:grid;grid-template-columns:36px 1fr 22px;gap:10px;align-items:center;padding:12px 13px;cursor:pointer;list-style:none;user-select:none}
.alliance-role-card summary::-webkit-details-marker{display:none}
.alliance-role-card summary:hover{background:rgba(245,174,63,.045)}
.alliance-role-number{display:grid;place-items:center;width:32px;height:32px;border:1px solid #394b58;border-radius:8px;color:#f2b84a;background:#111d26;font-size:11px;font-weight:800;letter-spacing:.05em}
.alliance-role-heading{min-width:0}
.alliance-role-heading strong{display:block;color:#edf3f7;font-size:13px;line-height:1.25}
.alliance-role-heading small{display:block;margin-top:3px;color:#7f909c;font-size:10px}
.alliance-role-chevron{color:#d7a442;font-size:16px;text-align:center;transition:transform .18s ease}
.alliance-role-card[open] .alliance-role-chevron{transform:rotate(180deg)}
.alliance-role-tasks{padding:0 14px 13px 58px;border-top:1px solid rgba(92,112,126,.16)}
.alliance-role-task-label{display:block;padding-top:10px;color:#d0a64b;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}
.alliance-role-tasks ul{margin:8px 0 0;padding-left:17px;color:#b8c5ce;font-size:11px;line-height:1.5}
.alliance-role-tasks li+li{margin-top:4px}
@media(max-width:720px){.alliance-role-grid{grid-template-columns:1fr}.alliance-role-tasks{padding-left:58px}}

/* v37 — real, clickable Alliance Roles panel. Covers the old static role list in the reference artwork. */
.alliance-roles-panel{
  position:absolute;
  left:74.05%;
  top:7.15%;
  width:24.7%;
  height:35.7%;
  z-index:10;
  overflow:hidden;
  color:#e8edf2;
  border:1px solid rgba(111,132,148,.20);
  border-radius:.46vw;
  background:linear-gradient(180deg,#0a131b 0%,#081119 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 .35vw 1vw rgba(0,0,0,.28);
}
.alliance-roles-panel-header{
  height:14.5%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.7vw;
  padding:0 5.2%;
  border-bottom:1px solid rgba(150,170,185,.12);
}
.alliance-roles-panel-header strong{
  color:#f3f6f8;
  font-size:clamp(11px,1.0vw,17px);
  line-height:1;
  letter-spacing:.02em;
}
.alliance-roles-panel-header span{
  color:#8294a3;
  font-size:clamp(7px,.58vw,10px);
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:.12vw;
}
.alliance-roles-panel-list{
  height:85.5%;
  display:grid;
  grid-template-rows:repeat(8,1fr);
}
.alliance-role-panel-row{
  width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:9% minmax(0,1fr) 24px 10px;
  align-items:center;
  gap:3%;
  padding:0 5.2%;
  border:0;
  border-bottom:1px solid rgba(150,170,185,.105);
  color:inherit;
  background:transparent;
  text-align:left;
  cursor:pointer;
}
.alliance-role-panel-row:last-child{border-bottom:0}
.alliance-role-panel-row:hover{background:rgba(245,174,63,.055)}
.alliance-role-panel-row:focus-visible{outline:1px solid rgba(255,183,66,.85);outline-offset:-1px;background:rgba(245,174,63,.065)}
.alliance-role-panel-icon{
  display:grid;
  place-items:center;
  color:#f6b742;
  font-size:clamp(11px,1.15vw,20px);
  line-height:1;
  filter:drop-shadow(0 .12vw .18vw rgba(0,0,0,.45));
}
.alliance-role-panel-name{
  overflow:hidden;
  color:#e6edf2;
  font-size:clamp(8px,.69vw,12px);
  font-weight:650;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.alliance-role-panel-assignee{
  color:#657784;
  font-size:clamp(7px,.56vw,9px);
  text-align:right;
}
.alliance-role-panel-chevron{
  color:#8797a3;
  font-size:clamp(9px,.75vw,13px);
  text-align:right;
}
.role-detail-card{margin-top:8px;border:1px solid #263743;border-radius:10px;background:linear-gradient(180deg,#0c1720,#091119);overflow:hidden;text-align:left}
.role-detail-head{display:flex;gap:12px;align-items:center;padding:14px;border-bottom:1px solid rgba(92,112,126,.18)}
.role-detail-icon{display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;border:1px solid #394b58;border-radius:9px;background:#111d26;color:#f2b84a;font-size:22px}
.role-detail-head strong{display:block;color:#edf3f7;font-size:16px}.role-detail-head small{display:block;margin-top:3px;color:#7f909c;font-size:10px}
.role-detail-body{padding:14px 16px}.role-detail-body h3{margin:0 0 9px;color:#d0a64b;font-size:10px;text-transform:uppercase;letter-spacing:.1em}.role-detail-body ul{margin:0;padding-left:19px;color:#c0ccd5;font-size:12px;line-height:1.55}.role-detail-body li+li{margin-top:6px}

/* v38 — central Alliance Role assignments */
.alliance-roles-manage-link{
  appearance:none;border:0;background:transparent;color:#94a4af;font:inherit;font-size:10px;font-weight:700;
  text-decoration:underline;text-underline-offset:2px;cursor:pointer;padding:2px 0
}
.alliance-roles-manage-link:hover{color:#f0b64a}
.alliance-role-overview-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:2px 0 12px;padding:10px 12px;border:1px solid #25333d;border-radius:10px;background:#0a131a;text-align:left}
.alliance-role-overview-head strong{display:block;color:#edf3f7;font-size:13px}
.alliance-role-overview-head small{display:block;margin-top:3px;color:#81909a;font-size:10px}
.role-manage-button{white-space:nowrap}
.role-assignment-manager{text-align:left}
.role-assignment-intro{padding:12px 14px;border:1px solid #273844;border-radius:10px;background:#0a141c;margin-bottom:12px}
.role-assignment-intro strong{display:block;color:#f0f4f7;font-size:14px}
.role-assignment-intro p{margin:5px 0 0;color:#93a2ac;font-size:11px;line-height:1.45}
.role-assignment-list{display:grid;gap:8px}
.role-assignment-row{display:grid;grid-template-columns:34px minmax(170px,1fr) minmax(180px,1.3fr);gap:10px;align-items:center;padding:9px 10px;border:1px solid #263640;border-radius:9px;background:#0a131a}
.role-assignment-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:#17232d;color:#f0b64a;font-weight:800}
.role-assignment-name{color:#dce5ea;font-size:12px;font-weight:700}
.role-assignment-row input{width:100%;box-sizing:border-box;border:1px solid #344550;border-radius:7px;background:#071016;color:#eef4f7;padding:8px 9px;font:inherit;font-size:12px;outline:none}
.role-assignment-row input:focus{border-color:#c98b2d;box-shadow:0 0 0 2px rgba(201,139,45,.12)}
.role-assignment-note{margin-top:10px;color:#74838d;font-size:10px}
.role-save-success,.role-save-error{margin:0 0 10px;padding:9px 11px;border-radius:8px;font-size:11px;font-weight:700}
.role-save-success{border:1px solid #285d46;background:#0c231a;color:#6ed7a1}
.role-save-error{border:1px solid #79352f;background:#26100e;color:#ff8a80}
@media(max-width:720px){.role-assignment-row{grid-template-columns:34px 1fr}.role-assignment-row input{grid-column:2}.alliance-role-overview-head{align-items:flex-start;flex-direction:column}}

/* v39: primary + backup role assignments */
.alliance-role-panel-assignee{display:flex;flex-direction:column;align-items:flex-end;min-width:0;line-height:1.15}
.alliance-role-panel-assignee strong{font-size:11px;font-weight:600;color:#b8c4cc;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.alliance-role-panel-assignee small{margin-top:2px;font-size:8px;color:#778792;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.role-assignment-row{grid-template-columns:34px minmax(150px,.9fr) minmax(155px,1fr) minmax(155px,1fr)!important}
.role-assignment-field{display:grid;gap:4px;min-width:0}
.role-assignment-field span{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:#768792;font-weight:700}
.role-assignment-field input{width:100%;box-sizing:border-box;border:1px solid #344550;border-radius:7px;background:#071016;color:#eef4f7;padding:8px 9px;font:inherit;font-size:12px;outline:none}
.role-assignment-field input:focus{border-color:#c98b2d;box-shadow:0 0 0 2px rgba(201,139,45,.12)}
@media(max-width:820px){.role-assignment-row{grid-template-columns:34px 1fr!important}.role-assignment-field{grid-column:2}.alliance-role-panel-assignee small{display:none}}


/* v40 live top-bar profile */
.topbar-profile-live{position:absolute;z-index:19;top:1.38%;right:8.15%;width:17.35%;height:4.15%;min-height:30px;border:1px solid rgba(118,138,154,.38);border-radius:.48vw;padding:0 .58vw;display:flex;align-items:center;gap:.42vw;color:#f3f6f9;background:linear-gradient(180deg,rgba(13,20,28,.985),rgba(8,13,19,.985));box-shadow:0 .16vw .5vw rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.03);cursor:pointer;overflow:hidden}
.topbar-profile-live:hover{border-color:rgba(242,174,62,.68);background:linear-gradient(180deg,rgba(20,29,38,.99),rgba(10,16,22,.99))}
.topbar-profile-avatar{width:1.7vw;height:1.7vw;min-width:22px;min-height:22px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#5867ff,#6e55e9);color:#fff;font-size:clamp(10px,.78vw,14px);font-weight:900;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.topbar-profile-copy{min-width:0;display:flex;align-items:center;gap:.34vw;font-size:clamp(9px,.72vw,13px);white-space:nowrap;overflow:hidden}
.topbar-profile-copy strong{font-weight:850;color:#fff}.topbar-profile-copy span:last-child{overflow:hidden;text-overflow:ellipsis;color:#f2f5f7;font-weight:700}.topbar-profile-chevron{margin-left:auto;color:#91a1ae;font-size:clamp(9px,.72vw,13px)}
.profile-live-card{display:grid;gap:.85rem}.profile-live-card>strong{font-size:1.05rem}.profile-live-card p{margin:0;color:#9caab5;line-height:1.55}.profile-live-meta{display:grid;grid-template-columns:auto 1fr;gap:.5rem .9rem;padding:.8rem;border:1px solid rgba(129,148,164,.25);border-radius:.55rem;background:rgba(5,10,15,.5)}.profile-live-meta span{color:#8898a6}.profile-live-meta b{color:#f6f8fa}


/* v41: compact Alliance Role Assignments manager + always-visible save */
.modal:has(.role-assignment-manager){
  width:min(860px,92vw);
  max-height:88vh;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  padding:20px 22px 16px;
}
.modal:has(.role-assignment-manager) #modalText{
  margin:0;
  overflow:auto;
  padding-right:4px;
  min-height:0;
}
.modal:has(.role-assignment-manager) .modal-primary{
  position:sticky;
  bottom:0;
  z-index:3;
  margin-top:12px;
  align-self:flex-end;
  min-width:170px;
  box-shadow:0 -12px 22px rgba(7,13,18,.88);
}
.modal:has(.role-assignment-manager) .role-assignment-intro{
  padding:8px 10px;
  margin-bottom:8px;
}
.modal:has(.role-assignment-manager) .role-assignment-intro p{
  font-size:10px;
  line-height:1.3;
  margin-top:3px;
}
.modal:has(.role-assignment-manager) .role-assignment-list{
  gap:6px;
}
.modal:has(.role-assignment-manager) .role-assignment-row{
  grid-template-columns:30px minmax(165px,.9fr) minmax(145px,1fr) minmax(145px,1fr)!important;
  gap:8px;
  padding:6px 8px;
  min-height:48px;
}
.modal:has(.role-assignment-manager) .role-assignment-icon{
  width:28px;
  height:28px;
  border-radius:7px;
}
.modal:has(.role-assignment-manager) .role-assignment-name{
  font-size:11px;
  line-height:1.2;
}
.modal:has(.role-assignment-manager) .role-assignment-field{
  gap:2px;
}
.modal:has(.role-assignment-manager) .role-assignment-field span{
  font-size:8px;
}
.modal:has(.role-assignment-manager) .role-assignment-field input{
  padding:6px 8px;
  font-size:11px;
  min-height:34px;
}
.modal:has(.role-assignment-manager) .role-assignment-note{
  margin-top:6px;
  font-size:9px;
}
@media(max-height:760px){
  .modal:has(.role-assignment-manager){max-height:94vh;padding-top:14px}
  .modal:has(.role-assignment-manager) .modal-kicker{font-size:10px}
  .modal:has(.role-assignment-manager) h2{font-size:20px;margin-bottom:6px}
  .modal:has(.role-assignment-manager) .role-assignment-intro{display:none}
  .modal:has(.role-assignment-manager) .role-assignment-row{min-height:44px;padding:5px 7px}
}

/* v42 owner authentication */
.owner-login-card{display:grid;gap:.85rem}.owner-login-card>strong{font-size:1.05rem}.owner-login-card>p{margin:0;color:#9caab5;line-height:1.5}.owner-login-card label{display:grid;gap:.35rem}.owner-login-card label>span{font-size:.76rem;text-transform:uppercase;letter-spacing:.08em;color:#91a0ac;font-weight:800}.owner-login-status{padding:.65rem .75rem;border:1px solid rgba(244,177,68,.35);border-radius:.5rem;background:rgba(244,177,68,.07);color:#f1c36d;line-height:1.4}

/* v45 — owner profile + account creation */
.owner-account-grid{display:grid;grid-template-columns:1fr 1.12fr;gap:1rem;align-items:start;min-width:min(860px,78vw)}
.owner-account-card{display:grid;gap:.8rem;padding:1rem;border:1px solid rgba(130,151,168,.24);border-radius:.7rem;background:rgba(5,11,17,.72)}
.owner-account-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.owner-account-card-head strong{display:block;font-size:1.05rem;color:#f4f7fa}.owner-mini-kicker{display:block;margin-bottom:.25rem;font-size:.68rem;font-weight:900;letter-spacing:.12em;color:#f4b144}.owner-role-pill{padding:.28rem .5rem;border:1px solid rgba(244,177,68,.35);border-radius:999px;background:rgba(244,177,68,.08);font-size:.7rem;font-weight:900;color:#f4b144}
.owner-account-card label{display:grid;gap:.35rem}.owner-account-card label>span{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:#8fa0ae;font-weight:800}.owner-account-card .text-input{min-height:2.65rem}.owner-account-note{margin:0;color:#95a4b0;line-height:1.45;font-size:.86rem}.owner-user-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.owner-account-actions{display:flex;align-items:center;gap:.75rem;justify-content:space-between}.owner-account-actions span{color:#7f909d;font-size:.76rem}.owner-inline-status,.owner-user-admin-status{min-height:1.1rem;padding:.45rem .55rem;border-radius:.4rem;color:#f0c46e;background:rgba(244,177,68,.07);font-size:.78rem}.owner-inline-status:empty,.owner-user-admin-status:empty{display:none}.owner-inline-status.error,.owner-user-admin-status[data-state="error"]{color:#ff8e83;background:rgba(180,49,42,.12)}.owner-user-admin-status[data-state="success"]{color:#68d990;background:rgba(46,153,91,.12)}
.mini-button{border:1px solid rgba(126,148,166,.35);border-radius:.45rem;background:#14202b;color:#eef3f6;font-weight:800;padding:.58rem .85rem;cursor:pointer}.mini-button.primary{background:#f3ad39;border-color:#f3ad39;color:#111820}.mini-button:disabled{opacity:.6;cursor:wait}
@media (max-width:980px){.owner-account-grid{grid-template-columns:1fr;min-width:0}.owner-user-form-grid{grid-template-columns:1fr}}

/* v47 owner account manager */
.owner-managed-users-wrap{display:grid;gap:.55rem;margin-top:.25rem;padding-top:.75rem;border-top:1px solid rgba(130,151,168,.16)}
.owner-managed-users-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}.owner-managed-users-head strong{font-size:.88rem;color:#edf3f7}.owner-managed-users-head span{font-size:.7rem;color:#7f909d}
.owner-managed-users{display:grid;gap:.45rem;max-height:18rem;overflow:auto;padding-right:.2rem}
.owner-managed-user{display:grid;grid-template-columns:minmax(230px,1.5fr) 92px 92px 66px;gap:.5rem;align-items:center;padding:.55rem;border:1px solid rgba(130,151,168,.18);border-radius:.5rem;background:rgba(10,18,24,.72)}
.owner-managed-user-main{display:grid;gap:.18rem}.owner-managed-user-main .text-input{min-height:2.2rem;padding:.4rem .55rem}.owner-managed-email{padding-left:.1rem;font-size:.68rem;color:#748795;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.owner-managed-role{min-height:2.2rem!important;padding:.35rem .45rem!important}.owner-managed-toggle{display:flex!important;align-items:center;gap:.35rem!important;color:#9fb0bd}.owner-managed-toggle input{accent-color:#f4b144}.owner-managed-toggle span{font-size:.7rem!important;text-transform:none!important;letter-spacing:0!important;color:#9fb0bd!important}
.owner-managed-empty{padding:.75rem;border:1px dashed rgba(130,151,168,.2);border-radius:.45rem;color:#80919d;font-size:.75rem}.owner-managed-empty.error{color:#ff8e83;border-color:rgba(180,49,42,.32)}
@media(max-width:1180px){.owner-managed-user{grid-template-columns:1fr 84px}.owner-managed-toggle,.owner-managed-user>.mini-button{justify-self:start}.owner-managed-user-main{grid-column:1/-1}}

/* v50 — owner/user-management modal layout fix */
.modal:has(.owner-account-grid){
  width:min(1120px,92vw);
  max-height:88vh;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  padding:22px 24px 18px;
}
.modal:has(.owner-account-grid) #modalText{
  margin:0;
  min-height:0;
  overflow:auto;
  padding-right:4px;
}
.modal:has(.owner-account-grid) .modal-primary{
  margin-top:14px;
  align-self:flex-start;
}
.modal:has(.owner-account-grid) .owner-account-grid{
  grid-template-columns:minmax(320px,.82fr) minmax(0,1.55fr);
  width:100%;
  min-width:0;
  gap:16px;
  align-items:stretch;
}
.modal:has(.owner-account-grid) .owner-account-card{
  min-width:0;
  align-content:start;
}
.modal:has(.owner-account-grid) .owner-user-form-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.modal:has(.owner-account-grid) .owner-account-actions{
  flex-wrap:wrap;
}
.modal:has(.owner-account-grid) .owner-managed-users{
  max-height:300px;
  overflow-y:auto;
  overflow-x:hidden;
  padding-right:4px;
}
.modal:has(.owner-account-grid) .owner-managed-user{
  grid-template-columns:minmax(180px,1fr) 105px 92px 66px;
  min-width:0;
}
.modal:has(.owner-account-grid) .owner-managed-user-main,
.modal:has(.owner-account-grid) .owner-managed-user-main .text-input,
.modal:has(.owner-account-grid) .owner-managed-role{
  min-width:0;
  width:100%;
  box-sizing:border-box;
}
.modal:has(.owner-account-grid) .owner-managed-users-head{
  flex-wrap:wrap;
}
@media(max-width:980px){
  .modal:has(.owner-account-grid){width:min(720px,94vw);max-height:92vh;padding:18px}
  .modal:has(.owner-account-grid) .owner-account-grid{grid-template-columns:1fr}
  .modal:has(.owner-account-grid) .owner-user-form-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  .modal:has(.owner-account-grid){width:94vw;padding:16px}
  .modal:has(.owner-account-grid) .owner-user-form-grid{grid-template-columns:1fr}
  .modal:has(.owner-account-grid) .owner-managed-user{grid-template-columns:1fr 88px}
  .modal:has(.owner-account-grid) .owner-managed-user-main{grid-column:1/-1}
}
.owner-account-grid-single{grid-template-columns:minmax(0,1fr)!important;max-width:720px}

/* Calendar v63 — visual refinement only */
.modal:has(.event-composer:not([hidden])){width:min(920px,94%)}
.calendar-shell{margin-top:18px;border-color:rgba(175,193,208,.13);border-radius:10px;background:rgba(3,9,14,.58);box-shadow:0 12px 30px rgba(0,0,0,.16)}
.calendar-toolbar{grid-template-columns:auto auto minmax(180px,1fr) minmax(150px,190px);gap:8px;padding:9px 10px;background:rgba(12,19,25,.92)}
.calendar-view-switch{padding:2px;border:1px solid rgba(183,199,211,.12);border-radius:7px;background:rgba(0,0,0,.16)}
.calendar-view-btn,.calendar-nav-btn,.calendar-today-btn{height:30px;border-radius:5px}
.calendar-view-btn{padding:0 10px;border-color:transparent;background:transparent;color:#8393a0}
.calendar-view-btn:hover{color:#d8e1e7;background:rgba(255,255,255,.045)}
.calendar-view-btn.is-active{color:#171109;border-color:rgba(202,142,48,.85);background:linear-gradient(#f3bd5c,#d9942f);box-shadow:0 1px 0 rgba(255,255,255,.18) inset}
.calendar-nav{gap:3px}
.calendar-nav-btn{width:30px}
.calendar-today-btn{padding:0 9px}
.calendar-period{padding-left:4px;font-size:14px;letter-spacing:.01em}
.calendar-filter{height:30px;border-radius:5px;color:#bfcbd4;background:#071019}
.calendar-grid{min-height:310px;padding:10px}
.calendar-weekdays{margin-bottom:4px}
.calendar-weekdays div{padding:5px 6px 7px;color:#657784;font-size:8px;letter-spacing:.12em;text-transform:uppercase}
.calendar-month-grid{gap:4px}
.calendar-day{min-height:92px;padding:6px 6px 5px;border:1px solid rgba(255,255,255,.055);border-radius:6px;background:rgba(5,11,16,.5);transition:border-color .12s ease,background .12s ease}
.calendar-day:hover{border-color:rgba(143,166,181,.14);background:rgba(8,15,21,.68)}
.calendar-day.is-outside{opacity:.28}
.calendar-day.is-today{border-color:rgba(243,181,77,.36);box-shadow:inset 0 0 0 1px rgba(243,181,77,.16);background:rgba(53,38,15,.18)}
.calendar-day-number{display:flex;align-items:center;justify-content:center;width:22px;height:22px;margin:0 0 5px auto;border-radius:999px;color:#8595a1;font-size:9px}
.calendar-day.is-today .calendar-day-number{color:#171109;background:#e9ab45}
.calendar-chip{margin:3px 0;padding:4px 6px;border-radius:5px;font-size:8.5px;line-height:1.2;background:rgba(22,55,76,.38)}
.calendar-chip:hover{filter:brightness(1.15)}
.calendar-week-grid{gap:7px}
.calendar-week-column{min-height:250px;padding:7px;border-radius:7px;background:rgba(5,11,16,.5)}
.calendar-week-head{padding-bottom:7px;border-bottom:1px solid rgba(255,255,255,.05)}
.calendar-list-view{gap:5px}
.calendar-list-item{grid-template-columns:96px 1fr auto;padding:10px 11px;border-radius:7px;background:rgba(5,11,16,.5)}
.calendar-list-item:hover{border-color:rgba(137,164,181,.16);background:rgba(8,15,21,.68)}
.calendar-list-copy strong{font-size:11.5px}
.event-detail{margin-top:10px;padding:13px 14px;border-radius:8px}
@media(max-width:760px){
  .modal:has(.event-composer:not([hidden])){width:94%}
  .calendar-toolbar{grid-template-columns:1fr auto;gap:7px}
  .calendar-view-switch{justify-self:start}
  .calendar-nav{justify-self:end}
  .calendar-period{order:3;padding-left:0}
  .calendar-filter{order:4;width:100%}
  .calendar-grid{padding:7px}
  .calendar-month-grid{gap:2px}
  .calendar-day{min-height:72px;padding:4px}
  .calendar-day-number{width:19px;height:19px;margin-bottom:3px}
  .calendar-chip{padding:3px 4px;font-size:7.5px}
}

.notification-toolbar-actions{display:flex;gap:.5vw}.notification-compose{display:grid;grid-template-columns:1fr auto;gap:.45vw;padding:.7vw 1.1vw;border-bottom:1px solid rgba(132,151,166,.11)}.notification-compose select,.notification-compose textarea{grid-column:1/2;background:rgba(5,10,15,.75);border:1px solid rgba(132,151,166,.22);color:#e8eef2;border-radius:.35vw;padding:.45vw .55vw;font:inherit;resize:vertical}.notification-compose button{grid-column:2/3;grid-row:1/3;border:1px solid rgba(226,165,63,.45);background:rgba(226,165,63,.1);color:#efb551;border-radius:.35vw;padding:0 .8vw;font-weight:800;cursor:pointer}.notification-sender{display:block;color:#7f909d;margin-top:.12vw;font-size:clamp(7px,.56vw,10px)}.owner-managed-user-actions{display:flex;gap:.35vw}.mini-button.danger{border-color:rgba(216,82,72,.55);color:#ff8a80;background:rgba(130,35,30,.12)}

/* v66 — User Management action buttons fit inside account rows */
.modal:has(.owner-account-grid) .owner-managed-user{
  grid-template-columns:minmax(170px,1fr) 105px 92px minmax(142px,auto);
}
.modal:has(.owner-account-grid) .owner-managed-user-actions{
  min-width:0;
  display:flex;
  justify-content:flex-end;
  gap:6px;
}
.modal:has(.owner-account-grid) .owner-managed-user-actions .mini-button{
  padding:.58rem .7rem;
  white-space:nowrap;
}
@media(max-width:680px){
  .modal:has(.owner-account-grid) .owner-managed-user{
    grid-template-columns:1fr 88px;
  }
  .modal:has(.owner-account-grid) .owner-managed-user-actions{
    grid-column:1/-1;
    justify-content:flex-start;
  }
}

/* v69 — UI polish only: all modal popups + Calendar Month/Week */
.modal-backdrop,
.settings-backdrop{
  background:
    radial-gradient(circle at 50% 18%, rgba(231,166,63,.08), transparent 32%),
    rgba(1,5,8,.76);
  backdrop-filter: blur(7px) saturate(.88);
}
.modal{
  width:min(500px,88%);
  padding:24px 26px 22px;
  border:1px solid rgba(238,177,76,.28);
  border-radius:14px;
  background:
    linear-gradient(180deg,rgba(21,30,38,.995),rgba(7,13,18,.995));
  box-shadow:
    0 30px 90px rgba(0,0,0,.72),
    0 0 0 1px rgba(255,255,255,.018) inset,
    0 1px 0 rgba(255,255,255,.05) inset;
}
.modal::before{
  content:"";
  position:absolute;
  left:18px;right:18px;top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(245,184,77,.72),transparent);
  pointer-events:none;
}
.modal-kicker{
  margin-bottom:7px;
  color:#dda844;
  font-size:10px;
  letter-spacing:.18em;
  opacity:.92;
}
.modal h2{
  margin:0 46px 8px 0;
  color:#f2f5f7;
  font-size:22px;
  letter-spacing:-.015em;
}
.modal p{
  margin-bottom:18px;
  color:#93a1ac;
  font-size:13px;
  line-height:1.55;
}
.modal-close{
  top:14px;right:15px;
  width:34px;height:34px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:9px;
  color:#b9c4cc;
  background:rgba(255,255,255,.035);
  font-size:20px;
  transition:background .14s ease,border-color .14s ease,color .14s ease,transform .14s ease;
}
.modal-close:hover{
  color:#f1f5f7;
  border-color:rgba(232,173,73,.24);
  background:rgba(232,173,73,.08);
  transform:translateY(-1px);
}
.modal-primary{
  min-width:102px;
  padding:10px 18px;
  border-radius:8px;
  border-color:#a97225;
  background:linear-gradient(180deg,#f4be61,#d89433);
  box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 5px 16px rgba(191,125,34,.12);
}
.modal-primary:hover{filter:brightness(1.04)}

/* Give larger functional popups a cleaner panel surface */
.modal:has(.city-cap-composer:not([hidden])),
.modal:has(.announcement-composer:not([hidden])),
.modal:has(.event-composer:not([hidden])),
.modal:has(.activity-log-view:not([hidden])),
.modal:has(.alliance-role-grid),
.modal:has(.role-assignment-manager),
.modal:has(.owner-account-grid){
  border-radius:16px;
  border-color:rgba(192,154,92,.22);
  background:linear-gradient(180deg,rgba(18,27,34,.995),rgba(6,12,17,.995));
  box-shadow:0 32px 100px rgba(0,0,0,.74),0 1px 0 rgba(255,255,255,.045) inset;
}

.settings-panel{
  border-radius:16px;
  border-color:rgba(196,157,91,.25);
  background:linear-gradient(180deg,rgba(18,27,34,.995),rgba(7,13,18,.995));
  box-shadow:0 34px 100px rgba(0,0,0,.74),0 1px 0 rgba(255,255,255,.045) inset;
  overflow:hidden;
}
.settings-header{
  background:linear-gradient(180deg,rgba(255,255,255,.022),transparent);
  border-bottom-color:rgba(255,255,255,.065);
}
.settings-section{
  border-radius:10px;
  border-color:rgba(255,255,255,.065);
  background:rgba(255,255,255,.018);
}

/* Calendar — stronger visual hierarchy in Month and Week */
.modal:has(.event-composer:not([hidden])){
  width:min(980px,95%);
  max-height:92%;
}
.calendar-shell{
  margin-top:20px;
  border:1px solid rgba(165,185,199,.13);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(7,14,20,.92),rgba(3,8,12,.9));
  box-shadow:0 18px 44px rgba(0,0,0,.25),0 1px 0 rgba(255,255,255,.025) inset;
}
.calendar-toolbar{
  grid-template-columns:auto auto minmax(210px,1fr) minmax(160px,200px);
  gap:10px;
  padding:12px 13px;
  border-bottom:1px solid rgba(255,255,255,.06);
  background:linear-gradient(180deg,rgba(19,28,35,.96),rgba(10,17,23,.94));
}
.calendar-view-switch{
  padding:3px;
  border-radius:9px;
  background:rgba(0,0,0,.22);
  box-shadow:0 0 0 1px rgba(255,255,255,.055) inset;
}
.calendar-view-btn,.calendar-nav-btn,.calendar-today-btn{
  height:32px;
  border-radius:7px;
}
.calendar-view-btn{padding:0 13px;font-size:10px;letter-spacing:.025em}
.calendar-view-btn.is-active{
  color:#171008;
  border-color:rgba(216,153,52,.9);
  background:linear-gradient(180deg,#f2c36d,#d99131);
  box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 4px 12px rgba(200,128,34,.13);
}
.calendar-nav-btn,.calendar-today-btn{
  border-color:rgba(255,255,255,.08);
  background:rgba(255,255,255,.035);
}
.calendar-nav-btn:hover,.calendar-today-btn:hover{
  border-color:rgba(234,175,76,.18);
  background:rgba(234,175,76,.07);
  color:#e9c178;
}
.calendar-period{
  padding-left:7px;
  color:#edf2f5;
  font-size:15px;
  letter-spacing:-.01em;
}
.calendar-filter{
  height:32px;
  border-color:rgba(255,255,255,.085);
  border-radius:7px;
  background:#071019;
}
.calendar-grid{min-height:340px;padding:12px}
.calendar-weekdays{margin-bottom:6px}
.calendar-weekdays div{
  padding:4px 6px 8px;
  color:#748692;
  font-size:8.5px;
  letter-spacing:.14em;
}
.calendar-month-grid{gap:6px}
.calendar-day{
  min-height:102px;
  padding:7px;
  border-color:rgba(255,255,255,.055);
  border-radius:9px;
  background:linear-gradient(180deg,rgba(11,19,25,.72),rgba(5,11,16,.66));
  box-shadow:0 1px 0 rgba(255,255,255,.015) inset;
}
.calendar-day:hover{
  border-color:rgba(190,207,218,.14);
  background:linear-gradient(180deg,rgba(15,25,32,.84),rgba(7,14,19,.78));
}
.calendar-day.is-outside{opacity:.22}
.calendar-day.is-today{
  border-color:rgba(237,177,72,.44);
  background:linear-gradient(180deg,rgba(58,41,16,.30),rgba(21,18,12,.5));
  box-shadow:0 0 0 1px rgba(237,177,72,.08) inset,0 0 18px rgba(237,177,72,.025) inset;
}
.calendar-day-number{
  width:24px;height:24px;
  margin:0 0 6px auto;
  color:#91a0aa;
  font-size:9.5px;
}
.calendar-day.is-today .calendar-day-number{
  color:#171009;
  background:linear-gradient(180deg,#f0c268,#d99936);
  box-shadow:0 2px 8px rgba(218,148,48,.16);
}
.calendar-chip{
  margin:4px 0;
  padding:5px 7px;
  border-radius:6px;
  border-color:rgba(110,173,213,.26);
  background:linear-gradient(180deg,rgba(30,72,98,.5),rgba(20,52,72,.42));
  font-size:8.7px;
  line-height:1.25;
  box-shadow:0 1px 0 rgba(255,255,255,.025) inset;
}
.calendar-chip[data-type="city_cap"]{background:linear-gradient(180deg,rgba(139,59,27,.42),rgba(95,42,22,.35))}
.calendar-chip[data-type="alliance_duel"]{background:linear-gradient(180deg,rgba(121,80,20,.40),rgba(80,53,16,.34))}
.calendar-chip[data-type="war_alert"]{background:linear-gradient(180deg,rgba(29,105,54,.38),rgba(22,72,40,.32))}

.calendar-week-grid{gap:9px}
.calendar-week-column{
  min-height:290px;
  padding:8px;
  border:1px solid rgba(255,255,255,.06);
  border-radius:10px;
  background:linear-gradient(180deg,rgba(11,19,25,.72),rgba(5,11,16,.64));
}
.calendar-week-column:hover{border-color:rgba(190,207,218,.12)}
.calendar-week-column.is-today{
  border-color:rgba(237,177,72,.38);
  background:linear-gradient(180deg,rgba(52,38,17,.26),rgba(10,14,17,.72));
}
.calendar-week-head{
  margin-bottom:9px;
  padding:3px 2px 9px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.calendar-week-head strong{
  color:#edf2f5;
  font-size:11.5px;
  letter-spacing:.02em;
}
.calendar-week-column.is-today .calendar-week-head strong{color:#efb85d}
.calendar-week-head span{margin-top:2px;color:#748591;font-size:9px}
.calendar-week-column .calendar-chip{white-space:normal;line-height:1.3}

@media(max-width:760px){
  .modal{width:94%;padding:20px 18px 18px;border-radius:12px}
  .modal:has(.event-composer:not([hidden])){width:96%;max-height:94%}
  .calendar-toolbar{grid-template-columns:1fr auto;padding:9px;gap:8px}
  .calendar-period{font-size:13px}
  .calendar-grid{padding:8px}
  .calendar-month-grid{gap:3px}
  .calendar-day{min-height:76px;padding:5px;border-radius:7px}
  .calendar-chip{padding:3px 4px;font-size:7.4px}
  .calendar-week-grid{gap:5px}
  .calendar-week-column{min-height:220px;padding:5px;border-radius:7px}
}

/* v70 — full WARBOARD visual pass (visual layer only; no behavior changes) */
:root{
  --wb-gold:#e8aa45;
  --wb-gold-2:#f4c36b;
  --wb-line:rgba(231,171,70,.30);
  --wb-panel:rgba(7,14,20,.94);
  --wb-panel-2:rgba(12,21,29,.96);
  --wb-soft:rgba(255,255,255,.045);
  --wb-text:#edf3f7;
  --wb-muted:#8d9da9;
}

/* Shared cinematic modal shell */
.modal,
.settings-panel{
  isolation:isolate;
  border:1px solid var(--wb-line)!important;
  background:
    linear-gradient(180deg,rgba(4,10,15,.60),rgba(4,10,15,.93)),
    url('assets/citycap-bg.jpg') center/cover no-repeat!important;
  box-shadow:
    0 34px 110px rgba(0,0,0,.78),
    0 0 0 1px rgba(255,255,255,.022) inset,
    0 0 50px rgba(210,139,34,.035) inset!important;
}
.modal::after,
.settings-panel::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  background:
    linear-gradient(90deg,rgba(2,7,11,.94) 0%,rgba(2,7,11,.72) 46%,rgba(2,7,11,.48) 100%),
    radial-gradient(circle at 82% 12%,rgba(238,176,69,.12),transparent 28%);
  pointer-events:none;
}
.settings-panel{position:relative}

.modal-kicker,
.owner-mini-kicker{
  color:var(--wb-gold)!important;
  text-shadow:0 0 18px rgba(232,170,69,.12);
}
.modal h2,.settings-header h2{color:var(--wb-text)!important}
.modal p,.settings-header p,.settings-help{color:var(--wb-muted)!important}

/* Section cards inside all popup menus */
.composer-grid,
.owner-account-card,
.role-assignment-intro,
.role-assignment-row,
.alliance-role-card,
.alliance-role-overview-head,
.activity-log-header,
.activity-log-list,
.settings-section,
.announcement-item,
.event-planner-row{
  border-color:rgba(150,172,187,.14)!important;
  background:linear-gradient(180deg,rgba(9,19,27,.88),rgba(5,12,18,.84))!important;
  box-shadow:0 1px 0 rgba(255,255,255,.025) inset!important;
}
.owner-account-card,
.settings-section,
.role-assignment-intro,
.alliance-role-overview-head,
.activity-log-header,
.activity-log-list{border-radius:10px!important}

.owner-account-card-head,
.activity-log-header,
.settings-header{
  position:relative;
}
.owner-account-card-head::after,
.settings-section::before{
  content:"";
  display:block;
  height:1px;
  background:linear-gradient(90deg,rgba(232,170,69,.46),transparent 78%);
}
.owner-account-card-head::after{position:absolute;left:0;right:0;bottom:-10px}
.settings-section::before{margin:-1px -1px 14px}

/* Inputs, dropdowns, fields */
.text-input,
.composer-grid input,
.composer-grid select,
.composer-grid textarea,
.owner-managed-role,
.role-assignment-field input,
.settings-panel input,
.settings-panel select,
.settings-panel textarea,
.calendar-filter{
  border-color:rgba(133,158,175,.24)!important;
  border-radius:7px!important;
  color:#e8eef2!important;
  background:linear-gradient(180deg,rgba(4,12,18,.96),rgba(7,16,22,.94))!important;
  box-shadow:0 1px 0 rgba(255,255,255,.018) inset!important;
}
.text-input:focus,
.composer-grid input:focus,
.composer-grid select:focus,
.composer-grid textarea:focus,
.role-assignment-field input:focus,
.settings-panel input:focus,
.settings-panel select:focus,
.settings-panel textarea:focus{
  border-color:rgba(235,174,69,.68)!important;
  box-shadow:0 0 0 2px rgba(235,174,69,.10),0 0 18px rgba(235,174,69,.04)!important;
}
.field-label,.composer-grid label,.owner-account-card label>span,.role-assignment-field span{
  color:#9aaab5!important;
  letter-spacing:.065em;
}

/* Buttons */
.mini-button,
.calendar-nav-btn,
.calendar-today-btn{
  border-color:rgba(143,163,176,.20)!important;
  background:linear-gradient(180deg,rgba(24,36,45,.94),rgba(12,23,31,.94))!important;
  color:#dbe4ea!important;
}
.mini-button.primary,.modal-primary{
  color:#171009!important;
  border-color:#b97b21!important;
  background:linear-gradient(180deg,var(--wb-gold-2),#dc9532)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.22) inset,0 7px 20px rgba(201,129,34,.16)!important;
}
.mini-button:hover,.calendar-nav-btn:hover,.calendar-today-btn:hover{
  border-color:rgba(231,171,70,.35)!important;
  background:linear-gradient(180deg,rgba(40,44,42,.96),rgba(20,28,31,.96))!important;
}

/* User Management — tactical two-panel look */
.modal:has(.owner-account-grid){
  width:min(1040px,94vw)!important;
  padding:24px!important;
}
.modal:has(.owner-account-grid) .owner-account-grid{
  gap:14px!important;
}
.modal:has(.owner-account-grid) .owner-account-card{
  padding:16px!important;
  border:1px solid rgba(154,177,192,.14)!important;
}
.owner-role-pill{
  border-color:rgba(232,170,69,.38)!important;
  color:#f0b552!important;
  background:rgba(232,170,69,.08)!important;
}
.owner-managed-user{
  border-color:rgba(255,255,255,.055)!important;
  background:rgba(3,9,14,.46)!important;
}
.owner-managed-user:hover{background:rgba(232,170,69,.035)!important}

/* Settings — left-tab command console style */
.settings-panel{width:min(980px,94vw)!important}
.settings-tabs{
  border-right:1px solid rgba(255,255,255,.055)!important;
  background:rgba(2,8,12,.42)!important;
}
.settings-tab{
  border:1px solid transparent!important;
  border-radius:7px!important;
}
.settings-tab.is-active{
  border-color:rgba(232,170,69,.40)!important;
  color:#f1bd61!important;
  background:linear-gradient(90deg,rgba(232,170,69,.16),rgba(232,170,69,.035))!important;
  box-shadow:inset 3px 0 0 #e5a23b!important;
}

/* Alliance roles / logs / announcements */
.alliance-role-card[open]{border-color:rgba(232,170,69,.24)!important}
.alliance-role-icon,.role-assignment-icon{color:#f0b552!important;background:rgba(232,170,69,.10)!important}
.activity-log-live{color:#91d4ff!important;background:rgba(31,91,128,.22)!important}
.announcement-item[data-priority="important"]{border-color:rgba(244,181,71,.32)!important}

/* CALENDAR — strategy board month view */
.modal:has(.event-composer:not([hidden])){
  width:min(1180px,96vw)!important;
  max-height:94vh!important;
}
.calendar-shell{
  position:relative;
  overflow:hidden;
  border-color:rgba(232,170,69,.24)!important;
  background:
    linear-gradient(180deg,rgba(4,11,16,.80),rgba(3,8,12,.94)),
    url('assets/citycap-bg.jpg') center 28%/cover no-repeat!important;
  box-shadow:0 18px 54px rgba(0,0,0,.38),0 0 0 1px rgba(255,255,255,.015) inset!important;
}
.calendar-shell::after{
  content:"";
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(2,8,12,.28),rgba(2,8,12,.72) 32%,rgba(2,8,12,.86));
}
.calendar-toolbar,.calendar-grid{position:relative;z-index:1}
.calendar-toolbar{
  padding:13px 14px!important;
  border-bottom-color:rgba(232,170,69,.17)!important;
  background:linear-gradient(180deg,rgba(8,17,23,.96),rgba(5,12,18,.94))!important;
}
.calendar-view-switch{
  border:1px solid rgba(255,255,255,.06)!important;
  background:rgba(0,0,0,.28)!important;
}
.calendar-view-btn{
  min-width:62px;
  color:#83939e!important;
}
.calendar-view-btn.is-active{
  color:#171009!important;
  border-color:#bc8128!important;
  background:linear-gradient(180deg,#f4c66d,#df9a35)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.10) inset,0 5px 16px rgba(209,137,37,.15)!important;
}
.calendar-period{font-size:16px!important;font-weight:850!important}
.calendar-grid{padding:13px!important;min-height:430px!important}
.calendar-weekdays div{
  color:#8c9aa4!important;
  font-size:9px!important;
  letter-spacing:.16em!important;
}
.calendar-month-grid{gap:4px!important}
.calendar-day{
  min-height:116px!important;
  border-radius:7px!important;
  border-color:rgba(125,148,164,.13)!important;
  background:linear-gradient(180deg,rgba(7,17,24,.82),rgba(4,12,17,.80))!important;
  box-shadow:0 1px 0 rgba(255,255,255,.018) inset!important;
}
.calendar-day:hover{
  transform:translateY(-1px);
  border-color:rgba(232,170,69,.23)!important;
  background:linear-gradient(180deg,rgba(12,24,31,.90),rgba(6,15,21,.88))!important;
}
.calendar-day.is-today{
  border-color:rgba(239,178,71,.70)!important;
  background:linear-gradient(180deg,rgba(71,48,17,.42),rgba(15,18,16,.84))!important;
  box-shadow:0 0 0 1px rgba(239,178,71,.14) inset,0 0 22px rgba(239,178,71,.055) inset!important;
}
.calendar-day-number{
  color:#9aa8b2!important;
  font-size:10px!important;
  font-weight:900!important;
}
.calendar-day.is-today .calendar-day-number{
  color:#171009!important;
  background:linear-gradient(180deg,#f4c66e,#dc9632)!important;
}
.calendar-chip{
  min-height:25px;
  padding:5px 7px!important;
  border-radius:5px!important;
  font-size:8.5px!important;
  font-weight:760!important;
  border-left-width:3px!important;
  box-shadow:0 1px 0 rgba(255,255,255,.03) inset,0 2px 6px rgba(0,0,0,.12)!important;
}
.calendar-chip[data-type="city_cap"]{border-color:rgba(238,104,62,.68)!important;background:linear-gradient(180deg,rgba(126,45,25,.70),rgba(79,31,20,.68))!important}
.calendar-chip[data-type="alliance_duel"]{border-color:rgba(239,173,56,.68)!important;background:linear-gradient(180deg,rgba(114,72,17,.72),rgba(73,46,13,.68))!important}
.calendar-chip[data-type="war_alert"]{border-color:rgba(69,196,104,.64)!important;background:linear-gradient(180deg,rgba(27,101,50,.72),rgba(19,67,37,.68))!important}

/* Week view — time-board feel without changing markup/logic */
.calendar-week-grid{
  gap:0!important;
  border:1px solid rgba(125,148,164,.12);
  border-radius:8px;
  overflow:hidden;
  background:rgba(2,8,12,.48);
}
.calendar-week-column{
  min-height:360px!important;
  border:0!important;
  border-right:1px solid rgba(125,148,164,.12)!important;
  border-radius:0!important;
  background:
    repeating-linear-gradient(180deg,rgba(255,255,255,.026) 0,rgba(255,255,255,.026) 1px,transparent 1px,transparent 42px),
    linear-gradient(180deg,rgba(7,17,24,.80),rgba(4,11,16,.82))!important;
}
.calendar-week-column:last-child{border-right:0!important}
.calendar-week-column.is-today{
  background:
    repeating-linear-gradient(180deg,rgba(232,170,69,.045) 0,rgba(232,170,69,.045) 1px,transparent 1px,transparent 42px),
    linear-gradient(180deg,rgba(58,40,16,.32),rgba(8,13,16,.88))!important;
  box-shadow:inset 0 0 0 1px rgba(232,170,69,.26)!important;
}
.calendar-week-head{
  margin:-8px -8px 10px!important;
  padding:10px 5px!important;
  background:rgba(5,12,17,.85);
  border-bottom:1px solid rgba(125,148,164,.12)!important;
}
.calendar-week-column.is-today .calendar-week-head{
  background:linear-gradient(180deg,rgba(113,76,24,.40),rgba(37,29,18,.58));
  border-bottom-color:rgba(232,170,69,.32)!important;
}

@media(max-width:900px){
  .modal:has(.owner-account-grid){width:96vw!important}
  .settings-panel{width:96vw!important}
  .calendar-grid{min-height:360px!important}
  .calendar-day{min-height:92px!important}
  .calendar-week-column{min-height:300px!important}
}

/* =========================================================
   v71 — FULL VISUAL REDESIGN
   Strong WARBOARD treatment for popups + calendar only.
   No JS/data/permission behavior changes.
   ========================================================= */
:root{
  --v71-gold:#f0ad3e;
  --v71-gold-hi:#ffd16f;
  --v71-bg:#050b10;
  --v71-panel:#08131b;
  --v71-panel-2:#0b1822;
  --v71-line:rgba(240,173,62,.50);
  --v71-soft-line:rgba(152,180,197,.16);
  --v71-text:#f2f6f8;
  --v71-muted:#93a5b1;
}

/* ===== MODAL BACKDROP: much more cinematic ===== */
.modal-backdrop{
  background:
    radial-gradient(circle at 50% 18%,rgba(240,173,62,.08),transparent 24%),
    linear-gradient(180deg,rgba(1,5,8,.72),rgba(1,5,8,.90))!important;
  backdrop-filter:blur(7px) saturate(.82)!important;
}

/* ===== MODAL FRAME ===== */
.modal{
  width:min(980px,94vw)!important;
  max-height:92vh!important;
  padding:0!important;
  overflow:auto!important;
  border:1px solid rgba(240,173,62,.58)!important;
  border-radius:12px!important;
  background:
    linear-gradient(90deg,rgba(4,10,15,.96) 0%,rgba(4,10,15,.88) 55%,rgba(4,10,15,.72) 100%),
    url('assets/citycap-bg.jpg') 74% 38%/cover no-repeat!important;
  box-shadow:
    0 42px 130px rgba(0,0,0,.88),
    0 0 0 1px rgba(255,214,126,.045) inset,
    0 0 80px rgba(240,173,62,.06) inset!important;
}
.modal::before{
  content:"WARBOARD  •  ALLIANCE COMMAND"!important;
  position:sticky!important;
  top:0!important;
  z-index:8!important;
  display:block!important;
  height:34px!important;
  padding:10px 58px 0 22px!important;
  box-sizing:border-box!important;
  border-bottom:1px solid rgba(240,173,62,.22)!important;
  color:#c68f38!important;
  background:linear-gradient(180deg,rgba(5,12,18,.99),rgba(5,12,18,.94))!important;
  font-size:9px!important;
  font-weight:900!important;
  letter-spacing:.23em!important;
  text-transform:uppercase!important;
}
.modal::after{
  content:""!important;
  position:absolute!important;
  inset:34px 0 0 0!important;
  z-index:-1!important;
  background:
    linear-gradient(90deg,rgba(3,9,14,.96) 0%,rgba(3,9,14,.89) 57%,rgba(3,9,14,.62) 100%),
    radial-gradient(circle at 82% 20%,rgba(243,181,72,.13),transparent 25%),
    linear-gradient(180deg,transparent 0 74%,rgba(0,0,0,.28));
  pointer-events:none!important;
}
.modal-close{
  position:sticky!important;
  float:right!important;
  top:7px!important;
  right:10px!important;
  z-index:20!important;
  width:34px!important;
  height:34px!important;
  margin:-27px 12px 0 0!important;
  border:1px solid rgba(144,164,178,.20)!important;
  border-radius:7px!important;
  color:#bac7cf!important;
  background:rgba(7,16,22,.88)!important;
}
.modal-close:hover{color:#ffd278!important;border-color:rgba(240,173,62,.55)!important;background:rgba(30,25,16,.95)!important}

/* Header content becomes a strong title block */
.modal-kicker{
  margin:20px 26px 3px!important;
  color:var(--v71-gold)!important;
  font-size:10px!important;
  font-weight:950!important;
  letter-spacing:.16em!important;
}
.modal h2{
  margin:0 26px 4px!important;
  color:#fff!important;
  font-size:27px!important;
  line-height:1.1!important;
  letter-spacing:-.025em!important;
}
.modal>p#modalText{
  margin:0 26px 18px!important;
  max-width:680px!important;
  color:#9dafbb!important;
  font-size:12px!important;
}

/* Give different modal types a visible icon block like the visual examples */
.modal:has(.owner-account-grid) h2::before{content:"👥"}
.modal:has(.event-composer:not([hidden])) h2::before{content:"📅"}
.modal:has(.announcement-composer:not([hidden])) h2::before{content:"📣"}
.modal:has(.city-cap-composer:not([hidden])) h2::before{content:"🏰"}
.modal:has(.activity-log-view:not([hidden])) h2::before{content:"▤"}
.modal:has(.alliance-role-grid) h2::before,
.modal:has(.role-assignment-manager) h2::before{content:"♜"}
.modal:has(.owner-account-grid) h2::before,
.modal:has(.event-composer:not([hidden])) h2::before,
.modal:has(.announcement-composer:not([hidden])) h2::before,
.modal:has(.city-cap-composer:not([hidden])) h2::before,
.modal:has(.activity-log-view:not([hidden])) h2::before,
.modal:has(.alliance-role-grid) h2::before,
.modal:has(.role-assignment-manager) h2::before{
  display:inline-grid;
  place-items:center;
  width:38px;height:38px;
  margin-right:10px;
  border:1px solid rgba(240,173,62,.30);
  border-radius:8px;
  background:linear-gradient(180deg,rgba(240,173,62,.16),rgba(240,173,62,.05));
  vertical-align:-8px;
  font-size:20px;
  box-shadow:0 0 22px rgba(240,173,62,.06) inset;
}

/* ===== CONTENT PANELS: visible cards, not flat forms ===== */
.city-cap-composer,.event-composer,.announcement-composer,.activity-log-view,.alliance-role-grid,.role-assignment-manager,.owner-account-grid{
  margin:0 18px 18px!important;
  padding:14px!important;
  border:1px solid rgba(143,168,184,.12)!important;
  border-radius:11px!important;
  background:linear-gradient(180deg,rgba(5,14,20,.78),rgba(3,10,15,.82))!important;
  box-shadow:0 18px 42px rgba(0,0,0,.18)!important;
}
.composer-grid,.owner-account-card,.settings-section,.role-assignment-intro,.role-assignment-row,.alliance-role-card,.activity-log-header,.activity-log-list,.announcement-item,.reminder-box,.planned-caps{
  border:1px solid rgba(140,166,183,.15)!important;
  border-radius:9px!important;
  background:linear-gradient(180deg,rgba(12,27,37,.93),rgba(7,18,26,.92))!important;
  box-shadow:0 1px 0 rgba(255,255,255,.025) inset,0 10px 25px rgba(0,0,0,.12)!important;
}
.composer-grid,.owner-account-card,.settings-section,.role-assignment-intro,.planned-caps{padding:15px!important}

/* mini section-heading treatment */
.composer-grid::before,.reminder-box::before,.planned-caps::before,.owner-account-card::before,.settings-section::before{
  display:block!important;
  margin:0 0 12px!important;
  padding:0 0 8px!important;
  border-bottom:1px solid rgba(240,173,62,.16)!important;
  color:#aebdc6!important;
  font-size:9px!important;
  font-weight:950!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
}
.event-composer .composer-grid::before{content:"EVENT INFORMATION"}
.city-cap-composer .composer-grid::before{content:"CAPTURE DETAILS"}
.announcement-composer .composer-grid::before{content:"MESSAGE"}
.reminder-box::before{content:"NOTIFICATIONS"}
.planned-caps::before{content:"PLANNED OPERATIONS"}
.owner-account-card::before{content:"ACCOUNT & ACCESS"}
.settings-section::before{content:"CONFIGURATION"}

/* form fields stronger */
.text-input,.composer-grid input,.composer-grid select,.composer-grid textarea,.owner-managed-role,.role-assignment-field input,.settings-panel input,.settings-panel select,.settings-panel textarea,.calendar-filter{
  min-height:38px!important;
  border:1px solid rgba(118,148,167,.28)!important;
  border-radius:7px!important;
  color:#edf4f7!important;
  background:linear-gradient(180deg,rgba(3,11,17,.98),rgba(6,15,21,.98))!important;
  box-shadow:inset 0 1px 8px rgba(0,0,0,.20)!important;
}
.composer-grid label,.field-label,.owner-account-card label>span,.role-assignment-field span{
  color:#a9b9c3!important;
  font-size:10px!important;
  font-weight:850!important;
}

/* fixed action-feel buttons */
.modal-primary,.mini-button.primary{
  min-height:40px!important;
  border-radius:7px!important;
  border:1px solid #bc7d24!important;
  color:#171008!important;
  background:linear-gradient(180deg,#ffd06b 0%,#e9a33c 58%,#d88c27 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 8px 22px rgba(197,124,25,.20)!important;
  font-weight:950!important;
}
.modal-primary:hover,.mini-button.primary:hover{filter:brightness(1.08)!important;transform:translateY(-1px)}

/* ===== USER MANAGEMENT — much closer to example ===== */
.modal:has(.owner-account-grid){width:min(1120px,96vw)!important}
.modal:has(.owner-account-grid) .owner-account-grid{grid-template-columns:minmax(300px,.82fr) minmax(480px,1.35fr)!important;gap:14px!important}
.modal:has(.owner-account-grid) .owner-account-card:first-child{
  background:
    linear-gradient(180deg,rgba(8,20,28,.91),rgba(5,14,20,.94)),
    url('assets/citycap-bg.jpg') 60% 30%/cover!important;
}
.owner-managed-user{padding:9px!important;border:1px solid rgba(134,158,174,.12)!important;border-radius:7px!important;background:rgba(3,10,15,.62)!important}
.owner-managed-user:hover{border-color:rgba(240,173,62,.28)!important;background:rgba(45,32,15,.28)!important}

/* ===== SETTINGS becomes stronger command console ===== */
.settings-backdrop{backdrop-filter:blur(7px)!important;background:rgba(1,5,8,.82)!important}
.settings-panel{
  width:min(1080px,96vw)!important;
  max-height:92vh!important;
  border:1px solid rgba(240,173,62,.55)!important;
  border-radius:12px!important;
  background:
    linear-gradient(90deg,rgba(4,10,15,.95),rgba(4,10,15,.84) 62%,rgba(4,10,15,.70)),
    url('assets/citycap-bg.jpg') 80% center/cover no-repeat!important;
}
.settings-header{padding:21px 24px 16px!important;border-bottom:1px solid rgba(240,173,62,.17)!important;background:rgba(5,12,18,.86)!important}
.settings-tabs{width:190px!important;padding:13px 10px!important;background:rgba(2,8,12,.72)!important;border-right:1px solid rgba(240,173,62,.12)!important}
.settings-tab{padding:11px 12px!important;margin-bottom:5px!important;color:#9dabb4!important;font-weight:850!important}
.settings-tab.is-active{color:#ffd06d!important;border-color:rgba(240,173,62,.52)!important;background:linear-gradient(90deg,rgba(240,173,62,.19),rgba(240,173,62,.035))!important;box-shadow:inset 3px 0 0 #f0ad3e,0 0 18px rgba(240,173,62,.05)!important}
.settings-content{padding:18px!important}

/* =========================================================
   CALENDAR — visual rebuild: dense strategy-board month +
   strong time-grid week view.
   ========================================================= */
.modal:has(.event-composer:not([hidden])){
  width:min(1320px,98vw)!important;
  max-height:96vh!important;
}
.modal:has(.event-composer:not([hidden])) .event-composer{padding:12px!important}
.calendar-shell{
  margin-top:16px!important;
  border:1px solid rgba(240,173,62,.46)!important;
  border-radius:10px!important;
  background:
    linear-gradient(180deg,rgba(3,10,15,.86),rgba(3,10,15,.97)),
    url('assets/citycap-bg.jpg') center 22%/cover no-repeat!important;
  box-shadow:0 22px 56px rgba(0,0,0,.46),inset 0 0 45px rgba(240,173,62,.025)!important;
}
.calendar-shell::before{
  content:"CALENDAR  •  PLAN  /  COORDINATE  /  DOMINATE";
  display:block;
  padding:10px 14px 8px;
  border-bottom:1px solid rgba(240,173,62,.16);
  color:#b98638;
  background:rgba(4,11,16,.92);
  font-size:8px;
  font-weight:950;
  letter-spacing:.20em;
}
.calendar-shell::after{background:linear-gradient(180deg,rgba(1,6,9,.05),rgba(1,6,9,.20) 26%,rgba(1,6,9,.40))!important}
.calendar-toolbar{
  min-height:66px!important;
  padding:12px 14px!important;
  display:grid!important;
  grid-template-columns:auto auto minmax(180px,1fr) minmax(180px,250px)!important;
  gap:12px!important;
  align-items:center!important;
  border-bottom:1px solid rgba(240,173,62,.18)!important;
  background:linear-gradient(180deg,rgba(8,19,27,.98),rgba(5,14,20,.96))!important;
}
.calendar-view-switch{order:3;justify-self:center!important;padding:3px!important;border:1px solid rgba(138,161,177,.18)!important;border-radius:8px!important;background:rgba(2,8,12,.74)!important}
.calendar-nav{order:1!important;display:flex!important;gap:5px!important}
.calendar-period{order:2!important;color:#f4f7f8!important;font-size:19px!important;font-weight:950!important;white-space:nowrap!important}
.calendar-filter{order:4!important;justify-self:end!important}
.calendar-view-btn{height:34px!important;min-width:72px!important;border-radius:6px!important;font-weight:900!important}
.calendar-view-btn.is-active{color:#1b1208!important;background:linear-gradient(180deg,#ffd16f,#e7a139)!important;border:1px solid #bd7f29!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 5px 18px rgba(215,142,42,.19)!important}
.calendar-nav-btn,.calendar-today-btn{height:34px!important;border-radius:7px!important}

.calendar-grid{padding:12px!important;min-height:520px!important;background:rgba(2,8,12,.34)!important}
.calendar-weekdays{margin-bottom:5px!important}
.calendar-weekdays div{padding:7px 5px!important;color:#a9b6be!important;font-size:9px!important;font-weight:950!important;letter-spacing:.13em!important}
.calendar-month-grid{gap:2px!important;border:1px solid rgba(130,153,168,.10)!important;border-radius:8px!important;overflow:hidden!important;background:rgba(1,6,9,.45)!important}
.calendar-day{
  min-height:128px!important;
  padding:7px!important;
  border:0!important;
  border-right:1px solid rgba(120,145,160,.12)!important;
  border-bottom:1px solid rgba(120,145,160,.12)!important;
  border-radius:0!important;
  background:linear-gradient(180deg,rgba(8,19,27,.85),rgba(4,13,18,.88))!important;
  box-shadow:none!important;
  transition:.14s ease!important;
}
.calendar-day:hover{z-index:2!important;transform:none!important;background:linear-gradient(180deg,rgba(12,27,36,.96),rgba(6,17,23,.96))!important;box-shadow:inset 0 0 0 1px rgba(240,173,62,.22)!important}
.calendar-day.is-outside{opacity:.32!important;background:rgba(2,8,12,.66)!important}
.calendar-day.is-today{
  z-index:3!important;
  background:linear-gradient(180deg,rgba(67,45,17,.47),rgba(16,18,16,.92))!important;
  box-shadow:inset 0 0 0 1px rgba(245,183,72,.82),inset 0 0 42px rgba(245,183,72,.07)!important;
}
.calendar-day-number{float:right!important;margin:0 0 6px 6px!important;color:#a6b3bc!important;font-size:11px!important;font-weight:950!important}
.calendar-day.is-today .calendar-day-number{display:grid!important;place-items:center!important;width:31px!important;height:31px!important;border-radius:50%!important;color:#171009!important;background:linear-gradient(180deg,#ffd675,#e7a33a)!important;box-shadow:0 4px 12px rgba(202,128,25,.22)!important}
.calendar-chip{
  clear:both!important;
  min-height:28px!important;
  margin:4px 0!important;
  padding:6px 7px 5px 9px!important;
  border:1px solid rgba(112,168,203,.30)!important;
  border-left-width:4px!important;
  border-radius:5px!important;
  color:#eef5f8!important;
  background:linear-gradient(90deg,rgba(27,83,116,.80),rgba(12,45,66,.76))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 3px 8px rgba(0,0,0,.16)!important;
  font-size:9px!important;
  font-weight:850!important;
}
.calendar-chip:hover{filter:brightness(1.12)!important}
.calendar-chip[data-type="city_cap"]{border-color:rgba(255,111,66,.74)!important;background:linear-gradient(90deg,rgba(127,46,28,.90),rgba(77,27,21,.84))!important}
.calendar-chip[data-type="alliance_duel"]{border-color:rgba(245,179,64,.76)!important;background:linear-gradient(90deg,rgba(123,76,18,.92),rgba(73,43,12,.86))!important}
.calendar-chip[data-type="war_alert"]{border-color:rgba(76,211,113,.72)!important;background:linear-gradient(90deg,rgba(27,108,52,.90),rgba(17,65,34,.86))!important}

/* Week = actual grid-like command planning board */
.calendar-week-grid{
  min-height:500px!important;
  gap:0!important;
  border:1px solid rgba(132,155,170,.13)!important;
  border-radius:8px!important;
  overflow:hidden!important;
  background:rgba(2,8,12,.64)!important;
  box-shadow:inset 0 0 35px rgba(0,0,0,.14)!important;
}
.calendar-week-column{
  position:relative!important;
  min-height:500px!important;
  padding:0 7px 8px!important;
  border:0!important;
  border-right:1px solid rgba(123,147,162,.14)!important;
  border-radius:0!important;
  background:
    repeating-linear-gradient(180deg,transparent 0,transparent 49px,rgba(126,150,165,.11) 49px,rgba(126,150,165,.11) 50px),
    linear-gradient(180deg,rgba(7,18,25,.92),rgba(4,12,17,.94))!important;
}
.calendar-week-column:last-child{border-right:0!important}
.calendar-week-head{
  position:sticky!important;top:0!important;z-index:2!important;
  margin:0 -7px 10px!important;
  padding:10px 4px 9px!important;
  min-height:49px!important;
  border-bottom:1px solid rgba(128,151,166,.16)!important;
  background:rgba(5,14,20,.97)!important;
}
.calendar-week-head strong{color:#dfe7eb!important;font-size:11px!important;font-weight:950!important}
.calendar-week-column.is-today{
  background:
    repeating-linear-gradient(180deg,transparent 0,transparent 49px,rgba(240,173,62,.13) 49px,rgba(240,173,62,.13) 50px),
    linear-gradient(180deg,rgba(61,42,17,.42),rgba(8,14,17,.96))!important;
  box-shadow:inset 0 0 0 1px rgba(240,173,62,.50)!important;
}
.calendar-week-column.is-today .calendar-week-head{color:#ffd06b!important;background:linear-gradient(180deg,rgba(116,77,22,.70),rgba(49,35,18,.88))!important;border-bottom-color:rgba(240,173,62,.42)!important}
.calendar-week-column .calendar-chip{white-space:normal!important;line-height:1.25!important;margin-top:12px!important;padding:8px!important}

/* List view follows same visual language */
.calendar-list-view{gap:7px!important}
.calendar-list-item{padding:11px 12px!important;border:1px solid rgba(129,151,166,.14)!important;border-radius:7px!important;background:linear-gradient(90deg,rgba(8,20,28,.92),rgba(5,14,20,.90))!important}
.calendar-list-item:hover{border-color:rgba(240,173,62,.27)!important;background:linear-gradient(90deg,rgba(24,27,25,.95),rgba(8,16,20,.93))!important}

@media(max-width:900px){
  .modal{width:96vw!important}
  .modal:has(.owner-account-grid) .owner-account-grid{grid-template-columns:1fr!important}
  .calendar-toolbar{grid-template-columns:1fr auto!important}
  .calendar-period{order:1!important}
  .calendar-nav{order:2!important;justify-self:end!important}
  .calendar-view-switch{order:3!important;justify-self:start!important}
  .calendar-filter{order:4!important;justify-self:end!important}
  .calendar-day{min-height:98px!important}
  .calendar-week-column{min-height:400px!important}
}

/* ================================================================
   v72 — STRUCTURAL WARBOARD REDESIGN
   This layer deliberately changes composition, not only colors.
   ================================================================ */
:root{
  --wb72-gold:#f2b447;
  --wb72-gold-soft:#c98927;
  --wb72-ink:#050a0e;
  --wb72-panel:#08131b;
  --wb72-panel2:#0c1b25;
  --wb72-line:#243845;
  --wb72-text:#ecf2f5;
  --wb72-muted:#93a4af;
}

.modal-backdrop{
  background:radial-gradient(circle at 50% 8%,rgba(28,45,55,.38),transparent 40%),rgba(0,4,7,.84)!important;
  backdrop-filter:blur(8px)!important;
}
.modal,.settings-panel{
  border:1px solid rgba(242,180,71,.62)!important;
  box-shadow:0 30px 90px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.025) inset!important;
  background:
    linear-gradient(90deg,rgba(4,10,14,.98) 0%,rgba(5,14,20,.93) 46%,rgba(5,12,17,.78) 100%),
    url('assets/citycap-bg.jpg') center 28%/cover no-repeat!important;
  overflow:hidden!important;
}
.modal::before,.settings-panel::before{
  content:""!important;position:absolute!important;inset:0!important;pointer-events:none!important;
  background:linear-gradient(180deg,rgba(242,180,71,.09),transparent 22%),radial-gradient(circle at 92% 8%,rgba(242,180,71,.12),transparent 26%)!important;
  opacity:1!important;
}
.modal::after,.settings-panel::after{
  content:""!important;position:absolute!important;left:0!important;right:0!important;top:0!important;height:3px!important;
  background:linear-gradient(90deg,transparent,var(--wb72-gold),transparent)!important;opacity:.95!important;
}
.modal>* , .settings-panel>*{position:relative;z-index:2}
.modal-kicker{
  margin:-4px 48px 0 0!important;padding:0 0 10px!important;color:var(--wb72-gold)!important;
  font-size:11px!important;font-weight:900!important;letter-spacing:.24em!important;text-transform:uppercase!important;
}
.modal h2,.settings-header h2{
  margin:0 48px 6px 0!important;color:var(--wb72-text)!important;font-size:27px!important;line-height:1.05!important;
  text-transform:uppercase!important;letter-spacing:.02em!important;text-shadow:0 2px 16px #000!important;
}
.modal>p#modalText{margin:0 48px 16px 0!important;max-width:860px!important;color:#aab8c1!important;font-size:13px!important}
.modal-close,.settings-close{
  top:14px!important;right:14px!important;width:38px!important;height:38px!important;border:1px solid #314653!important;border-radius:7px!important;
  background:rgba(5,13,18,.9)!important;color:#c7d2d8!important;font-size:24px!important;box-shadow:0 8px 20px rgba(0,0,0,.3)!important;
}
.city-cap-composer,.event-composer,.announcement-composer,.activity-log-view,.alliance-role-grid,.role-assignment-manager,.owner-account-grid{
  background:rgba(3,10,14,.72)!important;border:1px solid rgba(117,146,162,.2)!important;border-radius:9px!important;
  box-shadow:0 12px 36px rgba(0,0,0,.22)!important;
}
.composer-grid,.reminder-box,.planned-caps,.event-detail,.owner-account-card,.role-assignment-manager,.alliance-role-card{
  background:linear-gradient(180deg,rgba(12,29,39,.92),rgba(7,18,25,.94))!important;border:1px solid rgba(89,118,134,.26)!important;border-radius:7px!important;
}
.composer-grid{padding:34px 14px 14px!important;position:relative!important}
.composer-grid::before{
  position:absolute!important;top:11px!important;left:14px!important;color:#c3d0d7!important;font-size:10px!important;font-weight:900!important;letter-spacing:.16em!important;
}
.event-composer .composer-grid::before{content:"EVENT INFORMATION"!important}
.announcement-composer .composer-grid::before{content:"MESSAGE & PRIORITY"!important}
.city-cap-composer .composer-grid::before{content:"CITY CAP SCHEDULE"!important}
.text-input,.composer-grid input,.composer-grid select,.composer-grid textarea,.settings-panel input,.settings-panel select,.settings-panel textarea{
  background:#061018!important;border:1px solid #29404d!important;color:#edf3f6!important;border-radius:5px!important;min-height:40px!important;
  box-shadow:0 1px 0 rgba(255,255,255,.02) inset!important;
}
.text-input:focus,.composer-grid input:focus,.composer-grid select:focus,.composer-grid textarea:focus,.settings-panel input:focus,.settings-panel select:focus,.settings-panel textarea:focus{
  border-color:var(--wb72-gold)!important;box-shadow:0 0 0 2px rgba(242,180,71,.14)!important;outline:0!important;
}
.modal-primary,.mini-button.primary{
  background:linear-gradient(180deg,#ffc963,#eea62f)!important;color:#171008!important;border:1px solid #ffcf70!important;border-radius:5px!important;
  font-weight:900!important;box-shadow:0 7px 18px rgba(230,153,40,.2),0 1px rgba(255,255,255,.35) inset!important;
}

/* Event/calendar modal becomes a full command board */
.modal:has(.event-composer:not([hidden])){
  width:min(1450px,96vw)!important;max-width:none!important;max-height:94vh!important;padding:20px 20px 18px!important;
}
.modal:has(.event-composer:not([hidden])) .event-composer{
  display:block!important;background:rgba(2,9,13,.72)!important;padding:10px!important;border-radius:8px!important;
}
.modal:has(.event-composer:not([hidden])) .composer-grid.event-grid,
.modal:has(.event-composer:not([hidden]))>.modal-kicker,
.modal:has(.event-composer:not([hidden]))>h2,
.modal:has(.event-composer:not([hidden]))>p#modalText,
.modal:has(.event-composer:not([hidden])) .event-composer>.reminder-box,
.modal:has(.event-composer:not([hidden])) .event-composer>.composer-help,
.modal:has(.event-composer:not([hidden])) .event-composer>.event-list-section,
.modal:has(.event-composer:not([hidden])) .event-composer>.city-cap-status,
.modal:has(.event-composer:not([hidden]))>.modal-primary{
  /* keep real create/edit controls intact; calendar remains the visual focus */
}

.calendar-shell{
  margin:0!important;padding:0!important;border:1px solid rgba(242,180,71,.48)!important;border-radius:8px!important;overflow:hidden!important;
  background:linear-gradient(180deg,rgba(6,17,24,.97),rgba(3,10,14,.98))!important;box-shadow:0 20px 50px rgba(0,0,0,.36)!important;
}
.calendar-shell::before{content:none!important}
.calendar-shell::after{content:none!important}
.calendar-toolbar{
  min-height:68px!important;padding:10px 14px!important;display:grid!important;
  grid-template-columns:auto auto minmax(190px,1fr) auto!important;align-items:center!important;gap:12px!important;
  background:linear-gradient(180deg,rgba(13,29,39,.98),rgba(7,18,25,.98))!important;border-bottom:1px solid #253845!important;
}
.calendar-nav{order:1!important;display:flex!important;gap:6px!important}
.calendar-period{order:2!important;font-size:20px!important;color:#f3f6f7!important;text-transform:capitalize!important;white-space:nowrap!important}
.calendar-view-switch{order:3!important;justify-self:center!important;background:#040b10!important;border:1px solid #263945!important;border-radius:7px!important;padding:3px!important;display:flex!important;gap:2px!important}
.calendar-filter{order:4!important;min-width:170px!important;height:40px!important;background:#061018!important;border:1px solid #29404d!important;color:#eaf1f4!important;border-radius:6px!important;padding:0 12px!important;font-weight:700!important}
.calendar-view-btn,.calendar-nav-btn,.calendar-today-btn{
  min-height:38px!important;border:1px solid #2a3d49!important;border-radius:5px!important;background:#0b1821!important;color:#b9c6cd!important;font-weight:800!important;
}
.calendar-view-btn{min-width:82px!important}
.calendar-view-btn.is-active{
  background:linear-gradient(180deg,#ffc961,#e9a131)!important;color:#171008!important;border-color:#ffd170!important;box-shadow:0 0 0 2px rgba(242,180,71,.14),0 5px 12px rgba(0,0,0,.3)!important;
}
.war-calendar-layout{
  display:grid!important;grid-template-columns:minmax(0,1fr) 245px!important;min-height:590px!important;background:#040b10!important;
}
.calendar-grid{min-width:0!important;padding:0!important;background:#040b10!important;overflow:auto!important}
.calendar-command-sidebar{
  border-left:1px solid #243743!important;background:linear-gradient(180deg,#08151d,#050d12)!important;padding:10px!important;display:flex!important;flex-direction:column!important;gap:10px!important;
}
.calendar-side-card{background:#07121a!important;border:1px solid #223642!important;border-radius:6px!important;padding:10px!important}
.calendar-side-title{font-size:11px!important;font-weight:900!important;letter-spacing:.12em!important;color:#edf2f4!important;margin-bottom:9px!important}
.mini-weekdays,.mini-days{display:grid!important;grid-template-columns:repeat(7,1fr)!important;text-align:center!important;gap:2px!important}
.mini-weekdays span{font-size:9px!important;color:#7f929d!important;font-weight:900!important;padding:2px 0 5px!important}
.mini-day{position:relative!important;height:25px!important;border:0!important;background:transparent!important;color:#a9b6bd!important;border-radius:4px!important;font-size:10px!important;cursor:pointer!important}
.mini-day.is-outside{opacity:.28!important}.mini-day.is-active{background:var(--wb72-gold)!important;color:#171008!important;font-weight:900!important}
.mini-day.has-events:not(.is-active)::after{content:""!important;position:absolute!important;width:3px!important;height:3px!important;border-radius:50%!important;background:var(--wb72-gold)!important;bottom:2px!important;left:50%!important;transform:translateX(-50%)!important}
.calendar-type-legend{display:grid!important;gap:6px!important}.calendar-legend-row{display:flex!important;align-items:center!important;gap:8px!important;color:#b9c6cc!important;font-size:11px!important}
.legend-swatch{width:9px!important;height:9px!important;border-radius:2px!important;background:#5ca9db!important;box-shadow:0 0 8px currentColor!important}
.calendar-legend-row[data-type="city_cap"] .legend-swatch{background:#e55a43!important}.calendar-legend-row[data-type="supply_run"] .legend-swatch{background:#5dcc57!important}.calendar-legend-row[data-type="alliance_duel"] .legend-swatch{background:#3d9fe2!important}.calendar-legend-row[data-type="war_alert"] .legend-swatch{background:#df4b42!important}.calendar-legend-row[data-type="tm_start"] .legend-swatch{background:#9c6de0!important}.calendar-legend-row[data-type="rally"] .legend-swatch{background:#e5a83b!important}.calendar-legend-row[data-type="custom_event"] .legend-swatch{background:#c957cb!important}
.calendar-upcoming-card{flex:1!important}.calendar-upcoming-list{display:grid!important;gap:2px!important}.calendar-upcoming-row{display:grid!important;grid-template-columns:46px 38px 1fr 10px!important;gap:5px!important;align-items:center!important;width:100%!important;border:0!important;border-left:2px solid var(--wb72-gold)!important;background:transparent!important;color:#b8c5cc!important;padding:6px 4px 6px 7px!important;text-align:left!important;cursor:pointer!important}.calendar-upcoming-row:hover{background:#0c1b24!important}.calendar-upcoming-row strong{font-size:10px!important;color:#e4ebee!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.upcoming-date,.upcoming-time{font-size:9px!important;color:#8598a3!important}.upcoming-arrow{color:#d2dae0!important}.calendar-side-empty{font-size:10px!important;color:#70828c!important;padding:8px 2px!important}

.calendar-weekdays{display:grid!important;grid-template-columns:repeat(7,1fr)!important;background:#071017!important;border-bottom:1px solid #1e313c!important}
.calendar-weekdays>div{height:34px!important;display:flex!important;align-items:center!important;justify-content:center!important;color:#97a7b0!important;font-size:10px!important;font-weight:900!important;letter-spacing:.12em!important}
.calendar-month-grid.war-month-grid{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;grid-template-rows:repeat(6,92px)!important;background:#14242d!important;gap:1px!important}
.calendar-day{min-width:0!important;min-height:0!important;height:auto!important;background:linear-gradient(180deg,#07131b,#061018)!important;border:0!important;padding:7px!important;position:relative!important;overflow:hidden!important;cursor:pointer!important}
.calendar-day:hover{background:#0a1922!important}.calendar-day.is-outside{opacity:.36!important}.calendar-day.is-selected{box-shadow:inset 0 0 0 1px rgba(242,180,71,.5)!important}.calendar-day.is-today{background:linear-gradient(145deg,rgba(70,50,18,.55),#09151b 65%)!important;box-shadow:inset 0 0 0 1px var(--wb72-gold)!important}
.calendar-day-top{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:5px!important;min-height:20px!important;margin-bottom:4px!important}.calendar-day-number{position:static!important;color:#aab9c1!important;font-size:11px!important;font-weight:900!important}.calendar-day.is-today .calendar-day-number{width:27px!important;height:27px!important;border-radius:50%!important;background:var(--wb72-gold)!important;color:#161006!important;display:grid!important;place-items:center!important}.calendar-day-count{font-size:8px!important;color:#82939d!important}.calendar-day-events{display:grid!important;gap:3px!important}
.calendar-chip{width:100%!important;min-width:0!important;height:30px!important;padding:3px 7px!important;border:1px solid #245b76!important;border-radius:4px!important;background:linear-gradient(90deg,#0c4060,#0a2b40)!important;color:#e8f1f5!important;display:grid!important;grid-template-columns:18px minmax(0,1fr)!important;gap:5px!important;align-items:center!important;text-align:left!important;overflow:hidden!important}
.calendar-chip[data-type="city_cap"]{background:linear-gradient(90deg,#5a211b,#351817)!important;border-color:#8b3f31!important}.calendar-chip[data-type="supply_run"]{background:linear-gradient(90deg,#164c28,#12331f)!important;border-color:#2d7945!important}.calendar-chip[data-type="war_alert"]{background:linear-gradient(90deg,#5e1f22,#341518)!important;border-color:#8e3437!important}.calendar-chip[data-type="rally"]{background:linear-gradient(90deg,#5b4017,#382a16)!important;border-color:#86652b!important}.calendar-chip[data-type="tm_start"]{background:linear-gradient(90deg,#3f285f,#291d41)!important;border-color:#654598!important}.calendar-chip[data-type="custom_event"]{background:linear-gradient(90deg,#5a245d,#351c3b)!important;border-color:#87498b!important}
.calendar-chip-icon{font-size:12px!important;text-align:center!important}.calendar-chip-copy{min-width:0!important;display:flex!important;flex-direction:column!important;line-height:1.05!important}.calendar-chip-copy strong{font-size:9px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.calendar-chip-copy small{font-size:8px!important;color:#aab7bd!important;margin-top:2px!important}.calendar-chip.is-compact{height:28px!important}.calendar-chip.is-past{opacity:.68!important}.calendar-more{height:22px!important;border:0!important;border-radius:4px!important;background:#0a2a3c!important;color:#b6d7e8!important;font-size:9px!important;text-align:left!important;padding:0 7px!important}

.war-week-board{display:grid!important;grid-template-columns:58px repeat(7,minmax(100px,1fr))!important;grid-template-rows:46px 540px!important;min-width:900px!important;background:#14242d!important;gap:1px!important}.week-time-head{background:#071017!important}.war-week-head{background:#071017!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;color:#a9b7bf!important}.war-week-head strong{font-size:9px!important;letter-spacing:.09em!important}.war-week-head span{font-size:11px!important;font-weight:900!important;margin-top:2px!important}.war-week-head.is-today{color:var(--wb72-gold)!important;box-shadow:inset 0 -2px var(--wb72-gold)!important}.week-time-axis{position:relative!important;background:#061018!important}.week-time-axis span{position:absolute!important;right:8px!important;transform:translateY(-50%)!important;color:#84959f!important;font-size:9px!important}.war-week-day{position:relative!important;background:linear-gradient(180deg,#07131b,#061018)!important;overflow:hidden!important}.war-week-day.is-today{background:linear-gradient(180deg,rgba(80,58,19,.42),rgba(9,19,24,.95))!important;box-shadow:inset 1px 0 var(--wb72-gold),inset -1px 0 rgba(242,180,71,.35)!important}.week-grid-line{position:absolute!important;left:0!important;right:0!important;border-top:1px solid rgba(70,94,108,.28)!important}.week-event-card{position:absolute!important;left:6px!important;right:6px!important;min-height:42px!important;border:1px solid #2c7093!important;border-radius:5px!important;background:linear-gradient(135deg,#104f72,#0b3148)!important;color:#eaf2f6!important;padding:5px 6px!important;text-align:left!important;display:grid!important;grid-template-columns:16px 1fr!important;grid-template-rows:auto auto!important;column-gap:4px!important;overflow:hidden!important;z-index:3!important}.week-event-card strong{font-size:9px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.week-event-card small{grid-column:2!important;font-size:8px!important;color:#c0cbd0!important}.week-event-card[data-type="city_cap"]{background:linear-gradient(135deg,#703121,#3b1b17)!important;border-color:#aa5438!important}.week-event-card[data-type="supply_run"]{background:linear-gradient(135deg,#1e642e,#153b21)!important;border-color:#3b8e4c!important}.week-event-card[data-type="war_alert"]{background:linear-gradient(135deg,#6b2529,#3e171b)!important;border-color:#a43b42!important}.week-event-card[data-type="rally"]{background:linear-gradient(135deg,#6d4b19,#3f2d16)!important;border-color:#a5792c!important}.week-event-card[data-type="tm_start"]{background:linear-gradient(135deg,#583678,#321f4a)!important;border-color:#8054a6!important}.week-event-card[data-type="custom_event"]{background:linear-gradient(135deg,#6d2d70,#401e45)!important;border-color:#9c4fa0!important}
.war-list-view{padding:10px!important}.war-list-view .calendar-list-item{background:linear-gradient(90deg,#0a1922,#071118)!important;border:1px solid #213744!important;border-left:3px solid #399dd0!important;border-radius:5px!important}.list-event-icon{font-size:18px!important}

/* Event details floats like the visual reference */
.event-detail:not([hidden]){margin:10px 0!important;padding:14px!important;background:linear-gradient(120deg,rgba(8,24,34,.98),rgba(5,13,18,.97)),url('assets/citycap-bg.jpg') center/cover!important;border:1px solid rgba(242,180,71,.45)!important;border-radius:7px!important;box-shadow:0 12px 30px rgba(0,0,0,.34)!important}
.event-detail-kicker{color:var(--wb72-gold)!important;letter-spacing:.14em!important;font-weight:900!important}.event-detail h3{font-size:20px!important;color:#f2f5f6!important}

@media(max-width:1100px){
  .war-calendar-layout{grid-template-columns:1fr!important}.calendar-command-sidebar{display:none!important}.calendar-toolbar{grid-template-columns:auto 1fr auto!important}.calendar-period{grid-column:2!important}.calendar-view-switch{grid-row:2!important;grid-column:1/3!important;justify-self:start!important}.calendar-filter{grid-row:2!important;grid-column:3!important}.calendar-month-grid.war-month-grid{grid-template-rows:repeat(6,86px)!important}
}
@media(max-width:760px){
  .modal:has(.event-composer:not([hidden])){width:98vw!important;padding:12px!important}.calendar-toolbar{display:flex!important;flex-wrap:wrap!important}.calendar-period{order:1!important;width:100%!important}.calendar-nav{order:2!important}.calendar-view-switch{order:3!important}.calendar-filter{order:4!important;width:100%!important}.calendar-month-grid.war-month-grid{min-width:760px!important}.calendar-weekdays{min-width:760px!important}.war-calendar-layout{min-height:520px!important}
}

/* ============================================================
   v73 — REBUILT MODAL SHELL
   Purpose: match the approved WARBOARD visual references.
   This block intentionally overrides the layered v69-v72 modal skins.
   ============================================================ */
.modal-backdrop{
  background:rgba(1,5,8,.82)!important;
  backdrop-filter:blur(8px) saturate(.80)!important;
  padding:18px!important;
}
.modal{
  position:relative!important;
  width:min(1040px,94vw)!important;
  max-height:92vh!important;
  padding:0!important;
  overflow:auto!important;
  border:1px solid #9a6c23!important;
  border-radius:10px!important;
  background:#061018!important;
  box-shadow:0 38px 120px rgba(0,0,0,.82),0 0 0 1px rgba(255,202,96,.04) inset!important;
  isolation:isolate!important;
}
.modal::before,.modal::after{content:none!important;display:none!important}

/* One real header: graphic banner + icon + title + subtitle */
.war-modal-header{
  position:relative!important;
  min-height:118px!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:54px minmax(0,1fr)!important;
  gap:15px!important;
  align-items:center!important;
  padding:22px 72px 20px 24px!important;
  margin:0!important;
  border-bottom:1px solid rgba(226,164,59,.30)!important;
  background:
    linear-gradient(90deg,rgba(4,12,18,.99) 0%,rgba(4,12,18,.92) 48%,rgba(4,12,18,.58) 100%),
    linear-gradient(180deg,transparent 70%,rgba(0,0,0,.32)),
    url('assets/citycap-bg.jpg') right 34% center/cover no-repeat!important;
  overflow:hidden!important;
}
.war-modal-header::after{
  content:""!important;
  position:absolute!important;
  left:24px!important;
  right:24px!important;
  bottom:0!important;
  height:1px!important;
  background:linear-gradient(90deg,#e9aa43 0%,rgba(233,170,67,.26) 43%,transparent 78%)!important;
  opacity:.75!important;
}
.war-modal-icon{
  width:50px!important;
  height:50px!important;
  border:1px solid rgba(230,167,62,.42)!important;
  border-radius:9px!important;
  display:grid!important;
  place-items:center!important;
  background:linear-gradient(180deg,rgba(216,151,44,.18),rgba(9,18,24,.86))!important;
  color:#f2b54a!important;
  box-shadow:0 8px 24px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.06)!important;
  font-size:25px!important;
}
.war-modal-icon::before{content:"◆"}
.modal:has(.owner-account-grid) .war-modal-icon::before{content:"👥"}
.modal:has(.event-composer:not([hidden])) .war-modal-icon::before{content:"📅"}
.modal:has(.announcement-composer:not([hidden])) .war-modal-icon::before{content:"📣"}
.modal:has(.city-cap-composer:not([hidden])) .war-modal-icon::before{content:"🏰"}
.modal:has(.activity-log-view:not([hidden])) .war-modal-icon::before{content:"▤"}
.modal:has(.alliance-role-grid) .war-modal-icon::before,
.modal:has(.role-assignment-manager) .war-modal-icon::before{content:"♜"}

.war-modal-heading{min-width:0!important}
.modal .war-modal-heading .modal-kicker{
  margin:0 0 5px!important;
  padding:0!important;
  color:#e0a240!important;
  font-size:9px!important;
  font-weight:900!important;
  letter-spacing:.20em!important;
  line-height:1.1!important;
  text-transform:uppercase!important;
}
.modal .war-modal-heading h2,
.modal .war-modal-heading #modalTitle{
  margin:0!important;
  padding:0!important;
  color:#f4f7f8!important;
  font-size:27px!important;
  font-weight:900!important;
  line-height:1.05!important;
  letter-spacing:-.02em!important;
  text-transform:uppercase!important;
}
.modal .war-modal-heading h2::before{content:none!important;display:none!important}
.modal .war-modal-heading #modalText{
  margin:7px 0 0!important;
  padding:0!important;
  max-width:720px!important;
  color:#9babB5!important;
  font-size:12px!important;
  line-height:1.45!important;
}
.modal-close{
  position:absolute!important;
  float:none!important;
  top:18px!important;
  right:18px!important;
  z-index:30!important;
  width:38px!important;
  height:38px!important;
  margin:0!important;
  border:1px solid rgba(151,171,184,.28)!important;
  border-radius:8px!important;
  display:grid!important;
  place-items:center!important;
  color:#c4cfd5!important;
  background:rgba(5,15,22,.90)!important;
  font-size:24px!important;
  line-height:1!important;
  box-shadow:0 8px 20px rgba(0,0,0,.25)!important;
}
.modal-close:hover{color:#ffc45d!important;border-color:#ad7929!important;background:#101920!important;transform:none!important}

/* Content surface: separate from header, no image bleeding through form content */
.modal> :not(.modal-close):not(.war-modal-header){
  position:relative!important;
  z-index:2!important;
}
.city-cap-composer,.event-composer,.announcement-composer,.activity-log-view,.alliance-role-grid,.role-assignment-manager,.owner-account-grid{
  margin-left:18px!important;
  margin-right:18px!important;
}
.city-cap-composer:not([hidden]),.event-composer:not([hidden]),.announcement-composer:not([hidden]),.activity-log-view:not([hidden]),.role-assignment-manager:not([hidden]),.owner-account-grid:not([hidden]){
  margin-top:18px!important;
}
.modal .alliance-role-grid{margin-top:18px!important}

/* Real section cards like the approved mockups */
.composer-grid,.planned-caps,.announcement-list-section,.alliance-role-overview-head,.alliance-role-card,.activity-log-header,.activity-log-list,.owner-account-card,.role-assignment-intro,.role-assignment-row{
  border:1px solid #1f3542!important;
  border-radius:8px!important;
  background:linear-gradient(180deg,#0b1a23 0%,#08151d 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
.composer-grid,.planned-caps,.announcement-list-section,.activity-log-header,.owner-account-card,.role-assignment-intro{padding:15px!important}

/* Inputs are calmer and consistent */
.modal .text-input,.modal input[type="text"],.modal input[type="date"],.modal input[type="time"],.modal input[type="number"],.modal input[type="email"],.modal input[type="password"],.modal select,.modal textarea{
  border:1px solid #2b4351!important;
  border-radius:6px!important;
  background:#06121a!important;
  color:#eaf0f3!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.018)!important;
}
.modal .text-input:focus,.modal input:focus,.modal select:focus,.modal textarea:focus{
  border-color:#d79b3b!important;
  box-shadow:0 0 0 2px rgba(215,155,59,.12)!important;
  outline:none!important;
}

/* Buttons: footer feel, not random floating yellow rectangles */
.modal-primary{
  margin:18px!important;
  min-width:118px!important;
  min-height:42px!important;
  border:1px solid #be8128!important;
  border-radius:7px!important;
  background:linear-gradient(180deg,#ffc760,#e39d34)!important;
  color:#171109!important;
  font-weight:900!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 20px rgba(0,0,0,.22)!important;
}

/* Announcement spacing specifically matched to the mockup */
.modal:has(.announcement-composer:not([hidden])){width:min(1000px,94vw)!important}
.modal:has(.announcement-composer:not([hidden])) .announcement-composer{display:grid!important;gap:14px!important}
.modal:has(.announcement-composer:not([hidden])) .announcement-list-section{margin-top:4px!important}

/* Alliance Roles: remove dead space and align the overview directly under header */
.modal:has(.alliance-role-grid){width:min(940px,94vw)!important}
.modal:has(.alliance-role-grid) .alliance-role-overview-head{margin:18px 18px 12px!important;padding:13px 15px!important}
.modal:has(.alliance-role-grid) .alliance-role-grid{padding:0!important}
.modal:has(.alliance-role-grid) .modal-primary{margin-top:18px!important}

/* Settings gets the same banner language */
.settings-panel{background:#061018!important;border-color:#9a6c23!important;border-radius:10px!important}
.settings-header{
  min-height:110px!important;
  padding:22px 70px 18px 24px!important;
  background:
    linear-gradient(90deg,rgba(4,12,18,.99),rgba(4,12,18,.72)),
    url('assets/citycap-bg.jpg') right center/cover no-repeat!important;
  border-bottom:1px solid rgba(226,164,59,.30)!important;
}
.settings-header::after{content:none!important}
.settings-header .modal-kicker{margin:0 0 5px!important}
.settings-header h2{margin:0!important;font-size:27px!important;text-transform:uppercase!important}
.settings-header p{margin:7px 0 0!important}

@media(max-width:720px){
  .modal-backdrop{padding:8px!important}
  .modal{width:98vw!important;max-height:96vh!important}
  .war-modal-header{grid-template-columns:42px minmax(0,1fr)!important;min-height:104px!important;padding:17px 58px 16px 16px!important;gap:11px!important}
  .war-modal-icon{width:40px!important;height:40px!important;font-size:20px!important}
  .modal .war-modal-heading h2,.modal .war-modal-heading #modalTitle{font-size:21px!important}
  .modal-close{top:12px!important;right:12px!important;width:34px!important;height:34px!important}
  .city-cap-composer,.event-composer,.announcement-composer,.activity-log-view,.alliance-role-grid,.role-assignment-manager,.owner-account-grid{margin-left:10px!important;margin-right:10px!important}
}

/* ============================================================
   v74 — CALENDAR IS ITS OWN MENU + SAFE RESPONSIVE LAYOUT
   ============================================================ */
.calendar-view-panel[hidden]{display:none!important}
.calendar-view-panel{
  margin:18px!important;
  min-width:0!important;
}
.modal:has(.calendar-view-panel:not([hidden])){
  width:min(1380px,96vw)!important;
  max-width:96vw!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .war-modal-icon::before{content:"📅"!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-shell{
  margin:0!important;
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .war-calendar-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 220px!important;
  gap:12px!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  align-items:start!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-grid{
  min-width:0!important;
  width:100%!important;
  overflow:auto!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-command-sidebar{
  display:grid!important;
  width:220px!important;
  min-width:0!important;
  max-width:100%!important;
  gap:10px!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-toolbar{
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-weekdays,
.modal:has(.calendar-view-panel:not([hidden])) .calendar-month-grid.war-month-grid{
  min-width:0!important;
  width:100%!important;
}

/* Add Event is now only the event form, never the full calendar */
.modal:has(.event-composer:not([hidden])){
  width:min(920px,94vw)!important;
}
.modal:has(.event-composer:not([hidden])) .calendar-shell{display:none!important}

/* Keep the sidebar instead of clipping it: move it below when space gets tight. */
@media(max-width:1180px){
  .modal:has(.calendar-view-panel:not([hidden])){width:97vw!important;max-width:97vw!important}
  .modal:has(.calendar-view-panel:not([hidden])) .war-calendar-layout{
    grid-template-columns:1fr!important;
  }
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-command-sidebar{
    display:grid!important;
    width:100%!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media(max-width:780px){
  .calendar-view-panel{margin:10px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-command-sidebar{
    grid-template-columns:1fr!important;
  }
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-toolbar{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:8px!important;
  }
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-period{width:100%!important;order:1!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-nav{order:2!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-view-switch{order:3!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-filter{order:4!important;width:100%!important}
}

/* ============================================================
   v75 — CALENDAR FIT GUARANTEE
   At normal laptop/desktop widths the command sidebar moves below
   the month/week board so neither it nor the toolbar can be clipped.
   ============================================================ */
.modal:has(.calendar-view-panel:not([hidden])){
  width:min(1480px,calc(100vw - 32px))!important;
  max-width:calc(100vw - 32px)!important;
  box-sizing:border-box!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-view-panel{
  box-sizing:border-box!important;
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-shell{
  box-sizing:border-box!important;
  min-width:0!important;
  overflow:hidden!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-toolbar{
  display:grid!important;
  grid-template-columns:auto minmax(180px,1fr) auto minmax(150px,190px)!important;
  gap:10px!important;
  align-items:center!important;
  overflow:visible!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-filter{
  width:100%!important;
  min-width:0!important;
  max-width:190px!important;
  justify-self:end!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .war-calendar-layout{
  min-width:0!important;
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-grid,
.modal:has(.calendar-view-panel:not([hidden])) .calendar-weekdays,
.modal:has(.calendar-view-panel:not([hidden])) .calendar-month-grid.war-month-grid{
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}

/* The user's 1656px-wide browser falls in this range. Put sidebar below. */
@media(max-width:1700px){
  .modal:has(.calendar-view-panel:not([hidden])) .war-calendar-layout{
    grid-template-columns:minmax(0,1fr)!important;
    gap:12px!important;
  }
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-command-sidebar{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    border-left:0!important;
    border-top:1px solid #243743!important;
    box-sizing:border-box!important;
  }
}
@media(max-width:980px){
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-toolbar{
    grid-template-columns:auto minmax(0,1fr) auto!important;
  }
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-filter{
    grid-column:1/-1!important;
    max-width:none!important;
    justify-self:stretch!important;
  }
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-command-sidebar{
    grid-template-columns:1fr!important;
  }
}

/* ============================================================
   v76 — VIEWPORT-SAFE MODALS + RESPONSIVE CALENDAR
   ============================================================ */
.modal-backdrop,
.settings-backdrop{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  min-height:100vh!important;
  box-sizing:border-box!important;
  padding:clamp(8px,2vw,24px)!important;
  display:grid!important;
  place-items:center!important;
  overflow:hidden!important;
  pointer-events:auto!important;
}
.modal-backdrop[hidden],.settings-backdrop[hidden]{display:none!important}
.modal,
.settings-panel{
  max-width:100%!important;
  max-height:calc(100dvh - clamp(16px,4vw,48px))!important;
  box-sizing:border-box!important;
}

/* Calendar is a viewport-contained board. No child may widen the modal. */
.modal:has(.calendar-view-panel:not([hidden])){
  width:min(1480px,100%)!important;
  max-width:100%!important;
  height:auto!important;
  overflow:auto!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-view-panel{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:clamp(8px,1.25vw,18px)!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-shell,
.modal:has(.calendar-view-panel:not([hidden])) .war-calendar-layout,
.modal:has(.calendar-view-panel:not([hidden])) .calendar-grid,
.modal:has(.calendar-view-panel:not([hidden])) .calendar-weekdays,
.modal:has(.calendar-view-panel:not([hidden])) .calendar-month-grid.war-month-grid{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}

/* Toolbar wraps instead of forcing the board wider. */
.modal:has(.calendar-view-panel:not([hidden])) .calendar-toolbar{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:8px!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-nav{order:1!important;flex:0 0 auto!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-period{
  order:2!important;
  flex:1 1 190px!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-view-switch{order:3!important;flex:0 0 auto!important;min-width:0!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-filter{
  order:4!important;
  flex:0 1 190px!important;
  width:auto!important;
  min-width:150px!important;
  max-width:190px!important;
  margin-left:auto!important;
}

/* Sidebar is always below the actual calendar. This makes Calendar a single,
   predictable board on every desktop/laptop width. */
.modal:has(.calendar-view-panel:not([hidden])) .war-calendar-layout{
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
  overflow:hidden!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-command-sidebar{
  order:2!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  box-sizing:border-box!important;
  border-left:0!important;
  border-top:1px solid #243743!important;
}

/* Month never scrolls sideways or exceeds its container. */
.modal:has(.calendar-view-panel:not([hidden])) .calendar-grid:has(.war-month-grid){overflow-x:hidden!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-weekdays,
.modal:has(.calendar-view-panel:not([hidden])) .calendar-month-grid.war-month-grid{
  display:grid!important;
  grid-template-columns:repeat(7,minmax(0,1fr))!important;
  overflow:hidden!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-weekdays>* ,
.modal:has(.calendar-view-panel:not([hidden])) .calendar-month-grid.war-month-grid>*{
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-month-grid.war-month-grid{
  grid-template-rows:repeat(6,clamp(66px,7.2vw,92px))!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-day{
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  overflow:hidden!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-chip{
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-chip-copy,
.modal:has(.calendar-view-panel:not([hidden])) .calendar-chip-copy strong,
.modal:has(.calendar-view-panel:not([hidden])) .calendar-chip-copy small{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

/* Week may scroll inside its own board on small screens, never the whole popup. */
.modal:has(.calendar-view-panel:not([hidden])) .calendar-grid:has(.war-week-board){
  overflow-x:auto!important;
  overflow-y:hidden!important;
  max-width:100%!important;
  overscroll-behavior-inline:contain!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .war-week-board{max-width:none!important}

@media(max-width:900px){
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-filter{
    order:5!important;
    flex:1 1 100%!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin-left:0!important;
  }
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-command-sidebar{
    grid-template-columns:1fr!important;
  }
}
@media(max-width:640px){
  .modal-backdrop,.settings-backdrop{padding:6px!important}
  .modal:has(.calendar-view-panel:not([hidden])){width:100%!important;max-height:calc(100dvh - 12px)!important}
  .modal:has(.calendar-view-panel:not([hidden])) .war-modal-header{min-height:88px!important;padding:14px 54px 12px 12px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-view-panel{padding:6px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-toolbar{padding:7px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-period{order:1!important;flex:1 1 100%!important;font-size:16px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-nav{order:2!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-view-switch{order:3!important;margin-left:auto!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-view-btn{min-width:58px!important;padding-inline:8px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-weekdays>div{font-size:8px!important;letter-spacing:.03em!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-month-grid.war-month-grid{grid-template-rows:repeat(6,64px)!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-day{padding:4px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-day-number{font-size:9px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-chip{height:20px!important;padding:2px 3px!important;grid-template-columns:10px minmax(0,1fr)!important;gap:2px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-chip-icon{font-size:8px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-chip-copy strong{font-size:7px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-chip-copy small{display:none!important}
}

/* ============================================================
   v77 — CALENDAR REDESIGN: MATCH THE APPROVED WARBOARD MOCKUP
   This block intentionally overrides all older calendar sizing rules.
   ============================================================ */
.modal:has(.calendar-view-panel:not([hidden])){
  width:min(1180px,calc(100vw - 56px))!important;
  max-width:1180px!important;
  height:auto!important;
  max-height:calc(100dvh - 40px)!important;
  padding:0!important;
  overflow:hidden!important;
  border:1px solid rgba(226,164,49,.72)!important;
  border-radius:10px!important;
  background:#071017!important;
  box-shadow:0 24px 80px rgba(0,0,0,.78)!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .war-modal-header{
  min-height:78px!important;
  height:78px!important;
  padding:14px 64px 14px 20px!important;
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  border-bottom:1px solid rgba(215,158,51,.42)!important;
  background:
    linear-gradient(90deg,rgba(5,13,19,.97) 0%,rgba(5,13,19,.90) 52%,rgba(5,13,19,.44) 100%),
    url('assets/citycap-bg.jpg') center 44% / cover no-repeat!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .war-modal-icon{
  flex:0 0 42px!important;width:42px!important;height:42px!important;border-radius:8px!important;
  display:grid!important;place-items:center!important;background:linear-gradient(145deg,#172630,#0a1218)!important;
  border:1px solid rgba(224,163,53,.42)!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .war-modal-heading{min-width:0!important}
.modal:has(.calendar-view-panel:not([hidden])) .modal-kicker{font-size:9px!important;letter-spacing:.17em!important;margin:0 0 2px!important;color:#e3aa3f!important}
.modal:has(.calendar-view-panel:not([hidden])) #modalTitle{font-size:23px!important;line-height:1!important;margin:0!important;color:#f0f4f6!important}
.modal:has(.calendar-view-panel:not([hidden])) #modalText{display:none!important}
.modal:has(.calendar-view-panel:not([hidden])) .modal-close{top:13px!important;right:14px!important;width:38px!important;height:38px!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-view-panel{
  margin:0!important;padding:14px!important;width:100%!important;max-width:100%!important;min-width:0!important;
  overflow:auto!important;max-height:calc(100dvh - 120px)!important;background:#061017!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-shell{
  width:100%!important;min-width:0!important;overflow:hidden!important;
  border:1px solid #233844!important;border-radius:7px!important;background:#071119!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-toolbar{
  display:grid!important;grid-template-columns:auto minmax(150px,1fr) auto 178px!important;
  grid-template-areas:"nav period views filter"!important;
  align-items:center!important;gap:10px!important;height:58px!important;min-height:58px!important;
  padding:9px 11px!important;background:#0a1821!important;border-bottom:1px solid #263a46!important;
  overflow:visible!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-nav{grid-area:nav!important;order:initial!important;display:flex!important;gap:5px!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-period{grid-area:period!important;order:initial!important;font-size:18px!important;line-height:1!important;color:#f4f6f7!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-view-switch{grid-area:views!important;order:initial!important;display:grid!important;grid-template-columns:repeat(3,72px)!important;padding:2px!important;border:1px solid #263c49!important;border-radius:6px!important;background:#061018!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-view-btn{height:36px!important;border:0!important;border-radius:5px!important;background:transparent!important;color:#b5c1c7!important;font-size:10px!important;font-weight:900!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-view-btn.is-active{background:linear-gradient(#ffc45b,#efa72d)!important;color:#171109!important;box-shadow:0 0 0 1px rgba(255,201,105,.45),0 0 12px rgba(233,163,42,.22)!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-filter{grid-area:filter!important;order:initial!important;width:178px!important;min-width:0!important;max-width:178px!important;height:40px!important;margin:0!important;padding:0 34px 0 12px!important;border-radius:6px!important;background:#07131b!important;border:1px solid #263c49!important;color:#dde5e9!important;font-size:10px!important;font-weight:800!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-nav-btn,
.modal:has(.calendar-view-panel:not([hidden])) .calendar-today-btn{height:38px!important;min-width:38px!important;border-radius:6px!important;border:1px solid #2a404d!important;background:#0b1922!important;color:#dce4e8!important;font-weight:900!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-today-btn{padding:0 11px!important}

/* Desktop: month/week board with command sidebar on the RIGHT, like the approved mockup. */
.modal:has(.calendar-view-panel:not([hidden])) .war-calendar-layout{
  display:grid!important;grid-template-columns:minmax(0,1fr) 205px!important;align-items:start!important;
  gap:0!important;width:100%!important;min-width:0!important;overflow:hidden!important;background:#071119!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-grid{order:initial!important;min-width:0!important;width:100%!important;overflow:hidden!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-command-sidebar{
  order:initial!important;display:flex!important;flex-direction:column!important;gap:8px!important;
  width:205px!important;min-width:205px!important;max-width:205px!important;padding:9px!important;
  border-left:1px solid #263a46!important;border-top:0!important;background:#061017!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-side-card{padding:9px!important;border:1px solid #263a46!important;border-radius:6px!important;background:#081720!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-side-title{font-size:9px!important;letter-spacing:.10em!important;color:#eef2f4!important;margin-bottom:7px!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-mini-grid{font-size:9px!important}

/* Month proportions: compact cards, not giant empty boxes. */
.modal:has(.calendar-view-panel:not([hidden])) .calendar-weekdays{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;height:31px!important;background:#071017!important;border-bottom:1px solid #213541!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-weekdays>div{height:31px!important;font-size:9px!important;letter-spacing:.10em!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-month-grid.war-month-grid{
  display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;
  grid-template-rows:repeat(6,76px)!important;min-width:0!important;width:100%!important;gap:1px!important;background:#20333e!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-day{padding:6px!important;min-width:0!important;overflow:hidden!important;background:linear-gradient(180deg,#07141c,#061018)!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-day-top{min-height:16px!important;margin-bottom:3px!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-day-number{font-size:10px!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-day.is-today .calendar-day-number{width:24px!important;height:24px!important;font-size:10px!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-day-events{gap:2px!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-chip{height:24px!important;grid-template-columns:14px minmax(0,1fr)!important;gap:3px!important;padding:2px 5px!important;border-radius:4px!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-chip-icon{font-size:9px!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-chip-copy strong{font-size:8px!important;line-height:1!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-chip-copy small{font-size:7px!important;line-height:1!important}
.modal:has(.calendar-view-panel:not([hidden])) .calendar-more{height:18px!important;font-size:8px!important;padding:0 5px!important}

/* Week: fit in the same board on normal desktop, internal scroll only when truly needed. */
.modal:has(.calendar-view-panel:not([hidden])) .calendar-grid:has(.war-week-board){overflow-x:hidden!important}
.modal:has(.calendar-view-panel:not([hidden])) .war-week-board{
  width:100%!important;min-width:0!important;max-width:100%!important;
  grid-template-columns:48px repeat(7,minmax(0,1fr))!important;grid-template-rows:38px 470px!important;
}
.modal:has(.calendar-view-panel:not([hidden])) .week-event-card{left:4px!important;right:4px!important;padding:4px!important;grid-template-columns:12px minmax(0,1fr)!important}
.modal:has(.calendar-view-panel:not([hidden])) .week-event-card strong{font-size:8px!important}
.modal:has(.calendar-view-panel:not([hidden])) .week-event-card small{font-size:7px!important}

/* Medium screens: retain right sidebar until it would make the month unusable. */
@media(max-width:980px){
  .modal:has(.calendar-view-panel:not([hidden])){width:calc(100vw - 24px)!important;max-width:none!important;max-height:calc(100dvh - 24px)!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-view-panel{max-height:calc(100dvh - 102px)!important;padding:10px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .war-calendar-layout{grid-template-columns:1fr!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-command-sidebar{
    width:100%!important;min-width:0!important;max-width:none!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
    border-left:0!important;border-top:1px solid #263a46!important;
  }
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-toolbar{grid-template-columns:auto minmax(120px,1fr) auto!important;grid-template-areas:"nav period views" "filter filter filter"!important;height:auto!important;min-height:0!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-filter{width:100%!important;max-width:none!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-month-grid.war-month-grid{grid-template-rows:repeat(6,72px)!important}
}

/* Phones/small tablets: zero overflow, useful month grid, sidebar stacked. */
@media(max-width:640px){
  .modal-backdrop,.settings-backdrop{padding:6px!important}
  .modal:has(.calendar-view-panel:not([hidden])){width:100%!important;max-height:calc(100dvh - 12px)!important;border-radius:7px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .war-modal-header{height:64px!important;min-height:64px!important;padding:9px 50px 9px 11px!important}
  .modal:has(.calendar-view-panel:not([hidden])) #modalTitle{font-size:18px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .war-modal-icon{width:36px!important;height:36px!important;flex-basis:36px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-view-panel{padding:6px!important;max-height:calc(100dvh - 76px)!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-toolbar{display:grid!important;grid-template-columns:auto 1fr!important;grid-template-areas:"nav period" "views views" "filter filter"!important;gap:6px!important;padding:7px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-view-switch{width:100%!important;grid-template-columns:repeat(3,1fr)!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-period{font-size:15px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-month-grid.war-month-grid{grid-template-rows:repeat(6,64px)!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-day{padding:3px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-day-number{font-size:9px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-chip{height:17px!important;padding:1px 2px!important;grid-template-columns:5px minmax(0,1fr)!important;border-radius:3px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-chip-icon{font-size:0!important}.modal:has(.calendar-view-panel:not([hidden])) .calendar-chip-icon::after{content:"";display:block;width:4px;height:4px;border-radius:50%;background:#f1b044}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-chip-copy strong{font-size:6.5px!important}.modal:has(.calendar-view-panel:not([hidden])) .calendar-chip-copy small{display:none!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-more{height:14px!important;font-size:6.5px!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-command-sidebar{grid-template-columns:1fr!important}
  .modal:has(.calendar-view-panel:not([hidden])) .calendar-grid:has(.war-week-board){overflow-x:auto!important}
  .modal:has(.calendar-view-panel:not([hidden])) .war-week-board{min-width:720px!important}
}

/* v78 — Calendar is a real dashboard page, never a popup */
.calendar-site-page[hidden]{display:none!important}
.calendar-site-page{
  position:absolute;
  left:15.15%;
  top:8.9%;
  right:0;
  bottom:0;
  z-index:24;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  color:#eef4f7;
  background:
    linear-gradient(180deg,rgba(4,12,18,.94),rgba(3,10,15,.985)),
    url('assets/citycap-bg.jpg') center/cover no-repeat;
  border-left:1px solid rgba(231,165,49,.35);
}
.calendar-page-header{
  flex:0 0 10.5%;
  min-height:70px;
  display:flex;
  align-items:center;
  padding:1.2% 2.1%;
  border-bottom:1px solid rgba(231,165,49,.45);
  background:linear-gradient(90deg,rgba(4,13,20,.98) 0%,rgba(5,15,22,.9) 58%,rgba(38,28,17,.68) 100%);
  box-shadow:inset 0 -1px rgba(255,255,255,.025);
}
.calendar-page-brand{display:flex;align-items:center;gap:1vw}
.calendar-page-icon{
  display:grid;place-items:center;width:3.2vw;height:3.2vw;min-width:34px;min-height:34px;
  border:1px solid rgba(234,170,55,.45);border-radius:.55vw;color:#ffba45;background:rgba(11,26,35,.88);
  font-size:1.35vw;font-weight:900;box-shadow:0 0 24px rgba(219,146,35,.08)
}
.calendar-page-brand span:not(.calendar-page-icon){display:block;color:#f0ad39;font-size:.62vw;line-height:1.15;font-weight:900;letter-spacing:.18em;text-transform:uppercase}
.calendar-page-brand h1{margin:.12vw 0 0;font-size:1.5vw;line-height:1;text-transform:uppercase;letter-spacing:.02em}
.calendar-page-brand p{margin:.28vw 0 0!important;color:#96a5b0!important;font-size:.68vw!important;line-height:1!important}
.calendar-site-page .calendar-shell{
  flex:1 1 auto;
  min-height:0;
  margin:1.25% 1.45% 1.35%!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border:1px solid rgba(183,128,38,.52)!important;
  border-radius:.55vw!important;
  background:rgba(4,14,20,.92)!important;
  box-shadow:0 10px 35px rgba(0,0,0,.3)!important;
}
.calendar-site-page .calendar-toolbar{
  flex:0 0 auto!important;
  min-height:8.6%!important;
  display:grid!important;
  grid-template-columns:auto minmax(145px,1fr) auto auto!important;
  grid-template-areas:'nav period switch filter'!important;
  align-items:center!important;
  gap:.8vw!important;
  padding:.8% 1.15%!important;
  border-bottom:1px solid rgba(148,171,188,.16)!important;
  background:rgba(8,24,33,.94)!important;
}
.calendar-site-page .calendar-nav{grid-area:nav!important;display:flex!important;gap:.34vw!important}
.calendar-site-page .calendar-period{grid-area:period!important;justify-self:start!important;font-size:1.05vw!important;white-space:nowrap!important}
.calendar-site-page .calendar-view-switch{grid-area:switch!important;display:flex!important;justify-self:end!important;gap:0!important;padding:.2vw!important;border:1px solid rgba(112,142,161,.25)!important;border-radius:.42vw!important;background:#06131b!important}
.calendar-site-page .calendar-view-btn{min-width:4.7vw!important;padding:.57vw .9vw!important;border-radius:.32vw!important;font-size:.67vw!important;font-weight:800!important}
.calendar-site-page .calendar-filter{grid-area:filter!important;width:8.9vw!important;min-width:110px!important;height:2.45vw!important;min-height:30px!important;font-size:.66vw!important}
.calendar-site-page .calendar-nav-btn,.calendar-site-page .calendar-today-btn{height:2.45vw!important;min-height:30px!important;font-size:.68vw!important}
.calendar-site-page .war-calendar-layout{
  flex:1 1 auto!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 15.2vw!important;
  gap:.7vw!important;
  padding:.7vw!important;
  overflow:hidden!important;
  background:rgba(2,9,14,.92)!important;
}
.calendar-site-page .calendar-grid{min-width:0!important;min-height:0!important;overflow:hidden!important;border-radius:.35vw!important}
.calendar-site-page .calendar-weekdays{height:2.35vw!important;min-height:28px!important;display:grid!important;grid-template-columns:repeat(7,1fr)!important;background:#07131b!important;border:1px solid rgba(109,138,156,.18)!important;border-bottom:0!important}
.calendar-site-page .calendar-weekdays>div{display:grid!important;place-items:center!important;color:#a7b7c2!important;font-size:.62vw!important;font-weight:900!important;letter-spacing:.12em!important}
.calendar-site-page .calendar-month-grid.war-month-grid{
  height:calc(100% - 2.35vw)!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:repeat(7,minmax(0,1fr))!important;
  grid-template-rows:repeat(6,minmax(0,1fr))!important;
  min-width:0!important;
  overflow:hidden!important;
  border-left:1px solid rgba(109,138,156,.18)!important;
  border-top:1px solid rgba(109,138,156,.18)!important;
}
.calendar-site-page .calendar-day{
  min-width:0!important;min-height:0!important;padding:.42vw!important;overflow:hidden!important;
  border-right:1px solid rgba(98,127,145,.2)!important;border-bottom:1px solid rgba(98,127,145,.2)!important;
  background:rgba(4,15,21,.82)!important;
}
.calendar-site-page .calendar-day.is-outside{background:rgba(19,36,45,.72)!important;opacity:.72!important}
.calendar-site-page .calendar-day.is-selected{background:linear-gradient(135deg,rgba(110,74,20,.34),rgba(30,25,15,.35))!important;box-shadow:inset 0 0 0 1px #d79b2f!important}
.calendar-site-page .calendar-day-number{font-size:.66vw!important;font-weight:800!important}
.calendar-site-page .calendar-day.is-today .calendar-day-number{width:1.55vw!important;height:1.55vw!important;min-width:18px!important;min-height:18px!important;display:grid!important;place-items:center!important;border-radius:50%!important;background:#f7b43f!important;color:#101214!important}
.calendar-site-page .calendar-day-events{gap:.22vw!important;margin-top:.28vw!important}
.calendar-site-page .calendar-chip{width:100%!important;min-height:1.72vw!important;padding:.28vw .4vw!important;border-radius:.28vw!important;overflow:hidden!important}
.calendar-site-page .calendar-chip-copy strong{font-size:.58vw!important;line-height:1.05!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.calendar-site-page .calendar-chip-copy small{font-size:.5vw!important;line-height:1.05!important}
.calendar-site-page .calendar-command-sidebar{display:flex!important;flex-direction:column!important;gap:.55vw!important;min-width:0!important;overflow:auto!important;padding-right:.1vw!important}
.calendar-site-page .calendar-side-card{padding:.72vw!important;border:1px solid rgba(96,128,147,.26)!important;border-radius:.4vw!important;background:rgba(5,18,25,.9)!important}
.calendar-site-page .calendar-side-title{font-size:.63vw!important;letter-spacing:.1em!important;margin-bottom:.45vw!important}
.calendar-site-page .calendar-mini-grid{font-size:.58vw!important}
.calendar-site-page .calendar-legend-row,.calendar-site-page .calendar-upcoming-row{font-size:.58vw!important;min-height:1.38vw!important}
.calendar-site-page .calendar-side-empty{font-size:.58vw!important;color:#78909e!important}
.calendar-site-page .event-detail{position:absolute!important;right:1.2vw!important;bottom:1.2vw!important;width:18vw!important;max-height:63%!important;z-index:3!important}
/* Week/list stay inside the same site content area. */
.calendar-site-page .calendar-grid:has(.week-calendar){overflow:auto!important}
.calendar-site-page .week-calendar{min-width:720px!important;height:100%!important}
.calendar-site-page .war-list-view{height:100%!important;overflow:auto!important}

/* The old modal-specific calendar presentation must never activate. */
.modal .calendar-site-page{display:none!important}

@media (max-width:900px){
  .calendar-page-brand h1{font-size:18px}.calendar-page-brand span:not(.calendar-page-icon){font-size:8px}.calendar-page-brand p{font-size:9px!important}
  .calendar-site-page .calendar-toolbar{grid-template-columns:auto 1fr!important;grid-template-areas:'nav period' 'switch filter'!important;row-gap:6px!important}
  .calendar-site-page .calendar-view-switch{justify-self:start!important}.calendar-site-page .calendar-filter{justify-self:end!important;width:140px!important}
  .calendar-site-page .war-calendar-layout{grid-template-columns:1fr!important;overflow:auto!important}
  .calendar-site-page .calendar-command-sidebar{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;overflow:visible!important}
  .calendar-site-page .calendar-month-grid.war-month-grid{min-width:680px!important}
  .calendar-site-page .calendar-weekdays{min-width:680px!important}
  .calendar-site-page .calendar-grid{overflow:auto!important}
}

/* =========================================================
   v79 — site-page rebuild + reference calendar layout
   No menu content is presented as a floating popup.
   ========================================================= */

/* Integrated site pages occupy the dashboard content area. */
.calendar-site-page,
.modal-backdrop,
.settings-backdrop {
  position: absolute !important;
  left: 15.15% !important;
  top: 7.25% !important;
  right: 0 !important;
  bottom: 0 !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  z-index: 45 !important;
  background: #061019 !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  overflow: auto !important;
}
.calendar-site-page[hidden], .modal-backdrop[hidden], .settings-backdrop[hidden] { display:none !important; }

/* Generic menu pages: full content canvas, not modal cards. */
.modal-backdrop,
.settings-backdrop {
  display: block !important;
  place-items: initial !important;
  padding: clamp(10px, .8vw, 16px) !important;
}
.modal,
.settings-panel {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  overflow: auto !important;
  border: 1px solid rgba(219,155,42,.72) !important;
  border-radius: 4px !important;
  color: #ecf1f5 !important;
  background:
    linear-gradient(90deg, rgba(4,14,21,.98) 0%, rgba(4,14,21,.95) 60%, rgba(4,14,21,.82) 100%),
    url('assets/citycap-bg.jpg') center right / cover no-repeat !important;
  box-shadow: none !important;
  padding: 0 clamp(14px,1.15vw,24px) clamp(16px,1.2vw,24px) !important;
}
.war-modal-header,
.settings-header {
  position: relative !important;
  top: auto !important;
  display:flex !important;
  align-items:center !important;
  min-height: clamp(72px, 6.2vw, 104px) !important;
  margin: 0 calc(clamp(14px,1.15vw,24px) * -1) clamp(12px,1vw,18px) !important;
  padding: clamp(12px,1vw,18px) clamp(18px,1.45vw,28px) !important;
  border-bottom: 1px solid rgba(219,155,42,.55) !important;
  background: linear-gradient(90deg,rgba(4,14,21,.97),rgba(5,17,25,.88),rgba(68,47,23,.38)) !important;
  backdrop-filter:none !important;
}
.war-modal-icon { width:48px !important; height:48px !important; min-width:48px !important; border:1px solid rgba(219,155,42,.55) !important; border-radius:7px !important; background:rgba(245,174,63,.08) !important; }
.war-modal-heading { min-width:0 !important; }
.modal-kicker { margin:0 0 3px !important; font-size:clamp(9px,.6vw,11px) !important; color:#efb340 !important; letter-spacing:.16em !important; }
.modal h2,.settings-header h2 { margin:0 !important; font-size:clamp(22px,1.55vw,30px) !important; line-height:1 !important; text-transform:uppercase !important; }
.modal .war-modal-heading > p,.settings-header p { margin:5px 0 0 !important; font-size:clamp(11px,.72vw,13px) !important; color:#8fa2af !important; }
.modal-close,.settings-close { display:none !important; }
.modal-primary { margin: clamp(12px,1vw,18px) 0 0 !important; }

/* Settings is also a normal content page. */
.settings-panel { display:block !important; }
.settings-tabs { position:sticky !important; top:0 !important; z-index:3 !important; }

/* Calendar page: directly mirrors the reference image structure. */
.calendar-site-page {
  padding: clamp(8px,.7vw,12px) !important;
  display:flex !important;
  flex-direction:column !important;
  gap: clamp(8px,.65vw,12px) !important;
  background:
    linear-gradient(rgba(3,11,17,.86),rgba(3,11,17,.93)),
    url('assets/citycap-bg.jpg') center / cover no-repeat !important;
}
.calendar-reference-board {
  flex: 0 0 auto;
  min-width:0;
  border:1px solid rgba(219,155,42,.62);
  border-radius:3px;
  background:rgba(4,15,22,.96);
  overflow:hidden;
}
.calendar-month-board { height: 56%; min-height: 330px; }
.calendar-week-board-section { height: 42%; min-height: 265px; }
.calendar-reference-header {
  height: clamp(46px,4.2vw,64px);
  display:grid;
  grid-template-columns:minmax(150px,.9fr) minmax(300px,1.55fr) minmax(430px,2.1fr);
  align-items:center;
  gap:clamp(8px,.7vw,14px);
  padding:0 clamp(10px,.8vw,15px);
  border-bottom:1px solid rgba(92,121,139,.28);
  background:linear-gradient(90deg,#07141c 0%,#081822 72%,#071219 100%);
}
.calendar-reference-title { display:flex; align-items:center; gap:10px; min-width:0; }
.calendar-reference-icon { width:30px; height:30px; display:grid; place-items:center; border:1px solid rgba(219,155,42,.55); border-radius:4px; color:#f7b43f; background:rgba(245,174,63,.08); font-size:16px; }
.calendar-reference-title strong { display:block; color:#f2b340; font-size:clamp(14px,1vw,18px); line-height:1.1; }
.calendar-reference-title small { display:block; margin-top:2px; color:#8fa0ac; font-size:clamp(8px,.55vw,10px); }
.calendar-reference-nav { display:flex; align-items:center; gap:5px; min-width:0; }
.calendar-period { margin-left:8px; color:#edf3f7; font-size:clamp(14px,1.05vw,19px); white-space:nowrap; }
.calendar-reference-actions { display:flex; align-items:center; justify-content:flex-end; gap:clamp(6px,.5vw,9px); min-width:0; }
.calendar-view-switch { display:flex !important; padding:2px !important; border:1px solid rgba(94,123,141,.34) !important; border-radius:4px !important; background:#06131b !important; overflow:hidden; }
.calendar-view-btn { min-width:clamp(48px,4.2vw,70px) !important; height:clamp(28px,2.15vw,34px) !important; padding:0 10px !important; border:0 !important; border-radius:3px !important; color:#aab8c2 !important; background:transparent !important; font-size:clamp(9px,.58vw,11px) !important; font-weight:800 !important; }
.calendar-view-btn.is-active { color:#111 !important; background:linear-gradient(#ffc65f,#e9a43a) !important; box-shadow:0 0 13px rgba(242,174,61,.24) !important; }
.calendar-nav-btn,.calendar-today-btn { height:clamp(28px,2.15vw,34px) !important; min-width:clamp(28px,2.15vw,34px) !important; padding:0 8px !important; border:1px solid rgba(96,126,145,.32) !important; border-radius:4px !important; color:#c9d3da !important; background:#0a1821 !important; font-size:clamp(9px,.6vw,11px) !important; font-weight:800 !important; }
.calendar-nav-btn.is-static,.calendar-today-btn.is-static { display:grid; place-items:center; }
.calendar-filter { width:clamp(116px,8.5vw,150px) !important; height:clamp(30px,2.2vw,35px) !important; padding:0 9px !important; border:1px solid rgba(96,126,145,.32) !important; border-radius:4px !important; color:#c9d3da !important; background:#07151e !important; font-size:clamp(9px,.58vw,11px) !important; }
.calendar-create-event { height:clamp(30px,2.25vw,36px); min-width:clamp(115px,9.5vw,155px); padding:0 14px; border:1px solid #c68625; border-radius:4px; color:#17110a; background:linear-gradient(#ffc65f,#e9a43a); font-size:clamp(9px,.6vw,11px); font-weight:900; cursor:pointer; }
.calendar-reference-body { height:calc(100% - clamp(46px,4.2vw,64px)); display:grid; grid-template-columns:minmax(0,1fr) clamp(180px,18.5%,240px); min-height:0; }
.calendar-grid { min-width:0 !important; min-height:0 !important; height:100% !important; overflow:hidden !important; border-radius:0 !important; }
.calendar-weekdays { height:clamp(24px,2vw,30px) !important; display:grid !important; grid-template-columns:repeat(7,1fr) !important; border:0 !important; border-bottom:1px solid rgba(86,115,132,.25) !important; background:#06121a !important; }
.calendar-weekdays>div { display:grid !important; place-items:center !important; color:#a7b5bf !important; font-size:clamp(8px,.52vw,10px) !important; font-weight:900 !important; letter-spacing:.08em !important; }
.calendar-month-grid.war-month-grid { height:calc(100% - clamp(24px,2vw,30px)) !important; display:grid !important; grid-template-columns:repeat(7,minmax(0,1fr)) !important; grid-template-rows:repeat(6,minmax(0,1fr)) !important; min-width:0 !important; min-height:0 !important; }
.calendar-day { position:relative !important; min-width:0 !important; min-height:0 !important; padding:clamp(3px,.28vw,5px) !important; border-right:1px solid rgba(73,100,116,.22) !important; border-bottom:1px solid rgba(73,100,116,.22) !important; background:#06131b !important; overflow:hidden !important; }
.calendar-day:nth-child(7n){border-right:0!important}
.calendar-day.is-outside { background:#10212a !important; opacity:.72 !important; }
.calendar-day.is-selected { background:linear-gradient(135deg,rgba(123,84,23,.36),rgba(24,24,17,.42)) !important; box-shadow:inset 0 0 0 1px #d69b2e !important; }
.calendar-day-top { display:flex; justify-content:flex-end; align-items:center; gap:4px; height:18px; }
.calendar-day-number { color:#c0ccd4; font-size:clamp(8px,.55vw,10px) !important; font-weight:800 !important; }
.calendar-day-count { color:#8294a1; font-size:8px !important; }
.calendar-day.is-today .calendar-day-number { width:clamp(18px,1.45vw,23px) !important; height:clamp(18px,1.45vw,23px) !important; display:grid !important; place-items:center !important; border-radius:50% !important; background:#f6b33f !important; color:#111 !important; }
.calendar-day-events { display:grid !important; gap:2px !important; margin-top:1px !important; }
.calendar-chip { min-height:clamp(18px,1.4vw,23px) !important; padding:2px 5px !important; border-radius:3px !important; display:flex !important; align-items:center !important; gap:4px !important; overflow:hidden !important; }
.calendar-chip-icon { font-size:10px !important; }
.calendar-chip-copy { min-width:0 !important; }
.calendar-chip-copy strong { display:block !important; max-width:100% !important; font-size:clamp(7px,.47vw,9px) !important; line-height:1 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }
.calendar-chip-copy small { display:block !important; margin-top:1px !important; font-size:clamp(6px,.4vw,8px) !important; line-height:1 !important; }
.calendar-more { height:16px !important; padding:0 5px !important; font-size:7px !important; }
.calendar-command-sidebar { min-width:0 !important; min-height:0 !important; display:flex !important; flex-direction:column !important; gap:5px !important; padding:7px !important; overflow:hidden !important; border-left:1px solid rgba(91,120,138,.28) !important; background:#07141c !important; }
.calendar-side-card { min-height:0 !important; padding:7px !important; border:1px solid rgba(94,124,142,.26) !important; border-radius:3px !important; background:#081923 !important; }
.calendar-mini-card { flex:0 0 40%; }
.calendar-upcoming-card { flex:1 1 auto; overflow:hidden; }
.calendar-side-title { margin:0 0 5px !important; color:#f1f4f6 !important; font-size:clamp(8px,.52vw,10px) !important; letter-spacing:.08em !important; font-weight:900 !important; }
.calendar-mini-grid { font-size:clamp(7px,.46vw,9px) !important; }
.mini-weekdays,.mini-days { gap:0 !important; }
.mini-day { min-height:16px !important; font-size:clamp(7px,.43vw,8px) !important; }
.calendar-legend-row,.calendar-upcoming-row { min-height:18px !important; font-size:clamp(7px,.44vw,9px) !important; }
.calendar-upcoming-row { grid-template-columns:34px 31px 1fr 10px !important; padding:2px 0 !important; }
.calendar-side-empty { font-size:clamp(7px,.44vw,9px) !important; }

/* Week section, always visible as in the reference. */
.calendar-week-reference-header { grid-template-columns:minmax(150px,.9fr) minmax(300px,1.55fr) minmax(430px,2.1fr); }
.calendar-week-reference-body { height:calc(100% - clamp(46px,4.2vw,64px)); display:grid; grid-template-columns:minmax(0,1fr) clamp(190px,20%,260px); min-height:0; }
.calendar-week-overview { min-width:0; min-height:0; overflow:hidden; }
.calendar-week-reference-grid { height:100%; display:grid; grid-template-columns:clamp(36px,3.1vw,48px) repeat(7,minmax(0,1fr)); grid-template-rows:clamp(25px,2vw,30px) 1fr; background:#06131b; }
.calendar-week-reference-grid .week-time-head { grid-column:1; grid-row:1; border-right:1px solid rgba(75,103,119,.24); border-bottom:1px solid rgba(75,103,119,.24); }
.calendar-week-reference-grid .war-week-head { grid-row:1; display:flex; align-items:center; justify-content:center; gap:4px; border-right:1px solid rgba(75,103,119,.24); border-bottom:1px solid rgba(75,103,119,.24); color:#b8c5cd; font-size:clamp(7px,.48vw,9px); }
.calendar-week-reference-grid .war-week-head.is-today { color:#f0b13e; background:rgba(133,90,23,.18); }
.calendar-week-reference-grid .week-time-axis { grid-column:1; grid-row:2; position:relative; border-right:1px solid rgba(75,103,119,.24); }
.calendar-week-reference-grid .week-time-axis span { position:absolute; right:5px; transform:translateY(-50%); color:#8fa1ad; font-size:clamp(7px,.43vw,8px); }
.calendar-week-reference-grid .war-week-day { grid-row:2; position:relative; border-right:1px solid rgba(75,103,119,.24); background:linear-gradient(180deg,rgba(7,19,27,.98),rgba(5,15,22,.98)); overflow:hidden; }
.calendar-week-reference-grid .war-week-day.is-today { background:linear-gradient(180deg,rgba(109,75,24,.28),rgba(43,34,19,.28)); box-shadow:inset 1px 0 #d3972b,inset -1px 0 #d3972b; }
.calendar-week-reference-grid .week-grid-line { position:absolute; left:0; right:0; height:1px; background:rgba(74,101,117,.22); }
.calendar-week-reference-grid .week-event-card { position:absolute; left:5%; width:90%; min-height:24px; display:grid; grid-template-columns:14px 1fr; grid-template-rows:1fr 1fr; align-items:center; padding:3px 5px; border:1px solid currentColor; border-radius:3px; color:#e6eef3; text-align:left; overflow:hidden; }
.calendar-week-reference-grid .week-event-card>span { grid-row:1/3; font-size:10px; }
.calendar-week-reference-grid .week-event-card strong { font-size:clamp(7px,.46vw,9px); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.calendar-week-reference-grid .week-event-card small { font-size:clamp(6px,.4vw,8px); }
.calendar-week-detail { position:relative !important; inset:auto !important; width:auto !important; max-height:none !important; height:100% !important; margin:0 !important; padding:clamp(10px,.75vw,14px) !important; border:0 !important; border-left:1px solid rgba(91,120,138,.28) !important; border-radius:0 !important; background:
 linear-gradient(rgba(4,15,22,.84),rgba(4,15,22,.96)), url('assets/citycap-bg.jpg') center / cover no-repeat !important; overflow:auto !important; }
.calendar-week-detail .event-detail-close { display:none !important; }
.calendar-week-detail h3 { margin:4px 0 6px !important; font-size:clamp(15px,1vw,19px) !important; }
.calendar-week-detail .event-detail-kicker { color:#f1b23e !important; font-size:clamp(8px,.5vw,10px) !important; }
.calendar-week-detail .event-detail-meta,.calendar-week-detail p { font-size:clamp(8px,.5vw,10px) !important; line-height:1.35 !important; }

/* Keep function content compact and board-like. */
.city-cap-composer,.event-composer,.announcement-composer,.activity-log-view,#modalText { max-width:none !important; width:100% !important; }
.composer-grid,.reminder-box,.planned-caps,.activity-log-view { border-radius:4px !important; }

/* Site-page responsiveness. No horizontal page overflow. */
@media (max-width: 1150px), (max-aspect-ratio: 1.35/1) {
  .calendar-site-page,.modal-backdrop,.settings-backdrop { left:15.15% !important; }
  .calendar-reference-header,.calendar-week-reference-header { grid-template-columns:1fr auto; grid-template-areas:'title actions' 'nav nav'; height:auto; min-height:82px; padding:7px 9px; row-gap:5px; }
  .calendar-reference-title{grid-area:title}.calendar-reference-nav{grid-area:nav}.calendar-reference-actions{grid-area:actions}
  .calendar-create-event { display:none; }
  .calendar-reference-body { grid-template-columns:minmax(0,1fr) 175px; }
  .calendar-week-reference-body { grid-template-columns:minmax(620px,1fr) 190px; overflow:auto; }
  .calendar-month-board{min-height:360px}.calendar-week-board-section{min-height:300px}
}
@media (max-width: 760px) {
  html,body{overflow:auto!important}
  .viewport{height:auto!important;min-height:100vh!important;place-items:start center!important}
  .stage{width:100vw!important;height:auto!important;min-height:100vh!important;aspect-ratio:auto!important;overflow:visible!important;background:#061019!important}
  .dashboard-image{position:fixed!important;width:100vw!important;height:auto!important;min-height:100vh!important;object-fit:cover!important;opacity:.45!important}
  .calendar-site-page,.modal-backdrop,.settings-backdrop { position:fixed !important; left:0!important; top:0!important; right:0!important; bottom:0!important; width:100vw!important; height:100dvh!important; min-height:100vh!important; padding:8px!important; margin:0!important; z-index:60!important; overflow-y:auto!important; overflow-x:hidden!important; overscroll-behavior:contain!important; -webkit-overflow-scrolling:touch!important; }
  .calendar-site-page { gap:8px!important; }
  .calendar-month-board,.calendar-week-board-section { height:auto!important; min-height:0!important; }
  .calendar-reference-header,.calendar-week-reference-header { display:flex!important; flex-wrap:wrap!important; height:auto!important; min-height:0!important; }
  .calendar-reference-title{width:100%}.calendar-reference-nav{order:2;flex:1 1 100%}.calendar-reference-actions{order:3;flex:1 1 100%;justify-content:flex-start!important;flex-wrap:wrap}
  .calendar-reference-body { height:auto!important; display:block!important; }
  .calendar-grid { height:auto!important; overflow:auto!important; }
  .calendar-weekdays,.calendar-month-grid.war-month-grid { min-width:650px!important; }
  .calendar-month-grid.war-month-grid { height:430px!important; }
  .calendar-command-sidebar { display:grid!important; grid-template-columns:1fr!important; border-left:0!important; border-top:1px solid rgba(91,120,138,.28)!important; }
  .calendar-mini-card{display:none!important}
  .calendar-week-reference-body { height:auto!important; display:block!important; overflow:visible!important; }
  .calendar-week-overview { overflow:auto!important; }
  .calendar-week-reference-grid { min-width:720px!important; height:360px!important; }
  .calendar-week-detail { min-height:180px!important; border-left:0!important; border-top:1px solid rgba(91,120,138,.28)!important; }
  .modal,.settings-panel { min-height:calc(100vh - 16px)!important; }
}
@media (min-width:1160px) and (min-aspect-ratio:1.36/1){
  .calendar-month-board{height:auto!important;min-height:0!important;flex:1.18 1 0!important}
  .calendar-week-board-section{height:auto!important;min-height:0!important;flex:.82 1 0!important}
}
.calendar-site-page .calendar-week-detail {
  position: relative !important;
  left:auto !important; right:auto !important; top:auto !important; bottom:auto !important;
  width:auto !important; max-width:none !important; min-width:0 !important;
  height:100% !important; max-height:none !important;
  transform:none !important;
}
.calendar-week-reference-grid .war-week-day { grid-row:2 !important; }
.calendar-reference-actions .calendar-view-switch{order:1!important}
.calendar-reference-actions .calendar-filter{order:2!important}
.calendar-reference-actions .calendar-create-event{order:3!important}
.announcement-composer .composer-grid{padding-top:46px!important}


/* v80 — exact requested cleanup: reference banner + reliable page-top reset support. */
.warboard-top-banner{
  position:absolute!important;
  inset:0 0 auto 0!important;
  width:100%!important;
  height:7.25%!important;
  min-height:52px!important;
  object-fit:cover!important;
  object-position:center top!important;
  z-index:14!important;
  pointer-events:none!important;
  display:block!important;
  border-bottom:1px solid rgba(218,151,45,.68)!important;
  box-shadow:0 5px 18px rgba(0,0,0,.34)!important;
}
/* Keep live controls usable above the visual banner. */
.notification-bell,.topbar-profile-live{z-index:19!important}
/* The calendar page contains one board only; no duplicate week board below it. */
.calendar-week-board-section{display:none!important}
.calendar-site-page{align-content:start!important}
@media (max-width:700px){
  .warboard-top-banner{height:64px!important;min-height:64px!important}
}

/* v82 — Calendar layout: full-width calendar with command info underneath. */
.calendar-site-page .calendar-reference-body {
  height: calc(100% - clamp(46px,4.2vw,64px)) !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) !important;
  grid-template-rows: minmax(0,1fr) auto !important;
  min-height: 0 !important;
}

.calendar-site-page .calendar-grid {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 100% !important;
  min-width: 0 !important;
}

.calendar-site-page .calendar-command-sidebar {
  grid-column: 1 !important;
  grid-row: 2 !important;
  display: grid !important;
  grid-template-columns: minmax(190px,.8fr) minmax(220px,.9fr) minmax(300px,1.45fr) !important;
  gap: 7px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 7px !important;
  overflow: visible !important;
  border-left: 0 !important;
  border-top: 1px solid rgba(91,120,138,.28) !important;
  background: #07141c !important;
}

.calendar-site-page .calendar-side-card {
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
}

.calendar-site-page .calendar-mini-card,
.calendar-site-page .calendar-upcoming-card {
  flex: none !important;
  overflow: hidden !important;
}

.calendar-site-page .calendar-upcoming-list {
  max-height: 92px !important;
  overflow: auto !important;
}

@media (max-width: 1150px), (max-aspect-ratio: 1.35/1) {
  .calendar-site-page .calendar-reference-body {
    grid-template-columns: minmax(0,1fr) !important;
  }
  .calendar-site-page .calendar-command-sidebar {
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  }
}

@media (max-width: 760px) {
  .calendar-site-page .calendar-reference-body {
    display: block !important;
    height: auto !important;
  }
  .calendar-site-page .calendar-command-sidebar {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    border-left: 0 !important;
    border-top: 1px solid rgba(91,120,138,.28) !important;
  }
  .calendar-site-page .calendar-mini-card {
    display: block !important;
  }
  .calendar-site-page .calendar-upcoming-list {
    max-height: none !important;
  }
}

/* v83 — Alliance Duel command card + operational quick actions. */
.ad-command-hotspot,
.hotspot[data-action="diplomacy"]{z-index:8}

.ad-command-card-skin{
  left:54.45%!important;
  top:33.7%!important;
  width:18.15%!important;
  height:28.4%!important;
  border:1px solid rgba(229,165,56,.5)!important;
  background:
    radial-gradient(circle at 76% 16%,rgba(255,203,96,.19),transparent 25%),
    linear-gradient(155deg,rgba(103,64,15,.98),rgba(49,29,9,.98) 46%,rgba(17,13,10,.99) 100%)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.035),inset 0 -8vw 8vw rgba(0,0,0,.48),0 0 .8vw rgba(0,0,0,.35)!important;
}
.ad-command-card-skin::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,187,68,.08),transparent 45%),repeating-linear-gradient(90deg,rgba(255,255,255,.012) 0 1px,transparent 1px 18px);
}
.ad-command-card-skin .daily-focus-card-icon{right:8%;top:8%;font-size:clamp(44px,4.7vw,86px);opacity:.9}
.ad-card-copy{position:absolute;z-index:3;left:8%;right:7%;bottom:7%;display:flex;flex-direction:column;gap:.34vw;color:#fff;text-shadow:0 1px 2px #000}
.ad-card-copy small{font-size:clamp(6px,.52vw,10px);font-weight:900;letter-spacing:.18em;color:#e7ad43}
.ad-card-copy>strong{font-size:clamp(13px,1.08vw,21px);line-height:1.05;letter-spacing:.02em}
.ad-card-copy>span{font-size:clamp(7px,.64vw,12px);color:#d6dde4;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ad-card-copy .ad-week-badge{align-self:flex-start;padding:.22em .55em;border:1px solid rgba(244,181,71,.45);border-radius:999px;background:rgba(20,12,5,.56);color:#ffd276;font-weight:900;letter-spacing:.06em}
.daily-focus-overlay[hidden]{display:none!important}

.diplomacy-card-skin{
  position:absolute;z-index:7;pointer-events:none;overflow:hidden;
  left:35.45%;top:48.45%;width:18.15%;height:13.65%;border-radius:.42vw;
  border:1px solid rgba(158,129,255,.28);
  background:radial-gradient(circle at 74% 23%,rgba(205,181,255,.18),transparent 28%),linear-gradient(135deg,#241c49,#4a347a 58%,#1d1737);
  box-shadow:inset 0 -3vw 4vw rgba(0,0,0,.44),inset 0 0 0 1px rgba(255,255,255,.04);
  color:#fff;text-shadow:0 1px 2px #000;
}
.diplomacy-card-skin .diplomacy-icon{position:absolute;right:9%;top:16%;font-size:clamp(34px,3.8vw,68px);opacity:.9;filter:drop-shadow(0 .25vw .3vw rgba(0,0,0,.6))}
.diplomacy-card-skin strong{position:absolute;left:8%;bottom:25%;font-size:clamp(11px,1vw,19px);letter-spacing:.02em}
.diplomacy-card-skin>span:last-child{position:absolute;left:8%;right:7%;bottom:10%;font-size:clamp(7px,.63vw,12px);color:#d7d8e6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Add Event: keep section title clearly above first field row. */
.event-composer .composer-grid{padding-top:54px!important}
.event-composer .composer-grid::before{top:14px!important;left:16px!important;margin:0!important;padding:0 0 10px!important;right:16px!important}

/* Alliance Duel command page. */
.modal:has(.ad-command-view){width:min(1380px,96vw)!important;max-width:none!important;max-height:94vh!important;overflow:auto!important}
.ad-command-view{display:grid;gap:14px;color:#dbe4ea}
.ad-week-control,.ad-day-card,.war-alert-command,.diplomacy-command{border:1px solid rgba(90,119,136,.3);border-radius:9px;background:linear-gradient(180deg,rgba(12,28,38,.96),rgba(6,17,24,.96));box-shadow:0 10px 28px rgba(0,0,0,.18)}
.ad-week-control{display:grid;grid-template-columns:minmax(230px,.72fr) minmax(420px,1.28fr);gap:18px;padding:16px;border-color:rgba(229,165,56,.35);background:linear-gradient(135deg,rgba(54,35,10,.94),rgba(11,25,34,.97) 54%)}
.ad-week-control small{display:block;color:#e8ae43;font-size:10px;font-weight:950;letter-spacing:.16em;margin-bottom:4px}
.ad-week-control>div>strong{display:block;color:#ffd171;font-size:22px;margin-bottom:5px}
.ad-week-control p{margin:0!important;color:#aebbc4!important;font-size:12px!important}
.ad-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.ad-form-grid label,.war-alert-command>label{display:grid;gap:6px;color:#aebdc6;font-size:10px;font-weight:850}
.ad-form-grid .full{grid-column:1/-1}
.ad-form-grid textarea,.war-alert-command textarea{min-height:76px!important;resize:vertical}
.ad-day-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.ad-day-card{padding:14px;min-width:0}
.ad-day-card header{display:flex;gap:11px;align-items:flex-start;padding-bottom:10px;border-bottom:1px solid rgba(103,130,146,.22)}
.ad-day-card header>span{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border:1px solid rgba(244,181,71,.28);border-radius:8px;background:rgba(244,181,71,.08);font-size:21px}
.ad-day-card header strong{display:block;color:#f5c567;font-size:13px;letter-spacing:.03em}
.ad-day-card header p{margin:4px 0 0!important;color:#a9b6bf!important;font-size:11px!important;line-height:1.45!important}
.ad-day-card>ul,.ad-extra ul{margin:10px 0 0;padding-left:18px;color:#d4dde3;font-size:11px;line-height:1.55}
.ad-day-card li+li{margin-top:3px}
.ad-extra{margin-top:10px;padding-top:10px;border-top:1px solid rgba(103,130,146,.18)}
.ad-extra>strong{color:#9ed2ed;font-size:11px}
.ad-command-inline{margin-top:12px;padding:12px;border:1px solid rgba(244,181,71,.24);border-radius:7px;background:rgba(244,181,71,.045)}
.ad-command-inline>strong{display:block;margin-bottom:10px;color:#ffd171;font-size:11px;letter-spacing:.1em}
.ad-readonly-note{padding:11px 13px;border:1px solid rgba(104,134,151,.24);border-radius:7px;background:rgba(8,19,26,.86);color:#9fb0bb;font-size:11px}
.war-alert-command,.diplomacy-command{padding:16px;display:grid;gap:14px}
.war-alert-banner,.diplomacy-head{display:flex;flex-direction:column;gap:5px;padding:14px;border-radius:7px}
.war-alert-banner{border:1px solid rgba(255,82,72,.38);background:linear-gradient(135deg,rgba(91,18,17,.82),rgba(34,13,13,.7))}
.war-alert-banner strong{color:#ff8d82;font-size:20px;letter-spacing:.06em}
.war-alert-banner span,.diplomacy-head span{color:#b8c3ca;font-size:12px}
.diplomacy-head{border:1px solid rgba(168,139,255,.3);background:linear-gradient(135deg,rgba(46,34,91,.78),rgba(18,18,38,.7))}
.diplomacy-head strong{color:#d8c5ff;font-size:20px}

@media(max-width:900px){
  .ad-week-control,.ad-day-grid{grid-template-columns:1fr}
  .ad-form-grid{grid-template-columns:1fr}
  .ad-form-grid .full{grid-column:auto}
}

/* v84 — AOW support center */
.aow-command-center{border:1px solid rgba(229,165,56,.42);border-radius:10px;background:linear-gradient(145deg,rgba(22,31,38,.98),rgba(7,17,24,.98));overflow:hidden;box-shadow:0 12px 34px rgba(0,0,0,.22)}
.aow-command-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding:16px 18px;border-bottom:1px solid rgba(244,181,71,.2);background:linear-gradient(90deg,rgba(91,54,10,.23),rgba(10,25,34,.1))}
.aow-command-head small{display:block;color:#e8ae43;font-size:10px;font-weight:950;letter-spacing:.16em;margin-bottom:4px}
.aow-command-head strong{display:block;color:#ffd171;font-size:20px;letter-spacing:.035em}
.aow-command-head p{margin:5px 0 0!important;max-width:760px;color:#aebbc4!important;font-size:11px!important;line-height:1.45!important}
.aow-phase-badge{flex:0 0 auto;padding:8px 11px;border:1px solid rgba(244,181,71,.3);border-radius:999px;background:rgba(244,181,71,.08);color:#f7c45d;font-size:10px;font-weight:950;letter-spacing:.08em;text-align:center}
.aow-rule-strip{display:flex;gap:7px;flex-wrap:wrap;padding:10px 18px;border-bottom:1px solid rgba(103,130,146,.18);background:rgba(3,12,18,.48)}
.aow-rule-strip span{padding:5px 8px;border:1px solid rgba(102,139,160,.2);border-radius:5px;background:rgba(14,31,41,.72);color:#b7c5ce;font-size:9px;font-weight:800}
.aow-support-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:12px}
.aow-support-card{min-width:0;padding:12px;border:1px solid rgba(94,125,143,.28);border-radius:8px;background:rgba(8,21,29,.9)}
.aow-support-card h3{margin:0 0 10px;color:#f1bf60;font-size:11px;letter-spacing:.08em}
.aow-support-card .ad-form-grid{grid-template-columns:1fr}
.aow-support-card .full{grid-column:auto}
.aow-help{margin:9px 0 0!important;color:#8599a5!important;font-size:9.5px!important;line-height:1.45!important}
.aow-time-pair{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px}.aow-time-pair span{color:#718996;font-size:9px;text-transform:uppercase}
.aow-countdown{margin-top:10px;padding:8px 9px;border-left:2px solid #dca43e;background:rgba(244,181,71,.055);color:#9fb1bc;font-size:9.5px;line-height:1.45}.aow-countdown strong{color:#ffd171}
.aow-ops-note{margin:0 12px 12px;padding:10px 12px;border:1px solid rgba(84,124,147,.25);border-radius:7px;background:rgba(8,20,28,.75);color:#aebcc5;font-size:10px;line-height:1.5}.aow-ops-note strong{color:#9ed2ed}
.aow-publish-row{display:grid;grid-template-columns:1fr auto;gap:8px 12px;align-items:center;padding:12px 14px;border-top:1px solid rgba(244,181,71,.18);background:rgba(42,27,8,.22)}
.aow-publish-row label{color:#aab9c2;font-size:10px}.aow-publish-row button{border:1px solid #b47b20;border-radius:6px;background:linear-gradient(#f2b94f,#d99427);color:#111;font-weight:950;font-size:10px;letter-spacing:.05em;padding:9px 13px;cursor:pointer}.aow-publish-row button:disabled{opacity:.6;cursor:wait}.aow-publish-row span{grid-column:1/-1;color:#98b6c5;font-size:10px}
.aow-linked-note{display:flex;flex-direction:column;gap:3px;margin-top:11px;padding:9px 10px;border:1px solid rgba(83,143,176,.25);border-radius:6px;background:rgba(36,88,117,.08)}.aow-linked-note strong{color:#9ed2ed;font-size:10px}.aow-linked-note span{color:#9aaab4;font-size:9.5px;line-height:1.4}
@media(max-width:1120px){.aow-support-grid{grid-template-columns:1fr}.aow-support-card .ad-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.aow-support-card .full{grid-column:1/-1}}
@media(max-width:720px){.aow-command-head{flex-direction:column}.aow-support-card .ad-form-grid{grid-template-columns:1fr}.aow-support-card .full{grid-column:auto}.aow-publish-row{grid-template-columns:1fr}.aow-publish-row button{width:100%}.aow-time-pair{grid-template-columns:1fr auto 1fr}}

/* v85 — AOW Tuesday declaration assistant */
.aow-declare-assistant{margin:12px;border:1px solid rgba(255,187,66,.38);border-radius:9px;background:linear-gradient(135deg,rgba(65,42,8,.36),rgba(7,20,28,.92));overflow:hidden}
.aow-declare-top{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:14px 15px;border-bottom:1px solid rgba(244,181,71,.18)}
.aow-declare-top small,.aow-capture-card small{display:block;color:#e6aa3f;font-size:9px;font-weight:950;letter-spacing:.14em}.aow-declare-top strong,.aow-capture-card strong{display:block;margin-top:3px;color:#ffd270;font-size:15px}.aow-declare-top p,.aow-capture-card p{margin:4px 0 0!important;color:#99aab4!important;font-size:9.5px!important;line-height:1.4!important}
.aow-declare-ticker{min-width:210px;padding:10px 12px;border:1px solid rgba(112,144,162,.3);border-radius:7px;background:rgba(5,14,20,.86);text-align:center}.aow-declare-ticker strong{display:block;font-size:14px;letter-spacing:.08em}.aow-declare-ticker span{display:block;margin-top:3px;color:#a7b6bf;font-size:9px;line-height:1.35}.aow-declare-ticker[data-tone="now"]{border-color:rgba(255,74,63,.65);background:rgba(91,14,10,.72);box-shadow:0 0 22px rgba(255,54,42,.16)}.aow-declare-ticker[data-tone="now"] strong{color:#ff7d72}.aow-declare-ticker[data-tone="ready"] strong{color:#ffd469}.aow-declare-ticker[data-tone="done"] strong{color:#83dfa9}.aow-declare-ticker[data-tone="wait"] strong{color:#9ed2ed}.aow-declare-ticker[data-tone="idle"] strong{color:#c1cbd1}
.aow-target-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;padding:12px 14px}.aow-target-grid label,.aow-capture-grid label{display:flex;flex-direction:column;gap:5px;color:#cbd5db;font-size:9px;font-weight:850}.aow-target-grid .full{grid-column:1/-1}
.aow-click-order{display:flex;gap:7px;flex-wrap:wrap;align-items:center;padding:0 14px 13px}.aow-click-order strong{color:#ffca63;font-size:9px;letter-spacing:.08em}.aow-click-order span{padding:5px 7px;border:1px solid rgba(101,133,151,.22);border-radius:5px;background:rgba(8,22,30,.82);color:#aabac3;font-size:8.5px}
.aow-capture-card{margin:0 12px 12px;padding:12px;border:1px solid rgba(101,133,151,.26);border-radius:8px;background:rgba(6,16,23,.78)}.aow-capture-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:10px}.aow-capture-grid textarea{min-height:92px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:9px}
@media(max-width:900px){.aow-target-grid{grid-template-columns:1fr 1fr}.aow-declare-top{align-items:flex-start;flex-direction:column}.aow-declare-ticker{width:100%;box-sizing:border-box}.aow-capture-grid{grid-template-columns:1fr}}
@media(max-width:620px){.aow-target-grid{grid-template-columns:1fr}.aow-target-grid .full{grid-column:auto}}

/* v86 — Diplomacy register */
.modal:has(.diplomacy-layout){width:min(1360px,95vw)!important;max-width:none!important}
.diplomacy-layout{display:grid;grid-template-columns:minmax(360px,.78fr) minmax(460px,1.22fr);gap:18px;align-items:start}
.diplomacy-register{min-height:100%;border:1px solid rgba(112,93,180,.34);border-radius:10px;overflow:hidden;background:linear-gradient(180deg,rgba(11,23,31,.97),rgba(5,14,20,.98));box-shadow:0 18px 40px rgba(0,0,0,.24)}
.diplomacy-register-head{display:flex;align-items:center;justify-content:space-between;padding:15px 17px;border-bottom:1px solid rgba(154,126,235,.2);background:radial-gradient(circle at 85% 0%,rgba(114,82,202,.22),transparent 44%),linear-gradient(135deg,rgba(42,31,79,.68),rgba(10,22,30,.92))}
.diplomacy-register-head small{display:block;color:#a992ef;font-size:9px;font-weight:950;letter-spacing:.16em}
.diplomacy-register-head strong{display:block;color:#efe8ff;font-size:19px;letter-spacing:.04em;margin-top:3px}
.diplomacy-register-head>span{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(196,168,255,.35);border-radius:50%;background:rgba(94,64,167,.24);color:#f0e6ff;font-weight:950}
.diplomacy-cards{display:grid;gap:11px;padding:13px}
.diplomacy-agreement-card{position:relative;overflow:hidden;padding:13px;border:1px solid rgba(117,97,188,.34);border-radius:9px;background:radial-gradient(circle at 88% 18%,rgba(147,113,244,.2),transparent 34%),linear-gradient(135deg,rgba(39,31,76,.82),rgba(9,23,31,.96) 60%);box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 10px 24px rgba(0,0,0,.16)}
.diplomacy-agreement-card::after{content:'⚜';position:absolute;right:14px;bottom:-13px;font-size:64px;opacity:.055;pointer-events:none}
.dip-card-top{display:flex;align-items:center;gap:10px}.dip-emblem{font-size:27px;filter:drop-shadow(0 3px 5px rgba(0,0,0,.45))}.dip-card-top>div{min-width:0;flex:1}.dip-card-top strong{display:block;color:#fff;font-size:14px}.dip-card-top small{display:block;color:#c8b7f4;font-size:10px;margin-top:2px}.dip-status{padding:4px 7px;border:1px solid rgba(114,206,157,.36);border-radius:999px;background:rgba(55,139,94,.14);color:#8ed9ad;font-size:8px;font-weight:950;text-transform:uppercase;letter-spacing:.08em}
.diplomacy-agreement-card p{margin:10px 0 11px!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#c7d0d6!important;font-size:10.5px!important;line-height:1.45!important}
.dip-card-foot{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.dip-meta{margin-right:auto;color:#8499a7;font-size:9px}.dip-card-foot button{border:1px solid rgba(137,116,203,.34);border-radius:5px;background:rgba(33,28,61,.72);color:#d9cff7;font-size:8.5px;font-weight:850;padding:5px 7px;cursor:pointer}.dip-card-foot button:hover{background:rgba(68,50,116,.92)}.dip-card-foot .dip-delete{border-color:rgba(203,89,89,.35);color:#ffaaa4}.dip-card-foot .dip-close{border-color:rgba(218,171,77,.34);color:#f0c979}
.diplomacy-detail{margin:0 13px 13px;padding:13px;border:1px solid rgba(110,91,178,.3);border-radius:8px;background:linear-gradient(135deg,rgba(32,25,60,.76),rgba(7,18,25,.95))}.dip-detail-kicker{color:#bca9f3;font-size:9px;font-weight:950;letter-spacing:.12em}.diplomacy-detail h3{margin:4px 0 8px;color:#fff;font-size:18px}.diplomacy-detail p{margin:0 0 10px!important;color:#d3dbe0!important;font-size:11px!important;line-height:1.5!important}.dip-detail-meta{display:flex;gap:7px;flex-wrap:wrap}.dip-detail-meta span{padding:4px 6px;border:1px solid rgba(112,136,151,.22);border-radius:5px;background:rgba(8,22,29,.72);color:#93a8b5;font-size:8.5px}.dip-detail-note{margin-top:9px;color:#8b9aa4;font-size:8.5px}.diplomacy-empty{padding:24px;text-align:center;color:#80919c;font-size:10px}
@media(max-width:980px){.diplomacy-layout{grid-template-columns:1fr}.modal:has(.diplomacy-layout){width:min(920px,96vw)!important}}

/* v87 — finish open UI list: responsive pages, header controls, stronger AD card, templates. */
html,body{max-width:100%;overflow-x:hidden!important}
.stage,.site-function-page,.site-function-panel,.calendar-site-page,.calendar-reference-board{max-width:100%!important;box-sizing:border-box!important}
.site-function-page,.modal-backdrop,.calendar-site-page{overflow-x:hidden!important}
.modal.site-function-panel{max-width:100%!important;box-sizing:border-box!important}
.modal:has(.ad-command-view){overflow-x:hidden!important}
.ad-command-view,.ad-day-grid,.aow-command-center,.aow-declare-assistant{min-width:0!important;max-width:100%!important}

/* Hide the banner slogan underneath account controls instead of letting text collide. */
.topbar-control-mask{position:absolute;z-index:18;right:0;top:0;width:40%;height:6.4%;background:linear-gradient(90deg,rgba(6,13,18,0),rgba(6,13,18,.88) 24%,rgba(6,13,18,.98) 55%,rgba(6,13,18,.99));pointer-events:none}
.topbar-profile-live{right:9.2%!important;width:17.2%!important}
.hotspot[data-action="logout"]{z-index:20!important;display:flex!important;align-items:center!important;justify-content:center!important;left:auto!important;right:1.25%!important;top:1.48%!important;width:6.8%!important;height:4.05%!important;opacity:1!important;border:1px solid rgba(242,177,68,.38)!important;border-radius:.42vw!important;background:linear-gradient(180deg,rgba(22,29,35,.98),rgba(8,14,19,.98))!important;color:#f2bd58!important;pointer-events:auto!important;cursor:pointer!important;font-size:0!important}
.hotspot[data-action="logout"]::after{content:"SIGN OUT";font-size:clamp(8px,.62vw,12px);font-weight:900;letter-spacing:.06em}
.hotspot[data-action="logout"]:hover{border-color:#e9ad45!important;background:linear-gradient(180deg,rgba(45,35,19,.98),rgba(15,18,20,.98))!important}

/* Owner/User Management fills the page without the old dead right strip. */
.modal:has(.owner-account-grid){width:min(1320px,96%)!important;max-width:none!important;overflow-x:hidden!important}
.modal:has(.owner-account-grid) #modalText{max-width:none!important;width:100%!important}
.modal:has(.owner-account-grid) .owner-account-grid{width:100%!important;max-width:none!important;min-width:0!important;grid-template-columns:minmax(300px,.8fr) minmax(0,1.55fr)!important}
.modal:has(.owner-account-grid) .owner-account-card{min-width:0!important}
.modal:has(.owner-account-grid) .owner-user-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
@media(max-width:900px){.modal:has(.owner-account-grid) .owner-account-grid,.modal:has(.owner-account-grid) .owner-user-form-grid{grid-template-columns:1fr!important}}

/* More dramatic Alliance Duel dashboard command card. */
.ad-command-card-skin{border:1px solid rgba(255,185,59,.74)!important;background:radial-gradient(circle at 76% 18%,rgba(255,197,75,.34),transparent 25%),radial-gradient(circle at 24% 78%,rgba(176,49,26,.22),transparent 42%),linear-gradient(145deg,rgba(104,57,8,.99),rgba(39,22,8,.99) 48%,rgba(9,13,17,.99) 100%)!important;box-shadow:inset 0 0 0 1px rgba(255,232,178,.07),inset 0 -8vw 8vw rgba(0,0,0,.58),0 0 1.4vw rgba(223,139,24,.18)!important}
.ad-command-card-skin::after{content:"⚔";position:absolute;right:-2%;top:25%;font-size:clamp(70px,8vw,145px);line-height:1;color:rgba(255,191,70,.07);transform:rotate(-12deg);text-shadow:none}
.ad-command-card-skin .daily-focus-card-icon{filter:drop-shadow(0 .35vw .6vw rgba(0,0,0,.75)) drop-shadow(0 0 .8vw rgba(255,180,45,.22));transform:scale(1.04)}
.ad-card-copy small{color:#ffc456!important}.ad-card-copy>strong{font-weight:950!important;text-shadow:0 2px 6px #000!important}
.ad-card-copy .ad-week-badge{box-shadow:0 0 .7vw rgba(244,181,71,.12)}

/* Calendar bottom row must never create horizontal page scrolling. */
.calendar-site-page .calendar-reference-body,.calendar-site-page .calendar-command-sidebar,.calendar-site-page .calendar-side-card{max-width:100%!important;min-width:0!important;overflow-x:hidden!important}
.calendar-site-page .calendar-upcoming-card{display:flex!important;flex-direction:column!important}
.calendar-event-detail{position:relative!important;right:auto!important;bottom:auto!important;width:auto!important;max-height:none!important;margin-top:8px!important;flex:0 0 auto!important}

/* Dimension-based Templates page. */
.modal:has(.template-library){width:min(1180px,94vw)!important;max-width:none!important}
.template-library{display:grid;gap:14px;min-width:0}
.template-library-head{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:17px;border:1px solid rgba(224,164,62,.34);border-radius:10px;background:radial-gradient(circle at 86% 20%,rgba(232,167,58,.18),transparent 30%),linear-gradient(135deg,rgba(54,34,9,.74),rgba(7,20,28,.97))}
.template-library-head small{display:block;color:#dfa43d;font-size:9px;font-weight:950;letter-spacing:.15em}.template-library-head strong{display:block;margin-top:3px;color:#ffd174;font-size:22px}.template-library-head p{margin:5px 0 0!important;color:#aebbc4!important;font-size:11px!important}.template-library-head>span{padding:7px 10px;border:1px solid rgba(229,170,66,.32);border-radius:999px;color:#f0ba56;font-size:9px;font-weight:950;letter-spacing:.1em;background:rgba(229,170,66,.07)}
.template-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.template-event-card{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;overflow:hidden;padding:15px;border:1px solid rgba(93,124,142,.28);border-radius:9px;background:radial-gradient(circle at 90% 10%,rgba(64,136,179,.14),transparent 34%),linear-gradient(145deg,rgba(10,28,39,.98),rgba(6,16,23,.98))}.template-event-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,rgba(244,181,71,.05),transparent 40%)}.template-event-icon{display:grid;place-items:center;width:46px;height:46px;border:1px solid rgba(244,181,71,.28);border-radius:9px;background:rgba(244,181,71,.07);font-size:25px}.template-event-card small{color:#85b9d6;font-size:8px;font-weight:900;letter-spacing:.1em}.template-event-card strong{display:block;color:#fff;font-size:15px;margin:2px 0 3px}.template-event-card p{margin:0!important;color:#9fb0bb!important;font-size:10px!important;line-height:1.4!important}.template-event-card button{position:relative;z-index:2;border:1px solid #b57b22;border-radius:6px;background:linear-gradient(#f3ba50,#d99428);color:#111;font-size:9px;font-weight:950;padding:9px 10px;cursor:pointer}.template-library-note{padding:10px 12px;border:1px solid rgba(92,124,143,.22);border-radius:7px;background:rgba(7,19,27,.78);color:#899ba6;font-size:9.5px}
@media(max-width:800px){.template-card-grid{grid-template-columns:1fr}.template-event-card{grid-template-columns:auto 1fr}.template-event-card button{grid-column:1/-1;width:100%}}

/* v88 — AD tabs, day-specific command card, manageable templates, cleaner header. */
.topbar-control-mask{
  width:48% !important;
  background:linear-gradient(90deg,rgba(6,13,18,0) 0%,rgba(6,13,18,.94) 18%,#071016 38%,#071016 100%) !important;
}
.topbar-profile-live{right:10.3%!important;width:16.6%!important}
.hotspot[data-action="logout"]{right:1.4%!important;width:7.2%!important}

/* Alliance Duel dashboard card changes mood with the fixed AD day. */
.ad-command-card-skin[data-ad-day="monday"]{background:radial-gradient(circle at 72% 18%,rgba(220,184,71,.32),transparent 25%),linear-gradient(145deg,rgba(75,65,20,.98),rgba(22,39,18,.98) 52%,rgba(8,14,16,.99))!important}
.ad-command-card-skin[data-ad-day="tuesday"]{background:radial-gradient(circle at 74% 16%,rgba(237,126,47,.34),transparent 24%),linear-gradient(145deg,rgba(91,44,14,.99),rgba(49,26,15,.99) 52%,rgba(10,14,18,.99))!important}
.ad-command-card-skin[data-ad-day="wednesday"]{background:radial-gradient(circle at 72% 18%,rgba(96,147,230,.34),transparent 25%),linear-gradient(145deg,rgba(22,48,78,.99),rgba(20,27,52,.99) 52%,rgba(8,13,18,.99))!important}
.ad-command-card-skin[data-ad-day="thursday"]{background:radial-gradient(circle at 72% 18%,rgba(156,104,232,.34),transparent 25%),linear-gradient(145deg,rgba(57,33,96,.99),rgba(33,24,61,.99) 52%,rgba(9,13,18,.99))!important}
.ad-command-card-skin[data-ad-day="friday"]{background:radial-gradient(circle at 72% 18%,rgba(56,170,213,.32),transparent 25%),linear-gradient(145deg,rgba(17,65,82,.99),rgba(19,37,52,.99) 52%,rgba(8,13,18,.99))!important}
.ad-command-card-skin[data-ad-day="saturday"]{background:radial-gradient(circle at 72% 18%,rgba(229,72,55,.38),transparent 25%),linear-gradient(145deg,rgba(89,24,18,.99),rgba(53,22,18,.99) 52%,rgba(10,12,16,.99))!important}
.ad-command-card-skin[data-ad-day="sunday"]{background:radial-gradient(circle at 72% 18%,rgba(244,181,71,.25),transparent 25%),linear-gradient(145deg,rgba(74,46,10,.99),rgba(32,24,15,.99) 52%,rgba(8,13,18,.99))!important}

.ad-tabs{display:flex;gap:6px;flex-wrap:wrap;padding:10px;border:1px solid rgba(91,122,140,.28);border-radius:9px;background:rgba(5,15,22,.92);position:sticky;top:0;z-index:3}
.ad-tabs button{border:1px solid rgba(92,124,143,.28);border-radius:6px;background:#0a1b25;color:#9eb0bb;padding:9px 11px;font-size:9px;font-weight:950;letter-spacing:.04em;cursor:pointer}
.ad-tabs button:hover{border-color:#b17d2c;color:#fff}.ad-tabs button.is-active{background:linear-gradient(#f2ba51,#d8952e);border-color:#e0a03a;color:#111}.ad-tabs button.is-today:not(.is-active){box-shadow:inset 0 0 0 1px rgba(244,181,71,.25);color:#f4be5b}
.ad-tab-panels{min-width:0}.ad-tab-panel{min-width:0;padding-top:10px}.ad-tab-panel[hidden]{display:none!important}.ad-tab-panel.is-active{display:block}
.ad-tab-panel .ad-day-card{max-width:none;min-height:420px;background:radial-gradient(circle at 92% 10%,rgba(244,181,71,.08),transparent 30%),linear-gradient(145deg,rgba(8,24,34,.98),rgba(5,15,22,.98))}
.ad-tab-panel .ad-day-card header strong{font-size:17px}.ad-tab-panel .ad-day-card header p{font-size:11px}
.ad-tab-panel .aow-command-center{margin:0}.saturday-war-order{padding:0!important;overflow:hidden}.saturday-war-order .ad-tab-hero{padding:18px;border-bottom:1px solid rgba(244,181,71,.22);background:radial-gradient(circle at 88% 0%,rgba(205,61,43,.2),transparent 35%),linear-gradient(135deg,rgba(73,26,17,.75),rgba(8,22,30,.97))}.ad-tab-hero small{display:block;color:#f4b547;font-weight:950;letter-spacing:.13em;font-size:9px}.ad-tab-hero strong{display:block;color:#fff;font-size:20px;margin:4px 0}.ad-tab-hero p{margin:0;color:#a8b7c0;font-size:11px}.saturday-war-order>.ad-form-grid{padding:16px}
@media(max-width:760px){.ad-tabs{position:static}.ad-tabs button{flex:1 1 28%;padding:8px 6px}.ad-tab-panel .ad-day-card{min-height:0}}

/* Template manager — separate Dimension and Event libraries. */
.template-editor{padding:14px;border:1px solid rgba(244,181,71,.34);border-radius:10px;background:radial-gradient(circle at 92% 0%,rgba(244,181,71,.12),transparent 32%),linear-gradient(145deg,rgba(12,28,37,.98),rgba(7,17,24,.98))}
.template-editor-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.template-editor-head small{display:block;color:#e4aa43;font-size:8px;font-weight:950;letter-spacing:.14em}.template-editor-head strong{display:block;color:#fff;font-size:18px;margin-top:3px}.template-editor-head button{border:1px solid rgba(107,138,155,.35);border-radius:5px;background:#0b1d27;color:#b9c5cb;padding:7px 10px;font-weight:800;cursor:pointer}
.template-editor-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.template-editor-grid label{display:flex;flex-direction:column;gap:5px;color:#c8d2d8;font-size:9px;font-weight:850}.template-editor-grid .wide{grid-column:1/-1}.template-editor-grid textarea{min-height:110px}.template-reminders{grid-column:1/-2;display:flex;gap:18px;align-items:center;padding:9px 11px;border:1px solid rgba(92,124,143,.22);border-radius:6px;background:rgba(5,16,23,.72);color:#c8d3d9;font-size:10px}.template-save{border:1px solid #ba8125;border-radius:6px;background:linear-gradient(#f4bd54,#d9942b);color:#111;font-weight:950;cursor:pointer}.template-manager-status{margin-top:8px;color:#eb6767;font-size:10px}.event-template-head{margin-top:2px;background:radial-gradient(circle at 86% 20%,rgba(91,120,206,.18),transparent 30%),linear-gradient(135deg,rgba(20,29,62,.74),rgba(7,20,28,.97))}.template-card-actions{position:relative;z-index:2;display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}.template-card-actions button{padding:8px 9px!important}.template-card-actions .secondary{background:#0c202b!important;color:#cbd7dc!important;border-color:#496172!important}.template-card-actions .danger{background:#281517!important;color:#ff9890!important;border-color:#763b3b!important}
@media(max-width:900px){.template-editor-grid{grid-template-columns:1fr 1fr}.template-reminders{grid-column:1/-1}.template-save{grid-column:1/-1;min-height:42px}}
@media(max-width:600px){.template-editor-grid{grid-template-columns:1fr}.template-editor-grid .wide,.template-reminders,.template-save{grid-column:auto}.template-reminders{flex-direction:column;align-items:flex-start}.template-event-card{grid-template-columns:auto 1fr!important}.template-card-actions{grid-column:1/-1;justify-content:stretch}.template-card-actions button{flex:1}}


/* v89 — wider function pages + recurring schedules */
.modal.site-function-panel{width:min(96vw,1680px)!important;max-width:1680px!important}
.event-composer,.announcement-composer,#modalText{width:100%!important;max-width:none!important}
.event-composer .composer-grid.event-grid{grid-template-columns:minmax(180px,.8fr) minmax(260px,1.15fr) minmax(180px,.72fr) minmax(170px,.65fr)!important}
.recurring-event-box{margin:14px 0;padding:14px 16px;border:1px solid rgba(215,155,47,.34);border-radius:5px;background:linear-gradient(135deg,rgba(94,62,17,.16),rgba(6,21,29,.86))}
.recurring-toggle{display:flex;align-items:center;gap:10px;color:#f1b443;font-weight:900;letter-spacing:.02em}
.recurring-slots{margin-top:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.recurring-slots[hidden]{display:none!important}
.recurring-slot{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:end;padding:10px;border:1px solid rgba(91,122,141,.28);background:#071820;border-radius:4px}
.recurring-slot strong{grid-column:1/-1;color:#dbe6ec;font-size:12px}.recurring-slot strong small{color:#8195a2;font-weight:600}
.recurring-slots>p{grid-column:1/-1;margin:0;color:#8fa5b2;font-size:11px}
.recurring-series-section{margin-top:14px}
.recurring-series-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:11px 13px;border:1px solid rgba(89,121,140,.3);background:linear-gradient(90deg,rgba(8,26,35,.96),rgba(18,22,32,.92));border-radius:4px}
.recurring-series-card+ .recurring-series-card{margin-top:7px}
.recurring-series-card strong{display:block;color:#f0f4f6;font-size:13px}.recurring-series-card span{display:block;margin-top:3px;color:#f1b342;font-size:11px;font-weight:800}.recurring-series-card small{display:block;margin-top:3px;color:#8ca0ad;font-size:10px}
.recurring-series-actions{display:flex;gap:6px}.recurring-series-actions button{padding:7px 10px;border:1px solid rgba(103,135,153,.4);border-radius:4px;background:#0b1b24;color:#dce6eb;font-weight:800;cursor:pointer}.recurring-series-actions button:last-child{color:#ff8b7f;border-color:rgba(182,78,66,.45)}
.template-editor{max-width:none!important}.template-editor-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}.template-editor-grid .wide{grid-column:span 2!important}
@media(max-width:980px){.event-composer .composer-grid.event-grid{grid-template-columns:1fr 1fr!important}.recurring-slots{grid-template-columns:1fr}.template-editor-grid{grid-template-columns:1fr 1fr!important}.template-editor-grid .wide{grid-column:1/-1!important}}
@media(max-width:650px){.event-composer .composer-grid.event-grid{grid-template-columns:1fr!important}.recurring-slot{grid-template-columns:1fr}.template-editor-grid{grid-template-columns:1fr!important}}
.announcement-thumb{width:86px;height:64px;object-fit:cover;border:1px solid rgba(215,155,47,.35);border-radius:4px;align-self:start}.announcement-item{grid-template-columns:auto minmax(0,1fr) auto!important}.external-feed-section{margin-top:14px}.external-feed-item{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;padding:10px 12px;border:1px solid rgba(88,119,138,.28);border-radius:4px;background:rgba(6,20,28,.88)}.external-feed-item+ .external-feed-item{margin-top:7px}.external-feed-item img{width:74px;height:54px;object-fit:cover;border-radius:3px}.external-feed-item small{display:block;color:#f0af3c;font-size:9px;font-weight:900;letter-spacing:.08em}.external-feed-item strong{display:block;margin-top:2px;color:#edf3f6}.external-feed-item p{margin:4px 0;color:#a9bac4;font-size:11px}.external-feed-item time{color:#738b99;font-size:9px}

/* v90 — structural widescreen layout fix */
html,body{
  width:100%;
  min-width:0;
  max-width:100%;
  height:100%;
  overflow:hidden!important;
}
.viewport{
  width:100vw!important;
  height:100vh!important;
  display:block!important;
  overflow:hidden!important;
}
.stage{
  width:100vw!important;
  height:100vh!important;
  max-width:none!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  margin:0!important;
  overflow:hidden!important;
}
.dashboard-image{
  width:100%!important;
  height:100%!important;
  object-fit:fill!important;
}

/* No site page is allowed to create page-level horizontal scrolling. */
.site-function-page,
.site-function-panel,
.calendar-site-page,
.calendar-reference-board,
.modal-backdrop,
.modal,
.modal-content,
.event-composer,
.city-cap-composer,
.announcement-composer,
.activity-log-view,
.owner-account-grid,
.role-assignment-manager,
.diplomacy-layout,
.template-library,
.template-editor,
.ad-command-view,
.ad-tab-panels,
.ad-tab-panel{
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
  overflow-x:hidden!important;
}

/* Content rows/cards shrink instead of widening their parent. */
.composer-grid,
.event-grid,
.calendar-reference-body,
.calendar-command-sidebar,
.calendar-side-card,
.calendar-bottom-info-row,
.calendar-grid,
.calendar-month-grid,
.calendar-list-view,
.planned-caps,
.announcement-list-section,
.announcement-item,
.event-detail,
.role-assignment-row,
.alliance-role-grid,
.alliance-role-card,
.template-card-grid,
.template-event-card,
.diplomacy-register,
.diplomacy-agreement-card{
  min-width:0!important;
  max-width:100%!important;
}

/* Internal vertical scrolling is OK; horizontal scrolling is not. */
.modal.site-function-panel,
.site-function-page,
.calendar-site-page{
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-gutter:stable;
}

/* Calendar week/month content must reflow inside the page instead of forcing X-scroll. */
.calendar-site-page .calendar-grid,
.calendar-site-page .calendar-reference-body,
.calendar-site-page .calendar-month-grid,
.calendar-site-page .calendar-week-view,
.calendar-site-page .war-week-board,
.modal:has(.calendar-view-panel:not([hidden])) .calendar-grid,
.modal:has(.calendar-view-panel:not([hidden])) .calendar-grid:has(.war-week-board),
.modal:has(.calendar-view-panel:not([hidden])) .calendar-grid:has(.war-month-grid){
  width:100%!important;
  max-width:100%!important;
  overflow-x:hidden!important;
}

/* Wide-screen Alliance Roles uses available space instead of leaving half the page empty. */
@media (min-width:1280px){
  .site-function-page .alliance-role-grid,
  .modal.site-function-panel .alliance-role-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    width:100%!important;
  }
  .site-function-page .alliance-role-overview-head,
  .modal.site-function-panel .alliance-role-overview-head{
    width:100%!important;
  }
}
@media (min-width:1800px){
  .site-function-page .alliance-role-grid,
  .modal.site-function-panel .alliance-role-grid{
    gap:14px!important;
  }
}

/* Give the bell a little more breathing room from the profile button. */
.notification-bell{
  right:27.2%!important;
}

/* Keep topbar controls in their own clean right-side zone on wide screens. */
.topbar-control-mask{
  width:46%!important;
}
.topbar-profile-live{
  right:10.3%!important;
  width:16.6%!important;
}
.hotspot[data-action="logout"]{
  right:1.4%!important;
  width:7.2%!important;
}

/* Widescreen function pages can consume the full content column. */
.modal.site-function-panel{
  width:calc(100% - 18.2%)!important;
  max-width:none!important;
  margin-left:15.8%!important;
  margin-right:1.2%!important;
}

/* Preserve readable spacing on smaller screens. */
@media (max-width:1100px){
  .modal.site-function-panel{
    width:calc(100% - 17%)!important;
    margin-left:15.8%!important;
    margin-right:1.2%!important;
  }
  .site-function-page .alliance-role-grid,
  .modal.site-function-panel .alliance-role-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media (max-width:760px){
  .site-function-page .alliance-role-grid,
  .modal.site-function-panel .alliance-role-grid{
    grid-template-columns:1fr!important;
  }
}

/* ===== v91: Settings overflow, PAR planner, stronger AD status ===== */
.settings-panel,.site-settings-panel,.settings-content,.settings-page,.settings-section{min-width:0!important;max-width:100%!important;overflow-x:hidden!important}
.settings-tabs{min-width:0!important;max-width:100%!important;overflow-x:hidden!important}
.settings-tab{min-width:0!important;white-space:normal!important;overflow-wrap:anywhere!important}
@media (max-width:900px){.settings-panel form{grid-template-columns:1fr!important}.settings-tabs{width:100%!important;display:flex!important;flex-wrap:wrap!important;border-right:0!important;border-bottom:1px solid rgba(240,173,62,.12)!important}.settings-tab{flex:1 1 150px!important;margin:0!important}}

.par-card-skin{position:absolute;z-index:7;pointer-events:none;overflow:hidden;left:16.45%;top:62.9%;width:18.15%;height:11.95%;border-radius:.42vw;border:1px solid rgba(74,176,221,.34);background:radial-gradient(circle at 78% 26%,rgba(92,199,243,.24),transparent 28%),linear-gradient(145deg,#0b2636,#123f55 56%,#08151d);box-shadow:inset 0 -3vw 4vw rgba(0,0,0,.48),inset 0 0 0 1px rgba(255,255,255,.04);color:#fff;text-shadow:0 1px 2px #000}
.par-card-skin::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.03),transparent 35%,rgba(0,0,0,.22));pointer-events:none}
.par-card-icon{position:absolute;right:8%;top:10%;font-size:clamp(30px,3.5vw,64px);opacity:.92;filter:drop-shadow(0 .25vw .45vw rgba(0,0,0,.65))}
.par-card-skin small{position:absolute;left:8%;top:12%;font-size:clamp(6px,.48vw,9px);letter-spacing:.12em;color:#82d5f7;font-weight:900}
.par-card-skin>strong{position:absolute;left:8%;top:31%;font-size:clamp(12px,1vw,19px);letter-spacing:.03em}
.par-card-skin>span:not(.par-card-icon){position:absolute;left:8%;right:6%;font-size:clamp(7px,.58vw,11px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#d9e8ef}
#parCardNow{bottom:25%}#parCardNext{bottom:10%;color:#9ec8d8}
.par-card-skin[data-par="zombies"]{background:radial-gradient(circle at 78% 26%,rgba(99,202,111,.28),transparent 29%),linear-gradient(145deg,#12331a,#24572b 55%,#0a1710)}
.par-card-skin[data-par="fortress"]{background:radial-gradient(circle at 78% 26%,rgba(229,165,83,.29),transparent 29%),linear-gradient(145deg,#3b2410,#6b3d18 55%,#1a1009)}
.par-card-skin[data-par="research"]{background:radial-gradient(circle at 78% 26%,rgba(103,145,239,.3),transparent 29%),linear-gradient(145deg,#152d52,#274d86 55%,#0d1727)}
.par-card-skin[data-par="hero"]{background:radial-gradient(circle at 78% 26%,rgba(182,115,237,.3),transparent 29%),linear-gradient(145deg,#34204e,#5b3582 55%,#1a1027)}
.par-card-skin[data-par="prep"]{background:radial-gradient(circle at 78% 26%,rgba(232,86,63,.3),transparent 29%),linear-gradient(145deg,#4e1d16,#7a2e20 55%,#1c0d0a)}

.modal:has(.par-planner){width:min(1450px,96vw)!important;max-width:none!important;overflow-x:hidden!important}
.par-planner{display:grid;gap:14px;min-width:0;color:#d9e3e9}
.par-current{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;padding:18px;border:1px solid rgba(94,184,224,.34);border-radius:10px;background:linear-gradient(135deg,rgba(17,52,70,.94),rgba(7,19,27,.98))}
.par-current small,.par-detail-head small{display:block;color:#8bd3f2;font-weight:900;letter-spacing:.12em;font-size:10px}.par-current>div>strong{display:block;font-size:24px;color:#f1f7fa;margin:4px 0}.par-current>div>span{color:#a9bac4}
.par-countdown{text-align:right}.par-countdown strong{display:block;font-size:26px;color:#ffd06d}.par-countdown span{font-size:11px;color:#b8c7cf}
.par-tabs{display:flex;gap:6px;flex-wrap:wrap}.par-tabs button{border:1px solid #29404e;background:#09151e;color:#9eb1bc;padding:9px 14px;border-radius:6px;font-weight:900}.par-tabs button.is-active{border-color:#dca547;background:rgba(220,165,71,.14);color:#ffd06d}
.par-today-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.par-window{min-width:0;text-align:left;border:1px solid #243b49;background:#0a1821;color:#d5e0e6;border-radius:8px;padding:12px}.par-window span{display:block;color:#7f98a6;font-size:10px;margin-bottom:5px}.par-window strong{font-size:12px}.par-window.is-current{border-color:#dca547;box-shadow:inset 3px 0 #dca547;background:linear-gradient(90deg,rgba(220,165,71,.14),#0a1821)}
.par-week-board{display:grid;gap:8px;min-width:0}.par-day-row{display:grid;grid-template-columns:90px repeat(6,minmax(0,1fr));gap:6px;align-items:stretch}.par-day-row>strong{display:flex;align-items:center;color:#ffd06d;font-size:11px}.par-day-row button{min-width:0;border:1px solid #243743;background:#09151d;color:#c8d4da;border-radius:6px;padding:8px 6px;text-align:left;font-size:10px}.par-day-row button span{display:block;color:#758c98;font-size:8px}
.par-detail-card{border:1px solid #29414f;background:#08141c;border-radius:9px;padding:15px}.par-detail-head{display:flex;align-items:center;gap:12px;border-bottom:1px solid #1f303a;padding-bottom:10px}.par-detail-head>span{font-size:32px}.par-detail-head strong{display:block;font-size:17px;color:#eef5f8}.par-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.par-detail-grid h3{color:#ffd06d;font-size:11px;letter-spacing:.08em}.par-detail-grid ul{margin:0;padding-left:18px;line-height:1.6;font-size:12px}.par-source-note{font-size:10px;color:#7f929d}
@media(max-width:900px){.par-current{grid-template-columns:1fr}.par-countdown{text-align:left}.par-today-grid{grid-template-columns:1fr 1fr}.par-day-row{grid-template-columns:80px repeat(2,minmax(0,1fr));}.par-day-row>strong{grid-row:span 3}.par-detail-grid{grid-template-columns:1fr}}

.ad-week-control{position:relative;overflow:hidden!important;border-width:2px!important}.ad-week-control::after{content:attr(data-week-status);position:absolute;right:18px;top:12px;text-transform:uppercase;font-weight:1000;letter-spacing:.12em;font-size:clamp(16px,1.7vw,28px);opacity:.18;pointer-events:none}.ad-week-control[data-week-status="push"]{border-color:#dd6e32!important;background:linear-gradient(135deg,rgba(128,49,22,.38),rgba(28,15,10,.78))!important;box-shadow:inset 5px 0 #ee7e37}.ad-week-control[data-week-status="push"]>div:first-child>strong{color:#ff9c4c!important;font-size:clamp(24px,2vw,36px)!important}.ad-week-control[data-week-status="save"]{border-color:#4fa7c7!important;background:linear-gradient(135deg,rgba(22,76,103,.38),rgba(9,20,28,.82))!important;box-shadow:inset 5px 0 #56b1d1}.ad-week-control[data-week-status="save"]>div:first-child>strong{color:#72d2f0!important;font-size:clamp(24px,2vw,36px)!important}
.ad-week-badge[data-status="push"]{background:#7a3017!important;border-color:#ee7e37!important;color:#ffbd7c!important;font-size:clamp(9px,.9vw,16px)!important;padding:.35em .8em!important;box-shadow:0 0 16px rgba(238,126,55,.22)}.ad-week-badge[data-status="save"]{background:#153b4b!important;border-color:#56b1d1!important;color:#91def5!important;font-size:clamp(9px,.9vw,16px)!important;padding:.35em .8em!important;box-shadow:0 0 16px rgba(86,177,209,.2)}
.ad-guide-edit-btn{margin-left:auto;align-self:flex-start;border:1px solid rgba(244,181,71,.4);background:rgba(244,181,71,.08);color:#ffd06d;border-radius:5px;padding:7px 9px;font-size:9px;font-weight:900;letter-spacing:.06em}.ad-guide-editor{margin-top:12px;padding:12px;border-top:1px solid rgba(244,181,71,.22);display:grid;gap:9px}.ad-guide-editor[hidden]{display:none!important}.ad-guide-editor label{display:grid;gap:5px;font-size:10px;color:#94a7b2}.ad-guide-lines{min-height:150px}.ad-guide-actions{display:flex;gap:8px;flex-wrap:wrap}.ad-guide-actions button{border:1px solid #a8752f;background:#593b17;color:#ffd06d;border-radius:5px;padding:8px 10px;font-weight:900}.ad-guide-actions .secondary{border-color:#354854;background:#0d1920;color:#a9bbc5}

.template-routing{grid-column:1/-1!important;display:flex!important;align-items:center!important;gap:12px!important;flex-wrap:wrap!important;border-top:1px solid rgba(240,173,62,.16);padding-top:10px}.template-routing>strong{color:#ffd06d;font-size:10px;letter-spacing:.12em}

/* Do not allow accidental page-level horizontal scrolling. */
html,body,.stage,.modal-backdrop,.modal,.modal-body,.site-page,.settings-backdrop,.settings-panel{max-width:100%!important;overflow-x:hidden!important}

/* =========================================================
   v92 — unified command-page layout + usable week calendar
   ========================================================= */

/* The site-function backdrop already starts to the right of the sidebar.
   Do not add a second sidebar-sized margin inside it. */
.modal.site-function-panel{
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
}

/* Keep command content aligned to the page canvas and let it use the width. */
.modal.site-function-panel #modalText,
.modal.site-function-panel .city-cap-composer,
.modal.site-function-panel .event-composer,
.modal.site-function-panel .announcement-composer,
.modal.site-function-panel .activity-log-view,
.modal.site-function-panel .ad-command-view,
.modal.site-function-panel .dimension-config,
.modal.site-function-panel .war-alert-command,
.modal.site-function-panel .diplomacy-layout,
.modal.site-function-panel .par-planner{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  box-sizing:border-box!important;
}

/* Diplomacy: give the register most of the wide-screen space. */
.diplomacy-layout{
  grid-template-columns:minmax(330px,2fr) minmax(500px,3fr)!important;
  width:100%!important;
  max-width:none!important;
}
.diplomacy-register,.diplomacy-command{min-width:0!important;max-width:none!important}
.diplomacy-cards{grid-template-columns:repeat(auto-fit,minmax(310px,1fr));align-content:start}

/* PAR: use the page, rather than living in a narrow left column. */
.par-planner{width:100%!important;max-width:none!important}
.par-current{width:100%!important}
.par-today-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important}
.par-week-board{width:100%!important}
.par-day-row{grid-template-columns:95px repeat(6,minmax(0,1fr))!important}
.par-detail-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}
@media(max-width:1200px){
  .par-today-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .par-day-row{grid-template-columns:85px repeat(3,minmax(0,1fr))!important}
  .par-day-row>strong{grid-row:span 2}
}
@media(max-width:760px){
  .par-today-grid{grid-template-columns:1fr 1fr!important}
  .par-day-row{grid-template-columns:75px repeat(2,minmax(0,1fr))!important}
  .par-day-row>strong{grid-row:span 3}
  .par-detail-grid{grid-template-columns:1fr!important}
}

/* Dimension and War Alert should align with the same content edge. */
.dimension-config,.war-alert-command{margin-left:0!important;margin-right:0!important}
.dimension-config .config-grid{width:100%!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
.war-alert-command{grid-template-columns:minmax(0,1fr)!important}
.war-alert-command textarea{width:100%!important}
@media(max-width:760px){.dimension-config .config-grid{grid-template-columns:1fr!important}}

/* City Cap uses the full page width and keeps planned operations readable. */
.city-cap-composer{display:grid!important;grid-template-columns:minmax(0,1.45fr) minmax(330px,.75fr)!important;gap:14px!important;align-items:start!important}
.city-cap-composer>.composer-grid,.city-cap-composer>.reminder-box,.city-cap-composer>.send-now-row,.city-cap-composer>.composer-help,.city-cap-composer>.city-cap-status{grid-column:1!important}
.city-cap-composer>.planned-caps{grid-column:2!important;grid-row:1 / span 5!important;margin-top:0!important;min-height:100%!important}
.city-cap-composer .composer-grid-schedule{grid-template-columns:minmax(180px,1.35fr) minmax(90px,.45fr) minmax(150px,.75fr) minmax(135px,.65fr)!important}
@media(max-width:1100px){
  .city-cap-composer{grid-template-columns:1fr!important}
  .city-cap-composer>.composer-grid,.city-cap-composer>.reminder-box,.city-cap-composer>.send-now-row,.city-cap-composer>.composer-help,.city-cap-composer>.city-cap-status,.city-cap-composer>.planned-caps{grid-column:1!important;grid-row:auto!important}
}

/* Notification bell: keep the horizontal position, lift it to match profile/sign-out. */
.notification-bell{top:.78%!important}

/* Dashboard Upcoming Events: fixed panel, compact internal vertical scrolling. */
.live-events-panel{overflow:hidden!important}
.live-events-list{
  height:calc(100% - clamp(32px,3.1vw,50px));
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-top:.2vw!important;
  padding-right:.25vw!important;
  scrollbar-gutter:stable;
  overscroll-behavior:contain;
}
.live-event-row{
  min-height:4.35vw!important;
  grid-template-columns:2.75vw minmax(0,1fr) auto!important;
  gap:.55vw!important;
  padding:.16vw .08vw!important;
}
.live-event-date{width:2.68vw!important;height:2.9vw!important}
.live-event-date strong{font-size:clamp(10px,1.05vw,18px)!important}
.live-event-copy strong{font-size:clamp(8px,.72vw,12px)!important}
.live-event-copy span{font-size:clamp(7px,.61vw,10px)!important}
.live-event-badge{min-width:2.45vw!important;padding:.28vw .42vw!important}
.live-events-list::-webkit-scrollbar{width:7px}.live-events-list::-webkit-scrollbar-thumb{background:#41515c;border-radius:8px}.live-events-list::-webkit-scrollbar-track{background:rgba(255,255,255,.025)}

/* Week view: the time canvas is tall and scrolls vertically inside the calendar.
   Header cells stay visible; the page itself never gets a horizontal scrollbar. */
.calendar-site-page .calendar-grid:has(.war-week-board){
  height:100%!important;
  max-height:100%!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-gutter:stable;
  overscroll-behavior:contain;
}
.calendar-site-page .war-week-board{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  grid-template-columns:clamp(42px,3.2vw,54px) repeat(7,minmax(0,1fr))!important;
  grid-template-rows:38px 1020px!important;
}
.calendar-site-page .war-week-board>.week-time-head,
.calendar-site-page .war-week-board>.war-week-head{
  position:sticky!important;
  top:0!important;
  z-index:12!important;
}
.calendar-site-page .war-week-board>.week-time-head{background:#071017!important}
.calendar-site-page .war-week-board>.war-week-head{background:#071017!important}
.calendar-site-page .war-week-board>.war-week-head.is-today{background:#241d10!important}
.calendar-site-page .calendar-grid:has(.war-week-board)::-webkit-scrollbar{width:8px}.calendar-site-page .calendar-grid:has(.war-week-board)::-webkit-scrollbar-thumb{background:#465761;border-radius:8px}.calendar-site-page .calendar-grid:has(.war-week-board)::-webkit-scrollbar-track{background:#061018}

/* No horizontal scrollbars on command pages. */
.modal.site-function-panel,.modal.site-function-panel *{max-width:100%;box-sizing:border-box}
.modal.site-function-panel{overflow-x:hidden!important}


/* =========================================================
   v93 — route isolation + calendar readability fixes
   ========================================================= */

/* A function composer must never bleed into another command page. */
.city-cap-composer[hidden],
.event-composer[hidden],
.announcement-composer[hidden],
.activity-log-view[hidden],
.calendar-view-panel[hidden],
.announcement-list-section[hidden],
.external-feed-section[hidden]{display:none!important}

/* Custom Message uses the announcement form, but not the announcement/feed lists. */
.modal:has(.announcement-composer:not([hidden])) .announcement-composer{min-width:0!important}

/* Dashboard Upcoming Events: say explicitly which clock the user is seeing. */
.live-event-copy span{display:flex!important;align-items:baseline!important;gap:.35vw!important;flex-wrap:wrap!important}
.live-event-copy span b{font:inherit!important;color:#d8e2e8!important;font-weight:800!important}
.live-event-gt{display:block!important;margin-top:.12vw!important;color:#7fa2b6!important;font-size:clamp(6px,.52vw,9px)!important;line-height:1.1!important}

/* Month view: fit three compact events before falling back to +N more. */
.calendar-site-page .calendar-day-events{gap:2px!important;min-height:0!important}
.calendar-site-page .calendar-chip.is-compact{height:19px!important;min-height:19px!important;padding:1px 4px!important}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-copy strong{font-size:clamp(6.5px,.47vw,8px)!important}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-copy small{font-size:clamp(5.5px,.4vw,7px)!important}
.calendar-site-page .calendar-more{height:16px!important;min-height:16px!important;margin-top:1px!important}
.calendar-event-detail .day-event-link{display:block!important;width:100%!important;margin:4px 0!important;text-align:left!important}

/* Week view: full 00:00–24:00 day, slightly tighter hours, no top/bottom clipping. */
.calendar-site-page .calendar-grid:has(.war-week-board){
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-bottom:18px!important;
  scroll-padding-top:44px!important;
  scroll-padding-bottom:24px!important;
}
.calendar-site-page .war-week-board{
  grid-template-rows:38px 960px!important;
  min-height:998px!important;
  padding-bottom:8px!important;
}
.calendar-site-page .war-week-board .week-time-axis,
.calendar-site-page .war-week-board .war-week-day{min-height:960px!important}
.calendar-site-page .war-week-board .week-time-axis span:first-child{top:5px!important;transform:none!important}
.calendar-site-page .war-week-board .week-time-axis span:last-child{top:auto!important;bottom:4px!important;transform:none!important}
.calendar-site-page .war-week-board .week-event-card{min-height:34px!important}

/* The sticky weekday header stays above events without covering the first hour label. */
.calendar-site-page .war-week-board>.week-time-head,
.calendar-site-page .war-week-board>.war-week-head{height:38px!important;min-height:38px!important}

@media(max-width:760px){
  .calendar-site-page .calendar-chip.is-compact{height:17px!important;min-height:17px!important}
  .calendar-site-page .war-week-board{min-width:720px!important}
}

/* v94 SETTINGS FIX — full owner navigation; no clipped tabs */
.site-settings-panel .settings-tabs{
  width:100%!important;
  max-width:none!important;
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  overflow:visible!important;
  border-right:0!important;
  border-bottom:1px solid rgba(240,173,62,.16)!important;
  padding:12px!important;
}
.site-settings-panel .settings-tab{
  flex:0 1 auto!important;
  min-width:150px!important;
  margin:0!important;
  white-space:nowrap!important;
}
.site-settings-panel .settings-tab[hidden]{display:none!important;}

/* v97 — focused UX fixes from v96 baseline */
/* Bell notifications and calendar detail overlays must always sit above page content. */
.notification-panel{
  position:fixed!important;
  top:72px!important;
  right:18px!important;
  z-index:100000!important;
  width:min(470px,calc(100vw - 36px))!important;
  max-height:calc(100vh - 92px)!important;
  overflow:hidden!important;
  isolation:isolate!important;
}
.notification-list{max-height:calc(100vh - 245px)!important}
.calendar-site-page .event-detail:not([hidden]),
.calendar-event-detail:not([hidden]){
  position:fixed!important;
  top:auto!important;
  right:18px!important;
  bottom:18px!important;
  left:auto!important;
  z-index:99990!important;
  width:min(360px,calc(100vw - 36px))!important;
  max-height:min(62vh,560px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  margin:0!important;
  box-shadow:0 20px 55px rgba(0,0,0,.72)!important;
}

/* Month calendar: reserve enough room for three actual events and a visible overflow action. */
.calendar-site-page .calendar-day{padding:4px 5px!important}
.calendar-site-page .calendar-day-top{min-height:17px!important;margin-bottom:1px!important}
.calendar-site-page .calendar-day-events{display:flex!important;flex-direction:column!important;gap:1px!important;margin-top:0!important;overflow:visible!important}
.calendar-site-page .calendar-chip.is-compact{
  flex:0 0 15px!important;
  height:15px!important;
  min-height:15px!important;
  margin:0!important;
  padding:1px 4px!important;
  border-left-width:3px!important;
  border-radius:3px!important;
}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-icon{font-size:7px!important}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-copy{display:flex!important;align-items:center!important;gap:4px!important;min-width:0!important}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-copy strong{font-size:7px!important;line-height:1!important}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-copy small{font-size:6px!important;line-height:1!important;flex:0 0 auto!important}
.calendar-site-page .calendar-more{
  display:block!important;
  flex:0 0 14px!important;
  height:14px!important;
  min-height:14px!important;
  margin:1px 0 0!important;
  padding:0 4px!important;
  border:1px solid rgba(238,176,65,.34)!important;
  border-radius:3px!important;
  background:rgba(238,176,65,.08)!important;
  color:#efb451!important;
  font-size:7px!important;
  line-height:12px!important;
  text-align:left!important;
  cursor:pointer!important;
}

/* Add Event: use the page scrollbar, never a second scrollbar inside the form panel. */
.modal-backdrop.site-function-page:has(.event-composer:not([hidden])){
  overflow-y:auto!important;
  overflow-x:hidden!important;
}
.modal.site-function-panel:has(.event-composer:not([hidden])){
  max-height:none!important;
  height:auto!important;
  overflow:visible!important;
  align-self:flex-start!important;
  margin-bottom:28px!important;
}
.modal.site-function-panel:has(.event-composer:not([hidden])) #modalText{overflow:visible!important}
.event-composer{overflow:visible!important}

/* Account & access: logical vertical flow and one reachable scrollbar. */
.modal-backdrop.site-function-page:has(.owner-account-grid){
  overflow-y:auto!important;
  overflow-x:hidden!important;
}
.modal:has(.owner-account-grid){
  width:min(1180px,94vw)!important;
  max-height:none!important;
  height:auto!important;
  overflow:visible!important;
  align-self:flex-start!important;
  margin-bottom:30px!important;
}
.modal:has(.owner-account-grid) #modalText{
  width:100%!important;
  overflow:visible!important;
  padding-right:0!important;
}
.modal:has(.owner-account-grid) .owner-account-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:14px!important;
  width:100%!important;
  max-width:none!important;
}
.modal:has(.owner-account-grid) .owner-profile-card{grid-column:1!important}
.modal:has(.owner-account-grid) .owner-password-card{grid-column:2!important}
.modal:has(.owner-account-grid) .owner-create-card{grid-column:1/-1!important}
.modal:has(.owner-account-grid) .owner-users-card{grid-column:1/-1!important}
.owner-profile-grid,.owner-password-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
.owner-password-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.modal:has(.owner-account-grid) .owner-managed-users{
  max-height:360px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-right:5px!important;
}
.modal:has(.owner-account-grid) .owner-managed-user{
  grid-template-columns:minmax(220px,1fr) 105px 105px 150px!important;
}
@media(max-width:900px){
  .modal:has(.owner-account-grid) .owner-account-grid{grid-template-columns:1fr!important}
  .modal:has(.owner-account-grid) .owner-profile-card,
  .modal:has(.owner-account-grid) .owner-password-card,
  .modal:has(.owner-account-grid) .owner-create-card,
  .modal:has(.owner-account-grid) .owner-users-card{grid-column:1!important}
  .owner-profile-grid,.owner-password-grid,.owner-user-form-grid{grid-template-columns:1fr!important}
  .modal:has(.owner-account-grid) .owner-managed-user{grid-template-columns:1fr 90px!important}
  .modal:has(.owner-account-grid) .owner-managed-user-main{grid-column:1/-1!important}
}

/* v99 — Calendar detail belongs inside the bottom-right Upcoming Events card.
   Keep notification bell overlay global, but do not float event details over the calendar. */
.calendar-site-page .calendar-event-detail,
.calendar-site-page .event-detail:not([hidden]),
.calendar-event-detail:not([hidden]){
  position:relative!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  z-index:2!important;
  width:100%!important;
  max-width:none!important;
  max-height:none!important;
  overflow:visible!important;
  margin:10px 0 0!important;
  box-shadow:none!important;
}
.calendar-site-page .calendar-upcoming-card{
  display:flex!important;
  flex-direction:column!important;
  min-height:0!important;
}
.calendar-site-page .calendar-upcoming-list{
  min-height:0!important;
}
.calendar-site-page .calendar-event-detail[hidden]{display:none!important}


/* v100 — attribution + Discord template/send actions */
.dip-attribution,.ad-attribution{font-size:12px;color:#b9c4cf;margin-top:8px}.dip-attribution strong,.ad-attribution strong{color:#fff}.dip-send{border-color:rgba(88,175,255,.45)!important}.ad-publish-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px}.ad-publish-actions button{border:1px solid rgba(88,175,255,.45);background:linear-gradient(180deg,#214668,#16324b);color:#fff;border-radius:8px;padding:9px 13px;font-weight:800;cursor:pointer}.ad-publish-actions span{font-size:12px;color:#b9c4cf}.diplomacy-card-foot,.dip-card-foot{flex-wrap:wrap}

/* =========================================================
   v101 — Activity Log readability / action placement
   ========================================================= */
.modal.site-function-panel:has(.activity-log-view:not([hidden])) .activity-log-view{
  margin-bottom:4px!important;
}
.modal.site-function-panel:has(.activity-log-view:not([hidden])) .activity-log-header strong{
  font-size:14px!important;
}
.modal.site-function-panel:has(.activity-log-view:not([hidden])) .activity-log-header span:not(.activity-log-live){
  font-size:11px!important;
}
.modal.site-function-panel:has(.activity-log-view:not([hidden])) .activity-log-columns{
  font-size:9px!important;
}
.modal.site-function-panel:has(.activity-log-view:not([hidden])) .activity-log-row{
  padding-top:11px!important;
  padding-bottom:11px!important;
}
.modal.site-function-panel:has(.activity-log-view:not([hidden])) .activity-log-row time strong{
  font-size:11px!important;
}
.modal.site-function-panel:has(.activity-log-view:not([hidden])) .activity-log-row time span{
  font-size:10px!important;
}
.modal.site-function-panel:has(.activity-log-view:not([hidden])) .activity-log-main strong{
  font-size:12px!important;
}
.modal.site-function-panel:has(.activity-log-view:not([hidden])) .activity-log-main span{
  font-size:10px!important;
  line-height:1.4!important;
}
.modal.site-function-panel:has(.activity-log-view:not([hidden])) .activity-log-actor{
  font-size:11px!important;
}
.modal.site-function-panel:has(.activity-log-view:not([hidden])) #activityLogStatus{
  min-height:16px!important;
  margin-top:4px!important;
  font-size:11px!important;
}
.modal.site-function-panel:has(.activity-log-view:not([hidden])) > .modal-primary{
  margin-top:4px!important;
}


/* =========================================================
   v102 — UI readability pass
   Calendar month/upcoming/detail + Add Event primary placement
   ========================================================= */

/* Add Event: primary action sits directly below the recurring planner,
   before the potentially long Upcoming Events list. */
.modal.site-function-panel:has(.event-composer:not([hidden])) > .modal-primary{
  display:none!important;
}
.event-inline-primary-row{
  display:flex;
  justify-content:flex-start;
  align-items:center;
  margin:12px 0 10px;
}
.event-inline-primary{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  min-width:190px;
  margin:0!important;
}
.event-inline-primary:disabled{opacity:.62;cursor:wait}

/* Month view: prioritize readability over squeezing three tiny rows in.
   Two full rows remain visible; overflow is handled by +N more. */
.calendar-site-page .calendar-day{
  padding:4px 6px!important;
}
.calendar-site-page .calendar-day-top{
  min-height:19px!important;
  height:19px!important;
  margin-bottom:2px!important;
}
.calendar-site-page .calendar-day-number{
  font-size:clamp(10px,.68vw,12px)!important;
}
.calendar-site-page .calendar-day-count{
  font-size:9px!important;
}
.calendar-site-page .calendar-day-events{
  display:flex!important;
  flex-direction:column!important;
  gap:2px!important;
  margin-top:0!important;
  overflow:hidden!important;
}
.calendar-site-page .calendar-chip.is-compact{
  flex:0 0 21px!important;
  height:21px!important;
  min-height:21px!important;
  margin:0!important;
  padding:2px 6px!important;
  gap:5px!important;
  border-left-width:3px!important;
  border-radius:4px!important;
  opacity:1!important;
}
.calendar-site-page .calendar-chip.is-compact.is-past{opacity:.76!important}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-icon{
  flex:0 0 auto!important;
  font-size:9px!important;
}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-copy{
  min-width:0!important;
  width:100%!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:6px!important;
}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-copy strong{
  min-width:0!important;
  font-size:clamp(9px,.62vw,11px)!important;
  line-height:1.1!important;
  font-weight:800!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-copy small{
  margin:0!important;
  flex:0 0 auto!important;
  font-size:clamp(8px,.53vw,9.5px)!important;
  line-height:1!important;
  color:#c5d0d6!important;
  font-weight:700!important;
}
.calendar-site-page .calendar-more{
  display:block!important;
  flex:0 0 18px!important;
  height:18px!important;
  min-height:18px!important;
  margin:1px 0 0!important;
  padding:0 6px!important;
  border:1px solid rgba(238,176,65,.42)!important;
  border-radius:4px!important;
  background:rgba(238,176,65,.10)!important;
  color:#f1bc5b!important;
  font-size:8.5px!important;
  line-height:16px!important;
  font-weight:800!important;
}

/* Calendar lower information area: use the available room and make
   Upcoming Events + selected event details comfortably readable. */
.calendar-site-page .calendar-side-title{
  font-size:clamp(9px,.62vw,11px)!important;
}
.calendar-site-page .calendar-upcoming-list{
  max-height:120px!important;
  gap:3px!important;
}
.calendar-site-page .calendar-upcoming-row{
  min-height:27px!important;
  grid-template-columns:48px 42px minmax(0,1fr) 14px!important;
  gap:7px!important;
  padding:5px 5px 5px 8px!important;
  border-left-width:3px!important;
}
.calendar-site-page .calendar-upcoming-row strong{
  font-size:clamp(10px,.7vw,12px)!important;
  line-height:1.2!important;
  font-weight:800!important;
}
.calendar-site-page .upcoming-date,
.calendar-site-page .upcoming-time{
  font-size:clamp(9px,.6vw,10.5px)!important;
  line-height:1.2!important;
  color:#9fb0ba!important;
}
.calendar-site-page .upcoming-arrow{
  font-size:13px!important;
  color:#dce5ea!important;
}
.calendar-site-page .calendar-event-detail{
  margin-top:10px!important;
  padding:13px 15px 14px!important;
  border-color:rgba(243,181,77,.36)!important;
  background:linear-gradient(180deg,rgba(27,22,14,.68),rgba(6,12,17,.86))!important;
}
.calendar-site-page .calendar-event-detail .event-detail-kicker{
  font-size:10px!important;
}
.calendar-site-page .calendar-event-detail h3{
  margin-top:5px!important;
  margin-bottom:7px!important;
  font-size:clamp(17px,1.08vw,20px)!important;
  line-height:1.15!important;
}
.calendar-site-page .calendar-event-detail .event-detail-meta{
  font-size:clamp(10px,.66vw,11.5px)!important;
  line-height:1.45!important;
  color:#aebbc4!important;
}
.calendar-site-page .calendar-event-detail p{
  margin:10px 0!important;
  font-size:clamp(11px,.74vw,13px)!important;
  line-height:1.5!important;
  color:#d2dbe1!important;
}
.calendar-site-page .calendar-event-detail .event-detail-reminders span{
  padding:5px 8px!important;
  font-size:9.5px!important;
}
.calendar-site-page .calendar-event-detail .event-detail-actions{
  gap:8px!important;
  margin-top:10px!important;
}
.calendar-site-page .calendar-event-detail .planned-action{
  min-height:31px!important;
  padding:6px 10px!important;
  font-size:11px!important;
}
.calendar-site-page .calendar-event-detail .event-detail-close{
  width:30px!important;
  height:30px!important;
  font-size:16px!important;
}

/* Activity Log v101 readability remains part of this UI pass; give the
   list a little more breathing room without making the panel taller. */
.modal.site-function-panel:has(.activity-log-view:not([hidden])) .activity-log-list{
  line-height:1.25!important;
}

/* =========================================================
   v103 — Calendar correction
   Keep month readable without hiding 2/3-event days.
   Compact lower information cards instead of stretching empty space.
   ========================================================= */

/* The bottom information cards should size to their own content. */
.calendar-site-page .calendar-command-sidebar{
  align-items:start!important;
}
.calendar-site-page .calendar-side-card{
  align-self:start!important;
}
.calendar-site-page .calendar-mini-card,
.calendar-site-page .calendar-command-sidebar > .calendar-side-card:not(.calendar-upcoming-card){
  height:auto!important;
  min-height:0!important;
}

/* Main month uses only the weeks actually needed by that month.
   Five-week months therefore have noticeably more room per day. */
.calendar-site-page .calendar-month-grid.war-month-grid{
  grid-template-rows:repeat(var(--month-weeks,6),minmax(0,1fr))!important;
  height:calc(100% - 28px)!important;
  min-height:0!important;
}
.calendar-site-page .calendar-day{
  min-height:0!important;
  overflow:hidden!important;
}

/* Readable compact rows: three events are shown when a day has exactly
   three; 4+ uses two rows plus a clear +N more action. */
.calendar-site-page .calendar-day-events{
  gap:2px!important;
  overflow:hidden!important;
}
.calendar-site-page .calendar-chip.is-compact{
  flex:0 0 18px!important;
  height:18px!important;
  min-height:18px!important;
  padding:2px 5px!important;
}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-icon{
  font-size:8px!important;
}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-copy strong{
  font-size:clamp(8.5px,.58vw,10.5px)!important;
}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-copy small{
  font-size:clamp(7.5px,.5vw,9px)!important;
}
.calendar-site-page .calendar-more{
  flex:0 0 17px!important;
  height:17px!important;
  min-height:17px!important;
  line-height:15px!important;
  font-size:8px!important;
  cursor:help!important;
}

/* Keep the larger v102 text, but don't force the whole bottom row to
   become a tall empty block because Event Detail is open. */
.calendar-site-page .calendar-upcoming-card{
  align-self:start!important;
}

@media(max-width:900px){
  .calendar-site-page .calendar-month-grid.war-month-grid{
    height:auto!important;
    grid-template-rows:none!important;
  }
  .calendar-site-page .calendar-day{min-height:72px!important}
}


/* =========================================================
   v104 — requested UI correction pass
   Calendar gets real vertical room; 3 events remain visible.
   Announcement primary action moved above the lists.
   Dimension shows Tools + Mini Guides.
   ========================================================= */

/* Announcements: publish action belongs directly below the composer,
   not after the long Active Announcements / External Feed lists. */
.modal.site-function-panel:has(.announcement-composer:not([hidden])) > .modal-primary{
  display:none!important;
}
.announcement-inline-primary-row{
  display:flex!important;
  justify-content:flex-start!important;
  align-items:center!important;
  margin:10px 0 12px!important;
}
.announcement-inline-primary{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:210px!important;
  margin:0!important;
}

/* Calendar: stop compressing the month into the top half of the page.
   The lower information row is allowed to move down, as requested. */
@media (min-width:901px){
  .calendar-site-page .calendar-reference-board.calendar-month-board{
    height:clamp(620px,68vh,760px)!important;
    min-height:620px!important;
  }
  .calendar-site-page .calendar-reference-body{
    grid-template-rows:minmax(0,1fr) auto!important;
  }
  .calendar-site-page .calendar-command-sidebar{
    margin-top:0!important;
  }
}

/* Month day cells: readable event bars, three visible before +N more. */
.calendar-site-page .calendar-day{
  padding:5px 7px!important;
}
.calendar-site-page .calendar-day-top{
  min-height:21px!important;
  height:21px!important;
  margin-bottom:3px!important;
}
.calendar-site-page .calendar-day-number{
  font-size:12px!important;
}
.calendar-site-page .calendar-day-count{
  font-size:9px!important;
}
.calendar-site-page .calendar-day-events{
  gap:3px!important;
  overflow:hidden!important;
}
.calendar-site-page .calendar-chip.is-compact{
  flex:0 0 23px!important;
  height:23px!important;
  min-height:23px!important;
  padding:3px 7px!important;
  gap:6px!important;
  border-left-width:3px!important;
}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-icon{
  font-size:10px!important;
}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-copy strong{
  font-size:11px!important;
  line-height:1.05!important;
}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-copy small{
  font-size:9px!important;
  line-height:1!important;
}
.calendar-site-page .calendar-more{
  flex:0 0 20px!important;
  height:20px!important;
  min-height:20px!important;
  line-height:18px!important;
  font-size:9px!important;
  font-weight:900!important;
}

/* Keep the bottom info useful but don't stretch the left cards to match
   an open detail panel on the right. */
.calendar-site-page .calendar-command-sidebar{
  align-items:start!important;
  padding-top:8px!important;
  padding-bottom:8px!important;
}
.calendar-site-page .calendar-mini-card,
.calendar-site-page .calendar-command-sidebar > .calendar-side-card:not(.calendar-upcoming-card){
  align-self:start!important;
  height:auto!important;
  min-height:0!important;
}

/* Dimension Tools + Mini Guides */
.dimension-tools-guides{
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid rgba(218,151,45,.32);
}
.dimension-section-head,.dimension-guides-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
.dimension-section-head small{
  display:block;
  color:#f2b340;
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
}
.dimension-section-head strong,.dimension-guides-head strong{
  display:block;
  margin-top:3px;
  color:#f2f5f7;
  font-size:16px;
}
.dimension-section-head>span,.dimension-guides-head>span{
  color:#91a5b2;
  font-size:10px;
}
.dimension-tool-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-bottom:16px;
}
.dimension-tool-card{
  display:flex;
  gap:10px;
  min-width:0;
  padding:12px;
  border:1px solid rgba(99,132,151,.3);
  border-radius:6px;
  background:linear-gradient(180deg,rgba(10,31,42,.92),rgba(5,20,29,.92));
}
.dimension-tool-icon{
  flex:0 0 34px;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:1px solid rgba(232,169,58,.4);
  border-radius:6px;
  background:rgba(236,169,55,.08);
  font-size:18px;
}
.dimension-tool-card strong{color:#f4f7f9;font-size:13px}
.dimension-tool-card p{margin:5px 0;color:#a9bbc6;font-size:10px;line-height:1.45}
.dimension-tool-card small{color:#7f939f;font-size:9px;line-height:1.4}
.dimension-guide-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.dimension-guide-card{
  min-width:0;
  padding:12px;
  border:1px solid rgba(91,122,140,.3);
  border-radius:6px;
  background:#081923;
}
.dimension-guide-card header small{display:block;color:#e8aa3e;font-size:9px;font-weight:900;letter-spacing:.1em}
.dimension-guide-card header strong{display:block;margin-top:3px;color:#eef3f6;font-size:13px}
.dimension-guide-card p{color:#a8bac5;font-size:10px;line-height:1.45}
.dimension-guide-block{margin-top:8px}
.dimension-guide-block b{color:#dfe8ed;font-size:10px}
.dimension-guide-block ul{margin:5px 0 0 16px;padding:0;color:#9fb1bc;font-size:9.5px;line-height:1.45}
.dimension-tools-empty{padding:12px;border:1px dashed rgba(101,132,149,.35);color:#90a5b1;font-size:10px}
@media(max-width:900px){
  .dimension-tool-grid,.dimension-guide-grid{grid-template-columns:1fr!important}
}
/* =========================================================
   v107 — only previously open items
   Calendar month density + day hover overview, unlimited recurring
   weekly slots, and fixed visual announcement layouts.
   ========================================================= */
@media (min-width:901px){
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-reference-board.calendar-month-board{
    height:auto!important;
    min-height:760px!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-reference-body{
    height:auto!important;
    grid-template-rows:minmax(520px,1fr) 220px!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-grid{
    min-height:520px!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-month-grid.war-month-grid{
    height:calc(100% - 28px)!important;
    grid-template-rows:repeat(var(--month-weeks,6),minmax(96px,1fr))!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-command-sidebar{
    height:220px!important;
    min-height:220px!important;
    overflow:hidden!important;
  }
}
.calendar-site-page .calendar-day{padding:6px 8px!important;overflow:hidden!important}
.calendar-site-page .calendar-day-top{height:20px!important;min-height:20px!important;margin-bottom:3px!important}
.calendar-site-page .calendar-day-events{display:flex!important;flex-direction:column!important;gap:3px!important;overflow:hidden!important}
.calendar-site-page .calendar-chip.is-compact{height:22px!important;min-height:22px!important;flex:0 0 22px!important;padding:2px 6px!important}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-copy strong{font-size:10.5px!important;line-height:1!important}
.calendar-site-page .calendar-chip.is-compact .calendar-chip-copy small{font-size:8.5px!important}
.calendar-site-page .calendar-more{height:18px!important;min-height:18px!important;flex:0 0 18px!important;padding:0 6px!important;text-align:left!important;color:#d7e2e8!important;background:transparent!important;border:0!important;font-size:9px!important;font-weight:900!important;cursor:pointer!important}
.calendar-site-page .calendar-more:hover{color:#ffc65d!important;text-decoration:underline!important}
.calendar-day-tooltip{position:fixed;z-index:999999;min-width:240px;max-width:340px;padding:10px 11px;border:1px solid rgba(232,166,55,.72);border-radius:7px;background:rgba(3,12,18,.98);box-shadow:0 14px 36px rgba(0,0,0,.52);pointer-events:none;color:#e9f0f4;font-size:11px}
.calendar-day-tooltip>strong{display:block;margin-bottom:7px;color:#ffc45a;font-size:11px;text-transform:capitalize}
.calendar-day-tooltip>div{display:grid;gap:4px}
.calendar-day-tooltip span{display:grid;grid-template-columns:48px minmax(0,1fr);gap:7px;align-items:center;padding:4px 6px;border-left:3px solid #7c49c8;border-radius:4px;background:rgba(255,255,255,.035)}
.calendar-day-tooltip span[data-type="city_cap"]{border-left-color:#ef6f4d}.calendar-day-tooltip span[data-type="zombie_raid"],.calendar-day-tooltip span[data-type="season_reset"]{border-left-color:#5ab4df}
.calendar-day-tooltip b{color:#b8c7cf;font-size:9px}

.recurring-slot-list{display:grid;gap:8px}
.recurring-slot{position:relative;display:grid!important;grid-template-columns:minmax(110px,.7fr) minmax(150px,1fr) minmax(125px,.7fr) 34px!important;gap:8px!important;align-items:center!important}
.recurring-slot strong{font-size:11px;color:#dfe8ed}
.recurring-add-slot,.recurring-remove-slot{border:1px solid rgba(231,166,57,.42);border-radius:6px;background:#081722;color:#f4bd59;font-weight:900;cursor:pointer}
.recurring-add-slot{margin-top:9px;padding:8px 11px}
.recurring-remove-slot{width:32px;height:32px;font-size:17px}
.recurring-add-slot:hover,.recurring-remove-slot:hover{border-color:#e8ab42;background:#102330}
@media(max-width:900px){.recurring-slot{grid-template-columns:1fr!important}.recurring-remove-slot{justify-self:end}}

.announcement-item[data-visual-template="command"]{border-left:4px solid #d5a044!important}
.announcement-item[data-visual-template="notice"]{border-left:4px solid #4b9fcb!important;background:linear-gradient(90deg,rgba(28,65,85,.30),rgba(5,17,24,.94))!important}
.announcement-item[data-visual-template="alert"]{border:1px solid rgba(229,84,62,.58)!important;border-left:5px solid #e5543e!important;background:linear-gradient(90deg,rgba(91,31,25,.42),rgba(7,17,22,.95))!important}
.announcement-item[data-visual-template="image"]{display:grid!important;grid-template-columns:150px minmax(0,1fr) auto!important;align-items:stretch!important}
.announcement-item[data-visual-template="image"] .announcement-thumb{width:150px!important;height:100%!important;min-height:96px!important;object-fit:cover!important;border-radius:5px!important}
.dimension-config>.dimension-tools-guides{margin-top:0!important;padding-top:0!important;border-top:0!important;margin-bottom:18px!important}
.dimension-config-fields{padding-top:14px!important;border-top:1px solid rgba(218,151,45,.32)!important}

/* =========================================================
   v108 — targeted regression repair only
   1) Calendar Month: stable month grid + compact four-panel info row.
   2) Dimension / Doomed Land quick action: reliable clickable overlay.
   No unrelated dashboard/page styling changes.
   ========================================================= */

/* Dimension card: both the original hotspot and the live text overlay are clickable. */
.hotspot[data-action="dimension"]{
  z-index:11!important;
  pointer-events:auto!important;
}
.dimension-overlay[data-site-action="dimension"]{
  z-index:12!important;
  pointer-events:auto!important;
  cursor:pointer!important;
  border:0!important;
  font:inherit!important;
  text-align:left!important;
  appearance:none!important;
}
.dimension-overlay[data-site-action="dimension"]:hover{
  background:linear-gradient(180deg,rgba(7,13,19,0) 0%,rgba(7,13,19,.28) 22%,rgba(22,32,38,.92) 56%,rgba(30,25,16,.97) 100%)!important;
}
.dimension-overlay[data-site-action="dimension"]:focus-visible{
  outline:2px solid #f1b64a!important;
  outline-offset:-2px!important;
}

/* Month view: make the grid and lower information row two independent blocks. */
@media (min-width:901px){
  .calendar-site-page{
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-reference-board.calendar-month-board{
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-reference-body{
    height:auto!important;
    min-height:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    overflow:visible!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-grid{
    min-height:590px!important;
    height:auto!important;
    overflow:hidden!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-month-grid.war-month-grid{
    height:auto!important;
    min-height:560px!important;
    grid-template-rows:repeat(var(--month-weeks,6),minmax(104px,1fr))!important;
  }

  /* Three information cards when no event is selected. */
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-command-sidebar{
    display:grid!important;
    grid-template-columns:minmax(230px,.88fr) minmax(250px,.96fr) minmax(390px,1.55fr)!important;
    align-items:stretch!important;
    gap:10px!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:10px!important;
    overflow:visible!important;
  }
  /* Event detail becomes a real fourth card instead of stretching the Upcoming card. */
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-command-sidebar:has(.calendar-event-detail:not([hidden])){
    grid-template-columns:minmax(205px,.75fr) minmax(220px,.82fr) minmax(300px,1.2fr) minmax(360px,1.45fr)!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-side-card{
    align-self:stretch!important;
    height:220px!important;
    min-height:220px!important;
    max-height:220px!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-upcoming-card{
    display:flex!important;
    flex-direction:column!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-upcoming-list{
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-event-detail.calendar-detail-card:not([hidden]){
    display:block!important;
    position:relative!important;
    inset:auto!important;
    width:auto!important;
    max-width:none!important;
    height:220px!important;
    min-height:220px!important;
    max-height:220px!important;
    margin:0!important;
    padding:13px 15px 14px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    box-shadow:none!important;
  }
}

/* Month cells: show three compact event rows; +N more remains visible below them. */
.calendar-site-page .calendar-day{
  padding:6px 8px!important;
}
.calendar-site-page .calendar-day-top{
  height:20px!important;
  min-height:20px!important;
  margin-bottom:4px!important;
}
.calendar-site-page .calendar-day-events{
  display:flex!important;
  flex-direction:column!important;
  gap:3px!important;
  min-height:0!important;
  overflow:hidden!important;
}
.calendar-site-page .calendar-chip.is-compact{
  flex:0 0 22px!important;
  height:22px!important;
  min-height:22px!important;
  padding:2px 6px!important;
}
.calendar-site-page .calendar-more{
  display:block!important;
  flex:0 0 18px!important;
  height:18px!important;
  min-height:18px!important;
  margin:0!important;
  padding:0 6px!important;
  border:0!important;
  background:transparent!important;
  color:#e4edf2!important;
  font-size:9px!important;
  line-height:18px!important;
  font-weight:900!important;
  text-align:left!important;
  cursor:pointer!important;
}
.calendar-site-page .calendar-more:hover{
  color:#ffc45a!important;
  text-decoration:underline!important;
}

@media (max-width:1250px) and (min-width:901px){
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-command-sidebar,
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-command-sidebar:has(.calendar-event-detail:not([hidden])){
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-side-card,
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-event-detail.calendar-detail-card:not([hidden]){
    height:205px!important;
    min-height:205px!important;
    max-height:205px!important;
  }
}

/* =========================================================
   v109 — Calendar Month final layout lock to approved mockup
   Scope: Calendar Month only. Do not alter other pages/views.
   ========================================================= */
@media (min-width:901px){
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active){
    left:15.15%!important;
    right:0!important;
    width:auto!important;
    max-width:none!important;
    padding:8px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    box-sizing:border-box!important;
    scrollbar-gutter:auto!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-reference-board.calendar-month-board{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-reference-header{
    width:100%!important;
    max-width:none!important;
    box-sizing:border-box!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-reference-body{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    width:100%!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-grid{
    grid-row:1!important;
    width:100%!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:#040b10!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-weekdays{
    height:28px!important;
    min-height:28px!important;
    margin:0!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-month-grid.war-month-grid{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    grid-template-columns:repeat(7,minmax(0,1fr))!important;
    grid-template-rows:repeat(var(--month-weeks,6),98px)!important;
    gap:1px!important;
    overflow:hidden!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-day{
    min-height:98px!important;
    height:98px!important;
    padding:5px 8px!important;
    overflow:hidden!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-day-top{
    height:18px!important;
    min-height:18px!important;
    margin-bottom:3px!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-day-events{
    display:flex!important;
    flex-direction:column!important;
    gap:3px!important;
    min-height:0!important;
    margin:0!important;
    overflow:hidden!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-chip.is-compact{
    display:grid!important;
    grid-template-columns:13px minmax(0,1fr)!important;
    align-items:center!important;
    flex:0 0 20px!important;
    width:100%!important;
    height:20px!important;
    min-height:20px!important;
    padding:2px 5px!important;
    gap:4px!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-chip.is-compact .calendar-chip-icon{
    font-size:9px!important;
    line-height:1!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-chip.is-compact .calendar-chip-copy{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:6px!important;
    min-width:0!important;
    line-height:1!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-chip.is-compact .calendar-chip-copy strong{
    display:block!important;
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:9px!important;
    line-height:1!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-chip.is-compact .calendar-chip-copy small{
    display:block!important;
    margin:0!important;
    color:#c6d0d6!important;
    font-size:8px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-more{
    flex:0 0 16px!important;
    height:16px!important;
    min-height:16px!important;
    padding:0 5px!important;
    line-height:16px!important;
    font-size:9px!important;
    color:#e7edf1!important;
  }

  /* Exactly the four compact cards from the approved mockup. */
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-command-sidebar,
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-command-sidebar:has(.calendar-event-detail:not([hidden])){
    grid-row:2!important;
    display:grid!important;
    grid-template-columns:minmax(190px,.88fr) minmax(210px,.92fr) minmax(310px,1.42fr) minmax(330px,1.48fr)!important;
    align-items:stretch!important;
    gap:10px!important;
    width:100%!important;
    max-width:none!important;
    height:198px!important;
    min-height:198px!important;
    margin:0!important;
    padding:10px!important;
    overflow:hidden!important;
    border-left:0!important;
    border-top:1px solid rgba(91,120,138,.28)!important;
    background:#07141c!important;
    box-sizing:border-box!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-side-card,
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-event-detail.calendar-detail-card:not([hidden]){
    align-self:stretch!important;
    width:auto!important;
    min-width:0!important;
    height:178px!important;
    min-height:178px!important;
    max-height:178px!important;
    margin:0!important;
    padding:11px 12px!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-upcoming-card{
    display:flex!important;
    flex-direction:column!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-upcoming-list{
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-event-detail.calendar-detail-card:not([hidden]){
    display:block!important;
    position:relative!important;
    inset:auto!important;
    max-width:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    box-shadow:none!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-event-detail.calendar-detail-card[hidden]{
    display:block!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
}

@media (max-width:1300px) and (min-width:901px){
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-command-sidebar,
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-command-sidebar:has(.calendar-event-detail:not([hidden])){
    grid-template-columns:minmax(170px,.8fr) minmax(185px,.86fr) minmax(270px,1.32fr) minmax(290px,1.4fr)!important;
    gap:7px!important;
  }
}


/* =========================================================
   v110 — Dimension card click repair only
   Keep the live overlay visual-only; one native hotspot owns the full card.
   ========================================================= */
.hotspot.dimension-card-hit{
  z-index:30!important;
  pointer-events:auto!important;
  cursor:pointer!important;
  touch-action:manipulation!important;
  user-select:none!important;
  -webkit-user-select:none!important;
}
.dimension-overlay{
  pointer-events:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
}


/* v112 — Dimension card reliability fix.
   Keep the original full-card hotspot and make the visible live overlay an
   independent click target as well. This avoids any dead area over the title. */
.dimension-overlay#dimensionCardOverlay{
  z-index:31!important;
  pointer-events:auto!important;
  cursor:pointer!important;
  user-select:none!important;
  -webkit-user-select:none!important;
}
.dimension-overlay#dimensionCardOverlay strong,
.dimension-overlay#dimensionCardOverlay span{
  pointer-events:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
}
.dimension-overlay#dimensionCardOverlay:focus-visible{
  outline:2px solid rgba(255,183,66,.95)!important;
  outline-offset:-2px!important;
}


/* =========================================================
   v113 targeted stabilization
   - Restore proven v105 Dimension click model: one transparent hotspot owns the full card.
   - Calendar Month must fit the viewport without page-level vertical scrolling/cropping.
   ========================================================= */
.hotspot[data-action="dimension"]{
  z-index:32!important;
  pointer-events:auto!important;
  cursor:pointer!important;
  user-select:none!important;
  -webkit-user-select:none!important;
}
.dimension-overlay#dimensionCardOverlay{
  z-index:9!important;
  pointer-events:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  cursor:default!important;
  outline:none!important;
}
.dimension-overlay#dimensionCardOverlay strong,
.dimension-overlay#dimensionCardOverlay span{
  pointer-events:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
}

@media (min-width:901px){
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active){
    top:8.9%!important;
    bottom:0!important;
    overflow:hidden!important;
    padding:8px!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-reference-board.calendar-month-board{
    height:100%!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-reference-header{
    flex:0 0 auto!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-reference-body{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr) 190px!important;
    overflow:hidden!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-grid{
    min-height:0!important;
    height:100%!important;
    overflow:hidden!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-month-grid.war-month-grid{
    height:calc(100% - 28px)!important;
    min-height:0!important;
    grid-template-rows:repeat(var(--month-weeks,6),minmax(0,1fr))!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-day{
    height:auto!important;
    min-height:0!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-command-sidebar,
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-command-sidebar:has(.calendar-event-detail:not([hidden])){
    height:190px!important;
    min-height:190px!important;
    overflow:hidden!important;
  }
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-side-card,
  .calendar-site-page:has(.calendar-view-btn[data-calendar-view="month"].is-active) .calendar-event-detail.calendar-detail-card:not([hidden]){
    height:170px!important;
    min-height:170px!important;
    max-height:170px!important;
  }
}

/* =========================================================
   v114 — DOOMED LAND CLICK: exact v105 interaction lock
   Do not modify without a reproduced failure.
   The original hotspot is the ONLY interactive layer.
   The dynamic text overlay is visual only and passes every pointer event through.
   ========================================================= */
.hotspot[data-action="dimension"]{
  z-index:8!important;
  pointer-events:auto!important;
  cursor:pointer!important;
}
#dimensionCardOverlay.dimension-overlay{
  left:35.45%!important;
  top:39.9%!important;
  width:18.15%!important;
  height:7.45%!important;
  z-index:9!important;
  pointer-events:none!important;
  cursor:default!important;
}
#dimensionCardOverlay.dimension-overlay,
#dimensionCardOverlay.dimension-overlay *{
  pointer-events:none!important;
  user-select:none!important;
}

/* v116 — Members page. New UI only; existing Warboard layout remains untouched. */
.members-nav-button{
  position:absolute;left:0;top:52.95%;width:15.15%;height:5%;z-index:9;
  display:flex;align-items:center;gap:1.18vw;padding:0 1.1vw 0 1.35vw;
  border:0;background:transparent;color:#c0cad3;cursor:pointer;text-align:left;
  font:inherit;letter-spacing:0;box-shadow:none
}
.members-nav-icon{width:1.7vw;min-width:22px;max-width:30px;height:1.7vw;min-height:22px;max-height:30px;display:grid;place-items:center;color:#aebdca}
.members-nav-icon svg{width:100%;height:100%;display:block}
.members-nav-button strong{font-size:clamp(13px,.93vw,17px);font-weight:500;line-height:1.1;text-transform:none}
.members-nav-button:hover,.members-nav-button:focus-visible{color:#f0bc5d;background:linear-gradient(90deg,rgba(108,72,25,.55),rgba(8,18,26,.96));outline:none}
.members-nav-button:hover .members-nav-icon,.members-nav-button:focus-visible .members-nav-icon{color:#f0bc5d}

.members-page{display:grid;gap:14px;min-width:0}
.members-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.member-stat{padding:12px 14px;border:1px solid #263743;background:rgba(5,15,22,.82);border-radius:5px}
.member-stat small{display:block;color:#7f93a2;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.member-stat strong{display:block;margin-top:4px;color:#e8eef2;font-size:20px}
.member-stat.is-linked strong{color:#7ed8b1}.member-stat.is-unlinked strong{color:#e9b05a}
.members-feed-note{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:9px 12px;border:1px solid #31414c;background:rgba(9,22,30,.86);border-radius:4px;color:#9eb0bc;font-size:12px}
.members-feed-note strong{color:#e9b05a}
.members-toolbar{display:flex;gap:10px;align-items:center}
.members-search{width:min(430px,100%);padding:10px 12px;border:1px solid #344854;border-radius:4px;background:#09151d;color:#eef3f6}
.members-table-wrap{border:1px solid #2a3b46;border-radius:5px;overflow:auto;background:rgba(5,14,20,.86)}
.members-table{width:100%;border-collapse:collapse;min-width:960px}
.members-table th{position:sticky;top:0;z-index:1;padding:9px 10px;background:#0d1b24;color:#8499a7;font-size:10px;letter-spacing:.08em;text-transform:uppercase;text-align:left;border-bottom:1px solid #334650}
.members-table td{padding:10px;border-bottom:1px solid rgba(63,80,91,.45);color:#cbd6dd;font-size:12px;vertical-align:middle}
.members-table tr:last-child td{border-bottom:0}
.members-table tr[data-member-open]{cursor:pointer}
.members-table tr[data-member-open]:hover td{background:rgba(224,163,67,.06)}
.member-name-cell strong{display:block;color:#eef4f6;font-size:13px}.member-name-cell small{display:block;color:#6f8491;margin-top:2px}
.member-rank{display:inline-flex;min-width:32px;justify-content:center;padding:3px 7px;border:1px solid #66542c;border-radius:999px;background:#211b10;color:#f0c166;font-weight:900}
.account-pill{display:inline-flex;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;border:1px solid #344652;color:#9baab4;background:#0b1720}
.account-pill.is-linked{border-color:#2d6c57;color:#8ae1bb;background:#0b241c}.account-pill.is-unlinked{border-color:#705629;color:#efbd68;background:#241b0d}
.members-empty{padding:28px;text-align:center;color:#879aa6}
.member-detail{display:grid;gap:14px}.member-detail-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.member-back{border:1px solid #3a4b56;background:#0b1820;color:#d8e0e5;border-radius:4px;padding:8px 11px;cursor:pointer}.member-detail-title small{display:block;color:#81939f;font-size:10px;letter-spacing:.1em}.member-detail-title strong{display:block;font-size:24px;color:#f0f4f6;margin-top:2px}
.member-detail-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:14px}.member-panel{border:1px solid #2d3f4a;border-radius:5px;background:rgba(6,16,23,.9);padding:14px}.member-panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.member-panel-head small{color:#8295a2;font-size:10px;font-weight:900;letter-spacing:.09em}.member-panel-head strong{color:#f0b653;font-size:14px}.member-info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.member-info{padding:9px 10px;border:1px solid #243640;border-radius:4px;background:#0a171f}.member-info span{display:block;color:#788d99;font-size:10px;text-transform:uppercase;letter-spacing:.06em}.member-info strong{display:block;margin-top:4px;color:#e0e8ec;font-size:13px;word-break:break-word}.member-account-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.member-account-form label{display:grid;gap:5px;color:#8699a5;font-size:11px}.member-account-form .full{grid-column:1/-1}.member-account-actions{grid-column:1/-1;display:flex;gap:8px;align-items:center;flex-wrap:wrap}.member-account-actions button{padding:8px 11px;border-radius:4px;border:1px solid #51606a;background:#111e26;color:#dfe7eb;cursor:pointer;font-weight:800}.member-account-actions .primary{border-color:#a87125;background:#4b3212;color:#ffd37c}.member-account-actions .danger{border-color:#784544;color:#f0a3a0}.member-account-status{grid-column:1/-1;min-height:18px;color:#8ea3af;font-size:11px}.member-account-status[data-state="error"]{color:#ef9992}.member-account-status[data-state="success"]{color:#7fd5ad}.member-link-existing{grid-column:1/-1;padding-top:8px;border-top:1px solid #263844}.member-link-existing strong{display:block;margin-bottom:7px;color:#cbd7dd;font-size:12px}.member-link-row{display:grid;grid-template-columns:1fr auto;gap:8px}
@media(max-width:950px){.members-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.member-detail-grid{grid-template-columns:1fr}}
@media(max-width:560px){.members-summary,.member-info-grid,.member-account-form{grid-template-columns:1fr}.member-account-form .full{grid-column:auto}.members-feed-note{align-items:flex-start;flex-direction:column}}


/* v121 — Doomed Land TM Calculator only */
.dimension-tool-button{width:100%;text-align:left;color:inherit;font:inherit;cursor:pointer}
.dimension-tool-button:hover{border-color:rgba(232,169,58,.72);background:linear-gradient(180deg,rgba(18,43,55,.96),rgba(7,25,35,.96))}
.tm-calculator-page{display:grid;gap:12px;min-width:0}
.tm-loading{padding:28px;border:1px solid rgba(98,130,148,.35);background:#071722;color:#a9bbc6}
.tm-calc-header{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;padding:2px 2px 10px;border-bottom:1px solid rgba(218,151,45,.35)}
.tm-calc-header small{color:#e9aa39;font-weight:900;letter-spacing:.13em}.tm-calc-header h2{margin:3px 0 2px;color:#f4f7f9;font-size:27px}.tm-calc-header p{margin:0;color:#9eb0bc;font-size:11px}
.tm-source-box{min-width:260px;padding:10px 12px;border:1px solid rgba(86,119,138,.38);background:#081923;border-radius:6px;text-align:right}.tm-source-box strong,.tm-source-box span{display:block}.tm-source-box strong{color:#dfe8ed;font-size:11px}.tm-source-box span{margin-top:3px;color:#7f939f;font-size:9px}
.tm-message{padding:9px 12px;border:1px solid rgba(232,169,58,.5);background:rgba(232,169,58,.08);color:#f2c46e;border-radius:6px;font-size:10px}
.tm-main-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:12px;align-items:start}
.tm-column{display:grid;gap:12px;align-content:start;min-width:0}
.tm-panel{min-width:0;padding:13px;border:1px solid rgba(90,124,145,.38);border-radius:7px;background:linear-gradient(180deg,rgba(9,29,40,.96),rgba(5,20,29,.96))}
.tm-panel-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:11px}.tm-panel-title strong{font-size:14px;color:#eef3f6}.tm-panel-title span{font-size:9px;color:#8fa3af}
.tm-camp-grid,.tm-scenario-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.tm-camp-grid label,.tm-scenario-grid label,.tm-notes-label{display:grid;gap:5px;color:#9fb1bc;font-size:9px}
.tm-camp-grid .text-input,.tm-scenario-grid .text-input,.tm-notes-label .text-input{min-width:0}
.tm-notes-label{margin-top:9px}.tm-notes-label textarea{min-height:60px;resize:vertical}.tm-camp-actions{display:flex;align-items:center;gap:10px;margin-top:9px}.tm-camp-actions span{color:#7f939f;font-size:9px}
.tm-progress-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.tm-progress-grid article{padding:12px;border:1px solid rgba(88,121,140,.3);border-radius:6px;background:#0a202d}.tm-progress-grid b{display:block;color:#cbd9e1;font-size:10px}.tm-progress-grid strong{display:block;margin-top:5px;color:#80bdff;font-size:21px}.tm-progress-grid .prosperity strong{color:#f0b33f}.tm-progress-grid small{display:block;margin-top:6px;color:#8fa3af;font-size:9px}.tm-bar{height:8px;margin-top:8px;border:1px solid rgba(101,132,149,.3);border-radius:99px;background:#07131b;overflow:hidden}.tm-bar i{display:block;height:100%;background:#53a7f6}.tm-progress-grid .prosperity .tm-bar i{background:#e9aa39}
.tm-level-layout{display:grid;grid-template-columns:118px 1fr;gap:12px}.tm-level-box{display:grid;place-items:center;padding:12px;border:1px solid rgba(232,169,58,.7);background:rgba(232,169,58,.04)}.tm-level-box span{font-size:12px;font-weight:900}.tm-level-box strong{font-size:46px;line-height:1;color:#f0b33f}.tm-level-box small{color:#dfe8ed}.tm-next-box{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:12px;background:#071923;border:1px solid rgba(91,123,142,.3)}.tm-next-box>span{grid-column:1/-1;color:#f0b33f;font-size:10px;font-weight:800}.tm-next-box div{padding:8px;border-left:2px solid rgba(232,169,58,.45)}.tm-next-box b,.tm-next-box strong{display:block}.tm-next-box b{color:#8fa3af;font-size:9px}.tm-next-box strong{color:#eef3f6;font-size:16px;margin-top:3px}
.tm-scenario-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.tm-mix-head{display:flex;justify-content:space-between;margin:11px 0 6px;color:#cdd8de;font-size:9px}.tm-mix-head small{color:#7f939f}.tm-mix-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.tm-mix-grid label{display:grid;grid-template-columns:1fr 62px;align-items:center;gap:6px;padding:6px 8px;border:1px solid rgba(91,123,142,.35);border-radius:5px;font-size:9px}.tm-mix-grid input{width:100%;min-width:0;background:#07131b;color:#eef3f6;border:1px solid rgba(91,123,142,.35);padding:6px}.tm-mix-grid .green{border-color:#2e9c5c}.tm-mix-grid .blue{border-color:#397fc1}.tm-mix-grid .gold{border-color:#aa812e}.tm-mix-grid .red{border-color:#a23f3f}
.tm-forecast-results{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}.tm-forecast-results article{padding:10px;background:#071923;border:1px solid rgba(91,123,142,.28)}.tm-forecast-results span,.tm-forecast-results strong,.tm-forecast-results small{display:block}.tm-forecast-results span{color:#8fa3af;font-size:8px;text-transform:uppercase;font-weight:800}.tm-forecast-results strong{margin-top:4px;color:#6db6ff;font-size:16px}.tm-forecast-results small{margin-top:3px;color:#879aa6;font-size:8px;line-height:1.35}
.tm-quality-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:10px}.tm-quality-buttons button{padding:8px;border:1px solid rgba(91,123,142,.35);background:#071923;color:#cbd8df;border-radius:5px;font-weight:800;cursor:pointer}.tm-quality-buttons button.green{border-color:#2e9c5c}.tm-quality-buttons button.blue{border-color:#397fc1}.tm-quality-buttons button.gold{border-color:#aa812e}.tm-quality-buttons button.red{border-color:#a23f3f}.tm-quality-buttons button.is-active{box-shadow:0 0 0 1px currentColor inset;background:rgba(236,169,55,.08);color:#f4c35f}
.tm-table{width:100%;border-collapse:collapse}.tm-table th,.tm-table td{padding:7px 8px;border-bottom:1px solid rgba(91,123,142,.22);text-align:left;font-size:9px}.tm-table th{color:#8fa3af;text-transform:uppercase;letter-spacing:.04em}.tm-table td{color:#d6e0e5}.tm-quality-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px}.tm-quality-dot.green{background:#35b96d}.tm-quality-dot.blue{background:#50a8ff}.tm-quality-dot.gold{background:#f2b340}.tm-quality-dot.red{background:#ef5454}.tm-level-table tr.is-current{background:rgba(232,169,58,.12)}.tm-level-table tr.is-current td{color:#f1bf5d}
.tm-missions-needed{display:grid;grid-template-columns:1fr 1fr;gap:9px}.tm-missions-needed article{padding:12px;border:1px solid rgba(91,123,142,.3);background:#081b26}.tm-missions-needed span,.tm-missions-needed strong,.tm-missions-needed small{display:block}.tm-missions-needed span{font-size:9px;color:#9fb1bc}.tm-missions-needed strong{margin-top:3px;font-size:24px;color:#f0b33f}.tm-missions-needed small{font-size:8px;color:#7f939f}.tm-recommendation{display:flex;align-items:center;gap:10px;margin-top:9px;padding:9px 10px;border:1px solid rgba(232,169,58,.5);background:rgba(232,169,58,.07)}.tm-recommendation b{color:#f0b33f;font-size:9px}.tm-recommendation span{font-size:10px;color:#e1e8eb}
.tm-current-missions{grid-column:1/-1}.tm-mission-list{display:grid;gap:6px}.tm-mission-row{display:grid;grid-template-columns:minmax(180px,1fr) 150px 150px;align-items:center;gap:10px;padding:8px 10px;border:1px solid rgba(91,123,142,.25);background:#071923}.tm-mission-row strong,.tm-mission-row small{display:block}.tm-mission-row strong{font-size:10px}.tm-mission-row small{margin-top:2px;color:#7f939f;font-size:8px}.tm-mission-row>span{font-size:9px;color:#b6c4cc}.tm-evidence-note{margin-top:8px;color:#8095a1;font-size:8px}.tm-empty{padding:12px;color:#8fa3af;font-size:9px}
@media(max-width:1000px){.tm-main-grid{grid-template-columns:1fr}.tm-column{gap:12px}.tm-scenario-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tm-current-missions{grid-column:auto}}
@media(max-width:700px){.tm-calc-header{align-items:flex-start;flex-direction:column}.tm-source-box{min-width:0;width:100%;text-align:left}.tm-camp-grid,.tm-scenario-grid,.tm-progress-grid,.tm-forecast-results,.tm-missions-needed{grid-template-columns:1fr}.tm-level-layout{grid-template-columns:1fr}.tm-mix-grid{grid-template-columns:1fr 1fr}.tm-mission-row{grid-template-columns:1fr}}

/* v124 — TM Calculator readability only: slightly larger text in the three lower data areas. */
.tm-mission-settings .tm-table th,
.tm-mission-settings .tm-table td,
.tm-level-table th,
.tm-level-table td{font-size:10px;line-height:1.35}
.tm-current-missions .tm-mission-row strong{font-size:11px;line-height:1.3}
.tm-current-missions .tm-mission-row small{font-size:9px;line-height:1.35}
.tm-current-missions .tm-mission-row>span{font-size:10px;line-height:1.35}
.tm-current-missions .tm-evidence-note{font-size:9px;line-height:1.4}

/* v126 self-registration / approval flow */
.owner-login-secondary{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding-top:.35rem;border-top:1px solid rgba(130,151,168,.18);color:#91a0ac;font-size:.82rem}
.owner-login-status.success{border-color:rgba(74,196,132,.38);background:rgba(74,196,132,.08);color:#8fe1b7}
.owner-signup-card{max-width:620px}
.owner-pending-card{grid-column:1/-1}
.owner-pending-user{grid-template-columns:minmax(0,1.5fr) minmax(120px,.55fr) auto auto}
.owner-pending-user .owner-managed-user-main strong{color:#f4f7fa;font-size:.92rem}
.owner-approval-pill{align-self:center;padding:.3rem .55rem;border-radius:999px;border:1px solid rgba(244,177,68,.38);background:rgba(244,177,68,.08);color:#f4b144;font-size:.7rem;font-weight:900;letter-spacing:.08em}
@media(max-width:760px){.owner-login-secondary{align-items:flex-start;flex-direction:column}.owner-pending-user{grid-template-columns:1fr}.owner-approval-pill{justify-self:start}}

/* =========================================================
   v127 — mobile-only dashboard/nav layer (desktop frozen)
   ========================================================= */
.mobile-app-shell{display:none}
.mobile-drawer-backdrop[hidden],.mobile-drawer[hidden]{display:none!important}

@media (max-width:760px){
  html,body{background:#050d14!important}
  .viewport{height:auto!important;min-height:100vh!important;overflow-y:auto!important;overflow-x:hidden!important}
  .stage{height:auto!important;min-height:100vh!important;overflow:visible!important;background:
    radial-gradient(circle at top right,rgba(196,132,41,.14),transparent 34%),
    linear-gradient(180deg,#08131d 0%,#071018 40%,#050d14 100%)!important}

  .dashboard-image,
  .warboard-top-banner,
  .topbar-control-mask,
  .notification-bell,
  .topbar-profile-live,
  .announcement-live-badge,
  .city-cap-live,
  .quick-dynamic-overlay,
  .diplomacy-card-skin,
  .daily-focus-card-skin,
  .par-card-skin,
  .right-live-mask,
  .alliance-roles-panel,
  .live-activity-panel,
  .live-events-panel,
  .live-clock-panel,
  .members-nav-button,
  .hotspot{
    display:none!important;
  }

  .mobile-app-shell{
    display:flex!important;
    flex-direction:column;
    min-height:100vh;
    position:relative;
    z-index:8;
    padding:calc(env(safe-area-inset-top,0px) + 10px) 14px calc(env(safe-area-inset-bottom,0px) + 88px);
    box-sizing:border-box;
    gap:14px;
  }

  .mobile-topbar-shell{
    display:grid;
    grid-template-columns:auto 1fr auto;
    gap:10px;
    align-items:center;
    position:sticky;
    top:0;
    z-index:20;
    padding:10px 0 4px;
    background:linear-gradient(180deg,rgba(5,13,20,.96),rgba(5,13,20,.76) 78%,rgba(5,13,20,0));
    backdrop-filter:blur(12px);
  }
  .mobile-menu-toggle,.mobile-icon-button,.mobile-drawer-close{
    border:1px solid rgba(240,173,62,.35);
    background:rgba(9,19,29,.94);
    color:#f6d18a;
    border-radius:14px;
    min-width:44px;
    min-height:44px;
    padding:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
    box-shadow:0 8px 20px rgba(0,0,0,.24);
  }
  .mobile-brand-block{min-width:0}
  .mobile-brand-block strong{display:block;color:#f3f6f8;font-size:19px;letter-spacing:.08em}
  .mobile-brand-block small{display:block;color:#b2bfca;font-size:10px;letter-spacing:.12em;text-transform:uppercase}
  .mobile-topbar-actions{display:flex;align-items:center;gap:8px}
  .mobile-icon-button{position:relative}
  .mobile-notification-badge{
    position:absolute;right:-4px;top:-4px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;
    background:#d44634;color:#fff;font-size:10px;font-weight:800;display:flex;align-items:center;justify-content:center;
    border:1px solid rgba(255,255,255,.18)
  }
  .mobile-profile-button{
    border:1px solid rgba(118,138,154,.34);
    background:linear-gradient(180deg,rgba(13,20,28,.96),rgba(8,13,19,.96));
    color:#f3f6f9;border-radius:14px;min-height:44px;padding:8px 10px;display:flex;align-items:center;gap:8px;min-width:0;
  }
  .mobile-profile-avatar{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#6f60ee;color:#fff;font-size:13px;flex:0 0 auto}
  .mobile-profile-copy{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
  .mobile-profile-copy strong{font-size:11px;letter-spacing:.08em;color:#f0bc5d}
  .mobile-profile-copy span{font-size:12px;color:#f3f6f9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:84px}

  .mobile-drawer-backdrop{
    position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:30;
  }
  .mobile-drawer{
    position:fixed;left:0;top:0;bottom:0;width:min(82vw,340px);z-index:31;background:linear-gradient(180deg,#0a1620,#071019);
    border-right:1px solid rgba(240,173,62,.18);box-shadow:18px 0 40px rgba(0,0,0,.42);padding:16px 14px 18px;overflow:auto;
  }
  .mobile-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
  .mobile-drawer-head strong{display:block;color:#f7f9fb;font-size:20px;letter-spacing:.08em}
  .mobile-drawer-head small{display:block;color:#9db0bb;font-size:12px}
  .mobile-drawer-links{display:grid;gap:8px}
  .mobile-menu-link{
    border:1px solid rgba(118,138,154,.22);background:rgba(9,18,28,.82);color:#f2f5f8;border-radius:14px;padding:13px 14px;
    display:flex;align-items:center;gap:12px;font-size:14px;text-align:left;
  }
  .mobile-menu-link span{font-size:17px;flex:0 0 18px;text-align:center}
  .mobile-menu-link strong{font-weight:700}

  .mobile-dashboard-shell{display:grid;gap:14px}
  .mobile-hero-card{
    position:relative;overflow:hidden;border:1px solid rgba(240,173,62,.22);border-radius:22px;padding:18px;
    background:
      linear-gradient(180deg,rgba(7,15,24,.44),rgba(7,15,24,.92)),
      url('assets/dashboard-reference.png') center/cover no-repeat;
    min-height:172px;display:grid;align-content:space-between;gap:16px;
    box-shadow:0 14px 28px rgba(0,0,0,.26);
  }
  .mobile-hero-card::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(240,173,62,.14),transparent 42%);pointer-events:none}
  .mobile-hero-copy,.mobile-hero-actions{position:relative;z-index:1}
  .mobile-eyebrow{display:inline-block;font-size:10px;letter-spacing:.18em;color:#f0bc5d;text-transform:uppercase;margin-bottom:8px;font-weight:900}
  .mobile-hero-card h1{margin:0;color:#fff;font-size:31px;line-height:1.02}
  .mobile-hero-card p{margin:8px 0 0;color:#d3dde4;font-size:13px;line-height:1.45;max-width:34ch}
  .mobile-hero-actions{display:flex;gap:10px;flex-wrap:wrap}
  .mobile-hero-button{
    border:1px solid rgba(240,173,62,.28);background:rgba(8,16,24,.84);color:#f0f5f8;border-radius:14px;
    min-height:42px;padding:0 14px;font-weight:700
  }
  .mobile-hero-button.is-primary{background:linear-gradient(180deg,#e2a53b,#b4771d);color:#11161c;border-color:#f1be5d}

  .mobile-section-block,.mobile-dashboard-card{
    border:1px solid rgba(118,138,154,.18);background:linear-gradient(180deg,rgba(9,19,29,.92),rgba(7,15,23,.96));
    border-radius:20px;padding:16px;box-shadow:0 10px 22px rgba(0,0,0,.2);
  }
  .mobile-section-head,.mobile-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
  .mobile-section-head strong,.mobile-card-head strong{display:block;color:#f7f9fb;font-size:17px}
  .mobile-section-head span,.mobile-card-head span{color:#8ea2af;font-size:12px}
  .mobile-inline-link{border:0;background:none;color:#f0bc5d;font-weight:700;padding:0;font-size:12px}

  .mobile-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .mobile-action-card{
    border-radius:18px;border:1px solid rgba(118,138,154,.24);padding:14px 13px;min-height:110px;text-align:left;
    display:grid;align-content:start;gap:8px;color:#fff;background:linear-gradient(155deg,#0c2130,#09141d 65%,#08121a);
  }
  .mobile-action-card strong{font-size:15px;line-height:1.15}
  .mobile-action-card small{font-size:11px;line-height:1.35;color:#c4d0d8}
  .mobile-action-icon{font-size:23px;line-height:1}
  .mobile-action-card.card-city{background:linear-gradient(145deg,#16395f,#0d2138 58%,#09131a)}
  .mobile-action-card.card-dimension{background:linear-gradient(145deg,#4b231d,#351613 58%,#160c0a)}
  .mobile-action-card.card-duel{background:linear-gradient(145deg,#614212,#41290e 58%,#171008)}
  .mobile-action-card.card-war{background:linear-gradient(145deg,#1b4a32,#133322 58%,#09140f)}
  .mobile-action-card.card-diplomacy{background:linear-gradient(145deg,#402864,#281842 58%,#120c1d)}
  .mobile-action-card.card-par{background:linear-gradient(145deg,#4a2617,#33180f 58%,#150d09)}
  .mobile-action-card.card-add{background:linear-gradient(145deg,#2d4560,#172837 58%,#0b1319)}
  .mobile-action-card.card-custom{background:linear-gradient(145deg,#223957,#142231 58%,#0a1017)}

  .mobile-stats-grid{display:grid;gap:14px}
  .mobile-live-list,.mobile-role-list,.mobile-activity-list{display:grid;gap:9px}
  .mobile-event-row,.mobile-role-row,.mobile-activity-row{
    border:1px solid rgba(118,138,154,.16);background:rgba(5,13,20,.62);border-radius:14px;padding:12px;
  }
  .mobile-event-row{display:grid;grid-template-columns:56px 1fr;gap:10px;align-items:start;text-align:left}
  .mobile-event-date{border-radius:12px;background:#0a1721;border:1px solid rgba(240,173,62,.18);padding:7px 4px;text-align:center}
  .mobile-event-date small{display:block;color:#87a0ad;font-size:10px;letter-spacing:.08em}
  .mobile-event-date strong{display:block;color:#fff;font-size:22px;line-height:1.1}
  .mobile-event-copy{display:grid;gap:4px;min-width:0}
  .mobile-event-copy strong{font-size:14px;color:#fff;line-height:1.2}
  .mobile-event-copy span{font-size:12px;color:#d8e1e7;display:flex;gap:6px;flex-wrap:wrap}
  .mobile-event-copy small{font-size:11px;color:#8ea3af}
  .mobile-event-badge{display:inline-flex;align-items:center;justify-content:center;margin-top:2px;width:max-content;padding:4px 8px;border-radius:999px;background:rgba(240,173,62,.14);border:1px solid rgba(240,173,62,.24);font-size:10px;font-weight:800;color:#f0bc5d}

  .mobile-role-row{display:grid;grid-template-columns:32px 1fr auto;gap:10px;align-items:center;text-align:left}
  .mobile-role-icon{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:10px;background:#0e1c26;color:#f0bc5d}
  .mobile-role-main strong{display:block;color:#fff;font-size:14px}
  .mobile-role-main small{display:block;color:#99afbb;font-size:11px;line-height:1.35;margin-top:2px}
  .mobile-role-row em{font-style:normal;color:#d4dee5;font-size:12px;text-align:right}

  .mobile-activity-row{display:grid;gap:4px;text-align:left}
  .mobile-activity-row strong{font-size:14px;color:#fff;line-height:1.2}
  .mobile-activity-row span{font-size:12px;color:#d2dce2}
  .mobile-activity-row small{font-size:11px;color:#91a5b1}

  .mobile-clock-time{font-size:38px;line-height:1;color:#fff;font-weight:900;margin:4px 0 10px}
  .mobile-clock-date{font-size:14px;color:#d4dee5;line-height:1.4;margin-bottom:14px}
  .mobile-clock-local{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:14px;background:rgba(5,13,20,.62);border:1px solid rgba(118,138,154,.16)}
  .mobile-clock-local span{font-size:11px;color:#91a5b1;text-transform:uppercase;letter-spacing:.08em}
  .mobile-clock-local strong{font-size:14px;color:#fff}

  .mobile-bottom-nav{
    position:fixed;left:0;right:0;bottom:0;z-index:22;display:grid;grid-template-columns:repeat(5,1fr);gap:8px;
    padding:10px 10px calc(env(safe-area-inset-bottom,0px) + 10px);background:linear-gradient(180deg,rgba(5,13,20,.08),rgba(5,13,20,.96) 24%,rgba(5,13,20,.98));backdrop-filter:blur(18px);
  }
  .mobile-bottom-link{
    border:1px solid rgba(118,138,154,.18);background:rgba(8,16,24,.94);color:#d8e1e7;border-radius:16px;padding:8px 4px 7px;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:60px;font-size:10px;font-weight:700;
  }
  .mobile-bottom-link span{font-size:18px;line-height:1}
  .mobile-bottom-link.is-active{border-color:rgba(240,173,62,.44);color:#f0bc5d;background:linear-gradient(180deg,rgba(70,48,18,.92),rgba(12,18,24,.96))}

  body.mobile-drawer-open{overflow:hidden!important}
}

/* =========================================================
   v128 — mobile scroll fix only (desktop frozen)
   ========================================================= */
@media (max-width:760px){
  html{
    height:auto!important;
    min-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    touch-action:pan-y!important;
    overscroll-behavior-y:auto!important;
  }
  body{
    position:static!important;
    width:100%!important;
    height:auto!important;
    min-height:100vh!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;
    overscroll-behavior-y:auto!important;
  }
  .viewport{
    position:static!important;
    width:100%!important;
    height:auto!important;
    min-height:100vh!important;
    overflow:visible!important;
    touch-action:pan-y!important;
  }
  .stage{
    position:relative!important;
    width:100%!important;
    height:auto!important;
    min-height:100vh!important;
    max-height:none!important;
    overflow:visible!important;
    touch-action:pan-y!important;
  }
  .mobile-app-shell,
  .mobile-dashboard-shell,
  .mobile-section-block,
  .mobile-stats-grid{
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
    touch-action:pan-y!important;
  }
  body.mobile-drawer-open{
    overflow:hidden!important;
    touch-action:none!important;
  }
}

/* v129 — mobile tap reliability only; desktop remains untouched */
@media (max-width:760px){
  .mobile-app-shell{pointer-events:auto!important}
  .mobile-action-card,
  .mobile-menu-link,
  .mobile-bottom-link,
  .mobile-hero-button,
  .mobile-profile-button,
  .mobile-inline-link,
  .mobile-role-row,
  .mobile-menu-toggle,
  .mobile-icon-button,
  .mobile-drawer-close{
    pointer-events:auto!important;
    touch-action:manipulation!important;
    cursor:pointer!important;
    -webkit-tap-highlight-color:rgba(240,173,62,.16);
  }
  .mobile-action-card:active,
  .mobile-menu-link:active,
  .mobile-bottom-link:active,
  .mobile-hero-button:active{
    transform:scale(.985);
  }
  .mobile-action-loading,
  .mobile-action-error{
    min-height:180px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:22px;
    text-align:center;
    color:#dbe5ea;
  }
  .mobile-action-loading strong,
  .mobile-action-error strong{color:#f0bc5d;font-size:18px}
  .mobile-action-loading span,
  .mobile-action-error span{color:#9fb1bb;font-size:12px;overflow-wrap:anywhere}
}

/* =========================================================
   v131 — mobile viewport containment pass ONLY (desktop frozen)
   Nothing in this block applies above 760px.
   ========================================================= */
@media (max-width:760px){
  :root{--mobile-page-pad:12px}

  /* Every mobile screen is measured against the phone viewport, never the
     old desktop canvas/sidebar geometry. */
  html,body,.viewport,.stage{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding-left:0!important;
    padding-right:0!important;
    overflow-x:hidden!important;
    box-sizing:border-box!important;
  }

  /* Function pages open as true mobile screens. */
  .modal-backdrop.site-function-page:not([hidden]),
  .settings-backdrop:not([hidden]),
  .calendar-site-page:not([hidden]){
    position:fixed!important;
    inset:0!important;
    left:0!important;
    right:0!important;
    top:0!important;
    bottom:0!important;
    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;
    min-height:100dvh!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    place-items:stretch!important;
    align-items:stretch!important;
    justify-items:stretch!important;
    z-index:100!important;
    background:#071019!important;
  }

  /* Main functional panel: no desktop left offset, no 88/94vw maths. */
  .modal.site-function-panel,
  .modal-backdrop.site-function-page .modal,
  .modal-backdrop.site-function-page .site-function-panel{
    position:relative!important;
    inset:auto!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:100dvh!important;
    max-height:none!important;
    height:auto!important;
    margin:0!important;
    padding:18px var(--mobile-page-pad) calc(96px + env(safe-area-inset-bottom,0px))!important;
    border-radius:0!important;
    border-left:0!important;
    border-right:0!important;
    transform:none!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;
    overflow-y:visible!important;
  }

  .modal.site-function-panel::before{left:var(--mobile-page-pad)!important;right:var(--mobile-page-pad)!important}
  .modal.site-function-panel .war-modal-header{padding-right:42px!important;min-width:0!important}
  .modal.site-function-panel .war-modal-heading{min-width:0!important;max-width:100%!important}
  .modal.site-function-panel h2{font-size:22px!important;line-height:1.15!important;overflow-wrap:anywhere!important}
  .modal.site-function-panel #modalText{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    overflow-x:hidden!important;
    box-sizing:border-box!important;
  }
  .modal.site-function-panel .modal-close{
    position:fixed!important;
    top:calc(10px + env(safe-area-inset-top,0px))!important;
    right:10px!important;
    left:auto!important;
    z-index:104!important;
    width:42px!important;
    height:42px!important;
  }
  .modal.site-function-panel > .modal-primary{
    width:100%!important;
    max-width:100%!important;
    min-height:46px!important;
    margin-top:14px!important;
  }

  /* Settings becomes a full-width mobile page as well. */
  .settings-panel{
    position:relative!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:100dvh!important;
    max-height:none!important;
    height:auto!important;
    margin:0!important;
    border-radius:0!important;
    border-left:0!important;
    border-right:0!important;
    overflow-x:hidden!important;
    overflow-y:visible!important;
    box-sizing:border-box!important;
  }
  .settings-header{padding:16px 58px 14px var(--mobile-page-pad)!important;gap:8px!important}
  .settings-body,.settings-content,.settings-section{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}
  .settings-body{padding-left:var(--mobile-page-pad)!important;padding-right:var(--mobile-page-pad)!important;padding-bottom:96px!important}
  .settings-close{position:fixed!important;top:calc(10px + env(safe-area-inset-top,0px))!important;right:10px!important;z-index:104!important}

  /* Calendar must not keep its desktop 15.15% sidebar offset. */
  .calendar-site-page:not([hidden]){
    display:block!important;
    border-left:0!important;
  }
  .calendar-site-page .calendar-reference-board,
  .calendar-site-page .calendar-shell{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:100dvh!important;
    max-height:none!important;
    margin:0!important;
    padding:12px!important;
    border-radius:0!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;
    overflow-y:visible!important;
  }
  .calendar-site-page .calendar-reference-header,
  .calendar-site-page .calendar-reference-body{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    grid-template-columns:1fr!important;
    box-sizing:border-box!important;
  }
  .calendar-site-page .calendar-reference-header{display:grid!important;gap:10px!important;padding-right:0!important}
  .calendar-site-page .calendar-reference-nav,
  .calendar-site-page .calendar-reference-actions{display:flex!important;flex-wrap:wrap!important;gap:6px!important;width:100%!important;max-width:100%!important}
  .calendar-site-page .calendar-period{white-space:normal!important;font-size:14px!important}
  .calendar-site-page .calendar-filter{width:100%!important;max-width:100%!important;min-width:0!important;height:42px!important;font-size:13px!important}
  .calendar-site-page .calendar-view-switch{max-width:100%!important;overflow-x:auto!important}
  .calendar-site-page .calendar-view-btn{min-width:0!important;flex:1 1 auto!important;font-size:12px!important;padding:9px 10px!important}
  .calendar-site-page .calendar-create-event{width:100%!important;min-height:42px!important}
  .calendar-site-page .calendar-command-sidebar{width:100%!important;max-width:100%!important;min-width:0!important;overflow-x:hidden!important}

  /* Generic protection for every component that can otherwise inherit a
     desktop width/min-width and escape to the right. */
  .site-function-page *,
  .settings-backdrop *,
  .calendar-site-page *{
    box-sizing:border-box;
    max-width:100%;
  }
  .site-function-page input,
  .site-function-page select,
  .site-function-page textarea,
  .site-function-page button,
  .settings-backdrop input,
  .settings-backdrop select,
  .settings-backdrop textarea,
  .settings-backdrop button{
    min-width:0!important;
  }
  .composer-grid,
  .event-grid,
  .owner-user-form-grid,
  .owner-account-grid,
  .member-detail-grid,
  .member-info-grid,
  .member-account-form,
  .tm-main-grid,
  .tm-camp-grid,
  .tm-scenario-grid,
  .tm-progress-grid,
  .tm-forecast-results,
  .tm-missions-needed,
  .tm-level-layout,
  .template-editor-grid,
  .diplomacy-layout,
  .alliance-role-grid,
  .par-current,
  .par-today-grid,
  .par-detail-grid,
  .aow-support-grid,
  .aow-target-grid,
  .aow-capture-grid{
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  .role-assignment-row,
  .owner-managed-user,
  .announcement-item,
  .template-event-card,
  .event-planner-row{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  /* Wide data is allowed to scroll inside its own box, never widen the page. */
  .site-function-page table,
  .settings-backdrop table,
  .calendar-site-page table{
    max-width:none!important;
  }
  .members-table-wrap,
  .tm-table-wrap,
  .activity-log-list,
  .template-library,
  .planned-caps,
  .role-assignment-list{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }

  /* Keep long labels/values from forcing a wider canvas. */
  .site-function-page strong,
  .site-function-page span,
  .site-function-page small,
  .site-function-page p,
  .settings-backdrop strong,
  .settings-backdrop span,
  .settings-backdrop small,
  .settings-backdrop p{
    overflow-wrap:anywhere;
  }
}



/* =========================================================
   v132 — mobile dashboard redesign only (desktop frozen)
   ========================================================= */
@media (max-width:760px){
  .mobile-app-shell{
    padding:calc(env(safe-area-inset-top,0px) + 10px) 12px calc(env(safe-area-inset-bottom,0px) + 90px);
    gap:12px;
  }
  .mobile-dashboard-shell{gap:12px}
  .mobile-topbar-shell{padding:8px 0 2px}
  .mobile-menu-toggle,.mobile-icon-button,.mobile-drawer-close{border-radius:12px;min-width:42px;min-height:42px}
  .mobile-profile-button{min-height:42px;border-radius:12px;padding:8px 10px}
  .mobile-brand-block strong{font-size:18px}
  .mobile-brand-block small{font-size:9px}

  .mobile-hero-card{
    min-height:146px;
    padding:16px;
    border-radius:20px;
    gap:14px;
  }
  .mobile-hero-card h1{font-size:28px}
  .mobile-hero-card p{font-size:12px;max-width:32ch}
  .mobile-hero-actions{gap:8px}
  .mobile-hero-button{flex:1 1 0;min-height:40px;padding:0 12px}

  .mobile-priority-strip{display:grid;grid-template-columns:1fr;gap:10px}
  .mobile-priority-card{
    border:1px solid rgba(118,138,154,.2);
    background:linear-gradient(180deg,rgba(10,21,32,.98),rgba(7,15,23,.98));
    border-radius:18px;
    padding:14px 14px 13px;
    display:grid;
    gap:5px;
    text-align:left;
    box-shadow:0 10px 20px rgba(0,0,0,.18);
  }
  .mobile-priority-card small{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#f0bc5d;font-weight:800}
  .mobile-priority-card strong{font-size:18px;line-height:1.15;color:#fff}
  .mobile-priority-card span{font-size:12px;line-height:1.35;color:#c3d0d8}
  .mobile-priority-card.is-city{background:linear-gradient(145deg,#173457,#0d2035 58%,#09131a)}
  .mobile-priority-card.is-dimension{background:linear-gradient(145deg,#4b231d,#351613 58%,#160c0a)}
  .mobile-priority-card.is-duel{background:linear-gradient(145deg,#5f4211,#40280d 58%,#171008)}

  .mobile-section-block,.mobile-dashboard-card{padding:14px;border-radius:18px}
  .mobile-section-head,.mobile-card-head{margin-bottom:12px}
  .mobile-section-head strong,.mobile-card-head strong{font-size:16px}

  .mobile-action-grid{grid-template-columns:1fr 1fr;gap:10px}
  .mobile-action-card{min-height:96px;padding:13px 12px;border-radius:16px;gap:7px}
  .mobile-action-card strong{font-size:14px}
  .mobile-action-card small{font-size:11px}
  .mobile-action-icon{font-size:22px}
  .mobile-action-card.card-calendar{background:linear-gradient(145deg,#28445f,#182b3c 58%,#0c151d)}
  .mobile-action-card.card-members{background:linear-gradient(145deg,#22425b,#153043 58%,#0c151d)}
  .mobile-action-card.card-announce{background:linear-gradient(145deg,#3c325e,#261e42 58%,#100c1d)}

  .mobile-event-row,.mobile-role-row,.mobile-activity-row{border-radius:12px;padding:11px}
  .mobile-event-date strong{font-size:20px}
  .mobile-event-copy strong,.mobile-role-main strong,.mobile-activity-row strong{font-size:13px}
  .mobile-event-copy span,.mobile-role-main small,.mobile-activity-row span{font-size:11px}
  .mobile-event-copy small,.mobile-activity-row small,.mobile-role-row em{font-size:10px}
  .mobile-event-badge{font-size:9px;padding:4px 7px}

  .mobile-clock-time{font-size:34px;margin:2px 0 8px}
  .mobile-clock-date{font-size:13px;margin-bottom:12px}
  .mobile-clock-local{padding:10px 11px;border-radius:12px}

  .mobile-bottom-nav{padding:8px 8px calc(env(safe-area-inset-bottom,0px) + 8px);gap:6px}
  .mobile-bottom-link{border-radius:14px;min-height:58px;padding:7px 3px 6px;font-size:10px}
  .mobile-bottom-link span{font-size:17px}
}