@charset "UTF-8";
:root{color-scheme:dark;--paper:#f4f0e8;--ink:#100c1c;--muted:#a9a2b9;--line:#ffffff22;--purple:#a883f3;--lilac:#d8c5ff;--mint:#bdddd2;font-family:-apple-system,BlinkMacSystemFont,"PingFang HK","Microsoft JhengHei",sans-serif;background:var(--ink);color:var(--paper);font-synthesis:none;scroll-behavior:smooth;scroll-padding-top:0px}
*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button{border:0}img{max-width:100%;display:block}h1,h2,h3,p{margin:0}::selection{color:var(--ink);background:var(--lilac)}:focus-visible{outline:3px solid var(--mint);outline-offset:6px}section[id],article[id]{scroll-margin-top:32px}.section-shell{width:min(1184px,calc(100% - 112px));margin-inline:auto}.skip-link{position:fixed;left:20px;top:-80px;z-index:100;background:var(--paper);color:var(--ink);padding:14px}.skip-link:focus{top:12px}.eyebrow{display:flex;align-items:center;gap:11px;font:10px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1.6px;color:var(--lilac)}.eyebrow-line{display:inline-block;width:40px;height:1px;background:currentColor;opacity:.5}.status-light{display:inline-block;height:6px;width:6px;flex:none;border-radius:50%;background:var(--mint);box-shadow:0 0 10px #bdddd255}.site-header{height:88px;margin:0 48px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:28px;position:relative;z-index:10}.brand{font-size:25px;font-weight:750;letter-spacing:-1px;display:flex;align-items:center;gap:10px}.brand-symbol{font:italic 42px/.7 Georgia,serif;position:relative;color:var(--lilac);padding-right:8px}.brand-symbol>span{font:16px Georgia,serif;position:absolute;top:0;right:-3px}.brand-jp{font-size:8px;letter-spacing:1.5px;color:var(--muted);margin:7px 0 0 3px;font-weight:400}.desktop-nav{display:flex;gap:30px;font-size:12px;color:#d7d0e3}.desktop-nav a{padding:12px 0;position:relative}.desktop-nav a:after{content:"";position:absolute;bottom:4px;left:0;right:100%;height:1px;background:var(--purple);transition:right .2s}.desktop-nav a:hover:after{right:0}.header-cta{display:flex;align-items:center;gap:24px;border:1px solid #a883f36b;padding:12px 17px;font-size:11px;transition:background .2s}.header-cta:hover{background:#a883f320}.header-cta>span{color:var(--purple);font-size:16px}.mobile-menu{display:none}
.hero{height:min(810px,calc(100svh - 88px));min-height:670px;position:relative;display:grid;grid-template-columns:1fr 1fr;isolation:isolate;overflow:hidden;padding:64px max(56px,calc((100vw - 1184px)/2)) 80px;background:radial-gradient(ellipse at 72% 46%,#43266a45,transparent 56%)}.hero-grid{position:absolute;inset:0;z-index:-2;background-image:linear-gradient(#c6a5ff06 1px,transparent 1px),linear-gradient(90deg,#c6a5ff06 1px,transparent 1px);background-size:62px 62px;mask-image:linear-gradient(to right,transparent,#000)}.hero-copy{position:relative;z-index:3;padding-top:33px}.hero h1{font-size:clamp(42px,4.2vw,65px);line-height:1.4;font-weight:750;letter-spacing:1px;margin-top:27px;white-space:nowrap}.hero h1>span{color:var(--lilac)}.hero-english{font:40px/1.02 Georgia,"Times New Roman",serif;letter-spacing:-1.4px;margin-top:19px}.hero-english em{color:var(--purple);font-weight:400}.hero-description{font-size:12px;line-height:2.15;color:#b5adbf;margin-top:23px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;min-height:52px;padding:0 23px;font-size:12px;font-weight:650;transition:transform .2s,background .2s;box-shadow:4px 4px 0 #7050b955}.button:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 #7050b955}.button-primary{background:var(--lilac);color:var(--ink);margin-top:27px}.play-icon{font-size:10px}.button>span:last-child{font-size:18px;margin-left:30px}.hero-footnote{display:flex;align-items:center;gap:12px;font-size:9px;letter-spacing:.5px;color:var(--muted);margin-top:22px}.hero-footnote i{height:3px;width:3px;background:var(--purple);border-radius:50%}.hero-art{position:absolute;width:55%;max-width:820px;right:2%;top:-22px;bottom:35px;z-index:1;display:flex;justify-content:center;align-items:center}.hero-team{height:107%;width:100%;object-fit:contain;position:relative;z-index:2;filter:drop-shadow(0 18px 32px #0006);transform:rotate(2deg)}.art-disc{position:absolute;width:79%;aspect-ratio:1;background:#7050b9;opacity:.45;border-radius:50%;right:9%;top:18%;background:repeating-linear-gradient(-30deg,#a883f325 0 1px,transparent 1px 6px),#53337c;box-shadow:0 0 0 24px #7050b908,0 0 0 25px #a883f31a}.art-word{font:italic 800 clamp(72px,10.5vw,160px)/1 Georgia,serif;position:absolute;right:7%;top:8%;color:transparent;-webkit-text-stroke:1px #a883f352;transform:rotate(-10deg)}.hero-orbit{border:1px solid #a883f31a;position:absolute;border-radius:50%;pointer-events:none;z-index:-1}.orbit-one{height:1000px;width:1600px;right:-800px;top:-320px;transform:rotate(-28deg)}.orbit-two{height:700px;width:1200px;right:-500px;top:-180px;transform:rotate(-28deg)}.art-star{position:absolute;z-index:3;color:var(--lilac)}.star-one{font-size:64px;left:10%;top:24%;transform:rotate(15deg)}.star-two{font-size:30px;right:4%;bottom:25%;color:var(--mint)}.art-sticker{position:absolute;z-index:4;background:var(--paper);color:var(--ink);font-size:11px;font-weight:600;padding:12px 17px;box-shadow:4px 4px 0 #0003;white-space:nowrap}.sticker-one{top:29%;right:1%;transform:rotate(6deg);border-radius:2px}.sticker-one:after{content:"";position:absolute;bottom:-9px;left:20px;border-style:solid;border-width:10px 10px 0 0;border-color:var(--paper) transparent transparent transparent}.sticker-two{left:10%;bottom:10%;transform:rotate(-7deg);background:var(--mint);font:10px ui-monospace,monospace;letter-spacing:.6px}.sticker-two>span{margin-right:8px}.art-japanese{position:absolute;right:0;top:12%;writing-mode:vertical-rl;font-size:10px;letter-spacing:5px;color:#b6a3cf}.hero-bottom{position:absolute;bottom:24px;left:48px;right:48px;display:flex;align-items:center;justify-content:space-between;font:8px ui-monospace,monospace;letter-spacing:1.2px;color:#a79bb8}.hero-bottom>a{display:flex;align-items:center;gap:15px;font:10px -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:1px}.hero-bottom>a>span{font-size:18px;color:var(--purple)}.ticker{border-block:1px solid #b68cfa50;background:#211632;color:var(--lilac);overflow:hidden;transform:rotate(-1deg);position:relative;z-index:4;margin-top:-3px}.ticker>div{min-width:max-content;padding:15px 25px;display:flex;justify-content:space-around;gap:48px;font:11px ui-monospace,monospace;letter-spacing:2px}.ticker span{color:var(--mint);font-size:16px}
.story-section{padding-top:110px;padding-bottom:112px}.section-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:38px}.section-intro h2{font-size:31px;letter-spacing:1px;font-weight:650;margin-top:15px}.section-intro>p{color:var(--muted);font-size:12px;line-height:1.9}.novel-console{border:1px solid #8d72b966;position:relative;background:#181123;box-shadow:8px 8px 0 #ffffff04;border-radius:9px 9px 13px 13px;overflow:hidden}.console-top{display:flex;align-items:center;justify-content:space-between;padding:15px 25px;font:9px ui-monospace,monospace;letter-spacing:1.6px;color:#afa1c2;border-bottom:1px solid #8d72b933}.console-top .status-light{margin-right:8px;width:4px;height:4px}.pixel-spark{color:var(--mint);margin-left:9px}.novel-scene{height:325px;position:relative;overflow:hidden;background:#2b1c43;transition:background .3s}.novel-scene[data-scene=create]{background:#3b2244}.novel-scene[data-scene=learn]{background:#203a3d}.scene-lines{position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,#0000000c 3px 4px);z-index:3;pointer-events:none}.scene-title{position:absolute;left:8%;top:42px;z-index:4}.scene-title>span:first-child{font:9px ui-monospace,monospace;color:var(--mint);letter-spacing:2px}.scene-title strong{font-size:36px;font-weight:600;line-height:1.55;letter-spacing:2px;display:block;margin:16px 0}.scene-jp{font-size:10px;letter-spacing:2px;color:#d6c7e8}.scene-art{position:absolute;right:9%;top:0;width:330px;height:100%;}.scene-orbit{position:absolute;width:250px;height:250px;right:30px;top:27px;border:1px solid #d8c5ff40;border-radius:50%;background:radial-gradient(circle,#a883f335,transparent 70%)}.scene-orbit:after{content:"";position:absolute;inset:-14px;border:1px dashed #d8c5ff30;border-radius:50%}.sprite{display:block;background-image:url("assets/web-shion-notes-v3.png");background-size:contain;background-position:center;background-repeat:no-repeat;aspect-ratio:1}.scene-sprite{position:absolute;height:330px;width:330px;top:0;left:0;background-position:center;z-index:2;filter:drop-shadow(0 15px 15px #0004)}.scene-ground{position:absolute;width:190px;height:17px;border-radius:50%;background:#0004;bottom:18px;left:70px;filter:blur(4px)}.scene-note{position:absolute;color:var(--mint);font:35px Georgia,serif;z-index:4}.note-one{top:43px;left:22px;transform:rotate(-15deg)}.note-two{top:98px;right:5px;transform:rotate(15deg);color:var(--purple)}.scene-caption{position:absolute;bottom:16px;left:8%;font-size:8px;letter-spacing:1px;color:#b1a2c7}.console-hinge{height:17px;border-block:1px solid #0006;background:#0f0c17;display:flex;align-items:center;justify-content:center;gap:22px}.console-hinge>span{width:36px;height:3px;border-radius:3px;background:#3d2d51}.console-hinge>i{width:50%;height:4px;border-radius:4px;background:#21192d}.dialogue-panel{padding:34px 40px 20px;position:relative;background:linear-gradient(120deg,#21182f,#181123)}.speaker-name{position:absolute;top:-4px;left:39px;transform:translateY(-50%);padding:7px 18px;background:var(--lilac);font-size:12px;color:var(--ink);font-weight:700;z-index:5;border:1px solid #9c77d2;box-shadow:3px 3px 0 #0004}.speaker-name>span{font:8px ui-monospace,monospace;margin-left:12px;letter-spacing:1px}.dialogue-copy{min-height:58px}.dialogue-copy p{font-size:14px;line-height:2;letter-spacing:.5px;color:#eee5fb;max-width:940px}.dialogue-options{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin:22px 0}.dialogue-choice{padding:13px 12px;background:#ffffff03;border:1px solid #9c77d24d;display:flex;align-items:center;gap:10px;text-align:left;font-size:12px;transition:background .2s,transform .2s}.dialogue-choice>span{font:10px ui-monospace,monospace;color:var(--purple);border:1px solid #9c77d266;padding:3px 5px}.dialogue-choice>i{font-style:normal;margin-left:auto;color:var(--purple)}.dialogue-choice:hover{background:#a883f316}.dialogue-choice.is-active{border-color:var(--lilac);background:#a883f326}.dialogue-choice.is-active>span{background:var(--lilac);color:var(--ink)}.dialogue-bottom{border-top:1px solid var(--line);padding-top:15px;display:flex;align-items:center;justify-content:space-between;font-size:10px;color:var(--muted)}.dialogue-bottom>a{color:var(--lilac);padding:6px}.dialogue-bottom>a>span{margin-left:14px}
.possibilities{padding-top:10px;padding-bottom:80px}.chapter-heading{position:relative;padding-bottom:50px;border-bottom:1px solid var(--line)}.chapter-heading h2{font-size:43px;font-weight:600;line-height:1.5;letter-spacing:1px;margin-top:20px}.chapter-heading h2>span{color:var(--purple)}.margin-note{position:absolute;right:0;bottom:62px;color:var(--muted);font:9px ui-monospace,monospace;letter-spacing:1px}.feature{display:grid;grid-template-columns:1fr 1fr;gap:90px;padding:72px 0;align-items:center;border-bottom:1px solid var(--line)}.chapter-number{font:10px ui-monospace,monospace;color:var(--lilac);display:flex;align-items:center;gap:12px;letter-spacing:1px}.chapter-number>i{display:inline-block;width:28px;height:1px;background:#a883f380}.feature h3{font-size:34px;line-height:1.6;letter-spacing:1px;font-weight:600;margin-top:21px}.feature-copy>p{font-size:13px;line-height:2.1;color:var(--muted);max-width:420px;margin-top:22px}.feature-tags{display:flex;flex-wrap:wrap;gap:16px;margin-top:25px;font-size:9px;letter-spacing:.7px;color:var(--lilac)}.feature-tags>span:before{content:"+";margin-right:6px;color:var(--purple)}.translation-art{background:var(--lilac);color:var(--ink);padding:25px 29px 21px;position:relative;transform:rotate(2deg);box-shadow:8px 8px 0 #7050b93b}.panel-label{display:flex;align-items:center;justify-content:space-between;font:8px ui-monospace,monospace;letter-spacing:1.2px}.panel-label>span:last-child{font-size:13px}.source-line{font-size:27px;font-weight:500;padding:45px 0 0;letter-spacing:2px}.translation-arrow{display:flex;align-items:center;gap:12px;font-size:20px;margin:13px 10px;color:#66478b}.translation-arrow>span{font:6px ui-monospace,monospace;letter-spacing:1px}.translated-line{font-size:35px;font-weight:650;line-height:1.4;min-height:54px;white-space:nowrap}.example-controls{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:32px;border-top:1px solid #100c1c33;padding-top:15px}.example-languages{display:flex;gap:5px}.example-languages button{background:transparent;color:#4c3766;padding:6px 8px;font-size:9px;border:1px solid transparent}.example-languages .is-active{background:var(--ink);color:var(--lilac)}.example-controls>span{font-size:7px;color:#513c6e}.panel-corner{position:absolute;right:32px;top:63px;font-size:38px;font-weight:300;color:#7050b988}.creation-art{height:335px;position:relative;background:#201829;border:1px solid #a883f345;transform:rotate(-2deg);overflow:hidden}.creation-art:after{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(#ffffff11 1px,transparent 1px);background-size:7px 7px}.creation-art .panel-label{margin:22px;color:var(--muted)}.creation-art .panel-label>span:last-child{font-size:7px;color:#dbbfc9}.creation-shion{position:absolute;width:235px;height:235px;left:-15px;bottom:9px;background-position:center;z-index:1}.creation-kohaku{position:absolute;width:240px;height:240px;right:-28px;bottom:7px;background-image:url("assets/web-kohaku.png");background-position:center;z-index:1}.speech-bubble{background:var(--paper);color:var(--ink);font-size:11px;line-height:1.7;padding:12px 15px;position:absolute;z-index:3;border-radius:3px;box-shadow:3px 3px 0 #0003}.speech-bubble:after{content:"";position:absolute;bottom:-9px;border:10px solid transparent;border-top-color:var(--paper);border-bottom:0}.bubble-question{top:67px;left:23px;transform:rotate(3deg)}.bubble-question:after{left:33px}.bubble-answer{top:113px;right:15px;background:var(--lilac);transform:rotate(-2deg)}.bubble-answer:after{right:32px;border-top-color:var(--lilac)}.waveform{display:flex;position:absolute;align-items:center;justify-content:center;bottom:20px;left:25px;right:25px;height:38px;gap:3px;z-index:0;opacity:.35}.waveform>i{display:block;width:3px;background:var(--purple)}.art-small-note{position:absolute;left:20px;bottom:12px;font:7px ui-monospace,monospace;color:var(--muted);letter-spacing:1px;z-index:3}.learning-art{background:#e4e6d8;color:#333d38;position:relative;transform:rotate(2deg);padding:35px 32px 18px;box-shadow:8px 8px 0 #59847622;background-image:linear-gradient(#64796e17 1px,transparent 1px);background-size:100% 33px}.notebook-tab{position:absolute;top:-11px;left:20px;padding:8px 14px;background:var(--mint);font:7px ui-monospace,monospace;letter-spacing:1px;transform:rotate(-2deg)}.note-index{font-size:10px;letter-spacing:2px;color:#566b5b}.notebook-content>p{font-size:32px;letter-spacing:2px;line-height:1.6;margin-top:14px}.notebook-content>p+p{color:#477866;margin-top:0;font-size:29px}.notebook-annotation{display:block;margin-top:26px;font-size:11px;color:#4e6556}.notebook-star{position:absolute;right:34px;top:78px;font-size:58px;color:#71917c;transform:rotate(-15deg)}.notebook-footer{display:flex;justify-content:space-between;gap:8px;font:7px ui-monospace,monospace;border-top:1px solid #566b5b40;margin-top:29px;padding-top:16px;letter-spacing:1px}
.local-section{background:#1c1529;border-block:1px solid #a883f330;overflow:hidden}.local-inner{display:grid;grid-template-columns:85px 1fr 1fr;gap:36px;align-items:center;padding-block:65px}.local-emblem{font:90px/1 Georgia,serif;color:var(--purple);position:relative}.local-emblem>i{font-size:22px;font-style:normal;position:absolute;top:3px;right:4px;color:var(--mint)}.local-inner h2{font-size:30px;line-height:1.6;font-weight:500;margin-top:17px}.local-inner h2>em{font-style:normal;color:var(--lilac)}.local-copy>p{font-size:12px;line-height:2;color:#c4bacf}.local-copy .small-print{font-size:10px;color:var(--muted);margin-top:13px}.local-copy>a{font-size:10px;display:inline-flex;gap:16px;margin-top:20px;color:var(--mint);border-bottom:1px solid #bdddd255;padding-bottom:6px}.companions{padding-top:108px;padding-bottom:70px}.cast-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.cast-member{position:relative;display:flex;flex-direction:column;align-items:flex-start;background:#1b1425;border:1px solid #ffffff1c;padding:18px 20px 23px;overflow:hidden;text-align:left;min-width:0;transition:background .2s,border-color .2s,transform .2s}.cast-member:hover{transform:translateY(-5px);border-color:var(--purple)}.cast-member.is-active{background:#2d2044;border-color:#a883f3}.cast-number{font:8px ui-monospace,monospace;color:var(--muted);letter-spacing:1px}.cast-sprite{width:100%;background-position:center;transition:transform .25s;filter:drop-shadow(0 8px 6px #0004);margin-block:5px}.cast-member:hover .cast-sprite{transform:rotate(-3deg) scale(1.04)}.cast-mio{background-image:url("assets/web-mio.png")}.cast-kohaku{background-image:url("assets/web-kohaku.png")}.cast-kiyone{background-image:url("assets/web-kiyone.png")}.cast-name{font-size:20px;letter-spacing:2px}.cast-name>small{font:8px ui-monospace,monospace;letter-spacing:1px;color:var(--lilac);margin-left:6px}.cast-role{color:var(--muted);font-size:9px;margin-top:10px;line-height:1.7}.cast-plus{position:absolute;right:15px;top:15px;font-size:15px;color:var(--purple)}.cast-quote{display:flex;align-items:center;gap:18px;padding:28px 0;border-bottom:1px solid var(--line);min-height:112px}.quote-mark{font:64px/.8 Georgia,serif;color:var(--purple);transform:translateY(10px)}.cast-quote>p{font-size:13px;line-height:1.9;color:var(--lilac);flex:1}.cast-quote>span:last-child{font:8px ui-monospace,monospace;color:var(--muted);letter-spacing:1px;white-space:nowrap}.origin-section{display:grid;grid-template-columns:1fr 2.05fr;gap:70px;padding-block:35px 105px}.origin-label{display:flex;gap:18px;align-items:flex-start;padding-top:9px}.tiny-flower{font:44px/1 Georgia,serif;color:var(--purple)}.origin-label p{font:9px/1.8 ui-monospace,monospace;color:var(--lilac);letter-spacing:1px}.origin-label p>span{font-size:10px;color:var(--muted);letter-spacing:2px}.origin-section h2{font-size:25px;line-height:1.7;font-weight:500;letter-spacing:.5px}.origin-section>div>p{font-size:12px;line-height:2.1;color:var(--muted);max-width:640px;margin-top:23px}.origin-section>div>.origin-footnote{font-size:10px;color:#a998bd;margin-top:18px}
.download-section{background:var(--lilac);color:var(--ink);position:relative;overflow:hidden}.download-section:after{content:"ANICANTO";font:italic 180px Georgia,serif;color:#7050b914;position:absolute;right:-25px;bottom:50px;transform:rotate(-8deg);pointer-events:none}.download-inner{position:relative;padding-block:70px 50px;z-index:1}.download-kicker{font:9px ui-monospace,monospace;letter-spacing:2px;color:#5e4582}.download-inner h2{font-size:59px;line-height:1.45;letter-spacing:2px;font-weight:650;margin-top:22px}.download-inner>p{font-size:13px;margin-top:23px;color:#513e6b;line-height:1.9}.platforms{display:grid;grid-template-columns:repeat(4,1fr);margin-top:40px;border-block:1px solid #100c1c33}.platform{display:flex;gap:15px;align-items:center;padding:28px 20px;border-right:1px solid #100c1c33;position:relative;min-width:0}.platform:first-child{padding-left:0}.platform:last-child{border-right:0}.platform strong{display:block;font-size:18px;letter-spacing:.3px}.platform small{font-size:9px;display:block;margin-top:7px;color:#664d85}.platform-icon{font-size:29px}.platform-arrow{margin-left:auto;font-size:23px}.platform.available{transition:background .2s}.platform.available:hover{background:#f4f0e83b}.windows-icon{display:grid;grid-template-columns:1fr 1fr;width:23px;height:23px;gap:3px;flex:none}.windows-icon>i{background:var(--ink)}.device-icon{height:29px;width:22px;border:1.5px solid currentColor;border-radius:3px;position:relative;flex:none}.device-icon:after{content:"";position:absolute;bottom:2px;width:3px;height:2px;background:currentColor;left:calc(50% - 1.5px);border-radius:50%}.device-icon.phone{width:16px}.coming-star{margin-left:auto;font-size:19px;color:#7050b9}.platform.coming strong{font-weight:500}.download-inner .release-note{font-size:9px;line-height:2;color:#604a7b;margin-top:20px}.source-link{display:inline-flex;gap:12px;align-items:center;margin-top:30px;font-size:11px;border-bottom:1px solid #100c1c66;padding:0 0 8px}.source-link svg{width:17px;height:17px}.source-link>span{margin-left:20px}.site-footer{display:flex;align-items:center;gap:35px;padding-block:40px}.footer-brand{display:block;font-size:24px;flex:none}.footer-brand>span{display:block;font-size:8px;color:var(--muted);letter-spacing:2px;margin-top:8px}.site-footer>p{font-size:10px;color:#d1c4e1;line-height:1.9}.site-footer small{font-size:8px;color:var(--muted)}.site-footer>div{display:flex;gap:23px;font-size:9px;color:var(--muted);margin-left:auto}.back-top{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);color:var(--lilac);font-size:18px;flex:none}
.credits{max-width:760px;margin:90px auto;padding:0 24px 80px}.credits h1{font-size:36px;margin:26px 0}.credits h2{font-size:20px;margin-top:35px}.credits p{font-size:14px;line-height:2;color:var(--muted);margin-top:15px}.credits a{text-decoration:underline;text-underline-offset:5px;color:var(--lilac)}
@media(min-width:1600px){.hero-art{right:calc((100vw - 1450px)/2);width:740px}.hero{max-height:810px}.hero-copy{padding-top:50px}}
@media(max-width:1100px){.site-header{margin-inline:32px}.section-shell{width:calc(100% - 80px)}.brand-jp{display:none}.desktop-nav{gap:18px;font-size:11px}.hero{padding:45px 40px 80px;min-height:655px}.hero-copy{padding-top:35px}.hero h1{font-size:43px}.hero-description{max-width:370px;font-size:11px}.hero-english{font-size:36px}.hero-art{width:59%;right:-5%;top:15px;bottom:60px}.hero-team{height:100%}.sticker-one{right:5%;top:28%;font-size:9px;padding:10px}.sticker-two{bottom:8%;left:18%;font-size:8px}.art-japanese{display:none}.hero-bottom{left:32px;right:32px}.scene-art{right:3%}.feature{gap:50px}.feature h3{font-size:30px}.feature-copy>p{font-size:12px}.translated-line{font-size:29px}.source-line{font-size:24px}.example-controls{align-items:flex-start;flex-direction:column}.creation-shion{left:-28px;width:210px;height:210px}.creation-kohaku{right:-40px;width:220px;height:220px}.bubble-answer{right:12px;top:126px}.bubble-question{left:12px}.local-inner{grid-template-columns:60px 1fr 1.15fr;gap:25px}.local-emblem{font-size:65px}.local-inner h2{font-size:26px}.local-inner .eyebrow{font-size:8px}.cast-member{padding:17px 13px}.cast-name{font-size:18px}.cast-name>small{font-size:7px}.platform{gap:12px;padding-inline:16px}.platform strong{font-size:16px}.site-footer{gap:25px}.site-footer>div{gap:15px}}
@media(max-width:780px){.site-header{height:72px;margin-inline:24px;gap:16px}.brand{font-size:22px}.desktop-nav{display:none}.header-cta{margin-left:auto;padding:10px 12px;gap:12px;font-size:10px}.mobile-menu{display:block}.mobile-menu>summary{list-style:none;width:25px;height:33px;display:flex;flex-direction:column;justify-content:center;gap:6px;cursor:pointer}.mobile-menu>summary::-webkit-details-marker{display:none}.mobile-menu>summary>span{display:block;width:22px;height:1px;background:var(--lilac)}.mobile-menu nav{position:absolute;top:72px;left:-24px;right:-24px;background:#1c1429;border-bottom:1px solid #a883f340;padding:25px;display:flex;flex-direction:column;gap:23px;font-size:13px;box-shadow:0 15px 20px #0005}.section-shell{width:calc(100% - 48px)}.hero{height:auto;min-height:1010px;display:block;padding:42px 24px 66px}.hero-copy{padding-top:0}.hero .eyebrow{font-size:8px;letter-spacing:1.3px}.hero h1{font-size:45px;margin-top:20px;line-height:1.4}.hero-english{font-size:34px;margin-top:19px}.hero-description{font-size:11px;margin-top:20px;max-width:420px}.hero .button{margin-top:23px}.hero-footnote{font-size:8px;margin-top:20px}.hero-art{width:82%;max-width:530px;height:550px;top:auto;bottom:40px;right:-1%}.hero-team{height:107%}.art-disc{top:19%;right:13%;width:73%}.art-word{top:10%;right:14%;font-size:96px}.star-one{font-size:45px;left:9%;top:29%}.star-two{right:7%;bottom:20%}.sticker-one{top:30%;right:4%;font-size:9px}.sticker-two{left:0;bottom:5%;font-size:8px}.hero-bottom{left:24px;right:24px;bottom:18px;font-size:7px;letter-spacing:.6px}.hero-bottom>span:last-child{display:none}.hero-bottom>a{font-size:9px}.ticker>div{padding-block:13px;font-size:9px;gap:26px}.story-section{padding-top:72px;padding-bottom:75px}.section-intro{align-items:flex-start;flex-direction:column;gap:19px;margin-bottom:29px}.section-intro h2{font-size:27px;line-height:1.6;margin-top:11px}.section-intro>p{font-size:11px}.eyebrow{font-size:8px;letter-spacing:1.2px}.console-top{font-size:6px;letter-spacing:1px;padding:13px 15px}.novel-scene{height:300px}.scene-title{left:7%;top:31px}.scene-title>span:first-child{font-size:7px}.scene-title strong{font-size:27px;margin-top:15px;letter-spacing:1px;line-height:1.65}.scene-jp{font-size:8px;letter-spacing:1px;max-width:160px;display:block}.scene-art{height:260px;width:260px;top:36px;right:-39px;opacity:.95}.scene-sprite{height:260px;width:260px;top:15px}.scene-orbit{width:190px;height:190px;top:42px;right:30px}.scene-ground{bottom:0;left:58px;width:150px}.scene-note{font-size:25px}.note-one{top:25px;left:32px}.note-two{top:90px;right:25px}.scene-caption{font-size:7px;left:7%;bottom:14px;z-index:4}.dialogue-panel{padding:31px 19px 17px}.speaker-name{left:19px;font-size:11px;padding:7px 13px}.dialogue-copy{min-height:100px}.dialogue-copy p{font-size:12px;line-height:2;letter-spacing:.3px}.dialogue-options{grid-template-columns:1fr;gap:9px;margin:16px 0}.dialogue-choice{font-size:11px;padding:11px 12px}.dialogue-bottom{font-size:8px;gap:8px;padding-top:12px}.dialogue-bottom>a{font-size:9px}.chapter-heading{padding-bottom:31px}.chapter-heading h2{font-size:34px;margin-top:18px}.margin-note{display:none}.feature{grid-template-columns:1fr;gap:35px;padding-block:45px}.feature h3{font-size:31px;margin-top:16px;line-height:1.5}.feature-copy>p{max-width:100%;font-size:12px;margin-top:17px}.feature-tags{font-size:9px;margin-top:20px;gap:15px}.translation-art{margin:0 6px 4px;padding:24px}.source-line{font-size:24px;padding-top:35px}.translated-line{font-size:31px;min-height:48px}.example-controls{flex-direction:row;align-items:center;margin-top:25px;gap:8px}.example-controls>span{font-size:6px}.example-languages button{font-size:8px;padding-inline:6px}.creation-art{order:2;height:330px;margin:0 6px}.creation-shion{width:235px;height:235px;left:-22px}.creation-kohaku{width:235px;height:235px;right:-30px}.bubble-question{font-size:10px;top:65px;left:18px}.bubble-answer{font-size:10px;top:115px;right:15px}.learning-art{margin:5px 6px}.notebook-content>p{font-size:30px}.notebook-content>p+p{font-size:28px}.possibilities{padding-bottom:60px}.local-inner{grid-template-columns:55px 1fr;gap:23px;padding-block:45px}.local-emblem{font-size:61px}.local-inner h2{font-size:28px;margin-top:13px}.local-copy{grid-column:1 / -1}.local-copy>p{font-size:12px}.local-copy .small-print{font-size:10px}.companions{padding-top:70px;padding-bottom:45px}.cast-grid{grid-template-columns:1fr 1fr;gap:12px}.cast-member{padding:15px 15px 20px}.cast-number{font-size:7px}.cast-sprite{max-height:220px}.cast-name{font-size:19px}.cast-name>small{font-size:7px;margin-left:3px}.cast-role{font-size:8px;margin-top:8px}.cast-quote{flex-wrap:wrap;gap:12px;padding:25px 0}.quote-mark{font-size:44px}.cast-quote>p{font-size:11px;flex:1;min-width:80%}.cast-quote>span:last-child{margin-left:30px}.origin-section{grid-template-columns:1fr;gap:26px;padding-block:12px 70px}.origin-label{gap:14px}.tiny-flower{font-size:35px}.origin-section h2{font-size:23px}.origin-section>div>p{font-size:11px;margin-top:18px}.origin-section>div>.origin-footnote{font-size:9px}.download-inner{padding-block:50px 38px}.download-inner h2{font-size:48px;margin-top:20px}.download-inner>p{font-size:11px;max-width:270px}.platforms{grid-template-columns:1fr 1fr;margin-top:31px}.platform{padding:23px 13px!important;gap:12px;border-bottom:1px solid #100c1c33}.platform:nth-child(2){border-right:0}.platform:nth-child(n+3){border-bottom:0}.platform:first-child,.platform:nth-child(3){padding-left:0!important}.platform strong{font-size:17px}.platform small{font-size:8px}.platform-arrow{font-size:20px}.download-inner .release-note{font-size:8px;max-width:100%}.source-link{font-size:10px;margin-top:25px}.download-section:after{font-size:100px;bottom:140px}.site-footer{flex-wrap:wrap;gap:20px;padding-block:30px}.footer-brand{font-size:22px}.site-footer>p{font-size:9px;margin-left:auto}.site-footer small{font-size:7px}.site-footer>div{margin-left:0;gap:20px;font-size:9px}.back-top{margin-left:auto;width:30px;height:30px}}
@media(max-width:380px){.site-header{margin-inline:18px}.brand{font-size:19px}.brand-symbol{font-size:35px}.header-cta{font-size:9px;gap:7px;padding:9px}.section-shell{width:calc(100% - 36px)}.hero{padding-inline:18px;min-height:970px}.hero h1{font-size:39px}.hero-english{font-size:31px}.hero-description{font-size:10px}.hero-art{width:95%;height:500px;right:-6%}.hero-footnote{font-size:7px;gap:8px}.hero .button{font-size:11px;min-height:47px}.scene-title strong{font-size:24px}.scene-art{right:-65px}.scene-jp{max-width:135px;font-size:7px}.scene-title>span:first-child{font-size:6px}.scene-caption{font-size:6px}.section-intro h2{font-size:24px}.console-top{font-size:5px}.example-controls{flex-direction:column;align-items:flex-start}.translated-line{font-size:27px}.creation-shion{left:-34px}.creation-kohaku{right:-47px}.bubble-answer{right:9px}.platform{gap:9px}.platform strong{font-size:15px}.cast-name{font-size:16px}.cast-name>small{font-size:6px}.cast-role{font-size:7px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

/* Language controls and single-page notices. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.language-control{display:flex;align-items:center;flex:none}.language-control select{font:10px -apple-system,BlinkMacSystemFont,sans-serif;color:var(--lilac);background:#1b1427;border:1px solid #a883f340;border-radius:0;padding:10px 23px 10px 10px;max-width:112px;min-height:37px;cursor:pointer}.site-header{gap:22px}.desktop-nav{gap:23px;margin-left:auto}.scene-title strong{white-space:pre-line}.scene-sprite{background-position:center}.cast-sprite{background-position:center}.credits-trigger{padding:0;background:none;color:inherit;font:inherit;text-align:left}.credits-trigger:hover{text-decoration:underline;text-underline-offset:4px}.credits-dialog{width:min(630px,calc(100vw - 36px));max-height:82svh;border:1px solid #a883f366;color:var(--paper);background:#1b1427;padding:0;box-shadow:0 24px 90px #0008}.credits-dialog::backdrop{background:#08060ed9;backdrop-filter:blur(7px)}.credits-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding:20px 25px;position:sticky;top:0;background:#1b1427;z-index:1}.credits-dialog-header h2{font-size:20px}.credits-dialog-header button{background:transparent;color:var(--lilac);font-size:27px;min-width:36px;min-height:36px}.credits-dialog-body{padding:0 25px 30px}.credits-dialog-body h3{font-size:14px;font-weight:500;margin-top:27px;color:var(--lilac)}.credits-dialog-body p{font-size:12px;line-height:2;margin-top:12px;color:#bcb0cc}.credits-dialog-body a{display:inline-block;font:11px ui-monospace,monospace;border-bottom:1px solid #a883f350;padding-bottom:5px;margin-top:15px;color:var(--mint)}

/* Scroll position controls the prologue. Content stays visible without JavaScript. */
.cinema-track{height:250svh;position:relative;margin-top:70px}.cinema-stage{--progress:0;position:sticky;top:0;height:100svh;min-height:560px;isolation:isolate;overflow:hidden;display:flex;align-items:center;background:#100c1c}.cinema-grid{position:absolute;inset:0;z-index:-3;background:radial-gradient(ellipse at 70% 50%,#7050b955,transparent 65%),repeating-linear-gradient(-45deg,transparent 0 30px,#a883f306 30px 31px)}.cinema-type{position:absolute;right:11%;top:10%;font-size:min(67vw,770px);line-height:1;font-weight:800;color:transparent;-webkit-text-stroke:1px #a883f32b;transform:rotate(-10deg) scale(calc(1 + var(--progress)*.4));z-index:-2}.cinema-images{position:absolute;inset:0;z-index:-1}.cinema-character{position:absolute;right:4%;height:98%;width:48%;object-fit:contain;bottom:-10%;transform-origin:50% 52%;transform:translate3d(calc(var(--progress)*-10%),0,0) scale(calc(.8 + var(--progress)*1.9));opacity:clamp(0,calc(1.8 - var(--progress)*2),1);will-change:transform,opacity;filter:drop-shadow(0 0 60px #0005)}.cinema-team{position:absolute;right:3%;bottom:-8%;height:110%;width:60%;object-fit:contain;transform:scale(calc(1.25 - var(--progress)*.25));opacity:clamp(0,calc((var(--progress) - .57)*3.5),1);will-change:transform,opacity;filter:drop-shadow(0 0 35px #100c1c99)}.cinema-caption{margin-inline:max(56px,calc((100vw - 1184px)/2));width:75%;z-index:2;text-shadow:0 3px 35px #100c1c}.cinema-caption .eyebrow{color:var(--mint);font-size:9px;letter-spacing:2px}.cinema-words{display:grid;margin-top:38px;min-height:200px;align-items:center;position:relative}.cinema-copy{grid-area:1/1;font-size:clamp(43px,5.3vw,80px);line-height:1.5;letter-spacing:2px;font-weight:650;opacity:0;transform:translateY(30px);transition:opacity .55s,transform .7s;text-wrap:balance;max-width:1000px}.cinema-stage[data-step="0"] .cinema-copy-0,.cinema-stage[data-step="1"] .cinema-copy-1,.cinema-stage[data-step="2"] .cinema-copy-2{opacity:1;transform:translateY(0)}.cinema-copy-1{color:var(--lilac)}.cinema-copy-2{color:var(--mint)}.cinema-subcopy{font-size:14px;letter-spacing:3px;color:#c5b8d6;margin-top:22px}.cinema-bottom{position:absolute;bottom:35px;left:max(56px,calc((100vw - 1184px)/2));right:max(56px,calc((100vw - 1184px)/2));display:flex;align-items:center;gap:25px;color:var(--muted);font:9px ui-monospace,monospace;letter-spacing:1px}.cinema-progress{height:1px;background:#a883f338;flex:1;overflow:hidden}.cinema-progress>i{height:100%;display:block;width:100%;background:var(--purple);transform-origin:left;transform:scaleX(var(--progress));will-change:transform}.cinema-counter{color:var(--lilac)}.motion-ready .feature,.motion-ready .origin-section{opacity:.2;transform:translateY(36px);transition:opacity .8s,transform .8s}.motion-ready .feature.is-revealed,.motion-ready .origin-section.is-revealed{opacity:1;transform:translateY(0)}
html[lang=en] .hero h1{font-size:clamp(43px,4.3vw,68px);letter-spacing:-1.5px;line-height:1.25}html[lang=en] .hero-description{max-width:470px;line-height:1.9}html[lang=en] .hero-english{font-size:32px;line-height:1.08;margin-top:22px}html[lang=en] .hero h1+ .hero-english{opacity:.8}html[lang=en] .scene-title strong{font-size:34px;line-height:1.45;letter-spacing:-.3px}html[lang=en] .dialogue-choice{font-size:10px}html[lang=en] .translated-line{font-size:30px}html[lang=en] .cast-name{font-size:18px;letter-spacing:0}html[lang=en] .cast-name small{display:none}html[lang=en] .cast-role{font-size:9px;min-height:30px}html[lang=en] .feature h3{font-size:35px;letter-spacing:-.5px}html[lang=ja] .hero h1{font-size:clamp(36px,3.5vw,56px);letter-spacing:0}html[lang=ja] .hero-description{max-width:470px}html[lang=ja] .dialogue-choice{font-size:11px}html[lang=ja] .feature h3{font-size:31px}html[lang=ja] .section-intro h2{font-size:29px}html[lang=ja] .platform small{font-size:8px}.scene-sprite{transition:transform .5s}#novel-scene[data-scene=create] .scene-sprite{transform:rotate(-4deg)}#novel-scene[data-scene=learn] .scene-sprite{transform:rotate(3deg) scale(.97)}
@media(min-width:781px) and (max-width:1080px){.desktop-nav{display:none}.language-control{margin-left:auto}.header-cta{font-size:10px}}
@media(max-width:780px){.site-header{gap:15px}.header-cta{display:none}.language-control{margin-left:auto}.language-control select{max-width:110px;font-size:10px;min-height:36px;padding-block:9px}.brand{gap:8px}.cinema-track{height:220svh;margin-top:30px}.cinema-stage{min-height:540px}.cinema-caption{margin-inline:24px;width:calc(100% - 48px);align-self:flex-start;margin-top:19svh}.cinema-caption .eyebrow{font-size:6px;letter-spacing:1px}.cinema-words{min-height:210px;margin-top:20px}.cinema-copy{font-size:42px;line-height:1.65;letter-spacing:1px;max-width:340px;text-shadow:0 3px 24px #100c1c}.cinema-subcopy{font-size:11px;letter-spacing:1px;margin-top:12px}.cinema-character{height:76%;width:93%;right:-18%;bottom:-8%;transform:translate3d(calc(var(--progress)*-3%),0,0) scale(calc(.85 + var(--progress)*1.5));opacity:clamp(0,calc(1.6 - var(--progress)*2),1)}.cinema-team{width:108%;height:80%;right:-20%;bottom:-5%;opacity:clamp(0,calc((var(--progress) - .52)*3),.8)}.cinema-type{font-size:110vw;top:30%;right:-2%}.cinema-bottom{left:24px;right:24px;gap:12px;font-size:7px;letter-spacing:.5px;bottom:25px}.motion-ready .feature,.motion-ready .origin-section{transform:translateY(22px)}html[lang=en] .hero h1{font-size:46px;line-height:1.2;letter-spacing:-1.4px}html[lang=en] .hero-english{font-size:30px}html[lang=en] .hero-description{max-width:340px;font-size:11px;line-height:1.85}html[lang=en] .hero-art{bottom:30px;height:510px}html[lang=en] .hero-footnote{flex-wrap:wrap;row-gap:7px;max-width:300px}html[lang=en] .section-intro h2{font-size:27px;letter-spacing:0}html[lang=en] .scene-title strong{font-size:24px;line-height:1.5;max-width:200px}html[lang=en] .scene-title{z-index:5}html[lang=en] .scene-art{right:-64px;opacity:.7}html[lang=en] .scene-title>span:first-child{font-size:6px}html[lang=en] .dialogue-choice{font-size:11px}html[lang=en] .dialogue-copy{min-height:145px}html[lang=en] .cast-role{font-size:8px}html[lang=en] .feature h3{font-size:32px}html[lang=en] .source-link{font-size:9px;gap:9px}html[lang=en] .source-link>span{margin-left:5px}html[lang=en] .cinema-copy{font-size:42px;line-height:1.3;max-width:310px}html[lang=ja] .hero h1{font-size:35px;line-height:1.5;letter-spacing:-1px}html[lang=ja] .hero-description{font-size:11px;line-height:2}html[lang=ja] .scene-title strong{font-size:24px;line-height:1.6}html[lang=ja] .scene-art{right:-70px;opacity:.7}html[lang=ja] .section-intro h2{font-size:23px}html[lang=ja] .feature h3{font-size:28px}html[lang=ja] .cinema-copy{font-size:36px}html[lang=ja] .cinema-subcopy{font-size:10px}.credits-dialog-header{padding:16px 20px}.credits-dialog-header h2{font-size:17px}.credits-dialog-body{padding-inline:20px}}
@media(max-width:380px){.site-header{gap:12px}.language-control select{max-width:103px}.hero{min-height:1010px}html[lang=en] .hero h1{font-size:42px}html[lang=en] .hero-description{font-size:10px}html[lang=en] .hero-english{font-size:27px}html[lang=ja] .hero h1{font-size:29px}.cinema-copy{font-size:37px}html[lang=en] .cinema-copy{font-size:37px}html[lang=ja] .cinema-copy{font-size:32px}html[lang=en] .scene-title strong{font-size:21px}html[lang=en] .cast-name{font-size:17px}html[lang=en] .cast-role{font-size:7px}}
@media(prefers-reduced-motion:reduce){.cinema-track{height:auto}.cinema-stage{position:relative;min-height:650px;height:auto;padding-block:80px}.cinema-words{display:flex;flex-direction:column;gap:25px;align-items:flex-start;min-height:0}.cinema-copy{font-size:clamp(26px,4vw,55px);opacity:1;transform:none!important}.cinema-caption{margin-top:0}.cinema-team{display:none}.cinema-character{transform:none!important;opacity:.35;will-change:auto}.cinema-counter,.cinema-progress{display:none}.motion-ready .feature,.motion-ready .origin-section{opacity:1;transform:none}.cinema-bottom{bottom:22px}.cinema-caption .eyebrow{font-size:7px}}

.hero-team{height:94%}.hero-art{top:12px;bottom:45px}
@media(max-width:1100px){.hero-art{top:15px;bottom:60px}}
@media(max-width:780px){.hero-art{top:auto;bottom:40px}.hero-team{height:96%}}

/* The film keeps readable captions below the image on small screens. */
.film-section{padding-block:88px 25px}.film-player{border:1px solid #a883f350;background:#090710;box-shadow:7px 7px 0 #a883f309}.film-player video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#0e0a19}.film-player video::cue{font-size:21px;background:#100c1cdd;color:#f4f0e8}.film-captions{padding:18px 28px;min-height:108px;border-top:1px solid #a883f32a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center}.film-captions p{font-size:14px;line-height:1.6}.film-captions #film-original{color:var(--paper)}.film-captions #film-translation{color:var(--lilac);font-size:12px}.film-captions #film-caption-idle{font-size:12px;color:var(--muted)}.film-captions [hidden]{display:none}.film-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:24px}.film-jumps{display:flex;gap:8px}.film-jumps button{display:flex;align-items:center;gap:10px;background:#1b1427;border:1px solid #a883f330;padding:11px 13px;font:8px ui-monospace,monospace;color:var(--muted)}.film-jumps button span{font:11px -apple-system,BlinkMacSystemFont,sans-serif;color:var(--lilac)}.film-jumps button.is-active,.film-jumps button:hover{border-color:var(--purple);background:#a883f319}.film-toolbar>p{font-size:9px;line-height:1.9;text-align:right;color:var(--muted);max-width:390px}.film-section+.story-section{padding-top:90px}
@media(max-width:1100px){.film-toolbar{align-items:flex-start;flex-direction:column;gap:15px}.film-toolbar>p{text-align:left;max-width:none}}
@media(max-width:780px){.film-section{padding-block:65px 10px}.film-captions{padding:16px 15px;min-height:132px;gap:8px}.film-captions p{font-size:12px;line-height:1.8}.film-captions #film-translation{font-size:11px}.film-player{box-shadow:4px 4px 0 #a883f309}.film-jumps{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:8px}.film-jumps button{padding:12px;gap:10px;min-height:42px}.film-jumps button span{font-size:12px}.film-toolbar{margin-top:18px;width:100%}.film-toolbar>p{font-size:9px}.film-section+.story-section{padding-top:65px}.film-player video::cue{font-size:14px}}
#film-toggle{background:var(--lilac);color:var(--ink);font-size:11px;padding:12px 17px;min-width:108px;min-height:42px;flex:none}.film-toolbar{justify-content:flex-start}.film-toolbar>p{margin-left:auto}.film-jumps button{min-height:42px}@media(max-width:1100px){.film-toolbar{flex-direction:row;flex-wrap:wrap}.film-toolbar>p{margin-left:0;flex-basis:100%;max-width:none}}@media(max-width:780px){.film-jumps{width:100%;grid-template-columns:1fr 1fr}.film-toolbar>p{margin-left:0}.film-toolbar{gap:13px}#film-toggle{width:100%}}

/* Nine companions use the same card layout and selected-quote control. */
.cast-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.cast-himari{background-image:url("assets/web-himari.png")}
.cast-saya{background-image:url("assets/web-saya.png")}
.cast-wakaba{background-image:url("assets/web-wakaba.png")}
.cast-hikari{background-image:url("assets/web-hikari.png")}
.cast-tsukino{background-image:url("assets/web-tsukino.png")}
@media(max-width:600px){.cast-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cast-member:last-child{grid-column:1/-1;width:calc(50% - 6px);justify-self:center}}

/* Put the language choice before the cover, in every visitor's own script. */
.language-banner{display:flex;flex-direction:column;align-items:center;gap:14px;padding:22px 24px 26px;background:#1c1429;border-bottom:1px solid #a883f344}
.language-banner>p{font-size:14px;letter-spacing:1.4px;color:var(--lilac)}
.language-choices{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.language-choices :is(button,a){font-size:16px;line-height:1.4;min-height:46px;min-width:132px;padding:12px 24px;border:1px solid #a883f366;border-radius:30px;background:#100c1c;color:#eee5fb;transition:background .2s,color .2s,border-color .2s}
.language-choices :is(button,a):is([aria-pressed=true],[aria-current=page]){background:var(--lilac);color:var(--ink);border-color:var(--lilac);font-weight:650}
.language-choices :is(button,a):hover{border-color:var(--mint)}

/* The studio objects and cast sit directly on the page through real alpha. */
.studio-hero{height:auto;min-height:780px;display:flex;align-items:center;padding-block:70px 110px;overflow:hidden;background:radial-gradient(ellipse at 76% 54%,#39215044,transparent 60%)}
.studio-hero .hero-copy{padding-top:0;width:44%;max-width:540px;position:relative;z-index:3}
.studio-hero h1{font-size:clamp(37px,3.7vw,58px);line-height:1.45;white-space:normal;letter-spacing:0;margin-top:28px}
.studio-cover{position:absolute;right:-2%;bottom:30px;width:67%;height:93%;z-index:1;pointer-events:none}
.studio-cover img{width:100%;height:100%;object-fit:contain;object-position:right bottom;filter:drop-shadow(0 18px 28px #0005)}
.studio-hero .hero-description{font-size:18px;line-height:1.9;color:#d4cadf;max-width:460px;margin-top:28px}
.studio-hero .hero-footnote{font-size:13px;line-height:1.8;flex-wrap:wrap;gap:10px;max-width:460px}
html[lang=en] .studio-hero h1{font-size:clamp(40px,4vw,60px);line-height:1.15;white-space:normal;letter-spacing:-1px}
html[lang=ja] .studio-hero h1{font-size:clamp(33px,3.3vw,49px);line-height:1.5;white-space:normal;letter-spacing:0}

/* Nine companions share one scroll stage, with no card grid. */
.cast-scroll{background:#100c1c;margin-block:70px 30px}
#companions{scroll-margin-top:0}
html[lang=en] .cast-scene-name small{display:none}
.cast-stage{--cast-accent:#7050b9;position:relative;background:radial-gradient(ellipse at 74% 52%,color-mix(in srgb,var(--cast-accent) 24%,transparent),transparent 63%)}
.cast-frame{position:relative}
.cast-heading{padding-top:42px;position:relative;z-index:3}
.cast-heading h2{font-size:27px;line-height:1.5;margin-top:14px;font-weight:500}
.cast-scene{position:relative;min-height:690px;display:flex;align-items:center}
.cast-scene-copy{width:44%;max-width:500px;position:relative;z-index:2}
.cast-scene-tag{font:13px/1.6 ui-monospace,monospace;letter-spacing:2px;color:var(--mint)}
.cast-scene-name{font-size:clamp(54px,7vw,100px);font-weight:650;line-height:1.2;letter-spacing:2px;margin-top:22px}
.cast-scene-name small{display:block;font:15px/1.6 ui-monospace,monospace;letter-spacing:5px;color:var(--lilac);margin-top:16px}
.cast-scene-role{font-size:21px;line-height:1.7;color:var(--lilac);margin-top:28px}
.cast-scene-quote{font-size:18px;line-height:1.9;color:#c8bdd6;max-width:450px;margin-top:22px}
.cast-portrait{position:absolute;right:-1%;bottom:0;width:58%;height:91%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 20px 25px #0004)}
.cast-controls{display:none}
.cast-ready{height:620svh}
.cast-ready .cast-stage{position:sticky;top:0;height:100svh;min-height:560px;overflow:hidden}
.cast-ready .cast-frame{height:100%}
.cast-ready .cast-heading{position:absolute;top:0;left:0;right:0}
.cast-ready .cast-scenes{position:absolute;inset:0}
.cast-ready .cast-scene{position:absolute;inset:0;min-height:0;opacity:var(--cast-opacity,0);transform:translateY(var(--cast-y,0px)) scale(var(--cast-scale,1));pointer-events:none;will-change:transform,opacity}
.cast-ready .cast-controls{display:flex;align-items:center;justify-content:space-between;gap:24px;position:absolute;bottom:32px;left:0;right:0;z-index:4}
.cast-controls>p{font-size:14px;line-height:1.6;color:var(--muted)}
.cast-pager{display:flex;align-items:center;gap:18px;font:14px/1.5 ui-monospace,monospace;color:var(--lilac)}
.cast-pager button{width:46px;height:46px;border-radius:50%;border:1px solid #a883f355;background:#21162f;color:var(--paper);font-size:22px}
.cast-pager button:disabled{opacity:.3;cursor:default}

/* Desktop reading sizes use comfortable body text instead of tiny labels. */
@media(min-width:781px){
 .desktop-nav{font-size:15px;gap:24px}.header-cta,.button{font-size:15px}.brand-jp{font-size:11px}
 .eyebrow{font-size:12px}.section-intro>p,.feature-copy>p,.local-copy>p,.origin-section>div>p{font-size:17px;line-height:1.9}
 .feature-copy>p{max-width:500px}.feature-tags{font-size:14px;line-height:1.8}
 .dialogue-copy p{font-size:18px;line-height:1.9}.dialogue-choice,html[lang=en] .dialogue-choice,html[lang=ja] .dialogue-choice{font-size:15px;line-height:1.6}
 .dialogue-choice>span{font-size:12px}.speaker-name{font-size:17px}.dialogue-bottom,.dialogue-bottom>a{font-size:13px}
 .console-top,.scene-title>span:first-child{font-size:11px}.scene-jp{font-size:14px}.scene-caption{font-size:12px}
 .local-copy .small-print,.origin-section>div>.origin-footnote{font-size:14px;line-height:1.9}.local-copy>a{font-size:14px}
 .origin-label p,.origin-label p>span{font-size:13px}.download-inner>p{font-size:18px}.download-inner .release-note{font-size:14px}
 .platform small,html[lang=ja] .platform small{font-size:13px;line-height:1.7}.source-link{font-size:15px}
 .site-footer>p,.site-footer>div{font-size:14px}.site-footer small{font-size:12px}.site-footer{flex-wrap:wrap;row-gap:24px}
 .film-captions p{font-size:19px;line-height:1.7}.film-captions #film-translation{font-size:17px}.film-captions #film-caption-idle{font-size:16px}
 .film-captions{min-height:128px;gap:10px}.film-jumps button{font-size:12px}.film-jumps button span{font-size:15px}.film-toolbar>p{font-size:13px;line-height:1.8}
 #film-toggle{font-size:15px;min-height:46px}.cinema-subcopy{font-size:19px}.cinema-bottom,.cinema-caption .eyebrow{font-size:12px}
 .credits-dialog-body p{font-size:16px;line-height:1.85}.credits-dialog-body h3{font-size:18px}.credits-dialog-body a{font-size:14px}
}
@media(min-width:781px) and (max-width:1200px){.desktop-nav{display:none}.site-header{gap:20px}.header-cta{margin-left:auto}.studio-hero .hero-copy{width:50%;max-width:490px}.studio-cover{right:-14%;width:79%;opacity:.82}.studio-hero h1{font-size:42px}.studio-hero .hero-description{font-size:17px}.film-toolbar{flex-wrap:wrap}.film-toolbar>p{flex-basis:100%;margin-left:0}}
@media(max-width:780px){
 .site-header{justify-content:space-between}.mobile-menu{margin-left:auto}.language-banner{padding:18px 24px 22px;gap:12px}.language-banner>p{font-size:13px}
 .language-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:min(440px,100%);gap:9px}.language-choices :is(button,a){min-width:0;min-height:44px;font-size:15px;padding:11px 16px}
 .studio-hero{display:flex;flex-direction:column;min-height:0;height:auto;padding:42px 24px 55px;align-items:stretch;overflow:hidden}
 .studio-hero .hero-copy{width:100%;max-width:580px;padding-top:0}.studio-hero h1{font-size:clamp(31px,7vw,48px);line-height:1.5;margin-top:20px}
 .studio-hero .hero-description,html[lang=en] .studio-hero .hero-description,html[lang=ja] .studio-hero .hero-description{font-size:16px;line-height:1.9;max-width:540px;margin-top:23px}
 html[lang=en] .studio-hero h1{font-size:clamp(36px,8vw,49px);line-height:1.2}html[lang=ja] .studio-hero h1{font-size:clamp(28px,6.8vw,42px);line-height:1.5}
 .studio-cover{position:relative;order:0;width:calc(100% + 36px);height:auto;right:auto;bottom:auto;margin:0 -18px 26px;aspect-ratio:1.7}
 .studio-hero .hero-copy{order:1}
 .studio-cover img{object-fit:contain;object-position:center bottom}.studio-hero .hero-bottom{bottom:14px}.studio-hero .hero-footnote{font-size:12px;max-width:100%}
 .cast-scroll{margin-block:45px 10px}.cast-ready{height:650svh}.cast-heading{padding-top:28px}.cast-heading h2{font-size:23px;margin-top:10px}
 .cast-scene{min-height:780px;align-items:flex-start;padding-top:120px}.cast-scene-copy{width:100%;max-width:100%}.cast-scene-tag{font-size:11px}
 .cast-scene-name{font-size:49px;margin-top:12px}.cast-scene-name small{font-size:11px;letter-spacing:4px;margin-top:8px}
 .cast-scene-role{font-size:17px;margin-top:16px;max-width:65%}.cast-scene-quote{font-size:14px;line-height:1.8;max-width:50%;margin-top:16px}
 .cast-portrait{right:-20%;height:66%;width:91%;bottom:5%;opacity:.96}.cast-ready .cast-scene{padding-top:140px}
 .cast-ready .cast-controls{bottom:24px;gap:12px}.cast-controls>p{font-size:12px;max-width:120px}.cast-pager{gap:10px;font-size:12px}.cast-pager button{width:40px;height:40px}
}
@media(max-width:380px){.studio-hero{padding-inline:18px}.studio-hero h1{font-size:30px}.studio-hero .hero-description{font-size:15px}.cast-scene-name{font-size:43px}.cast-scene-role{font-size:16px}.cast-scene-quote{font-size:13px}.cast-portrait{right:-25%;width:95%;height:62%}.cast-heading h2{font-size:21px}}
@media(max-height:700px) and (min-width:781px){.cast-heading{padding-top:24px}.cast-heading h2{font-size:23px}.cast-scene-name{font-size:62px;margin-top:14px}.cast-scene-role{font-size:19px;margin-top:18px}.cast-scene-quote{font-size:16px;margin-top:14px}.cast-ready .cast-controls{bottom:20px}.cast-portrait{height:85%}}
@media(prefers-reduced-motion:reduce){.cast-scroll{height:auto}.cast-stage{position:relative}.cast-scene{transform:none!important;opacity:1!important;will-change:auto}.cast-controls{display:none!important}}

/* Dedicated dialogue poses and relative character stature. */
.creation-art{height:410px}
.creation-shion{background-image:url("assets/dialogue-shion.png");left:3%;bottom:26px;width:50%;height:255px}
.creation-kohaku{background-image:url("assets/dialogue-kohaku.png");right:3%;bottom:26px;width:43%;height:255px}
.creation-art .speech-bubble{max-width:43%;font-size:12px;line-height:1.7;top:57px}
.creation-art .bubble-question{left:20px}.creation-art .bubble-answer{right:20px}
.cast-scene[data-cast-entry=hikari] .cast-portrait{height:68%}
.companion-play{display:inline-flex;align-items:center;gap:9px;min-height:44px;margin-top:20px;padding:10px 17px;border:1px solid #c5a4ff80;border-radius:24px;background:#2a1b3e;color:var(--paper);font-family:inherit;font-size:14px;line-height:1.5;cursor:pointer}
.companion-play:hover{background:#3b2855}.companion-play:focus-visible{outline:2px solid var(--mint);outline-offset:4px}
.companion-play[aria-pressed=true]{background:var(--lilac);color:var(--ink)}
.companion-play{width:310px;max-width:100%;min-height:52px;justify-content:center}
.cast-scroll{overflow-anchor:none}
.cast-ready .cast-scene[aria-hidden=false]{pointer-events:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Phone content, artwork, and navigation use separate rows. */
@media(max-width:780px){
 .creation-art .speech-bubble{font-size:11px}.creation-shion{left:0}.creation-kohaku{right:0}
 .cast-scene{display:grid;grid-template-rows:auto 240px;gap:18px;min-height:0;padding:118px 0 24px;align-items:stretch}
 .cast-scene-copy{width:100%;max-width:100%}
 .cast-scene-role{max-width:100%;font-size:16px;margin-top:14px}
 .cast-scene-quote{max-width:100%;font-size:14px;line-height:1.65;margin-top:14px}
 .companion-play{width:100%;max-width:100%;min-height:48px;height:auto;font-size:13px;margin-top:16px;padding:12px 14px}
 .cast-portrait{position:static;justify-self:end;align-self:end;width:65%;height:100%;min-height:0;object-position:right bottom;opacity:1}
 .cast-scene[data-cast-entry=hikari] .cast-portrait{height:72%}
 .cast-ready .cast-scenes{top:108px;bottom:86px}
 .cast-ready .cast-scene{grid-template-rows:auto minmax(0,1fr);padding:0;gap:16px;align-items:stretch}
 .cast-ready .cast-controls{bottom:22px}
 .cast-ready .cast-scene-name{font-size:44px;line-height:1.1;margin-top:10px}
 .cast-ready .cast-scene-name small{margin-top:6px;font-size:10px}
}

/* A separate learning scene closes the prologue. */
.cinema-team{right:2%;bottom:8%;height:76%;width:56%;object-position:right bottom}
@media(min-width:781px){.cinema-stage[data-step="2"] .cinema-words{width:62%}.cinema-stage[data-step="2"] .cinema-copy{font-size:clamp(43px,4.5vw,68px)}}
@media(max-width:780px){.cinema-team{right:-6%;bottom:9%;height:55%;width:100%;object-position:center bottom}}

.cinema-character{transition:opacity .6s}
.cinema-stage[data-step="2"] .cinema-character{opacity:0}

/* The upcoming mobile releases are the main product destination. */
.mobile-release-badge{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:25px;color:var(--mint);font:14px/1.5 ui-monospace,monospace;letter-spacing:.6px}
.mobile-release-badge span{font:12px/1.5 -apple-system,BlinkMacSystemFont,sans-serif;color:var(--lilac);border:1px solid #a883f355;border-radius:20px;padding:4px 10px}
.studio-hero .mobile-release-badge+h1{margin-top:18px}
.mobile-platforms{grid-template-columns:repeat(2,minmax(0,1fr));max-width:760px;margin-top:34px}
.mobile-platforms .platform{display:flex;gap:20px;padding:28px 32px!important;border-bottom:0;align-items:center}
.mobile-platforms .platform:first-child{padding-left:0!important}
.mobile-platforms .platform:last-child{border-right:0}
.mobile-platforms .platform strong{font-size:30px;font-weight:600}
.mobile-platforms .platform small{font-size:15px;letter-spacing:1px;margin-top:9px;color:#513e6b}
.release-device{width:88px;height:104px;flex:none;color:#3b205e}
.download-inner .release-note{font-size:13px;max-width:none;margin-top:22px}
.download-inner .source-link{font-size:13px;line-height:1.7;gap:8px;margin-top:26px;color:#604a7b;border-color:#604a7b55}
.download-inner .source-link svg{width:14px;height:14px;flex:none}
.download-inner .source-link>span{margin-left:7px}
@media(max-width:780px){
 .mobile-release-badge{font-size:13px;margin-top:21px;gap:10px}
 .download-inner h2{font-size:clamp(29px,7vw,43px);letter-spacing:0}
 .download-inner>p{max-width:100%;font-size:15px}
 .mobile-platforms{margin-top:28px}
 .mobile-platforms .platform{flex-direction:column;align-items:flex-start;gap:14px;padding:22px 18px!important}
 .mobile-platforms .platform strong{font-size:25px}
 .mobile-platforms .platform small{font-size:12px;letter-spacing:.5px}
 .release-device{width:72px;height:88px}
 .download-inner .release-note,.download-inner .source-link{font-size:12px}
}

#download .source-link{font-size:13px;max-width:100%}
@media(max-width:780px){#download .source-link{font-size:12px}}

/* Raise only the letter's visible ink. Keep the musical note in place. */
.brand-letter{display:inline-block;font:inherit;transform:translateY(-.12em)}
/* A bounded artwork container avoids percentage image overflow on mobile Safari. */
.cast-art{position:absolute;inset:0;pointer-events:none}
@media(max-width:780px){
 .cast-art{position:relative;inset:auto;width:65%;min-width:0;min-height:0;justify-self:end;align-self:stretch;overflow:hidden}
 .cast-art .cast-portrait{position:absolute;inset:0;width:100%;height:100%;max-width:100%;max-height:100%;min-height:0;object-fit:contain;object-position:right bottom}
 .cast-scene[data-cast-entry=hikari] .cast-art .cast-portrait{height:72%;top:auto;bottom:0}
 .companion-play{width:210px;max-width:66%;height:52px;min-height:52px;justify-content:flex-start;text-align:left;gap:8px;padding:8px 14px;font-size:12px;line-height:1.4}
 .companion-play-label{min-width:0;flex:1}
}

/* Public policy and support pages share the website's readable typography. */
.document-page{font-size:18px;line-height:1.85}
.document-header{width:min(1184px,calc(100% - 48px));margin:auto;min-height:110px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.document-header nav{display:flex;gap:24px;flex-wrap:wrap;font-size:15px;color:var(--lilac)}
.document-languages{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;padding:20px 24px;background:#1c1429;border-block:1px solid #a883f344}
.document-languages a{min-width:120px;min-height:44px;display:grid;place-items:center;padding:8px 16px;border:1px solid #a883f366;border-radius:24px;color:var(--lilac);font-size:15px}
.document-languages a[aria-current=page]{background:var(--lilac);color:var(--ink)}
.document-content{width:min(860px,calc(100% - 48px));margin:46px auto 80px}
.document-content section[hidden]{display:none}
.document-content h1{font-size:clamp(28px,4vw,40px);line-height:1.4;margin-bottom:28px;font-weight:650}
.document-content h2{font-size:26px;line-height:1.5;margin-top:36px;color:var(--lilac)}
.document-content h3{font-size:22px;line-height:1.6;margin-top:28px;color:var(--mint)}
.document-content p{margin-top:18px;color:#ded5e8}
.document-content a{color:var(--mint);text-decoration:underline;text-underline-offset:4px;overflow-wrap:anywhere}
.document-content ul,.document-content ol{padding-left:25px;margin-top:18px}
.document-content li{margin-block:8px}
.document-table{overflow-x:auto;margin-top:24px}
.document-table table{border-collapse:collapse;width:100%;font-size:16px}
.document-table th,.document-table td{padding:14px;text-align:left;vertical-align:top;border:1px solid #a883f355}
.document-table th{background:#241934;color:var(--lilac)}
.document-footer{width:min(860px,calc(100% - 48px));margin:0 auto 40px;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;color:var(--muted);font-size:14px}
@media(max-width:780px){.document-page{font-size:16px}.document-header{min-height:125px;flex-wrap:wrap;gap:14px;padding-block:24px}.document-header nav{width:100%;font-size:14px;gap:20px}.document-languages{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.document-languages a{min-width:0}.document-content{margin-top:32px}.document-content h2{font-size:23px}.document-content h3{font-size:20px}.site-footer>div{flex-wrap:wrap}}

/* The cover has separate text and artwork columns. The ticker masks its lower edge. */
@media(min-width:781px){
 .studio-hero{--studio-gutter:max(48px,calc((100vw - 1560px)/2));display:grid;grid-template-columns:clamp(360px,30vw,480px) minmax(0,1fr);column-gap:36px;align-items:end;padding:50px var(--studio-gutter) 0;min-height:0;max-height:none}
 .studio-hero .hero-copy{grid-column:1;grid-row:1;width:100%;max-width:none;padding:0 0 86px;align-self:center}
 .studio-cover{position:relative;inset:auto;grid-column:2;grid-row:1;justify-self:end;align-self:end;width:calc(100% + var(--studio-gutter));max-width:1320px;height:auto;aspect-ratio:1671/941;margin:0 calc(-1 * var(--studio-gutter)) 0 0;opacity:1}
 .studio-cover img{display:block;object-position:right bottom}
 .hero-ticker{margin-top:-28px}
 .hero-ticker>div{padding-block:18px;line-height:1.4}
}
.studio-caption{position:relative;inset:auto;width:min(1184px,calc(100% - 96px));margin:18px auto 0;min-height:28px;gap:24px;font-size:10px;line-height:1.6;z-index:5}
.studio-caption>a{font-size:12px}
@media(max-width:780px){.studio-caption{width:calc(100% - 48px);font-size:8px;gap:14px;margin-top:15px}.studio-caption>a{font-size:10px}.studio-caption>span:last-child{display:none}}

/* Keep the English cover title on two readable lines. */
html[lang=en] .studio-hero h1{font-size:clamp(34px,3vw,52px);line-height:1.18;letter-spacing:-1px}
@media(max-width:780px){html[lang=en] .studio-hero h1{font-size:clamp(32px,8.2vw,46px)}}

/* The optional language preference remains beside the language controls. */
.language-preference{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;column-gap:18px;row-gap:2px;max-width:900px;color:var(--muted);font-size:13px;line-height:1.6;text-align:center}
.language-preference label{display:inline-flex;align-items:center;gap:10px;min-height:44px;cursor:pointer;color:#eee5fb;font-size:14px}
.language-preference input{width:20px;height:20px;flex-shrink:0;accent-color:var(--lilac);cursor:pointer}
.language-preference a{color:var(--mint);text-decoration:underline;text-underline-offset:4px}
.language-preference [data-preference-status]{flex-basis:100%;color:#f6cfc9}
.document-content .language-preference{justify-content:flex-start;text-align:left;margin-top:20px;padding:18px 20px;border:1px solid var(--line);border-radius:16px}
.document-content .language-preference p{margin-top:0}
@media(max-width:780px){.language-preference{column-gap:12px;font-size:12px}.language-preference label{font-size:13px}.language-banner>.language-preference{flex-direction:column}.document-header nav{gap:14px}}

/* Each major Shion scene uses its own action and objects. */
.film-provenance{display:flex;align-items:baseline;justify-content:space-between;gap:18px;margin-top:20px;color:var(--muted);font-size:14px;line-height:1.8}.film-provenance p{margin:0}.film-provenance a{color:var(--mint);text-underline-offset:4px;white-space:nowrap}
@media(max-width:780px){.film-provenance{flex-direction:column;gap:6px;font-size:13px}}

.cinema-character{bottom:4%;height:86%}
@media(max-width:780px){.cinema-character{bottom:10%;height:64%}}

/* Keep each Japanese cover sentence on its intended line. */
html[lang=ja] .studio-hero h1{font-size:clamp(28px,2.6vw,42px);line-height:1.4;white-space:nowrap}
@media(max-width:780px){html[lang=ja] .studio-hero h1{font-size:clamp(24px,7.5vw,34px)}}

/* Mobile product introduction and actual interface gallery. */
.language-choices a{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.product-intro{padding-top:88px;padding-bottom:88px}
.product-intro h2,.product-faq h2,.interface-gallery h2{font-size:clamp(28px,3vw,46px);line-height:1.35;margin:20px 0}
.product-intro-lead{font-size:clamp(20px,2vw,27px);color:var(--lilac)}
.product-facts{display:flex;flex-wrap:wrap;gap:14px 36px;list-style:none;padding:0;margin:30px 0;color:var(--muted);font-size:17px}
.product-facts li::before{content:'✦';color:var(--mint);margin-right:10px}
.text-link{display:inline-block;color:var(--mint);border-bottom:1px solid #b4dfd266;padding-bottom:8px;font-size:16px}
.product-faq{padding-top:80px;padding-bottom:100px;max-width:1000px}
.product-faq details{border-bottom:1px solid #c6a5ff35;padding:22px 0}
.product-faq summary{cursor:pointer;font-size:20px;line-height:1.5;color:var(--cream)}
.product-faq details p{font-size:17px;line-height:1.9;color:var(--muted);margin:18px 0 0;max-width:780px}
.interface-gallery{padding-top:70px;padding-bottom:80px}
.interface-intro{max-width:760px;font-size:18px;line-height:1.8;color:var(--muted)}
.interface-gallery figure{margin:64px 0 0}
.interface-gallery figcaption{margin:22px 0;font-size:18px;line-height:1.7;color:var(--muted)}
.interface-gallery figcaption strong{display:block;color:var(--cream);font-size:24px;margin-bottom:5px}
.interface-shot{display:block;max-width:100%;height:auto;background:#151025;border:1px solid #c6a5ff38;border-radius:20px;box-shadow:0 28px 80px #0005}
.interface-phone{width:min(100%,340px);margin:auto}
.interface-ipad,.interface-duo{width:100%}
.interface-gallery .small-print{margin-top:38px;max-width:850px;line-height:1.8}
.interface-gallery .interface-phone-story{display:grid;grid-template-columns:minmax(280px,1fr) 1fr;gap:54px;align-items:center;padding:48px 0;border-block:1px solid #c6a5ff25}
.interface-gallery .interface-phone-story figcaption{font-size:24px;max-width:380px}
@media(max-width:780px){.product-intro{padding-top:55px;padding-bottom:55px}.product-facts{flex-direction:column;gap:14px;font-size:16px}.product-faq{padding-top:50px;padding-bottom:65px}.interface-gallery figure{margin-top:42px}.interface-gallery figcaption strong{font-size:22px}}
@media(max-width:780px){.interface-gallery .interface-phone-story{display:block;padding:32px 0}.interface-gallery .interface-phone-story figcaption{font-size:18px}}

/* Actual mobile interfaces. The stage keeps a stable size when the device changes. */
.interface-showcase{padding-block:96px 100px}
.interface-heading{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-bottom:34px}
.interface-heading h2{font-size:clamp(28px,3.4vw,44px);line-height:1.4;margin-top:18px;max-width:680px}
.interface-heading>p{font-size:17px;line-height:1.9;color:var(--muted);max-width:340px}
.interface-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:min(570px,100%);padding:5px;background:#1d152c;border:1px solid #b197d733;border-radius:40px;gap:5px;margin-bottom:22px}
.interface-tabs button{background:transparent;border-radius:30px;min-height:48px;font-size:17px;padding:10px 16px;color:var(--muted);transition:background .2s,color .2s}
.interface-tabs button[aria-selected=true]{background:var(--lilac);color:var(--ink);font-weight:650;box-shadow:0 3px 14px #0003}
.interface-tabs[hidden],.interface-panel[hidden]{display:none!important}
.interface-panel{display:grid;grid-template-columns:minmax(230px,.7fr) minmax(0,1.6fr);gap:35px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);min-width:0}
.interface-device-copy{padding:30px 0;min-width:0}
.interface-number{font:13px/1.5 ui-monospace,monospace;letter-spacing:2px;color:var(--mint)}
.interface-device-copy h3{font-size:clamp(28px,3vw,40px);line-height:1.45;font-weight:650;margin:25px 0 22px}
.interface-device-copy>p{font-size:18px;line-height:1.9;color:var(--muted);max-width:360px}
.interface-open-label{display:inline-flex;gap:24px;align-items:center;min-height:44px;font-size:16px;color:var(--lilac);border-bottom:1px solid #a883f366;margin-top:26px}
.interface-open-label:hover{color:var(--mint)}
.interface-stage{height:600px;min-width:0;display:flex;align-items:center;justify-content:center;padding:32px;position:relative;isolation:isolate;overflow:hidden;border-radius:32px;background:radial-gradient(ellipse at 50% 50%,#67449665,transparent 72%)}
.interface-stage::before{content:'';position:absolute;z-index:-1;width:78%;aspect-ratio:1;border:1px solid #b197d720;border-radius:50%;box-shadow:0 0 0 40px #b197d706,0 0 0 80px #b197d704}
.interface-image-link{display:flex;max-width:100%;max-height:100%;position:relative;align-items:center;justify-content:center;border-radius:18px;cursor:zoom-in}
.interface-capture{width:auto;height:auto;max-width:100%;max-height:536px;object-fit:contain;border:1px solid #d8c5ff55;border-radius:16px;box-shadow:0 26px 65px #0008;background:#14101f}
.interface-enlarge{position:absolute;right:12px;bottom:12px;width:42px;height:42px;display:grid;place-items:center;border:1px solid #d8c5ff66;background:#171022e8;color:var(--paper);font:24px/1 sans-serif;border-radius:50%;box-shadow:0 3px 14px #0006}
.interface-image-link:hover .interface-enlarge{background:var(--lilac);color:var(--ink)}
.interface-preview-note{font-size:14px;line-height:1.9;color:var(--muted);margin-top:25px;max-width:950px}
.interface-viewer-open{overflow:hidden}
.interface-lightbox{width:calc(100vw - 32px);max-width:1440px;height:calc(100dvh - 32px);max-height:none;padding:0;margin:auto;overflow:hidden;color:var(--paper);background:#100c1c;border:1px solid #a883f388;border-radius:18px;box-shadow:0 24px 100px #000a}
.interface-lightbox[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto}
.interface-lightbox:not([open]){display:none}
.interface-lightbox::backdrop{background:#06030cdb;backdrop-filter:blur(12px)}
.interface-viewer-toolbar{display:grid;grid-template-columns:minmax(70px,1fr) auto auto;align-items:center;gap:16px;padding:14px 20px;border-bottom:1px solid var(--line)}
.interface-viewer-toolbar h2{font-size:19px;line-height:1.3;font-weight:600}
.interface-zoom-controls{display:grid;grid-template-columns:44px 48px 44px minmax(64px,auto);gap:8px;align-items:center}
.interface-zoom-controls button,.interface-viewer-close{height:44px;min-width:44px;border-radius:8px;border:1px solid #a883f355;background:#261a39;font-size:20px}
.interface-zoom-controls [data-interface-zoom-reset]{font-size:14px;padding-inline:12px}
.interface-zoom-controls output{text-align:center;font:13px/1 ui-monospace,monospace}
.interface-zoom-controls button:disabled{opacity:.35;cursor:default}
.interface-viewer-close{font-size:28px}
.interface-viewer-viewport{min-height:0;overflow:auto;overscroll-behavior:contain;background:#0b0813;scrollbar-color:#71599a #0b0813}
.interface-viewer-canvas{display:grid;place-items:center;min-width:100%;min-height:100%;width:max-content;height:max-content;padding:12px}
.interface-viewer-canvas img{max-width:none;display:block;flex:none;object-fit:contain}
.interface-viewer-hint{padding:12px 20px;color:var(--muted);font-size:13px;line-height:1.6;border-top:1px solid var(--line)}
.studio-hero .hero-product-category{font-size:14px;line-height:1.7;color:var(--mint);margin-top:18px;max-width:460px}
@media(max-width:780px){
 .interface-showcase{padding-block:60px 65px}.interface-heading{display:block}.interface-heading>p{margin-top:20px;font-size:16px}.interface-tabs{width:100%}.interface-tabs button{font-size:14px;padding:10px 5px}
 .interface-panel{grid-template-columns:1fr;gap:0;padding-top:4px}.interface-device-copy{padding:24px 0 8px}.interface-device-copy h3{font-size:30px;margin:15px 0}.interface-device-copy>p{font-size:16px;max-width:540px}.interface-open-label{margin-top:14px;font-size:15px}
 .interface-stage{height:460px;padding:20px 12px}.interface-capture{max-height:420px;border-radius:12px}.interface-preview-note{font-size:13px}.interface-enlarge{width:38px;height:38px;right:8px;bottom:8px}
 .interface-lightbox{width:calc(100vw - 16px);height:calc(100dvh - 16px);border-radius:12px}.interface-viewer-toolbar{grid-template-columns:1fr 44px;padding:10px 12px;gap:8px}.interface-viewer-toolbar h2{grid-column:1;grid-row:1}.interface-viewer-close{grid-column:2;grid-row:1}.interface-zoom-controls{grid-column:1/-1;grid-row:2;justify-self:center}.interface-viewer-hint{padding:10px 12px;font-size:12px}
}
@media(prefers-reduced-motion:reduce){.interface-tabs button{transition:none}}

/* Pair the local-learning introduction with real app screens. */
.product-showcase{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:64px;align-items:center;padding-block:70px 54px}
.interface-intro-copy h2{font-size:clamp(32px,3.5vw,48px);line-height:1.35;margin:22px 0}
.interface-intro-copy .product-intro-lead{font-size:clamp(19px,2vw,25px);line-height:1.6}
.interface-intro-description{font-size:17px;line-height:1.9;color:var(--muted);margin-top:20px;max-width:490px}
.product-showcase .product-facts{display:flex;flex-direction:column;gap:10px;margin:24px 0;font-size:15px;line-height:1.6}
.interface-learning-steps{counter-reset:learning-step;list-style:none;margin:26px 0 30px;padding:0;border-left:1px solid #b197d740}
.interface-learning-steps li{counter-increment:learning-step;display:flex;gap:15px;align-items:baseline;padding:7px 0 7px 17px;color:var(--paper);font-size:16px;line-height:1.65}
.interface-learning-steps li::before{content:'0' counter(learning-step);font:12px/1.6 ui-monospace,monospace;color:var(--mint);letter-spacing:1px}
.interface-visual{min-width:0}
.product-showcase .interface-tabs{grid-template-columns:repeat(var(--interface-device-count,3),minmax(0,1fr));width:min(420px,100%);margin:0 auto 12px}
.product-showcase .interface-tabs button{font-size:15px;min-height:44px;padding:9px 12px}
.product-showcase .interface-panel{display:block;border:0;padding:0}
.product-showcase .interface-stage{height:530px;padding:22px 12px}
.product-showcase .interface-capture{max-height:486px;border-radius:22px}
.product-showcase .interface-device-copy{display:flex;align-items:center;justify-content:center;gap:28px;padding:10px 0 8px}
.product-showcase .interface-open-label{margin:0;font-size:14px;gap:15px;min-height:36px}
.product-showcase .interface-preview-note{margin:10px auto 0;text-align:center;font-size:12px;line-height:1.7;max-width:470px}
.product-showcase ~ .cinema-track{margin-top:0}
@media(max-width:1000px) and (min-width:781px){.product-showcase{gap:32px}.interface-intro-copy h2{font-size:35px}.interface-intro-description{font-size:16px}}
@media(max-width:780px){
 .product-showcase{grid-template-columns:1fr;gap:32px;padding-block:48px 28px}.interface-intro-copy h2{font-size:34px;margin:18px 0}.interface-intro-copy .product-intro-lead{font-size:21px}.interface-intro-description{font-size:16px;margin-top:16px}
 .product-showcase .product-facts{flex-direction:row;gap:8px 18px;font-size:14px;margin:20px 0}.interface-learning-steps{margin:22px 0 26px}.interface-learning-steps li{font-size:15px}.product-showcase .interface-stage{height:470px;padding:18px 12px}.product-showcase .interface-capture{max-height:434px;border-radius:20px}.product-showcase .interface-tabs{max-width:420px}.product-showcase .interface-device-copy{gap:18px}.product-showcase .interface-number{font-size:11px;letter-spacing:1px}
}

.product-showcase .interface-tabs:has(button:only-child){width:fit-content;padding:0;border:0;background:none;margin-bottom:0}
.product-showcase .interface-tabs:has(button:only-child) button{color:var(--mint);background:none;box-shadow:none;font:14px/1.5 ui-monospace,monospace;letter-spacing:2px;padding:6px 16px}

/* Three mobile layouts, with the experimental Duo scope shown separately. */
.mobile-platforms{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none}
.release-title-platforms{font-size:clamp(25px,4.1vw,59px);letter-spacing:0}
@media(min-width:781px) and (max-width:1050px){.mobile-platforms .platform{flex-direction:column;align-items:flex-start;padding:24px!important}.mobile-platforms .platform:first-child{padding-left:0!important}}
@media(max-width:780px){
 .mobile-platforms{grid-template-columns:1fr}.mobile-platforms .platform{flex-direction:row;align-items:center;padding:22px 0!important;border-right:0;border-bottom:1px solid #100c1c33}.mobile-platforms .platform:last-child{border-bottom:0}.mobile-platforms .platform strong{font-size:25px}.release-title-platforms{font-size:clamp(23px,6.2vw,43px)}
}

/* A user-controlled screen carousel. Adjacent previews use the reviewed source images only. */
.interface-deck{position:relative;isolation:isolate;overflow:hidden;touch-action:pan-y pinch-zoom}
.interface-panel{position:relative;z-index:1}
.interface-side-previews{position:absolute;inset:70px 0 90px;z-index:0;pointer-events:none;overflow:hidden}
.interface-side-previews[hidden],.interface-slider-controls[hidden]{display:none!important}
.interface-side-previews img{position:absolute;top:50%;width:55%;max-height:75%;object-fit:contain;opacity:.19;filter:blur(.5px);border-radius:15px}
.interface-side-previews img:first-child{left:-8%;transform:translateY(-50%) rotate(-8deg)}
.interface-side-previews img:last-child{right:-8%;transform:translateY(-50%) rotate(8deg)}
.interface-image-link img{user-select:none;-webkit-user-drag:none}
.interface-slider-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;margin:16px auto 6px}
.interface-slider-controls button{width:44px;height:44px;border:1px solid #b197d766;border-radius:50%;background:#251a35;font-size:23px;color:var(--lilac)}
.interface-slider-controls button:hover{background:var(--lilac);color:var(--ink)}
.interface-slider-controls output{font:12px/1.5 ui-monospace,monospace;letter-spacing:2px;color:var(--mint);min-width:70px;text-align:center}
.interface-slider-controls>span{flex-basis:100%;text-align:center;font-size:12px;line-height:1.7;color:var(--muted)}
@media(prefers-reduced-motion:reduce){.interface-side-previews img{transform:translateY(-50%)}}

/* One continuous folding display, shown partly open at an angle. */
.release-duo{transform:rotate(-7deg)}