/* Hello, Piano — five type roles, two weights, self-hosted Pretendard. */@font-face{font-family:Pretendard;src:url('/assets/fonts/PretendardVariable.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:'Pretendard JP';src:url('/assets/fonts/PretendardJPVariable.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}:root{--font:Pretendard,-apple-system,BlinkMacSystemFont,sans-serif;--small:14px;--body:18px;--title:28px;--section:56px;--hero:88px;--regular:400;--emphasis:600;--ink:#20211f;--muted:#767873;--accent:#b97943;--line:#dedfda;--paper:#fff;--soft:#f5f5f2;--radius:28px}html:lang(ja){--font:'Pretendard JP',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:var(--body);font-weight:var(--regular);line-height:1.6;-webkit-font-smoothing:antialiased}h1,h2,h3,p{margin:0}h1,h2,h3{text-wrap:balance;font-weight:var(--emphasis);letter-spacing:-.04em;line-height:1.15}h1{font-size:var(--hero)}h2{font-size:var(--section)}h3{font-size:var(--title)}p{color:var(--muted);text-wrap:pretty}em{font-style:normal}strong,b{font-weight:var(--emphasis)}button,input,select{font:inherit;color:inherit}a{color:inherit;text-decoration:none}button{border:0;cursor:pointer}a,button,select{-webkit-tap-highlight-color:transparent}button:disabled{cursor:default;opacity:.35}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:5px}button:focus:not(:focus-visible){outline:none}.icon{width:20px;height:20px;flex-shrink:0;stroke-width:1.75;display:block}.wrap{width:min(1180px,calc(100% - 96px));margin-inline:auto}[hidden]{display:none!important}.eyebrow{font-size:var(--small);font-weight:var(--emphasis);color:var(--muted);line-height:1.5}.skip{position:fixed;top:-100px;left:20px;padding:12px 22px;background:#222;color:white;z-index:100}.skip:focus{top:10px}.header{height:76px;position:sticky;top:0;z-index:20;background:#ffffffdb;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid #e8e9e580}.nav-wrap{height:100%;display:flex;align-items:center;gap:28px}.brand{display:inline-flex;align-items:center;gap:10px;font-size:var(--body);font-weight:var(--emphasis);letter-spacing:-.035em;white-space:nowrap}.brand img{width:32px;height:32px;border-radius:8px}.nav-wrap nav{display:flex;align-items:center;gap:28px;margin-left:auto;font-size:var(--small)}.nav-wrap nav a{padding:10px 0;color:#676a62}.nav-wrap nav a:hover{color:#000}.nav-studio{display:flex;align-items:center;gap:8px;font-size:var(--small);padding:9px 15px;border-radius:30px;background:#222420;color:#fff}.nav-studio .icon{width:16px;height:16px}.locale{display:flex;gap:5px;align-items:center;font-size:var(--small)}.locale select{appearance:none;border:0;background:none;font-size:var(--small);padding:9px 0;cursor:pointer;max-width:85px}.locale>.icon{width:16px;height:16px}.locale>.icon:last-child{width:12px;height:12px}.button{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:13px 24px;border-radius:30px;font-size:var(--small);font-weight:var(--emphasis);line-height:1.5;transition:background .2s,transform .2s}.button.primary{background:#252823;color:#fff}.button.primary:hover{background:#494e43;transform:translateY(-2px)}.button.secondary{background:#e9ece4}.text-link{display:inline-flex;align-items:center;gap:8px;font-size:var(--small);font-weight:var(--emphasis)}.text-link:hover{color:var(--accent)}.text-link .icon{width:18px;height:18px}.hero{text-align:center;overflow:clip;background:linear-gradient(#fff 70%,#f4f5f1)}.hero-copy{padding-top:70px;position:relative;z-index:2}.hero .eyebrow{font-size:var(--body);color:var(--ink)}.hero h1{margin:21px auto 24px;max-width:1100px;line-height:1.08}.hero h1 em{color:#8a8e81}.hero-desc{max-width:740px;margin:auto}.hero-actions{display:flex;justify-content:center;align-items:center;gap:30px;margin-top:28px}.release{font-size:var(--small);margin-top:23px}.screen-glass{position:absolute;inset:8px;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,#ffffff14,transparent 30%,transparent 65%,#ffffff18);mix-blend-mode:screen}.phone-camera{position:absolute;left:8px;top:calc(50% - 20px);height:40px;width:7px;border-radius:8px;background:linear-gradient(#080e07,#202d1b,#080e07);box-shadow:0 0 0 1px #727b63}.hero-caption{display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:var(--small);color:var(--muted);padding:5px 0 40px}.hero-caption a{display:flex;gap:8px;align-items:center}.hero-caption .icon{width:16px;height:16px}.section{padding-block:120px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:25px;margin-bottom:45px}.studio-feature{display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:center}.studio-feature h2{margin:18px 0 25px}.studio-feature p{font-size:var(--body)}.studio-feature .button{margin-top:28px}.studio-feature-visual{border:1px solid #dedfd9;border-radius:17px;background:#fbfbf8;box-shadow:0 28px 70px -30px #4c584842;overflow:hidden;transform:perspective(1500px) rotateY(-7deg) rotateX(3deg)}.browser-chrome{display:flex;align-items:center;gap:7px;padding:17px;background:#eeeFE9;border-bottom:1px solid #e4e6dc;font-size:var(--small);color:#7a8470}.browser-chrome i{height:7px;width:7px;background:#c4c8bb;border-radius:50%}.browser-chrome>span{margin:auto}.browser-chrome .icon{width:18px;height:18px}.editor-illustration{display:grid;grid-template-columns:85px 1fr;min-height:300px}.editor-mini-sidebar{border-right:1px solid #e2e5d9;padding:25px 17px;background:#f6f7f1;display:flex;flex-direction:column;align-items:center;gap:20px;color:#9ca78d}.editor-mini-sidebar>span{width:37px;height:7px;background:#d5dcC8;border-radius:6px}.editor-mini-score{padding:42px 24px;display:flex;flex-direction:column;justify-content:center;gap:28px}.mini-staff{height:100px;position:relative;display:flex;flex-direction:column;justify-content:space-evenly;color:#323d2c}.mini-staff>i{display:block;width:100%;height:1px;background:#bfc5b4}.mini-staff>svg{position:absolute;inset:0;height:100%;width:100%}.corrected-note{color:#b57844;fill:#b57844;stroke:#b57844}.editor-mini-pitch{display:flex;align-items:center;justify-content:center;gap:16px;font-size:var(--title)}.editor-mini-pitch span{color:#a4aa9c}.editor-mini-pitch strong{color:var(--accent);font-weight:var(--emphasis)}.editor-mini-pitch .icon{color:#949f85}.editor-mini-footer{display:flex;flex-wrap:wrap;gap:14px;padding:18px;border-top:1px solid #e2e5db;font-size:var(--small);color:#849176}.editor-mini-footer span{display:flex;gap:4px;align-items:center}.editor-mini-footer .icon{width:16px;height:16px}.plans-section{padding:115px 0 75px;background:#f5f5f2}.plans-heading{text-align:center}.plans-heading h2{margin:20px 0}.plans-heading>p{font-size:var(--small)}.billing{display:inline-flex;gap:5px;padding:5px;background:#e5e7df;border-radius:30px;margin:30px 0 42px}.billing button{padding:9px 19px;border-radius:24px;background:none;font-size:var(--small);display:flex;gap:8px;align-items:center}.billing button[aria-pressed=true]{background:#fff;box-shadow:0 2px 6px #0000000c}.billing span{font-size:var(--small);color:#7d886b}.plans{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:880px;margin:auto}.plan-card{padding:36px;border-radius:24px;background:white;position:relative}.plan-card .eyebrow{color:#7e8874}.plan-card h3{margin:16px 0 24px}.price{font-size:var(--section);font-weight:var(--emphasis);letter-spacing:-.045em;line-height:1.2;display:flex;gap:8px;align-items:baseline}.price>span:not(.price-number){font-size:var(--small);font-weight:var(--regular);color:#8a9280;letter-spacing:0}.price-foot{font-size:var(--small);margin-top:12px;color:#939d89;min-height:23px}.checklist{list-style:none;padding:28px 0 0;margin:28px 0 0;border-top:1px solid #e7e9e1;display:grid;gap:14px}.checklist li{display:flex;gap:10px;align-items:flex-start;font-size:var(--body)}.checklist .icon{color:#82956a;margin-top:4px;width:18px;height:18px}.subscription-plan{background:#293224;color:#f9fbf4}.subscription-plan .eyebrow{color:#bccbb0}.subscription-plan .checklist{border-color:#4d5b43}.subscription-plan .price-foot,.subscription-plan .price>span:not(.price-number){color:#b1c0a3}.subscription-plan .checklist .icon{color:#bbcd9d}.plan-tag{position:absolute;top:20px;right:20px;font-size:var(--small);color:#bacaab}.credits{display:grid;grid-template-columns:1fr 1.65fr;gap:50px;margin:75px auto 0;border-top:1px solid #dce1d3;padding-top:38px}.credit-intro h3{margin:12px 0}.credit-intro p{font-size:var(--body)}.carry{display:flex;gap:8px;align-items:center;font-size:var(--small);color:#869570;margin-top:20px}.carry .icon{width:16px;height:16px}.credit-packs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.credit-pack{border-radius:17px;background:#fff;display:flex;flex-direction:column;align-items:center;gap:12px;padding:22px 10px}.pack-price,.bonus{font-size:var(--small);color:#869277}.credit-pack strong{font-size:var(--title);font-weight:var(--emphasis);letter-spacing:-.04em}.bonus{background:#f0f4e9;padding:3px 9px;border-radius:20px}.conversion-line{display:flex;justify-content:space-between;gap:15px;font-size:var(--small);color:#7c8a6c;margin-top:22px}.conversion-line strong{font-weight:var(--emphasis)}.plan-notes{max-width:990px;margin:35px auto 0;font-size:var(--small);line-height:1.9;color:#919788;text-align:center}.faq-section{display:grid;grid-template-columns:1fr 1.35fr;gap:75px}.faq-section h2{margin:19px 0}.faq-section p{font-size:var(--body)}.faq-section .text-link{margin-top:22px}.faq-list{border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line)}summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:25px 0;font-size:var(--body);font-weight:var(--emphasis);cursor:pointer}summary::-webkit-details-marker{display:none}summary .icon{color:#9ca58f;transition:transform .2s}details[open] summary .icon{transform:rotate(45deg)}details p{padding:0 10px 25px 0;font-size:var(--body);line-height:1.8}.support-banner{display:grid;grid-template-columns:1.4fr 1fr;gap:50px;padding:65px;background:#f1f2ed;border-radius:var(--radius);align-items:center;margin-bottom:95px;overflow:hidden}.support-copy h2{margin:18px 0 25px}.support-copy p{font-size:var(--body);max-width:540px}.support-copy .button{margin-top:28px}.support-art{display:grid;place-items:center;align-self:stretch;color:#c4cdba;background:radial-gradient(ellipse,#e0e5d7,transparent 68%)}.support-art>.icon{width:150px;height:150px;stroke-width:.65;transform:rotate(-15deg)}.footer{padding-bottom:25px}.footer-top{display:flex;gap:25px;align-items:center;padding-bottom:28px;border-bottom:1px solid var(--line);flex-wrap:wrap}.footer-top>p{font-size:var(--small);flex:1}.footer-links{display:flex;gap:22px;font-size:var(--small);color:#717b65}.footer-links a:hover{text-decoration:underline}.footer-bottom{display:flex;justify-content:space-between;gap:20px;font-size:var(--small);color:#929a88;padding-top:24px}.doc-layout{display:grid;grid-template-columns:220px 1fr;gap:65px;padding-block:75px 115px}.doc-layout aside nav{display:flex;flex-direction:column;margin-top:35px;gap:10px}.doc-layout aside nav a{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);font-size:var(--small);color:var(--muted)}.doc-layout aside nav a[aria-current]{color:var(--accent)}.doc h1{font-size:var(--section);margin:20px 0}.doc-meta{display:flex;flex-wrap:wrap;gap:20px;font-size:var(--small);color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:30px}.doc-paragraph{display:flex;gap:25px;padding-top:28px}.doc-paragraph>span{font-size:var(--small);color:#a3ad94;padding-top:4px}.doc-paragraph p{font-size:var(--body);line-height:1.9}.doc-contact{padding:25px;background:var(--soft);border-radius:17px;margin-top:40px}.doc-contact h3{font-size:var(--title);margin-bottom:12px}.doc-contact a{overflow-wrap:anywhere}.studio-page{padding-block:60px 95px;min-height:75vh}.studio-heading .eyebrow{color:var(--accent)}.studio-heading h1{font-size:var(--section);margin:20px 0}.studio-heading p{font-size:var(--body)}#studio-status{min-height:28px;font-size:var(--small);color:#718652;margin:22px 0}#studio-status.error{color:#b54f3f}.login-panel{padding:45px;text-align:center;background:var(--soft);border-radius:var(--radius);max-width:780px;margin:40px auto}.login-symbol{display:grid;place-items:center;width:55px;height:55px;margin:0 auto 20px;border-radius:16px;background:#e5eadd;color:#7d9068}.login-panel h2{font-size:var(--title);margin-bottom:25px;line-height:1.5}.login-panel p{font-size:var(--small);max-width:540px;margin:24px auto}.workspace-top{display:flex;justify-content:space-between;align-items:center;gap:18px;font-size:var(--small);padding-bottom:20px;border-bottom:1px solid var(--line)}.workspace-top button{background:none}.workspace-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding-block:22px}.file-label{position:relative;overflow:hidden;cursor:pointer}.file-label input{position:absolute;width:100%;height:100%;inset:0;opacity:0;cursor:pointer}.file-label:focus-within{outline:3px solid var(--accent);outline-offset:3px}.workspace-toolbar #filename{font-size:var(--small);color:var(--muted);overflow-wrap:anywhere}.local-notice{font-size:var(--small);margin-bottom:25px;max-width:950px}.editor-split{display:grid;grid-template-columns:295px minmax(0,1fr);gap:22px}.editor-sidebar{padding:22px;border:1px solid var(--line);background:var(--soft);border-radius:17px;align-self:start}.editor-sidebar label{display:flex;flex-direction:column;gap:6px;font-size:var(--small)}.editor-sidebar select{font-size:var(--small);background:#fff;border:1px solid #d3dac9;padding:9px;border-radius:7px;width:100%}.selection-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.report-toggle{flex-direction:row!important;align-items:flex-start;gap:9px!important;margin-top:24px}.report-toggle input{accent-color:#71845a}.editor-help{font-size:var(--small);line-height:1.8;margin:14px 0;color:#8c9481}.editor-sidebar h3{font-size:var(--body);margin-top:24px}#note-list{display:flex;gap:7px;flex-wrap:wrap;margin-block:15px}.note-choice{padding:6px 8px;border:1px solid #dce3d1;border-radius:5px;background:white;font-size:var(--small)}.note-choice[aria-pressed=true]{border-color:#b07c4d;background:#f4e1c9}#pitch-controls{border:0;padding:15px 0 0}#pitch-controls legend{font-size:var(--small);padding:0}.pitch-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}#apply-button,#download-button{width:100%;margin-top:15px;border-radius:8px}.edit-actions{display:flex;flex-direction:column;gap:12px;align-items:flex-start;margin:18px 0}.edit-actions button{padding:0;background:none;color:#7e8c6c;font-size:var(--small);text-decoration:underline}.score-comparison{min-width:0}.preview-panel,.pdf-panel{border:1px solid var(--line);border-radius:17px;overflow:hidden;background:white}.preview-panel h3,.pdf-panel h3{padding:18px;font-size:var(--small);border-bottom:1px solid var(--line);color:#89977a}.pdf-panel{margin-top:20px}#score-preview{padding:15px;min-height:270px;overflow:auto;color:#000}#original-pdf{width:100%;height:580px;border:0;display:block}fieldset:disabled{opacity:.5}
@media(max-width:1100px){:root{--hero:72px;--section:48px}.wrap{width:calc(100% - 60px)}.nav-wrap{gap:22px}.nav-wrap nav{gap:20px}.studio-feature{gap:35px}.editor-illustration{grid-template-columns:65px 1fr}.editor-mini-score{padding:35px 16px}.editor-mini-sidebar{padding:25px 10px}.support-banner{padding:45px;gap:30px}.faq-section{gap:45px}.footer-top>p{flex-basis:50%}.footer-bottom>span:last-child{display:none}}

@media(max-width:760px){:root{--small:13px;--body:16px;--title:24px;--section:36px;--hero:48px;--radius:22px}.wrap{width:calc(100% - 40px)}html{scroll-padding-top:120px}.header{height:110px}.nav-wrap{flex-wrap:wrap;gap:0;padding-top:16px;align-content:start}.brand{gap:7px}.brand img{width:27px;height:27px}.nav-studio{margin-left:auto;font-size:var(--small);padding:7px 12px;gap:5px}.nav-studio .icon{display:none}.locale{margin-left:12px}.locale>.icon:first-child{display:none}.locale select{font-size:var(--small);max-width:62px}.locale .icon:last-child{width:10px;height:10px}.nav-wrap nav{order:3;width:100%;margin-top:13px;margin-left:0;justify-content:space-between;border-top:1px solid #e9ebe3;padding-top:7px;font-size:var(--small)}.nav-wrap nav a{padding:5px 0}.hero-copy{padding-top:55px}.hero h1{margin-top:17px;line-height:1.16}.hero-desc{max-width:380px;line-height:1.8;font-size:var(--body)}.hero-actions{gap:19px;margin-top:25px;flex-wrap:wrap}.button{padding:12px 20px}.release{margin-top:19px}.phone-camera{width:5px;height:27px;left:6px;top:calc(50% - 13px)}.hero-caption{font-size:var(--small);padding-bottom:28px;justify-content:center}.hero-caption a{display:none}.section{padding-block:70px}.section-heading{gap:15px;margin-bottom:28px;align-items:center}.studio-feature{grid-template-columns:1fr;gap:38px}.studio-feature h2{margin:16px 0 22px}.studio-feature-visual{transform:none}.editor-illustration{min-height:250px;grid-template-columns:55px 1fr}.editor-mini-sidebar span{width:26px}.editor-mini-footer{gap:12px;padding:15px}.plans-section{padding:65px 0 50px}.plans-heading h2{margin-block:18px}.billing{margin:25px 0 30px}.plans{grid-template-columns:1fr;max-width:460px;gap:18px}.plan-card{padding:30px}.plan-card h3{margin:16px 0 20px}.plan-tag{position:static;float:right;font-size:var(--small)}.price{font-size:var(--section)}.checklist{gap:13px;margin-top:23px;padding-top:23px}.credits{grid-template-columns:1fr;gap:25px;margin-top:40px;padding-top:30px}.credit-packs{gap:9px}.credit-pack{padding:19px 8px;gap:10px}.credit-pack strong{font-size:var(--title)}.pack-price,.bonus{font-size:var(--small)}.conversion-line{font-size:var(--small)}.plan-notes{font-size:var(--small);margin-top:27px;text-align:left}.faq-section{grid-template-columns:1fr;gap:32px}.faq-section h2{margin:15px 0}.faq-section .text-link{margin-top:17px}summary{padding:23px 0}.support-banner{grid-template-columns:1fr;padding:30px;gap:20px;margin-bottom:65px}.support-copy h2{margin:15px 0 22px}.support-art{height:130px;justify-self:end;width:160px}.support-art .icon{width:90px;height:90px}.footer-top{display:block;padding-bottom:22px}.footer-top>p{margin:14px 0 22px}.footer-links{gap:18px;flex-wrap:wrap}.footer-bottom{flex-wrap:wrap;gap:10px;font-size:var(--small)}.doc-layout{grid-template-columns:1fr;padding-block:35px 65px;gap:35px}.doc-layout aside nav{flex-direction:row;gap:16px;margin-top:20px}.doc-layout aside nav a{font-size:var(--small);gap:4px}.doc-layout aside nav a .icon{display:none}.doc-paragraph{gap:15px;padding-top:24px}.doc-contact{padding:22px}.doc-contact h3{font-size:var(--title)}.studio-page{padding-block:35px 65px}.studio-heading h1{font-size:var(--section)}.studio-heading p{font-size:var(--body)}.login-panel{padding:30px 22px}.login-panel h2{font-size:var(--title)}.workspace-top #account-label{overflow-wrap:anywhere}.workspace-toolbar{gap:10px}.workspace-toolbar .button{padding:10px 15px}.editor-split{grid-template-columns:1fr}.editor-sidebar{order:2}.score-comparison{order:1}#original-pdf{height:400px}}
@media(max-width:360px){.wrap{width:calc(100% - 28px)}.nav-studio{padding:7px 10px}.locale{margin-left:8px}.brand{letter-spacing:-.05em}.brand img{width:23px;height:23px}.hero h1{font-size:var(--section)}.credit-pack{padding-inline:5px}.credit-pack strong{font-size:var(--body)}.section-heading h2{font-size:var(--title)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

h1,h2,h3{word-break:keep-all}
@media(max-width:760px){.hero h1{font-size:var(--section)}}
/* Standing arrangement: the lower edges, not the centers, are the pivots. */


/* The landscape phone keeps its hardware proportions; the original capture is fitted, never stretched. *//* New generated hardware; source bitmap and app captures are separate immutable layers. */.product-stage{--progress:0;position:relative;width:min(1160px,100%);margin:35px auto 0;isolation:isolate}.rendered-scene{--scene-scale:.75;position:relative;aspect-ratio:3/2;width:100%;overflow:hidden}.rendered-artwork{position:absolute;left:var(--scene-left,0);top:0;width:1536px;height:1024px;transform:scale(var(--scene-scale));transform-origin:0 0;isolation:isolate}.hardware-background,.hardware-foreground{position:absolute;inset:0;display:block;width:1536px;height:1024px;max-width:none;pointer-events:none}.hardware-background{z-index:0}.hardware-foreground{z-index:3}.app-plane{position:absolute;left:0;top:0;transform-origin:0 0;background:#f7f5ee;overflow:hidden;backface-visibility:hidden}.ipad-app-plane{width:1668px;height:2388px;z-index:1}.phone-app-plane{width:2556px;height:1179px;z-index:2}.app-plane img{display:block;width:100%;height:100%;object-fit:contain;max-width:none}
@media(max-width:760px){.product-stage{margin-top:25px}.rendered-scene{--scene-scale:.25}}.hero{background:#fff}.rendered-scene{transform:scale(calc(.985 + var(--progress, .5) * .015));transform-origin:50% 90%;will-change:transform}
@media(prefers-reduced-motion:reduce){.rendered-scene{transform:none;will-change:auto}}

@media(max-width:760px){.rendered-scene{aspect-ratio:6/5}}/* Pinned feature showcase: only copy and the two display layers crossfade. */.app-screen-state{position:absolute;inset:0;opacity:0;transition:opacity .24s ease}.app-screen-state.is-active{opacity:1}.practice-showcase{--feature-header:76px;height:320vh;background:#fff;position:relative}.feature-pin{position:sticky;top:var(--feature-header);height:calc(100vh - var(--feature-header));height:calc(100svh - var(--feature-header));display:flex;align-items:center;padding-block:40px;overflow:hidden}.feature-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);align-items:center;gap:40px}.feature-explanation{min-width:0}.feature-explanation>h2{font-size:var(--title);color:var(--muted);font-weight:var(--regular);margin-bottom:34px;line-height:1.35}.feature-panels{display:grid;grid-template-columns:1fr}.showcase-panel{grid-area:1/1;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .24s ease}.showcase-panel.is-active{opacity:1;visibility:visible;pointer-events:auto}.showcase-step-label{display:block;font-size:var(--small);color:var(--accent);margin-bottom:20px}.showcase-panel h3{font-size:var(--section);line-height:1.18;margin-bottom:24px}.showcase-panel p{font-size:var(--body);line-height:1.8;max-width:410px}.feature-navigation{display:flex;gap:12px;align-items:center;margin-top:28px}.feature-step{width:44px;height:44px;border:1px solid #d9ddd2;border-radius:50%;background:transparent;font-size:var(--small);color:#8b9580;transition:color .2s,background .2s,border-color .2s}.feature-step[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}.feature-scroll-hint{display:flex;align-items:center;gap:8px;font-size:var(--small);margin-top:22px;color:#9aa28f}.feature-scroll-hint .icon{width:16px;height:16px}.feature-devices{min-width:0;max-width:750px;width:100%;justify-self:end}.feature-devices .rendered-scene{transform:none;will-change:auto}.feature-devices>p{font-size:var(--small);text-align:center;color:#989f8e;margin-top:10px}
@media(min-width:761px) and (max-height:760px){.feature-pin{padding-block:25px}.feature-explanation>h2{margin-bottom:22px;font-size:var(--body)}.showcase-panel h3{font-size:var(--title);margin-bottom:18px}.showcase-step-label{margin-bottom:14px}.showcase-panel p{font-size:var(--small)}.feature-navigation{margin-top:20px}.feature-scroll-hint{margin-top:15px}}
@media(max-width:760px){.practice-showcase{--feature-header:110px;height:330vh}.feature-pin{padding-block:20px}.feature-layout{grid-template-columns:1fr;gap:12px;align-content:center}.feature-explanation>h2{font-size:var(--body);margin-bottom:16px}.showcase-step-label{margin-bottom:12px}.showcase-panel h3{font-size:var(--title);line-height:1.25;margin-bottom:12px}.showcase-panel p{font-size:var(--body);line-height:1.65;max-width:100%}.feature-navigation{margin-top:16px;gap:10px}.feature-scroll-hint{display:none}.feature-devices{max-width:380px;justify-self:center}.feature-devices .rendered-scene{aspect-ratio:30/23}.feature-devices>p{font-size:var(--small);margin-top:0}}
@media(max-height:620px){.practice-showcase{height:auto}.feature-pin{position:relative;top:0;height:auto;padding-block:50px;overflow:visible}.feature-scroll-hint{display:none}}
@media(prefers-reduced-motion:reduce){.showcase-panel,.app-screen-state{transition:none}}
@media(max-width:760px) and (max-height:760px){.feature-pin{padding-block:16px}.feature-layout{gap:4px}.feature-explanation>h2{font-size:var(--small);margin-bottom:12px}.showcase-step-label{margin-bottom:8px}.showcase-panel h3{margin-bottom:10px}.feature-navigation{margin-top:12px}.feature-devices{max-width:260px}}
/* Separate the quiet introduction from the guided product tour. */
.hero{background:#fff}
.practice-showcase{background:#fff;border-block:1px solid #e6e7e2}
.feature-layout{width:min(1320px,calc(100% - 80px));grid-template-columns:minmax(0,.85fr) minmax(0,1.6fr);gap:24px}
.feature-devices{max-width:none}
.feature-explanation>h2{color:#77816d}
.feature-step{border-color:#c8d1bc;color:#7c896d;background:#ffffff3d}
.feature-step[aria-pressed=true]{background:#303b29;border-color:#303b29;color:#fff}
.feature-scroll-hint,.feature-devices>p{color:#88947c}

.credit-pack strong{display:flex;flex-direction:column;align-items:center;gap:4px}
.credit-unit{display:block;font-size:var(--small);font-weight:var(--regular);letter-spacing:0;color:#849176}
@media(max-width:1050px) and (min-width:761px){.feature-layout{width:calc(100% - 48px);grid-template-columns:minmax(0,.85fr) minmax(0,1.35fr);gap:18px}.showcase-panel h3{font-size:var(--title)}}
@media(max-width:760px){.feature-layout{width:calc(100% - 32px);grid-template-columns:1fr;gap:12px}.feature-devices{max-width:420px}}
@media(max-width:760px) and (max-height:760px){.feature-layout{gap:4px}.feature-devices{max-width:300px}}
/* Language menu */
.locale{position:relative}.language-trigger{display:flex;align-items:center;gap:7px;background:#f0f2ec;border:1px solid #e2e6dc;border-radius:24px;padding:9px 12px;font-size:var(--small)}.language-trigger .icon{width:16px;height:16px}.language-trigger .icon:last-child{width:12px;height:12px}.language-trigger[aria-expanded=true]{background:#e5eadb;border-color:#c6d1b8}.language-menu{position:absolute;right:0;top:calc(100% + 10px);min-width:168px;padding:6px;background:#fff;border:1px solid #e0e5d8;box-shadow:0 14px 35px #22301520;border-radius:16px;z-index:40}.language-menu button{display:flex;width:100%;align-items:center;justify-content:space-between;gap:25px;border-radius:10px;background:none;padding:11px 13px;text-align:left;font-size:var(--small)}.language-menu button:hover,.language-menu button:focus-visible{background:#f0f3ea}.language-menu .icon{width:16px;height:16px;visibility:hidden;color:#718857}.language-menu [aria-checked=true]{background:#eff3e7}.language-menu [aria-checked=true] .icon{visibility:visible}
/* Five-second autoplay: no scroll capture or pinned empty scroll distance. */
.practice-showcase{height:auto}.feature-pin{position:relative;top:0;height:calc(100svh - 76px);min-height:740px;padding-block:60px}.feature-navigation{gap:4px}.feature-step{width:36px;height:44px;border:0;background:none!important;padding:0;display:grid;place-items:center;transition:width .2s}.feature-step[aria-pressed=true]{width:76px}.feature-dot{display:block;width:7px;height:7px;background:#c8d0bf;border-radius:10px;overflow:hidden}.feature-step[aria-pressed=true] .feature-dot{width:58px;height:7px;background:#c8d0bf}.feature-dot i{display:block;width:100%;height:100%;background:#405530;transform:scaleX(var(--fill,0));transform-origin:left center}.feature-playback{display:grid;place-items:center;width:40px;height:40px;border:1px solid #cad3bd;border-radius:50%;background:#ffffff60;margin-left:15px}.feature-playback .icon{width:18px;height:18px}.feature-playback[aria-pressed=true] .autoplay-play,.feature-playback[aria-pressed=false] .autoplay-pause{display:none}.feature-scroll-hint{display:none}
.connection-section{background:#f6f7f2}.connection-section h2{margin:18px 0 22px}.guide-intro{max-width:720px}.connection-tabs{display:flex;gap:8px;margin:35px 0 30px}.connection-tabs button{display:flex;align-items:center;gap:9px;border-radius:26px;padding:12px 22px;background:#e8ecdf;font-size:var(--small)}.connection-tabs [aria-selected=true]{background:#2b3624;color:white}.connection-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;list-style:none;margin:0;padding:0}.connection-steps li{background:#fff;border-radius:22px;padding:29px}.guide-number{color:#91a080;font-size:var(--small)}.connection-steps h3{margin:17px 0;font-size:var(--title);line-height:1.3}.connection-steps p{font-size:var(--body);line-height:1.8}.power-note{margin-top:24px;font-size:var(--small);max-width:850px}.connection-troubles{max-width:900px;margin-top:50px}.connection-troubles>h3{margin-bottom:20px}.guide-reference{margin-top:25px;color:#778869}.download-section{text-align:center}.download-section h2{margin:20px 0 25px}.download-platforms{display:flex;justify-content:center;gap:20px;margin-top:36px;flex-wrap:wrap}.download-platform{display:flex;align-items:center;gap:18px;padding:21px 30px;min-width:250px;border:1px solid #dce1d4;border-radius:18px;background:#f7f8f4;text-align:left}.download-platform img{width:42px;height:42px}.download-platform strong{display:block;font-size:var(--title);font-weight:var(--emphasis)}.download-platform span{display:block;font-size:var(--small);color:#8c9680;margin-top:3px}
@media(max-width:760px){.language-trigger{padding:7px 10px;gap:4px}.language-trigger>.icon:first-child{display:none}.language-menu{min-width:152px}.nav-wrap nav{gap:8px}.feature-pin{height:auto;min-height:calc(100svh - 110px);padding-block:30px}.connection-steps{grid-template-columns:1fr;gap:15px}.connection-steps li{padding:24px}.connection-steps h3{margin:12px 0}.connection-tabs button{padding:11px 16px}.download-platforms{gap:13px}.download-platform{width:100%;max-width:350px;padding:20px 24px}.feature-step{width:32px}.feature-step[aria-pressed=true]{width:65px}.feature-step[aria-pressed=true] .feature-dot{width:50px}.feature-playback{margin-left:10px}.feature-navigation{margin-top:20px}}
@media(prefers-reduced-motion:reduce){.feature-step{transition:none}}
/* Compact pricing entry: the menu targets the heading, not the section's outer padding. */
.plans-section{padding-top:52px}.plans-heading{display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:35px;row-gap:8px;max-width:1000px;margin:0 auto 26px;text-align:left}.plans-heading>.eyebrow{grid-column:1;grid-row:1}.plans-heading h2{grid-column:1;grid-row:2;font-size:var(--title);margin:0;line-height:1.3}.plans-heading h2 br{display:none}.plans-heading>p{grid-column:1;grid-row:3}.plans-heading .billing{grid-column:2;grid-row:1/4;margin:0}.plans{max-width:1000px}.plan-card{padding:28px}.plan-card h3{font-size:var(--body);margin:12px 0 16px;line-height:1.4}.price-foot{margin-top:8px}.checklist{padding-top:16px;margin-top:16px;gap:8px}.checklist li{font-size:var(--small);line-height:1.6}.credits{margin-top:42px}.feature-pin .showcase-panel h3{font-size:var(--section)}
@media(max-width:1050px){.feature-pin .showcase-panel h3{font-size:var(--title)}}
@media(max-width:760px){.plans-section{padding-top:36px}.plans-heading{display:block;margin-bottom:22px;text-align:left}.plans-heading h2{font-size:var(--title);margin:12px 0}.plans-heading .billing{margin-top:19px}.plan-card{padding:25px}.feature-pin .showcase-panel h3{font-size:var(--title)}}

/* Clear credit usage, with no repeated paragraph of conditions. */
.credit-usage{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:1000px;margin:38px auto 0;padding-top:32px;border-top:1px solid #dce1d3}.usage-card{padding:8px 28px}.usage-card+.usage-card{border-left:1px solid #dce1d3}.usage-card h4{font-size:var(--body);letter-spacing:-.02em}.usage-price{display:flex;align-items:center;gap:14px;margin-top:18px;color:var(--ink);line-height:1.1}.usage-price>strong{font-size:var(--section);letter-spacing:-.04em}.usage-price>span{font-size:var(--body)}.usage-price small{display:block;font-size:var(--small);color:var(--muted);margin-top:8px}.usage-assurances{display:flex;justify-content:center;gap:32px;flex-wrap:wrap;margin:30px auto 0;font-size:var(--body);color:#526044}.usage-assurances span{display:flex;align-items:center;gap:8px}.usage-assurances .icon{width:18px;height:18px}.store-note{font-size:var(--small);text-align:center;margin-top:20px}.studio-feature-visual>img{width:100%;height:auto;display:block}.studio-feature-visual{transform:none}.studio-feature{grid-template-columns:.7fr 1.3fr;gap:38px;max-width:1320px;width:calc(100% - 96px)}
@media(max-width:760px){.credit-usage{gap:20px;margin-top:28px;padding-top:24px}.usage-card{padding:0}.usage-card+.usage-card{padding-left:20px}.usage-card h4{font-size:var(--small);line-height:1.5}.usage-price{gap:8px}.usage-price>span{font-size:var(--small)}.usage-assurances{gap:10px;flex-direction:column;margin-top:25px;font-size:var(--small)}.store-note{text-align:left;line-height:1.7}.studio-feature{grid-template-columns:1fr;width:calc(100% - 40px)}}

.nav-login{display:flex;align-items:center;gap:7px;font-size:var(--small);white-space:nowrap;color:#53594b}.nav-login .icon{width:17px;height:17px}.nav-login:hover{color:var(--ink)}
@media(max-width:1000px) and (min-width:761px){.nav-wrap{gap:15px}.nav-wrap nav{gap:17px}.nav-login{gap:5px}}
@media(max-width:760px){.nav-login{margin-left:auto;font-size:var(--small)}.nav-login .icon{display:none}.nav-studio{margin-left:16px}.nav-wrap{column-gap:0}}
.nav-login{background:none;padding:9px 0}

/* Keep the localized wordmark visible in the compact mobile header. */
@media(max-width:760px){.header .brand{font-size:var(--small)}.nav-login{width:28px;flex-shrink:0}.nav-login .icon{display:block}.nav-login [data-auth-label]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.nav-studio{margin-left:8px;padding-inline:8px}.locale{margin-left:8px}.language-trigger{width:32px;height:32px;padding:0;justify-content:center}.language-trigger>span,.language-trigger>.icon:last-child{display:none}.language-trigger>.icon:first-child{display:block}}

.score-help .doc-paragraph h2{font-size:var(--title);margin:0 0 14px;line-height:1.4}.score-help .doc-paragraph{scroll-margin-top:100px}.score-help aside nav{flex-wrap:wrap}.score-help .doc-contact p{margin-top:20px}

.studio-feature-copy .format-help-link,.usage-description .format-help-link{display:inline;color:inherit;text-decoration:underline;text-underline-offset:.18em;text-decoration-thickness:1px}.studio-feature-copy .format-help-link:focus-visible,.usage-description .format-help-link:focus-visible{outline:2px solid currentColor;outline-offset:3px;border-radius:2px}

/* Official store artwork keeps its proportions and original transparent margins. */
.download-platforms{gap:24px;align-items:flex-start}
.download-platform{display:flex;flex-direction:column;align-items:center;gap:8px;width:240px;min-width:0;max-width:100%;padding:0;border:0;border-radius:0;background:transparent;text-align:center}
.store-badge-frame{width:240px;max-width:100%;height:90px;display:flex;align-items:center;justify-content:center}
.download-platform .store-badge{display:block;width:auto;max-width:none;object-fit:contain;flex-shrink:0}
.download-platform .store-badge-apple{height:56px}
.download-platform .store-badge-google{height:83.3333px}
html:lang(ko) .download-platform .store-badge-google,html:lang(ja) .download-platform .store-badge-google{height:72.9167px}
.download-platform>span{font-size:var(--small);color:var(--muted)}
.support-art{width:100%;height:auto;min-height:280px;align-self:center;background:none;justify-self:center}
.support-art img{display:block;width:min(100%,390px);height:auto;object-fit:contain}
@media(max-width:700px){.download-platforms{gap:18px}.download-platform{width:220px}.store-badge-frame{width:220px}.support-art{width:min(100%,290px);min-height:0;justify-self:center}.support-art img{width:100%}}

/* The library and its guide share a compact application shell. */
body[data-page=studio],body[data-page=help]{background:#f7f8f5;min-height:100vh;display:flex;flex-direction:column}
body[data-page=help] .header{background:#ffffffed}
body[data-page=help] .nav-wrap{gap:24px}
body[data-page=help] .nav-wrap nav{margin-left:auto}
body[data-page=studio] .nav-wrap nav a[aria-current],body[data-page=help] .nav-wrap nav a[aria-current]{color:var(--ink);font-weight:600}
.library-footer{margin-top:auto;padding:28px 0 24px;border-top:1px solid #dfe3da}
.library-footer-top,.library-footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px}
.library-footer-top{padding-bottom:18px}.library-footer .brand{font-size:16px}.library-footer .brand img{width:28px;height:28px}
.library-footer nav{display:flex;gap:24px;flex-wrap:wrap;font-size:14px;color:#62685d}.library-footer nav a:hover{text-decoration:underline}
.library-footer-bottom{font-size:13px;color:#878d82}.library-footer-bottom nav{font-size:13px;gap:20px}.library-footer small{font-size:13px;white-space:nowrap}
.library-guide{padding-block:48px 72px}.guide-heading{display:flex;align-items:center;justify-content:space-between;gap:24px}.guide-heading h1{font-size:36px;line-height:1.2}.guide-heading p{font-size:16px;margin-top:10px}
.guide-journey{list-style:none;padding:0;margin:32px 0 48px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.guide-journey li{min-width:0}.guide-journey a{display:block;position:relative;height:100%;padding:22px;border:1px solid #dde3d6;border-radius:16px;background:white;transition:border-color .2s}.guide-journey a:hover{border-color:#7c8b6f}.guide-step-number{font-size:13px;color:#738465;font-weight:600}.guide-journey h2{font-size:19px;margin:18px 0 8px;line-height:1.4;letter-spacing:-.025em}.guide-journey p{font-size:14px;line-height:1.6}.guide-journey .icon{position:absolute;right:20px;top:20px;width:16px;height:16px;color:#78836e}
.guide-content{display:grid;grid-template-columns:220px minmax(0,1fr);gap:48px}.guide-content aside nav{position:sticky;top:110px;display:flex;flex-direction:column;gap:0}.guide-content aside a{font-size:14px;color:#67705f;line-height:1.6;padding:13px 0;border-bottom:1px solid #e0e5da}.guide-content .doc-paragraph{margin:0;padding:28px 0;border-bottom:1px solid #e1e5dc;scroll-margin-top:100px}.guide-content .doc-paragraph:first-child{padding-top:0}.guide-content .doc-paragraph h2{font-size:22px;line-height:1.4;margin-bottom:12px}.guide-content .doc-paragraph p{font-size:16px;line-height:1.85}.guide-end{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:28px}
@media(max-width:760px){.library-footer-top,.library-footer-bottom{align-items:flex-start;gap:18px}.library-footer-bottom{flex-direction:column}.library-footer nav{gap:16px}.library-guide{padding-block:28px 48px}.guide-heading{align-items:flex-start}.guide-heading h1{font-size:28px}.guide-heading .text-link{font-size:14px;white-space:nowrap}.guide-journey{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:24px 0 30px}.guide-journey a{padding:18px}.guide-journey h2{font-size:17px}.guide-content{grid-template-columns:1fr;gap:28px}.guide-content aside nav{position:static;flex-direction:row;flex-wrap:wrap;gap:8px}.guide-content aside a{padding:8px 12px;border:1px solid #dfe5d9;border-radius:8px;background:white;font-size:13px}.guide-content .doc-paragraph h2{font-size:20px}.guide-end{align-items:flex-start;flex-direction:column}}

/* Payments share one row; credit consumption has its own section. */
.plans-heading{max-width:1200px}
.plans-heading .payment-note{display:block;margin-top:6px;color:var(--muted);font-size:14px;line-height:1.6}
.plans.purchase-options{max-width:1200px;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:24px}
.purchase-options .plan-card{min-width:0;padding:30px}
.credit-purchase-caption{font-size:14px;line-height:1.6;color:var(--muted);margin-top:0}
.credit-purchase .credit-packs{grid-template-columns:1fr;gap:0;margin-top:24px}
.credit-purchase .credit-pack{display:grid;grid-template-columns:1fr auto;align-items:center;gap:5px 12px;padding:20px 0;border-radius:0;background:transparent}
.credit-purchase .credit-pack+.credit-pack{border-top:1px solid var(--line)}
.credit-purchase .pack-price{grid-column:1;grid-row:1;color:var(--ink);font-size:16px}
.credit-purchase .credit-pack strong{grid-column:2;grid-row:1;font-size:25px;text-align:right;line-height:1.25;white-space:nowrap}
.credit-purchase .credit-unit{display:inline-block;font-size:12px;font-weight:400;color:var(--muted);margin-left:5px;letter-spacing:0}
.credit-purchase .bonus{grid-column:2;grid-row:2;justify-self:end;font-size:12px;line-height:1.4}
.credit-usage-section{max-width:1200px;margin:40px auto 0;padding-top:30px;border-top:1px solid var(--line)}
.credit-usage-section>h3{font-size:20px;font-weight:600;line-height:1.4;margin:0 0 22px}
.credit-usage-section .credit-usage{max-width:none;margin:0;padding:0;border:0}
.credit-usage-section .usage-card{padding:0 28px 0 0}
.credit-usage-section .usage-card+.usage-card{padding-left:28px}
.credit-usage-section .usage-price>strong{font-size:40px}
@media(max-width:1000px){.plans.purchase-options{gap:16px}.purchase-options .plan-card{padding:24px}.credit-purchase .credit-pack strong{font-size:22px}.credit-purchase .pack-price{font-size:14px}}
@media(max-width:760px){.plans.purchase-options{grid-template-columns:1fr;max-width:460px;gap:18px}.purchase-options .plan-card{padding:28px}.plans-heading .payment-note{font-size:13px}.credit-usage-section{margin-top:30px;padding-top:24px}.credit-usage-section .credit-usage{grid-template-columns:1fr;gap:24px}.credit-usage-section .usage-card{padding:0}.credit-usage-section .usage-card+.usage-card{border-left:0;border-top:1px solid var(--line);padding:24px 0 0}.credit-usage-section .usage-price>strong{font-size:36px}.credit-usage-section>h3{font-size:18px}}

/* Explain the benefit and charge conditions next to each credit use. */
.credit-usage-section .usage-card{display:grid;grid-template-rows:auto 1fr auto auto;align-content:start}
.credit-usage-section .usage-card h4{margin:0}
.usage-description{font-size:16px;line-height:1.75;color:var(--muted);margin:12px 0 0;max-width:560px;word-break:keep-all;overflow-wrap:anywhere}
.usage-note{font-size:13px;line-height:1.75;color:var(--muted);margin:16px 0 0;max-width:560px;word-break:keep-all;overflow-wrap:anywhere}
@media(max-width:760px){.usage-description{font-size:15px}.usage-note{font-size:13px}}

/* Keep FAQ and downloads close, with a single clear download heading. */
.faq-section{padding-bottom:48px}
.download-section{padding-top:48px}
.download-section h2{margin-top:0}
@media(max-width:760px){.faq-section{padding-bottom:28px}.download-section{padding-top:32px}}
.beta-home-access{display:grid;gap:10px;width:min(100%,680px);margin:28px auto 0;padding:20px 22px;border:1px solid #dce3d5;border-radius:14px;background:#f6f8f3;text-align:left}.beta-home-access-heading{display:flex;align-items:center;justify-content:space-between;gap:14px}.beta-home-access-heading span{color:#697562;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}.beta-home-access-heading strong{color:#40533a;font-size:14px}.beta-home-access>p{color:#626a5b;font-size:14px;line-height:1.65}.beta-home-access>small{color:#737c6d;font-size:13px;overflow-wrap:anywhere}.beta-home-access-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:3px}.beta-home-access-actions a{font-size:14px}@media(max-width:600px){.beta-home-access{padding:18px}.beta-home-access-heading{align-items:flex-start;flex-direction:column;gap:5px}.beta-home-access-actions{align-items:stretch;flex-direction:column}.beta-home-access-actions .button{width:100%}}

/* One shared footer on every page, at the bottom of short pages too. */
body{min-height:100vh;display:flex;flex-direction:column}
body>.header,body>.site-footer{flex-shrink:0}
body>main{flex:1 0 auto}
.site-footer{background:var(--paper);margin-top:auto;padding-top:32px}
.footer-links a{white-space:nowrap}

/* Billing belongs to the subscription card. */
.subscription-plan-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.subscription-plan-header>.eyebrow{padding-top:9px}
.subscription-plan-header .billing{margin:0 0 0 auto;padding:4px;flex-shrink:0}
.subscription-plan-header .billing button{font-size:14px;line-height:1.4;padding:7px 10px;white-space:nowrap}
.subscription-plan-header .billing button span{margin-left:5px}
.credit-purchase .credit-pack-amount{display:flex;align-items:baseline;justify-content:flex-end;gap:7px;white-space:nowrap}
.credit-purchase .credit-pack-amount .bonus{background:none;padding:0;font-size:14px}
.credit-purchase .credit-pack-amount strong{font-size:22px}
.credit-purchase .credit-pack-amount .credit-unit{font-size:14px}
@media(min-width:761px) and (max-width:1100px){.credit-purchase .credit-pack{grid-template-columns:1fr;gap:8px}.credit-purchase .credit-pack-amount{justify-content:flex-start}}
.credit-purchase .credit-pack-amount strong{display:inline;flex-direction:row;white-space:nowrap}
.credit-purchase .credit-pack-amount strong .credit-unit{display:inline;font-size:14px;margin-left:5px}
.subscription-plan-header .billing button{color:var(--ink)}

.subscription-credit-note{margin-top:20px;padding-top:16px;border-top:1px solid #4d5b43;color:#b1c0a3;font-size:14px;line-height:1.7;word-break:keep-all}

.help-hub{max-width:1100px;min-height:65vh;padding-block:70px 100px}.help-hub header{margin-bottom:36px}.help-hub h1{font-size:var(--section);line-height:1.2;margin-bottom:18px}.help-hub header p{font-size:var(--body);line-height:1.7;color:var(--muted)}.help-topics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.help-topic{display:flex;flex-direction:column;align-items:flex-start;padding:36px;background:#fff;border:1px solid var(--line);border-radius:24px;transition:border-color .2s,transform .2s}.help-topic:hover{border-color:#829573;transform:translateY(-3px)}.help-topic-icon{display:grid;place-items:center;width:56px;height:56px;border-radius:16px;background:#edf1e7;color:#617451;margin-bottom:26px}.help-topic-icon .icon{width:28px;height:28px}.help-topic h2{font-size:var(--title);line-height:1.4;margin:0 0 14px}.help-topic p{font-size:var(--body);line-height:1.8;color:var(--muted);margin-bottom:30px}.help-topic-action{display:inline-flex;align-items:center;gap:10px;margin-top:auto;font-size:16px;font-weight:600;color:#4c603e}.help-topic-action .icon{width:18px;height:18px}@media(max-width:760px){.help-hub{padding-block:40px 65px}.help-topics{grid-template-columns:1fr;gap:18px}.help-topic{padding:28px}.help-topic h2{font-size:24px}.help-topic p{font-size:17px}.help-topic-icon{margin-bottom:20px}}
.help-topic p{word-break:keep-all;overflow-wrap:break-word}

.site-footer{padding-top:0}.footer-minimal{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:28px;border-top:1px solid var(--line)}.footer-minimal small{font-size:14px;line-height:1.6;color:var(--muted)}.footer-legal{display:flex;align-items:center;gap:24px;font-size:14px;color:#65715a}.footer-legal a{white-space:nowrap}.footer-legal a:hover{text-decoration:underline;text-underline-offset:4px}@media(max-width:760px){.footer-minimal{flex-direction:column;align-items:flex-start;gap:16px;padding-block:24px}.footer-legal{gap:20px;flex-wrap:wrap}}
/* Golden-hour grand piano with Hello Piano on a 13-inch iPad Pro. */
.support-banner.support-grand{position:relative;isolation:isolate;display:flex;min-height:530px;padding:60px;align-items:center;background:#36291c;color:#fff}
.support-grand .support-art{position:absolute;inset:0;z-index:-2;width:100%;height:100%;min-height:0}
.support-grand .support-art img{width:100%;height:100%;object-fit:cover;object-position:center}
.support-grand:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#17120ee6 0%,#17120eb3 29%,#17120e33 52%,transparent 70%)}
.support-grand .support-copy{width:43%;max-width:480px;position:relative}
.support-grand .support-copy h2{font-size:clamp(32px,3.5vw,48px);line-height:1.25;color:#fff}
.support-grand .support-copy p,.support-grand .eyebrow{color:#eee5d7}
.support-grand .support-copy .button{background:#f7f0e2;color:#29241e}
@media(max-width:760px){.support-banner.support-grand{display:flex;min-height:640px;padding:30px;align-items:flex-start}.support-grand .support-copy{width:100%;max-width:none}.support-grand .support-copy h2{font-size:34px}.support-grand .support-art img{object-position:68% bottom}.support-grand:after{background:linear-gradient(180deg,#17120ef2 0%,#17120ed9 33%,#17120e33 58%,transparent 75%)}.support-grand .support-copy p{max-width:290px;font-size:15px}}
@media(max-width:760px){.support-banner.support-grand{flex-direction:column;min-height:0;padding:0;gap:0;background:#282019}.support-grand .support-copy{padding:30px}.support-grand .support-art{position:relative;inset:auto;z-index:0;width:100%;height:auto;aspect-ratio:1862/846;align-self:stretch}.support-grand .support-art img{width:100%;height:100%;object-fit:contain;object-position:center}.support-grand:after{display:none}}

/* Public learning content: readable articles, visible source material, and mobile navigation. */
.header .nav-wrap nav{gap:clamp(10px,1.4vw,22px)}
.header .nav-wrap nav a{white-space:nowrap}
.header .nav-wrap nav a[aria-current=page]{color:#334a2a;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.public-guides .guide-group{margin-top:44px}
.public-guides .guide-group>h2{font-size:28px;margin-bottom:22px}
.public-guides .help-topic h3,.featured-guides .help-topic h3,.guide-related .help-topic h3{font-size:24px;line-height:1.4;margin:0 0 12px}
.featured-guides{padding-block:64px}
.featured-guides>header{max-width:760px;margin-bottom:30px}
.featured-guides>header h2{font-size:36px;line-height:1.3;margin:10px 0 16px}
.featured-guides .help-topics{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.featured-guides .help-topic{padding:26px}
.featured-guides>.text-link{margin-top:24px}
.guide-editorial{display:flex;flex-wrap:wrap;gap:8px 24px;margin:24px 0 0;padding-bottom:22px;border-bottom:1px solid var(--line);font-size:14px;color:#62675c}
.public-guide .guide-content{grid-template-columns:230px minmax(0,1fr);gap:44px;margin-top:32px}
.public-guide .doc,.public-guide .doc-paragraph>div{min-width:0}
.public-guide .doc-paragraph{scroll-margin-top:150px}
.public-guide .doc-paragraph p{line-height:1.9;color:#4b5047}
.public-guide .doc-paragraph p+p{margin-top:16px}
.public-guide .doc-paragraph li{font-size:16px;line-height:1.8}
.public-guide .guide-content aside nav{top:105px;max-height:calc(100vh - 130px);overflow:auto}
.public-guide .guide-content aside strong{font-size:14px;margin-bottom:8px}
.public-guide .guide-content aside a{font-size:14px;line-height:1.5}
.public-guide .guide-end{flex-wrap:wrap;gap:16px}
.public-guide .guide-end a,.guide-feedback a{overflow-wrap:anywhere}
.guide-score{margin:0 0 36px;padding:18px;border:1px solid var(--line);border-radius:16px;background:#fff}
.guide-score img{display:block;width:100%;height:auto}
.guide-score figcaption{font-size:14px;line-height:1.7;color:#62675c;margin-top:14px}
.guide-feedback{margin-top:32px;padding:24px;background:#f3f5ef;border-radius:14px}
.guide-feedback p{font-size:16px;margin-bottom:10px}
.guide-related{border-top:1px solid var(--line);margin-top:40px;padding-top:32px}
.guide-related>h2{font-size:24px;margin-bottom:18px}
.guide-related .help-topic{padding:22px;border-radius:16px}
.guide-related .help-topic h3{font-size:20px}
.guide-related .help-topic p{font-size:16px}
.guide-related .help-topic-icon{width:40px;height:40px;margin-bottom:16px}
@media(min-width:761px) and (max-width:1200px){.header .nav-wrap{gap:14px}.header .nav-wrap nav{gap:12px}.header .brand{font-size:16px}.header .nav-studio{padding-inline:10px}}
@media(max-width:900px){.public-guide .guide-content{grid-template-columns:1fr;gap:28px}.public-guide .guide-content aside nav{position:static;max-height:none;display:flex;flex-direction:row;flex-wrap:wrap;gap:8px}.public-guide .guide-content aside strong{width:100%}.public-guide .guide-content aside a{padding:8px 12px;border:1px solid var(--line);border-radius:8px}.featured-guides .help-topics{grid-template-columns:1fr}}
@media(max-width:760px){.header .nav-wrap nav{justify-content:flex-start;overflow-x:auto;white-space:nowrap;gap:22px;min-width:0;max-width:100%;padding-bottom:5px}.header .nav-wrap nav a{flex-shrink:0}.featured-guides{padding-block:40px}.featured-guides>header h2{font-size:28px}.public-guide .guide-heading{flex-direction:column;gap:14px;align-items:flex-start}.public-guide .guide-heading h1{overflow-wrap:anywhere}.guide-editorial{margin-top:18px}.public-guide .doc-paragraph{grid-template-columns:24px minmax(0,1fr);gap:12px}.public-guide .doc-paragraph h2{font-size:23px}.guide-score{padding:10px}.guide-related .help-topics{grid-template-columns:1fr}.public-guides .help-topic h3{font-size:23px}}
.public-guides .help-topics,.guide-related .help-topics{grid-template-columns:repeat(2,minmax(0,1fr))}
.public-guides .help-topic,.featured-guides .help-topic,.guide-related .help-topic{min-width:0}
.public-guides .help-topic h3,.featured-guides .help-topic h3,.guide-related .help-topic h3,.public-guide .doc-paragraph h2{overflow-wrap:anywhere}
html:lang(ja) .public-guides .help-topic p,html:lang(ja) .featured-guides .help-topic p,html:lang(ja) .guide-related .help-topic p{word-break:normal;overflow-wrap:anywhere}
@media(max-width:760px){.public-guides .help-topics,.guide-related .help-topics{grid-template-columns:minmax(0,1fr)}}
/* At tablet widths, keep the language switch and account controls in view. */
@media(min-width:761px) and (max-width:1050px){
 html{scroll-padding-top:120px}
 .header{height:auto}
 .header .nav-wrap{height:auto;display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;align-items:center;gap:0 16px;padding-top:12px}
 .header .brand{grid-column:1;grid-row:1;justify-self:start}
 .header .nav-login{grid-column:2;grid-row:1}
 .header .nav-studio{grid-column:3;grid-row:1}
 .header .locale{grid-column:4;grid-row:1}
 .header .nav-wrap nav{grid-column:1/-1;grid-row:2;min-width:0;max-width:100%;width:100%;margin:8px 0 0;gap:18px;overflow-x:auto;border-top:1px solid var(--line)}
 .header .nav-wrap nav a{flex:none;padding:9px 0}
}
/* Three top-level destinations; native disclosures work with keyboard and without JS. */
.header .nav-wrap nav.primary-nav{overflow:visible;white-space:normal;align-items:center;gap:clamp(14px,2vw,28px)}
.primary-nav .nav-group{position:relative;border:0}
.primary-nav summary{display:flex;justify-content:flex-start;padding:0;align-items:center;gap:5px;min-height:40px;cursor:pointer;list-style:none;color:#676a62;font:inherit;white-space:nowrap}
.primary-nav summary::-webkit-details-marker{display:none}
.primary-nav summary .icon{width:13px;height:13px}.primary-nav details[open]>summary .icon{transform:rotate(180deg)}
.primary-nav .nav-section-active>summary,.primary-nav details[open]>summary{color:#334a2a}
.primary-nav summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.primary-nav .nav-submenu{position:absolute;z-index:2;top:100%;left:0;min-width:155px;padding:6px;background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:0 6px 18px #20211f16}
.header .primary-nav .nav-submenu a{display:block;padding:9px 12px;line-height:1.5;border-radius:6px;white-space:nowrap}
.header .primary-nav .nav-submenu a:hover,.header .primary-nav .nav-submenu a:focus-visible{background:var(--soft);color:var(--ink)}
@media(max-width:760px){.header .nav-wrap nav.primary-nav{justify-content:space-between;margin-top:8px;padding-top:2px;padding-bottom:0}.primary-nav .nav-group:last-child>.nav-submenu{inset-inline-start:auto;inset-inline-end:0}}
