:root { --lime:#bdff4c; --lime-deep:#a6e73f; --text:#f4f8f0; --muted:#9ca6a2; --bg:#060809; --mono:'Space Mono',monospace; --title:'Space Grotesk','DM Sans',sans-serif; }
* { box-sizing:border-box; }
html { min-height:100%; background:var(--bg); }
body { min-height:100vh; margin:0; color:var(--text); background:radial-gradient(ellipse at 81% 46%,#13211a 0%,#090e10 31%,#07090b 55%,#050709 100%); font-family:'DM Sans',Arial,sans-serif; overflow-x:hidden; }
body::before { content:""; position:fixed; inset:0; background-image:linear-gradient(rgba(185,255,78,.038) 1px, transparent 1px),linear-gradient(90deg,rgba(185,255,78,.038) 1px, transparent 1px);background-size:74px 74px;mask-image:linear-gradient(90deg,transparent 16%,#000 88%);pointer-events:none; }
body::after { content:""; position:fixed; inset:0; background:radial-gradient(ellipse at 54% 48%,transparent 15%,rgba(0,0,0,.28) 90%);pointer-events:none; }
#network { position:fixed; inset:0; width:100vw; height:100vh;pointer-events:none;opacity:.65; }
.page-frame { position:fixed; inset:14px; border:1px solid rgba(180,245,97,.07);pointer-events:none;z-index:1; }
.page { max-width:1520px; margin:auto; padding:0 clamp(28px,5vw,86px) 22px;position:relative;z-index:2;min-height:100vh;display:flex;flex-direction:column; }
.header { height:92px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(180,235,136,.11); }
.brand { display:flex;align-items:center;gap:14px;min-width:0; }
.brand-icon { display:grid;place-items:center;width:40px;height:40px;color:var(--lime); }
.brand-icon svg { width:38px;height:38px; }
.brand-name { font-family:var(--title);font-size:29px;font-weight:700;letter-spacing:-.075em;line-height:1; }
.brand-period,.headline-dot { color:var(--lime); }
.brand-divider { display:inline-block;width:1px;height:25px;background:#3a473b;margin:0 5px 0 2px; }
.brand-descriptor { font:700 10px/1.6 var(--mono);letter-spacing:.08em;color:#a7b7a7;white-space:nowrap; }
.header-right { font:11px/1 var(--mono);letter-spacing:.065em;color:#8b9b8e;white-space:nowrap;display:flex;gap:12px;align-items:center; }
.header-line { color:#426444; }
.pulse-indicator,.comm-dot {width:7px;height:7px;background:var(--lime);border-radius:50%;box-shadow:0 0 16px rgba(194,255,73,.7);flex-shrink:0;}
.hero { display:grid;grid-template-columns:minmax(440px,52%) minmax(0,48%);gap:0;flex:1;min-height:640px;max-height:820px; }
.copy { padding-top:clamp(42px,6.7vh,86px);padding-bottom:42px;position:relative;z-index:2; }
.eyebrow { font:700 10px/1.3 var(--mono);letter-spacing:.175em;color:var(--lime);display:flex;align-items:center;gap:12px; }
.dash { width:27px;height:1px;background:var(--lime);box-shadow:0 0 8px var(--lime); }
.headline { font-family:var(--title);font-size:clamp(126px,15vw,215px);letter-spacing:-.095em;font-weight:700;line-height:.92;margin:22px 0 0 -10px;color:var(--lime);text-shadow:0 0 60px rgba(185,255,76,.055); }
.headline-dot { font-size:.7em;margin-left:5px; }
.full-name { margin:20px 0 0; font:500 clamp(13px,1.4vw,18px)/1.3 var(--title);letter-spacing:.075em;color:#dfe7dc; }
.full-name strong { color:var(--lime);font-weight:700; }
.tagline { font-family:var(--title);font-size:clamp(27px,3.5vw,47px);line-height:1.14;letter-spacing:-.052em;margin:30px 0 29px;font-weight:700; }
.tagline span { color:var(--lime); }
.section-rule { display:flex;gap:7px;align-items:center;height:1px;background:linear-gradient(90deg,rgba(200,255,127,.35),rgba(200,255,127,.04) 92%,transparent);max-width:580px;position:relative;margin-bottom:30px; }
.section-rule span:first-child { width:32px;height:3px;background:var(--lime);box-shadow:0 0 12px rgba(189,255,76,.55); }
.spec-heading { font:700 10px/1 var(--mono);letter-spacing:.2em;color:#a2b2a2;margin:0 0 16px;display:flex;align-items:center;gap:14px; }
.spec-numeral { color:var(--lime); }
.specializations { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 11px;max-width:630px; }
.spec { display:flex;align-items:center;gap:12px;min-height:51px;padding:10px 12px;background:linear-gradient(115deg,rgba(198,255,127,.055),rgba(255,255,255,.012));border:1px solid rgba(166,215,142,.13);color:#e6f0e5;font-size:clamp(11px,1.05vw,13px);font-weight:700;letter-spacing:-.013em;white-space:nowrap;transition:background .25s,border-color .25s; }
.spec:hover { border-color:rgba(186,255,85,.45);background:rgba(186,255,85,.075); }
.spec-index {color:var(--lime);font:700 10px/1 var(--mono);opacity:.65; }
.spec-mark { margin-left:auto;color:#647a62;font-size:16px;font-weight:400; }
.mascot-zone { position:relative;min-height:620px;isolation:isolate;overflow:hidden; }
.figure-glow { position:absolute;width:600px;height:600px;top:8%;left:14%;border-radius:50%;z-index:-2;background:radial-gradient(circle,rgba(153,219,89,.10),rgba(58,98,79,.055) 42%,transparent 70%);filter:blur(16px); }
.ring { position:absolute;inset:auto;left:13%;top:24%;width:68%;aspect-ratio:1/1;border:1px solid rgba(171,244,98,.12);border-radius:50%;z-index:-1; }
.ring::after { content:"";position:absolute;inset:7%;border:1px dashed rgba(173,225,159,.1);border-radius:50%; }
.ring-two { left:8%;top:18%;width:79%;border-color:rgba(124,194,104,.055); }
.figure-topline { position:absolute;top:36px;left:32px;right:12px;display:flex;align-items:center;justify-content:space-between;font:10px/1.3 var(--mono);letter-spacing:.09em;color:rgba(166,208,160,.64);z-index:3;pointer-events:none; }
.aimer { color:var(--lime);font-size:9px; }
.mascot { position:absolute;inset:0 0 0 0; width:min(100%,690px);height:auto;aspect-ratio:690/850;bottom:0;top:auto;left:50%;transform:translateX(-50%);pointer-events:none; }
.mascot img {position:absolute;display:block;height:auto;user-select:none;-webkit-user-drag:none;pointer-events:none;}
.mascot-body {left:0;top:0;width:100%;filter:drop-shadow(0 10px 44px rgba(162,255,124,.085));}
.mascot-head {left:calc(210 / 690 * 100%);top:0;width:calc(307 / 690 * 100%);height:auto;transform-origin:50% 79%;will-change:transform;backface-visibility:hidden;filter:drop-shadow(0 4px 5px rgba(0,0,0,.05));}
.figure-coordinate { position:absolute;bottom:15%;right:0;font:10px/1.9 var(--mono);letter-spacing:.1em;color:rgba(168,209,161,.48);text-align:right; }
.figure-line { position:absolute;right:0;top:31%;height:20%;width:1px;background:linear-gradient(transparent,rgba(179,255,86,.42),transparent); }
.comm-panel { min-height:102px;z-index:4;border:1px solid rgba(182,247,98,.24);border-left:3px solid var(--lime);background:linear-gradient(100deg,rgba(15,26,20,.97),rgba(8,14,16,.94));box-shadow:0 12px 65px rgba(0,0,0,.24),inset 0 1px 0 rgba(182,255,105,.09);display:grid;align-items:center;grid-template-columns:minmax(0,1fr) auto;column-gap:18px;padding:17px 24px;margin-top:-16px; }
.comm-identity { grid-column:1 / 2;color:var(--lime);font:700 10px/1 var(--mono);letter-spacing:.17em;display:flex;align-items:center;gap:11px; }
.comm-dot { width:6px;height:6px;animation:pulse 2s ease-in-out infinite; }
.comm-text { grid-column:1 / 2;margin-top:13px;font-family:var(--title);font-weight:600;font-size:clamp(16px,1.65vw,22px);letter-spacing:-.035em;min-height:28px;white-space:normal;color:#eef5e9; }
.prompt-chevron { color:var(--lime);font-family:var(--mono);font-size:18px;margin-right:10px; }
.typing-caret {display:inline-block;margin-left:3px;width:2px;height:18px;vertical-align:-2px;background:var(--lime);animation:blink 1s step-end infinite; }
.comm-right { grid-column:2 / 3;grid-row:1 / span 2;display:flex;align-items:center;gap:22px; }
#messageCounter {font:11px/1 var(--mono);white-space:nowrap;color:#809484; }
.voice-button {display:flex;align-items:center;gap:8px;white-space:nowrap;padding:11px 14px;min-height:43px;color:#b4c4b2;border:1px solid rgba(182,255,95,.25);background:rgba(184,244,96,.035);font:700 10px/1 var(--mono);letter-spacing:.07em;cursor:pointer;transition:.2s;}
.voice-button:hover,.voice-button[aria-pressed="true"] {border-color:var(--lime);color:var(--lime);background:rgba(184,244,96,.09);}
.voice-button svg {width:17px;height:17px;}
.bottom-meta {display:flex;justify-content:space-between;gap:22px;padding-top:19px;font:10px/1.4 var(--mono);letter-spacing:.115em;color:rgba(173,204,169,.46); }
.toast { position:fixed;bottom:24px;right:24px;max-width:360px;padding:14px 18px;background:#171e1b;border:1px solid var(--lime);font:12px/1.6 var(--mono);z-index:15;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .25s,transform .25s; }
.toast.visible {opacity:1;transform:translateY(0);}
@keyframes blink {50%{opacity:0}} @keyframes pulse {50%{opacity:.35;box-shadow:none}}
@media(min-width:1460px) { .hero { min-height:700px; }.copy {padding-top:70px;} }
@media(min-width:1020px) and (max-height:800px) { .hero{min-height:575px;}.copy{padding-top:28px;padding-bottom:15px;}.headline{font-size:clamp(115px,13vw,165px);margin-top:11px}.full-name{margin-top:8px}.tagline{font-size:clamp(25px,2.9vw,36px);margin:18px 0 20px}.section-rule{margin-bottom:18px}.spec-heading{margin-bottom:10px}.spec{min-height:41px;padding:7px 10px}.header{height:76px}.mascot-zone{min-height:550px}.comm-panel{min-height:86px;padding:12px 20px}.comm-text{font-size:17px;margin-top:8px}.bottom-meta{padding-top:10px;} }
@media(max-width:1100px) { .header-right{display:none}.hero{grid-template-columns:minmax(380px,55%) minmax(0,45%);min-height:650px}.mascot {width:122%;max-width:none}.copy{padding-top:60px}.headline{font-size:clamp(118px,15vw,160px)}.specializations{grid-template-columns:1fr;max-width:360px}.spec{min-height:39px}.tagline{font-size:32px}.comm-panel{margin-top:2px} }
@media(max-width:760px) { .page{padding:0 22px 22px}.header{height:73px}.brand-icon{width:31px}.brand-icon svg{width:31px}.brand-name{font-size:25px}.brand-descriptor{font-size:8px}.header-right{display:none}.hero{display:flex;flex-direction:column;max-height:none;min-height:0}.copy{padding:41px 0 0;}.eyebrow{font-size:9px}.headline{font-size:clamp(115px,26vw,176px);margin:15px 0 0 -5px}.full-name{font-size:clamp(12px,3.2vw,17px);margin:4px 0 0}.tagline{font-size:clamp(29px,7vw,43px);margin:22px 0 25px}.section-rule{margin-bottom:21px}.specializations{grid-template-columns:1fr 1fr;max-width:none}.spec{font-size:11px;padding:7px 8px;min-height:49px;gap:7px;white-space:normal}.spec-index{font-size:9px}.spec-mark{display:none}.mascot-zone{min-height:540px;margin-top:0}.mascot{width:min(100%,540px)}.figure-topline{top:26px;left:7px;right:7px}.figure-coordinate{right:6px;bottom:10%}.comm-panel{padding:15px 14px;grid-template-columns:1fr;gap:0;margin-top:-45px}.comm-identity{grid-column:1}.comm-text{grid-column:1;font-size:17px;min-height:48px}.comm-right{grid-column:1;grid-row:auto;justify-content:space-between;margin-top:12px}.voice-button{min-height:37px}.bottom-meta{font-size:8px;flex-wrap:wrap;gap:8px}.page-frame{inset:8px} }
@media(max-width:390px) {.page{padding:0 16px 18px}.brand-descriptor{font-size:7px}.brand-divider{margin:0}.spec{font-size:10px}.mascot-zone{min-height:450px}.figure-coordinate{display:none}.comm-panel{margin-top:-22px}.headline{font-size:112px} }
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;} }