:root{--tab-height:62px;--bottom:env(safe-area-inset-bottom,0px);--left:max(14px,env(safe-area-inset-left));--right:max(14px,env(safe-area-inset-right))}
body{font-family:-apple-system,BlinkMacSystemFont,system-ui,sans-serif}
header{position:sticky;top:0;z-index:3;padding:calc(7px + env(safe-area-inset-top)) var(--right) 7px var(--left);min-height:46px}
header .brand{min-width:0;gap:9px}.brand b{font-size:14px;padding:5px 8px}.brand #brand{display:none}.brand .ios-title{display:block;font-size:17px;letter-spacing:-.025em;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#nav:not(:empty){position:fixed;z-index:4;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding:3px var(--right) calc(3px + var(--bottom)) var(--left);height:calc(var(--tab-height) + var(--bottom));background:var(--paper);border-top:1px solid var(--line)}
#nav button{border:0;background:transparent;color:var(--soft);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;font-size:11px;padding:2px;min-height:44px;line-height:1.2}
#nav svg{width:28px;height:26px;padding:2px;border-radius:7px}#nav button.sel{color:#344256}#nav .sel svg{background:#E9EEF5;color:#344256}.dark #nav .sel{color:#C7D4E8}#nav button[data-act=logout]{display:none}
main{padding:12px var(--right) calc(24px + var(--tab-height) + var(--bottom)) var(--left);max-width:100%;min-width:0}
main h1{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:0}
main>.row{justify-content:flex-end}button,a.btn{min-height:44px;touch-action:manipulation}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 0}.stat{min-width:0;margin:0;padding:10px;border-radius:14px;box-shadow:0 2px 6px #202A3508}.stat small{font-size:12px}.stat strong{font-size:clamp(16px,5.3vw,22px);font-variant-numeric:tabular-nums;line-height:1.2;white-space:nowrap}
.panel{min-width:0;margin:12px 0;padding:12px;border-radius:16px}.panel h2{font-size:19px}.tools input,.tools select,input,select,textarea{font-size:16px;min-height:44px}.tools{gap:8px}.scroll{max-width:100%;min-width:0}.cards,.cards tbody{display:block;width:100%}.cards thead{display:none}.cards tr{display:block;border:1px solid var(--line);background:var(--paper);border-radius:13px;margin:9px 0;padding:7px 10px;box-shadow:0 2px 5px #202A3506}.cards td{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 0;border:none;text-align:right;min-width:0;overflow-wrap:anywhere}.cards td:before{content:attr(data-label);flex-shrink:0;max-width:43%;text-align:left;color:var(--soft);font-size:12px}.cards td:has([data-act=open]):before{display:none}.cards [data-act=open]{width:100%;text-align:left;font-size:17px}.actions{flex-wrap:wrap;justify-content:flex-end}.actions button{min-height:44px}
main.ios-detail{display:flex;flex-direction:column;padding-bottom:calc(var(--tab-height) + var(--bottom) + 82px)}
main.ios-detail>.link{align-self:flex-start;order:-3}.ios-detail>.grid{order:-2}.ios-detail>.row{margin:0}.ios-detail>p{margin:3px 0;overflow-wrap:anywhere}.ios-detail .addcost{position:fixed;z-index:2;left:var(--left);right:var(--right);bottom:calc(var(--tab-height) + var(--bottom) + 7px);height:46px;border-radius:14px;box-shadow:0 3px 10px #202A3514}
dialog[open]{position:fixed;inset:auto 0 0;margin:0 auto;width:100%;max-width:540px;max-height:calc(100dvh - env(safe-area-inset-top) - 10px);overflow:auto;overscroll-behavior:contain;border-radius:20px 20px 0 0;padding:14px var(--right) calc(10px + var(--bottom)) var(--left);scroll-padding-bottom:84px}
dialog:before{content:'';display:block;width:32px;height:4px;border-radius:4px;background:var(--line);margin:0 auto 10px}
dialog h2{margin:0 0 10px}dialog form{gap:10px}dialog .actions{position:sticky;bottom:calc(-10px - var(--bottom));background:var(--paper);border-top:1px solid var(--line);padding:8px 0 calc(8px + var(--bottom));justify-content:stretch}dialog .actions button{flex:1;line-height:1.15}dialog .actions .primary{flex:1.3}
#toast:not(:empty){bottom:calc(var(--tab-height) + var(--bottom) + 62px);max-width:86%}.ios-signout{margin-top:6px}body:has(dialog[open]){overflow:hidden}
@media(max-height:520px){dialog .actions{position:static}dialog[open]{max-height:98dvh}}

/* Category controls retain their original button elements and actions. */
.ios-settings .cards tbody{display:grid;gap:6px;margin-top:9px}
.ios-settings .cards tr{display:grid;grid-template-columns:repeat(4,44px) minmax(0,1fr);grid-template-rows:auto 44px;gap:2px 5px;align-items:center;margin:0;padding:7px 10px 5px}
.ios-settings .cards td:first-child{grid-column:1/-1;display:block;padding:0;text-align:left;font-weight:650;line-height:1.3;word-break:normal;overflow-wrap:normal;hyphens:none;max-width:100%;overflow-x:auto}
.ios-settings .cards td:not(:first-child){display:contents}
.ios-settings .cards td::before{display:none}
.ios-settings .cards button{grid-row:2;width:44px;height:44px;min-height:44px;display:grid;place-items:center;padding:0;font-size:0;background:transparent;border:0;color:var(--accent)}
.ios-settings .cards button::after{content:'';display:block;width:19px;height:19px;background:currentColor;mask:var(--icon) center/contain no-repeat;-webkit-mask:var(--icon) center/contain no-repeat}
.ios-settings .cards button:focus-visible{outline:2px solid var(--accent)}
.ios-settings .cards button:active{background:var(--tint)}
.ios-settings .panel:has([data-act=backup]){display:grid;gap:6px;justify-items:stretch}
.ios-settings .panel:has([data-act=backup]) h2{margin-bottom:2px}
.ios-settings .panel p{word-break:normal;overflow-wrap:break-word}
.ios-settings .cards [data-act=category]{grid-column:1;--icon:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIxLjgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PHBhdGggZD0iTTQgMjBsNC44LTEuMUwyMCA3LjdhMiAyIDAgMCAwLTMuNy0zLjdMNS4xIDE1LjJ6TTE0LjUgNmwzLjUgMy41Ii8+PC9zdmc+")}
.ios-settings .cards [data-act=up]{grid-column:2;--icon:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIxLjgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PHBhdGggZD0iTTEyIDE5VjVtLTYgNiA2LTYgNiA2Ii8+PC9zdmc+")}
.ios-settings .cards [data-act=down]{grid-column:3;--icon:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIxLjgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PHBhdGggZD0iTTEyIDV2MTRtLTYtNiA2IDYgNi02Ii8+PC9zdmc+")}
.ios-settings .cards [data-act=archive]{grid-column:4;--icon:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIxLjgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PHBhdGggZD0iTTQgN2gxNk05IDdWNGg2djNNNiA3bDEgMTNoMTBsMS0xM00xMCAxMHY3bTQtN3Y3Ii8+PC9zdmc+")}

.brand-mark{width:32px;height:32px;border-radius:8px}
#nav .sel svg{color:#344256;background:#E2E9F2}.dark #nav .sel svg{color:#D7E1EF;background:#3A4657}
.ios-settings .cards tr{padding:6px 9px 3px;gap:0 4px}
.ios-settings .cards button::after{width:17px;height:17px}
