/* Preserve the original DreamTale layout with English-length text. */
html[lang=en] .hero h1 .line{white-space:normal}
html[lang=en] .hero-meta>span,html[lang=en] .seg button{min-width:0}
html[lang=en] .nav-links a{padding:8px 9px}
html[lang=en] .arch svg text{font-size:11px}
html[lang=en] .foot{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
@media(max-width:760px){html[lang=en] .foot{grid-template-columns:1fr}}
@media(max-width:640px){html[lang=en] .sec-grid{grid-template-columns:minmax(0,1fr)}html[lang=en] .sec-grid>*{min-width:0}html[lang=en] .check>div{min-width:0;overflow-wrap:anywhere}html[lang=en] .seg{flex-wrap:wrap}html[lang=en] .hero-meta{flex-wrap:wrap}html[lang=en] .stat .v{font-size:25px}html[lang=en] .arch{overflow:auto}}
@media(max-width:480px){html[lang=en] .hero h1{font-size:clamp(26px,7.2vw,34px)}html[lang=en] .brand small{max-width:130px;white-space:normal}html[lang=en] .nav-act .btn{padding:9px 12px}html[lang=en] .hero-cta{flex-wrap:wrap}html[lang=en] .seg button{padding:8px 9px;font-size:11px}html[lang=en] .check p{font-size:13px}}

@media(max-width:900px){html[lang=en] .demo{grid-template-columns:minmax(0,1fr)}html[lang=en] .demo>*{min-width:0}html[lang=en] .stat-row{grid-template-columns:repeat(2,minmax(0,1fr))}html[lang=en] .seg{max-width:100%}}