:root{
  --bg:#071018;
  --card:#1e538f;
  --accent:#00d5ff;
  --glow:rgba(102,240,255,0.15);
  --muted:#c2cfdb;
  --text:#e6f7ff;
  --button-bg:#00d5ff;
  --button-text:#1c1c1c;
  --success:#27dd45;
  --error:#fe3434;
  --border-width:1px;
  --border-radius:4px;
  --button-padding:10px;
  --card-padding:20px;
  --font-size:14px;
  font-family:Inter,system-ui,sans-serif
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;background:linear-gradient(180deg,var(--bg) 0%,#04121a 60%);color:var(--text);overflow-x:hidden}
body.no-scroll{overflow:hidden}
canvas#matrix-canvas{position:fixed;inset:0;z-index:0;display:block}
.nav{position:fixed;top:18px;left:24px;right:24px;display:flex;justify-content:space-between;align-items:center;z-index:5}
.nav-logo{font-weight:700;color:var(--accent);text-decoration:none}
.nav nav a{color:var(--muted);margin-left:18px;text-decoration:none;font-size:14px}
.nav nav a:hover{color:var(--accent);text-decoration:underline}
.admin-btn{opacity:0.3;font-size:16px!important}
.admin-btn:hover{opacity:1;text-decoration:none!important}
.center-card{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;height:100vh;padding:24px}
.profile{width:1000px;max-width:95vw;background:linear-gradient(180deg,rgba(255,255,255,0.03),rgba(255,255,255,0.01));border-radius:calc(var(--border-radius) * 3);padding:calc(var(--card-padding) * 3);border:var(--border-width) solid rgba(255,255,255,0.04);backdrop-filter:blur(6px);box-shadow:0 6px 30px rgba(2,6,10,0.7)}
.profile.small{width:1000px;max-width:95vw;padding:60px}
.avatar{width:84px;height:84px;border-radius:calc(var(--border-radius) * 3);display:block;margin:0 auto 12px;object-fit:cover}
.profile h1{font-size:20px;margin:0;text-align:center;color:var(--text)}
.profile .pronouns{font-size:13px;color:var(--muted);margin-left:8px;font-weight:600}
.profile .age{color:var(--muted);text-align:center;margin:8px 0}
.profile .bio{color:var(--text);text-align:center;margin:8px 0 16px}
.links{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.pill{display:inline-block;padding:var(--button-padding) calc(var(--button-padding) * 1.2);border-radius:999px;background:rgba(255,255,255,0.02);color:var(--muted);text-decoration:none;border:var(--border-width) solid rgba(255,255,255,0.02);font-size:var(--font-size)}
.pill:hover{color:var(--accent);box-shadow:0 6px 18px var(--glow);border-color:var(--accent)}
.projects-page{position:relative;z-index:3;padding:92px 48px 40px;color:var(--text);min-height:100vh;max-width:1200px;margin:0 auto;box-sizing:border-box}
.section-title{font-size:28px;margin:0 0 18px;color:var(--text)}
.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.project-card{background:linear-gradient(180deg,rgba(255,255,255,0.02),rgba(255,255,255,0.01));padding:var(--card-padding);border-radius:calc(var(--border-radius) * 2);border:var(--border-width) solid rgba(255,255,255,0.03);display:flex;gap:12px;align-items:center}
.project-media img{width:72px;height:72px;object-fit:cover;border-radius:8px}
.project-body h3{margin:0;font-size:16px;color:var(--text)}
.project-body p{margin:6px 0 0;color:var(--muted);font-size:13px}
.project-card-new{background:#1a1a1a;border-radius:calc(var(--border-radius) * 3);padding:0;border:var(--border-width) solid rgba(255,255,255,0.1);overflow:hidden;transition:all 0.3s ease;position:relative;aspect-ratio:1.4;display:flex;flex-direction:column;background-size:cover;background-position:center;background-repeat:no-repeat}
.project-card-new:hover{transform:translateY(-4px);box-shadow:0 8px 25px rgba(0,0,0,0.3);border-color:var(--accent)}
.project-image{height:60%;overflow:hidden;position:relative}
.project-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease}
.project-card-new:hover .project-image img{transform:scale(1.05)}
.project-content{padding:16px;flex:1;display:flex;flex-direction:column;justify-content:space-between;background:rgba(0,0,0,0.3);backdrop-filter:blur(10px)}
.project-content h3{margin:0 0 8px 0;font-size:18px;color:#fff;font-weight:600}
.project-content p{margin:0 0 12px 0;color:rgba(255,255,255,0.8);font-size:13px;line-height:1.4;flex:1}
.project-actions{display:flex;gap:8px}
.project-btn{background:rgba(255,255,255,0.2);color:#fff;padding:calc(var(--button-padding) * 0.6) var(--button-padding);border-radius:var(--border-radius);text-decoration:none;font-size:calc(var(--font-size) * 0.85);font-weight:500;transition:all 0.2s ease;backdrop-filter:blur(10px)}
.project-btn:hover{background:var(--accent);color:#000;transform:translateY(-1px)}
.spark{position:absolute;pointer-events:none;mix-blend-mode:screen;border-radius:50%;transform:translate(-50%,-50%);filter:blur(10px);background:var(--accent)}
.credit{position:fixed;bottom:10px;left:10px;font-size:10px;color:var(--muted);opacity:0.6;z-index:10;font-family:Inter,system-ui,sans-serif}
.discord-widget{background:linear-gradient(180deg,rgba(255,255,255,0.03),rgba(255,255,255,0.01));border-radius:calc(var(--border-radius) * 3);padding:var(--card-padding);margin:12px 0;border:var(--border-width) solid rgba(255,255,255,0.04);display:flex;align-items:center;gap:12px;font-size:var(--font-size);transition:all 0.3s ease;cursor:pointer;backdrop-filter:blur(6px)}
.widgets-container{display:flex;gap:16px;flex-wrap:wrap}
.discord-widget,.spotify-widget{flex:1;min-width:280px}
.discord-widget:hover{background:linear-gradient(180deg,rgba(255,255,255,0.05),rgba(255,255,255,0.02));border-color:var(--accent);box-shadow:0 6px 18px var(--glow);transform:translateY(-2px)}
.spotify-widget{background:linear-gradient(135deg,rgba(30,215,96,0.1),rgba(30,215,96,0.05));border-radius:calc(var(--border-radius) * 3);padding:var(--card-padding);margin:12px 0;border:var(--border-width) solid rgba(30,215,96,0.3);display:flex;flex-direction:column;gap:12px;font-size:var(--font-size);transition:all 0.3s ease;cursor:pointer;backdrop-filter:blur(6px)}
.spotify-widget:hover{background:linear-gradient(135deg,rgba(30,215,96,0.15),rgba(30,215,96,0.08));border-color:#1ed760;box-shadow:0 6px 18px rgba(30,215,96,0.2);transform:translateY(-2px)}
.spotify-header{display:flex;align-items:center;gap:12px}
.spotify-icon{width:40px;height:40px;border-radius:50%;background:#1ed760;display:flex;align-items:center;justify-content:center;color:#000;transition:transform 0.3s ease}
.spotify-widget:hover .spotify-icon{transform:scale(1.1)}
.spotify-status{font-size:14px;color:#1ed760;font-weight:600}
.spotify-track-info{display:flex;align-items:center;gap:12px;justify-content:space-between}
.track-details{flex:1}
.track-details h4{margin:0 0 4px 0;font-size:16px;color:#fff;font-weight:700;line-height:1.2}
.track-details p{margin:0 0 2px 0;font-size:13px;color:rgba(255,255,255,0.8);font-weight:500}
.album-name{font-size:12px!important;color:rgba(30,215,96,0.7)!important;font-style:italic}
.album-art{width:48px;height:48px;border-radius:6px;background:rgba(30,215,96,0.2);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
.album-art img{width:100%;height:100%;object-fit:cover;border-radius:6px;display:block}
.spotify-progress{margin-top:8px;width:100%}
.progress-bar{width:100%;height:8px;background:rgba(30,215,96,0.2);border-radius:4px;overflow:hidden;margin-bottom:6px}
.progress-fill{height:100%;background:#1ed760;width:0%;transition:width 0.3s ease;border-radius:4px}
.progress-time{display:flex;justify-content:space-between;font-size:12px;color:rgba(30,215,96,0.8);font-weight:500}
.discord-avatar{width:40px;height:40px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;font-weight:bold;color:#000;position:relative;transition:transform 0.3s ease;background-size:cover;background-position:center;border:2px solid rgba(255,255,255,0.1)}
.discord-widget:hover .discord-avatar{transform:scale(1.1);border-color:var(--accent)}
.discord-status{position:absolute;bottom:-2px;right:-2px;width:14px;height:14px;border-radius:50%;border:3px solid var(--card);transition:all 0.3s ease}
.discord-status.online{background:#3ba55d;animation:pulse-online 2s infinite}
.discord-status.idle{background:#faa81a;animation:pulse-idle 3s infinite}
.discord-status.dnd{background:#ed4245}
.discord-status.offline{background:#747f8d}
@keyframes pulse-online{0%,100%{box-shadow:0 0 0 0 rgba(59,165,93,0.7)}50%{box-shadow:0 0 0 4px rgba(59,165,93,0)}}
@keyframes pulse-idle{0%,100%{box-shadow:0 0 0 0 rgba(250,168,26,0.7)}50%{box-shadow:0 0 0 4px rgba(250,168,26,0)}}
.discord-info{flex:1}
.discord-info h4{margin:0;font-size:14px;color:var(--text);font-weight:600}
.discord-info p{margin:2px 0 0 0;font-size:11px;color:var(--muted)}
.discord-activity{display:flex;align-items:center;gap:6px;margin-top:4px}
.discord-activity img{width:16px;height:16px;border-radius:2px}
.discord-spotify-info{background:rgba(102,240,255,0.1);border:1px solid var(--accent);border-radius:6px;padding:6px 8px;margin-top:4px;display:flex;align-items:center;gap:8px}
.discord-spotify-info img{width:24px;height:24px;border-radius:3px}
.spotify-text{font-size:10px;color:var(--accent)}
.server-info{margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,0.1)}
.server-count{font-size:10px;color:var(--muted);display:flex;align-items:center;gap:4px}
.last-seen{font-size:10px;color:var(--muted);margin-top:2px;opacity:0.7}
.invite-btn{background:var(--accent);color:#000;padding:calc(var(--button-padding) * 0.4) calc(var(--button-padding) * 0.8);border-radius:var(--border-radius);font-size:calc(var(--font-size) * 0.7);text-decoration:none;margin-top:6px;display:inline-block;transition:all 0.3s ease;font-weight:600}
.invite-btn:hover{opacity:0.8;box-shadow:0 2px 8px var(--glow)}
.social-list{list-style:none;padding:0}
.admin-content{position:relative;z-index:3;padding:92px 48px 40px;min-height:100vh;max-width:100vw;box-sizing:border-box}
.admin-card{background:linear-gradient(180deg,rgba(255,255,255,0.03),rgba(255,255,255,0.01));border-radius:calc(var(--border-radius) * 3);padding:calc(var(--card-padding) * 1.3);border:var(--border-width) solid rgba(255,255,255,0.04);backdrop-filter:blur(6px);box-shadow:0 6px 30px rgba(2,6,10,0.7);margin-bottom:20px}
.form-group{margin:15px 0}
.form-group label{display:block;margin-bottom:5px;color:var(--muted);font-weight:600}
.form-group input,.form-group textarea,.form-group select{width:100%;padding:var(--button-padding);border:var(--border-width) solid rgba(255,255,255,0.1);background:rgba(255,255,255,0.05);color:var(--text);border-radius:var(--border-radius);font-family:inherit;font-size:var(--font-size)}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--accent);outline:none}
.form-group input[type="file"]{padding:8px;background:rgba(255,255,255,0.02)}
.form-group small{font-size:12px;display:block;margin-top:5px}
.form-group input[type="color"]{height:40px}
.form-group input[type="checkbox"]{width:auto;margin-right:8px}
.btn{background:var(--button-bg);color:var(--button-text);padding:var(--button-padding) calc(var(--button-padding) * 2);border:var(--border-width) solid var(--button-bg);border-radius:var(--border-radius);cursor:pointer;margin-right:10px;text-decoration:none;display:inline-block;font-size:var(--font-size)}
.btn:hover{opacity:0.8}
.btn-danger{background:var(--error);color:#fff}
.success{color:var(--success);margin:10px 0}
.error{color:var(--error);margin:10px 0}
.project-item,.social-item{display:flex;justify-content:space-between;align-items:center;padding:var(--card-padding);border:var(--border-width) solid rgba(255,255,255,0.1);border-radius:var(--border-radius);margin:10px 0;background:rgba(255,255,255,0.02)}
.project-item:hover,.social-item:hover{border-color:var(--accent)}
.admin-nav{background:linear-gradient(180deg,rgba(255,255,255,0.03),rgba(255,255,255,0.01));padding:var(--card-padding);border-radius:var(--border-radius);margin-bottom:20px;border:var(--border-width) solid rgba(255,255,255,0.04);backdrop-filter:blur(6px)}
.admin-nav h1{margin:0 0 12px 0;color:var(--accent)}
.admin-nav-main{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,0.1)}
.admin-nav-actions{display:flex;gap:8px;justify-content:flex-end}
.admin-btn{background:rgba(255,255,255,0.05);color:var(--text);padding:8px 14px;border-radius:var(--border-radius);text-decoration:none;font-size:var(--font-size);font-weight:500;border:var(--border-width) solid rgba(255,255,255,0.1);transition:all 0.2s ease}
.admin-btn:hover{background:var(--button-bg);color:var(--button-text);border-color:var(--button-bg)}
.admin-btn-secondary{background:rgba(255,255,255,0.08);color:var(--muted);padding:8px 14px;border-radius:6px;text-decoration:none;font-size:13px;font-weight:500;border:1px solid rgba(255,255,255,0.15);transition:all 0.2s ease}
.admin-btn-secondary:hover{background:rgba(255,255,255,0.15);color:var(--text)}
.admin-btn-danger{background:rgba(255,107,107,0.1);color:var(--error);padding:8px 14px;border-radius:6px;text-decoration:none;font-size:13px;font-weight:500;border:1px solid rgba(255,107,107,0.3);transition:all 0.2s ease}
.admin-btn-danger:hover{background:var(--error);color:#fff}
.form-row{display:flex;gap:15px}
.form-row .form-group{flex:1}
.toggle-group{display:flex;align-items:center;margin:10px 0}
@media (max-width:768px){
  .profile{width:95vw;padding:20px 15px;margin:10px}
  .center-card{padding:10px;height:auto;min-height:100vh}
  .avatar{width:64px;height:64px}
  .profile h1{font-size:18px;line-height:1.3}
  .pronouns{font-size:12px;display:block;margin:4px 0 0 0}
  .bio{font-size:14px;line-height:1.4}
  .links{gap:6px}
  .pill{padding:6px 10px;font-size:13px}
  .projects-grid{grid-template-columns:1fr;gap:16px}
  .project-card{flex-direction:column;text-align:center;padding:16px}
  .project-media{margin-bottom:12px}
  .project-media img{width:100%;height:auto;max-width:200px}
  .project-links{justify-content:center;margin-top:12px}
  .project-card-new{height:200px;aspect-ratio:1.2}
  .project-image{height:50%}
  .project-content{padding:12px}
  .project-actions{justify-content:center}
  .social-list{padding:0;margin:0}
  .social-list li{margin:4px 0}
  nav{margin-bottom:15px;padding-bottom:10px}
  nav > div{gap:8px}
  nav a{padding:4px 8px;font-size:12px}
  .form-row{flex-direction:column}
  .form-group{margin:10px 0}
  .admin-nav{text-align:center}
  .admin-nav-main{justify-content:center;margin-bottom:10px;padding-bottom:10px}
  .admin-nav-actions{justify-content:center}
  .admin-btn,.admin-btn-secondary,.admin-btn-danger{margin:2px;padding:6px 10px;font-size:12px}
  .project-item,.social-item{flex-direction:column;text-align:center;gap:10px}
  .toggle-group{justify-content:center;margin:8px 0}
  .section-title{font-size:24px;text-align:center}
  body{overflow-x:hidden}
  .btn{padding:8px 12px;font-size:13px;margin:4px 2px}
  .credit{font-size:9px;bottom:8px;left:8px}
  .widgets-container{flex-direction:column}
  .discord-widget,.spotify-widget{min-width:auto;flex:none}
  .discord-widget,.spotify-widget{flex-direction:column;text-align:center;padding:12px}
  .discord-avatar{margin:0 auto}
  .discord-spotify-info{flex-direction:column;text-align:center}
  .server-info{text-align:center}
  .spotify-track-info{flex-direction:column;text-align:center;gap:8px}
  .album-art{margin:0 auto}
  .track-details{text-align:center}
}