@import url("/fonts/fonts.css");
@import url("/detail-panels.css");
@import url("/location-picker.css");
@import url("/screensaver.css");
@font-face {
  font-family: "Shadows Into Light";
  src: url("/fonts/ShadowsIntoLight.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
:root {
  --safe-area-top: env(safe-area-inset-top, 0px);
  --safe-area-right: env(safe-area-inset-right, 0px);
  --safe-area-bottom: env(safe-area-inset-bottom, 0px);
  --safe-area-left: env(safe-area-inset-left, 0px);
  color-scheme: dark;
  --bg: #1c1a17;
  --panel: #242019;
  --panel2: #2b2823;
  --border: #3a352f;
  --text: #f2ede6;
  --muted: #aaa195;
  --mint: #7fd1c4;
}
* {
  box-sizing: border-box;
}
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family:
    Manrope,
    system-ui,
    -apple-system,
    "Segoe UI",
    sans-serif;
  font-size: 15px;
  line-height: 1.5;
}
button,
input,
select {
  font: inherit;
}
button,
a,
input,
select {
  -webkit-tap-highlight-color: transparent;
}
button {
  cursor: pointer;
  color: inherit;
}
button:disabled {
  opacity: 0.55;
  cursor: wait;
}
button:focus-visible,
a:focus-visible,
input:focus,
select:focus {
  outline: 2px solid var(--mint);
  outline-offset: 3px;
}
a {
  color: var(--mint);
}
h1,
h2,
h3,
h4,
p {
  margin: 0;
}
h1 {
  font-size: 29px;
  letter-spacing: -1px;
  line-height: 1.2;
}
h2 {
  font-size: 18px;
  font-weight: 700;
}
h3 {
  font-size: 18px;
}
h4 {
  margin-top: 20px;
}
p {
  margin: 8px 0;
}
input,
select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 48px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #1c1a17;
  color: var(--text);
  padding: 11px 12px;
}
input::placeholder {
  color: #8e8579;
}
input[type="color"] {
  width: 44px;
  padding: 5px;
  flex: 0 0 44px;
}
input[type="checkbox"] {
  width: 22px;
  min-height: 22px;
  margin-right: 10px;
}
input[type="time"]:disabled {
  opacity: 0.3;
}
input[type="date"],
input[type="time"] {
  -webkit-appearance: none;
  appearance: none;
  display: block;
  inline-size: 100%;
  min-inline-size: 0;
  max-inline-size: 100%;
}
input::-webkit-date-and-time-value {
  min-width: 0;
  min-height: 1.5em;
  text-align: left;
}
input::-webkit-datetime-edit {
  min-width: 0;
  padding: 0;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  border: 1px solid var(--border);
  border-radius: 11px;
  padding: 10px 17px;
  background: var(--panel2);
  font-weight: 700;
  text-decoration: none;
}
.primary {
  background: #f2ede6;
  color: #242019;
  border-color: #f2ede6;
}
.mint {
  background: var(--mint);
  color: #1c1a17;
  border-color: var(--mint);
}
.subtle {
  background: transparent;
  color: #c9c1b6;
}
.danger {
  background: #f0a3a8;
  color: #281d1c;
}
.text-button {
  border: 0;
  background: transparent;
  color: #c9c1b6;
  min-height: 44px;
  padding: 8px;
}
.muted {
  color: var(--muted);
}
.fine {
  font-size: 12px;
  color: var(--muted);
}
.eyebrow {
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 1.3px;
  font-weight: 700;
  color: var(--muted);
}
.success {
  color: var(--mint);
}
.stale,
.offline {
  color: #f2c777 !important;
  font-size: 12px;
}
.empty {
  color: #948b7f;
  font-size: 14px;
  padding: 8px 0;
}
.loading {
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 28px;
}
.loading span {
  font-size: 14px;
  color: var(--muted);
  margin-top: 15px;
}
.connection {
  font-size: 11px;
  color: #a49b8e;
}
.connection:before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 7px;
  background: var(--mint);
  border-radius: 50%;
}
.connection.offline:before {
  background: #f2c777;
}
.mobile {
  width: 100%;
  min-width: 0;
  max-width: 560px;
  margin: 0 auto;
  padding-top: var(--safe-area-top);
  padding-right: var(--safe-area-right);
  padding-left: var(--safe-area-left);
  padding-bottom: calc(100px + var(--safe-area-bottom));
}
.mobile input,
.mobile select,
.auth-shell input,
.auth-shell select,
.modal input,
.modal select {
  font-size: 16px;
}
.mobile-header {
  position: relative;
  padding: 28px 22px 14px;
}
.mobile-header .eyebrow {
  margin-bottom: 8px;
}
.mobile-header .connection {
  margin-top: 12px;
}
.settings-link {
  position: absolute;
  right: 16px;
  top: 18px;
  font-size: 12px;
}
.tabs {
  min-width: 0;
  display: flex;
  margin: 4px 16px 22px;
  padding: 4px;
  background: #24211c;
  border: 1px solid #302b25;
  border-radius: 15px;
}
.tab {
  flex: 1 1 0;
  min-width: 0;
  overflow-wrap: anywhere;
  border: 0;
  border-radius: 11px;
  background: transparent;
  padding: 13px 5px;
  min-height: 46px;
  font-size: 14px;
  font-weight: 700;
  color: #aaa195;
}
.tab.active {
  background: var(--text);
  color: var(--bg);
  box-shadow: 0 2px 8px #0003;
}
.mobile-content {
  min-width: 0;
  width: 100%;
  padding: 0 16px;
}
.section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 15px;
  gap: 8px;
}
.section-heading .muted {
  font-size: 13px;
}
.member-legend {
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 18px;
}
.legend-item {
  font-size: 12px;
  border-left: 5px solid;
  border-radius: 2px;
  padding: 0 8px;
  margin: 0 10px 5px 0;
  color: #c9c1b6;
}
.day {
  background: #211e1a;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 13px 14px;
  margin-bottom: 10px;
  min-width: 0;
}
.day.today {
  background: #2b2823;
  border-color: #c9c1b6;
  box-shadow: 0 0 0 1px #c9c1b633;
}
.day-heading {
  display: flex;
  align-items: baseline;
  margin-bottom: 11px;
  gap: 8px;
}
.day-name {
  font-size: 17px;
}
.day-date {
  font-family: "DM Mono", monospace;
  font-size: 13px;
  color: var(--muted);
  margin-left: auto;
}
.today-label {
  font-size: 10px;
  font-weight: 600;
  background: #f2ede6;
  color: #2b2823;
  border-radius: 4px;
  padding: 1px 5px;
}
.event {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
  border: 0;
  border-radius: 8px;
  padding: 10px;
  margin-bottom: 7px;
  min-height: 44px;
  word-break: break-word;
}
.event:last-child {
  margin-bottom: 0;
}
.event-time {
  font-size: 12px;
  font-family: "DM Mono", monospace;
  min-width: 41px;
}
.event-body {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}
.event-title {
  font-size: 14px;
  font-weight: 650;
  line-height: 1.35;
  flex: 1;
}
.event-person {
  font-size: 11px;
  opacity: 0.7;
  flex-shrink: 0;
}
.event.timed {
  border-left: 4px solid;
  background: #302b2555;
}
.event.all-day {
  border: 1px solid;
}
.event.note {
  box-shadow: 0 2px 4px #0002;
}
.floating-add {
  position: fixed;
  bottom: calc(22px + var(--safe-area-bottom));
  left: 50%;
  transform: translateX(-50%);
  box-shadow: 0 8px 32px #0007;
  z-index: 5;
  white-space: nowrap;
}
.badge {
  font-family: "DM Mono", monospace;
  background: #393229;
  color: #d7cec1;
  border-radius: 7px;
  padding: 2px 9px;
  font-size: 13px;
}
.inline-form {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}
.inline-form input {
  flex: 1 1 0;
  width: 0;
}
.mobile .inline-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 48px;
  min-width: 0;
}
.mobile .inline-form input {
  width: 100%;
}
.mobile .shopping-panel,
.mobile .shopping-items {
  min-width: 0;
  max-width: 100%;
}
.add-item {
  width: 48px;
  flex: 0 0 48px;
  font-size: 25px;
  padding: 0;
}
.shopping-row {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #322c25;
  min-height: 59px;
}
.shopping-check {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  flex: 1;
  background: none;
  border: 0;
  text-align: left;
  min-height: 52px;
  padding: 8px 2px;
}
.checkbox {
  flex: 0 0 24px;
  height: 24px;
  border: 1.5px solid #7c7367;
  border-radius: 7px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
}
.shopping-text {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
  font-size: 17px;
  line-height: 1.4;
}
.checked .checkbox {
  background: var(--mint);
  color: #242019;
  border-color: var(--mint);
}
.checked .shopping-text {
  text-decoration: line-through;
  color: #81786d;
}
.remove {
  font-size: 24px;
  border: 0;
  background: transparent;
  min-width: 44px;
  height: 44px;
  padding: 0;
  color: #a59b8e;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.ui-icon{display:block;width:24px;height:24px;flex:0 0 auto;pointer-events:none}
.clear-checked {
  margin-top: 20px;
  width: 100%;
  font-size: 13px;
}
.note-form,
.settings-card {
  padding: 20px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 16px;
  margin-bottom: 18px;
}
.note-form h2,
.settings-card h3 {
  margin-bottom: 16px;
}
.family-admin-list { margin: 16px 0 24px; min-width: 0; }
.family-admin-row { padding: 16px 0; border-bottom: 1px solid var(--border); min-width: 0; overflow-wrap: anywhere; }
.family-admin-row h4 { margin: 0 0 6px; font-size: 16px; }
.family-admin-row p { margin: 6px 0; }
.family-admin-row .button { margin-top: 10px; max-width: 100%; min-height: 48px; white-space: normal; }
.family-invite-status { font-size: 14px; color: var(--muted); }
.field {
  display: block;
  min-width: 0;
  max-width: 100%;
  margin-bottom: 16px;
}
.field-label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 6px;
  color: #c9c1b6;
}
.form-row {
  display: flex;
  gap: 12px;
  align-items: center;
}
.form-row > .field {
  flex: 1;
  min-width: 0;
}
.mobile .form-row,
.modal .form-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.form-row > .field:only-child {
  grid-column: 1 / -1;
}
.mobile .form-row > *,
.modal .form-row > * {
  min-width: 0;
  max-width: 100%;
}
.check-label {
  display: flex;
  align-items: center;
  flex: 1;
  font-size: 14px;
  min-height: 44px;
  margin-bottom: 12px;
}
.date-shortcuts {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -2px 15px;
}
.date-shortcut {
  flex: 1;
  padding: 8px 4px;
  min-height: 44px;
  margin: 2px;
  border: 1px solid #443b30;
  background: #2e2821;
  border-radius: 6px;
  font-size: 10px;
  white-space: nowrap;
}
.note-form > .button {
  display: flex;
  width: 100%;
  margin: 10px 0 0;
}
.list-heading {
  margin: 26px 0 15px;
}
.note-list-item {
  display: flex;
  flex-direction: column;
  width: 100%;
  text-align: left;
  background: var(--panel);
  border: 1px solid var(--border);
  border-left: 5px solid;
  border-radius: 10px;
  padding: 13px;
  margin-bottom: 9px;
}
.note-list-item .muted {
  font-size: 12px;
}
.note-list-item strong {
  font-weight: 650;
  margin: 3px 0;
}
.settings > h2 {
  margin-bottom: 15px;
}
.settings > .button {
  margin-bottom: 20px;
}
.member-form {
  display: grid;
  grid-template-columns: 44px minmax(0,1fr) auto var(--remove-size,44px);
  gap: 8px;
  align-items: center;
  margin: 12px 0;
}
.member-form .button {
  font-size: 13px;
  padding: 8px 12px;
  min-width: 0;
}
.member-form input[type="text"] {
  width:100%;
  min-width:0;
}
.member-form-new{grid-template-columns:44px minmax(0,1fr) auto}
.member-form > *{min-width:0;max-width:100%}
.access-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid #3a352f;
  padding: 12px 0;
  overflow-wrap: break-word;
}
.access-row > div {
  min-width: 0;
}
.access-row .text-button {
  font-size: 12px;
  flex-shrink: 0;
}
.access-row p {
  margin: 3px 0;
}
.settings-card form {
  margin-top: 18px;
}
.settings-card form:not(.member-form) > .button {
  width: 100%;
}
.settings-card > .button {
  margin-top: 10px;
}
.auth-shell {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(24px + var(--safe-area-top)) calc(24px + var(--safe-area-right)) calc(24px + var(--safe-area-bottom)) calc(24px + var(--safe-area-left));
}
.auth-card {
  width: 100%;
  max-width: 430px;
  background: #242019;
  padding: 36px;
  border: 1px solid var(--border);
  border-radius: 22px;
  box-shadow: 0 20px 80px #0002;
}
.auth-card .eyebrow {
  color: var(--mint);
  margin-bottom: 18px;
}
.auth-card h1 {
  font-size: 32px;
  margin-bottom: 18px;
}
.auth-card p {
  margin-bottom: 22px;
}
.auth-card .button {
  width: 100%;
  margin-bottom: 12px;
}
.auth-card form {
  margin-top: 28px;
}
.auth-card .fine {
  margin: 15px 0 0;
}
.modal-open {
  overflow: hidden;
}
.modal-overlay {
  position: fixed;
  z-index: 30;
  inset: 0;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #000b;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(20px + var(--safe-area-top)) calc(20px + var(--safe-area-right)) calc(20px + var(--safe-area-bottom)) calc(20px + var(--safe-area-left));
}
.modal {
  background: #242019;
  border: 1px solid #544a3e;
  border-radius: 22px;
  width: 100%;
  max-width: 550px;
  max-height: 92vh;
  max-height: min(92vh, calc(100% - var(--safe-area-top) - var(--safe-area-bottom)));
  overflow: auto;
  padding: 20px;
  box-shadow: 0 20px 80px #0008;
}
.modal-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.modal .note-form {
  border: 0;
  padding: 0;
  margin-bottom: 0;
}
.modal .note-form > h2 {
  display: none;
}
.day-detail .event {
  margin-bottom: 12px;
}
.day-detail > .button {
  margin-top: 20px;
}
.modal p {
  margin-bottom: 20px;
}
#notice {
  position: fixed;
  left: 50%;
  bottom: calc(25px + var(--safe-area-bottom));
  transform: translateX(-50%);
  z-index: 50;
  width: calc(100% - 32px);
  max-width: 520px;
  padding: 14px 18px;
  border-radius: 12px;
  box-shadow: 0 10px 40px #0005;
  background: #7fd1c4;
  color: #142923;
  font-size: 14px;
  display: none;
}
#notice.visible {
  display: block;
}
#notice.error {
  background: #f2c777;
  color: #38280b;
}
.night-shade {
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 100;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.6);
}
.night .night-shade {
  display: block;
}
/* The wall follows the original seven-column / seven-row composition. */
.wall-mode {
  height: 100vh;
  overflow: hidden;
}
.wall {
  height: 100vh;
  display: flex;
  flex-direction: column;
  padding: 24px 28px 10px;
}
.wall-top {
  display: flex;
  align-items: stretch;
  gap: 20px;
  margin-bottom: 22px;
  flex: 0 0 auto;
}
.clock-block {
  flex: 0 0 25%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.clock {
  font-family: "DM Mono", monospace;
  font-size: 80px;
  line-height: 1.05;
  letter-spacing: -5px;
  color: #f2ede6;
}
.long-date {
  font-size: 17px;
  font-weight: 600;
  margin-top: 8px;
  text-transform: capitalize;
}
.namedays {
  font-size: 13px;
  margin-top: 5px;
}
.metrics {
  display: flex;
  gap: 14px;
  flex: 1;
  min-width: 0;
}
.metric-card {
  background: #242019;
  border-radius: 19px;
  padding: 16px 18px;
  flex: 1;
  min-width: 0;
}
.metric-value {
  font-size: 43px;
  font-weight: 750;
  letter-spacing: -1.5px;
  line-height: 1.2;
}
.weather-current,
.price-current {
  display: flex;
  gap: 10px;
  align-items: baseline;
  margin-top: 7px;
}
.weather-current > span {
  font-size: 13px;
}
.weather-current .weather-icon{width:56px;height:56px;flex:0 0 56px;align-self:center}
.weather-current>span{min-width:0;overflow-wrap:break-word}
.metric-card[role="button"]{cursor:pointer;position:relative}
.metric-card[role="button"]:focus-visible{outline:2px solid var(--mint);outline-offset:4px}
.metric-card[role="button"]>.eyebrow{padding-right:32px}
.metric-expand-icon{position:absolute;right:10px;top:9px;color:#c9c1b6}
.metric-detail {
  font-size: 12px;
  color: #c9c1b6;
  margin: 6px 0;
}
.forecast {
  display: flex;
  gap: 10px;
  margin-top: 9px;
  padding-top: 9px;
  border-top: 1px solid #3a352f;
}
.forecast-day {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-width: 0;
}
.forecast-day > strong {
  font-size: 20px;
}
.forecast-day > .muted {
  font-size: 11px;
}
.forecast-day > .fine {
  font-size: 10px;
  line-height: 1.3;
}
.price-chart {
  position: relative;
  height: 78px;
  display: flex;
  margin-top: 5px;
  align-items: stretch;
  background: none;
}
.price-zero-line{position:absolute;left:0;right:0;height:1px;background:#9b8d7b;pointer-events:none}
.price-slot {
  flex: 1;
  position: relative;
  margin: 0 0.5px;
}
.price-bar {
  position: absolute;
  width: 100%;
  bottom: 50%;
  border-radius: 2px 2px 0 0;
}
.price-bar.negative {
  top: 50%;
  bottom: auto;
  border-radius: 0 0 2px 2px;
}
.price-slot.past {
  opacity: 0.4;
}
.price-slot.current {
  background: #f2ede622;
  opacity: 1;
}
.price-slot.current .price-bar {
  background: #f2ede6 !important;
}
.chart-labels {
  white-space: pre;
  text-align: justify;
  overflow: hidden;
  font: 10px monospace;
  color: #8e8579;
}
.add-note {
  align-self: center;
  background: var(--text);
  border: 0;
  border-radius: 50%;
  color: #242019;
  width: 64px;
  height: 64px;
  flex: 0 0 64px;
  font-size: 40px;
  line-height: 1;
  box-shadow: 0 8px 26px #0004;
}
.wall-body {
  display: flex;
  gap: 18px;
  flex: 1;
  min-height: 0;
}
.week-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 9px;
  flex: 1;
  min-width: 0;
  min-height: 0;
}
.wall .day {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 12px 8px;
  border-radius: 15px;
  min-height: 0;
  overflow: hidden;
}
.wall .day-heading {
  flex-wrap: wrap;
  padding: 0 3px;
  gap: 5px;
}
.wall .day-name {
  font-size: 17px;
}
.wall .day-date {
  font-size: 12px;
}
.wall .today-label {
  display: none;
}
.wall .day-items {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  padding: 6px 3px 0;
}
.wall .event {
  display: block;
  padding: 9px 7px;
  margin-bottom: 11px;
}
.wall .event-body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
.wall .event-title {
  font-size: 13px;
}
.wall .event-person {
  font-size: 10px;
}
.wall .event-time {
  font-size: 12px;
  display: block;
  margin-bottom: 5px;
}
.wall .event.note {
  position: relative;
  transform: rotate(-1.2deg);
  box-shadow: 0 5px 9px #0004;
  margin-top: 6px;
}
.wall .event.note:nth-child(even) {
  transform: rotate(1.2deg);
}
.wall .event.note:before {
  content: "";
  position: absolute;
  top: -5px;
  left: calc(50% - 17px);
  width: 34px;
  height: 10px;
  border-radius: 1px;
  background: #f2ede688;
  transform: rotate(-3deg);
}
.wall .event.note .event-time {
  font-size: 10px;
}
.wall .day-more {
  background: none;
  border: 0;
  border-top: 1px solid #484035;
  color: #c9c1b6;
  font-size: 11px;
  min-height: 44px;
  margin-top: 6px;
  flex: 0 0 44px;
}
.wall .shopping-panel {
  width: 240px;
  flex: 0 0 240px;
  background: #242019;
  border-radius: 16px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.wall .shopping-panel h2 {
  font-size: 18px;
}
.wall .shopping-items {
  flex: 1;
  min-height: 0;
  overflow: auto;
}
.wall .shopping-panel > .section-heading,
.wall .shopping-panel > .inline-form { flex-shrink: 0; }
.wall .shopping-text {
  font-size: 15px;
}
.wall .shopping-check {
  gap: 8px;
}
.wall .shopping-row {
  min-height: 51px;
}
.wall .shopping-panel input {
  font-size: 13px;
}
.wall .shopping-panel .remove {
  min-width: 30px;
}
.wall-footer {
  display: flex;
  justify-content: space-between;
  flex: 0 0 24px;
  padding-top: 8px;
  font-size: 10px;
}
.wall-footer a {
  color: #9c948a;
}
.wall-footer .connection {
  font-size: 10px;
}
@media (min-width: 1600px) {
  .wall {
    padding: 34px 42px 14px;
  }
  .wall-top {
    gap: 25px;
    margin-bottom: 28px;
  }
  .clock {
    font-size: 112px;
  }
  .long-date {
    font-size: 22px;
  }
  .metric-card {
    padding: 20px 24px;
  }
  .metric-value {
    font-size: 57px;
  }
  .metric-card .eyebrow {
    font-size: 13px;
  }
  .weather-current > span {
    font-size: 18px;
  }
  .metric-detail {
    font-size: 15px;
  }
  .forecast-day > strong {
    font-size: 26px;
  }
  .forecast-day > .fine {
    font-size: 12px;
  }
  .wall .shopping-panel {
    width: 300px;
    flex-basis: 300px;
  }
  .wall .event-title {
    font-size: 17px;
  }
  .wall .event-person {
    font-size: 13px;
  }
  .wall .event-time {
    font-size: 16px;
  }
  .wall .day-name {
    font-size: 22px;
  }
  .wall .day-date {
    font-size: 17px;
  }
  .wall .shopping-text {
    font-size: 19px;
  }
  .add-note {
    width: 80px;
    height: 80px;
    flex-basis: 80px;
  }
  .week-grid {
    gap: 13px;
  }
  .wall .day {
    padding: 17px 12px;
  }
  .wall .day-more {
    font-size: 13px;
  }
  .wall .shopping-panel .remove {
    min-width: 44px;
  }
}
@media (orientation: portrait) {
  .wall {
    padding: 22px 24px 9px;
  }
  .wall-top {
    position: relative;
    display: block;
    margin-bottom: 18px;
  }
  .clock-block {
    min-height: 105px;
    margin-bottom: 18px;
    padding-right: 70px;
  }
  .clock {
    font-size: 76px;
  }
  .long-date {
    font-size: 17px;
  }
  .metrics {
    gap: 14px;
  }
  .metric-card {
    padding: 15px 18px;
  }
  .metric-value {
    font-size: 39px;
  }
  .add-note {
    position: absolute;
    top: 20px;
    right: 0;
  }
  .wall-body {
    flex-direction: column;
    gap: 15px;
  }
  .week-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: repeat(7, minmax(0, 1fr));
    gap: 8px;
  }
  .wall .day {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    padding: 10px 12px;
    gap: 10px;
  }
  .wall .day-heading {
    flex: 0 0 61px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    margin: 0;
    border-right: 1px solid #3a352f;
    padding-right: 10px;
  }
  .wall .day-date {
    margin: 0;
  }
  .wall .day-items {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 3px;
  }
  .wall .event {
    flex: 0 0 40%;
    max-height: 100%;
    overflow: hidden;
    margin: 0;
  }
  .wall .event.note {
    margin: 0;
  }
  .wall .event.timed {
    flex-basis: 40%;
  }
  .wall .day-more {
    flex: 0 0 44px;
    width: 44px;
    writing-mode: vertical-rl;
    min-height: 44px;
    margin: 0;
    border: 0;
    border-left: 1px solid #484035;
    font-size: 10px;
    padding: 4px 8px;
  }
  .wall .shopping-panel {
    width: 100%;
    flex: 0 0 200px;
    padding: 14px 18px;
    position: relative;
  }
  .wall .shopping-panel > .section-heading {
    max-width: 43%;
    height: 44px;
    margin-bottom: 8px;
  }
  .wall .shopping-panel > .inline-form {
    position: absolute;
    top: 14px;
    right: 18px;
    width: 49%;
  }
  .wall .shopping-items {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 22px;
    align-items: start;
  }
  .wall .shopping-items > .empty {
    grid-column: 1 / 3;
  }
  .wall .shopping-row {
    min-height: 44px;
  }
  .wall .shopping-check {
    min-height: 44px;
  }
  .wall .clear-checked {
    margin: 7px 0;
  }
  .wall .metric-card .fine {
    font-size: 10px;
  }
  .wall .price-chart {
    height: 76px;
  }
  .wall .weather-current {
    margin-top: 5px;
  }
  .wall .forecast {
    margin-top: 6px;
    padding-top: 6px;
  }
}
@media (orientation: landscape) and (max-height: 760px) {
  .wall {
    padding: 14px 18px 6px;
  }
  .wall-top {
    gap: 14px;
    margin-bottom: 14px;
  }
  .clock {
    font-size: 66px;
  }
  .clock-block {
    flex-basis: 24%;
  }
  .long-date {
    font-size: 13px;
  }
  .metric-card {
    padding: 12px;
  }
  .metric-value {
    font-size: 33px;
  }
  .forecast-day > .fine {
    display: none;
  }
  .metric-detail,
  .metric-card .fine {
    font-size: 10px;
  }
  .price-chart {
    height: 58px;
  }
  .metric-card .eyebrow {
    font-size: 9px;
  }
  .wall .shopping-panel {
    width: 210px;
    flex-basis: 210px;
    padding: 12px;
  }
  .wall-body {
    gap: 12px;
  }
  .week-grid {
    gap: 6px;
  }
  .wall .day {
    padding: 9px 5px;
  }
  .wall .event-title {
    font-size: 12px;
  }
  .wall .event {
    padding: 7px 5px;
  }
  .add-note {
    width: 50px;
    height: 50px;
    flex-basis: 50px;
  }
  .wall .shopping-panel .add-item {
    width: 44px;
    flex-basis: 44px;
  }
}
@media (max-width: 400px) {
  .mobile-header {
    padding-left: 17px;
  }
  .mobile-content {
    padding: 0 12px;
  }
  .mobile h1 {
    font-size: 25px;
  }
  .event-body {
    gap: 5px;
  }
  .event-person {
    font-size: 10px;
  }
  .note-form,
  .settings-card {
    padding: 15px;
  }
  .member-form {
    grid-template-columns:44px minmax(0,1fr) var(--remove-size,44px);
  }
  .member-form input[type=color]{grid-column:1;grid-row:1}
  .member-form input[type=text]{grid-column:2/-1;grid-row:1}
  .member-form > .button{grid-column:1/3;grid-row:2}
  .member-form > .remove{grid-column:3;grid-row:2}
  .member-form-new > .button{grid-column:1/-1}
  .member-form .remove {
    min-width: 44px;
  }
  .auth-card {
    padding: 25px;
  }
  .form-row {
    gap: 8px;
  }
  .date-shortcut {
    font-size: 9px;
  }
  .modal-overlay {
    padding: calc(10px + var(--safe-area-top)) calc(10px + var(--safe-area-right)) calc(10px + var(--safe-area-bottom)) calc(10px + var(--safe-area-left));
  }
  .modal {
    padding: 16px;
  }
}

.wall-footer {
  flex-basis: 44px;
  align-items: center;
  padding-top: 0;
}
.wall-footer .calendar-toggle {
  font-size: 12px;
  padding: 5px 12px;
  min-height: 44px;
}
.wall .event.note:not(.note-timed) .event-time {
  display: none;
}
.long-date {
  text-transform: none;
}
.long-date:first-letter {
  text-transform: uppercase;
}
.source-status{color:#f2c777;background:#352a1d;border:1px solid #5c462c;padding:10px 12px;border-radius:9px;font-size:12px;line-height:1.4;margin-bottom:12px}.source-status[hidden]{display:none}.wall>.source-status{flex:0 0 auto;margin-bottom:10px}
.wall-mode,.wall{height:var(--viewport-height,100vh)}
@media(orientation:portrait) and (max-height:1200px){
 .wall{padding:16px 20px 6px}
 .wall-top{margin-bottom:12px}
 .clock-block{min-height:88px;margin-bottom:12px}
 .clock{font-size:64px}
 .long-date{font-size:15px;margin-top:5px}
 .wall .metric-card{padding:12px 14px}
 .wall .metric-value{font-size:32px}
 .wall .forecast{margin-top:5px;padding-top:5px}
 .wall .forecast-day>strong{font-size:18px}
 .wall .metric-card .fine{font-size:9px}
 .wall .price-chart{height:68px}
 .wall .shopping-panel{flex-basis:160px}
 .wall .day-heading{flex-wrap:nowrap}
 .wall .event{padding:7px}
}
/* Persisted per-person wall visibility and note-focused reference layout. */
.wall-calendar-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;flex:0 0 auto;min-height:48px;margin-bottom:13px}
.calendar-status{text-align:left;font-size:11px;font-weight:650;letter-spacing:.5px;text-transform:uppercase;padding:5px 0;min-height:44px}
.calendar-choices{display:flex;gap:8px;flex:0 0 auto}
.calendar-owner{font-size:13px;padding:9px 16px;min-height:44px;border-radius:10px}
.wall .day-items{display:flex;flex-direction:column;gap:10px}
.wall .all-day-items,.wall .timed-items{min-height:0;min-width:0;overflow:hidden;flex:1}
.wall .all-day-items{padding-top:6px}
.wall .timed-items{border-top:1px dashed #51463a;padding-top:10px}
.wall .timed-items:only-child{border-top:0;padding-top:0}
.notes-only .wall .all-day-items{border:0;flex:1}
.notes-only .wall .event.note{padding:16px 10px 13px;border-radius:5px;margin-bottom:18px}
.notes-only .wall .event-title{font-size:19px;line-height:1.3;font-weight:700}
.notes-only .wall .event-person{font-size:12px}
.notes-only .wall .event.note-timed .event-time{font-size:13px;font-weight:600}
.person-options{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.person-option{border:1px solid #3a352f;border-radius:10px;min-height:46px;padding:9px 15px;font-weight:700;flex:1}
.date-shortcut{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:49px}
.date-shortcut strong{font-size:12px}
.date-shortcut span{font:10px 'DM Mono',monospace;margin-top:3px}
.date-shortcut[aria-pressed=true]{background:#f2ede6;color:#1c1a17;border-color:#f2ede6}
.note-switch-row{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:58px;margin:0 0 12px;padding:12px 0;border-bottom:1px solid var(--border);font-size:16px;cursor:pointer}
.note-switch-row input[type="checkbox"]{position:absolute;right:0;top:50%;transform:translateY(-50%);width:46px;height:26px;min-height:0;margin:0;padding:0;opacity:0;cursor:pointer}
.note-switch-track{display:block;position:relative;flex:0 0 46px;height:26px;border-radius:20px;background:#51493f;pointer-events:none}
.note-switch-track:after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#c9c1b6}
.note-switch-row input:checked+.note-switch-track{background:var(--mint)}
.note-switch-row input:checked+.note-switch-track:after{transform:translateX(20px);background:var(--bg)}
.note-switch-row input:focus-visible+.note-switch-track{outline:2px solid var(--mint);outline-offset:4px}
.note-form .note-time-field{width:100%;margin:4px 0 12px}
.note-form .note-time-field[hidden]{display:none}
.note-form .note-time-field input[type="time"]{width:100%;height:48px;min-height:48px}
.note-list-item.editing{outline:1px solid #f2ede6;outline-offset:1px}
@media(min-width:1600px){.notes-only .wall .event-title{font-size:26px}.notes-only .wall .event.note{padding:22px 16px 16px}.calendar-status{font-size:14px}.calendar-owner{font-size:16px;padding:11px 22px}}
@media(orientation:portrait){
 .wall-calendar-controls{margin-bottom:12px;gap:12px}
 .calendar-status{max-width:48%;font-size:10px;line-height:1.5}
 .calendar-owner{font-size:12px;padding:9px 14px}
 .wall .day-items{flex-direction:row;align-items:stretch;gap:10px}
 .wall .all-day-items{flex:1;display:flex;align-items:center;gap:8px;padding-top:3px}
 .wall .timed-items{flex:1.3;border-top:0;border-left:1px dashed #51463a;padding:0 0 0 10px;display:flex;flex-direction:column;justify-content:flex-start;gap:5px}
 .wall .timed-items:only-child{border:0;padding:0;justify-content:center}
 .wall .all-day-items>.event{flex:1;min-width:0;margin:0}
 .wall .timed-items>.event{flex:0 0 auto;display:flex;gap:7px;align-items:center;padding:7px;min-height:44px}
 .wall .timed-items>.event .event-time{margin:0;min-width:35px;font-size:10px}
 .wall .timed-items>.event .event-body{flex-direction:row;align-items:center}
 .wall .timed-items>.event .event-title{font-size:12px}
 .wall .timed-items>.event .event-person{display:none}
 .notes-only .wall .all-day-items{flex:1;gap:12px}
 .notes-only .wall .event.note{padding:11px 14px;margin:0}
 .notes-only .wall .event-body{flex-direction:row;align-items:baseline;gap:9px}
 .notes-only .wall .event-title{font-size:21px}
 .notes-only .wall .event-person{font-size:11px}
 .notes-only .wall .event.note:before{left:18px}
}
@media(orientation:portrait) and (max-height:1200px){
 .wall .shopping-panel{flex-basis:145px}
 .wall-calendar-controls{margin-bottom:8px}
 .calendar-status{font-size:9px}
 .notes-only .wall .event-title{font-size:19px}
 .notes-only .wall .event.note{padding:9px 12px}
 .wall .day{padding-top:8px;padding-bottom:8px}
 .wall .day-heading{flex:0 0 61px}
}
@media(orientation:landscape) and (max-height:760px){.notes-only .wall .event-title{font-size:17px}.notes-only .wall .event.note{padding:13px 8px}.wall-calendar-controls{margin-bottom:8px}.calendar-owner{font-size:12px;min-height:44px;padding:7px 14px}}

.recurrence-description{margin:0 0 15px}.recurrence-badge{display:block;font-size:10px;font-weight:600;line-height:1.4;opacity:.8;margin-top:5px}.event.recurring{flex-wrap:wrap}.event>.recurrence-badge{flex-basis:100%;padding-left:51px}.wall .event>.recurrence-badge{padding-left:0;font-size:10px}.note-list-item>.recurrence-badge{color:#c9c1b6}.nameday-source{display:inline-block;font-size:10px;margin-left:8px;color:#a59b8e;text-decoration:none}.mobile-header .namedays{font-size:12px;margin-top:8px}.namedays[hidden]{display:none}

/* Phone calendar visibility belongs to this browser, independently of the wall. */
.mobile-calendar-controls{display:flex;flex-direction:column;align-items:stretch;gap:8px;min-width:0;max-width:100%;margin:0 0 18px}
.mobile-calendar-controls .calendar-status{width:100%;max-width:100%;min-width:0;text-align:left;font-size:11px;letter-spacing:.3px;white-space:normal}
.mobile-calendar-controls .calendar-choices{display:flex;flex-wrap:wrap;gap:8px;min-width:0;max-width:100%}
.mobile-calendar-controls .calendar-owner{flex:1 1 80px;min-width:0;max-width:100%;min-height:44px;padding:9px 12px;font-size:13px;white-space:normal;overflow-wrap:break-word}

/* Keep the wall's controls together under the clock and release space for notes. */
.wall{padding-bottom:16px}
.wall-top{gap:16px;margin-bottom:14px;align-items:stretch}
.clock-block{min-width:0;justify-content:flex-start}
.wall .clock{font-size:72px;letter-spacing:-4px}
.wall .long-date{font-size:16px}
.wall .metric-card{padding:13px 16px}
.wall .metric-value{font-size:39px}
.wall .forecast{margin-top:7px;padding-top:7px}
.wall .price-chart{height:62px;margin-top:8px}
.clock-block .wall-calendar-controls{display:block;min-height:0;margin:12px 0 0;padding-top:10px;border-top:1px solid #3a352f}
.wall-calendar-controls .calendar-status{display:none}
.clock-block .calendar-choices{display:flex;flex-wrap:wrap;gap:6px;min-width:0}
.clock-block .calendar-owner{flex:1 1 0;min-width:0;padding:8px 7px;font-size:12px;min-height:44px;white-space:normal}
.wall .connection:not(.offline){display:none}
.wall .connection.offline{margin-top:7px;font-size:11px}
.wall-tools{flex:0 0 64px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}
.wall-info{display:flex;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;border:1px solid #776e61;border-radius:50%;background:transparent;color:#c9c1b6;font:bold 24px Georgia,serif;padding:0}
.price-now-marker{position:absolute;top:-2px;bottom:-2px;width:2px;transform:translateX(-1px);background:#f2ede6;box-shadow:0 0 4px #0007;pointer-events:none;z-index:1}
.data-sources a{display:block;margin-top:10px;font-size:13px}
@media(min-width:1600px){
 .wall .clock{font-size:92px}
 .wall .long-date{font-size:19px}
 .wall .metric-value{font-size:48px}
 .wall .metric-card{padding:17px 20px}
 .clock-block .calendar-owner{font-size:15px}
 .wall-tools{flex-basis:80px}
 .wall .price-chart{height:72px}
}
@media(orientation:portrait){
 .wall-top{margin-bottom:14px}
 .clock-block{min-height:0;margin-bottom:14px;padding-right:132px}
 .wall .clock{font-size:64px}
 .wall .long-date{font-size:16px}
 .wall-tools{position:absolute;top:10px;right:0;display:flex;flex-direction:row-reverse;gap:12px}
 .wall-tools .add-note{position:static}
 .clock-block .wall-calendar-controls{max-width:470px;margin-top:9px;padding-top:8px}
 .wall .metric-card{padding:12px 15px}
 .wall .metric-value{font-size:34px}
 .wall .price-chart{height:58px}
}
@media(orientation:landscape) and (max-height:760px){
 .wall-top{gap:12px;margin-bottom:12px}
 .wall .clock{font-size:60px}
 .wall .long-date{font-size:13px}
 .wall .metric-value{font-size:32px}
 .wall .metric-card{padding:11px 13px}
 .wall .price-chart{height:54px}
 .clock-block .wall-calendar-controls{margin-top:8px;padding-top:8px}
 .wall-tools{flex-basis:50px;gap:8px}
}
@media(orientation:portrait){
 .wall .shopping-panel{flex-basis:210px}
 .wall .day-heading{flex-direction:column;align-items:flex-start;justify-content:center}
 .wall .event.note{
  display:grid;
  transform:none;
  grid-template-columns:auto minmax(0,1fr);
  grid-template-areas:"time body" "repeat repeat";
  column-gap:8px;
  row-gap:3px;
  align-items:center;
  min-height:44px;
 }
 .wall .event.note:not(.note-timed){grid-template-columns:minmax(0,1fr);grid-template-areas:"body" "repeat"}
 .wall .event.note .event-time{grid-area:time;min-width:34px;margin:0;font-size:12px;align-self:center}
 .wall .event.note .event-body{grid-area:body;min-width:0;flex-direction:row;align-items:center;gap:8px}
 .wall .event.note .event-title{min-width:0}
 .wall .event.note>.recurrence-badge{grid-area:repeat;min-width:0;margin:0;padding:0;line-height:1.2}
}
@media(orientation:portrait) and (max-height:1400px){
 .wall .all-day-items{align-items:center;padding:0}
 .wall .day{padding-top:6px;padding-bottom:6px}
 .wall .day-items{padding-top:2px;padding-bottom:2px}
 .wall .event.note,.notes-only .wall .event.note{padding:6px 8px;row-gap:2px}
 .wall .event.note .event-title,.notes-only .wall .event-title{font-size:16px;line-height:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .wall .event.note .event-person{font-size:10px;line-height:12px;max-width:30%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .wall .event.note .event-time{font-size:11px;line-height:20px}
 .wall .event.note>.recurrence-badge{font-size:10px;line-height:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
@media(orientation:portrait) and (max-height:1200px){.wall .shopping-panel{flex-basis:180px}}
/* Portrait wall: a selected-day agenda, with its date always outside the scroll area. */
@media(min-width:0px){
 .wall-mode .wall{padding:18px 20px 16px;gap:14px;position:relative;overflow:hidden}
 .portrait-top-row{display:flex;align-items:center;gap:14px;flex:0 0 auto;min-height:80px}
 .portrait-day-nav{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;flex:1;min-width:0}
 .portrait-day-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;min-height:78px;padding:7px 3px;border:1px solid #4d4438;border-radius:12px;background:#242019;color:#c9c1b6}
 .portrait-day-name{font-size:18px;font-weight:800;line-height:1.2}
 .portrait-day-date{font:13px 'DM Mono',monospace}
 .portrait-today-label{font-size:9px;letter-spacing:.4px;font-weight:800;line-height:12px;min-height:12px}
 .portrait-day-button.is-today{border:2px solid #7fd1c4;color:#7fd1c4}
 .portrait-day-button.is-selected{background:#f2ede6;color:#1c1a17;border-color:#f2ede6;box-shadow:0 3px 12px #0003}
 .portrait-day-button.is-today.is-selected{border-color:#7fd1c4;box-shadow:inset 0 -4px 0 #7fd1c4}
 .wall-mode .wall-tools{position:static;flex:0 0 116px;display:flex;flex-direction:row-reverse;align-items:center;justify-content:flex-start;gap:8px}
 .wall-mode .wall-tools .add-note{width:64px;height:64px;flex:0 0 64px;position:static}
 .wall-mode .wall-tools .wall-info{flex:0 0 44px}
 .wall-mode .wall>.source-status{margin:0;flex:0 0 auto}
 .wall-mode .wall-body{display:flex;flex-direction:column;gap:14px;min-height:0;flex:1}
 .wall-mode .wall .week-grid.portrait-agenda{display:flex;flex-direction:column;flex:1;min-height:0;gap:0;border:1px solid #4a4135;border-radius:18px;background:#211e1a;overflow:hidden}
 .agenda-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 14px;padding:18px 20px 10px;flex:0 0 auto;background:#2b2823;border-bottom:1px solid #3a352f}
 .agenda-date{font-size:29px;line-height:1.2;font-weight:750;letter-spacing:-.7px;text-transform:none}.agenda-date:first-letter{text-transform:uppercase}
 .agenda-summary{display:flex;justify-content:space-between;align-items:center;gap:10px;flex:0 0 auto;padding:8px 20px;color:#b4aa9c;font-size:12px;background:#211e1a}
 .agenda-scroll-hint{color:#d9cdbb;font-size:11px}
 .agenda-scroll-hint[hidden]{display:none}
 .agenda-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:8px 18px 18px;scrollbar-color:#716454 #242019}
 .agenda-empty{padding:28px 0;color:#b4aa9c;font-size:18px}
 .wall-mode .wall .portrait-agenda .event,.wall-mode .wall .portrait-agenda .event.note,.wall-mode .wall .portrait-agenda .event.note:not(.note-timed){display:grid;grid-template-columns:88px minmax(0,1fr);grid-template-areas:'time body' 'repeat repeat';column-gap:16px;row-gap:8px;align-items:start;width:100%;height:auto;max-height:none;min-height:100px;overflow:visible;flex:none;padding:20px 22px;margin:0 0 16px;transform:none;border-radius:12px}
 .wall-mode .wall .portrait-agenda .event.note:before{left:30px;width:42px;top:-4px}
 .wall-mode .wall .portrait-agenda .event .event-time,.wall-mode .wall .portrait-agenda .event.note:not(.note-timed) .event-time{display:block;grid-area:time;align-self:start;font:500 16px/1.4 'DM Mono',monospace;min-width:0;margin:1px 0 0;white-space:normal;overflow:visible;text-overflow:clip}
 .wall-mode .wall .portrait-agenda .event .event-body{grid-area:body;display:block;min-width:0;max-width:none;overflow:visible}
 .wall-mode .wall .portrait-agenda .event .event-title,.wall-mode.notes-only .wall .portrait-agenda .event-title{display:block;max-width:none;min-width:0;font-size:25px;font-weight:750;line-height:1.35;white-space:normal;overflow:visible;text-overflow:clip;word-break:break-word;overflow-wrap:break-word;-webkit-line-clamp:unset}
 .wall-mode .wall .portrait-agenda .event .event-person{display:block;max-width:none;margin-top:7px;font-size:14px;line-height:1.4;white-space:normal;overflow:visible;text-overflow:clip}
 .wall-mode .wall .portrait-agenda .event>.recurrence-badge{display:block;grid-area:repeat;max-width:none;min-width:0;padding:0;margin:0 0 0 104px;font-size:13px;line-height:1.4;white-space:normal;overflow:visible;text-overflow:clip}
 .wall-mode .wall .shopping-panel{flex:0 0 200px;width:100%;min-height:0;padding:12px 16px}
 .wall-mode .wall .shopping-panel>.inline-form{top:12px;right:16px}
 .wall-mode .wall .shopping-panel>.section-heading{margin-bottom:4px}
 .portrait-support{display:flex;gap:12px;flex:0 0 auto;min-height:198px;min-width:0}
 .portrait-support .clock-block{flex:0 0 25%;padding:12px 0 0;min-width:0;min-height:0;margin:0;justify-content:flex-start}
 .wall-mode .portrait-support .clock{font-size:44px;letter-spacing:-2px;line-height:1.1}
 .wall-mode .portrait-support .long-date{font-size:12px;line-height:1.4;margin-top:6px}
 .wall-mode .portrait-support .namedays{font-size:11px;line-height:1.4;margin-top:4px}
 .portrait-support .clock-block .wall-calendar-controls{margin-top:8px;padding-top:8px;max-width:none}
 .portrait-support .clock-block .calendar-choices{gap:4px}
 .portrait-support .clock-block .calendar-owner{min-height:44px;font-size:10px;padding:6px 4px}
 .portrait-support .metrics{flex:1;display:flex;gap:10px;min-width:0}
 .wall-mode .portrait-support .metric-card{padding:12px;min-width:0;min-height:0;overflow:hidden;border-radius:14px}
 .wall-mode .portrait-support .eyebrow{font-size:9px;letter-spacing:.6px}
 .wall-mode .portrait-support .metric-value{font-size:30px;line-height:1.2}
 .wall-mode .portrait-support .weather-current{gap:7px;margin-top:6px}
 .wall-mode .portrait-support .weather-current>span{font-size:11px}
 .wall-mode .portrait-support .metric-detail{font-size:10px;line-height:1.4;margin:4px 0}
 .wall-mode .portrait-support .fine{font-size:9px;line-height:1.35}
 .wall-mode .portrait-support .forecast{margin-top:8px;padding-top:6px;gap:6px}
 .wall-mode .portrait-support .forecast-day>strong{font-size:18px}
 .wall-mode .portrait-support .forecast-day>.fine{font-size:9px}
 .wall-mode .portrait-support .price-chart{height:62px;margin-top:7px}
}

@media(orientation:portrait) and (min-height:1600px){
 .portrait-wall .wall{padding:24px 30px;gap:20px}
 .portrait-day-button{min-height:92px}
 .portrait-day-name{font-size:23px}.portrait-day-date{font-size:16px}.portrait-today-label{font-size:11px}
 .agenda-heading{padding:23px 28px 14px}.agenda-date{font-size:36px}.agenda-context{font-size:15px}
 .agenda-summary{font-size:14px;padding:10px 28px}.agenda-scroll-hint{font-size:13px}
 .agenda-scroll{padding:12px 26px 24px}
 .portrait-wall .wall .portrait-agenda .event,.portrait-wall .wall .portrait-agenda .event.note,.portrait-wall .wall .portrait-agenda .event.note:not(.note-timed){padding:25px 28px;grid-template-columns:110px minmax(0,1fr);column-gap:22px;min-height:130px;margin-bottom:20px}
 .portrait-wall .wall .portrait-agenda .event .event-title,.portrait-wall.notes-only .wall .portrait-agenda .event-title{font-size:32px}
 .portrait-wall .wall .portrait-agenda .event .event-time{font-size:20px}.portrait-wall .wall .portrait-agenda .event .event-person{font-size:17px}
 .portrait-wall .wall .portrait-agenda .event>.recurrence-badge{font-size:16px;margin-left:132px}
 .portrait-support{min-height:225px}.portrait-wall .portrait-support .clock{font-size:60px}.portrait-wall .portrait-support .long-date{font-size:16px}.portrait-wall .portrait-support .namedays{font-size:13px}
 .portrait-support .clock-block .calendar-owner{font-size:13px}.portrait-wall .portrait-support .metric-value{font-size:42px}.portrait-wall .portrait-support .metric-detail{font-size:13px}.portrait-wall .portrait-support .eyebrow{font-size:12px}.portrait-wall .portrait-support .fine{font-size:11px}
 .portrait-wall .portrait-support .forecast-day>strong{font-size:24px}.portrait-wall .portrait-support .forecast-day>.fine{font-size:11px}
 .portrait-wall .wall .shopping-panel{flex-basis:250px}
}

@media(orientation:portrait) and (max-height:1200px){.portrait-wall .wall .shopping-panel{flex-basis:180px}}

/* One independent, accessible switch per actual calendar owner. */
.calendar-controls-label{display:block;margin:0 0 7px;color:#aaa195;font-size:10px;line-height:1.3;font-weight:700;letter-spacing:1px;text-transform:uppercase}
.wall-calendar-controls .calendar-controls-label{display:none}
.mobile-calendar-controls{gap:0}
.mobile-calendar-controls .calendar-choices,.clock-block .calendar-choices{display:flex;flex-wrap:wrap;gap:8px}
.calendar-switch{display:flex;align-items:center;justify-content:space-between;gap:10px;flex:1 1 100px;min-width:0;max-width:100%;min-height:46px;padding:9px 12px;border:1px solid #494136;border-radius:12px;background:#211e1a;color:#aaa195;text-align:left}
.calendar-switch-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:650}
.calendar-switch-track{position:relative;flex:0 0 34px;height:20px;border-radius:10px;background:#51493f}
.calendar-switch-thumb{position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:#b9b0a3;transition:transform .12s ease}
.calendar-switch[aria-checked=true]{border-color:var(--switch-color);color:var(--switch-color)}
.calendar-switch[aria-checked=true] .calendar-switch-track{background:var(--switch-color)}
.calendar-switch[aria-checked=true] .calendar-switch-thumb{background:#211e1a;transform:translateX(14px)}
.clock-block .calendar-switch{min-height:44px;padding:7px 9px;gap:7px;flex-basis:95px}
.clock-block .calendar-switch-name{font-size:13px}
.portrait-support .clock-block .calendar-switch{flex-basis:70px;padding:6px 7px;gap:4px;border-radius:9px}
.portrait-support .clock-block .calendar-switch-name{font-size:11px}
.wall-mode .portrait-support .forecast-day>.fine{display:block}
.portrait-support .calendar-switch-track{flex-basis:28px;height:18px}
.portrait-support .calendar-switch-thumb{width:12px;height:12px}
.portrait-support .calendar-switch[aria-checked=true] .calendar-switch-thumb{transform:translateX(10px)}
@media(prefers-reduced-motion:reduce){.calendar-switch-thumb{transition:none}}

/* The day agenda is shared across tablet orientations. */
.portrait-day-button{position:relative}
.day-note-dot{position:absolute;top:7px;right:7px;width:7px;height:7px;border-radius:50%;background:var(--mint)}
.portrait-day-button.is-selected .day-note-dot{background:#326a60}
@media(orientation:landscape){
 .wall-mode .wall{padding:18px 24px;gap:12px}
 .wall-mode .portrait-support{flex:0 0 auto;min-height:196px;gap:20px}
 .wall-mode .portrait-support .clock-block{flex-basis:25%;padding-top:4px}
 .wall-mode .portrait-support .metrics{gap:14px}
 .wall-mode .portrait-support .metric-card{padding:12px 16px}
 .wall-mode .portrait-support .clock{font-size:52px}
 .wall-mode .portrait-support .long-date{font-size:14px}
 .wall-mode .portrait-support .metric-value{font-size:34px}
 .wall-mode .portrait-support .price-chart{height:55px}
 .wall-mode .portrait-support .wall-tools{flex:0 0 64px;flex-direction:column;gap:10px;align-self:flex-start}
 .wall-mode .portrait-top-row{min-height:62px}
 .wall-mode .portrait-day-button{min-height:62px;gap:1px;padding:5px}
 .wall-mode .portrait-day-name{font-size:17px}
 .wall-mode .wall-body{flex-direction:row;gap:18px}
 .wall-mode .wall .week-grid.portrait-agenda{flex:1;min-width:0}
 .wall-mode .wall .shopping-panel{flex:0 0 32%;width:auto;padding:16px;display:flex;flex-direction:column;gap:8px}
 .wall-mode .wall .shopping-panel>.section-heading{width:100%;min-height:44px;margin:0}
 .wall-mode .wall .shopping-panel>.inline-form{position:static;width:100%;max-width:none;margin:0;display:grid;grid-template-columns:minmax(0,1fr) 48px;gap:8px}
 .wall-mode .wall .shopping-panel>.inline-form input{width:100%;min-width:0}
 .wall-mode .wall .shopping-items{display:block;flex:1;min-height:0}
 .wall-mode .wall .shopping-text{font-size:18px}
 .wall-mode .wall .shopping-row{padding:7px 0}
 .wall-mode .agenda-heading{padding:13px 20px}
 .wall-mode .agenda-date{font-size:25px}
 .wall-mode .wall .portrait-agenda .event,.wall-mode .wall .portrait-agenda .event.note,.wall-mode .wall .portrait-agenda .event.note:not(.note-timed){padding:16px 18px;min-height:94px;grid-template-columns:80px minmax(0,1fr);gap:8px 14px;margin-bottom:14px}
 .wall-mode .wall .portrait-agenda .event .event-title{font-size:24px}
 .wall-mode .wall .portrait-agenda .event>.recurrence-badge{margin-left:94px}
}
.shopping-expand{display:inline-flex;align-items:center;gap:10px;min-height:44px;max-width:100%;padding:0;border:0;background:transparent;color:inherit;font:inherit;text-align:left}
.event.note .event-title,.note-list-item strong{font-family:"Shadows Into Light",cursive;font-weight:400;font-synthesis:none;font-size:24px;line-height:1.4;letter-spacing:.2px}
.wall-mode .wall .portrait-agenda .event.note .event-title{font-family:"Shadows Into Light",cursive;font-weight:400;font-size:32px;line-height:1.35}
@media(orientation:portrait) and (min-height:1600px){.wall-mode .wall .portrait-agenda .event.note .event-title{font-size:40px}}
.shopping-expand-icon{color:#b4aa9c;font-size:24px;font-weight:400}
.shopping-modal{width:min(900px,96vw);max-width:900px;height:calc(var(--viewport-height,100vh) - 40px);max-height:calc(var(--viewport-height,100vh) - 40px);display:flex;flex-direction:column;overflow:hidden}
.shopping-modal>.modal-heading{flex:0 0 auto;margin-bottom:12px}
.shopping-expanded{display:flex;flex-direction:column;gap:12px;flex:1;min-height:0;min-width:0}
.shopping-expanded>.section-heading{flex:0 0 auto;margin:0}
.shopping-expanded>.section-heading h2{font-size:16px;color:#b4aa9c}
.shopping-expanded>.inline-form{flex:0 0 auto;display:grid;grid-template-columns:minmax(0,1fr) 56px;gap:10px;margin:0}
.shopping-expanded input{min-width:0;width:100%;font-size:20px;min-height:56px}
.shopping-expanded .shopping-items{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-color:#716454 #242019}
.shopping-expanded .shopping-row{padding:8px 0}
.shopping-expanded .shopping-text{font-size:24px;line-height:1.35}
.shopping-expanded .shopping-check{min-height:48px;padding:4px 0;gap:16px}
.shopping-expanded .checkbox{width:32px;height:32px;flex:0 0 32px}
.shopping-expanded .remove{flex:0 0 48px;min-height:48px}
.wall-mode{--remove-size:56px}
.wall-mode .ui-icon{width:36px;height:36px}
.wall-mode .remove,
.wall-mode .wall .shopping-panel .remove,
.wall-mode .shopping-expanded .remove,
.wall-mode .member-form .remove,
.wall-mode .modal-heading .remove{width:56px;min-width:56px;height:56px;min-height:56px;flex:0 0 56px;border-radius:12px;color:#c9c1b6}
.wall-mode .modal-heading{gap:16px}
.wall-mode .modal-heading>h2{min-width:0}
.wall-mode .shopping-expand{min-height:56px;gap:12px}
.wall-mode .metric-card[role="button"]>.eyebrow{padding-right:44px}
.wall-mode .metric-expand-icon{right:8px;top:7px}
.wall-mode .wall .shopping-panel.shopping-summary{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:16px;flex:0 0 76px;width:100%;min-height:76px;padding:16px 20px;border:1px solid var(--border);border-radius:18px;background:var(--panel);color:var(--text);text-align:left}
.shopping-summary-title{font-size:22px;font-weight:700;min-width:0}
.shopping-summary:focus-visible{outline:2px solid var(--mint);outline-offset:4px}
@media(orientation:landscape){
 .wall-mode .wall .shopping-panel.shopping-summary{position:relative;flex:0 0 72px;width:72px;align-self:stretch;min-height:0;flex-direction:column;justify-content:center;gap:24px;padding:20px 8px}
 .shopping-summary-title{font-size:20px;writing-mode:vertical-rl;text-orientation:mixed;white-space:nowrap}
 .shopping-summary .shopping-expand-icon{position:absolute;top:16px;left:50%;transform:translateX(-50%)}
}
@media(min-width:600px){
 body{--remove-size:56px}
 .ui-icon{width:36px;height:36px}
 .mobile .remove,.member-form .remove,.modal-heading .remove{width:56px;min-width:56px;height:56px;min-height:56px;flex:0 0 56px}
}
.shopping-panel .shopping-row>.remove,
.wall-mode .shopping-panel .shopping-row>.remove{width:48px;min-width:48px;height:48px;min-height:48px;flex:0 0 48px;color:#aaa195}
.shopping-panel .shopping-row>.remove>.ui-icon,
.wall-mode .shopping-panel .shopping-row>.remove>.ui-icon{width:20px;height:20px}
@media(max-width:500px){
 .shopping-modal{width:100%;height:calc(var(--viewport-height,100vh) - 24px);max-height:calc(var(--viewport-height,100vh) - 24px)}
 .shopping-expanded .shopping-text{font-size:20px}
}