:root{--bg-color: #0f172a;--card-bg: rgba(30, 41, 59, .7);--text-main: #e2e8f0;--text-muted: #94a3b8;--gold: #d4af37;--gold-dim: rgba(212, 175, 55, .3);--accent: #38bdf8}*{box-sizing:border-box;margin:0;padding:0}body{font-family:PingFang SC,Microsoft YaHei,sans-serif;background-color:var(--bg-color);color:var(--text-main);overflow-x:hidden}.app-container{min-height:100vh;display:flex;flex-direction:column;align-items:center;background:radial-gradient(circle at top,#1e293b,#0f172a)}.top-bar{width:100%;max-width:600px;padding:16px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(255,255,255,.05)}.logo{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--gold)}.cloud-status{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-muted);background:#0003;padding:4px 10px;border-radius:12px}.syncing{animation:spin 2s linear infinite}.main-content{flex:1;width:100%;max-width:600px;padding:20px;display:flex;flex-direction:column;justify-content:center;position:relative}.view-card{background:var(--card-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:30px 24px;box-shadow:0 20px 40px #0000004d;position:relative;overflow:hidden}.welcome-view{text-align:center;padding:60px 20px;min-height:500px;display:flex;flex-direction:column;justify-content:center}.bg-wrapper{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0}.bg-img{width:100%;height:100%;object-fit:cover;opacity:.4}.bg-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:100px;opacity:.1}.bg-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to bottom,rgba(15,23,42,.2),var(--bg-color))}.content-front{position:relative;z-index:1}.title-glow{font-size:32px;font-weight:800;margin-bottom:16px;background:linear-gradient(135deg,#fff,var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 20px rgba(212,175,55,.3)}.subtitle{color:var(--text-muted);line-height:1.6;margin-bottom:40px}.btn-group{display:flex;flex-direction:column;gap:16px;align-items:center}button{cursor:pointer;border:none;outline:none;font-family:inherit;display:flex;align-items:center;justify-content:center;gap:8px;font-size:16px;font-weight:600;border-radius:16px;transition:all .3s ease}.btn-primary{background:linear-gradient(135deg,var(--gold),#b8860b);color:#000;padding:16px 32px;width:100%;max-width:300px;box-shadow:0 4px 15px #d4af374d}.btn-primary:disabled{opacity:.7;cursor:not-allowed}.btn-secondary{background:#ffffff0d;color:var(--text-main);padding:14px 32px;width:100%;max-width:300px;border:1px solid rgba(255,255,255,.1)}.btn-secondary:hover{background:#ffffff1a}.btn-icon{background:transparent;color:var(--text-muted)}.progress-bar{height:4px;background:#ffffff1a;border-radius:2px;margin-bottom:24px;overflow:hidden}.progress-fill{height:100%;background:var(--gold);transition:width .3s ease}.question-header{margin-bottom:16px}.q-num{font-size:14px;color:var(--gold);border:1px solid var(--gold-dim);padding:4px 12px;border-radius:12px}.q-title{font-size:20px;line-height:1.5;margin-bottom:30px}.options-list{display:flex;flex-direction:column;gap:12px}.option-btn{background:#0003;border:1px solid rgba(255,255,255,.05);padding:16px;border-radius:16px;text-align:left;justify-content:flex-start;color:var(--text-main);font-weight:400}.opt-letter{color:var(--gold);font-weight:700;margin-right:12px;background:#d4af371a;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;flex-shrink:0}.calc-view{text-align:center;padding:80px 20px;display:flex;flex-direction:column;align-items:center}.bagua-spinner{font-size:60px;color:var(--gold);animation:spin 3s linear infinite;margin-bottom:24px}.calc-text{font-size:24px;margin-bottom:8px}.calc-sub{color:var(--text-muted)}.result-view{padding:24px}.result-header{text-align:center;margin-bottom:24px}.talent-title{font-size:36px;font-weight:900;color:var(--gold);letter-spacing:2px;text-shadow:0 0 15px rgba(212,175,55,.4);margin-bottom:8px}.talent-desc{color:var(--text-muted);font-size:14px}.result-body{display:flex;flex-direction:column;gap:24px;margin-bottom:30px}.avatar-section{display:flex;gap:16px;align-items:center;justify-content:space-between;background:#0003;padding:16px;border-radius:20px}.avatar-frame{width:100px;height:100px;border-radius:50%;border:2px solid var(--gold);overflow:hidden;display:flex;align-items:center;justify-content:center;background:#000;flex-shrink:0}.avatar-frame img{width:100%;height:100%;object-fit:cover}.emoji-fallback{font-size:40px}.radar-container{width:120px;height:120px;flex-shrink:0}.radar-chart{width:100%;height:100%}.ai-comment-box{background:linear-gradient(to right,rgba(212,175,55,.1),transparent);border-left:3px solid var(--gold);padding:16px;border-radius:0 12px 12px 0;font-size:14px;line-height:1.6;display:flex;gap:12px;align-items:flex-start}.icon-gold{color:var(--gold);flex-shrink:0;margin-top:2px}.beast-section h3{font-size:16px;margin-bottom:12px;color:var(--text-muted)}.beast-card{display:flex;gap:16px;align-items:center;background:#ffffff08;padding:12px;border-radius:16px;border:1px solid rgba(255,255,255,.05)}.beast-avatar{width:60px;height:60px;border-radius:12px;overflow:hidden;background:#000;display:flex;align-items:center;justify-content:center;flex-shrink:0}.beast-avatar img{width:100%;height:100%;object-fit:cover}.beast-info h4{font-size:16px;color:var(--accent);margin-bottom:4px}.beast-info p{font-size:12px;color:var(--text-muted);line-height:1.4}.history-view{max-height:80vh;overflow-y:auto}.history-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;position:sticky;top:0;background:var(--card-bg);padding-bottom:10px;z-index:10;border-bottom:1px solid rgba(255,255,255,.1)}.history-list{display:flex;flex-direction:column;gap:12px}.history-item{background:#0003;padding:16px;border-radius:12px;border-left:2px solid var(--gold)}.hist-top{display:flex;justify-content:space-between;margin-bottom:8px}.hist-date{color:var(--text-muted);font-size:12px}.hist-talent{font-weight:700;color:var(--gold)}.hist-beast{font-size:13px;margin-bottom:8px}.hist-scores{font-size:12px;color:#fff6}.empty-text{text-align:center;color:var(--text-muted);padding:40px 0}.toast{position:fixed;top:80px;left:50%;transform:translate(-50%);background:#000c;color:#fff;padding:10px 20px;border-radius:20px;font-size:14px;z-index:100;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}@keyframes spin{to{transform:rotate(360deg)}}.spin{animation:spin 1s linear infinite}