/* Shared, responsive layout. Keep mascot text selectable and separate from artwork. */
.header-inner{gap:28px!important}.locale-switcher{display:flex;gap:4px;margin-inline-start:auto;flex-shrink:0;border:1px solid #d8e8dd;border-radius:8px;padding:3px;background:#fff;max-width:42vw;overflow-x:auto}.locale-switcher a{display:block;padding:5px 9px;border-radius:5px;font-size:12px;line-height:1.4;color:#42634f;text-decoration:none;white-space:nowrap}.locale-switcher a[aria-current=page]{background:#e1f2e6;color:#106c3d;font-weight:700}.locale-switcher a:hover{background:#eef8f1}.locale-switcher a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #2c8c5c;outline-offset:3px}.mascot{position:relative;container-type:inline-size}.mascot img{max-width:100%;height:auto;object-fit:contain}.mascot .bubble{position:absolute;display:flex;align-items:center;justify-content:center;text-align:center;white-space:pre-line;line-height:1.12;font-weight:800;color:#087537;margin:0;pointer-events:auto;user-select:text}.hero-mascot .bubble{left:5%;top:18%;width:20%;height:17%;font-size:clamp(9px,2.3cqw,16px)}.bottom-mascot{flex:0 1 480px;width:480px;max-width:100%;margin-top:-44px;margin-bottom:4px}.bottom-mascot .bubble{left:8%;top:31%;width:26%;height:24%;font-size:clamp(9px,3.2cqw,17px)}.options-grid .options-column{min-width:0}.options-grid label{line-height:1.45}.options-grid input[type=checkbox],.options-grid input[type=radio]{flex:none}.options-grid input[type=text]{width:100%;min-width:0}.options-grid label{align-items:flex-start!important}.steps>div{min-width:0;line-height:1.5}.steps b{flex-shrink:0}.primary-nav{gap:24px!important}noscript{display:block;padding:16px;border:1px solid #d4e5d9;background:#fff7dc;border-radius:8px;margin-top:16px}
html:not([lang=ja]) .hero-section{display:grid!important;grid-template-columns:minmax(0,1.06fr) minmax(0,1fr);align-items:center!important;gap:16px;padding-bottom:12px}html:not([lang=ja]) .hero-copy{padding:0 0 18px 12px!important}html:not([lang=ja]) .hero-copy h1{font-size:clamp(34px,3.5vw,48px)!important;line-height:1.15!important;margin-top:18px!important}html:not([lang=ja]) .hero-copy>p{font-size:16px!important;line-height:1.7!important;margin-top:18px!important}html:not([lang=ja]) .hero-copy>p br{display:none}html:not([lang=ja]) .hero-mascot{margin:0!important;max-width:100%}html:not([lang=ja]) .hero-copy>div:first-child{height:auto!important;min-height:30px;padding:6px 12px!important;font-size:12px!important;line-height:1.4}html:not([lang=ja]) .options-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))!important}html:not([lang=ja]) .options-grid .options-column{padding:4px 10px!important;border-left:0!important}html:not([lang=ja]) .options-grid label{font-size:13px}html:not([lang=ja]) .bottom-mascot{margin-top:0}
@media(max-width:1060px){.primary-nav{gap:16px!important}.header-inner{gap:20px!important}html:not([lang=ja]) .hero-section{grid-template-columns:1fr 1fr}html:not([lang=ja]) .hero-copy h1{font-size:36px!important}.bottom-mascot{margin-top:0}}
@media(max-width:760px){.header-inner{gap:8px!important}.locale-switcher a{padding:5px 7px;font-size:11px}.locale-switcher{max-width:44vw}.hero-section{padding-top:18px!important}html:not([lang=ja]) .hero-section{display:flex!important;flex-direction:column;gap:0}html:not([lang=ja]) .hero-copy{padding:0 0 14px!important;width:100%;flex:none!important}html:not([lang=ja]) .hero-mascot{width:min(100%,620px);flex:none!important;align-self:center}html:not([lang=ja]) .hero-copy h1{font-size:clamp(30px,8.7vw,38px)!important}html:not([lang=ja]) .hero-copy>p{font-size:14px!important;margin-top:14px!important}html:not([lang=ja]) .hero-copy>div:last-child{gap:12px!important}.options-grid{grid-template-columns:1fr!important;padding:12px!important;gap:12px!important}.options-grid .options-column{padding:4px 0!important;border-left:0!important}.bottom-mascot{width:min(480px,100%);margin-top:0!important}.drop-zone{padding:14px 10px!important}.drop-zone>div:first-of-type{font-size:17px!important}.file-tools{justify-content:center;flex-wrap:wrap}#compareBtn{font-size:19px!important}.steps{grid-template-columns:1fr!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*{transition:none!important}}
@media print{.locale-switcher,.mascot{display:none!important}}

/* CSS-rendered translations over the blank international mascot artwork. */
html:not([lang=ja]) .image-caption{position:absolute;margin:0;text-align:center;white-space:pre-line;font-weight:900;line-height:1.16;pointer-events:auto;user-select:text;-webkit-text-stroke:3px #fff;paint-order:stroke fill;text-shadow:0 1px 3px rgba(255,255,255,.9)}
html:not([lang=ja]) .hero-mascot .hero-caption-top{right:2%;top:13%;width:31%;color:#087b3c;font-size:clamp(10px,2.5cqw,17px)}
html:not([lang=ja]) .hero-mascot .hero-caption-bottom{right:3%;bottom:1%;width:32%;color:#2579bd;font-size:clamp(9px,2.3cqw,16px)}
html:not([lang=ja]) .bottom-mascot .bottom-image-caption{left:75%;top:29%;width:23%;height:52%;display:flex;align-items:center;justify-content:center;color:#087b3c;font-size:clamp(9px,2.5cqw,16px)}
