*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#071719;color:#f9f2dd;font-family:"PingFang SC","Microsoft YaHei",sans-serif}button,input{font:inherit}.page{min-height:100vh;display:flex;justify-content:center;background:#071719}.frame{position:relative;width:min(100vw,520px);min-height:100vh;aspect-ratio:961/1637;overflow:hidden;background:#071719}.background{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none}.content{position:absolute;inset:0;padding:34.9% 3.4% 0}.glass{background:rgba(11,52,55,.8);border:1px solid rgba(231,241,228,.72);box-shadow:0 8px 24px rgba(0,0,0,.18);backdrop-filter:blur(5px)}.account{height:13.7%;border-radius:18px;display:flex;align-items:center;padding:2.6% 5%;gap:5%}.avatar{width:18%;aspect-ratio:1;border:1px solid #f7efd4;border-radius:50%;background:rgba(183,212,218,.36);display:grid;place-items:center;overflow:hidden;color:#dce9ec;font-size:35px}.avatar img{width:100%;height:100%;object-fit:cover}.account-copy{display:flex;flex-direction:column;gap:8%;min-width:0;flex:1}.account-copy strong{font-size:clamp(20px,5vw,30px);font-weight:600}.account-copy span{font-size:clamp(16px,4vw,23px);letter-spacing:1px}.icon-button{border:0;background:transparent;color:#fff;font-size:clamp(28px,7vw,42px);line-height:1;padding:0;cursor:pointer}.stats{height:10.2%;margin-top:1.1%;border-radius:17px;display:grid;grid-template-columns:1fr 1px 1fr 1px 1fr;align-items:center;text-align:center;padding:0 3%}.stats div{display:flex;flex-direction:column;gap:6%}.stats span{font-size:clamp(15px,3.7vw,21px)}.stats strong{font-size:clamp(25px,6.5vw,38px);font-weight:500;color:#ffedb1}.stats i{height:62%;background:rgba(240,242,229,.7)}.menu{height:28.2%;margin-top:1.1%;border-radius:18px;padding:1.2% 5%;display:flex;flex-direction:column}.menu button{flex:1;display:grid;grid-template-columns:12% 1fr auto;align-items:center;gap:2%;border:0;border-bottom:1px solid rgba(232,242,230,.52);background:transparent;color:#fff;text-align:left;font-size:clamp(17px,4.2vw,25px);cursor:pointer;padding:0}.menu button:last-child{border-bottom:0}.menu .mi{font-size:clamp(25px,6vw,36px);font-family:serif}.menu b{font-size:clamp(30px,7vw,42px);font-weight:300}.bottom{position:absolute;left:0;right:0;bottom:0;height:10.8%;display:grid;grid-template-columns:repeat(4,1fr);background:rgba(5,24,27,.88);border:1px solid rgba(125,156,151,.72);border-radius:28px 28px 0 0;padding:2% 3% 1%}.bottom button{border:0;background:transparent;color:#d7e1e4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5%;font-size:clamp(13px,3.3vw,19px);cursor:pointer}.bottom button span{font-size:clamp(26px,6vw,38px);line-height:1}.bottom button.active{color:#ffe5a2}.login{width:min(100vw,520px);min-height:100vh;padding:44px 24px;background:linear-gradient(180deg,#102f30,#071719)}.login h1{font-size:30px;font-weight:500;margin:14px 0 8px}.login p{color:#c7d8d5;margin:0 0 30px}.login form{display:grid;gap:14px}.login input{width:100%;height:48px;border:1px solid rgba(231,241,228,.35);border-radius:10px;padding:0 14px;color:#fff;background:rgba(255,255,255,.1);outline:none}.login button,.primary{height:48px;border:0;border-radius:10px;background:#d9b878;color:#172b2a;cursor:pointer}.error{min-height:22px;color:#ffb2a7}.records{width:min(100vw,520px);min-height:100vh;padding-bottom:30px;background:linear-gradient(180deg,#0b3437,#071719)}.records header{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;background:rgba(8,32,34,.96);position:sticky;top:0}.records header button{border:0;background:transparent;color:#fff;font-size:34px}.records h1{font-size:21px;font-weight:500;margin:0}.record-summary{margin:20px 16px 12px;padding:20px;border:1px solid rgba(231,241,228,.45);border-radius:16px;background:rgba(17,65,66,.78);display:grid;grid-template-columns:1fr 1fr;gap:7px;text-align:center}.record-summary strong{font-size:26px;color:#ffedb1}.record-summary span{color:#c7d8d5;font-size:13px}.record-list{margin:0 16px}.record{display:flex;justify-content:space-between;align-items:center;padding:17px 15px;margin-bottom:10px;border:1px solid rgba(231,241,228,.35);border-radius:14px;background:rgba(17,65,66,.7)}.record div{display:flex;flex-direction:column;gap:7px}.record div:last-child{text-align:right}.record b{font-size:17px}.record strong{font-size:19px;color:#ffedb1}.record span{font-size:13px;color:#c7d8d5}.empty{text-align:center;color:#a8bfbc;padding:60px 0}@media(min-width:521px){.frame{height:100vh;width:auto}}
.screen-hotspots{position:absolute;left:0;right:0;bottom:0;height:11%;display:grid;grid-template-columns:repeat(4,1fr);z-index:3}.screen-hotspots button{border:0;background:transparent;cursor:pointer}
.content{position:absolute;inset:0;padding:0}.content .account{position:absolute;left:3.4%;top:34.9%;width:93.2%;height:13.7%;margin:0}.content .stats{position:absolute;left:3.4%;top:49.7%;width:93.2%;height:10.2%;margin:0}.content .menu{position:absolute;left:3.4%;top:61%;width:93.2%;height:27.2%;margin:0}.content .bottom{position:absolute;left:0;right:0;bottom:0}.content .screen-hotspots{display:none}
.content .menu{padding:0 5%}.content .menu button{min-height:0;font-size:clamp(15px,3.7vw,22px)}.content .menu .mi{font-size:clamp(22px,5vw,30px)}.content .menu b{font-size:clamp(26px,6vw,36px)}
/* Clean artwork profile: transparent hit areas preserve navigation without drawing duplicate components. */
.profile-hotspots{position:absolute;inset:0 0 10.8%;z-index:3;pointer-events:none}.profile-hotspots button{position:absolute;border:0;background:transparent;cursor:pointer;pointer-events:auto}.profile-hotspots .profile-account-hit{left:78%;top:34.9%;width:18%;height:13.7%}.profile-hotspots button:not(.profile-account-hit){left:7%;width:86%;height:5.45%}.profile-hotspots button:nth-child(2){top:61%}.profile-hotspots button:nth-child(3){top:66.45%}.profile-hotspots button:nth-child(4){top:71.9%}.profile-hotspots button:nth-child(5){top:77.35%}.profile-hotspots button:nth-child(6){top:82.8%}

.content .screen-hotspots{display:grid}


.menu .mi{display:none}.content .menu button{grid-template-columns:1fr auto}.content .menu{padding-left:7%;padding-right:5%}


.reminder-frame{aspect-ratio:941/1672;container-type:inline-size}
.reminder-back{position:absolute;top:1%;left:2%;z-index:4;border:1px solid #b4c7be80;border-radius:20px;background:#153337dd;color:#fff;padding:6px 12px;font-size:12px}
.reminder-money{position:absolute;left:24%;top:59%;width:30%;color:#ffe3a0;font-size:clamp(20px,6cqw,34px);font-family:serif}
.reminder-count{position:absolute;left:62%;top:55%;width:22%;height:4%;display:grid;place-items:center;background:#233f47;border-radius:10px;color:#ffe3a0;font-family:serif;font-size:clamp(14px,4.5cqw,26px);white-space:nowrap}
.reminder-date{position:absolute;left:73%;top:59.5%;width:14%;height:2%;display:grid;place-items:center;background:#233f47;border-radius:4px;color:#fff7de;font-size:clamp(8px,2.2cqw,13px);white-space:nowrap}
.reminder-refresh{position:absolute;top:67%;left:32%;width:36%;padding:9px 4px;border:1px solid #dac99e80;border-radius:20px;color:#f7e4b9;background:#183a4099;font-size:12px;cursor:pointer}
.content .menu{height:21.8%}
.ledger-list{margin-top:18px}.ledger-row{display:flex;justify-content:space-between;align-items:center;padding:16px 14px;margin-bottom:10px;border-bottom:1px solid rgba(231,241,228,.28);background:rgba(17,65,66,.62);border-radius:12px}.ledger-date,.ledger-amount{display:flex;flex-direction:column;gap:6px}.ledger-amount{text-align:right}.ledger-date b{font-size:16px}.ledger-date span,.ledger-amount span{font-size:12px;color:#c7d8d5}.ledger-amount strong{font-size:18px;color:#ffedb1}

.content .menu{z-index:5;pointer-events:auto}.content .menu button{position:relative;z-index:6;pointer-events:auto}

.settings-page{background:linear-gradient(180deg,#0b3437,#071719)}.settings-card{margin:20px 16px;padding:0 16px;border:1px solid rgba(231,241,228,.4);border-radius:16px;background:rgba(17,65,66,.78)}.settings-user{padding:20px 0;display:flex;flex-direction:column;gap:6px;border-bottom:1px solid rgba(232,242,230,.3)}.settings-user strong{font-size:22px}.settings-user span{color:#c7d8d5}.settings-item{width:100%;height:58px;display:flex;align-items:center;justify-content:space-between;border:0;border-bottom:1px solid rgba(232,242,230,.3);background:transparent;color:#fff;text-align:left;font-size:17px;cursor:pointer}.settings-item:last-child{border-bottom:0}.settings-item b{font-size:28px;font-weight:300}.settings-item.danger{color:#ffb3a5}.password-form{margin:20px 16px;padding:20px;border:1px solid rgba(231,241,228,.4);border-radius:16px;background:rgba(17,65,66,.78);display:grid;gap:12px}.password-form label{display:grid;gap:7px;color:#d7e4e1;font-size:14px}.password-form input{height:44px;border:1px solid rgba(231,241,228,.35);border-radius:9px;padding:0 12px;color:#fff;background:rgba(255,255,255,.1)}
.signed-contract-hotspot{position:absolute;left:56%;top:65%;width:34%;height:7%;z-index:4;border:0;background:transparent;cursor:pointer}.contract-page{background:linear-gradient(180deg,#0b3437,#071719)}.contract-total{margin:18px 16px;color:#ffedb1;font-size:20px;text-align:center}.contract-list{margin:0 16px;padding:8px 14px;border:1px solid rgba(231,241,228,.4);border-radius:15px;background:rgba(17,65,66,.78)}.contract-row{min-height:64px;display:flex;align-items:center;gap:10px;border-bottom:1px solid rgba(231,241,228,.25);cursor:pointer}.contract-row:last-child{border-bottom:0}.contract-row input{width:20px;height:20px;accent-color:#d9b878}.contract-row span{flex:1;display:flex;flex-direction:column;gap:4px}.contract-row b{font-size:15px}.contract-row small{font-size:11px;color:#b9cfca}.contract-row em{font-size:24px;font-style:normal}.contract-sign{display:block;width:calc(100% - 32px);margin:24px 16px}.contract-sign:disabled{opacity:.55;cursor:not-allowed}
.contract-status{margin:8px 16px;color:#ffedb1;text-align:center;font-size:14px}.identity-upload{margin:16px;padding:14px;border:1px solid rgba(231,241,228,.35);border-radius:15px;background:rgba(17,65,66,.72);color:#f2f4e9}.identity-upload strong{display:block;font-size:16px}.identity-upload p{font-size:12px;line-height:1.6;color:#bfd1ce}.identity-upload input[type=file]{display:block;width:100%;margin:10px 0;color:#dfe9e5}.identity-upload label{display:flex;gap:8px;align-items:center;font-size:12px}.identity-upload label input{width:18px;height:18px;accent-color:#d9b878}
.content .menu{height:28%}.message-dot{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;margin-left:7px;padding:0 4px;border-radius:10px;background:#e84d4d;color:#fff;font-size:10px;font-style:normal}.messages-page{background:linear-gradient(180deg,#092d31,#07191b);min-height:100vh;color:#eff4ed}.messages-page header{display:flex;align-items:center;justify-content:space-between;padding:18px 16px}.messages-page header button{background:none;border:0;color:#f4f0dc;font-size:15px}.messages-page header button:first-child{font-size:30px}.messages-page h1{margin:0;font-size:20px}.message-list{margin:0 16px;border-radius:15px;background:rgba(17,65,66,.78);padding:0 14px}.message-item{padding:16px 4px;border-bottom:1px solid rgba(231,241,228,.25);display:flex;flex-direction:column;gap:7px}.message-item:last-child{border-bottom:0}.message-item span{font-size:11px;color:#b9cfca}.message-item.unread b{color:#ffedb1}.mark-all{font-size:12px!important}
.monthly-price-overlay{position:absolute;z-index:2;left:59.5%;top:56.9%;width:30%;height:7.1%;display:flex;align-items:center;justify-content:center;padding:0 2%;border-radius:12px;background:rgba(31,59,57,.92);backdrop-filter:blur(5px);color:#ffe7ad;font-family:serif;font-size:clamp(20px,5.6vw,36px);letter-spacing:-.04em;white-space:nowrap;pointer-events:none}
.captcha-line{display:flex;align-items:center;gap:10px}.captcha-image{width:132px;height:44px;object-fit:cover;border-radius:7px;background:rgba(255,255,255,.12)}.captcha-refresh,.login-link{border:0;background:transparent;color:#f4dfae;cursor:pointer}.login-link{height:34px}
.signature-box{margin:16px;padding:14px;border:1px solid rgba(231,241,228,.35);border-radius:15px;background:rgba(243,246,230,.9);color:#173d3e}.signature-title{display:flex;justify-content:space-between;align-items:center}.signature-clear{border:0;background:none;color:#5e7772;font-size:12px}.signature-pad{display:block;width:100%;height:110px;margin:10px 0;border:1px dashed #93aaa1;border-radius:8px;background:#fff;touch-action:none}.signature-box p{margin:0;font-size:11px;color:#607772}
.contract-doc-modal{position:fixed;inset:0;z-index:20;display:flex;align-items:flex-end;justify-content:center;padding:12px;background:rgba(1,16,18,.68)}.contract-doc-modal[hidden]{display:none}.contract-doc-sheet{position:relative;width:min(680px,100%);max-height:88vh;overflow:auto;padding:24px 20px 30px;border:1px solid rgba(231,241,228,.55);border-radius:22px 22px 10px 10px;background:linear-gradient(180deg,#f5f5e9,#e8eee0);color:#173d3e;box-shadow:0 -12px 40px rgba(0,0,0,.28)}.contract-doc-close{position:absolute;right:14px;top:10px;width:34px;height:34px;border:0;border-radius:50%;background:#d9b878;color:#173d3e;font-size:25px;line-height:1;cursor:pointer}.contract-doc-sheet h2{margin:0 42px 8px 0;font-size:22px;color:#173d3e}.contract-doc-meta{margin:0 0 18px;padding-bottom:12px;border-bottom:1px solid rgba(23,61,62,.2);font-size:12px;color:#607772;line-height:1.6}.contract-doc-body section{margin:0 0 17px}.contract-doc-body h3{margin:0 0 5px;font-size:15px;color:#173d3e}.contract-doc-body p{margin:0;font-size:13px;line-height:1.85;color:#385b57;white-space:pre-wrap}.contract-row:focus-within{outline:2px solid rgba(217,184,120,.8);outline-offset:-2px}
.game-access{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px;padding:14px 16px}.game-access>div{min-width:0;display:flex;flex-direction:column;gap:3px}.game-access>div:last-child{grid-column:1 / -1}.game-access span{font-size:12px;color:#c2d6cf}.game-access strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:17px;color:#fff1bd}.game-access small{font-size:10px;color:#adc5bd}.access-code{letter-spacing:2px}
.camera-actions{display:flex;gap:10px;margin:10px 0}.camera-actions button{border:1px solid #d6b873;border-radius:8px;background:#f4edcf;color:#173d3e;padding:8px 12px}.camera-actions button:disabled{opacity:.45}.identity-preview{display:none;width:150px;height:150px;object-fit:cover;object-position:center 22%;border-radius:12px;background:#07191b;margin:8px 0}.identity-preview[src],.identity-preview[srcObject]{display:block}

.game-home{margin:0 auto;padding-bottom:100px}.home-description{padding:0 20px;color:#bfd1ce;line-height:1.7}.home-access{margin:16px;border-radius:18px;padding:22px}.home-access h2{margin:0 0 20px;font-size:22px;color:#ffedb1}.home-access dl{margin:0}.home-access dt{color:#bfd1ce;font-size:14px;margin-top:18px}.home-access dd{margin:6px 0 0;font-size:21px;overflow-wrap:anywhere}.home-access p{color:#bfd1ce;font-size:13px}.home-refresh{display:block;width:calc(100% - 32px);margin:20px 16px}.home-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,520px);display:grid;grid-template-columns:repeat(4,1fr);padding:18px 8px calc(18px + env(safe-area-inset-bottom));background:#092729;border-top:1px solid #769792;z-index:5}.home-nav button{border:0;background:transparent;color:#d8e5e1;padding:8px}.home-nav [aria-current]{color:#ffdf9a}
