/* Pivní Parta – shared design tokens and components (2026-11: light, yellow app bar; dark follows the phone). */
:root{
  --pp-bg:#F3F1EC;--pp-surface:#FFFFFF;--pp-surface-2:#F7F5F0;--pp-line:#E3DED3;--pp-line-strong:#C9C2B3;
  --pp-text:#1E1A13;--pp-text-2:#665F52;--pp-amber:#F5B82E;--pp-amber-hover:#E9A913;--pp-amber-ink:#2B1D00;--pp-amber-text:#8A5A00;
  --pp-amber-soft:#FDF1D3;--pp-bar:#F5B82E;--pp-bar-ink:#2B1D00;--pp-bar-ink-2:#5C4100;
  --pp-ok:#1E7A45;--pp-ok-bar:#3D9A5B;--pp-warn:#8A5A00;--pp-err:#B3261E;--pp-err-soft:#FBE7E5;--pp-focus:#1D6FD6;
  --pp-toast:#2A2620;--pp-toast-ink:#FFFFFF;--pp-field:#FFFFFF;
  --pp-radius:14px;--pp-gap:12px;--pp-tap:48px;
  font-size:16px;color-scheme:light;
}
@media (prefers-color-scheme:dark){:root{
  --pp-bg:#141311;--pp-surface:#1E1C19;--pp-surface-2:#272421;--pp-line:#35312B;--pp-line-strong:#4A443B;
  --pp-text:#F3F0EA;--pp-text-2:#B9B2A5;--pp-amber-text:#F5C451;--pp-amber-soft:#3A2D10;
  --pp-ok:#86CFA5;--pp-ok-bar:#5DB47F;--pp-warn:#F2CB78;--pp-err:#FFA69E;--pp-err-soft:#3A1F1C;--pp-focus:#7CC4FF;
  --pp-toast:#F3F0EA;--pp-toast-ink:#1E1A13;--pp-field:#151412;color-scheme:dark;
}}
/* Older server-rendered pages (loans, stats, profile, manual, wizard…) follow the same light /
   dark tokens; pp-legacy.css maps their own colours onto these tokens. */
*{box-sizing:border-box}
html,body{margin:0;background:var(--pp-bg);color:var(--pp-text);font:16px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
a{color:var(--pp-amber-text)}
:focus-visible{outline:3px solid var(--pp-focus);outline-offset:2px}
.pp-num{font-variant-numeric:tabular-nums}
.pp-test{background:#2B1D00;color:#F5C451;text-align:center;font-size:13px;font-weight:700;padding:5px 8px;letter-spacing:.02em}
.pp-appbar{background:var(--pp-bar);color:var(--pp-bar-ink)}
.pp-shell{max-width:1100px;margin:0 auto;padding:0 16px 96px}
.pp-head{max-width:1100px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;flex-wrap:wrap}
.pp-head .pp-pub{font-size:19px;font-weight:800;overflow-wrap:anywhere;color:var(--pp-bar-ink)}
.pp-head .pp-who{color:var(--pp-bar-ink-2);font-size:14px;overflow-wrap:anywhere}
.pp-head .pp-ctx{font-size:13px;color:var(--pp-bar-ink);background:rgba(255,255,255,.35);border-radius:999px;padding:4px 10px}
.pp-head .pp-btn{background:rgba(255,255,255,.45);border-color:transparent;color:var(--pp-bar-ink)}
main#pp-main{padding-top:14px}
.pp-card{background:var(--pp-surface);border:1px solid var(--pp-line);border-radius:var(--pp-radius);padding:16px;margin:0 0 var(--pp-gap)}
.pp-card h1,.pp-card h2,.pp-card h3{margin:0 0 10px;line-height:1.2}
.pp-card h1{font-size:22px}.pp-card h2{font-size:18px}.pp-card h3{font-size:16px}
.pp-muted{color:var(--pp-text-2)}
.pp-money{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pp-money .pp-label{color:var(--pp-text-2);font-size:14px}
.pp-money .pp-amount{font-size:28px;font-weight:800;font-variant-numeric:tabular-nums}
.pp-note{margin-top:10px;font-size:14px;padding:8px 10px;border-radius:10px;background:var(--pp-surface-2)}
.pp-note.warn{color:var(--pp-warn);background:var(--pp-amber-soft)}.pp-note.ok{color:var(--pp-ok)}.pp-note.err{color:var(--pp-err);background:var(--pp-err-soft)}
.pp-note .pp-btn{margin-left:8px}
/* menu: list rows, the whole row is one tap target */
.pp-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:8px}
.pp-tile{display:flex;align-items:center;gap:12px;min-height:72px;width:100%;text-align:left;cursor:pointer;
  background:var(--pp-surface);color:var(--pp-text);border:1px solid var(--pp-line);border-radius:var(--pp-radius);padding:10px 12px;font:inherit}
.pp-tile:hover{border-color:var(--pp-amber)}
.pp-tile:active{transform:scale(.99)}
.pp-tile-pic{flex:0 0 auto;width:46px;height:46px;border-radius:50%;background:var(--pp-amber-soft);display:flex;align-items:center;justify-content:center;font-size:24px;line-height:1}
.pp-tile-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pp-tile .pp-tile-name{font-weight:800;overflow-wrap:anywhere;line-height:1.2}
.pp-tile .pp-tile-meta{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;font-size:14px;color:var(--pp-text-2)}
.pp-tile .pp-tile-price{color:var(--pp-amber-text);font-size:17px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.pp-tile .pp-tile-stock{white-space:nowrap}
.pp-tile .pp-tile-stock.low{color:var(--pp-warn);font-weight:700}
.pp-tile .pp-tile-stock.empty{color:var(--pp-err);font-weight:700}
.pp-tile-plus{flex:0 0 auto;width:48px;height:48px;border-radius:12px;background:var(--pp-amber);color:var(--pp-amber-ink);display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700;line-height:1}
.pp-tile:hover .pp-tile-plus{background:var(--pp-amber-hover)}
.pp-tile.is-empty .pp-tile-pic{filter:grayscale(1);opacity:.6}
.pp-tile[aria-busy=true]{opacity:.65}
.pp-tile[disabled]{cursor:not-allowed;opacity:.45}
.pp-tally{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-height:14px}
.pp-tally:empty{display:none}
.pp-tally .g{display:inline-flex;gap:2px;align-items:center;position:relative}
.pp-tally .b{display:inline-block;width:3px;height:14px;border-radius:2px;background:var(--pp-amber)}
.pp-tally .g.full::after{content:"";position:absolute;left:-2px;right:-2px;top:6px;height:2px;background:var(--pp-amber-text);transform:rotate(-20deg)}
.pp-tally .n{font-size:12px;color:var(--pp-text-2);font-weight:700}
.pp-cat{margin:16px 0 8px;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--pp-text-2)}
.pp-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:var(--pp-tap);padding:10px 16px;border-radius:12px;border:1px solid var(--pp-line-strong);
  background:var(--pp-surface);color:var(--pp-text);font:inherit;font-weight:700;text-decoration:none;cursor:pointer}
.pp-btn.primary{background:var(--pp-amber);color:var(--pp-amber-ink);border-color:var(--pp-amber)}
.pp-btn.primary:hover{background:var(--pp-amber-hover)}
.pp-btn.danger{background:transparent;color:var(--pp-err);border-color:var(--pp-err)}
.pp-card.pp-alert{background:var(--pp-amber-soft);border:2px solid var(--pp-amber)}
.pp-card.pp-alert .pp-list li{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pp-btn.danger.armed{background:var(--pp-err);color:var(--pp-surface);border-color:var(--pp-err)}
.pp-btn.block{width:100%}
.pp-btn.pill{border-radius:999px}
.pp-btn.small{min-height:var(--pp-tap);padding:8px 14px;font-size:15px}
.pp-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pp-field{margin:0 0 12px}
.pp-field label{display:block;font-weight:700;margin:0 0 6px}
.pp-field input,.pp-field select,.pp-field textarea,.pp-input{width:100%;min-height:var(--pp-tap);border-radius:12px;border:1px solid var(--pp-line-strong);background:var(--pp-field);color:var(--pp-text);padding:10px 12px;font:inherit}
.pp-input.inline{width:auto;min-width:90px}
.pp-field .pp-hint{font-size:13px;color:var(--pp-text-2);margin-top:4px}
.pp-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.pp-list{list-style:none;margin:0;padding:0}
.pp-list li{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--pp-line)}
.pp-list li:last-child{border-bottom:0}
.pp-list .pp-li-main{min-width:0;overflow-wrap:anywhere}
.pp-list .pp-li-side{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.pp-badge{display:inline-block;font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px;background:var(--pp-surface-2);color:var(--pp-text-2);border:1px solid var(--pp-line)}
.pp-badge.ok{color:var(--pp-ok);border-color:var(--pp-ok)}.pp-badge.warn{color:var(--pp-warn);background:var(--pp-amber-soft);border-color:transparent}.pp-badge.err{color:var(--pp-err);background:var(--pp-err-soft);border-color:transparent}
.pp-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px}
.pp-tabs a{min-height:var(--pp-tap);display:inline-flex;align-items:center;padding:8px 14px;border-radius:999px;border:1px solid var(--pp-line-strong);color:var(--pp-text);text-decoration:none;background:var(--pp-surface)}
.pp-tabs a[aria-current=page]{background:var(--pp-amber);color:var(--pp-amber-ink);border-color:var(--pp-amber);font-weight:800}
.pp-empty{padding:16px;border:1px dashed var(--pp-line-strong);border-radius:var(--pp-radius);color:var(--pp-text-2)}
.pp-toast-wrap{position:fixed;left:0;right:0;bottom:80px;display:flex;justify-content:center;pointer-events:none;z-index:50;padding:0 12px}
.pp-toast{pointer-events:auto;display:flex;gap:12px;align-items:center;max-width:560px;width:100%;background:var(--pp-toast);color:var(--pp-toast-ink);border-radius:14px;padding:10px 12px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.pp-toast.err{background:var(--pp-err);color:#fff}
.pp-toast.wait{background:var(--pp-amber);color:var(--pp-amber-ink)}
.pp-toast .pp-toast-text{flex:1;min-width:0;overflow-wrap:anywhere}
.pp-toast .pp-btn{background:var(--pp-amber);color:var(--pp-amber-ink);border-color:var(--pp-amber)}
.pp-nav{position:fixed;left:0;right:0;bottom:0;background:var(--pp-bar);display:flex;z-index:40;padding-bottom:env(safe-area-inset-bottom)}
.pp-nav a{flex:1;min-height:60px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center;color:var(--pp-bar-ink-2);text-decoration:none;font-size:13px;font-weight:700;padding:4px}
.pp-nav a .i{font-size:20px;line-height:1}
.pp-nav a[aria-current=page]{color:var(--pp-bar-ink);background:rgba(255,255,255,.35)}
/* stock overview */
.pp-stock{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px}
.pp-stock-item{border:1px solid var(--pp-line);border-radius:12px;padding:10px 12px;background:var(--pp-surface-2)}
.pp-stock-item.low{border-color:var(--pp-amber);background:var(--pp-amber-soft)}
.pp-stock-item.empty{border-color:var(--pp-err);background:var(--pp-err-soft)}
.pp-stock-top{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.pp-stock-name{font-weight:800;overflow-wrap:anywhere}
.pp-stock-val{font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.pp-meter{height:8px;border-radius:4px;background:var(--pp-line);overflow:hidden;margin:6px 0 4px}
.pp-meter>span{display:block;height:100%;border-radius:4px;background:var(--pp-ok-bar)}
.low .pp-meter>span{background:var(--pp-amber)}.empty .pp-meter>span{background:var(--pp-err)}
.pp-stock-sub{font-size:13px;color:var(--pp-text-2)}
.pp-stock-item form{margin-top:8px}
.pp-presets{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
/* quick add stock */
.pp-again{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.pp-again form{margin:0}
.pp-again-item{position:relative}
.pp-again-item .pp-again-btn{padding-right:44px}
.pp-again-hide{position:absolute;top:4px;right:4px}
.pp-again-hide button{width:36px;height:36px;border-radius:10px;border:0;background:transparent;color:var(--pp-text-2);font:inherit;font-size:16px;cursor:pointer}
.pp-again-hide button:hover{background:var(--pp-surface-2);color:var(--pp-text)}
.pp-slist{display:flex;flex-direction:column;gap:6px}
.pp-srow{border:1px solid var(--pp-line);border-radius:12px;background:var(--pp-surface-2)}
.pp-srow.low{border-color:var(--pp-amber)}
.pp-srow.empty{border-color:var(--pp-err)}
.pp-srow.pp-new,.pp-srow:target{border-color:var(--pp-amber);box-shadow:0 0 0 2px var(--pp-amber-soft)}
.pp-srow>summary{list-style:none;display:flex;align-items:center;gap:10px;padding:8px 12px;min-height:var(--pp-tap);cursor:pointer}
.pp-srow>summary::-webkit-details-marker{display:none}
.pp-srow>summary::after{content:'▾';color:var(--pp-text-2);font-size:14px}
.pp-srow[open]>summary::after{content:'▴'}
.pp-srow-i{font-size:22px;line-height:1}
.pp-srow-main{flex:1;min-width:0}
.pp-srow-name{font-weight:700;overflow-wrap:anywhere}
.pp-srow .pp-meter{display:block;height:6px;margin:6px 0 2px}
.pp-srow-val{font-size:17px;white-space:nowrap}
.pp-srow-body{border-top:1px solid var(--pp-line);padding:10px 12px 12px}
.pp-srow-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.pp-srow-actions:empty{display:none}
.pp-srow-actions form{margin:0}
.pp-srow-actions .pp-presets{display:contents}
.pp-srow-actions .pp-btn.block{width:auto}
.pp-gone{margin-top:8px}
.pp-card.pp-fresh{border-color:var(--pp-ok);box-shadow:0 0 0 2px color-mix(in srgb,var(--pp-ok) 25%,transparent)}
.pp-newstock{margin-top:8px;padding:10px 12px;border:1px dashed var(--pp-line-strong);border-radius:12px}
.pp-newstock[hidden]{display:none}
.pp-srow-delete{margin-top:12px;padding-top:10px;border-top:1px solid var(--pp-line)}
.pp-srow-delete .pp-hint{margin:6px 0 0}
.pp-edit{margin-top:8px}
.pp-edit .pp-wide{grid-column:1/-1}
.pp-portion-edit{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;padding:8px 0;border-top:1px solid var(--pp-line)}
.pp-portion-edit form{margin:0}
.pp-portion-edit .pp-row{flex:1 1 260px}
.pp-again-btn{display:flex;align-items:center;gap:10px;width:100%;min-height:60px;text-align:left;padding:8px 12px;border-radius:12px;border:1px solid var(--pp-line-strong);background:var(--pp-surface);color:var(--pp-text);font:inherit;cursor:pointer}
.pp-again-btn:hover{border-color:var(--pp-amber);background:var(--pp-amber-soft)}
.pp-again-btn .i,.pp-type .i{font-size:26px;line-height:1}
.pp-again-btn b{display:block;overflow-wrap:anywhere}
.pp-again-btn .pp-muted{font-size:13px}
.pp-types{border:0;margin:0 0 12px;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.pp-type{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center;min-height:84px;padding:8px 4px;border-radius:12px;border:1px solid var(--pp-line-strong);background:var(--pp-surface);cursor:pointer}
.pp-type b{font-size:14px;line-height:1.15}.pp-type .pp-muted{font-size:12px;line-height:1.15}
.pp-type input,.pp-chip input{position:absolute;opacity:0;width:1px;height:1px}
.pp-type:has(input:checked){border:2px solid var(--pp-amber);background:var(--pp-amber-soft)}
.pp-type:has(input:focus-visible),.pp-chip:has(input:focus-visible){outline:3px solid var(--pp-focus);outline-offset:2px}
.pp-label-like{display:block;font-weight:700;margin:0 0 6px}
.pp-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.pp-chip{position:relative;cursor:pointer}
.pp-chip span{display:inline-flex;align-items:center;justify-content:center;min-width:56px;min-height:var(--pp-tap);padding:0 12px;border-radius:999px;border:1px solid var(--pp-line-strong);background:var(--pp-surface);font-weight:700}
.pp-chip:has(input:checked) span{background:var(--pp-amber);border-color:var(--pp-amber);color:var(--pp-amber-ink)}
.pp-stepper{display:flex;gap:6px;align-items:center;max-width:220px}
/* orders: quantity stepper and its buttons side by side, wrapping cleanly on a phone */
.pp-qtyrow{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:flex-end;margin-top:8px}
.pp-qtyrow .pp-field{margin:0}
.pp-subnav{flex-wrap:nowrap;overflow-x:auto;margin:0 0 12px;padding-bottom:2px}
.pp-opt{font-weight:400;font-size:13px;color:var(--pp-text-2)}
[data-pp-itemform] [hidden]{display:none}
.pp-subnav{gap:6px}
.pp-subnav .pp-btn{white-space:nowrap;padding:8px 8px;font-size:15px;gap:4px}
.pp-stepper .pp-btn{min-width:var(--pp-tap);font-size:22px;padding:0}
.pp-stepper .pp-input{text-align:center;font-weight:800;font-size:18px}
.pp-preview{margin:4px 0 12px;padding:10px 12px;border-radius:12px;border:1px dashed var(--pp-line-strong);color:var(--pp-text-2);font-size:14px}
.pp-preview:empty{display:none}
.pp-preview b{color:var(--pp-text)}
@media(max-width:520px){.pp-types{grid-template-columns:repeat(2,minmax(0,1fr))}.pp-type{flex-direction:row;justify-content:flex-start;gap:10px;min-height:56px;text-align:left;padding:8px 10px}.pp-type .pp-muted{display:none}}
.pp-tap{display:grid;grid-template-columns:minmax(220px,320px) 1fr;grid-template-areas:"people menu";gap:16px;align-items:start}
.pp-tap-people{grid-area:people;min-width:0}.pp-tap-menu{grid-area:menu;min-width:0}
[hidden]{display:none!important}
.pp-check{display:flex;align-items:center;gap:10px;min-height:var(--pp-tap);margin:0 0 8px;font-weight:700;cursor:pointer}
.pp-check input{width:24px;height:24px;margin:0;accent-color:var(--pp-amber)}
.pp-people{max-height:70vh;overflow:auto}
.pp-person{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:56px;padding:6px 10px;border-radius:12px;color:var(--pp-text);text-decoration:none;border:1px solid transparent}
.pp-person:hover{background:var(--pp-surface-2)}
.pp-person[aria-current=true]{border-color:var(--pp-amber);background:var(--pp-amber-soft)}
.pp-avatar{flex:0 0 auto;width:38px;height:38px;border-radius:50%;background:var(--pp-amber-soft);color:var(--pp-amber-text);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px}
.pp-person .pp-person-name{flex:1;min-width:0;overflow-wrap:anywhere}
.pp-pinned{position:sticky;top:0;z-index:5;border:2px solid var(--pp-amber);border-radius:var(--pp-radius);padding:12px 14px;display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;background:var(--pp-amber-soft)}
.pp-pinned .pp-pinned-name{font-size:20px;font-weight:800;overflow-wrap:anywhere}
.pp-pinned>div:first-child{min-width:0}
.pp-pinned>div:last-child{flex:0 0 auto}
.pp-pinned .pp-num,.pp-pinned #pp-open,.pp-amount{white-space:nowrap}
.pp-qr{background:#fff;border-radius:12px;padding:10px;width:200px;max-width:100%;height:auto}
.pp-pay{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start}
.pp-kv{display:grid;grid-template-columns:auto 1fr auto;gap:6px 10px;align-items:center}
.pp-kv dt{color:var(--pp-text-2)}.pp-kv dd{margin:0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.pp-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pp-table{width:100%;border-collapse:collapse}
.pp-table th,.pp-table td{padding:8px;border-bottom:1px solid var(--pp-line);text-align:left;vertical-align:top}
.pp-table td.num,.pp-table th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.pp-level-low{color:var(--pp-warn)}.pp-level-empty{color:var(--pp-err)}.pp-level-ok{color:var(--pp-ok)}
details.pp-more>summary{cursor:pointer;min-height:var(--pp-tap);display:flex;align-items:center;font-weight:700}
@media(max-width:760px){
  .pp-tap{display:flex;flex-direction:column;align-items:stretch;gap:12px}
  .pp-tap[data-selected='0'] .pp-tap-people{order:-1}
  .pp-people{max-height:55vh}
  .pp-tap[data-selected='1'] .pp-people{max-height:40vh}
  .pp-money .pp-amount{font-size:24px}
  .pp-pay{grid-template-columns:1fr}
  .pp-tiles{grid-template-columns:1fr}
  .pp-table{display:block;overflow-x:auto}
}
@media(prefers-reduced-motion:no-preference){.pp-tile{transition:border-color .12s,transform .06s}}