/* マルシェレジ — シリーズの見た目（生成り・深緑）に、お店の見た目の色（初めは胡桃 #7A5233）。
   レジ・会計の画面はメニューを出さず、字とボタンを大きくする（お手伝いの方も、立ったまま押すので）。 */
:root{--ink:#1F2A22;--green:#2F4A35;--paper:#F5F1E8;--line:#E3DCCD;--lime:#E9EDD5;--muted:#5F665C;--soft:#EEF1E8;--app:#7A5233;--app-soft:#F2E8DE;--app-line:#DCC6B0;--warn:#8A5A12;--warn-ink:#6E4710;--warn-soft:#F8EBD8;--red:#B23A26;--white:#fff;color:var(--ink);background:var(--paper);font-size:16px;line-height:1.6}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{margin:0;min-height:100%}
body{background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic UI","Meiryo",sans-serif}
[hidden]{display:none!important}
a{color:var(--green)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;touch-action:manipulation}
:focus-visible{outline:3px solid var(--app);outline-offset:2px}
h1,h2,b{overflow-wrap:anywhere}
h1{font-size:23px;line-height:1.35;margin:4px 0 12px}
h2{font-size:17px;margin:0 0 8px}
.loading{padding:40px 20px;text-align:center;color:var(--muted)}

/* ---- 枠（ほかのアプリと同じ形） ------------------------------------------------------------- */
.sidebar{position:fixed;inset:0 auto 0 0;width:230px;background:var(--paper);border-right:1px solid var(--line);padding:28px 18px;display:flex;flex-direction:column;gap:12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-size:18px;font-weight:700;line-height:1.3}
.brand img{border-radius:10px}.brand small{display:block;font-size:11px;font-weight:600;color:var(--app)}
.local{display:inline-block;font-size:12px;font-weight:700;color:var(--app);background:var(--app-soft);border-radius:99px;padding:3px 10px;width:max-content;white-space:nowrap}
nav{display:grid;gap:6px;margin-top:8px}
nav a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;color:var(--muted);text-decoration:none;font-weight:600}
nav a.active{background:var(--app-soft);color:var(--app);font-weight:700}
.nav-icon{position:relative;display:inline-flex}
nav a.has-dot .nav-icon::after{content:"";position:absolute;top:-2px;right:-4px;width:9px;height:9px;border-radius:50%;background:#C8442E;border:2px solid #FFFDF8}
main{margin-left:230px;max-width:760px;padding:28px 36px 60px}
footer{margin-top:28px;font-size:12px;color:var(--muted);text-align:center}
#message:empty{display:none}
#message{background:var(--lime);border:1px solid #c7d6be;border-radius:14px;padding:10px 14px;font-size:14px;color:var(--green);margin:0 0 12px;font-weight:700}
@media(max-width:800px){
 .sidebar{position:static;width:auto;border:0;padding:14px 16px 0;flex-direction:row;align-items:center;justify-content:space-between}
 .brand{font-size:17px}.brand img{width:34px;height:34px}
 nav{position:fixed;bottom:0;left:0;right:0;z-index:1000;display:flex;gap:0;margin:0;background:#FFFDF8;border-top:1px solid var(--line);padding:6px 4px max(10px,env(safe-area-inset-bottom));align-items:flex-end}
 nav a{flex:1;flex-direction:column;gap:3px;padding:4px 2px;font-size:11.5px;min-height:56px;justify-content:flex-end;background:transparent!important;text-align:center;line-height:1.25}
 nav a.active .nav-svg{background:var(--app-soft);border-radius:10px;box-shadow:0 0 0 5px var(--app-soft)}
 main{margin:0;padding:10px 16px 120px}
}
@media (min-width:801px){html{scrollbar-gutter:stable}.shell{max-width:1480px;margin:0 auto}.sidebar{left:max(0px,calc((100% - 1480px) / 2))}}

/* 受付の画面：メニューを出さず、中身だけ */
body.focus .sidebar{display:none}
body.focus main{margin:0 auto!important;max-width:760px!important;padding:0 16px 40px!important}
body.focus footer{display:none}
body.focus .sl-toast{bottom:20px}

/* ---- 部品 ----------------------------------------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:48px;background:var(--green);color:#fff;border:2px solid var(--green);border-radius:14px;font-size:16px;font-weight:700;padding:10px 16px;text-decoration:none;text-align:center;line-height:1.35}
.btn.app{background:var(--app);border-color:var(--app)}
.btn.line{background:var(--white);color:var(--green);border-color:var(--green)}
.btn.big{min-height:62px;font-size:19px;border-radius:16px}
.btn.wide{display:flex;width:100%;margin:6px 0}
.btn.small{min-height:44px;font-size:15px;padding:6px 14px;border-radius:12px}
.btn.danger{background:#FBEDEA;color:#8A2E1E;border-color:#EFC7BC}
.btn.red{background:var(--red);border-color:var(--red)}
.btn.warnline{border-color:var(--warn);color:var(--warn)}
.btn:disabled{opacity:.45;cursor:default}
.row{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.row>.btn{flex:1 1 150px}
.linkish{display:block;margin:4px auto 0;background:none;border:0;padding:8px;font-size:15px;color:var(--green);text-decoration:underline}
.banner{border-radius:14px;padding:10px 14px;font-size:15px;margin-bottom:12px;font-weight:700}
.banner.error{background:#FBEDEA;border:1px solid #EFC7BC;color:#8A2E1E}
.card{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:14px 15px;margin:0 0 12px}
.panel{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:14px;margin:12px 0}
.note{font-size:13.5px;color:var(--muted);margin:4px 0 8px;line-height:1.6}
.note.center{text-align:center}
.muted{color:var(--muted)}
.lab{display:block;font-size:14px;font-weight:700;margin:0 0 5px}
.lab.small{font-size:13px;font-weight:400;color:var(--muted)}
label{display:block;font-size:14px;font-weight:700;margin:0 0 5px}
.field{display:block;width:100%;min-height:48px;background:#fff;border:2px solid #D3CCBC;border-radius:12px;font-size:17px;padding:8px 12px}
.field.narrow{max-width:220px}
textarea.field{font-size:14px;line-height:1.5;resize:vertical}
.field:focus{border-color:var(--app);outline:none}
.form{display:flex;flex-direction:column;gap:14px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.two.wide-left{grid-template-columns:1.25fr 1fr}
.card .two{margin-bottom:10px}
.card>div:not(.two):not(.kv):not(.row):not(.ask)>label{margin-top:4px}
.chip{display:inline-block;font-size:12px;font-weight:700;border-radius:999px;padding:1px 9px;background:var(--soft);color:var(--green);border:1px solid #cfdac8;white-space:nowrap}
.chip.app{background:var(--app-soft);color:var(--app);border-color:var(--app-line)}
.chip.warn{background:var(--warn-soft);color:var(--warn);border-color:#e9cfa8}
.cardnote{font-size:14px;font-weight:700;color:var(--green);margin:8px 0 0;min-height:1.4em}
.cardnote:empty{min-height:0;margin:0}
.cardnote.bad{color:var(--red)}
.sec{font-size:14px;color:var(--muted);margin:18px 2px 8px;letter-spacing:.04em}

/* 選ぶボタン（ラジオ）と切りかえ */
.seg{display:flex;gap:6px}
.seg.wrap{flex-wrap:wrap}
.seg label{flex:1;margin:0;font-weight:700}
.seg.wrap label{flex:1 1 30%}
.seg input{position:absolute;opacity:0;width:1px;height:1px}
.seg span{display:flex;align-items:center;justify-content:center;min-height:46px;text-align:center;border:2px solid #D3CCBC;background:#fff;border-radius:11px;padding:6px 4px;font-size:14.5px;color:var(--muted);line-height:1.3}
.seg input:checked+span{border-color:var(--app);background:var(--app-soft);color:var(--app)}
.seg input:focus-visible+span{outline:3px solid var(--app);outline-offset:2px}
.sw{position:relative;flex:none;margin:2px 0 0;width:52px;height:32px}
.sw input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.sw span[aria-hidden]{display:block;width:52px;height:32px;border-radius:999px;background:#cfc8b8;position:relative;pointer-events:none}
.sw span[aria-hidden]::after{content:"";position:absolute;width:26px;height:26px;border-radius:50%;background:#fff;top:3px;left:3px;transition:left .15s}
.sw input:checked+span{background:var(--app)}
.sw input:checked+span::after{left:23px}
.sw input:focus-visible+span{outline:3px solid var(--app);outline-offset:2px}
.sl-vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 上の行（もどる・題・右） */
.bar{display:flex;align-items:center;gap:8px;padding:12px 0;margin:0 0 12px;border-bottom:1px solid var(--line);min-height:56px}
.bar b{font-size:17px;flex:1;min-width:0;line-height:1.35}
.back{background:none;border:0;color:var(--app);font-weight:700;font-size:15px;padding:8px 6px 8px 0;white-space:nowrap}
.bar-r{font-size:13.5px;color:var(--muted);white-space:nowrap;margin-left:auto}
.closebtn{background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 10px;font-size:14px;color:var(--muted)}

/* ホーム（売る日の一覧） */
.daycard{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:12px 14px;margin:0 0 10px}
.daycard.today{border:2px solid var(--app)}
.dayhead{display:flex;gap:8px;align-items:center}
.daymeta{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:4px 0 0}
.date{font-size:13px;color:var(--muted)}
.daylink{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:0;background:none;border:0;padding:2px 0;text-align:left;color:var(--ink)}
.daydate{font-size:17px;font-weight:700;color:var(--app);line-height:1.35}
.dayname{font-size:22px;font-weight:800;line-height:1.3;overflow-wrap:anywhere}
.daygo{color:var(--muted);font-size:22px;flex:none}
.dayline{font-size:13.5px;color:var(--muted);margin:0}
.nums{display:flex;gap:18px;margin:6px 0 10px}
.nums div{font-size:12.5px;color:var(--muted)}
.nums b{display:block;font-size:26px;color:var(--ink);line-height:1.2;font-variant-numeric:tabular-nums}
.nums b small,.stat b small,.count b small{font-size:14px;font-weight:700;margin-left:1px}
.stamp{width:42px;height:42px;border:2.5px solid #C8442E;color:#C8442E;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:18px;transform:rotate(-12deg);flex:none}
.backup-row{display:flex;align-items:center;gap:8px;width:100%;margin-top:14px;background:#fff;border:1px dashed #cbbfa6;border-radius:12px;padding:11px 13px;font-size:14px;text-align:left}
.backup-row i{margin-left:auto;font-style:normal;color:var(--muted)}
.remind{background:#FFF6E6;border:1.5px solid #E9C98F;border-radius:18px;padding:14px 16px;margin:0 0 12px}
.remind-t{display:flex;gap:10px;align-items:flex-start}
.remind-ic{width:36px;height:36px;border-radius:12px;background:#F3DDB2;display:grid;place-items:center;flex:none;font-size:18px}
.remind b{font-size:15px;display:block;color:var(--warn-ink)}.remind p{font-size:13px;color:#7A5A2A;margin:2px 0 0}
.remind-r{display:grid;grid-template-columns:2fr 1fr;gap:8px;margin-top:12px}
.remind-r .btn{background:var(--warn);border-color:var(--warn)}.remind-r .btn.line{background:transparent;color:#7A5A2A;border-color:#E2CBA0}
.kv{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:15px}
.kv:last-child{border-bottom:0}
.kv b{font-variant-numeric:tabular-nums;text-align:right}
.kv.col{flex-direction:column;gap:2px}.kv.col b{text-align:left}.kv.col span{font-size:13px;color:var(--muted)}
.hours{display:flex;align-items:flex-end;gap:6px;height:110px;padding:18px 2px 22px}
.hbar{flex:1;height:100%;position:relative;display:flex;align-items:flex-end}
.hbar i{display:block;width:100%;background:var(--app);border-radius:4px 4px 0 0;min-height:2px}
.hbar b{position:absolute;left:0;right:0;text-align:center;font-size:11.5px;top:-18px}
.hbar span{position:absolute;bottom:-20px;left:0;right:0;text-align:center;font-size:11.5px;color:var(--muted)}
.radio{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:2px solid #D3CCBC;border-radius:12px;background:#fff;margin:0 0 8px;font-weight:400;cursor:pointer}
.radio input{width:22px;height:22px;margin:2px 0 0;accent-color:var(--app);flex:none}
.radio:has(input:checked){border-color:var(--app);background:var(--app-soft)}
.radio b{display:block;font-size:15px}
.radio small,.check small{display:block;font-size:12.5px;color:var(--muted);font-weight:400}
.check{display:flex;gap:10px;align-items:flex-start;margin:0;font-size:15px;cursor:pointer}
.check input{width:24px;height:24px;margin:1px 0 0;accent-color:var(--app);flex:none}
/* 設定・使い方 */
.compare{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0}
.compare div{background:var(--soft);border-radius:12px;padding:10px 12px;font-size:14px}
.compare b{display:block}
#backupCard select,#backupCard input[type=file]{margin-bottom:12px}
#backupCard .row{margin-bottom:12px}
.g-step{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:start;color:var(--ink)}
.g-ill svg{width:96px;height:auto;display:block;color:var(--green)}
.g-step h2{margin:0 0 4px}.g-step p{margin:0;font-size:14.5px}
.kbtn{display:inline-block;padding:0 10px;border-radius:99px;color:#fff;background:var(--app);font-size:13px;font-weight:700;white-space:nowrap;line-height:1.8}
.panel-more{background:#fff;border:1px solid var(--line);border-radius:14px;padding:8px 14px;margin:10px 0}
.panel-more summary{color:var(--green);cursor:pointer;font-size:14px;padding:6px 2px;font-weight:700}
.panel-more p{margin:4px 0 8px;font-size:14px}
.feedback-link{margin:24px 0 8px;padding-top:14px;border-top:1px solid var(--line);font-size:13px;color:var(--muted);text-align:center;line-height:1.9}
.feedback-link a{color:var(--green);font-weight:700;margin:0 2px}

/* ---- マルシェレジの画面 ------------------------------------------------------------------------- */
.num{font-variant-numeric:tabular-nums}
.chip.ten{background:#E6EDF4;color:#3E5A78;border-color:#c3d1e0}
.daycard .nums b{font-size:24px}
.daybtns{display:grid;gap:8px;margin-top:4px}
.daybtns .btn{margin:0}

/* レジ（お手伝いの方も打つ画面） */
.regbar{display:flex;align-items:center;gap:10px;padding:10px 14px;margin:0 -16px 0;background:var(--app);color:#fff;position:relative}
.regbar b{font-size:18px;line-height:1.3;min-width:0;overflow-wrap:anywhere}
.regbar small{font-size:13px;opacity:.9;margin-left:4px;font-weight:400}
.regbar .r{margin-left:auto;flex:none;font-size:14px;font-weight:700;border:1.5px solid rgba(255,255,255,.75);border-radius:999px;padding:6px 13px;background:transparent;color:#fff;white-space:nowrap}
.tabs{display:flex;gap:6px;padding:12px 0 2px;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{flex:none;border:2px solid #D3CCBC;background:#fff;border-radius:999px;padding:6px 15px;font-size:15px;font-weight:700;color:var(--muted);min-height:42px}
.tabs button.on{background:var(--app);border-color:var(--app);color:#fff}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:10px 0 12px}
@media(min-width:560px){.grid{grid-template-columns:repeat(4,1fr)}}
.tile{background:#fff;border:2px solid var(--line);border-radius:var(--tile-r,14px);padding:9px 9px 8px;min-height:92px;position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left;color:var(--ink)}
.tile b{font-size:17px;line-height:1.25;overflow-wrap:anywhere}
.tile small{font-size:12px;color:var(--muted)}
.tile .p{margin-top:auto;font-size:18px;font-weight:700;font-variant-numeric:tabular-nums}
.tile .p::after{content:"円";font-size:12px;margin-left:1px}
.tile.in{border-color:var(--app);background:var(--app-soft)}
.tile .n{position:absolute;top:-8px;right:-5px;min-width:30px;height:30px;border-radius:999px;background:var(--app);color:#fff;font-weight:700;font-size:16px;display:flex;align-items:center;justify-content:center;padding:0 7px;border:2px solid #fff}
.tile .t10{position:absolute;right:7px;bottom:9px;font-size:11px;font-weight:700;color:#3E5A78;background:#E6EDF4;border-radius:6px;padding:0 5px}
.tile.other{border-style:dashed;background:transparent;align-items:center;justify-content:center;text-align:center;color:var(--muted)}
.tile.other b{font-size:15px}
.tile.out{opacity:.5;background:#F4F1EA}
.tile .so{position:absolute;right:6px;bottom:8px;font-size:11.5px;font-weight:700;color:var(--red)}
.soldmode .tile:not(.other){border-style:dashed;border-color:var(--red)}
.soldbar{display:flex;align-items:center;gap:8px;background:#FBEDEA;border:1px solid #EFC7BC;border-radius:12px;padding:8px 12px;font-size:14px;color:#8A2E1E;font-weight:700;margin-top:10px}
.soldbar .btn{margin-left:auto;min-height:40px}
.textlink{background:none;border:0;color:var(--muted);text-decoration:underline;font-size:13.5px;padding:8px 2px}
.foot{position:sticky;bottom:0;z-index:5;margin:6px -16px 0;background:#fff;border-top:1px solid var(--line);padding:10px 16px max(14px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:8px}
.basket{display:flex;flex-wrap:wrap;gap:5px;max-height:62px;overflow:hidden}
.basket span{font-size:13px;background:var(--app-soft);border-radius:8px;padding:2px 8px;color:var(--app);font-weight:700}
.basket .none{background:none;color:var(--muted);font-weight:400;padding:2px 0}
.payrow{display:flex;gap:8px;align-items:stretch}
.payrow .sum{flex:1;display:flex;flex-direction:column;justify-content:center;min-width:0}
.payrow .sum small{font-size:13px;color:var(--muted)}
.payrow .sum b{font-size:28px;line-height:1.1;font-variant-numeric:tabular-nums}
.payrow .btn{flex:1.2;margin:0}
.undo{border:2px solid #D3CCBC;border-radius:12px;background:#fff;font-size:14px;font-weight:700;color:var(--muted);display:flex;align-items:center;justify-content:center;padding:0 10px;line-height:1.25;text-align:center;min-width:64px}
.undo:disabled{opacity:.4}

/* 会計 */
.total{background:var(--app);color:#fff;border-radius:16px;padding:12px 16px;margin-top:12px}
.total small{font-size:14px;opacity:.95}
.total b{display:block;font-size:44px;line-height:1.1;font-variant-numeric:tabular-nums}
.total b small{font-size:20px;margin-left:2px}
.lines{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;margin:10px 0}
.ln{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--line);font-size:15.5px}
.ln:last-child{border-bottom:0}
.ln .nm{flex:1;min-width:0;overflow-wrap:anywhere}
.ln .nm small{color:var(--muted);font-size:12px;margin-left:4px}
.ln .q{display:flex;align-items:center;border:2px solid #D3CCBC;border-radius:10px;overflow:hidden;flex:none}
.ln .q button{border:0;width:38px;min-height:38px;text-align:center;font-weight:700;color:var(--app);background:var(--app-soft);font-size:20px;padding:0}
.ln .q b{width:34px;text-align:center;font-variant-numeric:tabular-nums}
.ln .a{width:64px;text-align:right;font-weight:700;font-variant-numeric:tabular-nums;flex:none}
.pay{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:8px;margin:0 0 12px}
.pay button{border:2px solid #D3CCBC;background:#fff;border-radius:12px;padding:11px 4px;min-height:54px;text-align:center;font-size:17px;font-weight:700;color:var(--muted)}
.pay button.on{border-color:var(--green);background:var(--green);color:#fff}
.cash{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.cash button{border:2px solid #D3CCBC;background:#fff;border-radius:10px;padding:8px 2px;min-height:50px;text-align:center;font-size:16px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--ink)}
.cash button.on{border-color:var(--app);background:var(--app-soft);color:var(--app)}
.other-cash{display:flex;align-items:center;gap:8px;margin:8px 0 10px}
.other-cash label{margin:0;font-weight:400;font-size:14px;color:var(--muted);white-space:nowrap}
.other-cash .field{max-width:180px;font-variant-numeric:tabular-nums}
.change{display:flex;align-items:baseline;justify-content:space-between;background:#fff;border:3px solid var(--app);border-radius:14px;padding:6px 14px;margin-bottom:12px}
.change span{font-size:16px;font-weight:700}
.change b{font-size:36px;font-variant-numeric:tabular-nums}
.change b small{font-size:18px}
.change.short{border-color:var(--red)}
.change.short b{font-size:20px;color:var(--red)}
.change.wait b{font-size:18px;color:var(--muted);font-weight:400}
.go{position:sticky;bottom:0;padding:8px 0 max(12px,env(safe-area-inset-bottom));background:var(--paper)}
.go .btn{margin:0}

/* 会計できた */
.done{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:18px 0 6px}
.done .ok{width:64px;height:64px;border-radius:50%;background:var(--green);color:#fff;font-size:36px;display:flex;align-items:center;justify-content:center}
.done .t{font-size:20px;font-weight:700;margin-top:6px}
.bigchange{background:#fff;border:3px solid var(--app);border-radius:18px;padding:14px;text-align:center;margin:10px 0}
.bigchange span{font-size:17px;font-weight:700}
.bigchange b{display:block;font-size:64px;line-height:1.05;font-variant-numeric:tabular-nums;color:var(--app)}
.bigchange b small{font-size:26px}

/* レシート（白と黒のまま） */
.receipt{background:#fff;color:#1a1a1a;border-radius:6px;padding:18px 18px 16px;box-shadow:0 1px 0 var(--line),0 6px 16px rgba(60,50,30,.08);font-size:15px;max-width:440px;margin:12px auto}
.receipt h1{margin:0;text-align:center;font-size:21px;letter-spacing:.2em}
.receipt .who{text-align:center;font-size:14px;color:#555;margin:2px 0 10px;line-height:1.6}
.receipt .r{display:flex;justify-content:space-between;gap:10px;padding:3px 0;font-variant-numeric:tabular-nums}
.receipt .r span:first-child{overflow-wrap:anywhere}
.receipt .r span:last-child{white-space:nowrap}
.receipt .r.s{font-size:13.5px;color:#555;padding:1px 0}
.receipt hr{border:0;border-top:1px dashed #b5b5b5;margin:8px 0}
.receipt .tot{font-size:21px;font-weight:700}
.receipt .gone{color:#B23A26;font-weight:700;text-align:center;margin:0 0 6px}

/* 締め・まとめ */
.sumbox{background:var(--app);color:#fff;border-radius:16px;padding:12px 16px;display:flex;gap:16px;margin-bottom:12px;flex-wrap:wrap}
.sumbox div{font-size:13px;opacity:.95}
.sumbox b{display:block;font-size:28px;line-height:1.15;font-variant-numeric:tabular-nums}
.sumbox b small{font-size:15px}
.sumbox div+div b{font-size:22px}
.kv small{color:var(--muted);font-size:12.5px;margin-left:6px;font-weight:400}
.kv.em b{font-size:19px}
.diff{background:var(--warn-soft);border:1px solid #e9cfa8;border-radius:10px;padding:8px 11px;font-size:14px;color:#7a4a10;margin-top:8px}
.diff.ok{background:var(--lime);border-color:#c7d6be;color:var(--green)}
.diff b{font-size:16px}
.rank{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:8px}
.rk{display:grid;grid-template-columns:1fr 48px 78px;gap:6px;align-items:center;padding:7px 12px;border-bottom:1px solid var(--line);font-size:15px}
.rk:last-child{border-bottom:0}
.rk .nm{min-width:0;overflow-wrap:anywhere}
.rk .nm small{color:var(--muted);font-size:12px;margin-left:3px}
.rk .bar2{height:6px;border-radius:3px;background:var(--app);margin-top:3px;opacity:.75}
.rk .c{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.rk .y{text-align:right;color:var(--muted);font-size:13.5px;font-variant-numeric:tabular-nums}
.rk.h{background:var(--soft);font-size:12px;color:var(--muted);padding:5px 12px}
.rk.h .c,.rk.h .y{font-weight:400;color:var(--muted);font-size:12px}
.list{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:10px}
.sale{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-bottom:1px solid var(--line)}
.sale:last-child{border-bottom:0}
.sale .t{font-variant-numeric:tabular-nums;color:var(--muted);font-size:14px;width:44px;flex:none;padding-top:2px}
.sale .w{flex:1;min-width:0}
.sale .w b{font-size:16px}
.sale .w span{display:block;font-size:12.5px;color:var(--muted);overflow-wrap:anywhere}
.sale .btns{display:flex;flex-direction:column;gap:6px;flex:none}
.sale .btns .btn{min-height:38px;font-size:13.5px;padding:4px 10px}
.sale.gone{background:#F6F3EE}
.sale.gone .w b{text-decoration:line-through;color:var(--muted)}
.monthrow{display:flex;align-items:center;gap:8px;width:100%;padding:11px 12px;border:0;border-bottom:1px solid var(--line);background:#fff;text-align:left;color:var(--ink)}
.monthrow:last-child{border-bottom:0}
.monthrow .w{flex:1;min-width:0}
.monthrow .w b{display:block;font-size:15.5px}
.monthrow .w span{font-size:12.5px;color:var(--muted)}
.monthrow .y{font-weight:700;font-variant-numeric:tabular-nums}
.monthrow i{font-style:normal;color:var(--muted)}

/* 品目と値段 */
.plist{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:6px}
.pi{display:flex;align-items:center;gap:6px;padding:4px 8px 4px 12px;border-bottom:1px solid var(--line)}
.pi:last-child{border-bottom:0}
.pi .open{flex:1;min-width:0;display:flex;align-items:center;gap:8px;background:none;border:0;padding:8px 0;text-align:left;color:var(--ink)}
.pi .nm{flex:1;min-width:0;font-size:16px;font-weight:700;overflow-wrap:anywhere}
.pi .nm small{font-weight:400;color:var(--muted);font-size:12.5px;margin-left:4px}
.pi .yen{font-size:16px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.pi .mv{display:flex;flex-direction:column;gap:2px}
.pi .mv button{border:1px solid var(--line);background:#fff;border-radius:7px;width:34px;height:24px;font-size:12px;color:var(--muted);padding:0;line-height:1}
.pi.hid{background:#F6F3EE}.pi.hid .nm{color:var(--muted)}
.item-add{border:2px solid var(--app)}
.pickgroup{margin:8px 0 4px;font-size:13px;color:var(--muted);font-weight:700}
.picks{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.picks label{display:flex;align-items:center;gap:8px;border:2px solid #D3CCBC;border-radius:11px;background:#fff;padding:7px 10px;font-weight:700;font-size:14.5px;margin:0;cursor:pointer;min-width:0}
.picks label:has(input:checked){border-color:var(--app);background:var(--app-soft)}
.picks input{width:20px;height:20px;accent-color:var(--app);flex:none;margin:0}
.picks label span{min-width:0;overflow-wrap:anywhere}
.picks label small{font-weight:400;color:var(--muted);font-size:12px;margin-left:auto;white-space:nowrap}
.seg span small{display:block;font-size:11px;font-weight:400}
.pay-row{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--line)}
.pay-row b{flex:1}
.setrow{display:flex;align-items:center;gap:8px;width:100%;padding:12px 2px;border:0;border-bottom:1px solid var(--line);background:none;font-size:15.5px;text-align:left;color:var(--ink)}
.setrow:last-child{border-bottom:0}
.setrow .v{margin-left:auto;color:var(--muted);font-size:14px;display:flex;align-items:center;gap:6px;text-align:right}
.dot{width:16px;height:16px;border-radius:50%;display:inline-block;flex:none}

/* お店の見た目を選ぶ */
.looks{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0 10px}
@media(min-width:560px){.looks{grid-template-columns:repeat(3,1fr)}}
.look{background:#fff;border:2px solid var(--line);border-radius:14px;padding:8px 8px 9px;position:relative;text-align:left;color:var(--ink)}
.look.on{border-color:var(--green);box-shadow:0 0 0 2px var(--green) inset}
.look b{display:block;font-size:15px;margin-top:6px}
.look small{display:block;font-size:12px;color:var(--muted);line-height:1.4}
.look .use{position:absolute;top:-10px;right:8px;background:var(--green);color:#fff;font-size:11.5px;font-weight:700;border-radius:999px;padding:1px 8px}
.pv{border-radius:9px;overflow:hidden;background:var(--paper);border:1px solid var(--line)}
.pv-band{height:20px;background:var(--app);position:relative}
.pv-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:6px}
.pv-tiles i{height:24px;background:#fff;border:1.5px solid var(--line);border-radius:calc(var(--tile-r,14px) / 2)}
.pv-tiles i:first-child{background:var(--app-soft);border-color:var(--app)}
.pv-btn{margin:0 6px 6px;height:14px;border-radius:5px;background:var(--app)}

/* お店の見た目（2026-11-09 本人「この5つでよい」）。色と、帯・ボタンの形が変わる。レシートは白と黒のまま。 */
.look-green{--app:#4E7A2E;--app-soft:#E8F0DE;--app-line:#C3D6AE;--paper:#F2F4E9}
.look-tent{--app:#B83A3A;--app-soft:#F8E4E1;--app-line:#E6B9B3;--paper:#FBF6EF}
.look-wa{--app:#2B4B6F;--app-soft:#E3E9F0;--app-line:#BFCADA;--paper:#F1ECE1;--tile-r:4px}
.look-pop{--app:#C9601E;--app-soft:#FDEBD8;--app-line:#F2C9A2;--paper:#FFF8E8;--tile-r:22px}
body.look-green,body.look-tent,body.look-wa,body.look-pop{background:var(--paper)}
body[class*="look-"] .sidebar{background:var(--paper)}
.look-tent .regbar{margin-bottom:12px}
.look-tent .regbar::after,.look-tent .pv-band::after{content:"";position:absolute;left:0;right:0;top:100%;height:14px;background:repeating-linear-gradient(90deg,#B83A3A 0 24px,#fff 24px 48px);-webkit-mask:radial-gradient(circle at 12px 0,#000 12px,transparent 12.5px) 0 0/24px 14px repeat-x;mask:radial-gradient(circle at 12px 0,#000 12px,transparent 12.5px) 0 0/24px 14px repeat-x}
.look-tent .pv-band{margin-bottom:12px}
.look-tent .pv-band::after{height:10px;background:repeating-linear-gradient(90deg,#B83A3A 0 8px,#fff 8px 16px);-webkit-mask:radial-gradient(circle at 8px 0,#000 8px,transparent 8.5px) 0 0/16px 10px repeat-x;mask:radial-gradient(circle at 8px 0,#000 8px,transparent 8.5px) 0 0/16px 10px repeat-x}
.look-wa .regbar{border-bottom:4px solid #C9A86A}
.look-wa .pv-band{border-bottom:3px solid #C9A86A}
.look-wa .regbar b,.look-wa .tile b{font-family:"Yu Mincho","Hiragino Mincho ProN","YuMincho",serif;font-weight:700}
.look-wa .tile b{font-size:15px;letter-spacing:-.04em}
.look-wa .tabs button,.look-wa .btn,.look-wa .undo,.look-wa .pay button,.look-wa .cash button{border-radius:4px}
.look-wa .pv-btn{border-radius:2px}
.look-pop .tile{border-width:3px}
.look-pop .btn,.look-pop .undo,.look-pop .pv-btn{border-radius:999px}
.look-pop .regbar,.look-pop .pv-band{border-radius:0 0 22px 22px}

@media print{
 @page{size:A4 portrait;margin:14mm}
 body{background:#fff}
 .noprint,.sidebar,nav,footer,.feedback-link,#message,.sl-toast,.sh-hint,#storage-notice{display:none!important}
 main{margin:0!important;padding:0!important;max-width:none!important}
}
@media (max-width:760px){.g-step{grid-template-columns:72px 1fr}.g-ill svg{width:72px}}
@media (max-width:360px){.two{grid-template-columns:1fr}.grid{gap:6px}.tile b{font-size:15.5px}}
@media (prefers-reduced-motion:reduce){.sw span[aria-hidden]::after{transition:none}}
.steps{text-align:left}
.seg span{flex-direction:column}
.cash button{position:relative}
.cash .bn{position:absolute;top:-9px;right:-6px;background:var(--app);color:#fff;border-radius:999px;font-size:12px;padding:1px 7px;border:2px solid #fff}
.billsum{display:block;font-weight:400;font-size:14px;color:var(--ink);margin-top:2px}
.billsum .textlink{padding:2px 4px;font-size:13px}
/* 領収書（納品書の領収書と同じ形。A5横の紙の比率で、幅に合わせて縮む） */
.rcpt{container-type:inline-size;max-width:560px;margin:12px auto}
.rcpt .gone{color:#B23A26;font-weight:700;text-align:center;margin:0 0 6px}
.rc-in{position:relative;aspect-ratio:210/148;background:#fff;color:#262626;box-shadow:0 1px 0 var(--line),0 6px 16px rgba(60,50,30,.08);border-radius:4px;padding:5.5cqw 6.7cqw;font-size:1.8cqw;line-height:1.45}
.rc-no{position:absolute;right:6.7cqw;top:4.5cqw;text-align:right;font-size:1.55cqw}
.rc-title{margin:4.3cqw 0 0;text-align:center;font-size:3.8cqw;letter-spacing:.3em;font-weight:700}
.rc-title::after{content:"";display:block;width:20.5cqw;margin:.6cqw auto 0;border-bottom:.18cqw solid #262626}
.rc-to{display:inline-block;min-width:27cqw;margin-top:3.6cqw;font-size:2.6cqw;border-bottom:.1cqw solid #262626;padding:0 1cqw .4cqw .3cqw;overflow-wrap:anywhere;max-width:54cqw}
.rc-amount{width:54cqw;margin-top:2.6cqw;border:.2cqw solid #262626;text-align:center;font-size:3.7cqw;padding:1.3cqw 0;font-weight:700;font-variant-numeric:tabular-nums}
.rc-note{margin:2.2cqw 0 0;font-size:1.8cqw}
.rc-words{margin:1.2cqw 0 0;font-size:1.7cqw}
.rc-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:2cqw;margin-top:1.5cqw}
.rc-tax{border-collapse:collapse;font-size:1.45cqw;width:34cqw}
.rc-tax td{border:.1cqw solid #262626;padding:.2cqw 1cqw}
.rc-tax td:last-child{text-align:right;width:15cqw}
.rc-shop{font-size:1.55cqw;line-height:1.5;width:30cqw;overflow-wrap:anywhere}
.rc-shop b{font-size:2cqw}
.rc-shop{position:absolute;left:63.5cqw;top:23cqw;width:30cqw}
/* 領収書をQRで渡す */
.qrbox{background:#fff;border-radius:16px;padding:16px;text-align:center;margin:12px 0}
.qrbox b{display:block;font-size:18px;margin-bottom:8px}
.qrbox svg{display:block;width:100%;max-width:340px;height:auto;margin:0 auto;image-rendering:pixelated}
.qrbox .note{margin-top:8px}
/* お客さまが開く領収書のページ（r.html） */
.rpage{max-width:600px;margin:0 auto;padding:16px 16px 40px}
.rpage .lead{font-size:13.5px;color:var(--muted);margin:0 0 4px}

/* 品目を足したあと：何を足したかを上に出す（2026-11-10 本人） */
.added{background:var(--lime);border:1.5px solid #b9cfa9;border-radius:14px;padding:11px 14px;margin:0 0 12px}
.added-t{margin:0;font-size:16px;font-weight:700;color:var(--green);overflow-wrap:anywhere}
.added-t span{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--green);color:#fff;font-size:14px;margin-right:4px}
.added details{margin-top:6px;font-size:14px}.added summary{cursor:pointer;color:var(--green)}
.added ul{margin:6px 0 0;padding-left:1.2em}.added li{margin:2px 0}
.pi .go{color:var(--muted);margin-left:2px}
.pi.hl{background:var(--lime)}

/* 開店する（2026-11-10 本人） */
.open-card{background:#fff;border:2px solid var(--app);border-radius:18px;padding:16px;text-align:center;margin:4px 0 8px}
.open-card .d{font-size:18px;font-weight:700;color:var(--app)}
.open-card p{margin:4px 0 12px;font-size:14px;color:var(--muted)}
.places{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.place{border:2px solid #D3CCBC;background:#fff;border-radius:14px;padding:10px 12px;text-align:left;color:var(--ink);min-height:62px}
.place b{display:block;font-size:16px;line-height:1.3;overflow-wrap:anywhere}.place small{color:var(--muted);font-size:12px}
.place.on{border-color:var(--app);background:var(--app-soft)}
.place.new{border-style:dashed;display:flex;align-items:center;justify-content:center;color:var(--muted);font-weight:700}
.datebox{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 12px;font-size:16px;font-weight:700}
.datebox .textlink{margin-left:auto;color:var(--green)}
.ctabs{display:flex;gap:6px;flex-wrap:wrap}
.ctabs button{border:2px solid #D3CCBC;background:#fff;border-radius:999px;padding:4px 11px;font-size:14px;font-weight:700;color:var(--muted);min-height:40px}
.ctabs button small{font-weight:400;margin-left:4px}
.ctabs button.on{background:var(--app);border-color:var(--app);color:#fff}
.paychips{display:flex;flex-wrap:wrap;gap:6px}
.paychips label{margin:0;cursor:pointer}
.paychips input{position:absolute;opacity:0;width:1px;height:1px}
.paychips span{display:inline-block;border:2px solid #D3CCBC;background:#fff;color:var(--muted);border-radius:999px;padding:5px 12px;font-weight:700;font-size:14px}
.paychips input:checked+span{border-color:var(--app);background:var(--app-soft);color:var(--app)}
.paychips input:focus-visible+span{outline:3px solid var(--app);outline-offset:2px}
.catrow{display:flex;align-items:center;gap:6px;padding:8px 10px;border-bottom:1px solid var(--line);background:#fff;flex-wrap:wrap}
.catrow:last-child{border-bottom:0}.catrow b{flex:1;font-size:16px;min-width:6em}.catrow small{color:var(--muted);font-size:12.5px}
.catrow .field{flex:1 1 140px;min-height:42px}
.catrow .btn{min-height:38px;font-size:13.5px;padding:4px 10px}
.catrow .mv{display:flex;flex-direction:column;gap:2px}
.catrow .mv button{border:1px solid var(--line);background:#fff;border-radius:7px;width:32px;height:22px;font-size:11px;color:var(--muted);padding:0}
.catrow .mv button:disabled{opacity:.35}

/* 値引き（2026-11-10 本人） */
.ln.disc{background:#FFF7EC}
.ln.disc .nm{color:var(--warn-ink);font-weight:700}
.ln.disc .a{color:var(--red)}
.ln.disc .btn{min-height:36px;font-size:13px;padding:2px 10px}
.disc-card{border:2px solid #E9C98F;background:#FFFBF4}

.tipline{background:#FFF6C9;border:1px solid #EBD77A;border-radius:12px;padding:9px 12px;font-size:13.5px;margin:12px 0 4px}