*, *::before, *::after { box-sizing: border-box; }

:root {
  color-scheme: dark;
  --bg: #191919;
  --surface: #202020;
  --raised: #252525;
  --hover: #2c2c2c;
  --line: #2f2f2f;
  --line-strong: #3a3a3a;
  --text: #e3e2df;
  --muted: #9b9a97;
  --faint: #6f6e6b;
  --accent: #529cca;
  --accent-text: #6cb0de;
  --green: #4dab9a;
  --clay: #d9925b;
  --danger: #e06c66;
  --serif: "Lyon-Text", Georgia, "Iowan Old Style", "Palatino Linotype", serif;
  --sans: ui-sans-serif, -apple-system, "Segoe UI", Helvetica, "Apple Color Emoji", Arial, sans-serif;
  --r: 6px;
  /* Notion-style tag colours: background / text */
  --gray-bg: #373737; --gray: #d4d4d4;
  --brown-bg: #4a3a2f; --brown: #d7b8a1;
  --orange-bg: #5c3b23; --orange: #f0b37a;
  --yellow-bg: #564328; --yellow: #f3d27a;
  --green-bg: #243d30; --green-t: #7fd3a8;
  --blue-bg: #1f3448; --blue: #8cc4f0;
  --purple-bg: #3c2d49; --purple: #c9a8ef;
  --pink-bg: #4e2c3c; --pink: #f0a8cb;
  --red-bg: #522e2a; --red: #f4a29a;
  font: 14px/1.5 var(--sans);
  background: var(--bg);
  color: var(--text);
}

@media (prefers-color-scheme: light) {
  :root {
    color-scheme: light;
    --bg: #ffffff; --surface: #ffffff; --raised: #f7f6f3; --hover: #efefed;
    --line: #e9e9e7; --line-strong: #dcdbd8; --text: #37352f; --muted: #787774; --faint: #a5a49f;
    --accent: #2383e2; --accent-text: #1f6fbf; --green: #448361; --clay: #c56b2c; --danger: #d44c47;
    --gray-bg: #e3e2e0; --gray: #32302c; --brown-bg: #eee0da; --brown: #442a1e;
    --orange-bg: #fadec9; --orange: #49290e; --yellow-bg: #fdecc8; --yellow: #402c1b;
    --green-bg: #dbeddb; --green-t: #1c3829; --blue-bg: #d3e5ef; --blue: #183347;
    --purple-bg: #e8deee; --purple: #412454; --pink-bg: #f5e0e9; --pink: #4c2337;
    --red-bg: #ffe2dd; --red: #5d1715;
  }
}

body { margin: 0; background: var(--bg); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
p { margin: 0; }
h1, h2, h3 { margin: 0; font-weight: 600; letter-spacing: -0.01em; }
small { color: var(--muted); font-weight: 400; }
.i { width: 14px; height: 14px; flex: none; vertical-align: -2px; }
.emoji { margin-right: 6px; }
.num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.late { color: var(--clay); }
.in { color: var(--green); }
.muted { opacity: .55; }
.hint, .empty { color: var(--muted); font-size: 12.5px; }
.empty { padding: 4px 0; }

/* ---- top bar ---- */
.top {
  position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 18px;
  height: 44px; padding: 0 16px; background: color-mix(in srgb, var(--bg) 92%, transparent);
  backdrop-filter: blur(8px); border-bottom: 1px solid var(--line);
}
.brand { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 15px; }
.brand img { border-radius: 6px; display: block; }
.tabs { display: flex; gap: 2px; flex: 1; overflow-x: auto; scrollbar-width: none; }
.tabs::-webkit-scrollbar { display: none; }
.tabs a { color: var(--muted); padding: 4px 10px; border-radius: var(--r); white-space: nowrap; }
.tabs a:hover { background: var(--hover); color: var(--text); }
.tabs a[aria-current] { background: var(--hover); color: var(--text); font-weight: 500; }
.aside { display: flex; gap: 12px; align-items: center; color: var(--muted); font-size: 12.5px; white-space: nowrap; }
@media (max-width: 760px) {
  .top { height: auto; flex-wrap: wrap; padding: 8px 12px; gap: 6px 12px; }
  .tabs { order: 3; flex-basis: 100%; }
  .today { display: none; }
  .aside { margin-left: auto; }
}

/* ---- page ---- */
main.page { max-width: 1320px; margin: 0 auto; padding: 18px 24px 48px; }
main.wide { padding: 10px 16px 16px; }
@media (max-width: 760px) { main.page { padding: 12px 12px 40px; } main.wide { padding: 8px; } }
.page-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; margin: 6px 0 12px; }
.page-head h1 { font-family: var(--serif); font-size: 30px; line-height: 1.15; }
.page-head .sub { color: var(--muted); margin-top: 2px; }
.head-tools, .tools { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.section-title { font-size: 15px; margin: 22px 0 6px; display: flex; gap: 6px; align-items: baseline; }

/* view switcher (like Notion database tabs) */
.toolbar { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap;
  border-bottom: 1px solid var(--line); margin-bottom: 12px; padding-bottom: 6px; }
.toolbar.sub { border: 0; margin-bottom: 8px; padding: 0; }
.views { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; }
.views a { padding: 4px 9px; border-radius: var(--r); color: var(--muted); white-space: nowrap; }
.views a:hover { background: var(--hover); color: var(--text); }
.views a[aria-current] { color: var(--text); background: var(--hover); font-weight: 500; }
.views small { margin-left: 3px; }
.views.seg { background: var(--raised); border-radius: 7px; padding: 2px; }
.stepper { display: flex; align-items: center; gap: 4px; }
.stepper span { min-width: 120px; text-align: center; font-weight: 500; }

/* ---- grid & cards ---- */
.grid.g12 { display: grid; grid-auto-flow: row dense; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 10px; align-items: start; }
.s3 { grid-column: span 3; } .s4 { grid-column: span 4; } .s5 { grid-column: span 5; } .s6 { grid-column: span 6; }
.s7 { grid-column: span 7; } .s8 { grid-column: span 8; } .s12 { grid-column: span 12; }
@media (max-width: 1100px) { .s3, .s4, .s5 { grid-column: span 6; } .s7, .s8 { grid-column: span 12; } }
@media (max-width: 700px) { .grid.g12 > * { grid-column: span 12; } }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; min-width: 0; }
.card + .card:not(.grid .card):not(.dash .card) { margin-top: 10px; }
.card-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 6px; }
.card-head h2 { font-size: 13px; font-weight: 600; color: var(--muted); text-transform: none; }
.card-tools { display: flex; gap: 4px; align-items: center; }
.more { color: var(--faint); font-size: 12px; }
.more:hover { color: var(--text); }
.figure { font-size: 24px; font-weight: 600; line-height: 1.2; font-variant-numeric: tabular-nums; }
.figure small { font-size: 13px; }

/* dashboard edit mode */
.card.editing { outline: 1px dashed var(--line-strong); cursor: grab; }
.card.dragging { opacity: .4; }
.grip { color: var(--faint); cursor: grab; display: inline-flex; }
.size { font-size: 11px; color: var(--muted); min-width: 30px; text-align: center; }
.card-picker { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.pick { background: var(--raised); border: 1px solid var(--line); color: var(--text); border-radius: var(--r); padding: 5px 10px; cursor: pointer; }
.pick:hover { background: var(--hover); }

/* compact lists */
.clist { list-style: none; margin: 0; padding: 0; }
.clist li { display: flex; align-items: center; gap: 8px; padding: 4px 0; border-top: 1px solid var(--line); min-height: 30px; flex-wrap: wrap; }
.clist li:first-child { border-top: 0; }
.clist .title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.clist a.title:hover { text-decoration: underline; text-decoration-color: var(--faint); }
.clist .meta { color: var(--muted); font-size: 12px; display: flex; gap: 6px; align-items: center; }
.clist .done .title { color: var(--faint); text-decoration: line-through; }
.clist.progress meter { flex-basis: 100%; height: 4px; }
.clist .slot { min-width: 58px; }
h3.mini { font-size: 12px; color: var(--muted); font-weight: 600; margin: 8px 0 2px; }
h3.mini:first-child { margin-top: 0; }
.bullet { width: 8px; height: 8px; border-radius: 2px; flex: none; background: var(--accent); }
.bullet.local { background: var(--purple); } .bullet.task { background: var(--clay); } .bullet.meal { background: var(--green); }

/* ---- pills ---- */
.pill { display: inline-flex; align-items: center; gap: 5px; border-radius: 4px; padding: 0 6px; font-size: 12px;
  line-height: 20px; white-space: nowrap; background: var(--gray-bg); color: var(--gray); }
.pill.gray { background: var(--gray-bg); color: var(--gray); }
.pill.blue { background: var(--blue-bg); color: var(--blue); }
.pill.green { background: var(--green-bg); color: var(--green-t); }
.pill.purple { background: var(--purple-bg); color: var(--purple); }
.pill.orange { background: var(--orange-bg); color: var(--orange); }
.pill.status { border-radius: 10px; }
.led { width: 7px; height: 7px; border-radius: 50%; background: currentColor; opacity: .8; display: inline-block; }
.stars { letter-spacing: 1px; color: #f5c451; }
.chip { display: inline-flex; gap: 4px; align-items: center; padding: 0 6px; border-radius: 4px; line-height: 20px;
  white-space: nowrap; max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
.chip:hover { background: var(--hover); }

/* ---- database table ---- */
.table-wrap { overflow-x: auto; }
table.db { width: 100%; border-collapse: collapse; font-size: 13.5px; }
table.db th { text-align: left; font-weight: 400; color: var(--muted); font-size: 12.5px; padding: 6px 8px;
  border-bottom: 1px solid var(--line); white-space: nowrap; }
table.db td { padding: 3px 8px; border-bottom: 1px solid var(--line); height: 34px; vertical-align: middle; }
table.db th + th, table.db td + td { border-left: 1px solid var(--line); }
table.db tbody tr:hover { background: var(--raised); }
table.db tr[data-href] { cursor: pointer; }
table.db .c-check { width: 34px; padding-right: 0; }
table.db .c-title { min-width: 220px; font-weight: 500; }
table.db .c-title a:hover { text-decoration: underline; text-decoration-color: var(--faint); }
table.db .c-prio { width: 92px; } table.db .c-status { width: 132px; }
table.db .c-date { width: 130px; white-space: nowrap; } table.db .c-parent { width: 190px; }
table.db .c-progress { width: 150px; } table.db .c-progress meter { display: inline-block; vertical-align: middle; width: 90px; height: 5px; margin-right: 6px; }
table.db .c-act { width: 34px; }
table.db td.num { text-align: right; } table.db th.num { text-align: right; }
table.db td.out { color: var(--text); }
table.db tr.done .c-title { color: var(--faint); text-decoration: line-through; }
.has-note { color: var(--faint); margin-left: 6px; font-size: 12px; }
.empty-row td { color: var(--muted); }

.cell-select { appearance: none; -webkit-appearance: none; border: 0; border-radius: 10px; padding: 0 8px; line-height: 20px;
  font: inherit; font-size: 12px; cursor: pointer; background: var(--gray-bg); color: var(--gray); max-width: 100%; }
.status-select[data-v="doing"] { background: var(--blue-bg); color: var(--blue); }
.status-select[data-v="done"] { background: var(--green-bg); color: var(--green-t); }
.prio-select { border-radius: 4px; color: #f5c451; letter-spacing: 1px; }
.prio-select[data-v="0"] { background: transparent; color: var(--faint); }
.prio-select[data-v="2"] { background: var(--blue-bg); } .prio-select[data-v="3"] { background: var(--purple-bg); }
.prio-select[data-v="4"] { background: var(--orange-bg); }
.cell-select option { background: var(--surface); color: var(--text); }

.check { width: 18px; height: 18px; padding: 0; border: 1.5px solid var(--faint); border-radius: 4px; background: transparent;
  color: transparent; cursor: pointer; display: inline-grid; place-items: center; flex: none; }
.check .i { width: 12px; height: 12px; }
.check:hover { border-color: var(--accent); }
.done .check, tr.done .check { background: var(--accent); border-color: var(--accent); color: #fff; }

.quick-add { display: flex; align-items: center; gap: 6px; padding: 4px 8px; color: var(--muted); border-bottom: 1px solid transparent; }
.quick-add:focus-within { border-bottom-color: var(--line); }
.quick-add input { border: 0; background: transparent; padding: 4px 0; color: var(--text); flex: 1; min-width: 0; }
.quick-add input[type=date] { flex: none; width: auto; color: var(--muted); }
.quick-add input:focus { outline: none; }

/* ---- forms ---- */
form { margin: 0; }
form.inline { display: inline-flex; align-items: center; gap: 2px; }
input, select, textarea { font: inherit; color: var(--text); background: var(--raised); border: 1px solid var(--line);
  border-radius: var(--r); padding: 5px 8px; width: 100%; min-width: 0; }
input:focus, select:focus, textarea:focus { outline: 2px solid color-mix(in srgb, var(--accent) 45%, transparent); outline-offset: -1px; }
textarea { resize: vertical; line-height: 1.5; }
input[type=color] { padding: 0; width: 28px; height: 28px; border: 0; background: none; cursor: pointer; }
input[type=checkbox] { width: auto; accent-color: var(--accent); }
button { font: inherit; cursor: pointer; }
.fields { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; margin: 6px 0; }
.fields > label { flex: 0 1 150px; }
.fields .grow { flex: 1 1 200px; } .fields .full { flex-basis: 100%; }
.stack { display: grid; gap: 10px; }
label { display: grid; gap: 3px; }
label > span { font-size: 12px; color: var(--muted); }
label.tick { display: inline-flex; gap: 5px; align-items: center; font-size: 12.5px; color: var(--muted); white-space: nowrap; }
.btn, .primary { display: inline-flex; align-items: center; gap: 6px; border-radius: var(--r); padding: 4px 10px; font-size: 13.5px;
  border: 1px solid var(--line-strong); background: var(--raised); color: var(--text); white-space: nowrap; line-height: 20px; }
.btn:hover { background: var(--hover); }
.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.primary:hover { filter: brightness(1.08); }
.link { background: none; border: 0; padding: 0; color: var(--muted); font-size: 12.5px; }
.link:hover { color: var(--text); text-decoration: underline; }
.link.danger:hover, .icon-btn.danger:hover { color: var(--danger); }
.icon-btn { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: var(--r); border: 0;
  background: transparent; color: var(--muted); font-size: 15px; }
.icon-btn:hover { background: var(--hover); color: var(--text); }
.icon-btn.tiny { width: 20px; height: 20px; opacity: 0; }
li:hover > form > .icon-btn.tiny, .icon-btn.tiny:focus { opacity: 1; }
@media (hover: none) { .icon-btn.tiny { opacity: .6; } }
.filter { width: auto; padding: 3px 8px; font-size: 13px; }
.row-actions { display: flex; gap: 8px; align-items: center; margin-top: 4px; }
.two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 760px) { .two { grid-template-columns: 1fr; } }

details > summary { cursor: pointer; list-style: none; }
details > summary::-webkit-details-marker { display: none; }
.fold { margin-top: 10px; }
.fold > summary { color: var(--muted); font-size: 13px; display: inline-flex; gap: 6px; align-items: center; padding: 3px 6px; border-radius: var(--r); }
.fold > summary:hover { background: var(--hover); color: var(--text); }
.fold[open] > summary { margin-bottom: 6px; }

/* ---- peek panel (task detail) ---- */
.peek { position: fixed; inset: 0; z-index: 40; display: flex; justify-content: flex-end; }
.peek-backdrop { position: absolute; inset: 0; background: rgba(0, 0, 0, .35); }
.peek-body { position: relative; width: min(560px, 100%); height: 100%; overflow-y: auto; background: var(--surface);
  border-left: 1px solid var(--line); padding: 14px 24px 30px; box-shadow: -8px 0 30px rgba(0,0,0,.3); }
.peek-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.peek-form { display: grid; gap: 10px; }
.title-input { font-size: 24px; font-weight: 600; border: 0; background: transparent; padding: 4px 0; font-family: var(--serif); }
.title-input:focus { outline: none; }
.props { display: grid; grid-template-columns: 110px 1fr; gap: 4px 10px; margin: 0; align-items: center; }
.props dt { color: var(--muted); font-size: 13px; }
.props dd { margin: 0; }
.props input, .props select { background: transparent; border-color: transparent; }
.props input:hover, .props select:hover { background: var(--hover); }

/* ---- doc pages (project / area / recipe) ---- */
.crumbs { color: var(--muted); font-size: 13px; margin-bottom: 6px; }
.crumbs a:hover { color: var(--text); }
.doc { max-width: 900px; margin: 0 auto; }
.doc.narrow { max-width: 620px; }
.page-form { display: grid; gap: 8px; }
.title-line { display: flex; align-items: center; gap: 8px; }
.emoji-input { width: 56px; font-size: 30px; text-align: center; border: 0; background: transparent; padding: 0; }
.emoji-input:hover { background: var(--hover); }
.title-line .title-input { font-size: 34px; }
.doc-title { font-family: var(--serif); font-size: 34px; }
.notes { line-height: 1.65; }
.notes h2 { font-size: 20px; margin: 18px 0 4px; } .notes h3 { font-size: 16px; margin: 14px 0 4px; }
.notes ul { margin: 4px 0; padding-left: 22px; } .notes p { margin: 4px 0; }
.notes a { color: var(--accent-text); text-decoration: underline; text-underline-offset: 2px; }
.doc-foot { margin-top: 30px; padding-top: 10px; border-top: 1px solid var(--line); }

/* ---- gallery ---- */
.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.gallery.mini { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.gcard { display: flex; flex-direction: column; gap: 2px; background: var(--surface); border: 1px solid var(--line);
  border-radius: 8px; padding: 12px; min-height: 92px; transition: background .12s; }
.gcard:hover { background: var(--raised); }
.gicon { font-size: 26px; line-height: 1; margin-bottom: 6px; }
.gtitle { font-weight: 600; }
.gmeta { color: var(--muted); font-size: 12px; }
.gnew { justify-content: center; align-items: center; color: var(--muted); border-style: dashed; flex-direction: row; gap: 6px; }
.gnew input { background: transparent; border: 0; text-align: center; }
.gallery.mini .gcard { min-height: 0; padding: 8px 10px; }
.gallery.mini .gicon { font-size: 18px; margin: 0; }
.tags { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 4px; }
.tags i { font-style: normal; font-size: 11.5px; background: var(--gray-bg); color: var(--gray); padding: 0 6px; border-radius: 4px; }

/* ---- kanban ---- */
.kanban { display: grid; grid-template-columns: repeat(3, minmax(220px, 1fr)); gap: 10px; align-items: start; overflow-x: auto; }
.kanban.four { grid-template-columns: repeat(4, minmax(210px, 1fr)); }
.kcol { background: var(--raised); border-radius: 8px; padding: 8px; min-height: 120px; }
.kcol.over { outline: 2px solid var(--accent); }
.kcol h3 { font-size: 13px; font-weight: 500; margin-bottom: 8px; display: flex; gap: 6px; align-items: center; }
.kcard { background: var(--surface); border: 1px solid var(--line); border-radius: 6px; padding: 7px 9px; margin-bottom: 6px;
  cursor: grab; box-shadow: 0 1px 2px rgba(0,0,0,.2); }
.kcard:hover { background: var(--hover); }
.kcard a { font-weight: 500; }
.kmeta { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; font-size: 12px; color: var(--muted); align-items: center; }

/* ---- finance ---- */
.balance { display: flex; flex-wrap: wrap; gap: 6px 28px; align-items: flex-end; }
.stat { display: flex; flex-direction: column; }
.stat .label { font-size: 12px; color: var(--muted); }
.stat strong { font-size: 17px; font-weight: 600; font-variant-numeric: tabular-nums; }
.stat.big strong { font-size: 28px; }
.acc-list { list-style: none; padding: 0; margin: 10px 0 0; columns: 2 220px; column-gap: 24px; }
.acc-list li { display: flex; justify-content: space-between; gap: 8px; padding: 3px 0; border-bottom: 1px solid var(--line); break-inside: avoid; }
.pie { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.donut { flex: none; }
.ring-empty { stroke: var(--line); }
.donut-value { fill: var(--text); font-size: 17px; font-weight: 600; }
.donut-label { fill: var(--muted); font-size: 11px; }
.legend { list-style: none; padding: 0; margin: 0; flex: 1; min-width: 200px; }
.legend li { display: grid; grid-template-columns: 1fr auto 42px; gap: 8px; align-items: center; padding: 2px 0; }
.legend li a { display: flex; align-items: center; gap: 6px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.legend li a:hover { text-decoration: underline; }
.legend small { text-align: right; }
.dot { width: 9px; height: 9px; flex: none; margin-right: 4px; vertical-align: 0; }
.bars { width: 100%; height: 140px; margin-top: 10px; }
.bar-in { fill: var(--green); } .bar-out { fill: var(--clay); }
.axis { fill: var(--muted); font-size: 10px; }
meter.bar { display: block; width: 100%; height: 6px; border: 0; border-radius: 4px; background: var(--line); }
meter.bar::-webkit-meter-bar { background: var(--line); border: 0; border-radius: 4px; height: 6px; }
meter.bar::-webkit-meter-optimum-value { background: var(--green); border-radius: 4px; }
meter.bar::-webkit-meter-suboptimum-value { background: #d9b45b; border-radius: 4px; }
meter.bar::-webkit-meter-even-less-good-value { background: var(--clay); border-radius: 4px; }
meter.bar::-moz-meter-bar { background: var(--green); border-radius: 4px; }
meter.bar.goal::-webkit-meter-optimum-value, meter.bar.goal::-webkit-meter-suboptimum-value,
meter.bar.goal::-webkit-meter-even-less-good-value { background: var(--accent); }
.budgets { list-style: none; padding: 0; margin: 6px 0 0; display: grid; gap: 8px; }
.line { display: flex; align-items: center; gap: 6px; margin-bottom: 3px; }
.line > span:first-of-type { flex: 1; }
.line.strong { font-weight: 600; }
.budgets .hint { display: block; margin-top: 2px; }
.cat-list { list-style: none; padding: 0; margin: 0 0 10px; }
.cat-list li { display: flex; gap: 10px; align-items: center; justify-content: space-between; padding: 5px 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.cat-form { display: flex; gap: 6px; align-items: center; flex: 1 1 520px; flex-wrap: wrap; }
.cat-form .grow-input { flex: 1 1 160px; width: auto; }
.cat-form select { width: auto; }
.money-input { width: 120px; text-align: right; }
.cat-usage { display: flex; gap: 8px; align-items: center; min-width: 200px; justify-content: flex-end; }
.cat-usage meter { width: 90px; }
.inline-fields { display: flex; gap: 6px; margin-top: 8px; }

/* ---- calendar ---- */
.cal-bar { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; flex-wrap: wrap; }
.cal-title { font-size: 20px; font-weight: 600; margin: 0 10px; flex: 1; font-family: var(--serif); }
.pop { position: relative; }
.pop > summary { list-style: none; }
.pop-body { position: absolute; right: 0; top: 34px; z-index: 30; width: min(440px, 92vw); background: var(--raised);
  border: 1px solid var(--line-strong); border-radius: 8px; padding: 12px; box-shadow: 0 10px 30px rgba(0,0,0,.4); }
.pop-body .title-input { font-size: 18px; }
.month-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.mh { padding: 4px 8px; font-size: 12px; color: var(--muted); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); text-align: right; }
.mc { min-height: calc((100vh - 150px) / 6); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line);
  padding: 3px 4px; display: flex; flex-direction: column; gap: 2px; min-width: 0; cursor: cell; }
.mc.weekend { background: color-mix(in srgb, var(--raised) 55%, transparent); }
.mc.out { color: var(--faint); }
.mc.out .ev { opacity: .55; }
.dn { align-self: flex-end; font-size: 12px; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; }
.dn:hover { background: var(--hover); }
.mc.today .dn { background: var(--danger); color: #fff; font-weight: 600; }
.ev { display: flex; gap: 5px; align-items: center; font-size: 12px; line-height: 18px; padding: 0 5px; border-radius: 4px;
  overflow: hidden; white-space: nowrap; min-width: 0; cursor: pointer; }
.ev .n { overflow: hidden; text-overflow: ellipsis; }
.ev .t { color: var(--muted); flex: none; }
.ev.google { background: var(--blue-bg); color: var(--blue); }
.ev.local { background: var(--purple-bg); color: var(--purple); }
.ev.task { background: var(--orange-bg); color: var(--orange); }
.ev.meal { background: var(--green-bg); color: var(--green-t); }
.ev:hover { filter: brightness(1.15); }
.more-ev { font-size: 11.5px; color: var(--muted); padding-left: 5px; }
.cal-legend { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 8px; font-size: 12px; }
.ev-key { padding: 0 6px; border-radius: 4px; }
.ev-key.google { background: var(--blue-bg); color: var(--blue); } .ev-key.local { background: var(--purple-bg); color: var(--purple); }
.ev-key.task { background: var(--orange-bg); color: var(--orange); } .ev-key.meal { background: var(--green-bg); color: var(--green-t); }
.cal-legend .sync { margin: 0 0 0 auto; border: 0; padding: 0; }

.tg { border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.tg-top, .tg-body { display: grid; }
.tg.cols7 .tg-top, .tg.cols7 .tg-body { grid-template-columns: 52px repeat(7, minmax(0, 1fr)); }
.tg.cols1 .tg-top, .tg.cols1 .tg-body { grid-template-columns: 52px minmax(0, 1fr); }
.tg-top { border-bottom: 1px solid var(--line); background: var(--surface); }
.tg-head { display: flex; gap: 6px; align-items: baseline; justify-content: center; padding: 6px; border-left: 1px solid var(--line); }
.tg-head span { color: var(--muted); font-size: 12px; text-transform: uppercase; }
.tg-head strong { font-size: 20px; font-weight: 500; }
.tg-head.today strong { color: #fff; background: var(--danger); border-radius: 50%; width: 32px; height: 32px; display: grid; place-items: center; font-size: 16px; }
.tg-label { font-size: 10.5px; color: var(--muted); padding: 4px; text-align: right; }
.tg-allday { border-left: 1px solid var(--line); padding: 2px; display: flex; flex-direction: column; gap: 2px; min-height: 24px; min-width: 0; }
.tg-scroll { height: calc(100vh - 190px); overflow-y: auto; }
.tg-hours, .tg-col { display: grid; grid-template-rows: repeat(96, 11px); position: relative; }
.tg-hour { grid-column: 1; font-size: 10.5px; color: var(--muted); text-align: right; padding-right: 6px; transform: translateY(-7px); }
.tg-col { border-left: 1px solid var(--line); }
.tg-col.today { background: color-mix(in srgb, var(--accent) 4%, transparent); }
.slot { grid-column: 1; border-top: 1px solid var(--line); }
.tev { grid-column: 1; position: relative; justify-self: start; z-index: 2; margin: 1px 2px; padding: 2px 5px; border-radius: 4px;
  font-size: 11.5px; line-height: 1.3; overflow: hidden; display: flex; flex-direction: column; border-left: 3px solid currentColor; }
.tev span { opacity: .8; }
.tev.google { background: var(--blue-bg); color: var(--blue); } .tev.local { background: var(--purple-bg); color: var(--purple); }
.tev.task { background: var(--orange-bg); color: var(--orange); } .tev.meal { background: var(--green-bg); color: var(--green-t); }
.now { grid-column: 1; height: 2px; background: var(--danger); z-index: 3; align-self: start; position: relative; }

/* ---- food ---- */
.mealplan { display: grid; grid-template-columns: 80px repeat(7, minmax(110px, 1fr)); border-top: 1px solid var(--line);
  border-left: 1px solid var(--line); overflow-x: auto; margin-top: 10px; }
.mp-corner, .mp-day, .mp-slot, .mp-cell { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.mp-day { padding: 5px 8px; display: flex; gap: 6px; align-items: baseline; }
.mp-day span { color: var(--muted); font-size: 12px; text-transform: uppercase; }
.mp-day.today strong { color: var(--danger); }
.mp-slot { padding: 6px 8px; color: var(--muted); font-size: 12.5px; }
.mp-cell { list-style: none; margin: 0; padding: 4px; min-height: 52px; display: flex; flex-direction: column; gap: 3px; }
.mp-cell.today { background: color-mix(in srgb, var(--accent) 5%, transparent); }
.meal { display: flex; align-items: center; justify-content: space-between; gap: 4px; background: var(--raised);
  border: 1px solid var(--line); border-radius: 5px; padding: 2px 4px 2px 7px; font-size: 12.5px; }
.meal a:hover { text-decoration: underline; }
.search input { width: 300px; max-width: 100%; }
.ingredients { padding-left: 20px; margin: 4px 0 10px; line-height: 1.8; }
.shop-wrap { max-width: 640px; }
.shop-list { list-style: none; padding: 0; margin: 0; }
.shop { display: flex; align-items: center; gap: 10px; padding: 5px 4px; border-bottom: 1px solid var(--line); }
.shop .title { flex: 1; }
.shop.done .title { color: var(--faint); text-decoration: line-through; }

/* ---- footer / sync ---- */
.sync { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-top: 18px; padding-top: 8px;
  border-top: 1px solid var(--line); color: var(--faint); font-size: 12px; }

/* ---- login ---- */
body.login { min-height: 100vh; display: grid; place-items: center; padding: 20px; }
.login-box { width: min(360px, 100%); text-align: center; }
.login-box img { border-radius: 14px; }
.login-box h1 { font-family: var(--serif); font-size: 30px; margin-top: 12px; }
.login-box .sub { color: var(--muted); margin: 4px 0 22px; }
.login-box .stack { text-align: left; }
.login-box input { padding: 8px 10px; }
.login-box .primary { justify-content: center; padding: 8px; margin-top: 4px; }
.error { background: var(--red-bg); color: var(--red); border-radius: var(--r); padding: 7px 10px; margin-bottom: 12px; font-size: 13px; }

/* ---- settings ---- */
.settings { display: grid; gap: 10px; max-width: 860px; }
.settings-card .card-head h2 { font-size: 15px; color: var(--text); }
.set-form { display: grid; gap: 2px; margin-top: 8px; }
.set-row { display: grid; grid-template-columns: 190px 1fr; gap: 12px; align-items: start; padding: 6px 0; border-top: 1px solid var(--line); }
.set-row:first-of-type { border-top: 0; }
.set-label { display: flex; flex-direction: column; padding-top: 5px; }
.set-control { display: grid; gap: 4px; }
.set-control .tick { justify-self: start; }
.src { font-size: 11.5px; }
.src.db { color: var(--green); } .src.env { color: var(--accent-text); } .src.none { color: var(--faint); }
.set-help { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); display: grid; gap: 6px; justify-items: start; }
.set-help code { background: var(--raised); border: 1px solid var(--line); border-radius: 4px; padding: 3px 7px; font-size: 12.5px; user-select: all; }
.set-help a { color: var(--accent-text); text-decoration: underline; }
.flash { border-radius: var(--r); padding: 8px 12px; margin-bottom: 10px; max-width: 860px; }
.flash.ok { background: var(--green-bg); color: var(--green-t); }
.flash.error { background: var(--red-bg); color: var(--red); }
.link.on { color: var(--text); }
button[disabled] { opacity: .45; cursor: not-allowed; }
@media (max-width: 640px) { .set-row { grid-template-columns: 1fr; gap: 4px; } }

/* ---- per-calendar colours ---- */
:root { --teal-bg: #1f3d3d; --teal: #8fd6cf; }
@media (prefers-color-scheme: light) { :root { --teal-bg: #d6efec; --teal: #17403c; } }
.ev.google.c0, .tev.google.c0, .ev-key.google.c0 { background: var(--blue-bg); color: var(--blue); }
.bullet.google.c0 { background: var(--blue); }
.ev.google.c1, .tev.google.c1, .ev-key.google.c1 { background: var(--green-bg); color: var(--green-t); }
.bullet.google.c1 { background: var(--green-t); }
.ev.google.c2, .tev.google.c2, .ev-key.google.c2 { background: var(--orange-bg); color: var(--orange); }
.bullet.google.c2 { background: var(--orange); }
.ev.google.c3, .tev.google.c3, .ev-key.google.c3 { background: var(--purple-bg); color: var(--purple); }
.bullet.google.c3 { background: var(--purple); }
.ev.google.c4, .tev.google.c4, .ev-key.google.c4 { background: var(--pink-bg); color: var(--pink); }
.bullet.google.c4 { background: var(--pink); }
.ev.google.c5, .tev.google.c5, .ev-key.google.c5 { background: var(--yellow-bg); color: var(--yellow); }
.bullet.google.c5 { background: var(--yellow); }
.ev.google.c6, .tev.google.c6, .ev-key.google.c6 { background: var(--red-bg); color: var(--red); }
.bullet.google.c6 { background: var(--red); }
.ev.google.c7, .tev.google.c7, .ev-key.google.c7 { background: var(--brown-bg); color: var(--brown); }
.bullet.google.c7 { background: var(--brown); }
.ev.google.c8, .tev.google.c8, .ev-key.google.c8 { background: var(--gray-bg); color: var(--gray); }
.bullet.google.c8 { background: var(--gray); }
.ev.google.c9, .tev.google.c9, .ev-key.google.c9 { background: var(--teal-bg); color: var(--teal); }
.bullet.google.c9 { background: var(--teal); }

/* calendar page must never be wider than the window */
html, body { max-width: 100%; overflow-x: hidden; }
main.wide { min-width: 0; }
.month-grid, .tg { width: 100%; }
.cal-bar .pop-body { right: 0; max-width: calc(100vw - 24px); }
.cal-picks { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.cal-tick small { margin-left: 2px; }
.or { display: flex; align-items: center; gap: 10px; color: var(--faint); margin: 16px 0 10px; font-size: 12px; }
.or::before, .or::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.google-btn { width: 100%; justify-content: center; padding: 8px; }
.sub.small { font-size: 12px; margin-top: 14px; }
.sub.small a { color: var(--accent-text); }

.sec-list { list-style: none; padding: 0; margin: 4px 0 10px; display: grid; gap: 4px; }
.sec-list li::before { content: "● "; }
.sec-list li.ok::before { color: var(--green); }
.sec-list li.bad::before { color: var(--clay); }

/* ---- dashboard grid: 12 columns x 40px rows, cards span w/h ---- */
.dash { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: 40px;
  grid-auto-flow: row dense; gap: 10px; }
.dash > .card { grid-column: span 4; grid-row: span 6; }
.dash > .card { display: flex; flex-direction: column; min-height: 0; overflow: hidden; position: relative; margin: 0; }
.dash > .card .card-body { flex: 1; min-height: 0; overflow: auto; scrollbar-width: thin; }
.dash > .card .card-head { flex: none; }
.dash.editing > .card { outline: 1px dashed var(--line-strong); }
.dash.editing > .card .card-body { pointer-events: none; opacity: .85; }
.dash.editing > .card.note .card-body, .dash.editing > .card .card-body form { pointer-events: auto; }
.dash > .card.resizing { outline: 2px solid var(--accent); z-index: 5; box-shadow: 0 8px 30px rgba(0,0,0,.35); }
.resize { position: absolute; right: 2px; bottom: 2px; width: 18px; height: 18px; cursor: nwse-resize; z-index: 3;
  background: linear-gradient(135deg, transparent 50%, var(--faint) 50%, var(--faint) 60%, transparent 60%,
    transparent 70%, var(--faint) 70%, var(--faint) 80%, transparent 80%); border-radius: 0 0 6px 0; touch-action: none; }
.resize:hover { background-color: var(--hover); }
.dash .size { font-variant-numeric: tabular-nums; }
.dash-ghost { position: fixed; pointer-events: none; border: 2px dashed var(--accent); border-radius: 8px; z-index: 30;
  background: color-mix(in srgb, var(--accent) 8%, transparent); }
@media (max-width: 699.98px) {
  .dash { gap: 8px; grid-auto-rows: 36px; }
  .resize { width: 26px; height: 26px; }
  .dash > .card .card-tools .icon-btn { width: 30px; height: 30px; }
}

main.wide .page-head { padding: 0 2px; }

/* ---- tab icons: hidden on desktop, bottom app bar on phones ---- */
.tabs a .i { display: none; }
@media (max-width: 699.98px) {
  body { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }
  .top { position: sticky; backdrop-filter: none; background: var(--bg); }
  .tabs { position: fixed; left: 0; right: 0; bottom: 0; z-index: 35; order: 0; flex-basis: auto; margin: 0;
    display: grid; grid-template-columns: repeat(6, 1fr); gap: 0; padding: 4px 4px calc(4px + env(safe-area-inset-bottom));
    background: color-mix(in srgb, var(--surface) 94%, transparent); backdrop-filter: blur(10px);
    border-top: 1px solid var(--line); }
  .tabs a { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 0; font-size: 10.5px;
    border-radius: 8px; }
  .tabs a .i { display: block; width: 20px; height: 20px; }
  .tabs a[aria-current] { background: var(--hover); color: var(--text); }
  .peek-body { padding-bottom: 80px; }
}
.device-hint strong { color: var(--accent-text); }
.tg .r0{grid-row-start:1}.tg .r1{grid-row-start:2}.tg .r2{grid-row-start:3}.tg .r3{grid-row-start:4}.tg .r4{grid-row-start:5}.tg .r5{grid-row-start:6}.tg .r6{grid-row-start:7}.tg .r7{grid-row-start:8}.tg .r8{grid-row-start:9}.tg .r9{grid-row-start:10}.tg .r10{grid-row-start:11}.tg .r11{grid-row-start:12}.tg .r12{grid-row-start:13}.tg .r13{grid-row-start:14}.tg .r14{grid-row-start:15}.tg .r15{grid-row-start:16}.tg .r16{grid-row-start:17}.tg .r17{grid-row-start:18}.tg .r18{grid-row-start:19}.tg .r19{grid-row-start:20}.tg .r20{grid-row-start:21}.tg .r21{grid-row-start:22}.tg .r22{grid-row-start:23}.tg .r23{grid-row-start:24}.tg .r24{grid-row-start:25}.tg .r25{grid-row-start:26}.tg .r26{grid-row-start:27}.tg .r27{grid-row-start:28}.tg .r28{grid-row-start:29}.tg .r29{grid-row-start:30}.tg .r30{grid-row-start:31}.tg .r31{grid-row-start:32}.tg .r32{grid-row-start:33}.tg .r33{grid-row-start:34}.tg .r34{grid-row-start:35}.tg .r35{grid-row-start:36}.tg .r36{grid-row-start:37}.tg .r37{grid-row-start:38}.tg .r38{grid-row-start:39}.tg .r39{grid-row-start:40}.tg .r40{grid-row-start:41}.tg .r41{grid-row-start:42}.tg .r42{grid-row-start:43}.tg .r43{grid-row-start:44}.tg .r44{grid-row-start:45}.tg .r45{grid-row-start:46}.tg .r46{grid-row-start:47}.tg .r47{grid-row-start:48}.tg .r48{grid-row-start:49}.tg .r49{grid-row-start:50}.tg .r50{grid-row-start:51}.tg .r51{grid-row-start:52}.tg .r52{grid-row-start:53}.tg .r53{grid-row-start:54}.tg .r54{grid-row-start:55}.tg .r55{grid-row-start:56}.tg .r56{grid-row-start:57}.tg .r57{grid-row-start:58}.tg .r58{grid-row-start:59}.tg .r59{grid-row-start:60}.tg .r60{grid-row-start:61}.tg .r61{grid-row-start:62}.tg .r62{grid-row-start:63}.tg .r63{grid-row-start:64}.tg .r64{grid-row-start:65}.tg .r65{grid-row-start:66}.tg .r66{grid-row-start:67}.tg .r67{grid-row-start:68}.tg .r68{grid-row-start:69}.tg .r69{grid-row-start:70}.tg .r70{grid-row-start:71}.tg .r71{grid-row-start:72}.tg .r72{grid-row-start:73}.tg .r73{grid-row-start:74}.tg .r74{grid-row-start:75}.tg .r75{grid-row-start:76}.tg .r76{grid-row-start:77}.tg .r77{grid-row-start:78}.tg .r78{grid-row-start:79}.tg .r79{grid-row-start:80}.tg .r80{grid-row-start:81}.tg .r81{grid-row-start:82}.tg .r82{grid-row-start:83}.tg .r83{grid-row-start:84}.tg .r84{grid-row-start:85}.tg .r85{grid-row-start:86}.tg .r86{grid-row-start:87}.tg .r87{grid-row-start:88}.tg .r88{grid-row-start:89}.tg .r89{grid-row-start:90}.tg .r90{grid-row-start:91}.tg .r91{grid-row-start:92}.tg .r92{grid-row-start:93}.tg .r93{grid-row-start:94}.tg .r94{grid-row-start:95}.tg .r95{grid-row-start:96}.tg .h1{grid-row-end:span 1}.tg .h2{grid-row-end:span 2}.tg .h3{grid-row-end:span 3}.tg .h4{grid-row-end:span 4}.tg .h5{grid-row-end:span 5}.tg .h6{grid-row-end:span 6}.tg .h7{grid-row-end:span 7}.tg .h8{grid-row-end:span 8}.tg .h9{grid-row-end:span 9}.tg .h10{grid-row-end:span 10}.tg .h11{grid-row-end:span 11}.tg .h12{grid-row-end:span 12}.tg .h13{grid-row-end:span 13}.tg .h14{grid-row-end:span 14}.tg .h15{grid-row-end:span 15}.tg .h16{grid-row-end:span 16}.tg .h17{grid-row-end:span 17}.tg .h18{grid-row-end:span 18}.tg .h19{grid-row-end:span 19}.tg .h20{grid-row-end:span 20}.tg .h21{grid-row-end:span 21}.tg .h22{grid-row-end:span 22}.tg .h23{grid-row-end:span 23}.tg .h24{grid-row-end:span 24}.tg .h25{grid-row-end:span 25}.tg .h26{grid-row-end:span 26}.tg .h27{grid-row-end:span 27}.tg .h28{grid-row-end:span 28}.tg .h29{grid-row-end:span 29}.tg .h30{grid-row-end:span 30}.tg .h31{grid-row-end:span 31}.tg .h32{grid-row-end:span 32}.tg .h33{grid-row-end:span 33}.tg .h34{grid-row-end:span 34}.tg .h35{grid-row-end:span 35}.tg .h36{grid-row-end:span 36}.tg .h37{grid-row-end:span 37}.tg .h38{grid-row-end:span 38}.tg .h39{grid-row-end:span 39}.tg .h40{grid-row-end:span 40}.tg .h41{grid-row-end:span 41}.tg .h42{grid-row-end:span 42}.tg .h43{grid-row-end:span 43}.tg .h44{grid-row-end:span 44}.tg .h45{grid-row-end:span 45}.tg .h46{grid-row-end:span 46}.tg .h47{grid-row-end:span 47}.tg .h48{grid-row-end:span 48}.tg .h49{grid-row-end:span 49}.tg .h50{grid-row-end:span 50}.tg .h51{grid-row-end:span 51}.tg .h52{grid-row-end:span 52}.tg .h53{grid-row-end:span 53}.tg .h54{grid-row-end:span 54}.tg .h55{grid-row-end:span 55}.tg .h56{grid-row-end:span 56}.tg .h57{grid-row-end:span 57}.tg .h58{grid-row-end:span 58}.tg .h59{grid-row-end:span 59}.tg .h60{grid-row-end:span 60}.tg .h61{grid-row-end:span 61}.tg .h62{grid-row-end:span 62}.tg .h63{grid-row-end:span 63}.tg .h64{grid-row-end:span 64}.tg .h65{grid-row-end:span 65}.tg .h66{grid-row-end:span 66}.tg .h67{grid-row-end:span 67}.tg .h68{grid-row-end:span 68}.tg .h69{grid-row-end:span 69}.tg .h70{grid-row-end:span 70}.tg .h71{grid-row-end:span 71}.tg .h72{grid-row-end:span 72}.tg .h73{grid-row-end:span 73}.tg .h74{grid-row-end:span 74}.tg .h75{grid-row-end:span 75}.tg .h76{grid-row-end:span 76}.tg .h77{grid-row-end:span 77}.tg .h78{grid-row-end:span 78}.tg .h79{grid-row-end:span 79}.tg .h80{grid-row-end:span 80}.tg .h81{grid-row-end:span 81}.tg .h82{grid-row-end:span 82}.tg .h83{grid-row-end:span 83}.tg .h84{grid-row-end:span 84}.tg .h85{grid-row-end:span 85}.tg .h86{grid-row-end:span 86}.tg .h87{grid-row-end:span 87}.tg .h88{grid-row-end:span 88}.tg .h89{grid-row-end:span 89}.tg .h90{grid-row-end:span 90}.tg .h91{grid-row-end:span 91}.tg .h92{grid-row-end:span 92}.tg .h93{grid-row-end:span 93}.tg .h94{grid-row-end:span 94}.tg .h95{grid-row-end:span 95}.tg .h96{grid-row-end:span 96}.tg .l0-1{left:calc(0*100%/1);width:calc(100%/1 - 2px)}.tg .l0-2{left:calc(0*100%/2);width:calc(100%/2 - 2px)}.tg .l1-2{left:calc(1*100%/2);width:calc(100%/2 - 2px)}.tg .l0-3{left:calc(0*100%/3);width:calc(100%/3 - 2px)}.tg .l1-3{left:calc(1*100%/3);width:calc(100%/3 - 2px)}.tg .l2-3{left:calc(2*100%/3);width:calc(100%/3 - 2px)}.tg .l0-4{left:calc(0*100%/4);width:calc(100%/4 - 2px)}.tg .l1-4{left:calc(1*100%/4);width:calc(100%/4 - 2px)}.tg .l2-4{left:calc(2*100%/4);width:calc(100%/4 - 2px)}.tg .l3-4{left:calc(3*100%/4);width:calc(100%/4 - 2px)}@media (min-width: 1100px){.dash{grid-template-columns:repeat(12,minmax(0,1fr))}.dash>.w1{grid-column:span 1}.dash>.w2{grid-column:span 2}.dash>.w3{grid-column:span 3}.dash>.w4{grid-column:span 4}.dash>.w5{grid-column:span 5}.dash>.w6{grid-column:span 6}.dash>.w7{grid-column:span 7}.dash>.w8{grid-column:span 8}.dash>.w9{grid-column:span 9}.dash>.w10{grid-column:span 10}.dash>.w11{grid-column:span 11}.dash>.w12{grid-column:span 12}.dash>.h1{grid-row:span 1}.dash>.h2{grid-row:span 2}.dash>.h3{grid-row:span 3}.dash>.h4{grid-row:span 4}.dash>.h5{grid-row:span 5}.dash>.h6{grid-row:span 6}.dash>.h7{grid-row:span 7}.dash>.h8{grid-row:span 8}.dash>.h9{grid-row:span 9}.dash>.h10{grid-row:span 10}.dash>.h11{grid-row:span 11}.dash>.h12{grid-row:span 12}.dash>.h13{grid-row:span 13}.dash>.h14{grid-row:span 14}.dash>.o0{order:0}.dash>.o1{order:1}.dash>.o2{order:2}.dash>.o3{order:3}.dash>.o4{order:4}.dash>.o5{order:5}.dash>.o6{order:6}.dash>.o7{order:7}.dash>.o8{order:8}.dash>.o9{order:9}.dash>.o10{order:10}.dash>.o11{order:11}.dash>.o12{order:12}.dash>.o13{order:13}.dash>.o14{order:14}.dash>.o15{order:15}.dash>.o16{order:16}.dash>.o17{order:17}.dash>.o18{order:18}.dash>.o19{order:19}.dash>.o20{order:20}.dash>.o21{order:21}.dash>.o22{order:22}.dash>.o23{order:23}.dash>.o24{order:24}.dash>.o25{order:25}.dash>.o26{order:26}.dash>.o27{order:27}.dash>.o28{order:28}.dash>.o29{order:29}.dash>.o30{order:30}.dash>.o31{order:31}.dash>.o32{order:32}.dash>.o33{order:33}.dash>.o34{order:34}.dash>.o35{order:35}.dash>.o36{order:36}.dash>.o37{order:37}.dash>.o38{order:38}.dash>.o39{order:39}.dash>.o40{order:40}.dash>.o41{order:41}.dash>.o42{order:42}.dash>.o43{order:43}.dash>.o44{order:44}.dash>.o45{order:45}.dash>.o46{order:46}.dash>.o47{order:47}.dash>.o48{order:48}.dash>.o49{order:49}.dash>.o50{order:50}.dash>.o51{order:51}.dash>.o52{order:52}.dash>.o53{order:53}.dash>.o54{order:54}.dash>.o55{order:55}.dash>.o56{order:56}.dash>.o57{order:57}.dash>.o58{order:58}.dash>.o59{order:59}.dash>.o60{order:60}.dash>.o61{order:61}.dash>.o62{order:62}.dash>.o63{order:63}.dash>.o64{order:64}.dash>.o65{order:65}.dash>.o66{order:66}.dash>.o67{order:67}.dash>.o68{order:68}.dash>.o69{order:69}.dash>.o70{order:70}.dash>.o71{order:71}.dash>.o72{order:72}.dash>.o73{order:73}.dash>.o74{order:74}.dash>.o75{order:75}.dash>.o76{order:76}.dash>.o77{order:77}.dash>.o78{order:78}.dash>.o79{order:79}.dash>.o80{order:80}.dash>.o81{order:81}.dash>.o82{order:82}.dash>.o83{order:83}.dash>.o84{order:84}.dash>.o85{order:85}.dash>.o86{order:86}.dash>.o87{order:87}.dash>.o88{order:88}.dash>.o89{order:89}.dash>.o90{order:90}.dash>.o91{order:91}.dash>.o92{order:92}.dash>.o93{order:93}.dash>.o94{order:94}.dash>.o95{order:95}.dash>.o96{order:96}.dash>.o97{order:97}.dash>.o98{order:98}.dash>.o99{order:99}.dash>.o100{order:100}.dash>.o101{order:101}.dash>.o102{order:102}.dash>.o103{order:103}.dash>.o104{order:104}.dash>.o105{order:105}.dash>.o106{order:106}.dash>.o107{order:107}.dash>.o108{order:108}.dash>.o109{order:109}.dash>.o110{order:110}.dash>.o111{order:111}.dash>.o112{order:112}.dash>.o113{order:113}.dash>.o114{order:114}.dash>.o115{order:115}.dash>.o116{order:116}.dash>.o117{order:117}.dash>.o118{order:118}.dash>.o119{order:119}.dash>.o120{order:120}.dash>.o121{order:121}.dash>.o122{order:122}.dash>.o123{order:123}.dash>.o124{order:124}.dash>.o125{order:125}.dash>.o126{order:126}.dash>.o127{order:127}.dash>.o128{order:128}.dash>.o129{order:129}.dash>.o130{order:130}.dash>.o131{order:131}.dash>.o132{order:132}.dash>.o133{order:133}.dash>.o134{order:134}.dash>.o135{order:135}.dash>.o136{order:136}.dash>.o137{order:137}.dash>.o138{order:138}.dash>.o139{order:139}.dash>.o140{order:140}.dash>.o141{order:141}.dash>.o142{order:142}.dash>.o143{order:143}.dash>.o144{order:144}.dash>.o145{order:145}.dash>.o146{order:146}.dash>.o147{order:147}.dash>.o148{order:148}.dash>.o149{order:149}.dash>.o150{order:150}.dash>.o151{order:151}.dash>.o152{order:152}.dash>.o153{order:153}.dash>.o154{order:154}.dash>.o155{order:155}.dash>.o156{order:156}.dash>.o157{order:157}.dash>.o158{order:158}.dash>.o159{order:159}.dash>.o160{order:160}.dash>.o161{order:161}.dash>.o162{order:162}.dash>.o163{order:163}.dash>.o164{order:164}.dash>.o165{order:165}.dash>.o166{order:166}.dash>.o167{order:167}.dash>.o168{order:168}.dash>.o169{order:169}.dash>.o170{order:170}.dash>.o171{order:171}.dash>.o172{order:172}.dash>.o173{order:173}.dash>.o174{order:174}.dash>.o175{order:175}.dash>.o176{order:176}.dash>.o177{order:177}.dash>.o178{order:178}.dash>.o179{order:179}.dash>.o180{order:180}.dash>.o181{order:181}.dash>.o182{order:182}.dash>.o183{order:183}.dash>.o184{order:184}.dash>.o185{order:185}.dash>.o186{order:186}.dash>.o187{order:187}.dash>.o188{order:188}.dash>.o189{order:189}.dash>.o190{order:190}.dash>.o191{order:191}.dash>.o192{order:192}.dash>.o193{order:193}.dash>.o194{order:194}.dash>.o195{order:195}.dash>.o196{order:196}.dash>.o197{order:197}.dash>.o198{order:198}.dash>.o199{order:199}.dash>.hide-d{display:none}.dash.editing>.hide-d{display:flex;opacity:.35}}@media (min-width: 700px) and (max-width: 1099.98px){.dash{grid-template-columns:repeat(8,minmax(0,1fr))}.dash>.tw1{grid-column:span 1}.dash>.tw2{grid-column:span 2}.dash>.tw3{grid-column:span 3}.dash>.tw4{grid-column:span 4}.dash>.tw5{grid-column:span 5}.dash>.tw6{grid-column:span 6}.dash>.tw7{grid-column:span 7}.dash>.tw8{grid-column:span 8}.dash>.tw9{grid-column:span 8}.dash>.tw10{grid-column:span 8}.dash>.tw11{grid-column:span 8}.dash>.tw12{grid-column:span 8}.dash>.th1{grid-row:span 1}.dash>.th2{grid-row:span 2}.dash>.th3{grid-row:span 3}.dash>.th4{grid-row:span 4}.dash>.th5{grid-row:span 5}.dash>.th6{grid-row:span 6}.dash>.th7{grid-row:span 7}.dash>.th8{grid-row:span 8}.dash>.th9{grid-row:span 9}.dash>.th10{grid-row:span 10}.dash>.th11{grid-row:span 11}.dash>.th12{grid-row:span 12}.dash>.th13{grid-row:span 13}.dash>.th14{grid-row:span 14}.dash>.to0{order:0}.dash>.to1{order:1}.dash>.to2{order:2}.dash>.to3{order:3}.dash>.to4{order:4}.dash>.to5{order:5}.dash>.to6{order:6}.dash>.to7{order:7}.dash>.to8{order:8}.dash>.to9{order:9}.dash>.to10{order:10}.dash>.to11{order:11}.dash>.to12{order:12}.dash>.to13{order:13}.dash>.to14{order:14}.dash>.to15{order:15}.dash>.to16{order:16}.dash>.to17{order:17}.dash>.to18{order:18}.dash>.to19{order:19}.dash>.to20{order:20}.dash>.to21{order:21}.dash>.to22{order:22}.dash>.to23{order:23}.dash>.to24{order:24}.dash>.to25{order:25}.dash>.to26{order:26}.dash>.to27{order:27}.dash>.to28{order:28}.dash>.to29{order:29}.dash>.to30{order:30}.dash>.to31{order:31}.dash>.to32{order:32}.dash>.to33{order:33}.dash>.to34{order:34}.dash>.to35{order:35}.dash>.to36{order:36}.dash>.to37{order:37}.dash>.to38{order:38}.dash>.to39{order:39}.dash>.to40{order:40}.dash>.to41{order:41}.dash>.to42{order:42}.dash>.to43{order:43}.dash>.to44{order:44}.dash>.to45{order:45}.dash>.to46{order:46}.dash>.to47{order:47}.dash>.to48{order:48}.dash>.to49{order:49}.dash>.to50{order:50}.dash>.to51{order:51}.dash>.to52{order:52}.dash>.to53{order:53}.dash>.to54{order:54}.dash>.to55{order:55}.dash>.to56{order:56}.dash>.to57{order:57}.dash>.to58{order:58}.dash>.to59{order:59}.dash>.to60{order:60}.dash>.to61{order:61}.dash>.to62{order:62}.dash>.to63{order:63}.dash>.to64{order:64}.dash>.to65{order:65}.dash>.to66{order:66}.dash>.to67{order:67}.dash>.to68{order:68}.dash>.to69{order:69}.dash>.to70{order:70}.dash>.to71{order:71}.dash>.to72{order:72}.dash>.to73{order:73}.dash>.to74{order:74}.dash>.to75{order:75}.dash>.to76{order:76}.dash>.to77{order:77}.dash>.to78{order:78}.dash>.to79{order:79}.dash>.to80{order:80}.dash>.to81{order:81}.dash>.to82{order:82}.dash>.to83{order:83}.dash>.to84{order:84}.dash>.to85{order:85}.dash>.to86{order:86}.dash>.to87{order:87}.dash>.to88{order:88}.dash>.to89{order:89}.dash>.to90{order:90}.dash>.to91{order:91}.dash>.to92{order:92}.dash>.to93{order:93}.dash>.to94{order:94}.dash>.to95{order:95}.dash>.to96{order:96}.dash>.to97{order:97}.dash>.to98{order:98}.dash>.to99{order:99}.dash>.to100{order:100}.dash>.to101{order:101}.dash>.to102{order:102}.dash>.to103{order:103}.dash>.to104{order:104}.dash>.to105{order:105}.dash>.to106{order:106}.dash>.to107{order:107}.dash>.to108{order:108}.dash>.to109{order:109}.dash>.to110{order:110}.dash>.to111{order:111}.dash>.to112{order:112}.dash>.to113{order:113}.dash>.to114{order:114}.dash>.to115{order:115}.dash>.to116{order:116}.dash>.to117{order:117}.dash>.to118{order:118}.dash>.to119{order:119}.dash>.to120{order:120}.dash>.to121{order:121}.dash>.to122{order:122}.dash>.to123{order:123}.dash>.to124{order:124}.dash>.to125{order:125}.dash>.to126{order:126}.dash>.to127{order:127}.dash>.to128{order:128}.dash>.to129{order:129}.dash>.to130{order:130}.dash>.to131{order:131}.dash>.to132{order:132}.dash>.to133{order:133}.dash>.to134{order:134}.dash>.to135{order:135}.dash>.to136{order:136}.dash>.to137{order:137}.dash>.to138{order:138}.dash>.to139{order:139}.dash>.to140{order:140}.dash>.to141{order:141}.dash>.to142{order:142}.dash>.to143{order:143}.dash>.to144{order:144}.dash>.to145{order:145}.dash>.to146{order:146}.dash>.to147{order:147}.dash>.to148{order:148}.dash>.to149{order:149}.dash>.to150{order:150}.dash>.to151{order:151}.dash>.to152{order:152}.dash>.to153{order:153}.dash>.to154{order:154}.dash>.to155{order:155}.dash>.to156{order:156}.dash>.to157{order:157}.dash>.to158{order:158}.dash>.to159{order:159}.dash>.to160{order:160}.dash>.to161{order:161}.dash>.to162{order:162}.dash>.to163{order:163}.dash>.to164{order:164}.dash>.to165{order:165}.dash>.to166{order:166}.dash>.to167{order:167}.dash>.to168{order:168}.dash>.to169{order:169}.dash>.to170{order:170}.dash>.to171{order:171}.dash>.to172{order:172}.dash>.to173{order:173}.dash>.to174{order:174}.dash>.to175{order:175}.dash>.to176{order:176}.dash>.to177{order:177}.dash>.to178{order:178}.dash>.to179{order:179}.dash>.to180{order:180}.dash>.to181{order:181}.dash>.to182{order:182}.dash>.to183{order:183}.dash>.to184{order:184}.dash>.to185{order:185}.dash>.to186{order:186}.dash>.to187{order:187}.dash>.to188{order:188}.dash>.to189{order:189}.dash>.to190{order:190}.dash>.to191{order:191}.dash>.to192{order:192}.dash>.to193{order:193}.dash>.to194{order:194}.dash>.to195{order:195}.dash>.to196{order:196}.dash>.to197{order:197}.dash>.to198{order:198}.dash>.to199{order:199}.dash>.hide-t{display:none}.dash.editing>.hide-t{display:flex;opacity:.35}}@media (max-width: 699.98px){.dash{grid-template-columns:repeat(4,minmax(0,1fr))}.dash>.mw1{grid-column:span 1}.dash>.mw2{grid-column:span 2}.dash>.mw3{grid-column:span 3}.dash>.mw4{grid-column:span 4}.dash>.mw5{grid-column:span 4}.dash>.mw6{grid-column:span 4}.dash>.mw7{grid-column:span 4}.dash>.mw8{grid-column:span 4}.dash>.mw9{grid-column:span 4}.dash>.mw10{grid-column:span 4}.dash>.mw11{grid-column:span 4}.dash>.mw12{grid-column:span 4}.dash>.mh1{grid-row:span 1}.dash>.mh2{grid-row:span 2}.dash>.mh3{grid-row:span 3}.dash>.mh4{grid-row:span 4}.dash>.mh5{grid-row:span 5}.dash>.mh6{grid-row:span 6}.dash>.mh7{grid-row:span 7}.dash>.mh8{grid-row:span 8}.dash>.mh9{grid-row:span 9}.dash>.mh10{grid-row:span 10}.dash>.mh11{grid-row:span 11}.dash>.mh12{grid-row:span 12}.dash>.mh13{grid-row:span 13}.dash>.mh14{grid-row:span 14}.dash>.mo0{order:0}.dash>.mo1{order:1}.dash>.mo2{order:2}.dash>.mo3{order:3}.dash>.mo4{order:4}.dash>.mo5{order:5}.dash>.mo6{order:6}.dash>.mo7{order:7}.dash>.mo8{order:8}.dash>.mo9{order:9}.dash>.mo10{order:10}.dash>.mo11{order:11}.dash>.mo12{order:12}.dash>.mo13{order:13}.dash>.mo14{order:14}.dash>.mo15{order:15}.dash>.mo16{order:16}.dash>.mo17{order:17}.dash>.mo18{order:18}.dash>.mo19{order:19}.dash>.mo20{order:20}.dash>.mo21{order:21}.dash>.mo22{order:22}.dash>.mo23{order:23}.dash>.mo24{order:24}.dash>.mo25{order:25}.dash>.mo26{order:26}.dash>.mo27{order:27}.dash>.mo28{order:28}.dash>.mo29{order:29}.dash>.mo30{order:30}.dash>.mo31{order:31}.dash>.mo32{order:32}.dash>.mo33{order:33}.dash>.mo34{order:34}.dash>.mo35{order:35}.dash>.mo36{order:36}.dash>.mo37{order:37}.dash>.mo38{order:38}.dash>.mo39{order:39}.dash>.mo40{order:40}.dash>.mo41{order:41}.dash>.mo42{order:42}.dash>.mo43{order:43}.dash>.mo44{order:44}.dash>.mo45{order:45}.dash>.mo46{order:46}.dash>.mo47{order:47}.dash>.mo48{order:48}.dash>.mo49{order:49}.dash>.mo50{order:50}.dash>.mo51{order:51}.dash>.mo52{order:52}.dash>.mo53{order:53}.dash>.mo54{order:54}.dash>.mo55{order:55}.dash>.mo56{order:56}.dash>.mo57{order:57}.dash>.mo58{order:58}.dash>.mo59{order:59}.dash>.mo60{order:60}.dash>.mo61{order:61}.dash>.mo62{order:62}.dash>.mo63{order:63}.dash>.mo64{order:64}.dash>.mo65{order:65}.dash>.mo66{order:66}.dash>.mo67{order:67}.dash>.mo68{order:68}.dash>.mo69{order:69}.dash>.mo70{order:70}.dash>.mo71{order:71}.dash>.mo72{order:72}.dash>.mo73{order:73}.dash>.mo74{order:74}.dash>.mo75{order:75}.dash>.mo76{order:76}.dash>.mo77{order:77}.dash>.mo78{order:78}.dash>.mo79{order:79}.dash>.mo80{order:80}.dash>.mo81{order:81}.dash>.mo82{order:82}.dash>.mo83{order:83}.dash>.mo84{order:84}.dash>.mo85{order:85}.dash>.mo86{order:86}.dash>.mo87{order:87}.dash>.mo88{order:88}.dash>.mo89{order:89}.dash>.mo90{order:90}.dash>.mo91{order:91}.dash>.mo92{order:92}.dash>.mo93{order:93}.dash>.mo94{order:94}.dash>.mo95{order:95}.dash>.mo96{order:96}.dash>.mo97{order:97}.dash>.mo98{order:98}.dash>.mo99{order:99}.dash>.mo100{order:100}.dash>.mo101{order:101}.dash>.mo102{order:102}.dash>.mo103{order:103}.dash>.mo104{order:104}.dash>.mo105{order:105}.dash>.mo106{order:106}.dash>.mo107{order:107}.dash>.mo108{order:108}.dash>.mo109{order:109}.dash>.mo110{order:110}.dash>.mo111{order:111}.dash>.mo112{order:112}.dash>.mo113{order:113}.dash>.mo114{order:114}.dash>.mo115{order:115}.dash>.mo116{order:116}.dash>.mo117{order:117}.dash>.mo118{order:118}.dash>.mo119{order:119}.dash>.mo120{order:120}.dash>.mo121{order:121}.dash>.mo122{order:122}.dash>.mo123{order:123}.dash>.mo124{order:124}.dash>.mo125{order:125}.dash>.mo126{order:126}.dash>.mo127{order:127}.dash>.mo128{order:128}.dash>.mo129{order:129}.dash>.mo130{order:130}.dash>.mo131{order:131}.dash>.mo132{order:132}.dash>.mo133{order:133}.dash>.mo134{order:134}.dash>.mo135{order:135}.dash>.mo136{order:136}.dash>.mo137{order:137}.dash>.mo138{order:138}.dash>.mo139{order:139}.dash>.mo140{order:140}.dash>.mo141{order:141}.dash>.mo142{order:142}.dash>.mo143{order:143}.dash>.mo144{order:144}.dash>.mo145{order:145}.dash>.mo146{order:146}.dash>.mo147{order:147}.dash>.mo148{order:148}.dash>.mo149{order:149}.dash>.mo150{order:150}.dash>.mo151{order:151}.dash>.mo152{order:152}.dash>.mo153{order:153}.dash>.mo154{order:154}.dash>.mo155{order:155}.dash>.mo156{order:156}.dash>.mo157{order:157}.dash>.mo158{order:158}.dash>.mo159{order:159}.dash>.mo160{order:160}.dash>.mo161{order:161}.dash>.mo162{order:162}.dash>.mo163{order:163}.dash>.mo164{order:164}.dash>.mo165{order:165}.dash>.mo166{order:166}.dash>.mo167{order:167}.dash>.mo168{order:168}.dash>.mo169{order:169}.dash>.mo170{order:170}.dash>.mo171{order:171}.dash>.mo172{order:172}.dash>.mo173{order:173}.dash>.mo174{order:174}.dash>.mo175{order:175}.dash>.mo176{order:176}.dash>.mo177{order:177}.dash>.mo178{order:178}.dash>.mo179{order:179}.dash>.mo180{order:180}.dash>.mo181{order:181}.dash>.mo182{order:182}.dash>.mo183{order:183}.dash>.mo184{order:184}.dash>.mo185{order:185}.dash>.mo186{order:186}.dash>.mo187{order:187}.dash>.mo188{order:188}.dash>.mo189{order:189}.dash>.mo190{order:190}.dash>.mo191{order:191}.dash>.mo192{order:192}.dash>.mo193{order:193}.dash>.mo194{order:194}.dash>.mo195{order:195}.dash>.mo196{order:196}.dash>.mo197{order:197}.dash>.mo198{order:198}.dash>.mo199{order:199}.dash>.hide-m{display:none}.dash.editing>.hide-m{display:flex;opacity:.35}}