:root {
  color-scheme: dark;
  --bg: #0d1117;
  --panel: #151b23;
  --panel-soft: #1b2430;
  --line: #2a3542;
  --text: #eef3f8;
  --muted: #93a2b3;
  --green: #55d68a;
  --green-soft: #183b2b;
  --red: #ff7e86;
  --red-soft: #431f27;
  --blue: #79b8ff;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-width: 320px;
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

button,
input {
  font: inherit;
}

button {
  cursor: pointer;
}

.shell {
  width: min(1120px, calc(100% - 40px));
  margin: 0 auto;
  padding: 32px 0 64px;
}

.topbar,
.section-heading,
.panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.dashboard-language-picker { grid-column:2; grid-row:1; display:flex; align-items:center; justify-content:center; gap:14px; width:100%; margin:0 0 12px; color:var(--muted); font-size:15px; }
.language-options { display:flex; flex-wrap:wrap; gap:8px; }
.language-option { min-height:38px; padding:0 14px; border:1px solid var(--line); border-radius:8px; background:var(--panel-soft); color:var(--text); font-size:14px; }
.language-option:hover, .language-option[aria-pressed="true"] { border-color:var(--green); background:var(--green-soft); }
.language-select-fallback { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }

.topbar {
  border-bottom: 1px solid var(--line);
  padding-bottom: 24px;
}

.eyebrow {
  margin: 0 0 8px;
  color: var(--green);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1 {
  margin-bottom: 0;
  font-size: 28px;
}

h2 {
  margin-bottom: 8px;
  font-size: clamp(25px, 4vw, 38px);
}

h3 {
  margin-bottom: 0;
  font-size: 20px;
}

.auth-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
  align-items: center;
  gap: 72px;
  min-height: 560px;
}

.intro { grid-column:1; grid-row:1 / span 2; align-self:center; }

.intro p:last-child {
  max-width: 440px;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.7;
}

.panel,
.status-card {
  border: 1px solid var(--line);
  background: var(--panel);
}

.panel {
  padding: 24px;
}

.auth-panel {
  grid-column:2;
  grid-row:2;
  padding: 24px;
  box-shadow: 0 20px 60px rgb(0 0 0 / 20%);
}

.tabs {
  display: flex;
  justify-content: center;
  gap: 24px;
  margin: -24px -24px 24px;
  padding: 0 24px;
  border-bottom: 1px solid var(--line);
}

.tab {
  padding: 18px 0 14px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--muted);
}

.tab.active {
  border-bottom-color: var(--green);
  color: var(--text);
}

label {
  display: block;
  margin: 18px 0 8px;
  color: var(--muted);
  font-size: 14px;
}

input {
  width: 100%;
  padding: 12px 13px;
  border: 1px solid var(--line);
  border-radius: 6px;
  outline: 0;
  background: var(--panel-soft);
  color: var(--text);
}

input:focus {
  border-color: var(--blue);
}

.button {
  min-height: 42px;
  padding: 0 17px;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--text);
  font-weight: 700;
}

.button:disabled {
  cursor: wait;
  opacity: 0.55;
}

.button-primary {
  width: 100%;
  margin-top: 24px;
  background: var(--green);
  color: #07140d;
}

.auth-switch { margin-top:18px; text-align:center; color:var(--muted); font-size:14px; }
.link-button { padding:0; border:0; background:transparent; color:var(--blue); text-decoration:underline; }
.captcha-group { margin-top:18px; }
.email-code-group { margin-top:18px; }
.email-code-row { display:flex; align-items:center; gap:12px; }
.email-code-row input { flex:1 1 120px; min-width:0; }
.email-code-row .button { flex:0 0 auto; min-width:110px; }
.email-code-row .button:disabled { opacity:.6; cursor:wait; }
@media (max-width:420px) {
  .email-code-row { flex-wrap:wrap; }
  .email-code-row .button { width:100%; }
}
.captcha-row { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.captcha-row span { color:var(--text); font-weight:700; white-space:nowrap; }
.captcha-row input { flex:1 1 80px; min-width:0; max-width:160px; }
.captcha-row .button { flex:0 0 auto; }

.button-secondary,
.button-quiet {
  border-color: var(--line);
  background: var(--panel-soft);
}

.button-quiet {
  color: var(--muted);
}

.button-danger { border-color:#b84a4a; background:#5a2424; color:#fff; }
.admin-orders-scroll { width:100%; min-width:0; overflow-x:auto; }
.admin-orders-table { width:100%; min-width:1040px; border-collapse:separate; border-spacing:0 8px; table-layout:fixed; text-align:left; }
.admin-orders-table th { padding:12px; color:var(--text); font-size:14px; font-weight:700; }
.admin-orders-table th:nth-child(1) { width:20%; }
.admin-orders-table th:nth-child(2), .admin-orders-table th:nth-child(3) { width:18%; }
.admin-orders-table th:nth-child(4) { width:9%; }
.admin-orders-table th:nth-child(5) { width:20%; }
.admin-orders-table th:nth-child(6) { width:15%; }
.admin-inline-review-actions { display:flex; gap:8px; }
.admin-inline-review-actions > .button { flex:1 1 0; width:0; min-width:0; height:44px; min-height:44px; padding:6px 4px; margin:0 !important; font-size:13px; white-space:nowrap; }
.admin-inline-review-actions > .button:disabled { opacity:.6; cursor:wait; }
.admin-orders-table td { padding:16px 12px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); color:var(--text); font-size:13px; overflow-wrap:anywhere; background:var(--panel-soft); }
.admin-orders-table td:first-child { border-left:1px solid var(--line); }
.admin-orders-table td:last-child { border-right:1px solid var(--line); }
.admin-orders-table .order-approved td { border-color:#3d9b67; background:#183b2b; }
.admin-orders-table .order-rejected td { border-color:#a94a55; background:#431f27; }
.admin-orders-table .order-submitted td { border-color:#8c7540; background:#302a1b; }
.admin-order-link { display:inline; margin:0; padding:4px 0; border:0; background:transparent; color:inherit; font:inherit; font-weight:600; text-align:left; text-decoration:underline; text-underline-offset:3px; cursor:pointer; overflow-wrap:anywhere; }
.admin-order-link:hover { color:var(--green); }
.admin-order-link:focus-visible, .admin-orders-scroll:focus-visible { outline:2px solid var(--green); outline-offset:2px; }
.payment-dialog.admin-user-orders-dialog { width:max-content; max-width:calc(100vw - 32px); min-width:0; padding:12px; }
.admin-user-orders-dialog h3 { overflow-wrap:anywhere; }
.admin-user-orders-dialog .payment-dialog-heading { padding-bottom:8px; }
.admin-user-orders-dialog .orders-list { margin-top:6px; min-width:0; }
.admin-user-orders-dialog .admin-orders-table { width:max-content; min-width:0; table-layout:auto; }
.admin-user-orders-dialog .admin-orders-table th:nth-child(n) { width:auto; }
.admin-user-orders-dialog .admin-orders-table th,
.admin-user-orders-dialog .admin-orders-table td { padding:8px 4px; white-space:nowrap; }
.admin-user-orders-dialog .admin-inline-review-actions { width:144px; }
.payment-dialog.expiry-history-dialog { width:min(1100px,calc(100vw - 32px)); padding:12px; }
.expiry-history-dialog { z-index:1; }
#expiryHistoryModal { z-index:1010; }
.expiry-history-current { margin:12px 0; overflow-wrap:anywhere; }
.expiry-history-table { width:100%; border-collapse:collapse; font-size:13px; text-align:left; }
.expiry-history-table th, .expiry-history-table td { padding:10px 6px; border-bottom:1px solid var(--line); vertical-align:top; }
.expiry-history-table th, .expiry-history-table td:nth-child(-n+4) { white-space:nowrap; }
.expiry-history-table td:last-child { min-width:160px; max-width:280px; overflow-wrap:anywhere; }
.expiry-history-table td small { display:block; margin-top:6px; color:var(--muted); }
.order-detail-actions { display:flex; gap:10px; margin-top:20px; }
.order-detail-content > .order-detail-actions { display:flex; grid-template-columns:none; }
.order-detail-actions > .button { flex:1 1 0; width:0; height:52px; min-height:52px; margin-top:0 !important; }
.order-reject-form { display:grid !important; gap:10px; }
.order-reject-form label { margin-top:0; color:var(--muted); font-size:13px; }
.order-reject-form textarea { width:100%; min-height:84px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:var(--panel-soft); color:var(--text); resize:vertical; }
.order-reject-form-buttons { display:flex !important; gap:10px; margin-top:2px; }
.order-reject-form-buttons > .button { min-height:44px; }

.form-hint,
.status-card small {
  color: var(--muted);
  font-size: 13px;
}

.section-heading {
  margin: 44px 0 22px;
}

.status-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.dashboard-top-row { display:grid; grid-template-columns:minmax(240px, 1fr) minmax(320px, 1.2fr) minmax(280px, 1fr); gap:14px; align-items:stretch; }
.dashboard-top-row .account-panel, .dashboard-top-row .subscription-panel, .dashboard-top-row .orders-panel { margin-top:0; min-width:0; height:100%; }
.dashboard-top-row .orders-list { max-height:420px; overflow:auto; }
.standalone-node-grid { margin-top:14px; }

.status-card {
  min-height: 142px;
  padding: 20px;
}

.status-grid .status-card {
  max-width: 100%;
}

.card-label {
  display: block;
  margin-bottom: 18px;
  color: var(--muted);
  font-size: 14px;
}

.status-card strong {
  display: block;
  margin-bottom: 8px;
  font-size: 26px;
}

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

.subscription-panel,
.orders-panel {
  margin-top: 14px;
}

.subscription-summary {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-top: 24px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.subscription-summary .card-label {
  margin-bottom: 8px;
}

.subscription-summary strong {
  display: block;
  font-size: 21px;
}
.notice-copy { color:var(--muted); font-size:16px !important; line-height:1.5; }
.free-access-details { margin-top:8px; }
.free-access-details strong { font-size:16px; overflow-wrap:anywhere; }
.free-access-status { display:block; margin-top:6px; color:var(--muted); font-size:13px; }
.free-access-status.active { color:var(--green); }

.plan-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}

.plan-card {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--line);
  background: var(--panel-soft);
}

.plan-card h4 {
  margin: 0 0 8px;
  font-size: 19px;
}

.plan-card p {
  min-height: 38px;
  margin: 0 0 14px;
  color: var(--muted);
  font-size: 13px;
}

.plan-card > strong {
  display: block;
  margin-bottom: 14px;
  color: var(--green);
  font-size: 20px;
}

.plan-actions {
  display: grid;
  gap: 7px;
}

.plan-button {
  width: 100%;
  min-height: 36px;
  padding: 0 9px;
  font-size: 12px;
}

.order-empty {
  margin-top: 22px;
  padding: 18px;
  border: 1px dashed var(--line);
  color: var(--muted);
  line-height: 1.7;
}

.payment-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  overflow: auto;
  padding: 16px;
}

.payment-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgb(0 0 0 / 72%);
  backdrop-filter: blur(3px);
}

.payment-dialog {
  position: relative;
  width: min(400px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  box-shadow: 0 24px 80px rgb(0 0 0 / 45%);
}

.payment-dialog-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.payment-dialog-heading h3 {
  margin: 0;
}

.modal-close {
  width: 34px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel-soft);
  color: var(--muted);
  font-size: 24px;
  line-height: 1;
}

.modal-close:hover {
  color: var(--text);
}

.payment-details {
  display: grid;
  gap: 8px;
  margin-top: 18px;
  padding: 13px 14px;
  border-radius: 6px;
  background: var(--panel-soft);
}

.payment-detail-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
}

.payment-detail-line span {
  color: var(--muted);
  font-size: 13px;
}

.payment-detail-line strong {
  overflow-wrap: anywhere;
  text-align: right;
}

.payment-detail-line .payment-amount {
  color: var(--green);
  font-size: 22px;
}

.payment-qr {
  display: block;
  width: min(220px, 100%);
  aspect-ratio: 1;
  margin: 20px auto 14px;
  padding: 8px;
  border-radius: 6px;
  background: #fff;
  object-fit: contain;
}

.payment-help {
  margin-bottom: 18px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
}

body.payment-modal-open {
  overflow: hidden;
}

.payment-dialog label {
  margin-top: 12px;
}

.payment-dialog-actions {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 10px;
  margin-top: 8px;
}

.payment-dialog-actions .button {
  width: 100%;
}

.payment-dialog-actions .button-primary {
  margin-top: 0;
}
.orders-list { display: grid; gap: 10px; margin-top: 18px; }
.order-row { display: flex; justify-content: space-between; gap: 16px; padding: 14px; border: 1px solid var(--line); background: var(--panel-soft); }
.order-row.order-approved { border-color: #3d9b67; background: #183b2b; }
.order-row.order-rejected { border-color: #a94a55; background: #431f27; }
.order-row.order-submitted { border-color: #8c7540; background: #302a1b; }
.order-row strong, .order-row span, .order-row small { display: block; margin-bottom: 5px; }
.order-row span, .order-row small { color: var(--muted); font-size: 13px; }
.order-row small { line-height: 1.45; }
.order-actions { display: flex; gap: 8px; align-items: center; }
.order-summary { display:grid; grid-template-columns:minmax(0, 1fr) auto auto; align-items:center; gap:10px; width:100%; min-height:44px; padding:10px; color:var(--text); text-align:left; }
.order-summary span { margin:0; white-space:nowrap; }
.order-summary .order-summary-time { min-width:0; overflow:hidden; text-overflow:ellipsis; color:var(--text); font-weight:700; }
.order-review-highlights { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:0; padding:16px; border:1px solid var(--line); border-radius:8px; background:rgba(255,255,255,0.07); }
.order-review-highlights > div { min-width:0; }
.order-review-highlights dt { margin-bottom:8px; color:var(--muted); font-size:13px; }
.order-review-highlights dd { margin:0; color:var(--text); font-size:17px; font-weight:700; line-height:1.5; text-align:left; overflow-wrap:anywhere; }
.order-review-footer { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.order-review-detail { min-width:0; overflow-wrap:anywhere; }
.order-review-footer .order-actions { flex-wrap:wrap; flex-shrink:0; }
.order-review-footer .order-actions .button { width:auto; margin-top:0; white-space:nowrap; }
.order-summary:hover { filter:brightness(1.15); }
.order-summary:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
.order-detail-content { display:grid; gap:14px; margin:20px 0 0; }
.order-detail-content > div { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 2fr); gap:12px; padding-bottom:10px; border-bottom:1px solid var(--line); }
.order-detail-content dt { color:var(--muted); font-size:13px; }
.order-detail-content dd { margin:0; overflow-wrap:anywhere; font-size:14px; }

.admin-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:4px 0 20px; border-bottom:1px solid var(--line); }
.admin-tab { padding:12px 14px; border:0; border-bottom:2px solid transparent; background:transparent; color:var(--muted); font-weight:700; }
.admin-tab.active { border-bottom-color:var(--green); color:var(--text); }
.admin-order-filters { min-width:0; margin:0; padding:10px 12px; border:1px solid var(--line); border-radius:8px; }
.admin-order-filters legend { padding:0 4px; color:var(--muted); font-size:13px; }
.admin-order-filter-options { display:flex; flex-wrap:wrap; gap:8px 18px; }
.admin-order-filter-options label { display:inline-flex; align-items:center; gap:7px; margin:0; min-height:32px; color:var(--text); font-size:14px; cursor:pointer; }
.admin-order-filter-options input[type="checkbox"] { width:16px; height:16px; min-height:0; margin:0; padding:0; accent-color:var(--green); cursor:pointer; }
.admin-member-search { display:grid; grid-template-columns:minmax(180px,1fr) 170px auto; gap:10px; margin-bottom:18px; }
.admin-member-search input, .admin-member-search select, .admin-member-form-grid select, .admin-member-dialog select, .admin-member-dialog textarea { width:100%; min-height:42px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:var(--panel-soft); color:var(--text); }
.admin-users-list, .admin-audit-list { display:grid; gap:10px; }
.admin-user-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:14px; padding:14px; border:1px solid var(--line); border-radius:8px; background:var(--panel-soft); }
.admin-user-main { display:grid; grid-template-columns:minmax(160px,1.5fr) repeat(3,minmax(90px,1fr)); align-items:center; gap:12px; min-width:0; }
.admin-user-main > span { min-width:0; overflow-wrap:anywhere; }
.admin-user-email { font-weight:700; }
.admin-user-meta { color:var(--muted); font-size:13px; }
.admin-pager { display:flex; align-items:center; justify-content:center; gap:16px; margin-top:18px; }
.admin-member-dialog { width:min(760px,100%); max-height:min(92vh,920px); overflow:auto; }
.admin-member-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:14px; }
.admin-member-dialog textarea { min-height:76px; resize:vertical; }
.admin-member-orders-section { margin-top:24px; padding-top:18px; border-top:1px solid var(--line); }
.admin-member-orders-section h4 { margin:0; }
.admin-member-orders { display:grid; gap:8px; margin-top:12px; }
.admin-member-order { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; }
.admin-member-order small { grid-column:1/-1; color:var(--muted); }
.admin-audit-row { display:grid; gap:6px; padding:12px 14px; border-left:3px solid var(--blue); background:var(--panel-soft); }
.admin-audit-row small, .admin-audit-row pre { margin:0; color:var(--muted); white-space:pre-wrap; overflow-wrap:anywhere; font:inherit; font-size:12px; }
.admin-empty { padding:18px; color:var(--muted); text-align:center; }

.panel-heading > small {
  color: var(--muted);
  font-size: 13px;
}

.node-list {
  display: grid;
  gap: 8px;
  margin-top: 22px;
}

.compact-node-list {
  gap: 0;
  margin-top: 12px;
}

.node-check-time {
  display: block;
  margin-top: 10px;
  font-size: 11px;
}

.node-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 0;
  border-bottom: 1px solid var(--line);
}

.node-row:last-child {
  border-bottom: 0;
}

.node-identity {
  min-width: 0;
}

.node-identity strong,
.node-identity small {
  display: block;
}

.node-identity {
  display: flex;
  align-items: center;
  gap: 8px;
}

.node-flag {
  flex: 0 0 auto;
  font-size: 20px;
  line-height: 1;
}

.node-identity strong {
  margin-bottom: 2px;
  font-size: 13px;
}

.node-identity small,
.node-empty {
  color: var(--muted);
  font-size: 11px;
}

.node-state {
  flex: 0 0 auto;
  min-width: 42px;
  padding: 4px 7px;
  border-radius: 999px;
  text-align: center;
  font-size: 11px;
  font-weight: 700;
}

.node-state.online {
  background: var(--green-soft);
  color: var(--green);
}

.node-state.offline {
  background: var(--red-soft);
  color: var(--red);
}

.details {
  margin: 26px 0 0;
}

.password-panel { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); }
.password-panel h4 { margin: 0 0 12px; font-size: 17px; }
.password-panel input { display: block; margin: 8px 0; }
.password-panel .button { width: 100%; margin-top: 8px; }

.details div {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  padding: 13px 0;
  border-bottom: 1px solid var(--line);
}

dt {
  color: var(--muted);
}

dd {
  margin: 0;
  overflow-wrap: anywhere;
  text-align: right;
}

.badge {
  padding: 5px 9px;
  border-radius: 999px;
  background: var(--panel-soft);
  color: var(--muted);
  font-size: 12px;
}

.badge.active {
  background: var(--green-soft);
  color: var(--green);
}

.service-list {
  margin: 26px 0 0;
  padding-left: 20px;
  color: var(--muted);
  line-height: 1.8;
}

.notice {
  margin: 20px 0 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.notice.error {
  border-color: var(--red);
  background: var(--red-soft);
  color: var(--red);
}

.auth-panel .notice {
  margin: 0 0 18px;
  font-size: 14px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.notice.success {
  border-color: var(--green);
  background: var(--green-soft);
  color: var(--green);
}

.hidden {
  display: none !important;
}

@media (max-width: 760px) {
  .order-review-highlights { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .order-review-footer { flex-direction:column; align-items:flex-start; }
  .admin-member-search { grid-template-columns:1fr 1fr; }
  .admin-member-search input { grid-column:1/-1; }
  .admin-member-search button { grid-column:1/-1; }
  .admin-user-main { grid-template-columns:minmax(0,1fr) auto; gap:6px 12px; }
  .admin-user-main .admin-user-email { grid-column:1/-1; }
  .admin-user-row { grid-template-columns:1fr; }
  .admin-user-row > .button { width:100%; }
  .admin-member-form-grid { grid-template-columns:1fr; }
  .admin-tab { padding:10px 8px; font-size:13px; }
  .shell {
    width: min(100% - 28px, 560px);
    padding-top: 20px;
  }

  .auth-layout,
  .content-grid {
    grid-template-columns: 1fr;
  }

  .auth-layout {
    gap: 34px;
    min-height: auto;
    padding: 28px 16px 44px;
  }

  .dashboard-language-picker { grid-column:1; grid-row:1; flex-direction:column; gap:8px; margin-bottom:0; }
  .intro { grid-column:1; grid-row:2; }
  .auth-panel { grid-column:1; grid-row:3; }

  .status-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-top-row { grid-template-columns:1fr; }
  .dashboard-top-row .subscription-panel, .dashboard-top-row .orders-panel { margin-top:14px; }

  .plan-list,
  .subscription-summary {
    grid-template-columns: 1fr;
  }

  .payment-dialog {
    padding: 20px;
  }

  .payment-dialog-actions {
    grid-template-columns: 1fr;
  }

  .section-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .button-secondary {
    width: 100%;
  }
}

@media (max-width: 420px) {
  .order-review-highlights { grid-template-columns:1fr; }
}