:root {
  --bg: #070b12;
  --panel: #0d1421;
  --panel2: #121b2a;
  --panel3: #172338;
  --border: #263653;
  --cyan: #62d8ff;
  --cyan2: #247db2;
  --gold: #e9bd68;
  --green: #55d6a0;
  --red: #f36d78;
  --text: #eaf2ff;
  --muted: #7f91ae;
  --black: #05080d;
  --scale: 1;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  background:
    radial-gradient(circle at 15% 0%, rgba(44, 95, 130, .20), transparent 28%),
    radial-gradient(circle at 90% 20%, rgba(75, 51, 106, .15), transparent 30%),
    var(--bg);
  color: var(--text);
  font-family: "Segoe UI", Inter, system-ui, sans-serif;
  overflow: hidden;
}
button, input, select { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .42; }

.app-shell { height: 100vh; display: flex; flex-direction: column; }
.topbar {
  min-height: 78px;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(13,20,33,.98), rgba(7,11,18,.96));
  box-shadow: 0 10px 30px rgba(0,0,0,.24);
}
.brand-block { display: flex; align-items: center; gap: 12px; min-width: 0; }
.brand-mark {
  width: 42px; height: 42px; display: grid; place-items: center;
  border: 1px solid var(--cyan2); color: var(--cyan);
  background: linear-gradient(145deg, #0c1b2a, #07101a);
  font-weight: 900; letter-spacing: .08em;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.02), 0 0 18px rgba(98,216,255,.10);
}
.eyebrow, .section-kicker { color: var(--cyan); font-size: 10px; letter-spacing: .20em; font-weight: 800; }
h1, h2, h3, p { margin: 0; }
h1 { font-size: 18px; letter-spacing: .10em; }
h2 { font-size: 15px; letter-spacing: .12em; }
.header-actions, .roster-actions, .quest-controls, .action-group, .roster-tools { display: flex; align-items: center; gap: 6px; }
.header-actions { flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; }

.btn, .icon-btn, .quest-tab {
  border: 1px solid var(--border);
  background: #101a2a;
  color: var(--text);
  transition: .18s ease;
  white-space: nowrap;
}
.btn { padding: 8px 12px; font-size: 11px; font-weight: 800; letter-spacing: .06em; }
.btn-small { padding: 6px 9px; font-size: 10px; }
.btn-primary { border-color: var(--cyan2); background: linear-gradient(180deg, #12415b, #0d2435); color: #dff7ff; }
.btn-secondary { border-color: #5b4b24; background: linear-gradient(180deg, #3a2e16, #1d1710); color: #ffe7a7; }
.btn-danger { border-color: #6b2630; background: #2b1217; color: #ffc4cb; }
.btn-ghost { background: rgba(255,255,255,.015); }
.btn:hover:not(:disabled), .icon-btn:hover:not(:disabled), .quest-tab:hover:not(:disabled) { border-color: #3f5b84; transform: translateY(-1px); }
.icon-btn { width: 30px; height: 30px; font-size: 14px; }

.main-grid {
  min-height: 0;
  flex: 1;
  display: grid;
  grid-template-columns: minmax(280px, 31%) minmax(0, 1fr);
  gap: 10px;
  padding: 10px;
}
.panel { background: linear-gradient(180deg, rgba(13,20,33,.98), rgba(10,16,27,.98)); border: 1px solid var(--border); min-height: 0; }
.roster-panel { display: flex; flex-direction: column; overflow: hidden; }
.content-panel { display: grid; grid-template-rows: auto minmax(120px, 0.34fr) minmax(260px, 1fr) auto; overflow: hidden; }
.panel-header, .character-header, .section-title-row, .actions-row { padding: 12px 14px; }
.panel-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--border); }
.roster-actions { padding: 9px 10px; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.roster-list { flex: 1; min-height: 0; overflow: auto; padding: 8px; }
.roster-list::-webkit-scrollbar, .quest-log::-webkit-scrollbar, .modal-body::-webkit-scrollbar { width: 8px; }
.roster-list::-webkit-scrollbar-thumb, .quest-log::-webkit-scrollbar-thumb, .modal-body::-webkit-scrollbar-thumb { background: #2b3c5c; }
.roster-hint { padding: 8px 10px; color: var(--muted); font-size: 10px; border-top: 1px solid var(--border); }

.alt-card {
  position: relative;
  padding: 9px 9px 9px 10px;
  margin-bottom: 6px;
  border: 1px solid #1b2940;
  background: linear-gradient(180deg, rgba(18,27,42,.92), rgba(10,17,29,.92));
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr) auto;
  gap: 9px;
  align-items: center;
  cursor: pointer;
}
.alt-card:hover { border-color: #375171; }
.alt-card.selected { border-color: var(--gold); box-shadow: inset 3px 0 0 var(--cyan), 0 0 0 1px rgba(233,189,104,.08); background: linear-gradient(180deg, #182338, #111a2a); }
.class-emblem { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid var(--class-color, #456); background: radial-gradient(circle at 50% 35%, rgba(255,255,255,.10), transparent 58%), #0a111c; }
.class-emblem img { max-width: 88%; max-height: 88%; object-fit: contain; filter: drop-shadow(0 0 6px rgba(0,0,0,.5)); }
.class-fallback { font-size: 23px; color: var(--class-color, var(--cyan)); }
.alt-main { min-width: 0; }
.alt-name { display: flex; align-items: center; gap: 5px; font-weight: 800; font-size: calc(13px * var(--scale)); }
.main-badge { display:inline-flex; align-items:center; padding:2px 5px; border:1px solid rgba(233,189,104,.75); background:rgba(233,189,104,.10); color:var(--gold); font-size:9px; font-weight:900; letter-spacing:.10em; line-height:1; }
.main-badge-large { margin-left:8px; vertical-align:middle; font-size:10px; padding:3px 6px; }
.main-field { border-top:1px solid #17243a; padding-top:10px; margin-top:2px; }
.main-option { display:flex; align-items:center; gap:7px; color:var(--text) !important; font-size:11px !important; font-weight:900; letter-spacing:.05em !important; cursor:pointer; }
.main-option input { accent-color:var(--gold); }
.main-option.disabled { color:var(--muted) !important; cursor:not-allowed; }
.field-help { margin-top:5px; color:var(--muted); font-size:10px; line-height:1.35; }
.field-help strong { color:var(--gold); }
.alt-meta { color: var(--muted); font-size: calc(10px * var(--scale)); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.alt-progress { height: 4px; background: #09111d; border: 1px solid #192940; margin: 6px 0 5px; }
.alt-progress > span { display: block; height: 100%; background: linear-gradient(90deg, var(--cyan2), var(--gold)); }
.alt-stats { color: #b7c7dd; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: calc(10px * var(--scale)); }
.alt-side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.alt-status { font-size: 9px; letter-spacing: .09em; font-weight: 800; }
.status-complete { color: var(--green); }
.status-progress { color: var(--gold); }
.status-pending { color: var(--red); }
.alt-quick { display: flex; gap: 4px; }
.quick-btn { border: 1px solid var(--border); background: #0c1522; color: #d9e6fa; padding: 3px 5px; font-size: 9px; font-weight: 800; }

.character-header {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(20,31,48,.75), rgba(11,18,30,.55));
}
.character-identity { display: flex; align-items: center; gap: 12px; min-width: 0; }
.character-big-emblem { width: 58px; height: 58px; }
.character-copy { min-width: 0; }
.character-copy .name { font-size: calc(18px * var(--scale)); font-weight: 900; letter-spacing: .04em; }
.character-copy .sub { margin-top: 3px; color: var(--muted); font-size: calc(11px * var(--scale)); }
.character-metrics { display: flex; gap: 14px; align-items: center; }
.metric { text-align: right; }
 .pending-summary {
  min-width: 220px;
  padding: 8px 11px;
  border: 1px solid #2a3d59;
  background: rgba(8,17,28,.72);
  border-left: 3px solid var(--gold);
}
.pending-summary-title { font-size: calc(12px * var(--scale)); font-weight: 950; letter-spacing: .05em; }
.pending-summary-sub { margin-top: 3px; color: var(--muted); font-size: calc(10px * var(--scale)); }
.pending-summary.clear { border-left-color: var(--green); }
.pending-summary.clear .pending-summary-title { color: var(--green); }
.pending-summary.low { border-left-color: var(--gold); }
.pending-summary.low .pending-summary-title { color: #ffe2a2; }
.pending-summary.high { border-left-color: var(--red); background: rgba(56,18,24,.22); }
.pending-summary.high .pending-summary-title { color: #ffacb5; }
.metric .value.small { font-size: calc(14px * var(--scale)); white-space: nowrap; }
.metric .label { color: var(--muted); font-size: 9px; letter-spacing: .10em; }
.metric .value { font-size: calc(18px * var(--scale)); font-weight: 900; }

.calendar-section { min-height: 0; display: flex; flex-direction: column; border-bottom: 1px solid var(--border); }
.section-title-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
 .reset-banner {
  flex: 1 1 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 0;
}
.reset-strip {
  display: flex;
  gap: 8px;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: stretch;
  width: 100%;
}
.reset-card {
  min-width: 185px;
  max-width: 250px;
  flex: 1 1 0;
  padding: 7px 10px 6px;
  border: 1px solid #29415f;
  background:
    linear-gradient(180deg, rgba(17,31,48,.98), rgba(8,17,28,.98));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.02), 0 4px 14px rgba(0,0,0,.18);
}
.reset-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.reset-card-title {
  color: var(--text);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .10em;
}
.reset-mode {
  padding: 2px 5px;
  border: 1px solid #355071;
  color: var(--cyan);
  background: rgba(98,216,255,.06);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .08em;
}
.weekly-reset .reset-mode {
  border-color: #5b4b24;
  color: var(--gold);
  background: rgba(233,189,104,.06);
}
.reset-countdown {
  margin-top: 2px;
  color: #f2f7ff;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 22px;
  line-height: 1.05;
  font-weight: 950;
  letter-spacing: .03em;
  text-shadow: 0 0 14px rgba(98,216,255,.10);
}
.weekly-reset .reset-countdown {
  text-shadow: 0 0 14px rgba(233,189,104,.10);
}
.reset-meta {
  margin-top: 4px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .06em;
}
.week-grid { min-height: 0; flex: 1; display: grid; grid-template-columns: repeat(7, minmax(80px, 1fr)); gap: 6px; padding: 0 12px 12px; }
.day-card { border: 1px solid #1c2b43; background: #0c1522; min-width: 0; display: flex; flex-direction: column; justify-content: space-between; padding: 8px; cursor: pointer; }
.day-card:hover { border-color: #375171; }
.day-card.selected { border-color: var(--cyan); box-shadow: inset 0 0 0 1px rgba(98,216,255,.12); }
.day-card.today { background: linear-gradient(180deg, #112235, #0c1725); }
.day-name { color: var(--muted); font-size: calc(9px * var(--scale)); font-weight: 900; letter-spacing: .10em; }
 .day-head { display:flex; align-items:center; justify-content:space-between; gap:6px; }
.today-badge { color:var(--cyan); font-size:8px; font-weight:900; letter-spacing:.06em; }
.day-date { font-size: calc(14px * var(--scale)); font-weight: 900; }
.day-status { font-family: ui-monospace, Consolas, monospace; color: #bcd0e9; font-size: calc(9px * var(--scale)); line-height: 1.8; }
.day-status .d { color: var(--cyan); }
.day-status .s { color: var(--gold); }
.day-status strong { color:#edf5ff; font-weight:950; }

.quest-section { min-height: 0; display: flex; flex-direction: column; }
.quest-head { padding-bottom: 8px; }
.quest-tabs { display: flex; gap: 5px; }
.quest-tab { padding: 7px 10px; font-size: 10px; letter-spacing: .08em; font-weight: 900; background: #0b1421; }
.quest-tab.active { color: var(--cyan); border-color: var(--cyan2); background: #102234; }
 .quest-controls #btn-pending.has-pending { border-color:#5b4b24; color:#ffe7a7; }
.quest-controls #btn-pending.pending-active { border-color:var(--cyan2); background:#102234; color:var(--cyan); box-shadow: inset 0 0 0 1px rgba(98,216,255,.08); }
.quest-tab span { color: #b9c8dc; font-family: ui-monospace, monospace; margin-left: 4px; }
.quest-log { flex: 1; min-height: 0; overflow: auto; padding: 0 12px 10px; }
.quest-row { display: grid; grid-template-columns: 28px 30px minmax(0,1fr) auto; gap: 8px; align-items: center; border-bottom: 1px solid #16233a; padding: 8px 6px; }
.quest-row:last-child { border-bottom: 0; }
.quest-index { color: #5e7899; font-family: ui-monospace, monospace; font-size: 10px; }
.quest-icon { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid #263653; color: var(--cyan); }
.quest-row.completed .quest-icon { color: var(--green); border-color: #2f6650; }
.quest-row.completed .quest-name { color: #92a5bd; text-decoration: line-through; text-decoration-color: #3c526f; }
.quest-copy { min-width: 0; }
.quest-name { font-size: calc(12px * var(--scale)); font-weight: 800; }
.quest-desc { color: var(--muted); font-size: calc(10px * var(--scale)); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 2px; }
.quest-reward { color: var(--gold); font-size: calc(9px * var(--scale)); margin-top: 3px; }
.quest-category { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.quest-check { width: 18px; height: 18px; accent-color: #66d9ff; }
.empty-state { height: 100%; min-height: 120px; display: grid; place-items: center; color: var(--muted); font-size: calc(11px * var(--scale)); border: 1px dashed #1e2e47; }

.actions-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; border-top: 1px solid var(--border); }

.modal-backdrop { position: fixed; inset: 0; background: rgba(2,5,9,.76); display: grid; place-items: center; z-index: 50; padding: 18px; }
.modal { width: min(760px, 96vw); max-height: 92vh; background: #0d1421; border: 1px solid #2d4161; box-shadow: 0 25px 70px rgba(0,0,0,.6); display: flex; flex-direction: column; }
.modal-header { padding: 14px 16px; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.modal-header h3 { font-size: 14px; letter-spacing: .10em; }
.modal-body { padding: 15px 16px; overflow: auto; }
.modal-footer { padding: 12px 16px; border-top: 1px solid var(--border); display: flex; justify-content: flex-end; gap: 6px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.field { display: flex; flex-direction: column; gap: 5px; }
.field.full { grid-column: 1 / -1; }
.field label { font-size: 10px; color: var(--muted); letter-spacing: .09em; }
.field input, .field select, .field textarea { width: 100%; padding: 9px 10px; color: var(--text); border: 1px solid #243654; background: #09111c; outline: none; }
.field textarea { min-height: 80px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--cyan2); }
.radio-row { display: flex; gap: 14px; flex-wrap: wrap; }
.radio-row label { display: flex; align-items: center; gap: 6px; color: var(--text); font-size: 11px; }
.font-control { display: flex; align-items: center; gap: 10px; }
.font-value { min-width: 60px; text-align: center; font-weight: 900; color: var(--cyan); }
.history-list { font-family: ui-monospace, Consolas, monospace; font-size: 10px; color: #c2d1e5; }
.history-item { padding: 7px 0; border-bottom: 1px solid #17243a; }

#toast-root { position: fixed; bottom: 18px; right: 18px; z-index: 100; display: flex; flex-direction: column; gap: 6px; align-items: flex-end; }
.toast { background: #0c1725; color: var(--text); border: 1px solid #304667; padding: 9px 12px; box-shadow: 0 8px 30px rgba(0,0,0,.35); font-size: 11px; }

@media (max-width: 1280px) {
  body { overflow: auto; }
  .app-shell { min-height: 100vh; height: auto; }
  .topbar { height: auto; align-items: flex-start; flex-wrap: wrap; }
  .reset-banner { order: 3; width: 100%; justify-content: center; }
  .header-actions { flex-wrap: wrap; justify-content: flex-end; }
  .main-grid { grid-template-columns: 1fr; }
  .roster-panel { min-height: 360px; }
  .content-panel { min-height: 760px; }
  .week-grid { grid-template-columns: repeat(7, minmax(90px, 1fr)); overflow-x: auto; }
}
@media (max-width: 720px) {
  .topbar { flex-direction: column; align-items: stretch; }
  .reset-banner { order: 0; width: 100%; }
  .header-actions { justify-content: flex-start; }
  .content-panel { grid-template-rows: auto minmax(120px, .34fr) minmax(420px, 1fr) auto; }
  .week-grid { grid-template-columns: repeat(7, 120px); overflow-x: auto; }
  .form-grid { grid-template-columns: 1fr; }
  .field.full { grid-column: auto; }
  .quest-head, .actions-row, .section-title-row { align-items: flex-start; flex-direction: column; }
}
.quest-manager-item { padding: 9px 0; border-bottom: 1px solid #17243a; display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; }
.quest-manager-copy { min-width: 0; flex: 1; }
.quest-manager-name { font-weight: 800; color: #e7f0ff; }
.quest-manager-meta { margin-top: 3px; color: var(--accent); font-size: 9px; text-transform: uppercase; letter-spacing: .06em; }
.quest-manager-desc { margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.35; }
.quest-manager-actions { display: flex; gap: 4px; flex-shrink: 0; }
.manager-count { margin-left: 4px; opacity: .72; font-size: 10px; }
.quest-manager-empty { color: var(--muted); padding: 8px 0; font-size: 11px; }

/* v1.5 — Quest checklist and mission manager clarity */
.quest-row { grid-template-columns: 24px 30px minmax(0,1fr) auto; }
.quest-check-wrap { width: 20px; height: 20px; display: inline-grid; place-items: center; cursor: pointer; position: relative; }
.quest-check-wrap input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.check-visual { width: 17px; height: 17px; display: block; border: 1px solid #45617f; background: #09121f; box-shadow: inset 0 0 0 2px rgba(0,0,0,.14); transition: .15s ease; }
.quest-check-wrap:hover .check-visual { border-color: var(--cyan); box-shadow: 0 0 0 2px rgba(98,216,255,.10); }
.quest-check-wrap input:checked + .check-visual { background: linear-gradient(135deg, #14546a, #0f3444); border-color: var(--cyan); box-shadow: inset 0 0 0 2px rgba(98,216,255,.10); }
.quest-check-wrap input:checked + .check-visual::after { content: '✓'; display: grid; place-items: center; height: 100%; color: #dff9ff; font-size: 12px; font-weight: 900; }
.quest-row.completed .check-visual { border-color: #3d8d6f; }

.manager-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 0 14px; border-bottom:1px solid #1b2940; margin-bottom:12px; }
.manager-toolbar-copy { min-width:0; }
.manager-toolbar-sub { margin-top:4px; color:var(--muted); font-size:10px; line-height:1.35; }
.manager-columns { align-items:start; }
.manager-column { min-width:0; }
.manager-column-head { display:flex; align-items:center; justify-content:space-between; gap:8px; padding-bottom:8px; border-bottom:1px solid #20304a; margin-bottom:2px; }
.quest-manager-item { padding:11px 0; border-bottom:1px solid #17243a; display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.quest-manager-main { min-width:0; flex:1; }
.quest-manager-name { font-size:calc(12px * var(--scale)); font-weight:900; color:#e7f0ff; line-height:1.25; }
.quest-manager-badges { display:flex; flex-wrap:wrap; gap:5px; margin-top:6px; }
.manager-badge { display:inline-flex; align-items:center; max-width:100%; padding:3px 6px; border:1px solid #273a59; background:#0c1522; color:#c9d7e9; font-size:9px; line-height:1.15; text-transform:uppercase; letter-spacing:.05em; }
.manager-badge.category { color:var(--cyan); border-color:#24516b; }
.manager-badge.reward { color:var(--gold); border-color:#5b4b24; }
.quest-manager-desc { margin-top:7px; color:var(--muted); font-size:calc(10px * var(--scale)); line-height:1.4; }
.quest-manager-desc.empty { opacity:.6; font-style:italic; }
.quest-manager-actions { display:flex; gap:5px; flex-shrink:0; padding-top:1px; }
.quick-btn.edit { border-color:#2e5470; color:#d8f5ff; min-width:70px; }
.quick-btn.delete { border-color:#6b2630; color:#ffc4cb; min-width:30px; }
.mission-edit-banner { margin-bottom:14px; padding:11px 12px; border:1px solid #2c4765; background:linear-gradient(180deg,#101e30,#0b1522); display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.mission-edit-banner.new { border-color:#5b4b24; }
.mission-edit-kicker { color:var(--cyan); font-size:9px; font-weight:900; letter-spacing:.12em; }
.mission-edit-banner strong { flex:1; min-width:160px; color:#f4f8ff; font-size:calc(14px * var(--scale)); }
.mission-edit-state { padding:3px 6px; border:1px solid #36516e; color:#9fb3ca; font-size:9px; font-weight:900; letter-spacing:.08em; }
@media (max-width: 720px) {
  .manager-toolbar { align-items:flex-start; flex-direction:column; }
  .manager-columns { grid-template-columns:1fr; }
}

@media (max-width: 980px) {
  .reset-strip { justify-content: flex-start; }
  .reset-card { min-width: 165px; }
}
@media (max-width: 720px) {
  .reset-banner { width: 100%; }
  .reset-strip { flex-direction: column; width: 100%; }
  .pending-summary { min-width:0; width:100%; }
  .reset-card { min-width: 0; max-width: none; width: 100%; }
  .reset-countdown { font-size: 20px; }
}
.install-actions{display:flex;align-items:center;gap:6px}.install-help-btn{min-width:34px;padding:9px 10px}.install-help{display:grid;gap:12px}.install-help p{margin:0;line-height:1.5}.install-help .muted{opacity:.7;font-size:.9em}
.pwa-install{
  position:relative;
  padding:9px 12px;
  border-color:#2d93c5;
  background:linear-gradient(180deg,#174c68,#0d2c40);
  color:#e8faff;
  box-shadow:0 0 0 1px rgba(98,216,255,.08),0 0 16px rgba(98,216,255,.12);
  text-shadow:0 1px 0 rgba(0,0,0,.35);
}
.pwa-install:hover:not(:disabled){
  border-color:var(--cyan);
  background:linear-gradient(180deg,#1b5d7d,#10354b);
  box-shadow:0 0 0 1px rgba(98,216,255,.14),0 0 20px rgba(98,216,255,.18);
}
.install-new-badge{
  display:inline-block;
  margin-left:6px;
  padding:2px 5px;
  border:1px solid rgba(233,189,104,.72);
  background:rgba(233,189,104,.12);
  color:var(--gold);
  font-size:8px;
  font-weight:950;
  letter-spacing:.08em;
  vertical-align:1px;
}


.brand-by{margin-top:3px;color:#7890aa;font-size:9px;letter-spacing:.14em;font-weight:800}.brand-by strong{color:var(--gold);font-weight:950}
.btn-support{border-color:#6a5427;background:linear-gradient(180deg,#3b3019,#251e11);color:#f6d58b;box-shadow:0 0 12px rgba(233,189,104,.08)}
.btn-support:hover:not(:disabled){border-color:#d9ad57;background:linear-gradient(180deg,#4b3a1d,#2f2613);color:#ffe9b6;box-shadow:0 0 18px rgba(233,189,104,.14)}
.support-modal{display:grid;gap:12px;text-align:center;padding:4px 6px}.support-brand{font-weight:950;letter-spacing:.12em;color:#eef6ff;font-size:14px}.support-by{color:#a9bad0}.support-by strong{color:var(--gold)}.support-modal p{margin:0;color:#c9d6e6;line-height:1.55}.support-modal .support-muted{color:var(--muted);font-size:11px}.support-cta{display:inline-flex;align-items:center;justify-content:center;justify-self:center;text-decoration:none;min-width:210px;border-color:#2d93c5;background:linear-gradient(180deg,#174c68,#0d2c40);color:#e8faff}.support-placeholder{justify-self:center;padding:9px 12px;border:1px dashed #42536b;color:#8295ae;font-size:9px;letter-spacing:.1em;font-weight:900}
.app-footer{display:flex;justify-content:center;align-items:center;padding:8px 12px;color:#64778f;font-size:9px;letter-spacing:.08em;border-top:1px solid #152239}.app-footer strong{color:#9fb3ca}
@media (max-width:720px){.brand-by{font-size:8px}.btn-support{order:0}}