/* Readable typography shared by member, staff and payment screens. */
html{font-size:16px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-size:18px;line-height:1.7}
input,select,textarea,button,.btn{font-size:16px;line-height:1.6}
input,select,textarea{min-height:46px;box-sizing:border-box;max-width:100%}
button,.btn{min-height:44px;box-sizing:border-box}
h1{font-size:30px;line-height:1.4;overflow-wrap:anywhere}
h2{font-size:23px;line-height:1.5}
h3{font-size:20px;line-height:1.5}
th,td{font-size:16px;line-height:1.65;padding:12px}
small,.muted,code,.badge{font-size:16px}
.app-admin .admin-nav{font-size:16px}
.app-admin h1{font-size:30px}.app-admin h2{font-size:23px}
.app-admin .filters{align-items:center;gap:10px}
.app-admin .filters input,.app-admin .filters select{min-width:0}
.app-admin .nav-menu{max-width:calc(100vw - 32px);box-sizing:border-box}
.app-member .member-nav a,.app-member .nav-logout{font-size:16px}
.app-member .member-welcome h1{font-size:30px}
.app-member .member-card-heading{font-size:20px}
.app-member .member-password-toggle{font-size:16px}
.app-auth .auth-label,.app-auth .auth-input,.app-auth .auth-submit{font-size:16px}
.app-auth .auth-password-toggle{font-size:16px!important}
.app-auth .auth-story-content{min-width:0}
.app-auth .auth-feature-row{flex-wrap:wrap}
.app-demo #qr{max-width:100%}
.app-demo #qr img,.app-demo #qr canvas{max-width:100%;height:auto}
@media(max-width:1000px){
 .app-admin .bar{gap:12px}
 .app-admin .admin-nav{order:3;flex-basis:100%;position:relative}
 .app-admin .nav-group{position:static}
 .app-admin .nav-menu{left:0;right:0;min-width:0}
}
@media(max-width:760px){
 body{font-size:17px}
 h1,.app-admin h1,.app-member .member-welcome h1{font-size:26px}
 h2,.app-admin h2{font-size:22px}
 .app-admin .filters>*{max-width:100%}
 .app-admin .filters input,.app-admin .filters select{flex:1 1 180px}
 .app-admin dl.kv{grid-template-columns:1fr;gap:4px}
 .app-admin dl.kv dd{margin:0 0 14px;overflow-wrap:anywhere}
 .app-member .member-nav a,.app-member .nav-logout{font-size:16px;white-space:normal;min-height:76px}
}
.app-member .member-password input{padding-right:85px}.app-member .card-heading{font-size:20px}@media(max-width:420px){.app-member .member-actions{grid-template-columns:1fr}.app-member .member-welcome{flex-wrap:wrap}}

.language-switch{display:inline-flex;align-items:center;gap:2px;border:1px solid var(--border,#46564a);padding:3px;border-radius:9px;flex-shrink:0}.language-switch a{display:grid;place-items:center;min-width:44px;min-height:40px;padding:4px 9px;font-size:16px;line-height:1.5;border-radius:6px;text-decoration:none}.language-switch a[aria-current=true]{background:#dfc37d;color:#1b3023}.app-auth .auth-topbar{flex-wrap:wrap;gap:12px}.app-auth .auth-topbar>.language-switch{margin-right:auto}.app-admin .bar>.language-switch{order:2}.app-member .bar>.language-switch{margin-left:auto}.app-member .bar{flex-wrap:wrap}.demo-language{display:flex;justify-content:flex-end;width:min(1100px,calc(100% - 32px));margin:16px auto}.app-admin .nav-menu a{white-space:normal}.app-member .member-action strong,.app-member .member-action small{overflow-wrap:anywhere}html[lang=en] .auth-story h2{font-size:clamp(28px,3vw,44px);line-height:1.25}html[lang=en] .member-nav{flex-wrap:wrap}@media(max-width:760px){.app-member .bar>.language-switch{width:fit-content;margin-top:12px}.app-admin .bar>.language-switch{order:0}.app-member .member-nav a,.app-member .nav-logout{overflow-wrap:anywhere}}
/* Authentication utility navigation: separate, accessible button targets. */
.app-auth .auth-topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;font-size:16px}
.app-auth .auth-utility-nav{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.app-auth .auth-topbar .auth-utility-link{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;margin:0;padding:10px 15px;border:1px solid var(--auth-line);border-radius:10px;background:var(--auth-card);color:var(--auth-text);font-size:16px;line-height:1.5;text-decoration:none;white-space:normal;text-align:center;transition:background .15s,border-color .15s}
.app-auth .auth-topbar .auth-utility-link:hover{background:var(--auth-field);border-color:#a58d52}
.app-auth .auth-utility-link .member-icon{width:18px;height:18px;flex:0 0 18px}
.app-auth .auth-topbar .auth-utility-account{background:transparent;color:var(--auth-muted)}
@media(max-width:520px){.app-auth .auth-topbar{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}.app-auth .auth-topbar>.language-switch{justify-self:end;margin:0}.app-auth .auth-utility-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:100%}.app-auth .auth-topbar .auth-utility-link{width:100%;padding:10px;min-width:0}}
.member-brand-symbol svg{display:block;width:26px;height:26px}.app-admin .brand{display:inline-flex;align-items:center;gap:10px}.admin-brand-symbol{display:grid;place-items:center;width:38px;height:38px;background:#e7c970;color:#143b2c;border-radius:11px;flex:0 0 38px}.admin-brand-symbol svg{width:28px;height:28px}
/* Keep native selection controls independent of full-width text-field styles. */
input:is([type=checkbox],[type=radio]){appearance:auto;-webkit-appearance:auto;flex:0 0 22px;width:22px;height:22px;min-width:22px;min-height:22px;max-width:22px;padding:0;accent-color:#c29c3f;cursor:pointer}
.app-auth .auth-card .auth-wallet-confirm{display:flex;align-items:flex-start;gap:12px;padding:14px;margin:18px 0;border:1px solid var(--auth-line);border-radius:10px;background:var(--auth-field);font-size:16px;font-weight:400;line-height:1.7;color:var(--auth-text);cursor:pointer}
.app-auth .auth-card .auth-wallet-confirm input[type=checkbox]{appearance:auto;-webkit-appearance:auto;display:block;flex:0 0 22px;width:22px;height:22px;min-width:22px;min-height:22px;max-width:22px;padding:0;margin:3px 0 0;border-radius:4px;accent-color:#c29c3f;cursor:pointer}
.app-auth .auth-wallet-confirm>span{flex:1;min-width:0;overflow-wrap:anywhere}.app-auth .auth-wallet-confirm:focus-within{outline:2px solid #c29c3f;outline-offset:3px}
/* Use the exact two-tone VONGBET mark rather than a monochrome surrogate. */
.vongbet-symbol{display:block;object-fit:contain;flex-shrink:0}.auth-brand-mark .vongbet-symbol,.auth-mobile-brand .vongbet-symbol,.member-brand-symbol .vongbet-symbol,.admin-brand-symbol .vongbet-symbol{width:100%;height:100%}.auth-brand-mark,.member-brand-symbol,.admin-brand-symbol{padding:0!important;background:transparent!important;overflow:hidden}.member-brand-symbol{width:40px;height:40px;flex:0 0 40px}.app-demo .mark{padding:0;background:transparent;overflow:hidden;display:inline-flex}.app-demo .mark .vongbet-symbol{width:38px;height:38px}