/* The families Edvance uses: Inter on body text, controls and tables, Lora on
   the app name and headings. Self-hosted rather than linked from a font CDN,
   so the app keeps making no third-party requests and still renders on a bad
   connection. Latin and Latin Extended variable subsets, straight from
   @fontsource-variable; the extended file is what carries macrons, so a name
   written in te reo Maori is set in Inter on screen as well as in the export.
   The browser fetches it only if the page actually contains such a character. */
@font-face{font-family:'Inter Variable';font-style:normal;font-display:swap;font-weight:100 900;src:url('/fonts/inter-latin-wght-normal.woff2') format('woff2-variations');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter Variable';font-style:normal;font-display:swap;font-weight:100 900;src:url('/fonts/inter-latin-ext-wght-normal.woff2') format('woff2-variations');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Lora Variable';font-style:normal;font-display:swap;font-weight:400 700;src:url('/fonts/lora-latin-wght-normal.woff2') format('woff2-variations');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Lora Variable';font-style:normal;font-display:swap;font-weight:400 700;src:url('/fonts/lora-latin-ext-wght-normal.woff2') format('woff2-variations');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{--ink:#17221d;--green:#123d2b;--green-2:#24573e;--line:#dbe3de;--muted:#68766f;--paper:#fff;--ground:#f3f6f4;--gold:#d9a21b;--danger:#a43a2d;--font-sans:'Inter Variable',ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;--font-display:'Lora Variable',Georgia,'Times New Roman',serif;font-family:var(--font-sans);color:var(--ink);background:var(--ground);font-synthesis:none}*{box-sizing:border-box}
.brand strong,.sheet-head h1,.section-title h2,.sidebar h2,.login-card-brand strong,.login-title,.passwords h2{font-family:var(--font-display)}

/* Shared Font Awesome Free 7.3.1 icon system. */
.fa-sprite{position:absolute;width:0;height:0;overflow:hidden}
.fa-icon{width:1em;height:1em;display:inline-block;flex:0 0 auto;overflow:visible;fill:currentColor;vertical-align:-.125em}
.button,.text-button,.login-button,.login-forgot,.role-chip,.badge,.event-status,.toast,.receipt-chip a{align-items:center;gap:7px}
.text-button,.login-forgot,.role-chip,.event-status,.toast,.receipt-chip a{display:inline-flex}
.icon-button .fa-icon{width:14px;height:14px}
.mini-delete{min-width:30px;min-height:30px;display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:6px}
.mini-delete .fa-icon{width:14px;height:14px}
.upload-icon .fa-icon{width:24px;height:24px}
.event-chevron{width:14px;height:14px;transition:transform .18s}
.event[data-open] .event-chevron{transform:rotate(90deg)}
.picker-chevron{display:inline-flex;transition:transform .18s}.picker-chevron .fa-icon{width:14px;height:14px}
.mobile-picker.open .picker-chevron{transform:rotate(180deg)}
.login-field-icon .fa-icon{width:19px;height:19px}
.login-password-toggle .fa-icon{width:18px;height:18px}
.notice>.fa-icon{width:16px;height:16px;margin-top:1px}
.toast>.fa-icon{width:16px;height:16px}
.status-wrap #dirtyLabel{display:inline-flex;align-items:center;gap:5px}
.empty-list>.fa-icon{width:26px;height:26px;margin-bottom:10px;color:var(--green-2)}
@media(max-width:600px){
  .top-actions .button:not(#logoutButton){width:32px;min-width:32px;padding:6px}
  .top-actions .button:not(#logoutButton)>span{display:none}
  #logoutButton{padding:6px 11px}
  .role-chip{position:relative;padding:6px 8px}
  .role-chip>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}

/* .button and .icon-button set display, which outranks the browser default for
   [hidden]; without this, hiding a button by attribute silently does nothing. */
[hidden]{display:none!important}body{margin:0;min-width:320px;background:var(--ground)}/* Fields take the page font, but not the page's size: inheriting it left any
   field that happens to sit outside a sized wrapper - a purchase row, say - on
   the browser's own 16px, larger than every labelled field beside it. 14px is
   the size those labelled fields already land on. */
button,input,textarea,select{font:inherit;font-size:14px}.topbar{position:sticky;top:0;z-index:20;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 28px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.96);backdrop-filter:blur(10px)}.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand-home{flex:0 0 auto;display:inline-flex;padding:0;border:0;border-radius:50%;background:none;cursor:pointer}.brand-name{min-width:0;flex-direction:column;align-items:flex-start;border-radius:6px;text-align:left;font:inherit;color:inherit}.brand-home:focus-visible{outline:2px solid var(--green-2);outline-offset:2px}.brand-icon{flex:0 0 auto;width:48px;height:48px;border-radius:50%;object-fit:contain;display:block}.brand>div{min-width:0}.brand strong,.brand small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.brand strong{font-size:16px;line-height:1.25;color:var(--green)}.brand small{margin-top:1px;font-size:12px;line-height:1.35;color:var(--muted)}.top-actions{display:flex;align-items:center;gap:8px}.role-chip{padding:5px 10px;border:1px solid #cbd7d0;border-radius:999px;color:var(--muted);font-size:12px;font-weight:700;white-space:nowrap}.button,.icon-button,.text-button,.mobile-picker{border:0;cursor:pointer}.button{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:6px 12px;border-radius:8px;font-size:13px;font-weight:700;transition:.18s}.button:disabled{cursor:not-allowed;opacity:.55}.button.primary{background:var(--green);color:#fff}.button.primary:hover{background:#0b2c1f}.button.secondary{border:1px solid #cbd7d0;background:#fff;color:#263a30}.button.secondary:hover{background:#f5f8f6}.button.danger{border:1px solid var(--danger);background:#fff;color:var(--danger)}.button.danger:hover:not(:disabled){background:#fff1ef}.button.danger:focus-visible{outline-color:var(--danger)}.icon-button{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;font-size:20px}.icon-button.gold{background:var(--gold);color:#2c2207}.workspace{display:grid;grid-template-columns:300px minmax(0,1fr);gap:24px;max-width:1500px;margin:0 auto;padding:24px 28px}.sidebar{position:sticky;top:88px;align-self:start;max-height:calc(100vh - 112px);overflow:hidden;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 3px 16px rgba(25,47,37,.05)}.sidebar-head{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid #e3e9e5}.sidebar h2{margin:0;font-size:16px}.sidebar small{display:block;margin-top:3px;color:var(--muted);font-size:12px}.record-list{max-height:calc(100vh - 183px);overflow:auto;padding:8px}.record-card{width:100%;padding:12px;border:1px solid transparent;border-radius:12px;background:#fff;text-align:left;cursor:pointer}.record-card:hover{background:#f4f7f5}.record-card.active{border-color:#9db9aa;background:#edf5f0}.record-card-top,.record-card-meta{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.record-card strong{min-width:0;font-size:14px;line-height:20px}.record-card-meta{margin-top:8px;color:var(--muted);font-size:12px}.record-card-meta b{color:#394a42}.empty-list{padding:40px 18px;text-align:center}.empty-list strong,.empty-list small{display:block}.empty-list small{margin-top:6px;line-height:18px}.mobile-picker{display:none}.sheet{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:var(--paper);box-shadow:0 3px 16px rgba(25,47,37,.06)}.sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:22px 32px;background:var(--green);color:#fff}.sheet-head p{margin:0;color:#c8dbd0;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.sheet-head h1{margin:5px 0 0;font-size:28px;letter-spacing:-.02em}.status-wrap{display:flex;align-items:center;gap:8px;color:#c8dbd0;font-size:12px}.badge{display:inline-flex;align-items:center;padding:4px 8px;border:1px solid;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap}.badge.draft{border-color:#ead58e;background:#fff5cf;color:#6f5406}.badge.approved{border-color:#abd0b8;background:#e9f7ed;color:#1d5a34}.sheet-body{display:grid;grid-template-columns:minmax(0,1fr);gap:38px;padding:32px}.sheet-body>section{min-width:0}.notice{display:flex;gap:10px;margin:0;padding:13px 16px;border:1px solid #cfe0d5;border-radius:11px;background:#f1f7f3;color:#2c4438;font-size:13px;line-height:19px}.notice.locked{border-color:#ead58e;background:#fffaeb;color:#5f4a08}.notice b{white-space:nowrap}.section-title{display:flex;align-items:flex-start;gap:14px}.section-title>span{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border-radius:50%;background:#e2eee7;color:var(--green-2);font-size:12px;font-weight:800}.section-title h2{margin:0;font-size:18px}.section-title p{margin:3px 0 0;color:var(--muted);font-size:14px;line-height:20px}.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 18px;margin-top:20px}label,.block-label{display:grid;gap:8px;min-width:0;color:#394a42;font-size:14px;font-weight:700}input,textarea{width:100%;min-width:0;border:1px solid #ccd8d1;border-radius:9px;background:#fff;color:var(--ink);outline:0;font-weight:400;transition:.18s}input{height:40px;padding:0 12px}textarea{padding:11px 12px;line-height:1.5;resize:vertical}input:focus,textarea:focus{border-color:#4d8166;box-shadow:0 0 0 3px rgba(77,129,102,.15)}input:disabled,textarea:disabled{border-color:#e2e9e5;background:#f6f8f7;color:#42544a;cursor:default}input[readonly]{border-color:#e2e9e5;background:#f6f8f7;color:#42544a;cursor:default}.date-parts{display:grid;grid-template-columns:minmax(0,3.1fr) minmax(0,5.1fr) minmax(0,3.6fr);gap:8px;min-width:0;max-width:430px}.date-parts select{width:100%;min-width:0;height:40px;padding:0 30px 0 11px}.date-parts select:disabled{border-color:#e2e9e5;background-color:#f6f8f7;color:#42544a;cursor:default}.money-input{position:relative}.money-input span{position:absolute;left:12px;top:50%;z-index:1;transform:translateY(-50%);color:var(--muted);font-size:13px}.money-input input{padding-left:30px;font-variant-numeric:tabular-nums}#amountGranted{padding-left:48px}.expense-table{margin-top:20px;overflow:hidden;border:1px solid var(--line);border-radius:12px}.expense-header,.expense-row{display:grid;grid-template-columns:56px minmax(0,1.6fr) minmax(0,1fr) minmax(0,1.75fr) 40px;gap:0;align-items:center}.expense-header{padding:12px;background:#eef3f0;color:#52635a;font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase}.expense-header span{padding:0 5px}.expense-header span:first-child{text-align:center}.expense-row{padding:12px;border-top:1px solid #e3e9e5}.expense-row:first-child{border-top:0}.ref{display:grid;place-items:center;width:32px;height:32px;margin:auto;border-radius:50%;background:#edf5f0;color:var(--green);font-size:13px;font-weight:800}.expense-cell{min-width:0;padding:0 5px}.receipt-chip{display:flex;align-items:center;gap:8px;min-width:0;padding:8px 10px;border:1px solid #cbd9d1;border-radius:8px;background:#f6faf7}.receipt-chip a{display:block;min-width:0;flex:1;overflow:hidden;color:var(--green-2);font-size:13px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.muted-cell{color:var(--muted);font-size:13px}.mini-delete{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:16px}.mini-delete:hover{color:var(--danger)}.upload-receipt{width:100%;border-style:dashed!important;justify-content:flex-start}.expense-add{padding:10px 12px;border-top:1px solid #e3e9e5;background:#fafcfb}.text-button{padding:5px 7px;background:transparent;color:var(--green-2);font-size:13px;font-weight:800}.summary{margin:20px 0 0;overflow:hidden;border:1px solid var(--line);border-radius:12px}.summary>div{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;padding:14px 16px;border-bottom:1px solid #e3e9e5}.summary>div:last-child{border:0}.summary dt{font-size:14px;font-weight:700}/* Sized with the label beside it rather than inheriting the root 16px, which
   made the amount the largest thing in the section - bigger than the words
   naming it, and bigger than every other figure on the sheet. */
.summary dd{margin:0;font-size:14px;font-weight:800;font-variant-numeric:tabular-nums}.summary-balance{background:#f4f8f5}.balance-over{color:var(--danger)}.balance-good{color:#21643a}.block-label{margin-top:20px}.upload-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr));gap:14px;margin-top:20px}.upload-card{display:flex;align-items:center;gap:12px;min-width:0;padding:16px;border:1px dashed #aec2b6;border-radius:12px;background:#f8fbf9}.upload-card>div{min-width:0;flex:1}.upload-card strong,.upload-card small{display:block}.upload-card strong{font-size:14px}.upload-card small{display:flex;align-items:center;gap:6px;min-width:0;margin-top:4px;color:var(--muted);font-size:12px}.upload-card small a{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.upload-icon{display:grid;place-items:center;width:30px;height:30px;color:var(--green-2);font-size:23px}.sheet-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 32px;border-top:1px solid #e3e9e5;background:#f8faf9}.sheet-footer>div{display:flex;gap:8px}
.sheet-footer .button{font-weight:400}/* Sign-in mirrors Hauslain Register, with the MSA logo in its place. */
.login-photo,
.login-desktop-label{display:none}
.login-page{position:fixed;inset:0;z-index:60;min-height:100vh;min-height:100dvh;display:grid;place-items:center;isolation:isolate;overflow-y:auto;padding:40px 20px;background:#0b1a12 url("/login-islet.jpg") 58% center/cover no-repeat;color:#fff}
.login-page::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,26,18,.34),rgba(11,26,18,.72));pointer-events:none}
.login-page::before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(circle at 50% 46%,transparent 0 18%,rgba(11,26,18,.16) 62%,rgba(11,26,18,.5) 100%);pointer-events:none}
.login-card{position:relative;z-index:2;width:min(440px,100%);overflow:hidden;padding:32px 34px 26px;border:1px solid rgba(255,255,255,.34);border-radius:24px;background:rgba(16,37,24,.36);box-shadow:0 36px 100px rgba(8,20,14,.5);backdrop-filter:blur(16px) saturate(125%);-webkit-backdrop-filter:blur(16px) saturate(125%)}
.login-card-brand{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;margin-bottom:22px;text-align:center}
.login-app-mark{width:64px;height:64px;flex:0 0 auto;display:grid;place-items:center;overflow:hidden;border:2px solid rgba(255,255,255,.72);border-radius:50%;background:#fff;box-shadow:0 10px 30px rgba(0,15,21,.3)}
.login-app-mark img{width:100%;height:100%;object-fit:contain}
.login-card-brand strong{margin-top:11px;color:#fff;font-size:20px;font-weight:600;letter-spacing:.01em}
.login-title{margin:0 0 22px;color:#fff;font-size:24px;font-weight:600;letter-spacing:-.045em;line-height:1.05;text-align:center}
.login-form{display:flex;flex-direction:column;gap:15px}
.login-form input:not([type="checkbox"]){width:100%;min-height:48px;height:48px;padding:10px 20px;border:1px solid rgba(255,255,255,.24);border-radius:999px;outline:0;background:rgba(176,197,184,.42);color:#fff;font-size:16px;font-weight:400;box-shadow:inset 0 1px 0 rgba(255,255,255,.12);transition:border-color 120ms ease,background-color 120ms ease}
.login-form input::placeholder{color:rgba(255,255,255,.72);opacity:1}
.login-form input:not([type="checkbox"]):focus{border-color:#edb32a;background:rgba(176,197,184,.5);box-shadow:0 0 0 3px rgba(237,179,42,.2)}
.login-form input:-webkit-autofill,
.login-form input:-webkit-autofill:hover,
.login-form input:-webkit-autofill:focus{-webkit-text-fill-color:#fff;box-shadow:0 0 0 1000px rgba(16,37,24,.96) inset;caret-color:#fff}
.login-input-field{position:relative}
.login-field-icon{position:absolute;top:4px;left:4px;z-index:1;width:40px;height:40px;display:inline-grid;align-items:center;justify-content:center;border-radius:50%;background:#fff;color:#1d4a33;box-shadow:0 5px 16px rgba(0,0,0,.18);pointer-events:none;transition:color 160ms ease,transform 160ms ease}
.login-input-field:focus-within .login-field-icon{color:#c79313;transform:scale(1.03)}
.login-input-field input:not([type="checkbox"]){padding-left:58px}
.login-password-field input:not([type="checkbox"]){padding-right:48px}
.login-password-toggle{position:absolute;top:50%;right:6px;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:999px;background:transparent;color:rgba(255,255,255,.8);transform:translateY(-50%);transition:color 120ms ease;cursor:pointer}
.login-password-toggle:hover,
.login-password-toggle:focus-visible{background:rgba(16,37,24,.24);color:#fff}
.login-password-toggle:not(:disabled):active{transform:translateY(-50%) scale(.97)}
.login-options{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin:-4px 2px -2px;padding:0 4px;color:rgba(255,255,255,.78);font-size:12px}
.login-remember{display:inline-flex;align-items:center;gap:8px;color:inherit;font-size:inherit;font-weight:400;cursor:pointer}
.login-remember input{width:16px;height:16px;min-height:0;margin:0;padding:0;flex:0 0 auto;accent-color:#edb32a}
.login-forgot{border:0;background:transparent;color:inherit;font-size:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.login-forgot:hover,
.login-forgot:focus-visible{color:#fff}
.login-recovery-note{margin:-3px 0 0;padding:8px 12px;border:1px solid rgba(237,179,42,.38);border-radius:14px;background:rgba(237,179,42,.13);color:#fff2c8;font-size:12px;line-height:1.45}
.login-button{width:100%;min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid #edb32a;border-radius:15px;background:#edb32a;color:#1d4a33;font-size:16px;font-weight:700;box-shadow:0 16px 34px rgba(11,26,18,.3);cursor:pointer}
.login-button:hover:not(:disabled),
.login-button:focus-visible:not(:disabled){border-color:#c79313;background:#c79313}
.login-button:disabled{cursor:not-allowed;opacity:.6}
.login-page .signin-error{margin:0;padding:8px 12px;border-radius:14px;background:rgba(155,34,38,.34);color:#ffe2e4;font-size:12px;font-weight:600;text-align:center}
.login-copyright{display:flex;flex-direction:column;gap:3px;margin:22px 0 0;padding-top:14px;border-top:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.62);font-size:12px;line-height:1.5;text-align:center}.login-copyright a{color:inherit;font-weight:inherit;text-decoration:none}.login-copyright a:hover,.login-copyright a:focus-visible{color:#fff}.login-owner{display:none}


@media(min-width:1024px){
  .login-page{grid-template-columns:minmax(0,1fr) clamp(400px,26vw,520px);align-items:stretch;justify-items:stretch;padding:0;background:#fff!important;color:#1c2620}
  .login-page::before,
  .login-page::after{display:none}
  .login-photo{display:block;min-width:0;position:relative;overflow:hidden;background:#123f46 url("/login-islet.jpg") 58% center/cover no-repeat}
  .login-card{width:100%;min-width:0;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;padding:clamp(56px,10vh,110px) clamp(36px,2.6vw,54px) 28px;overflow:visible;border:0;border-radius:0;background:#fff;color:#1c2620;color-scheme:light;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
  .login-card-brand{flex-direction:row;align-items:center;justify-content:flex-start;gap:16px;margin:0 0 76px;text-align:left}
  .login-card-brand .login-app-mark{box-shadow:none}
  .login-card-brand strong{margin:0;color:#1c2620;font-size:30px;font-weight:400;line-height:1.35;letter-spacing:-.025em}
  .login-title{margin:0 0 26px;color:#1c2620;text-align:left;letter-spacing:-.02em}
  .login-form{gap:10px}
  .login-desktop-label{display:block;color:#34443b;font-size:14px;font-weight:700}
  .login-input-field{margin-bottom:8px}
  /* The phone card floats the icon on a white disc so it survives the photo
     behind it. On the white desktop panel that disc would be invisible, so the
     glyph sits in the field on its own and the input makes room for it. */
  .login-field-icon{top:50%;left:2px;width:36px;height:36px;transform:translateY(-50%);border-radius:0;background:none;color:#6a786f;box-shadow:none}
  .login-input-field:focus-within .login-field-icon{color:#1d6143;transform:translateY(-50%) scale(1.03)}
  .login-input-field input:not([type="checkbox"]){min-height:44px;height:44px;padding:11px 12px 11px 38px;border:1px solid #b6c2ba;border-radius:9px;background:#fff;color:#1c2620;box-shadow:none}
  .login-password-field input:not([type="checkbox"]){padding-right:48px}
  .login-form input::placeholder{color:#6a786f}
  .login-form input:not([type="checkbox"]):focus{border-color:#1d6143;background:#fff;box-shadow:0 0 0 3px rgba(29,97,67,.12)}
  .login-form input:-webkit-autofill,
  .login-form input:-webkit-autofill:hover,
  .login-form input:-webkit-autofill:focus{-webkit-text-fill-color:#1c2620;box-shadow:0 0 0 1000px #fff inset;caret-color:#1c2620}
  .login-password-toggle{color:#5e7064}
  .login-password-toggle:hover,
  .login-password-toggle:focus-visible{background:#edf3ef;color:#163f30}
  .login-options{margin:2px 0 16px;padding:0;color:#526259}
  .login-remember input{accent-color:#1d6143}
  .login-forgot{color:#526259}
  .login-forgot:hover,
  .login-forgot:focus-visible{color:#163f30}
  .login-recovery-note{margin:-8px 0 8px;border-radius:4px;border-color:#d8c477;background:#fffae8;color:#59470d}
  .login-button{align-self:flex-start;width:auto;min-width:110px;min-height:42px;padding:10px 22px;border-color:#1d6143;border-radius:9px;background:#1d6143;color:#fff;box-shadow:none}
  .login-button:hover:not(:disabled),
  .login-button:focus-visible:not(:disabled){border-color:#163f30;background:#163f30;color:#fff}
  .login-page .signin-error{border-radius:4px;background:#fff0f0;color:#982d36;text-align:left}
  .login-copyright{margin-top:auto;padding-top:56px;border:0;color:#627268;text-align:left}.login-owner,.login-credit{display:block}.login-copyright a:hover,.login-copyright a:focus-visible{color:#163f30}
}

@media(max-width:560px){
  .login-page{padding:16px 14px}
  .login-card{padding:26px 20px 22px;border-radius:22px}
  .login-card-brand{margin-bottom:21px}
  .login-title{margin-bottom:20px}
}
.export-progress{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:24px;background:rgba(10,29,20,.52);backdrop-filter:blur(4px)}.export-progress-card{width:min(300px,100%);padding:20px 20px 18px;border:1px solid rgba(255,255,255,.7);border-radius:14px;background:#fff;box-shadow:0 24px 70px rgba(9,35,23,.3);text-align:center}.export-progress-visual{position:relative;width:58px;height:58px;margin:0 auto 12px}.export-progress-file{position:absolute;inset:10px;z-index:1;display:grid;place-items:center;border-radius:11px;background:#e7f2eb;color:var(--green)}.export-progress-file .fa-icon{width:19px;height:19px}.export-progress-ring{position:absolute;inset:0;border:3px solid #dfeae3;border-top-color:var(--green);border-right-color:var(--gold);border-radius:50%;animation:export-spin .9s linear infinite}.export-progress-card strong{display:block;font-size:15px}.export-progress-card p{margin:5px 0 0;color:var(--muted);font-size:12px;line-height:1.45}.exporting-pdf{overflow:hidden}@keyframes export-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.export-progress-ring{animation:none}}
.toast{position:fixed;top:78px;left:50%;z-index:40;max-width:min(430px,calc(100vw - 32px));padding:11px 15px;border:1px solid #cdd9d2;border-radius:10px;background:#fff;box-shadow:0 15px 40px rgba(19,61,43,.16);font-size:14px;font-weight:700;opacity:0;pointer-events:none;transform:translate(-50%,-10px);transition:.22s}.toast.show{opacity:1;transform:translate(-50%,0)}.toast.error{border-color:#e4b8b4;color:#852d25}
.event{margin-top:16px;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#fcfdfc}.event+.event{margin-top:18px}.event-head{display:grid;grid-template-columns:26px auto minmax(110px,1fr) minmax(244px,260px) 112px auto 34px;gap:10px 12px;align-items:center;padding:12px 14px;background:#eef3f0}.event[data-open] .event-head{border-bottom:1px solid #e3e9e5}.event-toggle{display:grid;place-items:center;width:26px;height:26px;border:0;border-radius:7px;background:transparent;cursor:pointer}.event-toggle:hover{background:#dfe9e3}/* Stands in for the title input on a collapsed card, so it has to be sized like
   that input rather than inherit the root 16px and tower over the header. */
.event-collapsed-name{display:none;min-width:0;overflow:hidden;font-size:14px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.event-status{padding:4px 9px;border:1px solid;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap}.event-status.done{border-color:#abd0b8;background:#e9f7ed;color:#1d5a34}.event-status.needs{border-color:#ead58e;background:#fff5cf;color:#6f5406}.event-index{padding:4px 9px;border-radius:999px;background:var(--green);color:#fff;font-size:11px;font-weight:800;white-space:nowrap}.event-head input{height:36px}.event-date{grid-template-columns:minmax(0,2.9fr) minmax(0,5.5fr) minmax(0,3.6fr);gap:6px}.event-date select{height:36px;padding:0 23px 0 8px;background-position:right 8px center;background-size:10px;font-size:12px}.event-title{font-weight:700}.event .expense-table{margin:14px}.event .block-label{margin:0 14px}.event .upload-grid{margin:14px}.event-total{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;padding:11px 14px;border-top:1px solid #e3e9e5;background:#f5f8f6;font-size:13px}.event-total b{font-variant-numeric:tabular-nums}.event-figures{display:flex;flex-wrap:wrap;gap:6px;align-items:baseline}.event-figures>span{font-weight:700}.event-counts{color:var(--muted);margin-left:auto}.event-when{display:none}.event:not([data-open]) .event-body{display:none}.event:not([data-open]) .event-total{border-top:0}.event-picker{margin-top:20px}.event-picker select{max-width:460px}.event-add{margin-top:14px;padding:10px;border:1px dashed #aec2b6;border-radius:12px;background:#f8fbf9;text-align:center}.budget-table{margin-top:16px;overflow:hidden;border:1px solid var(--line);border-radius:12px;font-size:13px}.budget-row{display:grid;grid-template-columns:minmax(0,1fr) 110px 110px 130px;gap:8px;padding:10px 14px;border-top:1px solid #e3e9e5}.budget-row:first-child{border-top:0}.budget-row span:not(:first-child){text-align:right;font-variant-numeric:tabular-nums}.budget-head{background:#eef3f0;color:#52635a;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.budget-row span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Event controls keep the Grant details proportions in a denser card header. */
.event-head input{height:36px;font-size:14px}
.event-date{grid-template-columns:minmax(0,3.1fr) minmax(0,5.1fr) minmax(0,3.6fr);gap:6px}
.event-date select{height:36px;padding:0 26px 0 10px;background-position:right 9px center;background-size:10px;font-size:14px}

/* Selects. Left native they picked up a different height, radius and font from
   every other control on the page, so they are drawn like the inputs and given
   the sprite's own chevron. Rules that set a colour on a select use
   background-color, because the background shorthand would drop the chevron. */
select{appearance:none;-webkit-appearance:none;width:100%;min-width:0;max-width:100%;height:40px;padding:0 34px 0 12px;border:1px solid #ccd8d1;border-radius:9px;background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%2352635a' d='M201.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 338.7 54.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:11px;color:var(--ink);outline:0;font-weight:400;cursor:pointer;transition:.18s}
select:focus{border-color:#4d8166;box-shadow:0 0 0 3px rgba(77,129,102,.15)}
select:disabled{border-color:#e2e9e5;background-color:#f6f8f7;color:#42544a;cursor:default;opacity:1}

/* Keyboard focus was invisible on every button in the app. */
.button:focus-visible,.icon-button:focus-visible,.text-button:focus-visible,.mini-delete:focus-visible,.mobile-picker:focus-visible,.record-card:focus-visible,.event-toggle:focus-visible,.passwords-close:focus-visible,.passwords-reveal:focus-visible{outline:2px solid var(--green-2);outline-offset:2px}

/* A new event is scrolled to, and the topbar is sticky over the top of it. */
html{scroll-padding-top:84px}

/* Change a password. A dialog has no useful default styling — it opened as a
   black-bordered square box sized to its text — so the panel is laid out here
   as a head, a body and an action bar, matching the sheet it opens over.
   Kept compact: a small mark, 15px title, 13px text and short buttons. */
.passwords{width:min(380px,calc(100vw - 32px));max-width:none;padding:0;border:0;border-radius:14px;background:var(--paper);color:var(--ink);box-shadow:0 30px 70px rgba(11,32,22,.34),0 2px 6px rgba(11,32,22,.1);overflow:hidden}
.passwords[open]{display:flex;flex-direction:column;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px)}
.passwords::backdrop{background:rgba(11,26,18,.5)}
.passwords[open]{animation:panel-in .16s ease-out}
@keyframes panel-in{from{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.passwords[open]{animation:none}}
.passwords form{display:flex;flex-direction:column;min-height:0;margin:0}
.passwords-head{display:grid;grid-template-columns:30px minmax(0,1fr) 28px;align-items:center;gap:10px;flex:0 0 auto;padding:12px 12px 12px 16px;border-bottom:1px solid #e3e9e5;background:#f4f8f6}
.passwords-mark{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#e2eee7;color:var(--green-2)}
.passwords-mark .fa-icon{width:14px;height:14px}
.passwords-head h2{margin:0;font-size:15px;line-height:1.3;letter-spacing:-.01em}
.passwords-head p{margin:1px 0 0;color:var(--muted);font-size:12px;font-weight:400;line-height:1.4}
.passwords-close{display:grid;place-items:center;width:28px;height:28px;border:0;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer;transition:.18s}
.passwords-close:hover{background:#dfe9e3;color:var(--ink)}
.passwords-close .fa-icon{width:12px;height:12px}
.passwords-body{display:grid;gap:12px;min-height:0;padding:14px 16px;overflow-y:auto}
.passwords-body label{gap:6px;font-size:12px;font-weight:600}
.passwords-body :is(input,select){height:36px}
.passwords-field{position:relative;display:block}
.passwords-field input{padding-right:46px}
.passwords-reveal{position:absolute;top:50%;right:3px;display:grid;place-items:center;width:30px;height:30px;border:0;border-radius:8px;background:transparent;color:var(--muted);transform:translateY(-50%);cursor:pointer;transition:.18s}
.passwords-reveal:hover{background:#eef3f0;color:var(--green-2)}
.passwords-reveal .fa-icon{width:15px;height:15px}
.field-hint{margin:-4px 0 0;color:var(--muted);font-size:12px;font-weight:400;line-height:1.45}
.form-error{display:flex;align-items:center;gap:8px;margin:0;padding:8px 10px;border:1px solid #e4b8b4;border-radius:9px;background:#fdf3f2;color:#8b2d24;font-size:12px;font-weight:700;line-height:1.4}
.passwords-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;flex:0 0 auto;padding:10px 16px;border-top:1px solid #e3e9e5;background:#f8faf9}
.passwords-actions .button{min-height:32px;padding:5px 12px;font-size:13px;white-space:nowrap}
.confirmation{width:min(400px,calc(100vw - 32px))}
.confirmation-body{padding:14px 16px 16px;color:var(--ink);font-size:13px;line-height:1.5}
.confirmation-body p{margin:0;white-space:pre-line}
.confirmation.danger .passwords-mark{background:#fcecea;color:var(--danger)}
.button.danger-action{background:var(--danger);border-color:var(--danger);color:#fff}
.button.danger-action:hover{background:#7f281f;border-color:#7f281f}
/* The buttons keep to their labels' width, the action first, on a phone as on
   a wider screen. */
@media(min-width:901px) and (max-width:1180px){
.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.event-head{grid-template-columns:26px auto minmax(0,1fr) fit-content(112px) 34px}
.event-head .event-toggle{grid-column:1;grid-row:1}
.event-head .event-index{grid-column:2;grid-row:1}
.event-head .event-title{grid-column:3;grid-row:1}
.event-head .event-status{grid-column:4;grid-row:1;justify-self:end}
.event-head .mini-delete{grid-column:5;grid-row:1}
.event-head .event-date{grid-column:1/4;grid-row:2}
.event-head .money-input{grid-column:4/-1;grid-row:2}
}
@media(max-width:900px){.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.workspace{grid-template-columns:minmax(0,1fr);padding:16px}.sidebar{position:static;max-height:none}.mobile-picker{display:flex;width:100%;align-items:center;justify-content:space-between;padding:12px 16px;border-top:0;background:#fff;color:var(--ink);text-align:left}.record-list{display:none;max-height:50vh}.record-list.open{display:block}.sheet-head{padding:20px}.sheet-body{padding:22px}.event-head{grid-template-columns:26px 1fr auto auto;gap:8px}.event-head .event-toggle{grid-column:1;grid-row:1}.event-head .event-index{grid-column:2;grid-row:1;justify-self:start}.event-head .event-status{grid-column:3;grid-row:1}.event-head .mini-delete{grid-column:4;grid-row:1}.event-head input,.event-head .money-input,.event-head .event-date{grid-column:1/-1}.event:not([data-open]) .event-head input,.event:not([data-open]) .event-head .money-input,.event:not([data-open]) .event-head .event-date{display:none}.event:not([data-open]) .event-collapsed-name{display:block;grid-column:1/-1;grid-row:2}.event:not([data-open]) .event-when{display:inline}.event-counts{margin-left:0;flex-basis:100%}.budget-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:12px 14px}.budget-row span:first-child{grid-column:1/-1;font-weight:700}.budget-row span:not(:first-child){text-align:left}.budget-row span[data-label]::before{content:attr(data-label);display:block;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.budget-head{display:none}}
@media(max-width:1180px){.expense-header{display:none}.expense-row{grid-template-columns:minmax(0,1fr);gap:10px;padding:14px 12px}.expense-row [data-remove-expense]{justify-self:start;font-size:13px;font-weight:700}.expense-row [data-remove-expense]::after{content:" Remove purchase"}.ref{margin:0}.expense-cell{padding:0}}
@media(max-width:600px){.topbar{padding:0 14px}.brand small{display:none}.brand{gap:10px}.brand-icon{width:42px;height:42px}.brand strong{font-size:15px}.workspace{padding:12px}.sheet-head{flex-direction:column}.sheet-head h1{font-size:23px}.form-grid{grid-template-columns:minmax(0,1fr)}.sheet-body{padding:20px 16px}.sheet-footer{align-items:stretch;padding:14px 16px}.sheet-footer>div{flex:1}.sheet-footer .button{flex:1}.upload-card{align-items:flex-start;flex-wrap:wrap}.upload-card .button{width:auto}}
@media(max-width:600px){
.sheet-footer{flex-direction:column-reverse;align-items:stretch;gap:10px}
.sheet-footer>div{flex:0 0 auto;flex-wrap:wrap;gap:10px}
.sheet-footer>div .button{flex:1 1 150px}
.sheet-footer>.button{flex:0 0 auto;width:100%}
.event-head{padding:12px}
.event .expense-table,.event .upload-grid{margin:12px}
.event .block-label{margin:0 12px}
.expense-header,.expense-row{padding:12px 10px}
.summary>div{padding:13px 14px}
.toast{top:72px}
}
/* Safari on iOS zooms the page in whenever you focus a field whose text is
   under 16px, and never zooms back out - so a phone form built at 14px lurches
   on every tap. Fields on a touch device are therefore 16px, the size that
   leaves the page still. A mouse-driven browser keeps the 14px the rest of the
   form is built at. Checkboxes are sized by their box, not their text. A phone
   goes back to 14px below: app.js caps the zoom on Apple devices instead. */
@media(pointer:coarse){
input:not([type="checkbox"]),textarea,select,.event-head input,.event-date select,.date-parts select{font-size:16px}
}

/* Keep the funding-round title compact beside the status badge. */
.sheet-head h1{font-size:24px}
/* A phone's type, at RollCall's sizes: semibold 15px headings no larger than
   the app's name, 12px labels and descriptions, 13px buttons and 14px fields.
   The fields can go under 16px because app.js caps iOS's zoom. */
@media(max-width:600px){
.sheet-head p{font-size:11px;letter-spacing:.12em}
.sheet-head h1{font-size:17px}
.sidebar h2,.section-title h2{font-size:15px;font-weight:600}
.section-title>span{flex-basis:28px;width:28px;height:28px;font-size:11px}
.section-title p{font-size:12px;line-height:18px}
label,.block-label{font-size:12px;font-weight:600}
.upload-card strong,.event-collapsed-name,.summary dt,.summary dd{font-size:13px}
.notice{font-size:12px;line-height:18px}
.event-total,.budget-table,.money-input span{font-size:12px}
.button{font-size:13px}
input:not([type="checkbox"]),textarea,select,.event-head input,.event-date select,.date-parts select{font-size:14px}
}

/* Phones: the form in tabs along the bottom (see app.js). Everything below
   applies only while body.phone-tabs is set, which is up to 600px wide and
   signed in; wider screens keep the sheet. */
.phone-label{display:none}
body.phone-tabs .workspace{display:block;padding:14px max(16px,env(safe-area-inset-right,0px)) calc(100px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
body.phone-tabs.phone-has-save .workspace{padding-bottom:calc(170px + env(safe-area-inset-bottom,0px))}
body.phone-tabs :is(.sidebar,.sheet-head,.sheet-footer,.section-title,#eventPicker,#roleChip,#passwordButton){display:none}
body.phone-tabs .sheet{overflow:visible;border:0;border-radius:0;background:none;box-shadow:none}
body.phone-tabs .sheet-body{gap:14px;padding:0}
body.phone-tabs #statusNotice:not(.locked),body.phone-tabs[data-phone-view="more"] #statusNotice{display:none}
body.phone-tabs[data-phone-view="summary"] :is(#grantSection,#eventsSection),
body.phone-tabs[data-phone-view="events"] :is(#grantSection,#summarySection),
body.phone-tabs[data-phone-view="funding"] :is(#eventsSection,#summarySection),
body.phone-tabs[data-phone-view="more"] :is(#grantSection,#eventsSection,#summarySection){display:none}

/* Each tab's own round, its title, and on Summary the round's actions. */
/* minmax(0,1fr): a long round name shortens inside the picker instead of widening the page. */
.phone-head{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.round-picker{display:flex;align-items:center;gap:8px;width:100%;min-width:0;padding:11px 12px;border:1px solid var(--line);border-radius:14px;background:#fff;text-align:left;cursor:pointer}
.round-picker:hover{border-color:#a9c2b4}
.round-text{display:flex;flex-direction:column;min-width:0;flex:1}
.round-name{display:flex;align-items:center;gap:6px;min-width:0;font-family:var(--font-display);font-size:17px;font-weight:600;line-height:1.3;color:var(--green)}
.round-name span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.round-name .fa-icon{flex:none;width:11px;height:11px;color:var(--muted)}
.round-sub{overflow:hidden;color:var(--muted);font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.unsaved-pill{flex:none;padding:3px 8px;border:1px solid #c8d9ce;border-radius:999px;background:#eef3f0;color:var(--green-2);font-size:11px;font-weight:700;white-space:nowrap}
.round-picker .badge{flex:none}
.phone-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.phone-title h2{margin:0;font-family:var(--font-display);font-size:15px;font-weight:600;line-height:1.35}
.phone-title p{margin:2px 0 0;color:var(--muted);font-size:12px;line-height:1.5}
.phone-count{color:var(--muted);font-size:12px}
.phone-title .new-round{flex:none;padding:6px 11px;border-color:var(--gold);background:var(--gold);color:#2c2207}
.phone-title .new-round:hover{background:#c99413}
.phone-back{display:inline-flex;align-items:center;gap:6px;justify-self:start;margin-left:-6px;padding:6px 10px 6px 6px;border:0;border-radius:9px;background:none;color:var(--green-2);font-size:13px;font-weight:700;cursor:pointer}
.phone-back .fa-icon{width:11px;height:11px;transform:rotate(180deg)}
.phone-actions{display:flex;flex-wrap:wrap;gap:8px}
.phone-actions .button{flex:0 0 auto;padding:6px 10px}
.button.is-muted{border-color:var(--line);background:#f6f8f7;color:#7d8a83}
.phone-note{margin:0}

/* Summary */
body.phone-tabs .summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0;overflow:visible;border:0;border-radius:0}
body.phone-tabs .summary>div{display:block;padding:12px;border:1px solid #dde8e1;border-radius:12px;background:#f1f7f3}
body.phone-tabs .summary dd{margin-top:4px;font-size:16px;letter-spacing:-.02em}
body.phone-tabs .summary>.summary-balance{grid-column:1/-1;border-color:#ead58e;background:#fffbea}
body.phone-tabs .budget-table{margin-top:14px;border-radius:14px;background:#fff}

/* Funding */
body.phone-tabs #grantSection .form-grid{gap:14px;margin:0;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff}

/* Events: the list, and the one event opened from it */
.phone-events{display:grid;gap:10px}
.phone-event{display:grid;gap:6px;width:100%;padding:13px 14px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--ink);text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.phone-event:hover{border-color:#a9c2b4}
.phone-event.just-added{border-color:var(--gold);box-shadow:0 0 0 3px rgba(217,162,27,.25)}
.phone-event-top{display:flex;align-items:center;gap:8px}
.phone-event-top .event-status{margin-left:auto}
.phone-event-top>.fa-icon{width:10px;height:10px;color:var(--muted)}
.phone-event-title{font-size:13px;font-weight:700;line-height:1.35;overflow-wrap:anywhere}
.phone-event-money{font-size:12px;font-variant-numeric:tabular-nums}
.phone-event-meta{color:var(--muted);font-size:12px}
.phone-empty{display:grid;justify-items:center;gap:6px;padding:26px 16px;border:1px dashed var(--line);border-radius:14px;background:#fff;color:var(--muted);font-size:12px;text-align:center}
.phone-empty strong{color:var(--ink);font-size:13px}
.phone-empty .fa-icon{width:22px;height:22px;color:var(--green-2)}
body.phone-tabs .event-add{margin-top:10px;padding:0;border:0;background:none}
body.phone-tabs #addEventButton{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:36px;border:1px dashed #9fb8aa;border-radius:10px;background:#f7faf8}
body.phone-tabs.phone-event-open .event-add{display:none}
body.phone-tabs .event{display:grid;gap:14px;margin:0;overflow:visible;border:0;background:none}
body.phone-tabs .event-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 10px;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff}
body.phone-tabs .event-head :is(.event-toggle,.event-collapsed-name){display:none}
body.phone-tabs .event-head .event-index{grid-column:1;grid-row:1;justify-self:start}
body.phone-tabs .event-head .event-status{grid-column:2;grid-row:1;justify-self:end}
body.phone-tabs .event-head [data-remove-event]{grid-column:3;grid-row:1}
body.phone-tabs .event-head :is(.phone-label,.event-title,.event-date,.money-input){display:block;grid-column:1/-1;grid-row:auto}
body.phone-tabs .event-head .event-date{display:grid}
/* Room for a four-digit year on the narrowest phones. */
body.phone-tabs .date-parts select{padding:0 24px 0 9px;background-position:right 8px center}
body.phone-tabs .event-head .phone-label{margin-top:6px;color:#394a42;font-size:12px;font-weight:600}
body.phone-tabs .event-body{display:grid;gap:14px}
body.phone-tabs .event .expense-table{margin:0;padding:14px;overflow:visible;border:1px solid var(--line);border-radius:14px;background:#fff}
body.phone-tabs .phone-heading{display:block;margin:0 0 10px;font-family:var(--font-display);font-size:14px;font-weight:600}
body.phone-tabs .expense-row{padding:12px;border:1px solid var(--line);border-radius:12px;background:#fafcfb}
body.phone-tabs .expense-row+.expense-row{margin-top:10px}
body.phone-tabs .expense-add{padding:10px 0 0}
body.phone-tabs .event .block-label{margin:0;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff}
body.phone-tabs .event .upload-grid{margin:0;grid-template-columns:minmax(0,1fr);gap:14px}
body.phone-tabs .upload-card{padding:14px;border-radius:14px}
body.phone-tabs .photo-preview{display:block;width:100%;max-height:220px;margin-top:10px;border-radius:10px;object-fit:cover;background:#edf3ef}
body.phone-tabs .event-total{border:1px solid var(--line);border-radius:14px;background:#fff}

/* More */
.phone-more{display:grid;gap:14px}
.phone-settings h3{margin:0 0 8px;font-family:var(--font-display);font-size:14px;font-weight:600}
.phone-account{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff}
.phone-account strong{display:block;font-size:14px}
.phone-account span{color:var(--muted);font-size:12px}
.phone-avatar{display:grid;flex:none;place-items:center;width:42px;height:42px;border-radius:50%;background:#eef3f0;color:var(--green-2)}
.phone-avatar .fa-icon{width:18px;height:18px}
.phone-rows{overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#fff}
.phone-row{display:flex;align-items:center;gap:10px;width:100%;min-height:42px;padding:0 14px;border:0;background:none;color:var(--ink);font-size:13px;text-align:left;cursor:pointer}
.phone-row .fa-icon{width:14px;height:14px;color:var(--green-2)}
.phone-row .row-end{width:10px;height:10px;margin-left:auto;color:var(--muted)}

/* The Save bar and the tab bar float over the page. */
.phone-save,.phone-tabbar{position:fixed;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));max-width:430px;margin:0 auto}
.phone-save{bottom:calc(86px + env(safe-area-inset-bottom,0px));z-index:30;display:flex;align-items:center;gap:12px;padding:7px 7px 7px 14px;border:1px solid #c8d9ce;border-radius:14px;background:#fff;box-shadow:0 6px 24px rgba(11,38,24,.14)}
.phone-save div{flex:1;min-width:0;font-size:12px;line-height:1.4}
.phone-save strong{display:block;overflow:hidden;font-size:13px;text-overflow:ellipsis;white-space:nowrap}
.phone-save div span{color:var(--muted)}
.phone-save .button{flex:none}
.phone-tabbar{bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:31;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));height:60px;padding:5px;border-radius:999px;background:var(--green);box-shadow:0 10px 30px rgba(9,35,22,.28)}
.phone-tabbar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:0;border-radius:999px;background:none;color:#c8dbd0;font-size:11px;font-weight:400;cursor:pointer}
.phone-tabbar svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.phone-tabbar button[aria-current="page"]{background:rgba(255,255,255,.15);color:#fff}
.phone-tabbar button[aria-current="page"] svg{stroke-width:2.2}
.phone-tabbar button[aria-current="page"] svg .fill{fill:currentColor}
.phone-tabbar button:focus-visible{outline:3px solid var(--gold);outline-offset:-3px}
body.phone-tabs .toast{top:auto;bottom:calc(92px + env(safe-area-inset-bottom,0px));width:max-content;max-width:calc(100vw - 32px)}
body.phone-tabs.phone-has-save .toast{bottom:calc(160px + env(safe-area-inset-bottom,0px))}

/* Sheets rise from the bottom: rounds, adding an event, what approval still needs. */
dialog.phone-sheet{width:min(430px,100vw);max-width:100%;max-height:88vh;margin:auto auto 0;padding:0;border:0;border-radius:18px 18px 0 0;background:#fff;color:var(--ink);box-shadow:0 -10px 40px rgba(0,0,0,.18)}
dialog.phone-sheet::backdrop{background:rgba(11,26,18,.45)}
.phone-sheet form{display:grid;gap:10px;padding:14px max(16px,env(safe-area-inset-right,0px)) calc(14px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.phone-sheet-head{display:flex;align-items:flex-start;gap:10px}
.phone-sheet-head h2{margin:0;font-family:var(--font-display);font-size:15px;font-weight:600}
.phone-sheet-head p{margin:2px 0 0;color:var(--muted);font-size:12px;font-weight:400;line-height:1.4}
.phone-sheet-close{display:grid;flex:none;place-items:center;width:28px;height:28px;margin-left:auto;border:0;border-radius:8px;background:#eef3f0;color:var(--muted);cursor:pointer}
.phone-sheet-close .fa-icon{width:12px;height:12px}
.phone-field{display:grid;gap:8px;color:#394a42;font-size:12px;font-weight:600}
.phone-sheet-actions{display:flex;justify-content:flex-end;gap:8px}
.phone-sheet :is(.phone-sheet-actions .button,.button.wide){min-height:32px;padding:5px 12px;white-space:nowrap}
.phone-sheet .button.wide{justify-self:end}
.phone-sheet :is(label,.phone-field){gap:6px}
.phone-sheet :is(input,.date-parts select){height:36px}
.phone-sheet-empty{margin:0;color:var(--muted);font-size:13px}
.year-chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}
.year-chips button{display:inline-flex;flex:none;align-items:center;gap:5px;min-height:30px;padding:4px 11px;border:1px solid #cbd7d0;border-radius:999px;background:#fff;color:#263a30;font-size:12px;font-weight:700;cursor:pointer}
.year-chips button span{color:var(--muted);font-weight:600}
.year-chips button[aria-pressed="true"]{border-color:var(--green);background:var(--green);color:#fff}
.year-chips button[aria-pressed="true"] span{color:#c8dbd0}
.round-options{display:grid;gap:6px;max-height:46vh;overflow:auto}
.round-option{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1px 10px;width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);text-align:left;cursor:pointer}
.round-option[aria-current="true"]{border-color:var(--green-2);box-shadow:0 0 0 2px rgba(36,87,62,.15)}
.round-option strong{font-family:var(--font-display);font-size:13px;font-weight:600}
.round-option>span{color:var(--muted);font-size:12px}
.round-option .round-option-marks{display:flex;flex-direction:column;grid-row:1/3;grid-column:2;align-items:flex-end;align-self:center;gap:4px}
.issue-list{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.issue-list button{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:1px solid #ead58e;border-radius:10px;background:#fffbea;color:#4d3d0b;font-size:12px;text-align:left;cursor:pointer}
.issue-list b{display:block;color:var(--ink);font-size:13px}
.issue-list .fa-icon{width:10px;height:10px;margin-left:auto}
@media(prefers-reduced-motion:reduce){.phone-event{transition:none}}

/* RollCall's desktop shell: a light docked sidebar and one white page. The
   phone tabs and the tablet's full reconciliation retain their own layouts. */
@media screen and (min-width:1024px){
  body.desktop-shell #topbar,body.desktop-shell .workspace>.sidebar{display:none}
  body.desktop-shell .workspace{display:block;width:calc(100% - 248px);max-width:none;margin:0 0 0 248px;padding:0 24px 24px}
  .desktop-sidebar{position:fixed;inset:0 auto 0 0;z-index:25;display:flex;flex-direction:column;width:248px;padding:0 12px;background:var(--ground);overflow-y:auto}
  .desktop-brand{display:flex;align-items:center;gap:10px;min-height:82px;padding:16px 10px;border:0;background:none;color:var(--green);text-align:left;cursor:pointer}
  .desktop-brand img{flex:none;object-fit:contain}
  .desktop-brand span{font-family:var(--font-display);font-size:17px;font-weight:700;line-height:1.3}
  .desktop-nav{display:grid;align-content:start;gap:16px}
  .desktop-nav-group{display:grid;gap:3px}
  .desktop-nav-label{padding:8px 10px;color:var(--muted);font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
  .desktop-nav button{display:flex;align-items:center;gap:10px;width:100%;min-height:36px;padding:7px 10px;border:0;border-radius:8px;background:none;color:var(--ink);font-size:13px;font-weight:400;text-align:left;cursor:pointer}
  .desktop-nav button>.fa-icon{width:16px;height:16px;color:var(--muted)}
  .desktop-nav-icon{flex:none;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;color:var(--muted)}
  .desktop-nav button:hover{background:#e9eeeb}
  .desktop-nav button[aria-current="page"]{background:#e2ebe5;color:var(--green);font-weight:600}
  .desktop-nav button[aria-current="page"]>.fa-icon{color:var(--green-2)}
  .desktop-nav button[aria-current="page"]>.desktop-nav-icon{color:var(--green-2)}
  .desktop-nav-count{margin-left:auto;color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}
  .desktop-account{display:grid;gap:12px;margin-top:auto;padding:14px 4px 18px;border-top:1px solid var(--line)}
  .desktop-user{display:flex;align-items:center;gap:9px;padding:0 6px}
  .desktop-avatar{display:grid;place-items:center;flex:none;width:30px;height:30px;border:1px solid var(--line);border-radius:50%;background:white;color:var(--green-2)}
  .desktop-avatar .fa-icon{width:13px;height:13px}
  .desktop-user>div{min-width:0}
  .desktop-user strong{display:block;font-size:13px;font-weight:600}
  .desktop-user small{display:block;margin-top:3px;color:var(--muted);font-size:10px;line-height:1.5}
  #desktopLogout{justify-self:start;margin-left:6px;font-size:12px;font-weight:400}
  .desktop-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:82px;padding:12px 0}
  .desktop-breadcrumb{display:flex;align-items:center;gap:8px;margin:0;color:var(--muted);font-size:12px;white-space:nowrap}
  .desktop-breadcrumb .fa-icon{width:8px;height:8px}
  .desktop-breadcrumb span{color:var(--ink)}
  #desktopBreadcrumbGroup{color:var(--muted)}
  .desktop-round-controls{display:flex;align-items:flex-end;gap:10px;min-width:0}
  .desktop-round-controls select{height:34px;font-size:12px;padding-left:10px}
  #desktopYear{width:90px}
  #desktopRound{width:clamp(190px,21vw,290px)}
  .desktop-new{min-height:34px;white-space:nowrap;background:var(--gold);color:#2c2207;font-weight:400}
  .desktop-new:hover{background:#c99413}
  body.desktop-shell .sheet{display:flex;flex-direction:column;min-height:calc(100dvh - 106px);overflow:visible;box-shadow:none;border-radius:14px}
  body.desktop-shell .sheet-head{align-items:center;padding:24px 26px 20px;border-radius:14px 14px 0 0;background:#fff;color:var(--ink)}
  body.desktop-shell .sheet-head>div>p:first-child{display:none}
  body.desktop-shell .sheet-head h1{margin:0;font-size:23px;color:var(--green)}
  body.desktop-shell .sheet-head .desktop-page-intro{margin:7px 0 0;color:var(--muted);font-size:12px;font-weight:400;line-height:1.6;letter-spacing:0;text-transform:none}
  body.desktop-shell .status-wrap{align-items:flex-end;flex-direction:column;flex:none;color:var(--muted);font-size:11px}
  body.desktop-shell .sheet-body{flex:1;align-content:start;gap:20px;padding:0 26px 26px}
  body.desktop-shell .section-title{display:none}
  body.desktop-shell[data-desktop-view="summary"] :is(#grantSection,#eventsSection),
  body.desktop-shell[data-desktop-view="events"] :is(#grantSection,#summarySection),
  body.desktop-shell[data-desktop-view="funding"] :is(#eventsSection,#summarySection),
  body.desktop-shell[data-desktop-view="settings"] :is(#grantSection,#eventsSection,#summarySection,#statusNotice,.status-wrap,.sheet-footer){display:none}
  .settings-card{display:flex;align-items:center;justify-content:space-between;gap:24px;max-width:760px;padding:20px;border:1px solid var(--line);border-radius:12px}
  .settings-card h2{margin:0;font-family:var(--font-display);font-size:16px;font-weight:600}
  .settings-card p{margin:6px 0 0;color:var(--muted);font-size:13px;line-height:1.6}
  .settings-card .button{flex:none;font-weight:400}
  body.desktop-shell .form-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:0;gap:18px}
  body.desktop-shell label,body.desktop-shell .block-label{font-size:12px;font-weight:600}
  body.desktop-shell .summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0;overflow:visible;border:0;border-radius:0}
  body.desktop-shell .summary>div{display:block;padding:16px;border:1px solid var(--line);border-radius:10px;background:#fff}
  body.desktop-shell .summary>.summary-balance{background:#f3f7f4;border-color:#c7d8cd}
  body.desktop-shell .summary dt{color:var(--muted);font-size:12px;font-weight:500}
  body.desktop-shell .summary dd{margin-top:8px;font-size:18px;font-weight:600}
  body.desktop-shell .budget-table{margin-top:22px}
  body.desktop-shell .notice{padding:11px 13px;font-size:12px;line-height:1.6}
  body.desktop-shell .event:first-child{margin-top:0}
  body.desktop-shell .event-picker{margin:0 0 18px}
  body.desktop-shell .event-head{grid-template-columns:26px auto minmax(0,1fr) auto 28px;gap:10px}
  body.desktop-shell .event-head .event-toggle{grid-column:1;grid-row:1}
  body.desktop-shell .event-head .event-index{grid-column:2;grid-row:1}
  body.desktop-shell .event-head .event-title{grid-column:3;grid-row:1}
  body.desktop-shell .event-head .event-status{grid-column:4;grid-row:1}
  body.desktop-shell .event-head .mini-delete{grid-column:5;grid-row:1}
  body.desktop-shell .event-head .event-date{grid-column:2/4;grid-row:2;max-width:320px}
  body.desktop-shell .event-head .money-input{grid-column:4/6;grid-row:2;max-width:145px;justify-self:end}
  body.desktop-shell .sheet-footer{position:sticky;bottom:0;z-index:10;flex-shrink:0;padding:13px 26px;border-radius:0 0 14px 14px;background:#f8faf9}
  body.desktop-shell .toast{top:auto;bottom:82px;left:calc(50% + 124px);max-width:calc(100vw - 300px)}
  .desktop-sidebar button:focus-visible{outline:2px solid var(--green-2);outline-offset:2px}
  #sheetTitle:focus{outline:none}
}

@media print{@page{size:A4 portrait;margin:12mm}body{background:#fff;color:#000}.no-print,.toast{display:none!important}.workspace{display:block;max-width:none;padding:0}.sheet{border:0;border-radius:0;box-shadow:none}.sheet-head{padding:0 0 8mm;background:#fff;color:#000}.sheet-head p{color:#444}.sheet-body{padding:0;gap:8mm}.section-title>span{border:1px solid #888;background:#fff;color:#000}section,.expense-row{break-inside:avoid}.expense-header,.expense-row{grid-template-columns:50px minmax(180px,1fr) 120px 190px 0}.expense-header{display:grid!important}.upload-card{border-style:solid;background:#fff}input,textarea,select{border-color:#aaa;box-shadow:none!important}.summary>div{padding:10px 12px}}