/* Layout: phone-first column; schedule band → severity tabs → order cards → sticky basket */
:root{
  /* 견생냥품 공식 홈페이지 색: 짙은 버건디 #530401 · 벽돌색 #9E3424 · 크림 #F3ECD7 · 살구 #F8DABF */
  --bg:#f7f1e3; --card:#ffffff; --ink:#2b1a17; --muted:#7a625c; --line:#eadfc8;
  --accent:#9e3424; --accent-ink:#ffffff; --accent-soft:#f8dabf;
  --hero:#530401; --hero-ink:#f3ecd7;
  --red:#c62f22; --red-soft:#fbe2de; --orange:#d9731b; --orange-soft:#fcebd8;
  --yellow:#9a7400; --yellow-soft:#f7efcf; --green:#2f8a4e; --green-soft:#e1f1e5;
  --grey-soft:#f1ebdd;
  --display:"Pretendard",system-ui,sans-serif;
  --body:"Pretendard",system-ui,-apple-system,sans-serif;
  --mono:"Pretendard",ui-monospace,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#1a1110; --card:#251917; --ink:#f3ecd7; --muted:#b39e92; --line:#3a2925;
  --accent:#e3836b; --accent-ink:#1a1110; --accent-soft:#3d221c;
  --hero:#3b0a06; --hero-ink:#f3ecd7;
  --red:#ff6b5e; --red-soft:#3a1d1a; --orange:#f5a04f; --orange-soft:#3a2a17;
  --yellow:#e2bd3c; --yellow-soft:#342c12; --green:#5fcf85; --green-soft:#16301f; --grey-soft:#2e201d; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#1a1110; --card:#251917; --ink:#f3ecd7; --muted:#b39e92; --line:#3a2925;
  --accent:#e3836b; --accent-ink:#1a1110; --accent-soft:#3d221c;
  --hero:#3b0a06; --hero-ink:#f3ecd7;
  --red:#ff6b5e; --red-soft:#3a1d1a; --orange:#f5a04f; --orange-soft:#3a2a17;
  --yellow:#e2bd3c; --yellow-soft:#342c12; --green:#5fcf85; --green-soft:#16301f; --grey-soft:#2e201d; color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.5;margin:0}
.wrap{max-width:560px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:16px 170px;display:flex;flex-direction:column;gap:14px}
.top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.brand{font-family:var(--display);font-weight:800;font-size:24px;line-height:1.1;color:var(--hero)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .brand{color:var(--ink)}}
.paw{margin-right:4px}
.brand small{display:block;font-family:var(--body);font-weight:400;font-size:12px;color:var(--muted);margin-top:2px}
select,input[type=date]{font:inherit;font-size:13px;padding:6px 8px;border-radius:8px;border:1px solid var(--line);background:var(--card);color:var(--ink)}
.deadline{background:var(--hero);color:var(--hero-ink);border-radius:16px;padding:16px;display:grid;gap:8px}
.deadline .lbl{font-size:12px;opacity:.85}
.deadline .big{font-family:var(--display);font-weight:800;font-size:26px;line-height:1.15}
.deadline .row{display:flex;justify-content:space-between;gap:8px 12px;flex-wrap:wrap;font-size:13px}
.deadline b{font-family:var(--mono)}
.deadline button{justify-self:start;font:inherit;font-size:13px;font-weight:600;border:1px solid currentColor;background:transparent;color:inherit;border-radius:10px;padding:6px 12px;cursor:pointer}
.panel{background:var(--card);border-radius:16px;padding:14px;display:grid;gap:10px}
.panel h2{font-family:var(--display);font-weight:700;font-size:18px;margin:0}
.hint{font-size:13px;color:var(--muted);margin:0}
.sched{display:grid;gap:8px}
.round{display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;padding:10px 12px;border-radius:12px;background:var(--bg)}
.round.skip{opacity:.55}
.round .t{font-weight:600}
.round .s{font-size:12px;color:var(--muted);grid-column:1/2}
.round label{font-size:13px;display:flex;gap:6px;align-items:center;grid-row:1/3;grid-column:2}
.round .arr{grid-column:1/-1;display:flex;gap:8px;align-items:center;font-size:12px;color:var(--muted)}
.counts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.cnt{border:0;border-radius:12px;padding:10px 4px;text-align:center;cursor:pointer;font:inherit;color:var(--ink);background:var(--card);outline:2px solid transparent}
.cnt .n{font-family:var(--mono);font-size:22px;font-weight:800;display:block;line-height:1.2}
.cnt .t{font-size:12px;color:var(--muted)}
.cnt.on{outline-color:var(--hero)}
.cnt.s0 .n{color:var(--red)} .cnt.s1 .n{color:var(--orange)} .cnt.s2 .n{color:var(--yellow)} .cnt.s3 .n{color:var(--green)}
button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.list{display:flex;flex-direction:column;gap:8px}
.item{background:var(--card);border-radius:14px;padding:12px 12px 12px 14px;display:grid;grid-template-columns:1fr auto;gap:6px 10px;border-left:5px solid var(--line)}
.item.l0{border-left-color:var(--red)} .item.l1{border-left-color:var(--orange)} .item.l2{border-left-color:var(--yellow)} .item.l3{border-left-color:var(--green)}
.item .nm{font-weight:600;min-width:0;overflow-wrap:anywhere}
.item .cat{font-size:12px;color:var(--muted);font-weight:400}
.tags{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px}
.tag{font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;background:var(--grey-soft);color:var(--muted)}
.tag.warn{background:var(--orange-soft);color:var(--orange)} .tag.bad{background:var(--red-soft);color:var(--red)} .tag.ok{background:var(--green-soft);color:var(--green)}
.pill{font-size:12px;font-weight:600;padding:2px 8px;border-radius:999px;white-space:nowrap;align-self:start}
.p0{background:var(--red-soft);color:var(--red)} .p1{background:var(--orange-soft);color:var(--orange)} .p2{background:var(--yellow-soft);color:var(--yellow)} .p3{background:var(--green-soft);color:var(--green)}
.meta{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;color:var(--muted)}
.meta b{font-family:var(--mono);color:var(--ink);font-weight:600}
.order{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:8px;border-top:1px dashed var(--line);flex-wrap:wrap}
.step{display:flex;align-items:center;gap:6px}
.step button{width:34px;height:34px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font-size:18px;cursor:pointer}
.step output{font-family:var(--mono);font-weight:600;min-width:2.6em;text-align:center}
.step small{font-size:11px;color:var(--muted)}
.add{font:inherit;font-size:13px;font-weight:600;padding:8px 12px;border-radius:10px;border:1px solid var(--accent);background:transparent;color:var(--accent);cursor:pointer}
.add.on{background:var(--accent);color:var(--accent-ink)}
.add[disabled]{border-color:var(--line);color:var(--muted);cursor:not-allowed}
.facts{display:grid;grid-template-columns:auto 1fr;gap:8px 12px;font-size:13px;align-items:baseline}
.facts .k{font-family:var(--mono);font-weight:600;font-size:18px;color:var(--accent);text-align:right}
.facts .k.w{color:var(--orange)}
details{background:var(--card);border-radius:16px;padding:12px 14px}
summary{cursor:pointer;font-weight:600}
details ul{margin:8px 0 0;padding-left:18px;font-size:13px;color:var(--muted)}
details li{margin:2px 0}
.basket{position:fixed;left:0;right:0;bottom:calc(58px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:10px max(16px,env(safe-area-inset-right,0px)) 10px max(16px,env(safe-area-inset-left,0px));z-index:5}
.basket .in{max-width:560px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:10px}
.basket b{font-family:var(--mono)}
.basket small{display:block;font-size:11px;opacity:.75}
.btn{font:inherit;font-weight:700;border:0;border-radius:12px;padding:10px 14px;background:var(--accent-soft);color:var(--ink);cursor:pointer;white-space:nowrap}
.sheet{background:var(--card);border-radius:16px;padding:14px;display:grid;gap:6px;font-size:13px}
.sheet .r{display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line);padding:4px 0}
.sheet .r span:last-child{font-family:var(--mono);white-space:nowrap}
.foot{font-size:11px;color:var(--muted);text-align:center}

[hidden]{display:none!important}
section[data-view]{display:flex;flex-direction:column;gap:14px}
.big-brand{font-size:32px;margin:24px 0 8px}
.fld{display:grid;gap:4px;font-size:13px;color:var(--muted)}
.fld input,.search,.mini select,.mini input{font:inherit;font-size:16px;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--ink);width:100%}
.search{background:var(--card)}
.primary{font:inherit;font-weight:700;border:0;border-radius:12px;padding:12px;background:var(--accent);color:var(--accent-ink);cursor:pointer}
.primary[disabled]{opacity:.6}
.link{font:inherit;font-size:13px;background:none;border:0;color:var(--accent);cursor:pointer;justify-self:start;padding:0}
.btn-line{font:inherit;font-size:13px;font-weight:600;border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:10px;padding:8px 12px;cursor:pointer;justify-self:start}
.tabs{position:fixed;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(5,1fr);background:var(--card);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px);z-index:6}
.tabs button{font:inherit;font-size:12px;border:0;background:none;color:var(--muted);padding:6px 0 8px;display:grid;gap:0;cursor:pointer;height:58px;align-content:center}
.tabs button span{font-size:18px;line-height:1.2}
.tabs button.on{color:var(--accent);font-weight:800}
.panel-d{background:var(--card);border-radius:16px;padding:12px 14px}
.recent{display:grid;gap:6px;font-size:13px}
.recent .r{display:flex;justify-content:space-between;gap:8px;border-bottom:1px solid var(--line);padding:6px 0;align-items:center}
.recent .r small{color:var(--muted);display:block}
.recent .x{font:inherit;font-size:12px;border:1px solid var(--line);background:none;color:var(--muted);border-radius:8px;padding:3px 8px;cursor:pointer}
.mini{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-top:8px;border-top:1px dashed var(--line)}
.mini .full{grid-column:1/-1}
.mini button{font:inherit;font-size:14px;font-weight:600;border-radius:10px;padding:10px;border:1px solid var(--accent);background:transparent;color:var(--accent);cursor:pointer}
.mini button.fill{background:var(--accent);color:var(--accent-ink)}
.mini label{font-size:12px;color:var(--muted);display:grid;gap:4px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:140px;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:12px;font-size:14px;z-index:9;max-width:90vw}
.nm a{color:inherit}
.news-item{border-bottom:1px solid var(--line);padding:8px 0}
.news-item .k{font-size:11px;font-weight:700;color:var(--accent)}
.news-item p{margin:4px 0 0;font-size:13px;color:var(--muted);white-space:pre-wrap}

/* 오늘 매출 */
.today{all:unset;box-sizing:border-box;cursor:pointer;background:var(--card);border-radius:16px;padding:14px;display:grid;gap:10px;border:1px solid var(--line)}
.today:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.today-h{display:flex;justify-content:space-between;align-items:baseline;font-weight:700}
.today-h small{font-weight:400;font-size:12px;color:var(--muted)}
.today-g{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.today-g div{display:grid;gap:2px;min-width:0}
.today-g b{font-size:18px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.today-g div:first-child b{color:var(--accent)}
.today-g small{font-size:11px;color:var(--muted)}
.today-f{font-size:12px;color:var(--muted)}
@media (max-width:360px){.today-g{grid-template-columns:repeat(2,1fr)}}
/* 매출 */
.dayNav{display:grid;grid-template-columns:auto 1fr auto auto;gap:8px;align-items:center}
.dayNav input{font:inherit;font-size:16px;padding:8px 10px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--ink);width:100%}
.dayNav .btn-line{background:var(--card)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px 8px}
.stats div{display:grid;gap:2px}
.stats b{font-size:17px;font-weight:800;font-variant-numeric:tabular-nums}
.stats small{font-size:11px;color:var(--muted)}
.stats .main b{color:var(--accent);font-size:20px}
.rc{background:var(--card);border-radius:14px;padding:12px 14px;display:grid;gap:6px;border-left:5px solid var(--accent-soft)}
.rc.cancel{border-left-color:var(--red);opacity:.85}
.rc-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.rc-h .tm{font-weight:800;font-variant-numeric:tabular-nums}
.rc-h .amt{font-weight:800;font-size:17px;font-variant-numeric:tabular-nums}
.rc-p{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:12px;color:var(--muted)}
.rc-p b{color:var(--ink);font-weight:600}
.rc ul{margin:0;padding:6px 0 0;list-style:none;border-top:1px dashed var(--line);display:grid;gap:3px;font-size:13px}
.rc li{display:flex;justify-content:space-between;gap:10px}
.rc li span:last-child{white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--muted)}
.rc mark{background:var(--accent-soft);color:inherit;border-radius:3px;padding:0 2px}
.top{margin:8px 0 0;padding-left:20px;font-size:13px;display:grid;gap:3px}
.top li span{color:var(--muted);font-variant-numeric:tabular-nums}
/* 재고 */
.filters{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.filters select{font:inherit;font-size:15px;padding:9px 10px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--ink);width:100%}
.prow{background:var(--bg);border-radius:12px;padding:10px 12px;display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:center}
.prow .nm{font-weight:600;font-size:14px;min-width:0;overflow-wrap:anywhere}
.prow .nm small{display:block;font-weight:400;font-size:12px;color:var(--muted)}
.prow .qty{font-weight:800;font-size:18px;text-align:right;font-variant-numeric:tabular-nums}
.prow .qty small{display:block;font-weight:400;font-size:11px;color:var(--muted)}
.prow .qty.neg{color:var(--red)}
.prow .ed{grid-column:1/-1;display:grid;grid-template-columns:1fr auto auto;gap:6px}
.prow .ed input{font:inherit;font-size:16px;padding:8px 10px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--ink);width:100%;min-width:0}
.prow .ed button{font:inherit;font-size:13px;font-weight:700;border-radius:10px;padding:8px 10px;border:1px solid var(--accent);background:var(--accent);color:var(--accent-ink);cursor:pointer;white-space:nowrap}
.prow .ed button.alt{background:transparent;color:var(--accent)}
.prow .inb{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr auto;gap:6px}
.prow .inb input,.prow .inb select{font:inherit;font-size:15px;padding:8px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--ink);width:100%;min-width:0}
.prow .inb button{font:inherit;font-size:13px;font-weight:700;border-radius:10px;padding:8px 10px;border:0;background:var(--accent);color:var(--accent-ink);cursor:pointer}
.plist{display:grid;gap:8px}