@font-face {
  font-family: 'Space Grotesk';
  src: url('assets/space-grotesk-semibold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
.home-page { background: #080b10; --container-width: 1180px; --bg-body: #080b10; --bg-soft: #0c1017; --text-muted: #a6afbf; }
.home-page h1,.home-page h2,.home-page h3,.advantage-value,.release-version>span:first-child { font-family: 'Space Grotesk',sans-serif; font-weight: 600; }
.home-page .site-header { background: #080b10f2; border-bottom-color: #99b8e617; }
.home-page .navbar { max-width: 1360px; }
.home-page .header-cta { background: #121823; border-color: #53607966; }
.home-page .btn { border-radius: 6px; min-height: 50px; padding: 13px 22px; }
.home-page .btn-primary { background: #8752f1; border-color: #b795ff88; box-shadow: inset 0 1px #ffffff30,0 5px 24px #7f45eb29; }
.home-page .btn-primary:hover { background: #9866ff; border-color: #d1b8ff; }
.home-page .btn-secondary { background: #101822dd; border-color: #90adc04a; }
.home-page .header-cta { min-height: 44px; padding: 10px 16px; }
.home-page .section { border-top: 0; }
.portal-hero { position: relative; isolation: isolate; overflow: hidden; min-height: min(670px,calc(100svh - 165px)); display: flex; flex-direction: column; justify-content: space-between; padding-top: 64px; }
.portal-pattern { position: absolute; inset: 0; z-index: -1; background-color: #0a0c11; background-image: linear-gradient(#adbde708 1px,transparent 1px),linear-gradient(90deg,#adbde708 1px,transparent 1px); background-size: 64px 64px; pointer-events: none; }
.portal-content { text-align: center; }
.portal-badge { display: inline-flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px; min-height: 32px; padding: 6px 12px; border: 1px solid #78adc134; background: #0b121bd4; border-radius: 4px; font-size: 10px; color: #d1dce9; }
.portal-badge>span:last-child { color: #99a8ba; }
.status-point { height: 5px; width: 5px; background: #78e8d9; box-shadow: 0 0 9px #78e8d966; border-radius: 50%; flex: 0 0 auto; }
.portal-badge-divider { width: 1px; height: 12px; background: #3d4859; }
.portal-content h1 { display: block; font-size: 104px; line-height: 1.05; margin: 20px auto 14px; color: #fafaff; }
.portal-content h1>span:first-child { color: #bc9bff; }
.title-marker { display: inline-block; width: 9px; height: 9px; margin-left: 9px; background: #9fe8ed; box-shadow: 0 0 18px #9fe8ed50; vertical-align: baseline; }
.portal-content h2 { font-size: 27px; line-height: 1.3; margin: 0 0 14px; color: #e6eaf1; }
.portal-content>p { max-width: 520px; margin: 0 auto; color: #b4c0cf; font-size: 15px; line-height: 1.7; text-wrap: balance; }
.portal-actions { display: flex; justify-content: center; gap: 12px; margin-top: 26px; }
.portal-actions .btn>svg:last-child:not(:first-child) { width: 16px; margin-left: 6px; }
.portal-note { display: flex; justify-content: center; align-items: center; gap: 7px; font-size: 11px; color: #99a9bb; margin-top: 17px; }
.portal-note svg { width: 13px; height: 13px; color: #79ccba; }
.portal-shortcuts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); border-top: 1px solid #95b4d629; border-bottom: 1px solid #95b4d617; margin-top: 54px; background: #080d15b8; }
.portal-shortcuts>a { display: flex; align-items: center; gap: 14px; padding: 22px 26px; min-width: 0; min-height: 90px; position: relative; transition: background 180ms ease; }
.portal-shortcuts>a+a { border-left: 1px solid #95b4d617; }
.shortcut-number { font: 10px/1 monospace; color: #5d6c81; align-self: flex-start; padding-top: 5px; }
.portal-shortcuts>a>svg { width: 23px; height: 23px; color: #b697f5; }
.portal-shortcuts>a:nth-child(2)>svg { color: #78d9c5; }
.portal-shortcuts>a:nth-child(3)>svg { color: #79cde1; }
.portal-shortcuts>a>svg:last-child { width: 17px; height: 17px; margin-left: auto; color: #718096; transition: transform 180ms var(--ease-out),color 180ms ease; }
.portal-shortcuts strong { display: block; font-size: 14px; font-weight: 600; line-height: 1.4; }
.portal-shortcuts small { display: block; margin-top: 4px; font-size: 11px; color: #8190a5; }
.portal-shortcuts>a:hover { background: #9dc5ed0a; }
.portal-shortcuts>a:hover>svg:last-child { transform: translate(2px,-2px); color: #d4c2ff; }
.workshop-section { position: relative; padding: 64px 0 52px; background: #080b10; }
.workshop-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 48px; margin-bottom: 32px; }
.section-index { display: inline-flex; gap: 5px; font: 10px/1.5 ui-monospace,Consolas,monospace; color: #8798b0; }
.section-index>span { color: #82cfdc; }
.workshop-heading h2 { font-size: 40px; line-height: 1.15; margin-top: 14px; }
.workshop-heading h2 span:last-child { color: #91a0b7; }
.workshop-heading>p { max-width: 330px; color: #91a0b7; font-size: 14px; line-height: 1.75; padding-bottom: 2px; }
.workshop-grid { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 20px; }
.workshop-grid > a { grid-column: span 2; }
.workshop-grid > a:nth-child(n+4) { grid-column: span 3; }
.workshop-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid #899ab82a; border-radius: 8px; background: #0e131d; transition: border-color 180ms ease,transform 180ms var(--ease-out),box-shadow 180ms ease; }
.workshop-art { position: relative; isolation: isolate; display: flex; justify-content: center; align-items: center; gap: 8px; height: 180px; flex-shrink: 0; overflow: hidden; border-bottom: 1px solid #899ab81b; background: #131320; }
.art-grid { position: absolute; inset: 0; z-index: -1; opacity: .38; background-image: linear-gradient(#8da0c80e 1px,transparent 1px),linear-gradient(90deg,#8da0c80e 1px,transparent 1px); background-size: 24px 24px; mask-image: linear-gradient(black,transparent); }
.art-caption { position: absolute; top: 16px; left: 20px; color: #788298; font: 9px/1.4 monospace; display: inline-flex; gap: 4px; }
.craft-art img { width: 92px; height: 92px; object-fit: contain; filter: drop-shadow(0 12px 10px #0005); transition: transform 250ms var(--ease-out); }
.craft-connection { display: grid; place-items: center; width: 40px; height: 30px; color: #a790d4; }
.craft-equation { display: flex; gap: 10px; position: absolute; bottom: 16px; left: 16px; right: 16px; justify-content: center; color: #9293b1; font-size: 9px; }
.craft-equation>span:nth-child(2n) { color: #635586; }
.market-art { background: #0c1a1c; }
.market-bars { position: absolute; inset: 38px 34px 47px; display: flex; align-items: flex-end; gap: 10px; border-bottom: 1px solid #569d972d; }
.market-bars i { display: block; flex: 1; height: var(--bar); border-radius: 2px 2px 0 0; background: #448e86; border-top: 1px solid #8bedcc; opacity: .8; transform-origin: bottom; transition: transform 260ms var(--ease-out),opacity 260ms ease; }
.market-bars i:nth-child(even) { background: #585187; border-top-color: #ab94f5; }
.market-legend { position: absolute; bottom: 18px; left: 22px; right: 22px; display: flex; justify-content: space-between; font-size: 9px; color: #8aa9a8; }
.market-legend>span { display: flex; align-items: center; gap: 6px; }
.market-legend i { width: 5px; height: 5px; border-radius: 1px; background: #71c8b2; }
.market-legend>span:last-child i { background: #b598f2; }
.roads-art { background: #101926; }
.roads-art>img { width: 190px; height: 166px; object-fit: contain; opacity: .83; transition: transform 260ms var(--ease-out),opacity 260ms ease; }
.map-coordinate { position: absolute; bottom: 12px; left: 20px; font: 9px/1.4 monospace; color: #81a2be; }
.workshop-card-copy { display: flex; flex-direction: column; flex: 1; padding: 24px; }
.workshop-category { display: flex; gap: 7px; align-items: center; color: #ad93d1; font-size: 9px; font-weight: 600; }
.workshop-category svg { width: 13px; height: 13px; }
.market-card .workshop-category { color: #7bbcaf; }
.roads-card .workshop-category { color: #85b5d5; }
.workshop-card h3 { font-size: 26px; margin: 10px 0 12px; line-height: 1.2; }
.workshop-card p { font-size: 13px; line-height: 1.8; color: #96a4b9; margin-bottom: 18px; }
.workshop-tags { display: flex; gap: 9px; flex-wrap: wrap; color: #748299; font: 10px/1.5 ui-monospace,monospace; margin-bottom: 24px; }
.workshop-tags>span+span::before { content: '/'; margin-right: 9px; color: #455366; }
.workshop-open { display: flex; justify-content: space-between; align-items: center; margin-top: auto; padding-top: 16px; border-top: 1px solid #899ab821; color: #d8d6f0; font-size: 12px; font-weight: 600; }
.workshop-open svg { width: 17px; height: 17px; color: #7f8aa5; transition: transform 180ms var(--ease-out); }
.advantage-strip { background: #0a0e15; border-top: 1px solid #899ab815; border-bottom: 1px solid #899ab815; padding: 29px 0; }
.advantage-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 26px; }
.advantage-grid>div { display: flex; align-items: center; gap: 18px; }
.advantage-grid>div+div { padding-left: 28px; border-left: 1px solid #899ab824; }
.advantage-value { white-space: nowrap; font-size: 35px; line-height: 1; color: #e8e6f1; }
.advantage-value>span { color: #8a75b2; font-size: 22px; }
.language-value { font-size: 20px; }
.advantage-grid h3 { font-size: 13px; margin-bottom: 3px; }
.advantage-grid p { font-size: 10px; line-height: 1.7; color: #7f8da3; }
.desktop-section { position: relative; overflow: hidden; padding: 72px 0; }
.desktop-grid-bg { position: absolute; inset: 0; pointer-events: none; opacity: .55; background-image: linear-gradient(#53627c0b 1px,transparent 1px),linear-gradient(90deg,#53627c0b 1px,transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(90deg,transparent,black); }
.desktop-layout { position: relative; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.8fr); align-items: center; gap: 100px; }
.desktop-copy h2 { margin: 18px 0 20px; font-size: 48px; line-height: 1.1; }
.desktop-copy h2>span:last-child { color: #ad93d6; }
.desktop-copy>p { max-width: 420px; font-size: 14px; color: #97a3b6; line-height: 1.8; }
.desktop-compatibility { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font-size: 11px; color: #93a0b4; margin-top: 24px; }
.desktop-compatibility svg { width: 13px; height: 13px; color: #79b8ab; }
.desktop-compatibility svg:nth-of-type(2) { margin-left: 10px; }
.release-panel { position: relative; padding: 30px; border: 1px solid #9b83c34f; border-radius: 8px; background: #101521; box-shadow: 0 12px 36px #0004,inset 0 1px #ccb4ff12; }
.release-panel::before { content: ''; position: absolute; height: 2px; top: -1px; left: 24px; right: 24px; background: linear-gradient(90deg,transparent,#b39ae5,transparent); }
.release-brand { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; }
.release-brand img { width: 42px; height: 42px; object-fit: contain; }
.release-brand small { display: block; font-size: 10px; font-weight: 400; color: #7c899e; }
.release-brand .beta-badge { margin-left: auto; }
.release-version { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.release-version>span:first-child { font-size: 38px; line-height: 1.2; }
.release-free { color: #82c6b3; font-size: 10px; }
.release-date { font-size: 10px; color: #7c899e; margin-top: 7px; }
.release-panel .btn-download { margin-top: 23px; justify-content: center; padding-inline: 16px; }
.release-panel .btn-download>svg:last-child { margin-left: auto; }
.release-panel .btn-download>svg:first-child { margin-right: auto; }
.release-notes { display: flex; align-items: center; justify-content: center; gap: 5px; min-height: 44px; margin-top: 7px; font-size: 10px; color: #8e9bb0; }
.release-notes svg { width: 13px; height: 13px; }
.release-notes:hover { color: #d9d2ed; }
.portal-faq { border-top: 1px solid #899ab818 !important; padding: 48px 0 60px; background: #090d14; }
.portal-faq>.container { display: grid; grid-template-columns: minmax(0,.75fr) minmax(0,1.25fr); gap: 90px; align-items: start; }
.portal-faq .section-title { text-align: left; margin: 0; }
.portal-faq .eyebrow { color: #869fbd; font: 10px/1.6 monospace; }
.portal-faq h2 { font-size: 28px; margin-top: 12px; }
.portal-faq .section-title>p { font-size: 13px; color: #7f8fa5; }
.portal-faq .faq-list { width: 100%; border-top: 0; }
.portal-faq .faq-header { padding: 18px 0; font-size: 13px; min-height: 58px; }
.portal-faq .faq-header svg { width: 15px; height: 15px; color: #8391a7; transition: transform 180ms var(--ease-out); }
.portal-faq .faq-body { font-size: 12px; }
.home-page .site-footer { padding: 26px 0; background: #070a10; border-color: #899ab818; }
.footer-brandline { width: 100%; display: flex; justify-content: space-between; align-items: center; padding-bottom: 20px; border-bottom: 1px solid #899ab818; }
.footer-brandline .logo { font-size: 16px; }
.footer-brandline .logo img { width: 30px; height: 30px; object-fit: contain; }
.footer-contact { display: flex; align-items: center; gap: 8px; color: #8292aa; font-size: 12px; min-height: 44px; }
.footer-contact svg { width: 14px; }
.home-page .footer-inner { gap: 10px; }
.home-page .site-footer p { font-size: 10px; color: #626f85; }
.home-page .footer-links a { color: #919db0; font-size: 10px; min-height: 36px; }
@media (hover: hover) and (pointer: fine) {
  .workshop-card:hover { border-color: #a88bd581; transform: translateY(-4px); box-shadow: 0 10px 30px #0003; }
  .market-card:hover { border-color: #73b5a96b; }
  .roads-card:hover { border-color: #83bed47a; }
  .craft-card:hover .craft-art>img:first-of-type { transform: translateX(-4px) rotate(-4deg); }
  .craft-card:hover .craft-art>img:last-of-type { transform: translateX(4px) rotate(4deg); }
  .market-card:hover .market-bars i { transform: scaleY(.86); opacity: 1; }
  .market-card:hover .market-bars i:nth-child(even) { transform: scaleY(1.1); }
  .roads-card:hover .roads-art>img { transform: scale(1.05); opacity: 1; }
  .workshop-card:hover .workshop-open svg { transform: translate(2px,-2px); color: #c8b2f0; }
}
@media (prefers-reduced-motion: no-preference) {
  .portal-content h1 { animation: title-arrive 480ms var(--ease-out) both; }
  @keyframes title-arrive { from { transform: translateY(9px); opacity: .2; } to { transform: translateY(0); opacity: 1; } }
}
@media (min-width: 981px) and (max-height: 780px) {
  .portal-hero { padding-top: 32px; }
  .portal-content h1 { font-size: 88px; margin-top: 16px; }
  .portal-shortcuts { margin-top: 34px; }
}
@media (max-width: 1100px) {
  .portal-shortcuts>a { padding-inline: 18px; gap: 10px; }
  .shortcut-number { display: none; }
  .advantage-grid { gap: 18px; }
  .advantage-grid>div { gap: 12px; }
  .advantage-grid>div+div { padding-left: 18px; }
  .advantage-value { font-size: 28px; }
  .language-value { font-size: 17px; }
  .desktop-layout { gap: 48px; }
  .portal-faq>.container { gap: 48px; }
}
@media (max-width: 800px) {
  .portal-hero { padding-top: 48px; min-height: 620px; }
  .portal-content h1 { font-size: 82px; }
  .portal-shortcuts>a { flex-wrap: wrap; padding: 18px 14px; gap: 8px; }
  .portal-shortcuts small { font-size: 9px; }
  .portal-shortcuts>a>svg:first-of-type { width: 18px; height: 18px; }
  .portal-shortcuts>a>svg:last-child { display: none; }
  .workshop-heading { gap: 32px; }
  .workshop-heading h2 { font-size: 32px; }
  .workshop-heading>p { max-width: 255px; font-size: 12px; }
  .workshop-grid { gap: 12px; }
  .workshop-card-copy { padding: 18px; }
  .workshop-card h3 { font-size: 22px; }
  .workshop-card p { font-size: 12px; }
  .craft-art img { width: 70px; height: 70px; }
  .craft-connection { width: 20px; }
  .craft-equation { gap: 4px; font-size: 8px; }
  .market-bars { gap: 6px; inset-inline: 20px; }
  .advantage-grid>div { flex-direction: column; align-items: flex-start; }
  .desktop-copy h2 { font-size: 38px; }
  .release-panel { padding: 22px; }
}
@media (max-width: 600px) {
  .portal-hero { padding-top: 36px; min-height: auto; }
  .portal-badge { font-size: 8px; gap: 7px; padding: 5px 8px; }
  .portal-content h1 { font-size: 56px; margin-top: 22px; margin-bottom: 16px; }
  .title-marker { width: 5px; height: 5px; margin-left: 4px; }
  .portal-content h2 { font-size: 23px; max-width: 300px; margin: 0 auto 14px; text-wrap: balance; }
  .portal-content>p { font-size: 13px; max-width: 330px; }
  .portal-actions { display: grid; grid-template-columns: 1fr; gap: 10px; max-width: 360px; margin: 24px auto 0; }
  .portal-actions .btn { min-height: 48px; font-size: 13px; }
  .portal-note { font-size: 9px; max-width: 320px; margin: 14px auto 0; align-items: flex-start; }
  .portal-note svg { margin-top: 2px; }
  .portal-shortcuts { margin-top: 38px; }
  .portal-shortcuts>a { display: flex; justify-content: center; flex-direction: column; gap: 8px; padding: 18px 7px; min-height: 82px; text-align: center; }
  .portal-shortcuts strong { font-size: 10px; }
  .portal-shortcuts small { display: none; }
  .workshop-section { padding: 42px 0 32px; }
  .workshop-heading { display: block; margin-bottom: 26px; }
  .workshop-heading h2 { font-size: 33px; }
  .workshop-heading>p { max-width: 330px; margin-top: 16px; font-size: 13px; }
  .workshop-grid { grid-template-columns: minmax(0,1fr); gap: 18px; }
  .workshop-grid > a, .workshop-grid > a:nth-child(n+4) { grid-column: auto; }
  .workshop-art { height: 160px; }
  .workshop-card-copy { padding: 24px; }
  .workshop-card h3 { font-size: 26px; }
  .workshop-card p { font-size: 13px; }
  .craft-art img { width: 92px; height: 92px; }
  .craft-connection { width: 36px; }
  .craft-equation { gap: 10px; font-size: 9px; }
  .advantage-strip { padding: 24px 0; }
  .advantage-grid { grid-template-columns: 1fr; gap: 22px; }
  .advantage-grid>div { flex-direction: row; align-items: center; gap: 20px; }
  .advantage-grid>div+div { padding: 20px 0 0; border-left: 0; border-top: 1px solid #899ab821; }
  .advantage-value { min-width: 98px; font-size: 32px; }
  .language-value { font-size: 22px; }
  .advantage-grid h3 { font-size: 14px; }
  .advantage-grid p { font-size: 11px; }
  .desktop-section { padding: 42px 0; }
  .desktop-layout { grid-template-columns: 1fr; gap: 28px; }
  .desktop-copy h2 { font-size: 39px; }
  .desktop-copy>p { font-size: 13px; }
  .release-panel { padding: 25px; }
  .portal-faq { padding: 36px 0; }
  .portal-faq>.container { grid-template-columns: 1fr; gap: 16px; }
  .portal-faq .section-title>p { display: none; }
  .footer-brandline { flex-direction: column; align-items: flex-start; gap: 8px; padding-bottom: 10px; }
  .home-page .footer-links { justify-content: flex-start; width: 100%; gap: 5px 16px; }
  .home-page .site-footer p { text-align: left; width: 100%; }
}
@media (max-width: 360px) {
  .portal-content h1 { font-size: 48px; }
  .portal-badge { gap: 5px; font-size: 7px; }
  .workshop-heading h2 { font-size: 29px; }
}