html,body,#root{margin:0;padding:0}button{font-family:inherit}:root{--citylink:#eeb241;--jomsurang:#a9a0cb;--bg:#fafafa;--fg:#222;--muted:#888;--border:#e5e5e5;--primary:#2563eb;--danger:#dc2626;--warn:#f59e0b;--ok:#16a34a}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,Sarabun,sans-serif}.center{text-align:center;justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.error{color:var(--danger)}.muted{color:var(--muted)}.warn{color:var(--warn)}.ok{color:var(--ok)}.page{max-width:720px;margin:0 auto;padding:16px 16px 96px}.header{z-index:10;border-bottom:1px solid var(--border);background:#fff;align-items:center;gap:12px;padding:12px 16px;display:flex;position:sticky;top:0}.header.citylink{background:var(--citylink);color:#fff}.header.jomsurang{background:var(--jomsurang);color:#fff}.header h1{flex:1;margin:0;font-size:18px}.header .meta{opacity:.9;font-size:12px}.btn{border:1px solid var(--border);cursor:pointer;background:#fff;border-radius:8px;justify-content:center;align-items:center;min-height:40px;padding:10px 16px;font-size:15px;display:inline-flex}.btn:hover{background:#f5f5f5}.btn.primary{background:var(--primary);color:#fff;border-color:var(--primary)}.btn.primary:hover{filter:brightness(1.05)}.btn.danger{background:var(--danger);color:#fff;border-color:var(--danger)}.btn.ghost{background:0 0}.btn:disabled{opacity:.5;cursor:not-allowed}.row{align-items:center;gap:8px;display:flex}.spread{justify-content:space-between;align-items:center;gap:8px;display:flex}.stack>*+*{margin-top:12px}.list{gap:8px;display:grid}.card{border:1px solid var(--border);background:#fff;border-radius:10px;padding:12px}.section-title{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:16px 0 6px;font-size:13px;font-weight:600}.item-row{border:1px solid var(--border);background:#fff;border-radius:10px;grid-template-columns:1fr auto;align-items:center;gap:12px;padding:12px;display:grid}.item-row.uncounted{border-left:4px solid var(--muted)}.item-row.counted{border-left:4px solid var(--ok)}.item-row.below-par{border-left:4px solid var(--warn)}.item-name{font-size:16px;font-weight:500}.item-meta{color:var(--muted);margin-top:2px;font-size:12px}.item-note{color:var(--warn);margin-top:2px;font-size:12px}.qty-input{text-align:right;border:1px solid var(--border);border-radius:6px;width:90px;padding:8px 10px;font-size:16px}.qty-input.uncounted{background:#fff8e1}.progress{background:#eee;border-radius:4px;height:8px;overflow:hidden}.progress>div{background:var(--ok);height:100%}.tab-bar{border-top:1px solid var(--border);background:#fff;grid-template-columns:repeat(3,1fr);display:grid;position:fixed;bottom:0;left:0;right:0}.tab-bar a{text-align:center;color:var(--muted);padding:12px 4px;font-size:13px;text-decoration:none}.tab-bar a.active{color:var(--primary);font-weight:600}.table{border-collapse:collapse;width:100%;font-size:14px}.table th,.table td{border-bottom:1px solid var(--border);text-align:left;padding:8px}.table th{background:#f7f7f7;font-weight:600}select,input[type=date],input[type=number],input[type=text]{border:1px solid var(--border);background:#fff;border-radius:6px;padding:8px 10px;font-size:15px}.badge{color:#333;background:#eee;border-radius:4px;padding:2px 6px;font-size:11px;display:inline-block}.badge.warn{color:#92400e;background:#fef3c7}.badge.ok{color:#166534;background:#dcfce7}.badge.closed{color:#991b1b;background:#fee2e2}.badge.open{color:#1e40af;background:#dbeafe}