*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0;font-family:Arial,Noto Sans Thai,sans-serif}body{background:#f3f4f6}button{font:inherit}.app{min-height:100vh;padding-bottom:90px}.topbar{color:#fff;background:#111827;justify-content:space-between;align-items:center;padding:18px 20px;display:flex}.logo{font-size:22px;font-weight:800}.subtitle{opacity:.7;margin-top:3px;font-size:12px}.credit{text-align:right}.credit span{opacity:.8;font-size:12px;display:block}.credit strong{margin-top:3px;font-size:20px;display:block}main{width:min(900px,100%);margin:auto;padding:20px}.welcome{background:#fff;border-radius:18px;margin-bottom:16px;padding:22px}.welcome h1{margin:0 0 5px;font-size:28px}.welcome p{color:#6b7280;margin:0}.games{gap:14px;display:grid}.game-card{text-align:left;cursor:pointer;background:#fff;border:0;border-radius:18px;align-items:center;gap:16px;width:100%;padding:20px;display:flex;box-shadow:0 2px 8px #0000000d}.game-card:active{transform:scale(.98)}.game-icon{font-size:34px}.game-card b,.game-card small{display:block}.game-card b{font-size:19px}.game-card small{color:#6b7280;margin-top:5px;font-size:14px}.bottom-nav{z-index:20;background:#fff;border-top:1px solid #e5e7eb;justify-content:space-around;height:76px;display:flex;position:fixed;bottom:0;left:0;right:0}.bottom-nav button{cursor:pointer;background:0 0;border:0;min-width:60px;font-size:21px}.bottom-nav span{margin-top:3px;font-size:11px;display:block}@media (width>=700px){.games{grid-template-columns:repeat(3,1fr)}.game-card{text-align:center;flex-direction:column;justify-content:center;min-height:170px}}.loading-screen{place-items:center;min-height:100vh;font-size:20px;display:grid}.login-page{background:#f3f4f6;place-items:center;min-height:100vh;padding:20px;display:grid}.login-card{background:#fff;border-radius:22px;width:min(440px,100%);padding:30px;box-shadow:0 8px 30px #00000014}.login-logo{font-size:28px;font-weight:900}.login-subtitle{color:#6b7280;margin-bottom:25px;font-size:12px}.login-card h1{margin-bottom:5px}.login-card p{color:#6b7280}.login-card label{margin-top:18px;margin-bottom:7px;font-weight:700;display:block}.login-card input{border:1px solid #d1d5db;border-radius:12px;width:100%;min-height:52px;padding:0 15px;font-size:17px}.login-button{color:#fff;background:#111827;border:0;border-radius:13px;width:100%;min-height:54px;margin-top:22px;font-size:17px;font-weight:700}.error-box{color:#991b1b;background:#fee2e2;border-radius:10px;margin-top:15px;padding:12px}.demo-note{text-align:center;color:#6b7280;margin-top:18px;font-size:12px}.dashboard{background:#f3f4f6;min-height:100vh}.dashboard-header{color:#fff;background:#111827;justify-content:space-between;align-items:center;min-height:70px;padding:14px 20px;display:flex}.dashboard-logo{font-size:20px;font-weight:900}.dashboard-header small{opacity:.65}.dashboard-header button{color:#fff;background:0 0;border:1px solid #ffffff4d;border-radius:10px;padding:9px 13px}.dashboard-content{width:min(1000px,100%);margin:auto;padding:20px}.user-card{background:#fff;border-radius:18px;align-items:center;gap:15px;padding:20px;display:flex}.user-card h1{margin:0 0 5px;font-size:22px}.user-card span{color:#6b7280}.avatar{background:#e5e7eb;border-radius:50%;place-items:center;width:55px;height:55px;font-size:23px;font-weight:800;display:grid}.dashboard-grid{grid-template-columns:repeat(3,1fr);gap:14px;margin-top:15px;display:grid}.dashboard-item{background:#fff;border-radius:17px;padding:20px}.dashboard-item span{font-size:25px;display:block}.dashboard-item b,.dashboard-item strong{margin-top:7px;display:block}.dashboard-item strong{font-size:22px}.menu-section{margin-top:20px}.menu-section h2{font-size:20px}.menu-section button{text-align:left;background:#fff;border:0;border-radius:14px;width:100%;min-height:56px;margin-bottom:10px;padding:12px 16px;font-size:16px}@media (width<=650px){.dashboard-grid{grid-template-columns:1fr}.login-card{padding:24px 20px}}