/* Display preferences share the site's restrained, silver-and-ink palette. */
.nav-shell{gap:24px}
.brand-name{font-weight:inherit}
#main-nav{margin-left:auto;gap:32px}
.nav-controls{display:flex;align-items:center;gap:8px;flex-shrink:0}
.preference-button{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:44px;height:44px;padding:0;border:1px solid #35404e;border-radius:50%;color:#bdc7d4;background:transparent;transition:color .2s,border-color .2s,background .2s}
.preference-button:hover{color:#fff;border-color:#728297;background:#ffffff08}
.preference-button:active{background:#ffffff12}
.theme-icon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.theme-icon-moon{display:none}
.language-toggle{font-size:11px;line-height:1;font-weight:500;letter-spacing:.03em}
.language-label{white-space:nowrap}

/* The white version keeps the original composition and chrome sculpture. */
html[data-theme="light"]{color-scheme:light;--bg:#f8f9fb;--panel:#fff;--text:#202733;--muted:#5d6775;--subtle:#6a7584;--line:#dce1e7;--blue:#355d83}
html[data-theme="light"] ::selection{color:#172a3e;background:#dce7f2}
html[data-theme="light"] .site-header{border-bottom-color:#dde2e8}
html[data-theme="light"] .brand img{filter:brightness(0);opacity:.86}
html[data-theme="light"] .brand small{color:#697583}
html[data-theme="light"] #main-nav{color:#5a6573}
html[data-theme="light"] #main-nav a:hover{color:#17202d}
html[data-theme="light"] .contact-nav{color:#2c3745;border-color:#c6cfd9}
html[data-theme="light"] .preference-button,
html[data-theme="light"] .menu-toggle{color:#596576;border-color:#d0d7e0;background:#ffffff70}
html[data-theme="light"] .preference-button:hover,
html[data-theme="light"] .menu-toggle:hover{color:#1f2c3d;border-color:#9eaebe;background:#edf1f5}
html[data-theme="light"] .preference-button:active{background:#e4ebf2}
html[data-theme="light"] .theme-icon-sun{display:none}
html[data-theme="light"] .theme-icon-moon{display:block}
html[data-theme="light"] .menu-toggle span{background:#3e4c5e}
html[data-theme="light"] .hero h1>span{background-image:linear-gradient(130deg,#202a38 10%,#536173 70%,#7b8898 100%)}
html[data-theme="light"] .signal{background:#6586a7;box-shadow:0 0 12px #7699bb45}
html[data-theme="light"] .line-link{border-color:#9aa8b8}
html[data-theme="light"] .line-link:hover{border-color:var(--blue)}
html[data-theme="light"] .scene-halo{background:radial-gradient(ellipse at 52% 46%,#dce3ec80,transparent 65%)}
html[data-theme="light"] .scene-coordinate,
html[data-theme="light"] .scene-index{color:#6b7786}
html[data-theme="light"] .scene-coordinate i{background:#a7b3c1}
html[data-theme="light"] .scene-coordinate i:before{background:#71869c}
html[data-theme="light"] .hero-footer,
html[data-theme="light"] .hero-categories{color:#667282}
html[data-theme="light"] .hero-categories i{background:#a3afbd}
html[data-theme="light"] .scroll-link>span:last-child{color:#52677e}
html[data-theme="light"] .app-icon-item img{box-shadow:0 14px 32px #202d3f10,0 0 0 1px #2333490c}
html[data-theme="light"] a.app-icon-item:hover img,
html[data-theme="light"] a.app-icon-item:focus-visible img{box-shadow:0 20px 36px #202d3f20,0 0 0 1px #23334920}
html[data-theme="light"] .app-icon-item h3{color:#3d4856}
html[data-theme="light"] a.app-icon-item:hover h3{color:#182535}
html[data-theme="light"] .app-status{color:#647488;border-color:#d9e1e9;background:#edf1f5}
html[data-theme="light"] .about-section{background:linear-gradient(135deg,#f0f3f7,#f6f8fa)}
html[data-theme="light"] .about-small-title{color:#5a6878}
html[data-theme="light"] .connection-symbol i{border-color:#c9d2de;background:radial-gradient(circle at 37% 37%,#fff9,#e1e7ef30)}
html[data-theme="light"] .connection-symbol i:nth-child(2){border-color:#879bb2}
html[data-theme="light"] .connection-symbol span{color:#6b829b}
html[data-theme="light"] .about-annotation{color:#6b7b8d}
html[data-theme="light"] .about-main h2 span{color:#597493}
html[data-theme="light"] .about-secondary{color:#5c697a}
html[data-theme="light"] .principles,
html[data-theme="light"] .principles article{border-color:#d6dfe8}
html[data-theme="light"] .principles article>.mono{color:#60758c}
html[data-theme="light"] .principles p{color:#627082}
html[data-theme="light"] .contact-orbit{border-color:#8b9fb6}
html[data-theme="light"] .contact-orbit:before{border-color:#d2dce7}
html[data-theme="light"] .contact-orbit span{color:#4a6481}
html[data-theme="light"] .contact-orbit:hover{background:#e9eff6}
html[data-theme="light"] .email-address{border-color:#9cabbc}
html[data-theme="light"] .email-address:hover{color:#355d83}
html[data-theme="light"] .copy-email{color:#5e738c;border-color:#bdcbdc}
html[data-theme="light"] .copy-email:hover{color:#263e59;border-color:#6f86a0}
html[data-theme="light"] .footer-top>p{color:#5c6979}
html[data-theme="light"] .back-top,
html[data-theme="light"] .footer-bottom{color:#647286}
html[data-theme="light"] .back-top:hover,
html[data-theme="light"] .footer-bottom a:hover,
html[data-theme="light"] .footer-bottom button:hover{color:#263a53}
html[data-theme="light"] dialog{background:#fbfcfe;border-color:#ccd6e2;box-shadow:0 40px 150px #182b4430}
html[data-theme="light"] dialog::backdrop{background:#182b4460}
html[data-theme="light"] .dialog-header{background:#f7f9fcf5;border-color:#dce3eb}
html[data-theme="light"] .dialog-close{border-color:#bdcbdc}
html[data-theme="light"] .dialog-close:hover{background:#e6edf5}
html[data-theme="light"] .privacy-copy p{color:#526174}
html[data-theme="light"] .toast{color:#f7f9fc;background:#263a51;box-shadow:0 8px 35px #182b4424}

/* English keeps deliberate line breaks without crowding the sculpture. */
html[lang="en"] .hero h1{font-family:Arial,"PingFang SC",sans-serif;font-size:clamp(46px,5.2vw,76px);line-height:1.14;letter-spacing:-.055em}
html[lang="en"] .hero-description{letter-spacing:0;line-height:1.85;max-width:410px}
html[lang="en"] .about-main h2{line-height:1.15;letter-spacing:-.045em}
html[lang="en"] .contact-top h2{line-height:1.2;letter-spacing:-.045em}
html[lang="en"] .app-status{font-size:10px;letter-spacing:.015em}

@media(min-width:901px) and (max-width:1100px){
  .nav-shell{gap:18px}
  #main-nav{gap:24px}
  .contact-nav{padding:10px 17px!important;gap:20px}
}
@media(max-width:900px){
  .nav-shell{gap:16px}
  .nav-controls{margin-left:auto}
  .menu-toggle{display:flex;position:relative;z-index:22;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:44px;height:44px;padding:0;border:1px solid #35404e;border-radius:50%}
  .menu-toggle span{display:block;width:15px;height:1px;background:#c7d1de;transition:.2s}
  .menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}
  .menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
  #main-nav{display:none;position:absolute;left:0;right:0;top:100%;margin:0;padding:15px 28px 25px;background:#121720;border-bottom:1px solid #405068;box-shadow:0 20px 40px #0008;flex-direction:column;align-items:stretch;gap:0}
  #main-nav.is-open,#main-nav.open{display:flex}
  #main-nav>a{padding:16px 10px;font-size:15px}
  #main-nav .contact-nav{margin-top:8px;justify-content:space-between}
  html[data-theme="light"] #main-nav{background:#f8fafc;border-color:#d6dfe9;box-shadow:0 20px 40px #21334a14}
  html[lang="en"] .hero h1{font-size:clamp(45px,6.3vw,55px)}
  html[lang="en"] .hero-description{max-width:340px}
  html[lang="en"] .about-main h2{font-size:40px}
  html[lang="en"] .contact-top h2{font-size:43px}
}
@media(max-width:650px){
  .nav-shell{gap:12px}
  .nav-controls{gap:6px}
  #main-nav{padding-inline:20px}
  html[lang="en"] .hero h1{font-size:clamp(31px,7.65vw,49px);line-height:1.18}
  html[lang="en"] .hero-description{max-width:340px}
  html[lang="en"] .about-main h2{font-size:40px}
  html[lang="en"] .contact-top h2{font-size:36px}
  html[lang="en"] .contact-details>p{max-width:calc(100% - 90px);font-size:11px}
  html[lang="en"] .footer-bottom{flex-wrap:wrap;gap:4px 16px}
}
@media(max-width:360px){
  .nav-shell{gap:8px}
  .nav-controls{gap:4px}
  .site-header .brand{gap:7px}
  .site-header .brand>span{font-size:15px;letter-spacing:.1em}
  .site-header .brand small{font-size:6px;letter-spacing:.1em}
  html[lang="en"] .hero h1{font-size:31px}
  html[lang="en"] .about-main h2{font-size:36px}
  html[lang="en"] .contact-top h2{font-size:32px}
  html[lang="en"] .app-status{font-size:9px;padding-inline:7px}
}