
.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:112px 0 26px;position:relative;isolation:isolate;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.03fr .97fr;align-items:center;gap:clamp(24px,4vw,66px);flex:1}
.hero-copy{position:relative;z-index:2;padding:25px 0 48px}.hero-kicker{display:flex;align-items:center;gap:12px;margin-bottom:30px;color:var(--muted)}
.status-dot{width:7px;height:7px;border-radius:50%;background:#c74bf6;box-shadow:0 0 18px #b65bff;animation:dot-pulse 2.6s ease-in-out infinite}
.hero-title{font-size:clamp(4rem,8.3vw,7.7rem);line-height:.92;letter-spacing:-.095em;font-weight:800;max-width:760px}.hero-title>span{display:block}
.gradient-text{width:max-content;max-width:100%;padding-right:.12em;background:linear-gradient(105deg,#d94df3 0%,#9b68ff 34%,#567cff 63%,#e65ce8 82%,#d94df3 100%);background-size:260% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:gradient-drift 7s ease-in-out infinite alternate}
.hero-subtitle{font-size:clamp(1.05rem,1.65vw,1.35rem);max-width:460px;margin-top:27px;font-weight:650;letter-spacing:-.025em}.hero-intro{font-size:.87rem;color:var(--muted);max-width:420px;margin-top:13px}
.hero-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:25px}.btn-quiet{background:transparent}
.hero-art{position:relative;min-height:clamp(420px,48vw,660px);display:grid;place-items:center;isolation:isolate}.hero-art:before{content:"";position:absolute;inset:12% 0 4%;background:radial-gradient(ellipse at 54% 48%,var(--hero-glow),transparent 65%);filter:blur(20px);z-index:-2}
.hero-orbit{position:absolute;width:88%;aspect-ratio:1;border:1px solid var(--grid);border-radius:50%;transform:rotate(-18deg);mask-image:linear-gradient(to bottom,black,transparent 90%);z-index:-1}.hero-orbit:before,.hero-orbit:after{content:"";position:absolute;border:1px solid var(--grid);inset:12%;border-radius:50%;transform:rotate(38deg)}.hero-orbit:after{inset:25%;transform:rotate(-58deg)}
.hero-portrait{position:relative;width:min(100%,580px);height:100%;display:grid;place-items:center;z-index:1;mask-image:linear-gradient(to bottom,black 75%,transparent 100%)}.hero-portrait img{width:100%;height:100%;max-height:640px;object-fit:contain;filter:drop-shadow(0 18px 38px var(--hero-glow))}
.hero-side-note{position:absolute;right:0;top:20%;font:.62rem 'DM Mono',monospace;letter-spacing:.12em;writing-mode:vertical-rl;color:var(--muted)}.hero-coordinate{position:absolute;bottom:13%;left:0;color:var(--muted);font-size:.62rem;letter-spacing:.12em}
.hero-circuit{position:absolute;pointer-events:none;opacity:.38;color:var(--accent);width:260px;height:220px;background:linear-gradient(currentColor,currentColor) 0 25px/105px 1px no-repeat,linear-gradient(currentColor,currentColor) 105px 25px/1px 42px no-repeat,linear-gradient(currentColor,currentColor) 105px 67px/65px 1px no-repeat,linear-gradient(currentColor,currentColor) 65px 132px/115px 1px no-repeat,linear-gradient(currentColor,currentColor) 65px 132px/1px 42px no-repeat,radial-gradient(circle,currentColor 0 3px,transparent 3.5px) 99px 19px/12px 12px no-repeat,radial-gradient(circle,currentColor 0 3px,transparent 3.5px) 164px 61px/12px 12px no-repeat}
.hero-circuit-a{top:17%;right:38%}.hero-circuit-b{bottom:18%;right:6%;transform:rotate(180deg);opacity:.23}
.hero-bottom-line{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--border);padding-top:14px;color:var(--muted);font:.62rem 'DM Mono',monospace;letter-spacing:.1em}
.scroll-cue{display:inline-flex;align-items:center;gap:12px;margin-top:40px;color:var(--muted);font:.64rem 'DM Mono',monospace;letter-spacing:.12em}.scroll-cue-icon{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--border);border-radius:50%;transition:transform .25s,border-color .25s}.scroll-cue:hover .scroll-cue-icon{transform:translateY(4px);border-color:var(--accent)}
.section{padding:clamp(76px,9vw,130px) 0;position:relative;isolation:isolate}.section-head{display:grid;grid-template-columns:1fr minmax(260px,.7fr);align-items:end;gap:36px;margin-bottom:35px}.section-index{font:.68rem 'DM Mono',monospace;color:var(--accent);margin-bottom:14px;letter-spacing:.1em}
.section-head h1,.section-head h2{font-size:clamp(2.5rem,5.5vw,4.65rem);line-height:.98;letter-spacing:-.075em;font-weight:750}.section-head>p{max-width:450px;color:var(--muted);font-size:.91rem;justify-self:end}.heading-period{color:var(--accent)}
.data-section{border-top:1px solid var(--border);border-bottom:1px solid var(--border);overflow:hidden}.data-feature-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:16px}
.data-feature,.data-mini{min-width:0;border:1px solid var(--border);border-radius:20px;overflow:hidden;background:var(--surface);box-shadow:var(--shadow);transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .3s}.data-feature:hover,.data-mini:hover{transform:translateY(-5px);border-color:var(--accent)}.data-feature>a,.data-mini>a{display:block;height:100%}
.feature-image{position:relative;height:100%;min-height:590px;overflow:hidden;background:var(--surface-2);display:flex;flex-direction:column;justify-content:space-between}.feature-image:before,.mini-visual:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(140deg,transparent 30%,var(--hero-glow));z-index:1}
.feature-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.83;transition:transform .8s,opacity .4s}.data-feature:hover img{transform:scale(1.04);opacity:1}.visual-label{position:absolute;top:20px;left:22px;z-index:2;font-size:.58rem;letter-spacing:.13em;color:var(--muted)}
.feature-image-shade{position:absolute;inset:35% 0 0;background:linear-gradient(transparent,var(--bg) 105%);z-index:1;opacity:.92}.feature-caption{position:relative;z-index:2;margin-top:auto;padding:30px}.feature-caption h2{font-size:clamp(1.8rem,3vw,3rem);line-height:1.02;letter-spacing:-.06em;margin:10px 0}.feature-caption p{max-width:400px;font-size:.85rem;color:var(--muted)}.feature-arrow{position:absolute;right:22px;bottom:25px;z-index:3;font-size:1.1rem;color:var(--accent)}
.data-side-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:16px}.data-mini{display:flex;flex-direction:column}.data-mini>a{display:flex;flex-direction:column}
.mini-visual{position:relative;min-height:145px;aspect-ratio:1.7/1;background:var(--surface-2);overflow:hidden}.mini-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.9;transition:transform .7s}.data-mini:hover .mini-visual img{transform:scale(1.06)}.mini-visual .visual-label{top:13px;left:14px;font-size:.52rem}.mini-arrow{position:absolute;right:14px;bottom:11px;z-index:2;color:var(--accent)}
.mini-copy{padding:17px 18px 19px;flex:1}.mini-copy h2{font-size:clamp(.95rem,1.3vw,1.12rem);line-height:1.2;letter-spacing:-.035em;margin:8px 0}.mini-copy p{font-size:.75rem;color:var(--muted);line-height:1.5}.tag{font:.59rem 'DM Mono',monospace;letter-spacing:.07em;text-transform:uppercase;color:var(--accent)}
.data-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:22px;color:var(--muted);font-size:.64rem}
.projects-section{overflow:hidden}.project-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.project-card{position:relative;min-height:225px;padding:22px 19px;border:1px solid var(--border);border-radius:16px;background:color-mix(in srgb,var(--surface) 90%,transparent);display:flex;flex-direction:column;justify-content:space-between;gap:22px;transition:transform .3s,border-color .3s}.project-card:hover{transform:translateY(-5px);border-color:var(--accent);background:var(--surface-2)}.project-icon{display:grid;place-items:center;width:47px;height:47px;color:var(--accent);border:1px solid var(--border);border-radius:13px;background:var(--surface-2)}.project-icon svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.6}.excel-icon{font-size:1.55rem;font-weight:800;color:#22b86b;border-color:#22b86b55}.project-card h3{font-size:1rem;letter-spacing:-.035em;margin-bottom:7px}.project-card p{font-size:.77rem;line-height:1.5;color:var(--muted)}.project-meta{display:block;margin-top:15px;font:.55rem 'DM Mono',monospace;letter-spacing:.06em;color:var(--muted)}.project-arrow{position:absolute;right:17px;top:20px;color:var(--accent);opacity:.75}
.blog-section,.store-section{border-top:1px solid var(--border)}.post-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.section-action{margin-top:25px}
.about-strip{display:grid;grid-template-columns:1fr 1fr;gap:clamp(25px,6vw,80px);align-items:center;padding:clamp(24px,4vw,48px);border:1px solid var(--border);border-radius:22px;background:var(--surface);position:relative;overflow:hidden}.about-strip:after{content:"";position:absolute;right:-60px;bottom:-130px;width:290px;aspect-ratio:1;border:1px solid var(--grid);border-radius:50%;box-shadow:0 0 0 35px var(--grid);pointer-events:none}.about-strip h2{font-size:clamp(1.9rem,4vw,3.3rem);letter-spacing:-.065em;line-height:1.03}.about-strip p{font-size:.9rem;color:var(--muted);max-width:500px}.about-facts{display:flex;flex-wrap:wrap;gap:9px;margin:19px 0 22px}.about-facts span{padding:7px 10px;border:1px solid var(--border);border-radius:8px;color:var(--muted);font-size:.68rem}
@keyframes gradient-drift{0%{background-position:0% 50%}100%{background-position:100% 50%}}@keyframes dot-pulse{0%,100%{box-shadow:0 0 8px #b65bff;opacity:1}50%{box-shadow:0 0 20px #b65bff;opacity:.65}}
@media(max-width:900px){.hero{min-height:auto;padding:125px 0 24px}.hero-grid{grid-template-columns:1fr .85fr;gap:20px}.hero-title{font-size:clamp(3.6rem,8.5vw,6rem)}.hero-art{min-height:430px}.data-feature-grid{grid-template-columns:1fr}.feature-image{min-height:450px}.data-side-grid{grid-template-rows:auto}.mini-visual{aspect-ratio:1.8/1}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section-head{grid-template-columns:1fr .8fr;gap:20px}}
@media(max-width:620px){.hero{padding-top:110px;min-height:auto}.hero-grid{grid-template-columns:1fr;gap:0}.hero-copy{padding:25px 0 0}.hero-kicker{margin-bottom:22px}.hero-title{font-size:clamp(3.5rem,15vw,5.4rem)}.hero-subtitle{margin-top:21px}.hero-art{min-height:310px;margin-top:-4px}.hero-portrait{width:78%;max-height:360px}.hero-side-note{right:4%;top:16%}.hero-coordinate{left:4%;bottom:8%}.hero-circuit-a{top:45%;right:45%;transform:scale(.7)}.hero-circuit-b{bottom:17%;right:0;transform:scale(.65) rotate(180deg)}.hero-bottom-line{font-size:.53rem}.scroll-cue{margin-top:27px}.section{padding:76px 0}.section-head{grid-template-columns:1fr;gap:16px;margin-bottom:24px}.section-head>p{justify-self:start;font-size:.85rem}.section-head h1,.section-head h2{font-size:clamp(2.6rem,11vw,3.6rem)}.data-feature-grid{gap:12px}.feature-image{min-height:420px}.feature-caption{padding:22px}.data-side-grid{gap:10px}.mini-visual{aspect-ratio:1.25/1;min-height:115px}.mini-copy{padding:13px}.mini-copy h2{font-size:.92rem}.mini-copy p{font-size:.7rem}.data-footer{align-items:flex-start;flex-direction:column}.project-grid{gap:10px}.project-card{padding:17px 14px;min-height:220px}.project-card h3{font-size:.95rem}.project-card p{font-size:.72rem}.project-meta{font-size:.49rem}.post-grid{grid-template-columns:1fr}.about-strip{grid-template-columns:1fr;padding:23px;gap:24px}}
@media(prefers-reduced-motion:reduce){.gradient-text,.status-dot{animation:none}}


/* v10: restore the original theme-aware ASCII portrait in the hero */
.hero-art{position:relative;min-height:540px;display:grid;place-items:center;isolation:isolate}
.hero-art:before{content:"";position:absolute;width:85%;aspect-ratio:1;border-radius:50%;background:var(--hero-glow);filter:blur(45px);z-index:-1}
.hero-portrait{position:relative;display:block;width:min(100%,570px);height:min(78vh,690px);z-index:1;mask-image:linear-gradient(to bottom,#000 76%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 76%,transparent 100%)}
.hero-portrait img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;filter:drop-shadow(0 20px 45px var(--hero-glow))}
:root[data-theme="dark"] .hero-portrait img{filter:brightness(0) invert(1) drop-shadow(0 20px 45px var(--hero-glow))}
:root[data-theme="light"] .hero-portrait img{filter:brightness(0) saturate(100%) invert(9%) sepia(12%) saturate(900%) hue-rotate(210deg) brightness(90%) contrast(95%)}
.circuit{position:absolute;inset:0;width:100%;height:100%;color:var(--accent);opacity:.5;pointer-events:none;z-index:0}
.hero-side-note{position:absolute;right:0;top:15%;font:.65rem 'DM Mono',monospace;letter-spacing:.1em;writing-mode:vertical-rl;color:var(--muted);z-index:2}
.hero-coordinate{position:absolute;left:18%;bottom:8%;font-size:.62rem;letter-spacing:.1em;color:var(--muted);z-index:2}
@media(max-width:900px){.hero-art{min-height:420px}.hero-portrait{height:min(68vh,570px);width:min(100%,460px)}}
@media(max-width:620px){.hero-art{min-height:320px;grid-row:1}.hero-portrait{height:340px;width:min(90%,330px)}.hero-side-note{right:4%;font-size:.55rem}.hero-coordinate{left:10%;bottom:3%;font-size:.55rem}}
