:root{--h5-max-width:480px;--h5-primary:#2563eb;--h5-primary-dark:#1d4ed8;--h5-bg:#f9fafb;--h5-card-bg:#fff;--h5-text:#374151;--h5-text-light:#6b7280;--h5-border:#e5e7eb;--h5-radius:12px;--h5-header-height:52px;--h5-footer-height:60px}.h5-layout{background:var(--h5-bg);flex-direction:column;align-items:center;min-height:100dvh;display:flex}.h5-header{z-index:100;background:var(--h5-card-bg);border-bottom:1px solid var(--h5-border);width:100%;position:sticky;top:0}.h5-header-inner{max-width:var(--h5-max-width);height:var(--h5-header-height);justify-content:space-between;align-items:center;margin:0 auto;padding:0 16px;display:flex}.h5-logo{cursor:pointer;-webkit-user-select:none;user-select:none;z-index:1;-webkit-tap-highlight-color:transparent;touch-action:manipulation;align-items:center;gap:6px;display:flex;position:relative}.h5-logo-img{object-fit:contain;border-radius:8px;width:30px;height:30px}.h5-logo-icon{font-size:24px;line-height:1}.h5-logo-text{color:var(--h5-text);font-size:16px;font-weight:700}.h5-header-right{cursor:pointer;-webkit-user-select:none;user-select:none}.h5-user-avatar{background:#e8f0fe;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:18px;display:flex}.h5-login-btn{color:var(--h5-primary);border:1px solid var(--h5-primary);border-radius:16px;padding:6px 14px;font-size:13px;font-weight:500}.h5-login-btn:active{background:var(--h5-primary);color:#fff}.h5-main{width:100%;max-width:var(--h5-max-width);flex:1;padding:16px}.h5-footer{background:var(--h5-card-bg);border-top:1px solid var(--h5-border);width:100%}.h5-footer-inner{max-width:var(--h5-max-width);height:var(--h5-footer-height);flex-direction:column;justify-content:center;align-items:center;gap:2px;margin:0 auto;padding:0 16px;display:flex}.h5-footer-text{color:var(--h5-text-light);margin:0;font-size:12px}.h5-footer-sub{color:#9ca3af;margin:0;font-size:10px}