:root{font-family:"Plus Jakarta Sans",system-ui,sans-serif;color:#1f1c21;background:#fbfbfc;font-synthesis:none;text-rendering:optimizeLegibility;--bg:#fbfbfc;--surface:#fff;--low:#f5f4f7;--medium:#eceaf0;--text:#1f1c21;--muted:#514b54;--outline:#68616b;--border:#e3e0e7;--blue:#697a91;--blue-pale:#edf1f6;--red:#b06b70;--red-pale:#faeff0;--radius:18px}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:var(--bg)}button,input{font:inherit}button{cursor:pointer}.hidden{display:none!important}.app-shell{min-height:100vh}.login-wrap{width:min(420px,calc(100% - 36px));margin:10vh auto 0}.brand-mark{display:grid;place-items:center;width:54px;height:54px;border-radius:18px;background:#1f1c21;color:white;font-size:25px;font-weight:800;box-shadow:0 5px 16px #1f1c2118}.brand-mark.small{width:38px;height:38px;border-radius:13px;font-size:18px}.eyebrow{margin:0 0 7px;color:var(--outline);font-size:10px;line-height:1.4;font-weight:700;letter-spacing:1.15px}.login-wrap>.eyebrow{margin-top:27px}.login-wrap h1,.page-intro h1{margin:0;font-size:30px;line-height:1.2;letter-spacing:-.8px}.muted{color:var(--muted)}.login-copy{font-size:13px;margin:9px 0 24px}.login-card,.panel,.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 5px 18px #28242a0a}.login-card{padding:22px}.login-card label{display:block;margin:0 0 7px;color:var(--muted);font-size:12px;font-weight:600}.login-card input{width:100%;height:46px;margin-bottom:16px;padding:0 12px;border:1px solid var(--border);border-radius:12px;background:var(--low);color:var(--text);outline:none}.login-card input:focus,.search-box:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px #697a911f}.button{min-height:40px;padding:0 14px;border:0;border-radius:12px;font-size:12px;font-weight:700;transition:transform .15s ease,opacity .15s ease,background .15s ease}.button:active{transform:scale(.98)}.button:disabled{opacity:.5;cursor:wait}.button.primary{background:var(--text);color:white}.button.secondary{background:var(--blue-pale);color:var(--text)}.button.ghost{background:transparent;color:var(--muted)}.button.wide{width:100%;margin-top:2px}.message{min-height:16px;margin:10px 0 0;color:var(--red);font-size:11px}.dashboard{max-width:1440px;margin:0 auto;padding:0 28px 28px}.topbar{height:72px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border)}.brand-lockup,.top-actions{display:flex;align-items:center;gap:11px}.brand-lockup strong,.brand-lockup span{display:block}.brand-lockup strong{font-size:13px}.brand-lockup span{margin-top:2px;color:var(--muted);font-size:10px}.top-actions{gap:15px}.page-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;padding:28px 0 20px}.page-intro h1{font-size:25px}.page-intro .muted{margin:8px 0 0;font-size:12px}.page-intro .eyebrow{margin-bottom:5px}.notice{margin-bottom:16px;padding:12px 14px;border:1px solid var(--border);border-radius:12px;background:var(--blue-pale);color:var(--text);font-size:12px}.notice.error{border-color:#ecd4d6;background:var(--red-pale);color:#74474b}.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px}.stat-card{padding:15px 17px}.stat-card span,.detail-summary span{display:block;color:var(--muted);font-size:10px}.stat-card strong{display:block;margin-top:5px;font-size:23px;letter-spacing:-.5px}.workspace{display:grid;grid-template-columns:minmax(250px,320px) minmax(0,1fr);gap:14px;align-items:start}.panel{min-width:0;padding:18px}.member-panel{position:sticky;top:12px;max-height:calc(100vh - 24px);display:flex;flex-direction:column}.panel-heading,.subheading{display:flex;align-items:center;justify-content:space-between;gap:10px}.panel-heading h2,.detail-heading h2,.empty-detail h2{margin:0;font-size:16px;letter-spacing:-.3px}.panel-heading .eyebrow{margin-bottom:3px}.count-pill,.id-pill{padding:6px 9px;border-radius:999px;background:var(--low);color:var(--muted);font-size:10px;font-weight:700}.search-box{display:flex;align-items:center;gap:7px;height:42px;margin:15px 0 10px;padding:0 10px;border:1px solid var(--border);border-radius:12px;background:var(--low);color:var(--outline)}.search-box span{font-size:20px}.search-box input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--text);font-size:11px}.member-list{overflow:auto;display:grid;gap:6px;padding-right:2px}.member-row{display:flex;align-items:center;gap:10px;width:100%;padding:10px;border:1px solid transparent;border-radius:13px;background:transparent;text-align:left;color:var(--text)}.member-row:hover{background:var(--low)}.member-row.selected{border-color:var(--border);background:var(--low)}.mini-avatar,.avatar{flex:0 0 auto;display:grid;place-items:center;border-radius:50%;background:var(--blue-pale);color:var(--text);font-weight:700}.mini-avatar{width:35px;height:35px;font-size:12px}.member-copy{min-width:0;flex:1}.member-copy strong,.member-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-copy strong{font-size:11px}.member-copy span{margin-top:3px;color:var(--muted);font-size:9px}.member-progress{color:var(--outline);font-size:10px;font-weight:700}.history-panel{min-height:440px}.empty-detail{min-height:400px;display:grid;align-content:center;justify-items:center;text-align:center}.empty-detail p{margin:8px 0 0;font-size:12px}.empty-icon{display:grid;place-items:center;width:52px;height:52px;margin-bottom:14px;border-radius:16px;background:var(--low);font-size:27px;color:var(--blue)}.detail-heading{display:flex;align-items:center;gap:12px;padding:3px 0 16px;border-bottom:1px solid var(--border)}.avatar{width:48px;height:48px;font-size:18px}.detail-identity{min-width:0;flex:1}.detail-identity h2{overflow-wrap:anywhere}.detail-identity .muted{margin:4px 0 0;font-size:11px;overflow-wrap:anywhere}.id-pill{background:var(--blue-pale);color:var(--text);white-space:nowrap}.detail-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:13px 0;border-bottom:1px solid var(--border)}.detail-summary strong{display:block;margin-top:4px;font-size:14px}.history-layout{display:grid;grid-template-columns:minmax(180px,.7fr) minmax(260px,1.3fr);gap:15px;padding-top:16px}.subheading{margin-bottom:8px}.subheading h3{margin:0;font-size:12px}.subheading .muted{font-size:10px}.history-list{display:grid;gap:6px;max-height:450px;overflow:auto}.history-day{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;padding:10px;border:1px solid var(--border);border-radius:12px;background:white;text-align:left;color:var(--text)}.history-day.selected{border-color:var(--blue);background:var(--blue-pale)}.history-day span{font-size:10px}.history-day strong{font-size:11px}.day-editor{min-width:0;padding:14px;border:1px solid var(--border);border-radius:15px;background:var(--low)}.editor-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:12px}.editor-head h3{margin:0;font-size:13px}.editor-head p{margin:3px 0 0;color:var(--muted);font-size:10px}.editor-score{display:flex;align-items:baseline;gap:3px;white-space:nowrap}.editor-score strong{font-size:21px}.editor-score span{color:var(--muted);font-size:10px}.progress-track{height:7px;margin-bottom:13px;border-radius:999px;background:var(--medium);overflow:hidden}.progress-fill{height:100%;border-radius:inherit;background:var(--text);transition:width .2s ease}.slot-block{margin-top:11px}.slot-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:5px;color:var(--muted);font-size:10px;font-weight:700}.food-row{display:flex;align-items:center;gap:9px;padding:8px 0;border-top:1px solid var(--border)}.food-row input{width:16px;height:16px;accent-color:var(--text)}.food-info{min-width:0;flex:1}.food-info strong,.food-info span{display:block}.food-info strong{font-size:10px;font-weight:600}.food-info span{margin-top:2px;color:var(--muted);font-size:9px}.save-row{display:flex;justify-content:flex-end;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}.save-row .button{min-height:36px}.empty-state{padding:17px;color:var(--muted);font-size:11px;text-align:center}.footer-note{padding:14px 2px;color:var(--muted);font-size:10px;text-align:center}.busy-overlay{position:fixed;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;gap:10px;background:#fbfbfce8;color:var(--muted);font-size:12px}.spinner{width:18px;height:18px;border:2px solid var(--medium);border-top-color:var(--text);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:900px){.dashboard{padding:0 16px 20px}.workspace{grid-template-columns:minmax(220px,270px) minmax(0,1fr)}.history-layout{grid-template-columns:1fr}.history-list{max-height:190px;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start}}@media(max-width:650px){.dashboard{padding:0 12px 16px}.topbar{height:62px}.page-intro{padding:21px 0 15px;align-items:flex-start}.page-intro h1{font-size:22px}.page-intro .muted{max-width:260px;line-height:1.5}.page-intro .button{min-width:42px;padding:0 10px}.stats-grid{gap:7px}.stat-card{padding:12px 10px;border-radius:14px}.stat-card span{font-size:9px;line-height:1.35}.stat-card strong{font-size:19px}.workspace{grid-template-columns:1fr}.member-panel{position:static;max-height:370px}.history-panel{min-height:330px;padding:14px}.empty-detail{min-height:290px}.detail-heading{gap:9px}.avatar{width:40px;height:40px}.detail-heading h2{font-size:14px}.detail-identity .muted{font-size:10px}.id-pill{font-size:9px;padding:5px 7px}.history-layout{gap:11px}.history-list{grid-template-columns:repeat(2,minmax(0,1fr));max-height:220px}.day-editor{padding:12px}.history-day{padding:9px}.history-day span{font-size:9px}.detail-summary{gap:5px}.detail-summary span{font-size:9px}.detail-summary strong{font-size:12px}}
.runtime-hint{margin-top:0;font-size:11px;line-height:1.5}.runtime-hint code{padding:2px 4px;border-radius:5px;background:#ffffffb8;font-size:10px}

/* Desktop layout: use the available width for member navigation and history editing. */
@media (min-width: 1024px) {
  .login-wrap { width: min(460px, calc(100% - 48px)); margin-top: 11vh; }
  .dashboard { max-width: 1500px; padding: 0 clamp(32px, 4vw, 64px) 42px; }
  .topbar { height: 80px; }
  .page-intro { padding: 38px 0 24px; align-items: center; }
  .page-intro h1 { font-size: 30px; letter-spacing: -.8px; }
  .page-intro .muted { font-size: 13px; }
  .page-intro .button { min-width: 112px; }
  .stats-grid { gap: 16px; margin-bottom: 20px; }
  .stat-card { min-height: 96px; padding: 18px 22px; border-radius: 18px; box-shadow: 0 8px 24px #1f1c2108; }
  .stat-card span { font-size: 11px; }
  .stat-card strong { margin-top: 8px; font-size: 27px; }
  .workspace { grid-template-columns: minmax(280px, 320px) minmax(0, 1fr); gap: 18px; }
  .member-panel { top: 18px; max-height: calc(100vh - 36px); padding: 20px; border-radius: 20px; }
  .member-list { min-height: 0; flex: 1; align-content: start; }
  .panel-heading h2 { font-size: 17px; }
  .search-box { height: 44px; }
  .search-box input { font-size: 12px; }
  .member-list { gap: 7px; }
  .member-row { padding: 12px 10px; }
  .mini-avatar { width: 38px; height: 38px; }
  .member-copy strong { font-size: 12px; }
  .member-copy span { font-size: 10px; }
  .history-panel { min-height: 560px; padding: 24px 26px; border-radius: 20px; }
  .detail-heading { gap: 15px; padding-bottom: 20px; }
  .avatar { width: 54px; height: 54px; font-size: 19px; }
  .detail-heading h2 { font-size: 19px; }
  .detail-identity .muted { font-size: 12px; }
  .detail-summary { gap: 12px; padding: 18px 0; }
  .detail-summary > div { padding: 12px 15px; border-radius: 13px; background: var(--low); }
  .detail-summary span { font-size: 10px; }
  .detail-summary strong { margin-top: 6px; font-size: 16px; }
  .history-layout { grid-template-columns: minmax(220px, 270px) minmax(0, 1fr); gap: 18px; padding-top: 22px; }
  .subheading h3 { font-size: 13px; }
  .history-list { max-height: calc(100vh - 390px); min-height: 210px; gap: 7px; }
  .history-day { min-height: 44px; padding: 11px 13px; border-radius: 12px; }
  .history-day span { font-size: 11px; }
  .history-day strong { font-size: 12px; }
  .day-editor { padding: 20px; border-radius: 17px; }
  .editor-head h3 { font-size: 15px; }
  .editor-head p { font-size: 11px; }
  .editor-score strong { font-size: 25px; }
  .food-row { padding: 11px 5px; }
  .food-info strong { font-size: 11px; }
  .food-info span { font-size: 10px; }
  .save-row { margin-top: 18px; }
  .save-row .button { min-height: 40px; padding: 0 17px; }
}

@media (min-width: 1440px) {
  .workspace { grid-template-columns: 340px minmax(0, 1fr); gap: 22px; }
  .member-panel { padding: 22px; }
  .history-panel { padding: 28px 32px; }
  .history-layout { grid-template-columns: minmax(240px, 300px) minmax(0, 1fr); gap: 22px; }
}

.account-security { margin: 15px 0 3px; padding: 17px 18px; border: 1px solid var(--border); border-radius: 16px; background: var(--low); }
.security-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.security-heading .eyebrow { margin-bottom: 3px; }
.security-heading h3 { margin: 0; font-size: 13px; }
.access-pill { padding: 6px 10px; border-radius: 999px; background: #e9f2eb; color: #3c6946; font-size: 10px; font-weight: 700; }
.access-pill.disabled { background: var(--red-pale); color: #87585d; }
.security-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(220px, .65fr); gap: 18px; margin-top: 14px; }
.security-label { display: block; margin-bottom: 7px; color: var(--muted); font-size: 10px; font-weight: 700; }
.password-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 7px; }
.password-fields input,.add-admin-form input { min-width: 0; height: 39px; padding: 0 10px; border: 1px solid var(--border); border-radius: 10px; outline: none; background: white; color: var(--text); font-size: 11px; }
.password-fields input:focus,.add-admin-form input:focus { border-color: var(--blue); box-shadow: 0 0 0 3px #697a911f; }
.password-fields .button,.access-actions .button { min-height: 39px; font-size: 10px; }
.access-actions { display: flex; flex-wrap: wrap; align-content: start; gap: 7px; }
.access-actions .security-label { flex-basis: 100%; margin-bottom: 0; }
.button.danger-button { background: var(--red-pale); color: #87585d; }
.security-footnote { margin: 11px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.admin-dialog { width: min(650px, calc(100% - 32px)); max-height: min(86vh, 850px); padding: 25px; border: 1px solid var(--border); border-radius: 20px; background: var(--surface); color: var(--text); box-shadow: 0 24px 80px #1f1c2130; }
.admin-dialog::backdrop { background: #1f1c216e; backdrop-filter: blur(3px); }
.admin-dialog h2 { margin: 0; font-size: 22px; letter-spacing: -.5px; }
.dialog-close-row { display: flex; justify-content: flex-end; margin: -11px -11px 10px; }
.dialog-description { margin: 8px 0 18px; font-size: 11px; line-height: 1.6; }
.add-admin-form { margin: 0 0 18px; padding: 14px; border: 1px solid var(--border); border-radius: 14px; background: var(--low); }
.add-admin-form label { display: block; margin-bottom: 7px; color: var(--muted); font-size: 10px; font-weight: 700; }
.add-admin-form > div { display: flex; gap: 8px; }
.add-admin-form input { flex: 1; }
.add-admin-form .message { margin-bottom: 0; }
.dialog-footer { display: flex; justify-content: flex-end; margin-top: 18px; }
.confirm-dialog { width: min(450px, calc(100% - 32px)); }
.confirm-dialog .dialog-footer { gap: 8px; }
.confirm-dialog #confirm-action.danger-button { background: var(--red); color: white; }
@media (max-width: 850px) { .security-grid { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .password-fields { grid-template-columns: 1fr; } .add-admin-form > div { align-items: stretch; flex-direction: column; } .admin-dialog { padding: 19px; } }

/* Give the desktop sign-in screen a balanced, two-column composition. */
@media (min-width: 1024px) {
  .login-wrap {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(380px, 460px);
    grid-template-rows: 54px auto auto auto auto;
    grid-template-areas:
      "brand form"
      "eyebrow form"
      "title form"
      "copy form"
      "hint form";
    align-content: center;
    align-items: start;
    column-gap: clamp(56px, 9vw, 140px);
    row-gap: 0;
    width: min(1120px, calc(100% - 96px));
    min-height: 100vh;
    margin: 0 auto;
  }
  .login-wrap > .brand-mark { grid-area: brand; align-self: end; margin-bottom: 20px; }
  .login-wrap > .eyebrow { grid-area: eyebrow; align-self: end; margin: 0 0 12px; }
  .login-wrap > h1 { grid-area: title; align-self: end; font-size: clamp(38px, 4.2vw, 54px); letter-spacing: -1.8px; }
  .login-wrap > .login-copy { grid-area: copy; align-self: start; max-width: 440px; margin: 12px 0 20px; font-size: 15px; line-height: 1.65; }
  .login-wrap > .runtime-hint { grid-area: hint; align-self: start; max-width: 480px; }
  .login-wrap > .login-card { grid-area: form; align-self: center; padding: 30px; border-radius: 22px; box-shadow: 0 18px 50px #28242a10; }
  .login-card input { height: 50px; margin-bottom: 19px; padding: 0 14px; border-radius: 13px; }
  .login-card label { font-size: 13px; }
  .login-card .button { min-height: 48px; font-size: 13px; }
}

@media (min-width: 1440px) {
  .dashboard { max-width: 1600px; }
  .topbar { height: 84px; }
  .workspace { grid-template-columns: 350px minmax(0, 1fr); }
  .member-panel { max-height: calc(100vh - 132px); }
  .history-panel { min-height: 620px; }
  .history-list { max-height: calc(100vh - 410px); }
}

@media (min-width: 1024px) {
  .profile-name-input { display: block; width: min(100%, 390px); padding: 2px 0; border: 0; border-bottom: 1px solid transparent; outline: 0; background: transparent; color: var(--text); font-size: 19px; line-height: 1.4; font-weight: 700; letter-spacing: -.3px; }
  .profile-name-input:focus { border-bottom-color: var(--blue); }
  .editor-controls { display: grid; grid-template-columns: minmax(150px, .8fr) minmax(190px, 1.2fr); gap: 12px; margin: 18px 0 13px; }
  .editor-field { display: grid; gap: 6px; min-width: 0; color: var(--muted); font-size: 10px; font-weight: 700; }
  .editor-field input,.editor-field select { width: 100%; min-width: 0; height: 40px; padding: 0 10px; border: 1px solid var(--border); border-radius: 10px; outline: 0; background: var(--surface); color: var(--text); font-family: inherit; font-size: 11px; font-weight: 500; }
  .editor-field input:focus,.editor-field select:focus,.profile-name-input:focus { box-shadow: 0 0 0 3px #697a911f; }
  .status-note { margin: 12px 0; padding: 11px 13px; border: 1px solid var(--border); border-radius: 11px; background: var(--blue-pale); color: var(--muted); font-size: 11px; line-height: 1.5; }
  .items-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 17px 0 8px; }
  .items-heading h4 { margin: 0; color: var(--text); font-size: 12px; }
  .items-heading span,.empty-items { color: var(--muted); font-size: 10px; }
  .admin-slot { margin-top: 10px; padding: 13px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface); }
  .admin-slot-head { display: grid; grid-template-columns: minmax(0,1fr) minmax(95px,.45fr); gap: 8px; align-items: center; margin-bottom: 8px; }
  .admin-slot-head input,.admin-food-row input:not([type=checkbox]) { height: 35px; min-width: 0; padding: 0 8px; border: 1px solid var(--border); border-radius: 8px; outline: 0; background: var(--low); color: var(--text); font-size: 10px; }
  .admin-slot-head .slot-title-input { font-weight: 700; }
  .admin-food-row { display: grid; grid-template-columns: 20px minmax(100px,1fr) minmax(54px,.34fr) minmax(52px,.34fr); gap: 7px; align-items: center; padding: 7px 0; border-top: 1px solid var(--border); }
  .admin-food-row .food-name,.admin-food-row .food-amount,.admin-food-row .food-unit { overflow:hidden; color:var(--text); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
  .admin-food-row .food-amount,.admin-food-row .food-unit { color:var(--muted); }
  .admin-food-row input[type=checkbox] { width: 15px; height: 15px; accent-color: var(--text); }
  .admin-food-row input:focus,.admin-slot-head input:focus { border-color: var(--blue); box-shadow: 0 0 0 2px #697a9118; }
  .icon-button { display: grid; place-items: center; width: 28px; height: 28px; border: 0; border-radius: 8px; background: var(--low); color: var(--muted); font-size: 17px; }
  .icon-button.danger:hover { background: var(--red-pale); color: var(--red); }
  .empty-items { padding: 10px 0; }
  .button.small { min-height: 32px; padding: 0 10px; font-size: 10px; }
  .add-food { margin-top: 5px; }
  .add-slot { margin-top: 12px; }
  .history-day span { display: grid; gap: 3px; }
  .history-day small { color: var(--muted); font-size: 9px; }
}

@media (min-width: 1024px) and (max-width: 1279px) {
  .history-layout { grid-template-columns: minmax(175px, .58fr) minmax(0, 1fr); }
  .admin-food-row { grid-template-columns: 18px minmax(84px,1fr) 48px 48px; gap: 5px; }
  .editor-controls { grid-template-columns: 1fr 1fr; }
}

/* Final compact member-workspace overrides (kept after the base desktop rules). */
@media (min-width: 1024px) {
  .detail-summary { padding: 10px 0; }
  .history-layout { grid-template-columns: minmax(0,1fr); gap: 10px; padding-top: 13px; }
  .history-list { display: flex; gap: 7px; max-height: none; min-height: 0; padding: 2px 1px 6px; overflow-x: auto; overflow-y: hidden; }
  .history-day { flex: 0 0 154px; min-width: 0; min-height: 52px; padding: 8px 10px; }
  .history-day span { gap: 2px; }
  .history-day small { white-space: nowrap; }
  .day-editor { padding: 15px 17px; }
  .editor-head { margin-bottom: 8px; }
  .progress-track { margin-bottom: 9px; }
  .editor-controls { grid-template-columns: minmax(150px,.7fr) minmax(190px,1fr); gap: 9px; margin: 11px 0 9px; }
  .editor-field input,.editor-field select { height: 36px; }
  .items-heading { margin: 11px 0 7px; }
  .slot-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; align-items: start; }
  .admin-slot { min-width: 0; margin: 0; padding: 9px; border-radius: 11px; }
  .admin-slot-head { grid-template-columns: minmax(0,1fr) minmax(75px,.45fr); gap: 5px; margin-bottom: 5px; }
  .admin-slot-head input,.admin-food-row input:not([type=checkbox]) { height: 31px; padding: 0 6px; font-size: 9px; }
  .admin-food-row { grid-template-columns: 17px minmax(68px,1fr) 46px 43px; gap: 4px; padding: 4px 0; }
  .admin-food-row input[type=checkbox] { width: 13px; height: 13px; }
  .add-food { min-height: 27px!important; }
  .add-slot { margin-top: 8px; }
  .save-row { margin-top: 10px; padding-top: 9px; }
  .account-security { margin: 10px 0 0; padding: 0; border-radius: 13px; }
  .account-security > summary { padding: 9px 12px; cursor: pointer; list-style: none; }
  .account-security > summary::-webkit-details-marker { display: none; }
  .account-security .security-grid,.account-security .security-footnote { margin: 0 12px 10px; }
  .account-security .security-grid { padding-top: 8px; border-top: 1px solid var(--border); }
  .security-chevron { margin-left: auto; color: var(--muted); font-size: 14px; transition: transform .15s ease; }
  .account-security[open] .security-chevron { transform: rotate(180deg); }
}

@media (min-width: 1024px) and (max-width: 1279px) {
  .history-day { flex-basis: 140px; }
  .admin-food-row { grid-template-columns: 15px minmax(60px,1fr) 40px 38px; gap: 3px; }
}

@media (max-width: 1023px) {
  .account-security > summary { cursor: pointer; list-style: none; }
  .account-security > summary::-webkit-details-marker { display: none; }
  .history-list { display: flex; gap: 7px; overflow-x: auto; overflow-y: hidden; max-height: none; min-height: 0; padding: 2px 1px 6px; }
  .history-day { flex: 0 0 148px; }
  .slot-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; align-items: start; }
  .admin-slot { margin: 0; }
  .security-chevron { margin-left: auto; }
  .account-security[open] .security-chevron { transform: rotate(180deg); }
}

@media (max-width: 650px) {
  .history-layout { grid-template-columns: 1fr; }
  .history-day { flex-basis: 135px; }
  .slot-grid { grid-template-columns: 1fr; }
}

/* Account governance and revision controls. */
.member-row-end { display:flex; flex-direction:column; align-items:flex-end; gap:4px; flex:0 0 auto; }
.account-state-mini { display:inline-block; padding:4px 8px; border:1px solid var(--border); border-radius:999px; background:var(--low); color:var(--muted); font-size:8px; line-height:1.2; text-transform:uppercase; letter-spacing:.35px; }
.account-state-mini.active { border-color:#d7e3da; background:#eef5ef; color:#42624a; }
.account-state-mini.disabled { border-color:#eadcc4; background:var(--amber-pale); color:#815f31; }
.account-state-mini.deleted { border-color:#ecd4d6; background:var(--red-pale); color:var(--red); }
.permission-choice { display:flex!important; align-items:center; gap:8px; margin:0!important; color:var(--muted)!important; font-size:11px!important; font-weight:600!important; }
.permission-choice input { width:15px; height:15px; margin:0; accent-color:var(--text); }
.day-editor-top > #enable-day-edit { margin-top:10px; }
.day-editor input:disabled,.day-editor select:disabled { opacity:.8; color:var(--muted); }
#deleted-account-note { margin:14px 0; padding:12px 14px; border:1px solid #e0c3c3; background:#f8eded; color:#794848; font-size:11px; }
@media (max-width:1080px) {
  .admin-access-row { grid-template-columns:1fr; }
  .admin-row-actions { padding-top:2px; }
}

/* StepUp app theme and shared calendar/profile components. */
:root { --outline-soft:#c6c1c9; --amber:#b68b49; --amber-pale:#fbf3e4; --primary-pale:#f8f7f9; }
.account-state-mini { display:inline-block; padding:3px 7px; border:1px solid var(--border); border-radius:999px; background:var(--low); color:var(--muted); font-size:8px; line-height:1.2; text-transform:uppercase; letter-spacing:.35px; }
.account-state-mini.active { border-color:#d7e3da; background:#eef5ef; color:#42624a; }
.account-state-mini.disabled { border-color:#eadcc4; background:var(--amberPale,#fbf3e4); color:#815f31; }
.account-state-mini.deleted { border-color:#ecd4d6; background:var(--red-pale); color:var(--red); }
.admin-access-row { display:grid; grid-template-columns:minmax(180px,.7fr) minmax(280px,1.1fr) minmax(190px,.8fr); align-items:center; gap:12px; padding:12px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); }
.admin-access-identity { min-width:0; }
.admin-permissions { display:grid; grid-template-columns:1fr 1fr; gap:7px 12px; }
.permission-choice { display:flex!important; align-items:center; gap:8px; margin:0!important; color:var(--muted)!important; font-size:11px!important; font-weight:600!important; }
.permission-choice input { width:15px; height:15px; margin:0; accent-color:var(--text); }
.admin-row-actions { display:flex; flex-wrap:wrap; gap:6px; }
.admin-row-actions .button { min-height:32px; padding:0 9px; font-size:9px; }
.admin-access-row .muted { font-size:10px; }
.day-editor-top > #enable-day-edit { margin:10px 0 0; }
.day-editor input:disabled,.day-editor select:disabled { opacity:.8; color:var(--muted); }
#deleted-account-note { margin:14px 0; padding:12px 14px; border:1px solid #ecd4d6; border-radius:var(--radius); background:var(--red-pale); color:var(--red); font-size:11px; }
.avatar-photo-wrap { position:relative; overflow:hidden; }
.avatar-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:50%; }
.calendar-panel { margin-top:14px; padding:16px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); box-shadow:0 5px 18px #28242a0a; }
.calendar-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-bottom:12px; border-bottom:1px solid var(--border); }
.calendar-heading h2 { margin:0; font-size:16px; }
.calendar-heading .eyebrow { margin-bottom:3px; }
.calendar-heading .muted { margin:4px 0 0; font-size:11px; }
.calendar-navigation { display:flex; align-items:center; gap:9px; }
.calendar-navigation strong { min-width:140px; text-align:center; font-size:13px; }
.calendar-navigation .button { min-width:34px; min-height:34px; padding:0; font-size:18px; }
.calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:6px; }
.calendar-weekdays { padding:10px 0 5px; color:var(--outline); text-align:center; font-size:9px; font-weight:700; letter-spacing:.55px; }
#member-calendar { grid-auto-rows:minmax(72px,auto); }
.calendar-cell { display:flex; flex-direction:column; align-items:flex-start; min-width:0; padding:8px; border:1px solid var(--border); border-radius:12px; background:var(--low); color:var(--text); text-align:left; }
button.calendar-cell { cursor:pointer; }
button.calendar-cell:hover { border-color:var(--blue); background:var(--blue-pale); }
.calendar-cell.outside { border-color:transparent; background:transparent; }
.calendar-cell.tracked { border-left:3px solid var(--blue); background:var(--blue-pale); }
.calendar-cell.tracked.high { border-left-color:var(--text); background:var(--primary-pale,#f8f7f9); }
.calendar-cell.zero { border-left:3px solid var(--amber); background:var(--amber-pale); }
.calendar-cell.unlogged { border-left:3px solid var(--red); background:var(--red-pale); }
.calendar-cell.today { outline:2px solid var(--text); outline-offset:-2px; }
.calendar-day-number { font-size:11px; font-weight:700; }
.calendar-cell strong { margin-top:auto; font-size:12px; }
.calendar-cell small { max-width:100%; overflow:hidden; margin-top:2px; color:var(--muted); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.calendar-legend { display:flex; flex-wrap:wrap; gap:16px; padding-top:11px; border-top:1px solid var(--border); color:var(--muted); font-size:10px; }
.calendar-legend span { display:flex; align-items:center; gap:6px; }
.legend-dot { width:9px; height:9px; border:1px solid var(--outline-soft,#c6c1c9); border-radius:50%; background:var(--low); }
.legend-dot.tracked { border-color:var(--blue); background:var(--blue-pale); }
.legend-dot.zero { border-color:var(--amber); background:var(--amber-pale); }
.legend-dot.unlogged { border-color:var(--red); background:var(--red-pale); }
.day-page-heading { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:16px; padding-bottom:14px; border-bottom:1px solid var(--border); }
.day-page-heading h2 { margin:0; font-size:19px; }
.day-page-heading .eyebrow { margin-bottom:4px; }
.day-page-heading .muted { margin:4px 0 0; font-size:11px; }
.status-pill { padding:6px 10px; border:1px solid var(--border); border-radius:999px; background:var(--blue-pale); color:var(--text); font-size:10px; font-weight:700; white-space:nowrap; }
.day-editor { margin-top:14px; padding:16px; border-radius:var(--radius); background:var(--low); }
.day-editor-top { padding:12px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); }
.day-editor-top .editor-head { margin:0 0 8px; }
.day-editor-top .editor-head h3 { font-size:14px; }
.progress-summary { display:flex; align-items:baseline; justify-content:space-between; gap:2px; margin:7px 0 3px; }
.progress-count { color:var(--muted); font-size:9px; white-space:nowrap; }
.progress-percent { color:var(--text); font-size:14px; font-weight:700; line-height:1; }
.day-editor-top .progress-track { width:100%; height:7px; margin:0; }
.day-editor-top .progress-fill { background:var(--text); }
.editor-controls { margin:10px 0; }
.day-items-panel { margin-top:11px; }
.day-items-scroll { max-height:calc(100vh - 475px); min-height:210px; overflow:auto; padding:9px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); }
.day-items-scroll .slot-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; align-items:start; }
.day-items-scroll .admin-slot { border-color:var(--border); background:var(--surface); }
.blank-day-message { min-height:90px; display:grid; place-items:center; padding:16px; border:1px dashed var(--outline-soft,#c6c1c9); border-radius:var(--radius); background:var(--surface); color:var(--muted); font-size:11px; text-align:center; }
.save-row { position:sticky; bottom:0; z-index:1; margin:0; padding:11px 0 0; border-top:1px solid var(--border); background:var(--low); }
.account-security { border-color:var(--border); background:var(--low); }
.password-disclosure { width:100%; }
.password-disclosure > summary { display:inline-flex; align-items:center; min-height:36px; padding:0 12px; cursor:pointer; list-style:none; }
.password-disclosure > summary::-webkit-details-marker { display:none; }
.password-form { margin-top:10px; }
.password-section .security-footnote { margin-top:7px; }
.access-actions { padding-top:2px; border-left:1px solid var(--border); padding-left:15px; }
@media (min-width:1024px) {
  .dashboard { max-width:1600px; }
  .workspace { grid-template-columns:minmax(280px,340px) minmax(0,1fr); gap:18px; }
  .member-panel { top:10px; max-height:calc(100vh - 20px); }
  .history-panel { min-height:680px; padding:20px; }
  .detail-summary { padding:12px 0; }
  .detail-summary > div { padding:10px 12px; border:1px solid var(--border); border-radius:var(--radius); background:var(--low); }
  .account-security { padding:13px; }
  .account-security > summary { padding:6px 4px; }
  .security-grid { grid-template-columns:minmax(0,1.3fr) minmax(220px,.7fr); gap:13px; margin-top:10px; }
  #member-calendar { grid-auto-rows:minmax(75px,auto); }
  .day-items-scroll { max-height:calc(100vh - 430px); }
}
@media (max-width:1023px) {
  #member-calendar { grid-auto-rows:minmax(60px,auto); }
  .day-items-scroll { max-height:55vh; }
  .day-items-scroll .slot-grid { grid-template-columns:1fr; }
  .day-page-heading { grid-template-columns:auto minmax(0,1fr); }
  .day-page-heading .status-pill { grid-column:2; justify-self:start; }
}
/* Dashboard-first layout using StepUp's rounded cards and charcoal palette. */
.admin-nav { display:flex; align-items:center; gap:8px; padding:16px 0 0; border-bottom:1px solid var(--border); }
.admin-nav-item { display:inline-flex; align-items:center; gap:9px; min-height:42px; padding:0 14px; border:0; border-bottom:2px solid transparent; background:transparent; color:var(--muted); font-size:12px; font-weight:700; }
.admin-nav-item.active { border-bottom-color:var(--text); color:var(--text); }
.admin-page { min-width:0; }
.dashboard-stats { grid-template-columns:minmax(180px,.55fr); align-items:stretch; }
.dashboard-stats .stat-card { min-height:78px; }
.dashboard-search { height:46px; margin:13px 0; padding:0 11px; border-radius:var(--radius); background:var(--low); box-shadow:none; }
.dashboard-search input { font-size:12px; }
.dashboard-grid { display:grid; grid-template-columns:minmax(260px,.75fr) minmax(420px,1.25fr); gap:18px; align-items:start; }
.dashboard-grid > .panel { min-height:220px; }
.admin-profile-card h2 { margin:17px 0 0; font-size:17px; overflow-wrap:anywhere; }
.admin-profile-card .muted { margin:6px 0 20px; font-size:11px; }
.admin-profile-card > .button { min-width:100px; }
.dashboard-admin-list { display:grid; gap:8px; max-height:380px; overflow:auto; margin:0; }
.dashboard-admin-row { display:flex; align-items:center; gap:11px; width:100%; padding:11px 12px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); color:var(--text); text-align:left; box-shadow:0 5px 18px #28242a0a; }
.dashboard-admin-row:hover,.dashboard-admin-row:focus-visible { border-color:var(--outline-soft); background:var(--primary-pale); outline:none; }
.dashboard-admin-row > span:last-child { min-width:0; }
.dashboard-admin-copy { min-width:0; flex:1; }
.dashboard-admin-copy strong,.dashboard-admin-copy small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dashboard-admin-row strong { font-size:11px; }
.dashboard-admin-row small { margin-top:3px; color:var(--muted); font-size:9px; }
.dashboard-admin-open { color:var(--text); font-size:10px; font-weight:700; white-space:nowrap; }
.admin-account-status { display:flex; justify-content:space-between; gap:12px; padding:12px 14px; border-radius:var(--radius); background:var(--low); font-size:11px; }
.admin-account-status span { color:var(--muted); }
.admin-account-status strong { color:var(--text); }
.admin-account-status strong.disabled { color:var(--red); }
.admin-account-permissions { margin-top:15px; padding:14px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); }
.admin-account-permissions h3 { margin:0 0 12px; font-size:13px; }
.admin-account-permissions #admin-account-permission-list { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.admin-account-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:8px; margin-top:16px; }
.button.danger-button { background:var(--red-pale); color:var(--red); }
.button.danger-button:hover { background:#f4e2e4; }
.dashboard .page-intro { padding-top:27px; }
.dashboard .page-intro h1 { font-size:26px; }
@media (min-width:1024px) {
  .dashboard { max-width:1600px; }
  .dashboard-grid { gap:18px; }
  .dashboard-grid > .panel { padding:22px; }
  .dashboard-admin-list { max-height:380px; }
}
@media (max-width:760px) {
  .dashboard-stats,.dashboard-grid { grid-template-columns:1fr; }
  .admin-account-permissions #admin-account-permission-list { grid-template-columns:1fr; }
  .admin-nav-item { padding:0 10px; }
}

.detail-summary { grid-template-columns: minmax(0,1fr); }
.mobile-back { display:none; }
/* Android-first layout: one task per screen, compact app-shaped cards. */
@media (max-width: 760px) {
  body { min-width: 320px; }
  .dashboard { width: 100%; max-width: 560px; margin: 0 auto; padding: 0 16px calc(18px + env(safe-area-inset-bottom)); }
  .topbar { height: 58px; }
  .brand-lockup { gap: 9px; }
  .brand-mark.small { width: 34px; height: 34px; border-radius: 10px; }
  .brand-lockup strong { font-size: 12px; }
  .brand-lockup span { font-size: 9px; }
  .top-actions { gap: 4px; }
  .top-actions .button { min-height: 38px; padding: 0 8px; font-size: 11px; }
  .admin-nav { position: sticky; top: 0; z-index: 3; gap: 4px; margin: 0 -16px; padding: 7px 16px 0; background: var(--bg); }
  .admin-nav-item { flex: 1; justify-content: center; min-height: 42px; gap: 6px; padding: 0 8px; font-size: 11px; }
  .count-pill { padding: 4px 7px; font-size: 9px; }
  .page-intro { align-items: center; gap: 10px; padding: 18px 0 14px; }
  .page-intro h1 { font-size: 22px; letter-spacing: -.45px; }
  .page-intro .eyebrow { font-size: 9px; letter-spacing: .9px; }
  .page-intro .muted { max-width: 270px; margin-top: 5px; font-size: 11px; line-height: 1.45; }
  .page-intro .button { flex: 0 0 auto; min-height: 40px; padding: 0 10px; font-size: 10px; }
  .stats-grid { grid-template-columns: 1fr; gap: 8px; margin-bottom: 10px; }
  .stat-card,.panel,.login-card,.calendar-panel,.day-editor,.account-security,.admin-dialog,.add-admin-form,.admin-account-permissions { border-radius: 12px; }
  .stat-card { min-height: 0; padding: 13px 14px; box-shadow: none; }
  .stat-card span { font-size: 10px; }
  .stat-card strong { margin-top: 4px; font-size: 22px; }
  .dashboard-grid { grid-template-columns: minmax(0,1fr); gap: 10px; }
  .dashboard-grid > .panel { min-height: 0; padding: 14px; }
  .admin-profile-card h2 { margin-top: 7px; font-size: 15px; overflow-wrap: anywhere; }
  .admin-profile-card .muted { margin: 4px 0 0; font-size: 10px; }
  .panel-heading { gap: 8px; }
  .panel-heading h2 { font-size: 14px; }
  .dashboard-admin-list { max-height: none; gap: 6px; margin-top: 0; }
  .dashboard-admin-row { gap: 9px; padding: 10px; border-radius: 10px; box-shadow: none; }
  .dashboard-admin-row strong { font-size: 11px; }
  .dashboard-admin-row small { font-size: 9px; }
  .dashboard-search { height: 44px; margin: 13px 0; border-radius: 10px; }
  .dashboard-search input { min-width: 0; font-size: 10px; }
  .dashboard-search .button { flex: 0 0 auto; min-height: 32px; padding: 0 9px; }
  .workspace { display: block; }
  #users-page .page-intro { padding-top: 17px; }
  #users-page.member-open > .page-intro { display: none; }
  .member-panel,.history-panel { position: static; max-height: none; min-height: 0; padding: 14px; border-radius: 12px; box-shadow: none; }
  .member-panel { display: flex; }
  .workspace:not(.has-member) .history-panel { display: none; }
  .workspace.has-member .member-panel { display: none; }
  .workspace.has-member .history-panel { display: block; }
  .panel-heading { gap: 8px; }
  .search-box { height: 44px; margin: 11px 0 9px; padding: 0 10px; border-radius: 10px; }
  .search-box input { font-size: 12px; }
  .member-list { overflow: visible; gap: 5px; padding: 0; }
  .member-row { min-height: 58px; gap: 10px; padding: 9px 8px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); }
  .member-row.selected { border-color: var(--blue); background: var(--blue-pale); }
  .mini-avatar { width: 38px; height: 38px; font-size: 12px; }
  .member-copy strong { font-size: 11px; }
  .member-copy span { font-size: 9px; }
  .member-progress { font-size: 10px; }
  .account-state-mini { padding: 3px 6px; font-size: 7px; }
  .empty-detail { min-height: 0; }
  .detail-heading { align-items: center; gap: 10px; padding: 2px 0 12px; }
  .avatar { width: 44px; height: 44px; font-size: 16px; }
  .detail-identity .eyebrow { margin-bottom: 2px; font-size: 8px; }
  .profile-name-input { width: 100%; min-width: 0; padding: 0; border: 0; outline: 0; background: transparent; color: var(--text); font-size: 15px; line-height: 1.35; font-weight: 700; }
  .profile-name-input:focus { box-shadow: 0 0 0 2px #697a911f; }
  .detail-identity .muted { margin-top: 3px; font-size: 10px; overflow-wrap: anywhere; }
  .id-pill { flex: 0 0 auto; padding: 5px 7px; font-size: 9px; }
  .detail-summary { gap: 6px; padding: 10px 0; }
  .detail-summary > div { min-width: 0; }
  .detail-summary span { font-size: 8px; line-height: 1.3; }
  .detail-summary strong { margin-top: 4px; font-size: 13px; }
  .mobile-back { display: inline-flex; align-items: center; gap: 6px; min-height: 38px; margin: 0 0 10px; padding: 0 10px; border-radius: 9px; font-size: 11px; }
  .calendar-panel { margin-top: 10px; padding: 12px; box-shadow: none; }
  .calendar-heading { align-items: flex-start; flex-direction: column; gap: 9px; padding-bottom: 9px; }
  .calendar-heading h2 { font-size: 14px; }
  .calendar-heading .muted { margin-top: 3px; font-size: 9px; }
  .calendar-navigation { width: 100%; justify-content: space-between; gap: 6px; }
  .calendar-navigation strong { min-width: 0; font-size: 12px; }
  .calendar-navigation .button { min-width: 36px; min-height: 36px; border-radius: 9px; }
  .calendar-grid { gap: 3px; }
  .calendar-weekdays { padding: 8px 0 4px; font-size: 8px; letter-spacing: .2px; }
  #member-calendar { grid-auto-rows: minmax(48px,auto); }
  .calendar-cell { justify-content: space-between; padding: 5px 4px; border-radius: 8px; }
  .calendar-day-number { font-size: 9px; }
  .calendar-cell strong { font-size: 10px; }
  .calendar-cell small { font-size: 7px; }
  .calendar-legend { gap: 7px 11px; padding-top: 9px; font-size: 8px; }
  .legend-dot { width: 7px; height: 7px; }
  .account-security { margin: 10px 0 0; padding: 0; }
  .account-security > summary { min-height: 54px; padding: 10px; }
  .security-heading h3 { font-size: 12px; }
  .security-heading .eyebrow { font-size: 8px; }
  .access-pill { padding: 5px 8px; font-size: 9px; }
  .security-grid { grid-template-columns: minmax(0,1fr); gap: 12px; margin: 0; padding: 10px; border-top: 1px solid var(--border); }
  .password-fields { grid-template-columns: minmax(0,1fr); gap: 7px; }
  .password-fields input,.add-admin-form input { height: 42px; font-size: 12px; }
  .password-fields .button,.access-actions .button { min-height: 42px; font-size: 11px; }
  .access-actions { padding: 10px 0 0; border-top: 1px solid var(--border); border-left: 0; }
  .day-page-heading { grid-template-columns: minmax(0,1fr) auto; gap: 8px; padding-bottom: 10px; }
  .day-page-heading > #back-to-calendar { grid-column: 1 / -1; justify-self: start; margin: 0; }
  .day-page-heading h2 { font-size: 16px; }
  .day-page-heading .eyebrow { margin-bottom: 2px; font-size: 8px; }
  .day-page-heading .muted { margin-top: 3px; font-size: 9px; overflow-wrap: anywhere; }
  .status-pill { padding: 5px 8px; font-size: 9px; }
  .day-editor { margin-top: 10px; padding: 10px; border: 1px solid var(--border); background: var(--low); }
  .day-editor-top { padding: 10px; border-radius: 10px; }
  .day-editor-top .editor-head h3 { font-size: 12px; }
  .day-items-scroll { max-height: 48dvh; min-height: 150px; padding: 7px; border-radius: 10px; }
  .day-items-scroll .slot-grid { grid-template-columns: minmax(0,1fr); gap: 7px; }
  .admin-slot { padding: 9px; border-radius: 10px; }
  .admin-slot-head { grid-template-columns: minmax(0,1fr) minmax(72px,.45fr); }
  .admin-slot-head input,.admin-food-row input:not([type=checkbox]) { height: 38px; font-size: 11px; }
  .admin-food-row { grid-template-columns: 20px minmax(0,1fr) 54px 48px; gap: 5px; padding: 6px 0; }
  .admin-food-row .food-name,.admin-food-row .food-amount,.admin-food-row .food-unit { font-size: 9px; }
  .admin-food-row input[type=checkbox] { width: 17px; height: 17px; }
  .save-row { position: sticky; bottom: 0; z-index: 2; margin: 8px -10px -10px; padding: 9px 10px calc(9px + env(safe-area-inset-bottom)); background: var(--low); }
  .save-row .button { min-height: 42px; }
  .admin-dialog { width: calc(100% - 28px); max-height: 88dvh; padding: 16px; box-shadow: 0 14px 48px #1f1c2130; }
  .admin-dialog h2 { font-size: 18px; }
  .admin-account-status { border-radius: 9px; }
  .admin-account-permissions { padding: 11px; }
  .admin-account-permissions #admin-account-permission-list { grid-template-columns: minmax(0,1fr); }
  .admin-account-actions { justify-content: stretch; gap: 6px; }
  .admin-account-actions .button { flex: 1 1 100%; min-height: 40px; }
  .add-admin-form { padding: 10px; }
  .add-admin-form > div { flex-direction: column; }
  .add-admin-form .button { min-height: 42px; }
  .footer-note { padding: 11px 2px 0; font-size: 9px; }
}

/* Account access is a compact status header with clearly separated actions. */
.account-security { overflow: hidden; padding: 0; border-radius: 12px; background: var(--surface); }
.account-security > .security-heading { min-height: 62px; padding: 11px 12px; cursor: pointer; list-style: none; }
.account-security > .security-heading::-webkit-details-marker { display: none; }
.security-title { min-width: 0; }
.security-title .eyebrow { margin-bottom: 3px; }
.security-heading h3 { font-size: 13px; }
.account-security > .security-heading > .security-chevron { flex: 0 0 auto; margin-left: 2px; }
.access-pill { flex: 0 0 auto; padding: 5px 9px; border: 1px solid #dce8df; border-radius: 8px; background: #eef5ef; color: #42624a; }
.access-pill.disabled { border-color: #ecd4d6; background: var(--red-pale); color: #87585d; }
.access-pill.deleted { border-color: var(--border); background: var(--low); color: var(--muted); }
.security-grid { grid-template-columns: minmax(0,1fr); gap: 9px; margin: 0; padding: 0 11px 11px; }
.access-card { min-width: 0; padding: 11px; border: 1px solid var(--border); border-radius: 10px; background: var(--low); }
.access-card-heading { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; }
.access-card-heading h4 { margin: 0; color: var(--text); font-size: 11px; }
.access-card-heading p { margin: 3px 0 0; color: var(--muted); font-size: 9px; line-height: 1.4; }
.password-disclosure { width: 100%; }
.password-disclosure > summary { display: flex; width: 100%; min-height: 40px; align-items: center; justify-content: space-between; gap: 8px; padding: 0 10px; border-radius: 8px; cursor: pointer; list-style: none; font-size: 10px; }
.password-disclosure > summary::-webkit-details-marker { display: none; }
.password-disclosure[open] > summary { margin-bottom: 10px; }
.password-disclosure .security-chevron { margin-left: auto; color: var(--muted); transition: transform .15s ease; }
.password-disclosure[open] .security-chevron { transform: rotate(180deg); }
.password-fields { grid-template-columns: minmax(0,1fr); gap: 7px; }
.password-fields input { height: 42px; background: var(--surface); font-size: 11px; }
.password-fields .button { min-height: 42px; font-size: 10px; }
.security-footnote { margin: 8px 0 0; font-size: 9px; }
.access-actions { display: block; padding: 11px; border: 1px solid var(--border); border-radius: 10px; background: var(--low); }
.access-actions .access-card-heading { margin-bottom: 10px; }
.access-action-buttons { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }
.access-action-buttons .button { min-width: 0; min-height: 40px; padding: 0 8px; font-size: 9px; }
.access-action-buttons .danger-button { border: 1px solid #ecd4d6; }
.account-security { margin-top: 13px; border-radius: 7px; background: var(--surface); box-shadow: none; }
.account-security > .security-heading { min-height: 66px; padding: 13px 15px; cursor: pointer; list-style: none; }
.account-security > .security-heading::-webkit-details-marker { display: none; }
.security-title .eyebrow { margin-bottom: 4px; font-size: 8px; letter-spacing: .9px; }
.security-heading h3 { font-size: 12px; font-weight: 600; }
.security-title { flex: 1; }
.security-header-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; }
.security-heading > .security-title { flex: 1; min-width: 0; }
.security-heading > .security-title h3 { line-height: 1.3; }
.access-pill { padding: 5px 8px; border-color: var(--border); border-radius: 5px; background: var(--blue-pale); color: var(--text); font-size: 9px; }
.access-pill.disabled { background: var(--red-pale); color: #87585d; }
.security-grid { gap: 14px; padding: 14px 14px 15px; }
.access-card,.access-actions { padding: 13px; border: 1px solid var(--border); border-radius: 6px; background: var(--low); }
.password-section { border-bottom: 1px solid var(--border); }
.access-card-heading { margin-bottom: 13px; }
.access-card-heading h4 { font-size: 12px; font-weight: 700; }
.access-card-heading p { margin-top: 4px; font-size: 10px; }
.password-disclosure > summary { min-height: 44px; padding: 0 12px; border: 1px solid #d9dfe8; border-radius: 6px; background: var(--blue-pale); font-size: 11px; }
.password-disclosure[open] > summary { margin-bottom: 16px; }
.password-form { margin-top: 0; padding-top: 4px; }
.security-label { margin-bottom: 6px; font-size: 10px; }
.password-fields { gap: 8px; }
.password-fields input { border-radius: 6px; }
.password-fields .button { border-radius: 6px; }
.security-footnote { margin: 10px 0 0; line-height: 1.5; }
.access-actions .access-card-heading { margin-bottom: 13px; }
.access-action-buttons { gap: 10px; }
.access-action-buttons .button { min-height: 44px; border-radius: 6px; font-size: 10px; }
.access-action-buttons .danger-button { border-color: #ecd4d6; }
#account-security[open] .password-disclosure:not([open]) .security-chevron { transform: none; }
#member-calendar-panel { margin-top: 14px; }

/* Match the StepUp app's charcoal primary and soft neutral tint. */
:root { --primary-tint: #E9E7EC; --primary-ink: #1F1C21; }
.button.secondary { background: var(--primary-tint); color: var(--primary-ink); }
.account-security { border-color: var(--border); background: var(--surface); }
.access-card,.access-actions { background: var(--primary-pale); }
.access-pill { border-color: var(--border); background: var(--primary-tint); color: var(--primary-ink); }
.access-pill.disabled { border-color: #ecd4d6; background: var(--red-pale); color: #87585d; }
.access-pill.deleted { border-color: var(--border); background: var(--low); color: var(--muted); }
.password-disclosure > summary { border-color: var(--border); background: var(--primary-tint); color: var(--primary-ink); }
.password-disclosure > summary .security-chevron { color: var(--muted); }
.access-action-buttons .button.secondary { background: var(--primary-tint); color: var(--primary-ink); }
.password-fields input:focus { border-color: var(--primary-ink); box-shadow: 0 0 0 2px #1f1c2118; }

/* Apply the StepUp charcoal-and-tint palette across the admin website. */
:root {
  --text: #1F1C21;
  --primary-ink: #1F1C21;
  --blue: #1F1C21;
  --low: #E9E7EC;
  --medium: #E9E7EC;
  --border: #E9E7EC;
  --blue-pale: #E9E7EC;
  --primary-pale: #E9E7EC;
  --primary-tint: #E9E7EC;
}
/* Keep rounding very selective: only a few top-level surfaces. */
*, *::before, *::after { border-radius: 0 !important; }
.panel,.calendar-panel,.account-security { border-radius: 12px !important; }
#refresh,#refresh-users { border-radius: 2.5px !important; }
.dashboard-search,.member-panel > .search-box { border-radius: 2.5px !important; }
#admin-account-dialog .button,#admin-account-dialog .icon-button { border-radius: 2px !important; }
#detail-id,#account-state-pill { border-radius: 1.8px !important; }
#password-details > summary,#toggle-account-access,#delete-account { border-radius: 2px !important; }
.calendar-cell,.calendar-weekdays,.calendar-navigation .button { border-radius: .5px !important; }
#back-to-members,#back-to-calendar { display: grid; place-items: center; width: 40px; height: 40px; min-width: 40px; min-height: 40px; padding: 0; border: 0; border-radius: 0 !important; background: transparent; color: var(--text); box-shadow: none; }
#back-to-members span,#back-to-calendar span { font-size: 27px; font-weight: 800; line-height: 1; }
.avatar,.mini-avatar,.avatar-photo { border-radius: 50% !important; }

/* Daily record controls and saved meal rows need explicit compact-phone layout. */
@media (max-width:650px) {
  .editor-controls { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; margin:12px 0; }
  .editor-field { display:grid; gap:5px; min-width:0; color:var(--muted); font-size:10px; font-weight:700; }
  .editor-field input,.editor-field select { display:block; width:100%; min-width:0; height:40px; padding:0 10px; border:1px solid var(--border); background:var(--surface); color:var(--text); font-family:inherit; font-size:11px; font-weight:500; }
  .admin-slot-head { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:baseline; margin-bottom:8px; }
  .admin-slot-head strong { min-width:0; font-size:11px; line-height:1.35; overflow-wrap:anywhere; }
  .admin-slot-head span { color:var(--muted); font-size:9px; white-space:nowrap; }
  .admin-food-row { display:grid; grid-template-columns:20px minmax(0,1fr) 54px 48px; gap:6px; align-items:center; padding:8px 0; }
  .admin-food-row .food-name,.admin-food-row .food-amount,.admin-food-row .food-unit { min-width:0; overflow:hidden; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
  .admin-food-row input[type=checkbox] { width:17px; height:17px; margin:0; }
  .admin-food-row input:not([type=checkbox]) { width:100%; min-width:0; height:34px; padding:0 5px; }
}
.editor-controls { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; max-width:320px; margin:12px 0; }
.custom-status-picker { position:relative; width:100%; }
.custom-status-picker .custom-status-trigger:disabled { opacity:.6; cursor:default; }
.custom-status-option.selected::after { content:'✓'; float:right; margin-left:8px; font-weight:700; }
.custom-status-trigger { display:flex; width:100%; min-height:40px; align-items:center; justify-content:space-between; gap:12px; padding:0 10px; border:1px solid var(--border); background:var(--surface); color:var(--text); font:500 11px/1.3 "Plus Jakarta Sans",system-ui,sans-serif; text-align:left; cursor:pointer; }
.custom-status-chevron { color:var(--muted); font-size:14px; transition:transform .15s ease; }
.custom-status-trigger[aria-expanded="true"] .custom-status-chevron { transform:rotate(180deg); }
.custom-status-menu { position:absolute; top:calc(100% + 3px); left:0; z-index:20; width:100%; overflow:hidden; border:1px solid #d7d4da; background:var(--surface); box-shadow:0 6px 16px #1f1c2126; }
.custom-status-option { display:block; width:100%; min-height:38px; padding:8px 10px; border:0; background:var(--surface); color:var(--text); font:500 11px/1.3 "Plus Jakarta Sans",system-ui,sans-serif; text-align:left; cursor:pointer; }
.custom-status-option:hover,.custom-status-option.selected { background:var(--primary-tint); color:var(--primary-ink); }
.custom-status-option:focus-visible,.custom-status-trigger:focus-visible { outline:2px solid var(--primary-ink); outline-offset:-2px; }

/* Lift expanded access controls from the surrounding tint so the sections read separately. */
.account-security { background: var(--surface); box-shadow: 0 2px 9px #1f1c210c; }
.account-security[open] { background: var(--primary-tint); box-shadow: 0 4px 14px #1f1c2118; }
.account-security > .security-heading { background: var(--surface); }
.security-grid { background: var(--primary-tint); }
.access-card,.access-actions { border-color: #d7d4da; background: var(--surface); box-shadow: 0 2px 8px #1f1c2112; }
.password-disclosure > summary { border-color: #d7d4da; background: var(--primary-tint); box-shadow: 0 1px 4px #1f1c2110; }
.password-disclosure[open] { padding: 0 10px 10px; border: 1px solid #e1dee4; background: var(--surface); box-shadow: 0 2px 8px #1f1c2112; }
.password-disclosure[open] > summary { margin: 0 -10px 12px; padding: 0 10px; }

/* Saved meals share the same readable layout at every viewport width. */
.day-items-panel .items-heading { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:6px 12px; margin:16px 0 10px; }
.day-items-panel .items-heading h4 { margin:0; color:var(--text); font-size:13px; line-height:1.4; }
.day-items-panel .items-heading > span { color:var(--muted); font-size:11px; }
.day-items-panel .day-items-scroll { padding:10px; background:var(--bg); scrollbar-gutter:stable; overscroll-behavior:contain; }
.day-items-scroll .slot-grid { grid-template-columns:minmax(0,1fr); gap:12px; }
.day-items-scroll .admin-slot { min-width:0; margin:0; padding:0 12px; border:1px solid var(--border); background:var(--surface); }
.day-items-scroll .admin-slot-head { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:4px 12px; margin:0; padding:12px 0; border-bottom:1px solid var(--border); }
.day-items-scroll .admin-slot-head strong { min-width:0; color:var(--text); font-size:13px; line-height:1.4; overflow-wrap:anywhere; }
.day-items-scroll .admin-slot-head > span { color:var(--muted); font-size:11px; line-height:1.4; white-space:nowrap; }
.day-items-scroll .admin-food-row { display:grid; grid-template-columns:18px minmax(0,1fr) minmax(0,auto); align-items:center; gap:10px; min-height:44px; margin:0; padding:10px 0; border:0; border-bottom:1px solid var(--border); }
.day-items-scroll .admin-food-row:last-child { border-bottom:0; }
.day-items-scroll .admin-food-row .food-name { min-width:0; overflow:visible; color:var(--text); font-size:12px; line-height:1.5; white-space:normal; overflow-wrap:anywhere; }
.day-items-scroll .food-quantity { max-width:90px; color:var(--muted); font-size:11px; line-height:1.5; text-align:right; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.day-items-scroll .admin-food-row input[type=checkbox] { width:18px; height:18px; margin:0; accent-color:var(--text); }
.day-items-scroll .admin-food-row:has(input:enabled) { cursor:pointer; }
.day-items-scroll .admin-food-row:has(input:focus-visible) { outline:2px solid var(--text); outline-offset:2px; }
.day-items-scroll .empty-items { padding:12px 0; color:var(--muted); font-size:11px; }

/* Daily Record: one vertical reading order with consistent spacing. */
#day-detail-page .day-page-heading { display:flex; flex-direction:column; align-items:stretch; gap:12px; padding:0 0 20px; border-bottom:1px solid var(--border); }
#day-detail-page #back-to-calendar { align-self:flex-start; margin:0 0 0 -8px; }
#day-detail-page .day-page-heading .eyebrow { margin:0 0 6px; font-size:10px; }
#day-detail-page .day-page-heading h2 { margin:0; font-size:20px; line-height:1.35; overflow-wrap:anywhere; }
#day-detail-page .day-page-heading .muted { margin:8px 0 0; font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
#day-detail-page .day-editor { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; margin:20px 0 0; padding:0; border:0; background:transparent; }
#day-detail-page .day-editor-top { padding:16px; border:1px solid var(--border); background:var(--surface); }
#day-progress-title { margin:0 0 16px; font-size:14px; line-height:1.4; }
#day-detail-page .progress-summary { gap:12px; margin:0 0 8px; }
#day-detail-page .progress-count { font-size:12px; }
#day-detail-page .progress-percent { font-size:18px; }
#day-detail-page .progress-track { height:7px; }
#day-detail-page .day-status-section { min-width:0; }
#day-detail-page .editor-controls { width:100%; max-width:none; margin:0; }
#day-detail-page .editor-field { display:grid; min-width:0; gap:8px; color:var(--text); font-size:13px; font-weight:600; }
#day-detail-page .custom-status-trigger { min-height:44px; padding:0 12px; font-size:13px; }
#day-detail-page .custom-status-option { min-height:44px; padding:12px; font-size:13px; }
#day-detail-page #enable-day-edit { width:100%; min-height:44px; margin:12px 0 0; font-size:12px; }
#day-detail-page .day-items-panel { min-width:0; margin:0; }
#day-detail-page .items-heading { margin:0 0 12px; }
#day-detail-page .items-heading h4 { font-size:14px; }
#day-detail-page .day-items-scroll { min-height:0; max-height:48dvh; padding:10px; border:1px solid var(--border); background:var(--bg); }
#day-detail-page .blank-day-message { min-height:100px; padding:16px; font-size:12px; line-height:1.5; }
#day-detail-page .save-row { position:sticky; bottom:0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.5fr); gap:12px; margin:0; padding:14px 0 calc(10px + env(safe-area-inset-bottom)); border-top:1px solid var(--border); background:var(--surface); }
#day-detail-page .save-row .button { width:100%; min-height:44px; padding:0 12px; font-size:12px; }
#day-detail-page .save-row .button.ghost { border:1px solid var(--border); }

/* Use the same StepUp runner logo as the mobile app in the admin shell. */
.brand-mark {
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 0;
  background: transparent;
  box-shadow: none;
}
.brand-mark img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.brand-mark.small {
  padding: 0;
  background: transparent;
  box-shadow: none;
}