@import "https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;600;700;900&family=Rajdhani:wght@400;500;600;700&display=swap";:root{color:#dff7ff;font-synthesis:none;--cyan:#1eeaff;--red:#ff315f;background:#02060c;font-family:Rajdhani,Noto Sans SC,sans-serif}*{box-sizing:border-box}html,body,#app{min-width:320px;min-height:100%;margin:0;overflow:hidden}body{background:radial-gradient(circle at 52% 45%,#071b2b 0,#020912 30%,#02050a 65%);min-height:100vh}button,a{color:inherit;font:inherit}button{cursor:pointer}.noise{z-index:20;pointer-events:none;opacity:.1;mix-blend-mode:screen;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.28'/%3E%3C/svg%3E");position:fixed;inset:0}.topbar{z-index:10;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:#02070db8;border-bottom:1px solid #5fdfff22;justify-content:space-between;align-items:center;gap:20px;height:74px;padding:0 3vw;display:flex;position:relative}.brand{letter-spacing:.08em;flex:none;align-items:center;gap:12px;text-decoration:none;display:flex}.brand-mark{color:#061016;clip-path:polygon(50% 0,95% 20%,83% 84%,50% 100%,17% 84%,5% 20%);background:linear-gradient(135deg,#fff 0 28%,#ff254f 29% 52%,#dffbff 53%);place-items:center;width:37px;height:42px;font-size:25px;font-weight:900;display:grid}.brand span:last-child{line-height:1;display:grid}.brand b{letter-spacing:.25em;font-size:19px}.brand small{color:#7d9ba8;letter-spacing:.52em;margin-top:7px;font:500 10px Noto Sans SC}.era-filter{flex:1;justify-content:center;gap:6px;display:flex}.era-chip{color:#7d9aa6;letter-spacing:.1em;background:#04121a80;border:1px solid #23505e;padding:8px 15px;font:500 12.5px Noto Sans SC;transition:all .25s}.era-chip b{color:#3a7a8a;margin-left:6px;font:600 11.5px Rajdhani}.era-chip:hover{color:#d6f6ff;border-color:#1eeaff66}.era-chip.active{color:#03131a;background:linear-gradient(120deg,#1eeaff,#48ffd0);border-color:#0000;box-shadow:0 0 22px #1eeaff44}.era-chip.active b{color:#03131a99}nav{flex:none;align-self:stretch;align-items:center;gap:7px;display:flex}.nav-btn{color:#7b949e;letter-spacing:.12em;background:0 0;border:0;border-bottom:2px solid #0000;height:100%;padding:0 16px;font-size:13.5px}.nav-btn:hover{color:#e8fcff;border-color:var(--cyan)}.sound-toggle{width:42px;height:36px;color:var(--cyan);background:0 0;border:1px solid #316170;margin-left:6px;padding:0}.sound-toggle.active{background:#0ae9ff1f;box-shadow:0 0 18px #00e5ff22}main{background-image:linear-gradient(#0dcfff07 1px,#0000 1px),linear-gradient(90deg,#0dcfff07 1px,#0000 1px);background-size:64px 64px;height:calc(100vh - 108px);position:relative;overflow:hidden}main:before{content:"";z-index:1;pointer-events:none;background:radial-gradient(#0000 46%,#01050ae0 92%);position:absolute;inset:0}#scene{z-index:3;position:absolute;inset:0}#scene canvas{cursor:grab;width:100%;height:100%;display:block}#scene canvas:active{cursor:grabbing}.tooltip{z-index:15;opacity:0;pointer-events:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#03101799;border:1px solid #1eeaff55;min-width:140px;padding:8px 11px;transition:opacity .18s;position:fixed;top:0;left:0}.tooltip.visible{opacity:1}.tooltip b{letter-spacing:.1em;font:700 14.5px Noto Sans SC;display:block}.tooltip span{color:#8fabb5;margin-top:4px;font:400 10.5px Noto Sans SC;display:block}.tooltip em{color:#3fdcea;letter-spacing:.1em;margin-top:6px;font:500 10.5px Rajdhani;display:block}.hero-copy{z-index:2;pointer-events:none;width:330px;position:absolute;top:6vh;left:3.2vw}.eyebrow{color:#547481;letter-spacing:.22em;font-size:10.5px;font-weight:600}.eyebrow span{vertical-align:middle;background:var(--cyan);width:20px;height:1px;box-shadow:0 0 5px var(--cyan);margin-right:8px;display:inline-block}.hero-copy h1{letter-spacing:-.06em;text-shadow:0 0 32px #9ceeff24;margin:20px 0 16px;font:900 clamp(42px,3.9vw,66px)/1.06 Noto Sans SC}.hero-copy h1 em{color:#0000;-webkit-text-stroke:1px #80afbd;opacity:.66;font-style:normal}.hero-copy p{color:#718b96;letter-spacing:.06em;width:300px;font:300 13.5px/1.9 Noto Sans SC}.legend{color:#7893a0;flex-wrap:wrap;gap:8px 16px;margin-top:22px;font:400 11px Noto Sans SC;display:flex}.legend span{align-items:center;gap:6px;display:flex}.legend i{width:14px;height:2px;box-shadow:0 0 6px}.detail-panel{z-index:8;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,14px 100%,0 calc(100% - 14px));opacity:0;scrollbar-width:thin;scrollbar-color:#1b5766 transparent;background:linear-gradient(145deg,#07131ef2,#02070df2);border:1px solid #3fdcff35;width:min(372px,31vw);padding:16px 24px 20px;transition:all .45s cubic-bezier(.2,.8,.2,1);position:absolute;top:24px;bottom:24px;right:2.6vw;overflow:auto;transform:translate(calc(100% + 5vw));box-shadow:0 20px 70px #000c}.detail-panel.open{opacity:1;transform:none}.close-panel{z-index:2;color:#75909a;background:#04101799;border:1px solid #284955;width:25px;height:25px;font-size:17px;line-height:20px;position:absolute;top:12px;right:12px}.panel-index{color:#3f6472;letter-spacing:.22em;font-size:10.5px}.hero-avatar{border-bottom:1px solid #2bdfff2c;height:186px;margin:8px -4px 6px;position:relative;overflow:hidden}.hero-avatar canvas{object-fit:cover;width:100%;height:100%;display:block}.scanline{background:#5bfbff70;height:1px;animation:4.5s linear infinite scan;position:absolute;top:25%;left:0;right:0;box-shadow:0 0 10px #5bfbff}.hero-era{color:#42edff;letter-spacing:.15em;border:1px solid #266a7a;margin-top:9px;padding:4px 9px;font:500 10.5px Noto Sans SC;display:inline-block}.detail-panel h2{letter-spacing:.06em;margin:9px 9px 0 0;font:800 31px Noto Sans SC;display:inline-block}.hero-en{color:#6f8f9c;letter-spacing:.14em;font-size:10.5px;display:inline-block}.hero-title{color:#a3bac3;letter-spacing:.06em;margin-top:4px;font:400 12px Noto Sans SC}.facts{border-block:1px solid #2b4a542e;grid-template-columns:.55fr 1.45fr;gap:8px;margin:13px 0;padding:11px 0;display:grid}.facts div{gap:4px;display:grid}.facts span{color:#527581;letter-spacing:.15em;font:400 9.5px Noto Sans SC}.facts b{color:#c2d6dd;font:500 12px Noto Sans SC}.bio{color:#7d99a3;text-align:justify;margin:0;font:300 11.5px/1.9 Noto Sans SC}.skill-heading{justify-content:space-between;align-items:center;margin:16px 0 9px;display:flex}.skill-heading span{letter-spacing:.13em;font:600 12px Noto Sans SC}.skill-heading small{color:#42606b;letter-spacing:.15em;font-size:9.5px}.skill{grid-template-columns:22px 1fr 54px 26px;align-items:center;gap:7px;height:27px;font-size:10.5px;display:grid}.skill>span{color:#357785}.skill>b{color:#a6bdc6;white-space:nowrap;font:500 11px Noto Sans SC}.skill>div{background:#15323c;height:3px}.skill>div i{background:linear-gradient(90deg,#14798a,var(--cyan));height:100%;box-shadow:0 0 5px var(--cyan);display:block}.skill em{color:#49ddec;text-align:right;font-style:normal}.relations{flex-wrap:wrap;gap:6px;display:flex}.relation-chip{border:1px solid color-mix(in srgb,var(--chip) 40%,transparent);background:color-mix(in srgb,var(--chip) 9%,transparent);align-items:baseline;gap:6px;padding:5px 9px;transition:all .2s;display:flex}.relation-chip:hover{background:color-mix(in srgb,var(--chip) 22%,transparent);box-shadow:0 0 14px color-mix(in srgb,var(--chip) 30%,transparent)}.relation-chip b{font:500 11px Noto Sans SC}.relation-chip span{color:var(--chip);opacity:.85;font:400 9.5px Noto Sans SC}.voice-btn{text-align:left;background:#04d9ff0b;border:1px solid #16879c;grid-template-rows:1fr 1fr;grid-template-columns:38px 1fr;width:100%;height:56px;margin-top:16px;padding:8px 13px;display:grid}.voice-btn:hover,.voice-btn.speaking{background:#04d9ff1a;box-shadow:inset 0 0 20px #00d9ff0c,0 0 20px #00d9ff0a}.voice-btn.speaking .voice-icon{animation:1s infinite pulse}.voice-icon{color:var(--cyan);grid-row:1/3;align-self:center;font-size:16px}.voice-btn b{letter-spacing:.14em;align-self:end;font:500 12px Noto Sans SC}.voice-btn small{color:#3f707d;letter-spacing:.18em;font-size:8.5px}.coordinates{z-index:4;color:#3a5b68;letter-spacing:.18em;font-size:9.5px;line-height:1.9;position:absolute;bottom:16px;left:3.2vw}.coordinates b{color:#6b8b97;font-weight:400}footer{color:#3a5a66;letter-spacing:.15em;background:#02060b;border-top:1px solid #2aa9c21d;justify-content:space-between;align-items:center;height:36px;padding:0 3vw;font-size:9.5px;display:flex}footer div{color:#4d717d}footer i{background:#34ffc2;border-radius:50%;width:5px;height:5px;margin-right:8px;animation:1.8s infinite pulse;display:inline-block;box-shadow:0 0 8px #34ffc2}footer b{color:#62dbea;margin:0 3px}@keyframes pulse{50%{opacity:.35}}@keyframes scan{0%{top:8%}to{top:92%}}@media (width<=1240px){.era-chip{padding:7px 10px;font-size:11.5px}.era-chip b{display:none}}@media (width<=900px){.topbar{flex-wrap:nowrap;height:62px}.era-filter{justify-content:flex-start;overflow:auto}.nav-btn{display:none}.hero-copy{transform-origin:0 0;top:3vh;left:18px;transform:scale(.86)}.detail-panel{width:340px;max-width:90vw;top:14vh;bottom:14px;right:10px}main{height:calc(100vh - 98px)}.coordinates{display:none}}@media (width<=600px){.hero-copy h1{font-size:38px}.hero-copy p,.legend,.tooltip{display:none}}