:root{--primary:#0b6b0b;--on-primary:#fff;--bg:#fff;--text:#0a0a0a;--muted:#6b7280;}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font:16px/1.4 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Helvetica,Arial}
/* Always show vertical scrollbar and improve touch scrolling */
html{height:100%;scrollbar-gutter:stable both-edges}
body{min-height:100vh;overflow-y:scroll;-webkit-overflow-scrolling:touch}
/* Larger, easier-to-grab scrollbars */
/* Firefox: apply to all scrollable elements */
*{scrollbar-width:auto;scrollbar-color:#8c8c8c #efefef}
/* Chromium/WebKit: apply to all scrollable elements */
*::-webkit-scrollbar{width:22px;height:22px}
*::-webkit-scrollbar-track{background:#efefef}
*::-webkit-scrollbar-thumb{background-color:#8c8c8c;border-radius:12px;border:6px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-thumb:hover{background-color:#6f6f6f}

/* Dark theme scrollbar colors */
.theme-dark *{scrollbar-color:#9ca3af #1f2937}
.theme-dark *::-webkit-scrollbar-thumb{background-color:#9ca3af}
.theme-dark *::-webkit-scrollbar-thumb:hover{background-color:#cbd5e1}
.container{max-width:960px;margin:0 auto;padding:24px}
.center{display:flex;min-height:100vh;align-items:center;justify-content:center;flex-direction:column;gap:16px}
.card{padding:24px;border:1px solid #e5e7eb;border-radius:12px;text-align:center}
.card-link .badge {display: inline-block;background: #eef2ff;color: #3730a3;font-weight: 600;padding: 2px 8px;border-radius: 9999px;font-size: 12px;margin-left: 6px;vertical-align: middle;}
.row{display:flex;gap:12px;justify-content:center}
.btn{background:var(--primary);color:var(--on-primary);border:none;border-radius:8px;padding:12px 16px;cursor:pointer;text-decoration:none;display:inline-block}
.btn.yellow{background:#facc15;color:#1f2937}.btn.yellow:hover{background:#eab308}
.btn.outline{background:transparent;color:var(--primary);border:2px solid var(--primary)}
.appbar{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid #e5e7eb}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.card-link{display:block;border:1px solid #e5e7eb;border-radius:10px;padding:20px;text-decoration:none;color:inherit}
.muted{color:var(--muted)}

/* POS layout */
.pos-grid{display:grid;grid-template-columns:2fr 1fr;gap:12px;padding:12px}
.pos-grid .left{display:flex;flex-direction:column;gap:12px}
.categories{display:flex;gap:8px;flex-wrap:wrap}
.items-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}
.cart{border:1px solid #e5e7eb;border-radius:8px;padding:12px;min-height:180px}
.tickets{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.totals{font-weight:600}

@media (max-width:900px){.pos-grid{grid-template-columns:1fr}}

/* Dark theme */
.theme-dark{--bg:#0b0b0b;--text:#f3f4f6;--muted:#9ca3af}
.theme-dark .card,.theme-dark .appbar,.theme-dark .cart,.theme-dark .card-link{border-color:#374151}
.theme-dark .card-link{color:var(--text)}
