@font-face{font-family:Lato;src:url("fonts/Lato-Regular.ttf") format("truetype");font-weight:100 500;font-style:normal;font-display:swap}
@font-face{font-family:Lato;src:url("fonts/Lato-Bold.ttf") format("truetype");font-weight:600 900;font-style:normal;font-display:swap}
@font-face{font-family:Montserrat;src:url("fonts/Montserrat-Variable.ttf") format("truetype");font-weight:100 900;font-style:normal;font-display:swap}
/* SplitLocal UI. Evidence: official Splitwise Android press screenshots in
   /research/splitwise/public/. Tokens also cover all existing local, OCR and sync flows. */
:root{
 color-scheme:light;--surface:#fff;--surface-soft:#f3f4f8;--surface-tint:#edf7f4;
 --ink:#373b3f;--muted:#626d76;--line:#e6e8ee;--input-line:#7b858e;
 --teal:#19745e;--teal-bright:#18a582;--teal-dark:#1d856c;--debt:#b83c07;
 --warning:#fff4dc;--error:#bd2d35;--page-width:560px;--nav-height:72px;
 font-family:Lato,"Roboto","Arial",sans-serif;font-size:16px;font-weight:400;
 background:#f4f5f5;color:var(--ink);font-synthesis:none;text-rendering:optimizeLegibility;
 -webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;min-height:100dvh}body{background:transparent;line-height:1.5;letter-spacing:.0275em}button,input,select,textarea{font:inherit;color:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{font-family:Montserrat,Lato,sans-serif;font-size:14px;letter-spacing:0;min-height:40px;padding:9px 15px;border:1px solid var(--line);border-radius:22px;background:var(--surface);color:var(--ink);font-weight:500;line-height:1.35;cursor:pointer;transition:background-color .12s,color .12s}button:hover{background:var(--surface-soft)}button:active{background:var(--surface-tint)}button:disabled{opacity:.46;cursor:default}button.primary{background:var(--teal-bright);border-color:var(--teal-bright);color:white}button.primary:hover{background:var(--teal-dark)}button.danger{background:var(--surface);border-color:var(--line);color:var(--error)}button.ghost{background:transparent;border-color:transparent;color:var(--teal);padding:8px 10px}button.compact,.compact{font-size:12px;min-height:34px;padding:7px 12px}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid var(--teal-bright);outline-offset:3px}button .sw-icon{flex:none}.sw-icon{width:22px;height:22px;display:inline-block;vertical-align:middle;flex:none;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}svg.sw-icon>*{vector-effect:non-scaling-stroke}a{color:var(--teal)}
#app{width:100%;max-width:var(--page-width);min-height:100dvh;margin:0 auto;background:var(--surface)}.shell{padding:env(safe-area-inset-top) max(16px,env(safe-area-inset-right)) calc(142px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));min-height:100dvh}.app-content{min-width:0}.app-toolbar,.topbar{height:72px;display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 4px}.app-toolbar .page-title{font-size:20px;line-height:1.25;font-weight:500;letter-spacing:-.3px;margin:0}.toolbar-actions{display:flex;align-items:center;gap:4px}.toolbar-icon,button.toolbar-icon{display:inline-flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;min-height:44px;padding:10px;border:0;background:transparent;border-radius:50%;color:var(--ink)}.toolbar-icon:hover{background:var(--surface-soft)}.toolbar-icon .sw-icon{width:21px;height:21px}.brand{font-family:Montserrat,Lato,sans-serif;display:flex;align-items:center;gap:8px;font-size:18px;font-weight:600;letter-spacing:-.3px}.mark{width:32px;height:32px;display:grid;place-items:center;object-fit:cover;border-radius:8px;background:var(--teal);color:white}.local,.sync-status{font-size:11px;color:var(--muted);text-align:right;max-width:42%;line-height:1.4}.local:before{content:"";display:inline-block;width:6px;height:6px;background:var(--teal-bright);border-radius:50%;margin-right:5px;vertical-align:1px}.wallet-badge{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:5px 9px;border:1px solid var(--line);border-radius:8px;font-size:12px;color:var(--teal)}
h1,h2,h3,p{overflow-wrap:anywhere}h1,h2,h3{font-family:Montserrat,Lato,sans-serif}h1{font-size:24px;line-height:1.25;font-weight:500;letter-spacing:-.5px;margin:0 0 12px}h2{font-size:17px;line-height:1.35;font-weight:500;margin:0 0 14px;letter-spacing:-.15px}h3{font-size:14px;font-weight:500;margin:0 0 9px}p{line-height:1.55;margin:10px 0 15px}.muted,.sub,.note,.small{color:var(--muted)}.sub{display:block;font-size:12px;font-weight:400;line-height:1.45;letter-spacing:.025em;margin-top:3px;overflow-wrap:anywhere}.note{font-size:12px;line-height:1.55;margin:9px 0 15px;overflow-wrap:anywhere}.small{font-size:12px}.eyebrow{font-size:11px;font-weight:500;line-height:1.4;margin:0 0 8px;color:var(--muted);letter-spacing:.25px}.heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:14px 0 20px}.heading>div{flex:1;min-width:0}.heading h1{margin-bottom:6px}.heading .muted{font-size:13px}.heading>button{flex:none}.balance-summary{letter-spacing:.012em;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:55px;padding:6px 0 12px;margin-bottom:9px;font-size:16px}.balance-summary>div{min-width:0}.balance-summary .toolbar-icon{width:36px;height:36px;min-height:36px;padding:7px}.balance-amount{font-weight:500;color:var(--teal);white-space:nowrap}.positive{color:var(--teal)!important}.negative{color:var(--debt)!important}.metric{font-size:32px;line-height:1.25;font-weight:400;letter-spacing:-.7px;font-variant-numeric:tabular-nums}
.card{background:var(--surface);border:0;border-radius:0;box-shadow:none;padding:0;margin:0 0 22px}.card>h2,.card-head{margin-bottom:12px}.card-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.card-head h2{margin:0}.settings-page .card,.app-content[data-page=settings] .card{padding:22px 0;border-bottom:1px solid var(--line);margin:0}.grid{display:grid;grid-template-columns:1fr;gap:0}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.list,.friend-list{display:flex;flex-direction:column}.row{display:flex;align-items:center;gap:12px;padding:11px 0;min-width:0}.row:last-child{border-bottom:0}.list-button{display:flex;align-items:center;gap:12px;width:100%;min-height:40px;min-width:0;max-width:100%;padding:0;text-align:left;border:0;border-radius:0;background:transparent;color:var(--ink);font-weight:400}.list-button:hover{background:transparent}.row-main{display:block;flex:1;min-width:0}.row-title{display:block;font-size:16px;font-weight:400;line-height:1.5;overflow-wrap:anywhere}.row-value{flex:none;max-width:43%;text-align:right;font-size:16px;font-weight:400;font-variant-numeric:tabular-nums;line-height:1.35;overflow-wrap:anywhere}.row-value .sub{font-size:11px}.friend-list .row{padding:11px 0;min-height:64px}.friend-list .row-value{font-size:16px}.friend-list .row-value .sub{font-size:12px}.avatar{position:relative;isolation:isolate;flex:none;width:38px;height:38px;display:grid;place-items:center;overflow:hidden;border-radius:50%;font-size:12px;font-weight:500;color:white;background:conic-gradient(from 30deg,#09b7a0 0 25%,#ccebe3 25% 42%,#f3faf7 42% 58%,#005341 58% 83%,#009780 83%)}.avatar:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(145deg,transparent 49.6%,#ffffff35 50%,transparent 50.6%);pointer-events:none}.avatar.blue{background:conic-gradient(from 27deg,#164b70 0 25%,#acd1df 25% 42%,#eff9fd 42% 58%,#062539 58% 83%,#2984aa 83%)}.avatar.rose{background:conic-gradient(from 27deg,#ff704b 0 25%,#ffb78f 25% 42%,#fff2e9 42% 58%,#d82d06 58% 83%,#ff5129 83%)}.friend-list .row:nth-child(4n+1) .avatar{background:conic-gradient(from 30deg,#6c29ad 0 25%,#b787d7 25% 42%,#eee4f7 42% 58%,#3c146d 58% 83%,#9657cf 83%)}.friend-list .row:nth-child(4n+3) .avatar{background:conic-gradient(from 30deg,#a10037 0 25%,#cc2052 25% 42%,#f2a9c1 42% 58%,#6c0029 58% 83%,#dc3268 83%)}.group-cover{position:relative;isolation:isolate;display:grid;place-items:center;flex:none;width:90px;height:82px;border-radius:8px;overflow:hidden;background:#188e76;color:white}.group-cover:before{content:"";position:absolute;z-index:-1;inset:0;background:conic-gradient(from 35deg at 70% 54%,#00b693 0deg 65deg,#329a83 65deg 125deg,#0b856d 125deg 180deg,#69bfae 180deg 250deg,#d0eee4 250deg 285deg,#168b74 285deg)}.group-cover .sw-icon{width:43px;height:43px;stroke-width:1.5;filter:drop-shadow(0 1px 1px #003b3555)}.group-list .row{padding:5px 0;min-height:86px;align-items:center}.group-list .list-button{gap:14px}.group-list .row-main .row-title{font-weight:500;margin-bottom:1px}.group-list .row-value{max-width:45%}.group-list .row:nth-child(3n+2) .group-cover:before{filter:hue-rotate(211deg) saturate(1.7)}.group-list .row:nth-child(3n) .group-cover:before{filter:hue-rotate(58deg) saturate(.8) brightness(.7)}.settled-hint{text-align:center;color:var(--muted);font-size:11px;line-height:1.5;margin:32px 0 11px}.settled-toggle{display:block;margin:0 auto;color:var(--teal);border-color:var(--teal);font-weight:500;font-size:13px;background:var(--surface)}
.nav{position:fixed;z-index:20;bottom:0;left:50%;transform:translateX(-50%);display:flex;justify-content:space-around;width:100%;max-width:var(--page-width);min-height:calc(var(--nav-height) + env(safe-area-inset-bottom));padding:7px 6px max(12px,env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--surface)}.nav button{font-family:Lato,sans-serif;letter-spacing:0;display:flex;flex:1;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;min-width:0;min-height:48px;background:transparent;border:0;border-radius:0;padding:5px 4px 0;color:var(--muted);font-size:12px;font-weight:400}.nav button.active{color:var(--teal);background:transparent;font-weight:500}.nav button:hover{background:var(--surface-soft)}.nav .icon{display:flex;align-items:center;justify-content:center;width:26px;height:24px;font-size:22px;line-height:24px}.nav .sw-icon{width:22px;height:22px}.floating-expense{position:fixed;z-index:21;right:max(calc((100vw - var(--page-width))/2 + 16px),16px);bottom:calc(var(--nav-height) + 14px + env(safe-area-inset-bottom));display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:10px 16px;border:1px solid #087d67;border-radius:24px;background:var(--teal-bright);color:#fff;font-size:15px;font-weight:500;box-shadow:0 3px 7px #0003}.floating-expense:hover{background:var(--teal)}.floating-expense .sw-icon{width:19px;height:19px}
.group-banner{position:relative;isolation:isolate;overflow:hidden;margin:calc(-1 * env(safe-area-inset-top)) -16px 0;padding:calc(20px + env(safe-area-inset-top)) 16px 19px;min-height:208px;background:#11816f;color:#fff}.group-banner:before{content:"";position:absolute;inset:0;z-index:-1;background:repeating-conic-gradient(from 35deg at 85% 55%,#1a9b8330 0deg 35deg,#00554325 35deg 70deg,#6cd1b530 70deg 105deg);transform:scale(1.3)}.group-banner:after{content:"";position:absolute;width:190px;height:190px;right:-20px;top:20px;z-index:-1;border:22px solid #1d9b8277;transform:rotate(30deg);border-radius:24px}.group-banner .banner-actions{display:flex;align-items:center;justify-content:space-between;margin:0 0 21px}.group-banner .toolbar-icon{width:36px;height:36px;min-height:36px;padding:8px;background:var(--surface);color:var(--ink);box-shadow:0 1px 4px #003d3833}.group-banner h1{position:relative;z-index:1;font-size:30px;font-weight:600;margin:16px 0 10px;color:white}.group-banner .chip{position:relative;z-index:1;background:#005e4dcc;color:white;border-color:transparent;min-height:26px;padding:4px 10px;font-size:12px}.group-banner .sub{color:#e9fff7}.friend-banner{text-align:center;padding:12px 0 20px}.friend-banner>.avatar{width:66px;height:66px;font-size:22px;margin:0 auto 14px}.friend-banner h1{font-size:23px;font-weight:500;margin:5px 0 12px}.group-header{padding:14px 0;margin:0 0 12px}.group-header .sub{margin-bottom:8px}.filter-chips,.actions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 18px}.filter-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding:2px 0 5px;margin:0 -16px 13px;padding-left:16px;padding-right:16px}.filter-chips::-webkit-scrollbar{display:none}.filter-chips>button{flex:none;min-height:32px;font-size:12px;padding:6px 13px;white-space:nowrap}.filter-chips .primary{background:var(--debt);border-color:var(--debt)}.filter-chips .sw-icon{height:14px;width:14px;margin-right:3px}.expense-row{padding:8px 0;min-height:65px;gap:10px}.expense-row .list-button{gap:10px}.expense-date{display:flex;flex-direction:column;flex:none;align-items:flex-start;justify-content:center;width:26px;font-size:11px;line-height:1.2;color:var(--muted)}.expense-date>strong{font-size:13px;font-weight:400;color:var(--ink)}.expense-category{display:grid;place-items:center;flex:none;width:36px;height:36px;background:#d2e9d9;color:#263c32;border-radius:0}.expense-category .sw-icon{width:27px;height:27px;stroke-width:1.3}.expense-category.rose{background:#f6dce1}.expense-category.blue{background:#e0ebf2}.expense-row .row-title{font-size:13px}.expense-row .sub{font-size:10px;margin-top:2px}.expense-net{width:98px;flex:none;text-align:right;font-size:14px;line-height:1.25;max-width:35%;font-variant-numeric:tabular-nums}.expense-net .sub{font-size:10px;margin:0 0 2px;color:inherit}.expense-net .total{font-size:10px;color:var(--muted)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 15px}.filters input{flex:1 1 100%;min-width:100px}.filters select{flex:1;min-width:90px;padding-top:8px;padding-bottom:8px;min-height:36px;font-size:12px}.chip{display:inline-flex;align-items:center;gap:4px;background:var(--surface-tint);border:1px solid #d6e9e2;color:var(--teal);border-radius:7px;padding:4px 7px;font-size:11px;font-weight:400}.chip .sw-icon{width:13px;height:13px}.bad{background:#fff0e8;border-color:#ffdfcc;color:var(--debt)}.empty{text-align:center;padding:38px 10px;color:var(--muted);font-size:13px;line-height:1.6}.empty strong{display:block;color:var(--ink);font-size:16px;font-weight:500;margin-bottom:8px}.bar{height:5px;border-radius:3px;background:var(--line);overflow:hidden;margin-top:8px}.bar>span{display:block;height:100%;background:var(--teal-bright);border-radius:3px}.hero{background:var(--surface);color:var(--ink);padding:12px 0 18px;margin:0 0 15px;border-radius:0;border-bottom:1px solid var(--line)}.hero .value{font-size:34px;font-weight:400;letter-spacing:-.7px;margin:7px 0}.hero .eyebrow{color:var(--muted)}.hero button{margin-top:12px}.profile-header{display:flex;align-items:center;gap:14px;padding:12px 0 24px;border-bottom:1px solid var(--line);margin-bottom:6px}.profile-header .avatar{width:60px;height:60px;font-size:20px}.profile-header h1{font-size:22px;margin:0 0 4px}.profile-header .sub{font-size:12px}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}.setting-row:last-child{border-bottom:0}.setting-row>div,.setting-row>span{min-width:0;flex:1}.setting-row>button{flex:none;font-size:12px;min-height:34px;padding:7px 12px;max-width:48%}.setting-row strong{font-size:13px;font-weight:500}.setting-row .sub{max-width:100%;font-size:11px}.sync-state{display:block;color:var(--muted);font-size:11px;line-height:1.5;margin-top:4px;overflow-wrap:anywhere}.native-only{font-size:12px}.sync-status{font-size:11px}.oneline{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.clickable{cursor:pointer}.separator{border:0;border-top:1px solid var(--line);margin:22px 0}.info-box{background:var(--warning);padding:12px;border-radius:6px;color:var(--ink);font-size:12px;line-height:1.6}.comment{background:var(--surface-soft);border-radius:6px;padding:12px;margin:8px 0;white-space:pre-wrap;font-size:13px}.conflict{border-left:3px solid #d19024;padding-left:12px}.conflict-fields>div{display:grid;grid-template-columns:minmax(85px,1fr) minmax(0,2fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:12px}.conflict-fields span{white-space:pre-wrap;overflow-wrap:anywhere}
/* Shared dialogs preserve the app's full-screen mobile navigation pattern. */
dialog{border:1px solid var(--line);border-radius:12px;padding:0;width:min(480px,calc(100% - 32px));max-width:none;max-height:calc(94dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));background:var(--surface);color:var(--ink);box-shadow:0 16px 70px #0002;overscroll-behavior:contain}dialog::backdrop{background:#0c242650;backdrop-filter:blur(2px)}.modal-inner{padding:0 18px 22px}.modal-top{position:sticky;z-index:5;top:0;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:65px;margin:0 -18px 18px;padding:9px 12px 9px 18px;background:var(--surface)}.modal-top h2{flex:1;font-family:Montserrat,Lato,sans-serif;font-size:18px;font-weight:400;line-height:1.3;margin:0;min-width:0}.modal-top>.ghost{width:40px;height:40px;min-height:40px;padding:8px;color:var(--ink);border-radius:50%;flex:none}.modal-top .toolbar-icon{flex:none}.form-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:13px}.field{display:flex;flex-direction:column;min-width:0;gap:5px;margin-bottom:19px}.field label,.label{font-size:12px;font-weight:400;line-height:1.45;color:var(--ink)}input,select,textarea{width:100%;min-width:0;min-height:42px;background:var(--surface);border:1px solid var(--input-line);border-radius:8px;padding:10px 11px;line-height:1.35;color:var(--ink);outline:none}input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}input:focus,textarea:focus,select:focus{border-color:var(--teal)}input:read-only{background:var(--surface-soft)}input:disabled,select:disabled,textarea:disabled{opacity:.65}textarea{resize:vertical;min-height:76px}input[type=checkbox]{width:18px;height:18px;min-height:18px;padding:0;accent-color:var(--teal);border-radius:3px;flex:none}input[type=file]{font-size:12px;padding:8px;min-height:42px}input[type=date]{min-width:0;max-width:100%;-webkit-appearance:none}input[type=date]::-webkit-date-and-time-value{text-align:left}input[type=number]{font-variant-numeric:tabular-nums}select{padding-right:24px}.checkrow{display:flex;align-items:center;gap:10px;margin:8px 0;font-size:13px;line-height:1.4;min-width:0}.split-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(84px,104px);gap:12px;align-items:center;margin:10px 0}.split-row .checkrow{min-width:0;overflow-wrap:anywhere}.split-amount{text-align:right;color:var(--teal);font-size:13px}.preview{background:var(--surface-tint);border:1px solid #d7e8e2;border-radius:8px;padding:12px;margin:17px 0;font-size:13px}.preview strong{display:block;font-weight:500;margin-bottom:6px}.preview .oneline{font-size:12px;margin-top:4px}.error{font-size:12px;line-height:1.5;color:var(--error);margin-top:8px}.footer-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:22px}.footer-actions button{font-size:13px}.item-row{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:12px;margin:12px 0}.item-row .form-grid{grid-template-columns:minmax(0,1fr) minmax(82px,106px)}.item-row .field{margin-bottom:11px}.item-row select{font-size:12px}.item-participants{border:0;padding:0;margin:0 0 10px;min-width:0}.item-participants legend{font-size:12px;font-weight:500;padding:0;margin-bottom:5px}.participant-checks{display:flex;gap:8px 12px;flex-wrap:wrap;margin:8px 0}.participant-checks label{display:flex;align-items:center;margin:0;padding:6px 9px;border-radius:6px;background:var(--surface-soft);font-size:12px}.participant-checks input{flex:none}.entry-choices{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.entry-choice{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;gap:11px;white-space:normal;padding:22px 12px;border-radius:9px;background:var(--surface);border:1px solid var(--line);color:var(--ink)}.entry-choice:hover{border-color:var(--teal)}.entry-choice>strong{font-size:14px;font-weight:500}.entry-choice>span:last-child{font-size:12px;line-height:1.55;color:var(--muted);font-weight:400}.choice-icon{font-size:28px;color:var(--teal)}.choice-icon .sw-icon{width:32px;height:32px;stroke-width:1.4}.scan-receipt{display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center;width:118px;min-height:88px;margin:5px auto 27px;padding:12px;border-radius:9px;color:var(--teal);font-size:12px}.scan-receipt .sw-icon{width:28px;height:28px}.expense-editor .modal-top{margin-bottom:15px}.expense-editor .form-grid{gap:12px}.expense-editor #expense-description{font-size:15px}.expense-editor #expense-amount{font-size:20px;line-height:1.25;padding-top:9px;padding-bottom:9px}.expense-editor .expense-basics{margin-bottom:22px}.expense-editor details{margin:18px 0}.expense-editor summary{cursor:pointer;color:var(--muted);font-size:13px}.expense-editor .receipt-shortcuts{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}.expense-editor .receipt-shortcuts button{font-size:11px;border-radius:7px;min-height:34px;padding:7px 9px}.expense-editor .receipt-shortcuts .sw-icon{width:15px;height:15px}.ocr-result{font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere;min-height:150px}.camera-preview{width:100%;max-height:58dvh;object-fit:contain;background:#18201f;border-radius:8px;margin:10px 0}.camera-dialog{max-width:480px}.file-button{display:inline-flex;align-items:center;justify-content:center;position:relative;overflow:hidden;border-radius:22px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-weight:500;min-height:40px;padding:9px 15px;cursor:pointer;font-size:13px}.file-button input{position:absolute;inset:0;opacity:0;cursor:pointer}.receipt-image{max-width:100%;max-height:72dvh;object-fit:contain;border-radius:6px;display:block;margin:auto}.receipt-pdf{width:100%;height:72dvh}.friend-row{flex-wrap:wrap}.link-person-form{display:flex;align-items:end;gap:8px;width:100%}.link-person-form label{flex:1;min-width:0}.link-person-form select{margin-top:5px}.profile-header .row-main{flex:1}.hidden{display:none!important}.loading{text-align:center;padding:60px 20px;color:var(--muted)}.welcome{max-width:400px;margin:0 auto;padding:64px 4px 30px}.welcome .mark{width:64px;height:64px;margin-bottom:27px;border-radius:16px;padding:0}.welcome h1{font-size:32px;line-height:1.25;font-weight:500;letter-spacing:-.8px}.welcome p{color:var(--muted);font-size:14px;line-height:1.6}.welcome button{width:100%;margin-top:8px}.welcome .field{margin-top:28px}.welcome .eyebrow{font-size:11px;letter-spacing:.3px}.lock-screen{text-align:center}.lock-screen .mark{margin-left:auto;margin-right:auto}.privacy-hidden body{visibility:hidden}#toast{position:fixed;z-index:100;bottom:calc(140px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:max-content;max-width:min(90%,500px);padding:11px 16px;border-radius:6px;background:#2c3331;color:white;box-shadow:0 4px 18px #0002;font-size:13px;line-height:1.5;opacity:0;pointer-events:none;transition:opacity .15s}#toast.show{opacity:1}
/* Dark colors are derived for SplitLocal; the press references show light mode only. */
html.dark,body.dark{color-scheme:dark;--surface:#202224;--surface-soft:#373b3f;--surface-tint:#23473d;--ink:#ffffff;--muted:#bdc9d4;--line:#373b3f;--input-line:#87949c;--teal:#ace4d6;--teal-bright:#18a582;--teal-dark:#1d856c;--debt:#f99267;--warning:#393223;--error:#ff9ba1;background:#202224;color:var(--ink)}body.dark{background:transparent}body.dark button.primary{background:#18a582;color:white;border-color:#18a582}body.dark .floating-expense{background:#18a582;border-color:#1d856c;color:white}body.dark .group-banner{background:#106854;color:#fff}body.dark .group-banner h1{color:#fff}body.dark .chip{border-color:#326154}body.dark .preview{border-color:#326154}body.dark .bad{background:#4b2d23;border-color:#664032;color:var(--debt)}body.dark .filter-chips .primary{background:#aa431f;border-color:#aa431f;color:white}body.dark .expense-category{background:#314d3e;color:#e7f2ea}body.dark .expense-category.rose{background:#593e48;color:#ffe6ef}body.dark .expense-category.blue{background:#334653;color:#deeffc}body.dark .avatar{color:white}body.dark input::placeholder,body.dark textarea::placeholder{color:#8c999c}body.dark #toast{background:#e4ebe7;color:#14201b}body.dark .group-banner .toolbar-icon{background:#222c2b;color:white}
/* Components shared with the PWA render functions. */
.group-balance{display:block;font-size:15px;line-height:1.5;margin-top:2px;font-weight:400}.group-row .row-title{font-family:Montserrat,Lato,sans-serif;font-size:15px;line-height:1.45;font-weight:500}.group-row .sub{font-size:12px;margin-top:4px}.banner-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:10px 0 22px}.group-banner .banner-toolbar .toolbar-icon{width:36px;min-height:36px;height:36px;padding:8px}.group-banner .chip .sw-icon{width:15px;height:15px}.shell:has(.group-banner)>.app-toolbar{display:none}.shell:has(.group-banner){padding-top:0}.shell:has(.group-banner) .group-banner{margin-top:0}.outline{color:var(--teal);border-color:var(--teal);background:var(--surface);font-weight:500}.add-friend{display:inline-flex;gap:8px;align-items:center;align-self:flex-start;margin-top:16px;font-size:12px;min-height:36px;border-color:var(--line)}.add-friend .sw-icon{height:18px;width:18px}.settled-controls{text-align:center;margin:32px 0 18px}.settled-controls button{font-size:12px;max-width:100%;padding:9px 15px}.friend-avatar{font-size:0}.friend-avatar.tone-0{background:conic-gradient(from 30deg,#6c29ad 0 25%,#b787d7 25% 42%,#eee4f7 42% 58%,#3c146d 58% 83%,#9657cf 83%)!important}.friend-avatar.tone-1{background:conic-gradient(from 30deg,#ff704b 0 25%,#ffb78f 25% 42%,#fff2e9 42% 58%,#d82d06 58% 83%,#ff5129 83%)!important}.friend-avatar.tone-2{background:conic-gradient(from 30deg,#a10037 0 25%,#cc2052 25% 42%,#f2a9c1 42% 58%,#6c0029 58% 83%,#dc3268 83%)!important}.friend-avatar.tone-3{background:conic-gradient(from 30deg,#09b7a0 0 25%,#ccebe3 25% 42%,#f3faf7 42% 58%,#005341 58% 83%,#009780 83%)!important}.friend-avatar.tone-4{background:conic-gradient(from 30deg,#164b70 0 25%,#acd1df 25% 42%,#eff9fd 42% 58%,#062539 58% 83%,#2984aa 83%)!important}.friend-banner{display:grid;grid-template-columns:40px minmax(0,1fr) 40px;align-items:center;text-align:center;padding:12px 0 18px}.friend-banner>.avatar{grid-column:2;grid-row:1;width:64px;height:64px;margin:0 auto;font-size:22px}.friend-banner>button:first-child{grid-column:1;grid-row:1}.friend-banner>h1{grid-column:2;grid-row:2;font-size:21px;margin:14px 0 0}.friend-banner>button:last-child{grid-column:3;grid-row:1}.expense-scan{margin:3px auto 26px}.expense-scan .scan-receipt{margin:0 auto;width:120px;min-height:88px;border-radius:10px;font-size:12px;letter-spacing:0}.expense-scan .scan-receipt .sw-icon{width:28px;height:28px}.expense-scan .scan-receipt>span{display:block}dialog[data-view=expense] .modal-top>button:last-child{color:var(--teal)}dialog[data-view=expense] #expense-amount{font-size:18px}dialog[data-view=expense] #expense-currency{font-size:14px}dialog[data-view=expense] #category-hint{font-size:11px;margin-top:3px;margin-bottom:0;line-height:1.5}dialog[data-view=expense] [data-action=category-auto]{align-self:flex-start;font-size:10px;line-height:1.3;padding:3px 0;min-height:24px}.app-content[data-page=stats] .grid{grid-template-columns:1fr 1fr;gap:18px}.app-content[data-page=stats] .metric{font-size:27px}.app-content[data-page=expenses]>.heading{display:none}
@media(min-width:600px){#app{box-shadow:0 0 0 1px #0000000a}.shell{padding-left:24px;padding-right:24px}.app-toolbar,.topbar{height:78px}.group-banner{margin-left:-24px;margin-right:-24px;padding-left:24px;padding-right:24px}.filter-chips{margin-left:-24px;margin-right:-24px;padding-left:24px;padding-right:24px}.floating-expense{right:max(calc((100vw - var(--page-width))/2 + 24px),24px)}.nav{border-left:1px solid var(--line);border-right:1px solid var(--line)}}
@media(max-width:599px){:root{background:var(--surface)}.shell{padding-top:env(safe-area-inset-top)}dialog{position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-height:100dvh;margin:0;border:0;border-radius:0;box-shadow:none}.modal-inner{padding:env(safe-area-inset-top) 16px calc(24px + env(safe-area-inset-bottom));min-height:100%}.modal-top{top:calc(-1 * env(safe-area-inset-top));min-height:calc(64px + env(safe-area-inset-top));margin:calc(-1 * env(safe-area-inset-top)) -16px 18px;padding:calc(10px + env(safe-area-inset-top)) 10px 10px 16px}.modal-top h2{font-size:18px}.entry-choices{margin-top:24px}.detail-grid{gap:16px}input,select,textarea{font-size:16px}.field label{font-size:12px}.split-row input{font-size:15px}.filters input,.filters select{font-size:13px}.item-row input,.item-row select{font-size:14px}.welcome{padding-top:46px}.expense-editor .footer-actions{padding-bottom:6px}}
@media(max-width:359px){.shell{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}.app-toolbar .page-title{font-size:19px}.app-toolbar{gap:4px}.toolbar-actions{gap:0}.toolbar-icon,button.toolbar-icon{width:40px;min-height:40px;height:40px;padding:9px}.nav button{font-size:10px}.row-title{font-size:13px}.row-value{max-width:43%;font-size:13px}.avatar{width:33px;height:33px}.row,.list-button{gap:10px}.group-cover{width:72px;height:68px}.group-cover .sw-icon{width:38px;height:38px}.group-list .list-button{gap:10px}.group-banner{margin-left:-12px;margin-right:-12px;padding-left:12px;padding-right:12px}.group-banner h1{font-size:27px}.balance-summary{font-size:13px}.expense-date{width:22px;font-size:10px}.expense-date>strong{font-size:12px}.expense-category{width:33px;height:33px}.expense-row .list-button{gap:8px}.expense-net{width:82px;font-size:12px;max-width:33%}.expense-row .row-title{font-size:12px}.expense-row .sub{font-size:9px}.expense-net .sub{font-size:9px}.setting-row{gap:8px}.setting-row>button{font-size:11px;max-width:45%;padding:7px 9px}.form-grid{gap:10px}.field{margin-bottom:16px}.entry-choices{grid-template-columns:1fr}.entry-choice{flex-direction:row;align-items:center;flex-wrap:wrap;text-align:left;padding:14px;gap:9px}.entry-choice>span:last-child{flex-basis:100%}.entry-choice>strong{font-size:13px}.participant-checks{gap:7px}.participant-checks label{padding:6px 7px;font-size:11px}.link-person-form{flex-wrap:wrap}.link-person-form label{flex-basis:100%}.conflict-fields>div{grid-template-columns:minmax(72px,1fr) minmax(0,2fr);gap:8px}.footer-actions{gap:6px}.footer-actions button{font-size:12px;padding:9px 12px}.floating-expense{font-size:13px;min-height:42px;padding:9px 13px}.filter-chips{margin-left:-12px;margin-right:-12px;padding-left:12px;padding-right:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* New desktop-only regions are absent from the mobile presentation. */
.desktop-only,.nav>.desktop-only{display:none}
/* Account entry is shared by the PWA and its standalone preview. */
.entry-actions{display:grid;gap:10px;margin:26px 0 20px}
.entry-actions button{width:100%;margin:0;min-height:46px}
.entry-actions .outline{background:transparent;color:var(--teal);border-color:var(--teal);transition:none}
.entry-actions .outline:hover{background:var(--surface-soft)}
.entry-local{border-top:1px solid var(--line);margin-top:28px;padding-top:20px}
.entry-local>summary{cursor:pointer;font-size:13px;color:var(--muted);line-height:1.6}
.entry-local>summary:hover{color:var(--teal)}
.entry-local>.note{margin-top:14px}
.entry-local .field{margin-top:20px}
.auth-welcome .entry-actions{margin-top:28px}
/* Desktop changes deliberately start above tablet and phone breakpoints. */
@media(min-width:1024px){
 :root{--page-width:1600px;--desktop-sidebar:224px;--desktop-gutter:28px}
 #app{max-width:var(--page-width);background:var(--surface);box-shadow:0 0 0 1px var(--line)}
 .shell{display:grid;grid-template-columns:minmax(0,1fr) 240px;grid-template-rows:auto 1fr;grid-template-areas:"toolbar overview" "content overview";gap:0 var(--desktop-gutter);align-content:start;margin-left:var(--desktop-sidebar);padding:22px 28px 48px;min-height:100dvh}
 .app-toolbar{grid-area:toolbar;min-width:0;height:68px;margin:0 0 24px;padding-bottom:17px;border-bottom:1px solid var(--line)}
 .app-toolbar .brand{font-size:26px;font-weight:500;letter-spacing:-.6px}
 .app-toolbar .brand>.mark{display:none}
 .toolbar-actions{gap:6px}
 .toolbar-actions .local{max-width:none;padding:6px 10px;background:var(--surface-soft);border-radius:20px;white-space:nowrap}
 .app-content{grid-area:content;min-width:0;padding-bottom:20px}
 .nav{position:fixed;inset:0 auto 0 max(0px,calc((100vw - var(--page-width))/2));transform:none;width:var(--desktop-sidebar);max-width:none;min-height:100dvh;padding:30px 16px 18px;border:0;border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:flex-start;gap:8px;background:var(--surface)}
 .nav>.desktop-brand{display:flex;align-items:center;gap:10px;padding:0 8px 33px;color:var(--ink);font:600 20px Montserrat,Lato,sans-serif;letter-spacing:-.5px}
 .desktop-brand .mark{width:36px;height:36px;border-radius:10px}
 .nav>.nav-label{display:block;padding:0 12px 7px;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:1.1px}
 .nav>button{flex:none;flex-direction:row;align-items:center;justify-content:flex-start;gap:12px;min-height:47px;padding:12px 14px;border-radius:8px;font-size:14px;line-height:1.35;text-align:left;white-space:normal}
 .nav>button.active{background:var(--surface-tint);color:var(--teal);font-weight:600}
 .nav>button>.sw-icon{width:21px;height:21px}
 .nav>.desktop-new-expense{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:19px;padding:12px 10px;min-height:47px;border:1px solid var(--teal-bright);border-radius:8px;font:500 12px Montserrat,Lato,sans-serif;background:var(--teal-bright);color:#fff;box-shadow:none}
 .nav>.desktop-new-expense:hover{background:var(--teal-dark);border-color:var(--teal-dark)}
 .nav>.desktop-profile{display:flex;align-items:center;gap:11px;width:100%;margin-top:auto;padding:20px 7px 6px;border-top:1px solid var(--line);border-radius:0;color:var(--ink)}
 .desktop-profile>.avatar{width:35px;height:35px;font-size:11px}
 .desktop-profile>span:last-child{min-width:0;flex:1;overflow-wrap:anywhere}
 .desktop-profile strong{display:block;font-size:13px;font-weight:500}
 .desktop-profile .sub{font-size:11px;margin-top:4px}
 .floating-expense{display:none}
 .desktop-overview{grid-area:overview;display:block;align-self:start;position:sticky;top:28px;min-width:0;padding-top:11px}
 .desktop-summary,.desktop-groups{padding:23px 19px;background:var(--surface-soft);border:1px solid var(--line);border-radius:12px;margin-bottom:20px}
 .desktop-summary .eyebrow{font-size:10px;letter-spacing:.5px;margin-bottom:13px}
 .desktop-summary h2{font-size:17px;line-height:1.5;margin-bottom:22px}
 .desktop-summary>.sub{font-size:12px;margin-bottom:7px}
 .desktop-balance{font-size:29px;line-height:1.25;letter-spacing:-.7px;font-variant-numeric:tabular-nums}
 .desktop-metrics{display:grid;gap:14px;margin:22px 0;padding-top:18px;border-top:1px solid var(--line)}
 .desktop-metrics>div{display:flex;justify-content:space-between;gap:12px;min-width:0;font-size:12px}
 .desktop-metrics dt{color:var(--muted)}
 .desktop-metrics dd{margin:0;text-align:right;min-width:0;font-weight:500;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
 .desktop-summary>.outline{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;font-size:11px;border-radius:7px}
 .desktop-summary>.outline .sw-icon{width:15px;height:15px}
 .desktop-groups{background:var(--surface);padding:19px 0}
 .desktop-groups h3{padding:0 17px;font-size:13px;margin:0 0 12px}
 .desktop-groups>button:not(.ghost){display:flex;align-items:center;justify-content:flex-start;gap:10px;width:100%;min-width:0;padding:11px 16px;text-align:left;border:0;border-radius:0;font:400 12px Lato,sans-serif;background:transparent}
 .desktop-groups>button:not(.ghost):hover{background:var(--surface-soft)}
 .desktop-groups>button>span{flex:1;min-width:0;overflow-wrap:anywhere}
 .desktop-groups>button>.sw-icon{width:18px;height:18px;color:var(--teal)}
 .desktop-groups .sub{font-size:10px;margin-top:4px}
 .desktop-groups>.ghost{margin:12px 10px 0;font-size:10px;min-height:32px}
 .desktop-groups>.note{padding:0 17px}
 .balance-summary{margin:0 0 22px;padding:19px 20px;min-height:76px;background:var(--surface-tint);border:1px solid var(--line);border-radius:10px;font-size:16px;line-height:1.6}
 .balance-summary strong{font-size:21px;white-space:nowrap;font-weight:500}
 .friend-list{border:1px solid var(--line);border-radius:10px;overflow:hidden}
 .friend-list .row{padding:0;min-height:82px;border-bottom:1px solid var(--line)}
 .friend-list .list-button{min-height:82px;padding:16px 19px;gap:16px}
 .friend-list .list-button:hover{background:var(--surface-soft)}
 .friend-list .row-title{font-size:16px}
 .friend-list .avatar{width:42px;height:42px}
 .friend-list .row-value{font-size:17px}
 .friend-list .row-value .sub{font-size:11px;margin-bottom:3px}
 .friend-list>.add-friend{margin:16px 19px 19px}
 .settled-controls{margin:23px 0;text-align:left}
 .settled-controls button{min-height:34px;font-size:11px}
 .group-list{display:grid;grid-template-columns:1fr;gap:15px}
 .group-list .group-row{padding:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;min-height:120px}
 .group-list .list-button{min-height:120px;padding:16px;align-items:center;gap:18px}
 .group-list .list-button:hover{background:var(--surface-soft)}
 .group-list .group-cover{width:80px;height:80px;border-radius:9px}
 .group-list .row-main{min-width:0}
 .group-list .row-title{font-size:15px;line-height:1.5}
 .group-list .group-balance{font-size:14px;margin-top:7px}
 .group-list .sub{font-size:11px;margin-top:7px}
 .group-list>.add-friend{justify-self:start;margin-top:3px}
 .shell:has(.group-banner){padding-top:22px}
 .shell:has(.group-banner)>.app-toolbar{display:flex}
 .shell:has(.group-banner) .group-banner{margin:0 0 21px;padding:22px 24px 24px;min-height:207px;border-radius:12px}
 .group-banner .banner-toolbar{margin:0 0 20px}
 .group-banner h1{font-size:28px;margin:13px 0 12px}
 .friend-banner{grid-template-columns:40px 64px minmax(0,1fr) 40px;gap:16px;align-items:center;text-align:left;padding:8px 0 25px;margin-bottom:5px}
 .friend-banner>.avatar{grid-column:2;grid-row:1;margin:0;width:64px;height:64px}
 .friend-banner>h1{grid-column:3;grid-row:1;margin:0;font-size:24px}
 .friend-banner>button:first-child{grid-column:1;grid-row:1}
 .friend-banner>button:last-child{grid-column:4;grid-row:1}
 .filter-chips{margin:0 0 22px;padding:0 0 4px;gap:9px}
 .filter-chips>button{min-height:35px;font-size:12px;padding:8px 14px}
 .filters{display:grid;grid-template-columns:minmax(0,1fr) minmax(140px,180px) 88px;gap:10px;margin:0 0 23px}
 .filters input,.filters select{width:100%;min-width:0;font-size:12px;min-height:42px}
 .list-card{border:1px solid var(--line);border-radius:10px;overflow:hidden}
 .expense-row{padding:0;min-height:78px;border-bottom:1px solid var(--line)}
 .expense-row:last-child{border-bottom:0}
 .expense-row .list-button{padding:14px 17px;min-height:78px;gap:14px}
 .expense-row .list-button:hover{background:var(--surface-soft)}
 .expense-date{width:29px;font-size:11px}
 .expense-date>strong{font-size:16px}
 .expense-category{width:39px;height:39px;border-radius:5px}
 .expense-category .sw-icon{width:26px;height:26px}
 .expense-row .row-title{font-size:14px;font-weight:500}
 .expense-row .sub{font-size:10px;margin-top:4px}
 .expense-net{font-size:16px;width:113px;max-width:30%}
 .expense-net .sub{font-size:10px}
 .app-content[data-page=settings],.app-content[data-page=stats]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-content:start;align-items:start}
 .app-content[data-page=settings]>.profile-header,.app-content[data-page=settings]>.actions,.app-content[data-page=stats]>.heading,.app-content[data-page=stats]>.filters,.app-content[data-page=stats]>.form-grid,.app-content[data-page=stats]>.grid{grid-column:1/-1}
 .app-content[data-page=settings]>.profile-header{margin:0;padding:0 0 22px}
 .app-content[data-page=settings]>.actions{margin:0;padding:0}
 .app-content[data-page=settings]>.card,.app-content[data-page=stats]>.card,.app-content[data-page=stats]>.grid>.card{padding:20px;border:1px solid var(--line);border-radius:10px;margin:0;min-width:0}
 .app-content[data-page=settings] .card>h2{font-size:15px;margin-bottom:20px}
 .app-content[data-page=settings] .setting-row{gap:10px;padding:14px 0}
 .app-content[data-page=settings] .setting-row>span{font-size:12px}
 .app-content[data-page=settings] .setting-row>button{font-size:11px;padding:7px 10px;max-width:46%}
 .app-content[data-page=settings] .setting-row .sub{font-size:10px}
 .app-content[data-page=stats] .grid{gap:22px}
 .app-content[data-page=stats] .heading{margin:0}
 .app-content[data-page=stats] .filters,.app-content[data-page=stats]>.form-grid{margin:0}
 .app-content[data-page=stats] .form-grid .field{margin:0}
 .app-content[data-page=stats] .metric{font-size:28px}
 .app-content[data-page=stats] .card .row{gap:10px}
 .app-content[data-page=stats] .card .row .avatar{width:30px;height:30px}
 .app-content[data-page=stats] .card .row .avatar .sw-icon{width:18px;height:18px}
 dialog{width:min(700px,calc(100vw - 80px));max-height:calc(100dvh - 64px);border-radius:14px;box-shadow:0 22px 100px #0004}
 .modal-inner{padding:0 27px 27px}
 .modal-top{min-height:74px;margin:0 -27px 25px;padding:13px 20px;border-bottom:1px solid var(--line)}
 .modal-top h2{font-size:20px}
 .modal-inner .field{margin-bottom:21px}
 dialog[data-view=expense]{width:min(900px,calc(100vw - 80px))}
 #expense-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 27px;align-items:start}
 #expense-form>.expense-scan,#expense-form>.field:has(#expense-description),#expense-form>#payers-area,#expense-form>.separator,#expense-form>.field:has(#split-mode),#expense-form>#items-area,#expense-form>.field:has(#expense-notes),#expense-form>.form-grid:has(#expense-repeat),#expense-form>#receipt-status,#expense-form>.actions,#expense-form>#ocr-area,#expense-form>#expense-error,#expense-form>.footer-actions{grid-column:1/-1}
 #expense-form>.expense-scan{margin:0 0 23px}
 #expense-form .scan-receipt{margin:0;width:100%;min-height:54px;flex-direction:row;justify-content:center;gap:12px;background:var(--surface-soft);border:1px dashed var(--input-line);border-radius:8px}
 #expense-form .scan-receipt .sw-icon{width:23px;height:23px}
 #expense-form>#split-rows{grid-column:1;min-width:0;padding-bottom:15px}
 #expense-form>#expense-preview{grid-column:2;margin:0 0 22px;padding:16px;min-width:0}
 #expense-form:has(#split-rows.hidden)>#expense-preview{grid-column:1/-1}
 #expense-form .split-row{grid-template-columns:minmax(0,1fr) minmax(84px,110px);margin:0 0 10px;min-height:40px}
 #expense-form>.form-grid{gap:12px}
 #expense-form>.field:has(#expense-description) input{font-size:17px}
 #items-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
 #items-list>.item-row{margin:0 0 18px;padding:15px}
 #items-list>.item-row:only-child{grid-column:1/-1}
 #items-list .participant-checks{gap:7px}
 #expense-form>.footer-actions{border-top:1px solid var(--line);padding-top:20px;margin-top:23px}
 .footer-actions{gap:10px}
 .entry-shell,.shell:has(>.welcome){display:flex;align-items:center;justify-content:center;margin-left:0;padding:54px 32px;min-height:100dvh}
 .entry-shell>.welcome,.shell>.welcome{max-width:540px;width:100%;margin:0;padding:44px 46px;background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:0 14px 50px #00000008}
 .entry-shell>.welcome h1{font-size:37px;line-height:1.22}
 .entry-shell>.welcome .mark{width:61px;height:61px;margin-bottom:28px}
 #toast{bottom:28px;left:calc(50% + var(--desktop-sidebar)/2);max-width:600px}
}
@media(min-width:1280px){
 :root{--desktop-sidebar:232px;--desktop-gutter:32px}
 .shell{grid-template-columns:minmax(0,1fr) 264px;padding:26px 32px 56px}
 .shell:has(.group-banner){padding-top:26px}
 .group-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}
 .group-list>.add-friend{grid-column:1/-1}
 .group-list .list-button{gap:14px;padding:18px 16px;min-height:139px}
 .group-list .group-cover{width:72px;height:78px}
 .desktop-summary,.desktop-groups{margin-bottom:22px}
 .desktop-summary{padding:25px 22px}
 .desktop-summary h2{font-size:18px}
 .desktop-balance{font-size:32px}
}
@media(min-width:1560px){
 .shell{grid-template-columns:minmax(0,1fr) 280px;padding:28px 38px 60px;gap:0 36px}
 .shell:has(.group-banner){padding-top:28px}
 .group-list .group-cover{width:86px;height:86px}
 .group-list .list-button{padding:22px 20px;min-height:152px;gap:20px}
 .group-list .row-title{font-size:17px}
 .group-list .group-balance{font-size:15px}
}

/* Account hierarchy. Shared by the PWA and generated preview, isolated from the
   financial views. Subsections keep their own navigation and platform status. */
.app-content[data-page=settings][data-settings-section]{display:block;min-width:0;max-width:100%}
.app-content[data-page=settings][data-settings-section=root]>.profile-header{gap:13px;margin:0 0 11px;padding:10px 0 23px;min-width:0}
.app-content[data-page=settings][data-settings-section=root]>.profile-header>div{flex:1;min-width:0}
.app-content[data-page=settings][data-settings-section=root]>.profile-header h1{font-size:21px;line-height:1.4;margin:0 0 4px;overflow-wrap:anywhere}
.app-content[data-page=settings][data-settings-section=root]>.profile-header .sub{font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.profile-header .profile-edit{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:none;min-height:44px;max-width:43%;margin-left:auto;padding:10px 12px;font-size:11px;line-height:1.45;color:var(--teal);border:1px solid var(--line);border-radius:23px;white-space:normal;text-align:center;overflow-wrap:anywhere}
.profile-header .profile-edit .sw-icon{width:16px;height:16px}
.account-menu-root{display:grid;grid-template-columns:minmax(0,1fr);gap:23px;padding:5px 0 20px;min-width:0}
.account-menu-group{min-width:0}
.account-menu-group>h2{margin:0 0 6px;padding:0 0 6px;color:var(--muted);font:600 12px/1.5 Montserrat,Lato,sans-serif;letter-spacing:.02em}
.account-menu-row{display:flex;align-items:center;gap:12px;width:100%;min-width:0;min-height:70px;margin:0;padding:13px 0;text-align:left;background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;box-shadow:none;color:var(--ink);font-family:Lato,sans-serif;font-weight:400;letter-spacing:0}
.account-menu-row:last-child{border-bottom:0}
.account-menu-row:hover{background:var(--surface-soft)}
.account-menu-row:active{background:var(--surface-tint)}
.account-menu-row:focus-visible{position:relative;z-index:1;outline:2px solid var(--teal-bright);outline-offset:3px;border-radius:5px}
.account-menu-icon{display:grid;place-items:center;flex:none;width:32px;height:38px;color:var(--muted)}
.account-menu-icon .sw-icon{width:23px;height:23px;stroke-width:1.65}
.account-menu-copy{flex:1;display:block;min-width:0}
.account-menu-copy>strong{display:block;font:500 14px/1.5 Montserrat,Lato,sans-serif;letter-spacing:0;color:var(--ink);overflow-wrap:anywhere}
.account-menu-copy>.sub{display:block;font:400 12px/1.5 Lato,sans-serif;letter-spacing:.015em;margin-top:3px;color:var(--muted);overflow-wrap:anywhere}
.account-menu-value{display:block;flex:none;max-width:100px;margin-left:3px;color:var(--muted);font:400 12px/1.45 Lato,sans-serif;letter-spacing:.01em;text-align:right;overflow-wrap:anywhere}
.account-menu-chevron{display:grid;place-items:center;flex:none;width:15px;color:var(--muted)}
.account-menu-chevron .sw-icon{width:15px;height:18px;stroke-width:1.5}
.settings-heading{display:flex;align-items:center;gap:10px;min-width:0;min-height:66px;margin:0 0 15px;padding:8px 0;border-bottom:1px solid var(--line)}
.settings-heading>.toolbar-icon{flex:none;width:44px;height:44px;min-height:44px;margin-left:-9px;padding:11px;color:var(--ink)}
.settings-heading>h1{flex:1;min-width:0;margin:0;font:500 20px/1.4 Montserrat,Lato,sans-serif;letter-spacing:0;overflow-wrap:anywhere}
.settings-panel{width:100%;min-width:0;max-width:850px;margin:0;padding:0 0 20px}
.settings-panel>.card{min-width:0;margin:0 0 19px;padding:18px 0 22px;background:var(--surface);border:0;border-bottom:1px solid var(--line);border-radius:0}
.settings-panel>.card:last-child{margin-bottom:0}
.app-content[data-page=settings] .settings-panel .card>h2{font-size:16px;line-height:1.5;margin:0 0 17px}
.settings-panel .card-head{align-items:flex-start;gap:12px;margin-bottom:16px}
.settings-panel .card-head h2{font-size:16px;line-height:1.5;margin:0}
.settings-panel .field{margin-bottom:20px}
.settings-panel .field>label{font-size:13px;line-height:1.5}
.settings-panel input:not([type=checkbox]):not([type=radio]),.settings-panel select{min-height:44px}
.settings-panel button{min-height:44px;overflow-wrap:anywhere;white-space:normal}
.settings-panel .actions{margin-top:15px;gap:9px}
.settings-panel .actions>button{max-width:100%;font-size:12px}
.settings-panel .note,.settings-note{font:400 12px/1.65 Lato,sans-serif;letter-spacing:.01em;color:var(--muted);overflow-wrap:anywhere}
.settings-note{display:block;margin:16px 0;padding:12px 14px;background:var(--surface-soft);border:1px solid var(--line);border-radius:7px}
.settings-note p:first-child{margin-top:0}.settings-note p:last-child{margin-bottom:0}
.status-line{display:flex;align-items:flex-start;gap:7px;min-width:0;margin:9px 0;color:var(--muted);font:400 12px/1.55 Lato,sans-serif;letter-spacing:.01em;overflow-wrap:anywhere}
.status-line>.sw-icon{flex:none;width:17px;height:17px;margin-top:1px;color:var(--teal)}
.status-line.error{color:var(--error)}.status-line.error>.sw-icon{color:var(--error)}
.app-content[data-page=settings] .settings-panel .setting-row{gap:15px;min-height:69px;padding:15px 0;align-items:center}
.app-content[data-page=settings] .settings-panel .setting-row>span,.app-content[data-page=settings] .settings-panel .setting-row>div{font-size:14px;line-height:1.5;min-width:0}
.app-content[data-page=settings] .settings-panel .setting-row strong{font-size:14px;line-height:1.5;font-weight:500}
.app-content[data-page=settings] .settings-panel .setting-row .sub,.app-content[data-page=settings] .settings-panel .setting-row .sync-state{font-size:12px;line-height:1.55;margin-top:4px}
.app-content[data-page=settings] .settings-panel .setting-row>button{min-height:44px;max-width:43%;padding:9px 12px;font-size:11px;line-height:1.5;flex:none}
.settings-panel .setting-row:last-child{border-bottom:0}
.appearance-options{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin:16px 0 19px;min-width:0}
.appearance-option{position:relative;display:grid;grid-template-columns:22px minmax(0,1fr);align-content:start;align-items:start;gap:4px 12px;min-height:86px;min-width:0;padding:17px 15px;border:1px solid var(--line);border-radius:9px;background:var(--surface);cursor:pointer;transition:border-color .12s,background-color .12s}
.appearance-option:hover{background:var(--surface-soft)}
.appearance-option:has(input:checked){background:var(--surface-tint);border-color:var(--teal-bright);box-shadow:inset 0 0 0 1px var(--teal-bright)}
.appearance-option:has(input:focus-visible),.language-option:has(input:focus-visible){outline:2px solid var(--teal-bright);outline-offset:3px}
.appearance-option input[type=radio]{grid-column:1;grid-row:1/3;align-self:start;flex:none;width:19px;height:19px;min-height:19px;margin:2px 0 0;padding:0;accent-color:var(--teal-bright);cursor:pointer}
.appearance-option>strong{grid-column:2;grid-row:1;min-width:0;font:500 14px/1.5 Montserrat,Lato,sans-serif;letter-spacing:0;overflow-wrap:anywhere}
.appearance-option>.sub{grid-column:2;grid-row:2;min-width:0;margin:0;font:400 12px/1.5 Lato,sans-serif;letter-spacing:.01em;color:var(--muted);overflow-wrap:anywhere}
.language-options{display:grid;grid-template-columns:minmax(0,1fr);gap:0;margin:8px 0 15px;border:1px solid var(--line);border-radius:9px;overflow:visible;min-width:0}
.language-option{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 22px;align-items:center;gap:2px 14px;min-width:0;min-height:78px;padding:15px 16px;border-bottom:1px solid var(--line);background:var(--surface);cursor:pointer;transition:background-color .12s}
.language-option:first-child{border-radius:8px 8px 0 0}.language-option:last-child{border-bottom:0;border-radius:0 0 8px 8px}
.language-option:hover{background:var(--surface-soft)}.language-option:has(input:checked){background:var(--surface-tint)}
.language-option input[type=radio]{grid-column:2;grid-row:1/3;width:19px;height:19px;min-height:19px;padding:0;margin:0;accent-color:var(--teal-bright);cursor:pointer}
.language-option>strong{grid-column:1;grid-row:1;min-width:0;font:500 14px/1.5 Montserrat,Lato,sans-serif;letter-spacing:0;overflow-wrap:anywhere}
.language-option>.sub{grid-column:1;grid-row:2;min-width:0;margin:1px 0 0;font:400 12px/1.5 Lato,sans-serif;letter-spacing:.01em;overflow-wrap:anywhere}
.settings-switch:not(input){display:inline-flex;align-items:center;justify-content:center;flex:none;min-width:48px;min-height:44px;cursor:pointer}
input[type=checkbox].settings-switch,.settings-switch input[type=checkbox]{-webkit-appearance:none;appearance:none;position:relative;display:block;flex:none;width:48px;min-width:48px;height:44px;min-height:44px;padding:0;margin:0;border:0;border-radius:24px;background:transparent;cursor:pointer;accent-color:var(--teal-bright)}
input[type=checkbox].settings-switch:before,.settings-switch input[type=checkbox]:before{content:"";position:absolute;left:0;right:0;top:8px;height:28px;border:1px solid var(--input-line);border-radius:20px;background:var(--line);transition:background-color .14s,border-color .14s;pointer-events:none}
input[type=checkbox].settings-switch:after,.settings-switch input[type=checkbox]:after{content:"";position:absolute;left:4px;top:12px;width:20px;height:20px;border-radius:50%;background:var(--surface);box-shadow:0 1px 3px #0003;transition:transform .14s;pointer-events:none}
input[type=checkbox].settings-switch:checked:before,.settings-switch input[type=checkbox]:checked:before{background:var(--teal-bright);border-color:var(--teal-bright)}
input[type=checkbox].settings-switch:checked:after,.settings-switch input[type=checkbox]:checked:after{transform:translateX(20px);background:#fff}
input[type=checkbox].settings-switch:disabled,.settings-switch input[type=checkbox]:disabled{opacity:.4;cursor:default}
.settings-switch:focus-visible,.settings-switch input[type=checkbox]:focus-visible{outline:2px solid var(--teal-bright);outline-offset:2px}
.device-info{min-width:0;margin:14px 0}.device-info dl{display:grid;grid-template-columns:minmax(100px,.8fr) minmax(0,1.2fr);margin:0;gap:0;min-width:0}.device-info dt,.device-info dd{min-width:0;padding:13px 0;margin:0;border-bottom:1px solid var(--line);font-size:13px;line-height:1.5;overflow-wrap:anywhere}.device-info dt{padding-right:18px;color:var(--muted)}.device-info dd{font-variant-numeric:tabular-nums;color:var(--ink)}.device-info dt:last-of-type,.device-info dd:last-of-type{border-bottom:0}
@media(max-width:1023px){
 .shell:has(>.app-content[data-page=settings][data-settings-section]:not([data-settings-section=root]))>.app-toolbar{display:none}
 .app-content[data-page=settings][data-settings-section]:not([data-settings-section=root]) .settings-heading{position:sticky;top:0;z-index:6;background:var(--surface);margin-top:0;margin-bottom:2px;min-height:64px}
}
@media(min-width:600px){
 .appearance-options{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:12px}
 .appearance-option{grid-template-columns:20px minmax(0,1fr);padding:15px 12px;min-height:162px;gap:5px 8px}
 .appearance-option:before{content:"";grid-column:1/-1;grid-row:1;display:block;width:100%;height:65px;margin:0 0 10px;border:1px solid #cdd5d7;border-radius:5px;--preview-bg:#fff;--preview-ink:#dae3e1;--preview-bar:#18a582;background:linear-gradient(var(--preview-bar),var(--preview-bar)) 11px 9px/20px 5px no-repeat,linear-gradient(var(--preview-ink),var(--preview-ink)) 11px 25px/calc(100% - 22px) 4px no-repeat,linear-gradient(var(--preview-ink),var(--preview-ink)) 11px 35px/60% 4px no-repeat,linear-gradient(var(--preview-ink),var(--preview-ink)) 11px 45px/45% 4px no-repeat,var(--preview-bg)}
 .appearance-option:has(input[value=dark]):before{--preview-bg:#202224;--preview-ink:#66716e;border-color:#48514f}
 .appearance-option:has(input[value=system]):before{--preview-bg:linear-gradient(90deg,#fff 0 50%,#202224 50% 100%);--preview-ink:#a9bbb6}
 .appearance-option input[type=radio]{grid-row:2/4}.appearance-option>strong{grid-row:2}.appearance-option>.sub{grid-row:3}
 .language-options{max-width:620px}
}
@media(min-width:1024px){
 .shell:has(>.app-content[data-page=settings][data-settings-section]){grid-template-columns:minmax(0,1fr);grid-template-areas:"toolbar" "content"}
 .shell:has(>.app-content[data-page=settings][data-settings-section])>.desktop-overview{display:none}
 .app-content[data-page=settings][data-settings-section]{display:block;padding-bottom:25px;min-width:0}
 .app-content[data-page=settings][data-settings-section=root]>.profile-header{padding:3px 0 27px;margin:0 0 25px;gap:18px;border-bottom:1px solid var(--line)}
 .app-content[data-page=settings][data-settings-section=root]>.profile-header>.avatar{width:68px;height:68px;font-size:23px}
 .app-content[data-page=settings][data-settings-section=root]>.profile-header h1{font-size:24px}
 .profile-header .profile-edit{font-size:12px;padding:11px 17px;gap:8px}
 .account-menu-root{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-items:start;padding:0 0 30px}
 .account-menu-group{padding:21px 18px 8px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
 .account-menu-group>h2{font-size:13px;color:var(--ink);margin:0 0 10px;padding:0 5px 9px}
 .account-menu-row{min-height:80px;padding:15px 4px;gap:10px}
 .account-menu-icon{width:28px;height:32px}.account-menu-icon .sw-icon{width:21px;height:21px}
 .account-menu-copy>strong{font-size:13px;line-height:1.5}.account-menu-copy>.sub{font-size:12px;line-height:1.55}
 .account-menu-value{font-size:11px;max-width:86px}
 .account-menu-chevron{width:12px}.account-menu-chevron .sw-icon{width:12px}
 .settings-heading{width:100%;max-width:850px;min-height:58px;margin:0 0 23px;padding:0 0 17px;gap:11px}
 .settings-heading>h1{font-size:24px;line-height:1.4}.settings-heading>.toolbar-icon{margin-left:-9px}
 .settings-panel{max-width:850px;display:block;padding-bottom:24px}
 .app-content[data-page=settings] .settings-panel>.card{padding:24px;border:1px solid var(--line);border-radius:10px;margin:0 0 20px}
 .app-content[data-page=settings] .settings-panel .card>h2{font-size:17px;margin-bottom:19px}
 .settings-panel .form-grid{gap:20px}.settings-panel .field>label{font-size:12px}
 .settings-panel input:not([type=checkbox]):not([type=radio]),.settings-panel select,.settings-panel textarea{font-size:14px}
 .app-content[data-page=settings] .settings-panel .setting-row>span,.app-content[data-page=settings] .settings-panel .setting-row>div{font-size:14px}
 .app-content[data-page=settings] .settings-panel .setting-row>button{font-size:12px;max-width:40%;padding:10px 15px}
 .app-content[data-page=settings] .settings-panel .setting-row .sub,.app-content[data-page=settings] .settings-panel .setting-row .sync-state{font-size:12px}
 .settings-panel .note,.settings-note{font-size:12px;line-height:1.7}
 .appearance-options{gap:15px}.appearance-option{padding:17px 15px;min-height:168px}
 .appearance-option:before{height:70px}.appearance-option>strong{font-size:14px}
}
@media(min-width:1440px){.account-menu-root{grid-template-columns:repeat(3,minmax(0,1fr));gap:23px}.account-menu-group{padding:23px 17px 9px}.account-menu-row{gap:9px}.account-menu-icon{width:26px}.account-menu-value{max-width:75px}}
@media(max-width:359px){
 .app-content[data-page=settings][data-settings-section=root]>.profile-header{gap:10px;padding-bottom:20px}
 .app-content[data-page=settings][data-settings-section=root]>.profile-header>.avatar{width:48px;height:48px;font-size:17px}
 .app-content[data-page=settings][data-settings-section=root]>.profile-header h1{font-size:18px}
 .profile-header .profile-edit{max-width:39%;padding:9px 10px;font-size:10px;gap:4px}
 .account-menu-root{gap:20px}.account-menu-row{gap:9px;min-height:72px;padding:14px 0}
 .account-menu-icon{width:26px}.account-menu-icon .sw-icon{width:21px;height:21px}
 .account-menu-copy>strong{font-size:13px}.account-menu-copy>.sub{font-size:11px;line-height:1.5}
 .account-menu-value{max-width:72px;font-size:11px;margin-left:0}.account-menu-chevron{width:11px}
 .settings-heading>h1{font-size:19px}.settings-heading{gap:7px}
 .app-content[data-page=settings] .settings-panel .setting-row{gap:11px;padding:15px 0}
 .app-content[data-page=settings] .settings-panel .setting-row>button{max-width:42%;padding:8px 9px;font-size:11px}
 .app-content[data-page=settings] .settings-panel .setting-row>span,.app-content[data-page=settings] .settings-panel .setting-row>div{font-size:13px}
 .appearance-option{padding:16px 13px;gap:4px 10px}.appearance-option>strong{font-size:13px}
 .language-option{padding:15px 13px;gap:2px 12px}.language-option>strong{font-size:13px}
 .device-info dl{grid-template-columns:minmax(90px,.8fr) minmax(0,1.2fr)}.device-info dt,.device-info dd{font-size:12px}.device-info dt{padding-right:12px}
}
@media(prefers-reduced-motion:reduce){.appearance-option,.language-option,input[type=checkbox].settings-switch:before,input[type=checkbox].settings-switch:after,.settings-switch input[type=checkbox]:before,.settings-switch input[type=checkbox]:after{transition:none}}
/* Appearance follows the original three-row selector on handheld screens.
   The radio remains accessible; the visible selection is a brand-color check. */
.appearance-options{display:block;margin:15px 0 19px;border:1px solid var(--line);border-radius:12px;overflow:visible}
.appearance-option{display:grid;grid-template-columns:25px minmax(0,1fr) 19px;align-items:center;gap:13px;min-height:83px;padding:16px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:var(--surface);box-shadow:none;transition:background-color .12s}
.appearance-option:first-child{border-radius:11px 11px 0 0}.appearance-option:last-child{border-bottom:0;border-radius:0 0 11px 11px}
.appearance-option:has(input:checked){background:var(--surface);border-color:var(--line);box-shadow:none}
.appearance-option:hover{background:var(--surface-soft)}
.appearance-option:before{content:"";grid-column:1;grid-row:1;align-self:center;display:block;width:24px;height:24px;margin:0;padding:0;border:0;border-radius:0;background:var(--muted);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2m0 16v2M2 12h2m16 0h2M5 5l1.4 1.4m11.2 11.2L19 19M5 19l1.4-1.4M17.6 6.4L19 5'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2m0 16v2M2 12h2m16 0h2M5 5l1.4 1.4m11.2 11.2L19 19M5 19l1.4-1.4M17.6 6.4L19 5'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat}
.appearance-option:has(input[value=dark]):before{background:var(--muted);border:0;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.6' stroke-linejoin='round' d='M20.5 14.3A8.7 8.7 0 0 1 9.7 3.5 8.8 8.8 0 1 0 20.5 14.3Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.6' stroke-linejoin='round' d='M20.5 14.3A8.7 8.7 0 0 1 9.7 3.5 8.8 8.8 0 1 0 20.5 14.3Z'/%3E%3C/svg%3E")}
.appearance-option:has(input[value=system]):before{background:var(--muted);-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle fill='none' stroke='%23000' stroke-width='1.6' cx='12' cy='12' r='8.3'/%3E%3Cpath fill='%23000' d='M12 3.7a8.3 8.3 0 0 1 0 16.6Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle fill='none' stroke='%23000' stroke-width='1.6' cx='12' cy='12' r='8.3'/%3E%3Cpath fill='%23000' d='M12 3.7a8.3 8.3 0 0 1 0 16.6Z'/%3E%3C/svg%3E")}
.appearance-option:after{content:"";display:block;grid-column:3;grid-row:1;align-self:center;justify-self:center;width:7px;height:13px;border:solid var(--teal-bright);border-width:0 2px 2px 0;transform:rotate(45deg);opacity:0;margin-top:-3px}
.appearance-option:has(input:checked):after{opacity:1}
.appearance-option input[type=radio]{position:absolute;width:1px;height:1px;min-height:1px;padding:0;margin:0;opacity:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.appearance-option>span:not(.appearance-sample){grid-column:2;grid-row:1;display:block;min-width:0}
.appearance-option>span:not(.appearance-sample)>strong{display:block;min-width:0;margin:0;font:500 14px/1.5 Montserrat,Lato,sans-serif;letter-spacing:0;overflow-wrap:anywhere}
.appearance-option>span:not(.appearance-sample)>.sub{display:block;min-width:0;margin:3px 0 0;font:400 12px/1.55 Lato,sans-serif;letter-spacing:.01em;overflow-wrap:anywhere}
.appearance-option>.appearance-sample{display:none}
label.setting-row.settings-switch{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:69px;border-radius:0;cursor:pointer}
label.setting-row.settings-switch>span{flex:1;min-width:0}
dl.device-info{display:block;margin:14px 0;min-width:0}dl.device-info>div{display:grid;grid-template-columns:minmax(100px,.8fr) minmax(0,1.2fr);min-width:0;border-bottom:1px solid var(--line)}dl.device-info>div:last-child{border-bottom:0}dl.device-info>div>dt,dl.device-info>div>dd{margin:0;padding:13px 0;border:0;min-width:0;font-size:13px;line-height:1.55;overflow-wrap:anywhere}dl.device-info>div>dt{padding-right:17px;color:var(--muted)}
@media(min-width:1024px){
 .appearance-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;border:0;border-radius:0}
 .appearance-option,.appearance-option:first-child,.appearance-option:last-child{grid-template-columns:23px minmax(0,1fr) 16px;align-items:start;gap:10px;min-height:183px;padding:16px 13px;border:1px solid var(--line);border-radius:10px}
 .appearance-option:has(input:checked){background:var(--surface-tint);border-color:var(--teal-bright);box-shadow:inset 0 0 0 1px var(--teal-bright)}
 .appearance-option>.appearance-sample{grid-column:1/-1;grid-row:1;display:flex;flex-direction:column;align-items:flex-start;width:100%;min-width:0;height:72px;padding:12px;margin:0 0 8px;background:#fff;border:1px solid #d9e1dd;border-radius:5px;overflow:hidden}
 .appearance-sample>i{display:block;width:75%;height:4px;min-height:4px;margin:6px 0 0;background:#d9e2df;border-radius:2px}.appearance-sample>i:first-child{width:24%;margin:0 0 4px;background:#18a582}.appearance-sample>i:last-child{width:55%}
 .appearance-option>.appearance-sample.dark{background:#202224;border-color:#4e5754}.appearance-sample.dark>i{background:#687773}.appearance-sample.dark>i:first-child{background:#18a582}
 .appearance-option>.appearance-sample.system{background:linear-gradient(90deg,#fff 0 50%,#202224 50% 100%);border-color:#87928e}.appearance-sample.system>i{background:#adbfba}.appearance-sample.system>i:first-child{background:#18a582}
 .appearance-option:before{grid-row:2;width:22px;height:22px;margin:1px 0 0;align-self:start}.appearance-option:after{grid-row:2;margin-top:4px;align-self:start}
 .appearance-option>span:not(.appearance-sample){grid-row:2}.appearance-option>span:not(.appearance-sample)>strong{font-size:13px}.appearance-option>span:not(.appearance-sample)>.sub{font-size:12px}
}
@media(max-width:359px){.appearance-option{padding:16px 13px;gap:10px;grid-template-columns:23px minmax(0,1fr) 15px}.appearance-option>span:not(.appearance-sample)>strong{font-size:13px}dl.device-info>div{grid-template-columns:minmax(86px,.8fr) minmax(0,1.2fr)}dl.device-info>div>dt,dl.device-info>div>dd{font-size:12px}dl.device-info>div>dt{padding-right:12px}}
.app-content[data-settings-section=appearance] .settings-panel{padding:18px 16px;background:var(--surface-soft);border-radius:12px}
.app-content[data-page=settings][data-settings-section=appearance] .settings-panel>.card{padding:0;margin:0;background:transparent;border:0;border-radius:0}
.app-content[data-settings-section=appearance] .settings-panel .appearance-options{background:var(--surface)}
@media(min-width:1024px){.app-content[data-settings-section=appearance] .settings-panel{padding:24px}.app-content[data-settings-section=appearance] .settings-panel .appearance-options{background:transparent}}
/* Economic profile actions remain usable at narrow phone widths. */
.group-member-preview{display:flex;align-items:center;gap:11px;width:100%;max-width:540px;margin:14px 0 0;padding:12px 14px;border:1px solid #ffffff66;border-radius:12px;background:#ffffff16;color:inherit;text-align:left;min-height:60px;white-space:normal}
.group-member-preview:hover{background:#ffffff25}.group-member-preview:focus-visible{outline:2px solid currentColor;outline-offset:4px}.member-preview-avatars{display:flex;align-items:center;flex:none;padding-right:5px}.member-preview-avatars .avatar{width:32px;height:32px;margin-right:-8px;border:2px solid var(--teal);font-size:11px;background:var(--surface);color:var(--ink)}.member-preview-copy{display:flex;flex-direction:column;min-width:0;gap:3px;font-size:12px;line-height:1.4}.member-preview-copy>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-preview-copy>strong{font-size:14px;font-weight:600}.member-preview-link{text-decoration:underline;text-underline-offset:3px}.member-preview-chevron{margin-left:auto;font-size:27px;line-height:1;flex:none}.member-owner-group{padding:0 0 14px;margin:24px 0 0;border-bottom:1px solid var(--line)}.member-owner-group:last-child{border-bottom:0}.member-owner-group h3{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 8px;font-size:16px;overflow-wrap:anywhere}.member-owner-group .group-member-row{padding-left:14px;align-items:center}.group-member-row .row-main{overflow-wrap:anywhere;min-width:0}.group-member-row strong{font-weight:500}#group-members-list>.note{line-height:1.6}
@media(max-width:359px){.group-member-preview{gap:8px;padding:11px 10px}.member-preview-avatars .avatar{width:27px;height:27px;font-size:9px}.member-preview-copy{font-size:11px}.member-preview-copy>strong{font-size:13px}.member-owner-group .group-member-row{padding-left:8px}}
.member-owner-group .group-member-row{min-height:64px;gap:16px;padding-top:8px;padding-bottom:8px}.group-member-row>.avatar{width:44px;height:44px;flex:none}
.budget-management,.budget-breakdown{min-width:0}.budget-management h3,.budget-breakdown h3{overflow-wrap:anywhere}.budget-management>form{border:1px solid var(--line);border-radius:12px;padding:16px;margin:18px 0}.budget-period{padding:22px 0;border-top:1px solid var(--line);margin-top:20px}.budget-period .card-head{align-items:flex-start;flex-wrap:wrap;gap:8px}.budget-period h3{font-size:15px;margin:0}.budget-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}.budget-metrics>div{min-width:0}.budget-metrics dt{font-size:12px;color:var(--muted);margin-bottom:5px}.budget-metrics dd{margin:0;font-size:17px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.budget-profile{display:flex;align-items:center;flex-wrap:wrap;gap:12px;min-height:68px;border-top:1px solid var(--line);padding:12px 0}.budget-profile>.row-main{min-width:120px;overflow-wrap:anywhere}.budget-profile .sub{line-height:1.7}.budget-total-button{display:flex;flex-direction:column;align-items:flex-start;gap:9px;border:0;background:transparent;color:var(--ink);padding:8px 0;max-width:100%;text-align:left}.budget-total-button>span{font-size:12px;color:var(--teal);text-decoration:underline;text-underline-offset:3px}.budget-current-summary{margin:24px 0}.budget-legacy{border-top:1px solid var(--line);padding-top:12px}.budget-profile input{max-width:100%}
@media(max-width:400px){.budget-metrics{grid-template-columns:1fr;gap:10px}.budget-metrics>div{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.budget-metrics dt{max-width:52%}.budget-metrics dd{text-align:right}.budget-management>form{padding:12px}.budget-profile>button{max-width:100%}}
.clarification-shell{display:block!important;max-width:1080px;margin:0 auto!important;padding-top:max(18px,env(safe-area-inset-top))!important}.clarification-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}.clarification-toolbar>strong{padding-top:13px;font-size:19px}.clarification-intro h1{font-size:26px;line-height:1.25}.clarification-shell .debt-proposals{margin-top:18px}.debt-reversal{margin-top:16px;padding:12px;border:1px solid var(--line);border-radius:9px;background:var(--surface-soft)}.debt-reversal h4{font-size:13px;margin:0 0 8px}.settlement-fixed dd{overflow-wrap:anywhere}.payment-row{flex-wrap:wrap}.payment-row>.row-main{min-width:130px}.payment-row .clearing-payment-label{display:block;margin-top:5px}
.app-content[data-page=groups]:has(>.group-banner)>.actions.filter-chips{flex-wrap:wrap;overflow:visible;white-space:normal;row-gap:8px}.app-content[data-page=groups]:has(>.group-banner)>.actions.filter-chips>button{max-width:100%;white-space:normal;min-height:40px}
.profile-row{align-items:flex-start}
.profile-row>.row-main{min-width:120px}
.profile-row>.actions{flex-wrap:wrap}
.approval-badge.pending{background:var(--warning);color:var(--ink)}
.approval-badge.rejected,.approval-badge.cancelled{color:var(--debt)}
.identity-inbox .actions{flex-wrap:wrap}
@media(max-width:600px){
 .profile-row{flex-wrap:wrap}
 .profile-row>.row-main{min-width:min(180px,100%);flex:1 1 140px}
 .profile-row>.actions{flex:1 0 100%;flex-wrap:wrap;justify-content:flex-start;margin-top:4px}
 .profile-row>.actions button{min-height:44px}
}

/* Access administration keeps long public identifiers readable on narrow screens. */
.access-code-row .card-head,.access-guest-row .card-head,.access-user-row .card-head{flex-wrap:wrap;align-items:flex-start}
.access-code-row .card-head h3,.access-guest-row .card-head h3,.access-user-row .card-head h3{flex:1 1 180px;min-width:0;margin:0;overflow-wrap:anywhere;line-height:1.5}
.access-code-row .device-info dd,.access-guest-row .device-info dd,.access-user-row .device-info dd{overflow-wrap:anywhere;min-width:0}
.access-secret{min-width:0;max-width:100%}
.access-secret input{font:14px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;max-width:100%;min-height:48px}
.access-secret .actions{display:flex;flex-wrap:wrap;gap:10px}
.access-secret .actions>button{max-width:100%;white-space:normal;overflow-wrap:anywhere}
@media(max-width:480px){.access-code-row .device-info>div,.access-guest-row .device-info>div,.access-user-row .device-info>div{grid-template-columns:minmax(105px,1fr) minmax(0,1.25fr)}.access-secret .actions>button{flex:1 1 100%}}
/* Shared profile pictures, focused social lookup and nested dialog confirmations. */
.avatar>img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}.avatar:has(img){padding:0;overflow:hidden;background:var(--surface-soft)!important}.avatar-preview-large .avatar{width:96px;height:96px;font-size:30px;margin:0 auto 20px}.avatar-manager{text-align:center}.avatar-manager .file-button{margin:10px}.avatar-manager input[type=file]{inset:0;width:100%;height:100%}#avatar-crop-preview{display:block;width:min(100%,330px);height:auto;aspect-ratio:1;margin:0 auto 22px;border:2px solid var(--line);border-radius:50%;background:#fff;touch-action:none}.social-result,.social-request{flex-wrap:wrap;gap:12px}.social-result .row-main,.social-request .row-main{min-width:min(160px,100%);overflow-wrap:anywhere}.social-result>.actions,.social-request>.actions{flex-wrap:wrap}.public-identity strong{overflow-wrap:anywhere}.dialog-confirm{min-height:0}.dialog-confirm .footer-actions{margin-bottom:4px}dialog[aria-busy=true] .modal-top>[data-action=close]{opacity:.45}.group-invitation h3{overflow-wrap:anywhere}@media(max-width:480px){.social-result .actions,.social-request .actions{flex-basis:100%}.dialog-confirm .footer-actions{display:grid;grid-template-columns:1fr}.avatar-manager .file-button{max-width:100%}}

.avatar{position:relative}.avatar-initials{display:flex;align-items:center;justify-content:center;width:100%;height:100%;line-height:1}.avatar>img[data-avatar-image]{position:absolute;inset:0;opacity:0}.avatar.avatar-loaded>img[data-avatar-image]{opacity:1}.avatar.friend-avatar:has(.avatar-initials){font-size:14px}
/* Payment plans and receipt choices share the existing cards and native dialog. */
.receipt-remove-question{font-size:16px;line-height:1.6;color:var(--ink)}.receipt-remove-actions{display:flex;flex-direction:column;gap:11px;margin-top:22px}.receipt-remove-actions button{width:100%;min-height:46px;white-space:normal}.receipt-remove-actions .danger{border-color:var(--error);color:var(--error)}.receipt-removal-notice{margin:18px 0}.receipt-removal-notice p{margin:8px 0 0}.receipt-amount-delta{font-variant-numeric:tabular-nums}.debt-proposals{display:grid;grid-template-columns:minmax(0,1fr);gap:15px}.debt-proposal{min-width:0;margin:0}.debt-proposal .card-head{align-items:flex-start;flex-wrap:wrap;gap:8px}.debt-proposal h3,.debt-explanation h3{overflow-wrap:anywhere}.debt-actions{margin-top:15px}.debt-actions button{white-space:normal}.debt-status.disputed{color:var(--error);border-color:var(--error)}.debt-status.confirmed{color:var(--teal)}.debt-timeline{padding-left:22px;line-height:1.7}.debt-timeline li{margin:10px 0}.debt-timeline .sub{display:block}.debt-allocation{align-items:flex-start;flex-wrap:wrap}.debt-allocation strong{font-variant-numeric:tabular-nums}.friend-debt-consent{width:100%;margin-top:12px;padding:14px;border:1px solid var(--line);border-radius:9px;background:var(--surface-soft)}.friend-debt-consent h3{font-size:13px;margin-top:0}.group-debt-setting{display:flex;align-items:flex-start;gap:12px}.group-debt-setting input{margin-top:4px;flex:none}.group-debt-setting strong{display:block}.clearing-payment-label{font-size:11px;color:var(--muted)}@media(min-width:1024px){.app-content[data-settings-section=payments] .debt-proposals{grid-template-columns:repeat(2,minmax(0,1fr))}.receipt-remove-actions{gap:12px}}

/* Reviewed optional explanations. Native details supplies keyboard, touch and
   expanded-state semantics without a second navigation or form controller. */
details.compact-help{margin:6px 0;border:1px solid var(--line);border-radius:9px;background:var(--surface-soft);color:var(--ink);min-width:0;overflow-wrap:anywhere}
details.compact-help>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:10px 12px;font-size:14px;line-height:1.45;letter-spacing:0;font-weight:600;cursor:pointer;list-style:none}
details.compact-help>summary::-webkit-details-marker{display:none}
details.compact-help>summary::after{content:"";display:block;width:8px;height:8px;flex:none;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:rotate(45deg);margin:-4px 3px 0 0}
details.compact-help[open]>summary::after{transform:rotate(225deg);margin-top:4px}
details.compact-help>summary:hover{background:var(--surface-tint);border-radius:8px}
details.compact-help>summary:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:8px}
details.compact-help>p.note,details.compact-help>p.muted{margin:0;padding:0 12px 12px;font-size:14px;line-height:1.6;color:var(--muted);letter-spacing:0}
/* White regular-size CTA labels require at least 4.5:1. Existing darker teal
   supplies 4.54:1; bright teal stays available for decorative brand accents. */
button.primary,.floating-expense,.nav>.desktop-new-expense,body.dark button.primary,body.dark .floating-expense{background:var(--teal-dark)}
button.primary:hover,.floating-expense:hover,.nav>.desktop-new-expense:hover,body.dark button.primary:hover,body.dark .floating-expense:hover{background:var(--teal-dark)}
@media(prefers-reduced-motion:reduce){details.compact-help,details.compact-help>summary{transition:none;animation:none}}
/* Shared payment inbox entry stays next to the existing expense action. */
.payment-inbox-shortcut{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;min-height:44px;padding:10px;border-radius:50%;border:1px solid var(--teal);background:var(--surface);color:var(--teal);box-shadow:0 3px 7px #0003}
.payment-inbox-count{position:absolute;top:-5px;right:-5px;min-width:21px;height:21px;display:flex;align-items:center;justify-content:center;padding:0 5px;border-radius:12px;background:#b91c1c;color:#fff;font:700 11px Lato,sans-serif;line-height:1;border:2px solid var(--surface);font-variant-numeric:tabular-nums}
.floating-payment-inbox{position:fixed;z-index:21;right:max(calc((100vw - var(--page-width))/2 + 16px),16px);bottom:calc(var(--nav-height) + 72px + env(safe-area-inset-bottom))}
.payment-inbox-tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-top:16px}
.payment-inbox-tabs>[role=tab]{flex:1;border-radius:0;border:0;border-bottom:3px solid transparent;background:transparent;padding:12px 8px;min-width:0}
.payment-inbox-tabs>[aria-selected=true]{border-bottom-color:var(--teal);color:var(--teal);font-weight:700}
.payment-inbox-section{margin-top:20px;min-width:0}.payment-inbox-section>h3{font-size:14px;color:var(--muted)}
@media(min-width:600px){.floating-payment-inbox{right:max(calc((100vw - var(--page-width))/2 + 24px),24px)}}
@media(max-width:1023px){.shell:has(+.floating-payment-inbox){padding-bottom:calc(194px + env(safe-area-inset-bottom))}}
@media(min-width:1024px){.floating-payment-inbox{display:none}.nav>.desktop-payment-inbox{display:flex;align-self:flex-end;flex:none;flex-direction:row;align-items:center;justify-content:center;width:44px;min-height:44px;height:44px;padding:10px;margin-top:14px;border:1px solid var(--teal);border-radius:50%;background:var(--surface);color:var(--teal);box-shadow:0 3px 7px #0003}.nav>.desktop-new-expense{margin-top:12px}.nav>.desktop-payment-inbox .payment-inbox-count{display:flex}}

/* Contrast correction146: focus rings use the semantic high-contrast color. */
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible,.account-menu-row:focus-visible{outline-color:var(--teal)}