.theme-toggle{background:var(--card-bg);border:1px solid var(--border-color);border-radius:20px;color:var(--text-color);cursor:pointer;font-size:1.2rem;height:40px;width:40px;display:flex;align-items:center;justify-content:center;transition:all .3s ease;box-shadow:0 2px 5px var(--shadow-color);margin-left:15px;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}.theme-toggle:hover{background:var(--cherry-blossom-light);transform:scale(1.1)}[data-theme=dark] .theme-toggle{background:var(--dark-card-bg);border-color:var(--dark-border-color);color:var(--dark-text-color)}[data-theme=dark] .theme-toggle:hover{background:var(--dark-bg-light)}.sidebar{width:250px;background-color:var(--card-bg);padding:2rem 1rem;display:flex;flex-direction:column;position:fixed;height:100%;border-right:1px solid var(--border-color);transition:transform .3s ease;z-index:100;box-shadow:2px 0 5px var(--shadow-color)}.sidebar-closed{transform:translate(-100%)}.sidebar-toggle-btn{position:fixed;top:15px;left:15px;z-index:101;background:var(--card-bg);border:1px solid var(--border-color);border-radius:5px;color:var(--text-color);font-size:1.5rem;width:40px;height:40px;display:none;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 5px var(--shadow-color);-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}.sidebar-toggle-btn.hidden{opacity:0;pointer-events:none;transform:scale(.8)}.sidebar-header{padding:0 1rem 2rem;text-align:center;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center}.brand{font-size:1.5rem;color:var(--primary-color);margin:0;font-weight:600;flex-grow:1}.sidebar-nav{display:flex;flex-direction:column;gap:1rem;padding-top:2rem}.sidebar-nav a{color:var(--text-color);text-decoration:none;padding:.75rem 1rem;border-radius:8px;transition:background-color .2s,color .2s;font-size:1.1rem;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-drag:none}.sidebar-nav a:hover{background-color:var(--cherry-blossom-light);color:var(--primary-color)}.sidebar-nav a.active{background-color:var(--cherry-blossom-light);color:var(--primary-color);font-weight:600;border-left:3px solid var(--secondary-color)}@media(max-width:768px){.sidebar{transform:translate(0)}.sidebar-closed{transform:translate(-100%)}.sidebar-toggle-btn{display:flex}.content-container{padding-left:0}}.home-page{text-align:center;padding:2rem 0}.home-header{margin-bottom:3rem}.home-header h1{font-size:3rem;color:var(--primary-color);margin-bottom:.5rem}.tagline{font-size:1.3rem;color:var(--accent-color)}.home-content{max-width:800px;margin:0 auto;text-align:left}.about-section{background:var(--card-bg);padding:2rem;border-radius:10px;border:1px solid var(--border-color);box-shadow:0 4px 8px var(--shadow-color)}.about-section h2{font-size:2rem;color:var(--primary-color);margin-top:0;margin-bottom:1.5rem;border-bottom:2px solid var(--border-color);padding-bottom:1rem}.about-section p{font-size:1.1rem;color:var(--text-color);line-height:1.7;margin-bottom:1rem}.projects-page{padding:20px 0}.projects-header{text-align:center;margin-bottom:40px}.projects-header h1{font-size:2.5rem;color:var(--secondary-color);margin-bottom:10px}.projects-category{margin-bottom:40px}.projects-category h2{font-size:1.8rem;color:var(--secondary-color);border-bottom:2px solid var(--border-color);padding-bottom:10px;margin-bottom:20px}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;margin-top:20px;justify-content:start;max-width:1200px;margin-left:0;margin-right:0;padding:0 20px;width:100%}.project-card{background:var(--card-bg);border-radius:10px;padding:25px;transition:transform .6s ease,box-shadow .6s ease;border:1px solid var(--border-color);cursor:pointer;display:flex;flex-direction:column;align-items:stretch;text-align:center;height:100%;box-shadow:0 4px 8px var(--shadow-color);max-width:350px;margin:0 auto;min-height:350px}.project-card:hover{transform:translateY(-5px);background:var(--card-bg);box-shadow:0 10px 25px var(--shadow-color);border-color:var(--secondary-color)}.project-image-placeholder{width:100%;height:150px;background-color:var(--cherry-blossom-light);border-radius:8px;margin-bottom:15px;object-fit:cover;border:1px solid var(--border-color);-webkit-user-drag:none;-webkit-touch-callout:none;pointer-events:none}.project-card h3{color:var(--primary-color);font-size:1.4rem;margin-top:0;margin-bottom:10px}.project-type{color:var(--accent-color);font-style:italic;margin:10px 0}.project-status{display:flex;justify-content:center;margin-top:auto}.status{padding:6px 12px;border-radius:20px;font-size:.9rem;font-weight:600}.status.active{background:#f5a9b833;color:var(--secondary-color);border:1px solid var(--secondary-color)}.status.in-development{background:#e8939f33;color:var(--accent-color);border:1px solid var(--accent-color)}.modal-overlay{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:var(--card-bg);padding:30px;border-radius:10px;width:90%;max-width:600px;position:relative;border:1px solid var(--border-color);box-shadow:0 10px 40px var(--shadow-color);max-height:90vh;overflow-y:auto}.modal-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border-color);padding-bottom:15px;margin-bottom:20px}.modal-header h2{color:var(--primary-color);margin:0;font-size:2rem}.close-button{background:var(--card-bg);border:1px solid var(--border-color);color:var(--text-color);font-size:1.5rem;cursor:pointer;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.close-button:hover{background:var(--cherry-blossom-light);color:var(--primary-color);border-color:var(--secondary-color)}.modal-body{text-align:left}.modal-image{width:100%;border-radius:5px;margin-bottom:20px;-webkit-user-drag:none;-webkit-touch-callout:none;pointer-events:none}.modal-body p{color:var(--text-color);line-height:1.6}.modal-body strong{color:var(--primary-color)}.modal-footer{display:flex;justify-content:flex-end;gap:15px;margin-top:30px;padding-top:15px;border-top:1px solid var(--border-color)}.modal-link,.modal-close-btn{padding:10px 20px;border-radius:5px;text-decoration:none;font-weight:600;cursor:pointer;transition:background-color .3s,color .3s}.modal-link{background:var(--secondary-color);color:var(--bg-color-light)}.modal-link:hover{background:var(--cherry-blossom-dark);color:var(--bg-color-light)}.modal-close-btn{background:var(--primary-color);color:var(--text-color);border:1px solid var(--border-color)}.modal-close-btn:hover{background:var(--bg-color-light)}@media(max-width:768px){.projects-page{padding:15px 0}.projects-header{margin-bottom:30px}.projects-header h1{font-size:2rem}.subtitle{font-size:1rem;padding:0 10px}.projects-category{margin-bottom:30px}.projects-category h2{font-size:1.5rem;padding-left:10px;padding-right:10px}.projects-grid{grid-template-columns:1fr;gap:20px;padding:0 10px}.project-card{width:100%;max-width:100%;margin:0;padding:20px;min-height:auto}.project-image-placeholder{height:120px;margin-bottom:12px}.project-card h3{font-size:1.2rem;margin-bottom:8px}.status{padding:5px 10px;font-size:.85rem}.modal-content{padding:20px;width:95%}.modal-header{padding-bottom:12px;margin-bottom:15px}.modal-header h2{font-size:1.5rem}.modal-footer{flex-direction:column;gap:10px}.modal-link,.modal-close-btn{width:100%;text-align:center}}.contact-page{padding:2rem 0}.contact-header{text-align:center;margin-bottom:3rem}.contact-header h1{font-size:2.5rem;color:var(--primary-color);margin-bottom:.5rem}.subtitle{font-size:1.2rem;color:var(--accent-color)}.contact-content{display:grid;grid-template-columns:1fr 1fr;gap:3rem;max-width:1000px;margin:0 auto;width:100%;padding:0 20px}.contact-info{background:var(--card-bg);padding:2rem;border-radius:10px;border:1px solid var(--border-color);box-shadow:0 4px 8px var(--shadow-color)}.contact-info h2{color:var(--primary-color);font-size:1.8rem;margin-top:0;margin-bottom:1.5rem;border-bottom:2px solid var(--border-color);padding-bottom:1rem}.contact-info p{color:var(--text-color);line-height:1.6;margin-bottom:1.5rem}.contact-info ul{list-style:none;padding:0;margin:0}.contact-info li{color:var(--text-color);font-size:1.1rem;margin-bottom:1rem;display:flex;align-items:center}.contact-info li i{color:var(--secondary-color);margin-right:1rem;font-size:1.3rem}.contact-form-container{background:var(--card-bg);padding:2rem;border-radius:10px;border:1px solid var(--border-color);box-shadow:0 4px 8px var(--shadow-color)}.contact-form-container h2{color:var(--primary-color);font-size:1.8rem;margin-top:0;margin-bottom:1.5rem}.contact-form .form-group{margin-bottom:1.5rem}.contact-form label{display:block;color:var(--text-color);margin-bottom:.5rem;font-size:1rem}.contact-form input,.contact-form textarea{width:100%;padding:.8rem;border:1px solid var(--border-color);background:var(--card-bg);color:var(--text-color);border-radius:5px;font-size:1rem}.contact-form input:focus,.contact-form textarea:focus{outline:none;border-color:var(--secondary-color)}.submit-button{background:var(--secondary-color);color:var(--bg-color-light);padding:.8rem 1.5rem;border:none;border-radius:5px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:background-color .3s}.submit-button:hover{background:var(--cherry-blossom-dark);color:var(--bg-color-light)}@media(max-width:768px){.contact-content{grid-template-columns:1fr}}.about-page{padding:30px 0}.about-header{text-align:center;margin-bottom:50px}.about-header h1{font-size:2.75rem;margin-bottom:15px}.subtitle{font-size:1.25rem;color:var(--accent-color);opacity:.9}.about-content{max-width:1200px;margin:0 auto}.credits-intro{text-align:center;margin-bottom:50px}.credits-intro p{font-size:1.15rem;line-height:1.7;color:var(--light-color);max-width:800px;margin:0 auto;opacity:.9}.discord-members h2{font-size:2.25rem;margin-top:40px;margin-bottom:40px;text-align:center}.members-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:30px;margin-bottom:60px}.member-card{background:var(--card-bg);border-radius:12px;padding:30px;border:1px solid var(--border-color);display:flex;transition:all var(--transition-speed) ease;box-shadow:0 4px 12px var(--shadow-color)}.member-card:hover{transform:translateY(-8px);box-shadow:0 10px 25px var(--shadow-color);border-color:var(--secondary-color)}.member-avatar{margin-right:25px;flex-shrink:0}.member-avatar img{width:70px;height:70px;border-radius:50%;object-fit:cover;border:2px solid var(--primary-color);background:var(--primary-color);display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:700;color:#fff}.avatar-placeholder{width:70px;height:70px;border-radius:50%;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));display:flex;align-items:center;justify-content:center;font-size:1.75rem;font-weight:700;color:#fff;border:2px solid var(--secondary-color)}.member-info{flex:1}.member-username{margin-top:0;margin-bottom:8px;font-size:1.4rem;color:var(--primary-color);font-weight:600}.member-role{color:var(--accent-color);font-style:italic;margin:5px 0;font-weight:500}.member-contribution{color:var(--light-color);line-height:1.6;margin:15px 0 0;opacity:.9}.join-community{text-align:center;margin-top:50px;padding:40px;background:var(--cherry-blossom-light);border-radius:12px;border:1px solid var(--border-color);box-shadow:0 4px 12px var(--shadow-color)}.join-community h2{font-size:2.25rem;margin-bottom:25px;color:var(--primary-color)}.join-community p{font-size:1.15rem;line-height:1.7;color:var(--light-color);max-width:800px;margin:0 auto 35px;opacity:.9}.discord-button{display:inline-flex;align-items:center;justify-content:center;padding:14px 35px;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:#fff;text-decoration:none;border-radius:30px;font-weight:600;transition:all var(--transition-speed) ease;border:none;font-size:1.1rem;box-shadow:0 4px 15px var(--shadow-color);cursor:pointer}.discord-button:hover{background:linear-gradient(135deg,var(--secondary-color),var(--accent-color));transform:translateY(-3px);box-shadow:0 8px 20px var(--shadow-color)}.discord-button svg{margin-right:10px}@media(max-width:768px){.about-header h1{font-size:2.25rem}.subtitle{font-size:1.1rem}.about-content{padding:0 15px}.member-card{flex-direction:column;text-align:center;padding:25px;align-items:center}.member-avatar{margin-right:0;margin-bottom:20px}.member-info{width:100%;text-align:center}.members-grid{grid-template-columns:1fr;gap:25px;padding:0 10px}.join-community{padding:30px 20px}.discord-button{padding:12px 25px;font-size:1rem}}.app-container{display:flex;min-height:100vh;height:100%;background-color:var(--bg-color-light);overscroll-behavior-y:none;overflow:hidden}.content-container{flex:1;display:flex;flex-direction:column;overflow-y:auto;padding-left:250px;background-color:var(--cherry-blossom-light);transition:padding-left .3s ease;overscroll-behavior-y:none;-webkit-overflow-scrolling:touch;height:100%}@media(max-width:768px){.content-container{padding-left:0}}.page-content{padding:2rem}@media(max-width:768px){.content-container{padding-left:0}.page-content{padding:1rem}}:root{--primary-color: #2c1810;--secondary-color: #d66b7c;--accent-color: #b85a6b;--text-color: #2c1810;--bg-color-light: #f9f4f0;--border-color: rgba(184, 90, 107, .4);--shadow-color: rgba(44, 24, 16, .2);--hover-color: #c8798a;--cherry-blossom-light: #f2e4e6;--cherry-blossom-dark: #a84a5f;--cherry-branch: #6b4a2f;--card-bg: #f9f4f0;--light-color: #a89a94;--transition-speed: .3s;--dark-primary-color: #f0f0f0;--dark-secondary-color: #f5a9b8;--dark-accent-color: #e8939f;--dark-text-color: #f0f0f0;--dark-bg-color: #1a1a2e;--dark-bg-light: #2c2c3e;--dark-border-color: rgba(240, 240, 240, .2);--dark-shadow-color: rgba(0, 0, 0, .5);--dark-hover-color: #ffe66d;--dark-cherry-blossom-light: #2c2c3e;--dark-cherry-blossom-dark: #f0a8b8;--dark-card-bg: #2c2c3e;--dark-light-color: #f0f0f0;font-family:Roboto,-apple-system,BlinkMacSystemFont,Segoe UI,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;line-height:1.6;font-weight:400;color-scheme:light dark;color:var(--text-color);background-color:var(--primary-color);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media(prefers-color-scheme:dark){:root:not([data-theme=light]):not([data-theme=dark]){--primary-color: var(--dark-primary-color);--secondary-color: var(--dark-secondary-color);--accent-color: var(--dark-accent-color);--text-color: var(--dark-text-color);--bg-color-light: var(--dark-bg-color);--border-color: var(--dark-border-color);--shadow-color: var(--dark-shadow-color);--hover-color: var(--dark-hover-color);--cherry-blossom-light: var(--dark-cherry-blossom-light);--cherry-blossom-dark: var(--dark-cherry-blossom-dark);--card-bg: var(--dark-card-bg);--light-color: var(--dark-light-color)}}[data-theme=dark]{--primary-color: var(--dark-primary-color);--secondary-color: var(--dark-secondary-color);--accent-color: var(--dark-accent-color);--text-color: var(--dark-text-color);--bg-color-light: var(--dark-bg-color);--border-color: var(--dark-border-color);--shadow-color: var(--dark-shadow-color);--hover-color: var(--dark-hover-color);--cherry-blossom-light: var(--dark-cherry-blossom-light);--cherry-blossom-dark: var(--dark-cherry-blossom-dark);--card-bg: var(--dark-card-bg);--light-color: var(--dark-light-color)}[data-theme=light]{--primary-color: #2c1810;--secondary-color: #d66b7c;--accent-color: #b85a6b;--text-color: #2c1810;--bg-color-light: #f9f4f0;--border-color: rgba(184, 90, 107, .4);--shadow-color: rgba(44, 24, 16, .2);--hover-color: #c8798a;--cherry-blossom-light: #f2e4e6;--cherry-blossom-dark: #a84a5f;--card-bg: #f9f4f0;--light-color: #a89a94}*{box-sizing:border-box}html{background-color:var(--bg-color-light);min-height:100vh;min-height:-webkit-fill-available;overscroll-behavior-y:none;-webkit-overflow-scrolling:touch;height:100%;overflow:hidden}body{margin:0;min-width:320px;min-height:100vh;min-height:-webkit-fill-available;overflow-x:hidden;background-color:var(--bg-color-light);overscroll-behavior-y:none;position:fixed;width:100%;height:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}#root{width:100%;height:100%;overflow:auto;overscroll-behavior-y:none;-webkit-overflow-scrolling:touch;background-color:var(--bg-color-light)}a{font-weight:500;color:var(--secondary-color);text-decoration:none}a:hover{color:var(--hover-color)}
