.profile-card { position:relative; }
.wide-profile .page { width:min(820px,calc(100% - 32px)); }.preview.wide-profile .page{width:calc(100% - 24px)}
.profile-card[data-layout="wide"] .identity { display:grid; grid-template-columns:110px minmax(0,1fr); gap:6px 24px; text-align:left; align-items:center; }
.profile-card[data-layout="wide"] .avatar-holder { grid-row:span 7; }
.profile-card[data-layout="wide"] h1 { margin:0; }
.profile-card[data-layout="wide"] .profile-badges,.profile-card[data-layout="wide"] .socials { justify-content:flex-start; margin-top:9px; }
.profile-card[data-layout="wide"] .bio { margin:8px 0 0; }.profile-card[data-layout="wide"] .location { margin:4px 0 0; }
.avatar-holder { display:inline-block; position:relative; width:110px; height:110px; }
.orbit-avatar::after { content:""; position:absolute; inset:-8px; border-radius:50%; border:2px solid transparent; border-top-color:var(--accent); border-right-color:color-mix(in srgb,var(--accent) 35%,transparent); filter:drop-shadow(0 0 6px var(--accent)); animation:avatar-orbit 3s linear infinite; pointer-events:none; }
.glitch-avatar.glitch-active { animation:profile-glitch .45s steps(2) 2; }
.glitch-name { animation:name-glitch 4s steps(1) infinite; }
.rainbow-name { background:linear-gradient(90deg,var(--accent),var(--secondary),var(--accent)); background-size:200%; background-clip:text; -webkit-background-clip:text; color:transparent; animation:rainbow-name 4s linear infinite; }
.glow-border { box-shadow:0 0 28px color-mix(in srgb,var(--accent) 25%,transparent),inset 0 0 20px color-mix(in srgb,var(--accent) 8%,transparent); }
.led-border { animation:led-border 4s ease-in-out infinite; }
.transparent-card { background:transparent!important; border-color:transparent!important; backdrop-filter:none!important; box-shadow:none!important; }
.visitor-controls { display:grid; gap:16px; margin:18px 0 0; padding:15px; border:1px solid #ffffff24; border-radius:14px; background:#08071199; backdrop-filter:blur(10px); }
.scene-switcher { display:flex; flex-wrap:wrap; justify-content:center; gap:7px; }
.scene-button,.profile-section-switch button { padding:9px 12px; font:11px ui-sans-serif,system-ui,sans-serif; background:#ffffff08; border:1px solid #ffffff26; color:var(--text); border-radius:8px; }
.scene-button[aria-pressed="true"] { border-color:var(--scene-color); color:var(--scene-color); background:color-mix(in srgb,var(--scene-color) 12%,transparent); }
.visitor-opacity { display:flex; align-items:center; gap:14px; font:11px ui-sans-serif,system-ui,sans-serif; }
.visitor-opacity input { flex:1; min-width:40px; accent-color:var(--accent); }.visitor-opacity output { min-width:34px; }
.profile-section-switch { display:flex; justify-content:center; gap:8px; margin-bottom:24px; }
.profile-section-switch button[aria-pressed="true"] { border-color:var(--accent); color:var(--accent); }
.typing-text::after { content:"▏"; animation:typing-caret 1s steps(1) infinite; }
.cursor-trail-dot { position:fixed; width:var(--trail-size); height:var(--trail-size); background:var(--accent); box-shadow:0 0 12px var(--accent); border-radius:50%; z-index:30; pointer-events:none; transform:translate(-50%,-50%); }
.custom-cursor-active,.custom-cursor-active * { cursor:none!important; }
.media-overlay { position:fixed; inset:0; width:100%; height:100%; object-fit:cover; mix-blend-mode:screen; pointer-events:none; z-index:1; }.media-overlay.overlay-above { z-index:8; }
.social-mark { display:block; width:21px; height:21px; background:currentColor; mask:var(--social-icon) center/contain no-repeat; -webkit-mask:var(--social-icon) center/contain no-repeat; }
.matrix .particle { font:17px monospace; color:var(--accent); width:auto; height:auto; background:none; border-radius:0; opacity:.5; }
.profile-appear { animation:profile-arrive .5s ease-out; }
.badge-flip .profile-badge img { transition:transform .4s; }.badge-flip .profile-badge:hover img,.badge-flip .profile-badge:focus-visible img{transform:rotateY(360deg)}.skill-track i{transform-origin:left;animation:skill-grow 1.2s ease-out}
@keyframes skill-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes profile-arrive { from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0} }
@keyframes avatar-orbit { to{transform:rotate(360deg)} }
@keyframes name-glitch { 0%,92%,100%{text-shadow:none;translate:0}93%{text-shadow:3px 0 var(--accent),-3px 0 var(--secondary);translate:1px 0}95%{translate:-2px 0} }
@keyframes profile-glitch { 0%,100%{translate:0;filter:none}25%{translate:3px -2px;filter:hue-rotate(40deg)}50%{translate:-3px 1px} }
@keyframes rainbow-name { to{background-position:200%} }
@keyframes led-border { 0%,100%{border-color:var(--accent);box-shadow:0 0 18px color-mix(in srgb,var(--accent) 35%,transparent)}50%{border-color:var(--secondary);box-shadow:0 0 28px color-mix(in srgb,var(--secondary) 35%,transparent)} }
@keyframes typing-caret { 50%{opacity:0} }
@media(max-width:600px) { .profile-card[data-layout="wide"] .identity { display:block; text-align:center; }.profile-card[data-layout="wide"] h1{margin-top:24px}.profile-card[data-layout="wide"] .profile-badges,.profile-card[data-layout="wide"] .socials{justify-content:center}.profile-card[data-layout="wide"] .bio{margin-top:15px} }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after{animation:none!important}.cursor-trail-dot{display:none} }
