:root{--font-body: "Visby Round", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;--font-heading: "Visby Round", sans-serif;--color-primary: #5E3AFF;--color-primary-strong: #6A4DFF;--color-blue-contrast: #6EC1FF;--color-accent-rose: #FF6EA8;--color-accent-teal: #3DE1C6;--color-dark-1: #111318;--color-dark-2: #151728;--color-dark-3: #1A132B;--color-light-1: #F5F6FF;--color-light-2: #E9EDFF;--color-light-3: #DCE8FF;--color-success: #10B981;--color-warning: #F59E0B;--color-error: #EF4444;--color-info: #3B82F6;--color-orange: #FF9800;--color-gold: #FFD700;--color-danger: #EF4444;--color-trophy: #FFD700;--color-achievement: #FFD700;--color-warn: #F59E0B;--color-close: #EF4444;--color-delete: #DC2626;--color-logout: #EF4444;--text-strong: #0E0F12;--text: #1B1C21;--text-muted: #5A5D66;--text-inv: #FFFFFF;--text-inv-muted: #C7C9D3;--color-bg-primary: rgba(255, 255, 255, .75);--color-bg-secondary: rgba(249, 250, 255, .85);--color-bg-tertiary: rgba(245, 246, 255, .9);--color-border: rgba(0, 0, 0, .08);--color-border-strong: rgba(0, 0, 0, .12);--gradient-bg-light: linear-gradient(135deg, var(--color-light-1), var(--color-light-2), var(--color-light-3));--gradient-bg-dark: linear-gradient(135deg, var(--color-dark-1), var(--color-dark-2), var(--color-dark-3));--gradient-primary: linear-gradient(180deg, var(--color-primary-strong), var(--color-primary));--gradient-secondary-light: linear-gradient(180deg, var(--color-blue-contrast), rgba(var(--color-blue-contrast-rgb), .8));--gradient-secondary-dark: linear-gradient(180deg, rgba(var(--color-dark-2-rgb, 42, 55, 82), 1), rgba(var(--color-dark-3-rgb, 32, 50, 71), 1));--gradient-accent-yellow: linear-gradient(135deg, #FFD700, #FFA500);--gradient-trophy: linear-gradient(135deg, #FFD700, #FFA500);--gradient-danger: linear-gradient(135deg, #EF4444, #DC2626);--neon-glow-primary: 0 0 8px rgba(94, 58, 255, .3), 0 0 16px rgba(94, 58, 255, .2);--neon-glow-success: 0 0 8px rgba(16, 185, 129, .3), 0 0 16px rgba(16, 185, 129, .2);--neon-glow-error: 0 0 8px rgba(239, 68, 68, .3), 0 0 16px rgba(239, 68, 68, .2);--neon-glow-warning: 0 0 8px rgba(245, 158, 11, .3), 0 0 16px rgba(245, 158, 11, .2);--neon-glow-gold: 0 0 8px rgba(255, 215, 0, .4), 0 0 16px rgba(255, 215, 0, .3);--neon-glow-teal: 0 0 8px rgba(61, 225, 198, .3), 0 0 16px rgba(61, 225, 198, .2);--neon-glow-rose: 0 0 8px rgba(255, 110, 168, .3), 0 0 16px rgba(255, 110, 168, .2);--radius-card: 16px;--radius-btn: 12px;--radius-input: 10px;--radius-sm: 8px;--radius-lg: 20px;--radius-xl: 24px;--gap-1: 8px;--gap-2: 12px;--gap-3: 16px;--gap-4: 24px;--gap-5: 32px;--shadow-light: 0 8px 30px rgba(30, 46, 80, .12);--shadow-dark: 0 8px 30px rgba(0,0,0,.35);--shadow-lg: 0 12px 40px rgba(0,0,0,.15);--shadow-xl: 0 16px 50px rgba(0,0,0,.2);--color-primary-rgb: 94, 58, 255;--color-primary-strong-rgb: 106, 77, 255;--color-blue-contrast-rgb: 110, 193, 255;--color-accent-rose-rgb: 255, 110, 168;--color-accent-teal-rgb: 61, 225, 198;--color-orange-rgb: 255, 152, 0;--color-gold-rgb: 255, 215, 0;--color-success-rgb: 16, 185, 129;--color-warning-rgb: 245, 158, 11;--color-error-rgb: 239, 68, 68;--color-danger-rgb: 239, 68, 68;--color-info-rgb: 59, 130, 246;--color-white-rgb: 255, 255, 255;--color-black-rgb: 0, 0, 0;--color-white: #FFFFFF;--color-black: #000000;--color-near-black: #0F0B16;--color-near-white: #FBFAFE}html[data-theme=light]{background:var(--gradient-bg-light);color:var(--text)}html[data-theme=dark]{background:var(--gradient-bg-dark);color:var(--text-inv);--text-strong: #F9FAFF;--text: #E6EBFF;--text-muted: rgba(229, 233, 255, .68);--text-inv: #FFFFFF;--text-inv-muted: rgba(231, 233, 255, .6);--color-bg-primary: rgba(20, 22, 32, .72);--color-bg-secondary: rgba(24, 28, 36, .65);--color-bg-tertiary: rgba(26, 30, 40, .8);--color-border: rgba(255, 255, 255, .12);--color-border-strong: rgba(255, 255, 255, .18);--color-success: #10B981;--color-warning: #FBBF24;--color-error: #F87171;--color-info: #60A5FA;--color-danger: #F87171;--color-trophy: #FFD700;--color-achievement: #FFD700;--color-warn: #FBBF24;--color-close: #F87171;--color-delete: #EF4444;--color-logout: #F87171;--neon-glow-primary: 0 0 12px rgba(94, 58, 255, .4), 0 0 24px rgba(94, 58, 255, .3);--neon-glow-success: 0 0 12px rgba(16, 185, 129, .4), 0 0 24px rgba(16, 185, 129, .3);--neon-glow-error: 0 0 12px rgba(239, 68, 68, .4), 0 0 24px rgba(239, 68, 68, .3);--neon-glow-warning: 0 0 12px rgba(245, 158, 11, .4), 0 0 24px rgba(245, 158, 11, .3);--neon-glow-gold: 0 0 12px rgba(255, 215, 0, .5), 0 0 24px rgba(255, 215, 0, .4);--neon-glow-teal: 0 0 12px rgba(61, 225, 198, .4), 0 0 24px rgba(61, 225, 198, .3);--neon-glow-rose: 0 0 12px rgba(255, 110, 168, .4), 0 0 24px rgba(255, 110, 168, .3)}*{scrollbar-width:none;-ms-overflow-style:none}*::-webkit-scrollbar{display:none}html,body{overflow:auto;-webkit-overflow-scrolling:touch}.float{transform:translateY(0);transition:transform .28s ease,box-shadow .28s ease,filter .28s ease}.float:hover{transform:translateY(-4px);filter:brightness(1.03);box-shadow:0 12px 30px #00000038}.card{border-radius:var(--radius-card);padding:var(--gap-4);background:var(--color-bg-primary);box-shadow:var(--shadow-light);border:1px solid var(--color-border);pointer-events:auto;box-sizing:border-box;transition:all .2s ease;color:var(--text);position:relative}html[data-theme=dark] .card{background:#141620f2;box-shadow:var(--shadow-dark);border-color:var(--color-border);color:var(--text)}html[data-theme=light] .card{background:var(--color-bg-primary);color:var(--text)}.card[data-semantic=success],.card.success{border-color:var(--color-success);box-shadow:var(--shadow-light),var(--neon-glow-success)}.card[data-semantic=error],.card.error{border-color:var(--color-error);box-shadow:var(--shadow-light),var(--neon-glow-error)}.card[data-semantic=warning],.card.warning{border-color:var(--color-warning);box-shadow:var(--shadow-light),var(--neon-glow-warning)}.card[data-semantic=info],.card.info{border-color:var(--color-info);box-shadow:var(--shadow-light),var(--neon-glow-teal)}.card[data-semantic=trophy],.card.trophy,.card.achievement{border-color:var(--color-gold);box-shadow:var(--shadow-light),var(--neon-glow-gold)}html[data-theme=dark] .card[data-semantic=success],html[data-theme=dark] .card.success{box-shadow:var(--shadow-dark),var(--neon-glow-success)}html[data-theme=dark] .card[data-semantic=error],html[data-theme=dark] .card.error{box-shadow:var(--shadow-dark),var(--neon-glow-error)}html[data-theme=dark] .card[data-semantic=warning],html[data-theme=dark] .card.warning{box-shadow:var(--shadow-dark),var(--neon-glow-warning)}html[data-theme=dark] .card[data-semantic=info],html[data-theme=dark] .card.info{box-shadow:var(--shadow-dark),var(--neon-glow-teal)}html[data-theme=dark] .card[data-semantic=trophy],html[data-theme=dark] .card.trophy,html[data-theme=dark] .card.achievement{box-shadow:var(--shadow-dark),var(--neon-glow-gold)}.card.hover-lift{transition:all .3s cubic-bezier(.4,0,.2,1)}.card.hover-lift:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl)}html[data-theme=dark] .card.hover-lift:hover{box-shadow:var(--shadow-dark),0 0 20px rgba(var(--color-primary-rgb),.15);border-color:rgba(var(--color-primary-rgb),.3)}.card[style*=gradient-primary],.card[style*=--gradient-primary]{color:var(--text-inv)}html[data-theme=dark] .card[style*=gradient-primary],html[data-theme=dark] .card[style*=--gradient-primary]{color:var(--text-inv);box-shadow:var(--shadow-dark),0 0 20px rgba(var(--color-primary-rgb),.3)}@media (max-width: 768px){.card{padding:var(--gap-3);border-radius:var(--radius-btn)}}.input{font-family:var(--font-body);border-radius:var(--radius-input);border:1px solid var(--color-border);padding:12px 16px;background:var(--color-bg-secondary);min-height:48px;font-size:16px;width:100%;box-sizing:border-box;cursor:text;pointer-events:auto;touch-action:manipulation;-webkit-appearance:none;transition:all .2s;position:relative;z-index:1;color:var(--text)}html[data-theme=dark] .input{background:var(--color-bg-secondary);border-color:var(--color-border);color:var(--text-inv)}.input:focus{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px #5e3aff40,var(--neon-glow-primary)}.input:focus-visible{border-color:var(--color-primary);outline:2px solid var(--color-primary);outline-offset:2px;box-shadow:0 0 0 4px #5e3aff4d,var(--neon-glow-primary)}html[data-theme=dark] .input:focus-visible{outline-color:var(--color-blue-contrast);box-shadow:0 0 0 4px #6ec1ff66,var(--neon-glow-primary)}.btn{font-family:var(--font-body);border-radius:var(--radius-btn);padding:12px 20px;font-weight:600;cursor:pointer;border:none;transition:all .2s cubic-bezier(.4,0,.2,1);transform:translateY(0) scale(1);box-shadow:0 2px 8px #00000026;position:relative;overflow:hidden;min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:rgba(94,58,255,.3);user-select:none;-webkit-user-select:none}.btn-primary{background:var(--gradient-primary);color:var(--text-inv);box-shadow:0 4px 12px #5e3aff4d}.btn-secondary{background:var(--gradient-secondary-light);color:#0e1a28;box-shadow:0 2px 8px #6ec1ff33}html[data-theme=dark] .btn-secondary{background:var(--gradient-secondary-dark);color:var(--text-inv)}.btn-ghost{background:transparent;border:1px solid var(--color-border);color:inherit;box-shadow:none}.btn-danger,.btn-error,.btn-logout{background:var(--gradient-danger);color:var(--text-inv);box-shadow:0 4px 12px #ef44444d}.btn-danger:hover:not(:disabled),.btn-error:hover:not(:disabled),.btn-logout:hover:not(:disabled){box-shadow:0 6px 20px #ef444466,var(--neon-glow-error)}.btn-success{background:linear-gradient(135deg,var(--color-success),#059669);color:var(--text-inv);box-shadow:0 4px 12px #10b9814d}.btn-success:hover:not(:disabled){box-shadow:0 6px 20px #10b98166,var(--neon-glow-success)}.btn-warning{background:linear-gradient(135deg,var(--color-warning),#D97706);color:var(--text-inv);box-shadow:0 4px 12px #f59e0b4d}.btn-warning:hover:not(:disabled){box-shadow:0 6px 20px #f59e0b66,var(--neon-glow-warning)}.btn-trophy,.btn-achievement{background:var(--gradient-trophy);color:var(--text-strong);box-shadow:0 4px 12px #ffd7004d}.btn-trophy:hover:not(:disabled),.btn-achievement:hover:not(:disabled){box-shadow:0 6px 20px #ffd70066,var(--neon-glow-gold)}.btn:hover:not(:disabled){transform:translateY(-2px) scale(1.02);box-shadow:0 6px 20px #00000040;filter:brightness(1.08)}.btn:focus-visible{outline:3px solid var(--color-primary);outline-offset:3px;box-shadow:0 0 0 6px #5e3aff4d,0 6px 20px #00000040}html[data-theme=dark] .btn:focus-visible{outline-color:var(--color-blue-contrast);box-shadow:0 0 0 6px #6ec1ff66,0 6px 20px #00000040}.btn-primary:focus-visible{outline-color:var(--text-inv);box-shadow:0 0 0 6px #ffffff4d,0 6px 20px #5e3aff66}.btn:active:not(:disabled){transform:translateY(0) scale(.98);box-shadow:0 2px 4px #0003;transition:all .1s cubic-bezier(.4,0,.2,1)}.btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-circle{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;min-width:48px;min-height:48px;border-radius:50%;border:none;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px #0003;transform:scale(1);pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:rgba(94,58,255,.3);user-select:none;-webkit-user-select:none;flex-shrink:0}html[data-theme=dark] .btn-circle{box-shadow:0 4px 16px #0006}.btn-gradient-blue{background:linear-gradient(135deg,#4285f4,#34a853)}.btn-gradient-purple{background:linear-gradient(135deg,#9c27b0,#673ab7)}.btn-gradient-pink{background:linear-gradient(135deg,#e91e63,#f06292)}.btn-gradient-orange{background:linear-gradient(135deg,#ff9800,#ff5722)}.btn-gradient-primary{background:linear-gradient(135deg,#4285f4,#9c27b0)}.btn-circle:hover:not(:disabled){transform:scale(1.12);box-shadow:0 6px 20px #00000059;filter:brightness(1.1)}.btn-circle:focus-visible{outline:3px solid var(--color-primary);outline-offset:3px;box-shadow:0 0 0 6px #5e3aff4d,0 6px 20px #00000059}html[data-theme=dark] .btn-circle:focus-visible{outline-color:var(--color-blue-contrast);box-shadow:0 0 0 6px #6ec1ff66,0 6px 20px #00000059}.btn-circle:active:not(:disabled){transform:scale(.96);box-shadow:0 2px 8px #00000040;transition:all .1s ease}.btn-circle:disabled{opacity:.5;cursor:not-allowed}.neon-text-primary{text-shadow:var(--neon-glow-primary);color:var(--color-primary)}.neon-text-success{text-shadow:var(--neon-glow-success);color:var(--color-success)}.neon-text-error{text-shadow:var(--neon-glow-error);color:var(--color-error)}.neon-text-warning{text-shadow:var(--neon-glow-warning);color:var(--color-warning)}.neon-text-gold{text-shadow:var(--neon-glow-gold);color:var(--color-gold)}.neon-text-teal{text-shadow:var(--neon-glow-teal);color:var(--color-accent-teal)}.neon-text-rose{text-shadow:var(--neon-glow-rose);color:var(--color-accent-rose)}.neon-icon-primary{filter:drop-shadow(var(--neon-glow-primary))}.neon-icon-success{filter:drop-shadow(var(--neon-glow-success))}.neon-icon-error{filter:drop-shadow(var(--neon-glow-error))}.neon-icon-warning{filter:drop-shadow(var(--neon-glow-warning))}.neon-icon-gold{filter:drop-shadow(var(--neon-glow-gold))}.neon-icon-teal{filter:drop-shadow(var(--neon-glow-teal))}.neon-icon-rose{filter:drop-shadow(var(--neon-glow-rose))}.layout{display:grid;grid-template-columns:84px 1fr 360px;grid-template-rows:100vh}.sidebar-left,.sidebar-right{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.sidebar-left{background:#14141e59;border-right:1px solid var(--color-border);display:flex;flex-direction:column;justify-content:space-between;padding:var(--gap-2);font-family:var(--font-heading)}html[data-theme=dark] .sidebar-left{background:#14141e80;border-right-color:var(--color-border)}.sidebar-right{background:#14141e40;border-left:1px solid var(--color-border);padding:var(--gap-3);overflow-y:auto;scrollbar-width:none}html[data-theme=dark] .sidebar-right{background:#14141e66;border-left-color:var(--color-border)}.sidebar-right::-webkit-scrollbar{display:none}.content{overflow-y:auto;padding:var(--gap-4);scrollbar-width:none}.content::-webkit-scrollbar{display:none}@media (max-width: 768px){.layout{grid-template-columns:0 1fr 0}.sidebar-left,.sidebar-right{position:fixed;top:0;bottom:0;width:100vw;transform:translate(-100%);transition:transform .3s ease;z-index:1000}.sidebar-left.open,.sidebar-right.open{transform:translate(0)}}@keyframes spin-gradient{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse-glow{0%,to{opacity:1;filter:drop-shadow(0 0 8px var(--color-primary))}50%{opacity:.6;filter:drop-shadow(0 0 16px var(--color-primary))}}@keyframes bell-ring{0%,to{transform:rotate(0)}10%,30%{transform:rotate(-10deg)}20%,40%{transform:rotate(10deg)}50%{transform:rotate(0)}}@keyframes badge-pulse{0%,to{transform:scale(1);box-shadow:0 0 12px currentColor}50%{transform:scale(1.1);box-shadow:0 0 20px currentColor}}@keyframes dot-bounce{0%,80%,to{transform:scale(.8) translateY(0);opacity:.5}40%{transform:scale(1.2) translateY(-8px);opacity:1}}@keyframes wave{0%,40%,to{transform:scaleY(.4)}20%{transform:scaleY(1)}}@keyframes rotate-glow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse-ring{0%,to{transform:scale(1);opacity:.6}50%{transform:scale(1.1);opacity:.3}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}@keyframes progress-fill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes fade-in-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes scale-in{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes slide-in-bottom{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes bounce-soft{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-4px)}20%,40%,60%,80%{transform:translate(4px)}}@keyframes ping{0%{transform:scale(1);opacity:1}75%,to{transform:scale(1.5);opacity:0}}@keyframes notification-pop{0%{transform:scale(.8) translateY(10px);opacity:0}50%{transform:scale(1.05)}to{transform:scale(1) translateY(0);opacity:1}}@keyframes ripple{0%{transform:scale(0);opacity:.6}to{transform:scale(2);opacity:0}}@keyframes button-press{0%,to{transform:scale(1)}50%{transform:scale(.95)}}@keyframes gradient-shift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}@keyframes float-slow{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(2deg)}}@keyframes float-medium{0%,to{transform:translateY(0) translate(0)}33%{transform:translateY(-8px) translate(4px)}66%{transform:translateY(-4px) translate(-4px)}}.animate-fade-in{animation:fade-in-up .4s cubic-bezier(.4,0,.2,1)}.animate-fade-in-fast{animation:fade-in-up .2s cubic-bezier(.4,0,.2,1)}.animate-scale-in{animation:scale-in .3s cubic-bezier(.4,0,.2,1)}.animate-bounce{animation:bounce-soft 2s ease-in-out infinite}.animate-pulse{animation:pulse-glow 2s ease-in-out infinite}.animate-float{animation:float-slow 6s ease-in-out infinite}.animate-gradient{background-size:200% 200%;animation:gradient-shift 4s ease infinite}.delay-100{animation-delay:.1s}.delay-200{animation-delay:.2s}.delay-300{animation-delay:.3s}.delay-400{animation-delay:.4s}.delay-500{animation-delay:.5s}.skeleton{background:linear-gradient(90deg,#ffffff0d 25%,#ffffff26,#ffffff0d 75%);background-size:1000px 100%;animation:shimmer 2s infinite linear;border-radius:var(--radius-card)}.transition-fast{transition:all .15s cubic-bezier(.4,0,.2,1)}.transition-normal{transition:all .3s cubic-bezier(.4,0,.2,1)}.transition-slow{transition:all .5s cubic-bezier(.4,0,.2,1)}.hover-lift{transition:all .2s cubic-bezier(.4,0,.2,1)}.hover-lift:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0000004d}.hover-glow{transition:all .2s cubic-bezier(.4,0,.2,1)}.hover-glow:hover{filter:brightness(1.1) drop-shadow(0 0 12px currentColor)}.hover-scale{transition:all .2s cubic-bezier(.4,0,.2,1)}.hover-scale:hover{transform:scale(1.05)}
