:root{
  color-scheme:dark;
  --bg:#19132f;
  --text:#fbf9ff;
  --muted:#c3bed0;
  --accent:#c8b4ff;
  --ink:#29213b;
  --ease:cubic-bezier(.23,1,.32,1);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  font-synthesis:none
}
*{
  box-sizing:border-box
}
html{
  scroll-padding-top:24px
}
body{
  margin:0
}
a{
  color:inherit;
  text-decoration:none
}
button,a{
  -webkit-tap-highlight-color:transparent
}
a:focus-visible,button:focus-visible,summary:focus-visible{
  outline:3px solid #c8b4ff;
  outline-offset:5px
}
img{
  display:block;
  max-width:100%
}
.shell{
  width:min(1192px,100%);
  margin-inline:auto;
  padding-inline:36px
}
.home-page{
  min-height:100svh;
  background:var(--bg);
  color:var(--text);
  isolation:isolate;
  position:relative;
  display:flex;
  flex-direction:column;
  overflow-x:clip
}
.ambient{
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  z-index:-1;
  background:radial-gradient(ellipse at 88% 44%,#51499c65 0,transparent 52%),radial-gradient(ellipse at 2% 0,#6c327b4d 0,transparent 44%),linear-gradient(130deg,#251339 0%,#171831 64%,#141e34 100%)
}
.ambient i{
  position:absolute;
  display:block;
  border-radius:50%;
  filter:blur(76px);
  opacity:.2
}
.ambient i:nth-child(1){
  background:#b49aff;
  width:420px;
  height:420px;
  right:8%;
  top:25%
}
.ambient i:nth-child(2){
  background:#60d8f5;
  width:240px;
  height:240px;
  right:0;
  top:8%
}
.ambient i:nth-child(3){
  background:#b751b8;
  width:340px;
  height:340px;
  left:-180px;
  top:44%
}
.site-header{
  height:102px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:relative;
  z-index:1
}
.brand{
  display:inline-flex;
  gap:12px;
  align-items:center;
  font-size:23px;
  font-weight:650;
  letter-spacing:.03em
}
.brand img{
  border-radius:13px
}
.site-header nav{
  display:flex;
  align-items:center;
  gap:34px
}
.nav-link{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  color:#c4bdd5;
  position:relative
}
.nav-link.current{
  color:#fff
}
.nav-link.current:after{
  position:absolute;
  content:"";
  height:3px;
  width:14px;
  left:calc(50% - 7px);
  bottom:0;
  border-radius:3px;
  background:#d9c8ff
}
.nav-link span{
  font-size:18px
}
.skip-link{
  position:absolute;
  z-index:10;
  top:8px;
  left:20px;
  padding:12px;
  background:white;
  color:#281941;
  transform:translateY(-150%)
}
.skip-link:focus{
  transform:none
}
.hero{
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:22px;
  flex:1;
  padding-block:46px 60px;
  min-height:680px
}
.hero-copy{
  position:relative;
  z-index:1
}
.eyebrow{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:11px;
  letter-spacing:.22em;
  color:#c4bdd7;
  margin:0 0 25px
}
.eyebrow>span{
  width:6px;
  height:6px;
  background:#bda6ff;
  border-radius:50%;
  box-shadow:0 0 14px #c1afff8c
}
h1{
  font-size:clamp(48px,5.1vw,72px);
  line-height:1.16;
  letter-spacing:-.025em;
  margin:0 0 24px;
  font-weight:780
}
h1>span{
  background:linear-gradient(110deg,#d3c0ff 10%,#e8c6f4 60%,#c6ddff);
  background-clip:text;
  -webkit-text-fill-color:transparent
}
.hero-description{
  font-size:17px;
  line-height:1.9;
  color:#d1cbde;
  letter-spacing:.04em;
  margin:0 0 19px
}
.interests{
  display:flex;
  align-items:center;
  gap:14px;
  color:#afa5c3;
  font-size:13px;
  letter-spacing:.06em;
  margin:0 0 34px
}
.interests b{
  font-weight:400;
  color:#716083
}
.downloads{
  display:flex;
  gap:16px;
  scroll-margin-top:28px
}
.download-card{
  width:180px;
  flex:none;
  display:flex;
  align-items:center;
  flex-direction:column;
  border:1px solid #ffffff2b;
  background:linear-gradient(145deg,#ffffff12,#ffffff07);
  border-radius:19px;
  padding:15px 14px 14px;
  transition:transform 160ms var(--ease)
}
.download-label{
  display:flex;
  align-items:center;
  gap:8px;
  align-self:stretch;
  min-height:34px;
  margin-bottom:14px
}
.download-label strong{
  font-size:14px;
  font-weight:600;
  display:block;
  line-height:1.5
}
.download-label small{
  font-size:10px;
  line-height:1.5;
  color:#b9afca;
  display:block;
  letter-spacing:.02em
}
.platform-symbol{
  font-size:17px;
  font-weight:700;
  letter-spacing:-.05em;
  min-width:30px
}
.small-arrow{
  margin-left:auto;
  font-size:16px;
  color:#a79bbf
}
.android-symbol{
  width:27px;
  height:29px;
  flex:none;
  stroke:currentColor;
  stroke-width:1.7;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round
}
.qr-frame{
  padding:8px;
  background:white;
  border-radius:10px;
  line-height:0;
  box-shadow:0 2px 12px #00000012
}
.qr-frame img{
  width:116px;
  height:116px
}
.download-status{
  font-size:11px;
  color:#c0b5d3;
  margin-top:12px;
  letter-spacing:.03em
}
.hero-art{
  position:relative;
  width:100%;
  aspect-ratio:1;
  display:grid;
  place-items:center
}
.hero-logo{
  width:clamp(270px,32vw,420px);
  height:auto;
  border-radius:30%;
  transform:rotate(-6deg);
  box-shadow:0 35px 90px #08051b73;
  position:relative;
  z-index:1
}
.logo-halo{
  position:absolute;
  inset:9%;
  border-radius:50%;
  background:#aca0ff;
  filter:blur(90px);
  opacity:.18
}
.orbit{
  position:absolute;
  border:1px solid #d3c8ff1c;
  border-radius:50%;
  width:106%;
  height:68%;
  transform:rotate(-25deg)
}
.orbit-two{
  width:100%;
  height:98%;
  transform:rotate(30deg);
  border-color:#d3c8ff0c
}
.art-spark{
  position:absolute;
  font-size:38px;
  color:#e6d7ff;
  z-index:2;
  text-shadow:0 0 30px #c1a4f166
}
.spark-one{
  right:6%;
  top:12%
}
.spark-two{
  left:7%;
  bottom:19%;
  font-size:28px
}
.voice-chip{
  position:absolute;
  z-index:2;
  bottom:3%;
  left:11%;
  display:flex;
  align-items:center;
  gap:12px;
  padding:17px 21px;
  color:#ebe1ff;
  background:#3a2c58eb;
  border:1px solid #d5bcff40;
  border-radius:40px;
  box-shadow:0 14px 38px #09061c33;
  white-space:nowrap;
  font-size:13px;
  letter-spacing:.07em;
  transform:rotate(-4deg)
}
.voice-bars{
  height:23px;
  display:flex;
  align-items:center;
  gap:3px
}
.voice-bars i{
  width:3px;
  background:#cebdff;
  height:13px;
  border-radius:3px
}
.voice-bars i:nth-child(2),.voice-bars i:nth-child(4){
  height:21px
}
.voice-bars i:nth-child(3){
  height:30px
}
.art-dot{
  position:absolute;
  border-radius:50%;
  background:#abbdff;
  box-shadow:inset -3px -5px 8px #7652c5,0 6px 22px #7f6dbb44
}
.dot-one{
  width:27px;
  height:27px;
  bottom:17%;
  right:7%
}
.dot-two{
  width:13px;
  height:13px;
  top:9%;
  left:25%;
  background:#f8b9e8
}
.site-footer{
  position:relative;
  z-index:1;
  padding-block:22px 24px;
  font-size:11px;
  color:#a79bb6;
  border-top:1px solid #ffffff0e
}
.footer-main{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px
}
.footer-main p{
  margin:0;
  line-height:1.8
}
.footer-links,.footer-contact{
  display:flex;
  align-items:center;
  gap:22px;
  flex-wrap:wrap
}
.footer-links a,.footer-contact a{
  min-height:32px;
  display:inline-flex;
  align-items:center
}
.footer-contact{
  gap:8px 20px;
  color:#93879f;
  margin-top:3px
}
.footer-contact>span:first-child{
  color:#a79bb6
}
.record-slot:empty{
  display:none
}
@media(hover:hover) and (pointer:fine){
  .download-card:hover{
    transform:translateY(-3px);
    background-color:#ffffff0a;
    border-color:#c9b8f477
  }
  .nav-link:hover,.site-footer a:hover{
    color:white
  }
}
.download-card:active{
  transform:scale(.98)
}
/* A shorter desktop window still exposes the complete download codes. */
@media(min-width:701px) and (max-height:760px){
  .site-header{
    height:76px
  }
  .hero{
    min-height:0;
    padding-block:24px 32px
  }
  .hero .eyebrow{
    font-size:10px;
    margin-bottom:16px
  }
  .hero h1{
    font-size:52px;
    line-height:1.12;
    margin-bottom:16px
  }
  .hero-description{
    font-size:14px;
    line-height:1.7;
    margin-bottom:12px
  }
  .interests{
    font-size:12px;
    margin-bottom:24px
  }
  .download-card{
    padding-block:12px
  }
  .download-label{
    margin-bottom:10px;
    min-height:30px
  }
  .qr-frame img{
    width:100px;
    height:100px
  }
  .download-status{
    margin-top:10px
  }
  .hero-logo{
    width:min(32vw,370px)
  }
  .site-footer{
    padding-block:12px 14px
  }
}
/* Keep feedback interruptible and limited to the composited transform. */
.download-card{
  transition:transform 160ms var(--ease)
}
.download-card:active:not(:focus-visible){
  transition-duration:100ms
}
.download-card:focus-visible{
  transform:none
}
@media(min-width:1600px){
  .hero{
    min-height:740px
  }
  .hero-art{
    transform:translateX(15px)
  }
}
@media(max-width:950px){
  .shell{
    padding-inline:28px
  }
  .hero{
    gap:4px;
    min-height:660px
  }
  .hero-logo{
    width:clamp(245px,35vw,360px)
  }
  h1{
    font-size:54px
  }
  .voice-chip{
    left:0;
    font-size:11px;
    padding:13px 16px
  }
  .download-card{
    width:166px;
    padding-inline:11px
  }
  .downloads{
    gap:12px
  }
  .hero-description{
    font-size:15px
  }
  .interests{
    gap:9px;
    font-size:12px
  }
  .site-header{
    height:88px
  }
}
@media(max-width:700px){
  .shell{
    padding-inline:24px
  }
  .site-header{
    height:82px
  }
  .brand{
    font-size:21px;
    gap:10px
  }
  .brand img{
    width:38px;
    height:38px;
    border-radius:11px
  }
  .site-header nav{
    gap:24px
  }
  .nav-link{
    font-size:13px
  }
  .hero{
    grid-template-columns:1fr;
    gap:12px;
    padding-block:24px 42px;
    min-height:auto;
    text-align:center
  }
  .eyebrow{
    justify-content:center;
    margin-bottom:23px;
    font-size:9px;
    letter-spacing:.19em
  }
  .hero-copy{
    display:contents
  }
  h1{
    font-size:clamp(41px,9vw,55px);
    line-height:1.2;
    order:1;
    margin-bottom:3px
  }
  .eyebrow{
    order:0
  }
  .hero-description{
    order:2;
    margin:0;
    font-size:14px;
    line-height:1.8
  }
  .interests{
    order:4;
    justify-content:center;
    margin:16px 0 5px;
    font-size:12px;
    gap:12px
  }
  .hero-art{
    order:3;
    width:min(284px,80%);
    margin:4px auto 8px;
    aspect-ratio:1
  }
  .hero-logo{
    width:220px;
    border-radius:29%
  }
  .voice-chip{
    bottom:0;
    left:5%;
    font-size:10px;
    padding:10px 13px;
    gap:8px
  }
  .voice-bars{
    height:16px;
    gap:2px
  }
  .voice-bars i{
    width:2px;
    height:9px
  }
  .voice-bars i:nth-child(2),.voice-bars i:nth-child(4){
    height:14px
  }
  .voice-bars i:nth-child(3){
    height:20px
  }
  .spark-one{
    top:9%;
    right:0;
    font-size:26px
  }
  .spark-two{
    left:2%;
    bottom:23%;
    font-size:23px
  }
  .dot-one{
    width:17px;
    height:17px;
    right:1%;
    bottom:20%
  }
  .dot-two{
    width:9px;
    height:9px;
    left:17%;
    top:0
  }
  .downloads{
    order:5;
    justify-content:center;
    gap:13px;
    margin-top:8px;
    text-align:left
  }
  .download-card{
    width:min(46%,176px);
    padding:13px 11px;
    border-radius:16px
  }
  .download-label{
    gap:7px;
    margin-bottom:12px
  }
  .download-label strong{
    font-size:13px
  }
  .platform-symbol{
    font-size:16px;
    min-width:27px
  }
  .android-symbol{
    width:24px
  }
  .download-label small{
    font-size:9px
  }
  .qr-frame{
    padding:6px
  }
  .qr-frame img{
    width:109px;
    height:109px
  }
  .download-status{
    font-size:10px
  }
  .footer-main{
    display:block;
    text-align:center
  }
  .footer-links,.footer-contact{
    justify-content:center;
    gap:4px 18px
  }
  .footer-links{
    margin:6px 0
  }
  .footer-links a,.footer-contact a{
    min-height:36px
  }
  .site-footer{
    font-size:10px;
    padding-block:18px 22px
  }
  .footer-contact{
    gap:0 13px
  }
  .ambient i:nth-child(1){
    right:-200px;
    top:20%
  }
  .ambient i:nth-child(2){
    right:-80px;
    top:5%
  }
}
@media(max-width:359px){
  .shell{
    padding-inline:17px
  }
  .site-header nav{
    gap:14px
  }
  .hero-description{
    font-size:13px
  }
  .qr-frame img{
    width:95px;
    height:95px
  }
  .download-card{
    padding-inline:8px
  }
  .download-label{
    gap:4px
  }
  .small-arrow{
    display:none
  }
}
@media(max-width:700px){
  .site-header{
    height:76px
  }
  .hero{
    padding-top:16px
  }
  .eyebrow{
    margin-bottom:12px
  }
  .hero-art{
    width:min(220px,70%);
    margin-block:0 4px
  }
  .hero-logo{
    width:180px
  }
  .voice-chip{
    padding:8px 11px;
    left:0
  }
  .interests{
    margin-top:10px
  }
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{
    scroll-behavior:auto!important;
    transition-duration:0s!important;
    animation:none!important
  }
}
/* Document and download pages share brand/assets, with readable light content. */
.document-shell .toc ol{
  list-style:none;
  padding-left:0
}
.document-page{
  color-scheme:light;
  background:#f8f7fc;
  color:#332b42;
  min-height:100svh
}
.document-page .site-header{
  height:88px;
  border-bottom:1px solid #e9e4f1
}
.document-page .brand{
  color:#382647
}
.back-home{
  color:#70617e;
  font-size:14px;
  padding-block:13px
}
.document-shell{
  width:min(930px,100%);
  margin:40px auto 66px;
  padding:40px 50px 48px;
  background:#fff;
  border:1px solid #e9e4f1;
  border-radius:20px;
  box-shadow:0 8px 32px #38204c04
}
.document-shell h1{
  font-size:36px;
  line-height:1.35;
  margin:0 0 15px;
  color:#2b2039;
  letter-spacing:0
}
.document-meta{
  color:#7b7085;
  font-size:13px;
  line-height:1.9;
  margin-bottom:26px
}
.draft-notice{
  font-size:13px;
  line-height:1.8;
  color:#715e84;
  background:#f5f0fc;
  border-left:3px solid #b69bd5;
  padding:14px 18px;
  border-radius:0 7px 7px 0;
  margin:24px 0
}
.document-body{
  font-size:15px;
  line-height:1.95;
  overflow-wrap:anywhere
}
.document-body h2{
  font-size:21px;
  color:#30223f;
  line-height:1.5;
  margin:38px 0 15px;
  scroll-margin-top:24px
}
.document-body h3{
  font-size:17px;
  line-height:1.6;
  margin:25px 0 8px
}
.document-body p{
  margin:12px 0
}
.document-body li{
  margin:7px 0;
  padding-left:2px
}
.document-body strong{
  font-weight:650;
  color:#362440
}
.document-body a{
  color:#7852ba;
  text-decoration:underline;
  text-underline-offset:3px
}
.toc{
  background:#faf9fd;
  border:1px solid #eee9f5;
  border-radius:10px;
  padding:16px 20px;
  margin:26px 0
}
.toc summary{
  cursor:pointer;
  font-size:14px;
  font-weight:600;
  min-height:28px
}
.toc ol{
  margin:10px 0 0;
  padding-left:22px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2px 28px;
  font-size:13px
}
.toc a{
  color:#705a8d
}
.table-wrap{
  overflow:auto;
  margin:16px 0
}
.document-body table{
  border-collapse:collapse;
  width:100%;
  min-width:580px;
  font-size:13px;
  line-height:1.8
}
.document-body th,.document-body td{
  text-align:left;
  border:1px solid #e9e3f0;
  padding:12px 13px;
  vertical-align:top
}
.document-body th{
  background:#f6f2fb;
  color:#513a6b;
  font-weight:600
}
.document-body td:first-child{
  min-width:100px
}
.document-footer{
  border-top:1px solid #eee8f4;
  margin-top:38px;
  padding-top:22px;
  font-size:13px;
  color:#8c8097;
  display:flex;
  justify-content:space-between;
  gap:15px
}
.document-footer a{
  color:#7852ba;
  padding:8px 0;
  display:inline-flex
}
.download-page-shell{
  width:min(550px,calc(100% - 40px));
  margin:60px auto;
  background:white;
  border:1px solid #e7e0f0;
  border-radius:24px;
  padding:36px;
  text-align:center
}
.download-page-shell>.download-logo{
  width:76px;
  height:76px;
  border-radius:23px;
  margin:0 auto 22px
}
.download-page-shell h1{
  font-size:27px;
  letter-spacing:0;
  line-height:1.5
}
.download-page-shell p{
  font-size:14px;
  line-height:1.9;
  color:#7c6e89
}
.download-action{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  min-height:48px;
  padding:12px 26px;
  background:#7b55bc;
  border-radius:30px;
  color:white;
  font-weight:600;
  font-size:14px;
  margin:12px 0 8px
}
.download-action[hidden]{
  display:none
}
.download-page-shell .soft-link{
  font-size:13px;
  color:#856c9f;
  min-height:44px;
  display:inline-flex;
  align-items:center
}
.download-note{
  font-size:12px!important;
  margin-top:22px!important
}
.preview-label{
  color:#86728f;
  font-size:11px;
  text-align:center;
  margin:15px 20px
}
@media(max-width:700px){
  .document-page .site-header{
    height:76px
  }
  .document-shell{
    margin:20px 14px 35px;
    width:auto;
    padding:27px 22px;
    border-radius:15px
  }
  .document-shell h1{
    font-size:28px
  }
  .document-body{
    font-size:14px;
    line-height:1.95
  }
  .document-body h2{
    font-size:19px
  }
  .toc{
    padding:14px 16px
  }
  .toc ol{
    grid-template-columns:1fr
  }
  .document-footer{
    flex-wrap:wrap
  }
  .back-home{
    font-size:12px
  }
  .download-page-shell{
    margin-block:34px;
    padding:30px 22px
  }
}
@media print{
  .document-page{
    background:white
  }
  .site-header,.toc,.document-footer,.preview-label{
    display:none
  }
  .document-shell{
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
    border:0;
    box-shadow:none
  }
  .document-body{
    font-size:11pt
  }
  .document-body h2{
    break-after:avoid
  }
  .table-wrap{
    overflow:visible
  }
  a{
    color:inherit!important
  }
  table{
    min-width:0!important
  }
  @page{
    margin:18mm
  }
}
/* A constrained card must never distort its QR matrix. */
.qr-frame img{
  height:auto;
  aspect-ratio:1
}
