/* A: a photographic horizon, with motion owned only by stellar.js. */
.home-stellar {
    --sky-deep: #0b1015;
    --text-primary: #f4f6f7;
    --text-secondary: #b8c3cc;
    --stellar-surface: #0b1015;
    --stellar-line: #45525c;
    --stellar-picture: url('../imgs/stellar/night.webp');
    --stellar-offset: 0px;
    --stellar-scale: 1;
    --stellar-veil: 0;
    --stellar-chrome: rgba(11, 16, 21, 0.92);
    --preview-accent: #7ccfdd;
    background: var(--stellar-surface);
    font-size: 1.0625rem;
    font-weight: 400;
    -webkit-text-size-adjust: 100%;
}
:root[data-theme="light"] .home-stellar {
    --sky-deep: #f3f7f8;
    --text-primary: #182d3a;
    --text-secondary: #465d6a;
    --stellar-surface: #f3f7f8;
    --stellar-line: #9bafb9;
    --stellar-picture: url('../imgs/stellar/day.webp');
    --stellar-chrome: rgba(250, 252, 253, 0.94);
    --preview-accent: #1d7181;
}
.home-stellar *, .home-stellar *::before, .home-stellar *::after { letter-spacing: 0 !important; }
.stellar-scene { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.stellar-world { position: absolute; inset: 0; transform: translate3d(0, var(--horizon-travel, 0px), 0); }
.stellar-panorama {
    position: absolute; inset: 0;
    background-image: var(--stellar-picture);
    background-size: cover; background-position: center;
}
.stellar-stars { position: absolute; inset: 0; }
.stellar-stars canvas { display: block; width: 100%; height: 100%; }
.stellar-scene:not(.has-landscape) .stellar-stars { visibility: hidden; }
.stellar-stars.is-lost { visibility: hidden; }
.stellar-veil { position: absolute; inset: 0; background: var(--stellar-surface); opacity: var(--stellar-veil); }
.has-chapter-transitions .stellar-veil {
    --reading-edge: max(0px, calc((100vw - 1300px) / 2));
    background: linear-gradient(90deg, rgba(var(--chapter-rgb), .2), var(--chapter-surface) var(--reading-edge), var(--chapter-surface) calc(100% - var(--reading-edge)), rgba(var(--chapter-rgb), .2));
    -webkit-mask-image: linear-gradient(to bottom, transparent var(--horizon-start), #000 var(--horizon-end));
    mask-image: linear-gradient(to bottom, transparent var(--horizon-start), #000 var(--horizon-end));
}
.home-stellar.is-motion-limited .stellar-stars { display: none; }
.home-stellar:not(.is-motion-limited) .stellar-scene.has-landscape .stellar-veil { visibility: hidden; }
:root .home-stellar.has-chapter-transitions .section::before { background: none; }
.home-stellar.has-chapter-transitions .section > .section-header {
    transform: translateY(var(--chapter-rise, 0px)); opacity: 1; filter: none; transition: none;
}
.home-stellar.has-chapter-transitions .works-group-label { background: var(--chapter-surface, var(--stellar-surface)); }
.home-stellar.has-chapter-transitions .outlook { border-color: transparent; }
.home-stellar .nav { justify-content: space-between; padding: 18px 5%; gap: 30px; transition: background .35s; border-bottom: 1px solid transparent; }
.home-stellar .nav.scrolled { background: var(--stellar-chrome); padding: 18px 5%; border-bottom-color: var(--glass-border); }
.home-stellar .nav ul { gap: 30px; margin-left: 0; }
.home-stellar .nav a { font-size: 0.9375rem; text-transform: none; }
.home-stellar .nav ul a { display: flex; align-items: center; min-height: 44px; }
.home-stellar .nav-tools { position: static; transform: none; }
.home-stellar .theme-btn, .home-stellar .lang-btn, .home-stellar .nav-menu-button, .home-stellar .motion-btn {
    min-width: 44px; height: 44px; border-radius: 50%; box-shadow: none;
    color: var(--text-primary); font-family: var(--font-sans); touch-action: manipulation;
}
.home-stellar .motion-btn { display: grid; place-items: center; border: 1px solid var(--glass-border); background: var(--glass-bg); }
.motion-btn i { width: 18px; height: 18px; background: currentColor; mask: url('../imgs/icons/lucide/pause.svg') center / contain no-repeat; }
.motion-btn[aria-pressed="true"] i { mask-image: url('../imgs/icons/lucide/play.svg'); }
.home-stellar .motion-btn:disabled { opacity: .4; }
.home-stellar.has-ambient-motion .scroll-line { animation: scroll-breathe 2.8s ease-in-out infinite; }
@keyframes scroll-breathe { 0%, 100% { transform: scaleY(.65); } 50% { transform: scaleY(1); } }
.home-stellar .lang-btn { border-radius: 24px; font-size: 0.9375rem; }
.home-stellar .lang-btn #currentFlag, .home-stellar .lang-btn > span:last-child { display: none; }
.home-stellar .lang-btn #currentLang { display: inline; }
.home-stellar .lang-dropdown { border-radius: 16px; overflow: hidden; min-width: 156px; background: var(--stellar-chrome); }
.home-stellar .lang-option { width: 100%; min-height: 48px; border: 0; background: none; font: inherit; font-size: 1rem; text-align: left; }
.home-stellar .lang-switcher:hover .lang-dropdown:not(.active) { opacity: 0; visibility: hidden; }
.home-stellar .nav-menu-button { display: none; align-items: center; justify-content: center; border: 1px solid var(--glass-border); background: var(--glass-bg); padding: 0; }
.home-stellar .nav-menu-button span { width: 22px; height: 22px; background: currentColor; mask: url('../imgs/icons/lucide/menu.svg') center / contain no-repeat; }
.home-stellar .nav-menu-button[aria-expanded="true"] span { mask-image: url('../imgs/icons/lucide/x.svg'); }
.home-stellar .hero {
    height: auto; min-height: calc(100svh - 104px);
    padding: 140px 6% 132px;
    justify-content: flex-start; overflow: visible;
}
.home-stellar .hero-content { width: min(1180px, 100%); margin: 0 auto; padding: 0; text-align: left; }
.home-stellar .hero-signature { display: block; width: 100%; height: 100%; padding: 0; background: none; border: none; color: inherit; }
.home-stellar .hero-hand { width: 100%; height: 100%; max-width: 100%; }
.home-stellar .hero-content h1 {
    display: block; width: min(460px, 100%); height: 156px; margin: 0 0 32px;
    line-height: 1; color: var(--text-primary); opacity: 1;
    filter: none; animation: none; cursor: inherit;
}
.home-stellar .hero-divider { display: none; }
.home-stellar .hero-content p { opacity: 1; animation: none; text-transform: none; font-weight: 400; }
.home-stellar .hero-content .hero-thought { font-size: 1.5rem; line-height: 1.65; font-weight: 400; color: var(--text-primary); margin: 0 0 12px; max-width: 560px; text-wrap: pretty; }
.home-stellar .hero-content .hero-thought { max-width: 620px; margin-bottom: 32px; }
.home-stellar .hero-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: min(560px, 100%); align-items: stretch; gap: 12px; opacity: 1; animation: none; }
.home-stellar .hero-actions .cta-button { display: flex; width: 100%; height: 100%; min-width: 0; align-items: center; justify-content: center; min-height: 48px; padding: 12px 14px; font-size: 0.9375rem; line-height: 1.4; text-transform: none; border-radius: 24px; white-space: normal; text-align: center; overflow-wrap: anywhere; }
.home-stellar .star-border { padding: 0; border-radius: 24px; }
.home-stellar .star-border::before, .home-stellar .star-border::after { display: none; }
.home-stellar .star-border .cta-button { background: #e9f2f5; border-color: #e9f2f5; color: #172833; }
.home-stellar .scroll-indicator { left: 50%; right: auto; bottom: 28px; transform: translateX(-50%); color: #fff; text-shadow: 0 1px 5px #152832; }
.home-stellar .scroll-indicator span { color: inherit; font-weight: 500; }
.home-stellar .scroll-line { animation: none; height: 32px; background: linear-gradient(to bottom, currentColor, transparent); }
.home-stellar .section { padding: 90px max(6%, calc((100% - 1180px) / 2)); scroll-margin-top: 68px; }
:root .home-stellar .section::before { background: var(--stellar-surface); }
.home-stellar .section-header { text-align: left; margin-bottom: 48px; }
.home-stellar .section-header h2 { font-size: 2.625rem; font-weight: 600; margin-bottom: 12px; }
.home-stellar .section-header p { text-transform: none; font-size: 1rem; line-height: 1.7; }
.home-stellar .about { padding-top: 44px; }
.home-stellar .section.about::before { background: var(--stellar-surface); opacity: 1; }
.home-stellar .about > .section-header { opacity: 1; transform: none; filter: none; }
.home-stellar .about-content { grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); gap: 72px; align-items: start; }
/* WebKit's intrinsic text/image widths must not enlarge the reading columns. */
.home-stellar .about-content > *, .home-stellar .outlook-body > *, .home-stellar .outlook-directions > * { min-width: 0; }
.home-stellar .about-text h3 { font-size: 25px; line-height: 1.5; }
.home-stellar .about-text p { font-size: 1.0625rem; font-weight: 400; line-height: 1.85; }
.home-stellar .about-facts .fact-v { font-weight: 400; }
.home-stellar .about-image { height: auto; aspect-ratio: 4 / 5; border-radius: 8px; clip-path: inset(var(--photo-inset, 0%) round 8px); }
.home-stellar .journey { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 64px; align-items: start; }
.home-stellar .journey .section-header { position: sticky; top: 130px; }
.home-stellar .timeline { width: 100%; }
.home-stellar .timeline-progress { position: absolute; left: 5px; top: 6px; bottom: 6px; width: 1px; background: var(--meteor-blue); transform: scaleY(var(--journey-progress, 0)); transform-origin: top; }
.home-stellar .timeline-item p { font-size: 1rem; line-height: 1.8; font-weight: 400; }
.home-stellar .timeline-item.is-current::before { background: var(--meteor-blue); box-shadow: 0 0 0 5px var(--glass-bg); }
.home-stellar .flow-menu { max-width: none; }
.home-stellar .flow-face { padding: 28px 0; }
.home-stellar .flow-face h3 { font-size: 30px; }
.home-stellar .bento-grid { max-width: none; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: auto; gap: 32px; }
.home-stellar .bento-card { border-radius: 8px; padding: 28px; display: block; }
.home-stellar .bento-card h3 { font-size: 26px; overflow-wrap: anywhere; }
.home-stellar .bento-card p { font-size: 1rem; font-weight: 400; max-width: 100%; line-height: 1.8; }
.home-stellar .bento-grid--quad .bento-card { grid-column: auto; }
.home-stellar .bento-card[data-project="exarestaurant"] { grid-column: 1 / -1; }
.home-stellar .bento-card :is(h3, p, .bento-date) { text-shadow: none; }
.home-stellar .bento-card .bento-contribution { border-top: 1px solid var(--glass-border); padding-top: 14px; margin-top: 16px; color: var(--meteor-blue); }
.home-stellar .bento-date { display: block; text-align: right; }
.home-stellar .bento-card::after { content: none; }
.home-stellar .bento-card:hover { transform: translateY(-4px); box-shadow: none; }
.home-stellar .works-chapter + .works-chapter { margin-top: 64px; }
.home-stellar .works-group-label { position: relative; z-index: 1; max-width: none; margin: 0 0 28px; padding: 18px 0; background: var(--stellar-surface); text-transform: none; flex-wrap: wrap; }
.home-stellar .wgl-t { font-size: 20px; color: var(--text-primary); }
.home-stellar .wgl-sub { font-size: 0.875rem; color: var(--text-secondary); }
.home-stellar .focus-zoom { transform: none !important; filter: none !important; opacity: 1 !important; }
.home-stellar .bento-media { position: relative; inset: auto; height: 260px; margin: -28px -28px 24px; overflow: hidden; clip-path: inset(0 var(--art-inset, 0%)); }
.home-stellar .bento-media::after { background: none; }
:root[data-theme] .home-stellar .bento-media::after { display: none; }
:root[data-theme] .home-stellar .bento-card .bento-media img,
:root[data-theme] .home-stellar .bento-card:hover .bento-media img { opacity: 1; filter: none; }
.home-stellar .bento-media img, .home-stellar .bento-card:hover .bento-media img { opacity: 1; transform: translate3d(0, var(--art-offset, 0px), 0) scale(var(--art-scale, 1.12)); transition: none; }
.home-stellar .bento-card:not(.featured-project) .bento-media { height: auto; aspect-ratio: 16 / 10; }
.home-stellar .bento-card:not(.featured-project) .bento-media img, .home-stellar .bento-card:not(.featured-project):hover .bento-media img { transform: none; object-fit: cover; }
.home-stellar .bento-tag, .home-stellar .bento-badge, .home-stellar .bento-live { color: #fff; background: rgba(11, 16, 21, 0.8); padding: 5px 10px; border-radius: 4px; }
.home-stellar .bento-card[data-project="exarestaurant"] .bento-media, .home-stellar .bento-card[data-project="yukaflow"] .bento-media { height: 340px; }
.home-stellar .outlook { padding-block: 110px; border-top: 1px solid var(--glass-border); border-bottom: 1px solid var(--glass-border); }
.home-stellar .outlook .section-header { margin-bottom: 32px; }
.home-stellar .outlook-intro { max-width: 730px; font-size: 22px; line-height: 1.9; }
.home-stellar .outlook-body { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: start; gap: 100px; }
.home-stellar .outlook-intro { position: sticky; top: 140px; }
.home-stellar .outlook-directions { display: grid; grid-template-columns: minmax(0, 1fr); gap: 60px; }
.home-stellar .outlook-directions > div { min-height: 200px; }
.home-stellar .outlook-directions > div { border-top: 1px solid var(--stellar-line); padding-top: 22px; transform: translateY(var(--outlook-rise, 0px)); opacity: 1; }
.home-stellar .outlook-directions h3 { font-size: 19px; line-height: 1.5; font-weight: 500; margin-bottom: 14px; }
.home-stellar .outlook-directions p { font-size: 1rem; line-height: 1.85; color: var(--text-secondary); }
.home-stellar .contact { padding-bottom: 100px; }
.home-stellar .contact .section-header { text-align: center; }
.home-stellar .contact .section-header h2 { margin-inline: auto; }
.home-stellar .site-footer p { text-transform: none; }
.home-stellar :focus-visible { outline: 2px solid var(--meteor-blue); outline-offset: 5px; }
.home-stellar .hero-signature:focus-visible { border-radius: 4px; }
.home-stellar .social-sidebar a { background: transparent; border-color: transparent; box-shadow: none; }
.home-stellar .social-sidebar img { filter: grayscale(1) brightness(0) invert(1); opacity: .8; }
:root[data-theme="light"] .home-stellar .social-sidebar img { filter: grayscale(1) brightness(0); opacity: .7; }
:root[data-theme="light"] .home-stellar .scroll-indicator { color: var(--text-primary); text-shadow: 0 1px 4px #fff; }
.home-stellar .hero-thought { text-wrap: balance !important; }
.home-stellar #heroSvg stop:first-child { stop-color: #f4fbff; }
.home-stellar #heroSvg stop:nth-child(2) { stop-color: #c5e5ee; }
.home-stellar #heroSvg stop:nth-child(3) { stop-color: #92c7da; }
.home-stellar #heroSvg stop:last-child { stop-color: #849fb9; }
:root[data-theme="light"] .home-stellar #heroSvg stop:first-child { stop-color: #163f53; }
:root[data-theme="light"] .home-stellar #heroSvg stop:nth-child(2),
:root[data-theme="light"] .home-stellar #heroSvg stop:nth-child(3) { stop-color: #286c88; }
:root[data-theme="light"] .home-stellar #heroSvg stop:last-child { stop-color: #325c79; }
:root[data-theme="light"] .home-stellar .star-border .cta-button { background: #214453; border-color: #214453; color: #fff; }
.home-stellar .hero-actions .cta-button--ghost { background: rgba(11,16,21,.5); }
:root[data-theme="light"] .home-stellar .hero-actions .cta-button--ghost { background: rgba(255,255,255,.72); color: #214453; border-color: #667f8d; }
.home-stellar .portfolio-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.home-stellar .works-story-link { color: var(--text-primary); display: inline-flex; align-items: center; gap: 14px; min-height: 44px; border-bottom: 1px solid var(--stellar-line); text-decoration: none; font-size: 1rem; }
.works-story-link i { width: 18px; height: 18px; background: currentColor; mask: url('../imgs/icons/lucide/chevron-right.svg') center / contain no-repeat; }
.home-stellar .chat-header-btn, .home-stellar .chat-send-btn, .home-stellar .back-to-top { width: 44px; height: 44px; }
.home-stellar .chat-input { font-size: 1rem; }
.home-stellar .chat-input::placeholder { color: var(--text-secondary); opacity: 1; }
.home-stellar .chat-message { font-size: 1rem; }
.home-stellar .chat-action-btn { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
.home-stellar .footer-links { flex-wrap: wrap; }
.home-stellar .footer-links a { display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 1000px) {
    .home-stellar .about-content { gap: 40px; }
    .home-stellar .bento-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-stellar .bento-grid--quad .bento-card { grid-column: auto; }
}
@media (max-width: 800px) {
    .home-stellar .nav, .home-stellar .nav.scrolled { padding: calc(10px + env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) 10px max(20px, env(safe-area-inset-left)); gap: 16px; }
    .home-stellar .nav-tools { margin-left: auto; gap: 8px; }
    .home-stellar .nav-menu-button { display: flex; }
    .home-stellar .nav.has-menu ul { display: none; }
    .home-stellar .nav.has-menu.is-open { background: var(--stellar-chrome); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
    .home-stellar .nav.has-menu.is-open ul { display: flex; }
    .home-stellar .nav ul { position: absolute; top: 100%; left: 0; right: 0; margin: 0; padding: 8px max(24px, env(safe-area-inset-left)) 20px; flex-direction: column; align-items: stretch; gap: 0; background: var(--stellar-chrome); border-bottom: 1px solid var(--glass-border); box-shadow: 0 16px 28px rgba(0, 0, 0, 0.12); }
    .home-stellar .nav ul a { min-height: 52px; font-size: 1.0625rem; border-top: 1px solid var(--glass-border); }
    .home-stellar .nav ul a::after { display: none; }
    .home-stellar .lang-btn { padding: 0 10px; width: auto; }
}
@media (max-width: 700px) {
    .home-stellar .hero { padding: calc(112px + env(safe-area-inset-top)) max(24px, env(safe-area-inset-left)) 80px; min-height: calc(100svh - 88px); }
    .home-stellar .hero-content h1 { width: min(360px, 100%); height: 124px; margin-bottom: 28px; }
    .home-stellar .hero-content .hero-thought { font-size: 1.375rem; }
    .home-stellar .hero-content .hero-role { font-size: 1rem; }
    .home-stellar .hero-actions { gap: 8px; }
    .home-stellar .hero-actions .cta-button { padding: 10px 6px; font-size: 0.875rem; min-height: 56px; }
    .home-stellar .section { padding: 70px max(24px, env(safe-area-inset-right)) 70px max(24px, env(safe-area-inset-left)); }
    .home-stellar .about { padding-top: 32px; }
    .home-stellar .section-header h2 { font-size: 2rem; }
    .home-stellar .about-content, .home-stellar .journey { grid-template-columns: minmax(0, 1fr); gap: 32px; }
    .home-stellar .journey .section-header { position: static; margin-bottom: 8px; }
    .home-stellar .about-image { width: min(400px, 100%); margin: 0 auto; }
    .home-stellar .bento-grid { grid-template-columns: 1fr; grid-auto-rows: minmax(340px, auto); }
    .home-stellar .bento-card { grid-column: 1 !important; }
    .home-stellar .bento-card .bento-media { height: 240px; }
    .home-stellar .bento-card { padding: 20px; }
    .home-stellar .bento-card .bento-media { margin: -20px -20px 24px; height: 230px; }
    .home-stellar .bento-card h3 { font-size: 1.375rem; }
    .home-stellar .works-group-label { gap: 10px; }
    .home-stellar .flow-face h3 { font-size: 25px; }
    .home-stellar .flow-face { flex-wrap: wrap; gap: 12px; }
    .home-stellar .flow-tech em { white-space: normal; }
    .home-stellar .outlook-directions { grid-template-columns: minmax(0, 1fr); gap: 28px; margin-top: 36px; }
    .home-stellar .outlook-body { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .home-stellar .outlook-intro { position: static; }
    .home-stellar .outlook-directions > div { min-height: 0; }
    .home-stellar .outlook-intro { font-size: 19px; }
    .home-stellar .contact-links { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
    .home-stellar .contact-link { min-width: 0; }
    .home-stellar .contact-link-icon { width: min(55px, 100%); height: auto; aspect-ratio: 1; }
    .home-stellar.is-reading-works :is(.fab-stack, .back-to-top) { visibility: hidden !important; pointer-events: none; }
}
@media (max-height: 700px) {
    .home-stellar .hero { padding-top: 96px; padding-bottom: 56px; }
    .home-stellar .hero-content h1 { width: min(290px, 100%); height: 92px; margin-bottom: 20px; }
    .home-stellar .hero-content .hero-role { margin-bottom: 20px; }
}
@media (max-height: 520px) and (min-width: 700px) {
    .home-stellar .social-sidebar { display: none; }
    .home-stellar .hero { padding-top: 84px; padding-bottom: 32px; }
    .home-stellar .hero-content h1 { width: 200px; height: 60px; margin-bottom: 14px; }
    .home-stellar .hero-content .hero-thought { font-size: 20px; margin-bottom: 8px; }
    .home-stellar .hero-content .hero-role { font-size: 1rem; max-width: 100%; margin-bottom: 16px; }
    .home-stellar .hero-actions .cta-button { padding: 9px 16px; }
    .home-stellar .about { padding-top: 24px; }
    .home-stellar .outlook-intro, .home-stellar .works-group-label { position: static; }
}
.home-stellar .bento-card .bento-media.bento-media--scene { height: auto; aspect-ratio: 16 / 9; clip-path: none; }
.home-stellar .bento-card .bento-media--scene img, .home-stellar .bento-card:hover .bento-media--scene img { transform: none; object-fit: cover; }
.home-stellar .driving-preview { display: block; position: relative; }
.featured-preview video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; visibility: hidden; }
.featured-preview.is-ready video { visibility: visible; }
.featured-preview.is-ready img { visibility: hidden; }
.home-stellar .bento-card--preview :is(.bento-tag, .bento-badge) { pointer-events: none; }
.featured-progress { position: absolute; inset: auto 24px 16px; height: 3px; background: rgba(255,255,255,.3); box-shadow: 0 1px 3px rgba(0,0,0,.4); }
.featured-progress::after { content: ''; position: absolute; inset: 0; background: #fff; transform-origin: left; transform: scaleX(var(--preview-progress, 0)); }
:root[data-theme="light"] .featured-progress { background: rgba(0,0,0,.25); box-shadow: 0 1px 2px rgba(255,255,255,.6); }
:root[data-theme="light"] .featured-progress::after { background: #124653; }
.project-preview-actions { position: relative; z-index: 2; display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 4px 0 12px; }
a.bento-card { display: block; color: inherit; text-decoration: none; }
.project-preview-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--text-primary); font-size: .9375rem; }
.bento-card:hover .project-preview-link { text-decoration: underline; text-underline-offset: 5px; }
.project-preview-actions i { width: 18px; height: 18px; background: currentColor; flex: none; mask: url('../imgs/icons/lucide/chevron-right.svg') center / contain no-repeat; }
.project-preview-actions .preview-play { mask-image: url('../imgs/icons/lucide/play.svg'); }
.home-stellar .bento-card .driving-preview-note { font-size: .75rem; line-height: 1.6; margin-bottom: 8px; color: var(--text-secondary); }
.home-stellar a.bento-card:focus-visible { outline: 3px solid var(--preview-accent); outline-offset: 4px; }

.home-stellar .portfolio .works-group-label { position: static; }
.featured-track { grid-column: 1 / -1; position: relative; min-width: 0; align-self: start; }
.featured-track.is-pinned { height: calc(var(--featured-card-height) + var(--featured-travel)); }
.home-stellar .featured-project { width: 100%; padding: 0; background: rgba(var(--chapter-rgb, 17,22,28), .96); }
.home-stellar .featured-project, .home-stellar .featured-project:hover { transform: none; opacity: 1; transition: border-color .2s; }
.featured-track.is-pinned .featured-project { position: sticky; top: var(--featured-top); }
.home-stellar .featured-project .bento-media.featured-preview { margin: 0; height: min(46svh, 500px); min-height: 220px; aspect-ratio: auto; }
.featured-copy { position: relative; background: rgb(var(--chapter-rgb, 17,22,28)); display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 24px 40px; padding: 24px 28px; min-height: var(--featured-copy-height, 0px); align-content: start; }
.featured-summary, .featured-aside { min-width: 0; }
.home-stellar .featured-project h3 { margin: 0 0 10px; }
.home-stellar .featured-project p { line-height: 1.65; margin-bottom: 0; }
.home-stellar .featured-project .featured-contribution { font-size: .9375rem; margin-bottom: 12px; color: var(--text-primary); }
.home-stellar .featured-project .bento-contribution { font-size: .875rem; padding-top: 10px; margin-top: 10px; }
.home-stellar .featured-project .bento-date { margin-top: 14px; text-align: left; }
.home-stellar .featured-project .driving-preview-note { font-size: .75rem; margin: 0; }
.featured-project .project-preview-actions { margin: 0 0 4px; }
.project-index {
    position: relative; z-index: 4;
    display: block; padding: 12px 28px; margin-bottom: 16px;
    background: var(--chapter-surface, var(--stellar-surface));
    border-block: 1px solid var(--glass-border);
}
.project-index[hidden] { display: none; }
.project-index-group { display: grid; grid-template-columns: 104px minmax(0, 1fr); align-items: center; gap: 20px; }
.project-index-group + .project-index-group { border-top: 1px solid var(--glass-border); }
.project-index-items { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.project-index .project-index-heading { font-size: 13px; line-height: 1.5; font-weight: 600; color: var(--text-secondary); }
.project-index a {
    display: flex; align-items: center; justify-content: flex-start; gap: 10px;
    min-width: 0; min-height: 48px; padding: 5px 0; border-bottom: 2px solid transparent;
    color: var(--text-secondary); text-decoration: none;
}
.project-index a[aria-current] { color: var(--text-primary); border-color: var(--preview-accent); }
.project-index a:hover { color: var(--text-primary); }
.project-index img { display: none; }
.project-index .is-source img { opacity: 0; }
.project-index a span { font-size: 14px; font-weight: 500; line-height: 1.4; word-break: normal; overflow-wrap: normal; }
.home-stellar [id^="work-"] { scroll-margin-top: calc(var(--nav-height, 80px) + var(--project-index-height, 68px) + 16px); }
.project-showcase { position: relative; }
.project-selection-bar { position: relative; z-index: 4; display: none; align-items: center; gap: 8px; margin-bottom: 16px; border-block: 1px solid var(--glass-border); background: var(--chapter-surface, var(--stellar-surface)); }
.project-selection-bar button { display: flex; align-items: center; justify-content: center; gap: 10px; min-width: 44px; min-height: 48px; padding: 8px; border: 0; background: none; color: var(--text-primary); font: inherit; }
.project-selection-bar .project-selector { flex: 1; justify-content: flex-start; min-width: 0; font-size: 14px; text-align: left; }
.project-selection-bar button:disabled { opacity: .35; }
.project-selection-bar i { width: 18px; height: 18px; flex: none; background: currentColor; mask: url('../imgs/icons/lucide/menu.svg') center / contain no-repeat; }
.project-previous i { mask-image: url('../imgs/icons/lucide/chevron-left.svg'); }
.project-next i { mask-image: url('../imgs/icons/lucide/chevron-right.svg'); }
.project-overview { margin-bottom: 56px; }
.project-overview-group + .project-overview-group { margin-top: 36px; }
.home-stellar .project-overview-group > h3 { font-size: 20px; margin: 0 0 20px; font-weight: 500; }
.project-overview-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 20px; }
.project-overview-group:first-child .project-overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.project-overview-group:nth-child(2) .project-overview-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.project-overview-tile { display: block; min-width: 0; border: 1px solid var(--glass-border); border-radius: 8px; overflow: hidden; text-decoration: none; background: var(--chapter-surface, var(--stellar-surface)); color: var(--text-primary); }
.project-overview-tile img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.project-overview-tile span { display: block; padding: 14px 16px; font-size: 15px; line-height: 1.45; font-weight: 500; }
.project-overview-tile:hover { border-color: var(--preview-accent); }
.project-overview-tile { position: relative; }
.project-overview-tile img { transition: transform .45s cubic-bezier(.2,.7,.2,1); }
.project-overview-tile > span { position: relative; background: inherit; }
@media (hover: hover) and (pointer: fine) {
    .has-ambient-motion .project-overview-tile:hover img { transform: translate(var(--tile-x, 0px), var(--tile-y, 0px)) scale(1.035); }
    .project-overview-tile::after { content: ''; position: absolute; inset: 0 0 auto; aspect-ratio: 16 / 9; pointer-events: none; background: linear-gradient(115deg, transparent 35%, #d1edfa22 50%, transparent 65%); transform: translateX(-130%); }
    .has-ambient-motion .project-overview-tile:hover::after { transform: translateX(130%); transition: transform .9s ease-out; }
}
.home-stellar:not(.has-ambient-motion) [data-split-text] .split-char { opacity: 1; transform: none; clip-path: none; transition: none; }
.home-stellar:not(.has-ambient-motion) .project-overview-tile img { transform: none; transition: none; }
@supports (background-clip: text) or (-webkit-background-clip: text) {
    .home-stellar .section-header h2:not([data-echo-text]) {
        --heading-ink: #bfcfd9;
        --heading-sheen: #ffffff;
        --heading-rim: #79cce4;
        color: var(--heading-ink);
    }
    .home-stellar .section-header h2:not([data-echo-text]):is(:not([data-split-text]), .split-settled) {
        width: fit-content; max-width: 100%;
        background: linear-gradient(110deg, var(--heading-ink) 32%, var(--heading-rim) 44%, var(--heading-sheen) 50%, var(--heading-rim) 56%, var(--heading-ink) 68%);
        background-size: 250% 100%; background-position: 100% 0;
        background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;
        animation: heading-shine 5.5s ease-in-out infinite; animation-play-state: paused;
    }
    :root[data-theme="light"] .home-stellar .section-header h2 { --heading-ink: #213b48; --heading-sheen: #08748e; --heading-rim: #286b85; }
    .home-stellar.has-ambient-motion .section-header h2.is-text-visible { animation-play-state: running; }
    .home-stellar:not(.has-ambient-motion) .section-header h2:not([data-echo-text]) { animation: none; background: none; -webkit-text-fill-color: currentColor; }
}
@media print, (forced-colors: active) {
    .home-stellar .section-header h2 { background: none !important; -webkit-text-fill-color: currentColor !important; animation: none !important; }
}
@keyframes heading-shine { 0% { background-position: 100% 0; } 62%, 100% { background-position: 0% 0; } }
.project-showcase.is-pinned .project-showcase-pin { position: sticky; top: var(--showcase-top); }
.project-stage { position: relative; width: 100%; z-index: 3; isolation: isolate; }
.home-stellar .project-stage .bento-card,
.home-stellar .project-stage .bento-card:hover {
    position: absolute; inset: 0; width: 100%; height: 100%; padding: 0;
    transform: none; opacity: 1; overflow: visible; background: none; border: 0;
    box-shadow: none; transition: none;
}
.home-stellar .project-stage .bento-card[hidden] { display: none; }
.home-stellar .project-stage .bento-card::before { display: none; }
.home-stellar .project-stage .bento-card .bento-media {
    position: absolute; margin: 0; min-height: 0; max-height: none; aspect-ratio: auto;
    clip-path: none; border-radius: 8px; z-index: 6; pointer-events: none;
}
.home-stellar .project-stage .bento-media img { width: 100%; height: 100%; object-fit: cover; transform: none; }
.project-stage :is(.featured-copy, .project-compact-copy) {
    position: absolute; top: var(--stage-media-height); left: 0; width: 100%;
    padding: 22px 24px; min-height: 0; background: var(--chapter-surface, var(--stellar-surface));
}
.project-stage .project-group { grid-column: 1 / -1; display: block; font-size: 12px; line-height: 1.4; color: var(--text-secondary); margin-bottom: 0; }
.project-stage .featured-copy { gap: 12px 40px; }
.project-stage .project-compact-copy h3 { margin: 10px 0; }
.project-stage .project-compact-copy p { max-width: 800px; }
.project-stage .project-compact-copy .project-preview-link { margin-top: 12px; text-decoration: underline; text-underline-offset: 5px; }
.project-peek, .project-peek [hidden] { display: none; }
.project-stage :is(.bento-tag, .bento-badge, .bento-live, .bento-badges, .featured-progress) { opacity: var(--project-open, 1); }
.project-stage > .bento-card > :is(.bento-tag, .bento-badge, .bento-live, .bento-badges) { z-index: 7; pointer-events: none; }
@media (min-width: 701px) and (max-width: 1100px) {
    .project-index-items, .project-overview-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .project-index-group { grid-template-columns: 88px minmax(0, 1fr); gap: 16px; }
    .project-index { padding-inline: 20px; }
}
@media (max-width: 700px) {
    .project-selection-bar { display: flex; }
    .project-showcase:not(.is-index-open) .project-index { display: none; }
    .project-showcase.is-pinned .project-index { position: absolute; top: var(--project-menu-top); inset-inline: 0; max-height: var(--project-menu-height); overflow-y: auto; overscroll-behavior: contain; }
    .project-index { padding: 10px 18px; }
    .project-index-group { display: block; padding: 8px 0; }
    .project-index-items { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; }
    .project-index .project-index-heading { display: block; font-size: 12px; margin-bottom: 2px; }
    .project-index a { min-height: 44px; }
    .project-index a span { font-size: 13px; }
    .project-overview { margin-bottom: 32px; }
    .project-overview-grid, .project-overview-group:nth-child(2) .project-overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .project-overview-tile span { padding: 12px 10px; font-size: 13px; }
    .project-stage :is(.featured-copy, .project-compact-copy) { padding: 14px 16px; }
    .home-stellar .project-stage .featured-copy { gap: 8px; }
    .home-stellar .project-stage .featured-copy h3 { font-size: 20px; margin-bottom: 6px; }
    .home-stellar .project-stage .featured-copy p { font-size: 14px; line-height: 1.55; }
    .home-stellar .project-stage .featured-copy .bento-date { margin-top: 8px; }
    .home-stellar .project-stage .featured-copy .driving-preview-note { font-size: 11px; }
    .home-stellar .project-stage .featured-contribution { margin-bottom: 4px; }
    .project-peek:not([hidden]) { display: block; margin: 14px 0 8px; padding-top: 14px; border-top: 1px solid var(--glass-border); }
    .home-stellar .project-peek h4 { margin: 0 0 8px; color: var(--text-primary); font-size: 13px; font-weight: 600; line-height: 1.5; }
    .project-peek ul { margin: 0; padding-left: 17px; }
    .project-peek li { padding-left: 3px; color: var(--text-secondary); font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
    .project-peek li + li { margin-top: 8px; }
    .project-peek li::marker { color: var(--preview-accent); }
}
@media (max-width: 700px) {
    .home-stellar .featured-project { padding: 0; }
    .home-stellar .featured-project .bento-media.featured-preview { height: auto; min-height: 0; aspect-ratio: 16 / 9; }
    .featured-copy { grid-template-columns: 1fr; gap: 18px; padding: 20px; }
    .home-stellar .featured-project h3 { font-size: 22px; }
}
@media print {
    .featured-track.is-pinned { height: auto; }
    .featured-track.is-pinned .featured-project { position: static; }
    .project-overview, .project-index, .project-selection-bar { display: none; }
    .project-showcase, .project-stage { height: auto !important; }
    .project-showcase.is-pinned .project-showcase-pin { position: static; }
    .home-stellar .project-stage .bento-card, .home-stellar .project-stage .bento-card[hidden] { position: relative; display: block; height: auto; margin-bottom: 28px; break-inside: avoid; }
    .home-stellar .project-stage .bento-card .bento-media { position: relative; left: 0 !important; top: 0 !important; width: 100% !important; height: 240px !important; visibility: visible !important; opacity: 1 !important; }
    .project-stage :is(.featured-copy, .project-compact-copy) { position: static; opacity: 1 !important; }
}

.home-stellar { --floating-floor: max(var(--news-ticker-height, 0px), env(safe-area-inset-bottom)); padding-bottom: var(--floating-floor); }
.home-stellar .fab-stack { bottom: calc(var(--viewport-bottom, 0px) + var(--floating-floor) + 24px); }
.home-stellar .back-to-top { bottom: calc(var(--viewport-bottom, 0px) + var(--floating-floor) + 24px); transition-property: opacity, transform, background, border-color, box-shadow; }
.home-stellar .chat-panel { bottom: calc(var(--viewport-bottom, 0px) + var(--floating-floor) + 20px); max-height: calc(var(--viewport-height, 100dvh) - var(--floating-floor) - env(safe-area-inset-top) - 40px); transition-property: opacity, transform, background, border-color, box-shadow; }
.home-stellar .chat-messages { min-height: 0; }
@media (max-width: 768px) {
    .home-stellar .fab-stack { right: max(16px, env(safe-area-inset-right)); bottom: calc(var(--viewport-bottom, 0px) + var(--floating-floor) + 14px); }
    .home-stellar .back-to-top { left: auto; right: max(20px, env(safe-area-inset-right)); bottom: calc(var(--viewport-bottom, 0px) + var(--floating-floor) + 78px); }
    .home-stellar .chat-panel { right: max(12px, env(safe-area-inset-right)); bottom: calc(var(--viewport-bottom, 0px) + var(--floating-floor) + 12px); width: min(380px, calc(100% - 24px)); height: 520px; max-height: calc(var(--viewport-height, 100dvh) - var(--floating-floor) - env(safe-area-inset-top) - 24px); border-radius: 20px; }
    .home-stellar .chat-panel.expanded { top: calc(var(--viewport-top, 0px) + env(safe-area-inset-top)); left: env(safe-area-inset-left); right: env(safe-area-inset-right); bottom: calc(var(--viewport-bottom, 0px) + var(--floating-floor)); width: auto; height: auto; max-height: none; border-radius: 0; }
}
.home-stellar .fab-btn--chat { --chat-ring: 137, 203, 244; width: 62px; height: 62px; border-radius: 50%; padding: 5px; overflow: visible; background: #142330; border: 1px solid #9dbacf; color: #f4f8ff; }
.home-stellar .fab-btn--chat::before { content: ''; position: absolute; inset: -5px; border: 1px solid rgb(var(--chat-ring)); border-radius: inherit; opacity: .35; pointer-events: none; }
.home-stellar.has-ambient-motion .fab-btn--chat:not(.hidden)::before { animation: chatBreathe 3.2s ease-in-out infinite; }
@keyframes chatBreathe { 0%, 100% { opacity: .2; transform: scale(1); box-shadow: 0 0 3px rgba(var(--chat-ring), .1); } 50% { opacity: .85; transform: scale(1.035); box-shadow: 0 0 16px rgba(var(--chat-ring), .4); } }
.home-stellar .fab-btn--chat:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(0, 0, 0, .24); }
.home-stellar .fab-btn--chat:focus-visible { outline: 3px solid var(--text-primary); outline-offset: 7px; }
.home-stellar .chat-launch-avatar { position: relative; flex: 0 0 50px; width: 50px; height: 50px; }
.home-stellar .chat-launch-avatar > img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; opacity: 1; }
.home-stellar .chat-launch-icon { position: absolute; right: -3px; bottom: -2px; width: 22px; height: 22px; border-radius: 50%; background: #3c698c; border: 2px solid #f0f4f9; display: grid; place-items: center; }
.home-stellar .chat-launch-icon img { width: 13px; height: 13px; opacity: 1; filter: brightness(0) invert(1); }
.home-stellar .chat-launch-copy { position: absolute; right: calc(100% + 14px); top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; align-items: flex-start; gap: 3px; width: max-content; padding: 9px 12px; border-radius: 8px; background: #142330; border: 1px solid #668398; text-align: left; line-height: 1.3; letter-spacing: 0; white-space: nowrap; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .2s; }
.home-stellar .fab-btn--chat:is(:hover, :focus-visible) .chat-launch-copy { opacity: 1; visibility: visible; }
.home-stellar #chatFabName { font-size: 14px; font-weight: 600; }
.home-stellar #chatFabLabel { font-size: 12px; font-weight: 500; color: #c2def2; }
:root[data-theme="light"] .home-stellar .fab-btn--chat { --chat-ring: 91, 148, 191; background: #f7faff; border-color: #8aaac2; color: #23364a; box-shadow: 0 4px 18px rgba(29, 60, 89, .18); }
:root[data-theme="light"] .home-stellar .chat-launch-copy { background: #f7faff; border-color: #9fb6ca; }
:root[data-theme="light"] .home-stellar #chatFabLabel { color: #405f7b; }
.home-stellar .chat-header-avatar { width: 40px; height: 40px; }
.home-stellar .chat-welcome-icon { width: 104px; height: 104px; border-radius: 50%; border: 0; }
.home-stellar .chat-launch-copy, .home-stellar .chat-header-name, .home-stellar .chat-header-status, .home-stellar .chat-welcome-text { letter-spacing: 0; }
@media (max-width: 760px) {
    .home-stellar .fab-btn--chat { width: 54px; height: 54px; padding: 5px; }
    .home-stellar .chat-launch-avatar { flex-basis: 42px; width: 42px; height: 42px; }
    .home-stellar #chatFabName { font-size: 13px; }
    .home-stellar #chatFabLabel { font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
    .home-stellar *, .home-stellar *::before, .home-stellar *::after { animation: none !important; transition: none !important; }
    .stellar-panorama, .home-stellar .hero-content, .home-stellar .bento-media img { transform: none !important; }
    .stellar-world { transform: none; }
    .stellar-stars, .stellar-video { display: none; }
    .home-stellar .timeline-progress { transform: none; }
    .home-stellar .outlook-intro, .home-stellar .works-group-label { position: static; }
}
@media print {
    .stellar-scene, .home-stellar .nav, .home-stellar .hero-actions { display: none; }
    .home-stellar { --text-primary: #111; --text-secondary: #333; background: white; }
    .home-stellar .hero { min-height: 0; padding-block: 30px; }
    .home-stellar .section { padding-block: 30px; }
}
