*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body,div,span,p,a,img,ul,li,form,input,textarea,button,select,h1,h2,h3,h4,h5,h6{margin:0;padding:0}
html,body{height:100%;font-family:'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;font-size:14px;color:var(--c-text);background:var(--bg-page);-webkit-text-size-adjust:100%}
#app{min-height:100vh;background:linear-gradient(180deg,var(--bg-page),var(--bg-page2))}
#app[data-fs="small"]{zoom:0.88;min-height:113.7vh}
#app[data-fs="medium"]{zoom:1}
#app[data-fs="large"]{zoom:1.12;min-height:89.3vh}

input,textarea,button,select{font-family:inherit;outline:none;border:none;background:none}
a{text-decoration:none;color:inherit}

.page-container{padding:0 0 60px;min-height:100vh;background:linear-gradient(180deg,var(--bg-page),var(--bg-page2))}

.page-header{position:sticky;top:0;z-index:50;padding:0 16px;background:var(--bg-page);display:flex;align-items:center;justify-content:space-between;height:44px;border-bottom:1px solid var(--border-subtle)}
.page-header-title{font-size:17px;font-weight:bold;color:var(--c-text-b);letter-spacing:1px}
.page-header-right{display:flex;align-items:center;gap:8px}
.page-body{padding:6px 16px 0;margin-top:0}

.card{position:relative;background:var(--bg-card-solid);border:1px solid var(--border-card);border-radius:12px;padding:12px 14px;margin-bottom:8px;overflow:hidden;box-shadow:0 2px 12px var(--c-btn-glow),0 0 16px var(--c-glow)}
.card::before{content:'';position:absolute;top:0;left:8px;right:8px;height:2px;background:linear-gradient(90deg,transparent,var(--c-primary-l),var(--c-primary),var(--c-primary-l),transparent);border-radius:2px;opacity:.6}

.card-title{font-size:16px;font-weight:bold;color:var(--c-text-b);margin-bottom:12px}

.row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border-subtle)}
.row:last-child{border-bottom:none}
.row-label{font-size:13px;color:var(--c-text-2);flex-shrink:0;width:80px}
.row-val{font-size:13px;color:var(--c-text-b);flex:1;text-align:right;word-break:break-all}

.badge{font-size:11px;font-weight:bold;padding:3px 10px;border-radius:10px;flex-shrink:0}
.badge-green{color:var(--c-success);background:rgba(0,204,136,0.1);border:1px solid rgba(0,204,136,0.2)}
.badge-gray{color:var(--c-text-2);background:var(--c-badge-bg);border:1px solid var(--c-badge-bd)}
.badge-blue{color:var(--c-primary-l);background:var(--c-badge-bg);border:1px solid var(--c-badge-bd)}

.btn{display:block;width:100%;text-align:center;padding:12px 0;font-size:15px;font-weight:bold;border-radius:10px;letter-spacing:2px;cursor:pointer;transition:transform .1s,opacity .1s}
.btn:active{transform:scale(.96);opacity:.85}
.btn-primary{color:var(--c-btn-text);background:linear-gradient(135deg,var(--c-btn-1),var(--c-btn-2));box-shadow:0 3px 12px var(--c-btn-glow)}
.btn-disabled{color:var(--c-text-3);background:rgba(42,58,74,0.2);pointer-events:none}

.empty{text-align:center;color:var(--c-text-2);padding:60px 0;font-size:14px}

.toast{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:rgba(0,0,0,0.75);color:#fff;padding:12px 24px;border-radius:8px;font-size:14px;z-index:10000;pointer-events:none;animation:toastIn .3s ease}
@keyframes toastIn{from{opacity:0;transform:translate(-50%,-50%) scale(.8)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}

.loading-mask{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.3);display:flex;align-items:center;justify-content:center;z-index:9999}
.spinner{width:36px;height:36px;border:3px solid var(--c-badge-bd);border-top-color:var(--c-primary);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

.page-title-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.page-title{font-size:20px;font-weight:bold;color:var(--c-text-b)}