/* Presentation foundation and cascade overrides. */
@layer foundation, overrides;
@layer foundation {
  :root {
    --accent: #191918;
    --accent-soft: #32312f;
    --amber: #a98216;
    --bg: #efeee9;
    --blue-mute: #71849a;
    --border: #d5d2c9;
    --brick: #a46554;
    --brick-focus: #96503f;
    --card: #f8f7f2;
    --danger: #b63f34;
    --dim: #85827a;
    --dim-soft: #aaa69d;
    --font-button: "din-2014","DIN 2014","Liberation Sans Narrow","Arial Narrow",sans-serif;
    --font-display: "proxima-nova-extra-wide","Arial Black",sans-serif;
    --font-label: "din-2014","DIN 2014","Liberation Sans Narrow","Arial Narrow",sans-serif;
    --table-min-width: 0px;
    --summary-utility-locked-height: 30px;
    --font-num: "nitti",ui-monospace,"SFMono-Regular",Consolas,monospace;
    --font-title: "din-2014","DIN 2014","Liberation Sans Narrow","Arial Narrow",sans-serif;
    --font-ui: "din-2014","DIN 2014","Liberation Sans Narrow","Arial Narrow",sans-serif;
    --gap: 7px;
    --green: #347054;
    --line: #dedbd3;
    --muted: #686761;
    --muted-bg: #e9e7e0;
    --orange: #d35d25;
    --panel: #f8f7f2;
    --radius: 6px;
    --red: #b63f34;
    --text: #191918;
    --surface: var(--card);
    --surface-muted: var(--muted-bg);
    --text-muted: var(--muted);
    --accent-warm: var(--orange);
    --success: var(--green);
    --warning: var(--amber);
    --radius-sm: 4px;
    --radius-md: 6px;
  }
  [data-theme="dark"] {
    --accent: #f1eee7;
    --accent-soft: #d7d2c8;
    --amber: #d0a93e;
    --bg: #121210;
    --blue-mute: #96aac2;
    --border: #34312b;
    --brick: #a8604d;
    --brick-focus: #c07660;
    --card: #1a1916;
    --danger: #d65e53;
    --dim: #817c73;
    --dim-soft: #5f5a52;
    --green: #57a07d;
    --line: #3a3731;
    --muted: #9a958c;
    --muted-bg: #211f1b;
    --orange: #e1783a;
    --panel: #1a1916;
    --red: #d65e53;
    --text: #f1eee7;
  }
  * {
    box-sizing: border-box;
  }
  html,body {
    margin: 0;
    padding: 0;
  }
  body {
    -webkit-text-size-adjust: 100%;
    background: var(--bg);
    font-synthesis: none;
    color: var(--text);
    -webkit-font-smoothing: antialiased;
    transition: background-color 0.15s ease,color 0.15s ease;
  }
  .card,.panel,.btn,.row input,.row select,.field input,#baseCurrencySelect {
    transition: background-color 0.15s ease,color 0.15s ease,border-color 0.15s ease;
  }
  h1,h2,h3 {
    margin: 0;
    font-weight: 600;
  }
  h1 {
    font-family: var(--font-display);
    font-weight: 900;
    font-size: clamp(18px,3.2vw,26px);
    line-height: 0.95;
    letter-spacing: -0.8px;
    text-transform: uppercase;
  }
  h2 {
    font-family: var(--font-title);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--muted);
  }
  h3 {
    font-family: var(--font-label);
    text-transform: uppercase;
    letter-spacing: 0.08em;
  }
  .muted {
    color: var(--muted);
    font-family: var(--font-num);
    font-size: 10px;
  }
  #lockScreen {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    padding-top: calc(48px+env(safe-area-inset-top,0px));
    background: var(--bg);
  }
  #lockScreen.hidden {
    display: none;
  }
  .lock-card {
    width: 100%;
    max-width: 420px;
    text-align: center;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
  }
  .lock-display {
    font-family: var(--font-display);
    font-weight: 900;
    font-size: clamp(28px,7vw,44px);
    line-height: 0.92;
    letter-spacing: -1.5px;
    color: var(--text);
    margin-bottom: 8px;
    text-transform: uppercase;
  }
  .lock-title {
    font-family: var(--font-num);
    font-size: 11px;
    font-weight: 400;
    color: var(--muted);
    letter-spacing: 3px;
    text-transform: lowercase;
    margin-bottom: 18px;
  }
  .lock-sub {
    font-family: var(--font-num);
    font-size: 9px;
    color: var(--dim-soft);
    letter-spacing: 1.5px;
    margin-bottom: 28px;
    text-transform: uppercase;
  }
  .lock-input {
    width: 100%;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    font-family: var(--font-num);
    font-size: 13px;
    background: var(--bg);
    color: var(--text);
    outline: none;
    text-align: center;
    letter-spacing: 4px;
    margin-bottom: 12px;
    transition: border-color 0.15s ease;
  }
  .lock-btn {
    width: 100%;
    padding: 13px;
    border: none;
    border-radius: var(--radius);
    font-family: var(--font-button);
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: opacity 0.15s ease;
    letter-spacing: 0.5px;
    text-transform: uppercase;
  }
  .lock-btn.primary {
    background: var(--text);
    color: var(--card);
  }
  .lock-error {
    min-height: 16px;
    margin-top: 8px;
    font-family: var(--font-num);
    font-size: 11px;
    color: var(--danger);
  }
  [data-theme="dark"] .lock-input,[data-theme="dark"] input,[data-theme="dark"] select {
    color-scheme: dark;
  }
  .topbar {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .brand-block {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
  }
  .brand-block h1 {
    font-size: clamp(22px,5.5vw,32px);
    line-height: 0.95;
    letter-spacing: -1px;
  }
  .header-eyebrow {
    margin-bottom: 6px;
    font-family: var(--font-num);
    font-size: 10px;
    color: var(--dim);
    letter-spacing: 3px;
    text-transform: lowercase;
  }
  .header-sub {
    display: flex;
    align-items: center;
    min-width: 0;
    max-width: 100%;
    font-family: var(--font-num);
    font-size: 9px;
    color: var(--dim-soft);
    letter-spacing: 1px;
    text-transform: uppercase;
  }
  .topbar-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
  }
  .theme-toggle {
    position: fixed;
    top: calc(env(safe-area-inset-top,0px)+12px);
    right: max(12px,env(safe-area-inset-right));
    width: 32px;
    height: 32px;
    min-width: 32px;
    min-height: 32px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--card);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 50%;
    cursor: pointer;
    z-index: 1000;
    font-family: var(--font-ui);
    font-size: 13px;
    line-height: 1;
    appearance: none;
    -webkit-appearance: none;
  }
  .calendar-toggle {
    right: calc(max(12px,env(safe-area-inset-right))+40px);
  }
  .calendar-menu-wrap {
    position: relative;
    z-index: 1002;
  }
  .calendar-menu {
    position: fixed;
    top: calc(env(safe-area-inset-top,0px)+52px);
    right: max(12px,env(safe-area-inset-right));
    width: min(280px,calc(100vw - 24px));
    color: var(--text);
    border-radius: var(--radius-md);
    box-shadow: 0 12px 32px rgba(0,0,0,.14);
    z-index: 1003;
  }
  .calendar-menu-action {
    width: 100%;
    min-height: 38px;
    padding: 9px 12px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--muted-bg);
    color: var(--text);
    font: inherit;
    font-size: 12px;
    cursor: pointer;
  }
  .calendar-menu-option {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 12px 3px 7px;
    font-size: 12px;
    cursor: pointer;
  }
  .calendar-menu-option input {
    width: 16px;
    height: 16px;
    margin: 0;
  }
  .calendar-menu-note {
    padding: 0 3px 2px 28px;
    color: var(--muted);
    font-size: 10px;
    line-height: 1.35;
  }
  .conn-indicator {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 0;
    padding: 3px 8px;
    border: 0;
    border-radius: var(--radius-sm);
    background: var(--muted-bg);
    font-family: var(--font-num);
    font-size: 8px;
    font-weight: 400;
    color: var(--muted);
    letter-spacing: 1px;
    line-height: 1.35;
    text-transform: uppercase;
    text-align: left;
    cursor: pointer;
    transition: opacity 0.15s ease;
    flex: 0 1 auto;
    max-width: min(calc(100% - 64px),390px);
  }
  .conn-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .conn-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--dim);
    flex: 0 0 auto;
  }
  .conn-indicator.online .conn-dot,.conn-indicator.success .conn-dot {
    background: var(--green);
  }
  .conn-indicator.online .conn-text,.conn-indicator.success .conn-text {
    color: var(--green);
  }
  .conn-indicator.syncing .conn-dot {
    background: var(--orange);
    animation: connPulse 1s infinite;
  }
  .conn-indicator.syncing .conn-text {
    color: var(--orange);
  }
  .conn-indicator.offline .conn-dot,.conn-indicator.error .conn-dot {
    background: var(--red);
  }
  .conn-indicator.offline .conn-text,.conn-indicator.error .conn-text {
    color: var(--red);
  }
  @keyframes connPulse {
    0%,100% {
      opacity: 1;
    }
    50% {
      opacity: 0.4;
    }
  }
  .btn {
    font-family: var(--font-button);
    font-weight: 700;
    letter-spacing: 0.5px;
    background: var(--text);
    color: var(--card);
    border: 1px solid var(--text);
    cursor: pointer;
    transition: opacity 0.15s ease;
  }
  .btn-ghost {
    color: var(--text);
    border: 1px solid var(--border);
  }
  .btn-small {
    padding: 4px 10px;
    font-size: 11px;
  }
  .add-row {
    margin-top: 12px;
  }
  .card,.panel {
    background: var(--card);
    border: 1px solid var(--border);
  }
  .card-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
  }
  .summary-card {
    display: flex;
    flex-direction: column;
  }
  .summary-top {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid var(--border);
  }
  .summary-title-stack {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
  }
  .period-label {
    font-family: var(--font-num);
    font-size: 13px;
    color: var(--dim);
    text-transform: capitalize;
    font-variant-numeric: tabular-nums;
  }
  .summary-actions {
    justify-content: flex-end;
  }
  .period-controls {
    border: 1px solid var(--border);
  }
  .period-controls .btn-small {
    width: 28px;
    height: 28px;
    padding: 0;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    line-height: 1;
  }
  .period-controls input[type="month"] {
    width: 128px;
    font-family: var(--font-num);
    font-size: 12px;
    border: none;
    border-radius: 999px;
    background: transparent;
    color: var(--text);
    padding: 5px 6px;
  }
  .summary-pdf-btn {
    border-radius: 999px;
    min-height: 36px;
    padding-inline: 14px;
    white-space: nowrap;
  }
  .summary-side {
    min-width: 0;
    min-height: 0;
  }
  .summary-block,.summary-options {
    min-width: 0;
  }
  .summary-block-primary {
    border-color: var(--border);
    box-shadow: none;
    display: flex;
    flex-direction: column;
    min-height: 0;
  }
  .summary-block-primary #monthlyTotals {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-right: 4px;
    scrollbar-width: thin;
  }
  .summary-block-debt-total {
    border-color: var(--border);
    box-shadow: none;
  }
  .summary-block-debt-total .totals-row {
    font-size: 13px;
  }
  .summary-block-secondary {
    padding: 10px 12px;
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
  }
  .summary-block-secondary .totals-list {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-right: 4px;
    scrollbar-width: thin;
  }
  .summary-block-toggle {
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    text-align: left;
  }
  .summary-collapse-mark {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-num);
  }
  .summary-block-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
  }
  .summary-block-head h3 {
    margin: 0 0 3px;
    color: var(--text);
  }
  .summary-block-head span {
    display: block;
    font-family: var(--font-num);
    font-size: 9px;
    line-height: 1.35;
    color: var(--dim);
  }
  .totals-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .totals-row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-family: var(--font-num);
    font-size: 13px;
    font-weight: 400;
    font-variant-numeric: tabular-nums;
  }
  .summary-block-secondary .totals-row {
    font-size: 12px;
  }
  .totals-row .cur {
    color: var(--muted);
  }
  .combined-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
  }
  .combined-value {
    font-family: var(--font-num);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }
  .rate-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 8px;
    border-top: 1px solid var(--border);
  }
  .summary-converted-inline {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    align-items: end;
    gap: 8px 16px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
    flex: 0 0 auto;
  }
  .summary-converted-inline .summary-block-head {
    margin-bottom: 0;
  }
  .summary-converted-controls {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 7px;
    min-width: 0;
  }
  .summary-converted-inline .combined-row {
    justify-content: flex-end;
    margin-bottom: 0;
  }
  .summary-converted-inline .combined-value {
    font-size: 16px;
  }
  .table {
    display: flex;
    flex-direction: column;
  }
  @media (min-width: 761px) {
    #sabitTable .table-head,#sabitTable .row {
      min-width: 840px;
    }
    #krediKartiTable .table-head,#krediKartiTable .row {
      min-width: 980px;
    }
    #krediTable .table-head,#krediTable .row {
      min-width: 980px;
    }
    #borcTable .table-head,#borcTable .row {
      min-width: 1000px;
    }
  }
  .table-head {
    display: grid;
    border-bottom: 1px solid var(--border);
  }
  #sabitTable .table-head,#sabitTable .row {
    grid-template-columns: 1.8fr 0.8fr 1fr 1.1fr 0.9fr 1.6fr;
  }
  #krediKartiTable .table-head,#krediKartiTable .row {
    grid-template-columns: 1.25fr 0.6fr 0.95fr 0.95fr 0.75fr 0.95fr 1.35fr;
  }
  #krediTable .table-head,#krediTable .row {
    grid-template-columns: 1.3fr 0.6fr 0.85fr 0.6fr 0.9fr 0.95fr 0.85fr 1.2fr;
  }
  #borcTable .table-head,#borcTable .row {
    grid-template-columns: 1.3fr 0.7fr 0.9fr 0.9fr 0.6fr 1fr 0.9fr 1.4fr;
  }
  .row {
    display: grid;
    align-items: center;
    border-bottom: 1px solid var(--border);
    position: relative;
  }
  .row:last-child {
    border-bottom: none;
  }
  .cell {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .cell-label {
    display: none;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--muted);
  }
  .row input,.row select {
    width: 100%;
    min-width: 0;
    border: none;
    border-bottom: 1px solid transparent;
    color: var(--text);
    border-radius: 0;
  }
  .row input[type="number"] {
    font-family: var(--font-num);
  }
  .row input[type="date"] {
    font-family: var(--font-num);
    font-size: 12px;
  }
  [data-theme="dark"] input[type="date"],[data-theme="dark"] input[type="month"] {
    color-scheme: dark;
  }
  .row input[type="checkbox"] {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    accent-color: var(--text);
  }
  .row input::placeholder {
    color: var(--muted);
  }
  .row input[type="number"]::-webkit-outer-spin-button,.row input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  .row input[type="number"] {
    -moz-appearance: textfield;
  }
  .name-field-wrap {
    position: relative;
    display: flex;
    align-items: center;
    min-width: 0;
  }
  .name-field-wrap>input {
    width: 100%;
  }
  .row-menu-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: transparent;
    color: var(--muted);
    line-height: 1;
    cursor: pointer;
  }
  .row-menu-btn:hover,.row-menu-open .row-menu-btn {
    color: var(--text);
    background: var(--bg);
  }
  .row-menu-popover {
    display: none;
    z-index: 30;
    top: calc(100% + 4px);
    min-width: 118px;
    padding: 4px;
    border: 1px solid var(--border);
    background: var(--panel);
    box-shadow: 0 10px 28px rgba(0,0,0,.16);
  }
  .row-menu-open .row-menu-popover {
    display: block;
  }
  .row-menu-popover .del-btn {
    width: 100%;
    border: none;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--danger);
    text-align: left;
    font: inherit;
    padding: 7px 9px;
    cursor: pointer;
  }
  .footer {
    text-align: center;
    font-size: 11px;
    font-family: var(--font-num);
    color: var(--muted);
  }
  @media (max-width: 760px) {
    .period-controls {
      width: 100%;
    }
    .summary-block-primary {
      grid-column: auto;
    }
    .summary-block {
      padding-bottom: 12px;
      border-bottom: 1px solid var(--border);
    }
    .summary-block:last-child {
      border-bottom: none;
      padding-bottom: 0;
    }
    .row {
      grid-template-columns: 1fr 1fr;
      gap: 4px 8px;
    }
  }
  .card-head {
    gap: 10px;
  }
  .column-toggle {
    margin-left: auto;
    white-space: nowrap;
  }
  .column-sheet-backdrop {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(0,0,0,0.28);
  }
  .head-cell {
    position: relative;
    min-width: 0;
    padding-right: 26px;
    user-select: none;
    overflow: visible;
    cursor: pointer;
  }
  .sort-indicator {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-family: var(--font-num);
    font-size: 9px;
    color: var(--dim-soft);
    opacity: 0.6;
  }
  .head-cell.sorted .sort-indicator {
    color: var(--text);
    opacity: 1;
  }
  .head-label {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .resize-handle {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 18px;
    height: calc(100% + 16px);
    cursor: col-resize;
    touch-action: none;
  }
  .resize-handle::after {
    content: "";
    position: absolute;
    top: 6px;
    bottom: 6px;
    right: 8px;
    width: 1px;
    background: var(--border);
  }
  @media (min-width: 761px) {
    #sabitTable .table-head,#sabitTable .row,#krediKartiTable .table-head,#krediKartiTable .row,#krediTable .table-head,#krediTable .row,#borcTable .table-head,#borcTable .row {
      min-width: var(--table-min-width);
    }
  }
  @media (max-width: 760px) {
    .table-head,.row {
      min-width: var(--table-min-width);
    }
    .column-sheet-backdrop {
      align-items: flex-end;
      padding: 10px;
    }
  }
  .period-eyebrow,.field label,.cell-label,.table-head,.column-sheet-kicker {
    font-family: var(--font-label);
    font-weight: 600;
  }
  .period-label,.totals-row,.combined-value,.readonly-field,.sync-status,.footer,.row input[type="number"],.row input[type="date"],.period-controls input[type="month"],#baseCurrencySelect {
    font-family: var(--font-num);
    font-variant-numeric: tabular-nums;
  }
  .row input,.row select,.field input,select {
    border-radius: var(--radius);
  }
  .card,.panel,.btn,.row input,.row select,.field input,#baseCurrencySelect,.lock-card,.lock-input {
    border-color: var(--border);
  }
  [data-theme="dark"] .btn {
    color: #0E0D0B;
  }
  [data-theme="dark"] .btn-ghost {
    color: var(--text);
    background: transparent;
  }
  @media (max-width: 900px) {
    .summary-side {
      display: grid;
      grid-template-columns: 1fr 1fr;
      min-height: 0;
    }
  }
  @media (max-width: 760px) {
    .summary-top {
      flex-direction: column;
    }
    .summary-actions {
      align-items: center;
    }
    .period-controls {
      flex: 1;
      min-width: 0;
    }
    .period-controls input[type="month"] {
      flex: 1;
      width: auto;
      min-width: 0;
    }
    .summary-block-secondary {
      flex: 0 0 auto;
    }
    .summary-converted-inline {
      align-items: stretch;
      grid-template-columns: 1fr;
    }
    .summary-converted-controls {
      align-items: stretch;
    }
    .summary-converted-inline .combined-row,.summary-converted-inline .rate-info {
      justify-content: space-between;
      text-align: left;
    }
    .summary-block-primary .totals-row {
      font-size: 18px;
    }
    .summary-block {
      padding: 12px;
    }
  }
  @media (max-width: 760px) {
    .summary-actions .period-controls {
      width: auto;
    }
    .summary-card .summary-block:last-child {
      padding-bottom: 12px;
    }
  }
  body {
    padding: 0 16px 40px;
    padding-bottom: max(40px,env(safe-area-inset-bottom));
    overflow-x: hidden;
  }
  .topbar,.card,.panel,.footer {
    width: 100%;
    min-width: 0;
  }
  .table-wide {
    width: 100%;
    max-width: 100%;
  }
  @media (max-width: 760px) {
    body {
      padding-left: 16px;
      padding-right: 16px;
    }
    .app {
      padding-left: 0;
      padding-right: 0;
    }
    .topbar {
      align-items: flex-start;
      gap: 10px;
    }
    .brand-block {
      min-width: 0;
      flex: 1 1 auto;
    }
    .topbar-actions {
      flex: 0 0 auto;
      gap: 6px;
    }
    .table-wide {
      overflow: visible;
    }
    .add-row {
      width: 100%;
      min-width: 0;
    }
  }
  @media (max-width: 760px) {
    .row input[type="date"] {
      justify-content: flex-start;
      text-align: left;
    }
  }
  .card,.panel {
    overflow: hidden;
  }
  .table-wide {
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
  }
  .summary-converted-prominent {
    margin-top: 0;
    margin-bottom: 12px;
    padding-top: 0;
    padding-bottom: 12px;
    border-top: none;
    border-bottom: 1px solid var(--border);
  }
  .summary-converted-prominent .summary-block-head h3,.summary-debt-converted .summary-block-head h3 {
    letter-spacing: 0.12em;
  }
  .summary-converted-prominent .combined-value {
    font-weight: 700;
    letter-spacing: -0.04em;
  }
  .summary-monthly-head {
    margin-bottom: 8px;
  }
  .summary-debt-converted {
    margin: 2px 0 10px;
  }
  .summary-debt-converted .combined-row {
    margin-bottom: 0;
  }
  .summary-debt-converted .combined-value {
    font-size: clamp(16px,2vw,20px);
    font-weight: 700;
    letter-spacing: -0.03em;
  }
  @media (max-width: 760px) {
    .summary-converted-prominent {
      grid-template-columns: 1fr;
      align-items: stretch;
    }
    .summary-converted-prominent .summary-converted-controls {
      align-items: stretch;
    }
    .summary-converted-prominent .combined-row,.summary-converted-prominent .rate-info {
      justify-content: space-between;
      text-align: left;
    }
  }
  .summary-side,.summary-block-secondary {
    min-height: 0;
    overflow: hidden;
  }
  .summary-block-secondary.is-open {
    overflow: hidden;
  }
  .summary-block-secondary .summary-collapsible-body {
    min-height: 0;
  }
  .summary-block-secondary .totals-list,.summary-block-debt-total #allDebtTotals {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-right: 6px;
  }
  .summary-debt-converted {
    flex: 0 0 auto;
    margin-bottom: 10px;
    padding-bottom: 10px;
  }
  .summary-collapse-mark {
    border-radius: 999px;
    border: 1px solid var(--text);
    line-height: 1;
    box-shadow: 0 0 0 3px color-mix(in srgb,var(--text) 10%,transparent);
  }
  .summary-block-primary .summary-block-toggle {
    width: 100%;
  }
  .summary-monthly-head {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--border);
  }
  .list-card-head {
    justify-content: space-between;
  }
  .list-card-toggle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    border: 0;
    color: inherit;
    cursor: pointer;
    text-align: left;
  }
  .list-card-toggle .summary-collapse-mark {
    width: 28px;
    height: 28px;
    font-size: 17px;
    font-weight: 700;
  }
  .list-card .column-toggle {
    margin-left: auto;
  }
  .summary-block-toggle .summary-collapse-mark {
    font-weight: 700;
  }
  @media (max-width: 760px) {
    .list-card-head {
      align-items: center;
    }
    .list-card-toggle {
      flex: 1 1 auto;
    }
    .list-card .column-toggle {
      flex: 0 0 auto;
    }
  }
  .summary-block-toggle,.list-card-toggle {
    border-radius: var(--radius-md);
  }
  .summary-block-toggle {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
  }
  .summary-collapse-mark {
    width: 30px;
    height: 30px;
    border-color: var(--text);
    background: var(--text);
    color: var(--card);
    font-size: 18px;
    font-weight: 700;
  }
  [data-theme="dark"] .summary-collapse-mark {
    color: #0E0D0B;
  }
  .summary-debt-converted {
    padding: 10px 0 12px;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
  }
  .summary-block-debt-total {
    overflow: hidden;
  }
  .list-card-toggle {
    min-height: 42px;
    padding: 8px 10px;
    border-color: var(--border);
    background: var(--bg);
    justify-content: space-between;
  }
  .list-card .column-toggle {
    flex: 0 0 auto;
  }
  @media (max-width: 760px) {
    .summary-debt-converted {
      grid-template-columns: 1fr;
      align-items: stretch;
    }
    .summary-block-toggle,.list-card-toggle {
      padding: 9px 10px;
      border-color: var(--border);
      background: var(--bg);
    }
    .summary-collapse-mark {
      width: 32px;
      height: 32px;
    }
  }
  .summary-title-month-only {
    justify-content: center;
    min-height: 48px;
  }
  .period-label-main {
    line-height: 1;
    text-transform: capitalize;
  }
  @media (max-width: 760px) {
    .summary-title-month-only {
      min-height: 0;
    }
  }
  .summary-section-toggle {
    height: 38px;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
  }
  .summary-block-debt-total #allDebtTotals {
    scrollbar-width: thin;
  }
  @media (max-width: 760px) {
    .summary-section-toggle {
      width: 36px;
      height: 36px;
      min-width: 36px;
    }
  }
  .date-field-wrap {
    align-items: center;
  }
  .date-clear {
    padding: 0;
    border: 1px solid var(--border);
    background: var(--bg);
    color: var(--dim);
    font-family: var(--font-num);
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  @media (min-width: 761px) {
    #krediKartiTable .table-head,#krediKartiTable .row,#krediTable .table-head,#krediTable .row {
      min-width: var(--table-min-width);
    }
  }
  .hazal-section {
    margin: 14px 0 10px;
  }
  [data-theme="dark"] .hazal-section {
    --hazal-ink: #F2EAE2;
    --hazal-muted: #B8A89D;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.06),inset 4px 0 0 var(--hazal-accent);
  }
  .hazal-section-head {
    justify-content: space-between;
  }
  .hazal-section-toggle {
    appearance: none;
    border: 0;
    background: transparent;
    color: var(--hazal-ink);
    padding: 0;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    cursor: pointer;
    text-align: left;
  }
  .hazal-title {
    font-family: var(--font-title);
    color: var(--hazal-ink);
  }
  .hazal-collapse-mark {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: color-mix(in srgb,var(--hazal-accent) 18%,transparent);
    color: var(--hazal-accent-strong);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-num);
    font-size: 14px;
    flex: 0 0 auto;
  }
  .hazal-switch {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: var(--font-label);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--hazal-ink);
    white-space: nowrap;
    cursor: pointer;
  }
  .hazal-switch input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
  }
  .hazal-switch-track {
    width: 42px;
    height: 24px;
    border-radius: 999px;
    background: color-mix(in srgb,var(--hazal-muted) 28%,transparent);
    position: relative;
    transition: background 0.18s ease,box-shadow 0.18s ease;
    box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--hazal-muted) 26%,transparent);
  }
  .hazal-switch-thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    background: var(--bg);
    transition: transform 0.18s ease;
    box-shadow: 0 1px 4px rgba(0,0,0,0.18);
  }
  .hazal-list-card {
    margin: 8px 0 0;
    background: color-mix(in srgb,var(--card) 72%,var(--hazal-bg-soft) 28%);
    border-color: color-mix(in srgb,var(--hazal-accent) 20%,var(--border) 80%);
  }
  .hazal-list-card .list-card-body {
    display: block;
  }
  @media (max-width: 760px) {
    .hazal-section-head {
      align-items: flex-start;
      flex-direction: column;
    }
    .hazal-switch {
      justify-content: flex-start;
    }
    .hazal-title {
      font-size: 24px;
    }
  }
  .summary-main-column {
    min-width: 0;
  }
  .summary-block-projection {
    border-color: color-mix(in srgb,var(--text) 28%,var(--border));
  }
  .projection-bars {
    display: flex;
    flex-direction: column;
  }
  .projection-row {
    display: grid;
    grid-template-columns: 58px minmax(0,1fr) minmax(96px,auto);
    grid-template-areas: "month track amount" ". original original";
    align-items: center;
    font-family: var(--font-num);
  }
  .projection-month {
    grid-area: month;
    color: var(--muted);
    font-size: 10px;
    white-space: nowrap;
  }
  .projection-track {
    grid-area: track;
    overflow: hidden;
    background: color-mix(in srgb,var(--border) 70%,transparent);
  }
  .projection-bar-fill {
    display: block;
    height: 100%;
    background: var(--text);
  }
  .projection-amount {
    grid-area: amount;
    text-align: right;
    font-weight: 700;
    font-size: 11px;
    color: var(--text);
    white-space: nowrap;
  }
  .projection-original {
    grid-area: original;
    font-size: 9px;
    line-height: 1.25;
    color: var(--dim);
    text-align: right;
  }
  @media (max-width: 760px) {
    .projection-row {
      grid-template-columns: 52px minmax(0,1fr);
      grid-template-areas: "month amount" "track track" "original original";
    }
    .projection-amount,.projection-original {
      text-align: left;
    }
  }
  .hazal-section.is-not-included .hazal-section-body {
    filter: saturate(.72) contrast(.98);
  }
  .date-clear {
    opacity: .72;
  }
  @media (max-width: 760px) and (orientation: portrait) {
    body {
      padding-left: 10px;
      padding-right: 10px;
    }
  }
  .topbar .theme-toggle {
    position: static;
    top: auto;
    right: auto;
    z-index: auto;
    flex: 0 0 32px;
  }
  #lockThemeToggle {
    position: absolute;
    top: max(12px,env(safe-area-inset-top));
    right: max(14px,env(safe-area-inset-right));
    z-index: 2;
  }
  @media (max-width: 760px) and (orientation: portrait) {
    body::before {
      position: fixed;
      inset: 0;
      z-index: 999999;
      align-items: center;
      justify-content: center;
      padding: 28px;
      background: var(--bg);
      color: var(--text);
      font-family: var(--font-display);
      font-weight: 900;
      font-size: clamp(28px,10vw,48px);
      line-height: .92;
      letter-spacing: -1px;
      text-align: center;
      text-transform: uppercase;
    }
    body::after {
      position: fixed;
      left: 24px;
      right: 24px;
      bottom: calc(28px+env(safe-area-inset-bottom,0px));
      z-index: 1000000;
      color: var(--muted);
      font-family: var(--font-num);
      font-size: 11px;
      line-height: 1.35;
      text-align: center;
    }
  }
  @media (max-width: 900px) {
    .summary-block-primary {
      order: 1;
    }
    .summary-block-debt-total {
      order: 2;
    }
    .summary-block-projection {
      order: 3;
    }
  }
  .head-label,.row input,.row select,.row .readonly-field {
    text-overflow: ellipsis;
  }
  .forecast-payment-box {
    margin: 0 0 8px;
    padding: 0;
    border: 0;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .due-tracker-box {
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: color-mix(in srgb,var(--card) 86%,var(--muted-bg) 14%);
    padding: 12px;
    margin: 12px 0 16px;
  }
  .due-tracker-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
  }
  .due-tracker-head h3 {
    margin: 0 0 3px;
    font-family: var(--font-label);
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }
  .due-tracker-head span,.due-tracker-switch {
    color: var(--muted);
    font-size: 10px;
    line-height: 1.3;
  }
  .due-tracker-switch {
    display: flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
    cursor: pointer;
    user-select: none;
  }
  .due-tracker-switch input {
    width: 13px;
    height: 13px;
    margin: 0;
    accent-color: var(--text);
  }
  .due-tracker-chips {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 8px;
  }
  .due-tracker-chip {
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: var(--panel);
    padding: 9px 9px 8px;
    display: grid;
    gap: 4px;
  }
  .due-tracker-chip span {
    font-family: var(--font-label);
    font-size: 8px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--muted);
  }
  .due-tracker-chip strong {
    font-family: var(--font-num);
    font-size: 20px;
    line-height: 1;
    color: var(--text);
  }
  .due-tracker-chip em,.due-tracker-chip small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-style: normal;
    font-family: var(--font-num);
    font-size: 9px;
    color: var(--dim);
  }
  .due-tracker-chip-overdue {
    border-color: color-mix(in srgb,var(--red) 42%,var(--line) 58%);
    background: color-mix(in srgb,var(--red) 8%,var(--panel) 92%);
  }
  .due-tracker-chip-today {
    border-color: color-mix(in srgb,var(--text) 22%,var(--line) 78%);
  }
  @media (max-width: 760px) {
    .due-tracker-chips {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
  }
  @media (max-width: 520px) {
    .due-tracker-head {
      flex-direction: column;
    }
    .due-tracker-switch {
      width: 100%;
      justify-content: flex-start;
      white-space: normal;
    }
    .due-tracker-chips {
      grid-template-columns: 1fr;
    }
  }
  .due-tracker-chip {
    position: relative;
    cursor: default;
  }
  .due-tracker-popup {
    position: absolute;
    left: 0;
    top: calc(100% + 8px);
    width: min(380px,calc(100vw - 32px));
    max-height: 320px;
    overflow: auto;
    padding: 9px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--card);
    box-shadow: 0 14px 38px rgba(31,31,29,0.18);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    pointer-events: none;
    transition: opacity 120ms ease,transform 120ms ease,visibility 120ms ease;
    z-index: 80;
  }
  .due-tracker-chip:nth-child(4n) .due-tracker-popup,.due-tracker-chip:nth-child(4n - 1) .due-tracker-popup {
    left: auto;
    right: 0;
  }
  .due-tracker-popup-main,.due-tracker-popup-main b,.due-tracker-popup-main small,.due-tracker-popup li>strong,.due-tracker-popup-head span,.due-tracker-popup-empty {
    text-transform: none;
    letter-spacing: normal;
  }
  .due-tracker-popup-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 7px;
    padding-bottom: 7px;
    border-bottom: 1px solid var(--line);
  }
  .due-tracker-popup-head strong {
    font-family: var(--font-label);
    font-size: 9px;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }
  .due-tracker-popup-head span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: var(--font-num);
    font-size: 9px;
    color: var(--muted);
  }
  .due-tracker-popup-empty {
    padding: 6px 0 2px;
    font-size: 10px;
    color: var(--muted);
  }
  [data-theme="dark"] .due-tracker-popup {
    box-shadow: 0 16px 42px rgba(0,0,0,0.42);
  }
  .due-tracker-chip.is-open .due-tracker-popup {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }
  .due-tracker-chip.is-open.due-tracker-chip-overdue .due-tracker-popup {
    background: color-mix(in srgb,var(--red) 7%,var(--card));
  }
  .due-tracker-chip.is-open.due-tracker-chip-today .due-tracker-popup {
    background: color-mix(in srgb,var(--warning) 7%,var(--card));
  }
  .due-tracker-chip.is-open.due-tracker-chip-week .due-tracker-popup {
    background: color-mix(in srgb,#C59D57 7%,var(--card));
  }
  .due-tracker-chip.is-open.due-tracker-chip-month .due-tracker-popup {
    background: color-mix(in srgb,var(--muted) 5%,var(--card));
  }
  @media (max-width: 760px) {
    .due-tracker-chip:nth-child(4n) .due-tracker-popup,.due-tracker-chip:nth-child(4n - 1) .due-tracker-popup {
      left: 0;
      right: auto;
    }
    .due-tracker-chip:nth-child(even) .due-tracker-popup {
      left: auto;
      right: 0;
    }
  }
  @media (max-width: 520px) {
    .due-tracker-popup,.due-tracker-chip:nth-child(even) .due-tracker-popup {
      left: 0;
      right: auto;
      width: 100%;
    }
  }
  .money-input-wrap {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    align-items: center;
    gap: 5px;
    width: 100%;
  }
  .money-currency-select {
    min-width: 0;
    width: 42px;
    text-align: center;
    font-weight: 700;
  }
  .money-input-wrap input {
    min-width: 0;
    width: 100%;
  }
  .cell {
    min-width: 0;
  }
  @media (max-width: 720px) {
    .money-input-wrap {
      grid-template-columns: 40px minmax(0,1fr);
    }
    .money-currency-select {
      width: 40px;
    }
  }
  .calendar-menu-section-title {
    padding: 8px 10px 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--muted);
  }
  .calendar-paid-range {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 6px;
    padding: 4px 3px 8px 28px;
  }
  .calendar-menu-suboption {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 32px;
    padding: 6px 8px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--muted-bg);
    font-size: 11px;
    cursor: pointer;
  }
  .calendar-menu-suboption input {
    width: 14px;
    height: 14px;
    margin: 0;
  }
  .combined-total-stack {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    min-width: 0;
  }
  .combined-alternates {
    line-height: 1.15;
    font-weight: 400;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }
  .summary-converted-prominent .combined-total-stack,.summary-debt-converted .combined-total-stack {
    width: 100%;
  }
  @media (max-width: 760px) {
    .summary-converted-prominent .combined-total-stack,.summary-debt-converted .combined-total-stack {
      align-items: flex-start;
    }
  }
  body {
    font-family: var(--font-ui);
    line-height: 1.44;
    letter-spacing: -0.01em;
  }
  h2,h3,.summary-title-stack h2,.list-card-title,.field label,.table-head,.cell-label,.summary-checkbox-head,.header-eyebrow,.summary-eyebrow,.period-label {
    font-family: var(--font-label);
    text-transform: none;
    letter-spacing: 0;
  }
  h2,.summary-title-stack h2,.list-card-title {
    font-family: var(--font-title);
    font-size: 15px;
    font-weight: 600;
    color: var(--text);
  }
  h3 {
    font-size: 12px;
    font-weight: 600;
    color: var(--muted);
    margin-bottom: 6px;
  }
  .header-eyebrow,.summary-eyebrow,.period-label,.muted,.footer,.summary-block-head span,.rate-info,.rate-meta,.lock-title,.lock-sub,.header-sub span {
    font-family: var(--font-ui);
    font-size: 11px;
    color: var(--muted);
    letter-spacing: 0;
  }
  .topbar {
    align-items: flex-start;
  }
  .brand-block {
    gap: 2px;
  }
  .brand-block h1 {
    margin-bottom: 2px;
  }
  .header-sub {
    gap: 8px;
  }
  .topbar-actions {
    gap: 8px;
  }
  .card,.panel,.lock-card,.summary-block,.summary-options,.list-card,.hazal-list-card,.column-sheet,.pdf-modal,#calendarMenuPanel,#settingsPanel,.row-menu-popover,.calendar-menu {
    border-radius: var(--radius-md);
  }
  .summary-block,.summary-options,.lock-card,.column-sheet,.pdf-modal,#calendarMenuPanel,#settingsPanel,.row-menu-popover,.calendar-menu {
    box-shadow: 0 1px 2px rgba(17,16,14,0.025),0 12px 26px rgba(17,16,14,0.035);
  }
  [data-theme="dark"] .card,[data-theme="dark"] .panel,[data-theme="dark"] .summary-block,[data-theme="dark"] .summary-options,[data-theme="dark"] .lock-card,[data-theme="dark"] .column-sheet,[data-theme="dark"] .pdf-modal,[data-theme="dark"] #calendarMenuPanel,[data-theme="dark"] #settingsPanel,[data-theme="dark"] .row-menu-popover,[data-theme="dark"] .calendar-menu {
    box-shadow: none;
  }
  .lock-card {
    padding: 40px 32px 32px;
  }
  .lock-input,.field input,.field select,.lock-btn,#baseCurrencySelect,.period-controls input[type="month"],#forecastPaymentInput,#forecastPaymentCurrency {
    font-family: var(--font-ui);
  }
  .lock-input,.field input,.field select,#baseCurrencySelect,.period-controls input[type="month"],#forecastPaymentInput,#forecastPaymentCurrency {
    border-radius: var(--radius-md);
    background: color-mix(in srgb,var(--card) 86%,var(--bg) 14%);
    border: 1px solid var(--border);
  }
  .lock-input,.field input,#baseCurrencySelect {
    padding: 11px 12px;
  }
  .btn,.lock-btn {
    font-family: var(--font-button);
    letter-spacing: 0;
    text-transform: none;
  }
  .period-controls {
    background: color-mix(in srgb,var(--card) 88%,var(--bg) 12%);
  }
  .summary-top {
    align-items: flex-start;
  }
  .summary-title-month-only {
    min-width: 0;
  }
  .period-label-main {
    font-family: var(--font-title);
    color: var(--text);
    letter-spacing: -0.03em;
  }
  .summary-grid {
    align-items: start;
  }
  .summary-block-head h3,.summary-monthly-head h3 {
    font-weight: 600;
    color: var(--text);
  }
  .summary-collapse-mark,.list-card-toggle .summary-collapse-mark,.list-card-collapse-btn .summary-collapse-mark,.summary-section-toggle .summary-collapse-mark {
    border: 1px solid var(--border);
  }
  .summary-block-primary .totals-row {
    font-weight: 600;
    line-height: 1.08;
    letter-spacing: -0.03em;
    padding-bottom: 4px;
  }
  .summary-block-secondary .totals-row,.summary-block-debt-total .totals-row {
    font-size: 13px;
  }
  .combined-value {
    line-height: 1.04;
    letter-spacing: -0.03em;
    color: var(--text);
  }
  .combined-alternates {
    font-family: var(--font-ui);
    color: var(--muted);
    letter-spacing: -0.01em;
  }
  #rateInfo {
    font-family: var(--font-ui);
    font-size: 11px;
    color: var(--muted);
  }
  .summary-converted-inline,.summary-converted-prominent,.summary-debt-converted {
    background: transparent;
    border: none;
    padding: 0;
  }
  .summary-monthly-detail {
    border-top: 1px solid var(--line);
  }
  .list-card {
    overflow: hidden;
  }
  .list-card-toggle,.list-card-collapse-btn,.summary-block-toggle,.summary-section-toggle {
    border-radius: var(--radius-md);
  }
  .table-head {
    font-weight: 600;
    color: var(--muted);
  }
  .table-wide {
    border-radius: var(--radius-md);
    background: transparent;
  }
  .row input,.row select {
    font-family: var(--font-ui);
    border-bottom-color: transparent;
    background: transparent;
  }
  .row input[type="number"],.row input[type="date"],.readonly-field,.combined-value,#monthlySelectionTotal {
    font-variant-numeric: tabular-nums;
  }
  .name-field-wrap>input {
    padding-right: 30px;
  }
  .row-menu-btn {
    right: 0;
    font-size: 16px;
    opacity: 0.7;
  }
  .row-menu-btn:hover,.row-menu-open .row-menu-btn {
    opacity: 1;
  }
  .row-menu-popover .del-btn {
    font-size: 13px;
  }
  .calendar-menu {
    padding: 12px;
    border: 1px solid var(--border);
    background: color-mix(in srgb,var(--card) 95%,var(--bg) 5%);
  }
  .calendar-menu-action,.calendar-menu-option,.calendar-menu-suboption {
    border-radius: var(--radius-md);
  }
  input::placeholder,textarea::placeholder {
    color: var(--dim-soft);
  }
  @media (max-width: 980px) {
    .summary-grid {
      grid-template-columns: 1fr;
    }
    .summary-side,.summary-block-primary {
      min-height: 0;
    }
  }
  @media (max-width: 760px) {
    .summary-top {
      gap: 10px;
    }
    .btn {
      font-size: 14px;
    }
  }
  .summary-card {
    gap: 10px;
  }
  .summary-actions {
    gap: 6px;
  }
  .btn {
    padding: 7px 11px;
    border-radius: var(--radius-md);
    font-size: 12px;
  }
  .due-tracker-body {
    padding-left: 12px;
    padding-right: 12px;
    padding-bottom: 10px;
  }
  .summary-main-column,.summary-side {
    gap: 10px;
  }
  .summary-block-head h3,.summary-monthly-head h3 {
    font-size: 12px;
  }
  .combined-total-stack {
    gap: 3px;
  }
  .rate-info {
    margin-top: 5px;
    gap: 7px;
  }
  .total-items,.totals-list {
    gap: 4px;
  }
  .list-card {
    border-radius: var(--radius-md);
  }
  .table-head {
    gap: 8px;
  }
  .calendar-menu,.row-menu-popover,#settingsPanel,.column-sheet,.pdf-modal {
    border-radius: var(--radius-md);
    box-shadow: 0 1px 2px rgba(17,16,14,.02),0 8px 18px rgba(17,16,14,.03);
  }
  .footer {
    padding: 14px 0 26px;
  }
  @media (max-width: 980px) {
    .summary-side,.summary-block-primary {
      height: auto;
    }
  }
  @media (max-width: 760px) {
    .card,.panel {
      margin-bottom: 7px;
      border-radius: var(--radius-md);
    }
    .topbar {
      padding-bottom: 10px;
    }
    .summary-block,.summary-options {
      padding: 10px;
      border-radius: var(--radius-md);
    }
    .combined-alternates {
      font-size: 12px;
    }
    .row input,.row select,.field input,#baseCurrencySelect {
      font-size: 16px;
    }
  }
  .topbar {
    gap: 10px;
  }
  .summary-top {
    gap: 10px;
  }
  .summary-block-primary .totals-row {
    font-size: clamp(18px,2vw,25px);
  }
  .btn,.lock-btn {
    font-size: 12.5px;
  }
  .period-controls {
    padding: 3px;
    border-radius: var(--radius-md);
  }
  .period-controls .btn-small,.summary-pdf-btn,#refreshRatesBtn,#monthlySelectionClear,#forecastPaymentClear {
    min-height: 30px;
  }
  @media (max-width: 760px) {
    .summary-grid,.summary-card,.summary-main-column,.summary-side {
      gap: 10px;
    }
  }
  .card,.panel {
    padding: 12px;
    border-radius: var(--radius-md);
  }
  .lock-card,.summary-block,.summary-options,.list-card,.hazal-list-card,.column-sheet,.pdf-modal,#calendarMenuPanel,#settingsPanel,.row-menu-popover,.calendar-menu,.due-tracker-box {
    border-radius: var(--radius-md);
    box-shadow: none;
  }
  .theme-toggle,.calendar-toggle {
    width: 34px;
    height: 34px;
    border-radius: var(--radius-md);
    background: transparent;
    border-color: var(--border);
  }
  .period-controls {
    border-radius: var(--radius-md);
    background: transparent;
  }
  .btn,.lock-btn {
    border-radius: var(--radius-md);
    padding: 7px 11px;
    font-weight: 600;
  }
  .btn-ghost {
    background: transparent;
  }
  .summary-card,.summary-grid,.summary-main-column,.summary-side {
    gap: 9px;
  }
  .summary-top {
    padding-bottom: 8px;
    border-bottom-color: var(--line);
  }
  .period-label-main {
    font-size: 24px;
    font-weight: 600;
  }
  .summary-side,.summary-block-primary {
    height: 370px;
  }
  .summary-block,.summary-options {
    border-color: var(--border);
  }
  .summary-block-head {
    margin-bottom: 8px;
  }
  .summary-block-head h3,.summary-monthly-head h3,.list-card-title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.055em;
  }
  .summary-collapse-mark,.list-card-toggle .summary-collapse-mark,.list-card-collapse-btn .summary-collapse-mark,.summary-section-toggle .summary-collapse-mark {
    width: 21px;
    height: 21px;
    background: transparent;
  }
  .combined-value {
    font-size: clamp(20px,2.2vw,28px);
    font-weight: 600;
  }
  .combined-alternates {
    font-size: 12px;
  }
  #rateInfo,.summary-block-head span,.period-label,.muted {
    font-size: 10px;
  }
  .summary-monthly-detail {
    margin-top: 10px;
    padding-top: 10px;
  }
  .due-tracker-box {
    border-color: var(--border);
  }
  .list-card-head {
    padding-bottom: 6px;
    border-bottom-color: var(--line);
  }
  .table-head {
    padding: 0 6px 8px;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.055em;
  }
  .row {
    border-bottom-color: var(--line);
  }
  .row input,.row select {
    font-size: 13px;
    padding: 5px 0;
  }
  .row-menu-btn {
    width: 21px;
    height: 21px;
    border-radius: var(--radius-md);
  }
  .row-menu-popover {
    border-radius: var(--radius-md);
  }
  .calendar-menu,#settingsPanel,.column-sheet,.pdf-modal {
    background: var(--card);
    border-color: var(--border);
  }
  @media (max-width: 1020px) {
    .app {
      width: calc(100% - 28px);
    }
  }
  @media (max-width: 760px) {
    .card,.panel {
      padding: 10px;
    }
    .summary-card,.summary-grid,.summary-main-column,.summary-side {
      gap: 8px;
    }
    .period-label-main {
      font-size: 21px;
    }
    .summary-block,.summary-options,.due-tracker-box {
      padding: 9px;
    }
    .combined-value {
      font-size: 24px;
    }
    .row {
      padding: 9px 5px 7px;
    }
  }
  .projection-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
  }
  .projection-range-control {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    color: var(--muted);
  }
  .projection-range-control select {
    appearance: none;
    -webkit-appearance: none;
    border: 1px solid var(--border);
    background: transparent;
    color: var(--text);
    border-radius: var(--radius-md);
    padding: 5px 24px 5px 8px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.1;
    background-image: linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);
    background-position: calc(100% - 13px) calc(50% - 1px),calc(100% - 9px) calc(50% - 1px);
    background-size: 4px 4px,4px 4px;
    background-repeat: no-repeat;
  }
  @media (max-width: 760px) {
    .projection-head {
      align-items: stretch;
      gap: 8px;
    }
    .projection-range-control {
      align-self: flex-start;
      font-size: 9px;
    }
    .projection-range-control select {
      font-size: 10px;
      padding: 4px 22px 4px 7px;
    }
  }
  .app {
    margin: 0 auto;
  }
  .summary-card {
    background: var(--card);
    border: 1px solid var(--border);
  }
  .summary-block,.summary-options {
    background: transparent;
    border: 0;
    border-radius: 0;
  }
  .summary-block+.summary-block,.summary-side .summary-block+.summary-block {
    border-top: 1px solid var(--line);
  }
  .summary-main-column {
    border-right: 1px solid var(--line);
  }
  .summary-side {
    gap: 0;
  }
  .due-tracker-box {
    background: var(--muted-bg);
    border: 0;
    border-radius: var(--radius-md);
  }
  .due-tracker-toggle {
    padding: 8px 10px;
  }
  .list-card,.hazal-list-card {
    background: transparent;
    border: 0;
    border-top: 1px solid var(--border);
    border-radius: 0;
    box-shadow: none;
    padding: 10px 0 0;
  }
  .list-card-head {
    border-bottom: 0;
    margin-bottom: 0;
  }
  .list-card-body {
    padding-top: 0;
  }
  .table-head {
    border-bottom-color: var(--line);
  }
  .row {
    padding-top: 9px;
    padding-bottom: 7px;
  }
  .card-head,.summary-block-head {
    margin-bottom: 7px;
  }
  .btn,.lock-btn,.theme-toggle,.calendar-toggle,.period-controls,.projection-range-control select {
    border-radius: var(--radius-md);
  }
  .summary-block-projection {
    background: transparent;
    border: 0;
    border-top: 1px solid var(--line);
    padding-top: 10px;
  }
  .projection-chart-wrap {
    height: 190px;
    min-height: 190px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 5px;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--border) transparent;
  }
  .projection-bars {
    gap: 6px;
  }
  .projection-row {
    gap: 3px 7px;
  }
  .projection-track {
    height: 7px;
    border-radius: var(--radius-sm);
  }
  .projection-bar-fill {
    border-radius: var(--radius-sm);
  }
  .projection-range-control {
    text-transform: none;
    letter-spacing: 0;
    font-size: 9px;
  }
  .projection-range-control>span {
    display: none;
  }
  .projection-range-control select {
    padding-top: 4px;
    padding-bottom: 4px;
    background-color: transparent;
  }
  @media (max-width: 980px) {
    .summary-main-column {
      padding-right: 0;
      border-right: 0;
    }
  }
  @media (max-width: 760px) {
    .app {
      max-width: 1100px;
    }
    .projection-chart-wrap {
      height: 220px;
      min-height: 220px;
    }
  }
  .projection-chart-wrap[data-months="6"] {
    height: auto;
    min-height: 0;
    overflow-y: visible;
    padding-right: 0;
    scrollbar-width: none;
  }
  .row-menu-popover {
    position: fixed;
    right: auto;
    bottom: auto;
    max-width: calc(100vw - 16px);
  }
  @media (max-width: 760px) {
    .projection-chart-wrap[data-months="6"] {
      height: auto;
      min-height: 0;
      overflow-y: visible;
    }
  }
  .app {
    width: calc(100% - 28px);
    max-width: 1100px;
    padding: 12px 0 24px;
  }
  .topbar {
    padding: 4px 0 11px;
  }
  .card,.panel {
    margin-bottom: 8px;
    box-shadow: none;
  }
  .summary-card {
    padding: 12px;
    border-radius: var(--radius-md);
  }
  .summary-grid {
    gap: 14px;
  }
  .summary-main-column {
    padding-right: 14px;
  }
  .summary-block,.summary-options {
    padding: 9px 0;
  }
  .summary-block-head,.card-head {
    margin-bottom: 7px;
  }
  .list-card,.hazal-list-card {
    margin-bottom: 7px;
    padding-top: 9px;
  }
  .list-card-head {
    padding: 0 2px 6px;
  }
  .row {
    gap: 7px;
    padding: 9px 6px 7px;
  }
  .row input,.row select {
    min-height: 27px;
  }
  .btn,.lock-btn,.theme-toggle,.calendar-toggle {
    border-radius: var(--radius-md);
  }
  .summary-collapse-mark,.list-card-toggle .summary-collapse-mark,.list-card-collapse-btn .summary-collapse-mark,.summary-section-toggle .summary-collapse-mark {
    border-radius: var(--radius-sm);
  }
  .header-sub .conn-indicator {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 0;
    padding: 3px 8px;
    border: 0;
    border-radius: var(--radius-sm);
    background: #ebe5da;
    color: #757068;
    font-family: "nitti",ui-monospace,"SF Mono",monospace;
    font-size: 8px;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 1.35;
    text-transform: uppercase;
    box-shadow: none;
  }
  .header-sub .conn-text {
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
  }
  .header-sub .conn-dot {
    width: 6px;
    height: 6px;
  }
  .header-sub .conn-indicator.online .conn-dot,.header-sub .conn-indicator.success .conn-dot {
    background: #2a7a45;
  }
  .header-sub .conn-indicator.online .conn-text,.header-sub .conn-indicator.success .conn-text {
    color: #2a7a45;
  }
  .header-sub .conn-indicator.syncing .conn-dot {
    background: #c46a06;
  }
  .header-sub .conn-indicator.syncing .conn-text {
    color: #c46a06;
  }
  .header-sub .conn-indicator.offline .conn-dot,.header-sub .conn-indicator.error .conn-dot {
    background: #c42e2e;
  }
  .header-sub .conn-indicator.offline .conn-text,.header-sub .conn-indicator.error .conn-text {
    color: #c42e2e;
  }
  [data-theme="dark"] .header-sub .conn-indicator {
    background: #1a1813;
    color: #6f6a60;
  }
  [data-theme="dark"] .header-sub .conn-indicator.offline .conn-dot,[data-theme="dark"] .header-sub .conn-indicator.error .conn-dot {
    background: #d63030;
  }
  [data-theme="dark"] .header-sub .conn-indicator.offline .conn-text,[data-theme="dark"] .header-sub .conn-indicator.error .conn-text {
    color: #d63030;
  }
  .summary-actions .period-controls input[type="month"]::-webkit-calendar-picker-indicator {
    width: 13px;
    height: 13px;
    margin: 0;
    padding: 0;
    opacity: 0.42;
    cursor: pointer;
  }
  @media (max-width: 760px) {
    .app {
      width: calc(100% - 20px);
      padding: 8px 0 18px;
    }
    .summary-card {
      padding: 10px;
    }
  }
  .auth-screen {
    padding: 24px;
    padding-top: calc(48px+env(safe-area-inset-top,0px));
    background: var(--bg);
  }
  .auth-card {
    width: 100%;
    max-width: 420px;
    padding: 36px 30px 28px;
    text-align: center;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    box-shadow: none;
  }
  .auth-display {
    margin-bottom: 8px;
    color: var(--text);
    font-family: var(--font-display);
    font-size: clamp(28px,7vw,44px);
    font-weight: 900;
    line-height: 0.92;
    letter-spacing: -1.5px;
    text-transform: uppercase;
  }
  .auth-title {
    margin-bottom: 18px;
    color: var(--dim);
    font-family: var(--font-num);
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 3px;
    text-transform: lowercase;
  }
  .auth-version {
    margin-bottom: 28px;
    color: var(--dim-soft);
    font-family: var(--font-num);
    font-size: 9px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
  }
  .auth-input {
    width: 100%;
    min-height: 34px;
    margin-bottom: 12px;
    padding: 8px 6px;
    border: 0;
    border-bottom: 1px solid var(--brick);
    border-radius: 0;
    outline: none;
    background: transparent;
    color: var(--text);
    font-family: var(--font-num);
    font-size: 13px;
    letter-spacing: 4px;
    text-align: center;
    box-shadow: none;
    transition: border-bottom-color .16s ease;
  }
  .auth-input:focus,
  .auth-input:focus-visible {
    border-bottom-color: var(--brick-focus);
  }
  .auth-btn {
    width: 100%;
    min-height: 34px;
    padding: 8px 12px;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    font-family: var(--font-ui);
    font-size: 11px;
    font-weight: 600;
    text-transform: none;
  }
  .auth-btn.primary {
    background: var(--text);
    color: var(--surface);
  }
  .auth-error {
    min-height: 16px;
    margin-top: 8px;
    color: var(--danger);
    font-family: var(--font-num);
    font-size: 11px;
  }
  .app-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 12px;
    margin-bottom: 12px;
    padding: 6px 0 0;
    text-align: left;
  }
  .app-header-copy {
    min-width: 0;
  }
  .app-header-title {
    margin-bottom: 4px;
    color: var(--text);
    font-family: var(--font-display);
    font-size: clamp(22px,5.5vw,32px);
    font-weight: 900;
    line-height: 0.95;
    letter-spacing: -1px;
    text-transform: uppercase;
  }
  .app-header-eyebrow {
    margin-bottom: 6px;
    color: var(--dim);
    font-family: var(--font-num);
    font-size: 10px;
    letter-spacing: 3px;
    text-transform: lowercase;
  }
  .app-header-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    color: var(--dim-soft);
    font-family: var(--font-num);
    font-size: 9px;
    letter-spacing: 1px;
    text-transform: uppercase;
  }
  .app-header-meta .app-version {
    flex: 0 0 auto;
    color: var(--dim-soft);
    font: inherit;
    letter-spacing: inherit;
    white-space: nowrap;
  }
  .app-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 8px;
    flex: 0 0 auto;
  }
  .app-header .header-tool,#lockThemeToggle.header-tool {
    position: static;
    width: 32px;
    height: 32px;
    min-width: 32px;
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--text);
    font-family: var(--font-ui);
    font-size: 13px;
    line-height: 1;
    box-shadow: none;
  }
  .app-header-meta .sync-status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    min-height: 0;
    max-width: min(100%,360px);
    padding: 3px 8px;
    border: 0;
    border-radius: var(--radius-sm);
    background: var(--surface-muted);
    box-shadow: none;
    color: var(--text-muted);
    font-family: var(--font-num);
    font-size: 8px;
    font-weight: 400;
    line-height: 1.35;
    letter-spacing: 1px;
    text-transform: uppercase;
    white-space: nowrap;
    cursor: pointer;
    user-select: none;
  }
  .app-header-meta .sync-status-text {
    min-width: 0;
    overflow: hidden;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-overflow: ellipsis;
    text-transform: inherit;
    white-space: nowrap;
  }
  .app-header-meta .sync-status-dot {
    width: 6px;
    height: 6px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--dim);
  }
  .sync-status.is-online,.sync-status.is-success {
    color: var(--success);
  }
  .sync-status.is-online .sync-status-dot,.sync-status.is-success .sync-status-dot {
    background: var(--success);
  }
  .sync-status.is-syncing {
    color: var(--accent-warm);
  }
  .sync-status.is-syncing .sync-status-dot {
    background: var(--accent-warm);
    animation: connPulse 1s infinite;
  }
  .sync-status.is-offline,.sync-status.is-error {
    color: var(--danger);
  }
  .sync-status.is-offline .sync-status-dot,.sync-status.is-error .sync-status-dot {
    background: var(--danger);
  }
  [data-theme="dark"] .app-header-meta .sync-status {
    background: var(--surface-muted);
  }
  @media (max-width: 600px) {
    .app-header-title {
      font-size: clamp(20px,5.5vw,28px);
    }
    .app-header {
      gap: 10px;
    }
    .app-header-meta {
      gap: 8px;
    }
    .app-header-meta .sync-status {
      max-width: min(56vw,260px);
      padding: 3px 7px;
      font-size: 7px;
      letter-spacing: 0.8px;
    }
  }
  .summary-grid {
    display: grid;
    grid-auto-rows: auto;
    align-items: stretch;
    gap: 10px 14px;
  }
  .summary-main-column,.summary-side {
    display: contents;
  }
  .summary-block-primary {
    grid-column: 1;
    grid-row: 1;
  }
  .summary-block-debt-total {
    grid-column: 2;
    grid-row: 1;
  }
  .summary-block-projection {
    grid-column: 1;
    grid-row: 2;
  }
  .summary-block-primary,.summary-block-debt-total {
    min-height: 0;
    align-self: stretch;
  }
  .summary-block-debt-total .summary-collapsible-body,.summary-block-primary .summary-collapsible-body {
    min-height: 0;
  }
  .summary-collapsed-overview {
    display: none;
    align-items: baseline;
    gap: 9px;
    min-width: 0;
    padding: 7px 9px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: transparent;
  }
  .summary-card:not(.is-open) .summary-collapsed-overview {
    display: flex;
  }
  .summary-collapsed-label {
    flex: 0 0 auto;
    color: var(--muted);
    font-family: var(--font-ui);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .055em;
    text-transform: uppercase;
  }
  .summary-collapsed-total {
    min-width: 0;
    color: var(--text);
    font-family: var(--font-num);
    font-size: 16px;
    font-weight: 400;
    font-variant-numeric: tabular-nums;
    line-height: 1.15;
  }
  .summary-collapsed-alternates {
    min-width: 0;
    overflow: hidden;
    color: var(--muted);
    font-family: var(--font-num);
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .table-wide {
    width: 100%;
    max-width: 100%;
    overflow-y: visible;
    scrollbar-width: thin;
    scrollbar-color: var(--border) transparent;
  }
  .table-head {
    align-items: end;
  }
  .row {
    align-items: center;
  }
  .row .cell {
    min-width: 0;
  }
  .row .cell-number input,.row .cell-computed .readonly-field,.row .cell-amount input,.row .cell-buAyOdenecek input,.row .cell-ekstreTutari input,.row .cell-asgariOdemeTutari input,.row .cell-asgariOrani input,.row .cell-kalanTaksit input {
    text-align: right;
    font-variant-numeric: tabular-nums;
  }
  .row .cell-date input,.row .cell-vadeTarihi input {
    font-variant-numeric: tabular-nums;
  }
  .money-input-wrap {
    min-width: 0;
  }
  @media (max-width: 980px) and (min-width: 761px) {
    .summary-grid {
      gap: 10px;
    }
  }
  @media (max-width: 760px) {
    .summary-block-primary,.summary-block-debt-total,.summary-block-projection,.summary-side>[data-summary-collapse="futureBorc"],.summary-side>[data-summary-collapse="remaining"] {
      grid-column: 1;
    }
    .summary-block-primary {
      grid-row: 1;
    }
    .summary-block-debt-total {
      grid-row: 2;
    }
    .summary-block-projection {
      grid-row: 3;
    }
    .summary-block-primary,.summary-block-debt-total {
      width: 100%;
    }
    .summary-top {
      display: grid;
      grid-template-columns: minmax(0,1fr) auto;
    }
    .summary-actions {
      max-width: 100%;
      flex-wrap: wrap;
    }
    .summary-collapsed-overview {
      display: none;
      flex-wrap: wrap;
      gap: 3px 8px;
    }
    .summary-card:not(.is-open) .summary-collapsed-overview {
      display: flex;
    }
    .summary-collapsed-label {
      width: 100%;
    }
    .summary-collapsed-total {
      font-size: 15px;
    }
    .table-body {
      flex-direction: column;
      gap: 7px;
    }
    #sabitTable .row,#krediKartiTable .row,#krediTable .row,#borcTable .row,#hazalSabitTable .row,#hazalKrediKartiTable .row,#hazalKrediTable .row,.table-body .row {
      position: relative;
    }
    .money-input-wrap {
      align-items: end;
    }
    .money-input-wrap .money-currency-select {
      text-align: center;
      text-align-last: center;
    }
    .date-clear {
      align-self: center;
    }
  }
  .summary-block-primary,.summary-block-debt-total {
    align-self: stretch;
  }
  .summary-block-primary .monthly-total-toggle,.summary-block-debt-total>.summary-block-head {
    box-sizing: border-box;
    min-height: 28px;
    align-items: center;
  }
  .summary-block-primary .combined-row,.summary-block-debt-total .combined-row {
    display: flex;
    align-items: flex-start;
    min-height: 44px;
  }
  .summary-block-primary .combined-total-stack,.summary-block-debt-total .combined-total-stack {
    justify-content: flex-start;
    min-height: 44px;
  }
  .summary-block-primary .combined-value,.summary-block-debt-total .combined-value {
    line-height: 1.05;
  }
  .summary-block-primary .combined-total-stack,.summary-block-debt-total .combined-total-stack {
    width: 100%;
    text-align: left;
  }
  @media (max-width: 760px) {
    .summary-block-primary .monthly-total-toggle,.summary-block-debt-total>.summary-block-head {
      min-height: 26px;
    }
  }
  .app {
    width: calc(100% - 28px);
    max-width: 1100px;
    margin-inline: auto;
  }
  .period-label-main {
    display: block;
    color: var(--text);
    font-family: var(--font-title);
    font-size: clamp(28px,3vw,34px);
    font-weight: 700;
    line-height: .98;
    letter-spacing: -.035em;
    text-transform: none;
  }
  .summary-title-month-only {
    min-width: 190px;
    padding-top: 2px;
  }
  @media (max-width: 760px) {
    .app {
      width: calc(100% - 16px);
      max-width: 1100px;
      padding-top: 7px;
    }
    .summary-card {
      padding: 10px;
    }
    .summary-top {
      display: grid;
      grid-template-columns: minmax(0,1fr) auto;
      align-items: start;
      gap: 7px 8px;
      padding-bottom: 9px;
    }
    .summary-title-month-only {
      min-width: 0;
      padding-top: 1px;
    }
    .period-label-main {
      font-size: clamp(26px,8.4vw,31px);
      line-height: 1;
    }
    .summary-actions {
      grid-column: 1 / -1;
      display: flex;
      align-items: center;
      gap: 6px;
    }
    .summary-actions .period-controls {
      flex: 0 1 auto;
      min-width: 0;
    }
    .summary-actions .period-controls input[type="month"] {
      width: 116px;
      min-width: 0;
    }
    .summary-pdf-btn {
      padding-inline: 7px;
      white-space: nowrap;
    }
    .summary-section-toggle {
      flex: 0 0 auto;
    }
    .due-tracker-head {
      gap: 8px;
    }
    .due-tracker-switch {
      font-size: 9px;
      line-height: 1.2;
    }
    .summary-block-primary .combined-value,.summary-block-debt-total .combined-value {
      font-size: clamp(22px,7vw,27px);
    }
    .summary-monthly-detail {
      margin-top: 8px;
      padding-top: 8px;
    }
    .list-card,.hazal-list-card {
      padding: 8px 9px;
    }
    .add-row {
      min-height: 32px;
    }
  }
  @media (max-width: 420px) {
    .summary-actions {
      display: grid;
      grid-template-columns: minmax(0,1fr) auto auto;
    }
    .summary-actions .period-controls {
      width: 100%;
    }
  }
  .summary-utility-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    margin: 0 0 6px;
  }
  .summary-utility-row>.forecast-payment-box {
    flex: 0 1 300px;
    width: min(100%,300px);
    max-width: 300px;
    margin: 0;
  }
  .summary-rate-tool {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    min-height: 28px;
    margin: 0 0 0 auto;
    padding: 2px 0;
    border: 0;
    background: transparent;
    white-space: nowrap;
  }
  .summary-rate-tool #rateInfo {
    max-width: 290px;
    overflow: hidden;
    color: var(--muted);
    font-size: 9px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .summary-rate-tool #refreshRatesBtn {
    min-height: 24px;
    padding: 2px 6px;
    border: 0;
    color: var(--muted);
    font-size: 9px;
    background: transparent;
  }
  .summary-block-primary .summary-converted-prominent {
    display: grid;
    grid-template-rows: 32px auto;
    align-content: start;
  }
  .summary-block-debt-total {
    display: grid;
    grid-template-rows: 32px auto minmax(0,1fr);
    align-content: start;
  }
  .summary-block-primary .monthly-total-toggle,.summary-block-debt-total>.summary-block-head {
    width: 100%;
    height: 32px;
    min-height: 32px;
    align-items: center;
  }
  .summary-block-primary .monthly-total-toggle h3,.summary-block-debt-total>.summary-block-head h3 {
    margin: 0;
    line-height: 1.15;
  }
  .summary-block-primary .summary-converted-controls,.summary-block-debt-total .summary-debt-converted {
    box-sizing: border-box;
    min-height: 56px;
  }
  .summary-block-primary .combined-row,.summary-block-debt-total .combined-row {
    min-height: 49px;
    align-items: flex-start;
  }
  .summary-block-primary .combined-total-stack,.summary-block-debt-total .combined-total-stack {
    min-height: 49px;
    padding: 0;
    justify-content: flex-start;
  }
  @media (max-width: 760px) {
    .summary-utility-row {
      align-items: center;
      gap: 8px;
    }
    .summary-utility-row>.forecast-payment-box {
      flex-basis: min(300px,62%);
    }
    .summary-rate-tool {
      min-width: 0;
      gap: 4px;
    }
    .summary-rate-tool #rateInfo {
      max-width: 30vw;
      font-size: 8px;
    }
    .summary-rate-tool #refreshRatesBtn {
      padding-inline: 4px;
      font-size: 8px;
    }
    .summary-block-primary .summary-converted-prominent,.summary-block-debt-total {
      grid-template-rows: 30px auto;
    }
    .summary-block-debt-total {
      grid-template-rows: 30px auto minmax(0,1fr);
    }
    .summary-block-primary .monthly-total-toggle,.summary-block-debt-total>.summary-block-head {
      height: 30px;
      min-height: 30px;
    }
    .summary-block-primary .summary-converted-controls,.summary-block-debt-total .summary-debt-converted {
      min-height: 52px;
    }
  }
  @media (max-width: 520px) {
    .summary-utility-row {
      display: grid;
      grid-template-columns: minmax(0,1fr) auto;
      align-items: start;
    }
    .summary-utility-row>.forecast-payment-box {
      width: 100%;
      max-width: none;
    }
    .summary-rate-tool {
      align-self: start;
      min-height: 28px;
    }
    .summary-rate-tool #rateInfo {
      display: none;
    }
  }
  .summary-card:not(.is-open) .summary-utility-row {
    height: var(--summary-utility-locked-height,30px);
    min-height: var(--summary-utility-locked-height,30px);
  }
  .row .cell-dynamicAmount,.table-head .head-cell[data-column-key="dynamicAmount"] {
    text-align: center;
  }
  .row .cell-dynamicAmount input[type="checkbox"] {
    margin-inline: auto;
    accent-color: var(--orange);
  }
  .projection-chart-wrap[data-months="6"],.projection-chart-wrap[data-months="12"],.projection-chart-wrap[data-months="24"] {
    width: 100%;
    height: 190px;
    min-height: 190px;
    padding-right: 5px;
    scrollbar-gutter: stable;
  }
  .projection-chart-wrap[data-months="6"] {
    overflow-y: hidden;
  }
  .projection-chart-wrap .projection-bars {
    width: 100%;
    min-width: 0;
  }
  @media (max-width: 760px) {
    .projection-chart-wrap[data-months="6"],.projection-chart-wrap[data-months="12"],.projection-chart-wrap[data-months="24"] {
      height: 220px;
      min-height: 220px;
    }
  }
  .summary-utility-row {
    flex-wrap: wrap;
  }
  .summary-utility-row>.forecast-payment-box {
    flex: 0 1 300px;
    width: min(100%,300px);
    max-width: 300px;
  }
  .summary-utility-row>.forecast-borrowing-box {
    flex-basis: 300px;
  }
  @media (max-width: 920px) {
    .summary-utility-row>.forecast-payment-box,.summary-utility-row>.forecast-borrowing-box {
      flex: 1 1 280px;
      width: auto;
      max-width: none;
    }
    .summary-rate-tool {
      flex: 0 0 100%;
    }
  }
  @media (max-width: 600px) {
    .summary-utility-row {
      display: grid;
      grid-template-columns: 1fr;
    }
    .summary-utility-row>.forecast-payment-box,.summary-utility-row>.forecast-borrowing-box {
      width: 100%;
      max-width: none;
    }
    .summary-rate-tool {
      justify-self: end;
    }
  }
  .summary-utility-row {
    display: grid;
    grid-template-columns: minmax(0,278px) minmax(0,278px) minmax(0,1fr);
    align-items: start;
    gap: 8px;
    width: 100%;
  }
  .summary-utility-row>.forecast-payment-box,.summary-utility-row>.forecast-borrowing-box {
    width: 100%;
    min-width: 0;
    max-width: none;
    margin: 0;
    flex: none;
  }
  @media (max-width: 900px) {
    .summary-utility-row {
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
  }
  @media (max-width: 620px) {
    .summary-utility-row {
      grid-template-columns: minmax(0,1fr);
    }
  }
  .summary-rate-tool {
    min-height: 20px;
    padding-block: 0;
    line-height: 1.05;
  }
  .summary-rate-tool #rateInfo {
    line-height: 1.05;
  }
  .summary-rate-tool #refreshRatesBtn {
    min-height: 20px;
    padding-block: 0;
  }
  .summary-simulation-impact {
    display: grid;
    gap: 3px;
    width: 100%;
    margin-top: 5px;
    padding-top: 5px;
    border-top: 1px solid var(--line);
  }
  .summary-simulation-impact[hidden] {
    display: none;
  }
  .projection-head-tools {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    flex: 0 0 auto;
  }
  .projection-simulation-badge {
    padding: 3px 5px;
    border: 1px solid var(--orange);
    border-radius: var(--radius-sm);
    color: var(--orange);
    font-family: var(--font-num);
    font-size: 6.8px;
    font-weight: 400;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
  }
  .projection-simulation-badge[hidden] {
    display: none;
  }
  @media (max-width: 760px) {
    .projection-head-tools {
      align-items: flex-start;
      gap: 5px;
    }
    .projection-simulation-badge {
      max-width: 118px;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
  .summary-simulation-impact {
    gap: 0;
    margin-top: 5px;
    padding-top: 5px;
  }
  .summary-card {
    gap: 5px;
  }
  .summary-utility-row {
    margin-bottom: 0;
  }
  .summary-rate-tool {
    margin-bottom: 0;
    padding-block: 0;
  }
  .due-tracker-box {
    margin-block: 0;
  }
  .summary-grid {
    margin-top: 0;
  }
  @media (max-width: 760px) {
    .summary-card {
      gap: 4px;
    }
  }
  .summary-utility-row {
    align-items: stretch;
  }
  .summary-utility-row>.forecast-payment-box,.summary-utility-row>.forecast-borrowing-box {
    display: flex;
    flex-direction: column;
    align-self: stretch;
    border: 1px solid var(--border);
    border-radius: var(--radius-md,6px);
    background: transparent;
    box-shadow: none;
  }
  .simulation-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 32px;
    padding: 6px 9px;
    border: 1px solid color-mix(in srgb,var(--warning) 45%,var(--border));
    border-radius: var(--radius-md,6px);
    background: color-mix(in srgb,var(--warning) 6%,var(--surface));
    color: var(--text);
  }
  .simulation-banner[hidden] {
    display: none;
  }
  @keyframes simulationPulse {
    0%,100% {
      opacity: 1;
    }
    50% {
      opacity: .45;
    }
  }
  #monthlySummaryBlock,#allDebtSummaryBlock,#projectionSummaryBlock {
    position: relative;
    transition: background-color .15s ease,border-color .15s ease;
  }
  @media (max-width: 760px) {
    .simulation-banner {
      align-items: flex-start;
      gap: 8px;
      padding: 7px 8px;
    }
  }
  .simulation-banner {
    padding: 7px 10px;
    border: 1px solid color-mix(in srgb,var(--warning) 58%,var(--border));
    background: color-mix(in srgb,var(--warning) 12%,var(--surface));
    box-shadow: inset 0 2px 0 color-mix(in srgb,var(--warning) 72%,transparent);
  }
  .all-debt-simulation-selection {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 5px 0 4px;
    padding: 5px 7px;
    border: 1px solid color-mix(in srgb,var(--warning) 28%,var(--border));
    border-radius: var(--radius-sm);
    background: color-mix(in srgb,var(--warning) 5%,var(--surface));
    color: var(--muted);
    font-family: var(--font-num);
    font-size: 7.5px;
    line-height: 1.25;
  }
  .all-debt-simulation-selection[hidden] {
    display: none;
  }
  @media (max-width: 620px) {
    .all-debt-simulation-selection {
      align-items: flex-start;
      font-size: 7px;
    }
  }
  .summary-utility-row {
    align-items: start;
  }
  .summary-utility-row>.forecast-payment-box,.summary-utility-row>.forecast-borrowing-box {
    align-self: start;
  }
  .all-debt-simulation-selection {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    box-sizing: border-box;
  }
  .list-collapse-all-bar {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
    margin: 7px 0 4px;
  }
  .owner-section,.main-owner-section {
    --main-owner-accent: #966460;
    --main-owner-accent-strong: #6f4542;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    min-width: 0;
    margin: 0 0 10px;
    padding: 12px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb,var(--main-owner-accent) 18%,var(--border));
    border-radius: var(--radius-md);
    background: color-mix(in srgb,var(--card) 91%,var(--main-owner-accent) 9%);
    box-shadow: inset 4px 0 0 color-mix(in srgb,var(--main-owner-accent) 72%,transparent);
  }
  [data-theme="dark"] .owner-section,[data-theme="dark"] .main-owner-section {
    --main-owner-accent: #a87873;
    --main-owner-accent-strong: #d4aaa5;
    background: color-mix(in srgb,var(--card) 92%,var(--main-owner-accent) 8%);
    border-color: color-mix(in srgb,var(--main-owner-accent) 22%,var(--border));
  }
  .owner-section-head,.main-owner-section-head {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-width: 0;
    padding: 0 0 10px;
    margin: 0 0 8px;
  }
  .owner-title-block {
    min-width: 0;
  }
  .owner-title {
    display: block;
    min-width: 0;
    color: color-mix(in srgb,var(--text) 84%,var(--main-owner-accent) 16%);
    font-family: var(--font-title);
    font-size: clamp(20px,2.5vw,25px);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -.045em;
    white-space: nowrap;
  }
  .owner-section-toggle,.main-owner-collapse-btn {
    cursor: pointer;
  }
  .owner-section-body,.main-owner-section-body {
    display: block;
    width: 100%;
    min-width: 0;
  }
  .main-owner-section-body>.list-card:first-child {
    margin-top: 0;
  }
  .main-owner-section-body>.list-card:last-child {
    margin-bottom: 0;
  }
  .main-owner-section .list-card {
    border-top-color: color-mix(in srgb,var(--main-owner-accent) 17%,var(--border));
  }
  .main-owner-section .list-card-title {
    color: color-mix(in srgb,var(--muted) 88%,var(--main-owner-accent) 12%);
  }
  @media (max-width: 760px) {
    .owner-section,.main-owner-section {
      padding: 10px;
    }
    .owner-title {
      font-size: 20px;
    }
    .list-collapse-all-bar {
      margin-top: 5px;
    }
  }
  .main-owner-section-body,.hazal-section-body {
    display: block;
  }
  .main-owner-section,.hazal-section {
    --section-accent: #8d625f;
  }
  .hazal-section {
    --section-accent: #8b7969;
  }
  [data-theme="dark"] .main-owner-section {
    --section-accent: #b47e79;
  }
  [data-theme="dark"] .hazal-section {
    --section-accent: #ad9783;
  }
  .owner-title::before,.hazal-title::before {
    content: "";
    display: inline-block;
    flex: 0 0 5px;
    width: 5px;
    height: 5px;
    border-radius: var(--radius-sm);
    background: var(--section-accent);
    opacity: .82;
  }
  .mobile-row-toggle {
    display: none;
  }
  @media (max-width: 760px) {
    .mobile-row-summary-meta>span+span::before {
      content: "·";
      margin-right: 7px;
      color: var(--dim);
    }
    .table-body .row.is-mobile-expanded::before {
      content: "";
    }
  }
  .period-label-toggle {
    appearance: none;
    display: inline-flex;
    align-items: center;
    width: max-content;
    max-width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
  }
  .due-tracker-box {
    margin: 3px 0 0;
    padding: 0;
    overflow: visible;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: transparent;
    box-shadow: none;
  }
  .due-tracker-head {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    margin: 0;
    padding: 5px 7px;
  }
  .due-tracker-box.is-open .due-tracker-head {
    border-bottom: 1px solid var(--line);
  }
  .due-tracker-toggle {
    min-height: 22px;
    gap: 8px;
  }
  .due-tracker-title-stack {
    display: flex;
    align-items: baseline;
    gap: 7px;
    overflow: hidden;
  }
  .due-tracker-title-stack h3 {
    flex: 0 0 auto;
    margin: 0;
    font-family: var(--font-label);
    font-size: 8px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .08em;
    text-transform: uppercase;
  }
  .due-tracker-title-stack>span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: var(--font-num);
    font-size: 8px;
    color: var(--muted);
  }
  .due-tracker-switch {
    gap: 5px;
    font-size: 7.5px;
    color: var(--muted);
  }
  .due-tracker-switch input {
    width: 12px;
    height: 12px;
    min-width: 12px;
    margin: 0;
  }
  .due-tracker-body {
    margin: 0;
    padding: 0;
  }
  .due-tracker-chips {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 0;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
  }
  .due-tracker-chip {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    grid-template-areas: "label count" "amount amount";
    align-items: baseline;
    gap: 3px 7px;
    min-width: 0;
    margin: 0;
    padding: 7px 9px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .due-tracker-chip+.due-tracker-chip {
    border-left: 1px solid var(--line);
  }
  .due-tracker-chip>span {
    grid-area: label;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 7px;
    letter-spacing: .07em;
    color: var(--muted);
  }
  .due-tracker-chip>strong {
    grid-area: count;
    justify-self: end;
    font-size: 17px;
    font-weight: 600;
    line-height: 1;
  }
  .due-tracker-chip>em {
    grid-area: amount;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 8px;
    color: var(--dim);
  }
  .due-tracker-chip-overdue {
    background: color-mix(in srgb,var(--red) 10%,var(--card));
  }
  .due-tracker-chip-today {
    background: color-mix(in srgb,var(--warning) 10%,var(--card));
  }
  .due-tracker-chip-week {
    background: color-mix(in srgb,#C59D57 10%,var(--card));
  }
  .due-tracker-chip-month {
    background: color-mix(in srgb,var(--muted) 9%,var(--card));
  }
  .due-tracker-chip.is-open {
    box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--text) 10%,var(--border));
  }
  .summary-monthly-detail,#monthlyTotals,.selection-panel {
    overflow-anchor: none;
  }
  .selection-panel {
    position: relative;
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    margin: 7px 0 8px;
    padding: 6px 8px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: color-mix(in srgb,var(--card) 96%,var(--bg) 4%);
  }
  #projectionChart .projection-row {
    position: relative;
    padding-left: 18px;
  }
  #projectionChart .projection-month-select {
    z-index: 2;
    transform: translateY(-50%);
    accent-color: var(--text);
  }
  .main-owner-section .list-card-title,.hazal-section .list-card-title,.hazal-section .hazal-static-head h2 {
    min-width: 0;
  }
  @media (max-width: 760px) {
    html,body {
      width: 100%;
      max-width: 100%;
      overflow-x: hidden;
    }
    .summary-title-stack {
      grid-column: 1;
      grid-row: 1;
      min-width: 0;
    }
    .summary-actions .summary-pdf-btn {
      grid-column: 2;
      grid-row: 1;
      align-self: center;
    }
    .summary-actions>.summary-section-toggle {
      grid-column: 3;
      grid-row: 1;
      align-self: center;
    }
    .summary-actions .period-controls {
      grid-column: 1 / -1;
      grid-row: 2;
      width: 100%;
      justify-content: space-between;
    }
    .summary-actions .period-controls input[type="month"] {
      flex: 1 1 auto;
      width: auto;
      max-width: none;
    }
    #projectionChart .projection-row {
      border-radius: var(--radius-sm);
      cursor: pointer;
    }
    #projectionChart .projection-month-select {
      cursor: pointer;
    }
    #projectionChart .projection-row::after {
      content: "";
      position: absolute;
      top: 6px;
      right: 6px;
      width: 6px;
      height: 6px;
      border: 1px solid var(--border);
      border-radius: 50%;
      background: var(--surface);
      pointer-events: none;
    }
    .due-tracker-chip {
      padding: 6px 5px;
    }
    .due-tracker-chip>strong {
      font-size: 15px;
    }
  }
  @media (max-width: 430px) {
    .due-tracker-head {
      grid-template-columns: minmax(0,1fr);
      gap: 4px;
    }
    .due-tracker-switch {
      justify-content: flex-start;
    }
  }
  .summary-card .scroll-fade-bottom {
    -webkit-mask-image: linear-gradient(to bottom,#000 0,#000 calc(100% - 20px),transparent 100%);
    mask-image: linear-gradient(to bottom,#000 0,#000 calc(100% - 20px),transparent 100%);
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
  }
  .month-bridge-panel {
    width: 100%;
    margin-top: 9px;
    padding-top: 8px;
    font-family: var(--font-num);
  }
  @media (max-width: 620px) {
    .month-bridge-panel {
      margin-top: 7px;
      padding-top: 6px;
    }
  }
  body,button,input,select,textarea {
    font-optical-sizing: auto;
    font-feature-settings: "tnum" 1,"cv02" 1,"cv03" 1,"cv04" 1;
    font-variant-numeric: tabular-nums;
  }
}
@layer overrides {
  .app {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    min-width: 0;
  }
  .card,.panel {
    max-width: 100%;
    min-width: 0;
  }
  .table,.table-wide {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
  .summary-converted-prominent .summary-block-head h3,.summary-debt-converted-label {
    font-family: var(--font-title);
    font-size: 12px;
    line-height: 1.05;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--text);
    white-space: normal;
    overflow-wrap: normal;
  }
  .summary-converted-prominent {
    align-items: end;
    gap: 8px 14px;
  }
  .summary-converted-prominent .summary-block-head,.summary-converted-prominent .combined-row,.summary-debt-converted .combined-row {
    margin-bottom: 0;
  }
  .summary-converted-prominent .combined-value {
    font-size: clamp(22px,3vw,30px);
    line-height: 1;
  }
  .summary-debt-converted {
    display: grid;
    grid-template-columns: minmax(0,0.95fr) minmax(0,1.35fr);
    align-items: center;
    gap: 8px 12px;
    min-width: 0;
    overflow: hidden;
  }
  .summary-debt-converted-label,.summary-debt-converted-controls,.debt-combined-row {
    min-width: 0;
  }
  @media (max-width: 760px) {
    .summary-converted-prominent,.summary-debt-converted {
      grid-template-columns: 1fr;
      align-items: stretch;
    }
  }
  .summary-converted-prominent,.summary-debt-converted {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .summary-converted-prominent .summary-block-head,.summary-debt-converted-title {
    margin: 0;
  }
  .summary-converted-prominent .summary-block-head h3,.summary-debt-converted-title {
    font-family: var(--font-title);
    font-size: 12px;
    line-height: 1.1;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--text);
  }
  .summary-converted-prominent .summary-converted-controls {
    width: 100%;
    align-items: stretch;
    gap: 6px;
  }
  .summary-converted-prominent .combined-row,.debt-combined-row {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0;
    min-width: 0;
  }
  .summary-converted-prominent .combined-value,#allDebtCombinedTotal {
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
    text-align: right;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
    font-size: clamp(20px,2.5vw,28px);
    letter-spacing: -0.035em;
  }
  @media (max-width: 760px) {
    .summary-converted-prominent .combined-value,#allDebtCombinedTotal {
      font-size: 22px;
    }
    .summary-converted-prominent .combined-row,.debt-combined-row {
      justify-content: flex-end;
    }
    .table-body {
      flex-direction: column;
    }
    #sabitTable .row,#krediKartiTable .row,#krediTable .row,#borcTable .row,.row {
      min-width: 0;
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    .cell.full,.cell.mobile-full {
      grid-column: 1 / -1;
    }
    .cell-label {
      color: var(--dim);
      font-size: 9px;
      letter-spacing: 0.09em;
      line-height: 1.15;
    }
    .row input,.row select,.readonly-field {
      min-height: 52px;
      width: 100%;
      display: flex;
      align-items: center;
      padding: 12px;
      border: 1px solid var(--border);
      border-radius: var(--radius);
      background: var(--bg);
      font-size: 13px;
      box-shadow: none;
    }
    .row input[type="checkbox"] {
      align-self: flex-start;
      margin-top: 10px;
    }
  }
  .summary-block-toggle,.list-card-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    text-align: left;
  }
  .summary-block-toggle .summary-collapse-mark,.list-card-toggle .summary-collapse-mark,.summary-section-toggle .summary-collapse-mark {
    width: 30px;
    height: 30px;
    min-width: 30px;
    border-radius: 50%;
    border: 1px solid var(--border);
    background: var(--text);
    color: var(--card);
    font-family: var(--font-num);
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  [data-theme="dark"] .summary-block-toggle .summary-collapse-mark,[data-theme="dark"] .list-card-toggle .summary-collapse-mark,[data-theme="dark"] .summary-section-toggle .summary-collapse-mark {
    color: #0E0D0B;
  }
  .summary-block-debt-total {
    flex: 1.25 1 0;
    min-height: 0;
  }
  .summary-block-debt-total #allDebtTotals {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-right: 4px;
  }
  .summary-converted-prominent .combined-row,.debt-combined-row {
    gap: 8px;
  }
  @media (max-width: 900px) {
    .summary-side {
      height: 430px;
    }
  }
  @media (max-width: 760px) {
    .summary-block-primary {
      height: 445px;
    }
    .summary-block-secondary {
      height: 280px;
    }
    .summary-block-toggle .summary-collapse-mark,.list-card-toggle .summary-collapse-mark,.summary-section-toggle .summary-collapse-mark {
      width: 30px;
      height: 30px;
      min-width: 30px;
    }
  }
  @media (max-width: 760px) {
    .table-wide {
      -webkit-overflow-scrolling: touch;
    }
    .table-head {
      font-size: 10px;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: var(--muted);
    }
    #sabitTable .table-head,#sabitTable .row,#krediKartiTable .table-head,#krediKartiTable .row,#krediTable .table-head,#krediTable .row,#borcTable .table-head,#borcTable .row {
      min-width: var(--table-min-width);
    }
    #sabitTable .row,#krediKartiTable .row,#krediTable .row,#borcTable .row,.row {
      width: auto;
      display: grid;
      gap: 8px;
      align-items: center;
      padding: 28px 8px 8px;
      border: 0;
      border-bottom: 1px solid var(--border);
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      position: relative;
    }
    .cell {
      display: flex;
      flex-direction: column;
      gap: 2px;
      min-width: 0;
    }
    .cell-label {
      display: none;
    }
    .row input,.row select {
      width: 100%;
      min-width: 0;
      min-height: 0;
      font-family: var(--font-ui);
      font-size: 13px;
      border: none;
      border-bottom: 1px solid transparent;
      background: transparent;
      color: var(--text);
      padding: 4px 2px;
      border-radius: 0;
      box-shadow: none;
    }
    .row input[type="number"],.row input[type="date"] {
      font-family: var(--font-num);
    }
    .row input[type="checkbox"] {
      flex-shrink: 0;
      margin: 0;
      border: 0;
      background: transparent;
      accent-color: var(--text);
    }
  }
  .summary-monthly-static-head {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--border);
  }
  .summary-block-primary .summary-monthly-static-head {
    cursor: default;
  }
  .summary-block-primary .summary-collapsible-body {
    display: flex;
  }
  .summary-card:not(.is-open) .summary-grid {
    display: none;
  }
  @media (max-width: 760px) {
    .summary-top {
      align-items: flex-start;
      gap: 10px;
    }
    .summary-actions {
      width: 100%;
      justify-content: flex-start;
    }
    .summary-grid {
      gap: 12px;
    }
    .summary-block-primary,.summary-side,.summary-block-secondary {
      height: auto;
      min-height: 0;
    }
    .summary-block-primary #monthlyTotals {
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
    }
    .summary-block-debt-total #allDebtTotals,.summary-block-secondary .summary-collapsible-body {
      max-height: 240px;
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
    }
    .summary-debt-converted {
      gap: 8px;
    }
    .row input[type="date"] {
      width: 100%;
    }
  }
  .summary-block-primary:not(.is-open) #monthlyTotals,.summary-block-primary:not(.is-open) .summary-collapsible-body,.summary-block-primary #monthlyTotals {
    display: flex;
    flex-direction: column;
    gap: 10px;
    visibility: visible;
    opacity: 1;
  }
  .summary-block-primary #monthlyTotals .total-group,.summary-block-primary #monthlyTotals .totals-row,.summary-block-primary #monthlyTotals .total-items,.summary-block-primary #monthlyTotals .total-item {
    display: flex;
    visibility: visible;
    opacity: 1;
  }
  .summary-block-primary #monthlyTotals .totals-row,.summary-block-primary #monthlyTotals .total-item {
    flex-direction: row;
  }
  .summary-block-secondary.is-open .summary-collapsible-body,.summary-block-secondary.is-open.summary-block-debt-total .summary-debt-converted {
    display: flex;
  }
  .summary-block-secondary.is-open .summary-collapsible-body {
    flex-direction: column;
  }
  .summary-block-secondary.is-open.summary-block-debt-total .summary-debt-converted {
    flex-direction: column;
  }
  @media (max-width: 760px) {
    .summary-card {
      overflow: visible;
    }
    .summary-grid,.summary-side {
      overflow: visible;
    }
    .summary-side {
      height: auto;
      min-height: 0;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .summary-block-primary,.summary-block-secondary,.summary-block-debt-total {
      flex: 0 0 auto;
      height: auto;
      min-height: 0;
      max-height: none;
      overflow: visible;
    }
    .summary-block-primary #monthlyTotals {
      max-height: none;
      min-height: 72px;
      overflow: visible;
    }
    .summary-block-debt-total.is-open {
      min-height: 0;
    }
    .summary-block-debt-total.is-open .summary-debt-converted,.summary-block-debt-total.is-open #allDebtTotals {
      display: flex;
      flex-direction: column;
      max-height: none;
      overflow: visible;
    }
  }
  .cell-date,.cell-vadeTarihi {
    min-width: 158px;
    overflow: visible;
  }
  .date-field-wrap {
    grid-template-columns: minmax(118px,1fr) 22px;
    gap: 6px;
  }
  .date-clear {
    z-index: 1;
    flex: 0 0 22px;
  }
  @media (max-width: 760px) {
    .cell-date,.cell-vadeTarihi {
      min-width: 168px;
    }
    .date-field-wrap {
      grid-template-columns: minmax(128px,1fr) 24px;
      min-width: 158px;
    }
    .date-clear {
      width: 24px;
      height: 24px;
      min-width: 24px;
    }
  }
  .list-card-toggle,.summary-block-toggle,.summary-section-toggle,.hazal-section-toggle {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    align-items: center;
    gap: 10px;
    text-align: left;
  }
  .list-card-toggle {
    flex: 1 1 auto;
  }
  .list-card-toggle h2,.summary-block-toggle h3,.summary-section-toggle h2,.hazal-section-toggle>span:first-child {
    min-width: 0;
  }
  .summary-collapse-mark,.hazal-collapse-mark {
    margin-left: auto;
    justify-self: end;
    flex: 0 0 auto;
  }
  .list-card-head {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto auto;
    align-items: center;
    gap: 8px;
  }
  .list-card-title {
    margin: 0;
    min-width: 0;
  }
  .list-card-collapse-btn {
    width: 30px;
    height: 30px;
    min-width: 30px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: end;
  }
  .list-card-collapse-btn .summary-collapse-mark {
    margin: 0;
  }
  .summary-block-toggle,.summary-section-toggle {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    align-items: center;
    gap: 10px;
  }
  .summary-block-toggle .summary-collapse-mark,.summary-section-toggle .summary-collapse-mark {
    justify-self: end;
    margin-left: auto;
  }
  .summary-section-toggle {
    margin-left: 0;
    flex: 0 0 auto;
  }
  .hazal-collapse-btn {
    width: 30px;
    height: 30px;
    min-width: 30px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: end;
  }
  .hazal-collapse-btn .summary-collapse-mark,.hazal-collapse-btn .hazal-collapse-mark {
    margin: 0;
  }
  .summary-block-debt-total .summary-collapsible-body {
    display: block;
  }
  @media (max-width: 760px) {
    .hazal-collapse-btn {
      grid-column: 2;
      grid-row: 1;
    }
  }
  .list-card-head>.list-card-collapse-btn,.hazal-section-head>.hazal-collapse-btn,.summary-actions>.summary-section-toggle {
    order: 999;
    margin-left: auto;
    justify-self: end;
  }
  .summary-block-toggle {
    width: 100%;
  }
  .summary-block-toggle>.summary-collapse-mark {
    margin-left: auto;
    justify-self: end;
  }
  .summary-block-primary {
    height: auto;
  }
  .summary-side {
    height: auto;
  }
  .hazal-section {
    --hazal-ink: var(--text);
    --hazal-muted: var(--muted);
    position: relative;
    min-height: 0;
    padding: 0;
    background: transparent;
    box-shadow: none;
    border: 0;
  }
  .hazal-section-head {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto auto;
    align-items: center;
    gap: 8px;
    padding: 0 0 10px;
    margin-bottom: 8px;
    border-bottom: 1px solid var(--line);
  }
  .hazal-title-block {
    min-width: 0;
    display: block;
  }
  .hazal-title {
    display: block;
    line-height: .95;
    letter-spacing: -0.055em;
    white-space: nowrap;
  }
  .hazal-section-body {
    width: 100%;
    display: block;
  }
  .hazal-switch {
    min-width: max-content;
  }

  .hazal-title-block {
    display: flex;
    align-items: center;
    min-width: 0;
  }
  .hazal-title {
    line-height: 1;
  }
  .hazal-switch {
    justify-self: end;
    align-self: center;
  }
  .hazal-collapse-btn,
  .hazal-section-toggle {
    align-self: center;
    justify-self: end;
  }
  .hazal-collapse-btn .summary-collapse-mark,
  .hazal-section-toggle .summary-collapse-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  @media (max-width: 760px) and (orientation: portrait) {
    .hazal-section-head {
      grid-template-columns: minmax(0,1fr) auto auto;
      gap: 6px;
    }
    .hazal-switch {
      grid-column: 2;
      grid-row: 1;
      width: auto;
      min-width: 0;
      gap: 5px;
      font-size: 7px;
      letter-spacing: .05em;
    }
    .hazal-switch-label {
      white-space: nowrap;
    }
  }
  .hazal-section {
    --hazal-accent: #75685B;
    --hazal-accent-strong: #4F463D;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    clear: both;
  }
  [data-theme="dark"] .hazal-section {
    --hazal-accent: #9B8D7C;
    --hazal-accent-strong: #D2C5B4;
  }
  .hazal-section>.hazal-section-head {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto auto;
    width: 100%;
    align-self: stretch;
    position: static;
  }
  .hazal-section>.hazal-section-body {
    display: block;
    width: 100%;
    min-width: 0;
    align-self: stretch;
    margin: 0;
  }
  .hazal-title {
    font-size: clamp(22px,2.8vw,28px);
  }
  .summary-top {
    align-items: center;
  }
  .summary-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
  }
  .period-controls {
    display: inline-flex;
    align-items: center;
    height: 36px;
    min-height: 36px;
    gap: 4px;
  }
  .period-controls .btn,.period-controls button,.period-controls input[type="month"],.summary-pdf-btn,.summary-section-toggle {
    height: 36px;
    min-height: 36px;
    box-sizing: border-box;
    align-self: center;
    margin-top: 0;
    margin-bottom: 0;
  }
  .period-controls input[type="month"] {
    display: inline-flex;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 36px;
  }
  .summary-section-toggle {
    width: 36px;
    min-width: 36px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: static;
    transform: none;
    order: 3;
  }
  .summary-pdf-btn {
    order: 2;
  }
  .period-controls {
    order: 1;
  }
  @media (max-width: 760px) {
    .summary-actions {
      flex-wrap: wrap;
    }
    .summary-pdf-btn,.summary-section-toggle {
      flex: 0 0 auto;
    }
  }
  .summary-monthly-detail .summary-block-head {
    margin-bottom: 10px;
  }
  .hazal-section.is-not-included {
    filter: none;
    background: transparent;
    box-shadow: none;
  }
  .hazal-section.is-not-included .hazal-section-body {
    opacity: 1;
  }
  .hazal-section.is-not-included .hazal-list-card,.hazal-section.is-not-included .table,.hazal-section.is-not-included .row,.hazal-section.is-not-included .add-row {
    background: transparent;
  }
  .hazal-section.is-not-included .hazal-section-head,.hazal-section.is-not-included .hazal-switch,.hazal-section.is-not-included .hazal-section-toggle {
    filter: none;
    opacity: 1;
  }
  .summary-block-primary .summary-converted-inline {
    border-top: 0;
    padding-top: 0;
  }
  .summary-block-primary .summary-converted-inline,.summary-block-primary .summary-converted-prominent,.summary-block-primary .summary-converted-controls,.summary-block-primary .combined-row,.summary-block-primary .rate-info {
    border-top: 0;
    border-bottom: 0;
    box-shadow: none;
  }
  .date-field-wrap {
    position: relative;
    display: block;
    min-width: 0;
  }
  .date-clear {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
  }
  @media (min-width: 761px) {
    .table-wide {
      max-width: 100%;
    }
    .table-head,.row {
      max-width: 100%;
    }
  }
  .cell-date {
    min-width: 0;
  }
  .date-field-wrap {
    max-width: 112px;
    width: 100%;
  }
  .date-field-wrap input[type="date"] {
    min-width: 0;
    width: 100%;
    max-width: 112px;
    padding-left: 1px;
    padding-right: 20px;
    font-size: 10.5px;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
  }
  .date-field-wrap input[type="date"]::-webkit-calendar-picker-indicator {
    width: 12px;
    height: 12px;
    padding: 0;
    margin: 0 -4px 0 -8px;
    opacity: .58;
  }
  .date-clear {
    width: 15px;
    height: 15px;
    min-width: 15px;
    right: 1px;
    font-size: 10px;
    border-width: 1px;
  }
  .summary-block-primary .summary-monthly-static-head,.summary-block-primary .summary-monthly-head,.summary-block-primary .summary-monthly-detail .summary-block-head {
    margin-top: 0;
    margin-bottom: 6px;
    padding-top: 0;
    border-top: 0;
    border-bottom: 0;
    box-shadow: none;
  }
  .summary-block-primary #monthlyTotals {
    gap: 6px;
  }
  .summary-block-primary .summary-converted-prominent {
    margin-bottom: 0;
    padding-bottom: 0;
  }
  .summary-block-primary .summary-converted-controls {
    gap: 3px;
  }
  .summary-block-debt-total.is-open .summary-debt-converted {
    display: flex;
    flex-direction: column;
  }
  .summary-block-primary .monthly-total-toggle {
    margin-bottom: 0;
  }
  .summary-block-primary.is-open .summary-monthly-detail {
    display: block;
  }
  .summary-block-primary .summary-monthly-detail .summary-block-head {
    margin-bottom: 8px;
    padding-top: 0;
    border-top: 0;
    border-bottom: 0;
    box-shadow: none;
  }
  .summary-block-primary .summary-monthly-detail {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--border);
  }
  @media (min-width: 761px) {
    #hazalSabitTable .table-head,#hazalSabitTable .row,#hazalKrediKartiTable .table-head,#hazalKrediKartiTable .row,#hazalKrediTable .table-head,#hazalKrediTable .row {
      min-width: var(--table-min-width);
      width: 100%;
    }
  }
  #hazalSabitTable .table-head,#hazalSabitTable .row,#hazalKrediKartiTable .table-head,#hazalKrediKartiTable .row,#hazalKrediTable .table-head,#hazalKrediTable .row {
    justify-content: stretch;
  }
  @media (max-width: 760px) and (orientation: portrait) {
    .summary-actions {
      width: 100%;
      align-items: center;
      justify-content: flex-start;
      gap: 8px;
    }
    .summary-actions .period-controls {
      width: 100%;
      min-width: 0;
    }
    .period-controls input[type="month"] {
      flex: 1 1 auto;
      width: auto;
      min-width: 0;
    }
    .table-wide {
      overflow: visible;
    }
    .table-head {
      display: none;
    }
    .table-body {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    #sabitTable .row,#krediKartiTable .row,#krediTable .row,#borcTable .row,#hazalSabitTable .row,#hazalKrediKartiTable .row,#hazalKrediTable .row {
      width: 100%;
      min-width: 0;
      display: grid;
      grid-template-columns: repeat(2,minmax(0,1fr));
      gap: 10px;
      align-items: start;
      padding: 38px 10px 10px;
      border: 1px solid var(--border);
      border-radius: var(--radius-sm);
      background: var(--card);
      position: relative;
    }
    .row .cell {
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 4px;
    }
    .row .cell.full,.row .cell.mobile-full {
      grid-column: 1 / -1;
    }
    .row .cell-label {
      display: block;
      color: var(--dim);
      font-family: var(--font-label);
      font-size: 8.5px;
      line-height: 1.2;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      white-space: normal;
    }
    .row input,.row select,.row .readonly-field {
      width: 100%;
      min-width: 0;
      min-height: 42px;
      display: flex;
      align-items: center;
      padding: 9px 8px;
      border: 1px solid var(--border);
      border-radius: var(--radius-sm);
      background: var(--bg);
      color: var(--text);
      font-size: 12px;
      box-shadow: none;
    }
    .row input[type="checkbox"] {
      width: 22px;
      height: 22px;
      min-width: 22px;
      min-height: 22px;
      padding: 0;
      border: 0;
      background: transparent;
    }
    .cell-date,.cell-vadeTarihi {
      min-width: 0;
    }
    .date-field-wrap {
      width: 100%;
      min-width: 0;
      max-width: none;
      display: grid;
      grid-template-columns: minmax(0,1fr) 22px;
      gap: 4px;
    }
    .date-field-wrap input[type="date"] {
      width: 100%;
      min-width: 0;
      max-width: none;
      padding-right: 6px;
      font-size: 10.5px;
    }
    .date-clear {
      position: relative;
      top: auto;
      right: auto;
      transform: none;
      align-self: center;
      width: 22px;
      height: 22px;
      min-width: 22px;
    }
    .add-row {
      width: 100%;
      min-width: 0;
    }
  }
  .summary-card .summary-block,.summary-card .summary-options {
    border-color: var(--border);
    box-shadow: none;
  }
  @media (max-width: 760px) and (orientation: portrait) {
    body {
      overflow: hidden;
    }
    body::before {
      content: "Telefonu yatay çevir";
      display: flex;
    }
    body::after {
      content: "Veri girişi için landscape görünüm kullanılır.";
      display: block;
    }
  }
  @media (max-width: 900px) {
    .summary-grid {
      grid-template-columns: minmax(0,1fr);
    }
    .summary-main-column,.summary-side {
      display: contents;
    }
  }
  .table,.table-wide,.table-head,.table-body,.row {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }
  .table-wide {
    overflow-x: hidden;
  }
  .table-head,.row {
    min-width: 0;
  }
  .row .cell,.row input,.row select,.row .readonly-field,.head-cell,.head-label {
    min-width: 0;
    max-width: 100%;
  }
  .head-label,.row input,.row select,.row .readonly-field {
    overflow: hidden;
  }
  .summary-card:not(.is-open) .forecast-payment-box {
    display: none;
  }
  @media (max-width: 760px) and (orientation: portrait) {
    body {
      min-height: 100svh;
      overflow-x: hidden;
      overflow-y: auto;
    }
    #lockScreen,#mainApp {
      visibility: visible;
      pointer-events: auto;
    }
    body::before,body::after {
      content: none;
      display: none;
    }
  }
  @media (max-width: 760px) {
    .table-wide {
      overflow-x: hidden;
      overflow-y: visible;
    }
    .table-head {
      display: grid;
      gap: 8px;
      padding: 0 8px 8px;
      border-bottom: 1px solid var(--border);
    }
    .table-body {
      display: block;
      gap: 0;
    }
    #sabitTable .row,#krediKartiTable .row,#krediTable .row,#borcTable .row,#hazalSabitTable .row,#hazalKrediKartiTable .row,#hazalKrediTable .row,.row {
      width: 100%;
      min-width: 0;
      display: grid;
      gap: 8px;
      align-items: center;
      padding: 28px 8px 8px;
      border: 0;
      border-bottom: 1px solid var(--border);
      border-radius: 0;
      background: transparent;
      box-shadow: none;
    }
    .row:last-child {
      border-bottom: none;
    }
    .cell,.row .cell {
      display: flex;
      flex-direction: column;
      gap: 2px;
      min-width: 0;
    }
    .cell.mobile-full:not(.full) {
      grid-column: auto;
    }
    .cell-label,.row .cell-label {
      display: none;
    }
    .row input,.row select,.row .readonly-field {
      width: 100%;
      min-width: 0;
      min-height: 0;
      border: none;
      border-bottom: 1px solid transparent;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      padding: 4px 2px;
      font-size: 12px;
    }
    .row input[type="checkbox"] {
      width: 18px;
      height: 18px;
      min-width: 18px;
      min-height: 18px;
      padding: 0;
    }
  }
  .summary-monthly-static-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
  }
  @media (max-width: 620px) {
    .summary-monthly-static-head {
      flex-direction: column;
    }
  }
  .app {
    max-width: 1280px;
    padding-inline: clamp(12px,1.6vw,20px);
  }
  .due-tracker-box {
    overflow: visible;
  }
  .due-tracker-head {
    align-items: center;
    margin-bottom: 0;
    flex-wrap: nowrap;
  }
  .due-tracker-toggle {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
  }
  .due-tracker-title-stack {
    display: grid;
    gap: 2px;
    min-width: 0;
  }
  .due-tracker-title-stack h3 {
    margin: 0 0 3px;
  }
  .due-tracker-toggle .summary-collapse-mark {
    width: 26px;
    height: 26px;
    min-width: 26px;
    border-radius: 50%;
    border: 1px solid var(--border);
    background: var(--text);
    color: var(--card);
    font-family: var(--font-num);
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  [data-theme="dark"] .due-tracker-toggle .summary-collapse-mark {
    color: #0E0D0B;
  }
  .due-tracker-body {
    margin-top: 10px;
  }
  .due-tracker-box:not(.is-open) .due-tracker-body {
    display: none;
  }
  @media (min-width: 761px) {
    .summary-grid {
      gap: 12px;
    }
    .due-tracker-chips {
      grid-template-columns: repeat(4,minmax(0,1fr));
    }
    .due-tracker-head,.summary-top,.summary-actions,.topbar {
      flex-wrap: nowrap;
    }
    .due-tracker-switch,.summary-pdf-btn,.period-controls,.conn-indicator {
      white-space: nowrap;
    }
    .brand-block,.summary-title-stack {
      flex: 1 1 auto;
    }
  }
  @media (max-width: 760px) and (orientation: portrait) {
    .due-tracker-head {
      flex-wrap: wrap;
      align-items: flex-start;
    }
    .due-tracker-toggle {
      width: 100%;
    }
  }
  .summary-grid {
    display: grid;
    grid-template-columns: minmax(0,1.48fr) minmax(320px,0.82fr);
    gap: 12px;
    align-items: start;
    overflow: visible;
  }
  .summary-main-column,.summary-side {
    min-width: 0;
    width: 100%;
    min-height: 0;
    height: auto;
    max-height: none;
    overflow: visible;
  }
  .summary-main-column {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .summary-side {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-self: start;
  }
  .summary-card,.summary-card .summary-grid,.summary-card .summary-block {
    overflow: visible;
  }
  .summary-block-primary,.summary-block-primary.is-open,.summary-monthly-detail,.summary-block-primary .summary-monthly-detail,.summary-block-primary .summary-collapsible-body {
    display: block;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
  }
  .summary-block-primary #monthlyTotals,#monthlyTotals {
    display: flex;
    flex-direction: column;
    gap: 10px;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
  .summary-side .summary-block-secondary,.summary-side .summary-block-debt-total,.summary-side .summary-block-secondary.is-open,.summary-side .summary-block-debt-total.is-open {
    flex: 0 0 auto;
    display: block;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
  }
  .summary-side .summary-block-secondary.is-open .summary-collapsible-body,.summary-side .summary-block-secondary.is-open .totals-list,.summary-side .summary-block-debt-total.is-open #allDebtTotals {
    display: flex;
    flex-direction: column;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
  .summary-side .summary-block-debt-total .summary-debt-converted,.summary-side .summary-block-debt-total.is-open .summary-debt-converted,.summary-side .summary-block-debt-total:not(.is-open) .summary-debt-converted {
    display: flex;
    flex-direction: column;
    height: auto;
    max-height: none;
    overflow: visible;
  }
  .summary-side .summary-block-toggle,.summary-side .summary-debt-converted,.summary-block-primary .summary-converted-prominent,.summary-block-primary .summary-monthly-static-head {
    flex: none;
  }

  .summary-side .summary-block-debt-total {
    overflow: hidden;
  }
  .summary-side .summary-block-debt-total > .summary-block-head {
    align-items: flex-start;
  }
  @media (min-width: 761px) {
    .summary-side .summary-block-debt-total:not(.is-open) {
      width: 78px;
      min-width: 78px;
      align-self: start;
    }
    .summary-side .summary-block-debt-total:not(.is-open) > .summary-block-head {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: space-between;
      min-height: 168px;
      padding: 12px 10px;
    }
    .summary-side .summary-block-debt-total:not(.is-open) > .summary-block-head > div {
      width: 100%;
    }
    .summary-side .summary-block-debt-total:not(.is-open) > .summary-block-head h3 {
      width: 100%;
      max-width: 42px;
      line-height: 1.02;
      text-align: left;
      word-break: break-word;
      overflow-wrap: anywhere;
    }
    .summary-side .summary-block-debt-total:not(.is-open) > .summary-block-head span:not(.summary-collapse-mark) {
      display: none;
    }
    .summary-side .summary-block-debt-total:not(.is-open) > .summary-block-head > .summary-collapse-mark {
      margin-left: 0;
      align-self: flex-start;
    }
    .summary-side .summary-block-debt-total:not(.is-open) .summary-debt-converted,
    .summary-side .summary-block-debt-total:not(.is-open) #allDebtTotals {
      display: none;
    }
    .summary-side .summary-block-debt-total.is-open > .summary-block-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 12px 14px;
      min-height: 0;
    }
  }
  @media (min-width: 761px) {
    .summary-grid {
      grid-template-columns: minmax(0,1.48fr) minmax(320px,0.82fr);
    }
    .summary-main-column,.summary-side,.summary-block-primary.is-open,.summary-side .summary-block-secondary.is-open,.summary-side .summary-block-debt-total.is-open {
      height: auto;
      max-height: none;
    }
  }
  @media (max-width: 760px) and (orientation: portrait) {
    .summary-grid {
      grid-template-columns: minmax(0,1fr);
    }
    .summary-side {
      order: 2;
    }
    .summary-main-column {
      order: 1;
    }
  }
  @media (min-width: 761px) {
    .summary-grid {
      align-items: stretch;
    }
    .summary-main-column,.summary-side {
      align-self: stretch;
      height: auto;
      min-height: 0;
      max-height: none;
    }
    .summary-side {
      display: flex;
      flex-direction: column;
      gap: 10px;
    }
    .summary-side .summary-block-secondary.is-open,.summary-side .summary-block-debt-total.is-open {
      flex: 1 1 auto;
      display: flex;
      flex-direction: column;
      height: auto;
      min-height: 0;
      max-height: none;
      overflow: visible;
    }
    .summary-side .summary-block-secondary.is-open .summary-collapsible-body,.summary-side .summary-block-secondary.is-open .totals-list,.summary-side .summary-block-debt-total.is-open #allDebtTotals {
      flex: 1 1 auto;
      height: auto;
      min-height: 0;
      max-height: none;
      overflow: visible;
    }
  }
  @media (max-width: 760px) and (orientation: portrait) {
    .summary-grid,.summary-main-column,.summary-side,.summary-side .summary-block-secondary,.summary-side .summary-block-debt-total {
      align-self: auto;
      height: auto;
      max-height: none;
    }
  }
  .money-currency-select {
    padding-left: 6px;
    padding-right: 2px;
  }
  .row {
    padding-top: 7px;
    padding-bottom: 7px;
  }
  .summary-converted-prominent .combined-row,.summary-debt-converted .combined-row {
    justify-content: flex-end;
  }
  @media (max-width: 760px) and (orientation: portrait) {
    .summary-converted-prominent .combined-row,.summary-debt-converted .combined-row {
      justify-content: flex-start;
    }
  }
  @media (max-width: 760px) and (orientation: portrait) {
    .hazal-section {
      min-width: 0;
      overflow: visible;
    }
    .hazal-section-body,.hazal-list-card,.hazal-list-card .list-card-body,#hazalSabitTable,#hazalKrediKartiTable,#hazalKrediTable {
      width: 100%;
      min-width: 0;
      max-width: 100%;
    }
    #hazalSabitTable .table-head,#hazalKrediKartiTable .table-head,#hazalKrediTable .table-head {
      display: none;
    }
    #hazalSabitTable .table-body,#hazalKrediKartiTable .table-body,#hazalKrediTable .table-body {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    .hazal-list-card .add-row {
      width: 100%;
    }
  }
  .hazal-list-card .add-row,.hazal-section.is-not-included .hazal-list-card .add-row {
    background: var(--text);
    color: var(--card);
    -webkit-text-fill-color: var(--card);
    border-color: var(--text);
    opacity: 1;
  }
  .summary-actions .period-controls {
    display: inline-flex;
    align-items: center;
    gap: 1px;
    height: 30px;
    min-height: 30px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .summary-actions .period-controls .btn,.summary-actions .period-controls button {
    width: 25px;
    min-width: 25px;
    height: 30px;
    min-height: 30px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--muted);
    font-family: var(--font-ui);
    font-size: 19px;
    font-weight: 400;
    line-height: 1;
    box-shadow: none;
  }
  .summary-actions .period-controls input[type="month"] {
    width: 126px;
    height: 30px;
    min-height: 30px;
    padding: 0 3px;
    border: 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    background: transparent;
    color: var(--text);
    font-family: var(--font-ui);
    font-size: 12px;
    font-weight: 600;
    line-height: 30px;
    text-align: center;
    box-shadow: none;
  }
  @media (max-width: 760px) {
    .summary-actions .period-controls input[type="month"] {
      width: 116px;
    }
  }
  .summary-grid {
    grid-template-columns: minmax(0,1.48fr) minmax(320px,0.82fr);
  }
  .summary-block-primary,.summary-block-debt-total {
    height: auto;
    padding: 2px 0 0;
    border: 0;
    border-radius: 0;
    background: transparent;
  }
  .table-wide {
    overflow-x: auto;
  }
  .table-head,.table-body .row {
    min-width: var(--table-min-width,0px);
    column-gap: 8px;
  }
  @media (max-width: 980px) and (min-width: 761px) {
    .summary-grid {
      grid-template-columns: minmax(0,1.25fr) minmax(290px,.9fr);
    }
    .summary-block-primary,.summary-block-debt-total {
      padding: 9px;
    }
  }
  @media (max-width: 760px) and (orientation: portrait) {
    .summary-grid {
      grid-template-columns: minmax(0,1fr);
      gap: 8px;
    }
    .summary-block-primary,.summary-block-debt-total {
      padding: 9px;
    }
    .summary-top {
      align-items: start;
    }
    .summary-actions {
      width: auto;
      justify-content: flex-end;
    }
    .table-wide {
      overflow: visible;
    }
    .table-head {
      display: none;
    }
    .table-body {
      display: flex;
    }
    #sabitTable .row,#krediKartiTable .row,#krediTable .row,#borcTable .row,#hazalSabitTable .row,#hazalKrediKartiTable .row,#hazalKrediTable .row,.table-body .row {
      width: 100%;
      min-width: 0;
      display: grid;
      grid-template-columns: repeat(2,minmax(0,1fr));
      gap: 9px 10px;
      align-items: start;
      padding: 28px 8px 10px;
      border: 1px solid var(--line);
      border-radius: var(--radius-sm);
      background: transparent;
    }
    .row .cell {
      display: flex;
      flex-direction: column;
      gap: 3px;
      min-width: 0;
    }
    .row .cell-name,.row .cell.full,.row .cell.mobile-full {
      grid-column: 1 / -1;
    }
    .row .cell-label {
      display: block;
      color: var(--dim);
      font-family: var(--font-ui);
      font-size: 8px;
      font-weight: 600;
      line-height: 1.15;
      letter-spacing: .055em;
      text-transform: uppercase;
      white-space: normal;
    }
    .row input,.row select,.row .readonly-field {
      width: 100%;
      min-width: 0;
      min-height: 34px;
      padding: 6px 2px;
      border: 0;
      border-bottom: 1px solid var(--line);
      border-radius: 0;
      background: transparent;
      color: var(--text);
      font-size: 16px;
      box-shadow: none;
    }
    .row input[type="checkbox"] {
      width: 18px;
      height: 18px;
      min-width: 18px;
      min-height: 18px;
      padding: 0;
      border: 0;
    }
    .money-input-wrap {
      display: grid;
      grid-template-columns: 44px minmax(0,1fr);
      gap: 5px;
    }
    .money-input-wrap .money-currency-select {
      width: 44px;
      min-width: 44px;
    }
    .date-field-wrap {
      width: 100%;
      display: grid;
      grid-template-columns: minmax(0,1fr) 24px;
      gap: 4px;
    }
    .date-clear {
      width: 24px;
      height: 24px;
    }
  }
  @media (max-width: 380px) {
    #sabitTable .row,#krediKartiTable .row,#krediTable .row,#borcTable .row,#hazalSabitTable .row,#hazalKrediKartiTable .row,#hazalKrediTable .row,.table-body .row {
      grid-template-columns: minmax(0,1fr);
    }
    .row .cell,.row .cell-name,.row .cell.full,.row .cell.mobile-full {
      grid-column: 1;
    }
  }
  .summary-block-primary .monthly-total-toggle,.summary-block-debt-total>.summary-block-head {
    margin: 0 0 7px;
    padding: 0;
  }
  .summary-block-debt-total>.summary-block-head>div>span,.summary-block-debt-total .summary-debt-converted-title {
    display: none;
  }
  .summary-block-primary .summary-converted-controls,.summary-block-debt-total .summary-debt-converted {
    margin: 0;
    padding: 0;
  }
  .summary-block-primary .combined-row,.summary-block-debt-total .combined-row {
    margin: 0;
    padding: 0;
  }
  .summary-block-primary .summary-converted-prominent .combined-row,.summary-block-debt-total .summary-debt-converted .combined-row {
    justify-content: flex-start;
  }
  .summary-block-primary .combined-total-stack,.summary-block-debt-total .combined-total-stack {
    align-items: flex-start;
  }
  @media (max-width: 760px) {
    .summary-actions {
      width: 100%;
      justify-content: space-between;
      flex-wrap: nowrap;
    }
    .summary-grid {
      gap: 10px;
    }
    .summary-block-primary,.summary-block-debt-total {
      padding: 2px 0 0;
    }
    .table-body {
      gap: 0;
    }
    #sabitTable .row,#krediKartiTable .row,#krediTable .row,#borcTable .row,#hazalSabitTable .row,#hazalKrediKartiTable .row,#hazalKrediTable .row,.table-body .row {
      grid-template-columns: repeat(2,minmax(0,1fr));
      gap: 10px 12px;
      padding: 25px 2px 12px;
      border: 0;
      border-bottom: 1px solid var(--line);
      border-radius: 0;
      background: transparent;
    }
    .table-body .row:first-child {
      border-top: 0;
    }
    .row .cell {
      gap: 2px;
    }
    .row .cell-label {
      font-size: 8.5px;
      font-weight: 700;
      letter-spacing: .045em;
    }
    .row input,.row select,.row .readonly-field {
      min-height: 32px;
      padding: 5px 1px;
      font-size: 15px;
    }
    .row-menu-btn {
      top: 2px;
      right: 0;
    }
    .money-input-wrap {
      grid-template-columns: 42px minmax(0,1fr);
    }
    .money-input-wrap .money-currency-select {
      width: 42px;
      min-width: 42px;
    }
  }
  @media (max-width: 420px) {
    #sabitTable .row,#krediKartiTable .row,#krediTable .row,#borcTable .row,#hazalSabitTable .row,#hazalKrediKartiTable .row,#hazalKrediTable .row,.table-body .row {
      gap: 9px 10px;
    }
  }
  .summary-block-primary .summary-converted-prominent {
    gap: 0;
  }
  .summary-block-primary .monthly-total-toggle,.summary-block-debt-total>.summary-block-head {
    margin: 0;
    padding: 0;
  }
  .summary-block-primary .summary-converted-controls,.summary-block-debt-total .summary-debt-converted {
    margin: 0;
    padding: 7px 0 0;
  }
  .summary-block-primary .combined-row,.summary-block-debt-total .combined-row {
    margin: 0;
    padding: 0;
  }
  @media (max-width: 760px) {
    .summary-block-primary .summary-converted-controls,.summary-block-debt-total .summary-debt-converted {
      padding-top: 6px;
    }
  }
  .summary-card:not(.is-open) .forecast-borrowing-box {
    display: none;
  }
  #allDebtSimulationSelectionBar[hidden] {
    display: none;
  }
  .summary-block-debt-total .summary-debt-converted {
    padding-bottom: 8px;
  }
  .list-collapse-all-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 26px;
    padding: 3px 5px 3px 8px;
    border: 0;
    background: transparent;
    color: var(--muted);
    font-family: var(--font-label);
    font-size: 8px;
    font-weight: 600;
    letter-spacing: .065em;
    text-transform: uppercase;
  }
  .list-collapse-all-btn .summary-collapse-mark {
    width: 20px;
    height: 20px;
    margin: 0;
    border-radius: var(--radius-sm);
    background: color-mix(in srgb,var(--muted) 9%,transparent);
    color: currentColor;
    font-size: 12px;
  }
  .owner-section-toggle,.main-owner-collapse-btn {
    width: 30px;
    height: 30px;
    min-width: 30px;
    padding: 0;
    border: 0;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--main-owner-accent-strong);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: end;
  }
  .owner-section-toggle .summary-collapse-mark,.main-owner-collapse-btn .summary-collapse-mark {
    width: 22px;
    height: 22px;
    margin: 0;
    border-radius: var(--radius-sm);
    background: color-mix(in srgb,var(--main-owner-accent) 15%,transparent);
    color: currentColor;
    font-size: 14px;
  }
  .hazal-title-block {
    align-self: center;
  }
  .hazal-title {
    margin: 0;
  }
  @media (max-width: 760px) {
    .summary-card:not(.is-open) .summary-utility-row {
      display: none;
      height: 0;
      min-height: 0;
      margin: 0;
      padding: 0;
      overflow: hidden;
    }
  }
  .main-owner-section,.hazal-section {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    min-width: 0;
    margin: 8px 0 10px;
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .main-owner-section-head,.hazal-section-head {
    width: 100%;
    min-width: 0;
    min-height: 22px;
    margin: 0 0 3px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-sizing: border-box;
  }
  .main-owner-section-head {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    align-items: center;
    gap: 8px;
  }
  .hazal-section-head {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto auto;
    align-items: center;
    gap: 8px;
  }
  .owner-title-block,.hazal-title-block {
    min-width: 0;
    align-self: center;
  }
  .owner-title,.hazal-title {
    display: block;
    min-width: 0;
    margin: 0;
    color: var(--text);
    font-family: var(--font-title);
    font-size: 17px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: -.025em;
    white-space: nowrap;
  }
  .main-owner-section-body,.hazal-section-body {
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    background: transparent;
    box-sizing: border-box;
  }
  .main-owner-section .list-card-body,.hazal-section .list-card-body {
    padding-top: 4px;
  }
  .main-owner-section-body[hidden],.hazal-section-body[hidden],.list-card-body[hidden] {
    display: none;
  }
  .main-owner-section .list-card,.hazal-section .list-card,.hazal-list-card {
    margin: 0 0 5px;
    padding: 6px 0 0;
    overflow: visible;
    border: 0;
    border-top: 1px solid var(--border);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .main-owner-section .list-card:last-child,.hazal-section .list-card:last-child,.hazal-list-card:last-child {
    margin-bottom: 0;
  }
  .main-owner-section .list-card-head,.hazal-section .list-card-head,.hazal-static-head {
    min-height: 18px;
    margin: 0;
    padding: 0 2px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-sizing: border-box;
    align-items: center;
  }
  .main-owner-section .list-card-title,.hazal-section .hazal-static-head h2,.hazal-section .list-card-head h2 {
    margin: 0;
    color: var(--muted);
    font-family: var(--font-label);
    font-size: 9px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: .075em;
    text-transform: uppercase;
  }
  .hazal-switch {
    gap: 6px;
    color: var(--muted);
    font-size: 8px;
    font-weight: 600;
    letter-spacing: .065em;
  }
  .hazal-switch-track {
    width: 24px;
    height: 14px;
    border: 1px solid color-mix(in srgb,var(--text) 14%,var(--border));
    border-radius: 999px;
    background: color-mix(in srgb,var(--muted) 18%,var(--card));
    box-shadow: none;
  }
  .hazal-switch-thumb {
    top: 1px;
    left: 1px;
    width: 10px;
    height: 10px;
    background: color-mix(in srgb,white 90%,var(--card));
    box-shadow: none;
    transition: transform 0.18s ease, background 0.18s ease;
  }
  .hazal-switch input:checked + .hazal-switch-track {
    background: color-mix(in srgb,var(--text) 84%,var(--card));
    border-color: color-mix(in srgb,var(--text) 24%,var(--border));
  }
  .hazal-switch input:checked + .hazal-switch-track .hazal-switch-thumb {
    transform: translateX(10px);
    background: var(--card);
  }
  .hazal-switch input:checked ~ .hazal-switch-label {
    color: var(--text);
  }
  .app .summary-collapse-mark,.app .hazal-collapse-mark,.app .owner-collapse-mark,.app .forecast-payment-toggle>.summary-collapse-mark,.app .due-tracker-toggle .summary-collapse-mark,.app .summary-block-toggle>.summary-collapse-mark,.app .summary-section-toggle .summary-collapse-mark,.app .list-card-collapse-btn .summary-collapse-mark,.app .main-owner-collapse-btn .summary-collapse-mark,.app .hazal-collapse-btn .summary-collapse-mark,.app .list-collapse-all-btn .summary-collapse-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    min-width: 20px;
    min-height: 20px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--muted);
    box-shadow: none;
    font-family: var(--font-num);
    font-size: 12px;
    font-weight: 400;
    line-height: 1;
    text-align: center;
  }
  .app :is( .summary-section-toggle,.list-card-collapse-btn,.owner-section-toggle,.main-owner-collapse-btn,.hazal-section-toggle,.hazal-collapse-btn ) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    min-width: 28px;
    min-height: 28px;
    margin: 0;
    padding: 4px;
    border: 0;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--muted);
    box-shadow: none;
  }
  .app .list-collapse-all-btn {
    border: 0;
    background: transparent;
    color: var(--muted);
    box-shadow: none;
  }
  @media (max-width: 760px) and (orientation: portrait) {
    .main-owner-section-head,.hazal-section-head {
      min-height: 20px;
      margin-bottom: 3px;
      padding: 0;
    }
    .hazal-section-head {
      grid-template-columns: minmax(0,1fr) auto auto;
      gap: 6px;
    }
    .hazal-switch {
      min-width: 0;
      gap: 5px;
      font-size: 7px;
      letter-spacing: .05em;
    }
    .hazal-switch-label {
      white-space: nowrap;
    }
    .owner-title,.hazal-title {
      font-size: 16px;
    }
  }
  .hazal-section {
    margin-top: 0;
    padding-top: 10px;
    border-top: 1px solid var(--border);
    background: transparent;
    box-shadow: none;
  }
  .owner-title,.hazal-title {
    display: inline-flex;
    align-items: center;
    gap: 7px;
  }
  .app .summary-section-toggle .summary-collapse-mark,.app .list-collapse-all-btn .summary-collapse-mark {
    border-color: color-mix(in srgb,var(--text) 24%,var(--border));
    background: color-mix(in srgb,var(--text) 12%,var(--card));
    color: var(--text);
  }
  .app .main-owner-collapse-btn .summary-collapse-mark,.app .hazal-collapse-btn .summary-collapse-mark,.app .owner-section-toggle .summary-collapse-mark,.app .hazal-section-toggle .summary-collapse-mark {
    border-color: color-mix(in srgb,var(--section-accent) 28%,var(--border));
    background: color-mix(in srgb,var(--section-accent) 14%,transparent);
    color: color-mix(in srgb,var(--section-accent) 72%,var(--text));
  }
  .app .forecast-payment-toggle>.summary-collapse-mark,.app .due-tracker-toggle .summary-collapse-mark,.app .summary-block-toggle>.summary-collapse-mark {
    border-color: color-mix(in srgb,var(--text) 17%,var(--border));
    background: color-mix(in srgb,var(--muted) 8%,transparent);
    color: color-mix(in srgb,var(--text) 70%,var(--muted));
  }
  .app .list-card-collapse-btn .summary-collapse-mark,.app .list-card-toggle .summary-collapse-mark {
    border-color: color-mix(in srgb,var(--text) 10%,var(--border));
    background: color-mix(in srgb,var(--muted) 3%,transparent);
    color: var(--muted);
  }
  .app .main-owner-collapse-btn .summary-collapse-mark,.app .owner-section-toggle .summary-collapse-mark {
    border-color: var(--section-accent);
    background: var(--section-accent);
    color: color-mix(in srgb,white 94%,var(--card));
  }
  .app .hazal-collapse-btn .summary-collapse-mark,.app .hazal-section-toggle .summary-collapse-mark {
    border-color: var(--section-accent);
    background: var(--section-accent);
    color: color-mix(in srgb,white 94%,var(--card));
    line-height: 1;
    transform: translateY(-.25px);
  }
  .app .main-owner-section .list-card-collapse-btn .summary-collapse-mark,.app .main-owner-section .list-card-toggle .summary-collapse-mark {
    border-color: color-mix(in srgb,var(--section-accent) 42%,var(--border));
    background: transparent;
    color: color-mix(in srgb,var(--section-accent) 78%,var(--text));
  }
  .app .hazal-section .list-card-collapse-btn .summary-collapse-mark,.app .hazal-section .list-card-toggle .summary-collapse-mark {
    border-color: color-mix(in srgb,var(--section-accent) 42%,var(--border));
    background: transparent;
    color: color-mix(in srgb,var(--section-accent) 78%,var(--text));
  }
  .app .hazal-collapse-btn .summary-collapse-mark,.app .hazal-section-toggle .summary-collapse-mark,.app .hazal-collapse-btn:hover .summary-collapse-mark,.app .hazal-section-toggle:hover .summary-collapse-mark,.app .hazal-collapse-btn:focus-visible .summary-collapse-mark,.app .hazal-section-toggle:focus-visible .summary-collapse-mark {
    color: #2f2925;
  }
  [data-theme="dark"] .app .hazal-collapse-btn .summary-collapse-mark,[data-theme="dark"] .app .hazal-section-toggle .summary-collapse-mark,[data-theme="dark"] .app .hazal-collapse-btn:hover .summary-collapse-mark,[data-theme="dark"] .app .hazal-section-toggle:hover .summary-collapse-mark,[data-theme="dark"] .app .hazal-collapse-btn:focus-visible .summary-collapse-mark,[data-theme="dark"] .app .hazal-section-toggle:focus-visible .summary-collapse-mark {
    color: #211c19;
  }
  @media (max-width: 760px) {
    .list-collapse-all-bar {
      min-height: 30px;
      margin-bottom: 5px;
    }
    .list-collapse-all-bar .list-collapse-all-label {
      font-size: 8px;
      letter-spacing: .08em;
    }
    .list-card-head .column-toggle {
      min-height: 28px;
      height: 28px;
      padding: 0 8px;
      border-radius: var(--radius-md);
      font-size: 10px;
    }
    .main-owner-section .list-card,.hazal-section .list-card,.hazal-list-card {
      padding-top: 3px;
    }
    .main-owner-section .list-card-body,.hazal-section .list-card-body {
      padding-inline: 0;
    }
    .table-body {
      display: flex;
      flex-direction: column;
      gap: 0;
    }
    #sabitTable .row,#krediKartiTable .row,#krediTable .row,#borcTable .row,#hazalSabitTable .row,#hazalKrediKartiTable .row,#hazalKrediTable .row,.table-body .row {
      width: 100%;
      min-width: 0;
      display: grid;
      grid-template-columns: repeat(2,minmax(0,1fr));
      column-gap: 12px;
      row-gap: 7px;
      align-items: start;
      margin: 0;
      padding: 0;
      border: 0;
      border-bottom: 1px solid color-mix(in srgb,var(--text) 11%,var(--border));
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      overflow: visible;
    }
    .table-body .row:last-child {
      border-bottom: 0;
    }
    .table-body .row>.cell {
      display: none;
    }
    .table-body .row::before {
      display: none;
    }
    .mobile-row-toggle {
      order: 0;
      grid-column: 1 / -1;
      width: 100%;
      min-width: 0;
      min-height: 56px;
      display: grid;
      grid-template-columns: minmax(0,1fr) auto 18px;
      gap: 9px;
      align-items: center;
      margin: 0;
      padding: 9px 2px;
      border: 0;
      border-radius: 0;
      background: transparent;
      color: var(--text);
      text-align: left;
      box-shadow: none;
      cursor: pointer;
    }
    .mobile-row-summary-copy {
      min-width: 0;
      display: grid;
      gap: 4px;
    }
    .mobile-row-summary-name {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: var(--text);
      font-family: var(--font-title);
      font-size: 15.5px;
      font-weight: 600;
      line-height: 1.12;
      letter-spacing: -.015em;
    }
    .mobile-row-summary-meta {
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 7px;
      color: var(--muted);
      font-family: var(--font-label);
      font-size: 8px;
      font-weight: 600;
      line-height: 1.1;
      letter-spacing: .055em;
      text-transform: uppercase;
      white-space: nowrap;
    }
    .mobile-row-summary-due.is-missing {
      color: var(--dim);
    }
    .mobile-row-summary-amount {
      justify-self: end;
      max-width: 42vw;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: var(--text);
      font-family: var(--font-num);
      font-size: 15px;
      font-weight: 400;
      line-height: 1;
      letter-spacing: -.018em;
    }
    .mobile-row-summary-chevron {
      width: 18px;
      height: 18px;
      display: grid;
      place-items: center;
      border: 1px solid color-mix(in srgb,var(--text) 12%,var(--border));
      border-radius: var(--radius-md);
      color: var(--muted);
      font-family: var(--font-ui);
      font-size: 15px;
      font-weight: 400;
      line-height: 1;
      transform: rotate(0deg);
      transition: transform .14s ease,background-color .14s ease;
    }
    .table-body .row.is-mobile-expanded .mobile-row-summary-chevron {
      transform: rotate(90deg);
      background: color-mix(in srgb,var(--text) 5%,transparent);
      color: var(--text);
    }
    .table-body .row.is-mobile-expanded {
      padding-bottom: 11px;
    }
    .table-body .row.is-mobile-expanded>.cell {
      display: flex;
    }
    .table-body .row.is-mobile-expanded>.cell-checkbox {
      display: grid;
    }
    .table-body .row.is-mobile-expanded::before {
      order: 20;
      grid-column: 1 / -1;
      display: block;
      height: 0;
      margin: 0;
      border-top: 1px solid color-mix(in srgb,var(--text) 7%,var(--border));
    }
    .table-body .row .cell {
      order: 40;
      min-width: 0;
      gap: 2px;
    }
    .table-body .row .cell-name {
      order: 5;
      grid-column: 1 / -1;
      min-width: 0;
      margin: 0;
    }
    .table-body .row .cell.mobile-full:not(.cell-name):not(.cell-note) {
      grid-column: auto;
    }
    .table-body .row .cell-label,.table-body .row .cell-name>.cell-label {
      display: block;
      color: var(--dim);
      font-family: var(--font-label);
      font-size: 7.5px;
      font-weight: 700;
      line-height: 1.1;
      letter-spacing: .065em;
      text-transform: uppercase;
      white-space: normal;
    }
    .table-body .row .name-field-wrap {
      min-height: 28px;
      padding-right: 28px;
    }
    .table-body .row .name-field-wrap>input {
      min-height: 28px;
      padding: 3px 0;
      border: 0;
      border-bottom: 1px solid color-mix(in srgb,var(--text) 12%,var(--border));
      background: transparent;
      color: var(--text);
      font-family: var(--font-ui);
      font-size: 14px;
      font-weight: 600;
      line-height: 1.15;
      box-shadow: none;
    }
    .table-body .row .row-menu-btn {
      top: 1px;
      right: 0;
      width: 24px;
      height: 24px;
      min-width: 24px;
      min-height: 24px;
      padding: 0;
      transform: none;
      border: 0;
      border-radius: var(--radius-md);
      background: transparent;
      color: var(--muted);
      font-size: 17px;
      line-height: 1;
    }
    .table-body .row .row-menu-btn:hover,.table-body .row.row-menu-open .row-menu-btn {
      background: color-mix(in srgb,var(--muted) 7%,transparent);
      color: var(--text);
    }
    .table-body .row input,.table-body .row select,.table-body .row .readonly-field {
      width: 100%;
      min-width: 0;
      min-height: 28px;
      padding: 3px 1px;
      border: 0;
      border-bottom: 1px solid color-mix(in srgb,var(--text) 12%,var(--border));
      border-radius: 0;
      background: transparent;
      color: var(--text);
      font-size: 14px;
      line-height: 1.15;
      box-shadow: none;
    }
    .table-body .row input[type="number"],.table-body .row .readonly-field {
      font-family: var(--font-num);
      text-align: right;
    }
    .table-body .row input[type="date"] {
      font-family: var(--font-num);
      font-size: 13px;
      text-align: left;
    }
    .table-body .row .money-input-wrap {
      display: grid;
      grid-template-columns: 34px minmax(0,1fr);
      gap: 5px;
      align-items: end;
    }
    .table-body .row .money-input-wrap .money-currency-select {
      width: 34px;
      min-width: 34px;
      min-height: 28px;
      padding-inline: 1px;
      font-size: 12px;
      text-align: center;
      text-align-last: center;
    }
    .table-body .row .date-field-wrap {
      width: 100%;
      display: grid;
      grid-template-columns: minmax(0,1fr) 21px;
      gap: 3px;
      align-items: end;
    }
    .table-body .row .date-clear {
      width: 21px;
      height: 21px;
      min-width: 21px;
      min-height: 21px;
      align-self: center;
    }
    .table-body .row .cell-checkbox {
      grid-template-columns: minmax(0,1fr) auto;
      align-items: center;
      gap: 7px;
      min-height: 28px;
      padding: 2px 0;
    }
    .table-body .row .cell-checkbox .cell-label {
      align-self: center;
    }
    .table-body .row .cell-checkbox input[type="checkbox"] {
      justify-self: end;
      width: 15px;
      height: 15px;
      min-width: 15px;
      min-height: 15px;
      margin: 0;
      padding: 0;
      border: 0;
    }
    .table-body .row[data-cat="sabit"] .cell-amount,.table-body .row[data-cat="hazalSabit"] .cell-amount {
      order: 10;
    }
    .table-body .row[data-cat="sabit"] .cell-vadeTarihi,.table-body .row[data-cat="hazalSabit"] .cell-vadeTarihi {
      order: 11;
    }
    .table-body .row[data-cat="sabit"] .cell-recurring,.table-body .row[data-cat="hazalSabit"] .cell-recurring {
      order: 30;
    }
    .table-body .row[data-cat="sabit"] .cell-dynamicAmount,.table-body .row[data-cat="hazalSabit"] .cell-dynamicAmount {
      order: 31;
    }
    .table-body .row :is( .cell-amount,.cell-asgariOdemeTutari,.cell-buAyOdenecek,.cell-kalanTaksit ) :is(input,select,.readonly-field) {
      font-weight: 600;
    }
  }
  .due-tracker-chip>small,.due-tracker-urgent-list {
    display: none;
  }
  .selection-panel[hidden] {
    display: none;
  }
  #projectionChart .projection-row {
    grid-template-columns: 58px minmax(0,1fr) minmax(96px,auto);
    grid-template-areas: "month track amount" ". original original";
  }
  #projectionChart .projection-month-select {
    position: absolute;
    left: 0;
    top: 50%;
    width: 12px;
    height: 12px;
    margin: 0;
  }
  .main-owner-section .list-card-head,.hazal-section .list-card-head,.hazal-section .hazal-static-head {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto 28px;
    align-items: center;
    gap: 6px;
    min-height: 32px;
  }
  .main-owner-section .list-card-title,.hazal-section .list-card-title,.hazal-section .hazal-static-head h2 {
    grid-column: 1;
    margin: 0;
  }
  .main-owner-section .column-toggle,.hazal-section .column-toggle {
    grid-column: 2;
    justify-self: end;
  }
  .main-owner-section .list-card-collapse-btn,.hazal-section .list-card-collapse-btn {
    grid-column: 3;
    justify-self: end;
    align-self: center;
    width: 28px;
    min-width: 28px;
    height: 28px;
    min-height: 28px;
    margin: 0;
    padding: 0;
  }
  @media (max-width: 760px) {
    .summary-top {
      display: grid;
      grid-template-columns: minmax(0,1fr) auto auto;
      align-items: center;
      gap: 6px;
    }
    .summary-actions {
      display: contents;
    }
    .summary-card:not(.is-open) .summary-utility-row,.summary-card.is-open .summary-utility-row,.summary-utility-row {
      display: grid;
      grid-template-columns: minmax(0,1fr);
      height: auto;
      min-height: 0;
      overflow: visible;
      gap: 6px;
      margin: 8px 0 7px;
      padding: 7px 0 0;
      border-top: 1px solid var(--line);
    }
    .summary-utility-row>.forecast-payment-box,.summary-utility-row>.forecast-borrowing-box,.summary-utility-row>.forecast-payment-box.is-open,.summary-utility-row>.forecast-borrowing-box.is-open {
      grid-column: 1;
      grid-row: auto;
      width: 100%;
      max-width: none;
      min-width: 0;
      margin: 0;
      align-self: stretch;
    }
    #projectionChart .projection-row {
      grid-template-columns: 52px minmax(0,1fr);
      grid-template-areas: "month amount" "track track" "original original";
      padding: 6px 7px;
    }
    #projectionChart .projection-month-select {
      inset: 0;
      width: 100%;
      height: 100%;
      transform: none;
      opacity: 0;
    }
    #projectionChart .projection-amount,#projectionChart .projection-original {
      text-align: left;
    }
  }
  .projection-selection-summary {
    padding: 5px 7px;
    margin: 5px 0 6px;
  }
  .main-owner-section .list-card-head,.hazal-section .list-card-head {
    grid-template-columns: minmax(0,1fr) auto 28px;
    min-height: 32px;
  }
  .main-owner-section .list-card-collapse-btn,.hazal-section .list-card-collapse-btn {
    grid-column: 3;
    width: 28px;
    min-width: 28px;
    height: 28px;
    min-height: 28px;
    justify-self: end;
    align-self: center;
    margin: 0;
    padding: 0;
  }
  @media (max-width: 760px) {
    .summary-utility-row {
      grid-auto-flow: row;
      align-items: start;
    }
    .summary-utility-row>.forecast-payment-box,.summary-utility-row>.forecast-borrowing-box,.summary-utility-row>.forecast-payment-box.is-open,.summary-utility-row>.forecast-borrowing-box.is-open {
      position: static;
      transform: none;
      grid-column: 1;
      grid-row: auto;
      width: 100%;
      max-width: none;
      min-width: 0;
      margin: 0;
      align-self: stretch;
    }
  }
  .period-label-main.period-label-toggle {
    font-family: var(--font-title);
    font-size: clamp(28px,3vw,34px);
    font-weight: 700;
    line-height: .98;
    letter-spacing: -.035em;
    text-transform: none;
  }
  .projection-chart-wrap[data-months="12"],.projection-chart-wrap[data-months="24"] {
    height: 214px;
    min-height: 214px;
    scrollbar-gutter: auto;
  }
  /* 6 aylik ufuk tam sigar: kirpma da fade de yok, fade yalnizca 12 ve 24 ayda hissedilir. */
  .projection-chart-wrap[data-months="6"] {
    height: auto;
    min-height: 0;
    max-height: none;
    scrollbar-gutter: auto;
  }
  @media (max-width: 760px) {
    .period-label-main.period-label-toggle {
      font-size: clamp(26px,8.4vw,31px);
      line-height: 1;
    }
    .projection-chart-wrap[data-months="12"],.projection-chart-wrap[data-months="24"] {
      height: 244px;
      min-height: 244px;
    }
    .projection-chart-wrap[data-months="6"] {
      height: auto;
      min-height: 0;
      max-height: none;
    }
  }
  .month-bridge-panel[hidden] {
    display: none;
  }
  [data-theme="dark"] .add-row,[data-theme="dark"] .hazal-list-card .add-row,[data-theme="dark"] .hazal-section.is-not-included .hazal-list-card .add-row {
    background: color-mix(in srgb,var(--text) 12%,var(--card));
    color: color-mix(in srgb,var(--text) 78%,var(--muted));
    -webkit-text-fill-color: color-mix(in srgb,var(--text) 78%,var(--muted));
    border-color: color-mix(in srgb,var(--text) 18%,var(--border));
    box-shadow: none;
  }
  .hazal-section.is-not-included {
    box-shadow: none;
  }
  .hazal-section.is-not-included .hazal-section-body {
    filter: none;
  }
  #mainApp .summary-card,#mainApp .list-card,#mainApp .hazal-list-card,#mainApp .due-tracker-box {
    border: 0;
    box-shadow: none;
  }
  #mainApp .list-card,#mainApp .hazal-list-card {
    border-top: 0;
  }
  #mainApp .list-card .row input:not([type="checkbox"]),#mainApp .list-card .row select,#mainApp .list-card .row .readonly-field,#mainApp .list-card .money-input-wrap,#mainApp .list-card .date-field-wrap {
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  #mainApp .list-card .row input:not([type="checkbox"]),#mainApp .list-card .row select,#mainApp .list-card .row .readonly-field {
    padding-left: 2px;
    padding-right: 2px;
  }
  #mainApp .list-card .date-clear {
    border: 0;
    background: transparent;
    box-shadow: none;
  }
  @media (max-width: 760px) {
    #mainApp .list-card .row input:not([type="checkbox"]),#mainApp .list-card .row select,#mainApp .list-card .row .readonly-field {
      min-height: 32px;
      padding-top: 5px;
      padding-bottom: 5px;
    }
  }
  .app-header-title,.auth-display {
    font-family: "proxima-nova-extra-wide","Arial Black",sans-serif;
  }
  .app-header-eyebrow,.app-header-meta,.auth-title,.auth-version {
    font-family: "nitti",ui-monospace,"SF Mono",monospace;
  }
}
@layer overrides {
  #monthlyTotals .total-item:is(.monthly-due-overdue,.monthly-due-today,.monthly-due-tomorrow,.monthly-due-neutral) {
    position: relative;
    padding-left: 10px;
  }
  #monthlyTotals .total-item:is(.monthly-due-overdue,.monthly-due-today,.monthly-due-tomorrow,.monthly-due-neutral):before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    bottom: 6px;
    width: 2px;
    border-radius: 999px;
    background: var(--line);
  }
  #monthlyTotals .total-item.monthly-due-overdue:before {
    background: var(--red);
  }
  #monthlyTotals .total-item:is(.monthly-due-today,.monthly-due-tomorrow):before {
    background: var(--warning);
  }
  #monthlyTotals .monthly-item-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
  }
  #monthlyTotals .monthly-item-main {
    display: block;
    min-width: 0;
    color: inherit;
  }
  #monthlyTotals .monthly-item-due {
    display: block;
    min-width: 0;
    margin: 0;
    color: var(--dim);
    font-family: var(--font-label);
    font-size: 7.5px;
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: .045em;
    white-space: nowrap;
  }
  #monthlyTotals .monthly-item-due-overdue {
    color: var(--red);
  }
  #monthlyTotals .monthly-item-due:is(.monthly-item-due-today,.monthly-item-due-tomorrow) {
    color: var(--warning);
  }
  #monthlyTotals .due-pill {
    display: none;
  }
  @media (max-width:760px) {
    #monthlyTotals .monthly-item-due {
      font-size: 7px;
    }
  }
}

@layer overrides {
  #lockScreen > #lockThemeToggle.auth-theme-toggle {
    position: fixed;
    top: calc(env(safe-area-inset-top,0px) + 12px);
    right: max(12px,env(safe-area-inset-right,0px));
    z-index: 100001;
  }
}

@layer overrides {
  /* Normalize disclosure toggles */
  .list-card-toggle,.list-card-collapse-btn,.summary-block-toggle,.summary-section-toggle,.main-owner-collapse-btn,.hazal-section-toggle,.due-tracker-toggle {
    min-width: 32px;
    min-height: 32px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .summary-collapse-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    font-size: 16px;
    line-height: 1;
  }

  /* System-independent checkbox language */
  :is(.monthly-paid-toggle,.monthly-select-toggle,.all-debt-sim-select,#projectionChart .projection-month-select,.due-tracker-switch input,.plan-linked-option-control>input,.plan-option-row input[type="checkbox"],#planTransferPaymentRemainder,#planPurchaseUseCash) {
    appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    min-width: 18px;
    min-height: 18px;
    margin: 0;
    position: relative;
    display: inline-grid;
    place-content: center;
    border: 1px solid color-mix(in srgb,var(--text) 28%,var(--border));
    border-radius: 6px;
    background: color-mix(in srgb,var(--surface) 94%,var(--bg));
    box-shadow: inset 0 -1px 0 color-mix(in srgb,var(--text) 8%,transparent);
    cursor: pointer;
    transition: background .15s ease,border-color .15s ease,box-shadow .15s ease,transform .15s ease;
  }
  :is(.monthly-paid-toggle,.monthly-select-toggle,.all-debt-sim-select,#projectionChart .projection-month-select,.due-tracker-switch input,.plan-linked-option-control>input,.plan-option-row input[type="checkbox"],#planTransferPaymentRemainder,#planPurchaseUseCash)::after {
    content: "";
    width: 5px;
    height: 9px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(45deg) scale(0);
    transform-origin: center;
    transition: transform .14s ease;
  }
  :is(.monthly-paid-toggle,.monthly-select-toggle,.all-debt-sim-select,#projectionChart .projection-month-select,.due-tracker-switch input,.plan-linked-option-control>input,.plan-option-row input[type="checkbox"],#planTransferPaymentRemainder,#planPurchaseUseCash):checked {
    border-color: var(--text);
    background: var(--text);
    box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--surface) 10%,transparent);
  }
  :is(.monthly-paid-toggle,.monthly-select-toggle,.all-debt-sim-select,#projectionChart .projection-month-select,.due-tracker-switch input,.plan-linked-option-control>input,.plan-option-row input[type="checkbox"],#planTransferPaymentRemainder,#planPurchaseUseCash):checked::after {
    transform: rotate(45deg) scale(1);
  }
  :is(.monthly-paid-toggle,.monthly-select-toggle,.all-debt-sim-select,#projectionChart .projection-month-select,.due-tracker-switch input,.plan-linked-option-control>input,.plan-option-row input[type="checkbox"],#planTransferPaymentRemainder,#planPurchaseUseCash):focus-visible {
    outline: 2px solid color-mix(in srgb,var(--text) 38%,transparent);
    outline-offset: 2px;
  }
  @media (max-width:760px) {
    :is(.monthly-paid-toggle,.monthly-select-toggle,.all-debt-sim-select,#projectionChart .projection-month-select,.due-tracker-switch input,.plan-linked-option-control>input,.plan-option-row input[type="checkbox"],#planTransferPaymentRemainder,#planPurchaseUseCash) {
      width: 19px;
      height: 19px;
      min-width: 19px;
      min-height: 19px;
    }
  }

  /* Due tracker color language */
  .due-tracker-chip {
    transition: background .15s ease,border-color .15s ease,box-shadow .15s ease;
  }
  .due-tracker-chip-overdue {
    background: color-mix(in srgb,var(--red) 10%,var(--surface));
    box-shadow: inset 0 2px 0 color-mix(in srgb,var(--red) 58%,transparent);
  }
  .due-tracker-chip-today {
    background: color-mix(in srgb,var(--warning) 10%,var(--surface));
    box-shadow: inset 0 2px 0 color-mix(in srgb,var(--warning) 62%,transparent);
  }
  .due-tracker-chip-tomorrow {
    background: color-mix(in srgb,var(--orange) 8%,var(--surface));
    box-shadow: inset 0 2px 0 color-mix(in srgb,var(--orange) 54%,transparent);
  }
  .due-tracker-chip-overdue > span,.due-tracker-chip-overdue > strong {
    color: var(--red);
  }
  .due-tracker-chip-today > span,.due-tracker-chip-today > strong {
    color: color-mix(in srgb,var(--warning) 78%,var(--text));
  }
  .due-tracker-chip-tomorrow > span,.due-tracker-chip-tomorrow > strong {
    color: color-mix(in srgb,var(--orange) 78%,var(--text));
  }

  /* Monthly ledger due-state emphasis */
  #monthlyTotals .monthly-item-due {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 2px 6px;
    border-radius: 999px;
    background: color-mix(in srgb,var(--muted) 10%,transparent);
    letter-spacing: .055em;
  }
  #monthlyTotals .monthly-item-due-overdue {
    background: color-mix(in srgb,var(--red) 11%,transparent);
    color: var(--red);
  }
  #monthlyTotals .monthly-item-due:is(.monthly-item-due-today,.monthly-item-due-tomorrow) {
    background: color-mix(in srgb,var(--warning) 12%,transparent);
    color: color-mix(in srgb,var(--warning) 82%,var(--text));
  }
  #monthlyTotals .total-item.monthly-due-overdue .monthly-item-main {
    color: color-mix(in srgb,var(--red) 82%,var(--text));
  }
  #monthlyTotals .total-item:is(.monthly-due-today,.monthly-due-tomorrow) .monthly-item-main {
    color: color-mix(in srgb,var(--warning) 82%,var(--text));
  }

  /* Selected items panel cleanup */
  .selection-panel-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid color-mix(in srgb,var(--border) 74%,transparent);
  }
  .selection-panel-title {
    min-width: 0;
  }
  .selection-panel-title strong {
    display: block;
    margin-top: 3px;
  }
  .selection-panel-actions {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
  }
  .monthly-selected-list {
    display: grid;
    gap: 8px;
    padding-top: 10px;
    max-height: 260px;
    overflow: auto;
  }
  .monthly-selected-item {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 10px 12px;
    align-items: start;
    padding: 10px 12px;
    border: 1px solid color-mix(in srgb,var(--border) 76%,transparent);
    border-radius: var(--radius-md);
    background: color-mix(in srgb,var(--surface) 88%,var(--bg));
  }
  .monthly-selected-item > span {
    display: grid;
    gap: 3px;
    min-width: 0;
  }
  .monthly-selected-item em {
    color: var(--muted);
    font-size: 10px;
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: .05em;
  }
  .monthly-selected-item b {
    min-width: 0;
    font-size: 15px;
    line-height: 1.25;
  }
  .monthly-selected-item small {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.3;
  }
  .monthly-selected-item strong {
    align-self: center;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
  }
  @media (max-width:760px) {
    .selection-panel-head {
      flex-direction: column;
      align-items: stretch;
    }
    .selection-panel-actions {
      justify-content: flex-start;
    }
    .monthly-selected-item {
      grid-template-columns: 1fr;
    }
    .monthly-selected-item strong {
      justify-self: start;
    }
  }

  /* Stronger dashboard simulation communication */
  .simulation-banner {
    min-height: 50px;
    padding: 10px 12px;
    border-radius: 12px;
    background: color-mix(in srgb,var(--warning) 14%,var(--surface));
    border-color: color-mix(in srgb,var(--warning) 60%,var(--border));
    box-shadow: inset 0 2px 0 color-mix(in srgb,var(--warning) 74%,transparent);
  }
  .simulation-banner-copy {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
  }
  .simulation-banner-dot {
    flex: 0 0 9px;
    width: 9px;
    height: 9px;
    margin-top: 4px;
    border-radius: 999px;
    background: var(--warning);
    box-shadow: 0 0 0 4px color-mix(in srgb,var(--warning) 18%,transparent);
    animation: simulationPulse 1.8s ease-in-out infinite;
  }
  .simulation-banner-copy strong {
    display: block;
    margin: 0 0 2px;
    font-size: 10px;
    letter-spacing: .07em;
    text-transform: uppercase;
  }
  #simulationBannerText {
    display: block;
    color: var(--text);
    font-size: 13px;
    line-height: 1.35;
  }
  .simulation-banner-clear {
    flex: 0 0 auto;
    min-height: 32px;
    padding: 0 12px;
    border: 1px solid color-mix(in srgb,var(--warning) 46%,var(--border));
    border-radius: 999px;
    background: color-mix(in srgb,var(--surface) 92%,var(--warning) 8%);
  }
  .summary-card.simulation-active,
  #monthlySummaryBlock.simulation-affected,
  #allDebtSummaryBlock.simulation-affected,
  #projectionSummaryBlock.simulation-affected {
    position: relative;
    box-shadow: inset 3px 0 0 color-mix(in srgb,var(--warning) 78%,transparent);
    background: color-mix(in srgb,var(--warning) 4%,var(--surface));
  }
  #monthlySummaryBlock.simulation-affected::after,
  #allDebtSummaryBlock.simulation-affected::after,
  #projectionSummaryBlock.simulation-affected::after {
    content: "Simülasyon";
    position: absolute;
    top: 10px;
    right: 10px;
    padding: 3px 7px;
    border-radius: 999px;
    background: color-mix(in srgb,var(--warning) 14%,var(--surface));
    border: 1px solid color-mix(in srgb,var(--warning) 38%,var(--border));
    color: color-mix(in srgb,var(--warning) 84%,var(--text));
    font-family: var(--font-label);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    pointer-events: none;
  }
  .projection-simulation-badge {
    padding: 4px 8px;
    border-radius: 999px;
    background: color-mix(in srgb,var(--warning) 12%,var(--surface));
    border-color: color-mix(in srgb,var(--warning) 42%,var(--border));
    color: color-mix(in srgb,var(--warning) 84%,var(--text));
    font-size: 7.4px;
    font-weight: 600;
    letter-spacing: .05em;
  }
}

@layer overrides {
  /* Hazal dashboard rows share the same ledger level without changing render/data code. */
  #monthlyTotals .summary-subgroup-hazal,
  #allDebtTotals .summary-subgroup-hazal {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  #monthlyTotals .summary-subgroup-hazal .summary-subgroup-head,
  #allDebtTotals .summary-subgroup-hazal .summary-subgroup-head,
  #allDebtTotals .summary-subgroup-hazal .summary-checkbox-head {
    display: none;
  }
  #monthlyTotals .summary-subgroup-hazal .total-items,
  #allDebtTotals .summary-subgroup-hazal .total-items {
    margin: 0;
    padding: 0;
    border: 0;
  }
  #monthlyTotals .summary-subgroup-hazal .monthly-item-main::before,
  #allDebtTotals .summary-subgroup-hazal .all-debt-pick > span::before {
    content: "Hazal";
    display: inline-block;
    margin-right: 5px;
    color: var(--muted);
    font-family: var(--font-label);
    font-size: 8px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .05em;
    text-transform: uppercase;
  }
}


/* Passkey authentication */
#lockPasskeyBtn {
  margin-bottom: 12px;
  background: var(--text);
  color: var(--card);
}
#lockBtn {
  background: transparent;
  color: var(--text);
  border: 1px solid var(--border);
}
.auth-divider {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 12px;
  color: var(--dim);
  font-family: var(--font-num);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.auth-divider::before,
.auth-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--border);
}
.passkey-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 6px 0;
}
.passkey-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg);
}
.passkey-row-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.passkey-row-copy strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--font-label);
  font-size: 10px;
}
.passkey-row-copy span,
.passkey-empty {
  font-family: var(--font-num);
  font-size: 8px;
  color: var(--muted);
}
.passkey-remove {
  flex: 0 0 auto;
  border: 0;
  background: transparent;
  color: var(--danger);
  font-family: var(--font-label);
  font-size: 9px;
  font-weight: 700;
  cursor: pointer;
}


/* v17.12.2 settings menu groups */
.calendar-menu > .calendar-menu-group {
  display: block;
  margin: 0 0 8px;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--card) 86%, var(--bg));
}
.calendar-menu > .calendar-menu-group:last-child { margin-bottom: 0; }
.calendar-menu > .calendar-menu-group > .calendar-menu-section-title {
  margin: 0 0 8px;
  padding: 0;
}
.calendar-menu-subsection-title {
  margin: 10px 0 0;
  padding: 8px 3px 0;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-family: var(--font-label);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}