@import"https://fonts.googleapis.com/css2?family=Pretendard:wght@300;400;500;600;700;800;900&display=swap";/*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}.visible{visibility:visible}.static{position:static}.container{width:100%}.block{display:block}.contents{display:contents}.flex{display:flex}.hidden{display:none}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.border{border-style:var(--tw-border-style);border-width:1px}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,backdrop-filter,display,visibility,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}:root{--color-primary:#6366f1;--color-primary-50:#eef2ff;--color-primary-100:#e0e7ff;--color-primary-200:#c7d2fe;--color-primary-300:#a5b4fc;--color-primary-400:#818cf8;--color-primary-500:#6366f1;--color-primary-600:#4f46e5;--color-primary-700:#4338ca;--color-primary-800:#3730a3;--color-primary-900:#312e81;--color-secondary:#06b6d4;--color-secondary-50:#ecfeff;--color-secondary-100:#cffafe;--color-secondary-200:#a5f3fc;--color-secondary-300:#67e8f9;--color-secondary-400:#22d3ee;--color-secondary-500:#06b6d4;--color-secondary-600:#0891b2;--color-secondary-700:#0e7490;--color-secondary-800:#155e75;--color-secondary-900:#164e63;--color-accent:#f59e0b;--color-accent-50:#fffbeb;--color-accent-100:#fef3c7;--color-accent-200:#fde68a;--color-accent-300:#fcd34d;--color-accent-400:#fbbf24;--color-accent-500:#f59e0b;--color-accent-600:#d97706;--color-accent-700:#b45309;--color-accent-800:#92400e;--color-accent-900:#78350f;--color-success:#10b981;--color-success-50:#ecfdf5;--color-success-100:#d1fae5;--color-success-600:#059669;--color-warning:#f59e0b;--color-warning-50:#fffbeb;--color-warning-100:#fef3c7;--color-warning-600:#d97706;--color-error:#ef4444;--color-error-50:#fef2f2;--color-error-100:#fee2e2;--color-error-600:#dc2626;--color-info:#3b82f6;--color-info-50:#eff6ff;--color-info-100:#dbeafe;--color-info-600:#2563eb;--color-slate-50:#f8fafc;--color-slate-100:#f1f5f9;--color-slate-200:#e2e8f0;--color-slate-300:#cbd5e1;--color-slate-400:#94a3b8;--color-slate-500:#64748b;--color-slate-600:#475569;--color-slate-700:#334155;--color-slate-800:#1e293b;--color-slate-900:#0f172a;--color-gray-50:#f9fafb;--color-gray-100:#f3f4f6;--color-gray-200:#e5e7eb;--color-gray-300:#d1d5db;--color-gray-400:#9ca3af;--color-gray-500:#6b7280;--color-gray-600:#4b5563;--color-gray-700:#374151;--color-gray-800:#1f2937;--color-gray-900:#111827;--bg-primary:#fff;--bg-secondary:#f8fafc;--bg-tertiary:#f1f5f9;--bg-quaternary:#e2e8f0;--bg-glass:#fffc;--bg-glass-dark:#0f172acc;--bg-overlay:#0006;--bg-gradient-primary:linear-gradient(135deg,var(--color-primary-500)0%,var(--color-secondary-500)100%);--bg-gradient-warm:linear-gradient(135deg,var(--color-accent-400)0%,var(--color-primary-500)100%);--text-primary:#0f172a;--text-secondary:#475569;--text-tertiary:#64748b;--text-muted:#94a3b8;--text-disabled:#cbd5e1;--text-inverse:#fff;--text-link:var(--color-primary-600);--text-link-hover:var(--color-primary-700);--spacing-0:0;--spacing-0-5:.125rem;--spacing-1:.25rem;--spacing-1-5:.375rem;--spacing-2:.5rem;--spacing-2-5:.625rem;--spacing-3:.75rem;--spacing-3-5:.875rem;--spacing-4:1rem;--spacing-5:1.25rem;--spacing-6:1.5rem;--spacing-7:1.75rem;--spacing-8:2rem;--spacing-10:2.5rem;--spacing-12:3rem;--spacing-16:4rem;--spacing-20:5rem;--spacing-xs:var(--spacing-1);--spacing-sm:var(--spacing-2);--spacing-md:var(--spacing-3);--spacing-lg:var(--spacing-4);--spacing-xl:var(--spacing-6);--spacing-2xl:var(--spacing-8);--spacing-3xl:var(--spacing-12);--radius-none:0;--radius-xs:.125rem;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--radius-full:9999px;--shadow-none:none;--shadow-xs:0 1px 2px 0 #0000000d;--shadow-sm:0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a;--shadow-md:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;--shadow-lg:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;--shadow-xl:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;--shadow-2xl:0 25px 50px -12px #00000040;--shadow-inner:inset 0 2px 4px 0 #0000000d;--shadow-colored:0 4px 14px 0 #6366f126;--shadow-colored-lg:0 10px 32px 0 #6366f133;--shadow-glow:0 0 20px #6366f14d;--shadow-card-hover:0 20px 40px -12px #00000026;--z-base:0;--z-below:-1;--z-dropdown:1000;--z-sticky:1020;--z-fixed:1030;--z-modal-backdrop:1040;--z-modal:1050;--z-popover:1060;--z-tooltip:1070;--z-toast:1080;--z-maximum:2147480000;--transition-fast:.15s ease;--transition-base:.25s ease;--transition-slow:.35s ease;--transition-bounce:.35s cubic-bezier(.68,-.55,.265,1.55);--transition-smooth:.3s cubic-bezier(.4,0,.2,1);--breakpoint-sm:640px;--breakpoint-md:768px;--breakpoint-lg:1024px;--breakpoint-xl:1280px;--breakpoint-2xl:1536px;--container-sm:640px;--container-md:768px;--container-lg:1024px;--container-xl:1280px;--container-2xl:1400px;--header-height:4rem;--footer-height:5rem;--nav-height:4rem}@media (prefers-color-scheme:dark){:root{--bg-primary:#0f172a;--bg-secondary:#1e293b;--bg-tertiary:#334155;--bg-quaternary:#475569;--bg-glass:#0f172acc;--bg-glass-dark:#000c;--bg-overlay:#000000b3;--text-primary:#f8fafc;--text-secondary:#cbd5e1;--text-tertiary:#94a3b8;--text-muted:#64748b;--text-disabled:#475569;--text-inverse:#0f172a;--text-link:var(--color-primary-400);--text-link-hover:var(--color-primary-300);--color-slate-50:#0f172a;--color-slate-100:#1e293b;--color-slate-200:#334155;--color-slate-300:#475569;--color-slate-400:#64748b;--color-slate-500:#94a3b8;--color-slate-600:#cbd5e1;--color-slate-700:#e2e8f0;--color-slate-800:#f1f5f9;--color-slate-900:#f8fafc;--color-gray-50:#0f172a;--color-gray-100:#1e293b;--color-gray-200:#334155;--color-gray-300:#475569;--color-gray-400:#64748b;--color-gray-500:#94a3b8;--color-gray-600:#cbd5e1;--color-gray-700:#e2e8f0;--color-gray-800:#f1f5f9;--color-gray-900:#f8fafc;--shadow-colored:0 4px 14px 0 #6366f166;--shadow-colored-lg:0 10px 32px 0 #6366f180;--shadow-glow:0 0 20px #6366f199}}*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background-color:var(--bg-secondary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0;font-family:Pretendard,-apple-system,BlinkMacSystemFont,system-ui,Roboto,Helvetica Neue,Segoe UI,Apple SD Gothic Neo,Noto Sans KR,Malgun Gothic,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,sans-serif;line-height:1.6}a{color:var(--text-link);transition:var(--transition-fast);text-decoration:none}a:hover{color:var(--text-link-hover)}:focus{outline:2px solid var(--color-primary-500);outline-offset:2px}:focus:not(:focus-visible){outline:none}button,[role=button],input[type=submit],input[type=button]{min-width:44px;min-height:44px}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.glass-effect{background:var(--bg-glass);-webkit-backdrop-filter:blur(20px)}.shadow-glow{box-shadow:var(--shadow-glow)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bg-secondary);color:var(--text-primary);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-weight:400;line-height:1.6;overflow-x:hidden}code{font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,Consolas,Courier New,monospace}#root{flex-direction:column;min-height:100vh;display:flex}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-gray-100);border-radius:var(--radius-md)}::-webkit-scrollbar-thumb{background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));border-radius:var(--radius-md);-webkit-transition:all .3s;transition:all .3s}::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,var(--color-primary-hover),var(--color-secondary-hover));transform:scale(1.1)}button,input,textarea,select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:none;font-family:inherit}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}::-moz-selection{background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));color:#fff}::selection{background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));color:#fff}a{color:inherit;text-decoration:none;transition:all .2s}@keyframes blob{0%{transform:translate(0)scale(1)}33%{transform:translate(30px,-50px)scale(1.1)}66%{transform:translate(-20px,20px)scale(.9)}to{transform:translate(0)scale(1)}}@keyframes slideIn{0%{opacity:0;transform:translate(-100%)}to{opacity:1;transform:translate(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-blob{animation:7s infinite blob}.animate-fade-in{animation:.6s ease-out fadeIn}.animate-slide-in{animation:.4s ease-out slideIn}.animate-pulse{animation:2s cubic-bezier(.4,0,.6,1) infinite pulse}.animation-delay-200{animation-delay:.2s}.animation-delay-400{animation-delay:.4s}.animation-delay-600{animation-delay:.6s}.glass-effect{-webkit-backdrop-filter:blur(10px);background:#ffffff40;border:1px solid #ffffff2e}.gradient-primary{background:linear-gradient(135deg,var(--color-primary)0%,var(--color-secondary)100%)}.gradient-accent{background:linear-gradient(135deg,var(--color-accent)0%,var(--color-error)100%)}.text-gradient{background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}@media (max-width:640px){body{font-size:14px}}@media (max-width:480px){body{font-size:13px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}.login-container{min-height:100vh;background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-secondary) 50%,var(--color-accent) 100%);display:flex;align-items:center;justify-content:center;padding:var(--spacing-lg);position:relative;overflow:hidden}.login-container:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Ccircle cx='7' cy='7' r='2'/%3E%3Ccircle cx='27' cy='7' r='1'/%3E%3Ccircle cx='47' cy='7' r='1'/%3E%3Ccircle cx='7' cy='27' r='1'/%3E%3Ccircle cx='27' cy='27' r='2'/%3E%3Ccircle cx='47' cy='27' r='1'/%3E%3Ccircle cx='7' cy='47' r='1'/%3E%3Ccircle cx='27' cy='47' r='1'/%3E%3Ccircle cx='47' cy='47' r='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");animation:float 20s ease-in-out infinite;opacity:.3}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}.content-wrapper{width:100%;max-width:480px;position:relative;z-index:1}.login-card{background:#fffffff2;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:var(--radius-2xl);padding:var(--spacing-3xl);text-align:center;box-shadow:var(--shadow-xl);border:1px solid rgba(255,255,255,.2);position:relative;overflow:hidden;animation:slideUp .8s ease-out}@keyframes slideUp{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}.login-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));border-radius:var(--radius-2xl) var(--radius-2xl) 0 0}.logo-section{margin-bottom:var(--spacing-3xl);position:relative}.logo-container{margin-bottom:var(--spacing-xl);position:relative}.logo{width:5rem;height:5rem;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));border-radius:var(--radius-2xl);display:flex;align-items:center;justify-content:center;margin:0 auto;box-shadow:var(--shadow-xl);position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.logo:hover{transform:scale(1.05) rotate(5deg);box-shadow:var(--shadow-xl),0 0 30px #6366f166}.logo-icon{font-size:2.5rem;color:#fff;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.app-title{font-size:2rem;font-weight:800;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:0 0 var(--spacing-md) 0;letter-spacing:-.025em;animation:fadeIn .8s ease-out .2s both}.app-subtitle{font-size:1rem;color:var(--text-secondary);margin:0;line-height:1.6;font-weight:500;animation:fadeIn .8s ease-out .4s both}.login-section{display:flex;flex-direction:column;gap:var(--spacing-xl);animation:fadeIn .8s ease-out .6s both}.kakao-login-button{background:#fee500;color:#000;border:1px solid rgba(0,0,0,.12);padding:0 20px;border-radius:6px;font-size:14px;font-weight:400;font-family:-apple-system,BlinkMacSystemFont,malgun gothic,Apple SD Gothic Neo,Noto Sans KR,sans-serif;cursor:pointer;transition:all .2s ease;width:100%;height:45px;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:none;position:relative;overflow:hidden;letter-spacing:-.3px}.kakao-login-button:before{content:"";position:absolute;inset:0;background:#f5e100;opacity:0;transition:opacity .2s ease}.kakao-login-button:hover{background:#f5e100}.kakao-login-button:hover:before{opacity:1}.kakao-login-button:active{background:#e6cc00;transform:translateY(1px)}.kakao-login-button:disabled{background:#d9d9d9;color:#999;cursor:not-allowed;border-color:#d9d9d9}.kakao-login-button:disabled:before{display:none}.kakao-logo{display:flex;align-items:center;justify-content:center;width:18px;height:17px;position:relative;z-index:1}.kakao-login-button span{position:relative;z-index:1;font-weight:400;letter-spacing:-.3px}.loading-message{display:flex;align-items:center;justify-content:center;gap:var(--spacing-md);padding:var(--spacing-xl);background:linear-gradient(135deg,var(--bg-primary),var(--bg-secondary));border-radius:var(--radius-xl);border:2px solid var(--color-gray-200);color:var(--text-secondary);font-weight:600;animation:pulse 1.5s ease-in-out infinite}.spinner{width:1.25rem;height:1.25rem;border:3px solid var(--color-gray-300);border-top:3px solid var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}.error-message{background:linear-gradient(135deg,#fef2f2,#fee2e2);border:2px solid #fecaca;border-radius:var(--radius-xl);padding:var(--spacing-lg);color:var(--color-error);font-size:.875rem;font-weight:600;line-height:1.5;text-align:center;margin-bottom:var(--spacing-lg);position:relative;animation:shake .5s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.error-message:before{content:"⚠️";display:block;font-size:1.5rem;margin-bottom:var(--spacing-sm)}.agreement-text{font-size:.8rem;color:var(--text-muted);line-height:1.6;text-align:center;padding:var(--spacing-lg);background:var(--color-gray-50);border-radius:var(--radius-lg);border:1px solid var(--color-gray-200);font-weight:500}.agreement-link{color:var(--color-primary);text-decoration:none;font-weight:600;transition:all .2s ease;border-bottom:1px solid transparent}.agreement-link:hover{color:var(--color-primary-hover);border-bottom-color:var(--color-primary-hover);transform:translateY(-1px)}@media (max-width: 640px){.login-container{padding:var(--spacing-md)}.login-card{padding:var(--spacing-2xl)}.logo{width:4rem;height:4rem}.logo-icon{font-size:2rem}.app-title{font-size:1.75rem}.app-subtitle{font-size:.875rem}.kakao-login-button{height:40px;font-size:13px}}@media (max-width: 480px){.login-container{padding:var(--spacing-sm)}.login-card{padding:var(--spacing-xl)}.logo{width:3.5rem;height:3.5rem}.logo-icon{font-size:1.75rem}.app-title{font-size:1.5rem}.kakao-login-button{height:38px;font-size:12px;padding:0 16px}}@media (prefers-reduced-motion: reduce){.login-container:before,.login-card,.logo,.app-title,.app-subtitle,.login-section,.kakao-login-button,.loading-message,.error-message{animation:none!important;transition:none!important}}@media (prefers-color-scheme: dark){.login-card{background:#0f172af2;border-color:#ffffff1a}.agreement-text{background:var(--color-gray-800);border-color:var(--color-gray-700)}}.bottom-navigation{position:fixed;bottom:0;left:0;right:0;background:var(--bg-glass);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-top:1px solid var(--color-slate-200);box-shadow:0 -8px 32px #00000014,0 -1px #ffffff0d;z-index:var(--z-fixed);padding:var(--spacing-3) var(--spacing-4) calc(var(--spacing-3) + env(safe-area-inset-bottom));transform:translateZ(0);will-change:transform;-webkit-transform:translate3d(0,0,0)}.nav-container{display:flex;justify-content:space-around;align-items:center;max-width:500px;margin:0 auto;gap:var(--spacing-1);position:relative;isolation:isolate}.nav-item{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-1);padding:var(--spacing-3) var(--spacing-2-5);border-radius:var(--radius-2xl);cursor:pointer;transition:all var(--transition-smooth);flex:1;max-width:4.5rem;min-height:3.5rem;border:none;outline:none;background:transparent;overflow:hidden;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation;will-change:transform,background-color;transform:translateZ(0)}.nav-item:before{content:"";position:absolute;inset:0;background:var(--bg-gradient-primary);border-radius:inherit;opacity:0;transform:scale(.85);transition:all var(--transition-smooth);z-index:-1}@media (hover: hover) and (pointer: fine){.nav-item:hover{transform:translateY(-1px)}.nav-item:hover:before{opacity:.08;transform:scale(1)}.nav-item:hover .nav-icon{transform:scale(1.05)}}.nav-item:active{transform:scale(.95) translateY(1px);transition:all var(--transition-fast)}.nav-item.active:before{opacity:.12;transform:scale(1);background:var(--bg-gradient-primary)}.nav-item.active:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:calc(100% - var(--spacing-2));height:calc(100% - var(--spacing-2));background:#6366f10d;border-radius:var(--radius-xl);z-index:-1;animation:activeGlow .6s ease-out}@keyframes activeGlow{0%{opacity:0;transform:translate(-50%,-50%) scale(.8)}50%{opacity:.3}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.nav-icon{position:relative;z-index:1;font-size:1.4rem;color:var(--text-tertiary);transition:all var(--transition-smooth);display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 .5px 1px rgba(0,0,0,.05));will-change:transform,color}.nav-svg-icon{width:22px;height:22px;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;shape-rendering:geometricPrecision}@media (hover: hover) and (pointer: fine){.nav-item:hover .nav-icon{color:var(--text-secondary);filter:drop-shadow(0 1px 2px rgba(0,0,0,.1))}}.nav-item.active .nav-icon{color:var(--color-primary-600);filter:drop-shadow(0 2px 8px rgba(99,102,241,.25));transform:scale(1.05);text-shadow:0 0 8px rgba(99,102,241,.2)}.nav-label{position:relative;z-index:1;font-size:.675rem;color:var(--text-muted);font-weight:600;transition:all var(--transition-smooth);text-align:center;line-height:1.2;letter-spacing:.02em;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}@media (hover: hover) and (pointer: fine){.nav-item:hover .nav-label{color:var(--text-tertiary)}}.nav-item.active .nav-label{color:var(--color-primary-600);font-weight:700;text-shadow:0 0 6px rgba(99,102,241,.15)}.nav-item.active .nav-label:after{content:"";position:absolute;bottom:-6px;left:50%;transform:translate(-50%);width:4px;height:4px;background:var(--color-primary-500);border-radius:var(--radius-full);box-shadow:0 0 8px #6366f166;animation:indicatorPulse 2s ease-in-out infinite}@keyframes indicatorPulse{0%,to{opacity:1;transform:translate(-50%) scale(1)}50%{opacity:.7;transform:translate(-50%) scale(1.2)}}.nav-item:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:3px;border-radius:var(--radius-2xl)}.nav-item:focus-visible:before{opacity:.1;transform:scale(1)}@media (prefers-color-scheme: dark){.bottom-navigation{background:var(--bg-glass-dark);border-top-color:var(--color-slate-700);box-shadow:0 -8px 32px #0000004d,0 -1px #ffffff14}.nav-item:before{background:var(--bg-gradient-primary)}.nav-item.active:after{background:#6366f11f}.nav-item.active .nav-icon,.nav-item.active .nav-label{color:var(--color-primary-400)}.nav-item.active .nav-label:after{background:var(--color-primary-400);box-shadow:0 0 8px #6366f199}}@media (max-width: 640px){.bottom-navigation{padding:var(--spacing-2-5) var(--spacing-3) calc(var(--spacing-2-5) + env(safe-area-inset-bottom))}.nav-container{max-width:100%;gap:var(--spacing-0-5)}.nav-item{min-height:3rem;max-width:4rem;padding:var(--spacing-2-5) var(--spacing-1-5);gap:var(--spacing-0-5)}.nav-svg-icon{width:20px;height:20px}.nav-label{font-size:.6rem;letter-spacing:.01em}}@media (max-width: 480px){.nav-container{gap:0;padding:0 var(--spacing-1)}.nav-item{max-width:3.5rem;min-height:2.75rem;padding:var(--spacing-2) var(--spacing-1)}.nav-svg-icon{width:18px;height:18px;stroke-width:2}.nav-label{font-size:.55rem;font-weight:500;letter-spacing:0}.nav-item.active .nav-label:after{width:3px;height:3px;bottom:-4px}}@media (prefers-reduced-motion: reduce){.nav-item,.nav-icon,.nav-label,.nav-item:before,.nav-item:after,.nav-svg-icon{transition:none!important;animation:none!important;transform:none!important}.nav-item.active .nav-label:after{animation:none!important}}@media (prefers-contrast: high){.nav-item{border:1px solid transparent}.nav-item.active{border-color:var(--color-primary-600)}.nav-item:focus-visible{outline-width:3px;outline-offset:2px}}@supports (padding: max(0px)){.bottom-navigation{padding-left:max(var(--spacing-4),env(safe-area-inset-left));padding-right:max(var(--spacing-4),env(safe-area-inset-right))}}@media (hover: none) and (pointer: coarse){.nav-item{min-height:48px}.nav-item:active{transform:scale(.98);background:#6366f10d}}.my-club-card{background-color:#fff;border:none;border-bottom:1px solid #e5e7eb;border-radius:0;padding:.75rem;margin-bottom:0;display:flex;align-items:center;cursor:pointer;transition:all .2s;width:100%;text-align:left;overflow:hidden}.my-club-card:last-child{border-bottom:none}.my-club-card:active{background-color:#f3f4f6;transform:scale(.98)}.my-club-card__info{display:flex;align-items:center;gap:.75rem;width:100%}.my-club-card__avatar{width:3rem;height:3rem;border-radius:50%;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex-shrink:0;overflow:hidden}.my-club-card__image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.my-club-card__details{flex:1;min-width:0}.my-club-card__header{display:flex;align-items:flex-start;gap:.5rem;margin-bottom:.25rem}.my-club-card__name{font-size:.875rem;font-weight:600;color:#111827;margin:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.my-club-card__role-badge{padding:2px 6px;border-radius:12px;font-size:.65rem;font-weight:600;letter-spacing:.025em;border:none;flex-shrink:0}.my-club-card__role-badge--owner{background:#ef4444;color:#fff}.my-club-card__role-badge--member{background:#3b82f6;color:#fff}.my-club-card__description{font-size:.875rem;color:#6b7280;margin:0 0 .25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.my-club-card__meta{display:flex;align-items:center;gap:.5rem;font-size:.75rem;color:#9ca3af;flex-wrap:wrap}.my-club-card__type{color:#6b7280;font-weight:500}.my-club-card__location,.my-club-card__members{color:#9ca3af}.my-club-card__side{display:flex;flex-direction:column;align-items:flex-end;gap:.25rem}.home-container{min-height:100vh;background:var(--bg-secondary);padding-bottom:calc(5rem + env(safe-area-inset-bottom));position:relative;overflow-x:hidden;background-image:radial-gradient(circle at 20% 10%,rgba(99,102,241,.05) 0%,transparent 30%),radial-gradient(circle at 80% 90%,rgba(6,182,212,.03) 0%,transparent 25%),radial-gradient(circle at 40% 40%,rgba(245,158,11,.02) 0%,transparent 20%);background-attachment:fixed}.home-container:before{content:"";position:absolute;top:0;left:0;right:0;height:300px;background:var(--bg-gradient-primary);opacity:.02;z-index:0;mask:linear-gradient(to bottom,rgba(0,0,0,1) 0%,rgba(0,0,0,.5) 50%,rgba(0,0,0,0) 100%);-webkit-mask:linear-gradient(to bottom,rgba(0,0,0,1) 0%,rgba(0,0,0,.5) 50%,rgba(0,0,0,0) 100%)}.home-header{position:sticky;top:0;z-index:var(--z-sticky);background:var(--bg-glass);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-bottom:1px solid var(--color-slate-200);box-shadow:var(--shadow-sm);animation:slideDown .5s ease-out;will-change:transform;transform:translateZ(0)}@keyframes slideDown{0%{transform:translateY(-100%);opacity:0;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}to{transform:translateY(0);opacity:1;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}}.header-content{padding:var(--spacing-4) var(--spacing-4);display:flex;align-items:center;justify-content:space-between;max-width:1280px;margin:0 auto;position:relative;z-index:1;min-height:60px}.header-title{font-size:1.75rem;font-weight:900;color:var(--text-primary);background:var(--bg-gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em;margin:0;text-shadow:0 2px 4px rgba(99,102,241,.1);text-rendering:optimizeLegibility;font-display:swap}.header-actions{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-4);flex-wrap:nowrap;min-width:0}.header-left,.header-right{display:flex;gap:var(--spacing-2);align-items:center;flex:1}.header-left{justify-content:flex-start}.header-right{justify-content:flex-end}.icon-button{position:relative;width:2.75rem;height:2.75rem;padding:0;font-size:1.25rem;background:var(--bg-primary);color:var(--text-tertiary);border:1px solid var(--color-slate-200);border-radius:var(--radius-2xl);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-smooth);box-shadow:var(--shadow-xs);overflow:hidden;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation;will-change:transform,box-shadow;transform:translateZ(0)}.header-icon{width:20px;height:20px;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;shape-rendering:geometricPrecision}.close-icon{width:16px;height:16px;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.icon-button:before{content:"";position:absolute;inset:0;background:var(--bg-gradient-primary);opacity:0;transition:all var(--transition-smooth);border-radius:inherit;transform:scale(.9)}@media (hover: hover) and (pointer: fine){.icon-button:hover{color:var(--color-primary-600);border-color:var(--color-primary-300);transform:translateY(-2px);box-shadow:var(--shadow-md)}.icon-button:hover:before{opacity:.06;transform:scale(1)}}.icon-button:active{transform:scale(.95);transition:all var(--transition-fast);box-shadow:var(--shadow-xs)}.compact-button{padding:var(--spacing-2) var(--spacing-3);border:1px solid var(--color-slate-200);border-radius:var(--radius-lg);background:var(--bg-primary);color:var(--text-secondary);font-size:.8rem;font-weight:600;cursor:pointer;transition:all var(--transition-base);white-space:nowrap;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation}.compact-button:active{background:var(--color-slate-100);transform:scale(.98);transition:all var(--transition-fast)}.compact-button.primary{background:var(--color-primary-500);color:#fff;border-color:var(--color-primary-500);box-shadow:var(--shadow-colored)}@media (hover: hover) and (pointer: fine){.compact-button.primary:hover{background:var(--color-primary-600);border-color:var(--color-primary-600);transform:translateY(-1px);box-shadow:var(--shadow-colored-lg)}}.compact-button.primary:active{background:var(--color-primary-700);transform:scale(.98);transition:all var(--transition-fast)}.icon-button.primary-action{background:var(--color-primary-500);color:#fff;border-color:var(--color-primary-500);box-shadow:var(--shadow-colored);position:relative;overflow:visible}.icon-button.primary-action:before{background:#fff3}@media (hover: hover) and (pointer: fine){.icon-button.primary-action:hover{background:var(--color-primary-600);border-color:var(--color-primary-600);transform:translateY(-2px) scale(1.05);box-shadow:var(--shadow-colored-lg);color:#fff}.icon-button.primary-action:hover:before{opacity:.1}}.icon-button.primary-action:active{background:var(--color-primary-700);transform:scale(.98);box-shadow:var(--shadow-xs)}.icon-button.primary-action{animation:primaryPulse 3s ease-in-out infinite}@keyframes primaryPulse{0%,70%,to{box-shadow:var(--shadow-colored)}35%{box-shadow:var(--shadow-colored-lg)}}@media (prefers-reduced-motion: reduce){.icon-button.primary-action{animation:none}}.action-button{background:none;border:none;padding:var(--spacing-2);border-radius:var(--radius-lg);cursor:pointer;color:var(--text-tertiary);transition:all var(--transition-base);min-height:44px;min-width:44px;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation}@media (hover: hover) and (pointer: fine){.action-button:hover{color:var(--text-secondary);background:var(--color-slate-100)}}.action-button:active{color:var(--text-primary);background:var(--color-slate-200);transform:scale(.98);transition:all var(--transition-fast)}.search-container{position:relative;background:var(--bg-glass);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--color-slate-200);padding:var(--spacing-4);animation:slideIn .5s ease-out;box-shadow:var(--shadow-sm);background-image:linear-gradient(135deg,#6366f105,#06b6d403)}@keyframes slideIn{0%{opacity:0;transform:translateY(-20px);-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}to{opacity:1;transform:translateY(0);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}}.search-input-wrapper{position:relative;display:flex;align-items:center;max-width:640px;margin:0 auto;filter:drop-shadow(0 2px 8px rgba(0,0,0,.04))}.search-close-button{position:absolute;right:var(--spacing-3);background:none;border:none;color:var(--text-tertiary);font-size:1.125rem;cursor:pointer;padding:var(--spacing-2);border-radius:var(--radius-lg);transition:all var(--transition-base);z-index:2;min-height:40px;min-width:40px;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;user-select:none}@media (hover: hover) and (pointer: fine){.search-close-button:hover{color:var(--text-secondary);background:var(--color-slate-100);transform:scale(1.05)}}.search-close-button:active{transform:scale(.95);background:var(--color-slate-200);transition:all var(--transition-fast)}.search-input{width:100%;padding:var(--spacing-4) 3.5rem var(--spacing-4) var(--spacing-4);border:2px solid var(--color-slate-200);border-radius:var(--radius-2xl);font-size:1rem;font-weight:500;background:var(--bg-primary);color:var(--text-primary);transition:all var(--transition-smooth);box-shadow:var(--shadow-xs);font-family:inherit;line-height:1.5;-webkit-appearance:none;-moz-appearance:none;appearance:none}.search-input::-moz-placeholder{color:var(--text-muted);font-weight:400;opacity:.8}.search-input::placeholder{color:var(--text-muted);font-weight:400;opacity:.8}.search-input:focus{outline:none;border-color:var(--color-primary-500);background:var(--bg-primary);box-shadow:0 0 0 4px #6366f11f,var(--shadow-lg);transform:translateY(-2px);filter:drop-shadow(0 4px 12px rgba(99,102,241,.1))}.search-filters{display:flex;gap:var(--spacing-3);margin-top:var(--spacing-4);max-width:640px;margin-left:auto;margin-right:auto;flex-wrap:wrap}.search-select{flex:1;min-width:140px;appearance:none!important;-webkit-appearance:none!important;-moz-appearance:none!important;-ms-expand:none;background:var(--bg-primary);border:2px solid var(--color-slate-200);color:var(--text-primary);font-size:.875rem;font-weight:500;padding:var(--spacing-3) 2.75rem var(--spacing-3) var(--spacing-3);border-radius:var(--radius-xl);line-height:1.4;cursor:pointer;transition:all var(--transition-smooth);box-shadow:var(--shadow-xs);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M6 8l4 4 4-4' stroke='%236366f1' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--spacing-3) center;background-size:1.25rem 1.25rem;font-family:inherit}.search-select::-moz-focus-inner{border:0}.search-select::-ms-expand{display:none}@media (hover: hover) and (pointer: fine){.search-select:hover{border-color:var(--color-primary-300);transform:translateY(-1px);box-shadow:var(--shadow-md)}}.search-select:focus{outline:none;border-color:var(--color-primary-500);box-shadow:0 0 0 4px #6366f11f,var(--shadow-lg);transform:translateY(-1px)}.search-select:disabled{background:var(--color-slate-100);color:var(--text-muted);cursor:not-allowed;opacity:.6;transform:none;box-shadow:none;background-image:none!important;padding-right:var(--spacing-3)}.filter-header{display:flex;align-items:center;justify-content:space-between;padding:0 1rem .75rem;border-bottom:1px solid #e5e7eb}.filter-title{font-size:1rem;font-weight:600;color:#374151;margin:0}.filter-close-button{background:none;border:none;color:#6b7280;font-size:1rem;cursor:pointer;padding:.25rem;border-radius:.25rem;transition:background-color .2s}.filter-close-button:active{background-color:#f3f4f6}.filter-section{padding:.75rem 1rem;border-bottom:1px solid #e5e7eb}.filter-section:last-child{border-bottom:none}.filter-section-title{font-size:.875rem;font-weight:600;color:#374151;margin:0 0 .5rem}.region-scroll{display:flex;gap:.5rem;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.region-scroll::-webkit-scrollbar{display:none}.region-button{padding:.5rem 1rem;border:1px solid #e5e7eb;border-radius:1rem;background-color:#fff;color:#6b7280;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap}.region-button:active{background-color:#f3f4f6;transform:scale(.95)}.region-button.active{background-color:#3b82f6;color:#fff;border-color:#3b82f6}.active-filters{background:var(--bg-glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--color-slate-200);padding:var(--spacing-3) var(--spacing-4);background-image:linear-gradient(135deg,#6366f105,#06b6d403)}.active-filters-content{display:flex;align-items:center;gap:var(--spacing-2);flex-wrap:wrap;max-width:1280px;margin:0 auto}.active-filter-tag{padding:var(--spacing-2) var(--spacing-3);background:var(--color-primary-50);color:var(--color-primary-700);border-radius:var(--radius-full);font-size:.75rem;font-weight:600;white-space:nowrap;border:1px solid var(--color-primary-200);box-shadow:0 1px 2px #6366f11a;animation:fadeIn .3s ease-out}.clear-filters-button{background:none;border:1px solid var(--color-slate-300);color:var(--text-secondary);font-size:.75rem;font-weight:500;cursor:pointer;padding:var(--spacing-2) var(--spacing-3);border-radius:var(--radius-full);transition:all var(--transition-base);white-space:nowrap;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation}@media (hover: hover) and (pointer: fine){.clear-filters-button:hover{background:var(--color-slate-100);border-color:var(--color-slate-400);transform:translateY(-1px)}}.clear-filters-button:active{background:var(--color-slate-200);transform:scale(.98);transition:all var(--transition-fast)}.home-content{padding:0;position:relative;z-index:1;min-height:200px}.infinite-loader{display:flex;align-items:center;justify-content:center;gap:var(--spacing-3);padding:var(--spacing-6);color:var(--text-tertiary);background:var(--bg-primary);margin:var(--spacing-4) var(--spacing-4) var(--spacing-8);border-radius:var(--radius-2xl);box-shadow:var(--shadow-xs);background-image:linear-gradient(135deg,#6366f105,#06b6d403)}.spinner{width:1.25rem;height:1.25rem;border:2.5px solid var(--color-slate-200);border-top-color:var(--color-primary-500);border-right-color:var(--color-secondary-400);border-radius:50%;animation:spin 1s linear infinite;filter:drop-shadow(0 2px 4px rgba(99,102,241,.15))}.clubs-list{position:relative;z-index:1;max-width:1280px;margin:0 auto;padding:0 var(--spacing-4);display:flex;flex-direction:column;gap:var(--spacing-4)}.club-item{background:linear-gradient(145deg,#fff,#fafbfc);border:none;border-radius:16px;padding:0;margin-bottom:8px;display:flex;align-items:stretch;cursor:pointer;transition:all .4s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 4px 20px #00000014,0 1px 3px #0000000d;position:relative;overflow:hidden;animation:fadeIn .6s ease-out;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.club-item:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.4) 20%,rgba(255,255,255,.8) 50%,rgba(255,255,255,.4) 80%,transparent 100%);opacity:0;transition:opacity .3s ease}.club-item:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 20px 40px #6366f126,0 8px 32px #0000001a,0 2px 8px #00000014;border-color:#6366f133}.club-item:hover:before{opacity:1}.club-item:active{transform:translateY(-4px) scale(1.01);transition-duration:.15s}.club-avatar{position:relative;width:60px;height:60px;flex-shrink:0;border-radius:10px;overflow:hidden;margin:8px;background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 8px 32px #0000001f,inset 0 1px #fff3}.club-image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:all .5s cubic-bezier(.25,.46,.45,.94);filter:contrast(1.05) saturate(1.1)}.club-item:hover .club-image{transform:scale(1.08) rotate(1deg);filter:contrast(1.1) saturate(1.2) brightness(1.05)}.club-avatar:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#6366f11a,#a855f70d);opacity:0;transition:opacity .3s ease}.club-item:hover .club-avatar:after{opacity:1}.club-info{position:relative;flex:1;padding:12px 12px 12px 0;display:flex;flex-direction:column;justify-content:center;min-width:0}.club-header{display:flex;align-items:flex-start;gap:12px;margin-bottom:8px}.club-name{font-size:1rem;font-weight:800;color:#1a202c;margin:0;flex:1;line-height:1.3;letter-spacing:-.02em;background:linear-gradient(135deg,#1a202c,#2d3748);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.club-owner-badge{background:linear-gradient(135deg,#ffd89b,#19547b);color:#fff;padding:4px 8px;border-radius:12px;font-size:.65rem;font-weight:700;flex-shrink:0;letter-spacing:.02em;box-shadow:0 2px 8px #ffd89b4d;display:flex;align-items:center;gap:4px;text-shadow:0 1px 2px rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.2)}.club-description{font-size:.8rem;color:#4a5568;margin:0 0 8px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;font-weight:400}.club-meta{display:flex;flex-wrap:wrap;gap:4px;align-items:center}.club-location,.club-members,.club-age-range{display:inline-flex;align-items:center;gap:4px;padding:3px 6px;font-size:.7rem;font-weight:600;border-radius:16px;white-space:nowrap;border:1px solid rgba(255,255,255,.8);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.club-location{background:linear-gradient(135deg,#4caf501a,#8bc34a0d);color:#2e7d32;border-color:#4caf5033}.club-members{background:linear-gradient(135deg,#2196f31a,#03a9f40d);color:#1565c0;border-color:#2196f333}.club-age-range{background:linear-gradient(135deg,#9c27b01a,#e91e630d);color:#7b1fa2;border-color:#9c27b033}.club-item:hover .club-location,.club-item:hover .club-members,.club-item:hover .club-age-range{transform:translateY(-1px);box-shadow:0 4px 12px #00000014}.club-arrow{position:absolute;top:50%;right:20px;transform:translateY(-50%);width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#6366f11a,#a855f70d);border-radius:50%;color:#6366f1;font-size:1.2rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(99,102,241,.1)}.club-item:hover .club-arrow{background:linear-gradient(135deg,#6366f1,#a855f7);color:#fff;transform:translateY(-50%) translate(4px) scale(1.1);box-shadow:0 8px 20px #6366f14d}.loader-text{color:var(--text-tertiary);font-size:.875rem;font-weight:600;animation:textPulse 2s ease-in-out infinite}@keyframes textPulse{0%,to{opacity:1}50%{opacity:.6}}.empty-state{padding:var(--spacing-12) var(--spacing-6);text-align:center;background:var(--bg-primary);border-radius:var(--radius-3xl);margin:var(--spacing-6) var(--spacing-4);max-width:640px;margin-left:auto;margin-right:auto;box-shadow:var(--shadow-lg),inset 0 1px #ffffff1a;border:1px solid var(--color-slate-200);animation:fadeIn .8s ease-out;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:relative;overflow:hidden;background-image:linear-gradient(135deg,#6366f105,#06b6d403,#f59e0b03)}.empty-state:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(99,102,241,.04) 0%,rgba(6,182,212,.02) 30%,transparent 60%);animation:float 8s ease-in-out infinite;opacity:.6}@keyframes float{0%,to{transform:translateY(0) rotate(0);opacity:.6}33%{transform:translateY(-8px) rotate(1deg);opacity:.8}66%{transform:translateY(-12px) rotate(-1deg);opacity:.4}}.empty-icon{font-size:5rem;margin-bottom:var(--spacing-6);position:relative;z-index:1;animation:bounce 3s ease-in-out infinite;filter:drop-shadow(0 4px 12px rgba(99,102,241,.15));text-rendering:optimizeLegibility}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0) scale(1)}10%{transform:translateY(-4px) scale(1.02)}30%{transform:translateY(-12px) scale(1.05)}40%{transform:translateY(-8px) scale(1.03)}60%{transform:translateY(-6px) scale(1.01)}}.empty-title{font-size:1.5rem;font-weight:800;color:var(--text-primary);margin:0 0 var(--spacing-4) 0;letter-spacing:-.02em;position:relative;z-index:1;background:linear-gradient(135deg,var(--text-primary) 0%,var(--text-secondary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.empty-description{font-size:1.125rem;color:var(--text-secondary);margin:0;line-height:1.6;position:relative;z-index:1;text-rendering:optimizeLegibility;font-weight:500}@media (max-width: 1024px){.home-container:before{height:250px}.header-content{max-width:100%;padding:var(--spacing-3) var(--spacing-4)}.clubs-list{padding:0 var(--spacing-3)}}@media (max-width: 768px){.header-content{padding:var(--spacing-3) var(--spacing-3);min-height:56px}.header-title{font-size:1.5rem;font-weight:800}.header-actions{gap:var(--spacing-3)}.header-left,.header-right{gap:var(--spacing-1)}.header-left{max-width:60%}.header-right{max-width:40%;min-width:-moz-fit-content;min-width:fit-content}.icon-button{width:2.5rem;height:2.5rem;font-size:1.125rem}.search-container{padding:var(--spacing-3)}.search-filters{flex-direction:column;gap:var(--spacing-3)}.search-select{min-width:100%}.clubs-list{padding:0 var(--spacing-3);gap:var(--spacing-3)}.infinite-loader{margin:var(--spacing-3) var(--spacing-3) var(--spacing-6);padding:var(--spacing-4)}.empty-state{margin:var(--spacing-4) var(--spacing-3);padding:var(--spacing-10) var(--spacing-4)}.empty-icon{font-size:4rem}.empty-title{font-size:1.25rem}.empty-description{font-size:1rem}}@media (max-width: 640px){.home-container:before{height:200px}.header-content{padding:var(--spacing-2-5) var(--spacing-3);min-height:52px}.header-title{font-size:1.375rem;font-weight:800}.header-actions{gap:var(--spacing-1-5)}.header-left,.header-right{gap:var(--spacing-0-5)}.header-left{max-width:55%}.header-right{max-width:45%;min-width:-moz-fit-content;min-width:fit-content}.icon-button{width:2.25rem;height:2.25rem;font-size:1rem}.header-icon{width:18px;height:18px}.search-container{padding:var(--spacing-3)}.search-input{padding:var(--spacing-3) 3rem var(--spacing-3) var(--spacing-3);font-size:.95rem}.search-close-button{right:var(--spacing-2);padding:var(--spacing-1-5)}.clubs-list{padding:0 var(--spacing-3);gap:var(--spacing-3)}}@media (max-width: 480px){.header-content{padding:var(--spacing-2) var(--spacing-2-5);min-height:48px}.header-title{font-size:1.25rem;font-weight:700}.header-actions{gap:var(--spacing-1-5)}.header-left{gap:var(--spacing-0-5);max-width:50%;overflow:hidden}.header-right{gap:var(--spacing-0-5);max-width:50%;min-width:-moz-fit-content;min-width:fit-content;flex-wrap:nowrap}.header-left .icon-button:nth-child(3){display:none}.header-right .icon-button:nth-child(1){display:none}.icon-button{width:2rem;height:2rem;font-size:.9rem}.header-icon{width:16px;height:16px;stroke-width:2}.search-container{padding:var(--spacing-2-5)}.search-input{padding:var(--spacing-2-5) 2.75rem var(--spacing-2-5) var(--spacing-2-5);font-size:.9rem;border-radius:var(--radius-xl)}.search-close-button{right:var(--spacing-1-5);padding:var(--spacing-1)}.close-icon{width:14px;height:14px}.search-filters{gap:var(--spacing-2-5)}.search-select{padding:var(--spacing-2-5) 2.5rem var(--spacing-2-5) var(--spacing-2-5);font-size:.8rem;border-radius:var(--radius-lg)}.clubs-list{padding:0 var(--spacing-2-5);gap:var(--spacing-2-5)}.infinite-loader{margin:var(--spacing-2-5) var(--spacing-2-5) var(--spacing-5);padding:var(--spacing-3)}.empty-state{margin:var(--spacing-3) var(--spacing-2-5);padding:var(--spacing-8) var(--spacing-3);border-radius:var(--radius-2xl)}.empty-icon{font-size:3.5rem;margin-bottom:var(--spacing-4)}.empty-title{font-size:1.125rem}.empty-description{font-size:.9rem}.active-filters{padding:var(--spacing-2-5) var(--spacing-2-5)}.active-filter-tag,.clear-filters-button{font-size:.7rem;padding:var(--spacing-1-5) var(--spacing-2-5)}}@media (min-width: 1536px){.header-content,.clubs-list,.active-filters-content{max-width:1400px}.clubs-list{gap:var(--spacing-5)}}@media (min-resolution: 192dpi){.header-title,.empty-title{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-button,.search-input,.search-select{box-shadow:var(--shadow-xs),inset 0 1px #ffffff1a}}@media (orientation: landscape) and (max-height: 600px){.home-container:before{height:150px}.header-content{min-height:44px;padding:var(--spacing-2) var(--spacing-3)}.header-title{font-size:1.125rem}.icon-button{width:2rem;height:2rem}.search-container{padding:var(--spacing-2-5)}.empty-state{padding:var(--spacing-6) var(--spacing-4)}.empty-icon{font-size:2.5rem;margin-bottom:var(--spacing-3)}}.feed-container{background-color:#f9fafb;min-height:100vh;padding-bottom:4rem}.feed-header{background-color:#fff;border-bottom:1px solid #e5e7eb;padding:1rem;position:sticky;top:0;z-index:10}.feed-content{padding:1rem}.post-card{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;margin-bottom:1rem;overflow:hidden}.post-header{display:flex;align-items:center;gap:.75rem;padding:1rem}.post-avatar{width:2.5rem;height:2.5rem;border-radius:50%;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}.post-user-info{flex:1}.post-username{font-size:.875rem;font-weight:600;color:#111827;margin:0}.post-location{font-size:.75rem;color:#6b7280;margin:0}.post-time{font-size:.75rem;color:#9ca3af;margin:0}.post-more{background:none;border:none;color:#6b7280;font-size:1.25rem;cursor:pointer;padding:.25rem;border-radius:.25rem;transition:all .2s}.post-more:active{background-color:#f3f4f6}.post-image-container{padding:0 1rem;margin-bottom:.75rem}.post-image{width:100%;height:12rem;background-color:#f3f4f6;border-radius:.5rem;display:flex;align-items:center;justify-content:center;font-size:3rem}.post-actions{padding:0 1rem 1rem}.action-buttons{display:flex;align-items:center;gap:1rem;margin-bottom:.75rem}.action-btn{background:none;border:none;color:#6b7280;font-size:1.25rem;cursor:pointer;padding:.5rem;border-radius:.25rem;transition:all .2s}.action-btn:active{background-color:#f3f4f6;transform:scale(.95)}.action-btn.liked{color:#ef4444}.action-btn.bookmarked{color:#f59e0b}.post-likes{font-size:.875rem;font-weight:600;color:#111827;margin-bottom:.5rem}.post-caption{font-size:.875rem;color:#374151;line-height:1.5;margin-bottom:.5rem}.post-caption .username{font-weight:600;color:#111827;margin-right:.5rem}.post-tags{font-size:.875rem;color:#3b82f6;margin-bottom:.5rem}.post-comments{font-size:.875rem;color:#6b7280;margin-bottom:.5rem;cursor:pointer}.post-timestamp{font-size:.75rem;color:#9ca3af;margin-bottom:.75rem}.comment-input-container{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;border-top:1px solid #f3f4f6}.comment-input{flex:1;border:none;outline:none;font-size:.875rem;padding:.5rem;background-color:#f9fafb;border-radius:.25rem}.comment-input::-moz-placeholder{color:#9ca3af}.comment-input::placeholder{color:#9ca3af}.post-button{background:none;border:none;color:#3b82f6;font-size:.875rem;font-weight:500;cursor:pointer;padding:.5rem;border-radius:.25rem;transition:all .2s}.post-button:disabled{color:#9ca3af;cursor:not-allowed}.post-button:active:not(:disabled){background-color:#f3f4f6}.game-library-container{background-color:#f9fafb;min-height:100vh;padding-bottom:4rem}.game-library-header{background-color:#fff;border-bottom:1px solid #e5e7eb;padding:1rem;position:sticky;top:0;z-index:10}.my-collection-button{background:none;border:none;color:#3b82f6;font-size:1rem;cursor:pointer;padding:.5rem;border-radius:.5rem;transition:all .2s}.my-collection-button:active{background-color:#eff6ff;transform:scale(.95)}.search-input-wrapper{display:flex;gap:.5rem}.search-input{flex:1;padding:.75rem;border:1px solid #e5e7eb;border-radius:.5rem;font-size:.875rem;background-color:#f9fafb}.search-button{background:none;border:none;color:#6b7280;font-size:1.25rem;cursor:pointer;padding:.75rem;border-radius:.5rem;transition:all .2s}.search-button:active{background-color:#f3f4f6;transform:scale(.95)}.category-filter{background-color:#fff;border-bottom:1px solid #e5e7eb;padding:1rem 0;overflow-x:auto}.category-scroll{display:flex;gap:.5rem;padding:0 1rem;min-width:-moz-max-content;min-width:max-content}.category-button{background:none;border:1px solid #e5e7eb;color:#6b7280;font-size:.875rem;font-weight:500;cursor:pointer;padding:.5rem 1rem;border-radius:2rem;transition:all .2s;white-space:nowrap}.category-button:active{transform:scale(.95)}.game-image{width:4rem;height:4rem;border-radius:.5rem;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:2rem;flex-shrink:0;overflow:hidden}.game-thumbnail{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.game-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:#f3f4f6;color:#9ca3af}.game-year{font-size:.75rem;color:#6b7280;margin:0 0 .5rem}.game-players,.game-time{font-size:.75rem;color:#6b7280;background-color:#f3f4f6;padding:.25rem .5rem;border-radius:.25rem}.game-rating{display:flex;align-items:center;gap:.5rem}.rating{font-size:.75rem;color:#f59e0b;font-weight:500}.rank{font-size:.75rem;color:#6b7280;background-color:#f3f4f6;padding:.125rem .375rem;border-radius:.25rem}.load-more{text-align:center;margin-top:1rem}.load-more-button{background-color:#3b82f6;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .2s}.load-more-button:disabled{background-color:#9ca3af;cursor:not-allowed}.load-more-button:active:not(:disabled){background-color:#2563eb}.game-collection-container{background-color:#f9fafb;min-height:100vh;padding-bottom:4rem}.game-collection-header{background-color:#fff;border-bottom:1px solid #e5e7eb;padding:1rem;position:sticky;top:0;z-index:10}.add-button{background:none;border:none;color:#3b82f6;font-size:1.25rem;cursor:pointer;padding:.5rem;border-radius:.5rem;transition:all .2s}.add-button:active{background-color:#eff6ff;transform:scale(.95)}.search-container{padding:1rem;background-color:#fff;border-bottom:1px solid #e5e7eb}.search-input{width:100%;padding:.75rem;border:1px solid #e5e7eb;border-radius:.5rem;font-size:.875rem;background-color:#f9fafb}.collection-tabs{background-color:#fff;border-bottom:1px solid #e5e7eb;display:flex}.games-content{padding:1rem}.games-grid{display:grid;grid-template-columns:1fr;gap:1rem}.game-card{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;overflow:hidden;cursor:pointer;transition:all .2s}.game-card:active{background-color:#f3f4f6;transform:scale(.98)}.game-card{display:flex;padding:1rem;gap:1rem}.game-image{width:4rem;height:4rem;border-radius:.5rem;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:2rem;flex-shrink:0}.game-info{flex:1;min-width:0}.game-description{font-size:.875rem;color:#6b7280;margin:0 0 .5rem;line-height:1.4}.game-meta{display:flex;gap:.5rem;margin-bottom:.5rem}.game-category,.game-players,.game-time{font-size:.75rem;color:#6b7280;background-color:#f3f4f6;padding:.25rem .5rem;border-radius:.25rem}.game-details{display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}.game-difficulty{font-size:.75rem;font-weight:500}.game-rating{font-size:.75rem;color:#6b7280}.game-last-played{font-size:.75rem;color:#9ca3af;font-style:italic}.empty-state{padding:3rem 1rem;text-align:center;background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb}.empty-description{font-size:.875rem;color:#6b7280;margin:0 0 1rem}.empty-button{background-color:#3b82f6;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .2s}.loading-state{padding:3rem 1rem;text-align:center;background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb}.loading-text{font-size:.875rem;color:#6b7280;margin:0}.error-state{padding:3rem 1rem;text-align:center;background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb}.error-title{font-size:1.125rem;font-weight:600;color:#dc2626;margin:0 0 .5rem}.error-message{font-size:.875rem;color:#6b7280;margin:0 0 1rem}.error-button{background-color:#dc2626;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .2s}.error-button:active{background-color:#b91c1c}.create-club-container{background:var(--bg-secondary);min-height:100vh;padding-bottom:calc(4rem + env(safe-area-inset-bottom));position:relative;overflow-x:hidden}.create-club-container:before{content:"";position:absolute;top:0;left:0;right:0;height:300px;background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-secondary) 50%,var(--color-accent) 100%);opacity:.05;z-index:0}.header{position:sticky;top:0;z-index:var(--z-sticky);background:#fffffff2;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--color-gray-200);padding:var(--spacing-lg);display:flex;align-items:center;justify-content:space-between;box-shadow:var(--shadow-sm);animation:slideDown .4s ease-out}.back-button{background:none;border:none;color:var(--text-tertiary);font-size:1rem;cursor:pointer;padding:var(--spacing-sm);border-radius:var(--radius-md);transition:background-color .2s,transform .2s}.back-button:before{display:none}.back-button:hover{background-color:var(--color-gray-100)}.back-button:hover:before{display:none}.back-button:active{transform:scale(.95)}.header-spacer{width:2.5rem}.create-club-form{position:relative;z-index:1;padding:var(--spacing-lg);max-width:800px;margin:0 auto}.form-section{background:var(--bg-primary);border-radius:var(--radius-2xl);box-shadow:var(--shadow-lg);border:1px solid var(--color-gray-200);padding:var(--spacing-2xl);margin-bottom:var(--spacing-xl);position:relative;overflow:hidden;animation:fadeIn .6s ease-out}.form-section:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));border-radius:var(--radius-2xl) var(--radius-2xl) 0 0}.section-title{font-size:1.375rem;font-weight:800;color:var(--text-primary);margin-bottom:var(--spacing-2xl);display:flex;align-items:center;gap:var(--spacing-md);letter-spacing:-.025em}.section-title:before{content:"";width:6px;height:1.375rem;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));border-radius:var(--radius-sm);box-shadow:var(--shadow-sm)}.form-club{margin-bottom:var(--spacing-2xl);position:relative}.form-club:last-child{margin-bottom:0}.form-label{display:block;font-size:.95rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-md);letter-spacing:.025em;text-transform:uppercase}.form-label.required:after{content:" *";color:var(--color-error);font-weight:600}.form-input{width:100%;padding:var(--spacing-lg) var(--spacing-lg);border:2px solid var(--color-gray-200);border-radius:var(--radius-xl);font-size:1rem;font-weight:500;background:var(--bg-secondary);color:var(--text-primary);transition:all .3s cubic-bezier(.4,0,.2,1);box-sizing:border-box;box-shadow:var(--shadow-sm)}.form-input:invalid{border-color:var(--color-error)}.form-input:invalid:focus{box-shadow:0 0 0 4px #ef44441a,var(--shadow-lg)}.character-count{font-size:.8rem;color:var(--text-tertiary);text-align:right;margin-top:var(--spacing-sm);font-weight:600;letter-spacing:.025em}.character-count.near-limit{color:var(--color-warning)}.character-count.at-limit{color:var(--color-error)}.select-wrapper{position:relative;display:inline-block;width:100%}.form-select{width:100%;padding:var(--spacing-lg);padding-right:calc(var(--spacing-lg) * 3);border:2px solid var(--color-gray-200);border-radius:var(--radius-xl);font-size:1rem;font-weight:500;background-color:var(--bg-secondary);color:var(--text-primary);cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-sm);box-sizing:border-box;appearance:none!important;-webkit-appearance:none!important;-moz-appearance:none!important;background-image:none!important}.form-select::-ms-expand{display:none!important}.form-select::-moz-focus-inner{border:0}.form-select::-webkit-inner-spin-button,.form-select::-webkit-outer-spin-button{-webkit-appearance:none!important;appearance:none!important;margin:0}.select-arrow{position:absolute;top:50%;right:var(--spacing-lg);transform:translateY(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid var(--text-muted);pointer-events:none;transition:all .3s ease}.select-wrapper:hover .select-arrow{border-top-color:var(--color-primary)}.select-wrapper:focus-within .select-arrow{border-top-color:var(--color-primary)}.form-select:disabled+.select-arrow{display:none!important;visibility:hidden!important;opacity:0!important}.select-wrapper.disabled .select-arrow{display:none!important;visibility:hidden!important;opacity:0!important}.form-select:hover{border-color:var(--color-primary);background-color:var(--bg-primary);transform:translateY(-1px);box-shadow:var(--shadow-md)}.form-select:focus{outline:none;border-color:var(--color-primary);background-color:var(--bg-primary);box-shadow:0 0 0 4px #6366f11a,var(--shadow-lg);transform:translateY(-1px)}.form-select:invalid{color:var(--text-muted);font-style:italic}.form-select option{color:var(--text-primary);background:var(--bg-primary);font-weight:500;padding:var(--spacing-md);font-style:normal}.form-select option:first-child{color:var(--text-muted);font-style:italic}.age-toggle{margin-top:var(--spacing-md)}.age-toggle-row{display:inline-flex;align-items:center;gap:var(--spacing-md);color:var(--text-primary);font-size:1rem;font-weight:600;-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:pointer;padding:var(--spacing-lg);border-radius:var(--radius-xl);background:var(--bg-secondary);border:2px solid var(--color-gray-200);transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-sm)}.age-toggle-row:hover{background:var(--bg-primary);border-color:var(--color-primary);transform:translateY(-1px);box-shadow:var(--shadow-md)}.age-toggle-text{cursor:pointer;font-weight:600;letter-spacing:.025em}.age-toggle-row input[type=checkbox]{width:20px;height:20px;cursor:pointer;accent-color:var(--color-primary);border-radius:var(--radius-sm);border:2px solid var(--color-gray-300);transition:all .2s ease}.age-toggle-row input[type=checkbox]:checked{background:var(--color-primary);border-color:var(--color-primary)}.form-actions{display:flex;gap:var(--spacing-lg);padding:var(--spacing-2xl);background:#fffffff2;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--color-gray-200);position:sticky;bottom:0;z-index:var(--z-sticky);box-shadow:0 -10px 25px -5px #0000001a,0 -4px 6px -4px #0000000d;margin:0 calc(-1 * var(--spacing-lg));animation:slideUp .4s ease-out}.form-actions .action-button{flex:1;padding:var(--spacing-xl) var(--spacing-2xl);border-radius:var(--radius-2xl);font-size:1.125rem;font-weight:700;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);border:none;display:flex;align-items:center;justify-content:center;gap:var(--spacing-md);letter-spacing:.025em;text-transform:uppercase;position:relative;overflow:hidden;min-height:3.5rem}.form-actions .action-button:before{content:"";position:absolute;inset:0;background:inherit;opacity:0;transition:opacity .3s ease}.form-actions .secondary-button{background:linear-gradient(135deg,var(--bg-primary) 0%,var(--color-gray-100) 100%);color:var(--text-secondary);border:2px solid var(--color-gray-200);box-shadow:var(--shadow-sm)}.form-actions .secondary-button:hover{background:linear-gradient(135deg,var(--color-gray-50) 0%,var(--color-gray-200) 100%);color:var(--text-primary);border-color:var(--color-gray-300);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.form-actions .secondary-button:active{background:linear-gradient(135deg,var(--color-gray-200) 0%,var(--color-gray-300) 100%);transform:translateY(0) scale(.98);box-shadow:var(--shadow-md)}.form-actions .primary-button{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-secondary) 100%);color:#fff;border:2px solid transparent;box-shadow:0 8px 25px #6366f166,var(--shadow-lg);position:relative;overflow:hidden}.form-actions .primary-button:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--color-primary-hover),var(--color-secondary-hover));opacity:0;transition:opacity .3s ease}.form-actions .primary-button:hover{transform:translateY(-3px);box-shadow:0 12px 35px #6366f199,var(--shadow-xl)}.form-actions .primary-button:hover:after{opacity:1}.form-actions .primary-button:active{transform:translateY(-1px) scale(.98);box-shadow:0 6px 20px #6366f166,var(--shadow-lg)}.form-actions .primary-button:disabled{background:linear-gradient(135deg,var(--color-gray-400) 0%,var(--color-gray-500) 100%);box-shadow:var(--shadow-sm);transform:none;cursor:not-allowed;opacity:.6}.form-actions .primary-button:disabled:after{display:none}.error-message{color:#ef4444;font-size:.75rem;margin-top:.25rem;display:flex;align-items:center;gap:.25rem}.error-message:before{content:"⚠";font-size:.875rem}.success-message{color:#10b981;font-size:.75rem;margin-top:.25rem;display:flex;align-items:center;gap:.25rem}.success-message:before{content:"✓";font-size:.875rem}@media (max-width: 768px){.header{padding:var(--spacing-md)}.header-title{font-size:1.25rem}.create-club-form{padding:var(--spacing-md)}.form-section{padding:var(--spacing-xl);margin-bottom:var(--spacing-lg)}.section-title{font-size:1.25rem}.region-selectors{grid-template-columns:1fr;gap:var(--spacing-md)}.select-wrapper{width:100%}.age-range-container{grid-template-columns:1fr;gap:var(--spacing-lg);text-align:center}.age-separator{transform:rotate(90deg);margin:0 auto}.form-actions{padding:var(--spacing-lg);gap:var(--spacing-md);margin:0 calc(-1 * var(--spacing-md))}.form-actions .action-button{padding:var(--spacing-lg);font-size:.875rem;min-height:3rem}}@media (max-width: 480px){.header{padding:var(--spacing-sm)}.header-title{font-size:1.125rem}.back-button{padding:var(--spacing-sm) var(--spacing-md);font-size:1rem}.create-club-form{padding:var(--spacing-sm)}.form-section{padding:var(--spacing-lg)}.section-title{font-size:1.125rem}.form-actions{flex-direction:column;padding:var(--spacing-md);margin:0 calc(-1 * var(--spacing-sm))}.form-actions .action-button{padding:var(--spacing-md);font-size:.8rem;min-height:2.75rem}}@media (prefers-reduced-motion: reduce){.create-club-container:before,.form-section,.header,.form-actions,.back-button,.action-button,.form-input,.form-textarea,.form-select,.age-toggle-row{animation:none!important;transition:none!important}}@media (prefers-color-scheme: dark){.header{background:#0f172af2;border-bottom-color:var(--color-gray-700)}.form-actions{background:#0f172af2;border-top-color:var(--color-gray-700)}}@media (max-width: 480px){.header{padding:.75rem}.header-title{font-size:1.125rem}.back-button{font-size:1.125rem;padding:.375rem}.section-title{font-size:1rem}.form-input,.form-textarea,.form-select{padding:.625rem;font-size:.8rem}}.club-join-button{padding:.75rem 1.5rem;border-radius:.5rem;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:1px solid;min-width:100px}.club-join-button:disabled{cursor:not-allowed;opacity:.6}.club-join-button.apply{background-color:#3b82f6;color:#fff;border-color:#3b82f6}.club-join-button.apply:hover:not(:disabled){background-color:#2563eb;border-color:#2563eb}.club-join-button.apply:active{background-color:#1d4ed8}.club-join-button.pending{background-color:#f59e0b;color:#fff;border-color:#f59e0b}.club-join-button.pending:hover:not(:disabled){background-color:#d97706;border-color:#d97706}.club-join-button.rejected{background-color:#ef4444;color:#fff;border-color:#ef4444}.club-join-button.rejected:hover:not(:disabled){background-color:#dc2626;border-color:#dc2626}.club-join-button.member,.club-join-button.owner{background-color:#10b981;color:#fff;border-color:#10b981}.club-join-button.owner{background-color:#8b5cf6;border-color:#8b5cf6}.modal-overlay{position:fixed!important;inset:0!important;background-color:#000000b3;display:flex!important;align-items:center!important;justify-content:center!important;z-index:10000!important;padding:2rem;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);margin:0!important;transform:none!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch}.modal-content{background-color:#fff;border-radius:1rem;box-shadow:0 25px 50px -12px #00000040;max-width:600px;width:100%;max-height:80vh;min-height:400px;overflow:hidden;display:flex;flex-direction:column;position:relative!important;margin:auto!important;transform:none!important;animation:modalSlideIn .3s ease-out}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-50px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{padding:2rem 2rem 1rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e5e7eb;background:linear-gradient(135deg,#f8fafc,#f1f5f9)}.modal-header h3{font-size:1.5rem;font-weight:700;color:#111827;margin:0;display:flex;align-items:center;gap:.5rem}.modal-header h3:before{content:"📝";font-size:1.25rem}.modal-close{background:none;border:none;font-size:1.5rem;color:#6b7280;cursor:pointer;padding:.25rem;border-radius:.25rem;transition:color .2s ease}.modal-close:hover{color:#374151}.modal-body{padding:2rem;flex:1;overflow-y:auto;font-size:1rem}.club-name{font-size:1.125rem;font-weight:600;color:#1f2937;margin-bottom:2rem;padding:1.25rem;background:linear-gradient(135deg,#dbeafe,#bfdbfe);border-radius:.75rem;border-left:5px solid #3b82f6;box-shadow:0 2px 4px #3b82f61a}.form-group{margin-bottom:1rem}.form-group label{display:block;font-size:1rem;font-weight:600;color:#374151;margin-bottom:.75rem}.message-textarea{width:100%;min-height:140px;padding:1rem;border:2px solid #e5e7eb;border-radius:.75rem;font-size:1rem;line-height:1.6;resize:vertical;transition:all .2s ease;font-family:inherit;background-color:#fafafa}.message-textarea:focus{outline:none;border-color:#3b82f6;background-color:#fff;box-shadow:0 0 0 4px #3b82f626;transform:translateY(-1px)}.character-count{text-align:right;font-size:.75rem;color:#6b7280;margin-top:.25rem}.modal-footer{padding:1.5rem 2rem 2rem;border-top:1px solid #e5e7eb;display:flex;gap:1rem;justify-content:flex-end;background:linear-gradient(135deg,#f9fafb,#f3f4f6);margin-top:auto}.cancel-button,.submit-button{padding:1rem 2rem;border-radius:.75rem;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:2px solid;min-width:120px;box-shadow:0 2px 8px #00000026}.cancel-button{background-color:#fff;color:#374151;border-color:#d1d5db}.cancel-button:hover:not(:disabled){background-color:#f9fafb;border-color:#9ca3af}.submit-button{background-color:#3b82f6;color:#fff;border-color:#3b82f6;position:relative;overflow:hidden}.submit-button: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}.submit-button:hover:not(:disabled){background-color:#2563eb;border-color:#2563eb;box-shadow:0 2px 8px #3b82f64d}.submit-button:hover:not(:disabled):before{left:100%}.cancel-button:disabled,.submit-button:disabled{opacity:.5;cursor:not-allowed}@media (max-width: 640px){.modal-overlay{padding:1rem!important;align-items:center!important}.modal-content{max-height:85vh;margin-top:0!important;max-width:none;width:calc(100% - 2rem);min-height:500px}.modal-header{padding:1.5rem 1.5rem 1rem}.modal-header h3{font-size:1.25rem}.modal-body{padding:1.5rem}.modal-footer{padding:1rem 1.5rem 1.5rem;flex-direction:column-reverse;gap:.75rem}.cancel-button,.submit-button{width:100%;padding:1.25rem;font-size:1.125rem}}@media (max-height: 600px){.modal-overlay{align-items:flex-start!important;padding-top:1rem!important}.modal-content{max-height:95vh}}.club-applications{background-color:#fff;border-radius:.75rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;overflow:hidden;margin-bottom:1.5rem}.applications-header{padding:1.5rem 1.5rem 1rem;border-bottom:1px solid #e5e7eb;display:flex;align-items:center;justify-content:space-between}.applications-header h3{font-size:1.125rem;font-weight:600;color:#111827;margin:0}.refresh-button{background:none;border:none;padding:.5rem;border-radius:.25rem;cursor:pointer;font-size:1rem;color:#6b7280;transition:color .2s ease}.refresh-button:hover{color:#374151}.applications-loading,.applications-error{text-align:center;padding:3rem 1rem;color:#6b7280}.applications-section{padding:1rem 1.5rem;border-bottom:1px solid #e5e7eb}.applications-section:last-child{border-bottom:none}.section-title{font-size:1rem;font-weight:600;color:#374151;margin:0 0 1rem}.applications-list{display:flex;flex-direction:column;gap:1rem}.application-card{border:1px solid #e5e7eb;border-radius:.5rem;padding:1rem;transition:all .2s ease}.application-card.pending{border-color:#f59e0b;background-color:#fffbeb}.application-card.approved{border-color:#10b981;background-color:#ecfdf5}.application-card.rejected{border-color:#ef4444;background-color:#fef2f2}.application-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:.75rem}.user-info{display:flex;align-items:center;gap:.75rem;flex:1}.user-avatar{width:2.5rem;height:2.5rem;border-radius:50%;overflow:hidden;flex-shrink:0}.avatar-image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.avatar-placeholder{width:100%;height:100%;background-color:#e5e7eb;display:flex;align-items:center;justify-content:center;font-weight:600;color:#6b7280;text-transform:uppercase}.user-name{font-size:.875rem;font-weight:600;color:#111827;margin-bottom:.25rem}.applied-time{font-size:.75rem;color:#6b7280}.status-badge{padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:500}.status-badge.pending{background-color:#fbbf24;color:#92400e}.status-badge.approved{background-color:#34d399;color:#065f46}.status-badge.rejected{background-color:#f87171;color:#991b1b}.application-message{margin-bottom:1rem;padding:.75rem;background-color:#f9fafb;border-radius:.375rem;border-left:3px solid #3b82f6}.application-message p{font-size:.875rem;color:#374151;line-height:1.5;margin:0;font-style:italic}.application-actions{display:flex;gap:.75rem;justify-content:flex-end}.approve-button,.reject-button{padding:.5rem 1rem;border-radius:.375rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;border:1px solid}.approve-button{background-color:#10b981;color:#fff;border-color:#10b981}.approve-button:hover:not(:disabled){background-color:#059669;border-color:#059669}.reject-button{background-color:#ef4444;color:#fff;border-color:#ef4444}.reject-button:hover:not(:disabled){background-color:#dc2626;border-color:#dc2626}.approve-button:disabled,.reject-button:disabled{opacity:.5;cursor:not-allowed}.no-applications{text-align:center;padding:3rem 1rem;color:#6b7280}.no-applications h4{font-size:1.125rem;font-weight:600;color:#111827;margin:0 0 .5rem}.no-applications p{font-size:.875rem;margin:0}@media (max-width: 640px){.applications-header,.applications-section{padding-left:1rem;padding-right:1rem}.application-card{padding:.75rem}.application-header{flex-direction:column;align-items:flex-start;gap:.75rem}.status-badge{align-self:flex-start}.application-actions{width:100%;justify-content:stretch}.approve-button,.reject-button{flex:1}}.follow-button{display:flex;align-items:center;justify-content:center;gap:.5rem;border:none;border-radius:.5rem;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap;position:relative;overflow:hidden}.follow-button:disabled{cursor:not-allowed;opacity:.6}.follow-button.small{padding:.375rem .75rem;font-size:.75rem;min-width:4rem}.follow-button.medium{padding:.5rem 1rem;font-size:.875rem;min-width:5rem}.follow-button.large{padding:.75rem 1.5rem;font-size:1rem;min-width:6rem}.follow-button.primary{background-color:#3b82f6;color:#fff}.follow-button.primary:hover:not(:disabled){background-color:#2563eb}.follow-button.primary.following{background-color:#6b7280}.follow-button.primary.following:hover:not(:disabled){background-color:#ef4444}.follow-button.primary.following:hover:not(:disabled) span:after{content:" 취소"}.follow-button.primary.match{background-color:#10b981}.follow-button.primary.match:hover:not(:disabled){background-color:#059669}.follow-button.secondary{background-color:#f3f4f6;color:#374151;border:1px solid #d1d5db}.follow-button.secondary:hover:not(:disabled){background-color:#e5e7eb}.follow-button.secondary.following{background-color:#ddd6fe;color:#7c3aed;border-color:#c4b5fd}.follow-button.secondary.match{background-color:#d1fae5;color:#059669;border-color:#a7f3d0}.follow-button.outline{background-color:transparent;color:#3b82f6;border:2px solid #3b82f6}.follow-button.outline:hover:not(:disabled){background-color:#3b82f6;color:#fff}.follow-button.outline.following{color:#6b7280;border-color:#6b7280}.follow-button.outline.following:hover:not(:disabled){background-color:#ef4444;border-color:#ef4444;color:#fff}.follow-button.outline.match{color:#10b981;border-color:#10b981}.follow-button.outline.match:hover:not(:disabled){background-color:#10b981;color:#fff}.follow-button.loading{pointer-events:none}@media (max-width: 640px){.follow-button.large{padding:.625rem 1.25rem;font-size:.875rem;min-width:5rem}.follow-button.medium{padding:.5rem .875rem;font-size:.8125rem;min-width:4.5rem}.follow-button.small{padding:.375rem .625rem;font-size:.75rem;min-width:3.5rem}}.club-detail-container{background-color:#f9fafb;min-height:100vh;padding-bottom:4rem}.club-detail-header{background-color:#ffffffe6;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid #e5e7eb;padding:.75rem 1rem;position:sticky;top:0;z-index:10;box-shadow:0 2px 8px #0000000a}.club-detail-tabs{background-color:#fff;border-bottom:1px solid #e5e7eb;display:flex}.tab-button{flex:1;padding:.875rem 1rem;background:none;border:none;color:#64748b;font-size:.9375rem;font-weight:600;letter-spacing:.015em;cursor:pointer;transition:color .2s ease,border-bottom-color .2s ease;border-bottom:3px solid transparent}.tab-button.active{color:#0ea5e9;border-bottom-color:#0ea5e9}.club-detail-content{padding:1rem;max-width:960px;margin:0 auto}.cover-image{width:100%;aspect-ratio:16 / 9;height:auto;-o-object-fit:cover;object-fit:cover;border-radius:1rem;border:1px solid #e5e7eb;box-shadow:0 8px 24px #0000000f;margin-bottom:1rem}.club-info-card{background:linear-gradient(180deg,#fff,#fafafa);border-radius:1rem;box-shadow:0 2px 10px #0000000f,0 1px 2px #0000000a;border:1px solid #e5e7eb;margin-bottom:1rem;overflow:hidden}.club-info-header{padding:1.25rem;border-bottom:1px solid #f3f4f6}.owner-info{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}.owner-avatar{width:3rem;height:3rem;border-radius:50%;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:1.25rem;flex-shrink:0;border:2px solid #fff;box-shadow:0 2px 8px #0000000f}.owner-details{flex:1}.owner-follow{margin-left:auto}.owner-name{font-size:.875rem;font-weight:600;color:#111827;margin:0}.owner-role{font-size:.75rem;color:#6b7280;margin:0}.club-details{margin-bottom:1rem}.club-name{font-size:1.375rem;font-weight:700;color:#0f172a;margin:0 0 .5rem;letter-spacing:-.01em}.club-description{font-size:.9375rem;color:#475569;line-height:1.6;margin:0 0 .75rem}.club-tags{display:flex;flex-wrap:wrap;gap:.5rem}.club-tag{background-color:#eff6ff;color:#1e40af;padding:.25rem .5rem;border-radius:.25rem;font-size:.75rem;font-weight:500}.club-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;padding:1rem;border-top:1px solid #f3f4f6;background:#fafafa;align-items:stretch}.stat-item{flex:1;text-align:center;background:#fff;border:1px solid #e5e7eb;border-radius:.75rem;padding:.75rem .5rem;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:6px;min-height:88px}.stat-value{font-size:1.125rem;font-weight:700;color:#0f172a;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.location-value{display:flex;flex-direction:column;align-items:center;gap:2px;white-space:normal}.location-value .province-text,.location-value .city-text{max-width:100%;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.location-value .province-text{font-size:.9375rem}.location-value .city-text{font-size:.875rem;color:#475569}.stat-label{font-size:.75rem;color:#6b7280;margin:.25rem 0 0;letter-spacing:.02em}.members-section{background-color:#fff;border-radius:1rem;box-shadow:0 2px 10px #0000000f,0 1px 2px #0000000a;border:1px solid #e5e7eb;margin-bottom:1rem;overflow:hidden}.members-header{padding:1rem 1.25rem;border-bottom:1px solid #f3f4f6}.members-title{font-size:1.0625rem;font-weight:700;color:#0f172a;margin:0}.members-list{padding:.5rem .75rem 1rem}.member-item{display:flex;align-items:center;gap:.75rem;padding:.75rem .5rem;border-bottom:1px solid #f3f4f6;border-radius:.75rem;transition:all .2s ease;cursor:pointer}.member-item:hover{background:#f8fafc}.member-item:last-child{border-bottom:none}.member-item.role-owner{background:linear-gradient(90deg,#fef3c7,#fefce8);border-left:3px solid #f59e0b}.member-item.role-owner:hover{background:linear-gradient(90deg,#fde68a,#fef3c7)}.member-item.role-leader{background:linear-gradient(90deg,#ede9fe,#f3f4f6);border-left:3px solid #8b5cf6}.member-item.role-leader:hover{background:linear-gradient(90deg,#ddd6fe,#ede9fe)}.member-item.role-member:hover{background:#f8fafc}.member-avatar{width:2.5rem;height:2.5rem;border-radius:50%;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;border:2px solid #fff;box-shadow:0 2px 8px #0000000f;position:relative}.default-avatar{font-size:1.25rem}.role-badge{position:absolute;bottom:-2px;right:-2px;width:1rem;height:1rem;border-radius:50%;font-size:.6rem;display:flex;align-items:center;justify-content:center;border:1px solid #fff;box-shadow:0 1px 3px #0003}.role-badge.role-owner{background-color:#f59e0b}.role-badge.role-leader{background-color:#8b5cf6}.role-badge.role-member{background-color:#6b7280;display:none}.member-info{flex:1}.member-name-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}.member-role-tag{font-size:.6875rem;font-weight:600;padding:.125rem .375rem;border-radius:.25rem;line-height:1}.member-role-tag.role-owner{background-color:#fef3c7;color:#d97706;border:1px solid #fde68a}.member-role-tag.role-leader{background-color:#ede9fe;color:#7c3aed;border:1px solid #ddd6fe}.member-role-tag.role-member{background-color:#f3f4f6;color:#6b7280;border:1px solid #e5e7eb}.bottom-actions{position:fixed;bottom:0;left:0;right:0;background-color:#ffffffe6;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid #e5e7eb;padding:.875rem 1rem;display:flex;align-items:center;gap:.75rem;box-shadow:0 -4px 12px #0000000a}.action-buttons{display:flex;align-items:center;gap:.75rem;flex:1}.like-button{flex:1;background-color:#fff;color:#6b7280;border:1px solid #e5e7eb;padding:.875rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:.5rem}.like-button:active{background-color:#f3f4f6}.like-button.liked{background-color:#fef2f2;color:#ef4444;border-color:#ef4444}.join-button{flex:2;background-color:#3b82f6;color:#fff;border:none;padding:.875rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .2s}.join-button:active{background-color:#2563eb}.join-button.joined{background-color:#10b981}.join-button.joined:active{background-color:#059669}.empty-state h3{font-size:1.125rem;font-weight:600;margin-bottom:.5rem;color:#111827}.empty-state p{font-size:.875rem;margin:0}.home-tab,.board-tab,.photos-tab,.chat-tab{min-height:400px}.loading-spinner,.error-icon{font-size:3rem;margin-bottom:1rem}.age-info{margin-top:.5rem}.age-tag{background-color:#eff6ff;color:#1d4ed8;padding:.25rem .625rem;border-radius:9999px;font-size:.75rem;font-weight:600}.avatar-image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:50%}.member-introduction{font-size:.75rem;color:#9ca3af;margin-top:.25rem;line-height:1.4}.member-actions{display:flex;flex-direction:column;align-items:flex-end;gap:.5rem}.member-join-date{font-size:.75rem;color:#9ca3af;text-align:right;white-space:nowrap}.join-button:disabled{background-color:#9ca3af;cursor:not-allowed}.join-button:disabled:active{background-color:#9ca3af}.edit-button{background-color:#f3f4f6;border:1px solid #d1d5db;color:#374151;padding:.5rem;border-radius:.375rem;font-size:1rem;cursor:pointer;transition:all .2s}.edit-button:hover{background-color:#e5e7eb}.edit-button:active{background-color:#d1d5db;transform:scale(.95)}.club-name-section{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.edit-club-button{background-color:#3b82f6;color:#fff;border:none;padding:.5rem 1rem;border-radius:.375rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .2s}.edit-club-button:hover{background-color:#2563eb}.edit-club-button:active{background-color:#1d4ed8}.user-role-badge{display:inline-block;padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:600;margin-bottom:.5rem}.owner-badge{background-color:#fef3c7;color:#d97706}.leader-badge{background-color:#dbeafe;color:#2563eb}.auto-approval-info{margin-top:.75rem;padding:.75rem;background-color:#f8fafc;border-radius:.5rem;border:1px solid #e2e8f0}.auto-approval-status{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.auto-approval-badge{display:inline-flex;align-items:center;gap:.25rem;padding:.375rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:600}.auto-approval-badge.enabled{background-color:#dcfce7;color:#16a34a}.auto-approval-badge.disabled{background-color:#fef3c7;color:#d97706}.auto-approval-toggle{background-color:#3b82f6;color:#fff;border:none;padding:.375rem .75rem;border-radius:.375rem;font-size:.75rem;font-weight:500;cursor:pointer;transition:all .2s}.auto-approval-toggle:hover{background-color:#2563eb}.auto-approval-toggle:active{background-color:#1d4ed8;transform:scale(.95)}.auto-approval-description{font-size:.75rem;color:#64748b;margin-top:.25rem}.leave-button{background-color:#ef4444;color:#fff;border:none;padding:.75rem 1rem;border-radius:.5rem;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease;min-width:4rem}.leave-button:hover{background-color:#dc2626}.leave-button:active{background-color:#b91c1c;transform:scale(.95)}.club-edit-container{background:var(--bg-secondary);min-height:100vh;padding-bottom:calc(4rem + env(safe-area-inset-bottom));position:relative;overflow-x:hidden}.club-edit-container:before{content:"";position:absolute;top:0;left:0;right:0;height:300px;background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-secondary) 50%,var(--color-accent) 100%);opacity:.05;z-index:0}.edit-header{position:sticky;top:0;z-index:var(--z-sticky);background:#fffffff2;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--color-gray-200);box-shadow:var(--shadow-sm);animation:slideDown .4s ease-out}.header-content{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-lg);max-width:1200px;margin:0 auto}.back-button{position:relative;background:var(--bg-primary);border:1px solid var(--color-gray-200);color:var(--text-tertiary);font-size:1.125rem;font-weight:600;cursor:pointer;padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-xl);transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;gap:var(--spacing-sm);box-shadow:var(--shadow-sm);overflow:hidden}.back-button:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));opacity:0;transition:opacity .3s ease}.back-button:hover{color:var(--color-primary);border-color:var(--color-primary);transform:translateY(-1px);box-shadow:var(--shadow-md)}.back-button:hover:before{opacity:.1}.back-button:active{transform:translateY(0) scale(.95);box-shadow:var(--shadow-sm)}.header-title{font-size:1.5rem;font-weight:800;color:var(--text-primary);background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.025em;margin:0;position:relative;z-index:1}.save-button{position:relative;background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-secondary) 100%);color:#fff;border:2px solid transparent;font-size:1rem;font-weight:700;cursor:pointer;padding:var(--spacing-md) var(--spacing-xl);border-radius:var(--radius-xl);transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;gap:var(--spacing-sm);box-shadow:0 4px 15px #6366f166,var(--shadow-sm);overflow:hidden;letter-spacing:.025em;text-transform:uppercase}.save-button:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--color-primary-hover),var(--color-secondary-hover));opacity:0;transition:opacity .3s ease}.save-button:hover{transform:translateY(-2px);box-shadow:0 8px 25px #6366f199,var(--shadow-lg)}.save-button:hover:after{opacity:1}.save-button:active{transform:translateY(0) scale(.95);box-shadow:0 4px 15px #6366f166,var(--shadow-sm)}.save-button:disabled{background:linear-gradient(135deg,var(--color-gray-400) 0%,var(--color-gray-500) 100%);box-shadow:var(--shadow-sm);transform:none;cursor:not-allowed;opacity:.6}.save-button:disabled:after{display:none}.edit-content{position:relative;z-index:1;padding:var(--spacing-lg);max-width:800px;margin:0 auto}.edit-form{background:var(--bg-primary);border-radius:var(--radius-2xl);box-shadow:var(--shadow-lg);border:1px solid var(--color-gray-200);padding:var(--spacing-2xl);position:relative;overflow:hidden;animation:fadeIn .6s ease-out}.edit-form:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));border-radius:var(--radius-2xl) var(--radius-2xl) 0 0}.form-section{margin-bottom:var(--spacing-2xl);position:relative}.form-section:last-child{margin-bottom:0}.form-label{display:block;font-size:.8rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-md);letter-spacing:.025em;text-transform:uppercase}.form-input{width:100%;padding:var(--spacing-lg);border:2px solid var(--color-gray-200);border-radius:var(--radius-xl);font-size:1rem;font-weight:500;background:var(--bg-secondary);color:var(--text-primary);transition:all .3s cubic-bezier(.4,0,.2,1);box-sizing:border-box;box-shadow:var(--shadow-sm)}.form-input::-moz-placeholder{color:var(--text-muted);font-weight:400}.form-input::placeholder{color:var(--text-muted);font-weight:400}.form-input:hover{border-color:var(--color-primary);background:var(--bg-primary)}.form-input:focus{outline:none;border-color:var(--color-primary);background:var(--bg-primary);box-shadow:0 0 0 4px #6366f11a,var(--shadow-lg);transform:translateY(-1px)}.form-textarea{width:100%;padding:var(--spacing-lg);border:2px solid var(--color-gray-200);border-radius:var(--radius-xl);font-size:1rem;font-weight:500;background:var(--bg-secondary);color:var(--text-primary);transition:all .3s cubic-bezier(.4,0,.2,1);resize:vertical;min-height:8rem;font-family:inherit;box-sizing:border-box;box-shadow:var(--shadow-sm);line-height:1.6}.form-textarea::-moz-placeholder{color:var(--text-muted);font-weight:400}.form-textarea::placeholder{color:var(--text-muted);font-weight:400}.form-textarea:hover{border-color:var(--color-primary);background:var(--bg-primary)}.form-textarea:focus{outline:none;border-color:var(--color-primary);background:var(--bg-primary);box-shadow:0 0 0 4px #6366f11a,var(--shadow-lg);transform:translateY(-1px)}.char-count{font-size:.8rem;color:var(--text-tertiary);text-align:right;margin-top:var(--spacing-sm);font-weight:600;letter-spacing:.025em}.image-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-top:.5rem}.image-option{width:100%;aspect-ratio:1;border:2px solid #e5e7eb;border-radius:.5rem;background-color:#fff;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:0}.image-option:hover{border-color:#3b82f6}.image-option.selected{border-color:#3b82f6;background-color:#eff6ff}.image-option:active{transform:scale(.95)}.preview-image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:.25rem}.region-selectors{display:flex;gap:.5rem;margin-top:.5rem}.form-select{flex:1;padding:.75rem;border:1px solid #e5e7eb;border-radius:.5rem;font-size:.875rem;background-color:#fff;transition:border-color .2s}.form-select:focus{outline:none;border-color:#3b82f6}.age-range-container{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:var(--spacing-lg);margin-top:var(--spacing-xl);padding:var(--spacing-2xl);background:linear-gradient(135deg,var(--bg-primary),var(--bg-secondary));border-radius:var(--radius-xl);border:2px solid var(--color-gray-200);box-shadow:var(--shadow-md);position:relative;overflow:hidden}.age-range-container:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));border-radius:var(--radius-xl) var(--radius-xl) 0 0}.age-input-club{display:flex;flex-direction:column;gap:var(--spacing-md)}.age-label{font-size:.8rem;color:var(--text-tertiary);font-weight:700;text-transform:uppercase;letter-spacing:.1em}.age-separator{font-size:1.5rem;color:var(--text-tertiary);font-weight:300;display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;background:var(--color-gray-100);border-radius:50%;margin-bottom:var(--spacing-lg)}.age-info{grid-column:1 / -1;font-size:.875rem;color:var(--text-secondary);margin-top:var(--spacing-lg);text-align:center;padding:var(--spacing-lg);background:var(--color-gray-100);border-radius:var(--radius-lg);font-weight:600;letter-spacing:.025em}.tag-input-container{display:flex;gap:.5rem;margin-top:.5rem}.tag-input{flex:1;padding:.75rem;border:1px solid #e5e7eb;border-radius:.5rem;font-size:.875rem;background-color:#fff;transition:border-color .2s}.tag-input:focus{outline:none;border-color:#3b82f6}.add-tag-button{background-color:#3b82f6;color:#fff;border:none;padding:.75rem 1rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .2s}.add-tag-button:active{background-color:#2563eb}.tags-container{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.75rem}.tag-item{display:inline-flex;align-items:center;gap:.5rem;background-color:#eff6ff;color:#1e40af;padding:.5rem .75rem;border-radius:.5rem;font-size:.875rem;font-weight:500}.remove-tag-button{background:none;border:none;color:#1e40af;font-size:1rem;cursor:pointer;padding:0;width:1rem;height:1rem;display:flex;align-items:center;justify-content:center;transition:color .2s}.remove-tag-button:active{color:#dc2626}.submit-button{width:100%;background-color:#3b82f6;color:#fff;border:none;padding:1rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .2s;margin-top:1rem}.submit-button:active{background-color:#2563eb}.submit-button:disabled{background-color:#9ca3af;cursor:not-allowed}.loading-spinner{animation:spin 1s linear infinite;border:2px solid white;border-top:2px solid transparent;border-radius:50%;width:1rem;height:1rem;margin-right:.5rem}@media (max-width: 768px){.edit-header .header-content{padding:var(--spacing-md)}.header-title{font-size:1.25rem}.edit-content{padding:var(--spacing-md)}.edit-form{padding:var(--spacing-xl)}.region-selectors{grid-template-columns:1fr;gap:var(--spacing-md)}.age-range-container{grid-template-columns:1fr;gap:var(--spacing-lg);text-align:center}.age-separator{transform:rotate(90deg);margin:0 auto}.image-upload-section{padding:var(--spacing-lg)}.preview-image{width:200px;height:150px}}@media (max-width: 480px){.edit-header .header-content{padding:var(--spacing-sm)}.header-title{font-size:1.125rem}.back-button,.save-button{padding:var(--spacing-sm) var(--spacing-md);font-size:.875rem}.edit-content{padding:var(--spacing-sm)}.edit-form{padding:var(--spacing-lg)}.image-upload-section{padding:var(--spacing-md)}.preview-image{width:150px;height:120px}}@media (prefers-reduced-motion: reduce){.club-edit-container:before,.edit-header,.edit-form,.back-button,.save-button,.form-input,.form-textarea,.form-select,.image-upload-button,.remove-image-button,.preview-image{animation:none!important;transition:none!important}}@media (prefers-color-scheme: dark){.edit-header{background:#0f172af2;border-bottom-color:var(--color-gray-700)}}.retry-button{background-color:#3b82f6;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .2s;margin-top:1rem}.retry-button:active{background-color:#2563eb}.image-upload-section{display:flex;flex-direction:column;gap:var(--spacing-lg);padding:var(--spacing-xl);background:linear-gradient(135deg,var(--bg-primary),var(--bg-secondary));border-radius:var(--radius-xl);border:2px solid var(--color-gray-200);box-shadow:var(--shadow-md);position:relative;overflow:hidden}.image-upload-section:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));border-radius:var(--radius-xl) var(--radius-xl) 0 0}.image-upload-button{background:var(--bg-secondary);border:2px dashed var(--color-gray-300);color:var(--text-secondary);padding:var(--spacing-2xl);border-radius:var(--radius-xl);text-align:center;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);font-size:1rem;font-weight:600;letter-spacing:.025em;position:relative;overflow:hidden}.image-upload-button:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));opacity:0;transition:opacity .3s ease}.image-upload-button:hover{background:var(--bg-primary);border-color:var(--color-primary);color:var(--color-primary);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.image-upload-button:hover:before{opacity:.05}.image-preview{display:flex;justify-content:center;padding:var(--spacing-lg)}.preview-image{width:250px;height:200px;-o-object-fit:cover;object-fit:cover;border-radius:var(--radius-xl);border:3px solid var(--color-gray-200);box-shadow:var(--shadow-lg);transition:all .3s ease}.preview-image:hover{transform:scale(1.05);box-shadow:var(--shadow-xl)}.current-image-label,.new-image-label{font-size:.875rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-md);letter-spacing:.025em;text-transform:uppercase}.new-image-label{color:var(--color-success)}.remove-image-button{background:linear-gradient(135deg,var(--color-error),#dc2626);color:#fff;border:none;padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-lg);font-size:.875rem;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);margin-top:var(--spacing-md);letter-spacing:.025em;text-transform:uppercase;box-shadow:var(--shadow-sm)}.remove-image-button:hover{background:linear-gradient(135deg,#dc2626,#b91c1c);transform:translateY(-1px);box-shadow:var(--shadow-md)}.remove-image-button:active{transform:translateY(0) scale(.95);box-shadow:var(--shadow-sm)}.field-hint{font-size:.8rem;color:var(--text-tertiary);margin-top:var(--spacing-sm);line-height:1.5;font-weight:500;letter-spacing:.025em}.region-selectors{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-lg);margin-top:var(--spacing-md)}.form-select{padding:var(--spacing-lg) 3rem var(--spacing-lg) var(--spacing-lg);border:2px solid var(--color-gray-200);border-radius:var(--radius-xl);font-size:1rem;font-weight:500;background:var(--bg-secondary);color:var(--text-primary);cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-sm);appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M6 8l4 4 4-4' stroke='%236366f1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--spacing-lg) center;background-size:1.25rem 1.25rem}.form-select:hover{border-color:var(--color-primary);background:var(--bg-primary);transform:translateY(-1px);box-shadow:var(--shadow-md)}.form-select:focus{outline:none;border-color:var(--color-primary);background:var(--bg-primary);box-shadow:0 0 0 4px #6366f11a,var(--shadow-lg);transform:translateY(-1px)}.form-select:disabled{background:var(--color-gray-100);color:var(--text-muted);cursor:not-allowed;opacity:.6;transform:none;box-shadow:none}.club-management-container{background-color:#f9fafb;min-height:100vh;padding-bottom:4rem}.club-management-header{background-color:#fff;border-bottom:1px solid #e5e7eb;padding:1rem;position:sticky;top:0;z-index:10}.club-management-tabs{background-color:#fff;border-bottom:1px solid #e5e7eb;display:flex}.club-management-content{padding:1rem}.overview-section{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;margin-bottom:1rem;overflow:hidden}.overview-header{padding:1rem;border-bottom:1px solid #f3f4f6}.overview-title{font-size:1rem;font-weight:600;color:#111827;margin:0}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);padding:1rem;gap:1rem}.stat-card{text-align:center;padding:1rem;background-color:#f9fafb;border-radius:.5rem}.stat-value{font-size:1.5rem;font-weight:600;color:#111827;margin:0}.stat-label{font-size:.75rem;color:#6b7280;margin:.25rem 0 0}.growth-chart{padding:1rem;border-top:1px solid #f3f4f6}.chart-title{font-size:.875rem;font-weight:600;color:#374151;margin:0 0 .75rem}.chart-placeholder{height:6rem;background-color:#f3f4f6;border-radius:.5rem;display:flex;align-items:center;justify-content:center;color:#6b7280;font-size:.875rem}.quick-actions{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;margin-bottom:1rem;overflow:hidden}.quick-actions-header{padding:1rem;border-bottom:1px solid #f3f4f6}.quick-actions-title{font-size:1rem;font-weight:600;color:#111827;margin:0}.quick-actions-list{padding:1rem}.quick-action-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:.5rem;cursor:pointer;transition:background-color .2s;margin-bottom:.5rem}.quick-action-item:last-child{margin-bottom:0}.quick-action-item:active{background-color:#f3f4f6}.quick-action-icon{width:2rem;height:2rem;border-radius:.5rem;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}.quick-action-info{flex:1}.quick-action-name{font-size:.875rem;font-weight:500;color:#111827;margin:0}.quick-action-description{font-size:.75rem;color:#6b7280;margin:.25rem 0 0}.members-section{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;margin-bottom:1rem;overflow:hidden}.members-header{padding:1rem;border-bottom:1px solid #f3f4f6}.members-title{font-size:1rem;font-weight:600;color:#111827;margin:0}.members-list{padding:1rem}.member-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:.5rem;margin-bottom:.5rem;background-color:#f9fafb}.member-item:last-child{margin-bottom:0}.member-avatar{width:2.5rem;height:2.5rem;border-radius:50%;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}.member-info{flex:1;display:flex;flex-direction:column;gap:.25rem}.member-name{font-size:.875rem;font-weight:500;color:#111827;margin:0}.member-role{font-size:.75rem;color:#6b7280;margin:0}.member-join-date{font-size:.75rem;color:#9ca3af;margin:0}.member-actions{display:flex;gap:.5rem}.member-action-button{background:none;border:none;color:#6b7280;font-size:.875rem;cursor:pointer;padding:.25rem .5rem;border-radius:.25rem;transition:all .2s}.member-action-button:active{background-color:#e5e7eb;color:#374151}.meetings-section{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;margin-bottom:1rem;overflow:hidden}.meetings-header{padding:1rem;border-bottom:1px solid #f3f4f6}.meetings-title{font-size:1rem;font-weight:600;color:#111827;margin:0}.meetings-list{padding:1rem}.meeting-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:.5rem;margin-bottom:.5rem;background-color:#f9fafb;cursor:pointer;transition:background-color .2s}.meeting-item:last-child{margin-bottom:0}.meeting-item:active{background-color:#f3f4f6}.meeting-icon{width:2.5rem;height:2.5rem;border-radius:.5rem;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}.meeting-info{flex:1}.meeting-title{font-size:.875rem;font-weight:500;color:#111827;margin:0}.meeting-details{font-size:.75rem;color:#6b7280;margin:.25rem 0 0}.meeting-actions{display:flex;gap:.5rem}.meeting-action-button{background:none;border:none;color:#6b7280;font-size:.875rem;cursor:pointer;padding:.25rem .5rem;border-radius:.25rem;transition:all .2s}.meeting-action-button:active{background-color:#e5e7eb;color:#374151}.settings-section{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;margin-bottom:1rem;overflow:hidden}.settings-header{padding:1rem;border-bottom:1px solid #f3f4f6}.settings-title{font-size:1rem;font-weight:600;color:#111827;margin:0}.settings-list{padding:1rem}.setting-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:.5rem;margin-bottom:.5rem;cursor:pointer;transition:background-color .2s}.setting-item:last-child{margin-bottom:0}.setting-item:active{background-color:#f3f4f6}.setting-icon{width:2rem;height:2rem;border-radius:.5rem;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}.setting-info{flex:1}.setting-name{font-size:.875rem;font-weight:500;color:#111827;margin:0}.setting-description{font-size:.75rem;color:#6b7280;margin:.25rem 0 0}.setting-arrow{color:#d1d5db;font-size:1.25rem;font-weight:300;flex-shrink:0}.join-notification-badge{position:fixed;top:1rem;right:1rem;background-color:#3b82f6;color:#fff;border:none;border-radius:.75rem;padding:.75rem 1rem;box-shadow:0 10px 25px -5px #00000040;cursor:pointer;transition:all .3s ease;z-index:50;display:flex;align-items:center;gap:.5rem;max-width:250px;animation:slideInRight .5s ease-out;font-family:inherit}.join-notification-badge:hover{background-color:#2563eb;transform:translateY(-2px);box-shadow:0 15px 35px -5px #0000004d}.join-notification-badge:active{transform:translateY(0)}.notification-icon{font-size:1.25rem;animation:ring 2s ease-in-out infinite}.notification-count{background-color:#ef4444;color:#fff;border-radius:50%;width:1.5rem;height:1.5rem;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600;flex-shrink:0}.notification-text{font-size:.875rem;font-weight:500;line-height:1.2}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes ring{0%,20%,50%,80%,to{transform:rotate(0)}10%{transform:rotate(-10deg)}30%{transform:rotate(10deg)}60%{transform:rotate(-5deg)}70%{transform:rotate(5deg)}}@media (max-width: 640px){.join-notification-badge{top:.5rem;right:.5rem;padding:.5rem .75rem;max-width:200px}.notification-text{font-size:.75rem}.notification-icon{font-size:1rem}.notification-count{width:1.25rem;height:1.25rem;font-size:.625rem}}.my-clubs-container{min-height:100vh;background-color:#f9fafb;padding-bottom:4rem;display:flex;flex-direction:column}.my-clubs-header{background-color:#fff;border-bottom:1px solid #e5e7eb;position:sticky;top:0;z-index:10}.header-content{padding:1rem;display:flex;align-items:center;justify-content:space-between}.header-info{flex:1}.header-stats{margin-top:.25rem}.stat-text{font-size:.75rem;color:#6b7280;font-weight:500}.header-title{font-size:1.25rem;font-weight:700;color:#111827}.action-button{background:none;border:none;padding:.5rem;border-radius:.25rem;cursor:pointer;color:#6b7280;transition:color .2s ease}.action-button:active{color:#374151}.action-button:disabled{opacity:.5;cursor:not-allowed}.action-button:disabled:hover{color:#6b7280}.tab-navigation{display:flex;background-color:#f9fafb;border-top:1px solid #e5e7eb}.tab-button{flex:1;padding:.75rem 1rem;background:none;border:none;font-size:.875rem;font-weight:500;color:#6b7280;cursor:pointer;transition:all .2s ease;border-bottom:2px solid transparent}.tab-button:hover{color:#374151;background-color:#f3f4f6}.tab-button.active{color:#3b82f6;border-bottom-color:#3b82f6;background-color:#fff}.content{flex:1;overflow-y:auto}.clubs-content,.schedule-content{padding:1rem}.club-header{display:flex;align-items:flex-start;gap:.75rem;padding:1rem}.club-icon{width:4rem;height:4rem;background-color:#e5e7eb;border-radius:.5rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1.5rem;position:relative;overflow:hidden}.club-image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:.5rem}.club-info{flex:1}.club-title-row{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:.5rem}.club-title{font-size:1.125rem;font-weight:600;color:#111827}.club-role-badge{font-size:.75rem;padding:.25rem .5rem;border-radius:9999px;font-weight:500}.club-role-badge.owner{background-color:#dbeafe;color:#1e40af}.club-role-badge.member{background-color:#fef3c7;color:#92400e}.club-description{font-size:.875rem;color:#6b7280;margin-bottom:.5rem;line-height:1.4}.club-meta{display:flex;align-items:center;gap:1rem;font-size:.75rem;color:#6b7280;margin-bottom:.5rem}.club-meta-item{display:flex;align-items:center;gap:.25rem}.club-tags{display:flex;flex-wrap:wrap;gap:.25rem;margin-bottom:.5rem}.club-tag{padding:.25rem .5rem;background-color:#f3f4f6;color:#374151;border-radius:9999px;font-size:.75rem}.empty-state{text-align:center;padding:3rem 1rem;color:#6b7280}.empty-title{font-size:1.125rem;font-weight:600;margin-bottom:.5rem;color:#111827}.empty-description{font-size:.875rem;margin-bottom:1.5rem}.empty-button{background-color:#3b82f6;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:.5rem;font-weight:500;cursor:pointer;transition:background-color .2s ease}.empty-button:active{background-color:#2563eb}.club-stats{display:flex;gap:1rem;padding:.75rem 1rem;background-color:#f9fafb;border-top:1px solid #e5e7eb}.stat-item{display:flex;flex-direction:column;align-items:center;flex:1}.stat-value{font-size:1.125rem;font-weight:600;color:#111827}.stat-label{font-size:.75rem;color:#6b7280}.next-meeting{background-color:#fef3c7;border:1px solid #fde047;border-radius:.5rem;padding:.75rem 1rem;margin:0 1rem 1rem}.next-meeting-title{font-size:.875rem;font-weight:600;color:#92400e;margin-bottom:.25rem}.next-meeting-info{font-size:.75rem;color:#a16207;display:flex;flex-direction:column;gap:.25rem}.meeting-time{font-weight:500;color:#92400e}.meeting-location{color:#a16207;display:flex;align-items:center;gap:.25rem}.schedule-card{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;overflow:hidden;margin-bottom:1rem;transition:all .2s ease}.schedule-card:hover{box-shadow:0 4px 12px #00000026;transform:translateY(-1px)}.schedule-header{display:flex;justify-content:space-between;align-items:flex-start;padding:1rem 1rem .5rem}.schedule-date-time{display:flex;flex-direction:column;gap:.25rem}.schedule-date{font-size:1rem;font-weight:600;color:#111827}.schedule-time{font-size:.875rem;color:#6b7280}.schedule-status{padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:500;color:#fff;text-align:center}.schedule-content-info{padding:0 1rem 1rem}.schedule-club-name{font-size:.75rem;color:#6b7280;margin-bottom:.25rem;font-weight:500}.schedule-title{font-size:1.125rem;font-weight:600;color:#111827;margin-bottom:.5rem}.schedule-description{font-size:.875rem;color:#6b7280;line-height:1.4;margin-bottom:.75rem}.schedule-meta{display:flex;gap:1rem;margin-bottom:.75rem}.schedule-meta-item{display:flex;align-items:center;gap:.25rem;font-size:.75rem;color:#6b7280}.schedule-actions{display:flex;gap:.5rem;padding:0 1rem 1rem}.schedule-action-button{flex:1;padding:.5rem 1rem;border-radius:.375rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;border:1px solid}.schedule-action-button.primary{background-color:#3b82f6;color:#fff;border-color:#3b82f6}.schedule-action-button.primary:hover{background-color:#2563eb;border-color:#2563eb}.schedule-action-button.primary:active{background-color:#1d4ed8}.schedule-action-button.secondary{background-color:#fff;color:#374151;border-color:#d1d5db}.schedule-action-button.secondary:hover{background-color:#f9fafb;border-color:#9ca3af}.schedule-action-button.secondary:active{background-color:#f3f4f6}.loading-state,.error-state{text-align:center;padding:3rem 1rem;color:#6b7280}.loading-spinner{font-size:2rem;margin-bottom:1rem;animation:spin 1s linear infinite}.error-title{font-size:1.125rem;font-weight:600;margin-bottom:.5rem;color:#dc2626}.error-description{font-size:.875rem;margin-bottom:1.5rem;color:#6b7280}.retry-button{background-color:#3b82f6;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:.5rem;font-weight:500;cursor:pointer;transition:background-color .2s ease}.retry-button:active{background-color:#1d4ed8}.club-status{margin-top:.5rem}.status-badge{padding:.25rem .5rem;border-radius:9999px;font-size:.75rem;font-weight:500}.status-badge.active{background-color:#d1fae5;color:#065f46}.status-badge.inactive{background-color:#fee2e2;color:#991b1b}.chat-container{background-color:#f9fafb;min-height:100vh;padding-bottom:4rem}.chat-header{background-color:#fff;border-bottom:1px solid #e5e7eb;padding:1rem;position:sticky;top:0;z-index:10}.loading-state,.error-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;text-align:center}.error-icon{font-size:3rem;margin-bottom:1rem}.error-title{font-size:1.125rem;font-weight:600;color:#111827;margin:0 0 .5rem}.error-description{color:#6b7280;margin:0 0 1.5rem}.retry-button{background-color:#3b82f6;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:.75rem;font-weight:600;cursor:pointer;transition:background-color .2s}.retry-button:active{transform:scale(.98)}.chat-tabs{background-color:#fff;border-bottom:1px solid #e5e7eb;display:flex}.chat-content{padding:0;background-color:#fff}.chat-room-item{background-color:#fff;border-bottom:1px solid #e5e7eb;margin-bottom:0;overflow:hidden;cursor:pointer;transition:all .2s;padding:.75rem}.chat-room-item:last-child{border-bottom:none}.chat-room-item:active{background-color:#f3f4f6;transform:scale(.98)}.chat-room-info{display:flex;align-items:center;gap:.75rem}.chat-room-avatar{width:3rem;height:3rem;border-radius:50%;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex-shrink:0}.chat-room-details{flex:1;min-width:0}.chat-room-name{font-size:.875rem;font-weight:600;color:#111827;margin:0 0 .25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-room-message{font-size:.875rem;color:#6b7280;margin:0 0 .25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-room-meta{display:flex;align-items:center;gap:.5rem;font-size:.75rem;color:#9ca3af}.chat-room-type{color:#6b7280}.chat-room-time,.chat-room-members{color:#9ca3af}.chat-room-side{display:flex;flex-direction:column;align-items:flex-end;gap:.25rem}.chat-room-unread{background-color:#ef4444;color:#fff;font-size:.75rem;font-weight:600;padding:.125rem .375rem;border-radius:.75rem;min-width:1.25rem;text-align:center}.empty-state{padding:3rem 1rem;text-align:center;background-color:#fff;pointer-events:auto}.empty-description{font-size:.875rem;color:#6b7280;margin:0 0 2rem;line-height:1.5}.empty-actions{display:flex;flex-direction:column;gap:.75rem;align-items:center}.empty-button{border:none;padding:.75rem 1.5rem;border-radius:.75rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s;min-width:140px;text-align:center;pointer-events:auto;z-index:1;position:relative}.empty-button.primary{background-color:#3b82f6;color:#fff;box-shadow:0 2px 8px #3b82f64d}.empty-button.primary:hover{background-color:#2563eb;box-shadow:0 4px 12px #3b82f666}.empty-button.primary:active{background-color:#1d4ed8;transform:translateY(1px)}.empty-button.secondary{background-color:#f3f4f6;color:#374151;border:1px solid #d1d5db}.empty-button.secondary:hover{background-color:#e5e7eb;border-color:#9ca3af}.empty-button.secondary:active{background-color:#d1d5db;transform:translateY(1px)}.floating-button{position:fixed;bottom:5rem;right:1rem;width:3.5rem;height:3.5rem;background-color:#3b82f6;color:#fff;border:none;border-radius:50%;font-size:1.5rem;cursor:pointer;box-shadow:0 4px 12px #3b82f666;transition:all .2s;z-index:100}.floating-button:hover{background-color:#2563eb;transform:scale(1.1)}.floating-button:active{transform:scale(.95)}.chat-room-container{display:flex;flex-direction:column;height:100vh;background-color:#f5f5f5}.chat-room-header{background-color:#fff;border-bottom:1px solid #e0e0e0;padding:12px 16px;position:sticky;top:0;z-index:10}.chat-info{display:flex;align-items:center;gap:12px;cursor:pointer;flex:1;margin:0 16px}.chat-avatar{position:relative;width:40px;height:40px;border-radius:50%;background-color:#e0e0e0;display:flex;align-items:center;justify-content:center;font-size:20px}.chat-status{position:absolute;bottom:2px;right:2px;width:12px;height:12px;border-radius:50%;border:2px solid #ffffff}.chat-status.online{background-color:#4caf50}.chat-status.offline{background-color:#9e9e9e}.chat-details{display:flex;flex-direction:column}.chat-name{font-size:16px;font-weight:600;margin:0;color:#333}.chat-type{font-size:12px;color:#666}.messages-container{flex:1;overflow-y:auto;padding:16px;background-color:#f5f5f5}.messages-list{display:flex;flex-direction:column;gap:16px}.message-item{display:flex;gap:8px;align-items:flex-start;margin-bottom:16px}.message-item.own{flex-direction:row-reverse}.message-item.own .message-avatar{margin-top:4px}.message-item.system{justify-content:center;margin:16px 0}.message-avatar{width:32px;height:32px;border-radius:50%;background-color:#e0e0e0;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;margin-top:4px}.message-content{display:flex;flex-direction:column;max-width:70%;flex:1;align-items:flex-start}.message-item.own .message-content{align-items:flex-end}.message-sender{font-size:12px;color:#666;margin-bottom:4px}.message-bubble{background-color:#fff;padding:12px 16px;border-radius:18px;border:1px solid #e0e0e0;word-wrap:break-word;line-height:1.4;margin-bottom:4px;display:inline-block;max-width:100%}.message-item.own .message-bubble{background-color:#007bff;color:#fff;border-color:#007bff}.message-footer{display:flex;align-items:center;gap:6px;margin-top:2px;width:100%}.message-item.own .message-footer{justify-content:flex-end;flex-direction:row}.message-time{font-size:11px;color:#999}.message-read-status{font-size:10px;color:#fff;font-weight:600;background-color:#f44;padding:2px 6px;border-radius:10px;border:1px solid #ff4444;display:inline-block;min-width:16px;text-align:center;box-shadow:0 1px 3px #0003}.message-item.own .message-read-status{color:#fff;background-color:#f44;border:1px solid #ff4444;font-weight:600}.system-message{background-color:#f8f9fa;border:1px solid #e9ecef;border-radius:12px;padding:8px 16px;text-align:center;max-width:80%}.system-text{font-size:12px;color:#666}.system-time{font-size:10px;color:#999;margin-left:8px}.input-container{background-color:#fff;border-top:1px solid #e0e0e0;padding:12px 16px;position:sticky;bottom:0}.input-wrapper{display:flex;align-items:flex-end;gap:8px;background-color:#f8f9fa;border:1px solid #e0e0e0;border-radius:24px;padding:8px 12px}.message-input{flex:1;border:none;background:none;outline:none;resize:none;font-size:14px;line-height:1.4;max-height:100px;min-height:20px;font-family:inherit}.message-input::-moz-placeholder{color:#999}.message-input::placeholder{color:#999}.input-actions{display:flex;align-items:center;gap:4px}.action-btn{background:none;border:none;font-size:18px;cursor:pointer;padding:4px;border-radius:50%;transition:background-color .2s;color:#666}.action-btn:hover{background-color:#e0e0e0}.send-button{background-color:#007bff;color:#fff;border:none;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;transition:background-color .2s}.send-button:hover:not(:disabled){background-color:#0056b3}.send-button:disabled{background-color:#ccc;cursor:not-allowed}.messages-container::-webkit-scrollbar{width:6px}.messages-container::-webkit-scrollbar-track{background:#f1f1f1}.messages-container::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:3px}.messages-container::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.new-chat-container{display:flex;flex-direction:column;height:100vh;background-color:#fff}.new-chat-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background-color:#fff;border-bottom:1px solid #e5e7eb;position:sticky;top:0;z-index:10}.back-button{background:none;border:none;font-size:20px;color:#374151;cursor:pointer;padding:8px;border-radius:8px;transition:background-color .2s}.back-button:hover{background-color:#f3f4f6}.header-title{font-size:18px;font-weight:600;color:#111827;margin:0}.create-button{background-color:#3b82f6;color:#fff;border:none;padding:8px 16px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s}.create-button:hover:not(:disabled){background-color:#2563eb}.create-button:disabled{background-color:#9ca3af;cursor:not-allowed}.search-section{padding:16px 20px;border-bottom:1px solid #e5e7eb}.search-input-wrapper{position:relative;display:flex;align-items:center}.search-input{width:100%;padding:12px 40px 12px 16px;border:1px solid #d1d5db;border-radius:12px;font-size:14px;background-color:#f9fafb}.search-icon{position:absolute;right:12px;color:#9ca3af;pointer-events:none}.selected-users-section{padding:16px 20px;border-bottom:1px solid #e5e7eb;background-color:#f8fafc}.section-title{font-size:16px;font-weight:600;color:#374151;margin:0 0 12px}.selected-users-list{display:flex;flex-wrap:wrap;gap:8px}.selected-user-item{display:flex;align-items:center;gap:8px;background-color:#3b82f6;color:#fff;padding:6px 12px;border-radius:20px;font-size:14px}.selected-user-item .user-avatar{width:20px;height:20px}.selected-user-item .user-avatar img{width:100%;height:100%;border-radius:50%;-o-object-fit:cover;object-fit:cover}.selected-user-item .user-name{font-weight:500}.remove-button{background:none;border:none;color:#fff;font-size:16px;cursor:pointer;padding:0;margin-left:4px;width:16px;height:16px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background-color .2s}.remove-button:hover{background-color:#fff3}.users-section{flex:1;padding:16px 20px;overflow-y:auto}.users-list{display:flex;flex-direction:column;gap:8px}.user-item{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-radius:12px;cursor:pointer;transition:all .2s;border:2px solid transparent}.user-item:hover{background-color:#f3f4f6}.user-item.selected{background-color:#eff6ff;border-color:#3b82f6}.user-info{display:flex;align-items:center;gap:12px;flex:1}.user-avatar{width:48px;height:48px;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;background-color:#f3f4f6}.avatar-placeholder{font-size:20px;color:#9ca3af}.user-details{flex:1}.user-name{font-size:16px;font-weight:500;color:#111827;margin-bottom:2px}.user-meta{font-size:14px;color:#6b7280}.user-select{display:flex;align-items:center}.select-checkbox{width:20px;height:20px;border:2px solid #d1d5db;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:12px;color:#fff;transition:all .2s}.select-checkbox.checked{background-color:#3b82f6;border-color:#3b82f6}.loading-state,.error-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;flex:1}.spinner{width:24px;height:24px;border:3px solid #e5e7eb;border-top:3px solid #3b82f6;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}.loading-state span{color:#6b7280;font-size:14px}.error-icon{font-size:48px;margin-bottom:16px}.error-title{font-size:18px;font-weight:600;color:#111827;margin:0 0 8px}.error-description{font-size:14px;color:#6b7280;margin:0 0 20px}.retry-button{background-color:#3b82f6;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s}.retry-button:hover{background-color:#2563eb}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center}.empty-icon{font-size:48px;margin-bottom:16px;opacity:.5}.empty-title{font-size:18px;font-weight:600;color:#111827;margin:0 0 8px}.empty-description{font-size:14px;color:#6b7280;margin:0}.follow-badge{display:inline-block;padding:2px 8px;border-radius:12px;font-size:12px;font-weight:500;background-color:#e5e7eb;color:#374151;margin-right:4px}.follow-badge.match{background-color:#dcfce7;color:#166534}.marketplace-container{background-color:#f9fafb;min-height:100vh;padding-bottom:4rem}.marketplace-header{background-color:#fff;border-bottom:1px solid #e5e7eb;padding:1rem;position:sticky;top:0;z-index:10}.search-container{background-color:#fff;border-bottom:1px solid #e5e7eb;padding:1rem}.search-input-wrapper{position:relative}.search-input{width:100%;padding:.75rem 1rem;border:1px solid #e5e7eb;border-radius:.5rem;font-size:.875rem;background-color:#f9fafb;transition:border-color .2s}.search-input:focus{outline:none;border-color:#3b82f6;background-color:#fff}.tab-container{background-color:#fff;border-bottom:1px solid #e5e7eb;display:flex}.tab-button{flex:1;padding:1rem;background:none;border:none;color:#6b7280;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s;border-bottom:2px solid transparent}.tab-button.active{color:#3b82f6;border-bottom-color:#3b82f6}.tab-button:active{background-color:#f3f4f6}.category-container{background-color:#fff;border-bottom:1px solid #e5e7eb;padding:.75rem 0}.category-scroll{display:flex;gap:.5rem;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;padding:0 1rem}.category-scroll::-webkit-scrollbar{display:none}.category-button{padding:.5rem 1rem;border:1px solid #e5e7eb;border-radius:1rem;background-color:#fff;color:#6b7280;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap}.category-button:active{background-color:#f3f4f6;transform:scale(.95)}.category-button.active{background-color:#3b82f6;color:#fff;border-color:#3b82f6}.marketplace-content{padding:1rem}.game-card{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;margin-bottom:1rem;overflow:hidden}.game-header{padding:1rem;border-bottom:1px solid #f3f4f6}.game-info{display:flex;gap:1rem}.game-image{width:4rem;height:4rem;border-radius:.5rem;-o-object-fit:cover;object-fit:cover;flex-shrink:0}.game-details{flex:1}.game-name{font-size:1rem;font-weight:600;color:#111827;margin:0 0 .25rem}.game-meta{display:flex;gap:1rem;font-size:.75rem;color:#6b7280;margin-bottom:.5rem}.game-category{background-color:#eff6ff;color:#1e40af;padding:.125rem .375rem;border-radius:.25rem;font-size:.75rem;font-weight:500}.stores-section{padding:1rem}.stores-title{font-size:.875rem;font-weight:600;color:#374151;margin:0 0 .75rem}.store-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;border:1px solid #e5e7eb;border-radius:.5rem;margin-bottom:.5rem;cursor:pointer;transition:all .2s}.store-item:active{background-color:#f3f4f6;transform:scale(.98)}.store-logo{width:2rem;height:2rem;border-radius:.25rem;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:.75rem;flex-shrink:0}.store-info{flex:1}.store-name{font-size:.875rem;font-weight:500;color:#111827;margin:0}.store-price{display:flex;align-items:center;gap:.5rem;margin-top:.25rem}.current-price{font-size:.875rem;font-weight:600;color:#dc2626}.original-price{font-size:.75rem;color:#9ca3af;text-decoration:line-through}.discount{font-size:.75rem;color:#dc2626;font-weight:500}.store-meta{display:flex;flex-direction:column;align-items:flex-end;gap:.25rem}.shipping-info{font-size:.75rem;color:#6b7280}.rating-info{display:flex;align-items:center;gap:.25rem;font-size:.75rem;color:#6b7280}.used-products-section{padding:1rem}.used-products-title{font-size:.875rem;font-weight:600;color:#374151;margin:0 0 .75rem}.used-product-item{display:flex;gap:.75rem;padding:.75rem;border:1px solid #e5e7eb;border-radius:.5rem;margin-bottom:.5rem;cursor:pointer;transition:all .2s}.used-product-item:active{background-color:#f3f4f6;transform:scale(.98)}.used-product-image{width:3rem;height:3rem;border-radius:.5rem;-o-object-fit:cover;object-fit:cover;flex-shrink:0}.used-product-info{flex:1}.used-product-name{font-size:.875rem;font-weight:500;color:#111827;margin:0 0 .25rem}.used-product-description{font-size:.75rem;color:#6b7280;margin:0 0 .25rem}.used-product-meta{display:flex;justify-content:space-between;align-items:center}.used-product-price{font-size:.875rem;font-weight:600;color:#dc2626}.used-product-original{font-size:.75rem;color:#9ca3af;text-decoration:line-through}.used-product-details{display:flex;flex-direction:column;align-items:flex-end;gap:.25rem}.used-product-condition,.used-product-seller{font-size:.75rem;color:#6b7280}.used-product-time{font-size:.75rem;color:#9ca3af}.empty-state{padding:3rem 1rem;text-align:center;background-color:#fff}.empty-icon{font-size:3rem;margin-bottom:1rem}.empty-title{font-size:1.125rem;font-weight:600;color:#374151;margin:0 0 .5rem}.empty-description{font-size:.875rem;color:#6b7280;margin:0}.mypage-container{background-color:#fff;min-height:100vh;padding-bottom:4rem}.mypage-header{background-color:#fff;border-bottom:1px solid #e5e7eb;padding:1rem;position:sticky;top:0;z-index:10}.header-actions{display:flex;gap:.5rem}.action-button{background:none;border:none;color:#6b7280;font-size:1.25rem;cursor:pointer;padding:.5rem;border-radius:.5rem;transition:all .2s}.action-button:active{background-color:#f3f4f6;transform:scale(.95)}.profile-section{padding:1rem;background-color:#fff}.profile-card{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;margin-bottom:1rem;overflow:hidden;padding:1.5rem;display:flex;align-items:center;gap:1rem;position:relative}.profile-avatar{width:4rem;height:4rem;border-radius:50%;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:2rem;flex-shrink:0;position:relative;overflow:hidden}.profile-image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:50%}.profile-image-loading{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:#f3f4f6}.loading-spinner{width:1.5rem;height:1.5rem;border:2px solid #e5e7eb;border-top:2px solid #3b82f6;border-radius:50%;animation:spin 1s linear infinite}.avatar-emoji{font-size:2rem}.avatar-emoji.hidden{display:none}.profile-name{font-size:1.25rem;font-weight:600;color:#111827;margin:0 0 .25rem}.profile-email{font-size:.875rem;color:#6b7280;margin:0 0 .5rem}.profile-level{display:flex;align-items:center;gap:.5rem}.level-badge{background-color:#3b82f6;color:#fff;padding:.25rem .5rem;border-radius:.25rem;font-size:.75rem;font-weight:500}.points-text{font-size:.75rem;color:#6b7280}.edit-profile-button{background:none;border:none;color:#6b7280;font-size:1.25rem;cursor:pointer;padding:.5rem;border-radius:.5rem;transition:all .2s;position:absolute;top:1rem;right:1rem}.edit-profile-button:hover{background-color:#f3f4f6;color:#374151}.edit-profile-button:active{background-color:#e5e7eb;transform:scale(.95)}.stats-container{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-bottom:1rem;background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;overflow:hidden}.stat-card{background-color:#fff;padding:1.5rem 1rem;text-align:center;border-right:1px solid #e5e7eb;position:relative;cursor:pointer;transition:background-color .2s ease}.stat-card:nth-child(1):hover{background-color:#eff6ff}.stat-card:nth-child(2):hover{background-color:#fef3c7}.stat-card:nth-child(3){background-color:#f0fdf4;border-left:4px solid #10b981}.stat-card:nth-child(4){background-color:#fdf2f8;border-left:4px solid #ec4899}.stat-card:last-child{border-right:none}.stat-card:active{transform:scale(.98);opacity:.9}.stat-icon{font-size:1.75rem;margin-bottom:.75rem;opacity:.9}.stat-content{display:flex;flex-direction:column;align-items:center}.stat-number{font-size:1.5rem;font-weight:700;color:#111827;margin:0;line-height:1}.stat-label{font-size:.75rem;color:#6b7280;margin:.375rem 0 0;font-weight:500}.menu-section{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;margin-bottom:1rem;overflow:hidden}.menu-list{padding:0;margin:0;list-style:none}.menu-item{display:flex;align-items:center;gap:.75rem;padding:1rem;border-bottom:1px solid #f3f4f6;cursor:pointer;transition:background-color .2s}.menu-item:last-child{border-bottom:none}.menu-item:active{background-color:#f3f4f6}.menu-icon{width:2rem;height:2rem;border-radius:.5rem;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}.menu-content{flex:1}.menu-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}.menu-title{font-size:.875rem;font-weight:500;color:#111827;margin:0}.menu-badge{background-color:#ef4444;color:#fff;padding:.125rem .375rem;border-radius:.25rem;font-size:.625rem;font-weight:500}.menu-description{font-size:.75rem;color:#6b7280;margin:0}.menu-arrow{color:#d1d5db;font-size:1.25rem;font-weight:300;flex-shrink:0}.app-info{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;margin-bottom:1rem;overflow:hidden;padding:1rem;text-align:center}.app-version{font-size:.875rem;color:#6b7280;margin:0 0 .25rem}.app-copyright{font-size:.75rem;color:#9ca3af;margin:0}.logout-button{width:100%;background-color:#ef4444;color:#fff;border:none;padding:1rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .2s;margin-top:1rem}.logout-button:active{background-color:#dc2626}.profile-edit-container{min-height:100vh;background-color:#f9fafb}.edit-header{background-color:#fff;border-bottom:1px solid #e0e0e0;padding:12px 16px;position:sticky;top:0;z-index:10}.save-button{background-color:#007bff;color:#fff;border:none;padding:8px 16px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s}.save-button:hover:not(:disabled){background-color:#0056b3}.save-button:disabled{background-color:#ccc;cursor:not-allowed}.edit-content{padding:16px}.edit-form{max-width:600px;margin:0 auto}.form-section{background-color:#fff;border-radius:12px;padding:20px;margin-bottom:16px;box-shadow:0 1px 3px #0000001a}.section-title{font-size:16px;font-weight:600;margin:0 0 16px;color:#333}.form-label{display:block;font-size:14px;font-weight:500;color:#333;margin-bottom:8px}.form-label-container{display:flex;align-items:center;gap:8px;margin-bottom:8px}.form-label-container .form-label{margin-bottom:0}.form-input,.form-textarea,.form-select{width:100%;padding:12px 16px;border:1px solid #e0e0e0;border-radius:8px;font-size:14px;transition:border-color .2s;box-sizing:border-box}.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:#007bff}.form-input:disabled,.form-select:disabled{background-color:#f5f5f5;color:#666;cursor:not-allowed;opacity:.7}.form-textarea{resize:vertical;min-height:80px;font-family:inherit}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form-club{margin-bottom:16px}.char-count{font-size:12px;color:#6b7280;text-align:right;margin-top:4px;transition:color .2s}.char-count.near-limit{color:#f59e0b;font-weight:500}.char-count.at-limit{color:#ef4444;font-weight:600}.field-hint{font-size:12px;color:#6b7280;margin-top:4px;font-style:italic;line-height:1.4}.form-textarea{width:100%;padding:12px;border:1px solid #d1d5db;border-radius:8px;font-size:14px;font-family:inherit;resize:vertical;min-height:100px;transition:all .2s;box-sizing:border-box}.form-textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.form-textarea::-moz-placeholder{color:#9ca3af;font-style:italic}.form-textarea::placeholder{color:#9ca3af;font-style:italic}.form-select{width:100%;padding:12px 40px 12px 12px;border:1px solid #d1d5db;border-radius:8px;font-size:14px;background-color:#fff;transition:all .2s;cursor:pointer;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");background-position:right 12px center;background-repeat:no-repeat;background-size:16px}.form-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.form-select:disabled{background-color:#f9fafb;color:#9ca3af;cursor:not-allowed;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%239ca3af' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e")}.form-select option{padding:8px;font-size:14px}.form-select option:first-child{color:#9ca3af;font-style:italic}.profile-image-placeholder,.profile-image-fallback{width:120px;height:120px;border-radius:50%;background:linear-gradient(135deg,#f3f4f6,#e5e7eb);border:2px solid #e5e7eb;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;transition:all .3s ease}.profile-image-placeholder:hover,.profile-image-fallback:hover{background:linear-gradient(135deg,#e5e7eb,#d1d5db);border-color:#d1d5db}.avatar-icon{font-size:48px;color:#9ca3af;margin-bottom:4px;transition:color .3s ease}.profile-image-placeholder:hover .avatar-icon,.profile-image-fallback:hover .avatar-icon{color:#6b7280}.placeholder-text{font-size:12px;color:#6b7280;font-weight:500;text-align:center;line-height:1.2}.profile-image-container{position:relative;width:120px;height:120px;margin:0 auto 16px}.profile-image-preview{width:120px;height:120px;border-radius:50%;-o-object-fit:cover;object-fit:cover;border:3px solid #ffffff;box-shadow:0 4px 12px #00000026}.profile-header{display:flex;align-items:center;gap:20px}.profile-info{flex:1}.profile-title{font-size:18px;font-weight:600;margin:0 0 8px;color:#333}.profile-subtitle{font-size:14px;color:#666;margin:0}.profile-image-container{position:relative;display:inline-block}.edit-image-button{position:absolute;top:-8px;right:-8px;background-color:#007bff;color:#fff;border:none;border-radius:50%;width:32px;height:32px;font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0003;transition:all .2s}.edit-image-button:hover{background-color:#0056b3;transform:scale(1.1)}.edit-image-button:active{transform:scale(.95)}.profile-image-preview{width:100px;height:100px;border-radius:50%;-o-object-fit:cover;object-fit:cover;border:3px solid #e0e0e0;box-shadow:0 2px 8px #0000001a}.profile-image-loading{width:100px;height:100px;border-radius:50%;border:3px solid #e0e0e0;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#f8f9fa}.loading-spinner{width:20px;height:20px;border:2px solid #e0e0e0;border-top:2px solid #007bff;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:8px}.profile-image-placeholder{width:100px;height:100px;border-radius:50%;border:3px solid #e0e0e0;display:flex;align-items:center;justify-content:center;background-color:#f8f9fa;color:#666;font-size:12px;text-align:center}.upload-method-selector{display:flex;gap:8px;margin-bottom:16px}.method-button{flex:1;padding:10px 16px;border:1px solid #e0e0e0;background-color:#fff;color:#333;border-radius:8px;font-size:14px;cursor:pointer;transition:all .2s}.method-button:hover{border-color:#007bff;background-color:#f0f8ff}.method-button.active{border-color:#007bff;background-color:#007bff;color:#fff}.file-upload-section{text-align:center}.upload-button{background-color:#007bff;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s;margin-bottom:8px}.upload-button:hover:not(:disabled){background-color:#0056b3}.upload-button:disabled{background-color:#ccc;cursor:not-allowed}.upload-hint{font-size:12px;color:#666;margin:0}.url-input-section{margin-top:8px}.url-input-container{display:flex;gap:8px;margin-bottom:8px}.url-input{flex:1;padding:12px 16px;border:1px solid #e0e0e0;border-radius:8px;font-size:14px;transition:border-color .2s}.url-input:focus{outline:none;border-color:#007bff}.url-input:disabled{background-color:#f5f5f5;cursor:not-allowed}.url-submit-button{background-color:#28a745;color:#fff;border:none;padding:12px 16px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s;white-space:nowrap}.url-submit-button:hover:not(:disabled){background-color:#218838}.url-submit-button:disabled{background-color:#ccc;cursor:not-allowed}.url-hint{font-size:12px;color:#666;margin:0}.interest-input-container{display:flex;gap:8px;margin-bottom:12px}.interest-input{flex:1}.add-interest-button{background-color:#007bff;color:#fff;border:none;padding:12px 16px;border-radius:8px;font-size:14px;cursor:pointer;transition:background-color .2s}.add-interest-button:hover{background-color:#0056b3}.interests-container{display:flex;flex-wrap:wrap;gap:8px}.interest-tag{background-color:#e3f2fd;color:#1976d2;padding:6px 12px;border-radius:16px;font-size:12px;display:flex;align-items:center;gap:6px}.remove-interest-button{background:none;border:none;color:#1976d2;cursor:pointer;font-size:14px;padding:0;width:16px;height:16px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background-color .2s}.remove-interest-button:hover{background-color:#bbdefb}.privacy-settings{display:flex;flex-direction:column;gap:16px}.privacy-item{display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid #f0f0f0}.privacy-item:last-child{border-bottom:none}.privacy-info{flex:1}.privacy-title{font-size:14px;font-weight:500;margin:0 0 4px;color:#333}.privacy-description{font-size:12px;color:#666;margin:0}.gender-display{display:flex;gap:12px;padding:8px 0}.gender-display-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 12px;border:2px solid #e0e0e0;border-radius:12px;background-color:#f8f9fa;min-height:80px;opacity:.6;transition:all .3s ease}.gender-display-item.active{border-color:#007bff;background-color:#007bff;color:#fff;opacity:1}.gender-icon{font-size:24px;line-height:1}.gender-text-container{display:flex;align-items:center;gap:6px}.gender-text{font-size:14px;font-weight:500;line-height:1}.gender-display-item.active .gender-text{color:#fff}.lock-icon{font-size:16px;opacity:.8;color:#666}.image-edit-modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.image-edit-modal{background-color:#fff;border-radius:12px;width:90%;max-width:500px;max-height:80vh;overflow-y:auto;box-shadow:0 4px 20px #0000004d}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 20px 0;border-bottom:1px solid #e0e0e0;margin-bottom:20px}.modal-title{font-size:18px;font-weight:600;margin:0;color:#333}.modal-close-button{background:none;border:none;font-size:24px;cursor:pointer;padding:4px;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;transition:background-color .2s}.modal-close-button:hover{background-color:#f0f0f0}.modal-content{padding:0 20px 20px}@media (max-width: 768px){.form-row{grid-template-columns:1fr}.upload-method-selector,.url-input-container{flex-direction:column}.profile-image-preview{width:80px;height:80px}.profile-header{flex-direction:column;text-align:center;gap:16px}.gender-display{flex-direction:row;gap:8px}.gender-display-item{min-height:70px;padding:12px 8px}.gender-icon{font-size:20px}.gender-text,.lock-icon{font-size:12px}.image-edit-modal{width:95%;margin:20px}}.settings-container{min-height:100vh;background-color:#f9fafb}.settings-header{background-color:#fff;border-bottom:1px solid #e0e0e0;padding:12px 16px;position:sticky;top:0;z-index:10}.header-spacer{width:36px}.settings-content{padding:16px}.settings-list{background-color:#fff;border-radius:12px;overflow:hidden;box-shadow:0 1px 3px #0000001a;margin-bottom:16px}.setting-item{display:flex;align-items:center;gap:16px;padding:16px;cursor:pointer;transition:background-color .2s;border-bottom:1px solid #f0f0f0}.setting-item:last-child{border-bottom:none}.setting-item:hover{background-color:#f8f9fa}.setting-icon{width:40px;height:40px;border-radius:50%;background-color:#f0f0f0;display:flex;align-items:center;justify-content:center;flex-shrink:0}.setting-content{flex:1;min-width:0}.setting-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}.setting-title{font-size:16px;font-weight:500;margin:0;color:#333;flex:1}.setting-description{font-size:14px;color:#666;margin:0;line-height:1.4}.setting-arrow{color:#ccc;font-size:16px}.setting-value{display:flex;align-items:center;gap:4px;color:#666;font-size:14px}.value-arrow{color:#ccc;font-size:14px}.toggle-switch{position:relative;display:inline-block;width:44px;height:24px}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;transition:.3s;border-radius:24px}.toggle-slider:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:3px;background-color:#fff;transition:.3s;border-radius:50%}input:checked+.toggle-slider{background-color:#007bff}input:checked+.toggle-slider:before{transform:translate(20px)}.app-info-section{background-color:#fff;border-radius:12px;padding:20px;box-shadow:0 1px 3px #0000001a}.app-info{display:flex;justify-content:space-between;margin-bottom:12px}.app-version,.app-build{display:flex;flex-direction:column;gap:4px}.version-label,.build-label{font-size:12px;color:#666}.version-number,.build-number{font-size:14px;font-weight:500;color:#333}.app-copyright{text-align:center;font-size:12px;color:#999;padding-top:12px;border-top:1px solid #f0f0f0}.setting-item[data-id=logout]{border-top:1px solid #e0e0e0;margin-top:8px}.setting-item[data-id=logout] .setting-title,.setting-item[data-id=logout] .icon-emoji{color:#dc3545}@media (max-width: 768px){.setting-item{padding:12px}.setting-icon{width:36px;height:36px}.icon-emoji{font-size:16px}.setting-title{font-size:15px}.setting-description{font-size:13px}.app-info{flex-direction:column;gap:12px}}.follow-list{background:#f9fafb;min-height:100vh;padding-bottom:4rem}.follow-list-header{display:flex;justify-content:space-between;align-items:center;background-color:#fff;border-bottom:1px solid #e5e7eb;padding:1rem;position:sticky;top:0;z-index:10}.back-button{background:none;border:none;color:#6b7280;font-size:1.25rem;cursor:pointer;padding:.5rem;border-radius:.5rem;transition:all .2s}.follow-list-header h2{font-size:1.25rem;font-weight:600;color:#111827;margin:0}.follow-list-header .count{font-size:.875rem;color:#6b7280;background:#f3f4f6;padding:.25rem .75rem;border-radius:1rem;font-weight:500}.follow-list-content{display:flex;flex-direction:column;gap:1rem;padding:1rem}.follow-list-item{display:flex;justify-content:space-between;align-items:center;padding:1rem;border-radius:.75rem;border:1px solid #f3f4f6;background:#fff;transition:all .2s ease;box-shadow:0 1px 3px #0000000d}.follow-list-item:hover{border-color:#e5e7eb;background:#fff}.user-info{display:flex;align-items:center;gap:1rem;flex:1}.user-avatar{width:3rem;height:3rem;border-radius:50%;overflow:hidden;background:#e5e7eb;display:flex;align-items:center;justify-content:center;flex-shrink:0}.user-avatar img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.avatar-text{font-size:1.25rem;font-weight:600;color:#6b7280}.user-details{flex:1;min-width:0}.user-nickname{font-size:1rem;font-weight:600;color:#111827;margin:0 0 .25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-email{font-size:.875rem;color:#6b7280;margin:0 0 .5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-status{display:flex;gap:.5rem;flex-wrap:wrap}.status-badge{font-size:.75rem;padding:.125rem .5rem;border-radius:.75rem;font-weight:500}.status-badge.match{background:#d1fae5;color:#059669}.status-badge.following{background:#dbeafe;color:#2563eb}.status-badge.follower{background:#fef3c7;color:#d97706}.status-badge.neutral{background:#f3f4f6;color:#6b7280}.user-actions{display:flex;align-items:center;gap:.5rem;flex-shrink:0;margin-left:1rem}.action-button{width:2rem;height:2rem;border:2px solid #e5e7eb;border-radius:50%;background:#fff;color:#6b7280;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;font-size:.75rem}.action-button:hover{background:#f8fafc}.action-button.remove-follower{border-color:#f59e0b;color:#f59e0b}.action-button.remove-follower:hover{border-color:#d97706;color:#d97706;background:#fef3c7}.action-button.block-user{border-color:#ef4444;color:#ef4444}.action-button.block-user:hover{border-color:#dc2626;color:#dc2626;background:#fee2e2}.profile-view-button{width:2rem;height:2rem;border:2px solid #e5e7eb;border-radius:50%;background:#fff;color:#6b7280;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;font-size:.75rem}.profile-view-button:hover{border-color:#3b82f6;color:#3b82f6;background:#f8fafc}.load-more-button{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;padding:1rem;border:2px dashed #d1d5db;border-radius:.75rem;background:transparent;color:#6b7280;font-weight:500;cursor:pointer;transition:all .2s ease;margin-top:1rem}.load-more-button:hover:not(:disabled){border-color:#3b82f6;color:#3b82f6;background:#f8fafc}.load-more-button:disabled{opacity:.6;cursor:not-allowed}.spinner-small{width:1rem;height:1rem;border:2px solid transparent;border-top:2px solid currentColor;border-radius:50%;animation:spin 1s linear infinite}.follow-list-loading,.follow-list-error,.follow-list-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;text-align:center;background:#fff;border-radius:1rem;box-shadow:0 1px 3px #0000001a}.spinner{width:2rem;height:2rem;border:3px solid #f3f4f6;border-top:3px solid #3b82f6;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}.error-icon,.empty-icon{font-size:3rem;margin-bottom:1rem}.follow-list-error h3,.follow-list-empty h3{font-size:1.125rem;font-weight:600;color:#111827;margin:0 0 .5rem}.follow-list-error p,.follow-list-empty p{color:#6b7280;margin:0 0 1.5rem}.follow-list-error button,.empty-action-button{background-color:#3b82f6;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .2s}.follow-list-error button:hover,.empty-action-button:hover{background-color:#2563eb}@media (max-width: 768px){.follow-list{padding:1rem}.follow-list-item{padding:.75rem;flex-direction:column;align-items:flex-start;gap:1rem}.user-info{width:100%}.user-actions{width:100%;margin-left:0;display:flex;justify-content:flex-end;gap:.5rem}.action-button,.profile-view-button{width:1.75rem;height:1.75rem;font-size:.7rem}.user-avatar{width:2.5rem;height:2.5rem}.avatar-text{font-size:1rem}}@media (max-width: 480px){.follow-list-header{flex-direction:column;align-items:flex-start;gap:.5rem}.user-info{gap:.75rem}.user-avatar{width:2.25rem;height:2.25rem}.user-nickname{font-size:.9375rem}.user-email{font-size:.8125rem}}.user-profile-container{min-height:100vh;background:var(--bg-secondary);padding-bottom:env(safe-area-inset-bottom)}.user-profile-header{position:sticky;top:0;z-index:var(--z-sticky);background:var(--bg-glass);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-bottom:1px solid var(--color-slate-200);box-shadow:var(--shadow-sm)}.user-profile-header .header-content{padding:var(--spacing-4);display:flex;align-items:center;justify-content:space-between;max-width:800px;margin:0 auto}.user-profile-header .back-button{width:2.5rem;height:2.5rem;background:none;border:none;color:var(--text-secondary);font-size:1.5rem;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-smooth)}.user-profile-header .back-button:hover{background:var(--color-slate-100);color:var(--text-primary)}.user-profile-header .header-title{font-size:1.125rem;font-weight:600;color:var(--text-primary);margin:0}.header-actions{display:flex;align-items:center;gap:var(--spacing-2)}.private-indicator{font-size:1.125rem;opacity:.7}.profile-section{padding:var(--spacing-6) var(--spacing-4);max-width:800px;margin:0 auto}.profile-card{background:var(--bg-primary);border-radius:var(--radius-2xl);padding:var(--spacing-6);box-shadow:var(--shadow-sm);border:1px solid var(--color-slate-200);text-align:center;margin-bottom:var(--spacing-6)}.profile-avatar{margin-bottom:var(--spacing-4)}.profile-image{width:120px;height:120px;border-radius:var(--radius-full);-o-object-fit:cover;object-fit:cover;border:4px solid var(--color-slate-200);background:var(--color-slate-100)}.profile-info{margin-bottom:var(--spacing-6)}.profile-name{font-size:1.5rem;font-weight:700;color:var(--text-primary);margin:0 0 var(--spacing-3) 0}.profile-introduction{font-size:.875rem;color:var(--text-secondary);line-height:1.5;margin:0 0 var(--spacing-3) 0;max-width:400px;margin-left:auto;margin-right:auto}.profile-meta{color:var(--text-tertiary);font-size:.75rem}.join-date{display:inline-flex;align-items:center;gap:var(--spacing-1)}.follow-button{background:var(--color-primary-500);color:#fff;border:none;padding:var(--spacing-2-5) var(--spacing-6);border-radius:var(--radius-full);font-weight:600;font-size:.875rem;cursor:pointer;transition:all var(--transition-smooth);min-width:100px}.follow-button:hover{background:var(--color-primary-600);transform:translateY(-1px);box-shadow:var(--shadow-md)}.follow-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.follow-button.following{background:var(--color-slate-200);color:var(--text-secondary);border:1px solid var(--color-slate-300)}.follow-button.following:hover{background:var(--color-red-500);color:#fff;border-color:var(--color-red-500)}.follow-button.requested{background:var(--color-amber-100);color:var(--color-amber-700);border:1px solid var(--color-amber-300)}.follow-button.requested:hover{background:var(--color-amber-200)}.stats-container{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-4);margin-bottom:var(--spacing-6)}.stat-card{background:var(--bg-primary);border:1px solid var(--color-slate-200);border-radius:var(--radius-xl);padding:var(--spacing-4);text-align:center;cursor:pointer;transition:all var(--transition-smooth);box-shadow:var(--shadow-xs)}.stat-card:hover{background:var(--color-slate-50);transform:translateY(-2px);box-shadow:var(--shadow-md)}.stat-card.disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.stat-icon{font-size:1.5rem;margin-bottom:var(--spacing-2)}.stat-number{font-size:1.5rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-1)}.stat-label{font-size:.75rem;color:var(--text-tertiary);font-weight:500}.content-section{max-width:800px;margin:0 auto;padding:0 var(--spacing-4) var(--spacing-6)}.tab-navigation{display:flex;background:var(--bg-primary);border-radius:var(--radius-xl);padding:var(--spacing-1);margin-bottom:var(--spacing-6);border:1px solid var(--color-slate-200);box-shadow:var(--shadow-xs)}.tab-button{flex:1;background:none;border:none;padding:var(--spacing-3) var(--spacing-4);border-radius:var(--radius-lg);font-size:.875rem;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-smooth);display:flex;align-items:center;justify-content:center;gap:var(--spacing-2)}.tab-button:hover{color:var(--text-primary);background:var(--color-slate-50)}.tab-button.active{background:var(--color-primary-500);color:#fff;box-shadow:var(--shadow-sm)}.tab-icon{font-size:1rem}.tab-content{min-height:300px}.games-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--spacing-4)}.game-card{background:var(--bg-primary);border:1px solid var(--color-slate-200);border-radius:var(--radius-xl);padding:var(--spacing-4);transition:all var(--transition-smooth);cursor:pointer;box-shadow:var(--shadow-xs)}.game-card:hover{background:var(--color-slate-50);transform:translateY(-2px);box-shadow:var(--shadow-md)}.game-image{width:100%;height:120px;border-radius:var(--radius-lg);overflow:hidden;margin-bottom:var(--spacing-3);background:var(--color-slate-100)}.game-image img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.game-info{text-align:center}.game-name{font-size:.875rem;font-weight:600;color:var(--text-primary);margin:0 0 var(--spacing-1) 0}.game-category{font-size:.75rem;color:var(--text-tertiary);margin:0}.private-content{max-width:800px;margin:0 auto;padding:var(--spacing-12) var(--spacing-4)}.private-message{text-align:center;background:var(--bg-primary);border:1px solid var(--color-slate-200);border-radius:var(--radius-2xl);padding:var(--spacing-8);box-shadow:var(--shadow-sm)}.private-icon{font-size:3rem;margin-bottom:var(--spacing-4);opacity:.6}.private-message h3{font-size:1.25rem;font-weight:600;color:var(--text-primary);margin:0 0 var(--spacing-2) 0}.private-message p{color:var(--text-secondary);margin:0;line-height:1.5}.empty-state{text-align:center;padding:var(--spacing-8)}.empty-icon{font-size:3rem;margin-bottom:var(--spacing-4);opacity:.4}.empty-text{color:var(--text-secondary);font-size:.875rem;margin:0}.user-profile-loading,.user-profile-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:50vh;padding:var(--spacing-8);text-align:center}.user-profile-loading .loading-spinner{width:40px;height:40px;border:3px solid var(--color-slate-200);border-top:3px solid var(--color-primary-500);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:var(--spacing-4)}.user-profile-loading p{color:var(--text-secondary);margin:0}.user-profile-error h3{color:var(--text-primary);margin:0 0 var(--spacing-4) 0}.user-profile-error .back-button{background:var(--color-primary-500);color:#fff;border:none;padding:var(--spacing-2-5) var(--spacing-6);border-radius:var(--radius-full);font-weight:600;cursor:pointer;transition:all var(--transition-smooth)}.user-profile-error .back-button:hover{background:var(--color-primary-600);transform:translateY(-1px);box-shadow:var(--shadow-md)}@media (max-width: 768px){.stats-container{grid-template-columns:repeat(2,1fr);gap:var(--spacing-3)}.games-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--spacing-3)}.profile-card{padding:var(--spacing-4)}.profile-image{width:100px;height:100px}.tab-navigation{margin-bottom:var(--spacing-4)}.tab-button{padding:var(--spacing-2-5) var(--spacing-3);font-size:.8rem}}.search-results-container{min-height:100vh;background-color:#f9fafb}.search-header{background-color:#fff;border-bottom:1px solid #e0e0e0;padding:12px 16px;position:sticky;top:0;z-index:10}.header-content{display:flex;align-items:center;gap:12px}.back-button{background:none;border:none;font-size:20px;cursor:pointer;padding:8px;border-radius:50%;transition:background-color .2s;flex-shrink:0}.search-form{flex:1}.search-input-wrapper{display:flex;align-items:center;background-color:#f8f9fa;border:1px solid #e0e0e0;border-radius:24px;padding:8px 12px}.search-input{flex:1;border:none;background:none;outline:none;font-size:14px;padding:4px 8px}.search-input::-moz-placeholder{color:#999}.search-input::placeholder{color:#999}.search-button{background:none;border:none;font-size:16px;cursor:pointer;padding:4px;border-radius:50%;transition:background-color .2s}.search-button:hover{background-color:#e0e0e0}.tab-container{background-color:#fff;border-bottom:1px solid #e0e0e0;display:flex;padding:0 16px;overflow-x:auto}.tab-button{flex:1;background:none;border:none;padding:16px 12px;font-size:14px;font-weight:500;color:#666;cursor:pointer;position:relative;transition:color .2s;white-space:nowrap;min-width:80px}.search-content{padding:16px}.loading-state{text-align:center;padding:60px 20px}.loading-spinner{width:40px;height:40px;border:3px solid #f3f3f3;border-top:3px solid #007bff;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 16px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.results-list{display:flex;flex-direction:column;gap:12px}.result-item{background-color:#fff;border-radius:12px;padding:16px;display:flex;align-items:flex-start;gap:12px;cursor:pointer;transition:background-color .2s;box-shadow:0 1px 3px #0000001a}.result-item:hover{background-color:#f8f9fa}.result-image{flex-shrink:0}.result-img{width:60px;height:60px;border-radius:8px;-o-object-fit:cover;object-fit:cover}.user-avatar{width:60px;height:60px;border-radius:50%;background-color:#e0e0e0;display:flex;align-items:center;justify-content:center}.avatar-emoji{font-size:24px}.result-content{flex:1;min-width:0}.result-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:8px}.result-title{font-size:16px;font-weight:600;margin:0 8px 0 0;color:#333;flex:1}.result-type{font-size:12px;padding:2px 8px;border-radius:12px;font-weight:500}.result-type.club{background-color:#e3f2fd;color:#1976d2}.result-type.user{background-color:#f3e5f5;color:#7b1fa2}.result-type.post{background-color:#e8f5e8;color:#388e3c}.result-description{font-size:14px;color:#666;margin:0 0 8px;line-height:1.4}.result-meta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px}.meta-item{font-size:12px;color:#999}.result-tags{display:flex;flex-wrap:wrap;gap:4px}.tag{background-color:#f0f0f0;color:#666;padding:2px 6px;border-radius:8px;font-size:11px}.result-arrow{color:#ccc;font-size:16px;margin-top:2px}@media (max-width: 768px){.result-item{padding:12px}.result-img,.user-avatar{width:50px;height:50px}.avatar-emoji{font-size:20px}.result-title{font-size:14px}.result-description{font-size:13px}.tab-button{font-size:13px;padding:12px 8px}}.filter-screen-container{background-color:#f9fafb;min-height:100vh;padding-bottom:4rem}.filter-header{background-color:#fff;border-bottom:1px solid #e5e7eb;padding:1rem;position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between}.back-button{background:none;border:none;color:#6b7280;font-size:1rem;cursor:pointer;padding:.5rem;border-radius:.5rem;transition:all .2s}.back-button:active{background-color:#f3f4f6;transform:scale(.95)}.header-title{font-size:1.25rem;font-weight:600;color:#111827;margin:0}.reset-button{background:none;border:none;color:#ef4444;font-size:.875rem;font-weight:500;cursor:pointer;padding:.5rem;border-radius:.5rem;transition:all .2s}.reset-button:active{background-color:#fef2f2;transform:scale(.95)}.filter-content{padding:1rem}.filter-section{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;margin-bottom:1rem;overflow:hidden}.section-title{font-size:1rem;font-weight:600;color:#111827;margin:0;padding:1rem 1rem .5rem}.filter-options{padding:0 1rem 1rem;display:flex;flex-wrap:wrap;gap:.5rem}.filter-option{padding:.75rem 1rem;border:1px solid #e5e7eb;border-radius:.5rem;background-color:#fff;color:#374151;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s;text-align:center;flex-shrink:0}.filter-option:hover{border-color:#3b82f6}.filter-option.active{background-color:#3b82f6;color:#fff;border-color:#3b82f6}.filter-option:active{transform:scale(.95)}.selected-filters{background-color:#fff;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;margin-bottom:1rem;overflow:hidden}.selected-title{font-size:1rem;font-weight:600;color:#111827;margin:0;padding:1rem 1rem .5rem}.selected-tags{padding:0 1rem 1rem;display:flex;flex-wrap:wrap;gap:.5rem}.selected-tag{display:inline-flex;align-items:center;gap:.5rem;background-color:#eff6ff;color:#1e40af;padding:.5rem .75rem;border-radius:.5rem;font-size:.875rem;font-weight:500}.remove-tag{background:none;border:none;color:#1e40af;font-size:1rem;cursor:pointer;padding:0;width:1rem;height:1rem;display:flex;align-items:center;justify-content:center;transition:color .2s}.remove-tag:active{color:#dc2626}.no-filters{color:#6b7280;font-size:.875rem;font-style:italic}.filter-actions{position:fixed;bottom:0;left:0;right:0;background-color:#fff;border-top:1px solid #e5e7eb;padding:1rem;display:flex;gap:.75rem;z-index:100}.filter-actions .action-button{flex:1;padding:1rem;border-radius:.125rem!important;font-size:1rem!important;font-weight:600!important;cursor:pointer;transition:all .2s;border:none;text-align:center;min-height:3rem;display:flex;align-items:center;justify-content:center;box-sizing:border-box}.filter-actions .secondary-button{background-color:#fff!important;color:#374151!important;border:1px solid #e5e7eb!important}.filter-actions .secondary-button:active{background-color:#f3f4f6!important}.filter-actions .primary-button{background-color:#2563eb!important;color:#fff!important;box-shadow:0 2px 4px #2563eb66!important;border:1px solid #2563eb!important}.filter-actions .primary-button:active{background-color:#1d4ed8!important;transform:scale(.98)}.notifications-container{min-height:100vh;background-color:#f9fafb}.notifications-header{background-color:#fff;border-bottom:1px solid #e0e0e0;padding:12px 16px;position:sticky;top:0;z-index:10}.mark-read-button{background-color:#007bff;color:#fff;border:none;padding:6px 12px;border-radius:6px;font-size:12px;cursor:pointer;transition:background-color .2s}.mark-read-button:hover{background-color:#0056b3}.tab-container{background-color:#fff;border-bottom:1px solid #e0e0e0;display:flex;padding:0 16px}.tab-button{flex:1;background:none;border:none;padding:16px 12px;font-size:14px;font-weight:500;color:#666;cursor:pointer;position:relative;transition:color .2s}.tab-button.active{color:#007bff}.tab-button.active:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background-color:#007bff}.unread-badge{background-color:#ff4757;color:#fff;border-radius:10px;padding:2px 6px;font-size:10px;margin-left:4px}.notifications-content{padding:16px}.notifications-list{display:flex;flex-direction:column;gap:12px}.notification-item{background-color:#fff;border-radius:12px;padding:16px;display:flex;align-items:flex-start;gap:12px;cursor:pointer;transition:background-color .2s;box-shadow:0 1px 3px #0000001a;position:relative}.notification-item:hover{background-color:#f8f9fa}.notification-item.unread{background-color:#f0f8ff;border-left:4px solid #007bff}.notification-icon{width:40px;height:40px;border-radius:50%;background-color:#e0e0e0;display:flex;align-items:center;justify-content:center;flex-shrink:0}.icon-emoji{font-size:18px}.notification-content{flex:1;min-width:0}.notification-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:4px}.notification-title{font-size:14px;font-weight:600;margin:0 8px 0 0;color:#333;flex:1}.notification-time{font-size:12px;color:#999;white-space:nowrap}.notification-message{font-size:13px;color:#666;margin:0;line-height:1.4}.unread-indicator{position:absolute;top:16px;right:16px;width:8px;height:8px;background-color:#007bff;border-radius:50%}.notification-arrow{color:#ccc;font-size:16px;margin-top:2px}.empty-state{text-align:center;padding:60px 20px}.empty-icon{font-size:48px;margin-bottom:16px}.empty-title{font-size:16px;font-weight:600;color:#333;margin:0 0 8px}.empty-description{font-size:14px;color:#666;margin:0}@media (max-width: 768px){.notification-item{padding:12px}.notification-icon{width:36px;height:36px}.icon-emoji{font-size:16px}.notification-title{font-size:13px}.notification-message{font-size:12px}}.post-detail-container{min-height:100vh;background-color:#f9fafb}.post-detail-header{background-color:#fff;border-bottom:1px solid #e0e0e0;padding:12px 16px;position:sticky;top:0;z-index:10}.header-content{display:flex;align-items:center;justify-content:space-between}.back-button{background:none;border:none;font-size:20px;cursor:pointer;padding:8px;border-radius:50%;transition:background-color .2s}.back-button:hover{background-color:#f0f0f0}.header-title{font-size:18px;font-weight:600;margin:0;color:#333}.header-actions{display:flex;gap:8px}.action-button{background:none;border:none;font-size:18px;cursor:pointer;padding:8px;border-radius:50%;transition:background-color .2s}.action-button:hover{background-color:#f0f0f0}.post-content{background-color:#fff;margin:16px;border-radius:12px;overflow:hidden;box-shadow:0 1px 3px #0000001a}.post-header{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid #f0f0f0}.post-author{display:flex;align-items:center;gap:12px}.author-avatar{width:40px;height:40px;border-radius:50%;background-color:#e0e0e0;display:flex;align-items:center;justify-content:center;font-size:18px}.author-info{display:flex;flex-direction:column}.author-name{font-size:16px;font-weight:600;margin:0;color:#333}.post-location{font-size:12px;color:#666}.post-time{font-size:12px;color:#999}.post-body{padding:16px}.post-title{font-size:18px;font-weight:600;margin:0 0 12px;color:#333}.post-text{font-size:14px;line-height:1.6;color:#333;margin:0 0 16px}.post-image{margin:16px 0;border-radius:8px;overflow:hidden}.post-image img{width:100%;height:auto;display:block}.post-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.tag{background-color:#e3f2fd;color:#1976d2;padding:4px 8px;border-radius:12px;font-size:12px;font-weight:500}.post-actions{padding:16px;border-top:1px solid #f0f0f0}.action-buttons{display:flex;align-items:center;gap:16px}.action-btn{background:none;border:none;display:flex;align-items:center;gap:4px;font-size:16px;cursor:pointer;padding:8px;border-radius:8px;transition:background-color .2s;color:#666}.action-btn:hover{background-color:#f0f0f0}.action-btn.liked{color:#e91e63}.action-btn span{font-size:14px;font-weight:500}.comments-section{background-color:#fff;margin:16px;border-radius:12px;overflow:hidden;box-shadow:0 1px 3px #0000001a}.comments-title{font-size:16px;font-weight:600;margin:0;padding:16px;border-bottom:1px solid #f0f0f0;color:#333}.comments-list{padding:16px}.comment-item{display:flex;gap:12px;margin-bottom:16px}.comment-item:last-child{margin-bottom:0}.comment-avatar{width:32px;height:32px;border-radius:50%;background-color:#e0e0e0;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}.comment-content{flex:1;min-width:0}.comment-header{display:flex;align-items:center;gap:8px;margin-bottom:4px}.comment-author{font-size:14px;font-weight:500;color:#333}.comment-time{font-size:12px;color:#999}.comment-text{font-size:14px;line-height:1.4;color:#333;margin:0 0 8px}.comment-actions{display:flex;align-items:center;gap:12px}.comment-like{background:none;border:none;display:flex;align-items:center;gap:4px;font-size:12px;cursor:pointer;color:#666;transition:color .2s}.comment-like:hover,.comment-like.liked{color:#e91e63}.comment-reply{background:none;border:none;font-size:12px;color:#666;cursor:pointer;transition:color .2s}.comment-reply:hover{color:#333}.comment-input-container{padding:16px;border-top:1px solid #f0f0f0}.comment-input-wrapper{display:flex;gap:8px;align-items:center}.comment-input{flex:1;border:1px solid #e0e0e0;border-radius:20px;padding:8px 16px;font-size:14px;outline:none;transition:border-color .2s}.comment-input:focus{border-color:#007bff}.comment-submit{background-color:#007bff;color:#fff;border:none;padding:8px 16px;border-radius:20px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s}.comment-submit:hover:not(:disabled){background-color:#0056b3}.comment-submit:disabled{background-color:#ccc;cursor:not-allowed}@media (max-width: 768px){.post-content,.comments-section{margin:8px}.post-header,.post-body,.post-actions,.comments-list,.comment-input-container{padding:12px}.post-title{font-size:16px}.post-text{font-size:13px}.action-buttons{gap:12px}.action-btn{font-size:14px;padding:6px}}