.staff{background:var(--bg)}
.small{font-size:13px}
.login{min-height:100vh;display:grid;place-items:center;padding:20px}
.login__box{width:min(360px,100%);text-align:center;background:var(--bg2);border:1px solid var(--line);border-radius:26px;padding:30px 26px;display:grid;gap:12px;justify-items:center}
.login__box img{border-radius:50%}
.login__box h1{font-size:24px;margin:6px 0 0}
.login__box p{margin:0}
.pin{width:100%;text-align:center;font:800 28px var(--head);letter-spacing:.4em;background:var(--card);color:var(--text);border:1.5px solid var(--line);border-radius:14px;padding:12px}
.pin:focus{outline:none;border-color:var(--orange)}

.s-top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:18px;padding:10px 18px;background:rgba(246,240,231,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);flex-wrap:wrap}
.s-top__brand{display:flex;align-items:center;gap:8px;font-family:var(--head)}
.s-top__brand img{border-radius:50%}
.s-nav{display:flex;gap:6px;flex-wrap:wrap}
.s-nav button{background:transparent;color:var(--muted);border:0;border-radius:10px;padding:9px 13px;font:700 15px var(--body);cursor:pointer;display:flex;align-items:center;gap:6px}
.s-nav button.is-active{background:var(--red);color:#fff}
.pill{background:var(--red);color:#fff;border-radius:999px;font-size:12px;padding:1px 7px}
.s-top__me{margin-left:auto;display:flex;align-items:center;gap:12px}
.clock{background:var(--card);color:var(--text);border:1px solid var(--line);border-radius:999px;padding:7px 13px;font:700 13px var(--body);cursor:pointer}
.clock.is-in{border-color:var(--ok);color:var(--ok)}
.s-main{padding:20px 18px 60px;max-width:1400px;margin:0 auto}
.s-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.s-head h2{margin:0;font-size:26px}
.seg{display:inline-flex;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:3px}
.seg button{background:transparent;color:var(--muted);border:0;border-radius:9px;padding:7px 12px;font:700 14px var(--body);cursor:pointer}
.seg button.is-on{background:var(--red);color:#fff}
.btn--sm{padding:9px 15px;font-size:14px}

/* канбан заказов */
.board{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-items:start}
.col h3{display:flex;justify-content:space-between;font-size:15px;color:var(--muted);margin:0 0 10px;font-family:var(--body);font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.order{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--muted);border-radius:16px;padding:14px;margin-bottom:12px;animation:pop .3s ease}
@keyframes pop{from{transform:scale(.97);opacity:.4}}
.order.s-new{border-left-color:var(--red)}
.order.s-cooking{border-left-color:var(--orange)}
.order.s-ready{border-left-color:var(--ok)}
.order.is-fresh{box-shadow:0 0 0 2px var(--red)}
.order__top{display:flex;justify-content:space-between;gap:8px;font-weight:800}
.order__src{font:700 11px var(--body);text-transform:uppercase;letter-spacing:.06em;background:var(--bg2);border:1px solid var(--line);border-radius:6px;padding:2px 6px;color:var(--muted)}
.order__age{color:var(--muted);font-weight:700;font-size:13px}
.order__age.late{color:var(--red)}
.order ul{margin:10px 0;padding-left:18px}
.order li{margin:2px 0}
.order__meta{font-size:13px;color:var(--muted);display:grid;gap:2px}
.order__meta a{color:var(--text)}
.order__total{font:800 18px var(--head);margin:8px 0}
.order__btns{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.order__btns .btn{flex:1;padding:10px 12px;font-size:14px}
.btn--ok{background:var(--ok);color:#fff}
.btn--muted{background:var(--bg2);color:var(--muted);border:1px solid var(--line)}
.col__empty{color:var(--muted);font-size:14px;border:1.5px dashed var(--line);border-radius:14px;padding:20px;text-align:center}

/* таблицы и карточки */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-bottom:18px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px}
.kpi span{color:var(--muted);font-size:13px;font-weight:700}
.kpi b{display:block;font:800 26px var(--head);margin-top:4px}
.panel{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px;margin-bottom:16px}
.panel h3{margin-top:0}
.bars{display:grid;gap:7px}
.bar{display:grid;grid-template-columns:120px 1fr 110px;gap:10px;align-items:center;font-size:14px}
.bar__track{height:12px;background:var(--bg2);border-radius:6px;overflow:hidden}
.bar__fill{height:100%;background:linear-gradient(90deg,var(--red),var(--orange));border-radius:6px}
.bar span:last-child{text-align:right;font-weight:700}
.bar span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th,.tbl td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--line)}
.tbl th{color:var(--muted);font-weight:700}
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}

.recipes{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.recipe{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px}
.recipe h3{margin:0 0 4px}
.recipe .cat{color:var(--yellow);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.recipe pre{white-space:pre-wrap;font:15px/1.6 var(--body);color:var(--text);margin:8px 0;background:var(--bg2);border-radius:12px;padding:12px}
.recipe .lbl{font-weight:800;font-size:13px;color:var(--muted);margin-top:10px}

.week{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.day{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px;min-height:120px}
.day.is-today{border-color:var(--orange)}
.day h4{margin:0 0 8px;font-size:13px;color:var(--muted)}
.shift{background:var(--bg2);border-radius:9px;padding:6px 8px;margin-bottom:6px;font-size:13px;display:flex;justify-content:space-between;gap:6px}
.shift b{display:block}
.shift .link-btn{font-size:16px;text-decoration:none}

@media (max-width:900px){
  .board,.two{grid-template-columns:1fr}
  .week{grid-template-columns:1fr}
  .day{min-height:0}
  .s-top__me{margin-left:0;width:100%}
  .bar{grid-template-columns:96px 1fr 92px}
}
