.douluo-shop-backdrop{z-index:99999!important;position:fixed;top:0;right:0;bottom:0;left:0;background:#040712c7;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;padding:16px;animation:shopFadeIn .25s ease-out}@keyframes shopFadeIn{0%{opacity:0}to{opacity:1}}.douluo-shop-card{width:100%;max-width:860px;max-height:90vh;background:linear-gradient(165deg,#161b2ef2,#0d1120fa);border:1px solid rgba(147,51,234,.35);border-radius:20px;box-shadow:0 25px 60px -15px #000c,0 0 35px #a855f740,inset 0 1px #ffffff1a;display:flex;flex-direction:column;overflow:hidden;position:relative;animation:shopSlideUp .3s cubic-bezier(.16,1,.3,1)}@keyframes shopSlideUp{0%{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.shop-header{padding:20px 24px;background:linear-gradient(90deg,#581c8759,#1e1b4b66);border-bottom:1px solid rgba(147,51,234,.2);display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.shop-title-wrap{display:flex;align-items:center;gap:14px}.shop-icon-badge{font-size:2rem;width:50px;height:50px;border-radius:14px;background:linear-gradient(135deg,#a855f74d,#6366f14d);border:1px solid rgba(192,132,252,.4);display:flex;align-items:center;justify-content:center;box-shadow:0 0 18px #a855f759}.shop-title{margin:0;font-size:1.4rem;font-weight:800;background:linear-gradient(135deg,#f3e8ff,#c084fc,#818cf8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:-.01em}.shop-subtitle{margin:4px 0 0;font-size:.84rem;color:#a1a1aa}.shop-balance-badge{display:flex;align-items:center;gap:8px;background:#0f172acc;border:1px solid rgba(56,189,248,.4);padding:8px 16px;border-radius:9999px;box-shadow:0 0 16px #38bdf833}.diamond-glow-icon{font-size:1.2rem;animation:gemFloat 2s ease-in-out infinite}@keyframes gemFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-3px) scale(1.1)}}.diamond-number{font-size:1.15rem;font-weight:800;color:#38bdf8;font-family:monospace}.diamond-label{font-size:.78rem;color:#94a3b8;text-transform:uppercase;letter-spacing:.05em}.shop-close-btn{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:#cbd5e1;width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1rem;transition:all .2s ease}.shop-close-btn:hover{background:#ef444433;border-color:#ef444466;color:#fca5a5;transform:rotate(90deg)}.shop-nav-tabs{padding:12px 24px;display:flex;gap:8px;border-bottom:1px solid rgba(255,255,255,.06);background:#0a0e1a80;overflow-x:auto;scrollbar-width:none}.shop-nav-tabs::-webkit-scrollbar{display:none}.shop-tab-btn{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);color:#94a3b8;padding:8px 16px;border-radius:10px;font-size:.85rem;font-weight:600;cursor:pointer;white-space:nowrap;transition:all .2s ease}.shop-tab-btn:hover{color:#f1f5f9;background:#9333ea26;border-color:#9333ea4d}.shop-tab-btn.active{background:linear-gradient(135deg,#9333ea4d,#4f46e54d);border-color:#c084fc80;color:#f8fafc;box-shadow:0 0 12px #a855f740}.shop-items-grid{padding:20px 24px;overflow-y:auto;max-height:calc(90vh - 210px);display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}.shop-item-card{background:#1e293b80;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:16px;display:flex;flex-direction:column;justify-content:space-between;gap:12px;transition:all .25s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden}.shop-item-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,rgba(168,85,247,.6),transparent);opacity:0;transition:opacity .2s ease}.shop-item-card:hover{transform:translateY(-3px);border-color:#a855f766;box-shadow:0 10px 25px -8px #00000080,0 0 18px #a855f726}.shop-item-card:hover:before{opacity:1}.shop-item-card.owned{background:#18223599;border-color:#38bdf840}.shop-item-card.skin-active{border-color:#4ade8080;box-shadow:0 0 20px #4ade8026}.item-card-header{display:flex;align-items:center;justify-content:space-between;gap:8px}.item-icon-box{width:46px;height:46px;border-radius:12px;background:#0f172ab3;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;font-size:1.5rem}.item-tags{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.item-badge-perm{font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:9999px;background:#a855f726;color:#d8b4fe;border:1px solid rgba(168,85,247,.3)}.item-badge-consumable{font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:9999px;background:#f59e0b26;color:#fcd34d;border:1px solid rgba(245,158,11,.3)}.item-badge-owned{font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:9999px;background:#22c55e26;color:#86efac;border:1px solid rgba(34,197,94,.3)}.item-name{margin:0 0 6px;font-size:.98rem;font-weight:700;color:#f1f5f9;line-height:1.35}.item-description{margin:0;font-size:.8rem;color:#94a3b8;line-height:1.45;min-height:42px}.item-card-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:10px;border-top:1px solid rgba(255,255,255,.05)}.item-price-tag{display:flex;align-items:center;gap:4px}.price-gem{font-size:1rem}.price-val{font-size:1rem;font-weight:800;color:#38bdf8;font-family:monospace}.btn-shop-action{padding:8px 16px;border-radius:9999px;font-size:.82rem;font-weight:700;border:none;cursor:pointer;transition:all .2s ease;white-space:nowrap}.btn-buy{background:linear-gradient(135deg,#9333ea,#6366f1);color:#fff;box-shadow:0 4px 12px #9333ea59}.btn-buy:hover:not(:disabled){background:linear-gradient(135deg,#a855f7,#4f46e5);box-shadow:0 6px 16px #9333ea80;transform:translateY(-1px)}.btn-disabled{background:#ffffff14!important;color:#64748b!important;cursor:not-allowed!important;box-shadow:none!important}.btn-owned{background:#22c55e1f;color:#86efac;border:1px solid rgba(34,197,94,.3);cursor:default}.btn-apply{background:#38bdf826;color:#38bdf8;border:1px solid rgba(56,189,248,.4)}.btn-apply:hover{background:#38bdf840;transform:translateY(-1px)}.btn-active{background:#4ade802e;color:#4ade80;border:1px solid rgba(74,222,128,.4);cursor:default}.shop-footer-bar{padding:12px 24px;background:#0a0e1ab3;border-top:1px solid rgba(255,255,255,.06);display:flex;align-items:center;gap:10px}.footer-tip-icon{font-size:1rem}.footer-tip-text{font-size:.78rem;color:#94a3b8}@media (max-width: 640px){.shop-header{padding:16px}.shop-title{font-size:1.15rem}.shop-items-grid{grid-template-columns:1fr;padding:14px}.shop-nav-tabs{padding:10px 14px}}.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 16px;position:relative;overflow:hidden;background:#070913}.auth-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background:radial-gradient(circle at 15% 25%,rgba(147,51,234,.18) 0%,transparent 45%),radial-gradient(circle at 85% 75%,rgba(59,130,246,.18) 0%,transparent 45%),radial-gradient(circle at 50% 50%,rgba(236,72,153,.08) 0%,transparent 60%),#070913}.auth-orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:.5;animation:orbFloat 8s ease-in-out infinite alternate}.auth-orb-1{width:320px;height:320px;top:5%;left:10%;background:linear-gradient(135deg,#7c3aed,#3b82f6)}.auth-orb-2{width:280px;height:280px;bottom:8%;right:12%;background:linear-gradient(135deg,#ec4899,#8b5cf6);animation-duration:11s;animation-delay:-3s}@keyframes orbFloat{0%{transform:translateY(0) scale(1)}50%{transform:translateY(-30px) scale(1.08)}to{transform:translateY(15px) scale(.95)}}.auth-card{width:100%;max-width:440px;background:#12182bc7;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(168,85,247,.3);border-radius:24px;padding:36px 32px;position:relative;z-index:1;box-shadow:0 25px 50px -12px #000000b3,0 0 40px #9333ea33,inset 0 1px #ffffff1f;animation:authCardIn .4s cubic-bezier(.16,1,.3,1)}@keyframes authCardIn{0%{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.auth-header{text-align:center;margin-bottom:28px}.auth-logo-badge{display:inline-flex;align-items:center;gap:8px;padding:4px 14px;border-radius:9999px;background:#9333ea26;border:1px solid rgba(168,85,247,.35);color:#d8b4fe;font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:16px;box-shadow:0 0 15px #9333ea33}.auth-logo{width:70px;height:70px;background:linear-gradient(135deg,#9333ea,#4f46e5);border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:2.2rem;margin:0 auto 16px;box-shadow:0 0 35px #9333ea73;border:1px solid rgba(216,180,254,.4);animation:logoPulse 3s ease-in-out infinite}@keyframes logoPulse{0%,to{box-shadow:0 0 25px #9333ea66}50%{box-shadow:0 0 45px #c084fc99}}.auth-header h1{font-size:1.6rem;font-weight:800;letter-spacing:-.02em;margin-bottom:6px;background:linear-gradient(135deg,#fff,#e9d5ff,#c084fc);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.auth-header p{color:#94a3b8;font-size:.88rem;margin:0}.auth-form{display:flex;flex-direction:column;gap:18px;margin-bottom:24px}.input-with-icon{position:relative;display:flex;align-items:center}.input-icon-prefix{position:absolute;left:14px;font-size:1rem;color:#64748b;pointer-events:none}.input-with-icon .form-input{padding-left:42px}.password-toggle-btn{position:absolute;right:12px;background:none;border:none;color:#94a3b8;cursor:pointer;padding:4px;font-size:1.1rem;display:flex;align-items:center;justify-content:center;transition:color .2s}.password-toggle-btn:hover{color:#f1f5f9}.remember-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.82rem;margin-top:-4px}.remember-label{display:flex;align-items:center;gap:8px;color:#cbd5e1;cursor:pointer;-webkit-user-select:none;user-select:none}.remember-label input[type=checkbox]{accent-color:#9333ea;width:16px;height:16px;cursor:pointer}.remember-badge-locked{font-size:.72rem;padding:2px 6px;border-radius:6px;background:#f59e0b26;color:#fbbf24;border:1px solid rgba(245,158,11,.3)}.forgot-link{color:#c084fc;text-decoration:none;transition:color .2s}.forgot-link:hover{color:#e9d5ff;text-decoration:underline}.btn-auth-submit{width:100%;padding:13px;border-radius:12px;font-size:.95rem;font-weight:700;color:#fff;background:linear-gradient(135deg,#9333ea,#6366f1);border:1px solid rgba(192,132,252,.3);box-shadow:0 4px 20px #9333ea66;cursor:pointer;transition:all .25s ease;display:flex;align-items:center;justify-content:center;gap:8px}.btn-auth-submit:hover:not(:disabled){background:linear-gradient(135deg,#a855f7,#4f46e5);box-shadow:0 6px 25px #9333ea8c;transform:translateY(-1px)}.btn-auth-submit:disabled{opacity:.6;cursor:not-allowed}.quick-fill-box{margin-top:14px;padding:12px;border-radius:12px;background:#ffffff08;border:1px solid rgba(255,255,255,.06);display:flex;flex-direction:column;gap:8px}.quick-fill-title{font-size:.75rem;color:#94a3b8;text-transform:uppercase;letter-spacing:.05em;margin:0;text-align:center}.quick-fill-buttons{display:flex;gap:8px}.btn-quick-fill{flex:1;padding:6px 8px;border-radius:8px;font-size:.78rem;font-weight:600;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:#cbd5e1;cursor:pointer;transition:all .2s}.btn-quick-fill:hover{background:#9333ea33;border-color:#9333ea66;color:#f3e8ff}.auth-footer{text-align:center;font-size:.85rem;color:#94a3b8}@media (max-width: 480px){.auth-card{padding:26px 20px;border-radius:18px}.auth-header h1{font-size:1.35rem}}.sidebar{position:fixed;top:0;left:0;bottom:0;width:var(--sidebar-width);background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:1000;padding:var(--space-6);gap:var(--space-6);transition:transform var(--transition)}.mobile-close-btn{display:none;background:transparent;border:none;color:var(--text-secondary);font-size:1.25rem;padding:4px;border-radius:var(--radius-sm)}.mobile-close-btn:hover{color:var(--text-primary);background:var(--surface-hover)}.sidebar-backdrop{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#000000a6;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:999;animation:fadeIn .2s ease}.desktop-collapsed .sidebar{transform:translate(-100%)}@media (max-width: 768px){.sidebar{transform:translate(-100%);box-shadow:var(--shadow-lg)}.sidebar.open{transform:translate(0)}.mobile-close-btn,.sidebar-backdrop{display:block}}.sidebar-logo{display:flex;align-items:center;gap:var(--space-3);padding-bottom:var(--space-6);border-bottom:1px solid var(--border)}.logo-icon{width:42px;height:42px;background:linear-gradient(135deg,var(--primary),var(--primary-dark));border-radius:var(--radius);display:flex;align-items:center;justify-content:center;font-size:1.25rem;flex-shrink:0;box-shadow:0 0 16px var(--primary-glow)}.logo-title{font-size:1rem;font-weight:800;letter-spacing:-.02em}.logo-badge{font-size:.7rem;font-weight:600;color:var(--primary-light);text-transform:uppercase;letter-spacing:.06em}.sidebar-nav{flex:1;display:flex;flex-direction:column;gap:2px;overflow-y:auto}.sidebar-link{display:flex;align-items:center;gap:var(--space-3);padding:10px var(--space-3);border-radius:var(--radius);font-size:.875rem;font-weight:500;color:var(--text-secondary);transition:all var(--transition)}.sidebar-link:hover{background:var(--surface-hover);color:var(--text-primary)}.sidebar-link.active{background:linear-gradient(135deg,#7c6af533,#6254d41a);color:var(--primary-light);font-weight:600;border:1px solid rgba(124,106,245,.2)}.nav-icon{font-size:1rem;width:20px;text-align:center}.sidebar-footer{display:flex;flex-direction:column;gap:var(--space-3);padding-top:var(--space-6);border-top:1px solid var(--border)}.sidebar-user{display:flex;align-items:center;gap:var(--space-3)}.user-name{font-size:.875rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-role{font-size:.75rem;color:var(--text-secondary)}.logout-btn{width:100%;justify-content:center}.top-header{position:fixed;top:0;left:var(--sidebar-width);right:0;height:var(--header-height);background:var(--bg);border-bottom:1px solid var(--border);z-index:99;display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-6);transition:left var(--transition);gap:var(--space-3)}.desktop-collapsed .top-header{left:0}.header-left{display:flex;align-items:center;gap:var(--space-3);min-width:0;flex-shrink:1}.header-title-box{display:flex;align-items:baseline;min-width:0}.sidebar-toggle-btn{display:flex;background:var(--surface-hover);border:1px solid var(--border);color:var(--text-primary);font-size:1.25rem;width:38px;height:38px;border-radius:var(--radius);align-items:center;justify-content:center;transition:all var(--transition);cursor:pointer;flex-shrink:0}.sidebar-toggle-btn:hover{background:var(--surface-elevated);border-color:var(--primary);color:var(--primary-light)}.header-title{font-size:1.125rem;font-weight:700;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}.header-date{font-size:.8rem;color:var(--text-muted);margin-left:var(--space-3);white-space:nowrap}.header-right{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;max-width:100%}.session-timer-badge{display:flex;align-items:center;gap:5px;background:#f59e0b1f;border:1px solid rgba(245,158,11,.35);color:#fbbf24;padding:5px 10px;border-radius:var(--radius-full);font-size:.8rem;font-weight:700;cursor:pointer;white-space:nowrap;transition:all .2s ease}.session-timer-badge:hover{background:#f59e0b38;border-color:#f59e0b99;transform:translateY(-1px)}.session-time{font-family:monospace;font-size:.84rem}.btn-shop-trigger{display:flex;align-items:center;gap:5px;background:linear-gradient(135deg,#9333ea40,#6366f140);border:1px solid rgba(168,85,247,.45);color:#e9d5ff;padding:5px 12px;border-radius:var(--radius-full);font-size:.82rem;font-weight:700;cursor:pointer;white-space:nowrap;transition:all .2s ease;box-shadow:0 0 12px #a855f733}.btn-shop-trigger:hover{background:linear-gradient(135deg,#9333ea73,#6366f173);border-color:#c084fcb3;box-shadow:0 0 16px #a855f766;transform:translateY(-1px)}.btn-cultivate-pulse{display:flex;align-items:center;gap:4px;background:#6366f126;border:1px solid rgba(99,102,241,.35);color:#c7d2fe;padding:5px 10px;border-radius:var(--radius-full);font-size:.8rem;font-weight:600;cursor:pointer;white-space:nowrap;transition:all .2s ease}.btn-cultivate-pulse:hover{background:#6366f140;border-color:#6366f180}.douluo-badge{display:flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--radius-full);font-size:.8rem;font-weight:700;cursor:pointer;white-space:nowrap;border:1px solid rgba(255,255,255,.12);background:#ffffff0d;transition:all .2s ease}.douluo-badge:hover{transform:translateY(-1px)}.realm-level-text{color:#94a3b8;font-size:.76rem}.diamond-wallet{display:flex;align-items:center;gap:4px;background:#38bdf81f;border:1px solid rgba(56,189,248,.3);color:#38bdf8;padding:5px 10px;border-radius:var(--radius-full);font-size:.82rem;font-weight:700;cursor:pointer;white-space:nowrap;transition:all .2s ease}.diamond-wallet:hover{background:#38bdf838;border-color:#38bdf880;transform:translateY(-1px)}.diamond-plus{font-size:.72rem;color:#7dd3fc}.earnings-pill{display:flex;align-items:center;gap:var(--space-1);background:#10b9811a;border:1px solid rgba(16,185,129,.2);color:var(--accent-green);padding:5px 10px;border-radius:var(--radius-full);font-size:.8rem;font-weight:600;white-space:nowrap}.btn-settings-icon{padding:4px 8px;font-size:.95rem}@media (max-width: 1024px){.header-date{display:none}.top-header{padding:0 var(--space-4)}}@media (max-width: 768px){.top-header{left:0!important;padding:0 10px;height:56px;gap:8px}.header-title{font-size:.9rem;max-width:110px}.header-right{gap:5px}.btn-shop-text{display:none}.btn-shop-trigger{padding:5px 8px}.earnings-pill{padding:4px 8px;font-size:.72rem}}@media (max-width: 640px){.header-title{max-width:90px}.cult-text{display:none}.btn-cultivate-pulse{padding:5px 8px}.realm-full-title{display:none}.douluo-badge{padding:4px 8px}.diamond-wallet{padding:5px 8px}}@media (max-width: 480px){.header-title,.earnings-pill{display:none}.header-right{gap:4px}.session-timer-badge{padding:4px 6px;font-size:.75rem}}:root{--bg: #0a0a0f;--bg-secondary: #111118;--surface: #16161f;--surface-hover: #1e1e2a;--surface-elevated: #1c1c28;--border: rgba(255, 255, 255, .08);--border-strong: rgba(255, 255, 255, .15);--primary: #7c6af5;--primary-dark: #6254d4;--primary-light: #a89ff8;--primary-glow: rgba(124, 106, 245, .25);--accent: #f59e0b;--accent-green: #10b981;--accent-red: #ef4444;--accent-blue: #3b82f6;--accent-orange: #f97316;--text-primary: #f1f1f5;--text-secondary: #8b8b9e;--text-muted: #55556a;--text-inverse: #0a0a0f;--status-open: #3b82f6;--status-registered: #f59e0b;--status-approved: #10b981;--status-completed: #6366f1;--status-cancelled: #ef4444;--status-pending: #f59e0b;--status-verified: #10b981;--status-missed: #ef4444;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--space-16: 64px;--radius-sm: 6px;--radius: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--shadow-sm: 0 1px 3px rgba(0,0,0,.4);--shadow: 0 4px 16px rgba(0,0,0,.5);--shadow-lg: 0 8px 32px rgba(0,0,0,.6);--shadow-glow: 0 0 24px var(--primary-glow);--font: "Inter", -apple-system, sans-serif;--font-mono: "JetBrains Mono", monospace;--transition: .2s cubic-bezier(.4, 0, .2, 1);--transition-fast: .12s ease;--sidebar-width: 260px;--header-height: 64px;--content-max: 1200px}[data-theme=skin-huyen-ao]{--bg: #031420;--bg-secondary: #072235;--surface: #0a2d45;--surface-hover: #0e3b5a;--surface-elevated: #0f4062;--border: rgba(6, 182, 212, .18);--border-strong: rgba(6, 182, 212, .35);--primary: #06b6d4;--primary-dark: #0891b2;--primary-light: #67e8f9;--primary-glow: rgba(6, 182, 212, .28);--shadow-glow: 0 0 24px rgba(6, 182, 212, .35)}[data-theme=skin-hoang-gia]{--bg: #120e06;--bg-secondary: #1c170a;--surface: #28200f;--surface-hover: #362c16;--surface-elevated: #3f331a;--border: rgba(245, 158, 11, .22);--border-strong: rgba(245, 158, 11, .42);--primary: #f59e0b;--primary-dark: #d97706;--primary-light: #fcd34d;--primary-glow: rgba(245, 158, 11, .3);--shadow-glow: 0 0 24px rgba(245, 158, 11, .35)}[data-theme=skin-than-thanh]{--bg: #140b1c;--bg-secondary: #1f102b;--surface: #2c163d;--surface-hover: #3b1d52;--surface-elevated: #44215f;--border: rgba(236, 72, 153, .22);--border-strong: rgba(236, 72, 153, .45);--primary: #ec4899;--primary-dark: #db2777;--primary-light: #f472b6;--primary-glow: rgba(236, 72, 153, .3);--shadow-glow: 0 0 24px rgba(236, 72, 153, .35)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;-webkit-font-smoothing:antialiased}body{font-family:var(--font);background:var(--bg);color:var(--text-primary);line-height:1.6;min-height:100vh}a{color:inherit;text-decoration:none}button{cursor:pointer;font-family:var(--font)}img{max-width:100%;height:auto}input,textarea,select{font-family:var(--font)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.app-layout{display:flex;min-height:100vh}.main-content{flex:1;margin-left:var(--sidebar-width);padding-top:var(--header-height);min-height:100vh;background:var(--bg);transition:margin-left var(--transition)}.desktop-collapsed .main-content{margin-left:0}.page-content{padding:var(--space-8);max-width:var(--content-max);margin:0 auto}.h1{font-size:2rem;font-weight:800;letter-spacing:-.03em;line-height:1.2}.h2{font-size:1.5rem;font-weight:700;letter-spacing:-.02em}.h3{font-size:1.25rem;font-weight:600}.h4{font-size:1rem;font-weight:600}.body-sm{font-size:.875rem}.body-xs{font-size:.75rem}.label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary)}.gradient-text{background:linear-gradient(135deg,var(--primary-light),var(--primary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6);transition:border-color var(--transition),transform var(--transition)}.card:hover{border-color:var(--border-strong)}.card-elevated{background:var(--surface-elevated);box-shadow:var(--shadow)}.card-sm{padding:var(--space-4);border-radius:var(--radius)}.card-interactive{cursor:pointer}.card-interactive:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--primary)}.btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:10px 20px;border-radius:var(--radius);font-size:.875rem;font-weight:600;border:none;transition:all var(--transition);white-space:nowrap}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;box-shadow:0 2px 12px var(--primary-glow)}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 20px var(--primary-glow);filter:brightness(1.1)}.btn-secondary{background:var(--surface-hover);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover{background:var(--surface-elevated);border-color:var(--border-strong)}.btn-danger{background:var(--accent-red);color:#fff}.btn-danger:hover{filter:brightness(1.1);transform:translateY(-1px)}.btn-success{background:var(--accent-green);color:#fff}.btn-success:hover{filter:brightness(1.1);transform:translateY(-1px)}.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover{background:var(--surface-hover);color:var(--text-primary)}.btn-sm{padding:6px 14px;font-size:.8rem;border-radius:var(--radius-sm)}.btn-lg{padding:14px 28px;font-size:1rem;border-radius:var(--radius-lg)}.btn-icon{padding:10px;border-radius:var(--radius)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.form-group{display:flex;flex-direction:column;gap:var(--space-2)}.form-label{font-size:.875rem;font-weight:500;color:var(--text-secondary)}.form-input{background:var(--surface-hover);border:1px solid var(--border);border-radius:var(--radius);padding:10px 14px;color:var(--text-primary);font-size:.875rem;transition:border-color var(--transition),box-shadow var(--transition);width:100%}.form-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-glow)}.form-input::placeholder{color:var(--text-muted)}.form-select{background:var(--surface-hover);border:1px solid var(--border);border-radius:var(--radius);padding:10px 14px;color:var(--text-primary);font-size:.875rem;width:100%;cursor:pointer}.form-select:focus{outline:none;border-color:var(--primary)}.badge{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:var(--radius-full);font-size:.75rem;font-weight:600}.badge:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.badge-open{background:#3b82f626;color:var(--status-open)}.badge-registered{background:#f59e0b26;color:var(--status-registered)}.badge-approved{background:#10b98126;color:var(--status-approved)}.badge-completed{background:#6366f126;color:var(--status-completed)}.badge-cancelled{background:#ef444426;color:var(--status-cancelled)}.badge-pending{background:#f59e0b26;color:var(--status-pending)}.badge-verified{background:#10b98126;color:var(--status-verified)}.badge-missed{background:#ef444426;color:var(--status-missed)}.badge-rejected{background:#ef444426;color:var(--accent-red)}.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6);display:flex;flex-direction:column;gap:var(--space-3);position:relative;overflow:hidden}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--primary),var(--primary-dark))}.stat-value{font-size:2rem;font-weight:800;letter-spacing:-.03em}.stat-label{font-size:.875rem;color:var(--text-secondary)}.stat-change{font-size:.75rem}.stat-change.positive{color:var(--accent-green)}.stat-change.negative{color:var(--accent-red)}.table-wrapper{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}table{width:100%;border-collapse:collapse}thead{background:var(--surface-elevated)}th{padding:var(--space-3) var(--space-4);text-align:left;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-secondary);border-bottom:1px solid var(--border)}td{padding:var(--space-4);font-size:.875rem;border-bottom:1px solid var(--border)}tr:last-child td{border-bottom:none}tbody tr:hover{background:var(--surface-hover)}.avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;background:linear-gradient(135deg,var(--primary),var(--primary-dark));display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.875rem;color:#fff;flex-shrink:0}.spinner{width:20px;height:20px;border:2px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:var(--space-16);color:var(--text-muted)}.empty-state .icon{font-size:3rem;margin-bottom:var(--space-4)}.empty-state h3{font-size:1.125rem;color:var(--text-secondary);margin-bottom:var(--space-2)}.grid{display:grid;gap:var(--space-6)}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}.flex{display:flex}.flex-center{display:flex;align-items:center;justify-content:center}.flex-between{display:flex;align-items:center;justify-content:space-between}.flex-col{display:flex;flex-direction:column}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.page-header{margin-bottom:var(--space-8)}.page-header h1{font-size:1.75rem;font-weight:800;letter-spacing:-.02em;margin-bottom:var(--space-1)}.page-header p{color:var(--text-secondary);font-size:.9rem}.modal-overlay,.modal-backdrop{position:fixed!important;top:0!important;left:0!important;right:0!important;bottom:0!important;z-index:99999!important;background:#000000c7!important;backdrop-filter:blur(6px)!important;-webkit-backdrop-filter:blur(6px)!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:var(--space-4)!important;animation:fadeIn .15s ease;overflow-y:auto!important}.modal,.modal-content{background:var(--surface-elevated);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-8);max-width:520px;width:100%;box-shadow:0 20px 50px #0009;animation:slideUp .2s ease;position:relative!important;z-index:100000!important;max-height:92vh;overflow-y:auto}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(16px);opacity:0}to{transform:none;opacity:1}}.upload-zone{border:2px dashed var(--border);border-radius:var(--radius-lg);padding:var(--space-10);text-align:center;cursor:pointer;transition:all var(--transition);background:var(--surface-hover)}.upload-zone:hover,.upload-zone.dragging{border-color:var(--primary);background:var(--primary-glow)}.upload-zone input[type=file]{display:none}.period-timeline{display:flex;gap:var(--space-3);flex-wrap:wrap}.period-item{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);border-radius:var(--radius);border:1px solid var(--border);background:var(--surface-hover);min-width:80px;transition:all var(--transition)}.period-item.verified{border-color:var(--accent-green);background:#10b9811a}.period-item.pending{border-color:var(--accent);background:#f59e0b1a}.period-item.missed{border-color:var(--accent-red);background:#ef44441a}.period-item.active{border-color:var(--primary);box-shadow:0 0 12px var(--primary-glow)}.period-number{font-size:1.25rem;font-weight:800}.period-time{font-size:.7rem;color:var(--text-muted)}.notif-dot{width:8px;height:8px;background:var(--accent-red);border-radius:50%;position:absolute;top:6px;right:6px}@media (max-width: 1024px){.grid-4,.grid-3{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.main-content{margin-left:0}.page-content{padding:var(--space-3)}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.hide-mobile{display:none}.page-header h1{font-size:1.35rem}.page-header p{font-size:.8rem}.table-wrapper{overflow-x:auto}}.animate-in{animation:animateIn .3s ease forwards}@keyframes animateIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.glass-card{background:#ffffff0a;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-xl)}.money{font-variant-numeric:tabular-nums;font-weight:700;color:var(--accent-green)}.money-pending{color:var(--accent)}.soul-ring-wrapper{position:relative;display:inline-flex;align-items:center;justify-content:center}.soul-ring{position:absolute;top:-6px;left:-6px;right:-6px;bottom:-6px;border-radius:50%;pointer-events:none;animation:soulRingRotate 4s linear infinite;transition:all .3s ease}@keyframes soulRingRotate{0%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.05)}to{transform:rotate(360deg) scale(1)}}.ring-white{border:2px dashed rgba(255,255,255,.8);box-shadow:0 0 10px #fff6}.ring-yellow{border:2px dashed #fbbf24;box-shadow:0 0 14px #fbbf2499,inset 0 0 6px #fbbf244d}.ring-purple{border:2px dashed #a855f7;box-shadow:0 0 16px #a855f7b3,inset 0 0 8px #a855f766}.ring-black{border:2px solid #1e1e24;box-shadow:0 0 18px #000000e6,0 0 8px #8b5cf699}.ring-red{border:2px dashed #ef4444;box-shadow:0 0 22px #ef4444e6,inset 0 0 10px #ef444480;animation:soulRingRotate 2.5s linear infinite,ringPulseRed 2s ease-in-out infinite}@keyframes ringPulseRed{0%,to{box-shadow:0 0 20px #ef4444cc}50%{box-shadow:0 0 30px #ef4444,0 0 40px #f59e0b99}}.ring-gold{border:2.5px solid #fbbf24;background:radial-gradient(circle,rgba(251,191,36,.1) 0%,transparent 70%);box-shadow:0 0 25px #fbbf24,0 0 35px #ec4899cc,inset 0 0 12px #fbbf2499;animation:soulRingRotate 2s linear infinite,ringPulseGold 1.5s ease-in-out infinite}@keyframes ringPulseGold{0%,to{filter:drop-shadow(0 0 8px #fbbf24)}50%{filter:drop-shadow(0 0 18px #f59e0b) drop-shadow(0 0 25px #ec4899)}}.douluo-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:9999px;font-size:.8rem;font-weight:700;cursor:pointer;-webkit-user-select:none;user-select:none;transition:all .2s ease;white-space:nowrap;flex-shrink:0}.douluo-badge:hover{transform:translateY(-1px) scale(1.03)}.badge-douluo-white{background:#ffffff1a;color:#f1f5f9;border:1px solid rgba(255,255,255,.25)}.badge-douluo-yellow{background:#fbbf2426;color:#fbbf24;border:1px solid rgba(251,191,36,.4)}.badge-douluo-purple{background:#a855f726;color:#c084fc;border:1px solid rgba(168,85,247,.4)}.badge-douluo-black{background:#1e1e24cc;color:#e2e8f0;border:1px solid #6b21a8;box-shadow:0 0 8px #6b21a84d}.badge-douluo-red{background:#ef444426;color:#f87171;border:1px solid rgba(239,68,68,.5);box-shadow:0 0 10px #ef44444d}.badge-douluo-gold{background:linear-gradient(135deg,#fbbf2433,#ec489933);color:#fde047;border:1px solid #fbbf24;box-shadow:0 0 12px #fbbf2480}.diamond-wallet{display:inline-flex;align-items:center;gap:5px;background:linear-gradient(135deg,#06b6d426,#3b82f626);border:1px solid rgba(6,182,212,.4);padding:4px 10px;border-radius:9999px;font-size:.8rem;font-weight:700;color:#38bdf8;cursor:pointer;transition:all .2s ease;-webkit-user-select:none;user-select:none;white-space:nowrap;flex-shrink:0}.diamond-wallet:hover{background:linear-gradient(135deg,#06b6d440,#3b82f640);border-color:#38bdf8;transform:translateY(-1px)}.diamond-plus{background:#38bdf840;color:#fff;border-radius:50%;width:16px;height:16px;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:800;margin-left:2px}.btn-cultivate-pulse{display:inline-flex;align-items:center;gap:4px;background:#a855f726;border:1px solid rgba(168,85,247,.4);color:#d8b4fe;padding:4px 9px;border-radius:9999px;font-size:.78rem;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap;flex-shrink:0}.btn-cultivate-pulse:hover{background:#a855f74d;border-color:#a855f7;color:#fff}@media (max-width: 900px){.douluo-badge .realm-full-title{display:none}.btn-cultivate-pulse span:not(.cult-icon){display:none}.btn-cultivate-pulse{padding:4px 6px}}@media (max-width: 600px){.douluo-badge,.diamond-wallet{padding:3px 6px;font-size:.72rem}.diamond-plus{display:none}}.vip-tier-card{background:#ffffff08;border:1px solid var(--border);border-radius:12px;padding:16px;text-align:center;transition:all .25s ease;cursor:pointer;position:relative;overflow:hidden}.vip-tier-card:hover{transform:translateY(-4px);border-color:#fbbf24;box-shadow:0 8px 24px #fbbf2440;background:#fbbf240d}.vip-tier-card.featured{border-color:#ef4444;background:linear-gradient(135deg,#ef44441a,#f59e0b0d);box-shadow:0 0 20px #ef444433}.vip-badge-ribbon{position:absolute;top:8px;right:-24px;background:#ef4444;color:#fff;font-size:.65rem;font-weight:800;padding:2px 28px;transform:rotate(45deg);box-shadow:0 2px 6px #0000004d}.cultivation-cave{background:radial-gradient(circle at 50% 30%,#a855f726,#0f172acc 70%);border:1px solid rgba(168,85,247,.3);border-radius:16px;padding:24px;text-align:center;position:relative;overflow:hidden}.cultivation-orb-container{position:relative;width:130px;height:130px;margin:0 auto 16px;display:flex;align-items:center;justify-content:center}.cultivation-core{width:80px;height:80px;border-radius:50%;background:radial-gradient(circle,#c084fc,#7e22ce 70%,#3b0764);box-shadow:0 0 35px #a855f7cc,inset 0 0 15px #fff9;display:flex;align-items:center;justify-content:center;font-size:2.2rem;animation:corePulse 2s ease-in-out infinite;z-index:2}@keyframes corePulse{0%,to{transform:scale(1);filter:drop-shadow(0 0 10px #c084fc)}50%{transform:scale(1.08);filter:drop-shadow(0 0 25px #ec4899)}}.cultivation-orbit{position:absolute;top:0;left:0;right:0;bottom:0;border:1.5px dashed rgba(192,132,252,.5);border-radius:50%;animation:soulRingRotate 6s linear infinite}.cultivation-timer-box{display:inline-flex;gap:10px;background:#0006;padding:10px 18px;border-radius:12px;border:1px solid rgba(255,255,255,.1);margin-bottom:16px}.timer-unit{display:flex;flex-direction:column;align-items:center}.timer-val{font-size:1.25rem;font-weight:800;color:#38bdf8;font-family:monospace}.timer-lbl{font-size:.65rem;color:var(--text-muted);text-transform:uppercase}.cultivation-exp-bar{background:#ffffff14;height:12px;border-radius:6px;overflow:hidden;position:relative;margin:12px 0 6px;border:1px solid rgba(255,255,255,.1)}.cultivation-exp-fill{height:100%;background:linear-gradient(90deg,#8b5cf6,#ec4899,#fbbf24);border-radius:6px;transition:width .3s ease;box-shadow:0 0 10px #ec489999}.leaderboard-table{width:100%;border-collapse:collapse}.leaderboard-table th{text-align:left;padding:10px 12px;font-size:.8rem;color:var(--text-muted);border-bottom:1px solid var(--border)}.leaderboard-table td{padding:12px;border-bottom:1px solid rgba(255,255,255,.05);font-size:.85rem}.leaderboard-rank-badge{display:inline-flex;width:26px;height:26px;border-radius:50%;align-items:center;justify-content:center;font-weight:800;font-size:.8rem}.rank-1{background:#fbbf24;color:#000;box-shadow:0 0 10px #fbbf2499}.rank-2{background:#cbd5e1;color:#000}.rank-3{background:#b45309;color:#fff}
