@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700;800&display=swap');
:root{font-family:'Noto Sans JP',system-ui,-apple-system,'Segoe UI',sans-serif;color:#202a39;background:#f6f8fc;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.42;cursor:not-allowed}a{color:inherit}#app{min-height:100vh}.layout{display:flex;min-height:100vh}.sidebar{background:#fff;border-right:1px solid #e8edf3;width:245px;padding:26px 13px 20px;position:sticky;top:0;align-self:flex-start;height:100vh;flex-shrink:0;display:flex;flex-direction:column}.brand{font-size:22px;font-weight:800;letter-spacing:-1px;padding:4px 13px 24px;display:flex;align-items:center;gap:10px}.brand-mark{width:35px;height:35px;border-radius:12px;background:#4b67d4;color:#fff;display:grid;place-items:center;font-size:23px}.brand span small{font-size:9px;color:#98a0ae;display:block;letter-spacing:1.6px;font-weight:600}.nav-label{font-size:10px;letter-spacing:1.4px;font-weight:800;color:#9da6b5;padding:16px 13px 10px}.nav button{background:none;border:0;display:flex;gap:11px;align-items:center;padding:13px 14px;border-radius:12px;width:100%;text-align:left;font-size:13px;color:#677287;font-weight:600}.nav button span{font-size:18px;min-width:22px;text-align:center}.nav button:hover{background:#f5f7fb}.nav button.active{background:#edf1ff;color:#4661cc;font-weight:800}.side-foot{margin-top:auto;padding:13px;background:#f5f7fd;border-radius:12px;font-size:11px;color:#7c8799;line-height:1.7}.main{flex:1;min-width:0}.top{height:68px;border-bottom:1px solid #e9edf2;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 32px;gap:8px}.top strong{font-size:13px}.top-right{display:flex;align-items:center;gap:10px}.pill{border:1px solid #dfe6f0;border-radius:999px;padding:8px 12px;font-size:11px;font-weight:700;background:#fff;max-width:245px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.badge{display:inline-flex;align-items:center;gap:4px;padding:5px 9px;border-radius:100px;background:#edf2fa;color:#65738a;font-size:10px;font-weight:800;white-space:nowrap}.badge.good{background:#e6f7ef;color:#198352}.badge.warn{background:#fff3dc;color:#a36a0b}.badge.red{background:#ffe8e8;color:#bb4141}.content{padding:30px 36px 85px;max-width:1330px;margin:0 auto}.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px;flex-wrap:wrap}.eyebrow{text-transform:uppercase;font-size:10px;letter-spacing:1.7px;font-weight:800;color:#8493c0}.page-head h1{margin:5px 0 6px;font-size:27px;letter-spacing:-1px}.page-head p,.muted{color:#8590a0}.page-head p{margin:0;font-size:12px;line-height:1.7}.row{display:flex;align-items:center;gap:10px}.row.spread{justify-content:space-between}.row.wrap{flex-wrap:wrap}.btn{border:1px solid transparent;border-radius:10px;padding:10px 15px;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:7px;line-height:1.5;white-space:nowrap}.btn.primary{background:#536bd4;color:white;box-shadow:0 5px 12px #536bd41c}.btn.primary:hover{background:#3f59c0}.btn.secondary{background:#fff;color:#43506a;border-color:#dfe5f0}.btn.secondary:hover{background:#f6f8fe}.btn.ghost{border-color:transparent;background:transparent;color:#72819c}.btn.danger{background:#fff1f1;border-color:#ffd7d7;color:#bd5050}.btn.sm{padding:7px 10px;font-size:11px}.btn.block{width:100%}.grid{display:grid;gap:16px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.card{background:white;border:1px solid #e6ebf1;border-radius:17px;padding:21px;box-shadow:0 2px 8px #14244603;min-width:0}.card h2{margin:0;font-size:15px;letter-spacing:-.35px}.card p.sub{margin:4px 0 0;font-size:11px;color:#8491a2}.card-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}.stat .label{font-size:11px;font-weight:700;color:#8793a3}.stat .value{font-size:25px;font-weight:800;margin-top:12px;letter-spacing:-.7px;word-break:break-word}.stat .note{font-size:10px;color:#929cab;margin-top:7px}.purple{color:#526acc}.green{color:#1a9a6b}.redtext{color:#d25154}.thin{color:#94a0ae}.list-line{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #f0f2f6;padding:12px 0}.list-line:last-child{border-bottom:0}.list-line strong{font-size:12px}.list-line small{display:block;color:#97a1ae;font-size:10px;margin-top:4px}.line-right{display:flex;align-items:center;gap:10px}.table-overflow{overflow-x:auto}.table{width:100%;border-collapse:collapse;font-size:12px}.table th{text-align:left;color:#8e99a9;font-size:10px;font-weight:700;padding:11px 9px;border-bottom:1px solid #e9eef4;white-space:nowrap}.table td{padding:12px 9px;border-bottom:1px solid #f0f3f7;vertical-align:middle}.table tr:last-child td{border-bottom:0}.table .num{text-align:right;font-variant-numeric:tabular-nums}.table .name{font-weight:700}.progress{height:8px;background:#edf1f6;border-radius:20px;overflow:hidden}.progress span{height:100%;display:block;background:#6a7ee6;border-radius:20px}.notice{border-radius:12px;background:#edf3ff;border:1px solid #dce8ff;color:#596c94;padding:13px 15px;font-size:11px;line-height:1.8}.notice.warning{background:#fff7e8;border-color:#ffe7c0;color:#8a682f}.notice.error{background:#fff0f0;border-color:#ffcaca;color:#a83c3c}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field{display:flex;flex-direction:column;gap:6px;font-size:11px;color:#647087;font-weight:700;min-width:0}.field.full{grid-column:1/-1}.field input,.field select,.field textarea,.input{padding:11px 12px;border:1px solid #dce4ef;border-radius:10px;background:white;color:#253247;width:100%;font-size:13px;outline-color:#637aea;min-width:0}.field textarea{min-height:96px;resize:vertical}.field small{font-size:10px;color:#a0aab5;font-weight:400}.choice{display:flex;align-items:center;gap:7px;font-size:12px}.choice input{accent-color:#566cda}.tabbar{display:flex;align-items:center;gap:6px;background:#eef1f7;border-radius:12px;padding:5px;max-width:max-content;margin-bottom:20px}.tabbar button{border:0;background:none;padding:9px 16px;border-radius:9px;font-weight:700;color:#758194;font-size:12px}.tabbar button.active{background:white;color:#465ebd;box-shadow:0 2px 7px #1b254513}.empty{padding:28px 14px;text-align:center;color:#9aa5b3;font-size:12px;line-height:1.8}.empty b{display:block;color:#657286;margin-bottom:5px}.item-button{background:#fff;border:1px solid #e3e9f3;border-radius:15px;min-height:115px;padding:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;text-align:center}.item-button:hover{border-color:#8c9be1;box-shadow:0 4px 15px #6b83d41a}.item-button .emoji{font-size:28px}.item-button .price{font-size:12px;color:#5367c7;font-weight:800}.queue-card{border:1px solid #e5eaf2;border-radius:15px;padding:16px;margin-bottom:12px;background:#fff}.queue-card .order-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.queue-card .order-id{font-size:18px;font-weight:800}.queue-card .order-item{padding:5px 0;font-size:13px;font-weight:700}.queue-card .order-item small{display:block;color:#8290a3;font-weight:500;padding-left:8px}.queue-card .order-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.queue-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.oneline{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:12px 0}.oneline b{font-size:13px}.oneline span{font-size:12px}.totals{border-top:1px solid #eff2f6;margin-top:14px;padding-top:10px}.tag{border-radius:6px;background:#f1f4fa;color:#647189;padding:3px 7px;font-size:10px;font-weight:700}.tag.green{background:#e8f7ee;color:#13804c}.tag.yellow{background:#fff1d8;color:#a76a00}.tag.blue{background:#e7efff;color:#3863ba}.big-count{font-size:28px;font-weight:800}.shopping-check{width:19px;height:19px;accent-color:#496bd8;cursor:pointer}.dialog-backdrop{position:fixed;inset:0;background:#101a30a6;z-index:30;display:flex;align-items:center;justify-content:center;padding:17px}.dialog{width:min(630px,100%);max-height:90vh;overflow-y:auto;background:white;border-radius:18px;padding:23px;box-shadow:0 20px 80px #07122c42}.dialog h2{margin:0 0 14px;font-size:19px}.dialog .actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:100;padding:12px 18px;border-radius:12px;background:#25364f;color:white;box-shadow:0 6px 25px #0003;font-size:12px;max-width:min(92vw,500px)}.toast.err{background:#ad3d45}.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:28px}.auth-wrap .card{width:min(450px,100%);padding:30px}.auth-wrap h1{margin:12px 0;font-size:24px}.auth-wrap p{font-size:12px;color:#8491a2;line-height:1.8}.public-wrap{max-width:700px;margin:auto;padding:20px 18px 80px}.public-hero{background:linear-gradient(145deg,#6178dd,#3c56ad);color:white;border-radius:23px;padding:30px;margin:12px 0 18px}.public-hero h1{font-size:25px;margin:8px 0}.public-hero p{opacity:.85;font-size:12px}.qtybuttons{display:flex;align-items:center;gap:8px}.qtybuttons button{border:1px solid #d8deeb;background:white;border-radius:8px;width:30px;height:30px}.bottom-nav{display:none}.codebox{padding:13px;border-radius:11px;background:#f1f4fa;word-break:break-all;font-size:11px}.smallhelp{color:#97a1af;font-size:11px;line-height:1.8}.section-gap{margin-top:18px}.separator{height:1px;background:#eaf0f6;margin:16px 0}.big-label{font-size:11px;color:#8995a6;font-weight:700}.highlight{background:#f5f7ff;border:1px solid #e4e9ff;border-radius:12px;padding:14px}.hamburger{display:none}.checkbox-line{display:flex;align-items:center;gap:8px;cursor:pointer}.readonly{background:#f6f8fd}.top-mode{display:flex;gap:4px;background:#f3f5fa;border-radius:11px;padding:4px}.top-mode button{border:0;background:transparent;border-radius:9px;padding:8px 12px;font-size:12px;font-weight:800;color:#8894a5}.top-mode button.active{background:#fff;color:#536bd4}.no-print{}@media(max-width:1060px){.grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}.sidebar{width:210px}.content{padding:26px 22px 85px}}@media(max-width:760px){.sidebar{display:none}.top{padding:0 15px;height:59px}.top strong{font-size:12px}.top-right .pill{max-width:150px}.content{padding:20px 14px 95px}.page-head h1{font-size:23px}.grid.two,.grid.three,.grid.four,.queue-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.card{padding:16px}.page-head{margin-bottom:18px}.bottom-nav{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:10;background:white;border-top:1px solid #e3e9f2;justify-content:space-around;padding:5px 1px calc(5px + env(safe-area-inset-bottom))}.bottom-nav button{flex:1;border:0;background:transparent;color:#8a95a3;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:10px;font-weight:600;padding:5px 0}.bottom-nav button.active{color:#4d66d3}.bottom-nav button .ico{font-size:19px}.tabbar{max-width:100%;overflow:auto}.tabbar button{padding:9px 10px;white-space:nowrap;font-size:11px}.item-button{min-height:105px}.stats-scroll{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.stat .value{font-size:22px}.top-mode button{padding:7px 9px;font-size:10px}}@media(min-width:761px){.stats-scroll{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}}@media print{.sidebar,.top,.bottom-nav,.no-print,.page-head button,.btn{display:none!important}.content{padding:0}.card{break-inside:avoid}.layout{display:block}body{background:#fff}}

/* Contextual help: opt-in, no forced onboarding, no data writes. */
.help-trigger{white-space:nowrap;display:inline-flex;align-items:center;gap:5px}
.field-wrap{position:relative;min-width:0}
.field-wrap .field{width:100%}
.field-wrap .field-help{position:absolute;right:3px;top:0;min-width:23px;height:23px;border:1px solid #c9d5ec;border-radius:50%;background:#f1f5ff;color:#4563a9;font-size:12px;font-weight:800;cursor:pointer;line-height:1}
.field-wrap .field-help:focus-visible,.help-trigger:focus-visible{outline:3px solid #849bf3;outline-offset:2px}
.field-wrap:has(.field-help) .field{padding-top:0}
.field-wrap:has(.field-help) .field>input,.field-wrap:has(.field-help) .field>select{margin-top:0}
.help-overlay{position:fixed;inset:0;background:#101a30b8;z-index:100;display:flex;align-items:center;justify-content:center;padding:16px}
.help-panel{width:min(540px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:white;border-radius:20px;padding:25px;box-shadow:0 22px 90px #09163155}
.help-panel h2{font-size:20px;margin:7px 0 0;color:#202a39}
.help-panel-small{max-width:440px}
.help-intro{color:#56667d;font-size:14px;line-height:1.8;margin:17px 0}
.help-steps{margin:12px 0 18px;padding-left:26px;display:grid;gap:11px;color:#2c394d;font-size:13px;line-height:1.75}
.help-steps li{padding-left:3px}
.help-steps li::marker{color:#596dd1;font-weight:800}
.help-tip{background:#f2f5ff;border-radius:12px;padding:13px 15px;font-size:13px;line-height:1.75;color:#3e5176}
.help-tip p{margin:4px 0 0}
.help-footer{display:flex;justify-content:flex-end;margin-top:18px}
@media(max-width:600px){.help-panel{padding:20px}.help-panel h2{font-size:18px}.page-head .help-trigger{font-size:12px}}
@media print{.help-overlay,.help-trigger,.field-help{display:none!important}}
