:root {
 --primary-color:#36f9c9; --primary-dark:#00d4a9; --secondary-color:#ab85ed;
 --dark-bg:#080c12; --darker-bg:#05080d; --card-bg:#101925;
 --border-color:#243647; --text-secondary:#bdcbd8; --text-muted:#a2b5c5;
}
body { isolation:isolate; background:#080c12!important; }
#canvas-container { display:block!important; position:fixed!important; inset:0; width:100%; height:100%; z-index:0!important; pointer-events:none; background-color:#080c12!important; }
#canvas-container canvas { display:block; }
main,.footer { position:relative; z-index:1; }
.navbar { background:#080c12!important; border-bottom-color:#23463e!important; }
.navbar-nav .nav-link { font-family:var(--font-code); font-size:.83rem; }
.hacker-logo-text { font-family:var(--font-code); color:var(--primary-color); letter-spacing:.04em; text-shadow:0 0 12px #36f9c930; }
.hacker-logo-img { filter:drop-shadow(0 0 6px #36f9c940); }
.hero-section { background:radial-gradient(ellipse at center,#080c1220,#080c1270)!important; }
.hero-title { text-shadow:0 3px 20px #0009; }
.hero-title span { text-shadow:0 0 30px #36f9c935; }
.eyebrow { display:inline-block; font-family:var(--font-code); border:1px solid #36f9c944; padding:.5rem .8rem; border-radius:4px; background:#080c12b0; letter-spacing:.07em; }
.section-title { font-family:var(--font-code); font-size:clamp(1.65rem,3vw,2.35rem); letter-spacing:-.04em; }
.section-title::before { content:">_ "; color:var(--primary-color); }
.expertise-strip { background:#080c12c9!important; }
.expertise-strip span { font-family:var(--font-code); font-size:.76rem; }
.expertise-strip span::before { content:"[+] "; color:var(--primary-color); }
.card,.team-card { background:#101925!important; border-color:#294035!important; border-radius:10px; }
.card:hover,.team-card:hover { border-color:var(--primary-color)!important; box-shadow:0 0 20px #36f9c910!important; }
.card-header { font-family:var(--font-code); background:#0d1923!important; color:var(--primary-color); }
.btn-primary { box-shadow:0 0 16px #36f9c91a!important; }
.team-name { color:var(--primary-color); }
.team-position { font-family:var(--font-code); color:var(--text-secondary); }
.team-card,.profile-header { isolation:isolate; }
.team-img,.profile-img { opacity:1!important; visibility:visible!important; transform:none!important; filter:none!important; }
.approach-section { background:#0b141ddd!important; }
.contact-section { background:#0b141de8!important; }
.process-list li::before { text-shadow:0 0 12px #36f9c930; }
.footer { background:#05080df5!important; }
@media(max-width:575px) { .hacker-logo-text { font-size:.68rem; letter-spacing:0; } }
body > .d-flex,body > .container,body > .container-fluid,.login-container { position:relative; z-index:1; }
.playground-dock { position:fixed;left:max(16px,env(safe-area-inset-left));bottom:max(16px,env(safe-area-inset-bottom));z-index:1100;font-family:var(--font-body,system-ui,sans-serif);max-width:calc(100vw - 32px); }
.playground-toggle,.playground-panel button,.playground-panel select { font:inherit;color:#dcece7;background:#10221f;border:1px solid #326459;border-radius:10px; }
.playground-toggle { min-height:44px;padding:10px 16px;box-shadow:0 8px 28px #0006;cursor:pointer;font-size:.85rem; }
.playground-toggle span { color:#36f9c9;margin-right:7px; }
.playground-toggle:hover,.playground-panel button:hover { background:#18392f;border-color:#36f9c9; }
.playground-panel { position:absolute;bottom:56px;left:0;width:min(380px,calc(100vw - 32px));padding:20px;background:#0b141b!important;background-color:#0b141b!important;opacity:1!important;isolation:isolate;border:1px solid #31564b;border-radius:18px;box-shadow:0 18px 60px #0008;max-height:calc(100dvh - 112px);overflow:auto;overscroll-behavior:contain; }
.playground-panel[hidden],.stickman-grab[hidden] { display:none!important; }
.playground-heading { display:flex;gap:12px;align-items:flex-start;justify-content:space-between; }
.playground-kicker { font-family:var(--font-code,monospace);font-size:.62rem;letter-spacing:.12em;color:#36f9c9;margin:0 0 8px; }
.playground-panel h2 { font-size:1.18rem;line-height:1.4;letter-spacing:-.02em;margin:0;color:#e6f3f0; }
.playground-panel .playground-close { font-size:1.5rem;line-height:1;flex:0 0 40px;min-height:40px;cursor:pointer; }
.playground-intro,.playground-hint,.playground-status { font-size:.8rem;line-height:1.6;color:#b6c9c6;margin:12px 0; }
.playground-actions { display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0; }
.playground-panel button { min-height:44px;padding:9px 10px;cursor:pointer;font-size:.79rem; }
.playground-panel button:disabled { opacity:.45;cursor:default; }
.playground-options { display:grid;grid-template-columns:1fr 1fr;gap:10px; }
.playground-options label { color:#b6c9c6;font-size:.72rem; }
.playground-options label:last-child { grid-column:1/-1; }
.playground-panel select { display:block;width:100%;min-height:44px;margin-top:5px;padding:8px;font-size:.8rem;color-scheme:dark; }
.playground-switches { display:flex;flex-wrap:wrap;gap:8px;margin-top:14px; }
.playground-switches button[aria-pressed="true"] { border-color:#36f9c9;color:#36f9c9;background:#12352b; }
.playground-hint { font-size:.71rem; }
.playground-status { color:#8ae8cf;min-height:2.7em;border-top:1px solid #243a34;padding-top:12px;margin-bottom:0; }
.playground-dock :focus-visible,.stickman-grab:focus-visible { outline:2px solid #ffca66;outline-offset:3px; }
.stickman-grab { position:fixed;left:0;top:0;width:44px;height:44px;border:1px dashed var(--grab-color,#36f9c9);border-radius:50%;background:transparent;z-index:1050;touch-action:none;cursor:grab;padding:0;box-shadow:0 0 8px #36f9c922; }
.stickman-grab:active { cursor:grabbing;background:#36f9c922; }
@media(max-width:575px) { .playground-dock { bottom:max(12px,env(safe-area-inset-bottom));left:12px; }.playground-panel { padding:16px; } }
@media(prefers-reduced-motion:reduce) { .playground-dock * { scroll-behavior:auto!important;transition:none!important; } }

#playground-panel { background:#0b141b!important;color:#e6f3f0!important; }
#playground-panel .playground-intro,#playground-panel .playground-hint,#playground-panel label { color:#c1d2df!important;text-shadow:none; }
.playground-options label { min-width:0; }
.playground-switches { flex-wrap:wrap; }
.playground-panel select option { background:#10221f;color:#e6f3f0; }

@supports ((background-clip:text) or (-webkit-background-clip:text)){.hacker-logo-text{background:linear-gradient(135deg,#36f9c9,#9d4edd);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:none}@media(hover:hover){.brand-name:hover .hacker-logo-text,.hacker-logo:hover .hacker-logo-text{background-image:linear-gradient(135deg,#9d4edd,#36f9c9)}}}

.social-brand-icon{display:inline-block;flex:0 0 20px;vertical-align:middle;margin-right:7px}.profile-header .btn{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap}
