/* RVN Culinary Studio - admin skin v3 ("Pass Teal"). Shared by rvn-maflmxzmnm/index.php and users.php.
   One place for colours: change the --ac-* values (or pick a colour under Settings > Appearance, which sets data-accent).
   Sizes are in rem, so Settings > Appearance > Text size scales everything. Dark only, like the portal. */
:root{
  --rvn-skin:3;
  --ac-h:174;--ac-s:66%;--ac-l:52%;
  --ac:hsl(var(--ac-h) var(--ac-s) var(--ac-l));
  --ac-2:hsl(var(--ac-h) calc(var(--ac-s) + 6%) calc(var(--ac-l) + 16%));
  --ac-d:hsl(var(--ac-h) var(--ac-s) calc(var(--ac-l) - 10%));
  --ac-ink:hsl(var(--ac-h) 70% 6%);
  --ac-bg:hsl(var(--ac-h) var(--ac-s) var(--ac-l) / .11);
  --ac-bg-2:hsl(var(--ac-h) var(--ac-s) var(--ac-l) / .2);
  --ac-line:hsl(var(--ac-h) var(--ac-s) var(--ac-l) / .42);
  --bg:#0a1012;--bg-raise:#0d1517;--surface:#111a1d;--surface-2:#17232a;--surface-3:#1d2d34;--field:#0b1214;
  --line:rgba(176,214,220,.1);--line-2:rgba(176,214,220,.19);
  --text:#edf4f5;--text-2:#bccbce;--muted:#8fa2a6;--faint:#64797e;
  --warn:#f5a524;--warn-2:#ffc766;--warn-bg:rgba(245,165,36,.11);--warn-line:rgba(245,165,36,.42);
  --danger:#f4707a;--danger-bg:rgba(244,112,122,.11);--danger-line:rgba(244,112,122,.45);
  --live:#ff5f5f;--live-bg:rgba(255,95,95,.12);--new:#ff86a6;--new-bg:rgba(255,134,166,.12);
  --r:.875rem;--r-s:.625rem;--r-xs:.4rem;
  --shadow:0 1px 0 rgba(255,255,255,.03) inset,0 10px 30px rgba(0,0,0,.32);
  --font:"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --top-h:3.75rem;--tb-h:4rem;--side-w:17rem;--page-max:112rem;
}
:root[data-accent=blue]{--ac-h:212;--ac-s:90%;--ac-l:65%}
:root[data-accent=green]{--ac-h:146;--ac-s:58%;--ac-l:50%}
:root[data-accent=violet]{--ac-h:266;--ac-s:90%;--ac-l:73%}
:root[data-accent=rose]{--ac-h:344;--ac-s:84%;--ac-l:67%}
html{font-size:100%;color-scheme:dark;scrollbar-width:thin;scrollbar-color:rgba(176,214,220,.22) transparent}
@media(min-width:2200px){html{font-size:112.5%}}
@media(min-width:3000px){html{font-size:131%}}
html[data-size=large]{font-size:112.5%}
@media(min-width:2200px){html[data-size=large]{font-size:125%}}
@media(min-width:3000px){html[data-size=large]{font-size:150%}}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:400 .9375rem/1.5 var(--font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;min-height:100vh;min-height:100dvh}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(70rem 32rem at 8% -12%,hsl(var(--ac-h) 55% 28% / .22),transparent 62%),radial-gradient(48rem 26rem at 104% -4%,rgba(245,158,11,.07),transparent 60%),var(--bg)}
::-webkit-scrollbar{width:.6rem;height:.6rem}::-webkit-scrollbar-thumb{background:rgba(176,214,220,.16);border-radius:1rem;border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:rgba(176,214,220,.3);background-clip:content-box;border:2px solid transparent}::-webkit-scrollbar-track{background:transparent}
a{color:var(--ac-2);text-decoration:none}a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--ac);outline-offset:2px;border-radius:var(--r-xs)}
::selection{background:var(--ac-bg-2)}
h1,h2,h3,h4{margin:0;line-height:1.2;font-weight:650;letter-spacing:-.01em}
h1{font-size:1.65rem}h2{font-size:1.2rem}h3{font-size:1rem}
p{margin:.35em 0}
kbd{font:600 .72rem/1 var(--font);padding:.22rem .4rem;border:1px solid var(--line-2);border-bottom-width:2px;border-radius:.35rem;color:var(--text-2);background:var(--surface-2);white-space:nowrap}
.ico{width:1.25rem;height:1.25rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ico.ico-dots{stroke-width:3.4}
.muted{color:var(--muted)}.warn{color:var(--warn-2)}.grow{flex:1;min-width:0}.nowrap{white-space:nowrap}
.row{display:flex;gap:.5rem;align-items:center}.row.wrap{flex-wrap:wrap}
.stack{display:flex;flex-direction:column;gap:1rem;min-width:0}
.sub{color:var(--muted);margin:.3rem 0 0;font-size:.9rem}.lead{color:var(--text-2);font-size:1.02rem;margin:.4rem 0 0}
[hidden]{display:none!important}

/* ===== layout ===== */
.app{display:grid;grid-template-columns:var(--side-w) minmax(0,1fr);min-height:100vh;min-height:100dvh}
html[data-side=mini] .app{--side-w:4.9rem}
.main{min-width:0;display:flex;flex-direction:column}
.page{width:100%;max-width:var(--page-max);margin:0 auto;padding:1.6rem 2rem 4rem;outline:none;animation:rise .28s ease-out both}
@keyframes rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.pagehead{display:flex;align-items:flex-end;justify-content:space-between;gap:1.25rem;margin-bottom:1.4rem;flex-wrap:wrap}
.ph-t{min-width:0}.ph-a{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.cols-2-1{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:1rem;align-items:start}
.cols-1-1{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;align-items:start}
.cols-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;align-items:start}
.cols-2-3{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:1rem;align-items:start}

/* ===== side menu ===== */
.side{position:sticky;top:0;height:100vh;height:100dvh;display:flex;flex-direction:column;background:var(--bg-raise);border-right:1px solid var(--line);z-index:40;min-width:0}
.side-in{flex:1;min-height:0;overflow-y:auto;padding:1rem .75rem .5rem;scrollbar-width:none}.side-in::-webkit-scrollbar{display:none}
.brand{display:flex;align-items:center;gap:.7rem;padding:.2rem .5rem 1rem;color:var(--text);text-decoration:none!important}
.brand img{width:2.6rem;height:2.6rem;object-fit:contain;flex:none;filter:drop-shadow(0 4px 14px hsl(var(--ac-h) 70% 50% / .25))}
.brand-t{min-width:0;display:flex;flex-direction:column}.brand-t b{font-size:.92rem;letter-spacing:.02em;line-height:1.15;white-space:nowrap}.brand-t small{color:var(--ac-2);font-weight:600;font-size:.72rem;margin-top:.15rem;white-space:nowrap}
.navgrp{display:flex;align-items:center;gap:.5rem;margin:1.1rem .6rem .35rem;color:var(--faint);font-size:.68rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.navi{display:flex;align-items:center;gap:.8rem;min-height:2.6rem;padding:0 .75rem;margin:1px 0;border-radius:var(--r-s);color:var(--text-2);font-weight:560;font-size:.92rem;position:relative;text-decoration:none!important;transition:background .12s,color .12s;cursor:pointer;border:0;background:none;font-family:inherit;width:100%;text-align:left}
.navi .ico{opacity:.8}
.navi:hover{background:var(--surface-2);color:var(--text)}
.navi[aria-current=page]{background:var(--ac-bg);color:var(--ac-2)}.navi[aria-current=page] .ico{opacity:1}
.navi[aria-current=page]::before{content:'';position:absolute;left:-.75rem;top:.55rem;bottom:.55rem;width:3px;border-radius:0 3px 3px 0;background:var(--ac)}
.navi .nl{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.navi.sm{min-height:2.3rem;font-size:.86rem;color:var(--muted)}
.pill{display:inline-flex;align-items:center;gap:.3rem;min-width:1.35rem;height:1.35rem;padding:0 .45rem;border-radius:99px;font-size:.72rem;font-weight:700;line-height:1;background:var(--surface-3);color:var(--text-2);white-space:nowrap;border:1px solid transparent}
.navi .pill.warn{background:var(--warn);color:#241600}.navi .pill:empty{display:none}
.pill.soon{background:transparent;border-color:var(--line-2);color:var(--muted);font-weight:600}
.side-foot{padding:.5rem .75rem .85rem;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.userchip{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:.7rem;padding:.55rem .6rem;margin-top:.35rem;border-radius:var(--r-s);cursor:pointer;background:var(--surface);border:1px solid var(--line)}
.userchip:hover{background:var(--surface-2);border-color:var(--line-2)}.userchip:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
.avatar{width:2.1rem;height:2.1rem;border-radius:50%;display:grid;place-items:center;flex:none;font-weight:700;color:var(--ac-ink);background:linear-gradient(135deg,var(--ac-2),var(--ac-d))}
.uc-t{min-width:0;display:flex;flex-direction:column;line-height:1.2}.uc-t b{font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.uc-t small{color:var(--muted);font-size:.74rem}
.userchip .chev{margin-left:auto;width:1rem;height:1rem;color:var(--muted)}
html[data-side=mini] .brand-t,html[data-side=mini] .navi .nl,html[data-side=mini] .navgrp span,html[data-side=mini] .uc-t,html[data-side=mini] .userchip .chev{display:none}
html[data-side=mini] .navgrp{height:1px;margin:.8rem 1rem .5rem;background:var(--line);font-size:0}
html[data-side=mini] .brand{justify-content:center;padding-inline:0}
html[data-side=mini] .navi{justify-content:center;padding:0}html[data-side=mini] .navi .pill{position:absolute;top:.15rem;right:.2rem;min-width:.95rem;height:.95rem;padding:0 .2rem;font-size:.6rem}
html[data-side=mini] .userchip{justify-content:center;padding:.4rem}
html[data-side=mini] .side-in{padding-inline:.6rem}html[data-side=mini] .side-foot{padding-inline:.6rem}
html[data-side=mini] .navi[aria-current=page]::before{left:-.6rem}

/* ===== top bar ===== */
.top{position:sticky;top:0;z-index:30;height:var(--top-h);display:flex;align-items:center;gap:1rem;padding:0 2rem;background:rgba(10,16,18,.95);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.menubtn{display:none;width:2.5rem;height:2.5rem;border-radius:var(--r-s);border:1px solid var(--line-2);background:var(--surface);color:var(--text);align-items:center;justify-content:center;cursor:pointer;flex:none}
.crumbs{display:flex;align-items:center;gap:.35rem;min-width:0;overflow:hidden;font-size:.95rem}
.cr-i{white-space:nowrap;color:var(--muted);font-weight:560;text-decoration:none!important}a.cr-i:hover{color:var(--text)}.cr-i.cur{color:var(--text);font-weight:650;overflow:hidden;text-overflow:ellipsis}
.cr-sep{width:1rem;height:1rem;color:var(--faint);flex:none}
.cmdk-btn{display:flex;align-items:center;gap:.6rem;width:min(25rem,32vw);height:2.45rem;padding:0 .7rem 0 .8rem;border:1px solid var(--line-2);border-radius:var(--r-s);background:var(--surface);color:var(--muted);font:inherit;font-size:.9rem;cursor:pointer;text-align:left}
.cmdk-btn:hover{border-color:var(--ac-line);color:var(--text-2)}.cmdk-btn .ico{width:1.1rem;height:1.1rem}
.newbtn .chev{width:1rem;height:1rem;margin-right:-.2rem}
.alerts{display:flex;flex-direction:column;gap:.5rem;padding:0 2rem;width:100%;max-width:var(--page-max);margin:0 auto}.alerts:not(:empty){padding-top:1rem}
.scrim{display:none}

/* ===== buttons, fields ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:2.3rem;padding:.4rem .95rem;border-radius:var(--r-s);border:1px solid var(--line-2);background:var(--surface-2);color:var(--text);font:600 .875rem/1.1 var(--font);cursor:pointer;text-decoration:none!important;transition:background .12s,border-color .12s,color .12s,box-shadow .12s;white-space:nowrap}
.btn:hover{background:var(--surface-3);border-color:var(--ac-line)}
.btn .ico{width:1.1rem;height:1.1rem}
.btn.primary,.btn.green{background:var(--ac);border-color:transparent;color:var(--ac-ink)}.btn.primary:hover,.btn.green:hover{background:var(--ac-2);color:var(--ac-ink)}
.btn.sm{min-height:2rem;padding:.25rem .7rem;font-size:.8125rem;border-radius:.55rem}
.btn.icon{width:2.3rem;padding:0}.btn.sm.icon{width:2rem}
.btn.ghost{background:transparent;border-color:transparent;color:var(--text-2)}.btn.ghost:hover{background:var(--surface-2);color:var(--text)}
.btn.danger{color:var(--danger)}.btn.danger:hover{background:var(--danger-bg);border-color:var(--danger-line);color:#ffb3ba}
.btn.warn{color:var(--warn-2);border-color:var(--warn-line);background:var(--warn-bg)}.btn.warn:hover{background:rgba(245,165,36,.2)}
.btn.liveon{background:var(--live);border-color:transparent;color:#2a0808}.btn.liveon:hover{background:#ff7a7a}
.btn.newon{background:var(--new);border-color:transparent;color:#2a0a14}
.btn[disabled],.btn:disabled{opacity:.45;pointer-events:none}
a.btn{text-decoration:none}
input,select,textarea{width:100%;background:var(--field);color:var(--text);border:1px solid var(--line-2);border-radius:var(--r-s);padding:.55rem .75rem;font:inherit;transition:border-color .12s,box-shadow .12s}
select{appearance:none;-webkit-appearance:none;padding-right:2rem;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 1.05rem) 55%,calc(100% - .75rem) 55%;background-size:.32rem .32rem;background-repeat:no-repeat;cursor:pointer}
input:hover,select:hover,textarea:hover{border-color:rgba(176,214,220,.3)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--ac);box-shadow:0 0 0 3px var(--ac-bg-2)}
input::placeholder,textarea::placeholder{color:var(--faint)}
textarea{resize:vertical;min-height:4rem;line-height:1.45}
input[type=checkbox],input[type=radio]{width:1.05rem;height:1.05rem;padding:0;accent-color:var(--ac);flex:none;cursor:pointer}
input.selbox{width:1.1rem;height:1.1rem}
input[type=file]{padding:.4rem}
label.f{display:block;font-size:.8rem;font-weight:650;color:var(--text-2);margin:.9rem 0 .35rem}
label.f:first-child{margin-top:0}
.hint{color:var(--muted);font-size:.82rem}
.field-row{display:flex;gap:.6rem;align-items:center}
.search{position:relative;flex:1;min-width:14rem}.search .ico{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);width:1.1rem;height:1.1rem;color:var(--muted);pointer-events:none}
.search input{padding-left:2.4rem;padding-right:2.6rem;height:2.4rem}.search kbd{position:absolute;right:.6rem;top:50%;transform:translateY(-50%)}
.seg{display:inline-flex;padding:3px;border-radius:var(--r-s);background:var(--field);border:1px solid var(--line-2);gap:2px;flex-wrap:wrap}
.seg button{border:0;background:transparent;color:var(--muted);font:600 .82rem/1 var(--font);padding:.45rem .8rem;border-radius:.5rem;cursor:pointer;display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap}
.seg button:hover{color:var(--text)}.seg button.on{background:var(--surface-3);color:var(--text);box-shadow:0 1px 0 rgba(255,255,255,.05) inset}
.seg button .n{font-size:.72rem;color:var(--faint);font-weight:700}.seg button.on .n{color:var(--ac-2)}
.switch{position:relative;display:inline-block;width:2.4rem;height:1.35rem;flex:none}
.switch input{position:absolute;inset:0;opacity:0;margin:0;width:100%;height:100%;cursor:pointer;z-index:1}
.switch i{position:absolute;inset:0;border-radius:99px;background:var(--surface-3);border:1px solid var(--line-2);transition:background .15s,border-color .15s;pointer-events:none}
.switch i::after{content:'';position:absolute;top:2px;left:2px;width:calc(1.35rem - 6px);height:calc(1.35rem - 6px);border-radius:50%;background:var(--text-2);transition:transform .15s,background .15s}
.switch input:checked+i{background:var(--ac);border-color:transparent}.switch input:checked+i::after{transform:translateX(1.05rem);background:var(--ac-ink)}
.switch.live input:checked+i{background:var(--live)}.switch.live input:checked+i::after{background:#fff}
.switch input:disabled{cursor:not-allowed}.switch input:disabled+i{opacity:.4}
.switch input:focus-visible+i{outline:2px solid var(--ac);outline-offset:2px}

/* ===== cards, pills, stats ===== */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1.15rem 1.25rem;box-shadow:var(--shadow);min-width:0}
.card+.card{margin-top:0}
.card-h{display:flex;align-items:center;gap:.6rem;font-size:1rem;margin:0 0 .85rem}.card-h .ico{color:var(--ac)}
.card-h .grow{flex:1}.card-sub{color:var(--muted);font-size:.84rem;margin:-.55rem 0 .85rem}
.card h2{font-size:1.1rem;margin-bottom:.4rem}.card h3{margin-bottom:.55rem}
.card.flat{box-shadow:none}
.card.tight{padding:0;overflow:hidden}.card.tight>.card-h{padding:1rem 1.25rem 0;margin:0 0 .85rem}
.card.warnc{border-color:var(--warn-line);background:linear-gradient(0deg,var(--surface),var(--surface)),var(--warn-bg)}
.card.hero{display:flex;gap:1rem;align-items:flex-start;background:linear-gradient(120deg,var(--ac-bg),transparent 70%),var(--surface)}
.hero-i{width:3rem;height:3rem;border-radius:.9rem;display:grid;place-items:center;flex:none;background:var(--ac-bg-2);color:var(--ac-2)}.hero-i .ico{width:1.5rem;height:1.5rem}
.card.empty{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:2.5rem 1.5rem;text-align:center;color:var(--muted)}.card.empty .ico{width:2rem;height:2rem;color:var(--faint)}.card.empty p{margin:0}
.pill.pub,.badge.pub{background:var(--ac-bg);color:var(--ac-2);border-color:var(--ac-line)}
.pill.draft,.badge.draft{background:var(--warn-bg);color:var(--warn-2);border-color:var(--warn-line)}
.pill.live,.badge.live{background:var(--live-bg);color:#ff9a9a;border-color:rgba(255,95,95,.45)}
.pill.new,.badge.new{background:var(--new-bg);color:var(--new);border-color:rgba(255,134,166,.45)}
.pill.diet,.badge.diet{background:transparent;color:var(--text-2);border-color:var(--line-2);font-weight:650}
.pill.miss,.badge.miss{background:var(--warn-bg);color:var(--warn-2);border-color:var(--warn-line);font-weight:600}
.pill.ok{background:var(--ac-bg);color:var(--ac-2);border-color:var(--ac-line)}
.pill.warn{background:var(--warn-bg);color:var(--warn-2);border-color:var(--warn-line)}
.pill.neutral{background:var(--surface-3);color:var(--text-2)}
.pill .dot{width:.42rem;height:.42rem;border-radius:50%;background:currentColor}
.badge{display:inline-flex;align-items:center;min-height:1.35rem;padding:0 .55rem;border-radius:99px;font-size:.72rem;font-weight:700;border:1px solid var(--line-2);margin-right:.3rem}
.dot-live{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:var(--live);box-shadow:0 0 0 0 rgba(255,95,95,.6);animation:pulse 1.8s infinite;vertical-align:middle;margin-right:.4rem}
@keyframes pulse{70%{box-shadow:0 0 0 .45rem rgba(255,95,95,0)}100%{box-shadow:0 0 0 0 rgba(255,95,95,0)}}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:.75rem}
.stat{display:flex;flex-direction:column;gap:.15rem;padding:.9rem 1rem;border-radius:var(--r-s);background:var(--field);border:1px solid var(--line);text-decoration:none!important;color:inherit}
a.stat:hover{border-color:var(--ac-line);background:var(--surface-2)}
.stat b{font-size:1.7rem;line-height:1.1;font-variant-numeric:tabular-nums;letter-spacing:-.02em}.stat span{color:var(--muted);font-size:.8rem}.stat small{color:var(--faint);font-size:.74rem}
.stat.hl b{color:var(--ac-2)}.stat.wl b{color:var(--warn-2)}
.ticks{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.55rem}.ticks li{display:flex;gap:.65rem;align-items:flex-start;color:var(--text-2)}.ticks .ico{color:var(--ac);margin-top:.15rem;width:1.1rem;height:1.1rem}
.copybox{display:flex;gap:.6rem;align-items:center;justify-content:space-between;padding:.6rem .7rem;border:1px dashed var(--line-2);border-radius:var(--r-s);background:var(--field)}.copybox code{font:600 .82rem var(--font);color:var(--ac-2);word-break:break-word}
.modgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));gap:.75rem}
.modcard{display:flex;align-items:center;gap:.85rem;padding:.85rem 1rem;border-radius:var(--r-s);border:1px solid var(--line);background:var(--field);color:inherit;text-decoration:none!important}
.modcard:hover{border-color:var(--ac-line);background:var(--surface-2)}
.modic{width:2.5rem;height:2.5rem;border-radius:.7rem;display:grid;place-items:center;background:var(--ac-bg);color:var(--ac-2);flex:none}
.modt{display:flex;flex-direction:column;min-width:0;flex:1}.modt b{font-size:.95rem}.modt small{color:var(--muted);font-size:.8rem;line-height:1.35}

/* ===== tables ===== */
table{width:100%;border-collapse:collapse}
.tbl{font-size:.875rem}.tbl th{text-align:left;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);padding:.55rem .75rem;border-bottom:1px solid var(--line-2);white-space:nowrap}
.tbl td{padding:.7rem .75rem;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl tbody tr:hover td{background:rgba(176,214,220,.03)}.tbl tr:last-child td{border-bottom:0}
.tbl td.r,.tbl th.r{text-align:right}.tbl .num{font-variant-numeric:tabular-nums}
.tablewrap{overflow-x:auto}
.card.tight .tbl th:first-child,.card.tight .tbl td:first-child{padding-left:1.25rem}.card.tight .tbl th:last-child,.card.tight .tbl td:last-child{padding-right:1.25rem}
.reqrow td{background:var(--warn-bg)!important}.reqrow td:first-child{box-shadow:inset 3px 0 0 var(--warn)}
.tag{display:inline-flex;align-items:center;height:1.35rem;padding:0 .5rem;border-radius:99px;font-size:.72rem;font-weight:700;border:1px solid var(--line-2);color:var(--text-2)}
.tag.active{color:var(--ac-2);border-color:var(--ac-line);background:var(--ac-bg)}.tag.invited{color:var(--warn-2);border-color:var(--warn-line);background:var(--warn-bg)}.tag.disabled{color:var(--danger);border-color:var(--danger-line);background:var(--danger-bg)}
.reqtag{display:inline-block;margin-top:.3rem;font-size:.74rem;font-weight:700;line-height:1.35;color:var(--warn-2);border:1px solid var(--warn-line);background:var(--warn-bg);border-radius:.55rem;padding:.15rem .6rem}

/* ===== dish list ===== */
.toolbar{position:sticky;top:var(--top-h);z-index:20;padding:.7rem 0;margin:-.2rem 0 .3rem;background:linear-gradient(var(--bg) 78%,transparent)}
.tb-row{display:flex;gap:.7rem;align-items:center;flex-wrap:wrap;min-height:2.6rem}
.tb-row.bulk{padding:0 .8rem;border-radius:var(--r-s);background:var(--surface-3);border:1px solid var(--ac-line);box-shadow:0 10px 28px rgba(0,0,0,.4)}.tb-row.bulk b{color:var(--ac-2)}
.toolbar select{width:auto;min-width:9.5rem;height:2.4rem}
.dt{table-layout:auto;font-size:.875rem}
.dt thead th{position:sticky;top:calc(var(--top-h) + var(--tb-h));z-index:5;background:var(--surface);text-align:left;font-size:.7rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--faint);padding:.65rem .7rem;border-bottom:1px solid var(--line-2);white-space:nowrap}
.dt thead th:first-child{border-top-left-radius:var(--r)}.dt thead th:last-child{border-top-right-radius:var(--r)}
.dt td{padding:.55rem .7rem;border-bottom:1px solid var(--line);vertical-align:middle}
.dt tbody tr{cursor:pointer;transition:background .1s}.dt tbody tr:hover td{background:rgba(176,214,220,.045)}.dt tbody tr.sel td{background:var(--ac-bg)}
.dt tbody tr:last-child td{border-bottom:0}
.dt .c-sel{width:2.6rem;padding-right:0}.dt .c-photo{width:4.2rem}
.dt .r{text-align:right}.dt .num{font-variant-numeric:tabular-nums;white-space:nowrap}
.dt .thumb{width:3.4rem;height:2.6rem;border-radius:.5rem;object-fit:cover;display:block;background:var(--field);border:1px solid var(--line)}
.thumb{width:4rem;height:4rem;border-radius:.6rem;object-fit:cover;background:var(--field);border:1px solid var(--line);flex:none;display:flex;align-items:center;justify-content:center;color:var(--faint);font-size:.68rem;text-align:center;overflow:hidden}
.dt .nm{font-weight:650;font-size:.95rem;color:var(--text);display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.dt div.sm{color:var(--muted);font-size:.78rem;margin-top:.1rem}
.chipline{display:flex;gap:.3rem;flex-wrap:wrap;margin-top:.3rem}
.dt .algs{font-size:.8rem;color:var(--text-2);line-height:1.35}.dt .algs .may{color:var(--muted)}.dt .algs .none{color:var(--faint);font-style:italic}
.dt .acts{display:flex;gap:.45rem;align-items:center;justify-content:flex-end}
.gp-ok{color:var(--ac-2)}.gp-low{color:var(--warn-2)}.gp-bad{color:var(--danger)}
.live-cell{display:flex;align-items:center;gap:.5rem}
.dgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(15.5rem,1fr));gap:1rem}
.dcard{position:relative;border-radius:var(--r);overflow:hidden;background:var(--surface);border:1px solid var(--line);cursor:pointer;transition:border-color .12s,transform .12s;display:flex;flex-direction:column}
.dcard:hover{border-color:var(--ac-line);transform:translateY(-2px)}.dcard.sel{border-color:var(--ac);box-shadow:0 0 0 1px var(--ac)}
.dcard .ph{aspect-ratio:4/3;background:var(--field);position:relative}.dcard .ph img{width:100%;height:100%;object-fit:cover;display:block}.dcard .ph .none{position:absolute;inset:0;display:grid;place-items:center;color:var(--faint);font-size:.82rem}
.dcard .ph .tl{position:absolute;left:.6rem;top:.6rem;display:flex;gap:.3rem;flex-wrap:wrap}.dcard .ph .tr{position:absolute;right:.5rem;top:.5rem}
.dcard .bd{padding:.8rem .9rem .9rem;display:flex;flex-direction:column;gap:.3rem;flex:1}.dcard .bd b{font-size:.98rem;line-height:1.25}.dcard .bd div.sm{color:var(--muted);font-size:.8rem}
.dcard .ft{display:flex;align-items:center;gap:.5rem;padding:0 .9rem .85rem;margin-top:auto}
.pop{position:fixed;z-index:200;min-width:14rem;padding:.35rem;border-radius:.8rem;background:var(--surface-2);border:1px solid var(--line-2);box-shadow:0 18px 50px rgba(0,0,0,.55)}
.pop-i{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:.7rem;width:100%;padding:.5rem .65rem;border-radius:.55rem;color:var(--text);font:560 .875rem var(--font);cursor:pointer}
.pop-i:hover,.pop-i:focus-visible{background:var(--surface-3)}.pop-i:focus-visible{outline:2px solid var(--ac);outline-offset:-2px}
.pop-i .ico{width:1.1rem;height:1.1rem;color:var(--muted)}.pop-i .tick{color:var(--ac);margin-left:.3rem}.pop-i .hint{color:var(--faint);font-size:.78rem}
.pop-i.danger{color:var(--danger)}.pop-i.danger .ico{color:var(--danger)}.pop-i.danger:hover{background:var(--danger-bg)}.pop-i[disabled]{opacity:.4;cursor:not-allowed}
.pop-i.on{color:var(--ac-2)}
.pop-sep{height:1px;background:var(--line);margin:.3rem .2rem}.pop-title{padding:.4rem .65rem .3rem;color:var(--faint);font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}

/* ===== Home ===== */
.att-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.att{display:flex;gap:.9rem;align-items:center;padding:.9rem 1rem;border-radius:var(--r);background:var(--surface);border:1px solid var(--line)}
.att .ic{width:2.5rem;height:2.5rem;border-radius:.75rem;display:grid;place-items:center;flex:none;background:var(--ac-bg);color:var(--ac-2)}
.att.warn{border-color:var(--warn-line)}.att.warn .ic{background:var(--warn-bg);color:var(--warn-2)}
.att .t{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.3}.att .t b{font-size:.94rem}.att .t span{color:var(--muted);font-size:.82rem}
.allclear{display:flex;align-items:center;gap:.9rem;padding:1rem 1.15rem;border-radius:var(--r);background:linear-gradient(100deg,var(--ac-bg),transparent 80%),var(--surface);border:1px solid var(--ac-line)}
.allclear .ic{width:2.5rem;height:2.5rem;border-radius:50%;display:grid;place-items:center;background:var(--ac-bg-2);color:var(--ac-2)}
.sect-h{display:flex;align-items:baseline;gap:.75rem;margin:1.6rem 0 .75rem}.sect-h h2{font-size:1.05rem}.sect-h .grow{flex:1}.sect-h a{font-size:.85rem}
.live-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:.8rem}
.ldish{position:relative;border-radius:var(--r-s);overflow:hidden;border:1px solid var(--line);background:var(--field);cursor:pointer;color:inherit;text-decoration:none!important;display:block}
.ldish:hover{border-color:var(--ac-line)}
.ldish .ph{aspect-ratio:16/10;background:var(--field)}.ldish .ph img{width:100%;height:100%;object-fit:cover;display:block}
.ldish .nm{padding:.6rem .75rem .7rem;font-weight:650;font-size:.92rem;line-height:1.25}
.ldish .pill{position:absolute;left:.5rem;top:.5rem}
.cycle{margin-top:1rem}.bar{height:.4rem;border-radius:99px;background:var(--field);overflow:hidden;border:1px solid var(--line)}.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--ac-d),var(--ac-2));transition:width .25s}.bar.thin{height:.3rem;margin:-.2rem 0 .8rem}
.cycle .meta{display:flex;justify-content:space-between;gap:1rem;color:var(--muted);font-size:.82rem;margin-top:.45rem;flex-wrap:wrap}
.captionbox{margin-top:.9rem;padding:.7rem .85rem;border-radius:var(--r-s);background:var(--field);border:1px solid var(--line)}.captionbox .a{color:var(--warn-2);font-weight:800;text-transform:uppercase;font-size:.84rem}.captionbox .b{font-weight:800;text-transform:uppercase;font-size:.84rem;margin-top:.2rem}
.linkrows{display:flex;flex-direction:column}
.linkrow{display:flex;align-items:center;gap:.8rem;padding:.7rem .15rem;border-bottom:1px solid var(--line);color:inherit;text-decoration:none!important}
.linkrow:last-child{border-bottom:0}.linkrow:hover .t b{color:var(--ac-2)}
.linkrow .ico{color:var(--ac);width:1.2rem;height:1.2rem}.linkrow .t{flex:1;min-width:0;line-height:1.3}.linkrow .t b{display:block;font-size:.92rem}.linkrow .t span{color:var(--muted);font-size:.8rem}
.linkrow .v{font-weight:700;font-variant-numeric:tabular-nums}.linkrow .chev-r{color:var(--faint);width:1rem;height:1rem}
.feed{display:flex;flex-direction:column}.feed-i{display:flex;gap:.75rem;padding:.55rem 0;border-bottom:1px solid var(--line);font-size:.88rem;align-items:baseline}.feed-i:last-child{border-bottom:0}
.feed-i time{color:var(--faint);font-size:.78rem;min-width:5.5rem;flex:none}.feed-i .who{color:var(--text-2);font-weight:600}
.skel{border-radius:var(--r-s);background:linear-gradient(90deg,var(--surface) 25%,var(--surface-2) 50%,var(--surface) 75%);background-size:200% 100%;animation:sk 1.3s linear infinite}
@keyframes sk{from{background-position:200% 0}to{background-position:-200% 0}}

/* ===== editor ===== */
.edhead{position:sticky;top:var(--top-h);z-index:25;display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;padding:.7rem 1rem;margin-bottom:1rem;border-radius:var(--r);background:rgba(17,26,29,.94);backdrop-filter:blur(12px);border:1px solid var(--line-2);box-shadow:0 14px 34px rgba(0,0,0,.4)}
.edhead .ttl{min-width:0;flex:1;display:flex;flex-direction:column;line-height:1.2}.edhead .ttl b{font-size:1.1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.edhead .ttl small{color:var(--muted);font-size:.78rem}
.unsaved{display:none;align-items:center;gap:.4rem;color:var(--warn-2);font-size:.82rem;font-weight:650}.unsaved.on{display:inline-flex}.unsaved::before{content:'';width:.5rem;height:.5rem;border-radius:50%;background:var(--warn)}
.savedtag{display:inline-flex;align-items:center;gap:.4rem;color:var(--muted);font-size:.82rem}.unsaved.on+.savedtag{display:none}
.edgrid{display:grid;grid-template-columns:minmax(0,1fr) 25rem;gap:1rem;align-items:start}
.edmain{display:flex;flex-direction:column;gap:1rem;min-width:0}
.edside{display:flex;flex-direction:column;gap:1rem;min-width:0;align-self:stretch}
.edside .sticky{position:sticky;top:calc(var(--top-h) + 5.4rem)}
@media(max-height:780px){.edside .sticky{position:static}}
.edcard{scroll-margin-top:calc(var(--top-h) + 5.6rem)}
.secnav{display:flex;flex-direction:column;gap:2px}
.secnav a{display:flex;align-items:center;gap:.6rem;padding:.4rem .6rem;border-radius:.5rem;color:var(--muted);font-weight:560;font-size:.86rem;text-decoration:none!important}
.secnav a:hover{background:var(--surface-2);color:var(--text)}.secnav a.on{background:var(--ac-bg);color:var(--ac-2)}
.secnav a .st{margin-left:auto;width:.5rem;height:.5rem;border-radius:50%;background:var(--faint)}.secnav a .st.ok{background:var(--ac)}.secnav a .st.todo{background:var(--warn)}
.checklist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}
.checklist li{display:flex;align-items:center;gap:.6rem;font-size:.88rem;color:var(--text-2)}
.checklist .mk{width:1.15rem;height:1.15rem;border-radius:50%;display:grid;place-items:center;flex:none;border:1.5px solid var(--faint);color:transparent}.checklist .mk .ico{width:.8rem;height:.8rem;stroke-width:3}
.checklist li.ok .mk{background:var(--ac);border-color:var(--ac);color:var(--ac-ink)}.checklist li.ok{color:var(--text)}
.checklist li.todo .mk{border-color:var(--warn)}
.checklist li a{margin-left:auto;font-size:.78rem}
.photo{width:100%;max-height:18rem;object-fit:cover;border-radius:var(--r-s);display:block;margin-bottom:.6rem;background:var(--field);border:1px solid var(--line)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
.chips{display:flex;flex-wrap:wrap;gap:.4rem}
.chip{border:1.5px solid var(--line-2);border-radius:99px;padding:.32rem .8rem;font:600 .82rem var(--font);cursor:pointer;background:transparent;color:var(--muted);transition:background .1s,border-color .1s,color .1s}
.chip:hover{border-color:var(--ac-line);color:var(--text)}
.chip.c1{border-color:var(--warn);background:var(--warn-bg);color:var(--warn-2)}.chip.c2{border-color:var(--ac-line);background:var(--ac-bg);color:var(--ac-2);border-style:dashed}
.ing{display:grid;grid-template-columns:minmax(0,1fr) 5.5rem 6.5rem auto;gap:.5rem;margin-bottom:.5rem;align-items:center}
.ing input.linked{border-color:var(--ac);background:var(--ac-bg)}
.step{display:grid;grid-template-columns:1.6rem minmax(0,1fr) auto;gap:.5rem;margin-bottom:.5rem;align-items:start}.step i{font-style:normal;color:var(--ac);font-weight:800;padding-top:.6rem;text-align:right}
.dz{display:block;width:100%;border:2px dashed var(--line-2);border-radius:var(--r);padding:1.1rem .9rem;text-align:center;cursor:pointer;background:var(--field);color:var(--text);font:inherit;margin-bottom:.6rem;transition:border-color .12s,background .12s}
.dz svg{display:block;width:1.7rem;height:1.7rem;margin:0 auto .4rem;color:var(--ac)}
.dz b{display:block;font-size:.92rem;color:var(--ac-2)}.dz span{display:block;margin-top:.25rem;font-size:.76rem;color:var(--muted);font-weight:500}
.dz:hover,.dz:focus-visible,.dz.drag{border-color:var(--ac);background:var(--ac-bg);outline:none}.dz.drag{border-style:solid}
.scot{margin:.4rem 0 .8rem;padding:.75rem .9rem;border:1px solid var(--warn-line);border-left:4px solid var(--warn);border-radius:var(--r-s);background:var(--warn-bg);font-size:.86rem;line-height:1.45}
.scot-l{font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--warn-2);margin-bottom:.2rem}
.aibox{border:1px dashed var(--ac-line);border-radius:var(--r-s);padding:.8rem .9rem;background:var(--ac-bg)}
.aibox .chk{display:flex;flex-wrap:wrap;gap:.4rem .9rem;margin:.65rem 0 .2rem;color:var(--text-2);font-size:.86rem}.aibox label{display:inline-flex;gap:.4rem;align-items:center;cursor:pointer}

/* ===== ideas, settings ===== */
.idgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(22rem,1fr));gap:1rem}
.idea{display:flex;flex-direction:column;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);overflow:hidden}
.idea.done{opacity:.6}.idea.new{border-color:var(--warn-line)}
.idea .ph{aspect-ratio:16/8;background:var(--field);display:grid;place-items:center;color:var(--faint);overflow:hidden}.idea .ph img{width:100%;height:100%;object-fit:cover}
.idea .bd{padding:.9rem 1rem;display:flex;flex-direction:column;gap:.45rem;flex:1}.idea .bd b{font-size:1.02rem}.idea .bd p{white-space:pre-wrap;color:var(--text-2);margin:0;font-size:.9rem}
.idea .ft{display:flex;gap:.45rem;flex-wrap:wrap;padding:0 1rem 1rem}
.settings{display:grid;grid-template-columns:15rem minmax(0,1fr);gap:1.5rem;align-items:start}
.subnav{position:sticky;top:calc(var(--top-h) + 1.2rem);display:flex;flex-direction:column;gap:2px}
.subnav a{display:flex;align-items:center;gap:.7rem;padding:.6rem .8rem;border-radius:var(--r-s);color:var(--text-2);font-weight:580;text-decoration:none!important}
.subnav a:hover{background:var(--surface-2);color:var(--text)}.subnav a.on{background:var(--ac-bg);color:var(--ac-2)}.subnav a .ico{opacity:.85}
.swatches{display:flex;gap:.75rem;flex-wrap:wrap}
.swatch{all:unset;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;gap:.45rem;padding:.65rem .85rem;border-radius:var(--r-s);border:1.5px solid var(--line-2);cursor:pointer;min-width:5.2rem;color:var(--text-2);font-weight:600;font-size:.84rem}
.swatch:hover{border-color:var(--ac-line)}.swatch.on{border-color:var(--ac);background:var(--ac-bg);color:var(--text)}.swatch:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
.swatch i{width:2rem;height:2rem;border-radius:50%;display:block;box-shadow:0 0 0 3px rgba(255,255,255,.06) inset}
.bulkmenu{margin-top:.5rem;display:grid;gap:.5rem}
.livedot{display:inline-block;width:.45rem;height:.45rem;border-radius:50%;background:var(--live);margin-right:.4rem;vertical-align:middle}

/* ===== banners, toasts, command palette ===== */
.banner .grow{flex:1 1 14rem}
.banner{display:flex;gap:.7rem;align-items:center;flex-wrap:wrap;padding:.7rem 1rem;border-radius:var(--r-s);background:var(--warn-bg);border:1px solid var(--warn-line);font-weight:600}
.banner.info{background:var(--ac-bg);border-color:var(--ac-line)}
.banner .ico{color:var(--warn-2)}.banner.info .ico{color:var(--ac-2)}
#toasts{position:fixed;right:1.25rem;bottom:1.25rem;z-index:300;display:flex;flex-direction:column;gap:.5rem;align-items:flex-end;pointer-events:none}
.toast{display:flex;gap:.6rem;align-items:center;padding:.7rem .95rem;border-radius:var(--r-s);background:var(--surface-3);border:1px solid var(--ac-line);box-shadow:0 14px 40px rgba(0,0,0,.55);font-weight:600;max-width:min(30rem,92vw);pointer-events:auto;animation:tin .22s ease-out both}
.toast .ico{color:var(--ac-2)}.toast.err{border-color:var(--danger-line)}.toast.err .ico{color:var(--danger)}.toast.out{opacity:0;transform:translateY(6px);transition:.25s}
@keyframes tin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.cmdk-ov{position:fixed;inset:0;z-index:400;background:rgba(3,8,9,.66);backdrop-filter:blur(3px);display:flex;justify-content:center;align-items:flex-start;padding:12vh 1rem 1rem}
.cmdk-box{width:min(40rem,100%);max-height:70vh;display:flex;flex-direction:column;border-radius:var(--r);background:var(--surface-2);border:1px solid var(--line-2);box-shadow:0 30px 80px rgba(0,0,0,.6);overflow:hidden}
.cmdk-box.sm{width:min(30rem,100%)}
.cmdk-in{display:flex;align-items:center;gap:.7rem;padding:.2rem 1rem;border-bottom:1px solid var(--line)}.cmdk-in .ico{color:var(--muted)}
.cmdk-in input{border:0;background:transparent;box-shadow:none!important;font-size:1.02rem;padding:.9rem 0}.cmdk-in input:focus{border:0}
.cmdk-list{overflow-y:auto;padding:.4rem;min-height:4rem}
.cmdk-g{padding:.55rem .65rem .25rem;color:var(--faint);font-size:.68rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.cmdk-i{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:.75rem;width:100%;padding:.55rem .65rem;border-radius:.6rem;cursor:pointer;color:var(--text);font-weight:560}
.cmdk-i .ico{color:var(--muted);width:1.1rem;height:1.1rem}.cmdk-i small{color:var(--faint);font-size:.78rem}
.cmdk-i.on{background:var(--ac-bg-2)}.cmdk-i.on .ico{color:var(--ac-2)}
.cmdk-none{padding:1.4rem;text-align:center;color:var(--muted)}
.cmdk-foot{display:flex;gap:1.2rem;padding:.55rem 1rem;border-top:1px solid var(--line);color:var(--faint);font-size:.78rem}.cmdk-foot kbd{margin-right:.2rem}
.dlg-h{display:flex;align-items:center;justify-content:space-between;padding:.8rem 1rem;border-bottom:1px solid var(--line)}
.kbd-rows{padding:.5rem 1rem 1rem;display:flex;flex-direction:column}.kbd-r{display:flex;gap:1rem;align-items:center;padding:.6rem 0;border-bottom:1px solid var(--line)}.kbd-r:last-child{border-bottom:0}.kbd-r .keys{display:flex;gap:.25rem;min-width:7rem}

/* ===== sign-in / not allowed ===== */
.auth{max-width:28rem;margin:14vh auto;padding:1.75rem;text-align:center;display:flex;flex-direction:column;gap:.7rem}


/* ===== helpers added with the page code ===== */
.btn .chev{width:1rem;height:1rem;margin-right:-.2rem}
.card.tight.stk{overflow:visible}.card.tight.stk tbody tr:last-child td:first-child{border-bottom-left-radius:var(--r)}.card.tight.stk tbody tr:last-child td:last-child{border-bottom-right-radius:var(--r)}
.card.tight>.card-sub,.card.tight>.pad{padding-left:1.25rem;padding-right:1.25rem}.pad.b{padding-bottom:1.15rem}
.dt .c-act{width:1%;white-space:nowrap}.dt .c-new,.dt .c-live,.dt .c-status{white-space:nowrap}
.dt .thumb{display:grid;place-items:center;color:var(--faint)}.dt .thumb .ico{width:1.2rem;height:1.2rem}
.dcard .tr{background:rgba(10,16,18,.62);border-radius:.45rem;padding:.25rem .3rem;display:flex}
.dcard .ft .switch{margin-left:.2rem}
.basics{display:grid;grid-template-columns:17rem minmax(0,1fr);gap:1.4rem;align-items:start}
.basics-photo .photo{max-height:15rem}.basics-photo .dz{margin-bottom:.5rem}
.thumb.nophoto{width:100%;height:9.5rem;flex-direction:column;gap:.4rem;font-size:.85rem;margin-bottom:.6rem}.thumb.nophoto .ico{width:1.8rem;height:1.8rem}
.gpbox{padding-top:.5rem;font-weight:700;font-size:1.05rem}
.legend{display:flex;gap:.5rem;margin:.2rem 0 .9rem}.legend .chip{cursor:default;pointer-events:none}
.haccp-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 1.25rem}
.edfoot{display:flex;justify-content:flex-end;padding:.25rem 0 0}
.steps{margin:0;padding:0;list-style:none;counter-reset:s;display:flex;flex-direction:column;gap:.95rem}
.steps li{counter-increment:s;position:relative;display:flex;flex-direction:column;padding-left:2.3rem}
.steps li::before{content:counter(s);position:absolute;left:0;top:.05rem;width:1.6rem;height:1.6rem;border-radius:50%;background:var(--ac-bg-2);color:var(--ac-2);display:grid;place-items:center;font-weight:700;font-size:.8rem}
.steps li span{color:var(--muted);font-size:.86rem;margin-top:.15rem}
.setrow{display:flex;align-items:center;gap:1rem;padding:1rem 0;border-top:1px solid var(--line)}
.histrow{padding:.6rem 0;border-top:1px solid var(--line)}.histrow:first-child{border-top:0}
.filebadge{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;width:100%;height:100%;font-weight:800;color:var(--text-2);text-decoration:none!important}
.idea .ph a{display:block;width:100%;height:100%}
.pagehead .sub{max-width:62rem}

/* ===== responsive ===== */
@media(max-width:1699px){.dt .c-cost{display:none}}
@media(max-width:1449px){.edgrid{grid-template-columns:minmax(0,1fr) 22rem}.att-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1299px){.toolbar{position:static;background:none}.dt thead th{position:static}.haccp-grid{grid-template-columns:1fr}.dt .c-alg{display:none}.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}.edgrid{grid-template-columns:minmax(0,1fr)}.edside .sticky{position:static}.edside{order:-1}.secnav{flex-direction:row;flex-wrap:wrap}}
@media(max-width:1099px){.basics{grid-template-columns:1fr}.dt .c-gp{display:none}.cols-2-1,.cols-2-3,.cols-1-1,.cols-3{grid-template-columns:1fr}.settings{grid-template-columns:1fr}.subnav{position:static;flex-direction:row;flex-wrap:wrap}}
@media(max-width:899px){
  .app{display:block}
  .side{position:fixed;left:0;top:0;bottom:0;width:min(86vw,19rem);transform:translateX(-102%);transition:transform .22s ease;box-shadow:20px 0 60px rgba(0,0,0,.5)}
  html[data-side=mini] .brand-t,html[data-side=mini] .navi .nl,html[data-side=mini] .navgrp span,html[data-side=mini] .uc-t,html[data-side=mini] .userchip .chev{display:revert}
  html[data-side=mini] .navi{justify-content:flex-start;padding:0 .75rem}html[data-side=mini] .brand{justify-content:flex-start}
  .app.open .side{transform:none}.app.open .scrim{display:block;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:35}
  .menubtn{display:inline-flex}.top{padding:0 .9rem;gap:.6rem}.cmdk-btn{width:auto;flex:none;padding:0 .7rem}.cmdk-btn span,.cmdk-btn kbd{display:none}
  .newbtn span{display:none}.page{padding:1rem .9rem 3rem}.alerts{padding:0 .9rem}
  .dt .c-cat,.dt .c-tags{display:none}.toolbar{position:static;background:none}.dt thead th,.bulkbar{position:static}
  .grid2,.grid3{grid-template-columns:1fr}.ing{grid-template-columns:minmax(0,1fr) 4.4rem 5.2rem auto}
  .pagehead h1{font-size:1.4rem}
  .att-list{grid-template-columns:1fr}.modgrid{grid-template-columns:1fr}.idgrid{grid-template-columns:1fr}
  #toasts{left:.75rem;right:.75rem;bottom:.75rem;align-items:stretch}
}
@media(max-width:599px){.dt .c-price,.dt .c-sel{display:none}.dt .c-photo{width:3.6rem}.edhead{position:static}.dt .acts .switch{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@media print{.side,.top,.alerts,.toolbar,#toasts{display:none!important}.app{display:block}body{background:#fff;color:#000}}
.settings input[type=password]{max-width:24rem}
@media(max-width:1599px){.seg button{padding:.45rem .65rem}}
@media(max-width:1499px){:root{--side-w:15.5rem}}
@media(max-height:860px){.brand{padding-bottom:.6rem}.navi{min-height:2.3rem}.navgrp{margin-top:.8rem}.side-foot{padding-bottom:.6rem}.side-foot .navi{min-height:2.1rem}.userchip{padding:.4rem .55rem}}
@media(max-width:699px){.viewseg{display:none}.dt .c-batch,.dt .c-ing{display:none}}
@media(max-width:699px){.edhead .ttl{flex:1 1 calc(100% - 3.5rem)}.toolbar select{flex:1 1 8rem}}
.card.empty .btn .ico{color:inherit;width:1.1rem;height:1.1rem}

/* ===== People page (users.php) ===== */
.invite-row>input{flex:1 1 16rem;width:auto;min-width:0}
.linkcard-b{display:flex;gap:1.5rem;align-items:flex-start;flex-wrap:wrap}.linkcard-b>div:first-child{flex:1 1 24rem;min-width:0}
.qr{background:#fff;padding:.4rem;border-radius:.7rem;width:11rem;height:11rem;flex:none}.qr svg{width:100%;height:100%;display:block}
.printcell{display:flex;flex-direction:column;gap:.3rem;min-width:11rem}.printcell .row input[type=number]{padding:.3rem .5rem}
.tbl .acts{display:flex;gap:.45rem;align-items:center;justify-content:flex-end}.tbl td.c-act{width:1%;white-space:nowrap}
.tbl td.c-last{white-space:nowrap;color:var(--text-2)}.tbl .nm{font-weight:650;font-size:.95rem;display:flex;gap:.5rem;align-items:baseline;flex-wrap:wrap}
.tbl td{vertical-align:top}.tbl td.c-act{vertical-align:middle}
.cols-main-side{display:grid;grid-template-columns:minmax(0,1fr);gap:1rem;align-items:start}
@media(min-width:1700px){.cols-main-side{grid-template-columns:minmax(0,1fr) 24rem}}
.feed.stacked .feed-i{flex-direction:column;align-items:flex-start;gap:.1rem}.feed.stacked time{min-width:0}
@media(max-width:899px){.tbl .c-pk{display:none}}
/* ---------- Allergen matrix (13 Oct 2026): the sheet is always white, like the printed chart ---------- */
.mx-wrap{overflow:auto;padding:.25rem 0}
.mx-sheet{width:297mm;height:209mm;box-sizing:border-box;padding:7mm 12mm 6mm 10mm;margin:0 0 1rem;background:#fff;color:#000;font-family:Arial,Helvetica,sans-serif;position:relative;overflow:hidden;break-after:page;box-shadow:0 2px 14px rgba(0,0,0,.45);transform-origin:top left}
.mx-sheet *{box-sizing:border-box}
.mx-title{height:12mm;font-size:14pt;font-weight:700;line-height:1;padding-top:3mm}
.mx-g{color:#666}.mx-b{color:#000;text-decoration:underline}
.mx-t{width:100%;table-layout:fixed;border-collapse:collapse}
.mx-t th,.mx-t td{border:.25mm solid #8a8a8a;padding:0 .6mm;text-align:center;vertical-align:middle;overflow:hidden;color:#000}
.mx-ic{height:17mm}.mx-ic th{background:#fff}.mx-ic img{max-width:92%;max-height:13mm;display:block;margin:0 auto}
.mx-dishes{font-size:17pt!important;font-weight:400!important;text-align:left!important;padding-left:1mm!important}
.mx-hd{height:11mm}.mx-hd th{background:#e0ebcd;font-size:8.6pt;font-weight:700;line-height:1.1}
.mx-nm{font-size:9.2pt;font-weight:700;text-transform:uppercase;line-height:1.15;padding:1.2mm .8mm!important;word-break:break-word}
.mx-c{padding:1.2mm .3mm!important;line-height:1.1}
.mx-y{font-size:11pt;font-weight:700;line-height:1.05}
.mx-mc{font-size:9.5pt;font-weight:700;line-height:1.05}
.mx-s{font-size:6.3pt;line-height:1.12;font-weight:400}
.mx-unk{color:#d00;font-size:6.3pt;font-weight:700;margin-top:.8mm;text-transform:none}
.mx-nodata{color:#d00;font-size:9pt;line-height:1.3;background:#fff1f1}
.mx-nodata .btn{margin-top:1.5mm;color:#111}
.mx-foot{display:flex;align-items:center;height:15mm;margin-top:3mm;font-size:12pt}
.mx-rd{width:36%}.mx-rb{flex:1}
.mx-fill{display:inline-block;min-width:34mm;border-bottom:.2mm dotted #999;min-height:1em;vertical-align:bottom}
.mx-fsa{display:flex;align-items:center;gap:2mm;width:25%;font-size:6.6pt;line-height:1.2}.mx-fsa img{height:11mm;width:auto}
.mx-edited{outline:1.5px dashed #e08a00;outline-offset:-2px}
[contenteditable]:focus{outline:2px solid #2a8cff;outline-offset:-2px}
.mx-picks{max-height:15rem;overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));gap:.15rem .9rem;margin-top:.4rem}
.mx-pick{display:flex;align-items:center;gap:.5rem;padding:.3rem .45rem;border-radius:.5rem;cursor:pointer}
.mx-pick:hover{background:rgba(255,255,255,.05)}.mx-pick.on{background:rgba(255,255,255,.08)}
.mx-pn{font-weight:600}.mx-lbl{display:inline-flex;align-items:center;gap:.5rem;font-weight:600}.mx-date{font:inherit}
@media print{
  /* In print mode only the chart exists: the page frame (100vh high, dark) must not add a second, dark page */
  html.mx-printing,html.mx-printing body{background:#fff!important;height:auto!important;min-height:0!important;margin:0!important;padding:0!important}
  html.mx-printing #app,html.mx-printing .app,html.mx-printing .main,html.mx-printing .page,html.mx-printing #view,html.mx-printing .vroot,html.mx-printing .stack{display:block!important;min-height:0!important;height:auto!important;max-width:none!important;margin:0!important;padding:0!important;gap:0!important;background:none!important;border:0!important;box-shadow:none!important;animation:none!important}
  html.mx-printing .app>*:not(.main),html.mx-printing .main>*:not(.page),html.mx-printing .vroot>.pagehead,html.mx-printing .stack>*:not(.mx-wrap),html.mx-printing .mx-noprint{display:none!important}
  html.mx-printing body>*:not(#app){display:none!important}
       html.mx-printing .mx-wrap{padding:0;overflow:visible}
  html.mx-printing .mx-sheet{zoom:1!important;margin:0;box-shadow:none;break-after:page}
  html.mx-printing .mx-sheet:last-child{break-after:auto}
  html.mx-printing .mx-edited,html.mx-printing [contenteditable]:focus{outline:none}
  html.mx-printing .mx-fill{border-bottom:none}
  html.mx-printing .mx-sheet,html.mx-printing .mx-sheet *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* Menu allergen matrix (13 Oct 2026): section bands, option rows and the cross-contamination note under the table */
.mm-sec td{background:#d9d9d9!important;font-size:9.5pt;font-weight:700;text-align:left!important;padding:0 1.5mm!important;text-transform:uppercase;letter-spacing:.02em}
.mm-on{background:#f3f3f3}
.mm-dn{font-size:6.3pt;font-weight:400;line-height:1.1;color:#444;text-transform:uppercase;margin:.3mm 0}
.mm-note{font-size:6.6pt;line-height:1.2;color:#000;margin-top:2mm;height:9mm;overflow:hidden}
.mm-sheet .mx-foot{margin-top:1mm}

/* ===== Lively look (22 Oct 2026): page entrance, cards, hover, toasts, skeletons, dialogs =====
   Everything animated lives inside "no-preference", so with "reduce motion" nothing moves (and the older reduce rule above stays as a safety net).
   Fill mode is "backwards" on purpose: after the animation ends the element returns to its normal styles, so hover effects and print are never overridden.
   Nothing here touches the print sheets; the print rule at the end switches every animation and transition off. */
@media (prefers-reduced-motion:no-preference){
  @keyframes vin{from{opacity:0}}
  @keyframes cin{from{opacity:0;transform:translateY(10px)}}
  @keyframes ovin{from{opacity:0}}
  @keyframes boxin{from{opacity:0;transform:translateY(12px) scale(.97)}}
  @keyframes popin{from{opacity:0;transform:translateY(-4px) scale(.98)}}
  @keyframes tdraw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
  @keyframes tshake{0%,100%{transform:none}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}
  @keyframes tglow{0%,100%{box-shadow:0 14px 40px rgba(0,0,0,.55)}45%{box-shadow:0 14px 40px rgba(0,0,0,.55),0 0 24px 2px var(--ac-line)}}
  @keyframes terr{0%,100%{box-shadow:0 14px 40px rgba(0,0,0,.55)}45%{box-shadow:0 14px 40px rgba(0,0,0,.55),0 0 22px 2px var(--danger-line)}}
  @keyframes bflash{0%{box-shadow:0 0 0 0 var(--ac)}100%{box-shadow:0 0 0 .6rem transparent}}
  @keyframes skw{to{transform:translateX(100%)}}

  /* a new page fades in; its cards then rise one after another (class fx-in is set for the first 1.5 s of a page by RVNAdmin.enter) */
  .vroot{animation:vin .2s ease-out backwards}
  .vroot.fx-in .pagehead,.vroot.fx-in .card,.vroot.fx-in .stat,.vroot.fx-in .modcard,.vroot.fx-in .dcard{animation:cin .38s cubic-bezier(.2,.7,.2,1) backwards}
  .vroot.fx-in .card:nth-child(2),.vroot.fx-in .stat:nth-child(2),.vroot.fx-in .modcard:nth-child(2),.vroot.fx-in .dcard:nth-child(2){animation-delay:.03s}
  .vroot.fx-in .card:nth-child(3),.vroot.fx-in .stat:nth-child(3),.vroot.fx-in .modcard:nth-child(3),.vroot.fx-in .dcard:nth-child(3){animation-delay:.06s}
  .vroot.fx-in .card:nth-child(4),.vroot.fx-in .stat:nth-child(4),.vroot.fx-in .modcard:nth-child(4),.vroot.fx-in .dcard:nth-child(4){animation-delay:.09s}
  .vroot.fx-in .card:nth-child(5),.vroot.fx-in .stat:nth-child(5),.vroot.fx-in .modcard:nth-child(5),.vroot.fx-in .dcard:nth-child(5){animation-delay:.12s}
  .vroot.fx-in .card:nth-child(6),.vroot.fx-in .stat:nth-child(6),.vroot.fx-in .modcard:nth-child(6),.vroot.fx-in .dcard:nth-child(6){animation-delay:.15s}
  .vroot.fx-in .card:nth-child(n+7),.vroot.fx-in .stat:nth-child(n+7),.vroot.fx-in .modcard:nth-child(n+7),.vroot.fx-in .dcard:nth-child(n+7){animation-delay:.18s}

  /* hover: cards get a soft accent edge, clickable tiles lift, buttons lift and press */
  .card{transition:border-color .18s,box-shadow .22s}
  .card:not(.warnc):hover{border-color:var(--ac-line)}
  .stat,.modcard{transition:border-color .16s,background .16s,transform .18s,box-shadow .22s}
  .stat:hover,.modcard:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(0,0,0,.38)}
  .dcard{transition:border-color .16s,transform .18s,box-shadow .22s}
  .dcard:hover{box-shadow:0 12px 30px rgba(0,0,0,.42)}
  .dcard.sel:hover{box-shadow:0 0 0 1px var(--ac),0 12px 30px rgba(0,0,0,.42)}
  .btn{transition:background .14s,border-color .14s,color .14s,transform .14s,box-shadow .2s}
  .btn:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 5px 16px rgba(0,0,0,.32)}
  .btn.primary:not(:disabled):hover,.btn.green:not(:disabled):hover{box-shadow:0 6px 20px var(--ac-line)}
  .btn.ghost:not(:disabled):hover,.btn.icon.ghost:not(:disabled):hover{box-shadow:none}
  .btn:not(:disabled):active{transform:translateY(0) scale(.97);box-shadow:none}
  .btn.saved-flash{animation:bflash .9s ease-out}
  .chip{transition:background .14s,border-color .14s,color .14s,transform .14s}
  .chip:hover{transform:translateY(-1px)}
  .tbl tbody tr td,.dt tbody tr td{transition:background .14s}

  /* sound button in the top bar */
  .snd-btn{color:var(--muted)}.snd-btn.on{color:var(--ac-2);border-color:var(--ac-line);background:var(--ac-bg)}
  .snd-btn[disabled]{opacity:.35}

  /* toasts: spring in, a saved toast draws its tick and glows once, an error shakes once */
  .toast{animation:tin .28s cubic-bezier(.2,.8,.2,1) backwards}
  .toast:not(.err) .ico path{stroke-dasharray:1;animation:tdraw .45s .14s ease-out backwards}
  .toast.saved{animation:tin .28s cubic-bezier(.2,.8,.2,1) backwards,tglow 1.1s .12s ease-out}
  .toast.err{animation:tin .28s cubic-bezier(.2,.8,.2,1) backwards,tshake .42s .26s ease-in-out,terr 1.1s .12s ease-out}

  /* skeletons: a calm sweep of light instead of a moving background; the blocks start a moment apart */
  .skel{position:relative;overflow:hidden;animation:none;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
  .skel::after{content:'';position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(176,214,220,.075),transparent);animation:skw 1.5s ease-in-out infinite}
  .skel:nth-child(2)::after{animation-delay:.14s}.skel:nth-child(3)::after{animation-delay:.28s}.skel:nth-child(4)::after{animation-delay:.42s}.skel:nth-child(n+5)::after{animation-delay:.56s}

  /* dialogs and menus */
  .cmdk-ov{animation:ovin .16s ease-out backwards}
  .cmdk-box{animation:boxin .24s cubic-bezier(.2,.8,.2,1) backwards}
  .pop{animation:popin .14s ease-out backwards}
}
/* No effects in print or PDF: the Kitchen sheets keep exactly their own layout */
@media print{*,*::before,*::after{animation:none!important;transition:none!important}}
