@font-face{font-family:'B612';font-style:normal;font-weight:400;src:url('../font/B612-Regular.woff2')format('woff2')}
@font-face{font-family:'B612';font-style:italic;font-weight:400;src:url('../font/B612-Italic.woff2')format('woff2')}
@font-face{font-family:'B612';font-style:normal;font-weight:700;src:url('../font/B612-Bold.woff2')format('woff2')}
@font-face{font-family:'B612';font-style:italic;font-weight:700;src:url('../font/B612-BoldItalic.woff2')format('woff2')}
@font-face{font-family:'B612Mono';font-style:normal;font-weight:400;src:url('../font/B612Mono-Regular.woff2')format('woff2')}
@font-face{font-family:'B612Mono';font-style:italic;font-weight:400;src:url('../font/B612Mono-Italic.woff2')format('woff2')}
@font-face{font-family:'B612Mono';font-style:normal;font-weight:700;src:url('../font/B612Mono-Bold.woff2')format('woff2')}
@font-face{font-family:'B612Mono';font-style:italic;font-weight:700;src:url('../font/B612Mono-BoldItalic.woff2')format('woff2')}
:root {
 --input-height: 2.4rem;
 --dropdown-height: max(50vh, 400px);
 --pill-text: 0.5rem;
 --pill-spacing: 0.25rem;
 --pico-font-size: 1.1rem;
 --pico-form-element-spacing-vertical:0.3rem;
 --pico-form-element-spacing-horizontal:.4rem;
}
html{font-family:B612}
/* hidden elements */
table tr.hide,a.hide,div.hide>* {display:none}
/* error messages */
ul.errorlist > li {color:var(--pico-form-element-invalid-focus-color);list-style:none;font-size:smaller}
button[aria-label="Delete"] {
  background-color:var(--pico-form-element-invalid-focus-color);
  border-color:var(--pico-form-element-invalid-focus-color);
}

/* FORMS */
/* filter/search form grid */
div.search {
 display: grid;
 background-color:var(--pico-form-element-background-color);
 gap: var(--pico-form-element-spacing-vertical);
 padding: var(--pico-form-element-spacing-vertical) var(--pico-form-element-spacing-horizontal);
 border-radius: var(--pico-border-radius);
}
div.search {grid-template-columns: 1fr 6rem}
div.search>div:nth-of-type(1),div.search>div:nth-of-type(2) {display:flex;gap:var(--pico-form-element-spacing-horizontal);grid-column:1/2}
div.search>div:nth-of-type(1) {grid-row:1/2}
div.search>div:nth-of-type(2) {grid-row:2/3;}
div.search>div:nth-of-type(3) {display:flex;flex-direction:column;grid-column:2/3;grid-row:1/3;justify-content:space-between}
div.search>div>*,div.search input {margin:0}
div.search select {width:10rem}
div.search fieldset:has(input[type="date"]) {width: 12rem}
fieldset .dropdown .ss-values {padding:0}
/* bank upload form */
fieldset.upload {
 display:flex;
 align-items:flex-start;
 margin-bottom:var(--pico-spacing);
 gap:var(--pico-spacing);
}
fieldset.upload * {margin:0}
fieldset.upload>div {display:flex;flex-flow:column nowrap}
/* transaction category form */
div.categorize {
 display:grid;
 gap: var(--pico-spacing);
 grid-template-columns: 1fr 1fr;
}

/* FORM INPUT GROUP */
/* fieldset */
fieldset {
 background-color:var(--pico-form-element-background-color);
 padding:var(--pico-form-element-spacing-vertical) var(--pico-form-element-spacing-horizontal);
 border: var(--pico-border-width) solid var(--pico-form-element-border-color);
 border-radius: var(--pico-border-radius);
 width: fit-content;
}
fieldset>input {border:none}
/* multiple inputs/buttons in a container */
div.group {
 align-items:center;
 border-radius:var(--pico-border-radius);
 width:max-content;
}
div.group * {margin:0}
div.group fieldset {padding:0 var(--pico-form-element-spacing-horizontal)}
div.group,:has([role="button"]):is(section,footer) {display:flex;justify-content:space-between}
div.group,section>div:has(> [role="button"],button) {display:flex;gap:var(--pico-form-element-spacing-vertical)}
section>div:has(> [role="button"]):not(:has(+ div)) {justify-content:end}

/* FORM INPUTS */
/* toggle switch */
div.toggle {
 padding:var(--pico-form-element-spacing-vertical) var(--pico-form-element-spacing-horizontal);
 height:calc(1rem * var(--pico-line-height) + var(--pico-form-element-spacing-vertical) * 2 + var(--pico-border-width) * 2);
 border:var(--pico-border-width) solid var(--pico-form-element-border-color);
 border-radius:var(--pico-border-radius);
 background-color:var(--pico-form-element-background-color);
 color:var(--pico-form-element-color);
 font-weight:var(--pico-font-weight);
 margin-bottom:var(--pico-spacing);
 transition:background-color var(--pico-transition),
  border-color var(--pico-transition),
  color var(--pico-transition);
}
div.toggle:has(> label > input[type="checkbox"]:disabled) {
 opacity:var(--pico-form-element-disabled-opacity);
 pointer-events:none;
}
div.toggle > label {margin:0 auto}
table div.toggle:has(> label > input[type="checkbox"]) {margin:0}
/* date input */
fieldset:has(input[type="date"]) {
 contain: layout;
 box-shadow: none;
 padding:0 var(--pico-form-element-spacing-horizontal);
 margin: 0;
}
fieldset:has(input[type="date"])>legend {position:absolute;top:-10px;margin:0;padding: 0 var(--pico-form-element-spacing-horizontal);font-size:.8rem}
input[type="date"] {margin:0}
/* icon buttons */
:is(a,button) > img {height:1.5rem;width:1.5rem;object-fit:contain;border-radius:50%}

/* TABLES */
/* overflow */
div.grid:has(> table) {overflow-x:scroll}
/* clickable header, column width */
th.sort {cursor:pointer}
th.size-lg {min-width:12rem}
th.size-md {min-width:6rem}
th.size-sm {min-width:2rem}
th.size-xs {min-width:1rem}
/* clickable row */
tr.select-row {cursor:pointer}
tr.select-row:hover, tr.select-row:focus, tr.select-row:hover td, tr.select-row:focus td {background-color:var(--pico-form-element-selected-background-color)}
tr.select-row>td:nth-of-type(1) {padding:0;text-align:center}
tr.select-row>td:nth-of-type(1)>input[type="checkbox"] {margin:0;height:2rem;width:2rem}
/* clickable cell */
td.edit {cursor:pointer}
td.edit>input {text-align:right;min-width:8ch;margin:-2px -5px;padding:2px 5px;height:100%}
td:has(> a) {text-align:center}
/* specialized headings - compress: very small headings for overview page; split: two-column combined heading */
thead.compress {font-size:.7rem}
thead.compress td {padding-top:0;padding-bottom:0;text-align:center}
th.split {text-align:center}
th.split > div {display:grid;grid-template-columns:50% 50%}
/* compact data entry table */
table.entry td {padding:0;text-align:center}
table.entry td > input, table.entry td > div {
  margin: 0;
  padding: 2px 5px;
  height: 100%;
  border-radius: unset;
  white-space: nowrap;
}
table.entry td > input[type="number"], div.group > fieldset > input[type="number"] {width:6rem}
/* data format */
td[data-type="amount"] {text-align:right}

/* SETTINGS */
/* action icon buttons */
div.icon-cell{display:flex;justify-content:space-around}
div.icon-cell>button{
 padding:calc(var(--pico-form-element-spacing-vertical) * 0.5) var(--pico-form-element-spacing-horizontal);
 display:flex;
 align-items:center;
 background-color:var(--pico-form-element-background-color);
 border:var(--pico-border-width) solid var(--pico-form-element-border-color);
 border-radius:var(--pico-border-radius);
}
div.icon-cell>button:hover {background-color:var(--pico-form-element-active-background-color);border-color:var(--pico-form-element-active-border-color)}
div.icon-cell>button>i{width:1.4rem;height:1.4rem;display:inline-block;background-color:var(--pico-form-element-color);mask-repeat:no-repeat}
i.disconnect{-webkit-mask:var(--icon-disconnect);mask:var(--icon-disconnect)}
i.connect{-webkit-mask:var(--icon-connect);mask:var(--icon-connect)}
i.repair{-webkit-mask:var(--icon-repair) no-repeat center;mask:var(--icon-repair) no-repeat center}
:root {
--icon-connect: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath fill='black' d='m14 10c0-0.55-0.4-1-1-1h-0.5c-3 0-5.5 2.5-5.5 5.5s2.5 5.5 5.5 5.5h5c3 0 5.5-2.5 5.5-5.5 0-2.5-1.7-4.6-3.9-5.3-0.6-0.17-1.1 0.3-1.1 0.87v0.1c0 0.5 0.4 0.9 0.8 1.1 1.3 0.5 2.2 1.7 2.2 3.2 0 1.9-1.6 3.5-3.5 3.5h-5c-1.9 0-3.5-1.6-3.5-3.5s1.6-3.5 3.5-3.5h0.5c0.6 0 1-0.4 1-1z'/%3E%3Cpath fill='black' d='m12 4c3 0 5.5 2.5 5.5 5.5 0 3-2.5 5.5-5.5 5.5h-0.5c-0.6 0-1-0.4-1-1s0.4-1 1-1h0.5c1.9 0 3.5-1.6 3.5-3.5 0-1.9-1.6-3.5-3.5-3.5h-5c-1.9 0-3.5 1.6-3.5 3.5 0 1.5 0.89 2.7 2.2 3.2 0.46 0.2 0.83 0.6 0.83 1.1v0.1c0 0.6-0.51 1-1.1 0.9-2.3-0.7-3.9-2.8-3.9-5.3 0-3 2.5-5.5 5.5-5.5z'/%3E%3C/svg%3E");
--icon-disconnect: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m21 19-1-1c-0.4-0.4-1-0.3-1.4 0-0.4 0.4-0.4 1 0 1.4l1 1c0.2 0.2 0.5 0.3 0.7 0.3s0.5-0.1 0.7-0.3c0.4-0.4 0.3-1 0-1.4z'/%3E%3Cpath d='m14 22c0 0.6 0.4 1 1 1s1-0.4 1-1v-2c0-0.6-0.4-1-1-1s-1 0.4-1 1z'/%3E%3Cpath d='m22 14h-2c-0.6 0-1 0.4-1 1s0.4 1 1 1h2c0.6 0 1-0.4 1-1s-0.4-1-1-1z'/%3E%3Cpath d='m21 8.4c0-1.4-0.5-2.6-1.5-3.6s-2.2-1.5-3.6-1.5-2.6 0.5-3.6 1.5l-2.2 2.2c-0.4 0.4-0.4 1 0 1.4s1 0.4 1.4 0l2.2-2.2c1.2-1.2 3.2-1.2 4.4 0 0.6 0.6 0.9 1.4 0.9 2.2s-0.3 1.6-0.9 2.2l-2.2 2.2c-0.4 0.4-0.4 1 0 1.4 0.2 0.2 0.5 0.3 0.7 0.3s0.5-0.1 0.7-0.3l2.2-2.2c1-1 1.5-2.2 1.5-3.6z'/%3E%3Cpath d='m3.3 16c0 1.4 0.5 2.6 1.5 3.6s2.2 1.5 3.6 1.5 2.6-0.5 3.6-1.5l2.2-2.2c0.4-0.4 0.4-1 0-1.4s-1-0.4-1.4 0l-2.2 2.2c-1.2 1.2-3.2 1.2-4.4 0-0.6-0.6-0.9-1.4-0.9-2.2s0.3-1.6 0.9-2.2l2.2-2.2c0.4-0.4 0.4-1 0-1.4s-1-0.4-1.4 0l-2.2 2.2c-1 1-1.5 2.2-1.5 3.6z'/%3E%3Cpath d='m5.7 4.3-1-1c-0.4-0.4-1-0.4-1.4 0s-0.4 1 0 1.4l1 1c0.2 0.2 0.4 0.3 0.7 0.3s0.5-0.1 0.7-0.3c0.4-0.4 0.4-1 0-1.4z'/%3E%3Cpath d='m10 4v-2c0-0.6-0.4-1-1-1s-1 0.4-1 1v2c0 0.6 0.4 1 1 1s1-0.4 1-1z'/%3E%3Cpath d='m4 10c0.6 0 1-0.4 1-1s-0.4-1-1-1h-2c-0.6 0-1 0.4-1 1s0.4 1 1 1z'/%3E%3C/svg%3E");
--icon-repair: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath fill='black' d='m3.9 2c1.1-0.4 2.3-0.1 3.1 0.7 1.1 1.1 1.1 2.9 0 4-1.1 1.2-3 1.2-4.1 0-0.8-0.8-1-2-0.6-3 0.1-0.3-0.1-0.6-0.3-0.7-0.3-0.1-0.6 0.1-0.7 0.3-0.5 1.4-0.2 3.1 0.9 4.2 1.5 1.5 4 1.5 5.5 0 1.5-1.6 1.5-4 0-5.6-1.1-1-2.7-1.4-4.1-0.9-0.3 0.1-0.4 0.4-0.3 0.7s0.4 0.4 0.6 0.3z'/%3E%3Cpath fill='black' d='m3.3 2 1.3 1.3c0.1 0.1 0.1 0.3 0 0.4l-0.7 0.7c-0.1 0.1-0.3 0.1-0.4 0l-1.3-1.4c-0.2-0.2-0.5-0.2-0.7 0s-0.2 0.6 0 0.8l1.3 1.3c0.5 0.5 1.3 0.5 1.8 0l0.7-0.7c0.5-0.5 0.5-1.3 0-1.9l-1.3-1.3c-0.2-0.2-0.5-0.2-0.7 0s-0.2 0.6 0 0.8zm17 20c-1.1 0.4-2.3 0.2-3.1-0.6-1.1-1.2-1.1-3 0-4.1 1.2-1.1 3-1.1 4.1 0 0.8 0.8 1.1 2 0.7 3-0.1 0.3 0 0.6 0.3 0.7 0.2 0.1 0.5 0 0.6-0.3 0.6-1.4 0.2-3-0.9-4.1-1.5-1.6-4-1.6-5.5 0-1.5 1.5-1.5 4 0 5.5 1.1 1.1 2.7 1.4 4.1 0.9 0.3-0.1 0.4-0.4 0.3-0.7-0.1-0.2-0.4-0.4-0.6-0.3z'/%3E%3Cpath fill='black' d='m21 22-1.3-1.4c-0.1-0.1-0.1-0.2 0-0.3l0.7-0.7c0.1-0.2 0.3-0.2 0.4 0l1.3 1.3c0.2 0.2 0.5 0.2 0.7 0s0.2-0.6 0-0.8l-1.3-1.3c-0.5-0.5-1.3-0.5-1.8 0l-0.7 0.7c-0.5 0.5-0.5 1.4 0 1.9l1.3 1.3c0.2 0.2 0.5 0.2 0.7 0s0.2-0.5 0-0.7zm-4.7-4.2-9.8-9.8c-0.2-0.2-0.5-0.2-0.7 0s-0.2 0.5 0 0.7l9.8 9.8c0.2 0.2 0.5 0.2 0.7 0s0.2-0.5 0-0.7zm-8.2-12 10 10c0.2 0.2 0.5 0.2 0.7 0s0.2-0.5 0-0.7l-10-10c-0.2-0.2-0.5-0.2-0.7 0s-0.2 0.5 0 0.7zm6.3 2.8 4.5-4.4c0.2-0.2 0.2-0.5 0-0.7s-0.6-0.2-0.8 0l-4.4 4.4c-0.2 0.2-0.2 0.5 0 0.7s0.5 0.2 0.7 0zm5.4-3.8-4.6 4.6c-0.2 0.2-0.2 0.5 0 0.7s0.6 0.2 0.8 0l4.5-4.5c0.2-0.2 0.2-0.6 0-0.8s-0.5-0.2-0.7 0z'/%3E%3Cpath fill='black' d='m23 2.2a0.51 0.51 0 0 1 0.1 0.5l-0.7 2a0.51 0.51 0 0 1-0.3 0.4l-2 0.7a0.51 0.51 0 0 1-0.6-0.2l-1.3-1.3a0.51 0.51 0 0 1-0.1-0.5l0.7-2.1a0.51 0.51 0 0 1 0.3-0.3l2-0.7a0.51 0.51 0 0 1 0.6 0.1zm-1.8-0.4-1.5 0.5-0.6 1.5 0.9 0.9 1.5-0.5 0.5-1.5zm-11 14-6 6.1c-0.2 0.2-0.4 0.2-0.5 0.1l-1.9-1.9c-0.1 0 0-0.3 0.1-0.5l6.1-6c0.2-0.2 0.2-0.5 0-0.7s-0.5-0.2-0.7 0l-6.1 6c-0.5 0.6-0.6 1.4-0.1 2l1.9 1.8c0.5 0.5 1.3 0.5 1.9-0.1l6.1-6.1c0.2-0.2 0.2-0.5 0-0.7s-0.6-0.2-0.8 0z'/%3E%3C/svg%3E");
}

/* STUDENT LOANS */
input[type="range"] {direction:rtl}

/* CHARTS */
div:has(> canvas) {position:relative;width:100%;height:500px;padding:0.75rem;text-align:center}
canvas {display:inline-block!important}

/* PAGE HEADER */
body > header {position:sticky;top:0;-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem);z-index:3}
body > header > div {display:flex;align-items:center;justify-content:space-between}
body > header h1 {margin-bottom:0}
body > header details.dropdown {margin:0}
body > header details.dropdown > ul {right:0;left:auto}
body > header details img {height:1.5rem;width:1.5rem;object-fit:contain;border-radius:50%}
body > header > div > nav > ul > li > details.dropdown > ul > li {text-align:right}

/* LEFT-HAND-NAVIGATION */
aside ol:first-of-type {padding-left:1rem;margin:0}
aside ol li {display:list-item;padding:0.3rem 0.5rem 0 0}
aside ol li div[role="link"] {display:initial;cursor:pointer}
body > header button.mobile-menu-control {display:none;border:none;background-color:inherit;margin-bottom:0}
body > main {
 display:grid;
 grid-template-rows:1fr;
 grid-template-columns:9rem 1fr;
 grid-template-areas:"menu body";
 -moz-column-gap:3rem;
 column-gap:3rem;
}
body > main > aside#side-menu {--pico-font-size:16px;font-size:var(--pico-font-size);grid-area:menu}
body > main > aside :is(header, li.section) {display:none}
body > main > aside#side-menu > nav {position:sticky;transition:top var(--pico-transition);transition-delay:50ms}
body > main > aside#side-menu > nav li small:has(+ hr) {
 float: left;
 text-transform: uppercase;
 margin: 10px 6px 0 0;
 color: var(--pico-muted-border-color);
}
body > main > aside#side-menu > nav hr {margin-bottom: 0}
body > main > div {grid-area:body;z-index:2;overflow:auto}
@media (max-width: 1023px) {
 body > header button.mobile-menu-control {display:inherit}
 body > header :is(h1, li.section) {display:none}
 body > main {display:block}
 body > main > aside#side-menu {
  margin:0 auto;
  padding:var(--pico-spacing);
  z-index:4;
  position:fixed;
  inset:0;
  transform:translate(calc(-100% - var(--pico-spacing)));
  transition:transform var(--pico-transition);
 }
 body > main > aside#side-menu::before {
  z-index:-1;
  position:fixed;
  inset:0;
  background-color:var(--pico-background-color);
  content:"";
 }
 body > main > aside#side-menu > header {
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  margin-bottom:var(--pico-spacing);
 }
 body > main > aside#side-menu > nav li.section {display:block}
 body > main > aside#side-menu > header > :is(h2, button[type='button']) {margin-bottom:0}
 body > main > aside#side-menu button[rel=prev] {
  border:none;
  background-image:var(--pico-icon-close);
  background-position:center;
  background-size:auto 1rem;
  background-repeat:no-repeat;
  background-color:transparent;
  opacity:.5;
  transition:opacity var(--pico-transition);
 }
 body > main > aside#side-menu.open-mobile {transform:translate(0)}
}
@media (min-width: 1024px) {body > main {grid-template-columns:10rem 1fr}}
@media (min-width: 1280px) {body > main {grid-template-columns:8rem 1fr}}