:root{--blur:blur(0px);--bg:#111;--accent:#fff;--text:#fff;--sidebar-bg:#181818;--card-bg:#181818}*{box-sizing:border-box;margin:0;padding:0}body{background-color:#000 !important;color:#fff !important;font-family:'Fira Mono','Consolas','monospace' !important}.sidebar{width:240px;background:linear-gradient(180deg,#181818,#101010);padding:2rem 1rem;display:flex;flex-direction:column;position:fixed;top:0;bottom:0;left:0;border-right:1px solid #2a2a2a;box-shadow:0 2px 8px rgba(0,0,0,0.3)}.sidebar-header{font-size:1.6rem;font-weight:bold;color:var(--accent);text-align:center;margin-bottom:2rem;border-bottom:1px solid #333;padding-bottom:1rem}.nav{display:flex;flex-direction:column;gap:1rem}.nav-link{color:var(--text);text-decoration:none;font-weight:600;padding:0.6rem 1rem;border-radius:6px;background-color:#1f1f1f;transition:background 0.3s ease,color 0.3s ease}.nav-link:hover{background-color:#2a2a2a;color:var(--accent)}.content{margin-left:240px;padding:2rem;flex:1}.section{margin-bottom:3rem}.section h2{color:var(--accent);font-size:1.75rem;margin-top:2rem;margin-bottom:0.5rem;padding-bottom:0}.card{background:var(--card-bg);padding:1.5rem;border-radius:12px;margin-bottom:1.5rem;box-shadow:0 2px 8px rgba(0,0,0,0.3);transition:transform 0.3s ease,box-shadow 0.3s ease}.card:hover{transform:translateY(-4px);box-shadow:0 2px 8px rgba(0,0,0,0.3)}.vpn-card{display:flex;gap:1rem;align-items:center}.card-icon img{width:48px;height:48px;object-fit:contain}.card-content h3{margin:0;font-size:1.25rem;color:var(--accent)}.card-content ul{margin-top:0.5rem;padding-left:1.25rem;font-size:0.95rem;line-height:1.5}@media (max-width:768px){.sidebar{position:relative;width:100%;flex-direction:row;overflow-x:auto;border-right:none;border-bottom:1px solid #333}.sidebar-header{display:none}.nav{flex-direction:row;justify-content:space-around;width:100%}.content{margin-left:0;padding:1rem}.vpn-card{flex-direction:column;align-items:flex-start}}.sidebar-header{font-size:2rem;font-weight:bold;color:var(--accent);text-align:center;margin-bottom:2rem;padding-bottom:1rem;text-shadow:0 0 3px rgba(102,204,255,0.3);letter-spacing:4px;text-transform:uppercase;border-bottom:1px solid #333}.contact-header{position:fixed;top:1rem;right:1.5rem;z-index:1000;font-size:0.95rem;font-weight:bold;color:var(--accent);text-shadow:0 0 3px rgba(102,204,255,0.3)}.contact-header a{color:var(--accent);text-decoration:none}.contact-header a:hover{text-decoration:underline}.card-icon img{width:80px;height:80px;object-fit:cover;border-radius:50%;border:2px solid var(--accent);background-color:#000}.card-icon img{width:80px;height:80px;object-fit:contain;background:transparent;border:none}.sidebar-header{font-size:2.2rem;font-weight:bold;color:var(--accent);text-align:center;margin-bottom:2rem;padding-bottom:1rem;text-shadow:0 0 3px rgba(102,204,255,0.3);letter-spacing:4px;text-transform:uppercase;border-bottom:1px solid #333;width:100%;display:block}.section,.card,.card-content,.section h2,.card-content h3,.card-content p,.card-content ul,.nav-link{text-shadow:0 0 3px rgba(102,204,255,0.3)}.sidebar-header{font-size:1.5rem;font-weight:700;color:var(--text);text-align:center;margin-bottom:1.5rem;letter-spacing:1px;text-shadow:0 0 3px rgba(102,204,255,0.3)}.contact-header{position:fixed;top:1rem;right:1.5rem;z-index:1000;font-size:1.1rem;font-weight:bold;color:var(--accent);text-shadow:0 0 3px rgba(102,204,255,0.3)}.contact-header a{color:var(--accent);text-decoration:none}.contact-header a:hover{text-decoration:underline}.astro-orange{color:var(--accent)}.card-icon img{width:80px;height:80px;object-fit:contain;background-color:transparent;border:none;display:block}.email-card{background:var(--card-bg);padding:1.5rem;border-radius:12px;margin-bottom:1.5rem;box-shadow:0 2px 8px rgba(0,0,0,0.3);text-shadow:0 0 3px rgba(102,204,255,0.3)}.email-card{display:flex;gap:1rem;align-items:center;background:var(--card-bg);padding:1.5rem;border-radius:12px;margin-bottom:1.5rem;box-shadow:0 2px 8px rgba(0,0,0,0.3);text-shadow:0 0 3px rgba(102,204,255,0.3)}.email-card .card-icon img{width:80px;height:80px;object-fit:contain;background:transparent;border:none}.browser-card{display:flex;gap:1rem;align-items:center;background:var(--card-bg);padding:1.5rem;border-radius:12px;margin-bottom:1.5rem;box-shadow:0 2px 8px rgba(0,0,0,0.3);text-shadow:0 0 3px rgba(102,204,255,0.3)}.browser-card .card-icon img{width:80px;height:80px;object-fit:contain;background:transparent;border:none}.os-card{display:flex;gap:1rem;align-items:center;background:var(--card-bg);padding:1.5rem;border-radius:12px;margin-bottom:1.5rem;box-shadow:0 2px 8px rgba(0,0,0,0.3);text-shadow:0 0 3px rgba(102,204,255,0.3)}.os-card .card-icon img{width:80px;height:80px;object-fit:contain;background:transparent;border:none}.logo{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:2.2rem;font-weight:900;text-align:center;margin:1rem 0;letter-spacing:1.5px;background:linear-gradient(90deg,var(--accent),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:glow-pulse 4s ease-in-out infinite;text-shadow:0 0 3px rgba(102,204,255,0.3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}@keyframes glow-pulse{0%,100%{text-shadow:0 0 3px rgba(102,204,255,0.3)}50%{text-shadow:0 0 3px rgba(102,204,255,0.3)}}50%{text-shadow:0 0 3px rgba(102,204,255,0.3)}}50%{text-shadow:0 0 3px rgba(102,204,255,0.3)}}.logo span{text-transform:none !important}.logo{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:2.2rem;font-weight:900;text-align:center;margin:1rem 0;letter-spacing:1.5px;background:linear-gradient(90deg,var(--accent),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:glow-pulse 4s ease-in-out infinite;text-shadow:0 0 3px rgba(102,204,255,0.3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}@keyframes glow-pulse{0%,100%{text-shadow:0 0 3px rgba(102,204,255,0.3)}50%{text-shadow:0 0 3px rgba(102,204,255,0.3)}}50%{text-shadow:0 0 3px rgba(102,204,255,0.3)}}50%{text-shadow:0 0 3px rgba(102,204,255,0.3)}}.logo span{text-transform:none !important}.windows-card{display:flex;gap:1rem;align-items:center;background:var(--card-bg,#1a1a1a);padding:1.5rem;border-radius:12px;margin-bottom:1.5rem;box-shadow:0 2px 8px rgba(0,0,0,0.3);text-shadow:0 0 3px rgba(102,204,255,0.3)}.windows-card .card-icon img{width:80px;height:80px;object-fit:contain;background:transparent;border:none}.search-card{display:flex;gap:1rem;align-items:center;background:var(--card-bg,#1a1a1a);padding:1.5rem;border-radius:12px;margin-bottom:1.5rem;box-shadow:0 2px 8px rgba(0,0,0,0.3);text-shadow:0 0 3px rgba(102,204,255,0.3)}.search-card .card-icon img{width:80px;height:80px;object-fit:contain;background:transparent;border:none}.messaging-card{display:flex;gap:1rem;align-items:center;background:var(--card-bg,#1a1a1a);padding:1.5rem;border-radius:12px;margin-bottom:1.5rem;box-shadow:0 2px 8px rgba(0,0,0,0.3);text-shadow:0 0 3px rgba(102,204,255,0.3)}.messaging-card .card-icon img{width:80px;height:80px;object-fit:contain;background:transparent;border:none}.cloud-card{display:flex;gap:1rem;align-items:center;background:var(--card-bg);padding:1.5rem;border-radius:12px;margin-bottom:1.5rem;box-shadow:0 2px 8px rgba(0,0,0,0.3);text-shadow:0 0 3px rgba(102,204,255,0.3)}.password-card{display:flex;gap:1rem;align-items:center;background:var(--card-bg);padding:1.5rem;border-radius:12px;margin-bottom:1.5rem;box-shadow:0 2px 8px rgba(0,0,0,0.3);text-shadow:0 0 3px rgba(102,204,255,0.3)}.nav-link{position:relative}.nav-link::before{content:"";position:absolute;left:0;top:20%;bottom:20%;width:4px;background:var(--accent);border-radius:2px;opacity:0.6;transition:opacity 0.3s ease}.nav-link:hover::before{opacity:1}.card-icon img{border-radius:50% !important;box-shadow:0 2px 8px rgba(0,0,0,0.3);padding:4px;background-color:transparent}.logo{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:2.2rem;font-weight:900;text-align:center;margin:1rem 0;letter-spacing:1.5px;background:linear-gradient(90deg,var(--accent),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:glow-pulse 4s ease-in-out infinite;text-shadow:0 0 3px rgba(102,204,255,0.3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}@keyframes glow-pulse{0%,100%{text-shadow:0 0 3px rgba(102,204,255,0.3)}50%{text-shadow:0 0 3px rgba(102,204,255,0.3)}}50%{text-shadow:0 0 3px rgba(102,204,255,0.3)}}50%{text-shadow:0 0 3px rgba(102,204,255,0.3)}}.logo span{text-transform:none !important}.astro-a,.astro-t{color:red;font-weight:900;text-shadow:0 0 3px rgba(102,204,255,0.3)}.astro-orange{color:var(--accent)}@keyframes glow{0%,100%{text-shadow:0 0 3px rgba(102,204,255,0.3)}50%{text-shadow:0 0 3px rgba(102,204,255,0.3)}}.slogan{font-size:0.75rem;margin-top:0.3rem;color:var(--accent);text-shadow:0 0 3px rgba(102,204,255,0.3)}.logo{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:2.2rem;font-weight:900;text-align:center;margin:1rem 0;letter-spacing:1.5px;background:linear-gradient(90deg,var(--accent),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:glow-pulse 4s ease-in-out infinite;text-shadow:0 0 3px rgba(102,204,255,0.3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}@keyframes glow-pulse{0%,100%{text-shadow:0 0 3px rgba(102,204,255,0.3)}50%{text-shadow:0 0 3px rgba(102,204,255,0.3)}}50%{text-shadow:0 0 3px rgba(102,204,255,0.3)}}50%{text-shadow:0 0 3px rgba(102,204,255,0.3)}}.nav-link{color:var(--text);text-decoration:none;font-weight:700;padding:0.7rem 1.2rem;border-radius:8px;background:linear-gradient(90deg,#2a2a2a,#1f1f1f);transition:all 0.3s ease;border:1px solid transparent;box-shadow:0 2px 8px rgba(0,0,0,0.3)}.nav-link:hover{background-color:#2a2a2a;color:var(--accent);transform:scale(1.05);border-color:var(--accent);box-shadow:0 2px 8px rgba(0,0,0,0.3)}:root[data-theme='orange']{--bg:#1e1f26;--accent:#ff8800;--text:#f5f5f5;--sidebar-bg:#181818;--card-bg:rgba(120,140,255,0.12);#1a1a1a}@media (max-width:768px){body{background-color:#1a1d3a;background-image:linear-gradient(to right,#1a1d3a 0%,#1e2355 30%,#1b1f3c 70%,#181c33 100%),radial-gradient(circle at 10% 40%,rgba(100,120,255,0.15),transparent 60%),radial-gradient(circle at 90% 70%,rgba(180,100,255,0.1),transparent 60%);background-size:cover;background-attachment:fixed;color:#eaf4ff;font-family:'Inter',sans-serif}.sidebar{position:relative;width:100%;height:auto;flex-direction:column;align-items:center;padding:1rem;border-right:none;border-bottom:1px solid #333;box-shadow:0 2px 8px rgba(0,0,0,0.3);z-index:1000}.logo{font-size:1.5rem;text-align:center;white-space:normal;word-break:break-word}.slogan{font-size:0.8rem;text-align:center}.nav{display:flex;flex-direction:column;align-items:center;width:100%;gap:0.4rem;margin-top:0.8rem}.nav-link{padding:0.6rem 1rem;font-size:1rem;width:100%;text-align:center}.content{margin-left:0;padding:1rem;width:100%}.card,.vpn-card,.email-card,.browser-card,.os-card,.windows-card,.search-card,.messaging-card,.cloud-card,.password-card{flex-direction:column !important;align-items:center;text-align:center;padding:1rem}.card-icon img{width:64px !important;height:64px !important;margin-bottom:0.5rem}.card-text,.card-content h3,.card-content ul{text-align:center}.contact-header{position:static;margin:1rem auto 0;text-align:center;font-size:0.9rem}.switch-container{justify-content:center;margin-top:0.5rem}.section h2{color:var(--accent);font-size:1.75rem;margin-top:2rem;margin-bottom:0.5rem;padding-bottom:0}.theme-switcher{top:0.5rem;right:0.5rem}}@media (max-width:768px){.nav{display:none;flex-direction:column;align-items:center;gap:0.5rem;background-color:var(--sidebar-bg);padding:1rem 0;width:100%}.nav.show{display:flex}.sidebar{padding-top:4rem;position:relative}}@media (max-width:768px){#hamburgerToggle{display:block;position:fixed;top:1rem;left:1rem;z-index:3000;background:none;border:none;font-size:2rem;color:#fff !important;background:#111 !important;border:1px solid #222 !important;box-shadow:none !important}.nav{display:none;flex-direction:column;align-items:center;background-color:var(--sidebar-bg);padding:1rem 0;width:100%}.nav.show{display:flex}.sidebar{padding-top:4rem}}#snowCanvas{position:fixed;top:0;left:0;z-index:0;pointer-events:none;width:100%;height:100%}.card-title{color:var(--accent);font-size:1.5rem;margin-top:2rem;margin-bottom:1rem}.calendar-card .card-icon img,.encryption-card .card-icon img{width:64px;height:64px;margin-right:1rem;filter:drop-shadow(0 0 5px var(--accent));border-radius:8px}.section-title{margin-top:3rem;margin-bottom:1.5rem;border-left:8px solid var(--accent);padding-left:1rem}.section-title h2{font-size:1.8rem;color:var(--accent)}.section-line{width:100%;height:2px;background-color:var(--accent);margin-top:0.5rem;margin-bottom:1.5rem}.themed-heading{color:var(--accent)}@media (max-width:768px){.bottom-nav{position:fixed;bottom:0;left:0;right:0;background-color:#0a0e1a;display:flex;overflow-x:auto;gap:1rem;padding:0.5rem 1rem;white-space:nowrap;border-top:1px solid var(--accent);z-index:1000}.bottom-nav a{color:var(--accent);font-size:0.85rem;font-weight:600;text-decoration:none;padding:0.5rem 0.75rem;display:inline-block;flex-shrink:0}.bottom-nav a:hover{text-decoration:underline}}@media (min-width:769px){.sidebar{background:#111 !important;color:#fff !important;border-right:1px solid #222 !important;box-shadow:none !important}.sidebar-header,.sidebar-title{color:#fff !important;background:none !important;text-shadow:none !important;border-bottom:1px solid #222 !important}.nav-link,.nav-link:hover,.nav-link:active{background:#111 !important;color:#fff !important;border:1px solid #222 !important;box-shadow:none !important;text-shadow:none !important;transition:background 0.2s}}@media (min-width:769px){.bottom-nav{display:none !important}}.sidebar{backdrop-filter:var(--blur)}.card{backdrop-filter:var(--blur)}@media (max-width:768px){.content{margin-left:0;padding:1rem}.card{width:100%;padding:1rem;font-size:1rem;box-sizing:border-box}.nav-link{text-align:center;font-size:1rem;padding:0.8rem}.sidebar{position:relative;width:100%;flex-direction:row;justify-content:space-around;padding:1rem}}}main{padding:1.2rem 1rem}.card-custom{background:var(--card-bg);border-radius:var(--radius);padding:1.5rem;font-size:1rem;color:var(--text);box-shadow:0 4px 12px rgba(0,0,0,0.2)}.card-custom h3{font-size:1.2rem;margin-bottom:0.5rem;color:var(--text)}.card-custom p,.card-custom li,.card-custom a{font-size:1rem;color:var(--text);line-height:1.5}.vpn-section,.email-section,.os-section,.browser-section,.tools-section,.messaging-section,.encryption-section,.resource-box,.card-custom{background:rgba(120,140,255,0.08);border:1px solid rgba(255,255,255,0.04);border-radius:18px;padding:1.5rem;color:var(--text);font-size:1rem;box-shadow:0 4px 18px rgba(0,0,0,0.2)}.vpn-section,.email-section,.os-section,.browser-section,.tools-section,.messaging-section,.encryption-section,.resource-box,.card-custom{background-color:rgba(120,120,255,0.12) !important;border:1px solid rgba(255,255,255,0.04);border-radius:16px;font-size:1rem;color:var(--text);padding:1.5rem;box-shadow:0 0 10px rgba(80,100,255,0.2)}header,.header-container,.top-header{background:transparent !important;background-color:transparent !important;box-shadow:none !important}.logo-text{background:linear-gradient(90deg,#a5d8ff,#cfaaff);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.sidebar{background:transparent !important;box-shadow:none !important}a.button:hover,button:hover{background-color:#4f6d99;transform:scale(1.04);box-shadow:0 0 18px rgba(156,215,255,0.3)}a.button,button{padding:0.6rem 1.4rem;background-color:#7c4dff;border:none;border-radius:12px;color:#ffffff;font-weight:600;cursor:pointer;text-decoration:none;box-shadow:0 0 12px rgba(140,90,255,0.25);transition:all 0.3s ease}a.button:hover,button:hover{background-color:#b388ff;transform:scale(1.06);box-shadow:0 0 22px rgba(200,140,255,0.4)}@media (max-width:768px){.logo-text{font-size:3.5rem !important;max-width:95vw;padding:0 1.2rem;text-shadow:0 0 10px rgba(180,130,255,0.35)}}button,a,a.button{padding:0.65rem 1.5rem;background-color:#8e44ec !important;color:#ffffff !important;border:none;border-radius:14px;font-weight:600;font-size:1rem;text-decoration:none;display:inline-block;box-shadow:0 4px 12px rgba(142,68,236,0.4);transition:all 0.3s ease}button:hover,a:hover,a.button:hover{background-color:#a66cff !important;box-shadow:0 6px 20px rgba(166,108,255,0.5);transform:translateY(-2px) scale(1.03)}button,a,a.button{padding:0.65rem 1.5rem;background-color:#5e35b1 !important;color:#ffffff !important;border:none;border-radius:14px;font-weight:600;font-size:1rem;text-decoration:none;display:inline-block;box-shadow:0 4px 10px rgba(94,53,177,0.3);transition:all 0.3s ease}button:hover,a:hover,a.button:hover{background-color:#7e57c2 !important;box-shadow:0 6px 18px rgba(126,87,194,0.4);transform:translateY(-2px) scale(1.03)}button,a,a.button{padding:0.65rem 1.5rem;background-color:#4527a0 !important;color:#ffffff !important;border:none;border-radius:14px;font-weight:600;font-size:1rem;text-decoration:none;display:inline-block;box-shadow:0 2px 8px rgba(69,39,160,0.3);transition:all 0.3s ease}button:hover,a:hover,a.button:hover{background-color:#5e35b1 !important;box-shadow:0 4px 14px rgba(94,53,177,0.4);transform:translateY(-1px) scale(1.02)}button,a,a.button{padding:0.6rem 1.4rem;background-color:#2e1b5f !important;color:#ffffff !important;border:none;border-radius:14px;font-weight:600;font-size:1rem;text-decoration:none;display:inline-block;box-shadow:0 0 6px rgba(80,70,150,0.2);transition:all 0.3s ease}button:hover,a:hover,a.button:hover{background-color:#3a247a !important;box-shadow:0 0 14px rgba(130,100,255,0.35);transform:translateY(-1px) scale(1.02)}.card-custom h3{font-size:1.3rem !important;font-weight:700;color:#c2b6ff !important;text-shadow:0 0 8px rgba(180,150,255,0.4)}@media (max-width:768px){section,.vpn-section,.card-custom,.email-section,.messaging-section,.encryption-section,.tools-section,.resource-box,.os-section,.browser-section{background-color:rgba(40,30,80,0.08) !important;box-shadow:none !important}button,a.button,a{background-color:#2e1b5f !important}}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(15,15,35,0.85);display:none;align-items:center;justify-content:center;z-index:9999;backdrop-filter:blur(5px)}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(18,18,32,0.88);display:none;align-items:center;justify-content:center;z-index:9999;backdrop-filter:blur(6px)}.modal-box{background-color:#1b1b2f;color:#eaefff;padding:2rem;max-width:90%;width:460px;border-radius:16px;box-shadow:0 0 30px rgba(140,90,255,0.4);font-family:'Inter',sans-serif;text-align:center;animation:fadeIn 0.5s ease-out;border:1px solid rgba(180,140,255,0.2)}.modal-box h2{font-size:1.7rem;margin-bottom:1rem;color:#c7baff;text-shadow:0 0 8px rgba(180,150,255,0.5)}.modal-box p{font-size:1rem;line-height:1.7;color:#ccd4ff}#modal-close-btn{margin-top:1.6rem;padding:0.7rem 1.6rem;background-color:#5e35b1;color:#ffffff;border:none;border-radius:10px;cursor:pointer;font-weight:600;font-size:1rem;transition:all 0.3s ease}#modal-close-btn:hover{background-color:#7e57c2;box-shadow:0 0 12px rgba(180,150,255,0.3)}@keyframes fadeIn{from{opacity:0;transform:scale(0.95)}to{opacity:1;transform:scale(1)}}@media (max-width:480px){.modal-box{padding:1.4rem;font-size:0.95rem}.modal-box h2{font-size:1.4rem}}@media (max-width:480px){.modal-box{padding:1.2rem;font-size:0.9rem;border-radius:12px;width:92%;max-height:90vh;overflow-y:auto}.modal-box h2{font-size:1.35rem;line-height:1.3}.modal-box p{font-size:0.95rem;line-height:1.6}#modal-close-btn{padding:0.6rem 1.2rem;font-size:0.95rem;border-radius:8px}}.modal-box{background:linear-gradient(135deg,#1b1b2f 0%,#241a38 100%);box-shadow:0 0 30px rgba(180,150,255,0.25)}@media (max-width:480px){.logo-text{font-size:3.5rem;text-shadow:0 0 12px rgba(180,130,255,0.4);letter-spacing:0.5px}.slogan{font-size:1.1rem;color:#d9d9ff;text-align:center;padding:0 1rem}}button,.modal-box button{background-color:#2f1e48;color:#ffffff;border:1px solid #5c4d7d;border-radius:10px;padding:0.7rem 1.2rem;font-size:1rem;transition:background 0.3s ease}button:hover,.modal-box button:hover{background-color:#443264}.card-custom h3{font-size:1.4rem;text-shadow:0 0 8px rgba(150,100,255,0.3);color:#c9b3ff}.card-custom p{font-size:1rem;line-height:1.4;color:#e0def2}.main-header{text-align:center;margin:2rem 0 1.5rem}.privacy-banner{font-size:2.8rem;font-weight:900;color:var(--accent);text-transform:uppercase;letter-spacing:2px;text-shadow:0 0 8px rgba(0,172,193,0.5),0 0 20px rgba(0,172,193,0.3);animation:glow-header 3s ease-in-out infinite}.banner-icon{width:64px;height:64px;display:block;margin:0 auto 0.5rem;filter:drop-shadow(0 0 4px rgba(0,172,193,0.4))}@keyframes glow-header{0%,100%{text-shadow:0 0 6px rgba(0,172,193,0.4),0 0 18px rgba(0,172,193,0.3)}50%{text-shadow:0 0 14px rgba(0,172,193,0.8),0 0 28px rgba(0,172,193,0.5)}}@media (max-width:768px){.burger-button{position:fixed;top:1rem;left:1rem;z-index:9999;background:none;border:none;font-size:2rem;color:#fff !important;background:#111 !important;border:1px solid #222 !important;box-shadow:none !important}.mobile-sidebar{position:fixed;top:0;left:0;height:100%;width:260px;background:#111 !important;color:#fff !important;border-right:1px solid #222 !important;box-shadow:none !important;padding-top:4rem;display:flex;flex-direction:column;transform:translateX(-100%);transition:transform 0.3s ease-in-out;z-index:9998}.mobile-sidebar.open{transform:translateX(0)}.mobile-sidebar a{color:#fff !important;padding:1rem;border-bottom:1px solid #333;text-decoration:none;font-weight:600;background:#181818 !important;color:#fff !important;border:1px solid #222 !important;box-shadow:none !important;border-radius:6px !important;transition:background 0.2s}.mobile-sidebar a:hover{background:#222 !important;color:#fff !important}}.burger-button,.mobile-sidebar{display:none}@media (max-width:768px){.burger-button,.mobile-sidebar{display:block}}.burger-button,.burger-button:active,.burger-button:focus{background:#000 !important;color:#fff !important;border:2px solid #fff !important;box-shadow:none !important;outline:none !important;transition:background 0.2s,color 0.2s,border 0.2s}@media (max-width:768px){section{padding:2rem 1.2rem}section h2{font-size:1.6rem;margin-bottom:1rem;text-align:center}section p,section li{font-size:1rem;line-height:1.6}.tool{padding:1rem;margin-bottom:1.5rem;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.3)}.tool h3{font-size:1.2rem;margin-bottom:0.5rem}.tool p{font-size:0.95rem}.button{font-size:1rem;padding:0.6rem 1.2rem;margin-top:1rem}.tools-grid{display:block}.tools-grid .tool{margin-bottom:2rem}}@media (max-width:768px){.burger-button{font-size:1.4rem;padding:0.3rem 0.6rem;top:0.8rem;left:0.8rem}.mobile-sidebar{width:200px;padding-top:3.5rem}.mobile-sidebar a{font-size:0.9rem;padding:0.8rem 1rem}}@media (max-width:768px){.sidebar-header{display:flex;justify-content:space-between;align-items:center;padding:0 1rem 1rem 1rem;margin-bottom:1rem;border-bottom:1px solid #333}.sidebar-title{font-size:1.1rem;font-weight:bold;color:#fff !important;background:none !important;text-shadow:none !important}.sidebar-icon{width:20px;height:20px;filter:drop-shadow(0 0 4px rgba(0,172,193,0.6))}}@media (max-width:768px){.mobile-sidebar{width:280px;background-color:#252525}.mobile-sidebar a{background-color:transparent;color:#f5f5f5;font-weight:600;border-bottom:1px solid #3a3a3a;transition:background 0.3s ease,color 0.3s ease}.mobile-sidebar a:hover{background-color:rgba(0,172,193,0.1);color:var(--accent)}}@media (max-width:768px){.mobile-sidebar{padding-top:3.5rem;gap:0}.mobile-sidebar a{display:block;width:100%;font-size:0.95rem;padding:1rem 1.2rem;margin:0;text-align:left;border-bottom:1px solid #333;line-height:1.4;word-break:break-word}.mobile-sidebar a:last-child{border-bottom:none}.sidebar-title{font-size:1.15rem;letter-spacing:0.5px}}@media (max-width:768px){.sidebar-links{list-style:none;padding:0;margin:0}.sidebar-links li{margin-bottom:0.5rem}.sidebar-links a{display:block;font-size:0.95rem;font-weight:600;padding:0.75rem 1rem;color:#f0f0f0;text-decoration:none;border-bottom:1px solid #333;background-color:transparent;transition:background 0.3s ease,color 0.3s ease}.sidebar-links a:hover{background-color:rgba(0,172,193,0.08);color:var(--accent)}}@media (max-width:768px){.mobile-sidebar a{display:block;width:calc(100% - 2rem);margin:0.5rem auto;padding:0.8rem 1rem;background-color:#2a2a2a;border-radius:6px;border:1px solid #444;font-size:1rem;font-weight:600;text-align:center;transition:all 0.2s ease-in-out;box-shadow:0 1px 3px rgba(0,0,0,0.3)}.mobile-sidebar a:hover{background-color:#00acc1;color:white;border-color:#00acc1;box-shadow:0 2px 6px rgba(0,172,193,0.3)}}@media (max-width:768px){.mobile-sidebar{overflow-y:auto;padding-bottom:2rem;scrollbar-width:thin}.sidebar-header{padding:0.5rem 1rem 1rem 1rem}.sidebar-title{font-size:1.25rem}.sidebar-icon{width:26px;height:26px}.mobile-sidebar a{background-color:#2b2b2b;border:1px solid #444;border-radius:8px;margin:0.6rem auto;padding:1rem 1.2rem;font-size:1.05rem;width:calc(100% - 2rem);box-shadow:0 2px 5px rgba(0,0,0,0.25);text-align:center}.mobile-sidebar a:hover{background-color:#00acc1;color:white;box-shadow:0 3px 8px rgba(0,172,193,0.35);border-color:#00acc1}}@media (max-width:768px){.sidebar-title{font-size:1.4rem;font-weight:700;letter-spacing:0.6px}.sidebar-icon{width:32px;height:32px}.mobile-sidebar a{display:block;width:calc(100% - 2rem);margin:0.7rem auto;padding:1rem 1.2rem;font-size:1.1rem;font-weight:600;background:linear-gradient(145deg,#2d2d2d,#1c1c1c);border-radius:10px;border:1px solid #444;color:#f0f0f0;text-align:center;box-shadow:0 4px 10px rgba(0,0,0,0.3);transition:all 0.25s ease-in-out}.mobile-sidebar a:hover{background:linear-gradient(145deg,#00bccd,#0095a5);color:white;border-color:#00acc1;box-shadow:0 5px 14px rgba(0,172,193,0.4)}}@media (max-width:768px){.mobile-sidebar{background-color:#121417;border-right:1px solid #2c2f33}.mobile-sidebar a{background-color:#1a1d20;color:#f0f0f0;border:1px solid #2b2e32;font-size:1.05rem;font-weight:600;border-radius:8px;box-shadow:0 3px 8px rgba(0,0,0,0.3)}.mobile-sidebar a:hover{background-color:var(--accent);color:#ffffff;border-color:var(--accent);box-shadow:0 4px 12px rgba(0,172,193,0.4)}.sidebar-title{color:var(--accent);font-size:1.4rem;font-weight:700}.sidebar-icon{width:32px;height:32px;filter:drop-shadow(0 0 4px rgba(0,172,193,0.6))}}@media (max-width:768px){.mobile-sidebar{background:linear-gradient(145deg,#0f1115,#1b1e22);border-right:1px solid #2c2f33}.mobile-sidebar a{background-color:rgba(255,255,255,0.02);backdrop-filter:blur(4px)}.mobile-sidebar a:hover{background-color:var(--accent);color:#fff;border-color:var(--accent)}}@media (max-width:768px){.mobile-sidebar{background-color:#1a1d3a;background-image:linear-gradient(to right,#1a1d3a 0%,#1e2355 30%,#1b1f3c 70%,#181c33 100%),radial-gradient(circle at 10% 40%,rgba(100,120,255,0.15),transparent 60%),radial-gradient(circle at 90% 70%,rgba(180,100,255,0.1),transparent 60%);background-size:cover;background-attachment:fixed}}@media (max-width:768px){.mobile-sidebar a{background:linear-gradient(135deg,#1f4fff,#00c2ff);color:#fff;border:none;box-shadow:0 4px 12px rgba(0,192,255,0.25);border-radius:10px;font-size:1.05rem;padding:1rem 1.2rem;margin:0.7rem auto;width:calc(100% - 2rem);font-weight:600;text-align:center;transition:all 0.3s ease-in-out}.mobile-sidebar a:hover{background:linear-gradient(135deg,#00c2ff,#1f4fff);box-shadow:0 6px 16px rgba(0,192,255,0.35)}.tool{margin-bottom:2.2rem;padding:1.2rem}.tools-grid{display:block}}@media (max-width:768px){.mobile-sidebar a{background:linear-gradient(135deg,#1535a3,#007a99);color:#ffffff;border:none;box-shadow:0 3px 10px rgba(0,128,192,0.25)}.mobile-sidebar a:hover{background:linear-gradient(135deg,#007a99,#1535a3);box-shadow:0 5px 14px rgba(0,128,192,0.35)}}@media (max-width:768px){section{padding:1rem 1rem !important;margin-bottom:1.5rem !important}.tool{width:100% !important;margin-bottom:1.2rem !important;padding:1rem !important;font-size:1rem !important}.tool h3{font-size:1.1rem !important}.tool p{font-size:0.95rem !important}}@media (max-width:768px){body{background:#000 !important;background-color:#000 !important;background-image:none !important}.mobile-sidebar{background:#000 !important;color:#fff !important;border-right:1px solid #222 !important}}.logo,.logo-text,.astro-a,.astro-t{color:#fff !important;background:none !important;-webkit-background-clip:unset !important;-webkit-text-fill-color:unset !important;font-weight:900 !important;text-shadow:0 0 12px #fff,0 0 2px #fff !important;animation:none !important}
body, .content, .section, .card, .card-content, .tool-category, .sidebar, .sidebar-links, .home-intro-text, .astro-ai-bubble, .astro-ai-chat-history, .astro-ai-container {
  user-select: none;
  cursor: default;
}
input, textarea, select, [contenteditable="true"] {
  user-select: text;
  cursor: text;
}
button, a, .burger-button, .auth-btn, .sidebar-auth-btn, svg {
  user-select: none !important;
  cursor: pointer !important;
}


.search-result-large {
  font-size: 1.25em;
  padding: 0.5em 0;
  line-height: 1.7;
}
@media (max-width: 600px) {
  .search-result-large {
    font-size: 1em;
    padding: 0.3em 0;
    word-break: break-word;
  }
}
@media (max-width: 768px) {
  .auth-container {
    display: none !important;
  }
  .mobile-auth-actions {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    margin: 0.7rem 0 0.7rem 0;
    align-items: stretch;
  }
  .sidebar-auth-btn {
    font-size: 1.85rem !important;
    padding: 2.7rem 1.5rem !important;
    border-radius: 22px !important;
    background: linear-gradient(135deg,#1f4fff,#00c2ff) !important;
    color: #fff !important;
    border: none !important;
    box-shadow: 0 10px 28px rgba(0,192,255,0.32) !important;
    font-weight: 900 !important;
    margin: 0.5rem 0 !important;
    letter-spacing: 2px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .sidebar-auth-btn .auth-icon {
    font-size: 1.3em;
    margin-right: 0.3em;
  }
  .sidebar-auth-btn:hover {
    background: linear-gradient(135deg,#00c2ff,#1f4fff);
    color: #fff;
  }
  #mobileUserInfo {
    color: var(--accent);
    font-size: 1.15rem;
    font-weight: 700;
    text-align: center;
    margin: 0.7rem 0 0.3rem 0;
    text-shadow: 0 0 8px var(--accent);
    display: block;
  }
}
@media (max-width: 768px) {
  .mobile-auth-actions .sidebar-auth-btn {
    font-size: 0.98rem !important;
    padding: 0.7rem 0.9rem !important;
    border-radius: 7px !important;
    background: #000 !important;
    color: #fff !important;
    border: 2px solid #fff !important;
    box-shadow: none !important;
    font-weight: 700 !important;
    margin: 0.18rem 0 !important;
    letter-spacing: 0.7px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-transform: uppercase !important;
    transition: background 0.2s, color 0.2s, border 0.2s;
  }
  .mobile-auth-actions .sidebar-auth-btn:hover {
    background: #222 !important;
    color: #fff !important;
    border-color: #00c2ff !important;
  }
}
.privacy-policy-section h3 {
  font-size: 1.45em;
  color: var(--accent);
  font-weight: 800;
  text-shadow: 0 2px 8px #0008, 0 0 2px var(--accent);
  letter-spacing: 0.03em;
  margin-top: 1.1em;
  margin-bottom: 0.3em;
  display: flex;
  align-items: center;
  gap: 0.5em;
}


.privacy-policy-section {
  background: #000 !important;
}
.privacy-policy-section ul {
  list-style: none;
  padding-left: 0;
}
.privacy-policy-section li {
  margin-bottom: 1.1em;
}


.dns-lookup-section {
  background: #000 !important;
  max-width: 900px;
  margin: 2.5rem auto 2.5rem auto;
  border-radius: 14px;
  border: 2px solid #232136;
  box-shadow: 0 2px 18px #0003;
  padding: 2.5rem 2vw 2.5rem 2vw;
}

.dns-lookup-section .search-tool-container {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin-top: 2rem;
  max-width: none;
  box-sizing: border-box;
  position: relative;
}
.dns-lookup-section .search-form {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-bottom: 1rem;
}
.dns-lookup-section .search-field {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}
.dns-lookup-section .search-field label {
  color: #fff;
  font-weight: 600;
  font-size: 1rem;
  font-family: 'Courier New', monospace;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.dns-lookup-section .search-input-container {
  position: relative;
  display: flex;
  align-items: center;
}
.dns-lookup-section input[type="text"] {
  padding: 1rem 3rem 1rem 1.2rem;
  border: 2px solid #333;
  border-radius: 6px;
  background: #111;
  color: #00ff00;
  font-size: 1.1rem;
  font-family: 'Courier New', monospace;
  width: 100%;
  transition: all 0.3s ease;
}
.dns-lookup-section input[type="text"]:focus {
  outline: none;
  border-color: #00ff00;
  box-shadow: 0 0 10px rgba(0, 255, 0, 0.3);
}
.dns-lookup-section input[type="text"]::placeholder {
  color: #666;
  font-style: italic;
}
.dns-lookup-section select {
  margin-left: 0.5em;
  padding: 0.7em 1.2em;
  border-radius: 6px;
  border: 2px solid #333;
  background: #181828;
  color: #fff;
  font-size: 1.1rem;
  font-family: 'Courier New', monospace;
  font-weight: 600;
  transition: all 0.3s ease;
}
.dns-lookup-section .search-button {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  background: #000;
  color: #fff;
  border: 2px solid #000;
  border-radius: 4px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0;
  padding: 0;
  transition: all 0.3s ease;
}
.dns-lookup-section .search-button:hover {
  background: #000;
  color: #fff;
  border: 2px solid #000;
  transform: translateY(-50%) scale(1.05);
}
.dns-lookup-section .search-button:active {
  transform: translateY(-50%) scale(0.95);
}
.dns-lookup-section .search-button svg {
  width: 18px;
  height: 18px;
}
.dns-lookup-section #dns-lookup-results {
  margin-top: 1.5rem;
  padding: 1.5rem;
  background: rgba(0, 0, 0, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  height: auto;
  width: 100%;
  display: none;
  backdrop-filter: blur(10px);
  max-width: none;
  box-sizing: border-box;
  position: relative;
}
.dns-lookup-section #dns-lookup-results.show {
  display: block;
  animation: fadeIn 0.5s ease-in-out;
}


.dns-lookup-section .section-line {
  width: 100%;
  height: 2px;
  background-color: var(--accent);
  margin-top: 0.5rem;
  margin-bottom: 1.5rem;
  border-radius: 2px;
}


.chat-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #232136;
  color: #fff;
  font-weight: 700;
  font-size: 1em;
  margin-right: 0.7em;
  box-shadow: 0 1px 4px #0005;
  border: 2px solid var(--accent);
  user-select: none;
}

.chat-avatar-img {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  margin-right: 0.7em;
  box-shadow: 0 1px 4px #0005;
  border: 2px solid var(--accent);
  user-select: none;
}


.chat-msg-header {
  display: flex;
  align-items: center;
  gap: 0.3em;
  margin-bottom: 0.1em;
}


.delete-btn {
  background: transparent;
  border: none;
  color: #ff4444;
  font-size: 1.3em;
  margin-left: 0.5em;
  cursor: pointer;
  border-radius: 50%;
  padding: 0 0.3em;
  transition: background 0.15s;
}
.delete-btn:hover {
  background: #2a0000;
  color: #fff;
}


.h-captcha {
  display: flex;
  justify-content: center;
  margin: 1rem 0;
}
.shmekera-gradient {
  font-weight: 900;
  background: linear-gradient(270deg, #ffe066, #ff8800, #ff2222, #00ff00, #0088ff, #ff00ff, #ffff00, #ff8800, #ffe066);
  background-size: 800% 800%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
  font-size: 1.1em;
  letter-spacing: 1px;
  animation: shmekera-gradient-anim 4s ease-in-out infinite;
}
@keyframes shmekera-gradient-anim {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}


#chat-rules-btn {
  background: #444 !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 2px 8px #0003 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: inherit !important;
  font-weight: 900 !important;
  font-size: 1.3em !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  line-height: 1 !important;
  padding: 0 !important;
}
#chat-rules-btn:hover, #chat-rules-btn:focus {
  background: #666 !important;
  color: #fff !important;
}
#chat-rules-modal > div {
  border: 2px solid #000 !important;
}
#close-chat-rules {
  background: #000 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 50% !important;
  width: 36px !important;
  height: 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1.7em !important;
}
#close-chat-rules:hover, #close-chat-rules:focus {
  background: #222 !important;
  color: #fff !important;
}

@media (max-width: 600px) {
  .chat-outer-container {
    height: 500px !important;
    min-height: 350px !important;
  }
}

#profileModal .modal-box > #closeProfileModal,
#profileModal #closeProfileModal,
#closeProfileModal {
  background: #444 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 50% !important;
  width: 36px !important;
  height: 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1.7em !important;
  position: absolute !important;
  top: 0.7em !important;
  right: 1em !important;
  box-shadow: 0 1px 6px #0003 !important;
  transition: background 0.2s, color 0.2s !important;
  z-index: 10 !important;
}
#profileModal .modal-box > #closeProfileModal:hover,
#profileModal #closeProfileModal:hover,
#closeProfileModal:hover,
#profileModal .modal-box > #closeProfileModal:focus,
#profileModal #closeProfileModal:focus,
#closeProfileModal:focus {
  background: #888 !important;
  color: #fff !important;
}

.users-list {
  background: #000;
  border: 1.5px solid #232136;
  border-radius: 7px;
  box-shadow: 0 2px 18px #000a;
  padding: 0.7em 0.7em;
  margin: 1.5em auto 2em auto;
  max-width: 100vw;
  width: 100%;
  min-height: 120px;
  font-family: 'JetBrains Mono', 'Fira Mono', 'Consolas', monospace;
  color: #fff;
  font-size: 1.08em;
}
.users-list .user-row {
  display: flex;
  align-items: center;
  gap: 1.2em;
  padding: 0.38em 0.7em 0.38em 0.7em;
  border-bottom: 1px solid #232136;
  transition: background 0.18s;
  width: 100%;
  box-sizing: border-box;
}
.users-list .user-row:last-child {
  border-bottom: none;
}
.users-list .user-row:hover {
  background: #181818;
}
.users-list .user-link {
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  font-size: 1.08em;
  letter-spacing: 0.5px;
  font-family: inherit;
  transition: none;
  display: block;
  width: 100%;
}
.users-list .user-link:hover {
  color: #fff;
  background: none;
}
.users-list .user-date {
  margin-left: auto;
  color: #888;
  font-size: 0.98em;
  font-family: inherit;
  white-space: nowrap;
}
.users-list a,
.users-list button,
.users-list .auth-btn,
.users-list .user-link {
  background: none !important;
  color: #fff !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  font-family: inherit !important;
  transition: none !important;
}
.users-list a:hover,
.users-list button:hover,
.users-list .auth-btn:hover,
.users-list .user-link:hover {
  transform: none !important;
  transition: none !important;
  box-shadow: none !important;
  border: none !important;
}
.users-list .user-row.admin-row {
  background: #7a6500 !important;
  color: #fff !important;
  border: none !important;
}
.users-list .user-row.admin-row:hover {
  background: #7a6500 !important;
  color: #fff !important;
}
.users-list .user-row.user-row-user {
  background: #181818 !important;
  color: #fff !important;
  border: none !important;
}
.users-list .user-row.user-row-user:hover {
  background: #232136 !important;
  color: #fff !important;
}
@media (max-width: 600px) {
  .users-list {
    padding: 0.3em 0.1em;
    font-size: 0.98em;
    border-radius: 4px;
    margin: 0.7em 0.1em 1em 0.1em;
    min-width: 0;
  }
  .users-list .user-row,
  .users-list .user-row.user-row-user,
  .users-list .user-row.admin-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 0.3em !important;
    padding: 0.8em 0.6em !important;
    font-size: 1em !important;
    border-radius: 6px !important;
    margin-bottom: 0.8em !important;
    min-width: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .users-list .user-link {
    font-size: 1.15em !important;
    font-weight: 800 !important;
    padding: 0.3em 0 !important;
    margin-bottom: 0.2em !important;
    width: 100% !important;
    text-align: left !important;
    word-break: break-all !important;
    border-bottom: 1px solid rgba(255,255,255,0.1) !important;
  }
  .users-list .user-date,
  .users-list .user-views {
    font-size: 1em !important;
    color: #aaa !important;
    margin: 0.15em 0 !important;
    text-align: left !important;
    width: 100% !important;
    display: block !important;
    padding: 0.1em 0 !important;
  }
  .users-list .user-date::before {
    content: "Joined: ";
    font-weight: 600;
    color: #888;
  }
  .users-list .user-views::before {
    content: "Views: ";
    font-weight: 600;
    color: #888;
  }
  
  
  #profileModal .modal-box {
    max-width: 95vw !important;
    max-height: 85vh !important;
    overflow-y: auto !important;
    padding: 1rem !important;
    margin: 1rem !important;
    font-size: 0.9rem !important;
  }
  
  #profileModal .modal-box h2 {
    font-size: 1.1rem !important;
    margin-bottom: 0.8rem !important;
  }
  
  #profileModal .profile-pic-container {
    width: 60px !important;
    height: 60px !important;
    margin-bottom: 0.2rem !important;
  }
  
  #profileModal #profileInfoBox {
    gap: 0.2rem !important;
    margin-bottom: 0.5rem !important;
  }
  
  #profileModal #profileUsername {
    font-size: 1rem !important;
  }
  
  #profileModal #profileJoined,
  #profileModal #profileViews {
    font-size: 0.85rem !important;
  }
  
  #profileModal hr {
    margin: 1rem 0 0.5rem 0 !important;
  }
  
  #profileModal #changePasswordSection {
    max-width: 280px !important;
  }
  
  #profileModal #changePasswordSection h3 {
    font-size: 1rem !important;
    margin-bottom: 0.5rem !important;
  }
  
  #profileModal #changePasswordForm input {
    padding: 0.4rem 0.6rem !important;
    font-size: 0.9rem !important;
  }
  
  #profileModal #changePasswordBtn {
    padding: 0.5rem !important;
    font-size: 0.9rem !important;
  }
  
  #profileModal #changePasswordMsg {
    font-size: 0.85rem !important;
  }
  
  
  #profileModal .modal-box {
    background: linear-gradient(135deg, #1a1a1a 0%, #0f0f0f 100%) !important;
    border: 2px solid #333 !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.8) !important;
  }
  
  #profileModal .profile-pic-container {
    border: 3px solid var(--accent) !important;
    box-shadow: 0 0 15px rgba(255,255,255,0.2) !important;
  }
  
  #profileModal #profileUsername {
    text-shadow: 0 0 8px var(--accent) !important;
  }
  
  #profileModal #changePasswordForm input {
    transition: all 0.3s ease !important;
  }
  
  #profileModal #changePasswordForm input:focus {
    box-shadow: 0 0 10px rgba(255,255,255,0.2) !important;
    transform: scale(1.02) !important;
  }
  
  #profileModal #changePasswordBtn {
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 12px rgba(255,255,255,0.1) !important;
  }
  
  #profileModal #changePasswordBtn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(255,255,255,0.2) !important;
  }
  
 
  #profileModal .modal-box::-webkit-scrollbar {
    width: 6px !important;
  }
  
  #profileModal .modal-box::-webkit-scrollbar-track {
    background: #1a1a1a !important;
    border-radius: 3px !important;
  }
  
  #profileModal .modal-box::-webkit-scrollbar-thumb {
    background: #444 !important;
    border-radius: 3px !important;
  }
  
  #profileModal .modal-box::-webkit-scrollbar-thumb:hover {
    background: #666 !important;
  }
}


@media (min-width: 769px) {
  #profileModal .modal-box {
    max-width: 85% !important;
    width: 400px !important;
    max-height: 90vh !important;
    overflow-y: auto !important;
    padding: 2rem !important;
    margin: 2rem !important;
    font-size: 1rem !important;
    border-radius: 16px !important;
    background: #000000 !important;
    border: 1px solid #333 !important;
    box-shadow: 0 0 30px rgba(0,0,0,0.8) !important;
  }
  
  #profileModal #closeProfileModal {
    background: #000000 !important;
    border: 1px solid #333 !important;
    color: #fff !important;
  }
  
  #profileModal #closeProfileModal:hover {
    background: #333 !important;
  }
  
  
  #profileModal .modal-box::-webkit-scrollbar {
    width: 8px !important;
  }
  
  #profileModal .modal-box::-webkit-scrollbar-track {
    background: #000000 !important;
  }
  
  #profileModal .modal-box::-webkit-scrollbar-thumb {
    background: #333 !important;
    border-radius: 4px !important;
  }
  
  #profileModal .modal-box::-webkit-scrollbar-thumb:hover {
    background: #555 !important;
  }
}



