:root{--night:#140f24;--mist:#cfc6ff;--lilac:#b9a8ff;--peach:#ffb88c;--text:#f3effc;--mute:#a69fc0;--line:rgba(207,198,255,.14);color-scheme:dark}
*{box-sizing:border-box;margin:0}html{background:var(--night)}
body{min-height:100svh;font:400 16px/1.6 "Manrope",system-ui,sans-serif;color:var(--text);display:grid;place-items:center;padding:max(24px,env(safe-area-inset-top)) 16px max(24px,env(safe-area-inset-bottom));background:radial-gradient(60rem 40rem at 15% -10%,rgba(185,168,255,.2),transparent 60%),radial-gradient(50rem 36rem at 95% 105%,rgba(255,184,140,.14),transparent 60%),var(--night)}
a{color:inherit;text-decoration:none}:focus-visible{outline:2px solid var(--peach);outline-offset:3px;border-radius:8px}
.card{position:relative;width:100%;max-width:600px;padding:32px 28px 28px;background:linear-gradient(160deg,rgba(35,26,61,.85),rgba(20,15,36,.92));border:1px solid var(--line);border-radius:28px;box-shadow:0 30px 80px -30px #000;animation:rise .6s both}
@keyframes rise{from{opacity:0;transform:translateY(12px)}}
h1{font:700 clamp(28px,6vw,36px)/1.1 "Fraunces",Georgia,serif}.tagline{color:var(--mute);margin-top:6px}
.btn{display:inline-block;border:0;border-radius:14px;padding:11px 22px;font:600 15px "Manrope",sans-serif;background:var(--lilac);color:var(--night);cursor:pointer}
/* dashboard */
label{display:block;font-size:13px;color:var(--mute);margin-top:14px}
input,textarea,select{width:100%;margin-top:5px;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:rgba(0,0,0,.28);color:var(--text);font:15px "Manrope",sans-serif}
input[type=checkbox]{width:auto;margin:0 8px 0 0}input[type=color]{height:42px;padding:3px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.chk{display:flex;align-items:center;color:var(--text);margin-top:14px}.chk.s{display:inline-flex;margin-right:16px}
fieldset{margin-top:20px;padding:4px 16px 16px;border:1px solid var(--line);border-radius:16px}legend{padding:0 8px;font-size:13px;color:var(--mute)}
.bar{display:flex;align-items:center;gap:16px;margin-top:22px}.bar a{color:var(--mute);font-size:14px}
/* profile */
header{display:flex;gap:20px;align-items:center}
.avatar{flex:none;width:88px;height:88px;border-radius:50%;display:grid;place-items:center;font:700 36px "Fraunces",Georgia,serif;color:var(--night);background:conic-gradient(from 200deg,var(--lilac),var(--peach),var(--lilac));padding:3px;overflow:hidden}
.avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}.avatar span{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:var(--mist)}
.badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.bd{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;font-size:15px;background:rgba(185,168,255,.12);border:1px solid var(--line);cursor:default}
.meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;font-size:13px;color:var(--mute)}.pill{display:inline-flex;align-items:center;gap:7px;padding:3px 11px;border:1px solid var(--line);border-radius:99px}.dot{width:7px;height:7px;border-radius:50%;background:#6ee7a8}
[role=tablist]{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin:26px 0 22px;padding:4px;background:rgba(0,0,0,.25);border:1px solid var(--line);border-radius:16px}
[role=tab]{font:600 14px "Manrope",sans-serif;color:var(--mute);background:none;border:0;padding:9px 0;border-radius:12px;cursor:pointer;transition:background .2s,color .2s}[role=tab][aria-selected=true]{background:var(--mist);color:var(--night)}
.panel[hidden]{display:none}.links{display:flex;flex-direction:column;gap:8px}
.link{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.025);transition:background .2s,border-color .2s,transform .2s}.link:hover{background:rgba(185,168,255,.09);border-color:var(--lilac);transform:translateX(3px)}
.badge{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font:700 16px "Fraunces",serif;color:var(--night);background:var(--lilac)}.link b{display:block;font-weight:600;line-height:1.25}.link small{color:var(--mute);font-size:13px}
.timeline{list-style:none;padding:0 0 0 22px;border-left:2px solid var(--line);display:flex;flex-direction:column;gap:26px}.job{position:relative}
.job::before{content:"";position:absolute;left:-29px;top:7px;width:12px;height:12px;border-radius:50%;background:var(--night);border:2px solid var(--lilac)}.job:first-child::before{background:var(--peach);border-color:var(--peach)}
.job h3{font:600 17px/1.3 "Manrope",sans-serif}.co{color:var(--lilac)}.when{font-size:13px;color:var(--mute)}.job ul{margin:8px 0 0 18px;color:#d9d4ec;font-size:15px}
.about p{color:#d9d4ec}.skills{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.skills span{padding:4px 12px;border-radius:99px;background:rgba(185,168,255,.12);font-size:14px;color:var(--mist)}
.acct{position:absolute;right:14px;bottom:14px}.acct>button{width:22px;height:22px;border-radius:50%;border:1px solid var(--line);background:rgba(0,0,0,.3);display:grid;place-items:center;cursor:pointer;opacity:.5;transition:opacity .2s}
.acct>button:hover,.acct>button[aria-expanded=true]{opacity:1}.acct i{width:8px;height:8px;border-radius:50%}
.pop{position:absolute;right:0;bottom:32px;width:220px;padding:12px 14px;font-size:13px;background:#1d1535;border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 30px -10px #000}.pop[hidden]{display:none}.pop small{color:var(--mute)}
.mp{position:fixed;left:14px;bottom:max(14px,env(safe-area-inset-bottom));z-index:5;display:flex;align-items:center;gap:10px;max-width:calc(100vw - 28px);padding:7px 14px 7px 7px;border-radius:99px;background:rgba(29,21,53,.88);border:1px solid var(--line);backdrop-filter:blur(10px);font-size:13px}
.mp button{width:30px;height:30px;border-radius:50%;border:0;background:var(--lilac);color:var(--night);cursor:pointer;font-size:12px}.mp span{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mp input{width:70px;margin:0;padding:0;border:0;background:none;accent-color:var(--lilac)}
.gate{position:fixed;inset:0;z-index:9;border:0;background:rgba(20,15,36,.84);backdrop-filter:blur(16px);color:var(--text);font:700 clamp(22px,5vw,32px) "Fraunces",Georgia,serif;cursor:pointer}
@media(max-width:520px){.row{grid-template-columns:1fr}.card{padding:26px 18px 34px}header{flex-direction:column;align-items:flex-start}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* admin */
h2{font:600 18px "Manrope",sans-serif;margin:28px 0 12px}.inline{display:flex;gap:10px;align-items:center}.inline input{margin:0}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 6px 3px 10px;border-radius:99px;background:rgba(185,168,255,.12);border:1px solid var(--line);font-size:14px}
.chip button{border:0;background:none;color:var(--mute);cursor:pointer;font-size:16px;line-height:1}
.urow{display:flex;gap:16px;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:14px 0;border-top:1px solid var(--line)}.urow a{color:var(--lilac);font-size:14px}.urow em{margin-left:8px;font-size:12px;color:var(--peach)}
.acts{display:flex;gap:8px;flex-wrap:wrap}.acts select{width:auto;margin:0;padding:6px 8px}.acts button{border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--text);border-radius:10px;padding:6px 12px;font:13px "Manrope",sans-serif;cursor:pointer}.acts button:hover{border-color:var(--lilac)}