/* Iron Barbell — SET UP MY WEEK / TRAINING WEEK flow styles (.sflow).
   Ported 1:1 from mockups/week-setup (Rev B) + mockups/training-week-setup.
   Scoped: .sflow = overlay root · .sflow.nut = nutrition · .sflow.trn = training.
   Door cards (.sflow-cta) sit on the tab itself, outside the overlay. */
.sflow{position:absolute;inset:0;z-index:80;display:flex;flex-direction:column;background:var(--app-bg,#F4F6F8);color:var(--app-fg,#12161A);font-family:var(--font-body,Inter,system-ui,sans-serif);--sky:#6AA4F4;--turf:#1E9E62;--turf-deep:#15794A;--turf-tint:#E4F5EC;--forge:#D9A21B;--forge-deep:#8A6410;--forge-tint:#FBF2DC;--rust:#C4392E;--rust-deep:#93261D;--rust-tint:#FAE9E7;--app-sunk:var(--app-surface-sunk,#EAEEF2);--ease:cubic-bezier(0.2,0.7,0.2,1)}
.sflow *{box-sizing:border-box}
.sflow button{font-family:inherit;cursor:pointer}
.sflow .sc{position:absolute;inset:0;display:flex;flex-direction:column;background:var(--app-bg,#F4F6F8)}
.sflow .abar{flex:0 0 auto;background:var(--iron,#0A0A0A);color:#fff;padding:30px 16px 13px;display:flex;align-items:flex-start;gap:10px}
.sflow .abar .eb{font-weight:800;font-size:8.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--sky)}
.sflow .abar .ti{font-family:var(--font-cond);font-weight:900;font-size:25px;letter-spacing:.03em;text-transform:uppercase;line-height:1;margin-top:4px}
.sflow .abar .sk{margin-left:auto;font-family:var(--font-cond);font-weight:900;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--silver,#9A9A9A);background:none;border:none;padding:4px 0}
.sflow .bod{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;position:relative}
.sflow .strip{background:var(--app-surface,#fff);border-bottom:1px solid var(--app-border);padding:11px 14px 12px;display:flex;align-items:center;gap:10px;flex:0 0 auto}
.sflow .strip .l{flex:1 1 auto}
.sflow .strip .l .a{font-family:var(--font-cond);font-weight:900;font-size:15px;letter-spacing:.02em;text-transform:uppercase;line-height:1}
.sflow .strip .l .b{font-size:11.5px;color:var(--app-fg-muted);margin-top:4px;line-height:1.4}
.sflow .pill{flex:0 0 auto;font-family:var(--font-mono);font-size:10px;letter-spacing:.04em;color:var(--electric);background:#EAF2FD;border:1px solid #CFE0F7;border-radius:999px;padding:5px 9px}
.sflow .pill.warn{color:var(--forge-deep);background:var(--forge-tint);border-color:#EDDCA8}
.sflow .ctrls{display:flex;gap:7px;padding:10px 14px 4px;flex:0 0 auto}
.sflow .ctrl{flex:1 1 0;display:flex;align-items:center;gap:7px;background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:5px;padding:9px 10px;min-height:44px;text-align:left}
.sflow .ctrl.on{border-color:var(--electric);background:#F1F7FE}
.sflow .ctrl:hover{border-color:var(--app-border-strong)}
.sflow .ctrl svg{width:15px;height:15px;flex:0 0 auto;color:var(--app-fg-subtle)}
.sflow .ctrl.on svg{color:var(--electric)}
.sflow .ctrl .t{font-family:var(--font-cond);font-weight:900;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--app-fg);line-height:1.05}
.sflow .ctrl.on .t{color:var(--electric-deep,#044399)}
.sflow .sw{margin-left:auto;flex:0 0 auto;width:30px;height:17px;border-radius:999px;background:var(--app-border-strong);position:relative;transition:background 120ms var(--ease)}
.sflow .sw::after{content:"";position:absolute;top:2px;left:2px;width:13px;height:13px;border-radius:50%;background:#fff;transition:transform 120ms var(--ease)}
.sflow .ctrl.on .sw{background:var(--electric)}.sflow .ctrl.on .sw::after{transform:translateX(13px)}
.sflow .gwrap{padding:10px 14px 14px}
.sflow .ghead,.sflow .grow{display:grid;gap:5px;margin-bottom:5px}
.sflow.nut .ghead,.sflow.nut .grow{grid-template-columns:30px repeat(3,1fr)}
.sflow.trn .ghead,.sflow.trn .grow{grid-template-columns:34px repeat(4,1fr)}
.sflow.nut .ghead .sl{display:flex;align-items:center;justify-content:center;gap:4px;background:none;border:none;padding:5px 0 4px;font-family:var(--font-cond);font-weight:900;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--app-fg-muted)}
.sflow.nut .ghead .sl svg{width:11px;height:11px;color:var(--app-fg-subtle)}
.sflow.nut .ghead .sl:hover{color:var(--electric)}.sflow.nut .ghead .sl:hover svg{color:var(--electric)}
.sflow.trn .ghead .sl{background:none;border:none;padding:4px 0 5px;display:flex;flex-direction:column;align-items:center;gap:3px;border-bottom:2px solid var(--app-border)}
.sflow.trn .ghead .sl .h{font-family:var(--font-cond);font-weight:900;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--app-fg);line-height:1}
.sflow.trn .ghead .sl .c{font-family:var(--font-mono);font-size:9px;color:var(--app-fg-subtle);letter-spacing:.03em}
.sflow.trn .ghead .sl.hit .c{color:var(--turf-deep)}
.sflow.trn .ghead .sl.over .c{color:var(--forge-deep)}
.sflow.trn .ghead .sl[data-t="crossfit"]{border-bottom-color:var(--t-crossfit,#075DC6)}
.sflow.trn .ghead .sl[data-t="zone2"]{border-bottom-color:var(--t-zone2,#2C7A88)}
.sflow.trn .ghead .sl[data-t="focus"]{border-bottom-color:var(--t-focus,#B0730C)}
.sflow.trn .ghead .sl[data-t="contrast"]{border-bottom-color:var(--t-contrast,#5B5E8C)}
.sflow .dlab{background:none;border:none;border-right:1px solid var(--app-border);padding:0 4px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.sflow .dlab .d{font-family:var(--font-cond);font-weight:900;font-size:12px;letter-spacing:.03em;text-transform:uppercase;color:var(--app-fg);line-height:1}
.sflow .dlab .n{font-family:var(--font-mono);font-size:8.5px;color:var(--app-fg-subtle)}
.sflow .dlab.today .d{color:var(--electric)}
.sflow .dlab.rest .d{color:var(--app-fg-subtle)}
.sflow.nut .cell{position:relative;background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:5px;padding:7px 7px 6px;min-height:60px;display:flex;flex-direction:column;gap:4px;text-align:left;overflow:hidden}
.sflow.nut .cell .nm{font-family:var(--font-cond);font-weight:900;font-size:11.5px;line-height:1.1;letter-spacing:.02em;text-transform:uppercase;color:var(--app-fg);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.sflow.nut .cell .mk{margin-top:auto;display:flex;align-items:center;gap:3px;font-family:var(--font-mono);font-size:8px;letter-spacing:.04em;text-transform:uppercase;color:var(--app-fg-subtle)}
.sflow.nut .cell .mk svg{width:9px;height:9px}
.sflow.nut .cell.you{border-color:var(--electric);box-shadow:inset 2px 0 0 var(--electric)}
.sflow.nut .cell.you .mk{color:var(--electric)}
.sflow.nut .cell.rep{background:var(--app-sunk);border-style:dashed}
.sflow.nut .cell.rep .nm{color:var(--app-fg-muted)}
/* v5.4 — the food pen is BLUE. A leftover marker in the nut grid is food, and
   food is written in blue everywhere since 5.1 (amber stays the missed measure). */
.sflow.nut .cell.rep .mk{color:var(--electric-deep,#044399)}
.sflow.nut .cell.out{background:var(--app-sunk)}
.sflow.nut .cell.out .nm,.sflow.nut .cell.out .mk{color:var(--app-fg-muted)}
.sflow.nut .cell.mt{border-style:dashed;border-color:var(--app-border-strong);background:none;align-items:center;justify-content:center}
.sflow.nut .cell.mt svg{width:16px;height:16px;color:var(--app-fg-subtle)}
.sflow.trn .cell{position:relative;background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:5px;padding:6px 5px;min-height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center;overflow:hidden}
.sflow.trn .cell .tm{font-family:var(--font-cond);font-weight:900;font-size:13px;letter-spacing:.01em;text-transform:uppercase;color:var(--app-fg);line-height:1}
.sflow.trn .cell .mk{font-family:var(--font-mono);font-size:7.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--app-fg-subtle);line-height:1.2;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sflow.trn .cell.off{border-style:dashed;border-color:var(--app-border-strong);background:none}
.sflow.trn .cell.off svg{width:14px;height:14px;color:var(--app-fg-subtle)}
.sflow.trn .cell.na{background:var(--app-sunk);border-color:var(--app-sunk);pointer-events:none}
.sflow.trn .cell.na .tm{font-family:var(--font-mono);font-size:11px;color:var(--app-fg-subtle);font-weight:400}
.sflow.trn .cell.on{box-shadow:inset 3px 0 0 var(--c);border-color:var(--c2);background:var(--bg)}
.sflow.trn .cell.on .tm{color:var(--c)}
.sflow.trn .cell.on[data-t="crossfit"]{--c:var(--t-crossfit,#075DC6);--c2:#B9D3F1;--bg:#EDF4FD}
.sflow.trn .cell.on[data-t="zone2"]{--c:var(--t-zone2,#2C7A88);--c2:#B6D3D8;--bg:#EDF5F6}
.sflow.trn .cell.on[data-t="focus"]{--c:var(--t-focus,#B0730C);--c2:#E5D0A6;--bg:#FBF5E9}
.sflow.trn .cell.on[data-t="contrast"]{--c:var(--t-contrast,#5B5E8C);--c2:#C7C8DA;--bg:#F1F1F7}
.sflow .cell.hi{animation:sfpop 260ms var(--ease)}
@keyframes sfpop{0%{transform:scale(.92)}100%{transform:scale(1)}}
.sflow.trn .cell.flag::after{content:"";position:absolute;top:3px;right:3px;width:6px;height:6px;border-radius:50%;background:var(--rust)}
.sflow .legend{display:flex;flex-wrap:wrap;gap:10px;padding:4px 2px 0;margin-top:2px}
.sflow .legend span{display:flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:8.5px;letter-spacing:.03em;text-transform:uppercase;color:var(--app-fg-subtle)}
.sflow .legend i{width:9px;height:9px;border:1px solid var(--app-border-strong);border-radius:2px;background:#fff;display:block}
.sflow .legend i.you{border-color:var(--electric);background:var(--electric)}
.sflow .legend i.rep{border-style:dashed;background:var(--app-sunk)}
.sflow .legend i.solid{border-style:solid;background:var(--app-sunk)}
.sflow .legend i.mt{border-style:dashed;background:none}
.sflow.trn .legend i{border:none}
.sflow .warnbar{display:flex;align-items:center;gap:9px;margin:9px 0 0;background:var(--rust-tint);border:1px solid #EFC9C4;border-left:3px solid var(--rust);border-radius:6px;padding:10px 11px}
.sflow .warnbar>svg{width:16px;height:16px;flex:0 0 auto;color:var(--rust)}
.sflow .warnbar .tx{flex:1 1 auto;font-size:11.5px;line-height:1.45;color:var(--rust-deep)}
.sflow .warnbar .tx b{font-weight:800}
.sflow .warnbar button{flex:0 0 auto;background:var(--rust);border:none;border-radius:4px;color:#fff;font-family:var(--font-cond);font-weight:900;font-size:11px;letter-spacing:.07em;text-transform:uppercase;padding:8px 10px;min-height:34px}
.sflow .foot{flex:0 0 auto;background:var(--app-surface,#fff);border-top:1px solid var(--app-border);padding:11px 14px 16px;padding-bottom:calc(16px + env(safe-area-inset-bottom))}
.sflow .foot .meta{display:flex;align-items:baseline;gap:8px;margin-bottom:9px}
.sflow .foot .meta .a{font-family:var(--font-cond);font-weight:900;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--app-fg)}
.sflow .foot .meta .b{font-family:var(--font-mono);font-size:10px;color:var(--app-fg-muted);margin-left:auto}
.sflow .sbtn{width:100%;min-height:48px;display:flex;align-items:center;justify-content:center;gap:8px;background:var(--electric);color:#fff;border:none;border-radius:5px;font-family:var(--font-cond);font-weight:900;font-size:15px;letter-spacing:.07em;text-transform:uppercase}
.sflow .sbtn[disabled]{background:var(--app-sunk);color:var(--app-fg-subtle);pointer-events:none}
.sflow .sbtn:hover{background:var(--electric-hover,#1C77E0)}.sflow .sbtn:active{background:var(--electric-deep,#044399);transform:translateY(1px)}
.sflow .sbtn svg{width:16px;height:16px}
.sflow .sbtn.gho{background:none;color:var(--app-fg-muted);border:1px solid var(--app-border);min-height:42px;font-size:12.5px}
.sflow .sbtn.gho:hover{background:var(--app-sunk);color:var(--app-fg)}
.sflow .scrim{position:absolute;inset:0;z-index:70;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity 160ms var(--ease)}
.sflow .scrim.on{opacity:1;pointer-events:auto}
.sflow .sheet{position:absolute;left:0;right:0;bottom:0;z-index:71;background:var(--app-bg,#F4F6F8);border-radius:14px 14px 0 0;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 -12px 40px rgba(0,0,0,.4);transform:translateY(101%);transition:transform 220ms var(--ease)}
.sflow.nut .sheet.full{top:5%}
.sflow .sheet.sm{top:auto;max-height:74%}
.sflow.trn .sheet{max-height:78%}
.sflow .sheet.on{transform:none}
.sflow .grab{flex:0 0 auto;height:15px;display:flex;align-items:center;justify-content:center}
.sflow .grab::after{content:"";width:36px;height:4px;border-radius:2px;background:var(--app-border-strong)}
.sflow .stop{flex:0 0 auto;display:flex;align-items:flex-start;gap:10px;padding:8px 14px 11px;background:var(--app-surface,#fff);border-bottom:1px solid var(--app-border)}
.sflow .stop .eb{font-weight:800;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--electric)}
.sflow .stop .ti{font-family:var(--font-cond);font-weight:900;font-size:24px;letter-spacing:.02em;text-transform:uppercase;line-height:1;margin-top:5px}
.sflow .stop .x{margin-left:auto;flex:0 0 auto;width:34px;height:34px;border:1px solid var(--app-border);border-radius:5px;background:var(--app-bg);color:var(--app-fg-muted);font-size:17px;display:flex;align-items:center;justify-content:center}
.sflow .sbod{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch}
.sflow .rowrail{display:flex;flex-wrap:wrap;column-gap:14px;row-gap:2px;padding:10px 14px 8px;background:var(--app-surface,#fff);border-bottom:1px solid var(--app-border)}
.sflow .rowrail button{flex:0 0 auto;background:none;border:none;padding:2px 0 6px;font-family:var(--font-cond);font-weight:900;font-size:13px;letter-spacing:.05em;text-transform:uppercase;color:var(--app-fg-subtle);border-bottom:2px solid transparent;display:flex;align-items:baseline;gap:5px}
.sflow .rowrail button i{font-style:normal;font-family:var(--font-mono);font-size:9px;color:var(--app-fg-subtle)}
.sflow .rowrail button.on{color:var(--app-fg);border-bottom-color:var(--electric)}
.sflow .rowrail button.on i{color:var(--electric)}
.sflow .chips{display:flex;gap:6px;padding:9px 14px;background:var(--app-surface,#fff);border-bottom:1px solid var(--app-border);align-items:center}
.sflow .chips button{background:none;border:1px solid var(--app-border);border-radius:999px;padding:7px 11px;font-family:var(--font-cond);font-weight:900;font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--app-fg-muted);min-height:34px}
.sflow .chips button.on{background:var(--electric);border-color:var(--electric);color:#fff}
.sflow .chips .mine{margin-left:auto}
.sflow .nocook{display:flex;align-items:center;gap:6px;padding:9px 14px;background:var(--app-surface,#fff);border-bottom:1px solid var(--app-border)}
.sflow .nocook .l{margin-right:auto;font-weight:800;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--app-fg-subtle)}
.sflow .nocook button{display:flex;align-items:center;gap:6px;background:var(--app-bg);border:1px solid var(--app-border);border-radius:999px;padding:8px 12px;min-height:36px;font-family:var(--font-cond);font-weight:900;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--app-fg-muted)}
.sflow .nocook button svg{width:13px;height:13px;color:var(--app-fg-subtle)}
.sflow .nocook button:hover{border-color:var(--app-border-strong);color:var(--app-fg)}
.sflow .tiles{padding:10px 14px 16px;display:flex;flex-direction:column;gap:7px}
.sflow.trn .tiles{padding:2px 14px 4px}
.sflow .gl{font-weight:800;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--app-fg-subtle);padding:6px 0 2px}
.sflow.trn .gl,.sflow .sheet .gl.pad{padding:12px 14px 6px}
.sflow .tile{display:flex;align-items:center;gap:10px;background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:6px;padding:11px 12px;min-height:56px;text-align:left;width:100%}
.sflow .tile:hover{border-color:var(--electric)}
.sflow .tile .tx{flex:1 1 auto;min-width:0}
.sflow .tile .n,.sflow .tile .w,.sflow .tile .tx{display:block;min-width:0}
.sflow .tile .n{font-family:var(--font-cond);font-weight:900;font-size:16px;letter-spacing:.02em;text-transform:uppercase;color:var(--app-fg);line-height:1.05}
.sflow .tile .w{font-size:11.5px;color:var(--app-fg-muted);margin-top:3px;line-height:1.4}
.sflow .tile .tg{flex:0 0 auto;display:flex;flex-direction:column;gap:3px;align-items:flex-end}
.sflow .tile .tg em{font-style:normal;font-family:var(--font-mono);font-size:8px;letter-spacing:.05em;text-transform:uppercase;color:var(--app-fg-subtle);border:1px solid var(--app-border);border-radius:3px;padding:2px 4px}
.sflow .tile.cur{border-color:var(--app-border-strong);background:var(--app-sunk)}
.sflow.trn .tile.cur{border-color:var(--electric);background:#EDF4FD}
.sflow .search{flex:0 0 auto;background:var(--app-surface,#fff);border-top:1px solid var(--app-border);padding:10px 14px 14px;display:flex;gap:8px;align-items:center}
.sflow .search input{flex:1 1 auto;min-width:0;border:1px solid var(--app-border);border-radius:5px;background:var(--app-bg);padding:11px 12px;font-size:13.5px;color:var(--app-fg);font-family:inherit}
.sflow .search input:focus{outline:none;border-color:var(--electric)}
.sflow .tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:2px 14px 4px}
.sflow .tgrid button{background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:5px;min-height:48px;font-family:var(--font-cond);font-weight:900;font-size:15px;letter-spacing:.02em;text-transform:uppercase;color:var(--app-fg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.sflow .tgrid button em{font-style:normal;font-family:var(--font-mono);font-size:8px;letter-spacing:.04em;color:var(--app-fg-subtle);text-transform:uppercase}
.sflow .tgrid button:hover{border-color:var(--electric)}
.sflow .tgrid button.cur{border-color:var(--electric);background:#EDF4FD;color:var(--electric-deep,#044399)}
.sflow .tgrid button.wide{grid-column:span 3;flex-direction:row;gap:7px;font-size:14px}
.sflow .srem{padding:8px 14px 4px}
.sflow .rem{width:100%;display:flex;align-items:center;gap:10px;background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:6px;padding:11px 12px;min-height:48px;text-align:left;color:var(--rust-deep)}
.sflow .rem svg{width:15px;height:15px;color:var(--rust)}
.sflow .rem .n{font-family:var(--font-cond);font-weight:900;font-size:14.5px;letter-spacing:.04em;text-transform:uppercase;display:block}
.sflow .menu{position:absolute;z-index:75;left:14px;width:238px;background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:7px;box-shadow:0 12px 40px rgba(0,0,0,.28);padding:5px}
.sflow .menu .h{font-weight:800;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--app-fg-subtle);padding:8px 9px 6px}
.sflow .menu button{width:100%;display:flex;align-items:center;gap:9px;background:none;border:none;border-radius:5px;padding:10px 9px;min-height:44px;font-family:var(--font-cond);font-weight:900;font-size:14px;letter-spacing:.03em;text-transform:uppercase;color:var(--app-fg);text-align:left}
.sflow .menu button:hover{background:var(--app-sunk)}
.sflow .menu button svg{width:15px;height:15px;color:var(--app-fg-subtle);flex:0 0 auto}
.sflow .menu button.bad{color:var(--rust)}.sflow .menu button.bad svg{color:var(--rust)}
.sflow .rev{padding:14px}
.sflow .card{background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:7px;padding:14px;margin-bottom:10px}
.sflow .card .eb{font-weight:800;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--electric)}
.sflow .card h3{font-family:var(--font-cond);font-weight:900;font-size:22px;letter-spacing:.02em;text-transform:uppercase;margin-top:5px;line-height:1}
.sflow .card p{font-size:13px;line-height:1.6;color:var(--app-fg-muted);margin-top:8px;text-wrap:pretty}
.sflow .card.warn{border-left:3px solid var(--forge);background:var(--forge-tint);border-color:#EDDCA8}
.sflow .card.warn .eb{color:var(--forge-deep)}
.sflow .card.built{border-left:3px solid var(--turf)}
.sflow .card.paused{border-left:3px solid var(--forge)}
.sflow .card .mono{font-family:var(--font-mono);font-size:9.5px;color:var(--app-fg-subtle);margin-top:7px;letter-spacing:.02em;text-transform:uppercase}
.sflow .kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--app-border);border:1px solid var(--app-border);border-radius:7px;overflow:hidden;margin-bottom:10px}
.sflow .kpi{background:var(--app-surface,#fff);padding:13px 10px}
.sflow .kpi .v{font-family:var(--font-cond);font-weight:900;font-size:30px;line-height:1;color:var(--app-fg)}
.sflow .kpi .l{font-weight:700;font-size:8.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--app-fg-subtle);margin-top:5px}
.sflow .kpi.acc .v{color:var(--electric)}
.sflow .srow{display:flex;align-items:center;gap:10px;background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:7px;padding:12px 13px;margin-bottom:10px}
.sflow .srow .tx{flex:1 1 auto}
.sflow .srow .tx .a{font-family:var(--font-cond);font-weight:900;font-size:15px;letter-spacing:.03em;text-transform:uppercase;line-height:1}
.sflow .srow .tx .b{font-size:11.5px;color:var(--app-fg-muted);margin-top:3px}
.sflow .step{display:flex;align-items:center;gap:0;flex:0 0 auto;border:1px solid var(--app-border);border-radius:5px;overflow:hidden}
.sflow .step button{width:36px;height:36px;background:var(--app-bg);border:none;font-size:16px;color:var(--app-fg-muted);display:flex;align-items:center;justify-content:center}
.sflow .step .v{width:34px;text-align:center;font-family:var(--font-mono);font-size:13px;font-weight:700}
.sflow .srow.cmp{padding:10px 12px;margin-bottom:6px}
.sflow .srow.cmp .tx .a{font-size:14.5px}
.sflow .srow.cmp .tx .b{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.02em;color:var(--app-fg-subtle);text-transform:uppercase;margin-top:4px;line-height:1.35}
.sflow .srow.cmp .step button{width:32px;height:32px}
.sflow .srow.cmp .step .v{width:30px;font-size:12.5px}
.sflow .srow.one .tx .a{color:var(--app-fg-muted)}
.sflow .mklist{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.sflow .mkrow{display:flex;align-items:center;gap:9px;background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:6px;padding:10px 12px;min-height:46px}
.sflow .mkrow .nm{flex:1 1 auto;font-family:var(--font-cond);font-weight:900;font-size:14.5px;letter-spacing:.02em;text-transform:uppercase;color:var(--app-fg);line-height:1.1}
.sflow .mkrow .ct{font-family:var(--font-mono);font-size:9.5px;color:var(--app-fg-subtle)}
.sflow .mkrow .dot2{flex:0 0 auto;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--app-border-strong);display:flex;align-items:center;justify-content:center}
.sflow .mkrow .dot2 svg{width:11px;height:11px;color:#fff}
.sflow .mkrow.doing .dot2{border-color:var(--electric);border-top-color:transparent;animation:sfspin 700ms linear infinite}
.sflow .mkrow.doing{border-color:var(--electric)}
.sflow .mkrow.done .dot2{background:var(--turf);border-color:var(--turf)}
.sflow .mkrow.done{background:var(--turf-tint);border-color:#CFE9DB}
.sflow .mkrow.done .nm{color:var(--turf-deep)}
/* the build screen sizes REAL recipes now, so a row has two more things to say:
   the macros it landed on (the proof it ran) and the one that couldn't be sized.
   The name column stacks instead of centring once it carries a second line. */
.sflow .mkrow{align-items:center}
.sflow .mkrow .nm{display:flex;flex-direction:column;gap:3px;min-width:0}
.sflow .mkrow .mk-macro{font-family:var(--font-mono);font-size:9.5px;font-weight:400;letter-spacing:.02em;text-transform:none;color:var(--app-fg-muted);line-height:1.3;overflow-wrap:anywhere}
.sflow .mkrow.done .mk-macro{color:var(--turf-deep);opacity:.85}
/* a failure is amber, not red: the week still locked, this one dish needs a tap */
.sflow .mkrow.failed{background:var(--forge-tint,#FBF4E2);border-color:var(--forge,#D8B24A)}
.sflow .mkrow.failed .dot2{background:var(--forge,#D8B24A);border-color:var(--forge,#D8B24A)}
.sflow .mkrow.failed .dot2 svg{color:#fff}
.sflow .mkrow.failed .nm{color:var(--forge-deep,#8a6a00)}
.sflow .mkrow.failed .mk-macro{color:var(--forge-deep,#8a6a00)}
@keyframes sfspin{to{transform:rotate(360deg)}}
.sflow .bar{height:5px;border-radius:3px;background:var(--app-sunk);overflow:hidden;margin-top:12px}
.sflow .bar i{display:block;height:100%;background:var(--electric);border-radius:3px;transition:width 400ms var(--ease)}
.sflow .gen{padding:20px 16px 14px;text-align:center;flex:0 0 auto}
.sflow .gen .big{font-family:var(--font-cond);font-weight:900;font-size:44px;line-height:.95;letter-spacing:.02em;text-transform:uppercase}
.sflow .gen .sub{font-size:13px;line-height:1.6;color:var(--app-fg-muted);margin-top:8px;text-wrap:pretty}
.sflow .gen .mono{font-family:var(--font-mono);font-size:10.5px;color:var(--app-fg-subtle);margin-top:10px;letter-spacing:.03em}
.sflow .done-h{background:var(--iron,#0A0A0A);color:#fff;padding:30px 18px 26px;text-align:center;flex:0 0 auto}
.sflow .done-h .tick{width:52px;height:52px;border-radius:50%;background:var(--turf);display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.sflow .done-h .tick svg{width:26px;height:26px;color:#fff}
.sflow .done-h .eb{font-weight:800;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--sky)}
.sflow .done-h h2{font-family:var(--font-cond);font-weight:900;font-size:34px;letter-spacing:.02em;text-transform:uppercase;line-height:1;margin-top:6px}
.sflow .done-h p{font-size:13px;line-height:1.6;color:#bdbdbd;margin-top:9px}
.sflow .lockrow{display:flex;align-items:center;gap:10px;background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:7px;padding:12px 13px;margin-bottom:10px}
.sflow .lockrow .dot3{flex:0 0 auto;width:22px;height:22px;border-radius:50%;background:var(--turf);display:flex;align-items:center;justify-content:center}
.sflow .lockrow .dot3.off{background:none;border:1.5px solid var(--app-border-strong)}
.sflow .lockrow .dot3 svg{width:12px;height:12px;color:#fff}
.sflow .lockrow .tx .a{font-family:var(--font-cond);font-weight:900;font-size:14.5px;letter-spacing:.03em;text-transform:uppercase;line-height:1;display:block}
.sflow .lockrow .tx .b{font-size:11.5px;color:var(--app-fg-muted);margin-top:3px;display:block}
.sflow .trow{display:flex;align-items:center;gap:10px;background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:6px;padding:11px 12px;margin-bottom:6px}
.sflow .trow .bd{flex:0 0 auto;width:4px;align-self:stretch;border-radius:2px;background:var(--tc)}
.sflow .trow .tx{flex:1 1 auto;min-width:0}
.sflow .trow .tx .a{font-family:var(--font-cond);font-weight:900;font-size:15px;letter-spacing:.03em;text-transform:uppercase;line-height:1;display:block}
.sflow .trow .tx .b{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.02em;text-transform:uppercase;color:var(--app-fg-subtle);margin-top:4px;line-height:1.35;display:block}
.sflow .trow .st{flex:0 0 auto;display:flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--app-fg-subtle);border:1px solid var(--app-border);border-radius:999px;padding:5px 8px}
.sflow .trow .st svg{width:11px;height:11px}
.sflow .trow.ok .st{color:var(--turf-deep);border-color:#CFE9DB;background:var(--turf-tint)}
.sflow .trow.un .st{color:var(--forge-deep);border-color:#EDDCA8;background:var(--forge-tint)}
.sflow .dayline{display:flex;flex-direction:column;gap:5px;margin-top:10px}
.sflow .dl{display:flex;align-items:center;gap:9px;background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:6px;padding:9px 11px;min-height:42px}
.sflow .dl .d{flex:0 0 34px;font-family:var(--font-cond);font-weight:900;font-size:13px;text-transform:uppercase;color:var(--app-fg)}
.sflow .dl .s{flex:1 1 auto;display:flex;flex-wrap:wrap;gap:5px}
.sflow .dl .s em{font-style:normal;display:flex;align-items:center;gap:4px;font-family:var(--font-mono);font-size:9px;letter-spacing:.03em;text-transform:uppercase;color:var(--app-fg-muted);border:1px solid var(--app-border);border-radius:3px;padding:3px 5px}
.sflow .dl .s em i{width:6px;height:6px;border-radius:50%;background:var(--tc);display:block}
.sflow .dl .s .rest{font-family:var(--font-mono);font-size:9px;letter-spacing:.05em;text-transform:uppercase;color:var(--app-fg-subtle)}
.sflow .toast{position:absolute;left:14px;right:14px;bottom:96px;z-index:82;background:var(--iron,#0A0A0A);color:#fff;border-radius:6px;padding:12px 14px;font-size:12.5px;line-height:1.45;opacity:0;transform:translateY(8px);transition:opacity 160ms var(--ease),transform 160ms var(--ease);pointer-events:none}
.sflow .toast.on{opacity:1;transform:none}
.sflow .dnote{font-size:12.5px;line-height:1.55;color:var(--app-fg-muted);padding:2px 0 8px;text-wrap:pretty}
.sflow .reqchips{display:flex;flex-wrap:wrap;gap:6px;padding:2px 0 8px}
.sflow .reqchips button{background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:999px;padding:8px 12px;min-height:36px;font-family:var(--font-cond);font-weight:900;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--app-fg-muted)}
.sflow .reqchips button.on{background:var(--electric);border-color:var(--electric);color:#fff}
.sflow .reqchips button em{font-style:normal;font-family:var(--font-mono);font-size:8px;letter-spacing:.05em;opacity:.8;margin-left:5px}
.sflow .reqline{display:flex;align-items:center;gap:6px;padding:8px 14px;background:var(--app-surface,#fff);border-bottom:1px solid var(--app-border);font-family:var(--font-mono);font-size:9.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--app-fg-muted)}
.sflow .reqline b{color:var(--electric-deep,#044399);font-weight:500}
.sflow .reqline button{margin-left:auto;background:none;border:none;font-family:var(--font-cond);font-weight:900;font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--electric)}
.sflow .hrow{display:flex;align-items:center;gap:11px;background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:7px;padding:12px 13px;margin-bottom:8px}
.sflow .hrow .av{flex:0 0 auto;width:38px;height:38px;border-radius:50%;background:var(--iron,#0A0A0A);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-cond);font-weight:900;font-size:17px}
.sflow .hrow .tx{flex:1 1 auto;min-width:0}
.sflow .hrow .tx .a{font-family:var(--font-cond);font-weight:900;font-size:16px;letter-spacing:.03em;text-transform:uppercase;line-height:1}
.sflow .hrow .tx .b{font-family:var(--font-mono);font-size:9px;color:var(--app-fg-muted);margin-top:4px;letter-spacing:.02em}
.sflow .bdg{flex:0 0 auto;font-family:var(--font-mono);font-size:9px;letter-spacing:.05em;text-transform:uppercase;border-radius:999px;padding:4px 8px;border:1px solid #CFE0F7;background:#EAF2FD;color:var(--electric)}
.sflow .bdg.turf{border-color:#CFE9DB;background:var(--turf-tint);color:var(--turf-deep)}
.sflow .forbar{display:flex;align-items:center;gap:10px;margin:10px 14px 0;padding:10px 12px;background:var(--app-surface,#fff);border:1px solid var(--app-border);border-left:3px solid var(--electric);border-radius:6px;flex:0 0 auto}
.sflow .forbar .ft{flex:1 1 auto;min-width:0}
.sflow .forbar .fe{display:block;font-weight:800;font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--app-fg-subtle)}
.sflow .forbar .fv{display:block;font-family:var(--font-cond);font-weight:900;font-size:15px;letter-spacing:.03em;text-transform:uppercase;color:var(--app-fg);margin-top:2px;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sflow .forbar .fchips{display:flex;gap:6px;flex:0 0 auto}
.sflow .forbar .fchips button{background:var(--app-bg);border:1px solid var(--app-border-strong);border-radius:999px;padding:8px 12px;min-height:36px;font-family:var(--font-cond);font-weight:900;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--app-fg-muted)}
.sflow .forbar .fchips button.on{background:var(--electric);border-color:var(--electric);color:#fff}
.sflow .forbar .fchips button.me{pointer-events:none}
/* ---- the doors (on the tabs, outside the overlay) ---- */
.sflow-cta{margin:12px 14px 4px;background:var(--iron,#0A0A0A);border-radius:7px;padding:15px 15px 14px;color:#fff;display:flex;align-items:center;gap:12px;text-align:left;width:calc(100% - 28px);border:none;flex:0 0 auto;cursor:pointer}
.sflow-cta .ic{flex:0 0 auto;width:38px;height:38px;border-radius:5px;background:var(--electric);display:flex;align-items:center;justify-content:center}
.sflow-cta .ic svg{width:19px;height:19px;color:#fff}
.sflow-cta .tx{flex:1 1 auto;min-width:0}
.sflow-cta .tx .a{font-family:var(--font-cond);font-weight:900;font-size:17px;letter-spacing:.03em;text-transform:uppercase;line-height:1;display:block}
.sflow-cta .tx .b{font-size:11.5px;color:#b6b6b6;margin-top:4px;line-height:1.4;display:block}
.sflow-cta .ch{margin-left:auto;color:var(--silver,#9A9A9A);font-size:18px;flex:0 0 auto}
.sflow-doorwrap{flex:0 0 auto;background:var(--app-bg,#F4F6F8);padding-bottom:8px}
.ws-host{position:absolute;inset:0;display:flex;flex-direction:column}
.ws-engwrap{flex:1;position:relative}
.ws-engwrap .goals-frame{position:absolute;inset:0}
@media (max-width:540px){.sflow .abar{padding-top:calc(14px + env(safe-area-inset-top))}}

/* An allergy on file, on the picker. Deliberately NOT the same blue as the
   "Respecting ·" line: that one states what the list has been narrowed by, this
   one warns that it has NOT been — the book carries no allergen data yet. Lower
   case and wrapping, because it is a sentence to read, not a chip to glance at. */
.sflow .reqline.warn{text-transform:none;letter-spacing:0;font-family:var(--font-body,Inter,sans-serif);font-size:11px;line-height:1.45;color:var(--forge-deep,#8A6410);background:var(--forge-tint,#FBF2DC);border-bottom:1px solid #EBD9A8;align-items:flex-start}
.sflow .reqline.warn b{color:var(--forge-deep,#8A6410);font-weight:700}

/* The three-across control row overflowed by 2px at 375: `flex:1 1 0` still
   floors at the content's min-content width, and two words plus an icon in a
   condensed face is wider than a third of a narrow phone. min-width:0 lets them
   actually shrink, and the label ellipsises rather than pushing the row wide. */
.sflow .ctrl{min-width:0}
.sflow .ctrl .t{min-width:0;overflow:hidden;text-overflow:ellipsis}

/* ── THE PARTNER'S WEEK (.hhw-*) — the receiving side of the household push.
   Deliberately NOT inside .sflow: this is a section in the app, not a takeover.
   Reads as a gift on the doorstep — who sent it, what's in it, take it or don't. */
.hhw-hero{background:var(--iron,#0F1215);border-radius:12px;padding:18px 16px 15px;color:#fff;margin-bottom:14px}
.hhw-hero .eb{font-family:var(--font-mono,monospace);font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;color:#6AA4F4;margin-bottom:8px}
.hhw-hero .big{font-family:var(--font-cond,'Barlow Condensed',sans-serif);font-weight:900;font-size:30px;line-height:1.02;letter-spacing:.02em;text-transform:uppercase}
.hhw-hero .big .bl{color:#6AA4F4}
.hhw-hero .sub{font-size:12.5px;line-height:1.55;color:#C8C8C8;margin:10px 0 0;text-wrap:pretty}
.hhw-days{display:flex;flex-direction:column;gap:6px}
.hhw-day{display:flex;gap:11px;align-items:flex-start;background:#fff;border:1px solid var(--plate,#DDE3E9);border-radius:9px;padding:11px 12px}
.hhw-day.none{opacity:.55}
.hhw-day .dl{flex:0 0 38px;font-family:var(--font-cond,'Barlow Condensed',sans-serif);font-weight:900;font-size:13px;letter-spacing:.05em;text-transform:uppercase;color:var(--iron,#12161A);padding-top:1px}
.hhw-day .db{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.hhw-day .db.none{font-size:11.5px;color:#8794A1}
.hhw-meal{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.hhw-meal .sl{flex:0 0 auto;font-family:var(--font-mono,monospace);font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:#8794A1}
.hhw-meal .nm{flex:1 1 auto;min-width:0;font-size:12.5px;line-height:1.35;color:var(--iron,#12161A)}
.hhw-meal .tag{flex:0 0 auto;border-radius:999px;padding:2px 7px;background:#E4EEFB;color:#0B4FA8;font-family:var(--font-mono,monospace);font-size:8.5px;letter-spacing:.05em;text-transform:uppercase}
.hhw-note{display:flex;gap:9px;align-items:flex-start;margin-top:13px;padding:11px 12px;background:var(--chalk,#F5F5F5);border-radius:9px;font-size:11.5px;line-height:1.5;color:#5B6672;text-wrap:pretty}
.hhw-note svg{flex:0 0 auto;margin-top:1px;color:#8794A1}
.hhw-foot{display:flex;flex-direction:column;gap:8px;margin-top:16px}

/* WHICH WEEK am I planning — the chip row above the grid controls. Was missing
   entirely: the flow always planned the week you were standing in, which is the
   wrong default on the Saturday you sit down to plan the week ahead. */
.sflow .wkpick{display:flex;gap:6px;padding:10px 14px 0;flex:0 0 auto}
.sflow .wkp{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 6px;background:var(--app-surface,#fff);border:1px solid var(--app-border);border-radius:6px;min-height:44px;justify-content:center}
.sflow .wkp .a{font-family:var(--font-cond,'Barlow Condensed',sans-serif);font-weight:900;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--app-fg,#12161A);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.sflow .wkp .b{font-family:var(--font-mono,monospace);font-size:9px;letter-spacing:.03em;color:var(--app-fg-muted,#8794A1);white-space:nowrap}
.sflow .wkp.on{border-color:var(--sky,#6AA4F4);background:#F0F5FD}
.sflow .wkp.on .a{color:var(--electric-deep,#044399)}