@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&display=swap";:root{--primary: #6C5CE7;--primary-light: #8B7FF5;--primary-dark: #5248C4;--secondary: #00CECE;--secondary-dark: #00A8A8;--success: #00B894;--warning: #FDCB6E;--danger: #FF6B6B;--info: #74B9FF;--neutral-50: #F8F7FF;--neutral-100: #EDE9FE;--neutral-200: #C4B5FD;--neutral-600: #6B7280;--neutral-800: #1E1B3C;--neutral-900: #0F0D1E;--bg-deep: var(--neutral-50);--bg-card: #ffffff;--bg-card2: var(--neutral-100);--neon-cyan: var(--secondary);--neon-purple: var(--primary);--neon-green: var(--success);--neon-orange: var(--warning);--neon-yellow: var(--warning);--neon-pink: var(--danger);--text-primary: var(--neutral-800);--text-dim: var(--neutral-600);--text-soft: var(--neutral-600);--text-muted: var(--neutral-600);--text: var(--neutral-800);--bg: var(--neutral-50);--surface: #ffffff;--surface-2: var(--neutral-100);--border: var(--neutral-100);--border-glow: var(--neutral-200);--font: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-display: var(--font);--font-body: var(--font);--font-mono: ui-monospace, "SF Mono", "Cascadia Code", Menlo, monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.5rem;--text-2xl: 2rem;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 20px;--radius-xl: 28px;--r-sm: var(--radius-sm);--r-md: var(--radius-md);--r-lg: var(--radius-lg);--r-xl: var(--radius-xl);--r-full: 9999px;--shadow-sm: 0 2px 8px rgba(108, 92, 231, .12);--shadow-md: 0 4px 20px rgba(108, 92, 231, .2);--shadow-lg: 0 8px 40px rgba(108, 92, 231, .28);--s-1: .25rem;--s-2: .5rem;--s-3: .75rem;--s-4: 1rem;--s-5: 1.5rem;--s-6: 2rem;--s-7: 3rem;--z-header: 50;--z-nav: 100;--z-toast: 150;--z-modal: 200;--z-sync: 300;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px)}[data-theme=cyberpunk]{--primary: #bf00ff;--primary-light: #d966ff;--primary-dark: #8800cc;--secondary: #00f5ff;--secondary-dark: #00b8c4;--success: #00ff88;--warning: #ffd700;--danger: #ff0080;--neutral-50: #050510;--neutral-100: #111128;--neutral-200: rgba(0, 245, 255, .3);--neutral-600: #7070a0;--neutral-800: #e8e8ff;--neutral-900: #0d0d24;--bg-deep: #050510;--bg-card: #0d0d24;--bg-card2: #111128;--text-primary: #e8e8ff;--text-dim: #7070a0;--text-soft: #a0a0c0;--text-muted: #6060a0;--text: #e8e8ff;--bg: #050510;--surface: #0d0d24;--surface-2: #111128;--border: rgba(255, 255, 255, .08);--border-glow: rgba(0, 245, 255, .3);--neon-cyan: #00f5ff;--neon-purple: #bf00ff;--neon-green: #00ff88;--neon-orange: #ff6b00;--neon-yellow: #ffd700;--neon-pink: #ff0080;--shadow-sm: 0 0 10px rgba(0, 245, 255, .3);--shadow-md: 0 0 20px rgba(0, 245, 255, .4);--shadow-lg: 0 0 40px rgba(0, 245, 255, .5)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:10px;font-family:var(--font-body);font-size:13px;font-weight:700;letter-spacing:1px;border:none;cursor:pointer;transition:all .2s;text-decoration:none;white-space:nowrap;background:var(--bg-card);color:var(--text-primary);box-shadow:var(--shadow-sm)}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn:hover:not(:disabled){filter:brightness(1.05)}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;box-shadow:0 4px 20px #6c5ce766;text-shadow:0 1px 2px rgba(0,0,0,.2)}.btn-primary:hover:not(:disabled){box-shadow:0 6px 24px #6c5ce799}.btn-secondary{background:transparent;border:1px solid var(--secondary);color:var(--secondary);box-shadow:none}.btn-secondary:hover:not(:disabled){background:#00cece14}.btn-success{background:linear-gradient(135deg,var(--success),#00A87A);color:#fff;box-shadow:0 4px 14px #00b89459}.btn-danger{background:linear-gradient(135deg,var(--danger),#E05555);color:#fff;box-shadow:0 4px 14px #ff6b6b59}.btn-warning{background:linear-gradient(135deg,var(--warning),#F39C12);color:#fff}.btn-ghost{background:#6c5ce70f;color:var(--text-primary);box-shadow:none}.btn-ghost:hover:not(:disabled){background:#6c5ce71f}.btn-sm{padding:7px 14px;font-size:11px;border-radius:8px}.btn-lg{padding:16px 32px;font-size:15px;border-radius:12px}.btn-block{width:100%}.btn-icon{width:36px;height:36px;padding:0;border-radius:50%;background:var(--bg-card);border:1px solid var(--border-glow);color:var(--text-primary)}.btn-icon:active{transform:scale(.9)}.card{background:var(--bg-card);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-sm)}[data-theme=cyberpunk] .card{border:1px solid rgba(255,255,255,.06)}.card-hero{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-md)}[data-theme=cyberpunk] .card-hero{background:linear-gradient(135deg,var(--bg-card),var(--bg-card2));border:1px solid var(--border-glow)}.card-mission{background:var(--bg-card);border-radius:var(--radius-md);padding:14px 16px;box-shadow:var(--shadow-sm);display:flex;align-items:center;gap:14px;border-left:4px solid var(--primary);transition:all .2s;cursor:pointer}.card-mission:active{transform:scale(.98)}.card-mission.done{border-left-color:var(--success);opacity:.75}.card-mission.done .habit-check{background:var(--success);color:#fff}.card-mission.pending{border-left-color:var(--warning)}.card-mission.pending .habit-check{background:var(--warning);color:#fff}.card-mission.flash{border-left-color:var(--danger);background:linear-gradient(135deg,var(--bg-card),rgba(255,0,128,.04))}.habit-check{width:32px;height:32px;border-radius:50%;background:#6c5ce71a;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;color:var(--primary);flex-shrink:0}.habit-info{flex:1;min-width:0}.habit-name{font-weight:700;font-size:14px;margin-bottom:4px;color:var(--text-primary)}.habit-meta{display:flex;gap:6px;flex-wrap:wrap}.habit-type-badge{font-size:9px;font-weight:700;padding:2px 7px;border-radius:8px;letter-spacing:.5px;background:#6c5ce71a;color:var(--primary);text-transform:uppercase}.habit-type-badge.approval{background:#fdcb6e33;color:#b8860b}.reward-xp,.reward-coin{font-size:11px;font-weight:700;padding:2px 8px;border-radius:8px}.reward-xp{background:#6c5ce71a;color:var(--primary)}.reward-coin{background:#fdcb6e33;color:#b8860b}.evidence-btn{background:#00cece26;border:1px solid var(--secondary);color:var(--secondary);width:36px;height:36px;border-radius:10px;font-size:16px;cursor:pointer;flex-shrink:0}.badge{display:inline-flex;align-items:center;gap:5px;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:700}.badge-xp,.badge-coin{background:#fdcb6e33;color:#b8860b}.badge-level{background:#6c5ce71a;color:var(--primary)}.badge-success{background:#00b89426;color:var(--success)}.badge-danger{background:#ff6b6b26;color:var(--danger)}.history-item{background:var(--bg-card);border-radius:var(--radius-md);padding:12px 16px;display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow-sm)}.history-info p{font-size:14px;font-weight:600;color:var(--text-primary)}.history-info span{font-size:11px;color:var(--text-dim)}.history-reward{font-size:12px;font-weight:700;color:var(--success);font-family:var(--font-mono)}.history-reward.negative{color:var(--danger)}.admin-card{background:var(--bg-card);border-radius:var(--radius-md);padding:16px;margin-bottom:12px;box-shadow:var(--shadow-sm)}.admin-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.admin-card-title{font-size:14px;font-weight:700;color:var(--text-primary)}.admin-card-meta{font-size:11px;color:var(--text-dim)}.pending-badge{background:#fdcb6e33;color:#b8860b;padding:2px 8px;border-radius:8px;font-size:11px;font-weight:700}.shop-item{background:var(--bg-card);border-radius:var(--radius-md);padding:16px 14px;text-align:center;position:relative;box-shadow:var(--shadow-sm);cursor:pointer;transition:all .2s}.shop-item:active{transform:scale(.96)}.shop-item.cannot-afford{opacity:.5;cursor:not-allowed}.shop-item.can-afford{border:2px solid var(--primary)}.item-type{position:absolute;top:6px;right:6px;font-size:8px;font-weight:700;padding:2px 6px;border-radius:6px;letter-spacing:.5px;text-transform:uppercase}.item-type.auto{background:#00b89433;color:var(--success)}.item-type.approval{background:#fdcb6e33;color:#b8860b}.item-type.flash{background:#ff6b6b33;color:var(--danger)}.item-emoji{font-size:32px;display:block;margin:6px 0}.item-name{font-size:13px;font-weight:700;color:var(--text-primary);margin-bottom:4px}.item-cost{font-size:12px;font-weight:700;color:#b8860b;background:#fdcb6e26;padding:4px 10px;border-radius:12px;display:inline-block}.form-group{margin-bottom:14px}.form-label{display:block;font-size:11px;font-weight:700;color:var(--text-dim);margin-bottom:6px;letter-spacing:1px;text-transform:uppercase}.form-help{font-size:11px;color:var(--text-dim);margin-top:4px;line-height:1.4}.form-input,.input-field,input:not([type]),input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],input[type=month],input[type=time],input[type=search],input[type=tel],input[type=url],textarea,select{width:100%;padding:14px 16px;border-radius:var(--radius-md);border:2px solid var(--neutral-200);font-family:var(--font);font-size:15px;color:var(--text-primary);background:var(--bg-card);transition:border-color .2s,box-shadow .2s,background-color .2s;outline:none;-webkit-appearance:none;appearance:none}select{background-image:linear-gradient(45deg,transparent 50%,var(--primary) 50%),linear-gradient(135deg,var(--primary) 50%,transparent 50%);background-position:calc(100% - 22px) 19px,calc(100% - 14px) 19px;background-size:8px 8px;background-repeat:no-repeat;padding-right:36px}[data-theme=cyberpunk] .form-input,[data-theme=cyberpunk] .input-field,[data-theme=cyberpunk] input:not([type]),[data-theme=cyberpunk] input[type=text],[data-theme=cyberpunk] input[type=email],[data-theme=cyberpunk] input[type=password],[data-theme=cyberpunk] input[type=number],[data-theme=cyberpunk] input[type=date],[data-theme=cyberpunk] input[type=month],[data-theme=cyberpunk] input[type=time],[data-theme=cyberpunk] input[type=search],[data-theme=cyberpunk] input[type=tel],[data-theme=cyberpunk] input[type=url],[data-theme=cyberpunk] textarea,[data-theme=cyberpunk] select{background:var(--bg-card2);border-color:var(--border-glow);color:var(--text-primary);box-shadow:inset 0 0 8px #00f5ff0d}[data-theme=cyberpunk] input::placeholder,[data-theme=cyberpunk] textarea::placeholder{color:#7070a0b3}[data-theme=cyberpunk] select option{background:var(--bg-card2);color:var(--text-primary)}.form-input:focus,input:focus,textarea:focus,select:focus{border-color:var(--primary);box-shadow:0 0 0 3px #6c5ce726}[data-theme=cyberpunk] .form-input:focus,[data-theme=cyberpunk] input:focus,[data-theme=cyberpunk] textarea:focus,[data-theme=cyberpunk] select:focus{border-color:var(--neon-cyan);box-shadow:0 0 0 3px #00f5ff40,inset 0 0 12px #00f5ff1a}input:disabled,textarea:disabled,select:disabled{opacity:.55;cursor:not-allowed}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}[data-theme=cyberpunk] input[type=date]::-webkit-calendar-picker-indicator,[data-theme=cyberpunk] input[type=month]::-webkit-calendar-picker-indicator,[data-theme=cyberpunk] input[type=time]::-webkit-calendar-picker-indicator{filter:invert(.9);cursor:pointer}textarea{resize:vertical;min-height:80px;font-family:var(--font)}.pin-input{letter-spacing:.5em;text-align:center;font-size:20px;font-weight:700;font-family:var(--font-mono)}input[type=checkbox],input[type=radio]{accent-color:var(--primary);width:18px;height:18px;cursor:pointer}input[type=file]{padding:10px;font-size:13px}input[type=range]{-webkit-appearance:none;appearance:none;background:transparent;width:100%;height:6px}input[type=range]::-webkit-slider-runnable-track{height:6px;background:var(--neutral-200);border-radius:3px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--primary);margin-top:-6px}[data-theme=cyberpunk] input[type=range]::-webkit-slider-runnable-track{background:var(--border-glow)}#hero-global-header{position:sticky;top:0;z-index:var(--z-header);background:var(--bg-deep);border-bottom:1px solid rgba(108,92,231,.08)}.hero-top{padding:12px 16px;background:linear-gradient(180deg,rgba(108,92,231,.06) 0%,transparent 100%);display:flex;align-items:center;gap:12px}.hero-avatar-mini{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--primary-light));display:flex;align-items:center;justify-content:center;font-size:20px;color:#fff;flex-shrink:0;box-shadow:var(--shadow-sm)}.hero-name{font-family:var(--font-display);font-size:16px;font-weight:800;color:var(--text-primary);flex:1;min-width:0}.hero-name span{color:var(--success);font-size:11px;margin-left:6px;font-weight:700;padding:2px 8px;background:#00b89426;border-radius:10px}.hero-greeting{font-family:var(--font-mono);font-size:10px;color:var(--text-dim);letter-spacing:2px;text-transform:uppercase}.coin-chip{background:linear-gradient(135deg,#fdcb6e26,#fdcb6e14);border:1px solid rgba(253,203,110,.4);color:#b8860b;border-radius:20px;padding:5px 12px;display:flex;align-items:center;gap:5px;font-family:var(--font-display);font-size:14px;font-weight:700;flex-shrink:0}.bell-btn{position:relative;width:38px;height:38px;border-radius:50%;background:var(--bg-card);border:1px solid var(--border-glow);display:flex;align-items:center;justify-content:center;font-size:18px;cursor:pointer;flex-shrink:0}.bell-btn:active{transform:scale(.9)}.bell-badge{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;border-radius:9px;background:var(--danger);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 5px;border:2px solid var(--bg-deep)}.stats-row{display:flex;gap:8px;padding:0 16px 16px;flex-wrap:wrap}.stat-chip{background:var(--bg-card);border:1px solid var(--border-glow);border-radius:12px;padding:10px 12px;display:flex;align-items:center;gap:8px;flex:1;min-width:88px;box-shadow:var(--shadow-sm)}.stat-chip .s-icon{font-size:18px}.stat-chip .s-val{font-family:var(--font-display);font-size:16px;font-weight:800;line-height:1}.stat-chip .s-label{font-size:9px;color:var(--text-dim);letter-spacing:1px;text-transform:uppercase}.stat-chip.lives .s-val{color:var(--danger)}.stat-chip.xp .s-val{color:var(--primary)}.stat-chip.coins .s-val{color:#b8860b}.stat-chip.streak .s-val{color:#f39c12}.xp-section{padding:0 16px 16px}.xp-label-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.xp-level-badge{font-family:var(--font-display);font-size:11px;font-weight:700;color:var(--primary);background:#6c5ce71a;border:1px solid rgba(108,92,231,.3);padding:4px 12px;border-radius:20px;letter-spacing:1px;text-transform:uppercase}.xp-progress-text{font-family:var(--font-mono);font-size:11px;color:var(--text-dim)}.xp-bar-bg{height:10px;background:var(--neutral-100);border-radius:10px;overflow:hidden}[data-theme=cyberpunk] .xp-bar-bg{background:#ffffff0f}.xp-bar-fill{height:100%;border-radius:10px;background:linear-gradient(90deg,var(--primary),var(--secondary));box-shadow:var(--shadow-sm);transition:width .8s cubic-bezier(.4,0,.2,1)}.lives-section{padding:0 16px 16px}.lives-hearts{display:flex;gap:6px;font-size:20px}.heart{transition:all .3s}.heart.lost{filter:grayscale(1);opacity:.35}.pulse-card{background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;border-radius:var(--radius-lg);padding:18px 20px;margin:0 16px 16px;text-align:center;box-shadow:var(--shadow-md)}.pulse-card h3{font-size:14px;margin-bottom:4px;font-weight:800;letter-spacing:1px}.pulse-card p{font-size:11px;opacity:.85;margin-bottom:14px}.pulse-options{display:flex;justify-content:space-around;gap:8px}.pulse-btn{background:#ffffff26;border:1px solid rgba(255,255,255,.2);font-size:28px;padding:10px;border-radius:12px;cursor:pointer;flex:1;transition:all .2s}.pulse-btn:hover{background:#ffffff40}.pulse-btn:active{transform:scale(.95)}.week-section{padding:0 16px 20px}.week-section h3{font-family:var(--font-display);font-size:11px;letter-spacing:2px;color:var(--text-dim);margin-bottom:10px;text-transform:uppercase}.week-grid{display:flex;gap:6px;justify-content:space-between}.day-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px}.day-label{font-size:9px;color:var(--text-dim);text-transform:uppercase;font-weight:700}.day-dot{width:32px;height:32px;border-radius:50%;background:var(--neutral-100);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:var(--text-dim);border:2px solid transparent}[data-theme=cyberpunk] .day-dot{background:var(--bg-card)}.day-dot.today{border-color:var(--primary);color:var(--primary)}.day-dot.done{background:var(--success);color:#fff}.day-dot.partial{background:var(--warning);color:#fff}.day-dot.missed{background:var(--danger);color:#fff;opacity:.6}.habit-list{padding:0 16px 16px;display:flex;flex-direction:column;gap:8px}.section-title{padding:0 16px;font-family:var(--font-display);font-size:12px;font-weight:700;color:var(--text-dim);letter-spacing:2px;text-transform:uppercase;margin-bottom:10px;display:flex;align-items:center;gap:8px}.section-title:before{content:"";height:2px;width:20px;background:var(--primary);border-radius:2px}.archetype-card{margin:0 16px 16px;padding:20px;border-radius:var(--radius-lg);background:linear-gradient(135deg,var(--neutral-100),var(--bg-card));border:1px solid var(--border-glow);display:flex;align-items:center;gap:14px;box-shadow:var(--shadow-sm)}.archetype-icon{font-size:42px;flex-shrink:0}.archetype-info h4{font-family:var(--font-display);font-size:16px;font-weight:800;color:var(--primary);margin-bottom:4px}.archetype-info p{font-size:12px;color:var(--text-dim);line-height:1.4}body.hero-mode .screen.active{padding-top:0}.admin-tabs{display:flex;gap:8px;padding:12px;overflow-x:auto;-webkit-overflow-scrolling:touch;background:var(--bg-deep);position:sticky;top:0;z-index:5;border-bottom:1px solid rgba(108,92,231,.08);scroll-snap-type:x proximity;scroll-padding-inline:40%;scrollbar-width:none;scroll-behavior:smooth}.admin-tabs::-webkit-scrollbar{display:none}.admin-tabs>.admin-tab{scroll-snap-align:center}.admin-tab{flex-shrink:0;padding:8px 14px;background:var(--bg-card);border:1px solid var(--border-glow);border-radius:20px;font-family:var(--font-display);font-size:11px;font-weight:700;color:var(--text-dim);letter-spacing:1px;cursor:pointer;transition:all .2s;text-transform:uppercase;white-space:nowrap}.admin-tab.active{background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;border-color:transparent;box-shadow:0 4px 12px #6c5ce74d}.admin-tab:not(.active):hover{background:var(--neutral-100)}.tab-badge{display:inline-flex;align-items:center;justify-content:center;background:var(--danger);color:#fff;font-size:9px;font-weight:800;min-width:16px;height:16px;border-radius:50%;margin-left:4px;padding:0 4px}.admin-panel{padding:20px 16px;display:flex;flex-direction:column;gap:12px}.admin-panel-title{font-family:var(--font-display);font-size:16px;font-weight:800;color:var(--text-primary);margin-bottom:4px}.pack-card{background:var(--bg-card);border-radius:var(--radius-md);padding:16px;box-shadow:var(--shadow-sm);margin-bottom:12px}.pack-card-header{display:flex;align-items:center;gap:12px;margin-bottom:10px}.pack-emoji{font-size:32px}.pack-title{font-weight:700;font-size:14px;color:var(--text-primary)}.pack-desc{font-size:11px;color:var(--text-dim);margin-top:2px}.pack-applied-badge{font-size:10px;color:var(--success);font-weight:700}.pack-habits{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}.pack-habit-row{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-dim)}.pack-habit-row.applied{color:var(--success)}.pack-habit-row .pack-habit-meta{font-size:10px;margin-left:auto}.modal-overlay{position:fixed;inset:0;z-index:var(--z-modal);background:#0f0d1ed9;backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:20px;animation:overlay-in .2s ease}.modal-card{background:var(--bg-card);color:var(--text-primary);border-radius:20px;padding:24px;width:100%;max-width:480px;max-height:90vh;overflow-y:auto;box-shadow:0 24px 60px #0f0d1e66;animation:modal-in .3s ease}[data-theme=cyberpunk] .modal-card{border:1px solid var(--border-glow)}.modal-card .modal-title{font-family:var(--font-display);font-size:18px;font-weight:800;color:var(--text-primary);margin:0 0 14px;letter-spacing:1px}.modal-card .modal-body{color:var(--text-primary);font-size:14px;line-height:1.5;margin-bottom:20px}.modal-card .modal-body p{color:var(--text-primary)}.modal-card .modal-body small,.modal-card .modal-body .muted{color:var(--text-dim)}.modal-card .modal-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}@keyframes overlay-in{0%{opacity:0}to{opacity:1}}.modal-box{background:var(--bg-card);border-radius:20px;padding:28px;width:100%;max-width:380px;animation:modal-in .3s ease;max-height:90vh;overflow-y:auto;box-shadow:0 24px 60px #0f0d1e66}[data-theme=cyberpunk] .modal-box{border:1px solid var(--border-glow)}@keyframes modal-in{0%{transform:scale(.92) translateY(16px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.modal-title{font-family:var(--font-display);font-size:15px;color:var(--primary);margin-bottom:20px;text-align:center;letter-spacing:2px;font-weight:800;text-transform:uppercase}.pin-dots{display:flex;gap:14px;justify-content:center;margin-bottom:18px}.pin-dot{width:16px;height:16px;border-radius:50%;border:2px solid var(--neutral-200);transition:all .2s;background:transparent}.pin-dot.filled{background:var(--primary);border-color:var(--primary);box-shadow:0 0 12px #6c5ce780}.pin-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.pin-key{background:var(--neutral-100);border:1px solid transparent;border-radius:12px;padding:18px;font-family:var(--font-display);font-size:22px;font-weight:700;color:var(--text-primary);cursor:pointer;transition:all .15s;text-align:center}[data-theme=cyberpunk] .pin-key{background:var(--bg-card2)}.pin-key:active{transform:scale(.93);background:#6c5ce726;border-color:var(--primary)}.pin-key.del{font-size:16px;color:var(--warning)}.pin-error{color:var(--danger);font-size:13px;text-align:center;margin-top:10px;font-family:var(--font-mono);min-height:20px}.achievement-modal{background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;text-align:center;padding:36px 24px}.achievement-icon{font-size:72px;margin-bottom:12px;animation:bounce-in .6s cubic-bezier(.68,-.55,.27,1.55)}@keyframes bounce-in{0%{transform:scale(0)}60%{transform:scale(1.2)}to{transform:scale(1)}}.achievement-title{font-family:var(--font-display);font-size:24px;font-weight:900;letter-spacing:2px;margin-bottom:8px}.achievement-desc{font-size:14px;opacity:.9;margin-bottom:20px}.tutorial-modal{text-align:center;padding:32px 28px}.tutorial-icon{font-size:64px;margin-bottom:16px}.tutorial-title{font-family:var(--font-display);font-size:20px;font-weight:800;color:var(--primary);letter-spacing:1px;margin-bottom:10px}.tutorial-desc{font-size:14px;color:var(--text-dim);line-height:1.5;margin-bottom:24px}.tutorial-dots{display:flex;justify-content:center;gap:8px;margin-bottom:20px}.tutorial-dot{width:8px;height:8px;border-radius:50%;background:var(--neutral-200)}.tutorial-dot.active{background:var(--primary);width:24px;border-radius:4px}.confetti{position:fixed;inset:0;pointer-events:none;z-index:var(--z-modal);overflow:hidden}.confetti-piece{position:absolute;width:10px;height:10px;background:var(--primary);animation:confetti-fall 2.5s linear forwards}@keyframes confetti-fall{0%{transform:translateY(-20px) rotate(0);opacity:1}to{transform:translateY(110vh) rotate(720deg);opacity:0}}#bottom-nav-host{position:fixed;bottom:0;left:0;right:0;background:var(--bg-card);border-top:1px solid var(--border-glow);display:flex;justify-content:space-around;align-items:center;padding:8px 0 calc(8px + var(--safe-bottom));backdrop-filter:blur(20px);box-shadow:0 -4px 30px #6c5ce71a;z-index:var(--z-nav)}@media (min-width: 600px){#bottom-nav-host{max-width:480px;left:50%;transform:translate(-50%)}}[data-theme=cyberpunk] #bottom-nav-host{background:#0d0d24f2}.nav-btn{display:flex;flex-direction:column;align-items:center;gap:4px;background:none;border:none;cursor:pointer;color:var(--text-dim);font-family:var(--font-body);font-size:10px;font-weight:700;letter-spacing:.5px;padding:6px 10px;border-radius:10px;transition:all .2s;flex:1;text-transform:uppercase}.nav-btn .icon{font-size:22px;transition:all .2s;display:inline-flex;align-items:center;justify-content:center;line-height:1}.nav-btn .icon img{width:24px;height:24px;display:block}.nav-btn:not(.active) .icon img{filter:grayscale(.6) opacity(.65)}[data-theme=cyberpunk] .nav-btn:not(.active) .icon img{filter:brightness(0) invert(.6)}[data-theme=cyberpunk] .nav-btn.active .icon img{filter:brightness(0) invert(1)}.nav-btn.active{color:var(--primary)}.nav-btn.active .icon{transform:translateY(-2px)}.auth-box{background:var(--bg-card);border-radius:24px;padding:28px 20px;width:100%;max-width:100%;box-shadow:var(--shadow-lg);margin:auto;position:relative}@media (min-width: 380px){.auth-box{padding:36px 28px;max-width:380px}}[data-theme=cyberpunk] .auth-box{border:1px solid var(--border-glow)}.auth-logo{text-align:center;margin-bottom:24px}.auth-logo-text{font-family:var(--font-display);font-size:36px;font-weight:900;letter-spacing:4px;background:linear-gradient(90deg,var(--primary),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-tagline{font-family:var(--font-mono);font-size:11px;color:var(--text-dim);letter-spacing:2px;margin-top:6px;text-transform:uppercase}.auth-title{font-family:var(--font-display);font-size:22px;font-weight:900;text-align:center;margin-bottom:6px;color:var(--text-primary)}.auth-sub{font-size:13px;text-align:center;color:var(--text-dim);margin-bottom:24px}.auth-toggle{display:flex;background:var(--neutral-100);border-radius:var(--r-full);padding:4px;margin-bottom:24px}[data-theme=cyberpunk] .auth-toggle{background:var(--bg-card2)}.auth-toggle-btn{flex:1;padding:10px;border-radius:var(--r-full);font-family:var(--font-display);font-size:12px;font-weight:700;letter-spacing:1px;background:transparent;color:var(--text-dim);border:none;cursor:pointer;transition:all .2s;text-transform:uppercase}.auth-toggle-btn.active{background:var(--bg-card);color:var(--primary);box-shadow:var(--shadow-sm)}.auth-error{color:var(--danger);font-size:13px;text-align:center;padding:10px 14px;background:#ff6b6b1f;border:1px solid rgba(255,107,107,.3);border-radius:10px;margin-bottom:12px}.login-screen-wrap{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;position:relative}.login-logo{font-family:var(--font-display);font-size:42px;font-weight:900;background:linear-gradient(90deg,var(--primary),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:4px;margin-bottom:6px;text-align:center}.login-subtitle{font-family:var(--font-mono);font-size:11px;color:var(--text-dim);letter-spacing:3px;margin-bottom:40px;text-transform:uppercase;text-align:center}.login-cards{display:flex;flex-direction:column;gap:14px;width:100%;max-width:100%}.login-card{background:var(--bg-card);border:1px solid var(--border-glow);border-radius:18px;padding:20px;cursor:pointer;transition:all .3s;display:flex;align-items:center;gap:16px;position:relative;overflow:hidden;box-shadow:var(--shadow-sm)}.login-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 60%,rgba(108,92,231,.06));pointer-events:none}.login-card:active{transform:scale(.97)}.login-card.hero{border-left:4px solid var(--success)}.login-card.admin{border-left:4px solid var(--primary)}.login-card .card-icon{font-size:36px;flex-shrink:0}.login-card .card-info{flex:1}.login-card .card-info h3{font-family:var(--font-display);font-size:15px;font-weight:800;letter-spacing:1px}.login-card .card-info p{font-size:12px;color:var(--text-dim);margin-top:3px}.login-card.hero .card-info h3{color:var(--success)}.login-card.admin .card-info h3{color:var(--primary)}.login-card .arrow{color:var(--text-dim);font-size:20px;margin-left:auto}.btn-corner{position:absolute;top:16px;right:16px;width:36px;height:36px;border-radius:50%;background:var(--bg-card);border:1px solid var(--border-glow);font-size:16px;cursor:pointer}.btn-corner.left{right:auto;left:16px}.lang-toggle{display:flex;gap:8px;margin-top:30px;justify-content:center}.lang-btn{background:var(--bg-card);border:1px solid var(--border-glow);color:var(--text-dim);font-family:var(--font-mono);font-size:12px;padding:6px 16px;border-radius:20px;cursor:pointer;transition:all .2s;font-weight:700}.lang-btn.active{border-color:var(--primary);color:var(--primary);background:#6c5ce714}.theme-toggle{position:absolute;top:16px;right:16px;width:36px;height:36px;border-radius:50%;background:var(--bg-card);border:1px solid var(--border-glow);font-size:16px;cursor:pointer}#toast-container{position:fixed;top:calc(16px + var(--safe-top));left:50%;transform:translate(-50%);z-index:var(--z-toast);display:flex;flex-direction:column;gap:8px;pointer-events:none;width:90%;max-width:360px}.toast{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:var(--radius-md);box-shadow:var(--shadow-md);background:var(--bg-card);font-weight:600;font-size:13px;color:var(--text-primary);pointer-events:auto;animation:toast-in .25s cubic-bezier(.4,0,.2,1);border-left:4px solid var(--primary)}[data-theme=cyberpunk] .toast{border:1px solid var(--border-glow);border-left:4px solid var(--primary)}.toast.success{border-left-color:var(--success)}.toast.warning{border-left-color:var(--warning)}.toast.error{border-left-color:var(--danger)}.toast.info{border-left-color:var(--secondary)}.toast-icon{font-size:18px;flex-shrink:0}.toast-content{flex:1}@keyframes toast-in{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes toast-out{to{transform:translateY(-20px);opacity:0}}@keyframes coin-pop{0%{transform:scale(1)}50%{transform:scale(1.4);color:var(--warning)}to{transform:scale(1)}}.coin-pop{animation:coin-pop .5s ease}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}.shake{animation:shake .3s ease}@keyframes glow-pulse{0%,to{box-shadow:0 0 8px #6c5ce766}50%{box-shadow:0 0 24px #6c5ce7cc}}.glow-pulse{animation:glow-pulse 1.5s ease infinite}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{font-family:var(--font-body);background:var(--bg-deep);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;min-height:100dvh;overflow-x:hidden}#app{width:100%;min-height:100vh;min-height:100dvh;background:var(--bg-deep);position:relative;padding-top:var(--safe-top);display:flex;flex-direction:column}@media (min-width: 600px){#app{max-width:480px;margin:0 auto;box-shadow:0 0 60px #00000014}}@media (min-width: 1024px){body{background:linear-gradient(135deg,var(--neutral-100),var(--bg-deep))}}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}button:disabled{opacity:.6;cursor:not-allowed}input,textarea,select{font-family:inherit;font-size:var(--text-base)}img{max-width:100%;height:auto;display:block}a{color:var(--primary);text-decoration:none}#screen-host{flex:1;display:flex;flex-direction:column}.screen{display:none;flex:1;overflow-y:auto;padding-bottom:calc(100px + var(--safe-bottom));-webkit-overflow-scrolling:touch}.screen.active:after{content:"";display:block;height:80px;pointer-events:none}.screen.active{display:block;animation:fade-in .3s ease}@keyframes fade-in{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.screen-header{padding:16px 20px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:10;background:var(--bg-deep);border-bottom:1px solid rgba(108,92,231,.08)}.screen-title{font-family:var(--font-display);font-size:18px;font-weight:800;color:var(--primary);letter-spacing:2px}#sync-indicator{position:fixed;top:12px;right:12px;z-index:var(--z-sync);background:var(--bg-card);border:1px solid var(--border-glow);border-radius:20px;padding:5px 12px;font-family:var(--font-mono);font-size:10px;letter-spacing:1px;display:flex;align-items:center;gap:6px;transition:all .3s;color:var(--text-dim);pointer-events:none}#sync-indicator:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--success);box-shadow:0 0 8px var(--success)}#sync-indicator[data-status=syncing]:before{background:var(--warning);animation:sync-pulse 1s infinite}#sync-indicator[data-status=offline]:before{background:var(--danger)}@keyframes sync-pulse{0%,to{opacity:1}50%{opacity:.3}}.empty-state{text-align:center;padding:48px 20px;color:var(--text-dim)}.empty-state .empty-icon{font-size:48px;margin-bottom:12px;opacity:.6}.empty-state p{font-size:13px}.loading-overlay{position:fixed;inset:0;background:var(--bg-deep);display:flex;align-items:center;justify-content:center;z-index:var(--z-modal)}.spinner{width:48px;height:48px;border:4px solid var(--neutral-100);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.app-icon{display:inline-block;vertical-align:middle;transition:filter .2s}[data-theme=cyberpunk] .app-icon{filter:brightness(0) invert(1)}.app-icon.dim{opacity:.7}.app-logo-wrap{display:inline-flex;align-items:center;justify-content:center}