body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background-color:#0d0e12;color:#f3f4f6;-webkit-user-select:none;user-select:none}.rider-app{display:flex;flex-direction:column;height:100vh;max-width:480px;margin:0 auto;background-color:#12141c;border-left:1px solid #232838;border-right:1px solid #232838;position:relative;overflow:hidden}.rider-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background-color:#161a26;border-bottom:2px solid #262c3f;z-index:10}.header-left{display:flex;align-items:center;gap:12px}.rider-avatar{position:relative;width:40px;height:40px;background:radial-gradient(circle,#f05,#301);border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid #ff0055;box-shadow:0 0 8px #f056}.avatar-icon{color:#fff}.level-badge{position:absolute;bottom:-4px;right:-4px;background-color:#0f6;color:#000;font-size:10px;font-weight:700;padding:1px 4px;border-radius:4px;border:1px solid #111}.xp-container{display:flex;flex-direction:column;gap:4px}.xp-text{font-size:11px;color:#9ca3af;font-weight:600}.xp-bar-outer{width:100px;height:6px;background-color:#1f2937;border-radius:3px;overflow:hidden}.xp-bar-inner{height:100%;background:linear-gradient(90deg,#f05,#f50);border-radius:3px;transition:width .3s ease}.header-right{display:flex;align-items:center;gap:8px}.status-pill{display:flex;align-items:center;gap:4px;padding:6px 10px;border-radius:12px;font-size:12px;font-weight:700;border:1px solid rgba(255,255,255,.1)}.rp-pill{background-color:#eab3081a;color:#eab308;border-color:#eab3084d}.ap-toggle-btn{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:12px;font-size:11px;font-weight:700;cursor:pointer;border:1px solid rgba(6,182,212,.3);background-color:#06b6d41a;color:#06b6d4;transition:all .3s ease}.ap-toggle-btn.active{background-color:#00ff6626;color:#0f6;border-color:#0f66;box-shadow:0 0 10px #0f63}.pulse-icon{animation:pulse 1.5s infinite alternate}.status-ticker{background-color:#0a0b0f;padding:6px 16px;font-size:12px;border-bottom:1px solid #1f2937;display:flex;gap:8px;overflow:hidden;white-space:nowrap}.ticker-label{color:#f05;font-weight:700}.ticker-content{color:#38bdf8;animation:pulse 2s infinite}.rider-main{flex:1;overflow-y:auto;padding-bottom:80px}.belt-stage{position:relative;min-height:100%;padding:16px;display:flex;flex-direction:column;align-items:center;transition:background .5s ease}.stage-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle,transparent 40%,rgba(0,0,0,.8) 100%);pointer-events:none}.belt-title-block{text-align:center;margin-bottom:12px;z-index:2}.series-tag{background-color:#ffffff26;padding:2px 10px;border-radius:10px;font-size:11px;letter-spacing:1px;color:#e5e7eb}.belt-title-block h2{margin:6px 0 0;font-size:20px;color:#fff;text-shadow:0 0 10px rgba(255,255,255,.3)}.belt-simulator-core{position:relative;width:100%;height:140px;display:flex;align-items:center;justify-content:center;margin-bottom:12px;z-index:2}.belt-strap{width:25%;height:20px;background:linear-gradient(180deg,#333,#111);border:1px solid #444;border-radius:4px}.left-strap{margin-right:-10px}.right-strap{margin-left:-10px}.belt-body{width:180px;height:110px;background-color:#1e2230;border:4px solid #4b5563;border-radius:16px;position:relative;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 20px #000c,0 10px 25px #00000080;transition:all .3s ease;z-index:3}.layout-faiz{border-radius:8px;background-color:#111;border-color:#374151}.layout-card{border-radius:4px;background-color:#2d3748}.layout-clock{border-radius:50%;width:120px;height:120px}.layout-three-ring{background-color:#111827}.faiz-phone-visual{position:absolute;top:10px;display:flex;flex-direction:column;align-items:center}.phone-icon{filter:drop-shadow(0 0 4px currentColor)}.laser-pointer{width:4px;height:4px;background-color:red;border-radius:50%;box-shadow:0 0 8px red}.card-deck-visual{position:absolute;left:12px;opacity:.8}.clock-visual{position:absolute;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.clock-hand{position:absolute;width:2px;height:40px;background-color:#fff;transform-origin:bottom;animation:clock-spin 12s linear infinite}@keyframes clock-spin{to{transform:rotate(360deg)}}.three-ring-visual{position:absolute;display:flex;gap:8px;top:12px}.ring{width:16px;height:16px;border-radius:50%;border:2px solid #4b5563}.ring-1{border-color:#ef4444}.ring-2{border-color:#eab308}.ring-3{border-color:#22c55e}.belt-core-light{width:56px;height:56px;border-radius:50%;background-color:#374151;display:flex;align-items:center;justify-content:center;box-shadow:0 0 15px #00000080;transition:all .3s ease;z-index:4}.transformed-glow .belt-body{box-shadow:0 0 30px #ffffff26}.transformed-glow .belt-core-light{box-shadow:0 0 25px currentColor;animation:pulse-glow 1.5s infinite alternate}.core-icon-glow{color:#fff;filter:drop-shadow(0 0 5px rgba(255,255,255,.8))}.spinning{animation:spin 3s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse-glow{0%{transform:scale(1);opacity:.8}to{transform:scale(1.1);opacity:1}}.gimmick-slots{position:absolute;bottom:8px;display:flex;gap:6px}.slot{font-size:9px;padding:2px 6px;background-color:#0f111a;border:1px solid #374151;border-radius:4px;color:#6b7280}.slot.loaded{background-color:#0f6;color:#000;border-color:#0f6;font-weight:700}.transform-status-badge{z-index:2;margin-bottom:12px}.transform-status-badge span{font-size:11px;font-weight:700;padding:4px 12px;border-radius:20px;letter-spacing:1px}.badge-active{background-color:#ef444433;color:#ef4444;border:1px solid #ef4444;box-shadow:0 0 10px #ef44444d}.badge-ready{background-color:#eab30833;color:#eab308;border:1px solid #eab308;box-shadow:0 0 10px #eab3084d}.badge-idle{background-color:#6b728033;color:#9ca3af;border:1px solid #4b5563}.control-panel{width:100%;background-color:#12141cf2;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:14px;box-sizing:border-box;z-index:2;display:flex;flex-direction:column;gap:12px}.panel-section{display:flex;flex-direction:column;gap:8px}.section-header-row{display:flex;justify-content:space-between;align-items:center}.section-title{font-size:11px;color:#9ca3af;margin:0;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.ai-hint{font-size:10px;color:#a855f7;font-weight:700}.gimmick-cards-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.gimmick-card-item{background-color:#1e2230;border:1px solid #374151;border-radius:10px;overflow:hidden;cursor:pointer;transition:all .2s;display:flex;flex-direction:column}.gimmick-card-item:hover{border-color:#38bdf8;transform:translateY(-2px)}.gimmick-card-item.loaded{border-color:#0f6;box-shadow:0 0 10px #00ff6626}.gimmick-img-container{position:relative;width:100%;height:80px;background-color:#0f111a;display:flex;align-items:center;justify-content:center;overflow:hidden}.gimmick-thumbnail{width:100%;height:100%;object-fit:cover}.generating-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#000c;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:10px;color:#a855f7}.spin-icon{animation:spin 2s linear infinite}.ai-gen-btn{position:absolute;bottom:4px;right:4px;background-color:#a855f7e6;color:#fff;border:none;font-size:9px;padding:2px 6px;border-radius:4px;cursor:pointer;font-weight:700;transition:background-color .2s}.ai-gen-btn:hover{background-color:#a855f7}.gimmick-card-info{padding:6px;display:flex;flex-direction:column;gap:2px;background-color:#161a26}.gimmick-card-name{font-size:11px;color:#f3f4f6;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gimmick-card-status{font-size:9px;color:#9ca3af}.loaded .gimmick-card-status{color:#0f6;font-weight:700}.action-buttons{display:flex;flex-wrap:wrap;gap:6px}.action-btn{flex:1;min-width:110px;background-color:#0f172a;border:1px solid #1e293b;color:#38bdf8;padding:8px 10px;border-radius:8px;font-size:11px;cursor:pointer;font-weight:700;transition:all .2s}.action-btn:hover{background-color:#38bdf8;color:#000}.panel-actions-row{display:flex;gap:10px;margin-top:4px}.finisher-btn{flex:2;display:flex;align-items:center;justify-content:center;gap:6px;background:linear-gradient(90deg,#ef4444,#f50);color:#fff;border:none;padding:12px;border-radius:10px;font-weight:700;font-size:13px;cursor:pointer;box-shadow:0 4px 12px #ef44444d;transition:all .2s}.finisher-btn.disabled{background:#374151;color:#9ca3af;cursor:not-allowed;box-shadow:none;opacity:.5}.reset-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:4px;background-color:#374151;border:none;color:#e5e7eb;border-radius:10px;font-size:12px;cursor:pointer}.combat-tab{padding:20px}.combat-arena{display:flex;flex-direction:column;gap:20px}.monster-card{background-color:#1e293b;border-radius:16px;padding:20px;display:flex;align-items:center;gap:16px;border:1px solid #334155}.monster-avatar{font-size:48px}.monster-info{flex:1}.monster-info h3{margin:0 0 8px;font-size:16px;color:#f1f5f9}.hp-container{display:flex;flex-direction:column;gap:4px}.hp-text{font-size:11px;color:#94a3b8}.hp-bar-outer{height:8px;background-color:#0f172a;border-radius:4px;overflow:hidden}.hp-bar-inner{height:100%;background-color:#ef4444;border-radius:4px;transition:width .3s ease}.combat-status{text-align:center}.combat-buff-active{display:inline-flex;align-items:center;gap:6px;background-color:#00ff661a;color:#0f6;padding:8px 16px;border-radius:20px;font-size:12px;border:1px solid rgba(0,255,102,.2)}.combat-buff-none{background-color:#ef44441a;color:#f87171;padding:8px 16px;border-radius:20px;font-size:12px}.combat-actions{display:flex;flex-direction:column;gap:12px}.attack-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;border:none}.attack-btn.normal{background-color:#38bdf8;color:#0f172a}.attack-btn.special{background:linear-gradient(90deg,#ef4444,#fa0);color:#fff}.attack-btn.disabled{background:#334155;color:#64748b;cursor:not-allowed}.rewards-preview{text-align:center;font-size:12px;color:#94a3b8}.collection-tab{padding:16px}.collection-header{margin-bottom:16px}.collection-subtitle{font-size:12px;color:#9ca3af;margin:4px 0 0}.collection-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.collection-card{background-color:#1e293b;border-radius:12px;padding:12px;border:1px solid #334155;cursor:pointer;transition:all .2s}.collection-card:hover{transform:translateY(-2px);border-color:#38bdf8}.collection-card.equipped{border-color:#0f6;background-color:#00ff660d}.collection-card-inner{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}.rider-icon-placeholder{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;color:#fff;box-shadow:0 0 8px #fff3}.collection-card h4{margin:4px 0 0;font-size:12px;color:#f8fafc}.era-badge{font-size:9px;background-color:#374151;color:#d1d5db;padding:1px 6px;border-radius:4px}.belt-desc-short{margin:4px 0;font-size:10px;color:#94a3b8;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;height:28px}.equip-status{font-size:10px;font-weight:700}.status-equipped{color:#0f6}.status-equip-btn{color:#38bdf8}.rider-footer{position:absolute;bottom:0;left:0;right:0;height:64px;background-color:#161a26;border-top:2px solid #262c3f;display:flex;justify-content:space-around;align-items:center;z-index:10}.tab-item{display:flex;flex-direction:column;align-items:center;gap:4px;background:none;border:none;color:#9ca3af;font-size:11px;cursor:pointer;transition:color .2s}.tab-item.active{color:#f05}.tab-item span{font-weight:500}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}