:root{--bg: #f7f6f8;--surface: #ffffff;--ink: #2c2a32;--muted: #8e8a96;--line: #ebe9ef;--primary: #6ba3d9;--primary-dark: #4f8fc7;--primary-soft: #eaf3fa;--primary-rgb: 107, 163, 217;--play: #e889b0;--play-dark: #d4729a;--play-soft: #fceef4;--gold: #e8c56a;--gold-2: #d4b055;--gold-soft: #faf4e4;--danger: #e57373;--header-1: #9bc4e0;--header-2: #7aafd4;--header-3: #e0a0bd;--radius: 14px;--tab-h: 54px;--safe-bottom: env(safe-area-inset-bottom, 0px);--font: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--shadow-icon: 0 4px 14px rgba(44, 42, 50, .07)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#app{height:100%;background:#d9d5e0;color:var(--ink);font-family:var(--font)}body{-webkit-font-smoothing:antialiased;overflow:hidden}a{color:inherit;text-decoration:none}button,input{font:inherit;color:inherit}button{cursor:pointer;border:none;background:none;touch-action:manipulation}img{display:block;max-width:100%}.app-shell{height:100%;height:100dvh;display:flex;flex-direction:column;width:100%;max-width:480px;margin:0 auto;background:var(--bg);position:relative;overflow:hidden}@media(min-width:481px){.app-shell{box-shadow:0 12px 40px #1a1d241f}}.page{flex:1;overflow:auto;-webkit-overflow-scrolling:touch;padding-bottom:calc(var(--tab-h) + var(--safe-bottom));position:relative;z-index:1}.page.no-tab{padding-bottom:var(--safe-bottom)}.tabbar{position:absolute;left:0;right:0;bottom:0;height:calc(var(--tab-h) + var(--safe-bottom));padding-bottom:var(--safe-bottom);display:flex;background:#fffffff0;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);z-index:50;padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.tab-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11px;color:var(--muted);font-weight:500;min-height:var(--tab-h);-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:color .15s}.tab-item.router-link-active{color:var(--primary);font-weight:600}.tab-item.router-link-active .tab-icon:after{content:"";position:absolute;left:50%;bottom:-6px;width:12px;height:3px;border-radius:2px;background:var(--primary);transform:translate(-50%)}.tab-item.router-link-active .tab-icon{position:relative}.tab-item.router-link-active .tab-icon:after{content:"";position:absolute;left:50%;bottom:-5px;width:12px;height:3px;border-radius:2px;background:var(--primary);transform:translate(-50%)}.tab-icon{width:22px;height:22px;display:grid;place-items:center}.tab-icon svg{width:21px;height:21px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:44px;padding:0 16px;border-radius:11px;font-weight:600;font-size:14px;transition:opacity .15s,transform .15s}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.55}.btn-primary{background:linear-gradient(180deg,#f0a0c0,var(--play-dark));color:#fff;width:100%;box-shadow:0 8px 18px #e889b047}.btn-blue{background:linear-gradient(180deg,#8ebad8,var(--primary-dark));color:#fff;width:100%;box-shadow:0 8px 18px rgba(var(--primary-rgb),.26)}.btn-play{height:30px;min-width:52px;padding:0 12px;border-radius:15px;background:var(--play-soft);color:var(--play);border:none;font-size:12px;font-weight:700;flex-shrink:0}.btn-ghost{background:var(--bg);color:var(--ink)}.input{width:100%;height:42px;padding:0 12px;border-radius:11px;border:1px solid var(--line);background:var(--surface);outline:none}.input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #3478f61f}.empty,.loading,.error-box{padding:48px 20px;text-align:center;color:var(--muted);font-size:14px}.toast{position:fixed;left:50%;bottom:96px;transform:translate(-50%);background:#1a1d24eb;color:#fff;padding:10px 16px;border-radius:20px;font-size:13px;z-index:999;pointer-events:none;max-width:80%;text-align:center}.modal-mask{position:fixed;top:0;right:0;bottom:0;left:0;background:#1012167a;display:flex;align-items:center;justify-content:center;z-index:200;padding:20px}.modal{width:100%;max-width:300px;background:var(--surface);border-radius:16px;padding:20px;box-shadow:0 16px 40px #0000002e}.modal h3{font-size:16px;margin-bottom:8px}.modal p{font-size:14px;color:var(--muted);line-height:1.5;margin-bottom:16px}.modal-actions{display:flex;gap:10px}.modal-actions .btn{flex:1}.nav-bar{display:flex;align-items:center;gap:10px;height:48px;padding:0 12px;padding-top:env(safe-area-inset-top,0px);min-height:calc(48px + env(safe-area-inset-top,0px));background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}.nav-back{width:34px;height:34px;display:grid;place-items:center;font-size:18px;color:var(--ink);flex-shrink:0;border-radius:10px;background:var(--bg)}.nav-bar h1{flex:1;font-size:16px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}