@charset "UTF-8";
/* Shared base. Administrator pages apply their own compact stylesheet. */
body { margin:0; color:#333333; background:#FFFFFF; font:12px/1.65 "Microsoft JhengHei","PingFang TC",Arial,sans-serif; }
table { font-size:inherit; }
td,th,p,a,b,strong,font { font-family:inherit; font-size:inherit; }
a,a:visited { color:#333333; text-decoration:none; }
a:hover { text-decoration:underline; }
b,strong { font-weight:600; }
input,select,textarea,button { font-family:inherit; }

/* Public site: retain the original artwork and layout, unify readable content. */
.public-site { font-size:12px; background:linear-gradient(to bottom,#FFFFFF 0,#FFFFFF 97px,#AAAAAA 97px,#AAAAAA 98px,#F6F6F6 98px,#F6F6F6 260px,#AAAAAA 260px,#AAAAAA 261px,#FFFFFF 261px); background-repeat:no-repeat; background-color:#FFFFFF; }
.public-site td,.public-site th { line-height:1.65; }
.public-site p { margin:4px 0; }
.public-site a,.public-site a:visited,.public-site font[color],.public-site font[face] { color:#333333!important; font-family:inherit!important; }
.public-sidebar { font-size:12px; }
.public-content a,.public-content a:visited { color:#222222!important; text-decoration:underline; text-underline-offset:2px; }
.public-content a:hover { text-decoration-thickness:2px; }
.public-site a:focus-visible { outline:1px solid #666666; outline-offset:2px; }
.public-sidebar font { font-family:inherit!important; }
.public-content { padding:8px; color:#333333; background:#FFFFFF; }
.public-content table { border-collapse:collapse; max-width:100%; }
.public-content td,.public-content th { padding:1px 4px; vertical-align:middle; overflow-wrap:anywhere; }
.public-content td[align="right"] { white-space:nowrap; }
.public-content p { line-height:1.75; }
.public-content input,.public-content select,.public-content textarea,.public-content button { color:#333333; font:13px Arial,"Microsoft JhengHei",sans-serif; }
.public-content input:not([type="hidden"]):not([type="submit"]):not([type="reset"]):not([type="button"]):not([type="radio"]):not([type="checkbox"]) { max-width:100%; box-sizing:border-box; }
.public-content input[name="IDCode"],.public-content input[name="extcode"],.public-content input[name="CardAdd"],.public-content input[name="game_code"] { width:56px!important; }
.public-content select { max-width:100%; box-sizing:border-box; }
.public-content img[src^="captcha_image.asp"] { margin-left:6px; }
.public-content .public-help { display:block; width:320px; max-width:100%; height:44px; box-sizing:border-box; padding:0; border:0; color:#333333; background:#FFFFFF; line-height:20px; resize:none; overflow:auto; }
.public-content table[border="1"],.public-sidebar table[border="1"] { border-collapse:collapse; border:1px solid #D0D0D0; }
.public-content table[border="1"] td,.public-content table[border="1"] th,.public-sidebar table[border="1"] > tbody > tr > td { border:1px solid #D0D0D0; padding:3px 6px; background:#FFFFFF; vertical-align:top; }
.public-content table[border="1"] tr:first-child td,.public-content table[border="1"] th { font-weight:600; }
.public-content font[color="#FF0000"],.public-content font[color="red"] { font-weight:600; }

.public-sidebar table[border="1"] table { width:100%; }
.public-sidebar table[border="1"] font[color] { display:block; }

/* The same compact form geometry is used by each public function. */
.public-content table.public-form { width:420px; max-width:100%; margin:0 auto; table-layout:fixed; }
.public-form > tbody > tr > td:first-child:not([colspan]) { width:110px!important; text-align:right; white-space:nowrap; }
.public-form > tbody > tr > td:nth-child(2) { width:auto!important; text-align:left; }
.public-form > tbody > tr > td.public-form-title { text-align:center; padding:2px 4px 8px; font-weight:600; }
.public-form input[size="10"] { width:116px; }
.public-form select { min-width:116px; }
.public-registration select[name="identity_kind"] { width:116px; min-width:116px; }
.public-content .public-form .public-help { width:300px; }
.public-page-title { margin:0 auto 8px; width:420px; max-width:100%; font-size:12px; font-weight:600; text-align:center; }
.public-intro { width:420px; max-width:100%; margin:0 auto 12px; text-align:left; }
.public-card-guide { width:100%; margin:8px 0; text-align:left; }
.public-content .public-card-guide td:first-child { width:76px; white-space:nowrap; }
.public-card-guide code { font:13px Consolas,monospace; }

.public-form col.public-label-column { width:110px; }

.public-form > tbody > tr > td.public-form-actions { padding-top:8px; text-align:left; }

/* Layout decorations use CSS and text; only content images are retained. */
.public-shell { background:linear-gradient(to right,#FFFFFF 0,#F2F2F2 6px,#D0D0D0 18px,#FFFFFF 19px,#FFFFFF calc(100% - 20px),#D0D0D0 calc(100% - 19px),#F2F2F2 calc(100% - 6px),#FFFFFF 100%); }
.public-toolbar,.public-footer-bar { background:linear-gradient(#F3F3F3,#D0D0D0); }
.public-toolbar { height:26px; border-bottom:1px solid #999999; }
.public-home { display:inline-block; width:50px; line-height:15px; font-size:11px; text-align:right; }
.public-service-title { display:inline-block; min-width:120px; line-height:17px; }
.public-recharge-button { display:inline-block; min-width:76px; box-sizing:border-box; border:1px solid #888888; padding:0 6px; background:linear-gradient(#FFFFFF,#D0D0D0); line-height:20px; text-align:center; letter-spacing:4px; }
.public-menu-arrow { display:inline-block; width:6px; color:#777777; font:12px Arial,sans-serif; }
.public-menu-toggle { width:12px; height:14px; padding:0; border:0; background:transparent; color:#777777; font:12px/14px Arial,sans-serif; cursor:pointer; vertical-align:middle; }
.public-contact-title { display:inline-block; line-height:15px; font-weight:600; }

/* Email and identity fields share the existing email-field width. */
.public-content input[name="email" i],.public-content input[name="oldemail" i],.public-content input[name="confirmemail" i],.public-content input[name="c_mail" i],.public-content input[name="idcard" i],.public-content input[name="abode" i],.public-content input[name="identity_no" i],.public-content input[name="nativenumber" i] { width:176px; max-width:100%; }

/* Keep the terms scrollbar native and the border thin when focused. */
.public-content textarea.public-terms { appearance:auto; border:1px solid #999; border-radius:0; scrollbar-width:auto; scrollbar-color:auto; }
.public-content textarea.public-terms:focus { outline:none; border-color:#555; box-shadow:none; }