:root{--bg:#0F1226;--primary:#8C6FF6;--accent:#3DD9EB;--text:#F6F7FB;--muted:#BAC0D6;--card:#141733;--chip:#1B1E3F;--border:rgba(255,255,255,.08)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Arial,Noto Sans,sans-serif;background:radial-gradient(1200px 800px at 80% -10%,rgba(140,111,246,.25),transparent 60%),radial-gradient(800px 600px at -10% 110%,rgba(61,217,235,.18),transparent 60%),var(--bg);color:var(--text)}a{color:inherit;text-decoration:none}.container{max-width:1120px;margin:0 auto;padding:24px}.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0}.logo{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.3px}.logo img{width:28px;height:28px}.btn{border:1px solid var(--border);background:linear-gradient(180deg,#ffffff12,#ffffff05);color:var(--text);padding:10px 16px;border-radius:14px;font-weight:600;display:inline-flex;align-items:center;gap:10px;transition:.2s transform,.2s border-color,.2s box-shadow}.btn:hover{transform:translateY(-2px);border-color:#8c6ff6cc;box-shadow:0 8px 24px #00000059}.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:26px;align-items:center;padding:38px 0 28px}.hero h1{font-size:40px;line-height:1.15;margin:0}.name-inline{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}.subtitle{font-size:38px;font-weight:700;margin-top:6px}.hero p{color:var(--muted);margin:10px 0 18px}.photo{width:100%;max-width:420px;justify-self:end;border-radius:22px;background:linear-gradient(140deg,#8c6ff659,#8c6ff600 40%),var(--card);padding:12px;box-shadow:0 10px 40px #00000073}.photo img{width:100%;display:block;border-radius:1000px}.section{margin-top:36px}.section h2{font-size:24px;margin:0 0 14px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.card{background:linear-gradient(180deg,#ffffff08,#ffffff03);border:1px solid var(--border);border-radius:18px;padding:18px;transition:.2s transform,.2s box-shadow,.2s border-color;display:flex;flex-direction:column;gap:8px}.card:hover{transform:translateY(-3px);border-color:#8c6ff6b3;box-shadow:0 12px 38px #00000059}.card h3{margin:0;font-size:18px}.card p{margin:0;color:var(--muted)}.card .tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.small{font-size:13px;color:var(--muted)}.footer{margin:32px 0 12px;display:flex;justify-content:space-between;align-items:center;gap:16px;color:var(--muted)}.badges{display:flex;flex-wrap:wrap;gap:8px}.badge{border:1px dashed var(--border);padding:6px 10px;border-radius:10px;font-size:12px}.link{color:var(--accent);font-weight:600}.skill{background:var(--chip);border:1px solid var(--border);border-radius:14px;padding:8px 12px;display:inline-flex;align-items:center;gap:8px;min-height:38px;max-width:100%;overflow:hidden;white-space:nowrap}.skill svg{flex:0 0 auto;display:block}.cover{aspect-ratio:16/9;border-radius:12px;overflow:hidden;border:1px solid var(--border);background:#0c0f22;display:block;margin-bottom:10px}.cover img{width:100%;height:100%;object-fit:cover;display:block}.socials{display:flex;gap:12px}.iconbtn{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:12px;border:1px solid var(--border)}.iconbtn:hover{border-color:#3dd9ebcc}.mascot{width:30px;height:30px;position:relative;top:2px}.mascot .eye{fill:#0b0f1f;animation:blink 4s infinite;transform-origin:center}@keyframes blink{0%,92%,to{transform:scaleY(1)}95%{transform:scaleY(.1)}}.brand{display:flex;align-items:center;gap:10px}.brand img{height:24px}@media (max-width: 980px){.hero{grid-template-columns:1fr;text-align:center}.photo{justify-self:center}.grid{grid-template-columns:1fr 1fr}.skills{grid-template-columns:1fr 1fr 1fr}.subtitle{font-size:30px}}@media (max-width: 640px){.grid{grid-template-columns:1fr}.skills{grid-template-columns:1fr 1fr}.hero h1{font-size:32px}}.skills{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.skill{background:var(--chip);border:1px solid var(--border);border-radius:14px;padding:9px 12px;display:inline-flex;align-items:center;gap:8px;min-height:40px;max-width:100%;overflow:hidden}.skill span{font-size:13px;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}@media (max-width: 980px){.skills{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width: 640px){.skills{grid-template-columns:repeat(2,minmax(0,1fr))}}.brand img{height:28px;width:auto;object-fit:contain;border-radius:4px}.skills{display:flex;flex-wrap:wrap;gap:12px}.skill{display:inline-flex;align-items:center;gap:8px;background:var(--chip);border:1px solid var(--border);border-radius:14px;padding:10px 14px;min-height:42px;white-space:nowrap;overflow:visible;box-shadow:0 0 #8c6ff600;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.skill svg,.skill img{flex:0 0 auto;display:block}.skill span{font-size:13px;line-height:1}.skill:hover{transform:translateY(-2px);border-color:#8c6ff6b3;box-shadow:0 10px 22px #00000047,0 0 22px #8c6ff62e}.card{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.card:hover{transform:translateY(-4px);border-color:#8c6ff699;box-shadow:0 16px 44px #00000059,0 0 28px #8c6ff624}