@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Syne:wght@700;800&display=swap');
:root { --bg:#050508; --panel:#101017; --panel-2:#171721; --text:#f5f5f7; --muted:#a7a7b4; --cyan:#5de0f8; --violet:#9b6dff; --rose:#ff5c8a; --border:rgba(255,255,255,.12); --display:'Syne',sans-serif; --body:'Space Grotesk',sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-height:100vh; color:var(--text); background:radial-gradient(circle at 85% 5%,rgba(155,109,255,.13),transparent 30%),radial-gradient(circle at 10% 50%,rgba(93,224,248,.08),transparent 32%),var(--bg); font-family:var(--body); }
button,input,textarea,select { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
a { color:inherit; text-decoration:none; }
[hidden] { display:none!important; }
.skip-link { position:fixed; left:1rem; top:-5rem; z-index:100; padding:.75rem 1rem; background:var(--cyan); color:#050508; }
.skip-link:focus { top:1rem; }
.profile-header { position:sticky; top:0; z-index:20; display:flex; align-items:center; justify-content:space-between; min-height:68px; padding:0 clamp(1rem,4vw,4rem); border-bottom:1px solid var(--border); background:rgba(5,5,8,.86); backdrop-filter:blur(18px); }
.profile-brand { font-family:var(--display); font-size:1.2rem; font-weight:800; text-transform:uppercase; }.profile-brand span{color:var(--cyan)}
.profile-header nav { display:flex; align-items:center; gap:1rem; }.profile-header nav a{color:var(--muted);font-weight:600}.profile-header nav a:hover{color:var(--cyan)}
.profile-header button { min-height:42px; padding:.55rem .9rem; border:1px solid var(--border); background:transparent; color:var(--text); cursor:pointer; }.profile-header button:hover{border-color:var(--cyan);color:var(--cyan)}
.profile-shell { width:min(1180px,calc(100% - 2rem)); margin:0 auto; padding:clamp(2rem,5vw,5rem) 0; }
.profile-loading,.auth-required { min-height:55vh; display:grid; place-content:center; text-align:center; color:var(--muted); }.auth-required h1{color:var(--text);font-family:var(--display)}.auth-required a{display:inline-block;margin-top:1rem;padding:.8rem 1rem;background:var(--cyan);color:#050508;font-weight:800}
.profile-hero { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:1.25rem; padding:clamp(1.25rem,3vw,2.25rem); border:1px solid var(--border); background:linear-gradient(120deg,rgba(23,23,33,.96),rgba(10,10,15,.94)); }
.profile-hero img { width:clamp(76px,10vw,112px); aspect-ratio:1; border-radius:50%; object-fit:cover; border:2px solid var(--cyan); box-shadow:0 0 35px rgba(93,224,248,.16); }
.eyebrow { margin:0 0 .35rem; color:var(--cyan); font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.14em; }
.profile-hero h1,.panel-heading h2 { margin:0; font-family:var(--display); }.profile-hero h1{font-size:clamp(1.75rem,4vw,3rem)}
.profile-email { margin:.4rem 0 0; color:var(--muted); }.edit-profile-link{padding:.75rem 1rem;border:1px solid var(--cyan);color:var(--cyan);font-weight:700}.edit-profile-link:hover{background:var(--cyan);color:#050508}
.profile-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin:1rem 0 2rem; background:var(--border); border:1px solid var(--border); }.profile-stats article{padding:1.25rem;background:var(--panel);text-align:center}.profile-stats strong{display:block;font-family:var(--display);font-size:1.8rem;color:var(--cyan)}.profile-stats span{color:var(--muted);font-size:.88rem}
.profile-layout { display:grid; grid-template-columns:220px 1fr; gap:1.5rem; align-items:start; }.profile-tabs{position:sticky;top:88px;display:grid;border:1px solid var(--border);background:var(--panel)}.profile-tabs button{min-height:52px;padding:.8rem 1rem;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--muted);text-align:left;font-weight:700;cursor:pointer}.profile-tabs button:last-child{border-bottom:0}.profile-tabs button:hover,.profile-tabs button.active{color:var(--cyan);background:rgba(93,224,248,.08)}
.profile-panels { min-width:0; }.profile-panel{padding:clamp(1.25rem,3vw,2rem);border:1px solid var(--border);background:rgba(16,16,23,.92);animation:panel-in .2s ease}.panel-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:1.5rem}.panel-heading h2{font-size:clamp(1.45rem,3vw,2rem)}.panel-copy{color:var(--muted);line-height:1.6}
.profile-events{display:grid;gap:.85rem}.profile-event-card{display:grid;grid-template-columns:110px 1fr auto;gap:1rem;align-items:center;padding:.75rem;border:1px solid var(--border);background:var(--panel-2)}.profile-event-card>img{width:110px;height:105px;object-fit:cover;background:#09090d}.profile-event-info{min-width:0}.profile-event-info>span{color:var(--cyan);font-size:.76rem;font-weight:800;text-transform:uppercase}.profile-event-info h3{margin:.25rem 0 .4rem;font-family:var(--display);font-size:1.08rem}.profile-event-info h3 a:hover{color:var(--cyan)}.profile-event-info p{margin:.18rem 0;color:var(--muted);font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.remove-event{min-height:42px;padding:.55rem .8rem;border:1px solid var(--border);background:transparent;color:var(--muted);cursor:pointer}.remove-event:hover{border-color:var(--rose);color:var(--rose)}
.empty-profile{padding:3rem 1rem;text-align:center;border:1px dashed var(--border);color:var(--muted)}.empty-profile strong{display:block;color:var(--text);font-family:var(--display);font-size:1.15rem}.empty-profile a{display:inline-block;margin-top:.8rem;color:var(--cyan);font-weight:800}
.profile-form{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}.profile-form label:nth-child(2){grid-column:1/-1}label{display:grid;gap:.45rem;font-weight:700}input,textarea,select{width:100%;padding:.8rem .9rem;border:1px solid var(--border);border-radius:0;background:#09090e;color:var(--text);outline:none}input:focus,textarea:focus,select:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(93,224,248,.12)}input:disabled{opacity:.6}.field-hint{color:var(--muted);font-size:.78rem;font-weight:400}.primary-action,.danger-action{min-height:46px;width:max-content;padding:.7rem 1.2rem;border:1px solid transparent;font-weight:800;cursor:pointer}.primary-action{background:var(--cyan);color:#050508}.primary-action:hover{background:var(--violet);color:#fff}.form-status{min-height:1.4rem;color:var(--cyan)}
.style-options{display:flex;flex-wrap:wrap;gap:.65rem;margin:1rem 0 1.5rem}.style-option{display:block;cursor:pointer}.style-option input{position:absolute;opacity:0;pointer-events:none}.style-option span{display:block;padding:.65rem 1rem;border:1px solid var(--border);color:var(--muted)}.style-option input:checked+span{border-color:var(--cyan);background:var(--cyan);color:#050508}.style-option input:focus-visible+span{outline:3px solid rgba(93,224,248,.35);outline-offset:2px}
.danger-panel{border-color:rgba(255,92,138,.25)}.danger-panel>p{max-width:65ch;color:var(--muted);line-height:1.6}.danger-panel label{max-width:440px;margin:1.25rem 0}.danger-action{border-color:var(--rose);background:transparent;color:var(--rose)}.danger-action:hover{background:var(--rose);color:#fff}
button:focus-visible,a:focus-visible{outline:3px solid rgba(93,224,248,.42);outline-offset:2px}@keyframes panel-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(max-width:760px){.profile-header nav a{display:none}.profile-shell{width:min(100% - 1rem,1180px);padding:1rem 0 5rem}.profile-hero{grid-template-columns:auto 1fr}.edit-profile-link{grid-column:1/-1;text-align:center}.profile-stats{margin-bottom:1rem}.profile-layout{grid-template-columns:1fr}.profile-tabs{position:sticky;top:68px;z-index:10;display:flex;overflow-x:auto}.profile-tabs button{flex:0 0 auto;border-bottom:0;border-right:1px solid var(--border);white-space:nowrap}.profile-event-card{grid-template-columns:82px 1fr}.profile-event-card>img{width:82px;height:92px}.remove-event{grid-column:1/-1;width:100%}.profile-form{grid-template-columns:1fr}.profile-form label:nth-child(2){grid-column:auto}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
