*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f4f6f8;color:#172033}body{min-height:100vh}.topbar{position:sticky;top:0;z-index:20;background:#111827;color:white;padding:16px max(16px,calc((100vw - 1200px)/2));display:flex;align-items:center;justify-content:space-between;box-shadow:0 2px 12px #0002}.eyebrow{font-size:10px;letter-spacing:1.6px;opacity:.65;font-weight:800}.topbar h1{font-size:22px;margin:4px 0 0}.content{max-width:1200px;margin:auto;padding:18px 16px 100px}.page{display:none}.page.active{display:block}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.card{background:#fff;border:1px solid #e5e9ef;border-radius:16px;padding:16px;box-shadow:0 3px 12px #11182708}.stat .label{font-size:12px;color:#6b7280;font-weight:700}.stat .value{font-size:25px;font-weight:850;margin-top:7px}.section-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:24px 0 10px}.section-title h2{font-size:17px;margin:0}.muted{color:#6b7280}.small{font-size:12px}.btn{border:0;border-radius:10px;padding:10px 14px;font-weight:750;cursor:pointer;background:#111827;color:white}.btn.secondary{background:#eef1f5;color:#172033}.btn.danger{background:#fee2e2;color:#991b1b}.btn.success{background:#dcfce7;color:#166534}.btn.warning{background:#fef3c7;color:#92400e}.btn:disabled{opacity:.5;cursor:not-allowed}.icon-btn{background:#ffffff18;color:white;border:1px solid #ffffff22;border-radius:10px;font-size:21px;width:42px;height:42px;cursor:pointer}.actions{display:flex;gap:8px;flex-wrap:wrap}.row{display:flex;justify-content:space-between;align-items:center;gap:10px}.list{display:flex;flex-direction:column;gap:9px}.item{background:#fff;border:1px solid #e5e9ef;border-radius:14px;padding:13px}.amount{font-weight:850}.positive{color:#137333}.negative{color:#b42318}.zero{color:#667085}.chip{display:inline-flex;padding:5px 8px;border-radius:999px;background:#eef1f5;font-size:11px;font-weight:750}.chip.green{background:#dcfce7;color:#166534}.chip.red{background:#fee2e2;color:#991b1b}.chip.amber{background:#fef3c7;color:#92400e}.table-wrap{overflow:auto;background:#fff;border:1px solid #e5e9ef;border-radius:14px}.table{width:100%;border-collapse:collapse;min-width:650px}.table th,.table td{text-align:left;padding:11px;border-bottom:1px solid #edf0f4;font-size:13px}.table th{font-size:11px;color:#667085;text-transform:uppercase}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field{display:flex;flex-direction:column;gap:6px}.field.full{grid-column:1/-1}.field label{font-size:12px;font-weight:750;color:#475467}.field input,.field select,.field textarea{width:100%;border:1px solid #d8dee8;border-radius:10px;padding:11px 12px;font:inherit;background:#fff;outline:none}.field input:focus,.field select:focus,.field textarea:focus{border-color:#667085;box-shadow:0 0 0 3px #66708518}.member-line{display:grid;grid-template-columns:1fr 150px 40px;gap:8px;align-items:center;margin-bottom:8px}.check-line{display:flex;align-items:center;gap:9px;padding:9px;border:1px solid #e5e9ef;border-radius:10px}.check-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.modal-backdrop{position:fixed;inset:0;background:#11182799;z-index:50;display:flex;align-items:flex-end;justify-content:center}.modal{width:min(720px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:20px 20px 0 0;padding:18px}.modal h2{margin:0 0 14px;font-size:19px}.bottom-nav{position:fixed;z-index:30;bottom:0;left:0;right:0;background:#fff;border-top:1px solid #e5e9ef;display:flex;overflow-x:auto;justify-content:center}.bottom-nav button{border:0;background:none;min-width:74px;padding:9px 6px 8px;font-size:18px;color:#667085;cursor:pointer}.bottom-nav button span{display:block;font-size:10px;margin-top:3px;font-weight:700}.bottom-nav button.active{color:#111827}.empty{text-align:center;padding:30px;color:#667085}.hero{background:#111827;color:white;border-radius:18px;padding:20px}.hero .value{font-size:31px;font-weight:900}.settle-row{display:grid;grid-template-columns:1fr 24px 1fr auto;align-items:center;gap:8px;padding:11px 0;border-bottom:1px solid #edf0f4}.calc-display{font-size:28px;text-align:right;padding:15px;border:1px solid #d8dee8;border-radius:12px;background:#fff;min-height:70px;overflow:auto}.calc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}.calc-grid button{height:58px;border:1px solid #d8dee8;border-radius:11px;background:#fff;font-size:19px;font-weight:750;cursor:pointer}.calc-grid button.op{background:#eef1f5}.note{padding:10px 12px;border-radius:10px;background:#f8fafc;border:1px solid #e5e9ef;font-size:12px}.danger-note{background:#fff7ed;border-color:#fed7aa}.footer-space{height:20px}@media(max-width:760px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.grid2,.form-grid{grid-template-columns:1fr}.check-list{grid-template-columns:1fr}.content{padding:14px 12px 100px}.bottom-nav{justify-content:flex-start}.settle-row{grid-template-columns:1fr 18px 1fr}.settle-row .btn{grid-column:1/-1}.modal{max-height:95vh}.member-line{grid-template-columns:1fr 115px 38px}}@media(min-width:761px){.modal-backdrop{align-items:center}.modal{border-radius:18px}}
.auth-screen{display:none;min-height:100vh;align-items:center;justify-content:center;padding:20px;background:linear-gradient(145deg,#0f172a,#1e293b);}
.auth-screen.active{display:flex;}
.auth-card{width:min(430px,100%);background:#fff;border-radius:22px;padding:28px;box-shadow:0 24px 70px #0005;}
.auth-card h1{margin:8px 0 6px;}
.auth-card .muted{margin:0 0 22px;}
.auth-submit{width:100%;justify-content:center;}
.text-btn{display:block;width:100%;border:0;background:none;color:#2563eb;font-weight:700;padding:10px 6px;cursor:pointer;}
.auth-error{min-height:20px;color:#b91c1c;font-size:13px;font-weight:700;}
.header-actions{display:flex;align-items:center;gap:8px;}
.signed-in-email{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:#64748b;}
.hidden{display:none !important;}
@media (max-width:600px){.signed-in-email{display:none;}.auth-card{padding:22px;}}

.password-wrap{position:relative;display:flex;align-items:center}.password-wrap input{padding-right:70px!important}.password-toggle{position:absolute;right:7px;border:0;background:#eef1f5;color:#172033;border-radius:8px;padding:7px 9px;font-weight:750;cursor:pointer}.auth-admin-note{margin:8px 0 0;text-align:center}.header-signout{background:#fff;color:#111827;padding:9px 12px}.calculator-card{max-width:520px;margin:0 auto}.calc-grid button:active{transform:scale(.98)}code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.sync-status{font-size:11px;color:#cbd5e1;font-weight:700;max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.link-btn,.plain-link{border:0;background:none;padding:0;color:inherit;font:inherit;cursor:pointer;text-align:left}.link-btn{display:block;margin-top:8px;color:#2563eb;font-size:12px;font-weight:800}.title-link{font-weight:850}.daily-mini{padding:9px 0;border-bottom:1px solid #edf0f4}.daily-mini:last-child{border-bottom:0}.date-group{margin-bottom:18px}.date-heading{display:flex;justify-content:space-between;align-items:center;padding:10px 4px;color:#344054}.date-heading span{font-size:11px;color:#98a2b3}.archive-banner{border-left:4px solid #b42318}.toast{position:fixed;left:50%;bottom:84px;transform:translateX(-50%);z-index:100;color:#fff;background:#111827;padding:11px 15px;border-radius:10px;box-shadow:0 5px 20px #0003;font-weight:700;font-size:13px;max-width:90vw;animation:toastIn .18s ease-out}.toast.error{background:#991b1b}@keyframes toastIn{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}.modal-backdrop{opacity:0;transition:opacity .18s ease}.modal-backdrop.show{opacity:1}.modal{transform:translateY(18px);transition:transform .22s ease}.modal-backdrop.show .modal{transform:translateY(0)}.modal-handle{width:42px;height:4px;border-radius:99px;background:#d0d5dd;margin:0 auto 12px}.filter-card{margin-bottom:12px}.archive-banner b{font-size:17px}@media(max-width:600px){.sync-status{display:none}.header-actions{gap:6px}.header-signout{padding:8px 9px;font-size:12px}.bottom-nav button{min-width:70px}}
.brand-lockup{display:flex;align-items:center;gap:10px;margin-bottom:8px}.brand-lockup img{width:42px;height:42px;border-radius:12px}.brand-header{display:flex;align-items:center;gap:11px}.brand-header img{width:42px;height:42px;border-radius:12px;box-shadow:0 2px 8px #0003}.brand-header h1{margin-top:4px}.modal .btn,.modal button{position:relative;z-index:1;pointer-events:auto}@media(max-width:760px){.brand-header img{width:36px;height:36px}.brand-header .eyebrow{font-size:9px}.header-actions .signed-in-email{display:none}}

/* Modern UI layer */
:root{--bg:#f5f7fa;--surface:#fff;--surface2:#f8fafc;--text:#172033;--muted:#667085;--border:#e4e9f0;--primary:#f26b32;--primary2:#ff8b4d;--nav:#fff;--shadow:0 8px 30px rgba(16,24,40,.07)}
html,body{background:var(--bg);color:var(--text);transition:background .2s,color .2s}
body{background-image:radial-gradient(circle at 85% 0%,rgba(242,107,50,.06),transparent 30%)}
.topbar{background:rgba(17,24,39,.96);backdrop-filter:blur(14px);padding:12px max(16px,calc((100vw - 1280px)/2));border-bottom:1px solid rgba(255,255,255,.08)}
.brand-header img,.brand-lockup img{object-fit:cover;background:#111827}
.topbar h1{font-size:20px;letter-spacing:-.3px}.content{max-width:1280px;padding-top:24px}.card,.item,.table-wrap{background:var(--surface);border-color:var(--border);box-shadow:var(--shadow)}.card{border-radius:18px}.item{border-radius:15px}
.btn{background:var(--text);border-radius:11px}.btn:not(.secondary):not(.danger):not(.success):not(.warning){background:linear-gradient(135deg,var(--primary2),var(--primary));box-shadow:0 5px 14px rgba(242,107,50,.2)}
.btn.secondary{background:var(--surface2);color:var(--text);border:1px solid var(--border)}.btn.danger{background:#fff0ee;color:#b42318;border:1px solid #ffd0c9}.btn.warning{background:#fff7e6;color:#a15c00}
.field input,.field select,.field textarea,.calc-display,.calc-grid button{background:var(--surface);color:var(--text);border-color:var(--border)}
.field label{color:var(--muted)}.bottom-nav{background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-color:var(--border);box-shadow:0 -8px 30px rgba(16,24,40,.05)}.bottom-nav button{color:var(--muted)}.bottom-nav button.active{color:var(--primary)}
.page-hero{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px;margin-bottom:18px;border:1px solid var(--border);border-radius:22px;background:linear-gradient(135deg,var(--surface),var(--surface2));box-shadow:var(--shadow)}
.page-hero h2{margin:5px 0 4px;font-size:26px;letter-spacing:-.5px}.page-hero p{margin:0;color:var(--muted);font-size:13px}.hero-count{font-size:28px;font-weight:900;text-align:right}.hero-count span{display:block;font-size:11px;color:var(--muted);font-weight:700;margin-top:3px}.danger-hero{border-color:#ffd8d1}.danger-card{display:flex;align-items:center;gap:15px;border-color:#ffd8d1;background:linear-gradient(135deg,var(--surface),#fff8f6)}.safety-card{display:flex;align-items:flex-start;gap:14px}.icon-circle{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border-radius:13px;background:#fff0e9;color:var(--primary);font-weight:900}.grow{flex:1}.grow h3{margin:0 0 5px}.grow p{margin:0 0 7px;color:var(--muted);font-size:13px;line-height:1.55}.compact-btn{padding:8px 10px;font-size:11px}.app-footer{max-width:1280px;margin:0 auto 82px;padding:24px 16px;border-top:1px solid var(--border);display:grid;grid-template-columns:1.5fr 1fr auto;gap:20px;align-items:center;color:var(--muted);font-size:11px}.footer-brand{display:flex;align-items:center;gap:10px}.footer-brand img{width:34px;height:34px}.footer-brand strong{display:block;color:var(--text);font-size:13px}.footer-brand span{display:block;margin-top:2px}.footer-links{display:flex;gap:14px;flex-wrap:wrap}.footer-copy{text-align:right}.sync-status{color:#d7dde8}
@media(max-width:760px){.page-hero{align-items:flex-start;padding:18px}.page-hero h2{font-size:22px}.hero-count{font-size:22px}.danger-card,.safety-card{align-items:flex-start;flex-wrap:wrap}.app-footer{grid-template-columns:1fr;margin-bottom:78px;padding:20px 12px}.footer-copy{text-align:left}}
/* Dark theme */
html.dark{--bg:#0b1220;--surface:#111a2a;--surface2:#172235;--text:#edf2f7;--muted:#9aa7ba;--border:#263348;--nav:#0e1726;--shadow:0 10px 34px rgba(0,0,0,.25)}
html.dark body{background:var(--bg);background-image:radial-gradient(circle at 85% 0%,rgba(242,107,50,.09),transparent 30%)}
html.dark .topbar{background:rgba(8,13,24,.94)}html.dark .bottom-nav{background:rgba(14,23,38,.95)}html.dark .btn.secondary{background:#1a2639;color:var(--text)}html.dark .btn.danger{background:#3a1d22;color:#ffb4aa;border-color:#5c2b32}html.dark .btn.warning{background:#3a2d18;color:#ffd27d}html.dark .chip{background:#1b2739}html.dark .note{background:#151f30;border-color:var(--border)}html.dark .danger-note{background:#332019;border-color:#5b3525}html.dark .modal{background:#111a2a;color:var(--text)}html.dark .modal-handle{background:#475467}html.dark .hero{background:#0d1727}html.dark .page-hero{background:linear-gradient(135deg,#111a2a,#162338)}html.dark .danger-card{background:linear-gradient(135deg,#111a2a,#271a1c)}html.dark .icon-circle{background:#382219}html.dark .auth-screen{background:linear-gradient(145deg,#070c15,#111a2a)}html.dark .auth-card{background:#111a2a;color:var(--text)}html.dark .password-toggle{background:#1a2639;color:var(--text)}

/* Final interaction fixes */
.auth-screen.pending .auth-card{min-height:190px;display:flex;flex-direction:column;justify-content:center;text-align:center}
.auth-screen.pending .brand-lockup{justify-content:center}
.auth-screen.pending #authTitle{margin-top:16px}
.theme-toggle{font-size:18px;font-weight:900;line-height:1}
.calc-grid{grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch}
.calc-grid button{min-width:0;min-height:58px;display:flex;align-items:center;justify-content:center;overflow:visible;line-height:1}
.calc-grid button span{display:block;min-width:1em;text-align:center;white-space:nowrap;overflow:visible}
html.dark .calc-grid button{background:#172235!important;color:#f8fafc!important;border-color:#35435a!important}
html.dark .calc-grid button.op{background:#243149!important;color:#ffb58d!important}
html.dark .calc-display{background:#0d1727!important;color:#f8fafc!important;border-color:#35435a!important}
html.dark .calc-grid button:focus-visible{outline:3px solid rgba(255,139,77,.35);outline-offset:2px}
@media(max-width:600px){.topbar{padding:10px 10px}.header-actions{gap:5px}.header-actions .icon-btn{width:38px;height:38px}.header-signout{padding:8px 9px}.calc-grid{gap:7px}.calc-grid button{height:54px;min-height:54px;font-size:19px}}


/* Relationship calculation date breakdown */
.relationship-date-list{display:flex;flex-direction:column;gap:12px}
.relationship-date-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:14px;box-shadow:var(--shadow)}
.relationship-date-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--border)}
.relationship-date-title{font-size:15px;font-weight:850;color:var(--text)}
.relationship-date-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}
.relationship-metric{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px;border-radius:11px;background:var(--surface2);font-size:11px;color:var(--muted)}
.relationship-metric b{font-size:12px;color:var(--text);white-space:nowrap}
.relationship-date-total{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:12px;padding:12px;border-radius:12px;background:linear-gradient(135deg,var(--surface2),var(--surface));border:1px solid var(--border)}
.relationship-date-total .positive,.relationship-date-total .negative,.relationship-date-total .zero{font-size:15px;margin-top:2px}
.relationship-date-status{text-align:right;max-width:55%}
.relationship-date-status b{display:block;margin-top:2px;font-size:12px}
.relationship-equation{margin-top:10px;padding:9px 10px;border-radius:10px;background:var(--surface2);border:1px dashed var(--border);font-size:11px;color:var(--muted);line-height:1.55}
.relationship-records{margin-top:12px;padding-top:10px;border-top:1px solid var(--border)}
.relationship-records-title{font-weight:750;margin-bottom:7px}
.relationship-record{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--border);font-size:11px}
.relationship-record:last-child{border-bottom:0;padding-bottom:0}
.relationship-record .chip{padding:3px 6px;font-size:9px;vertical-align:middle}
html.dark .relationship-date-total{background:linear-gradient(135deg,#172235,#111a2a)}
@media(max-width:600px){
  .relationship-date-grid{grid-template-columns:1fr}
  .relationship-date-total{align-items:flex-start;flex-direction:column}
  .relationship-date-status{text-align:left;max-width:100%}
  .relationship-record{align-items:flex-start}
}