:root{--bg: #f8fafc;--surface: #ffffff;--border: #e2e8f0;--text: #0f172a;--muted: #64748b;--accent: #2563eb;--accent-text: #ffffff;--danger: #dc2626;color-scheme:light dark}@media (prefers-color-scheme: dark){:root{--bg: #0b1220;--surface: #131c2e;--border: #223047;--text: #e6ebf2;--muted: #8b9bb4;--accent: #3b82f6;--accent-text: #ffffff}}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}#app{max-width:1000px;margin:0 auto;padding:0 16px calc(40px + env(safe-area-inset-bottom));padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}.topbar{position:sticky;top:0;z-index:5;background:var(--bg);padding-top:max(16px,env(safe-area-inset-top));padding-bottom:10px}.topbar-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:10px}h1{font-size:1.25rem;margin:0;flex:1}.controls{display:grid;grid-template-columns:1fr;gap:8px}@media (min-width: 640px){.controls{grid-template-columns:1.4fr 1fr 1fr}}input[type=search],select{font-size:16px;padding:11px 12px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text);width:100%}input[type=search]:focus,select:focus{outline:2px solid var(--accent);outline-offset:-1px}.meta-row{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:4px 12px;margin-top:8px;font-size:.82rem}.meta-row a{color:var(--accent);text-decoration:none}.meta-row a:hover{text-decoration:underline}.muted{color:var(--muted)}.btn{border:1px solid var(--border);background:var(--surface);color:var(--text);padding:10px 14px;border-radius:8px;font-size:.9rem;cursor:pointer;white-space:nowrap;min-height:40px}.btn:hover{border-color:var(--accent)}.btn-primary{background:var(--accent);color:var(--accent-text);border-color:var(--accent);width:100%}.btn-ghost{background:transparent}.empty-state{text-align:center;color:var(--muted);padding:40px 0}.shop-table{width:100%;border-collapse:collapse;font-size:.9rem}.shop-table thead{display:none}.shop-table tbody tr{display:grid;grid-template-columns:1fr auto;gap:2px 12px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:12px;margin-bottom:8px}.shop-table td{border:none;padding:0}.shop-table td.col-outlet{grid-column:1 / 2;font-weight:600;word-break:break-word}.shop-table td.col-qr{grid-row:1 / 4;grid-column:2 / 3;align-self:center}.shop-table td.col-code,.shop-table td.col-beat-pc,.shop-table td.col-visi{grid-column:1 / 2;color:var(--muted);font-size:.82rem}.shop-table td.col-beat-pc span{display:block}@media (min-width: 720px){.shop-table thead{display:table-header-group}.shop-table thead th{text-align:left;font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding:8px 10px}.shop-table tbody tr{display:table-row;border-radius:0;margin-bottom:0;border:none;border-bottom:1px solid var(--border)}.shop-table tbody tr:hover{background:color-mix(in srgb,var(--accent) 6%,var(--surface))}.shop-table td{display:table-cell;padding:10px;vertical-align:middle}}.qr-thumb-btn{border:1px solid var(--border);background:var(--surface);border-radius:8px;padding:8px;cursor:pointer;line-height:0;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}.modal[hidden]{display:none}.modal{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:16px;padding-bottom:max(16px,env(safe-area-inset-bottom))}.modal-backdrop{position:absolute;inset:0;background:#00000080}.modal-card{position:relative;background:var(--surface);border-radius:14px;padding:24px;max-width:340px;width:100%;max-height:calc(100vh - 32px);overflow-y:auto;text-align:center;box-shadow:0 20px 60px #0000004d}.modal-close{position:absolute;top:4px;right:4px;border:none;background:none;font-size:1.6rem;color:var(--muted);cursor:pointer;width:44px;height:44px}.modal-card h2{font-size:1.05rem;margin:4px 30px 2px 0}.modal-card p{margin:4px 0}.qr-wrap{display:flex;justify-content:center;margin:16px 0}.qr-wrap canvas{border-radius:8px;max-width:100%;height:auto}.scanner-text{font-size:.85rem;word-break:break-all;margin-bottom:16px!important}.toast{position:fixed;bottom:max(20px,calc(env(safe-area-inset-bottom) + 12px));left:50%;transform:translate(-50%);max-width:calc(100vw - 32px);background:var(--text);color:var(--bg);padding:10px 18px;border-radius:999px;font-size:.85rem;text-align:center;z-index:30}