@font-face{font-family:IrohaFallback;src:url('/blog/research/assets/fonts/regular.woff2') format('woff2');font-weight:400 600;font-display:swap}
@font-face{font-family:IrohaFallback;src:url('/blog/research/assets/fonts/bold.woff2') format('woff2');font-weight:700 900;font-display:swap}
:root{--ink:#142d49;--blue:#176c9d;--sky:#2daee0;--mist:#edf7fb;--paper:#fafdff;--accent:#136ca4;--accent-hover:#0d527e;--muted:#577185;--line:#d5e5f0;--font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Arial,"PingFang SC","Hiragino Sans","Microsoft YaHei",IrohaFallback,sans-serif}
:lang(ja){--font:-apple-system,BlinkMacSystemFont,"SF Pro JP","Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP",IrohaFallback,sans-serif}
:lang(zh){--font:-apple-system,BlinkMacSystemFont,"SF Pro SC","PingFang SC","Microsoft YaHei",IrohaFallback,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:116px;-webkit-text-size-adjust:100%;text-size-adjust:100%;font-synthesis:none}body{margin:0;background:var(--paper);color:var(--ink);font:500 18px/1.85 var(--font);-webkit-font-smoothing:antialiased}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:700;text-wrap:balance}a{color:var(--accent);text-underline-offset:5px}a:hover{color:var(--accent-hover)}button,input{font:inherit}button{cursor:pointer}::selection{background:#cbe9fa}a:focus-visible,button:focus-visible,[tabindex]:focus-visible,audio:focus-visible{outline:2px solid var(--accent);outline-offset:5px}.blog-skip{position:fixed;top:-90px;left:20px;z-index:100;background:white;padding:12px 20px}.blog-skip:focus{top:12px}
.studio-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:36px;min-height:88px;padding:14px max(28px,calc((100vw - 1320px)/2));background:rgba(250,253,255,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.studio-brand{display:flex;align-items:center;gap:9px;color:var(--ink);text-decoration:none;flex-shrink:0}.studio-mark{width:52px;height:52px;object-fit:contain}.studio-wordmark{width:112px;height:46px;object-fit:contain;mix-blend-mode:multiply}.studio-brand>span{font-size:17px;font-weight:700;letter-spacing:.02em}.studio-nav{display:flex;align-items:center;gap:28px;margin-left:auto}.studio-nav a{font-size:15px;font-weight:600;text-decoration:none;color:var(--ink);white-space:nowrap}.studio-nav a.current{color:var(--accent)}.blog-languages{display:flex;align-items:center;gap:12px}.blog-languages a{font-size:14px;font-weight:600;text-decoration:none;white-space:nowrap;color:var(--muted)}.blog-languages a[aria-current]{color:var(--ink);text-decoration:underline;text-decoration-color:var(--sky);text-decoration-thickness:2px}
.article-hero{border-bottom:1px solid var(--line);background-image:linear-gradient(90deg,rgba(250,253,255,.98) 0%,rgba(250,253,255,.88) 42%,rgba(250,253,255,.3) 100%),url('/assets/sky-observatory.png');background-size:cover;background-position:center 18%}.article-hero-inner{max-width:1248px;margin:auto;padding:58px 28px 52px}.article-eyebrow{font-size:14px;font-weight:600;text-decoration:none;display:inline-flex;gap:15px;align-items:center;margin-bottom:22px}.article-eyebrow span{color:#8caabd}.article-hero h1{font-size:clamp(30px,3.1vw,46px);line-height:1.4;letter-spacing:-.025em;max-width:900px}.article-lead{max-width:780px;margin-top:25px;font-size:19px;line-height:1.9}.article-lead strong{font-weight:500}.article-byline{font-size:14px;margin-top:22px;color:var(--muted)}.article-actions{margin-top:22px;font-size:15px;font-weight:600}.article-actions p{display:flex;flex-wrap:wrap;align-items:center;gap:9px}
.reading-layout{display:grid;grid-template-columns:minmax(0,850px) minmax(180px,240px);gap:70px;max-width:1248px;margin:auto;padding:64px 28px 96px}.release-prose{min-width:0;overflow-wrap:anywhere}.release-prose h2{font-size:30px;line-height:1.5;letter-spacing:-.02em;margin:0 0 24px}.release-prose h3{font-size:22px;line-height:1.6;margin:38px 0 18px}.release-prose p{margin:0 0 24px}.release-prose p small{display:block;font-size:14px;line-height:1.9;color:var(--muted);margin-top:-2px}.release-prose strong{font-weight:700}.release-prose ul{padding-left:24px;margin:20px 0 30px}.release-prose li{padding-left:3px;margin:14px 0}.release-prose hr{border:0;border-top:1px solid var(--line);margin:52px 0}.release-prose code{font:500 .85em/1.7 "SFMono-Regular",Consolas,monospace;color:#0d527e;background:#eaf4fa;padding:.15em .35em;border-radius:3px;overflow-wrap:anywhere}.release-prose pre{overflow-x:auto;background:#edf6fc;border:1px solid var(--line);border-radius:6px;padding:24px;margin:28px 0;line-height:1.8;max-width:100%;tab-size:2}.release-prose pre code{padding:0;background:none;font-size:14px;white-space:pre;overflow-wrap:normal;color:var(--ink)}.table-scroll{max-width:100%;overflow-x:auto;margin:26px 0;border-top:2px solid var(--blue);border-bottom:1px solid var(--line)}.table-scroll table{border-collapse:collapse;min-width:100%;font-size:14px;line-height:1.8;font-variant-numeric:tabular-nums}.table-scroll th,.table-scroll td{padding:16px 14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top;min-width:90px}.table-scroll th{font-weight:600;background:var(--mist)}.table-scroll th:first-child{min-width:165px}.table-scroll tbody tr:first-child{background:#eef8fd}.table-scroll tbody tr:last-child>*{border-bottom:none}.table-scroll table:has(th:nth-child(6)){min-width:760px}.table-scroll table:has(th:nth-child(4)):not(:has(th:nth-child(5))){min-width:600px}.table-scroll table:not(:has(th:nth-child(4))) th:first-child{min-width:40px}.table-scroll table:not(:has(th:nth-child(4))) td:last-child{min-width:260px}
.article-toc nav{position:sticky;top:124px;border-left:1px solid var(--line);padding-left:22px}.article-toc p{font-size:14px;font-weight:700;margin-bottom:20px}.article-toc a{display:block;font-size:14px;line-height:1.7;margin:15px 0;text-decoration:none;color:var(--muted)}.article-toc a:hover{color:var(--accent)}.article-source{border-top:1px solid var(--line);padding-top:28px;margin-top:45px;font-size:14px}.next-article{display:block;margin-top:44px;padding:30px 0;border-top:1px solid var(--line);text-decoration:none;color:var(--ink)}.next-article>span{font-size:14px;color:var(--accent);font-weight:600}.next-article h2{font-size:26px;margin:14px 0}.next-article p{color:var(--muted);font-size:16px;margin:0}.studio-footer{display:flex;align-items:center;gap:32px;border-top:1px solid var(--line);padding:36px max(28px,calc((100vw - 1192px)/2));font-size:14px;flex-wrap:wrap}.studio-footer>p{color:var(--muted)}.studio-footer>a:last-child{margin-left:auto;white-space:nowrap}
.release-demo{padding:30px 26px;border:1px solid var(--line);border-radius:6px;background:linear-gradient(135deg,#edf7fb,#fafdff);margin:0 0 52px}.release-demo h2{font-size:26px;margin-bottom:15px}.release-demo>p{font-size:15px;color:var(--muted);margin-bottom:22px}.sample-tabs{display:flex;gap:6px;padding-bottom:20px;flex-wrap:wrap}.sample-tabs button{padding:10px 18px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);font-size:15px;font-weight:600;min-height:44px}.sample-tabs button[aria-selected=true]{background:var(--accent);color:#fff;border-color:var(--accent)}.sample-line{font-size:18px;line-height:1.8;margin-bottom:10px!important}.sample-translation{font-size:14px;color:var(--muted)}.release-players{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin-top:25px}.release-player{min-width:0}.release-player h3{margin:0 0 10px;font-size:15px}.release-player audio{width:100%;display:block;height:46px}.audio-file{font-size:13px;display:inline-block;margin-top:10px}.more-samples{display:inline-block;font-size:15px;margin-top:25px;font-weight:600}.audio-error{font-size:14px!important;color:#8c3b39!important;margin:18px 0!important}
@media(min-width:1600px){.article-hero{background-position:center 24%}}
@media(max-width:1100px){.studio-header{gap:22px}.studio-nav{gap:18px}.studio-brand>span{display:none}.reading-layout{gap:35px;grid-template-columns:minmax(0,1fr) 190px}}
@media(max-width:800px){html{scroll-padding-top:105px}.studio-header{min-height:78px;padding:12px 22px;gap:16px}.studio-nav{display:none}.blog-languages{margin-left:auto}.studio-mark{width:42px;height:42px}.studio-wordmark{width:92px;height:40px}.studio-brand{gap:5px}.reading-layout{display:block;padding:40px 24px 64px}.article-toc{display:none}.article-hero-inner{padding:38px 24px}.article-hero{background-position:62% center;background-image:linear-gradient(90deg,rgba(250,253,255,.96),rgba(250,253,255,.74)),url('/assets/sky-observatory.png')}.article-lead{font-size:17px}.release-prose{font-size:17px}.release-prose h2{font-size:27px}.release-prose h3{font-size:21px}.studio-footer{padding:30px 24px;gap:20px}.studio-footer>p{flex-basis:100%}.studio-footer>a:last-child{margin-left:0}}
@media(max-width:540px){.studio-header{padding:10px 16px;gap:12px}.studio-mark{width:34px;height:38px}.studio-wordmark{width:76px;height:34px}.blog-languages{gap:9px}.blog-languages a{font-size:12px}.reading-layout{padding:34px 20px 55px}.article-hero-inner{padding:32px 20px}.article-hero h1{font-size:29px;line-height:1.5}.article-actions{font-size:14px}.article-actions p{gap:7px}.release-prose h2{font-size:25px}.release-prose pre{padding:18px}.release-prose hr{margin:38px 0}.release-demo{padding:24px 16px}.release-demo h2{font-size:23px}.release-players{grid-template-columns:1fr;gap:24px}.sample-tabs{gap:5px}.sample-tabs button{flex:1;padding:9px 7px;font-size:14px}.table-scroll th,.table-scroll td{padding:12px}.studio-footer .studio-brand>span{display:inline}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.mobile-toc{display:none}
@media(max-width:800px){
  html{scroll-padding-top:132px}
  .studio-header{flex-wrap:wrap;gap:0 12px;padding:8px max(16px,env(safe-area-inset-left)) 0;min-height:0}
  .studio-header .studio-brand{min-height:44px}
  .blog-languages{gap:2px}
  .blog-languages a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 5px;font-size:13px}
  .studio-nav{display:flex;order:3;flex:0 0 100%;min-width:0;gap:24px;margin:0;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin}
  .studio-nav a{display:flex;align-items:center;min-height:44px;font-size:14px}
  .article-actions a{display:inline-flex;align-items:center;min-height:44px}
  .mobile-toc{display:block;margin:0 0 32px;border-block:1px solid var(--line);font-size:15px}
  .mobile-toc summary{min-height:48px;padding:10px 0;font-weight:600;cursor:pointer}
  .mobile-toc nav{display:grid;padding:0 0 12px}
  .mobile-toc a{display:flex;align-items:center;min-height:44px;text-decoration:none;padding:7px 0;line-height:1.6}
  .release-prose pre{font-size:14px}
  .table-scroll{overscroll-behavior-x:contain;scrollbar-width:thin}
  .table-scroll th:first-child,.table-scroll td:first-child{position:sticky;left:0;z-index:1;background:var(--paper);box-shadow:1px 0 var(--line)}
  .table-scroll thead th:first-child{background:var(--mist)}
  .table-scroll tbody tr:first-child td:first-child{background:#eef8fd}
  .sample-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .sample-tabs button{min-height:48px}
  .audio-file,.more-samples,.article-source a,.studio-footer>a:last-child{display:inline-flex;align-items:center;min-height:44px}
}
@media(max-width:540px){
  .studio-header .studio-mark{width:32px;height:38px}
  .studio-header .studio-wordmark{width:64px;height:34px}
  .studio-header .studio-brand{gap:4px}
  .article-lead{font-size:16px}
}

.release-videos{max-width:1248px;margin:auto;padding:48px 28px 0}.release-videos>h2{font-size:30px;margin-bottom:24px}.release-film-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}.release-film{min-width:0;scroll-margin-top:120px}.release-film video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#142d49;border-radius:6px}.film-meta{display:flex;justify-content:space-between;gap:16px;font-size:14px;color:var(--muted);margin:16px 0 8px}.release-film h3{font-size:24px;line-height:1.5;margin-bottom:12px}.release-film p{font-size:16px;margin-bottom:14px}.release-film>a{display:inline-flex;align-items:center;min-height:44px;font-size:14px}.film-credits{margin-top:26px;font-size:14px;color:var(--muted)}.film-credits summary{cursor:pointer}.film-credits p{margin-top:12px}.journal-index{max-width:1248px;min-height:65vh;margin:auto;padding:58px 28px 80px}.journal-index>h1{font-size:38px;margin-bottom:40px}.journal-entry{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center}.journal-image img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:6px}.journal-entry h2{font-size:28px;line-height:1.5;margin-bottom:16px}.journal-entry h2 a{text-decoration:none;color:var(--ink)}.journal-entry .article-eyebrow{margin-bottom:12px}.journal-entry .article-byline{margin:0 0 18px}.journal-entry p:not([class]){font-size:17px;margin-bottom:20px}
@media(max-width:800px){.release-videos{padding:34px 24px 0}.release-film-grid,.journal-entry{grid-template-columns:1fr;gap:32px}.release-film h3{font-size:23px}.journal-index{padding:38px 24px 60px}.journal-index>h1{font-size:30px}.journal-entry h2{font-size:25px}}
@media(max-width:540px){.release-videos{padding-inline:20px}.release-videos>h2{font-size:25px}.journal-index{padding-inline:20px}}

/* Resource bars: official HF identity and Iroha's listening mascot. */
.release-resources{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin:12px 0 14px}.article-actions .resource-bar{display:flex;align-items:center;gap:14px;min-height:76px;width:280px;max-width:100%;padding:8px 18px 8px 10px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#111827;text-decoration:none;box-shadow:0 1px 2px #0000000d}.article-actions .resource-bar:hover{color:#111827;border-color:#9ca3af;background:#f9fafb}.resource-icon{display:grid;place-items:center;align-self:stretch;flex:0 0 58px;border-radius:5px;background:#fff8d8}.resource-icon img{display:block}.resource-label{display:flex;flex-direction:column;gap:3px;min-width:0;line-height:1.3}.resource-label strong{font-size:18px;font-weight:700}.resource-label small{font-size:12px;font-weight:500;color:#6b7280}.article-actions .resource-listen{position:relative;border-color:#b5d6e8;background:#edf7ff;padding-left:92px;color:var(--ink)}.article-actions .resource-listen:hover{border-color:#6ba3c4;background:#e3f2fc;color:var(--ink)}.listening-mascot{position:absolute;left:2px;bottom:0;width:88px;height:88px;object-fit:contain}.resource-play{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;margin-left:auto;border-radius:50%;background:var(--ink);color:#fff;font-size:12px;padding-left:2px}.article-actions .release-secondary-links{font-size:14px;margin:0;gap:10px}.release-secondary-links a{min-height:36px;display:inline-flex;align-items:center}
@media(max-width:540px){.release-resources{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;max-width:340px}.article-actions .resource-bar{width:100%;min-height:76px}.resource-label strong{font-size:17px}.article-actions .release-secondary-links{gap:8px;font-size:13px}}

@media(max-width:540px){.listening-mascot{width:76px;height:76px;left:6px}}

.studio-brand .studios-wordmark{display:block;width:112px;height:46px;object-fit:contain;mix-blend-mode:multiply}
/* Native video controls and a single column work in both phone orientations. */
.release-film video{max-width:100%;object-fit:contain;touch-action:manipulation}
.release-film video:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.film-meta>:last-child{flex-shrink:0;font-variant-numeric:tabular-nums}
@media(max-width:1024px){.release-film-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:1024px) and (max-height:500px) and (orientation:landscape){
  .release-film video{max-width:calc((100vh - 128px) * 16 / 9);max-width:calc((100svh - 128px) * 16 / 9);margin-inline:auto}
  .release-videos{padding-inline:max(24px,env(safe-area-inset-left)) max(24px,env(safe-area-inset-right))}
}

.studio-wordmark + span{margin-inline-start:-20px}

@media(min-width:1101px){.studio-wordmark + span{margin-inline-start:-30px}}

/* Audio demos: real sample peaks, with native controls as the no-JS fallback. */
.release-player{padding:20px;background:#fff;border:1px solid var(--line);border-radius:16px;transition:border-color .18s,box-shadow .18s}
.release-player h3{font-size:14px;margin:0 0 20px;line-height:1.5;min-height:21px}
.release-player.is-playing{border-color:#79afcb;box-shadow:0 3px 16px #142d4909}
.release-player.is-enhanced audio{display:none}
.wave-player{display:flex;align-items:center;gap:14px}
.wave-toggle{width:48px;height:48px;flex:none;padding:12px;border:1px solid var(--ink);border-radius:50%;display:grid;place-items:center;background:var(--ink);color:white;transition:background .18s,transform .18s}
.wave-toggle:hover{background:var(--accent);border-color:var(--accent)}
.wave-toggle:active{transform:scale(.95)}
.wave-toggle svg{width:22px;height:22px;fill:currentColor}
.wave-timeline{flex:1;min-width:0}
.wave-seek{height:44px;position:relative;border-radius:4px}
.wave-bars{position:absolute;inset:4px 0;display:flex;align-items:center;gap:2px;pointer-events:none}
.wave-bars span{flex:1;min-width:1px;background:#c8d9e4;border-radius:3px}
.wave-bars span.played{background:var(--accent)}
.wave-seek input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;touch-action:pan-y}
.wave-seek:focus-within{outline:2px solid var(--accent);outline-offset:4px}
.wave-time{display:flex;justify-content:space-between;font-size:11px;font-weight:500;line-height:1.5;font-variant-numeric:tabular-nums;color:var(--muted);margin-top:4px}
.release-player .audio-file{font-size:12px;margin-top:16px;text-decoration:none;line-height:1.5;min-height:24px;display:inline-flex;align-items:center;border-bottom:1px solid var(--line)}
.release-player .audio-file:hover{border-color:var(--accent)}
.release-player.is-loading .wave-toggle{outline:3px solid #c4e4f4;outline-offset:3px}
@media(max-width:1100px) and (min-width:801px){.release-players{grid-template-columns:1fr}}
@media(max-width:540px){.release-player{padding:18px 16px}.release-players{gap:12px}.wave-player{gap:12px}.wave-bars{gap:1px}}
@media(prefers-reduced-motion:reduce){.release-player,.wave-toggle{transition:none}}