.finance-tools {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  margin: 12px 0;
}
.finance-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 18px 0;
}
.finance-menu button {
  min-height: 44px;
}
.finance-search {
  display: flex;
  gap: 12px;
  align-items: end;
  margin: 16px 0;
}
.finance-search label {
  flex: 1;
  min-width: 0;
}
.finance-record {
  background: white;
  border: 1px solid #ccd7e2;
  border-radius: 14px;
  padding: 16px;
  margin: 12px 0;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  overflow-wrap: anywhere;
}
.finance-record > div:first-child {
  flex: 1;
  min-width: 180px;
}
.finance-record .actions {
  flex-wrap: wrap;
}
.finance-bar {
  display: grid;
  grid-template-columns: minmax(90px, 1fr) minmax(40px, 2fr) auto;
  align-items: center;
  gap: 12px;
  margin: 14px 0;
}
.finance-bar meter {
  width: 100%;
  height: 18px;
  accent-color: #006f68;
}
.finance-calendar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}
#finance-dialog {
  border: 1px solid #ccd7e2;
  border-radius: 20px;
  width: min(760px, calc(100vw - 24px));
  max-height: calc(100dvh - 32px);
  padding: 24px;
  box-sizing: border-box;
  color: #102a43;
  background: #f3f6fa;
  overflow: auto;
  overscroll-behavior: contain;
}
#finance-dialog::backdrop {
  background: #102a43bb;
}
.dialog-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.dialog-heading h2 {
  font-size: 1.4rem;
}
.wide {
  grid-column: 1/-1;
}
.business-options {
  display: contents;
}
.business-options[hidden] {
  display: none;
}
#dialog-error {
  color: #9b2434;
  overflow-wrap: anywhere;
}
#finance-dialog input,
#finance-dialog select {
  min-height: 44px;
  width: 100%;
  box-sizing: border-box;
}
#finance-dialog summary {
  padding: 12px;
  cursor: pointer;
}
#finance-dialog details > label {
  margin-bottom: 12px;
}
.finance-record button {
  min-height: 44px;
}
#content[aria-busy="true"] {
  opacity: 0.65;
}
body:has(dialog[open]) {
  overflow: hidden;
}
@media (max-width: 600px) {
  #finance-dialog {
    padding: 16px;
    margin-top: max(12px, env(safe-area-inset-top));
    max-height: calc(
      100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px
    );
  }
  .finance-search {
    flex-wrap: wrap;
  }
  .finance-bar {
    grid-template-columns: 1fr auto;
  }
  .finance-bar meter {
    grid-column: 1/-1;
    grid-row: 2;
  }
  .finance-menu button {
    flex: 1 0 100px;
  }
  .finance-record > div:first-child {
    min-width: 0;
    flex-basis: 100%;
  }
  .finance-record .actions {
    gap: 6px;
  }
  .finance-record .actions button {
    padding: 10px;
    font-size: 0.9rem;
  }
}

[hidden] { display:none !important; }
.finance-mode-note {flex-basis:100%; margin:0; color:#34485b;}
.finance-scope-bottom {margin:24px 0; padding:18px; border:1px solid #ccd7e2; border-radius:14px;}
.finance-scope-bottom button {margin:4px; min-height:44px;}
.finance-tools [aria-pressed="true"], .finance-scope-bottom [aria-pressed="true"] {background:#183e50; color:white;}

.card button {margin-top:12px; min-height:44px;}
.finance-bar span {min-width:0;}
.finance-bar button {max-width:100%; white-space:normal; overflow-wrap:anywhere;}
#finance-dialog dd {margin:0 0 12px; overflow-wrap:anywhere;}
#finance-dialog dt {font-weight:700;}