.math-page{min-height:100vh;overflow-x:hidden}.math-page main{padding:clamp(10px,2vw,24px);padding-top:clamp(10px,2vw,22px)}.math-shell{padding-top:clamp(10px,2vw,22px)}.math-hero,.math-layout{width:min(1500px,calc(100vw - 20px));margin-inline:auto}.math-hero{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:clamp(14px,2.4vw,28px);margin-bottom:14px;background:rgba(250,255,253,.86);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow)}.math-hero h1{font-size:clamp(30px,4vw,58px)}.math-hero .lead{margin-top:12px;font-size:clamp(15px,1.5vw,19px)}.math-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:14px;align-items:start}.math-card,.math-ranking{background:rgba(250,255,253,.88);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);padding:clamp(12px,2vw,22px)}.math-hud{display:grid;grid-template-columns:minmax(180px,1.35fr) repeat(3,minmax(92px,.62fr));gap:10px}.math-hud label,.math-hud div,.answer-field{border:1px solid var(--line);background:#f7fffc;border-radius:14px;padding:9px 12px}.math-hud span,.answer-field span,.mode-row span{display:block;color:var(--muted);font-weight:850;font-size:11px;text-transform:uppercase;letter-spacing:.12em}.math-hud input,.answer-field input{width:100%;border:0;background:transparent;color:var(--ink);font:950 22px/1.15 inherit;outline:0;text-transform:uppercase}.math-hud strong{font-size:28px}.mode-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0}.mode-row button{border:0;border-radius:12px;background:#e8f4f0;color:var(--green-dark);font-weight:950;min-height:38px;padding:8px 14px}.mode-row button.active{background:var(--green);color:#fff;box-shadow:0 12px 24px rgba(35,143,122,.18)}.problem-card{display:grid;gap:12px;place-items:center;min-height:clamp(260px,44vh,430px);padding:clamp(14px,3vw,34px);border-radius:20px;background:linear-gradient(135deg,#092224,#13443d);color:#dffff3;border:1px solid rgba(158,255,203,.28)}.problem-text{font-size:clamp(48px,9vw,130px);font-weight:1000;line-height:.95;text-align:center;text-shadow:0 8px 34px rgba(40,193,144,.28);white-space:nowrap}.answer-field{width:min(360px,100%);background:#fff;color:var(--ink)}.answer-field input{text-align:center;font-size:clamp(30px,5vw,56px)}.feedback{min-height:30px;font-weight:950;font-size:clamp(18px,2.5vw,28px);text-align:center}.feedback.good{color:#88ffc6}.feedback.bad{color:#ffd36a}.math-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.math-actions .button{border:0;cursor:pointer;min-height:44px}.number-pad{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:12px}.number-pad button{min-height:44px;border:0;border-radius:12px;background:#e8f4f0;color:var(--green-dark);font-weight:950;font-size:20px}.number-pad button.enter{grid-column:span 2;background:var(--green);color:#fff}.number-pad button.clear{background:#ffe4e6;color:#ad1f3a}.math-ranking h2{font-size:clamp(28px,3vw,42px);margin-bottom:14px}.math-ranking ol{list-style:none;display:grid;gap:9px;margin:0;padding:0}.math-ranking li{display:grid;grid-template-columns:38px 1fr;gap:6px 10px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:#f7fffc;font-weight:850}.math-ranking .rank-score{grid-column:2;color:var(--green-dark);font-size:13px}.math-ranking .rank-date{grid-column:2;color:var(--muted);font-size:12px}@media(max-width:1180px){.math-layout{grid-template-columns:1fr}.math-ranking{width:100%}.math-ranking ol{grid-template-columns:repeat(2,minmax(0,1fr))}.math-ranking h2{margin-bottom:10px}}@media(max-width:780px){.math-hero{align-items:flex-start;flex-direction:column}.math-hud{grid-template-columns:1fr 1fr}.math-hud label{grid-column:1/-1}.problem-card{min-height:300px}.problem-text{white-space:normal}.math-actions .button{flex:1 1 130px}.number-pad{grid-template-columns:repeat(3,1fr)}.math-ranking ol{grid-template-columns:1fr}}@media(max-height:760px) and (min-width:900px){.math-hero{padding:12px 18px}.math-hero h1{font-size:34px}.math-hero .lead{display:none}.problem-card{min-height:300px}.problem-text{font-size:clamp(52px,8vw,105px)}.number-pad button{min-height:38px}.math-actions .button{min-height:40px}.math-card,.math-ranking{padding:14px}}

/* standalone folder */
.standalone-math .math-shell{padding-top:clamp(10px,2vw,22px)}
.standalone-math .math-hero{margin-top:0}
.standalone-math .math-layout{align-items:start}
@media (max-width: 980px){.standalone-math .math-layout{grid-template-columns:1fr}}

.math-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.math-lang{display:flex;gap:8px;flex:0 0 auto}.math-lang a{display:inline-flex;align-items:center;justify-content:center;min-width:52px;min-height:42px;border:1px solid var(--line);border-radius:12px;background:#edf6f3;color:var(--ink);font-weight:900;text-decoration:none}.math-lang a.active{background:var(--green);border-color:var(--green);color:#fff}.math-hud .age-field{min-width:105px}.math-hud .age-field input{text-align:center}@media (max-width:700px){.math-hero{display:block}.math-lang{margin-top:14px}.math-hud{grid-template-columns:1fr 92px 1fr 1fr}.math-hud .name-field{grid-column:span 2}}
/* profile and tablet input fixes */
.math-hud{grid-template-columns:minmax(180px,1.4fr) minmax(82px,.42fr) repeat(3,minmax(92px,.55fr));align-items:stretch}.math-hud label,.math-hud div{min-width:0}.math-hud input{text-overflow:ellipsis}.answer-field input[readonly]{cursor:pointer;caret-color:var(--green);user-select:none}.answer-field:focus-within,.answer-field:has(.answer-active){box-shadow:0 0 0 4px rgba(35,143,122,.22)}.math-lang{margin-left:auto}.profile-edit{min-height:42px;white-space:nowrap}.profile-modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:18px;background:rgba(8,32,34,.55);backdrop-filter:blur(10px)}.profile-modal[hidden]{display:none}.profile-box{width:min(440px,100%);background:var(--paper);border:1px solid var(--line);border-radius:24px;padding:24px;box-shadow:var(--shadow);display:grid;gap:14px}.profile-box h2{font-size:clamp(30px,5vw,46px)}.profile-box p{margin:0;color:var(--muted);font-weight:750}.profile-box label{display:grid;gap:6px}.profile-box label span{font-weight:900;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.12em}.profile-box input{width:100%;min-height:54px;border:1px solid var(--line);border-radius:14px;background:#f7fffc;color:var(--ink);font-size:24px;font-weight:950;padding:10px 14px;text-transform:uppercase}.profile-box button{border:0;margin-top:4px}.mode-row{margin-top:10px}@media(max-width:1180px){.math-hud{grid-template-columns:minmax(180px,1fr) 92px repeat(3,minmax(86px,.5fr))}}@media(max-width:860px){.math-hud{grid-template-columns:1fr 90px 1fr 1fr}.math-hud>div:last-child{grid-column:span 2}.math-hero{display:grid;grid-template-columns:1fr auto;align-items:start}.math-lang{grid-column:2}.profile-edit{grid-column:2}}@media(max-width:560px){.math-hud{grid-template-columns:1fr 82px}.math-hud>div{grid-column:span 1}.math-hud>div:last-child{grid-column:1/-1}.math-hero{grid-template-columns:1fr}.math-lang,.profile-edit{grid-column:auto;margin-left:0}}