:root{
  --bg:#F5F5F2; --panel:#FFFFFF; --ink:#1E1E1C; --sub:#6B6B66; --line:#DEDDD7; --ph:#ECEBE6;
  --shu:#C8372D; --shu-ink:#fff;
  --p100:#9AA0A6; --p200:#9AA0A6; --p300:#9AA0A6;
  --p500:#8A8A84; --p800:#C8891B; --p1000:#C8372D; --p1200:#2F7F99; --p1500:#2F7A5B; --p2000:#2C5A9E; --p3000:#B08A2E; --p5000:#6D4A93; --pother:#7A6A55;
  --tint:.10;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#161614; --panel:#22221F; --ink:#F0EFEA; --sub:#A3A29B; --line:#3A3935; --ph:#2C2C28;
    --p100:#B4BAC0; --p200:#B4BAC0; --p300:#B4BAC0;
    --p500:#A8A8A0; --p800:#E0A63F; --p1000:#E0574C; --p1200:#5AB3CE; --p1500:#4FA37F; --p2000:#5D8BD1; --p3000:#D1AA4B; --p5000:#9A78C2; --pother:#B09A7C;
    --tint:.18;
  }
}
:root[data-theme="dark"]{
  --bg:#161614; --panel:#22221F; --ink:#F0EFEA; --sub:#A3A29B; --line:#3A3935; --ph:#2C2C28;
  --p100:#B4BAC0; --p200:#B4BAC0; --p300:#B4BAC0;
  --p500:#A8A8A0; --p800:#E0A63F; --p1000:#E0574C; --p1200:#5AB3CE; --p1500:#4FA37F; --p2000:#5D8BD1; --p3000:#D1AA4B; --p5000:#9A78C2; --pother:#B09A7C;
  --tint:.18;
}
*,*::before,*::after{box-sizing:inherit}
html{height:100%;scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;height:100%;background:var(--bg);color:var(--ink);
  font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic",system-ui,sans-serif;
  -webkit-tap-highlight-color:transparent;font-feature-settings:"palt"}
button,input,select{font:inherit;color:inherit}
button{border:0;background:none;cursor:pointer;touch-action:manipulation}
button:focus-visible,input:focus-visible{outline:3px solid var(--shu);outline-offset:2px}
img{max-width:100%;display:block}
.app{display:flex;flex-direction:column;height:100%;max-width:1100px;margin:0 auto}
header{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line);background:var(--panel)}
.mark{-webkit-user-select:none;user-select:none;width:30px;height:30px;border-radius:6px;background:var(--shu);display:grid;place-items:center;color:#fff;font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-size:17px;flex:none}
h1{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-size:17px;margin:0;flex:1;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tabs{display:flex;background:var(--bg);border-radius:10px;padding:3px;flex:none}
.tabs button{padding:8px 12px;border-radius:8px;font-weight:700;font-size:14px;color:var(--sub)}
.tabs button[aria-selected="true"]{background:var(--panel);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.12)}
main{flex:1;overflow:auto;padding:0 12px 16px}
.filters{position:sticky;top:0;z-index:2;background:var(--bg);display:flex;gap:6px;overflow-x:auto;padding:10px 0 8px}
.filters button{flex:none;padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:var(--panel);font-weight:700;font-size:14px}
.filters button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.filters.wishes{top:44px;padding-top:0;padding-bottom:8px}
#wishes2{padding-top:0;padding-bottom:8px;top:0}
#wishes2 button{border-style:solid;font-size:13px}
.filters.wishes button{font-size:13px;padding:6px 12px;border-style:dashed}
.filters.wishes button[aria-pressed="true"]{background:var(--shu);color:#fff;border-color:var(--shu);border-style:solid}
.filters.wishes button.pf{border-style:solid;border-color:var(--c);color:var(--c);font-weight:900;font-size:14px}
.filters.wishes button.pf[aria-pressed="true"]{background:var(--c);color:#fff;border-color:var(--c)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}
.item{position:relative;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:block;aspect-ratio:4/3;transition:transform .08s;border-bottom:5px solid var(--c)}
.item:active{transform:scale(.97)}
.thumb{position:absolute;inset:0;background:var(--ph);display:grid;place-items:center;overflow:hidden}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb .ini{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-size:44px;color:var(--c);opacity:.5;margin-bottom:18px}
.item .meta{position:absolute;left:0;right:0;bottom:0;padding:26px 8px 7px;
  background:linear-gradient(to top,rgba(0,0,0,.80),rgba(0,0,0,.55) 55%,transparent);
  display:flex;align-items:flex-end;gap:6px}
.item .nm{flex:1;min-width:0;font-weight:700;font-size:14px;line-height:1.25;color:#fff;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 1px 2px rgba(0,0,0,.5)}
.item .pr{flex:none;font-weight:900;font-size:15px;color:#fff;background:var(--c);
  padding:2px 7px;border-radius:6px;font-variant-numeric:tabular-nums;white-space:nowrap;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.item .no{position:absolute;left:6px;top:6px;background:rgba(0,0,0,.58);color:#fff;font-size:12px;font-weight:900;padding:1px 7px;border-radius:7px;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.item{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.item .qpill{position:absolute;right:5px;top:5px;display:flex;align-items:stretch;background:var(--c);color:#fff;
  border-radius:17px;overflow:hidden;box-shadow:0 0 0 2px var(--panel);height:34px}
.item .qpill button{width:34px;color:#fff;font-weight:900;font-size:19px;line-height:1;background:rgba(0,0,0,.22)}
.item .qpill button:active{background:rgba(0,0,0,.38)}
.item .qpill b{min-width:26px;display:grid;place-items:center;font-weight:900;font-size:17px;font-variant-numeric:tabular-nums}
.zoombox{background:var(--panel);border-radius:18px;width:min(560px,100%);max-height:92vh;overflow:auto;padding:14px}
.zimg{background:var(--ph);border-radius:12px;overflow:hidden;display:grid;place-items:center;min-height:200px;max-height:62vh}
.zimg img{width:100%;height:100%;max-height:62vh;object-fit:contain}
.zimg .ini{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-size:90px;color:var(--c);opacity:.5;padding:30px}
.zmeta{display:flex;align-items:center;gap:10px;margin-top:12px}
.zno{background:var(--ink);color:var(--bg);font-weight:900;font-size:16px;padding:3px 10px;border-radius:8px;font-variant-numeric:tabular-nums}
.znm{flex:1;font-weight:700;font-size:17px;line-height:1.35}
.zpr{font-weight:900;font-size:22px;color:#fff;padding:3px 10px;border-radius:8px;font-variant-numeric:tabular-nums}
.zact{display:grid;grid-template-columns:1fr 1.6fr;gap:8px;margin-top:14px}
.zact button{border:1px solid var(--line);border-radius:12px;padding:14px 0;font-weight:900;font-size:16px;background:var(--panel)}
.zact .primary{background:var(--shu);color:#fff;border-color:var(--shu)}
.item.flash{animation:fl .25s}
@keyframes fl{from{background:color-mix(in srgb,var(--c) 30%,var(--panel))}}
@media (prefers-reduced-motion:reduce){.item,.item.flash{animation:none;transition:none}}
.empty{color:var(--sub);font-size:14px;padding:18px 2px;line-height:1.7}
.empty button{margin-top:10px}

.pay{background:var(--panel);border-top:1px solid var(--line);padding:10px 12px 12px;display:grid;gap:8px}
.cart{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;min-height:34px;align-items:center}
.cart:empty::before{content:"授与品をタップすると、ここに並びます";color:var(--sub);font-size:13px}
.chip{flex:none;display:inline-flex;align-items:center;gap:6px;background:color-mix(in srgb,var(--c) calc(var(--tint)*100%),var(--panel));border:1px solid color-mix(in srgb,var(--c) 45%,transparent);border-radius:999px;padding:3px 3px 3px 4px;font-size:13px;font-weight:700;white-space:nowrap}
.chip img,.chip .ci{width:26px;height:26px;border-radius:13px;object-fit:cover;background:var(--ph)}
.chip button{width:26px;height:26px;border-radius:13px;background:var(--panel);font-weight:900;border:1px solid var(--line)}
.sums{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.sum{background:var(--bg);border-radius:10px;padding:6px 10px}
.sum small{display:block;font-size:12px;color:var(--sub);font-weight:700}
.sum .pcs{color:#fff;background:var(--ink);border-radius:5px;padding:0 6px;margin-left:4px;font-variant-numeric:tabular-nums}
.sum .pcs:empty{display:none}
.sum b{font-size:24px;font-weight:900;font-variant-numeric:tabular-nums;display:block;white-space:nowrap}
.sum.change b{color:var(--shu)}
.sum.short b{color:var(--sub);font-size:18px;line-height:1.55}
.money{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.money button{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 0;font-weight:900;font-size:15px}
.money button.exact{background:color-mix(in srgb,var(--shu) 12%,var(--panel));border-color:color-mix(in srgb,var(--shu) 40%,transparent);color:var(--shu)}
.actions{display:grid;grid-template-columns:1fr 1fr 2fr;gap:6px}
.actions button{border-radius:10px;padding:13px 0;font-weight:900;font-size:15px;border:1px solid var(--line);background:var(--panel)}
.actions .ok{background:var(--shu);color:var(--shu-ink);border-color:var(--shu);font-size:17px}
button:disabled{opacity:.35;cursor:default}

.sec h2{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-size:17px;margin:18px 2px 8px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-top:12px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px}
.kpi small{color:var(--sub);font-weight:700;font-size:12px}
.kpi b{display:block;font-size:26px;font-weight:900;font-variant-numeric:tabular-nums}
.tablewrap{overflow-x:auto;background:var(--panel);border:1px solid var(--line);border-radius:12px}
table{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}
th,td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
th:first-child,td:first-child{text-align:left}
th{font-size:12px;color:var(--sub)}
tr:last-child td{border-bottom:0}
td .dot{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;background:var(--c)}
.hist{display:grid;gap:6px}
.h{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:flex;gap:10px;align-items:center}
.h .t{font-size:12px;color:var(--sub);font-variant-numeric:tabular-nums}
.h .d{flex:1;font-size:13px;line-height:1.5}
.h .y{font-weight:900;font-variant-numeric:tabular-nums}
.h button{border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:13px;font-weight:700}
.h.void{opacity:.45}.h.void .y{text-decoration:line-through}
.danger{margin-top:20px;border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-weight:700;color:var(--shu);background:var(--panel)}

.addbar{display:flex;gap:8px;align-items:center;padding:12px 0 4px}
.addbar .count{flex:1;color:var(--sub);font-size:14px}
.primary{background:var(--shu);color:#fff;border-radius:10px;padding:12px 18px;font-weight:900;font-size:15px}
.rows{display:grid;gap:6px;margin-top:8px}
.row{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-left:6px solid var(--c);border-radius:10px;padding:6px 8px}
.row .rt{width:52px;height:52px;border-radius:8px;overflow:hidden;background:var(--ph);flex:none;display:grid;place-items:center}
.row .rt img{width:100%;height:100%;object-fit:cover}
.row .rt .ini{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-size:22px;color:var(--c);opacity:.6}
.row .rn{flex:1;min-width:0}
.row .rn b{display:block;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .rn span{font-size:13px;color:var(--sub)}
.row .rn .nophoto{color:var(--shu);font-weight:700}
.row .mv{display:flex;flex-direction:column;gap:2px}
.row .mv button{width:32px;height:24px;border:1px solid var(--line);border-radius:6px;font-size:12px}
.row .ed{border:1px solid var(--line);border-radius:8px;padding:8px 12px;font-weight:700;font-size:14px}

.overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);display:none;place-items:center;padding:16px;z-index:10}
.overlay.show{display:grid}
.dialog{background:var(--panel);border-radius:18px;padding:26px 22px 18px;width:min(420px,100%);text-align:center}
.dialog small{color:var(--sub);font-weight:700}
.dialog .big{font-size:56px;font-weight:900;color:var(--shu);font-variant-numeric:tabular-nums;margin:4px 0 6px}
.dialog .detail{color:var(--sub);font-size:14px;margin-bottom:18px}
.dialog button{width:100%;background:var(--shu);color:#fff;border-radius:12px;padding:15px;font-weight:900;font-size:17px}
.dialog .ghost{background:none;color:var(--ink);border:1px solid var(--line);margin-top:8px}

.sheet{background:var(--panel);border-radius:18px;width:min(520px,100%);max-height:100%;overflow:auto;padding:16px}
.sheet h3{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;margin:0 0 12px;font-size:18px}
.photo{position:relative;aspect-ratio:4/3;border-radius:12px;background:var(--ph);border:2px dashed var(--line);display:grid;place-items:center;overflow:hidden;width:100%;text-align:center;color:var(--sub);font-weight:700}
.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.photo.has{border-style:solid}
.photo .hint{font-size:15px;line-height:1.6}
.photo .hint b{display:block;font-size:34px;line-height:1.1;color:var(--shu)}
.photo-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:6px}
.photo-actions button{font-size:13px;font-weight:700;color:var(--sub);padding:4px 6px}
.field{margin-top:14px}
.field label,.field .lb{display:block;font-size:13px;font-weight:700;color:var(--sub);margin-bottom:6px}
.field input[type=text],.field input[type=number]{width:100%;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);font-size:17px}
.opts{display:flex;flex-wrap:wrap;gap:6px}
.opts button{padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--bg);font-weight:700;font-size:14px}
.opts button[aria-pressed="true"]{background:var(--c,var(--ink));color:#fff;border-color:var(--c,var(--ink))}
.sheet-actions{display:grid;gap:8px;margin-top:18px}
.sheet-actions .primary{padding:14px}
.sheet-actions .second{border:1px solid var(--line);border-radius:10px;padding:13px;font-weight:700}
.sheet-actions .del{color:var(--shu);font-weight:700;padding:10px}
.note{font-size:12px;color:var(--sub);margin-top:6px;line-height:1.6}

/* ---- 検索 ---- */
.search{position:sticky;top:0;z-index:3;background:var(--bg);display:flex;gap:6px;align-items:center;padding:10px 0 4px}
.search input{flex:1;min-width:0;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--panel);font-size:16px}
.search button{border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-weight:700;font-size:14px;background:var(--panel)}
.search .hit{font-size:13px;color:var(--sub);font-weight:700;white-space:nowrap}
.filters{top:52px}
.filters.wishes{top:96px}
.searching .filters,.searching .filters.wishes,.searching #wishes2{display:none}

/* ---- 写真ライブラリ ---- */
.libbox{background:var(--panel);border-radius:18px;width:min(700px,100%);max-height:88vh;display:flex;flex-direction:column;padding:14px}
.libtabs{display:flex;gap:6px;overflow-x:auto;padding:8px 0}
.libtabs button{flex:none;padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:var(--bg);font-weight:700;font-size:14px}
.libtabs button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.libgrid{flex:1;overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:6px;padding-top:4px}
.libgrid button{aspect-ratio:1;border-radius:10px;overflow:hidden;background:var(--ph);border:2px solid transparent}
.libgrid button[aria-pressed="true"]{border-color:var(--shu)}
.libgrid img{width:100%;height:100%;object-fit:cover}
#fLib{color:var(--shu)}

/* ---- 番号入力 ---- */
.numbtn{background:var(--shu);color:#fff;border-radius:9px;padding:8px 13px;font-weight:900;font-size:14px;flex:none}
.numpad{background:var(--panel);border-radius:18px;width:min(430px,100%);max-height:100%;overflow:auto;padding:14px 14px 16px}
.nhead{display:flex;align-items:center;margin-bottom:8px}
.nhead b{flex:1;font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-size:17px}
.nhead button{border:1px solid var(--line);border-radius:8px;padding:7px 12px;font-weight:700;font-size:14px}
.ndisp{background:var(--bg);border-radius:12px;text-align:center;font-size:44px;font-weight:900;font-variant-numeric:tabular-nums;padding:4px 0 6px;letter-spacing:.08em;line-height:1.2}
.nprev{display:flex;align-items:center;gap:10px;min-height:56px;margin:8px 0;padding:6px 8px;background:var(--bg);border-radius:12px}
.nprev .nthumb{width:44px;height:44px;border-radius:8px;overflow:hidden;background:var(--ph);flex:none;display:grid;place-items:center}
.nprev .nthumb img{width:100%;height:100%;object-fit:cover}
.nprev .nthumb .ini{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-size:20px;color:var(--c);opacity:.6}
.nprev .nname{flex:1;font-weight:700;font-size:15px;line-height:1.35}
.nprev .nprice{font-weight:900;font-size:20px;font-variant-numeric:tabular-nums}
.nprev .nhint,.nprev .nng{color:var(--sub);font-size:14px;font-weight:700}
.nprev .nng{color:var(--shu)}
.nkeys{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.nkeys button{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:15px 0;font-size:25px;font-weight:900;font-variant-numeric:tabular-nums}
.nact{display:grid;grid-template-columns:1fr 2fr;gap:7px;margin-top:7px}
.nact button{border:1px solid var(--line);border-radius:12px;padding:15px 0;font-weight:900;font-size:16px;background:var(--panel)}
.nact .primary{background:var(--shu);color:#fff;border-color:var(--shu);font-size:18px}
.ndisp .nq{color:var(--shu);font-size:32px}
.nkeys button.fn{font-size:15px;font-weight:700;color:var(--sub)}
#nPin{display:none}
.toprow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;position:sticky;top:0;z-index:3;background:var(--bg)}
.toprow .search{flex:1 1 220px;min-width:180px;position:static;padding:10px 0 8px}
.toprow .filters{flex:6 1 320px;position:static;padding:10px 0 8px}
.filters.wishes{top:0}
@media (orientation:landscape) and (min-width:900px){
  header{padding:6px 12px}
  h1{font-size:15px}
  .mark{width:26px;height:26px;font-size:15px}
  .tabs button{padding:6px 11px;font-size:13px}
  .toprow .search{flex:0 1 240px;padding:8px 0 6px}
  .toprow .filters{padding:8px 0 6px}
  .grid{grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:9px}
  .pay{display:grid;grid-template-columns:1fr 1.45fr;gap:8px;padding:8px 12px 10px}
  .money{gap:5px}
  .money button{font-size:14px;white-space:nowrap}
  .cart{grid-column:1/-1}
  .actions{grid-column:1/-1}
  .sum b{font-size:21px}
  .money button{padding:9px 0}
  .actions button{padding:11px 0}
}
.ndisp.ng{color:var(--shu);animation:shake .3s}
@keyframes shake{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.expbox{background:var(--panel);border-radius:18px;width:min(900px,100%);max-height:90vh;display:flex;flex-direction:column;padding:14px}
.exptable{flex:1;overflow:auto;border:1px solid var(--line);border-radius:10px}
.exptable table{width:100%;font-size:12px}
.exptable th{position:sticky;top:0;background:var(--shu);color:#fff;font-size:11px;white-space:nowrap;padding:7px 8px;text-align:left}
.exptable td{padding:6px 8px;white-space:nowrap}
.exptable td.num{text-align:right;font-variant-numeric:tabular-nums}
.lockbtn{border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-weight:700;font-size:14px;background:var(--panel);margin-top:14px}
@media (min-width:900px) and (orientation:landscape){
  #nPin{display:block}
  body.pin .app{margin-right:330px;max-width:none}
  body.pin #openNum{display:none}
  body.pin #numpad{display:block!important;position:fixed;top:0;right:0;bottom:0;left:auto;width:330px;background:var(--panel);
          border-left:1px solid var(--line);padding:10px;overflow:auto;z-index:5;place-items:stretch}
  body.pin #numpad .numpad{width:100%;max-height:none;padding:0;border-radius:0}
  body.pin #nClose{display:none}
  body.pin .toast{left:calc(50% - 165px)}
  body.pin #nPin{background:var(--shu);color:#fff;border-color:var(--shu)}
}
.ncart{margin-top:9px;text-align:center;font-weight:900;font-size:15px;font-variant-numeric:tabular-nums;color:var(--sub)}
.rno{display:inline-block;background:var(--ink);color:var(--bg);font-size:11px;font-weight:900;padding:1px 6px;border-radius:5px;margin-right:5px;font-variant-numeric:tabular-nums;vertical-align:1px}
.favmark{color:#C8891B;font-weight:900}
.favbtn{border:1px solid var(--line);border-radius:999px;padding:9px 16px;font-weight:700;font-size:14px;background:var(--bg)}
.favbtn[aria-pressed="true"]{background:#C8891B;color:#fff;border-color:#C8891B}
.fieldrow{display:flex;gap:10px;align-items:flex-end;margin-top:14px}
.fieldrow .field{margin-top:0}

.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:10px;font-weight:700;font-size:14px;z-index:20;opacity:0;pointer-events:none;transition:opacity .2s;max-width:90%}
.toast.show{opacity:1}
.hidden{display:none!important}
@media (max-width:420px){
  .grid{grid-template-columns:1fr 1fr}
  .sum b{font-size:20px}
  .money button{font-size:13px}
  .tabs button{padding:8px 9px;font-size:13px}
}

/* ---- 確認画面（参拝者にも見せる）---- */
.checkbox{background:var(--panel);border-radius:18px;width:min(760px,100%);max-height:92vh;display:flex;flex-direction:column;padding:14px}
.cklist{flex:1;overflow:auto;display:grid;gap:8px;padding:2px}
.ckrow{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-left:7px solid var(--c);border-radius:12px;padding:8px 10px}
.ckrow .ct{width:86px;height:66px;border-radius:9px;overflow:hidden;background:var(--ph);flex:none;display:grid;place-items:center}
.ckrow .ct img{width:100%;height:100%;object-fit:cover}
.ckrow .ct .ini{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-size:30px;color:var(--c);opacity:.5}
.ckrow .cn{flex:1;min-width:0}
.ckrow .cn b{display:block;font-size:19px;line-height:1.3}
.ckrow .cn span{font-size:14px;color:var(--sub);font-variant-numeric:tabular-nums}
.ckrow .cq{display:flex;align-items:stretch;background:var(--c);color:#fff;border-radius:16px;overflow:hidden;height:38px;flex:none}
.ckrow .cq button{width:38px;color:#fff;font-weight:900;font-size:20px;background:rgba(0,0,0,.22)}
.ckrow .cq b{min-width:30px;display:grid;place-items:center;font-weight:900;font-size:19px}
.ckrow .cs{width:96px;text-align:right;font-weight:900;font-size:20px;font-variant-numeric:tabular-nums;flex:none}
.cksum{display:flex;align-items:baseline;justify-content:flex-end;gap:14px;padding:10px 4px 2px;border-top:1px solid var(--line);margin-top:10px}
.cksum span{font-size:16px;font-weight:700;color:var(--sub)}
.cksum b{font-size:34px;font-weight:900;color:var(--shu);font-variant-numeric:tabular-nums}
.cart{cursor:pointer}
.ckbtn{flex:none;background:var(--ink);color:var(--bg);border-radius:999px;padding:5px 13px;font-weight:900;font-size:13px;white-space:nowrap}
.regbadge{flex:none;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:3px 9px;font-weight:900;font-size:13px;color:var(--sub);font-variant-numeric:tabular-nums}

/* ---- 締め ---- */
.clbody{font-size:15px;line-height:1.9}
.clbody .kv{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:6px 2px}
.clbody .kv b{font-variant-numeric:tabular-nums;font-size:18px}
.clbody .warn{color:var(--shu);font-weight:700;font-size:14px;margin-top:8px;line-height:1.6}
.daysel{display:flex;gap:6px;overflow-x:auto;padding:0 0 10px}
.daysel button{flex:none;padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:var(--panel);font-weight:700;font-size:14px;font-variant-numeric:tabular-nums}
.daysel button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.closebtn{background:var(--shu);color:#fff;border-radius:12px;padding:15px;font-weight:900;font-size:17px;width:100%;margin-top:14px}
.impbtn{border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-weight:700;font-size:14px;background:var(--panel);margin-right:8px}
.regbadge.warn{background:#fdecec;border-color:#e0a0a0;color:#a33}

/* ===== 会計のやり直し ===== */
.linkbtn{background:none;border:none;color:var(--sub);font-size:13px;font-weight:700;text-decoration:underline;margin-top:10px;padding:8px 12px}
.rdbody{padding:4px 2px 2px;max-height:62vh;overflow:auto}
.rdrow{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:9px;background:var(--panel)}
.rdrow.voided{opacity:.5}
.rdtop{display:flex;align-items:baseline;gap:8px;margin-bottom:4px}
.rdtop .tm{font-weight:900;font-variant-numeric:tabular-nums}
.rdtop .pc{font-size:13px;color:var(--sub)}
.rdtop .vd{margin-left:auto;font-size:12px;font-weight:900;color:#a33}
.rditems{font-size:13px;line-height:1.5;color:var(--ink);margin-bottom:8px;word-break:break-word}
.rdact{display:flex;gap:8px;flex-wrap:wrap}
.rdact button{flex:1;min-width:120px;border:1px solid var(--line);border-radius:10px;padding:11px 8px;font-weight:800;font-size:14px;background:var(--bg)}
.rdact button.primary{background:var(--shu);color:#fff;border-color:var(--shu)}
.rdnote{font-size:12px;color:var(--sub);line-height:1.5;margin:2px 2px 8px}

/* ===== 連続撮影 ===== */
.shootbox{position:absolute;inset:0;background:var(--bg);display:flex;flex-direction:column;padding:10px 12px 14px}
.shbody{flex:1;display:flex;flex-direction:column;min-height:0;gap:8px}
.shprog{font-size:13px;font-weight:800;color:var(--sub);font-variant-numeric:tabular-nums}
.shcard{border:1px solid var(--line);border-radius:14px;background:var(--panel);padding:12px 14px}
.shname{font-size:20px;font-weight:900;line-height:1.35;word-break:break-word}
.shmeta{font-size:13px;color:var(--sub);margin-top:3px}
.shno{display:inline-block;background:var(--ink);color:#fff;border-radius:6px;padding:1px 7px;font-size:14px;margin-right:7px;font-variant-numeric:tabular-nums;vertical-align:2px}
.shprev{flex:1;min-height:0;border:1px dashed var(--line);border-radius:14px;background:var(--ph);display:grid;place-items:center;overflow:hidden}
.shprev img{max-width:100%;max-height:100%;object-fit:contain}
.shprev .ph{color:var(--sub);font-size:14px;text-align:center;padding:16px;line-height:1.6}
.shact{display:flex;gap:8px;flex-wrap:wrap}
.shact button{flex:1;min-width:104px;border:1px solid var(--line);border-radius:12px;padding:15px 8px;font-weight:900;font-size:16px;background:var(--panel)}
.shact button.primary{background:var(--shu);color:#fff;border-color:var(--shu)}
.shact button.wide{flex-basis:100%}
.shsub{display:flex;gap:8px}
.shsub button{flex:1;border:1px solid var(--line);border-radius:10px;padding:10px 8px;font-weight:700;font-size:13px;background:var(--bg);color:var(--sub)}
.shdone{text-align:center;padding:26px 10px}
.shdone .big{font-size:26px;font-weight:900;margin-bottom:6px}
.shdone p{color:var(--sub);font-size:14px;line-height:1.7}

/* 確認ダイアログは、ほかの画面より必ず上に出す（やり直し画面から「はい」が押せなくなるため） */
#confirm{z-index:15}

/* ===== オフラインの準備ができているか ===== */
.regbadge#offBadge{cursor:pointer}
.regbadge.notready{background:#fdf0e3;border-color:#dfb480;color:#8a5a12}
.regbadge.ready{background:#eaf4ec;border-color:#a5c9ae;color:#2f6b40}
.offbox{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:10px 0;background:var(--panel)}
.offbox b{display:block;font-size:15px;margin-bottom:3px}
.offbox.ready b{color:#2f6b40}
.offbox.notready b{color:#8a5a12}
.offbox p{font-size:13px;color:var(--sub);line-height:1.6;margin:0}
.offbox button{margin-top:9px;border:1px solid var(--line);border-radius:10px;padding:9px 14px;font-weight:700;font-size:13px;background:var(--bg)}
