.fractions-page [hidden]{display:none!important}
.fractions-page .hero-shell{padding:24px 28px}
.fractions-page h1{margin:0 0 10px;font-size:clamp(29px,3.4vw,44px)}
.fractions-page .lead{margin:0;max-width:970px}
.fractions-page .calculator-layout{align-items:start}
.fractions-page .field{display:grid;gap:8px;margin-bottom:18px;min-width:0}
.fractions-page .label-row{color:var(--ink-strong);font-weight:700}
.fraction-selected-mode{display:none}
.fractions-page .input,.fractions-page .select{width:100%;min-width:0}
.fractions-page input{font-family:ui-monospace,Consolas,monospace}
.fractions-page .hint,.fraction-note{color:var(--muted);font-size:14px;line-height:1.55}
.fraction-actions{display:flex;gap:10px;flex-wrap:wrap}
.fraction-actions .button{min-height:46px}
.fractions-page .button:disabled{opacity:.55;cursor:default}
.fraction-main{padding:18px;margin:18px 0;background:var(--pearl-soft);border:1px solid var(--line-strong);border-radius:var(--radius-md);box-shadow:inset 3px 3px 8px rgba(85,108,91,.14),inset -3px -3px 8px rgba(249,252,245,.6)}
.fraction-main span{display:block;font-weight:700}
.fraction-main strong{display:block;margin-top:10px;font-family:ui-monospace,Consolas,monospace;font-size:clamp(28px,3.3vw,40px);line-height:1.3;color:var(--ink-strong);overflow-wrap:anywhere}
.fraction-expression{font-family:ui-monospace,Consolas,monospace;overflow-wrap:anywhere;line-height:1.7}
.fraction-representation{padding:18px;margin:16px 0;border-radius:var(--radius-md)}
.fraction-representation h3{margin:0 0 14px}
.fraction-representation p{margin:12px 0}
.fraction-representation span{display:block;font-size:14px;color:var(--muted);margin-bottom:4px}
.fraction-representation strong{display:block;color:var(--ink-strong);font-family:ui-monospace,Consolas,monospace;font-size:20px;overflow-wrap:anywhere}
.fraction-solution{padding:26px}
.fraction-solution summary{font-size:22px;color:var(--ink-strong);font-weight:750;cursor:pointer}
.fraction-solution ol{padding-left:24px;margin-bottom:0}
.fraction-solution li{padding-left:6px;margin:20px 0}
.fraction-solution h3{margin:0 0 8px;font-size:18px}
.fraction-solution p{margin:0;line-height:1.7;overflow-wrap:anywhere}
.fractions-page .seo-article{max-width:none}
.fractions-page .seo-article p,.fractions-page .seo-article li{line-height:1.7}
#fraction-copy-area{margin-top:18px}
#fraction-copy-text{display:block;width:100%;margin-top:8px}
@media(max-width:640px){.fractions-page .hero-shell,.fraction-solution{padding:20px}.fraction-actions .button{flex:1 1 160px}.fraction-main{padding:15px}.fraction-selected-mode{display:block}}