:root{color-scheme:light dark;--canvas:light-dark(#f6f3ec,#142522);--panel:light-dark(#fffefb,#21342e);--ink:light-dark(#203c35,#e5f0e9);--muted:light-dark(#53685e,#b5c8bb);--teal:light-dark(#08695c,#71d5bd);--on-teal:light-dark(#fff,#12372e);--border:light-dark(#d5dfd7,#4d6559)}*{box-sizing:border-box}body{margin:0;background:var(--canvas);color:var(--ink);font:16px/1.5 system-ui,sans-serif}.workspace{max-width:720px;margin:0 auto;padding:24px}header{display:flex;gap:12px;align-items:center;margin-bottom:28px}header img{border-radius:12px}header strong{display:block;font-size:22px}header span{display:block;color:var(--muted);font-size:14px}header small{margin-left:auto;border:1px solid var(--border);padding:6px 10px;border-radius:16px}main{padding:28px;background:var(--panel);border:1px solid var(--border);border-radius:24px}h1{font-size:28px;line-height:1.2;margin:0 0 20px}h2{font-size:20px}p{margin:12px 0}label{display:block;margin:16px 0}input,textarea{display:block;margin-top:6px;padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--canvas);color:var(--ink);font:inherit;width:100%;min-height:48px}input[type=checkbox]{width:22px;min-height:22px;margin:0;flex-shrink:0}.consent{display:flex;align-items:flex-start;gap:10px}button{min-height:48px;padding:12px 18px;border:1px solid var(--border);border-radius:12px;background:var(--panel);color:var(--ink);font:600 16px/1.4 system-ui;cursor:pointer}button.primary{background:var(--teal);color:var(--on-teal);border-color:var(--teal)}button:disabled{opacity:.6;cursor:not-allowed}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.actions>*{flex:1}a{color:var(--teal);text-underline-offset:3px}footer{margin:24px 0;text-align:center;font-size:14px;color:var(--muted)}#status{min-height:24px;padding:0 8px;overflow-wrap:anywhere}.secret{font-family:monospace;overflow-wrap:anywhere;padding:14px;background:var(--canvas);border-radius:12px}#challenge{max-width:100%;overflow:hidden}.tag{font-size:14px;color:var(--muted)}@media(max-width:480px){.workspace{padding:16px}main{padding:20px}header{flex-wrap:wrap}header small{margin-left:0}h1{font-size:26px}.actions{flex-direction:column}}@media(prefers-reduced-motion:no-preference){button{transition:background-color .15s,transform .15s}button:active{transform:scale(.98)}}

#authenticator-qr{display:block;width:280px;max-width:100%;height:auto;margin:24px auto;background:#fff;image-rendering:pixelated}details{margin:20px 0;border:1px solid var(--border);border-radius:12px;padding:14px}summary{cursor:pointer;font-weight:600;min-height:32px}#setup-key{user-select:all}

#authenticator-qr[hidden]{display:none}
.workspace:has(.workspace-nav){max-width:1060px}.workspace-nav{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}.workspace-nav>*{flex:1}.group-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:24px 0}.group-card{text-align:left;padding:24px;background:var(--canvas);display:flex;flex-direction:column;gap:10px}.group-card span:last-child{font-size:14px;color:var(--muted)}.group-symbol{font-size:32px;color:var(--teal)}.group-title{margin-top:24px}.ledger-card,.timeline{padding:18px;background:var(--canvas);border-radius:16px;margin:14px 0;overflow-wrap:anywhere}.ledger-card h3{margin:0;font-size:18px}.expense-row{display:flex;justify-content:space-between;text-align:left;gap:20px;width:100%;margin:12px 0}.expense-row small{display:block;font-weight:400;color:var(--muted)}.balance-row{display:flex;justify-content:space-between;gap:20px;padding:20px;border-bottom:1px solid var(--border)}.amount{font-size:24px;font-weight:700;font-variant-numeric:tabular-nums}.owed{color:var(--teal)}.owes{color:light-dark(#9e4c19,#f5ba83)}button.danger{border-color:#bb4e50;color:light-dark(#a42831,#ffabb2)}button.warning{border-color:#b77c19;color:light-dark(#8a580b,#ffcb78)}.timeline{border-left:4px solid var(--teal)}.timeline time{display:block;font-size:14px;color:var(--muted)}select{display:block;width:100%;padding:12px;min-height:48px;border:1px solid var(--border);border-radius:10px;background:var(--canvas);color:var(--ink);font:inherit}fieldset{border:1px solid var(--border);border-radius:14px;min-width:0}.split-person{display:grid;grid-template-columns:1fr 1fr;gap:14px;border-bottom:1px solid var(--border)}.pending{padding:20px;border:2px solid #b77c19;border-radius:16px;background:var(--canvas);margin-bottom:20px}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--teal);outline-offset:3px}@media(max-width:480px){.workspace-nav{display:grid;grid-template-columns:1fr 1fr}.expense-row,.balance-row{flex-wrap:wrap}.group-grid{grid-template-columns:1fr}.split-person{grid-template-columns:1fr}}@media(prefers-reduced-motion:no-preference){.group-card,.ledger-card{animation:arrive .18s ease-out}@keyframes arrive{from{opacity:.3;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}}

.ledger-confirm{max-width:460px;width:calc(100% - 40px);border:1px solid #d5ddd8;border-radius:24px;padding:24px;color:#203f36;background:#fffefa;box-shadow:0 18px 70px #102a3433}.ledger-confirm::backdrop{background:#143c3855;backdrop-filter:blur(3px)}
.bill-review{margin-top:1.5rem}.bill-heading,.bill-summary{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.4rem 0}.bill-heading{padding:1.4rem;background:var(--canvas);color:var(--ink);border:1px solid var(--border);border-radius:20px}.bill-heading h2{margin:.4rem 0}.bill-check{display:inline-block;padding:6px 10px;border-radius:10px;background:var(--teal);color:var(--on-teal);font-weight:700}.bill-component{display:flex;justify-content:space-between;gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--border)}.bill-component small{display:block;color:var(--muted)}.bill-component strong{white-space:nowrap}.bill-error{color:light-dark(#993b27,#ffb4a1)}.bill-picker{display:block;border:1px solid #0b6a5c;border-radius:12px;padding:1rem;background:#f0f8f5;font-weight:700}.bill-picker input{display:block;margin-top:.7rem;max-width:100%}@media(max-width:600px){.bill-heading,.bill-summary{grid-template-columns:1fr}.bill-heading{padding:1rem}}
.bill-review .actions{align-items:stretch}.bill-picker{display:block;min-height:48px;margin:0;padding:12px;border:1px solid var(--border);background:var(--canvas);color:var(--ink);text-align:left}.bill-picker input{position:static;display:block;opacity:1;width:100%;height:auto;min-height:48px;margin:8px 0 0;padding:6px;background:var(--panel);color:var(--ink);cursor:pointer}.bill-picker input::file-selector-button{min-height:44px;margin-right:12px;padding:10px 14px;border:1px solid var(--teal);border-radius:10px;background:var(--teal);color:var(--on-teal);font:600 16px/1.4 system-ui;cursor:pointer}.bill-picker:focus-within{outline:3px solid var(--teal);outline-offset:3px}
/* Family payments: separate totals and comfortably sized receipt controls. */
.family-bill-grid{display:grid;gap:1rem}.family-totals{display:flex;flex-wrap:wrap;gap:1rem;background:var(--panel);color:var(--ink);border-radius:12px;padding:0 1rem}.family-totals p{display:grid;gap:.3rem}.family-month{border-top:1px solid var(--border);padding:1rem 0}.family-month>div{display:flex;align-items:center;justify-content:space-between;gap:1rem}.family-month details{margin:.5rem 0}.family-month .consent{margin:0}.family-month .amount{white-space:nowrap}

.bill-review textarea{min-height:110px;resize:vertical}

.settings-links{display:flex;flex-wrap:wrap;gap:20px}.settings-signout{margin-top:32px}.download-button{display:inline-flex;justify-content:center;align-items:center;min-height:48px;padding:12px 18px;border-radius:12px;background:var(--teal);color:var(--on-teal);font-weight:600;text-decoration:none}.download-button:focus-visible{outline:3px solid var(--teal);outline-offset:3px}

/* Desktop polish: consistent hierarchy, readable long labels and clear request states. */
h2{line-height:1.3;margin:28px 0 12px}h3{line-height:1.35}button,.download-button{overflow-wrap:anywhere}button:hover:not(:disabled){border-color:var(--teal)}.actions{align-items:stretch}.actions>button{display:flex;align-items:center;justify-content:center;text-align:center}.workspace-nav button{min-width:0}.group-card{border:1px solid var(--border)}.group-card:hover{background:var(--panel)}.expense-row>span:first-child{min-width:0}.expense-row .amount,.expense-row>strong{flex-shrink:0;white-space:nowrap;font-variant-numeric:tabular-nums}.family-totals p{flex:1;min-width:130px;color:var(--muted);font-size:14px}.family-totals strong{color:var(--ink);font-size:22px;font-variant-numeric:tabular-nums}.error{color:light-dark(#993b27,#ffb4a1)}.saving,.connection-help{padding:20px;border:1px solid var(--border);border-radius:16px;background:var(--canvas);margin:16px 0}.saving{border-left:4px solid var(--teal)}.saving p{color:var(--muted);margin-bottom:0}.connection-help{background:var(--panel)}.connection-help h2{margin-top:0}.connection-help[hidden]{display:none}.ledger-confirm{background:var(--panel);color:var(--ink);border-color:var(--border)}a:focus-visible,summary:focus-visible{outline:3px solid var(--teal);outline-offset:3px}.family-month>div>strong{font-size:16px}.settings-links a{display:inline-flex;align-items:center;min-height:44px}#status:empty{margin:0;min-height:0}#status:not(:empty){padding:12px 16px;background:var(--panel);border-radius:12px;border:1px solid var(--border)}

/* Keep account identity and sign-out available across workspace views. */
.workspace>header{position:sticky;top:0;z-index:20;background:var(--canvas);padding:12px 0;flex-wrap:wrap}
.account-bar{margin-left:auto;display:flex;align-items:center;gap:12px;max-width:100%}.account-bar[hidden]{display:none}
#account-name{font-weight:650;overflow-wrap:anywhere;max-width:28ch}.account-bar button{width:auto;margin:0;white-space:nowrap;min-height:44px;padding:10px 18px;border:1px solid var(--teal);background:var(--panel);color:var(--teal);border-radius:12px}
@media(max-width:540px){.account-bar{width:100%;justify-content:space-between}#account-name{max-width:65%}}

/* Illustrated studio identity, shared with the public help and account pages. */
:root{--canvas:light-dark(#f8f5ed,#142522);--panel:light-dark(#fffcf5,#21342e);--teal:light-dark(#245f54,#71d5bd)}
.workspace{max-width:1100px}h1,h2{font-family:Georgia,serif;font-weight:400}h1{font-size:34px;letter-spacing:-.8px}button{border-radius:20px}.illustrated-layout{display:block}.illustrated-auth .illustrated-layout{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:60px;padding:35px 0}.auth-story[hidden]{display:none}.auth-story h2{font-size:48px;line-height:1.1;letter-spacing:-1.5px;margin:18px 0}.auth-story>p{color:var(--muted);max-width:440px}.eyebrow{font:600 11px/1.5 system-ui;letter-spacing:1.5px}.story-art{height:330px;background:center/contain no-repeat url('./art/welcome.webp');mix-blend-mode:multiply;mask-image:linear-gradient(transparent,#000 7%,#000 93%,transparent)}[data-scene=company] .story-art{background-image:url('./art/company.webp')}[data-scene=key] .story-art{background-image:url('./art/key.webp')}.handnote{font:italic 17px Georgia,serif;text-align:center}.illustrated-auth main{padding:34px}.illustrated-auth main .primary{width:100%}.motion-paused *{animation:none!important;transition:none!important}@media(prefers-color-scheme:dark){.story-art{mix-blend-mode:normal;border-radius:24px;background-color:#f8f5ed;mask-image:none}}@media(max-width:760px){.illustrated-auth .illustrated-layout{grid-template-columns:1fr;gap:20px;padding:12px 0}.auth-story{position:relative;padding-right:125px;min-height:115px}.auth-story h2{font-size:28px;letter-spacing:-.5px;margin:8px 0}.auth-story>p{font-size:13px}.auth-story .eyebrow,.auth-story .handnote{display:none}.story-art{position:absolute;right:0;top:0;width:115px;height:120px}.illustrated-auth main{padding:24px}h1{font-size:29px}}@media(prefers-reduced-motion:no-preference){.auth-story{animation:arrive .35s ease-out}}

/* Keep the form within narrow viewports, including the security widget. */
.illustrated-layout>*{min-width:0}#challenge{width:100%;display:flex;justify-content:center}
@media(max-width:760px){.illustrated-auth .workspace>header{position:static;margin-bottom:10px}.illustrated-auth .workspace>header small{display:none}.illustrated-auth .auth-story{padding-right:100px;min-height:90px}.illustrated-auth .story-art{width:90px;height:100px}.illustrated-auth .auth-story h2{font-size:26px}.illustrated-auth .illustrated-layout{gap:12px}.illustrated-auth main>.tag{display:none}.illustrated-auth main{padding:20px}.illustrated-auth .auth-story>p{margin:8px 0}.illustrated-auth footer{margin-top:16px}}
@media(max-width:360px){.illustrated-auth main{padding:16px}.illustrated-auth .auth-story h2{font-size:24px}.illustrated-auth .workspace{padding:12px}.illustrated-auth .auth-story{padding-right:84px}.illustrated-auth .story-art{width:78px;height:90px}}

/* A cheerful, compact arrival for the everyday Groups workspace. */
.groups-welcome{position:relative;display:grid;grid-template-columns:1fr 1.1fr;gap:8px;isolation:isolate;overflow:hidden;border:1px solid #e1d8bf;border-radius:22px;background:#f8f1de;color:#243f36;padding:30px 30px 40px;margin-bottom:28px}
.groups-welcome-copy{z-index:1}.groups-welcome .eyebrow{color:#8b4d35;font-size:10px;letter-spacing:1.8px;margin:0 0 12px}.groups-welcome h1{font-size:40px;line-height:1.08;letter-spacing:-1.2px;margin:0 0 14px}.groups-welcome-copy>p:not(.eyebrow){font-size:14px;color:#536357;line-height:1.6;margin:0 0 20px}.groups-welcome .primary{background:#245f54;color:#fff;border-radius:14px;font-size:14px;box-shadow:3px 3px 0 #c9d6b8}
.groups-welcome-art{position:relative;min-height:220px;background:url('./art/groups-cafe.webp') center/contain no-repeat;mix-blend-mode:multiply}.harbor-spark{position:absolute;color:#ba633d;font-size:30px;line-height:1}.spark-one{right:2%;top:4%}.spark-two{left:4%;bottom:6%;color:#28695c;font-size:35px}.groups-note{position:absolute;bottom:13px;right:34px;font:italic 13px Georgia,serif;color:#6c674f;transform:rotate(-2deg)}
.groups-list-heading{display:flex;justify-content:space-between;align-items:baseline;gap:16px}.groups-list-heading h2{font-size:28px;margin:0}.groups-list-note{font:italic 14px Georgia,serif;color:var(--muted)}.groups-landing>.tag{display:none}.groups-landing .group-grid{margin:16px 0 24px;grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr))}.groups-landing .group-card{position:relative;gap:10px;padding:20px;border-radius:18px;border-color:light-dark(#d9ded1,#52675b);box-shadow:0 3px 0 light-dark(#dce0d055,#0002);min-width:0}.groups-landing .group-card strong{font-size:19px;line-height:1.3;overflow-wrap:anywhere}.group-card-top{display:flex;align-items:center;justify-content:space-between;width:100%}.groups-landing .group-symbol{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:light-dark(#ffffffaa,#ffffff14);color:var(--ink);font:28px Georgia,serif}.group-open{font-size:22px;color:var(--muted)}.groups-landing .group-tint-0{background:light-dark(#e9efdf,#2d4034)}.groups-landing .group-tint-1{background:light-dark(#fae8dd,#45372f)}.groups-landing .group-tint-2{background:light-dark(#e5eef0,#293d41)}.groups-landing .group-tint-3{background:light-dark(#f5edcc,#433f2b)}.groups-landing .group-card:hover{border-color:var(--teal);box-shadow:0 5px 0 light-dark(#c8d4c266,#0003)}.groups-empty{grid-column:1/-1;text-align:center;padding:24px;border:1px dashed var(--border);border-radius:18px;background:var(--canvas)}.groups-empty>span{color:var(--teal);font-size:32px}.groups-empty h3{margin:8px 0}.groups-empty p{color:var(--muted);font-size:14px}.group-create{scroll-margin-top:130px;background:var(--canvas);border-style:dashed}.group-create summary{color:var(--teal);padding:4px;min-height:40px}.group-create summary span{float:right;color:var(--muted);font-size:13px;font-weight:400}.invitation-empty{background:var(--canvas);border:1px solid var(--border);padding:18px;border-radius:14px;font-size:14px;color:var(--muted)}#invitation-inbox>span{color:var(--teal);font-family:system-ui;font-size:22px}
@media(prefers-reduced-motion:no-preference){.groups-welcome-art{animation:arrive .55s ease-out}.harbor-spark{animation:harbor-sway 5s ease-in-out infinite alternate}.spark-two{animation-delay:-2s}.groups-landing .group-card{transition:transform .18s,box-shadow .18s}.groups-landing .group-card:hover{transform:translateY(-3px)}@keyframes harbor-sway{from{transform:rotate(-9deg) scale(.92)}to{transform:rotate(10deg) scale(1.06)}}}
@media(max-width:760px){.groups-welcome{padding:24px 22px 36px;grid-template-columns:1fr 1fr}.groups-welcome h1{font-size:32px}.groups-welcome-art{min-height:200px}.groups-list-note{display:none}.groups-note{font-size:11px;right:22px}.groups-welcome-copy>p:not(.eyebrow){font-size:13px}}
@media(max-width:540px){.groups-welcome{grid-template-columns:1fr;padding:22px 20px 30px}.groups-welcome h1{font-size:34px}.groups-welcome-art{min-height:145px;margin-top:6px}.groups-welcome-copy>p:not(.eyebrow) br{display:none}.groups-welcome .primary{width:100%}.groups-note{right:0;left:0;text-align:center;bottom:9px}.groups-list-heading h2{font-size:26px}.group-create summary span{display:block;float:none;margin-top:6px}.groups-landing .group-grid{grid-template-columns:1fr}.groups-welcome .spark-one{right:9%}.groups-welcome .spark-two{left:9%}}

.groups-welcome-art{border-radius:18px;mask-image:radial-gradient(ellipse at center,#000 52%,transparent 76%)}
@media(max-width:600px){.workspace-nav{display:grid;grid-template-columns:1fr 1fr}.workspace-nav button{white-space:nowrap}.groups-welcome-art{background-size:cover;background-position:center 60%}}
@media(max-width:540px){.groups-welcome{display:block;padding:20px}.groups-welcome .eyebrow{font-size:9px;letter-spacing:1px}.groups-welcome h1{font-size:28px;max-width:63%;letter-spacing:-.6px}.groups-welcome-art{position:absolute;right:4px;top:45px;width:35%;min-height:100px;height:100px;margin:0;background-size:cover}.groups-welcome-copy>p:not(.eyebrow){font-size:12px;margin-bottom:14px}.groups-welcome .groups-note,.groups-welcome .harbor-spark{display:none}.groups-welcome .primary{font-size:14px}.groups-landing .group-card{padding:18px}}

/* Distinct illustrated arrivals for each workspace tab. */
.workspace-welcome{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:24px;padding:24px 30px;border-radius:22px;margin-bottom:28px;border:1px solid #d6dfcf;background:#e9efdf;color:#243f36;overflow:hidden}.workspace-welcome .eyebrow{font-size:10px;letter-spacing:1.5px;color:#586748;margin:0 0 10px}.workspace-welcome h1{font-size:36px;margin:0 0 12px;line-height:1.12}.workspace-welcome p:last-child{font-size:14px;max-width:36ch;color:#536357}.workspace-welcome-art{height:205px;background:center/contain no-repeat url('./art/balances.webp');mix-blend-mode:multiply;mask-image:radial-gradient(ellipse at center,#000 50%,transparent 75%)}.scene-activity{background:#e5eef0;border-color:#cededf}.scene-activity .workspace-welcome-art{background-image:url('./art/activity.webp')}.scene-settings{background:#fae8dd;border-color:#e8d7ca}.scene-settings .workspace-welcome-art{background-image:url('./art/settings.webp')}.group-directory .group-grid{margin-top:16px}.group-directory .group-symbol{font:28px Georgia,serif}.group-directory .group-card-top{color:var(--teal)}
@media(prefers-reduced-motion:no-preference){.workspace-welcome-art{animation:arrive .5s ease-out}}
@media(max-width:600px){.workspace-welcome{grid-template-columns:1fr 95px;gap:8px;padding:20px}.workspace-welcome h1{font-size:27px}.workspace-welcome .eyebrow{font-size:9px;letter-spacing:.6px}.workspace-welcome p:last-child{font-size:12px}.workspace-welcome-art{height:140px;background-size:cover}}
@media(max-width:360px){.workspace-welcome{grid-template-columns:1fr 70px;padding:16px}.workspace-welcome h1{font-size:25px}.workspace-welcome-art{height:120px}}

/* Cohesive illustrated workspace: warm paper, editorial titles and rounded UI. */
:root{
 --font-ui:'Avenir Next','Segoe UI',ui-rounded,system-ui,sans-serif;
 --font-story:'Iowan Old Style','Palatino Linotype',Georgia,serif;
 --paper-line:light-dark(#d9d7c7,#52675c);
 --paper-shadow:light-dark(#243f3610,#0003);
 --sage:light-dark(#e9efdf,#2d4034);
 --peach:light-dark(#fae8dd,#45372f);
 --blue-paper:light-dark(#e5eef0,#293d41);
 --gold-paper:light-dark(#f5edcc,#433f2b);
}
body{font-family:var(--font-ui);line-height:1.6;background-image:radial-gradient(light-dark(#52675212,#b8c5ba09) .7px,transparent .7px);background-size:14px 14px}
.workspace>header{border-bottom:1px solid var(--paper-line);margin-bottom:22px;padding:14px 0 18px}
header strong{font-family:var(--font-story);font-size:25px;letter-spacing:-.6px;line-height:1.2}header span{font-family:var(--font-ui)}header img{box-shadow:2px 3px 0 var(--paper-shadow)}
main{border-color:var(--paper-line);border-radius:28px 24px 30px 22px;box-shadow:0 6px 0 var(--paper-shadow),0 16px 40px light-dark(#3d4d3410,#0001)}
h1,h2,h3{font-family:var(--font-story);font-weight:500;letter-spacing:-.45px;text-wrap:pretty}h1{line-height:1.14}h2{font-size:26px}h3,.ledger-card h3{font-size:21px;line-height:1.3}p{line-height:1.65}p.tag,small{line-height:1.5}.tag{font-size:13px}
button,.download-button,.bill-picker input::file-selector-button{font-family:var(--font-ui);font-weight:650;letter-spacing:.05px;border-radius:14px;border-color:var(--paper-line);box-shadow:0 2px 0 var(--paper-shadow)}
button.primary,.download-button{box-shadow:0 3px 0 light-dark(#183e35,#224f43)}button.danger{background:light-dark(#fff1eb,#392d2a)}button.warning{background:var(--gold-paper)}button:disabled{box-shadow:none}
button:hover:not(:disabled),.download-button:hover{box-shadow:0 4px 0 var(--paper-shadow)}button.primary:hover:not(:disabled){box-shadow:0 4px 0 light-dark(#183e35,#224f43)}
.workspace-nav{padding:6px;border-radius:20px;background:var(--canvas);border:1px solid var(--paper-line);gap:6px;margin-bottom:24px}.workspace-nav button{display:flex;align-items:center;justify-content:center;gap:9px;border-color:transparent;background:transparent;box-shadow:none;font-size:15px;min-height:48px}.workspace-nav button.primary{background:var(--teal);color:var(--on-teal);box-shadow:0 2px 0 var(--paper-shadow)}.nav-symbol{font-family:Georgia,serif;font-size:21px;font-weight:400;line-height:1}.workspace-nav button:hover:not(:disabled){background:var(--sage);color:var(--ink);box-shadow:none}.workspace-nav button.primary:hover:not(:disabled){background:var(--teal);color:var(--on-teal)}
.eyebrow,.groups-welcome .eyebrow,.workspace-welcome .eyebrow{font-family:var(--font-ui);font-weight:700}.groups-welcome h1,.workspace-welcome h1,.auth-story h2{font-family:var(--font-story);font-weight:500}.handnote,.groups-note,.groups-list-note{font-family:var(--font-story)}
.group-card strong,.groups-landing .group-card strong{font-family:var(--font-story);font-size:22px;font-weight:600;letter-spacing:-.3px}.group-directory .group-card{border-radius:18px;box-shadow:0 3px 0 var(--paper-shadow)}.group-directory .group-tint-0{background:var(--sage)}.group-directory .group-tint-1{background:var(--peach)}.group-directory .group-tint-2{background:var(--blue-paper)}.group-directory .group-tint-3{background:var(--gold-paper)}
.group-title{padding:20px 22px 20px 28px;background:var(--sage);border:1px solid var(--paper-line);border-left:5px solid var(--teal);border-radius:6px 22px 22px 6px;margin:22px 0 12px;overflow-wrap:anywhere;font-size:32px}
.ledger-card{background:var(--canvas);border:1px solid var(--paper-line);border-radius:18px 14px 20px 14px;padding:22px;box-shadow:0 3px 0 var(--paper-shadow)}.ledger-card>h2:first-child{margin-top:0}.ledger-card h2{font-size:25px}.ledger-card>p{color:var(--muted)}.ledger-card .amount{color:var(--ink)}
label,legend{font-weight:600;font-size:14px}label input,label textarea,label select{font-weight:400}.consent{font-weight:400;font-size:14px}
input,textarea,select{font-family:var(--font-ui);font-size:16px;background:var(--panel);border-color:var(--paper-line);border-radius:12px;box-shadow:inset 0 2px 3px light-dark(#243f3606,#0001)}input[type=checkbox]{accent-color:var(--teal);box-shadow:none}input:focus,textarea:focus,select:focus{border-color:var(--teal)}fieldset{padding:18px;border-color:var(--paper-line);background:var(--canvas)}legend{padding:0 8px;color:var(--teal)}
details{background:var(--canvas);border-color:var(--paper-line);border-radius:16px}summary{font-family:var(--font-ui);font-size:15px;min-height:40px;padding:6px 0}details[open]>summary{border-bottom:1px dashed var(--paper-line);padding-bottom:12px;margin-bottom:12px}
.expense-row{position:relative;padding:20px;border-color:var(--paper-line);border-radius:16px;background:var(--canvas);box-shadow:0 3px 0 var(--paper-shadow)}.expense-row>span>strong{font-family:var(--font-story);font-size:21px;font-weight:600;line-height:1.3}.expense-row small{margin-top:6px;font-size:13px}.expense-row>strong{align-self:center;padding:8px 12px;background:var(--sage);border-radius:10px;font-family:var(--font-ui)}
.balance-row{margin:10px 0;padding:18px;border:1px solid var(--paper-line);border-radius:14px;background:var(--canvas)}.balance-row>span{font-family:var(--font-story);font-size:21px}.balance-row>strong{align-self:center;font-family:var(--font-ui);font-variant-numeric:tabular-nums}
.timeline{position:relative;border:1px solid var(--paper-line);border-left:4px solid var(--teal);padding:18px 20px;margin:12px 0;background:var(--canvas)}.timeline:nth-of-type(even){border-left-color:light-dark(#b1744a,#e2a674)}.timeline strong{font-family:var(--font-story);font-size:21px;text-transform:capitalize}.timeline time{margin-top:6px;font-size:13px}
.amount,.family-totals strong,.bill-component strong{font-family:var(--font-ui);font-variant-numeric:tabular-nums;letter-spacing:0}.bill-heading{background:var(--sage);border-color:var(--paper-line);box-shadow:0 3px 0 var(--paper-shadow)}.bill-check{font-family:var(--font-ui);font-size:13px;border-radius:20px;padding:7px 12px}.bill-picker{border:1px dashed var(--teal);background:var(--sage);border-radius:16px}.family-totals{padding:4px 16px;gap:12px;border:1px solid var(--paper-line);background:var(--panel)}.family-totals p{padding:8px 0}.family-month{border-top-style:dashed}
.quiet-state{text-align:center;padding:28px 20px;background:var(--canvas);border:1px dashed var(--paper-line);border-radius:20px;margin:18px 0}.quiet-state>span{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--sage);color:var(--teal);font:27px Georgia,serif}.quiet-state h3{margin:12px 0 6px}.quiet-state p{max-width:48ch;margin:0 auto;color:var(--muted);font-size:14px}
.settings-links{gap:10px}.settings-links a{padding:8px 14px;border:1px solid var(--paper-line);border-radius:12px;background:var(--panel);font-size:14px;text-decoration:none}.settings-links a:hover{text-decoration:underline}.ledger-confirm{border:1px solid var(--paper-line);border-top:5px solid var(--teal);border-radius:22px}.ledger-confirm h2{font-size:28px}.ledger-confirm p{font-size:15px}.pending,.connection-help{border-radius:18px}.pending{background:var(--gold-paper);border-color:light-dark(#ab7a28,#e7bb6a)}
@media(prefers-reduced-motion:no-preference){button,.download-button{transition:background-color .18s,box-shadow .18s,transform .18s}.expense-row:hover:not(:disabled){transform:translateY(-2px)}button:active:not(:disabled){transform:translateY(1px);box-shadow:none}}
@media(max-width:600px){.workspace-nav button{padding:10px 6px;gap:7px;font-size:14px}.nav-symbol{font-size:19px}.ledger-card{padding:18px}.group-title{font-size:27px;padding:18px}.expense-row{padding:16px}.expense-row>strong{padding:6px 10px}.group-card strong,.groups-landing .group-card strong{font-size:21px}.workspace>header{margin-bottom:18px}main{border-radius:22px}h2{font-size:24px}}

/* Feather artwork into the paper; keep controls and text fully opaque. */
.groups-welcome-art,.workspace-welcome-art{opacity:.94;mask-image:radial-gradient(ellipse at center,#000 40%,rgba(0,0,0,.96) 55%,rgba(0,0,0,.4) 69%,transparent 80%);-webkit-mask-image:radial-gradient(ellipse at center,#000 40%,rgba(0,0,0,.96) 55%,rgba(0,0,0,.4) 69%,transparent 80%)}
.story-art{opacity:.95;mask-image:radial-gradient(ellipse at center,#000 48%,rgba(0,0,0,.65) 68%,transparent 84%)}
.groups-welcome{background:linear-gradient(125deg,#f8f1de,#f8f1decc)}
.workspace-welcome{background:linear-gradient(125deg,#e9efdf,#e9efdfbb)}
.scene-activity{background:linear-gradient(125deg,#e5eef0,#e5eef0bb)}
.scene-settings{background:linear-gradient(125deg,#fae8dd,#fae8ddbb)}
.appearance-card .motion-preference{display:flex;align-items:center;gap:12px;min-height:48px;font-size:16px;font-weight:600;cursor:pointer}.motion-preference input{width:22px;height:22px;flex:0 0 22px}.appearance-card .tag{margin-bottom:0}
@media(prefers-color-scheme:dark){.groups-welcome{background:#f8f1de}.workspace-welcome{background:#e9efdf}.scene-activity{background:#e5eef0}.scene-settings{background:#fae8dd}}

/* Compact, alpha-blended scenes inside a group. */
.group-scene{display:grid;grid-template-columns:minmax(0,1fr) 260px;align-items:center;gap:16px;margin:18px 0;padding:16px 24px;border-radius:22px;background:linear-gradient(115deg,#f4eddb,#f4eddb77);border:1px solid var(--paper-line);overflow:hidden;isolation:isolate;color:#243f36}.group-scene-copy{min-width:0}.group-scene .eyebrow{font-size:10px;color:#536357;letter-spacing:1px}.group-scene .group-title{background:none;border:0;padding:0;margin:8px 0;font-size:32px;overflow-wrap:anywhere}.group-scene .tag{color:#536357;margin:0}.group-scene-art{height:160px;background:center/contain no-repeat url('./art/inside-group.webp');opacity:.94;pointer-events:none;mask-image:radial-gradient(ellipse at center,#000 48%,rgba(0,0,0,.85) 65%,transparent 84%)}.inside-people{background:linear-gradient(115deg,#e9efdf,#e9efdf88)}.inside-people .group-scene-art{background-image:url('./art/inside-people.webp')}.inside-expense{background:linear-gradient(115deg,#fae8dd,#fae8dd88)}.inside-expense .group-scene-art{background-image:url('./art/inside-expense.webp')}.inside-family{background:linear-gradient(115deg,#e5eef0,#e5eef088)}.inside-family .group-scene-art{background-image:url('./art/inside-family.webp')}
@media(prefers-reduced-motion:no-preference){.group-scene-art{animation:arrive .35s ease-out}}
@media(max-width:600px){.group-scene{grid-template-columns:minmax(0,1fr) 100px;padding:16px;gap:8px}.group-scene .group-title{font-size:25px}.group-scene .eyebrow{font-size:9px;letter-spacing:.5px}.group-scene-art{height:100px}}
@media(prefers-color-scheme:dark){.group-scene{background:#f4eddb}.inside-people{background:#e9efdf}.inside-expense{background:#fae8dd}.inside-family{background:#e5eef0}}