:root{color-scheme:light;--bg: #f4f6f8;--panel: #ffffff;--line: #d8dee6;--text: #16202c;--muted: #5b6b7d;--accent: #0b6bcb;--accent-weak: #e7f0fb;--warn: #b25e00;--warn-weak: #fff3e0;--danger: #b3261e;--ok: #0f7b3f;--ok-weak: #e6f4ea}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:Hiragino Kaku Gothic ProN,Yu Gothic,Meiryo,system-ui,-apple-system,sans-serif;font-size:15px;line-height:1.6}.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}.app{max-width:1100px;margin:0 auto;padding:0 12px calc(104px + env(safe-area-inset-bottom,0px))}.appbar{position:sticky;top:0;z-index:20;background:var(--panel);border-bottom:1px solid var(--line);padding:10px 12px;margin:0 -12px 12px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.appbar h1{font-size:17px;margin:0}.appbar .spacer{flex:1}.appbar .sync{color:var(--muted);font-size:12px}.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}.tabs a{display:block;padding:10px 14px;border-radius:10px;text-decoration:none;background:var(--panel);color:var(--text);border:1px solid var(--line);font-weight:600}.tabs a.active{background:var(--accent);color:#fff;border-color:var(--accent)}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:12px}.panel h2{font-size:15px;margin:0 0 10px}input,select,button,textarea{font:inherit;color:var(--text)}input[type=text],input[type=password],input[type=number],input[type=date],select,textarea{padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;width:100%}.scan-input{font-size:20px;padding:14px;letter-spacing:.02em}button{padding:10px 16px;border-radius:8px;border:1px solid var(--line);background:var(--panel);cursor:pointer;font-weight:600}button:disabled{opacity:.5;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.big{padding:14px 18px;font-size:16px;width:100%}button.ghost{background:transparent}button.danger{color:var(--danger);border-color:#e7c3c0}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.grow{flex:1;min-width:160px}.muted{color:var(--muted)}.small{font-size:13px}.right{text-align:right}.msg{padding:10px 12px;border-radius:8px;margin-bottom:10px}.msg.error{background:#fdecea;color:var(--danger)}.msg.ok{background:var(--ok-weak);color:var(--ok)}.msg.warn{background:var(--warn-weak);color:var(--warn)}table{border-collapse:collapse;width:100%}th,td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}th{background:#f7f9fb;font-size:13px;color:var(--muted);white-space:nowrap}td.num,th.num{text-align:right;white-space:nowrap}.hit{border:1px solid var(--line);border-radius:10px;padding:12px;margin-bottom:10px}.hit.single{border-color:var(--accent);background:var(--accent-weak)}.hit .title{font-weight:700;font-size:16px}.hit .meta{color:var(--muted);font-size:13px}.hit .qty{font-size:22px;font-weight:700}.cartbar{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--panel);border-top:1px solid var(--line);padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));display:flex;gap:12px;align-items:center;justify-content:space-between;box-shadow:0 -2px 8px #0000000f}.cartbar .count{font-weight:700}.po-toggle{width:100%;text-align:left;display:flex;align-items:center;gap:10px;padding:12px 14px}.po-toggle .mark{flex:0 0 auto;color:var(--muted);font-size:12px}.po-toggle .body{flex:1 1 auto;min-width:0}.po-toggle .name{font-weight:700}.po-toggle .sub{font-weight:400;font-size:12px;color:var(--muted)}.po-toggle .rest{flex:0 0 auto;text-align:right;font-size:12px;color:var(--muted)}.po-toggle .rest b{display:block;font-size:17px;color:var(--text)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#fff9;z-index:50;display:flex;align-items:center;justify-content:center}.spinner{width:34px;height:34px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--accent);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:560px){body{font-size:16px}.app{padding:0 8px 96px}.tabs a{flex:1 1 44%;text-align:center;padding:12px 8px}.appbar h1{font-size:15px}th,td{padding:8px 6px}}
