:root {
  --bg: #f8f3ea;
  --surface: #ffffff;
  --text: #1f2933;
  --muted: #6b7280;
  --navy: #1f3a5f;
  --orange: #d97706;
  --orange-soft: #f5b971;
  --green: #15803d;
  --red: #b91c1c;
  --blue: #2563eb;
  --border: #e5e0d8;
  --shadow: rgba(31, 41, 51, 0.08);
}
* { box-sizing: border-box; }
html { overflow-y: scroll; }
body { margin: 0; line-height: 1.4; font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: var(--text); background: var(--bg); }
a { color: var(--navy); }
.muted { color: var(--muted); }
.wx-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.wx-icon { width: 18px; height: 18px; display: inline-block; color: #f3c565; flex: 0 0 auto; }
.icon-line { display: inline-flex; gap: 6px; align-items: center; }
.icon-line.center { justify-content: center; }

.public-body {
  background: radial-gradient(circle at top, #0f2748 0%, #0c1d36 45%, #0b1930 100%);
  min-height: 100vh;
  color: #e9eef8;
}
.weather-screen { display: grid; place-items: center; padding: 28px 16px; min-height: 100vh; }
.weather-pro-shell {
  width: min(1260px, 100%);
  display: grid;
  grid-template-columns: minmax(250px, 280px) 1fr;
  gap: 14px;
}
.weather-side {
  background: linear-gradient(180deg, #102849 0%, #0f2542 100%);
  border: 1px solid #253f61;
  border-radius: 18px;
  padding: 16px;
  position: sticky;
  top: 16px;
  align-self: start;
}
.clickable-title {
  color: #fff3de;
  cursor: pointer;
  margin: 0 0 2px;
  font-size: clamp(20px, 2.1vw, 36px);
  line-height: 1.08;
  letter-spacing: 0;
  word-break: keep-all;
}
.clickable-title .title-main { display: block; }
.subtitle, .date-text { color: #bdd0ea; margin: 4px 0; }
.side-pills { display: grid; gap: 8px; margin: 14px 0 12px; }
.pill {
  background: #17365a;
  color: #d8e4f6;
  border: 1px solid #2e4f76;
  border-radius: 999px;
  padding: 8px 10px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  text-align: left;
  appearance: none;
  -webkit-appearance: none;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.2;
}
.pill.active { background: linear-gradient(90deg, #f6c45b, #d89a26); color: #1d2740; border-color: transparent; }
.fx-mini { margin-top: 14px; border-top: 1px solid #264463; padding-top: 10px; }
.fx-mini-row { display: flex; justify-content: space-between; color: #d4def0; margin-bottom: 7px; font-size: 13px; }

.weather-main-column {
  background: linear-gradient(180deg, #102949 0%, #0e2240 100%);
  border: 1px solid #2b4468;
  border-radius: 18px;
  padding: 14px;
}
.weather-top-grid { display: grid; grid-template-columns: 1.8fr 1.2fr; gap: 12px; }
.weather-card.luxury {
  background: linear-gradient(180deg, #163459 0%, #122b4a 100%);
  border-radius: 16px;
  border: 1px solid #36547b;
  padding: 16px;
}
.live-chip {
  display: inline-block;
  background: #f2b949;
  color: #182236;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}
.section-title { margin: 18px 0 10px; color: var(--navy); }
.weather-main.premium {
  background: #ffffffcf;
  border: 1px solid #f3e4cf;
  border-radius: 16px;
  padding: 16px;
}
.temp { font-size: 52px; margin: 4px 0 10px; font-weight: 700; color: #ffffff; line-height: 1.05; }
.temp .wx-icon { width: 38px; height: 38px; margin-right: 4px; color: #f4c96b; vertical-align: -7px; }
.weather-note { color: #d2e0f5; margin-bottom: 10px; }
.metric-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 8px;
  margin-bottom: 10px;
}
.metric-item {
  background: #0f2746;
  border: 1px solid #2f4f76;
  border-radius: 10px;
  padding: 8px;
}
.metric-item small { color: #a8c1de; display: block; font-size: 11px; }
.metric-item strong { color: #fff; font-size: 14px; }
.meta-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px 12px; color: #d9e5f6; }

.weather-map-panel {
  background: linear-gradient(180deg, #153357 0%, #102949 100%);
  border: 1px solid #35557d;
  border-radius: 16px;
  padding: 12px;
}
.map-head { color: #dce9fb; font-weight: 700; margin-bottom: 8px; }
.map-surface {
  min-height: 210px;
  border-radius: 12px;
  background: #9db8d4;
  border: 1px solid #4f7197;
  position: relative;
  overflow: hidden;
}
.map-embed {
  width: 100%;
  height: 210px;
  border: 0;
  border-radius: 10px;
  filter: saturate(0.9) contrast(1.03);
}
.map-marker-label {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -70%);
  background: #ffd77d;
  color: #15243a;
  border-radius: 999px;
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 700;
  pointer-events: none;
}
.map-note { color: #c7d8f1; font-size: 12px; margin: 8px 0 0; }

.hourly-strip {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
}
.hour-card {
  background: linear-gradient(180deg, #17355a 0%, #112746 100%);
  border: 1px solid #335177;
  border-radius: 12px;
  padding: 10px;
  text-align: center;
  color: #d5e2f5;
}
.hour-card strong { color: #fff; }
.hour-icon { font-size: 20px; margin: 4px 0; }
.hour-icon .wx-icon { width: 22px; height: 22px; color: #f3c565; }

.section-title { color: #e8f0fc; }
.daily-timeline {
  display: grid;
  grid-template-columns: repeat(7, minmax(0,1fr));
  gap: 8px;
  margin-bottom: 10px;
  overflow-x: auto;
  padding-bottom: 4px;
}
.day-chip {
  border: 1px solid #35557b;
  background: linear-gradient(180deg, #183760 0%, #122a49 100%);
  border-radius: 12px;
  padding: 10px 8px;
  color: #d5e4f8;
  cursor: pointer;
  text-align: left;
  min-width: 120px;
}
.day-chip small { display: block; color: #abc1de; margin-bottom: 4px; font-size: 11px; }
.day-chip strong { display: block; color: #fff; font-size: 14px; margin-bottom: 3px; }
.day-chip strong .wx-icon { width: 14px; height: 14px; color: #f3c565; vertical-align: -2px; margin-right: 3px; }
.day-chip span { font-size: 12px; }
.day-chip.active {
  background: linear-gradient(180deg, #f4c96b 0%, #d79a27 100%);
  color: #16253d;
  border-color: transparent;
}
.day-chip.active small, .day-chip.active strong { color: #16253d; }
.day-focus-card {
  border: 1px solid #36567e;
  border-radius: 12px;
  background: linear-gradient(180deg, #183860 0%, #122b4b 100%);
  padding: 12px;
  color: #e4eefc;
  margin-bottom: 12px;
}
.day-focus-title { margin: 0 0 4px; font-weight: 700; color: #fff; }
.day-focus-temp { margin: 0 0 4px; font-size: 22px; font-weight: 700; }
.day-focus-condition { margin: 0; color: #b7cce8; }
.forecast-row { display: grid; gap: 12px; grid-template-columns: repeat(3, 1fr); margin-top: 8px; }
.forecast-card, .card {
  background: linear-gradient(180deg, #18385f 0%, #122b4a 100%);
  border: 1px solid #36557e;
  border-radius: 14px;
  padding: 14px;
  color: #e7f1ff;
  box-shadow: 0 6px 14px rgba(31, 41, 51, 0.05);
}
.forecast-card strong { color: #ffffff; font-size: 16px; }
.rates-row { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; }
.rate-card { background: #102947; border: 1px solid #35557e; border-radius: 12px; padding: 10px 12px; color: #d5e3f6; }
.rate-card strong { font-size: 20px; color: #fff; }
.rate-up { color: #6ce09a; font-weight: 600; }
.rate-note { color: #abc0df; font-size: 13px; margin-top: 8px; }
.login-modal {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 999;
}
.login-modal.show { display: block; }
.login-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(4, 14, 28, 0.72);
  backdrop-filter: blur(3px);
}
.login-modal-card {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(440px, calc(100% - 24px));
  background: linear-gradient(180deg, #133355 0%, #0e2746 100%);
  border: 1px solid #36557e;
  border-radius: 16px;
  box-shadow: 0 26px 70px rgba(2, 11, 23, 0.6);
  padding: 16px;
}
.login-close {
  position: absolute;
  right: 10px;
  top: 8px;
  background: transparent;
  color: #d7e5f7;
  border: none;
  width: 30px;
  height: 30px;
  padding: 0;
  font-size: 24px;
  line-height: 1;
}
.login-form {
  display: grid;
  gap: 10px;
}
.login-desk-error {
  margin: 0 0 10px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(220, 38, 38, 0.14);
  border: 1px solid rgba(248, 113, 113, 0.45);
  color: #fecaca;
  font-size: 13px;
  line-height: 1.45;
}
input, select, textarea, button {
  width: 100%; padding: 11px 12px; border-radius: 10px; border: 1px solid #3b5a7e; background: #0f2745; color: #fff;
  transition: border-color .15s ease, box-shadow .15s ease;
}
input:focus, select:focus, textarea:focus {
  outline: none; border-color: #f0c062; box-shadow: 0 0 0 3px rgba(240, 192, 98, 0.25);
}
button, .btn {
  background: linear-gradient(180deg, #f4c96b 0%, #dba134 100%);
  color: #17253c; text-decoration: none; border: none; cursor: pointer;
  padding: 11px 15px; border-radius: 10px; display: inline-block; width: auto; font-weight: 600;
}
footer { margin-top: 12px; color: #a8bfdc; }

.app-shell { display: grid; grid-template-columns: 240px 1fr; min-height: 100vh; }
.ui-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.ui-icon { width: 16px; height: 16px; color: #1f2937; }
.sidebar {
  background: linear-gradient(180deg, #fffef7 0%, #fffdf7 100%);
  border-right: 1px solid #efe3cd;
  padding: 18px;
}
.sidebar h2 { color: var(--navy); margin-top: 0; }
.sidebar nav { display: grid; gap: 8px; }
.sidebar a {
  color: #22344f; text-decoration: none; padding: 9px 10px; border-radius: 10px; border: 1px solid transparent;
  display: flex; align-items: center; gap: 8px;
}
.sidebar a:hover { background: #fff2db; border-color: #efd6b1; }
.content { padding: 18px; }
.topbar {
  display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; background: #fff; border: 1px solid #eadfce;
  padding: 10px 14px; border-radius: 12px;
}
.topbar-right {
  display: flex; align-items: center; gap: 14px;
}
.locale-form {
  display: flex; align-items: center; gap: 8px;
  margin: 0;
}
.locale-select {
  padding: 6px 10px;
  border-radius: 10px;
  border: 1px solid #eadfce;
  background: #fff;
  font: inherit;
}

.staff-subnav { margin-bottom: 14px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.planner-nav { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.planner-scroll { overflow-x: auto; margin-top: 10px; border: 1px solid #eadfce; border-radius: 12px; background: #fff; }
.planner-table { border-collapse: collapse; font-size: 12px; min-width: max-content; }
.planner-table th, .planner-table td {
  border: 1px solid #efe6d6;
  padding: 5px 6px;
  text-align: center;
  vertical-align: top;
  position: relative;
}
.planner-table .staff-name-col {
  text-align: left;
  white-space: nowrap;
  background: #fffdf8;
  font-weight: 600;
  min-width: 130px;
}
.planner-table .day-head .dom { display: block; font-weight: 700; font-size: 13px; }
.planner-table .day-head .wd { display: block; font-size: 10px; color: #6b7280; font-weight: 600; }
.planner-table .cell-main { font-weight: 600; line-height: 1.2; }
.planner-table .cell-sub { font-size: 10px; color: #64748b; margin-top: 2px; }
.planner-table .cell-del { margin-top: 4px; }
.planner-table .cell-del button {
  padding: 0 6px; font-size: 14px; line-height: 1;
  border: none; background: transparent; cursor: pointer; color: #991b1b;
}
.cell-pattern { background: #ecfdf5; }
.cell-override_shift { background: #dbeafe; }
.cell-rest { background: #e5e7eb; }
.cell-leave { background: #fce7f3; }
.cell-empty { background: #fafafa; color: #9ca3af; }
.planner-legend { list-style: none; padding: 0; margin: 8px 0; display: flex; flex-wrap: wrap; gap: 14px; }
.planner-legend li { display: flex; align-items: center; gap: 6px; }
.legend-swatch { width: 14px; height: 14px; border-radius: 4px; border: 1px solid #ddd; display: inline-block; vertical-align: middle; }
.legend-swatch.cell-pattern { background: #ecfdf5; }
.legend-swatch.cell-override_shift { background: #dbeafe; }
.legend-swatch.cell-rest { background: #e5e7eb; }
.legend-swatch.cell-leave { background: #fce7f3; }
.cards { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; margin-bottom: 14px; }
.grid-two { display: grid; grid-template-columns: 2fr 1fr; gap: 12px; margin-bottom: 12px; }
.filters { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 8px; margin-bottom: 12px; }
table {
  width: 100%; border-collapse: collapse; background: var(--surface); border: 1px solid #ebdfcb; border-radius: 12px; overflow: hidden;
}
th, td { padding: 10px; border-bottom: 1px solid #efe6d6; text-align: left; font-size: 14px; }
th { background: #fff8ee; color: #2a3b56; }
.badge { padding: 3px 8px; border-radius: 999px; font-size: 12px; color: #fff; }
.badge-paid { background: var(--green); }
.badge-unpaid { background: var(--red); }
.badge-deposit { background: #ca8a04; }
.badge-cancelled { background: #6b7280; }
.form-grid { display: grid; gap: 10px; max-width: 720px; }
.form-grid-wide {
  max-width: min(1180px, 96vw);
  width: 100%;
}
.tour-line-row {
  border: 1px dashed var(--border);
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 12px;
  background: var(--surface);
}
.tour-line-row legend { font-weight: 600; padding: 0 6px; width: 100%; }
.tour-line-legend-wrap { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.btn-remove-line {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  font-size: 13px;
  padding: 6px 10px !important;
  font-weight: 600;
}
.btn-remove-line:disabled { opacity: 0.45; cursor: not-allowed; }
#btn-add-line { margin-bottom: 14px; }

.tours-wide {
  max-width: min(1180px, 96vw);
  width: 100%;
}
.tour-lines-shell {
  width: 100%;
  max-width: min(1180px, 96vw);
}
.tour-lines-shell--empty {
  min-height: 320px;
  padding: 12px 0 8px;
  box-sizing: border-box;
}
.tour-catalog-empty-banner {
  border: 2px dashed var(--border);
  border-radius: 14px;
  padding: 28px 22px;
  margin-bottom: 16px;
  background: linear-gradient(180deg, #faf8f4 0%, #fff 100%);
  color: var(--muted);
  font-size: 15px;
  line-height: 1.5;
  width: 100%;
}
.tour-catalog-empty-banner a {
  font-weight: 600;
}

.catalog-add-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 14px 16px;
  margin-bottom: 22px;
  max-width: min(1180px, 96vw);
  width: 100%;
}
.catalog-section-title { font-size: 17px; margin: 0 0 12px; color: var(--navy); }
.catalog-add-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 12px;
  align-items: end;
}
.catalog-add-submit label { font-size: 13px; color: var(--muted); }
.catalog-drag-hint { margin-bottom: 10px; font-size: 13px; }
.catalog-table-empty-cell {
  padding: 48px 24px !important;
  min-height: 200px;
  text-align: center;
  vertical-align: middle !important;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.5;
  background: linear-gradient(180deg, #faf8f4 0%, #fffdf9 100%);
}
.catalog-empty-row td {
  border-bottom: none !important;
}
.catalog-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  max-width: min(1180px, 96vw);
  width: 100%;
}
.catalog-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  table-layout: fixed;
}
.catalog-table col.catalog-col-drag { width: 44px; }
.catalog-table col.catalog-col-num { width: 48px; }
.catalog-table col.catalog-col-label { min-width: 0; }
.catalog-table col.catalog-col-cost,
.catalog-table col.catalog-col-sale { width: 11%; }
.catalog-table col.catalog-col-currency { width: 82px; }
.catalog-table col.catalog-col-actions { width: 216px; }
.catalog-table th, .catalog-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  text-align: left;
  vertical-align: middle;
}
.catalog-table td:nth-child(3) {
  overflow-wrap: anywhere;
  word-break: break-word;
}
.catalog-table thead th {
  background: #faf7f2;
  font-weight: 600;
  font-size: 13px;
}
.catalog-table tbody tr:last-child td { border-bottom: none; }
.catalog-row-dragging { opacity: 0.55; background: #fff8ea; }
.col-drag {
  width: 44px;
  min-width: 44px;
  max-width: 44px;
  text-align: center;
  box-sizing: border-box;
}
.catalog-drag-head {
  display: inline-block;
  font-size: 16px;
  color: var(--muted);
  line-height: 1;
  user-select: none;
}
.catalog-drag-handle {
  cursor: grab;
  font-size: 18px;
  color: var(--muted);
  user-select: none;
  line-height: 1;
  display: inline-block;
  padding: 4px;
}
.catalog-drag-handle:active { cursor: grabbing; }
.col-num { color: var(--muted); font-variant-numeric: tabular-nums; }
.col-actions {
  white-space: nowrap;
  text-align: right;
  vertical-align: middle;
}
.catalog-actions {
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  box-sizing: border-box;
}
.catalog-delete-form {
  display: contents;
  margin: 0;
}
.btn-small { padding: 8px 12px !important; font-size: 13px !important; }
.btn-catalog-edit { text-decoration: none; display: inline-block; }
.btn-catalog-delete {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
.alert.error { background: #fee2e2; color: #7f1d1d; border: 1px solid #fecaca; padding: 10px; border-radius: 10px; margin-bottom: 10px; }
.alert.success { background: #d1fae5; color: #065f46; border: 1px solid #6ee7b7; padding: 10px; border-radius: 10px; margin-bottom: 10px; }
.dot { width: 10px; height: 10px; display: inline-block; border-radius: 50%; margin-right: 6px; }
.rates-panel { margin-top: 10px; }
.is-hidden { display: none !important; }

.pro-dashboard {
  background: linear-gradient(140deg, #fffdf6 0%, #fff9ea 100%);
  border: 1px solid #efe2c8;
  border-radius: 30px;
  padding: 16px;
  color: #1e2430;
  max-width: 1400px;
  margin: 0 auto;
}
.pro-head {
  background: #fffef8;
  border: 1px solid #eee3cf;
  border-radius: 16px;
  padding: 8px 10px;
  display: grid;
  grid-template-columns: 130px 1fr auto;
  gap: 10px;
  align-items: center;
  margin-bottom: 12px;
}
.brand-pill {
  border: 1px solid #d7d2c6;
  border-radius: 999px;
  padding: 8px 14px;
  font-weight: 700;
  width: fit-content;
  background: #fff;
}
.pro-actions { display: flex; gap: 8px; }
.pro-actions button {
  border: 1px solid #e8dfcf;
  background: #fff;
  border-radius: 999px;
  padding: 8px 10px;
  font-size: 12px;
}
.hero-title h1 { font-size: 52px; margin: 0 0 10px; line-height: .95; letter-spacing: -.8px; }
.pro-tabs { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.pro-tabs a {
  text-decoration: none;
  color: #242c3a;
  background: #fff;
  border: 1px solid #ece2d2;
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
}
.pro-tabs a.active { background: #1f2937; color: #fff; }
.hero-metrics {
  display: grid;
  grid-template-columns: 1.35fr .75fr;
  gap: 10px;
  margin-bottom: 12px;
}
.mini-track {
  background: #fff;
  border: 1px solid #eee3cf;
  border-radius: 16px;
  padding: 10px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 8px;
}
.mini-track div {
  background: linear-gradient(180deg, #fffdf8 0%, #f7f2e6 100%);
  border: 1px solid #ebe1cf;
  border-radius: 999px;
  padding: 8px 10px;
}
.mini-track small { display: block; font-size: 11px; color: #7a7468; }
.mini-track b { font-size: 14px; }
.metric-numbers {
  background: #fff;
  border: 1px solid #eee3cf;
  border-radius: 16px;
  padding: 10px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 8px;
}
.metric-numbers article {
  display: grid;
  place-items: center;
  border-left: 1px solid #efe5d5;
}
.metric-numbers article:first-child { border-left: 0; }
.metric-numbers strong { font-size: 56px; line-height: .9; font-weight: 500; letter-spacing: -1px; }
.metric-numbers span { font-size: 13px; color: #6a6458; }

.main-layout {
  display: grid;
  grid-template-columns: 1fr 2.35fr 1.05fr;
  gap: 10px;
}
.left-stack, .center-stack, .right-stack { display: grid; gap: 10px; align-content: start; }
.pro-panel {
  background: #fff;
  border: 1px solid #efe3cf;
  border-radius: 22px;
  padding: 10px 12px;
}
.pro-grid-top {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 10px;
  align-items: stretch;
}
.pro-panel.dark {
  background: #1f2937;
  color: #e9edf4;
  border-color: #1f2937;
}
.panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.panel-head h3 { margin: 0; font-size: 34px; line-height: .95; letter-spacing: -.5px; font-weight: 500; }
.panel-head span { font-weight: 700; color: #6c7280; font-size: 14px; }
.pro-panel.dark .panel-head span { color: #f3c565; }
.profile-card { padding: 0; overflow: hidden; }
.avatar-block {
  height: 260px;
  width: 100%;
  background: linear-gradient(180deg, #ccb39a 0%, #8c6f54 100%);
}
.person-meta {
  padding: 12px;
  display: grid;
  gap: 4px;
}
.person-meta h3 { margin: 0; font-size: 26px; line-height: 1; }
.person-meta p { margin: 0; color: #766f61; }
.person-meta b { font-size: 22px; }

.accordion-card { padding: 0; overflow: hidden; }
.acc-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 14px; border-top: 1px solid #eee5d7; font-weight: 600;
}
.acc-item:first-child { border-top: 0; }

.progress-headline { display: flex; gap: 10px; align-items: baseline; margin: 0 0 8px; }
.progress-headline strong { font-size: 48px; line-height: .9; font-weight: 500; }
.progress-headline small { color: #6f6a5f; font-size: 13px; }
.tracker-controls { margin-top: 8px; display: flex; justify-content: space-between; }
.tracker-controls button {
  border: 1px solid #ece2cf; background: #fff; border-radius: 999px; width: 34px; height: 34px; padding: 0;
}
.onboarding-light .onboard-progress { display: grid; grid-template-columns: 1.5fr 1fr .8fr; gap: 8px; }
.onboarding-light .on {
  height: 40px; border-radius: 12px; display: grid; place-items: center; font-weight: 700;
}
.onboarding-light .p1 { background: #f3c565; }
.onboarding-light .p2 { background: #2a2f38; }
.onboarding-light .p3 { background: #8d9198; }
.onboarding-task h3 { margin: 0 0 10px; font-size: 30px; line-height: .95; font-weight: 500; display: flex; justify-content: space-between; align-items: baseline; }
.onboarding-task h3 span { font-size: 46px; line-height: .9; font-weight: 500; }

.calendar-panel { min-height: 320px; }
.task-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.task-list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 8px;
}
.fake-bars {
  height: 130px;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 8px;
  align-items: end;
  padding-top: 8px;
}
.fake-bars div {
  height: var(--h);
  background: linear-gradient(180deg, #2f3641 0%, #3f4652 100%);
  border-radius: 12px;
}
.fake-bars div:last-child { background: linear-gradient(180deg, #f3c565 0%, #e5a833 100%); }
.fake-days { display: flex; justify-content: space-between; margin-top: 6px; font-size: 12px; color: #666; }
.ring-wrap {
  width: 170px; height: 170px; margin: 4px auto 0; position: relative;
}
.ring {
  width: 100%; height: 100%; border-radius: 50%;
  background: conic-gradient(#f3c565 0 235deg, #e5e7eb 235deg 360deg);
  -webkit-mask: radial-gradient(circle at center, transparent 58%, #000 59%);
  mask: radial-gradient(circle at center, transparent 58%, #000 59%);
}
.ring-center {
  position: absolute; inset: 0; display: grid; place-items: center; text-align: center;
}
.ring-center strong { font-size: 44px; line-height: .9; font-weight: 500; letter-spacing: -.5px; }
.ring-center small { color: #6b7280; }
.fake-calendar { border: 1px solid #eee2cb; border-radius: 14px; overflow: hidden; }
.cal-head, .cal-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0,1fr));
}
.cal-head span {
  background: #f7f1e3; padding: 8px; font-size: 12px; color: #6d675b; text-align: center; border-right: 1px solid #ece2d0;
}
.cal-head span:last-child { border-right: none; }
.cal-grid span {
  min-height: 70px; padding: 8px; border-right: 1px solid #eee5d5; border-top: 1px solid #eee5d5; font-size: 13px;
}
.cal-grid span:nth-child(6n) { border-right: none; }
.cal-grid .event {
  background: #1f2937; color: #fff; border-radius: 10px; margin: 4px; min-height: 62px;
}
.cal-grid .event b { display: block; font-size: 11px; margin-top: 2px; font-weight: 600; }
@media (max-width: 900px) {
  .weather-pro-shell { grid-template-columns: 1fr; }
  .weather-top-grid, .metric-strip, .hourly-strip, .daily-timeline { grid-template-columns: 1fr; }
  .weather-side { position: static; }
  .app-shell { grid-template-columns: 1fr; }
  .sidebar { position: sticky; bottom: 0; border-right: none; border-top: 1px solid var(--border); }
  .sidebar nav { grid-template-columns: repeat(2, 1fr); gap: 6px; font-size: 12px; }
  .cards, .grid-two, .forecast-row, .filters, .meta-grid, .rates-row { grid-template-columns: 1fr; }
  .clickable-title { font-size: clamp(22px, 8vw, 32px); }
  .pro-head { grid-template-columns: 1fr; }
  .hero-title h1 { font-size: 36px; }
  .hero-metrics, .main-layout, .pro-grid-top, .metric-numbers, .mini-track { grid-template-columns: 1fr; }
  .metric-numbers article { border-left: 0; border-top: 1px solid #efe5d5; padding-top: 8px; }
  .metric-numbers article:first-child { border-top: 0; padding-top: 0; }
}

/* License + platform admin + activity log */
.license-banner {
  margin: 0 0 12px;
  padding: 12px 14px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 600;
  border: 1px solid transparent;
}
.license-banner--warn {
  background: #fffbeb;
  border-color: #fbbf24;
  color: #92400e;
}
.license-banner--danger {
  background: #fef2f2;
  border-color: #f87171;
  color: #991b1b;
}
.platform-shell .sidebar nav a { display: block; padding: 8px 0; text-decoration: none; font-weight: 600; }
.platform-guest-body {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}
.platform-login-wrap {
  width: min(420px, 100%);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 8px 24px var(--shadow);
}
.platform-login-form { max-width: none; }
.table-scroll { overflow-x: auto; margin-top: 12px; }
.data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}
.data-table th, .data-table td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid var(--border);
}
.data-table thead th {
  background: #faf7f1;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--muted);
}
.data-table tbody tr:last-child td { border-bottom: none; }
.btn-small {
  font-size: 13px;
  padding: 6px 12px;
  border-radius: 8px;
  border: 1px solid var(--navy);
  background: var(--navy);
  color: #fff;
  cursor: pointer;
  font-family: inherit;
}
.inline-form { display: inline-block; margin: 0; }
.activity-meta { font-size: 12px; color: var(--muted); margin-bottom: 12px; }
.activity-table-wrap { overflow-x: auto; }
.activity-table code { font-size: 11px; white-space: pre-wrap; word-break: break-word; }
.activity-pagination { margin-top: 16px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }

.platform-license-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.platform-shrink-form .btn-shrink {
  background: #991b1b;
  border-color: #991b1b;
}
.platform-shrink-form .btn-shrink:hover {
  filter: brightness(1.08);
}
.license-blocked-card {
  max-width: 520px;
  margin: 24px auto;
  padding: 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 16px;
}
.license-blocked-card h1 { margin-top: 0; font-size: 1.35rem; }