@import"https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap";:root{--primary-blue: #1e40af;--secondary-blue: #3b82f6;--forest-green: #059669;--light-green: #10b981;--energetic-orange: #f97316;--light-orange: #fb923c;--neutral-gray: #374151;--light-gray: #f8fafc;--lighter-gray: #f1f5f9;--white: #ffffff;--dark-text: #0f172a;--medium-text: #334155;--light-text: #374151;--text-muted: #374151;--border-color: #e2e8f0;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 20px 25px -5px rgb(0 0 0 / .1), 0 10px 10px -5px rgb(0 0 0 / .04);--shadow-xl: 0 25px 50px -12px rgb(0 0 0 / .25);--gradient-primary: linear-gradient(135deg, var(--primary-blue), var(--secondary-blue));--gradient-success: linear-gradient(135deg, var(--forest-green), var(--light-green));--gradient-orange: linear-gradient(135deg, var(--energetic-orange), var(--light-orange))}body{font-family:Poppins,sans-serif;line-height:1.6;color:var(--dark-text);background:linear-gradient(135deg,#8b9cf7,#a78bfa,#f5b7ff);background-size:400% 400%;animation:gradientShift 8s ease infinite;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;overflow-x:hidden;-webkit-overflow-scrolling:touch}.app{min-height:100vh;display:flex;flex-direction:column;background:inherit}.nav{background:var(--gradient-primary);color:var(--white);padding:1.25rem 0;box-shadow:var(--shadow-lg);position:relative;z-index:100}.nav-container{max-width:1200px;margin:0 auto;padding:0 1rem;display:flex;justify-content:space-between;align-items:center}.logo{font-size:1.5rem;font-weight:700;color:var(--white);text-decoration:none}.logo-desktop{display:inline}.logo-mobile{display:none;flex-direction:column;line-height:1.1}.logo-line{display:block}.user-controls{display:flex;align-items:center;gap:1rem}@media (min-width: 769px){.btn-text{display:inline}.btn{align-items:center;justify-content:center}}.btn{padding:.75rem 1.25rem;border:none;border-radius:.75rem;font-family:inherit;font-weight:600;cursor:pointer;transition:all .3s ease;text-decoration:none;display:inline-flex;align-items:center;gap:.5rem;box-shadow:var(--shadow-sm);position:relative;overflow:hidden;touch-action:manipulation;-webkit-tap-highlight-color:transparent;min-height:44px;min-width:44px}.btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.btn-primary{background:var(--gradient-orange);color:var(--white)}.btn-secondary{background-color:transparent;color:var(--white);border:2px solid var(--white)}.btn-secondary:hover{background-color:var(--white);color:var(--primary-blue);transform:translateY(-2px)}.btn-success{background:var(--gradient-success);color:var(--white)}.btn-outline{background-color:transparent;color:var(--primary-blue);border:2px solid var(--border-color)}.btn-outline:hover{background-color:var(--primary-blue);color:var(--white);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.main-content{flex:1;max-width:1200px;margin:0 auto;padding:2rem 1rem;width:100%}.card{background:#fffffff2;border-radius:1.25rem;padding:1.75rem;box-shadow:0 8px 32px #0000001a,0 2px 16px #0000000d,inset 0 1px #fff6;margin-bottom:1.5rem;transition:all .4s ease;border:1px solid rgba(255,255,255,.2);position:relative;overflow:hidden;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--gradient-primary)}.card:hover{transform:translateY(-6px) scale(1.02);box-shadow:0 20px 40px #00000026,0 8px 32px #3b82f61a,inset 0 1px #fff9;border:1px solid rgba(59,130,246,.3)}.card-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.avatar{width:3rem;height:3rem;border-radius:50%;background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;color:var(--white);box-shadow:var(--shadow-sm);border:2px solid var(--white)}.item-name{font-size:1.25rem;font-weight:600;color:var(--primary-blue);margin-bottom:.5rem}.item-hint{color:var(--neutral-gray);margin-bottom:1rem}.hint-label{font-weight:500;color:var(--forest-green)}.form{background:#fffffff2;border-radius:1rem;padding:2rem;box-shadow:0 8px 32px #0000001a,0 2px 16px #0000000d,inset 0 1px #fff6;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);max-width:500px;margin:0 auto}.form-group{margin-bottom:1.5rem}.form-label{display:block;margin-bottom:.5rem;font-weight:500;color:var(--dark-text)}.form-input{width:100%;padding:.75rem;border:2px solid #e5e7eb;border-radius:.5rem;font-family:inherit;transition:border-color .2s ease}.form-input:focus{outline:none;border-color:var(--secondary-blue)}.form-textarea{min-height:100px;resize:vertical}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.modal{background:#fffffff2;border-radius:1rem;padding:2rem;box-shadow:0 8px 32px #0000001a,0 2px 16px #0000000d,inset 0 1px #fff6;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);max-width:500px;width:100%;max-height:90vh;overflow-y:auto}.modal-header{text-align:center;margin-bottom:1.5rem}.modal-title{font-size:1.5rem;font-weight:600;color:var(--primary-blue);margin-bottom:.5rem}.onboarding{text-align:center;max-width:600px;margin:0 auto;padding:2rem}.onboarding-slide{margin-bottom:3rem}.onboarding-icon{font-size:4rem;margin-bottom:1rem}.onboarding-title{font-size:2rem;font-weight:600;color:var(--primary-blue);margin-bottom:1rem}.onboarding-description{font-size:1.1rem;color:var(--neutral-gray);margin-bottom:2rem}.congrats{text-align:center;padding:2rem}.congrats-title{font-size:2.5rem;font-weight:700;color:var(--forest-green);margin-bottom:1rem}.congrats-content{background:var(--white);border-radius:1rem;padding:2rem;box-shadow:var(--shadow);margin-top:2rem}.reward-section{background:linear-gradient(135deg,var(--light-orange),var(--energetic-orange));color:var(--white);padding:1.5rem;border-radius:.5rem;margin:1rem 0}.text-muted{color:var(--neutral-gray)}.text-admin{color:#dc2626}.text-rainbow{background:linear-gradient(45deg,red,#ff7f00,#ff0,#0f0,#00f,indigo,#9400d3);background-size:400% 400%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:rainbow 3s ease-in-out infinite;font-weight:700}.choice-option{border:2px solid #e5e7eb;border-radius:1rem;padding:1.5rem;transition:all .2s ease}.choice-option:hover{border-color:var(--secondary-blue)}.choice-option.recommended{border-color:var(--primary-blue);background:linear-gradient(135deg,#1e3a8a0d,#3b82f60d)}.choice-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.choice-title{font-size:1.1rem;font-weight:600;color:var(--dark-text);display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.recommended-badge{background:var(--forest-green);color:var(--white);font-size:.75rem;padding:.25rem .5rem;border-radius:1rem;font-weight:500}.benefits-list{margin-bottom:1.5rem}.benefit-item{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem;font-size:.9rem}.disclaimer{margin-bottom:1.5rem;padding:1rem;background-color:#6b72801a;border-radius:.5rem}.space-y-4>*+*{margin-top:1.5rem}.celebration-header{margin-bottom:2rem}.celebration-icons{display:flex;justify-content:center;align-items:center;gap:1rem;margin-bottom:1rem}.qwest-summary{margin-bottom:2rem}.claim-directions{background:var(--light-gray);padding:1.5rem;border-radius:.75rem;margin:1.5rem 0}.directions-content{background:var(--white);padding:1rem;border-radius:.5rem;border-left:4px solid var(--primary-blue)}.actions{display:flex;gap:1rem;justify-content:center;margin-top:2rem}.btn-lg{padding:.75rem 1.5rem;font-size:1rem}.qwests-grid{display:grid;gap:1.5rem}.w-3{width:.75rem}.h-3{height:.75rem}.opacity-50{opacity:.5}.relative{position:relative}.absolute{position:absolute}.left-3{left:.75rem}.top-half{top:50%}.transform,.translate-y-half{transform:translateY(-50%)}.whitespace-pre-line{white-space:pre-line}.btn-icon{background:none;border:none;padding:.5rem;cursor:pointer;border-radius:.5rem;transition:background-color .2s ease}.btn-icon:hover{background-color:#0000001a}.btn-icon-white{background:transparent;border:2px solid white;color:#fff;padding:.5rem;cursor:pointer;border-radius:.5rem;transition:all .2s ease}.btn-icon-white:hover{background-color:#ffffff1a;transform:translateY(-1px);box-shadow:0 2px 8px #fff3}.btn-icon-white.disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn-icon-white.disabled:hover{background-color:transparent;transform:none;box-shadow:none}.btn-icon-small{background:none;border:none;padding:.25rem;cursor:pointer;border-radius:.25rem;transition:background-color .2s ease}.btn-icon-small:hover{background-color:#0000001a}.divider{position:relative;text-align:center;margin:1.5rem 0}.divider:before{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background-color:#e5e7eb}.divider span{background-color:var(--white);padding:0 1rem;color:var(--neutral-gray);font-size:.875rem}.hover-underline:hover{text-decoration:underline}.own-qwest-status{text-align:center}.border-t{border-top:1px solid #e5e7eb}.pt-3{padding-top:1rem}.admin-badge{display:inline-flex;align-items:center;justify-content:center;gap:.25rem;padding:.25rem .5rem;background:linear-gradient(135deg,#dc2626,#ef4444);border-radius:1rem;color:#fff;font-size:10px;font-weight:600;box-shadow:0 2px 4px #0003;animation:adminGlow 2s ease-in-out infinite alternate}.admin-text{font-size:10px;font-weight:600;letter-spacing:.025em}.banned-badge{display:inline-flex;align-items:center;justify-content:center;gap:.25rem;padding:.25rem .5rem;background:linear-gradient(135deg,#374151,#9ca3af);border-radius:1rem;color:#fff;font-size:10px;font-weight:600;box-shadow:0 2px 4px #0003}.banned-text{font-size:10px;font-weight:600;letter-spacing:.025em}.protected-badge{display:inline-flex;align-items:center;justify-content:center;gap:.25rem;padding:.25rem .5rem;background:linear-gradient(135deg,#059669,#10b981);border-radius:1rem;color:#fff;font-size:10px;font-weight:600;box-shadow:0 2px 4px #0003}.protected-text{font-size:10px;font-weight:600;letter-spacing:.025em}.head-admin-badge{display:inline-flex;align-items:center;justify-content:center;gap:.25rem;padding:.25rem .5rem;background:linear-gradient(135deg,#0ea5e9,#38bdf8);border-radius:1rem;color:#fff;font-size:10px;font-weight:600;box-shadow:0 2px 4px #0003;animation:headAdminGlow 2s ease-in-out infinite alternate}.head-admin-text{font-size:10px;font-weight:600;letter-spacing:.025em}@keyframes headAdminGlow{0%{box-shadow:0 2px 4px #0003}to{box-shadow:0 2px 8px #0ea5e966,0 0 0 3px #0ea5e91a}}@keyframes rainbow{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}@keyframes adminGlow{0%{box-shadow:0 2px 4px #0003}to{box-shadow:0 2px 8px #dc262666,0 0 0 3px #dc26261a}}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@media (max-width: 768px){.main-content{padding:1rem;padding-bottom:env(safe-area-inset-bottom,1rem)}.nav{padding-top:env(safe-area-inset-top,1.25rem)}.nav-container{padding:0 1rem}.logo-desktop{display:none}.logo-mobile{display:flex}.nav-buttons{gap:.25rem;flex-wrap:wrap;justify-content:flex-end}.btn{padding:.5rem .75rem;font-size:.8rem;min-height:44px;touch-action:manipulation}.btn-text{display:none}.user-controls{display:flex;align-items:center;gap:.25rem}.nav-container{flex-wrap:wrap}.card{padding:1rem;margin-bottom:1rem}.form{padding:1.5rem}.form-input,.form-textarea{padding:.875rem;font-size:16px;min-height:44px}.actions{flex-direction:column;gap:.75rem}.choice-option{padding:1rem;min-height:60px}.choice-header{flex-direction:column;align-items:flex-start;gap:.5rem}.choice-title{flex-direction:column;align-items:flex-start;gap:.25rem}.qwests-grid{grid-template-columns:1fr;gap:1rem}.avatar-button{min-height:44px;min-width:44px}.btn-icon{min-height:44px;min-width:44px;padding:.75rem}.admin-actions button{min-height:44px;font-size:.875rem}}@media (max-width: 768px) and (orientation: portrait){.nav{padding-top:max(env(safe-area-inset-top),1.25rem)}.main-content{padding-bottom:max(env(safe-area-inset-bottom),1rem)}}@media (max-width: 768px) and (orientation: landscape){.nav{padding:.75rem 0}.main-content{padding:.75rem 1rem;padding-left:max(env(safe-area-inset-left),1rem);padding-right:max(env(safe-area-inset-right),1rem)}.btn{padding:.5rem .875rem;min-height:36px}}@media (max-width: 375px){.nav-buttons{flex-direction:column;align-items:stretch;gap:.25rem}.btn{font-size:.8rem;padding:.625rem .75rem}.card{padding:.75rem}.form{padding:1rem}}.friends-container{max-width:1200px;margin:2rem auto;padding:2.5rem;background:linear-gradient(135deg,#fffffff2,#f8fafcf2);-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);border-radius:28px;box-shadow:0 25px 50px #00000026,0 0 0 1px #ffffff4d,inset 0 1px #fff6;border:1px solid rgba(255,255,255,.4);position:relative;overflow:hidden}.friends-container:before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--primary-blue) 0%,var(--forest-green) 30%,var(--energetic-orange) 60%,#f59e0b 100%);border-radius:28px 28px 0 0;box-shadow:0 2px 8px #1e40af4d}.friends-container:after{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(30,64,175,.03) 0%,transparent 50%);pointer-events:none;animation:floatingOrb 20s ease-in-out infinite}@keyframes floatingOrb{0%,to{transform:translate(0) rotate(0)}33%{transform:translate(30px,-30px) rotate(120deg)}66%{transform:translate(-20px,20px) rotate(240deg)}}.friends-header{margin-bottom:2.5rem;text-align:center;position:relative;z-index:2}.friends-header h1{display:flex;align-items:center;justify-content:center;gap:1rem;color:var(--dark-text);font-size:3rem;font-weight:800;margin:0;background:linear-gradient(135deg,var(--primary-blue) 0%,var(--forest-green) 50%,var(--energetic-orange) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 4px 8px rgba(0,0,0,.1);position:relative}.friends-header h1:after{content:"";position:absolute;bottom:-10px;left:50%;transform:translate(-50%);width:80px;height:4px;background:linear-gradient(90deg,var(--primary-blue),var(--forest-green),var(--energetic-orange));border-radius:2px;opacity:.6}.friends-tabs{display:flex;gap:.5rem;margin-bottom:2.5rem;background:linear-gradient(135deg,#fff9,#f8fafc99);border-radius:20px;padding:.75rem;flex-wrap:wrap;box-shadow:inset 0 2px 8px #00000014,0 4px 12px #0000000d;border:1px solid rgba(255,255,255,.3);position:relative;z-index:2}.friends-tabs .tab{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;background:transparent;border:none;border-radius:12px;color:var(--medium-text);cursor:pointer;transition:all .3s ease;font-size:.95rem;font-weight:600;position:relative;white-space:nowrap}.friends-tabs .tab:hover{color:var(--dark-text);background:#fffc;transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.friends-tabs .tab.active{color:#fff;background:linear-gradient(135deg,var(--primary-blue) 0%,var(--forest-green) 50%,var(--energetic-orange) 100%);box-shadow:0 6px 16px #1e40af66,0 2px 8px #00000026,inset 0 1px #fff3;transform:translateY(-2px);border:1px solid rgba(255,255,255,.2)}.notification-dot{width:8px;height:8px;background:var(--forest-green);border-radius:50%;margin-left:.25rem;animation:pulse 2s infinite}.friends-content{min-height:400px;position:relative;z-index:2}.friends-content>div{animation:fadeInUp .6s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.empty-state{text-align:center;padding:4rem 2rem;color:var(--medium-text);background:linear-gradient(135deg,#fff6,#f8fafc66);border-radius:20px;border:2px dashed rgba(30,64,175,.2);margin:2rem 0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.empty-state svg{color:var(--text-muted);margin-bottom:1rem}.empty-state h3{color:var(--text-primary);margin-bottom:.5rem;font-size:1.25rem}.empty-state p{font-size:.95rem;line-height:1.5}.user-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem;margin-top:1.5rem}.user-card{background:linear-gradient(135deg,#ffffffe6,#f8fafce6);border:1px solid rgba(255,255,255,.4);border-radius:20px;padding:2rem;display:flex;align-items:center;justify-content:space-between;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);box-shadow:0 8px 24px #00000014,0 2px 8px #0000000a,inset 0 1px #ffffff4d}.user-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,transparent 0%,rgba(var(--primary-rgb),.02) 100%);opacity:0;transition:opacity .2s ease}.user-card:hover:before{opacity:1}.user-card:hover{border-color:#1e40af66;transform:translateY(-6px) scale(1.02);box-shadow:0 20px 40px #00000026,0 8px 16px #1e40af26,inset 0 1px #fff6;background:linear-gradient(135deg,#fffffff2,#f8fafcf2)}.user-info{display:flex;align-items:center;gap:1rem;flex:1}.user-avatar{width:56px;height:56px;background:linear-gradient(135deg,var(--primary-blue),var(--forest-green));border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;box-shadow:0 4px 12px #1e40af33,inset 0 1px #fff3;position:relative}.user-avatar:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;background:linear-gradient(135deg,var(--primary-blue),var(--forest-green),var(--energetic-orange));border-radius:50%;z-index:-1;opacity:0;transition:opacity .3s ease}.user-card:hover .user-avatar:before{opacity:1}.user-details h3{margin:0 0 .25rem;color:var(--text-primary);font-size:1.1rem;font-weight:600}.user-details p{margin:0;color:var(--text-secondary);font-size:.9rem}.friend-since,.request-time{color:var(--text-muted)!important;font-size:.85rem!important}.request-card{border-left:4px solid var(--forest-green)}.sent-request-card{border-left:4px solid var(--golden-yellow)}.search-result-card{border-left:4px solid var(--primary-blue)}.request-actions{display:flex;gap:.5rem}.status-badge{display:flex;align-items:center;gap:.25rem;padding:.5rem .75rem;background:var(--golden-yellow);color:#fff;border-radius:8px;font-size:.85rem;font-weight:500}.search-input-container{position:relative;max-width:500px;margin-bottom:1.5rem}.search-input-container svg{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--text-muted)}.search-input{width:100%;padding:1rem 1.25rem 1rem 3.5rem;border:2px solid rgba(255,255,255,.3);border-radius:16px;background:#ffffffe6;color:var(--dark-text);font-size:1rem;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 12px #0000000d}.search-input:focus{outline:none;border-color:var(--primary-blue);background:#fff;box-shadow:0 0 0 3px #1e40af1a,0 8px 24px #0000001a;transform:translateY(-1px)}.search-results{margin-top:1.5rem}.search-results h3{color:var(--text-primary);margin-bottom:1rem;font-size:1.1rem}.search-hint{text-align:center;padding:1rem;color:var(--text-muted);font-style:italic;background:#ffffff80;border-radius:8px;border:1px dashed rgba(0,0,0,.1)}.activities-list{display:flex;flex-direction:column;gap:1rem}.activity-card{display:flex;align-items:flex-start;gap:1rem;background:#fffc;border:1px solid rgba(255,255,255,.3);border-radius:16px;padding:1.5rem;transition:all .3s ease;position:relative;overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 12px #0000000d}.activity-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,transparent 0%,rgba(var(--forest-rgb),.02) 100%);opacity:0;transition:opacity .2s ease}.activity-card:hover:before{opacity:1}.activity-card:hover{border-color:#0596694d;transform:translateY(-4px);box-shadow:0 12px 24px #0000001a,0 4px 8px #0596691a;background:#fffffff2}.activity-user{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem;color:var(--text-primary);font-weight:600}.activity-content{flex:1}.activity-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.activity-header strong{color:var(--text-primary)}.activity-type{color:var(--primary-blue);font-weight:600;margin-bottom:.5rem;text-transform:capitalize}.activity-description{color:var(--text-secondary);margin-bottom:.5rem;line-height:1.5}.activity-qwest{background:linear-gradient(135deg,var(--golden-yellow),var(--forest-green));color:#fff;padding:.75rem;border-radius:8px;font-size:.9rem}.reward{opacity:.9;margin-left:.5rem}.activity-time{color:var(--text-muted);font-size:.85rem;text-align:right}.friend-notification-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;background:linear-gradient(135deg,var(--forest-green),var(--golden-yellow));color:#fff;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease;font-size:.85rem;font-weight:500;margin-right:.5rem;position:relative;overflow:hidden}.friend-notification-btn:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(255,255,255,.1),transparent);opacity:0;transition:opacity .2s ease}.friend-notification-btn:hover:before{opacity:1}.friend-notification-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(var(--forest-rgb),.3)}.notification-content{display:flex;align-items:center;gap:.25rem}.notification-badge{background:#fff;color:var(--forest-green);border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600;margin-left:.25rem}.loading{text-align:center;padding:2rem;color:var(--text-secondary);font-size:.95rem}.error-message{background:#dc26261a;border:1px solid rgba(220,38,38,.2);color:#dc2626;padding:1rem;border-radius:8px;margin-bottom:1rem}.setup-message{background:linear-gradient(135deg,#ffffffe6,#f8fafce6);border:2px dashed rgba(30,64,175,.2);border-radius:20px;padding:3rem 2rem;text-align:center;max-width:600px;margin:2rem auto;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 24px #00000014;position:relative;overflow:hidden}.setup-message:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary-blue),var(--forest-green),var(--energetic-orange));border-radius:20px 20px 0 0}.setup-icon{color:var(--primary-blue);margin-bottom:1rem}.setup-message h3{color:var(--text-primary);margin-bottom:1rem;font-size:1.5rem}.setup-message p{color:var(--text-secondary);margin-bottom:1.5rem;line-height:1.6}.setup-instructions{background:#ffffff80;border-radius:8px;padding:1.5rem;text-align:left;margin-top:1rem}.setup-instructions p{margin-bottom:.75rem;color:var(--text-primary)}.setup-instructions ol{margin:0;padding-left:1.5rem}.setup-instructions li{margin-bottom:.5rem;color:var(--text-secondary);line-height:1.5}.setup-instructions code{background:rgba(var(--primary-rgb),.1);color:var(--primary-blue);padding:.25rem .5rem;border-radius:4px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.9rem}.requests-section{display:flex;flex-direction:column;gap:2rem}.requests-received h2,.requests-sent h2{color:var(--text-primary);font-size:1.25rem;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.btn-danger-outline{background:transparent;border:2px solid #dc2626;color:#dc2626}.btn-danger-outline:hover{background:#dc2626;color:#fff}.btn-danger{background:#dc2626;color:#fff;border:2px solid #dc2626}.btn-danger:hover{background:#b91c1c;border-color:#b91c1c}.btn:disabled{opacity:.6;cursor:not-allowed;transform:none!important;box-shadow:none!important}.btn:disabled:hover{transform:none!important;box-shadow:none!important}.btn:disabled:before{display:none}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@media (max-width: 768px){.friends-container{margin:1rem;padding:2rem 1.5rem;border-radius:24px}.friends-container:after{display:none}.friends-header h1{font-size:1.5rem}.friends-tabs{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:.5rem}.friends-tabs::-webkit-scrollbar{display:none}.friends-tabs .tab{flex-shrink:0;padding:.5rem .75rem;font-size:.85rem}.user-grid{grid-template-columns:1fr;gap:.75rem}.user-card{padding:.75rem}.user-avatar{width:40px;height:40px}.user-details h3{font-size:1rem}.user-details p{font-size:.85rem}.request-actions{flex-direction:column;gap:.25rem}.request-actions .btn{padding:.5rem;font-size:.8rem}.search-input-container{max-width:100%}.friend-notification-btn{padding:.5rem}.notification-text{display:none}.activities-list{gap:.75rem}.activity-card{padding:.75rem}.activity-user{font-size:.9rem}.activity-qwest{padding:.5rem;font-size:.85rem}}@media (max-width: 375px){.friends-tabs .tab{padding:.5rem;font-size:.8rem}.user-info{gap:.75rem}.user-avatar{width:36px;height:36px}.user-details h3{font-size:.95rem}.friend-notification-btn{padding:.375rem}.notification-badge{width:18px;height:18px;font-size:.7rem}}.debug-panel{background:linear-gradient(135deg,#fffffff2,#f8fafcf2);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:20px;margin-bottom:2rem;overflow:hidden;box-shadow:0 8px 32px #0000001a,0 0 0 1px #fff3,inset 0 1px #ffffff4d;border:1px solid rgba(255,255,255,.3);position:relative}.debug-panel.error-panel{border-left:5px solid #ef4444;background:linear-gradient(135deg,#fef2f2f2,#fff7f7f2)}.debug-panel.info-panel{border-left:5px solid #3b82f6;background:linear-gradient(135deg,#eff6fff2,#f8fafcf2)}.debug-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2rem 1rem;border-bottom:1px solid rgba(0,0,0,.05)}.debug-title{display:flex;align-items:center;gap:.75rem}.debug-title h3{margin:0;font-size:1.1rem;font-weight:700;color:var(--text-primary)}.error-panel .debug-title h3{color:#dc2626}.info-panel .debug-title h3{color:#1d4ed8}.debug-title .icon{width:20px;height:20px}.error-panel .debug-title .icon{color:#ef4444}.info-panel .debug-title .icon{color:#3b82f6}.debug-content{padding:1rem 2rem 1.5rem;max-height:300px;overflow-y:auto}.debug-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}.debug-item{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:#ffffffb3;border-radius:12px;border:1px solid rgba(0,0,0,.05);transition:all .2s ease}.debug-item:hover{background:#ffffffe6;transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.debug-label{font-weight:600;color:var(--text-secondary);font-size:.9rem}.debug-value{font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.85rem;color:var(--text-primary);background:#0000000d;padding:.25rem .5rem;border-radius:6px;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.debug-count{background:linear-gradient(135deg,var(--primary-blue),var(--forest-green));color:#fff;font-weight:700;min-width:30px;text-align:center}.debug-status.loading{background:linear-gradient(135deg,#f59e0b,#f97316);color:#fff;font-weight:600;animation:pulse 2s infinite}.debug-status.ready{background:linear-gradient(135deg,var(--forest-green),#10b981);color:#fff;font-weight:600}.error-item{background:#fffc;border:1px solid rgba(239,68,68,.2);border-radius:12px;padding:1rem;margin-bottom:.75rem;transition:all .2s ease}.error-item:hover{background:#fffffff2;border-color:#ef44444d;transform:translateY(-1px);box-shadow:0 4px 12px #ef44441a}.error-header{display:flex;gap:1rem;margin-bottom:.5rem;flex-wrap:wrap}.error-time{font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.8rem;color:#374151;background:#0000000d;padding:.25rem .5rem;border-radius:6px}.error-context{font-weight:600;color:#dc2626;font-size:.9rem}.error-message{display:block;background:#ef44441a;color:#dc2626;padding:.75rem;border-radius:8px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.85rem;line-height:1.4;word-break:break-word;border:1px solid rgba(239,68,68,.2)}.btn-sm{padding:.375rem .75rem;font-size:.8rem;border-radius:8px}.btn-icon{padding:.5rem;border-radius:8px;display:flex;align-items:center;justify-content:center}.btn-icon .icon{width:16px;height:16px}.loading-indicator{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 2rem;text-align:center}.loading-spinner{width:40px;height:40px;border:4px solid rgba(30,64,175,.1);border-left:4px solid var(--primary-blue);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-indicator p{color:var(--text-secondary);font-weight:500;margin:0}.search-hint{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 2rem;text-align:center;background:linear-gradient(135deg,#3b82f60d,#93c5fd0d);border:2px dashed rgba(59,130,246,.2);border-radius:16px;margin:1.5rem 0}.search-hint .icon{width:32px;height:32px;color:var(--primary-blue);margin-bottom:1rem;opacity:.7}.search-hint p{color:var(--text-secondary);font-weight:500;margin:0;font-size:.95rem}.no-results{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 2rem;text-align:center;background:linear-gradient(135deg,#9ca3af0d,#d1d5db0d);border:2px dashed rgba(156,163,175,.3);border-radius:16px;margin:1.5rem 0}.no-results .icon{width:32px;height:32px;color:var(--text-muted);margin-bottom:1rem;opacity:.7}.no-results h3{color:var(--text-primary);margin:0 0 .5rem;font-size:1.1rem}.no-results p{color:var(--text-secondary);margin:0;font-size:.95rem}.request-card.received{border-left:4px solid var(--forest-green);background:linear-gradient(135deg,#10b9810d,#fffc)}.request-card.sent{border-left:4px solid var(--golden-yellow);background:linear-gradient(135deg,#f59e0b0d,#fffc)}.status-badge{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:12px;font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.status-badge.pending{background:linear-gradient(135deg,var(--golden-yellow),#f59e0b);color:#fff;box-shadow:0 2px 8px #f59e0b4d}.status-badge .icon{width:14px;height:14px}.search-input-container{position:relative;margin-bottom:1.5rem}.search-input-container .icon{position:absolute;left:1.25rem;top:50%;transform:translateY(-50%);color:var(--text-muted);width:20px;height:20px;z-index:2}.search-input{width:100%;padding:1rem 1.25rem 1rem 3.5rem;border:2px solid rgba(59,130,246,.2);border-radius:16px;background:#ffffffe6;color:var(--text-primary);font-size:1rem;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 12px #0000000d,inset 0 1px #fff3}.search-input:focus{outline:none;border-color:var(--primary-blue);background:#fff;box-shadow:0 0 0 3px #3b82f61a,0 8px 24px #0000001a,inset 0 1px #fff3;transform:translateY(-2px)}.search-input::placeholder{color:var(--text-muted)}@media (max-width: 768px){.debug-panel{margin:1rem;border-radius:16px}.debug-header{padding:1rem 1.5rem .75rem;flex-direction:column;align-items:flex-start;gap:1rem}.debug-content{padding:.75rem 1.5rem 1.25rem}.debug-grid{grid-template-columns:1fr;gap:.75rem}.debug-item{padding:.5rem .75rem}.debug-value{max-width:150px;font-size:.8rem}.error-item{padding:.75rem}.error-header{flex-direction:column;gap:.5rem;align-items:flex-start}.loading-indicator{padding:2rem 1rem}.loading-spinner{width:32px;height:32px}.search-hint,.no-results{padding:2rem 1rem}.search-hint .icon,.no-results .icon{width:28px;height:28px}}.races-container{max-width:1200px;margin:0 auto;padding:2rem}.races-header{text-align:center;margin-bottom:3rem}.races-header h1{display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:1rem;color:var(--text-primary);font-size:2.5rem;font-weight:800}.races-header p{color:var(--text-secondary);font-size:1.1rem;margin-bottom:2rem}.races-tabs{display:flex;justify-content:center;gap:1rem;margin-bottom:3rem;border-bottom:2px solid rgba(0,0,0,.1)}.races-tabs .tab{display:flex;align-items:center;gap:.5rem;padding:1rem 2rem;background:none;border:none;color:var(--text-secondary);font-weight:600;cursor:pointer;border-bottom:3px solid transparent;transition:all .3s ease}.races-tabs .tab:hover{color:var(--primary-blue);background:#3b82f60d}.races-tabs .tab.active{color:var(--primary-blue);border-bottom-color:var(--primary-blue);background:#3b82f61a}.races-content{min-height:400px}.races-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(400px,1fr));gap:2rem}.race-card{background:linear-gradient(135deg,#fffffff2,#f8fafcf2);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:20px;padding:2rem;box-shadow:0 8px 32px #0000001a,0 0 0 1px #fff3,inset 0 1px #ffffff4d;border:1px solid rgba(255,255,255,.3);transition:all .3s ease}.race-card:hover{transform:translateY(-4px);box-shadow:0 12px 40px #00000026,0 0 0 1px #fff3,inset 0 1px #ffffff4d}.race-card.creator{border-left:5px solid var(--golden-yellow);background:linear-gradient(135deg,#f59e0b0d,#fffffff2)}.race-card.completed{border-left:5px solid var(--forest-green);background:linear-gradient(135deg,#10b9810d,#fffffff2)}.race-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.race-header h3{margin:0;color:var(--text-primary);font-size:1.3rem;font-weight:700}.race-status{padding:.5rem 1rem;border-radius:12px;font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.race-status.waiting{background:linear-gradient(135deg,var(--golden-yellow),#f59e0b);color:#fff}.race-status.active{background:linear-gradient(135deg,var(--primary-blue),#1d4ed8);color:#fff}.race-status.completed{background:linear-gradient(135deg,var(--forest-green),#10b981);color:#fff}.race-info{margin-bottom:1.5rem}.race-info p{color:var(--text-secondary);margin-bottom:1rem;line-height:1.5}.race-details{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.race-detail{display:flex;align-items:center;gap:.5rem;padding:.75rem;background:#00000008;border-radius:10px;font-size:.9rem;color:var(--text-secondary)}.race-detail .icon{width:16px;height:16px;color:var(--primary-blue)}.race-participants{margin-bottom:1.5rem}.race-participants h4{margin:0 0 1rem;color:var(--text-primary);font-size:1rem;font-weight:600}.participants-list{display:flex;flex-direction:column;gap:.5rem}.participant{display:flex;justify-content:space-between;align-items:center;padding:.5rem .75rem;background:#3b82f60d;border-radius:8px;font-size:.9rem}.participant-level{font-weight:600;color:var(--primary-blue)}.items-found{font-weight:600;color:var(--forest-green)}.race-actions{display:flex;gap:1rem;flex-wrap:wrap}.race-actions .btn{flex:1;min-width:120px}.status-text{color:var(--text-secondary);font-style:italic;padding:.75rem;text-align:center;background:#00000008;border-radius:8px;flex:1}.race-winner{display:flex;align-items:center;gap:.75rem;padding:1rem;background:linear-gradient(135deg,var(--golden-yellow),#f59e0b);color:#fff;border-radius:12px;margin-bottom:1.5rem;font-weight:600}.race-winner .icon{width:20px;height:20px}.winner-level{margin-left:auto;font-weight:700}.race-results h4{margin:0 0 1rem;color:var(--text-primary);font-size:1rem;font-weight:600}.results-list{display:flex;flex-direction:column;gap:.5rem}.result-item{display:flex;align-items:center;gap:1rem;padding:.75rem;background:#00000008;border-radius:8px;font-size:.9rem}.result-item.winner{background:linear-gradient(135deg,#f59e0b1a,#fffc);border:1px solid rgba(245,158,11,.3)}.rank{font-weight:700;color:var(--primary-blue);min-width:30px}.penalty{margin-left:auto;color:#ef4444;font-weight:600}.friends-list{display:flex;flex-direction:column;gap:1rem;max-height:400px;overflow-y:auto}.friend-item{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:#00000008;border-radius:12px;transition:all .2s ease}.friend-item:hover{background:#3b82f60d;transform:translateY(-1px)}.friend-info{display:flex;flex-direction:column;gap:.25rem}.friend-level{font-size:.85rem;color:var(--text-secondary);font-weight:600}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-weight:600;color:var(--text-primary)}.form-group small{color:var(--text-muted);font-size:.8rem}.form-group input,.form-group textarea{padding:.75rem;border:2px solid rgba(0,0,0,.1);border-radius:8px;font-size:1rem;transition:all .2s ease}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--primary-blue);box-shadow:0 0 0 3px #3b82f61a}@media (max-width: 768px){.races-container{padding:1rem}.races-header h1{font-size:2rem}.races-tabs{flex-direction:column;gap:.5rem}.races-tabs .tab{padding:.75rem 1rem}.races-grid{grid-template-columns:1fr;gap:1.5rem}.race-card{padding:1.5rem}.race-details{grid-template-columns:1fr}.race-actions{flex-direction:column}.form-row{grid-template-columns:1fr}}.protected-route-guard{min-height:80vh;display:flex;align-items:center;justify-content:center;padding:20px}.auth-prompt{background:linear-gradient(135deg,#8b9cf7,#a78bfa);border-radius:20px;padding:1px;box-shadow:0 20px 40px #0000001a;max-width:500px;width:100%}.auth-prompt-content{background:#fff;border-radius:19px;padding:48px 32px;text-align:center;position:relative;overflow:hidden}.auth-prompt-content:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#8b9cf7,#a78bfa)}.auth-prompt-icon{width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#8b9cf7,#a78bfa);display:flex;align-items:center;justify-content:center;margin:0 auto 24px;color:#fff;box-shadow:0 8px 24px #667eea4d}.auth-prompt h2{font-size:28px;font-weight:600;color:#2d3748;margin:0 0 12px}.auth-prompt p{font-size:16px;color:#718096;margin:0 0 32px;line-height:1.5}.auth-prompt-actions{display:flex;gap:12px;justify-content:center;align-items:center;flex-wrap:wrap}.auth-prompt-actions .btn{min-width:120px;height:44px;display:flex;align-items:center;justify-content:center;gap:8px;font-weight:500;transition:all .3s ease}.auth-prompt-actions .btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #00000026}.auth-prompt-actions .btn-primary{background:linear-gradient(135deg,#8b9cf7,#a78bfa);border:none;color:#fff}.auth-prompt-actions .btn-outline{background:transparent;border:2px solid #e2e8f0;color:#4a5568}.auth-prompt-actions .btn-outline:hover{border-color:#8b9cf7;color:#8b9cf7}@media (max-width: 640px){.auth-prompt-content{padding:32px 20px}.auth-prompt h2{font-size:24px}.auth-prompt-actions{flex-direction:column;gap:8px}.auth-prompt-actions .btn{width:100%}}:root{--primary-blue: #1e40af;--secondary-blue: #3b82f6;--forest-green: #059669;--light-green: #10b981;--energetic-orange: #f97316;--light-orange: #fb923c;--neutral-gray: #374151;--light-gray: #f8fafc;--lighter-gray: #f1f5f9;--white: #ffffff;--dark-text: #0f172a;--medium-text: #334155;--light-text: #374151;--border-color: #e2e8f0;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 20px 25px -5px rgb(0 0 0 / .1), 0 10px 10px -5px rgb(0 0 0 / .04);--shadow-xl: 0 25px 50px -12px rgb(0 0 0 / .25)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Poppins,sans-serif;line-height:1.6;color:var(--dark-text);background:linear-gradient(135deg,#8b9cf7,#a78bfa);background-attachment:fixed;min-height:100vh;position:relative;overflow-x:hidden}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(circle at 20% 20%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 40% 60%,rgba(255,255,255,.05) 0%,transparent 50%);animation:backgroundFloat 20s ease-in-out infinite alternate;z-index:-2}body:after{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(2px 2px at 20px 30px,rgba(255,215,0,.8),transparent),radial-gradient(2px 2px at 40px 70px,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 90px 40px,rgba(255,215,0,.7),transparent),radial-gradient(1px 1px at 130px 80px,rgba(255,255,255,.4),transparent),radial-gradient(2px 2px at 160px 30px,rgba(255,215,0,.6),transparent);background-repeat:repeat;background-size:200px 100px;animation:sparkleMove 25s linear infinite;z-index:-1}@keyframes backgroundFloat{0%,to{transform:translate(0) scale(1)}33%{transform:translate(30px,-30px) scale(1.1)}66%{transform:translate(-20px,20px) scale(.9)}}@keyframes sparkleMove{0%{background-position:0 0}to{background-position:200px 100px}}.app{min-height:100vh;display:flex;flex-direction:column}.nav{background:linear-gradient(135deg,var(--primary-blue),var(--secondary-blue));color:var(--white);padding:1.5rem 0;box-shadow:var(--shadow-lg);position:relative;z-index:100}.nav:after{content:"";position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent)}.nav-container{max-width:1200px;margin:0 auto;padding:0 1.5rem;display:flex;justify-content:space-between;align-items:center}.logo{font-size:1.75rem;font-weight:700;color:var(--white);text-decoration:none;letter-spacing:-.025em}.nav-buttons{display:flex;gap:1rem;align-items:center}.btn{padding:.75rem 1.5rem;border:none;border-radius:.875rem;font-family:inherit;font-weight:600;font-size:.875rem;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;position:relative;overflow:hidden;letter-spacing:.025em}.btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .6s ease}.btn:hover:before{left:100%}.btn-primary{background:linear-gradient(135deg,var(--energetic-orange),var(--light-orange));color:var(--white);box-shadow:var(--shadow-sm)}.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-secondary{background:transparent;color:var(--white);border:2px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.btn-secondary:hover{background:var(--white);color:var(--primary-blue);transform:translateY(-2px);border-color:var(--white)}.btn-success{background:linear-gradient(135deg,var(--forest-green),var(--light-green));color:var(--white);box-shadow:var(--shadow-sm)}.btn-success:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-outline{background:var(--white);color:var(--primary-blue);border:2px solid var(--border-color);box-shadow:var(--shadow-sm)}.btn-outline:hover{background:var(--primary-blue);color:var(--white);transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--primary-blue)}.main-content{flex:1;max-width:1200px;margin:0 auto;padding:3rem 1.5rem;width:100%}.card{background:var(--white);border-radius:1.5rem;padding:2rem;box-shadow:var(--shadow-lg);margin-bottom:2rem;transition:all .4s cubic-bezier(.4,0,.2,1);border:1px solid var(--border-color);position:relative;overflow:hidden}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(135deg,#93c5fdcc,#3b82f6cc)}.card:hover{box-shadow:var(--shadow-xl);transform:translateY(-8px);border-color:var(--secondary-blue)}.card-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}.avatar{width:3.5rem;height:3.5rem;border-radius:50%;background:linear-gradient(135deg,var(--primary-blue),var(--secondary-blue));display:flex;align-items:center;justify-content:center;color:var(--white);box-shadow:var(--shadow);border:3px solid var(--white);position:relative}.avatar:after{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:50%;background:linear-gradient(135deg,var(--primary-blue),var(--energetic-orange));z-index:-1}.item-name{font-size:1.5rem;font-weight:700;color:var(--dark-text);margin-bottom:.75rem;line-height:1.2}.item-hint{color:var(--medium-text);margin-bottom:1.5rem;line-height:1.6;padding:1rem;background:var(--light-gray);border-radius:.75rem;border-left:4px solid var(--forest-green)}.hint-label{font-weight:600;color:var(--forest-green)}.form{background:#fffffff2;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:1.5rem;padding:2.5rem;box-shadow:var(--shadow-lg);max-width:600px;margin:0 auto;border:1px solid rgba(255,255,255,.3)}.form-group{margin-bottom:2rem}.form-label{display:block;margin-bottom:.75rem;font-weight:600;color:var(--dark-text);font-size:.875rem;letter-spacing:.025em}.form-input{width:100%;padding:1rem 1.25rem;border:2px solid var(--border-color);border-radius:.75rem;font-family:inherit;font-size:1rem;transition:all .3s ease;background:var(--white)}.form-input:focus{outline:none;border-color:var(--secondary-blue);box-shadow:0 0 0 3px #3b82f61a;transform:translateY(-1px)}.form-textarea{min-height:120px;resize:vertical}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1.5rem;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{background:#fffffffa;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:1.5rem;padding:2.5rem;box-shadow:var(--shadow-xl);max-width:600px;width:100%;max-height:90vh;overflow-y:auto;position:relative;border:1px solid rgba(255,255,255,.2);animation:slideUp .4s cubic-bezier(.4,0,.2,1)}@keyframes slideUp{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{text-align:center;margin-bottom:2rem}.modal-title{font-size:1.75rem;font-weight:700;color:var(--dark-text);margin-bottom:.5rem}.text-center{text-align:center}.text-success{color:var(--forest-green)}.text-primary{color:var(--primary-blue)}.text-muted{color:var(--light-text)}.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.font-medium{font-weight:500}.font-semibold{font-weight:600}.w-full{width:100%}.flex{display:flex}.flex-col{flex-direction:column}.flex-1{flex:1}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-2{gap:1rem}.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}.btn-icon{background:none;border:none;padding:.75rem;cursor:pointer;border-radius:.75rem;transition:all .2s ease;color:var(--light-text)}.btn-icon:hover{background-color:var(--light-gray);color:var(--dark-text);transform:scale(1.05)}@media (max-width: 768px){.main-content{padding:2rem 1rem}.nav-container{padding:0 1rem}.nav-buttons{gap:.5rem}.btn{padding:.625rem 1rem;font-size:.8rem}.card{padding:1.5rem}.form{padding:2rem}.modal{margin:1rem;padding:2rem}.item-name{font-size:1.25rem}.logo{font-size:1.5rem}}.loading-screen{position:fixed;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,var(--primary-blue),var(--secondary-blue));display:flex;align-items:center;justify-content:center;z-index:9999;transition:opacity .3s ease-out}.loading-screen.fade-out{opacity:0}.loading-content{text-align:center;color:var(--white);animation:fadeInUp .8s ease-out}.logo-animation{margin-bottom:2rem;position:relative}.logo-circle{width:120px;height:120px;border:3px solid rgba(255,255,255,.3);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto;position:relative;animation:rotateGlow 3s linear infinite;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.logo-circle:before{content:"";position:absolute;top:-5px;left:-5px;right:-5px;bottom:-5px;border-radius:50%;background:linear-gradient(45deg,rgba(255,255,255,.5),transparent,rgba(255,255,255,.5));z-index:-1;animation:rotateReverse 3s linear infinite}.logo-letter{font-size:4rem;font-weight:700;color:var(--white);text-shadow:0 0 20px rgba(255,255,255,.5);animation:pulse 2s ease-in-out infinite}.logo-sparkles{position:absolute;top:0;left:0;right:0;bottom:0}.sparkle{position:absolute;width:8px;height:8px;background:var(--white);border-radius:50%;opacity:0;animation:sparkle 2s ease-in-out infinite}.sparkle-1{top:15%;right:20%;animation-delay:0s}.sparkle-2{bottom:25%;left:15%;animation-delay:.5s}.sparkle-3{top:30%;left:10%;animation-delay:1s}.sparkle-4{bottom:15%;right:15%;animation-delay:1.5s}.loading-title{font-size:2.5rem;font-weight:700;margin-bottom:2rem;letter-spacing:-.025em;text-shadow:0 2px 10px rgba(0,0,0,.3);animation:slideInTitle .8s ease-out .3s both}.loading-spinner{display:flex;justify-content:center;gap:.5rem}.spinner-dot{width:12px;height:12px;background:var(--white);border-radius:50%;animation:bounce 1.5s ease-in-out infinite}.spinner-dot:nth-child(2){animation-delay:.2s}.spinner-dot:nth-child(3){animation-delay:.4s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes rotateGlow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotateReverse{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@keyframes sparkle{0%,to{opacity:0;transform:scale(0)}50%{opacity:1;transform:scale(1)}}@keyframes slideInTitle{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.btn-sm{padding:.5rem .75rem;font-size:.75rem;border-radius:.5rem}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:1px solid var(--border-color)}.success-notification{position:absolute;top:-60px;left:50%;transform:translate(-50%);background:linear-gradient(135deg,var(--forest-green),#10b981);color:var(--white);padding:1rem 1.5rem;border-radius:.75rem;display:flex;align-items:center;gap:.5rem;box-shadow:var(--shadow-lg);font-weight:600;z-index:1001;animation:slideDown .3s ease-out}.success-notification:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:8px solid transparent;border-top-color:var(--forest-green)}.notification{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;border-radius:.5rem;margin-bottom:1rem;font-weight:500;animation:slideInNotification .3s ease-out}.notification.error{background:linear-gradient(135deg,#ef44441a,#dc26261a);border:1px solid rgba(239,68,68,.3);color:#dc2626}.notification.success{background:linear-gradient(135deg,#10b9811a,#0596691a);border:1px solid rgba(16,185,129,.3);color:var(--forest-green)}@keyframes slideDown{0%{opacity:0;transform:translate(-50%) translateY(-20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes slideInNotification{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.footer{background:linear-gradient(135deg,#0f172a,#1e293b,#334155);color:var(--white);padding:1.5rem 0;margin-top:auto;box-shadow:0 -8px 25px -5px #0000004d,0 -4px 10px -3px #0003;position:relative;z-index:50;border-top:1px solid rgba(255,255,255,.1)}.footer:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent)}.footer:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#0000004d;z-index:-1}.footer-content{max-width:1200px;margin:0 auto;padding:0 1.5rem;display:flex;justify-content:center;align-items:center;position:relative;z-index:1}.footer-content p{font-size:.95rem;font-weight:600;margin:0;letter-spacing:.05em;text-shadow:0 2px 4px rgba(0,0,0,.5);background:linear-gradient(135deg,#fff,#f1f5f9);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}