:root{--color-bg: #f6f4fc;--color-card: #ffffff;--color-text: #1f1b2e;--color-text-2: #57506e;--color-primary: #6d5bd0;--color-primary-dark: #5644b0;--color-primary-soft: #eae6fb;--gradient-soft: linear-gradient(135deg, #e7e0ff 0%, #f3e6ff 55%, #ffe9f1 100%);--color-danger: #c92a2a;--color-danger-soft: #ffe3e3;--color-success: #2b8a3e;--color-border: #e3def4;--font-xs: 16px;--font-sm: 18px;--font-md: 20px;--font-lg: 24px;--font-xl: 30px;--font-xxl: 38px;--tap-min: 56px;--tap-main: 88px;--radius: 18px;--gutter: 16px;--tabbar-h: 76px}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--color-bg);color:var(--color-text);font-family:PingFang SC,Microsoft YaHei,Noto Sans SC,sans-serif;font-size:var(--font-md);line-height:1.6;-webkit-font-smoothing:antialiased}#app{max-width:480px;min-height:100vh;margin:0 auto;background:var(--color-bg);position:relative}button{font-family:inherit;font-size:var(--font-md);cursor:pointer;-webkit-tap-highlight-color:transparent}input,select{font-family:inherit;font-size:var(--font-lg);width:100%;height:var(--tap-main);padding:0 16px;border:2px solid var(--color-border);border-radius:var(--radius);background:#fff;color:var(--color-text)}input:focus,select:focus{outline:none;border-color:var(--color-primary)}.card{background:var(--color-card);border-radius:var(--radius);padding:20px;margin-bottom:16px;box-shadow:0 4px 18px #5d4cb014}.btn-primary{width:100%;min-height:var(--tap-main);border:none;border-radius:var(--radius);background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-dark) 100%);color:#fff;font-size:var(--font-lg);font-weight:700}.btn-primary:active{background:var(--color-primary-dark)}.btn-primary:disabled{background:#ccc;cursor:not-allowed}.btn-ghost{width:100%;min-height:var(--tap-min);border:2px solid var(--color-primary);border-radius:var(--radius);background:#fff;color:var(--color-primary);font-size:var(--font-md);font-weight:700}.page{padding:var(--gutter);padding-bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom,0px) + 16px)}.page-title{font-size:var(--font-xl);font-weight:800;margin:8px 0 20px}.muted{color:var(--color-text-2);font-size:var(--font-sm)}.site-footer{text-align:center;font-size:var(--font-xs);color:var(--color-text-2);padding:24px 16px calc(16px + env(safe-area-inset-bottom,0px));line-height:1.8}.site-footer a{color:var(--color-text-2);text-decoration:none}