/* Character-first v0.4. Only brand-base.html opts in; saved studies stay unchanged. */
html[data-character-first] .header .main-navigation{gap:38px}
html[data-character-first] .story{padding-bottom:155px}
html[data-character-first] .story-content{gap:7%;grid-template-columns:1.1fr 1fr}
html[data-character-first] .story-copy{max-width:540px}
html[data-character-first] .story-copy .small{font-size:17px;line-height:1.95;letter-spacing:0}
html[data-character-first] .story-copy>p:first-of-type{font-weight:700;line-height:1.75;letter-spacing:0}
/* Earlier heading-only adjustment; brand-rhythm.css now supplies the current white-text surface.
   Sunny introduction: white display type, black small copy on the original red.
   #FFFFFF/#E53B32 = 4.20:1 for large/bold text; #000000/#E53B32 = 5.00:1.
   Keep this local to the current page and sunny scheme; studies are immutable. */
html[data-character-first][data-colour-07="sunny"] .story h2,
html[data-character-first][data-colour-07="sunny"] .story-copy>.jp-heading,
html[data-character-first][data-colour-07="sunny"] .story-copy>p:first-of-type,
html[data-character-first][data-colour-07="sunny"] .meet-facts h3,
html[data-character-first][data-colour-07="sunny"] .meet-portrait figcaption b,
html[data-character-first][data-colour-07="sunny"] .little-star{color:#fff}
html[data-character-first][data-colour-07="sunny"] .story-copy>p:first-of-type{font-size:clamp(20px,1.6vw,25px)}
html[data-character-first][data-colour-07="sunny"] .meet-details,
html[data-character-first][data-colour-07="sunny"] .meet-facts article{border-color:#ffffff80}
html[data-character-first][data-colour-07="sunny"] .meet-next{background:#fff;color:#181818;border-radius:999px;padding:12px 18px 12px 24px}
html[data-character-first][data-colour-07="sunny"] .meet-next:focus-visible{outline:3px solid #fff;outline-offset:5px}
.meet-details{border-top:1px solid currentColor;margin-top:78px;padding-top:45px;display:grid;grid-template-columns:1fr 1.25fr;gap:7%;align-items:center;position:relative;z-index:2}
.meet-portrait{margin:0;position:relative;padding:0 24px;text-align:center}
.meet-portrait img{width:min(100%,470px);margin:auto}
.meet-portrait figcaption{font-size:11px;letter-spacing:.1em;display:flex;align-items:center;justify-content:center;gap:12px}
.meet-portrait figcaption b{font-family:var(--font-display);font-size:34px;letter-spacing:-.06em}
.meet-facts article{display:grid;grid-template-columns:90px 1fr;gap:18px;padding:28px 0;border-bottom:1px solid #0004}
.meet-facts article:first-child{padding-top:0}
.fact-index{font-size:10px;font-weight:700;letter-spacing:.04em;padding-top:7px}
.meet-facts h3{font-family:var(--font-body);font-size:26px;line-height:1.45;letter-spacing:0;margin-bottom:14px;font-weight:800}
.meet-facts p{font-size:15px;line-height:1.9;text-wrap:pretty}
.meet-next{display:flex;align-items:center;gap:24px;margin-top:44px;font-size:13px;font-weight:700;width:max-content;max-width:100%;position:relative;z-index:2}
.meet-next>span:last-child{border:1px solid currentColor;border-radius:50%;width:46px;height:46px;display:grid;place-items:center;font-size:24px}
html[data-character-first] .story-peeker{left:auto;right:9%;bottom:-75px;width:210px}
.little-moves{background:#fff;overflow:hidden}
.motion-heading{display:grid;grid-template-columns:1.4fr 1fr;gap:8%;align-items:end;padding-bottom:42px}
html[data-character-first] .motion-heading h2{font-size:clamp(46px,5.3vw,82px);margin-top:35px}
.motion-copy p{font-size:16px;line-height:1.8}
html[data-character-first] .motion-copy .jp-heading{font-size:32px;margin-bottom:18px}
.motion-bar{display:flex;justify-content:space-between;align-items:center;margin:0 5%;border-top:1px solid var(--ink);padding:18px 0;font-size:10px;font-weight:700;letter-spacing:.07em}
.motion-bar button{display:flex;align-items:center;gap:12px;background:transparent;border:1px solid var(--ink);padding:10px 15px;border-radius:30px;min-height:44px;font-size:11px}
.motion-window{background:var(--c07-hero);border-block:1px solid var(--ink);padding:22px 0 26px}
.motion-track{display:flex;width:max-content;animation:pitten-parade 36s linear infinite;will-change:transform}
.motion-set{display:flex;flex:none;align-items:center}
.motion-item{width:240px;flex:none;display:flex;flex-direction:column;align-items:center;padding:8px 24px;gap:8px;color:#000}
.pixel-move{--size:160px;width:var(--size);height:var(--size);background-image:var(--sheet);background-size:100% calc(var(--frames)*100%);background-repeat:repeat-y;image-rendering:pixelated;image-rendering:crisp-edges;background-position:0 0}
.motion-item>span{font-family:var(--font-display);font-weight:800;font-size:15px;letter-spacing:-.02em}
.motion-item>b{font-size:13px;font-weight:700}
.motion-note{text-align:center;font-size:11px;padding:20px 5% 0}
@keyframes pitten-parade{to{transform:translateX(calc(-1 * var(--parade-width)))}}
.little-moves.is-paused .motion-track{animation-play-state:paused}
html[data-character-first] .future{padding-top:85px;padding-bottom:0}
html[data-character-first] .future-copy{flex-basis:33%;max-width:430px}
html[data-character-first] .future-copy p{font-size:16px}
.line-feature{display:grid;grid-template-columns:1.2fr 1fr;gap:7%;align-items:center;margin-top:68px;padding-bottom:76px;border-bottom:1px solid var(--ink)}
.line-scene{position:relative;background:var(--blue);padding:65px 20px 24px;min-width:0}
.sample-status{display:inline-block;background:#fff;color:#181818;border:1px solid #181818;font-size:10px;font-weight:700;padding:8px 10px;letter-spacing:.02em;line-height:1.3}
.line-scene>.sample-status{position:absolute;top:18px;left:20px}
.sticker-samples{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sticker-samples figure{margin:0;background:var(--yellow);border-radius:18px;padding:9px;aspect-ratio:320/270;display:grid;place-items:center}
.sticker-samples figure:nth-child(2){transform:rotate(4deg)}
.sticker-samples figure:nth-child(3){transform:rotate(-4deg)}
.sticker-samples img{width:100%;height:auto}
#play-stickers{min-height:44px;display:flex;gap:10px;align-items:center;margin:24px auto 0;padding:12px 18px;background:#fff;color:#181818;border:1px solid #181818;border-radius:30px;font-size:12px;font-weight:700}
#sticker-status{font-size:12px;text-align:center;margin-top:12px;line-height:1.5;color:#000}
#sticker-status:empty{display:none}
html[data-character-first] .story-copy .small{text-wrap:pretty}
.extension-kicker{font-size:11px;font-weight:700;letter-spacing:.05em}
html[data-character-first] .line-feature h3{font-size:clamp(45px,5.4vw,84px);margin:28px 0}
html[data-character-first] .line-feature .jp-heading{font-size:34px;margin-bottom:22px}
.line-feature-copy>p{font-size:16px;line-height:1.9}
.line-feature-copy .development-note{font-size:11px;line-height:1.8;margin-top:24px;max-width:33em}
.line-feature .underlink{line-height:1.8;font-size:13px;margin-top:25px}
.goods-heading{display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:end;margin:68px 0 42px}
html[data-character-first] .goods-heading h3{font-size:clamp(45px,5.4vw,84px);margin-top:24px}
html[data-character-first] .goods-heading .jp-heading{font-size:34px;margin:0 0 22px}
.goods-heading p{font-size:16px;line-height:1.9}
.goods-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.goods-grid figure{margin:0}
.goods-image{position:relative;background:#fff;aspect-ratio:1;border:1px solid #18181822}
.goods-image img{width:100%;height:100%;object-fit:contain}
.goods-image .sample-status{position:absolute;left:12px;top:12px;font-size:8px;padding:6px 8px}
.goods-grid figcaption{border-top:1px solid var(--ink);padding-top:20px;margin-top:22px}
.goods-grid figcaption>span{font-size:10px;letter-spacing:.04em;font-weight:700}
.goods-grid h4{font-family:var(--font-body);font-size:25px;font-weight:800;line-height:1.4;margin:14px 0 0;letter-spacing:0}
.goods-note{font-size:11px;line-height:1.8;margin-top:28px}
.possibility-next{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:48px;padding:28px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);font-size:15px}
.possibility-next b{font-size:12px;border-bottom:1px solid;padding-bottom:5px;white-space:nowrap}
html[data-character-first] .pocket{padding-top:90px}
html[data-character-first] .worlds-copy{width:33%;max-width:460px;right:5%;bottom:75px}
html[data-character-first] .worlds-copy .jp-heading{font-size:32px}
html[data-character-first] .worlds-copy p{font-size:16px}
html[data-character-first] .portal-foot{font-size:14px;line-height:1.8;max-width:34em}
html[data-character-first] .portal:after{background:linear-gradient(0deg,#000b,transparent 78%,#0003)}
html[data-character-first] .utility-portals>a>p:last-child{font-size:15px;line-height:1.8}
html[data-character-first] .brand-home-link>span{max-width:none;font-size:13px}
@media(min-width:1650px){.motion-item{width:280px}.pixel-move{--size:192px}.motion-heading{gap:12%}}
@media(min-width:761px) and (max-width:1100px){
 html[data-character-first] .story-copy .small{font-size:15px}
 .meet-details{gap:4%;grid-template-columns:.85fr 1.3fr}.meet-portrait{padding:0}.meet-facts article{grid-template-columns:1fr;gap:10px;padding:22px 0}.meet-facts h3{font-size:24px}.meet-facts p{font-size:14px}
 html[data-character-first] .motion-copy .jp-heading{font-size:28px}.motion-copy p{font-size:14px}.motion-item{width:210px}
 .line-feature{gap:5%;grid-template-columns:1.1fr 1fr}.line-scene{padding:62px 12px 20px}.sticker-samples{gap:8px}
 html[data-character-first] .line-feature .jp-heading,html[data-character-first] .goods-heading .jp-heading{font-size:28px}.line-feature-copy>p,.goods-heading p{font-size:14px}
 .goods-grid{gap:15px}.goods-grid h4{font-size:23px}
 html[data-character-first] .worlds-copy{width:35%;bottom:60px}.worlds-copy p{font-size:14px}html[data-character-first] .worlds-copy .jp-heading{font-size:27px}
}
@media(max-width:760px){
 html[data-character-first] .header .main-navigation{gap:18px;font-size:9px}
 html[data-character-first] .header .main-navigation a:last-child{display:none}
 html[data-character-first] .story{padding-bottom:120px}
 html[data-character-first] .story-copy{padding:0;margin-top:35px}
 html[data-character-first] .little-star{position:static;display:block;margin-bottom:20px}
 html[data-character-first] .story-copy .small{font-size:15px;line-height:1.95}
 .meet-details{display:block;margin-top:42px;padding-top:30px}.meet-portrait{padding:0 12px 30px}.meet-portrait img{max-width:300px}.meet-portrait figcaption b{font-size:30px}
 .meet-facts article{grid-template-columns:1fr;gap:10px;padding:24px 0}.meet-facts article:first-child{padding-top:6px}.meet-facts h3{font-size:22px;margin-bottom:12px}.meet-facts p{font-size:14px;line-height:1.9}.fact-index{font-size:9px}
 .meet-next{margin-top:30px;font-size:12px;gap:18px}.meet-next>span:last-child{flex:none}
 html[data-character-first] .story-peeker{width:140px;right:5%;bottom:-60px}
 .motion-heading{display:block;padding-bottom:28px}html[data-character-first] .motion-heading h2{font-size:10.6vw;margin-top:28px}
 .motion-copy{margin-top:28px}html[data-character-first] .motion-copy .jp-heading{font-size:25px;margin-bottom:16px}.motion-copy p{font-size:14px;line-height:1.8}
 .motion-bar{margin:0 6%;font-size:8px;padding:12px 0;gap:12px}.motion-bar button{font-size:10px;padding:10px 12px;gap:8px}
 .motion-window{padding:16px 0 20px}.motion-item{width:160px;padding:6px 16px}.pixel-move{--size:128px}.motion-item>span{font-size:13px}.motion-item>b{font-size:12px}.motion-note{font-size:10px;padding-top:18px}
 html[data-character-first] .future{padding-top:56px}html[data-character-first] .future-copy{max-width:none}html[data-character-first] .future-copy p{font-size:14px}
 .line-feature{display:flex;flex-direction:column;gap:32px;margin-top:38px;padding-bottom:45px}.line-scene{width:100%;padding:58px 14px 20px}.line-scene>.sample-status{top:15px;left:14px;font-size:8px}.sticker-samples{gap:10px}.sticker-samples figure{padding:6px;border-radius:12px}
 .line-feature-copy{width:100%}html[data-character-first] .line-feature h3{font-size:14vw;margin:22px 0}html[data-character-first] .line-feature .jp-heading{font-size:27px;margin-bottom:18px}.line-feature-copy>p{font-size:15px}.line-feature-copy .development-note{font-size:11px}
 .goods-heading{display:block;margin:42px 0 30px}html[data-character-first] .goods-heading h3{font-size:14vw}html[data-character-first] .goods-heading .jp-heading{font-size:27px;margin:28px 0 18px}.goods-heading p{font-size:15px}
 .goods-grid{display:block}.goods-grid figure{margin-bottom:32px}.goods-grid figcaption{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:16px;padding-top:14px}.goods-grid h4{font-size:23px;margin:0}.goods-grid figcaption>span{font-size:9px}.goods-image .sample-status{font-size:9px}
 .goods-note{margin-top:0;font-size:11px}.possibility-next{display:block;margin-top:30px;font-size:14px;padding:24px 0}.possibility-next b{display:inline-block;font-size:11px;margin-top:16px}
 html[data-character-first] .pocket{padding-top:55px}
 html[data-character-first] .worlds-copy{width:auto;max-width:none;margin-top:30px}html[data-character-first] .worlds-copy .jp-heading{font-size:26px}html[data-character-first] .worlds-copy p{font-size:14px;line-height:1.9}
 html[data-character-first] .portal-foot{font-size:13px;line-height:1.8}html[data-character-first] .utility-portals>a>p:last-child{font-size:13px;line-height:1.8}
 html[data-character-first] .brand-home-link>span{font-size:11px;max-width:12em}
}
@media(max-width:350px){html[data-character-first] .header .main-navigation{font-size:8px;gap:12px}.meet-facts h3{font-size:20px}.motion-bar{font-size:7px}.motion-bar button{font-size:9px}.goods-grid h4{font-size:20px}}
@media(prefers-reduced-motion:reduce){.little-moves:not(.is-running) .motion-track{animation-play-state:paused}}