@font-face{font-family:Michroma;src:url('assets/michroma-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url('assets/inter-latin-wght-normal.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:Plex;src:url('assets/ibm-plex-mono-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
:root{--bg:#060911;--surface:#0c111d;--text:#eef3fd;--muted:#9ba8bc;--cyan:#7edcff;--violet:#b59bfa;--line:rgba(166,190,227,.16);--font:Inter,'Segoe UI',sans-serif;--display:Michroma,'Arial Black',sans-serif;--mono:Plex,Consolas,monospace;color-scheme:dark;scroll-behavior:smooth;scroll-padding-top:100px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:1rem;line-height:1.7;-webkit-font-smoothing:antialiased}button,a,input,summary{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}img,svg{display:block;max-width:100%}h1,h2,h3,p,ul,ol,figure{margin:0}h2,h3{font-weight:450;line-height:1.15;letter-spacing:-.04em}h2{font-size:clamp(2rem,3.5vw,3.35rem)}h3{font-size:1.5rem}ul{list-style:none;padding:0}::selection{background:#647d9c88;color:white}:focus-visible{outline:2px solid var(--cyan);outline-offset:6px}.container{width:min(1240px,calc(100% - 80px));margin-inline:auto}.mono,.eyebrow{font-family:var(--mono);font-size:.75rem;letter-spacing:.09em}.eyebrow{text-transform:uppercase;color:var(--cyan);margin-bottom:25px;letter-spacing:.14em}.muted{color:var(--muted)}.accent{color:var(--cyan)}[hidden]{display:none!important}.skip-link{position:fixed;top:10px;left:10px;z-index:20;padding:10px 20px;background:var(--cyan);color:var(--bg);transform:translateY(-200%)}.skip-link:focus{transform:none}
.site-header{position:sticky;top:0;z-index:10;background:#060911eb;backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.header-inner{height:80px;display:flex;align-items:center;gap:45px}.brand{display:inline-flex;gap:14px;align-items:center;font-family:var(--display);letter-spacing:.24em;font-size:1.15rem}.desktop-nav{margin-left:auto;display:flex;gap:32px}.desktop-nav a{font-size:.875rem;color:#adb8ca;transition:color .2s}.desktop-nav a:hover{color:var(--cyan)}.header-cta{border:1px solid #7386a24f;padding:9px 18px;font-size:.875rem;border-radius:4px;display:flex;gap:25px;align-items:center;background:#141b2970}.header-cta:hover{border-color:var(--cyan);background:#1b293a}.menu-toggle{display:none}.mobile-nav{padding:12px 24px 22px;border-top:1px solid var(--line)}.mobile-nav a{display:block;padding:11px 0}
.hero{position:relative;padding-top:48px;overflow:clip;isolation:isolate;background:radial-gradient(ellipse at 83% 16%,#1a20393d,transparent 38%)}.hero-glow{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 66% 24%,#37316420,transparent 35%),radial-gradient(ellipse at 73% 48%,#63dcff14,transparent 37%)}.hero-topline{display:flex;align-items:center;justify-content:space-between}.hero-topline .eyebrow{margin:0;display:flex;align-items:center;gap:13px}.tiny-line{width:27px;height:1px;background:var(--cyan)}.edition{color:#8d9ab0;font-size:.75rem}.hero-grid{display:grid;grid-template-columns:1.12fr 1fr;align-items:center;gap:16px;padding-top:15px}.hero-title{font-family:var(--display);font-size:clamp(5rem,10.8vw,9.8rem);font-weight:400;line-height:1.35;letter-spacing:.13em;margin-left:-.045em;color:#e8eef9;background:linear-gradient(#fff 15%,#d6e3f8 62%,#8b94af);background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 40px #749ec316)}.hero-headline{font-size:clamp(1.7rem,2.6vw,2.3rem);line-height:1.3;letter-spacing:-.045em;margin-top:5px}.hero-headline span{color:#a5b4cc}.hero-description{max-width:510px;margin-top:24px;color:var(--muted);font-size:1rem;line-height:1.8}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}.button{display:inline-flex;justify-content:center;align-items:center;gap:25px;min-height:50px;padding:12px 23px;border:1px solid transparent;border-radius:4px;font-weight:550;font-size:.875rem;transition:background .2s,box-shadow .2s,border-color .2s}.button-primary{color:#0a1722;background:#a4e5fc;box-shadow:0 0 22px #69d1fc0b}.button-primary:hover{background:#c5eeff;box-shadow:0 0 28px #69d1fc29}.button-secondary{border-color:#a6bee32b;background:#111a2852;color:#d6e0f1;gap:12px}.button-secondary:hover{border-color:#a6bee382;background:#162338}.play-icon{font-size:.7rem;color:var(--cyan)}.format-list{display:flex;align-items:center;flex-wrap:wrap;gap:18px;margin-top:25px;color:var(--muted);font-family:var(--mono);font-size:.75rem}.format-list li+li{position:relative}.format-list li+li:before{content:'·';margin-right:18px;color:#718198}.preview-tag{color:#c7b8ea}.melody-map{align-self:center;margin-top:25px;position:relative;padding:25px 0;background:radial-gradient(ellipse at center,#2b345d30,transparent 65%)}.map-top,.map-bottom{display:flex;justify-content:space-between;gap:10px;font-size:.75rem;color:#7f91ad}.map-top{padding-inline:22px}.map-bottom{padding-inline:22px;color:#94a4bc}.melody-map svg{width:100%;margin:8px 0 15px}.map-grid{stroke:#7b92b711;stroke-width:1}.map-drops{stroke:#aacaff26;stroke-dasharray:2 6;fill:none}.map-node{fill:#aec9ff0d;stroke:#aec9ff29}.map-label{font-family:var(--mono);font-size:12px;fill:#b8c8e2;text-anchor:middle}.melody-line{stroke-dasharray:600;stroke-dashoffset:600;animation:draw 2.2s .3s ease forwards}@keyframes draw{to{stroke-dashoffset:0}}
.product-stage{margin-top:64px;position:relative}.product-stage:before{position:absolute;content:'';inset:12% -15% -5%;z-index:-1;background:radial-gradient(ellipse at 30% 40%,#428aab22,transparent 60%),radial-gradient(ellipse at 80% 40%,#7e58bb25,transparent 60%);filter:blur(28px)}.product-caption{display:flex;justify-content:space-between;gap:15px;padding:14px 0;color:#8e9db4;border-top:1px solid var(--line)}.cross{color:var(--cyan);margin-right:12px}.product-image{padding:0;border:1px solid #8fb5dd54;border-radius:9px;background:#0b101b;display:block;position:relative;overflow:hidden;box-shadow:0 35px 100px #0008,0 0 25px #637caa0d;width:100%}.product-image img{width:100%;height:auto}.image-hint{position:absolute;right:18px;bottom:18px;padding:9px 13px;background:#0b1422e8;border:1px solid #94b1d450;border-radius:3px;color:#dbebff;opacity:0;transition:opacity .2s}.product-image:hover .image-hint,.detail-image:hover .image-hint,button:focus-visible .image-hint{opacity:1}.under-image{display:flex;gap:20px;justify-content:space-between;color:#8a99ae;font-size:.75rem;padding-top:20px}.under-image .mono{font-size:.75rem}
.intro{text-align:center;padding-block:118px 50px}.intro .eyebrow{margin-bottom:25px}.statement{font-size:clamp(1.7rem,3vw,2.65rem);line-height:1.4;font-weight:450;letter-spacing:-.045em}.statement span{color:#99a6bc}.intro-body{max-width:650px;margin:24px auto 0;color:var(--muted);font-size:1rem}.section{padding-block:90px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:42px}.section-heading>p{color:var(--muted);max-width:355px;line-height:1.8;font-size:1rem}.section-heading .eyebrow{margin-bottom:22px}.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.feature-card{--accent:var(--cyan);padding:27px 28px 25px;border:1px solid var(--line);border-radius:6px;background:linear-gradient(140deg,#111a298a,#090e1880);display:flex;flex-direction:column;min-width:0}.feature-card.violet{--accent:var(--violet)}.feature-card.ice{--accent:#bdcff8}.card-head{display:flex;justify-content:space-between;color:var(--accent)}.card-head>span:last-child{font-size:1.15rem}.feature-card h3{font-size:clamp(1.4rem,2vw,1.8rem);line-height:1.25;margin-top:25px}.feature-card>p{color:var(--muted);font-size:1rem;line-height:1.75;margin-top:20px;flex:1}.feature-foot{margin-top:28px;padding-top:19px;border-top:1px solid var(--line);font-size:.75rem;color:#98aac4;letter-spacing:.025em}.note-diagram{height:116px;position:relative;margin-top:32px;background:repeating-linear-gradient(0deg,transparent 0,transparent 27px,#9ac3ff0e 28px,#9ac3ff0e 29px),repeating-linear-gradient(90deg,transparent 0,transparent 39px,#9ac3ff0b 40px,#9ac3ff0b 41px)}.note-diagram i,.note-diagram span{position:absolute;height:7px;border-radius:2px;background:var(--accent);box-shadow:0 0 12px #7edcff30;left:0;width:20%;bottom:23px}.note-diagram i:nth-child(2){left:22%;bottom:51px}.note-diagram i:nth-child(3){left:44%;bottom:79px}.note-diagram i:nth-child(4){left:66%;width:12%;bottom:51px}.note-diagram span{left:83%;width:17%;bottom:79px;background:#b59bfa23;border:1px solid #b59bfa85;box-shadow:none}.note-diagram span:nth-of-type(2){bottom:51px}.note-diagram span:nth-of-type(3){bottom:23px}.chord-diagram{height:116px;margin-top:32px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;align-items:center}.chord-diagram>div{position:relative;padding-top:20px}.chord-diagram i{display:block;height:5px;margin:9px 0;border:1px solid #b49afd;background:#b49afd55;border-radius:2px}.chord-diagram>div:nth-child(2){padding-top:8px}.chord-diagram>div:nth-child(3){padding-top:27px}.chord-diagram>div:nth-child(4){padding-top:15px}.chord-diagram span{display:block;color:var(--accent);font-family:var(--mono);font-size:.75rem;text-align:center;padding-top:7px}.expression-diagram{height:116px;margin-top:32px;display:grid;gap:9px}.expression-diagram>div{display:grid;grid-template-columns:88px 1fr;align-items:center;gap:18px;color:#a9b6ca;font-size:.75rem;font-family:var(--mono)}.expression-diagram i{height:4px;display:block;background:#253042;border-radius:2px;position:relative}.expression-diagram i:before{content:'';position:absolute;inset:0 auto 0 0;width:var(--value);background:linear-gradient(90deg,#8499c9,#bdcff8);border-radius:2px}.expression-diagram i:after{content:'';width:7px;height:7px;border-radius:50%;background:var(--accent);position:absolute;left:var(--value);top:-1.5px}
.workflow-section{margin-top:30px;padding-block:96px;background:linear-gradient(100deg,#10152099,#090d1699);border-block:1px solid var(--line);overflow:clip}.workflow-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:center}.workflow-copy>p:not(.eyebrow){color:var(--muted);max-width:390px;margin-top:25px}.steps{list-style:none;padding:0;margin-top:35px;display:grid;gap:26px}.steps li{display:flex;gap:20px}.steps li>span{color:var(--cyan);padding-top:2px;font-size:.875rem}.steps h3{font-size:1.0625rem;font-weight:550;letter-spacing:-.015em;line-height:1.5}.steps p{margin-top:6px;max-width:390px;color:var(--muted);font-size:.875rem;line-height:1.7}.workflow-visual{min-width:0}.detail-label{display:flex;justify-content:space-between;gap:10px;color:#99acd0;margin-bottom:20px}.detail-image{display:block;position:relative;overflow:hidden;height:390px;width:100%;padding:0;border:1px solid #7799be4f;border-radius:6px;background:#0b111c;box-shadow:0 25px 65px #0003}.detail-image img{position:absolute;max-width:none;width:1130px;height:auto;left:-203px;top:-235px}.workflow-visual>p{margin-top:25px;font-size:1rem;color:#d3def1}.workflow-visual>p>span{color:var(--muted);font-size:.875rem}.workflow-tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:25px;font-size:.75rem;letter-spacing:.04em}.workflow-tags span{border:1px solid var(--line);padding:5px 9px;color:#9cabc1;border-radius:3px}
.listen-section{padding-top:110px}.audio-panel{border:1px solid #97b3da38;background:linear-gradient(115deg,#15233270,#14132399);border-radius:7px;padding:30px;display:grid;grid-template-columns:190px minmax(0,1fr);gap:40px}.audio-art{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;border:1px solid var(--line);background:radial-gradient(ellipse,#384e7930,transparent 65%),#0b101b;min-height:190px;border-radius:4px}.audio-art img{filter:drop-shadow(0 0 28px #839fff5c)}.audio-art span{font-size:.75rem;letter-spacing:.04em;color:#99a9c2}.audio-content{display:flex;justify-content:center;flex-direction:column;min-width:0}.audio-title{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:23px}.audio-title .eyebrow{font-size:.75rem}.audio-title h3{font-size:1.7rem;margin-top:6px}.audio-format{color:#91a5c4;text-align:right;font-size:.75rem;line-height:1.9}.audio-content audio{width:100%;height:44px;accent-color:var(--cyan)}.audio-bottom{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-top:18px}.audio-bottom p{color:var(--muted);font-size:.75rem}.audio-bottom a{font-size:.875rem;color:var(--cyan);white-space:nowrap}.audio-bottom a:hover{text-decoration:underline}.audio-bottom a span{margin-left:15px}.audio-error{color:#f8bbb4;font-size:.875rem;margin-top:15px}.audio-error a{text-decoration:underline}
.details-section{display:grid;grid-template-columns:1fr 1fr;gap:90px;padding-top:70px;padding-bottom:115px}.details-intro h2{font-size:clamp(1.7rem,2.6vw,2.4rem);line-height:1.3}.details-intro>p:not(.eyebrow){margin-top:20px;max-width:440px;color:var(--muted);font-size:1rem}.specs{margin:30px 0 0}.specs>div{display:flex;justify-content:space-between;gap:25px;font-size:.875rem;border-top:1px solid var(--line);padding:12px 0}.specs dt{color:var(--muted)}.specs dd{margin:0;text-align:right;color:#d0ddef}.faq details{border-top:1px solid var(--line)}.faq details:last-child{border-bottom:1px solid var(--line)}.faq summary{font-size:1rem;font-weight:500;display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer;list-style:none;padding:23px 0}.faq summary::-webkit-details-marker{display:none}.faq summary>span{font-size:1.25rem;font-weight:400;color:var(--cyan);flex-shrink:0;transition:transform .2s}.faq details[open] summary>span{transform:rotate(45deg)}.faq details p{font-size:.875rem;line-height:1.9;color:var(--muted);padding:0 30px 24px 0}.closing{text-align:center;border-block:1px solid var(--line);background:radial-gradient(ellipse at 50% 100%,#2f396d38,transparent 65%),#0a0d16}.closing-inner{display:flex;align-items:center;flex-direction:column;padding-block:75px}.closing-inner>img{margin-bottom:25px}.closing .eyebrow{margin-bottom:18px;color:#b4c3dc}.closing h2{font-size:clamp(2rem,3.6vw,3.2rem)}.closing .button{margin-top:30px}.closing-note{margin-top:30px;color:#8a9bb6;font-size:.75rem}.site-footer{display:flex;align-items:center;gap:35px;padding-block:35px}.site-footer .brand{font-size:.95rem}.site-footer p{color:var(--muted);font-size:.875rem}.site-footer>.mono{margin-left:auto;font-size:.75rem;letter-spacing:.025em;color:#8495af}.footer-sep{color:#4f5d75;margin-inline:12px}
.dialog-open{overflow:hidden}.image-dialog{max-width:min(96vw,1600px);width:96vw;max-height:96dvh;padding:50px 16px 12px;border:1px solid #8ea5ca63;border-radius:8px;background:#090f19;color:var(--text);box-shadow:0 20px 100px #0009}.image-dialog::backdrop{background:#03070fe8;backdrop-filter:blur(10px)}.image-dialog img{width:auto;max-width:100%;max-height:calc(96dvh - 110px);height:auto;object-fit:contain;margin:auto}.dialog-close{position:absolute;top:10px;right:16px;background:#172236;border:1px solid var(--line);border-radius:3px;padding:4px 12px;font-size:.875rem;display:flex;gap:20px;align-items:center;min-height:32px}.dialog-close span{font-size:1.3rem}.image-dialog>p{text-align:center;color:var(--muted);font-size:.875rem;margin-top:10px}
@media(min-width:1600px){.container{width:min(1320px,calc(100% - 100px))}.hero-title{font-size:10.5rem}}
@media(max-width:1050px){.container{width:calc(100% - 48px)}.hero-grid{grid-template-columns:1.1fr .9fr}.hero-title{font-size:clamp(5rem,11vw,8rem)}.hero-headline{font-size:1.85rem}.map-top,.map-bottom{font-size:.75rem;letter-spacing:0;flex-wrap:wrap;gap:5px}.feature-card{padding:24px 20px}.workflow-grid{gap:40px}.details-section{gap:45px}.audio-panel{gap:25px;grid-template-columns:155px 1fr}.site-footer{flex-wrap:wrap;gap:20px}.site-footer>.mono{margin-left:auto}.feature-foot{letter-spacing:0}.edition{display:none}}
@media(max-width:760px){:root{scroll-padding-top:85px}.container{width:calc(100% - 40px)}.header-inner{height:68px;gap:18px}.brand{font-size:1rem;gap:10px}.brand img{width:26px;height:26px}.desktop-nav{display:none}.header-cta{margin-left:auto;font-size:.75rem;padding:7px 12px;gap:16px}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;background:none;border:1px solid var(--line);padding:10px;width:40px;height:40px;border-radius:3px}.menu-toggle span{height:1px;width:18px;background:#d0ddef}.hero{padding-top:35px}.hero-grid{display:block;padding-top:16px}.hero-title{font-size:clamp(5rem,17vw,8.5rem);letter-spacing:.12em}.hero-headline{font-size:clamp(1.65rem,5vw,2.1rem);margin-top:15px}.hero-description{max-width:550px;margin-top:20px;font-size:1rem}.hero-actions{margin-top:25px}.button{padding:12px 18px;gap:15px}.hero-topline .eyebrow{font-size:.75rem;letter-spacing:.08em}.melody-map{max-width:530px;margin:36px auto 0;padding:20px 0 0}.melody-map svg{max-height:240px}.map-top,.map-bottom{padding-inline:0;justify-content:space-between}.product-stage{margin-top:36px}.product-caption{font-size:.75rem;letter-spacing:0}.product-caption>span:last-child{display:none}.product-image{border-radius:4px}.image-hint{opacity:1;right:10px;bottom:10px;font-size:.75rem;padding:5px 8px}.under-image{padding-top:14px;font-size:.75rem}.under-image>.mono{display:none}.intro{padding-block:74px 25px}.intro-body{font-size:1rem}.section{padding-block:60px}.section-heading{display:block;margin-bottom:30px}.section-heading>p{margin-top:20px;max-width:500px;font-size:1rem}.section-heading .eyebrow{margin-bottom:20px}.feature-grid{grid-template-columns:1fr;gap:15px}.feature-card{padding:25px}.feature-card h3{font-size:1.8rem}.feature-card>p{font-size:1rem}.note-diagram,.chord-diagram,.expression-diagram{max-width:430px;width:100%;margin-top:24px}.feature-foot{font-size:.75rem;margin-top:24px}.workflow-section{padding-block:60px;margin-top:0}.workflow-grid{grid-template-columns:1fr;gap:45px}.workflow-copy h2{font-size:2.5rem}.workflow-copy>p:not(.eyebrow){max-width:550px}.steps p{max-width:550px}.detail-image{height:330px}.detail-image img{width:1000px;left:-181px;top:-207px}.audio-panel{padding:24px;display:block}.audio-art{display:none}.audio-title h3{font-size:1.5rem}.audio-title{gap:15px}.audio-bottom{align-items:flex-start;gap:14px;flex-wrap:wrap}.audio-bottom p{max-width:270px}.details-section{display:grid;grid-template-columns:1fr;gap:45px;padding-top:30px}.details-intro h2{font-size:2rem}.details-intro>p:not(.eyebrow){max-width:550px}.specs{font-size:.875rem}.closing-inner{padding-block:60px}.closing h2{max-width:370px;line-height:1.25}.site-footer{gap:20px;padding-block:30px}.site-footer p{margin-left:auto;font-size:.75rem}.site-footer>.mono{width:100%;margin:0;text-align:center;font-size:.75rem}.image-dialog{padding-inline:8px}.image-dialog>p{font-size:.75rem}.dialog-close{right:8px}}
@media(max-width:380px){.container{width:calc(100% - 32px)}.header-inner{gap:10px}.header-cta{gap:8px;padding-inline:8px}.brand{letter-spacing:.14em}.hero-title{font-size:16.8vw}.hero-actions{gap:9px}.hero-actions .button{font-size:.8125rem;padding-inline:12px}.format-list{gap:10px;font-size:.75rem}.format-list li+li:before{margin-right:10px}.map-top,.map-bottom{font-size:.75rem;gap:5px}.melody-map svg{margin-block:0}.hero-headline{font-size:1.6rem}.audio-panel{padding:18px}.audio-title h3{font-size:1.3rem}.audio-format{font-size:.75rem}.specs>div{gap:12px}.detail-label{letter-spacing:0}.site-footer p{width:100%;margin:0}.site-footer>.mono{text-align:left}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.melody-line{stroke-dashoffset:0}}
