:root{--fx-ink:#20303D;--fx-cell:#FFFFFF;--fx-line:#20303D;--fx-hatch:repeating-linear-gradient(135deg,#F1F3F5 0 6px,#DDE2E7 6px 8px)}


.sg-btn{all:unset;cursor:pointer;padding:9px 16px;border-radius:999px;background:#fff;font-weight:700;font-size:14.5px;color:var(--u-navy);
  box-shadow:inset 0 0 0 1.5px var(--u-edge);transition:background .2s,transform .2s,opacity .2s}
.sg-btn:hover{transform:translateY(-2px)}
.sg-btn.on{background:var(--u-navy);color:#fff;box-shadow:none}
.sg-btn:focus-visible{outline:3px solid var(--sg-amber);outline-offset:2px}

.fx-f{position:relative;display:inline-flex;flex-direction:column;align-items:center;vertical-align:middle;line-height:1.02;
  font-size:.8em;font-weight:800;margin:0 .1em;text-align:center}
.fx-f b{display:block;padding:0 .18em;font-weight:inherit}
.fx-f b:first-child{border-bottom:.11em solid currentColor;padding-bottom:.08em;margin-bottom:.06em}
.fx-f s{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;text-decoration:none}
.fx-mx{white-space:nowrap}
.sg-try .q,.sg-quiz .q,.sg-ex .stem,.fx-story{line-height:1.85}
.sg-big .fx-f,.sg-hero p .fx-f,.sg-try .q .fx-f,.sg-quiz .q .fx-f,.sg-ex .stem .fx-f,.fx-story .fx-f{font-size:.84em;margin:0 .08em}
.sg-opts .fx-f{font-size:.86em}
.sg-read .fx-f,.sg-fb .fx-f{font-size:.88em;margin:0 .08em}
.sg-opts.fx-opts button{min-width:56px;padding:8px 16px}
.sg-ex .steps .fx-f{font-size:.94em;margin:-.15em .1em}
.sg-ex .ans .fx-f{font-size:.94em}
.sg-ex .w .hl:has(.fx-f){padding:2px 4px}
.sg-ex .steps li{align-items:center}

.fx-hero{position:relative;height:250px;border-radius:18px;background:#fff;box-shadow:var(--u-sh);overflow:hidden}
.fx-hero .fx-sc{position:absolute;inset:0 0 18px;display:grid;place-items:center;align-content:center;gap:12px;opacity:0;animation:fx-cyc 12s ease-in-out infinite;--sd:0s}
.fx-hero .fx-s2{animation-delay:4s;--sd:4s}.fx-hero .fx-s3{animation-delay:8s;--sd:8s}
@keyframes fx-cyc{0%{opacity:0;transform:translateY(14px)}6%,30%{opacity:1;transform:none}36%,100%{opacity:0;transform:translateY(-14px)}}
.fx-hero .lab{font-weight:800;font-size:22px;color:var(--u-navy);display:flex;align-items:center;gap:6px}
.fx-hero .lab .fx-f{font-size:19px}
.fx-hero .sub{font-size:13.5px;color:var(--u-soft);text-align:center;padding:0 16px}
.fx-hbar{display:flex;gap:0;border:2.5px solid var(--fx-line);border-radius:9px;overflow:hidden;width:250px;height:56px}
.fx-hbar i{flex:1;background:#fff;border-right:2px solid var(--fx-line)}
.fx-hbar i:last-child{border-right:0}
.fx-hbar.two{border:0;border-radius:0;overflow:visible;gap:12px;width:auto;height:auto}
.fx-hbar.two>span{display:flex;width:136px;height:48px;border:2.5px solid var(--fx-line);border-radius:7px;overflow:hidden}
.fx-hbar i.on{animation:fx-cf 12s infinite both;animation-delay:calc(var(--sd,0s) + .4s + var(--i,0) * .28s)}
@keyframes fx-cf{0%{background:#fff}3%,100%{background:var(--sg-blue)}}
.fx-hbar i:nth-child(2){--i:1}.fx-hbar i:nth-child(3){--i:2}.fx-hbar i:nth-child(4){--i:3}
.fx-hbar.two span+span i:nth-child(1){--i:4}.fx-hbar.two span+span i:nth-child(2){--i:5}.fx-hbar.two span+span i:nth-child(3){--i:6}
.fx-hset{display:flex;gap:10px}
.fx-hset .g{display:grid;grid-template-columns:repeat(1,18px);gap:5px;padding:7px;border:2px dashed #7C8B98;border-radius:12px}
.fx-hset i{width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 2px var(--sg-blue)}
.fx-hset .g.on i{animation:fx-cc 12s infinite both;animation-delay:calc(var(--sd,0s) + .5s + var(--i,0) * .35s)}
.fx-hset .g:nth-child(2){--i:1}.fx-hset .g:nth-child(3){--i:2}
@keyframes fx-cc{0%{background:#fff}3%,100%{background:var(--sg-blue)}}
.fx-hero .dots{position:absolute;left:0;right:0;bottom:14px;display:flex;justify-content:center;gap:7px}
.fx-hero .dots i{width:7px;height:7px;border-radius:50%;background:#D7DEE5;animation:fx-dot 12s infinite}
.fx-hero .dots i:nth-child(2){animation-delay:4s}.fx-hero .dots i:nth-child(3){animation-delay:8s}
@keyframes fx-dot{0%,33.3%{background:var(--u-navy)}33.4%,100%{background:#D7DEE5}}

.fx-ctl{display:flex;flex-wrap:wrap;gap:8px 10px;justify-content:center;align-items:center;margin-top:14px}
.fx-lbl{font-size:14.5px;color:var(--u-soft);font-weight:600}
.fx-den,.fx-st-pick{display:inline-flex;gap:6px;flex-wrap:wrap;justify-content:center}
.fx-den .sg-btn{min-width:20px;text-align:center}
.sg-btn .fx-nb{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--u-ground);font-size:12px;margin-right:4px}
.sg-btn.on .fx-nb{background:#fff;color:var(--u-navy)}
.sg-btn .fx-f{font-size:.92em;margin:-4px 2px}
.sg-btn[disabled]{opacity:.45;cursor:default;transform:none}
.fx-story{margin:0 0 14px;font-size:16.5px;line-height:1.6;background:#fff;border-radius:12px;padding:12px 16px;box-shadow:var(--u-sh)}

.fx-bar{position:relative;display:flex;height:44px;border:2.5px solid var(--fx-line);border-radius:9px;overflow:hidden;background:#fff}
.fx-c{all:unset;box-sizing:border-box;position:relative;flex:1 1 0;min-width:0;background:var(--fx-cell);display:grid;place-items:center;
  font:800 14px/1 var(--u-font);color:transparent;transition:background .35s ease,color .35s ease}
.fx-c::after{content:"";position:absolute;top:0;bottom:0;right:-1.25px;width:2.5px;background:var(--fx-line);z-index:1}
.fx-c:last-child::after{display:none}
.fx-c.fine::after{width:1.5px;right:-.75px;opacity:0;background:var(--fx-line);transition:opacity .5s ease}
.fx-bar.cut .fx-c.fine::after,.fx-c.fine.show::after{opacity:.8}
.fx-c.on{background:var(--sg-blue);color:#fff}
.fx-c.on2{background:var(--sg-blue-lt);color:var(--u-navy)}
.fx-c.pop{animation:fx-pop .45s cubic-bezier(.3,1.6,.5,1)}
@keyframes fx-pop{0%{transform:scale(.4);opacity:.3}100%{transform:none;opacity:1}}

.fx-mi-eq{display:flex;justify-content:center;align-items:center;gap:16px;min-height:86px;margin-bottom:10px;text-align:center}
.fx-mi-eq .side{display:grid;gap:4px;justify-items:center}
.fx-mi-eq .v{font:800 34px/1 var(--u-font);color:var(--u-ink);display:flex;align-items:center;gap:6px}
.fx-mi-eq .v .fx-f{font-size:30px;margin:0}
.fx-mi-eq .v.imp .fx-f{color:var(--sg-blue)}
.fx-mi-eq .cap{font-size:12.5px;color:var(--u-soft);font-weight:600}
.fx-mi-eq .eqs{font:800 30px/1 var(--u-font);color:var(--u-soft);padding-bottom:20px}
.fx-mi-bars{display:grid;gap:10px}
.fx-mi-row{display:grid;grid-template-columns:minmax(0,1fr) 92px;gap:12px;align-items:center;transition:opacity .4s}
.fx-mi-row.empty{opacity:.45}
.fx-mi-row .fx-c{cursor:pointer;color:transparent}
.fx-mi-row .fx-c.on{color:#fff}
.fx-mi-row .fx-c:focus-visible{outline:3px solid var(--sg-amber);outline-offset:-3px;z-index:2}
.fx-mi-row .fx-c:hover:not(.on){background:var(--sg-blue-bg)}
.fx-mi-row .tag{white-space:nowrap;font:800 15px/1.1 var(--u-font);color:var(--u-navy);display:flex;align-items:center;gap:6px;min-height:44px}
.fx-mi-row .tag .fx-f{font-size:15px;color:var(--sg-blue)}
.fx-mi-row .tag .ok{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--sg-green);color:#fff;font-size:12px}
.fx-mi-row.full .fx-bar{box-shadow:0 0 0 3px var(--sg-green-bg)}

.fx-ul-pick{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:18px}
.fx-ul-pick .sg-btn{padding:6px 14px;font-size:17px}
.fx-ul-rows{display:grid;gap:12px}
.fx-ul-row{display:grid;grid-template-columns:118px minmax(0,1fr);gap:14px;align-items:center}
.fx-ul-row .tag{display:flex;align-items:center;justify-content:flex-end;gap:4px;font:800 22px/1 var(--u-font);color:var(--u-ink);white-space:nowrap}
.fx-ul-row .tag .fx-f{font-size:21px;margin:0}
.fx-ul-row .tag .rn{display:inline-flex;align-items:center;gap:4px;color:var(--sg-blue);opacity:0;transform:translateX(-6px);transition:opacity .5s,transform .5s}
.fx-ul-row .tag .rn .eqs{color:var(--u-soft);font-size:18px}
.fx-ul-rows.s1 .tag .rn,.fx-ul-rows.s2 .tag .rn{opacity:1;transform:none}
.fx-ul-row .bars{display:grid;grid-template-columns:repeat(var(--nb,1),minmax(0,1fr));gap:8px}
.fx-ul-row.res{display:none;padding-top:14px;border-top:2px dashed #D5DBE0}
.fx-ul-rows.s2 .fx-ul-row.res{display:grid;animation:fx-in .5s ease both}
.fx-ul-row.res .tag{color:var(--sg-blue)}
.fx-ul-row .fx-c.gone{background:var(--fx-hatch)}
.fx-ul-row .fx-c.gone::before{content:"";position:absolute;left:18%;right:18%;top:50%;height:2.5px;background:#7C8B98;transform:rotate(-35deg);border-radius:2px}
.fx-ul-sum{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 8px;min-height:56px;margin-top:16px;padding:8px 12px;
  border-radius:12px;background:#fff;font:800 21px/1.1 var(--u-font)}
.fx-ul-sum .seg{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;animation:fx-in .45s ease both}
.fx-ul-sum .fx-f{font-size:19px;margin:0}
.fx-ul-sum .fx-f.x{font-size:15px;color:var(--u-soft)}
.fx-ul-sum .ans{color:var(--sg-blue)}
.fx-ul-sum .lcm{flex-basis:100%;text-align:center;font-size:14.5px;font-weight:700;color:var(--u-soft);animation:fx-in .45s ease both}
@keyframes fx-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.fx-st-box{background:#fff;border-radius:14px;box-shadow:var(--u-sh);padding:10px}
.fx-st-field{position:relative;height:190px}
.fx-st-field .ct{position:absolute;left:0;top:0;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:#fff;
  box-shadow:inset 0 0 0 2.5px var(--sg-blue);transition:transform .7s cubic-bezier(.45,1.25,.5,1),background .35s ease}
.fx-st-field .ct.on{background:var(--sg-blue);animation:fx-bump .4s ease}
@keyframes fx-bump{50%{scale:1.18}}
.fx-st-field .gp{position:absolute;left:0;top:0;border:2px dashed #7C8B98;border-radius:14px;opacity:0;transition:opacity .45s ease,border-color .35s}
.fx-st-field .gp.show{opacity:1}
.fx-st-field .gp.on{border-color:var(--sg-blue);border-style:solid}
.fx-st-field .gp em{position:absolute;left:0;right:0;bottom:-24px;text-align:center;font:800 14px/1 var(--u-font);font-style:normal;color:var(--u-soft)}
.fx-st-field .gp.on em{color:var(--sg-blue)}
.fx-st-pick .sg-btn{padding:6px 14px;font-size:17px}
.fx-st-w{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 22px;min-height:30px;margin-top:12px;font:800 19px/1.2 var(--u-font)}
.fx-st-w span{display:inline-flex;align-items:center;gap:6px;animation:fx-in .45s ease both}
.fx-st-w .fx-f{font-size:17px;margin:0}
.fx-st-w .ans{color:var(--sg-blue)}

.fx-rm-fig{display:grid;grid-template-columns:48px minmax(0,1fr);gap:10px;align-items:start;max-width:660px;margin:0 auto}
.fx-rm-fig .nm{font:800 15px/1 var(--u-font);color:var(--u-navy);text-align:right;padding-top:66px}
.fx-rm-fig .in{position:relative;padding:48px 0 84px}
.fx-rm-bar{height:52px}
.fx-rm-bar .fx-c{font-size:15px}
.fx-rm-bar .fx-c.mon{background:var(--sg-blue);color:transparent}
.fx-rm-bar .fx-c.mon.val{color:#fff}
.fx-rm-bar .fx-c.spent{background:var(--fx-hatch)}
.fx-rm-bar .fx-c.spent.val{color:var(--u-ink)}
.fx-rm-top,.fx-rm-bot{position:absolute;left:0;right:0}
.fx-rm-top{top:0;height:44px}.fx-rm-bot{top:100px;height:84px}
.fx-br{position:absolute;height:12px;border:2px solid var(--u-navy);transition:opacity .45s ease;opacity:0}
.fx-br.show{opacity:1}
.fx-rm-top .fx-br{bottom:4px;border-bottom:0;border-radius:8px 8px 0 0}
.fx-rm-bot .fx-br{border-top:0;border-radius:0 0 8px 8px}
.fx-rm-bot .fx-br.r{top:9px}.fx-rm-bot .fx-br.w{top:46px}
.fx-br b{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;font:800 14.5px/1 var(--u-font);color:var(--u-navy)}
.fx-rm-top .fx-br b{bottom:16px}.fx-rm-bot .fx-br b{top:16px}
.fx-rm-out{position:absolute;top:42px;height:64px;border:2.5px dashed var(--u-navy);border-radius:12px;opacity:0;transition:opacity .45s ease;pointer-events:none;margin-left:-3px;padding-right:6px;box-sizing:border-box}
.fx-rm-out.show{opacity:1;animation:fx-glow 1.6s ease-in-out 2}
@keyframes fx-glow{50%{border-color:var(--sg-blue)}}
.fx-rm-w,.fx-rw-w{list-style:none;margin:6px auto 0;padding:10px 16px;max-width:640px;min-height:40px;border-radius:12px;background:#fff;display:grid;gap:2px;
  font:700 16.5px/1.35 var(--u-font)}
.fx-rm-w li,.fx-rw-w li{display:block;line-height:1.75;animation:fx-in .45s ease both}
.fx-rm-w li .fx-f,.fx-rw-w li .fx-f{font-size:15px}
.fx-rm-w li.ans,.fx-rw-w li.ans,.fx-rw-w .ans{color:var(--sg-blue)}
.fx-rm-w:empty,.fx-rw-w:empty{display:none}
.fx-rm-dots{display:inline-flex;gap:6px}
.fx-rm-dots i{width:8px;height:8px;border-radius:50%;background:#D7DEE5;transition:background .3s}
.fx-rm-dots i.on{background:var(--u-navy)}

.fx-rw-pick{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:14px}
.fx-rw-fig{position:relative;max-width:640px;margin:0 auto;padding:46px 0 36px}
.fx-rw-row{display:grid;grid-template-columns:62px minmax(0,1fr);gap:12px;align-items:center;margin-bottom:10px}
.fx-rw-row .nm{font:800 15px/1.1 var(--u-font);color:var(--u-navy);text-align:right}
.fx-rw-row .trk{position:relative;display:grid;grid-template-columns:repeat(var(--u),minmax(0,1fr));height:46px}
.fx-rw-row .fx-bar{height:46px}
.fx-rw-row .fx-c{font-size:15px}
.fx-rw-row .fx-c.k{background:var(--sg-blue);color:transparent}
.fx-rw-row .fx-c.k.val{color:#fff}
.fx-rw-row .fx-c.u{background:#fff}
.fx-rw-row .fx-c.u.val{background:var(--sg-blue-lt);color:var(--u-navy)}
.fx-rw-row .fx-c.lt{background:var(--sg-blue-lt)}
.fx-rw-row .fx-c.lt.val{color:var(--u-navy)}
.fx-rw-row .gap{display:flex;height:46px;border:2.5px dashed #C9861C;border-left:0;border-radius:0 9px 9px 0;background:var(--sg-amber-bg);overflow:hidden}
.fx-rw-row .gap .fx-c{background:transparent;color:transparent}
.fx-rw-row .gap .fx-c::after{background:#C9861C;opacity:.6}
.fx-rw-row .gap .fx-c.val{color:#8A5507}
.fx-rw-row .gap.k{background:var(--sg-amber)}
.fx-rw-row .gap.k .fx-c.val{color:#4A2D00}
.fx-rw-row .seat{position:relative}
.fx-rw-fig .fx-br{z-index:2}
.fx-rw-fig .fx-br.top{border-bottom:0;border-radius:8px 8px 0 0}
.fx-rw-fig .fx-br.top b{bottom:16px}
.fx-rw-fig .fx-br.bot{border-top:0;border-radius:0 0 8px 8px}
.fx-rw-fig .fx-br.bot b{top:16px}
.fx-rw-fig .fx-br.amb{border-color:#C9861C}.fx-rw-fig .fx-br.amb b{color:#9D630C}
.fx-rw-tot{margin-top:34px !important;text-align:center;font:800 17px/1.3 var(--u-font);color:var(--u-navy);min-height:24px;margin-top:-4px;opacity:0;transition:opacity .45s}
.fx-rw-tot.show{opacity:1}
.fx-rw-tot .ans{color:var(--sg-blue)}

.sg-card .mini .fx-mini{display:grid;gap:7px;justify-items:center}
.sg-card .mini .fx-mini .b{display:flex;width:104px;height:20px;border:2px solid #1F2933;border-radius:5px;overflow:hidden}
.sg-card .mini .fx-mini .b i{flex:1;border-right:1.5px solid #1F2933;animation:fx-mini 4.8s infinite both}
.sg-card .mini .fx-mini .b i:last-child{border-right:0}
.sg-card .mini .fx-mini .b+.b i:last-child{animation:none}
.sg-card .mini .fx-mini .b i:nth-child(2){animation-delay:.2s}.sg-card .mini .fx-mini .b i:nth-child(3){animation-delay:.4s}.sg-card .mini .fx-mini .b i:nth-child(4){animation-delay:.6s}
.sg-card .mini .fx-mini .b+.b i:nth-child(1){animation-delay:.8s}.sg-card .mini .fx-mini .b+.b i:nth-child(2){animation-delay:1s}.sg-card .mini .fx-mini .b+.b i:nth-child(3){animation-delay:1.2s}
@keyframes fx-mini{0%,6%{background:transparent}12%,88%{background:#93B8F2}100%{background:transparent}}
.sg-card .mini .fx-mini .t{display:flex;align-items:center;gap:4px;font:800 16px/1 var(--u-font);color:#1F2933;margin-top:2px}
.sg-card .mini .fx-mini .t .fx-f{font-size:13px}

@media (max-width:900px){
  .fx-hbar{width:200px}
  .fx-hbar.two>span{width:112px}
  .fx-mi-row{grid-template-columns:minmax(0,1fr) 66px;gap:8px}
  .fx-mi-row .tag{font-size:12.5px;gap:4px}.fx-mi-row .tag .ok{width:16px;height:16px;font-size:10px}
  .fx-rm-dots{order:3;flex-basis:100%;justify-content:center}
  .fx-mi-eq .v{font-size:28px}.fx-mi-eq .v .fx-f{font-size:25px}
  .fx-ul-row{grid-template-columns:92px minmax(0,1fr);gap:8px}
  .fx-ul-row .tag{font-size:17px}.fx-ul-row .tag .fx-f{font-size:17px}.fx-ul-row .tag .rn .eqs{font-size:15px}
  .fx-ul-row .fx-bar{height:38px}
  .fx-ul-sum{font-size:18px}.fx-ul-sum .fx-f{font-size:16px}.fx-ul-sum .fx-f.x{font-size:13px}
  .fx-st-field{height:170px}
  .fx-st-field .ct{width:22px;height:22px;margin:-11px 0 0 -11px}
  .fx-rm-bar .fx-c,.fx-rw-row .fx-c{font-size:12.5px}
  .fx-br b{font-size:13px}
  .fx-rw-row{grid-template-columns:44px minmax(0,1fr);gap:8px}
  .fx-rw-row .nm{font-size:13px}
  .fx-story{font-size:15.5px;padding:10px 12px}
  .fx-ul-sum .lcm{font-size:12.5px}
  .fx-rm-w,.fx-rw-w{font-size:15px;padding:10px 12px}
}
@media (prefers-reduced-motion:reduce){
  .fx-hero .fx-sc{animation:none;opacity:0}.fx-hero .fx-s3{opacity:1}
  .fx-hbar i.on,.fx-hset .g.on i{animation:none;background:var(--sg-blue)}
  .fx-hero .dots{display:none}
  .sg-card .mini .fx-mini .b i{animation:none;background:#93B8F2}
  .sg-card .mini .fx-mini .b+.b i:last-child{background:transparent}
  .fx-c,.fx-c.fine::after,.fx-st-field .ct,.fx-st-field .gp,.fx-br,.fx-rm-out,.fx-ul-row.res,.fx-ul-row .tag .rn{transition:none}
  .fx-c.pop,.fx-st-field .ct.on,.fx-ul-sum .seg,.fx-ul-sum .lcm,.fx-st-w span,.fx-rm-w li,.fx-rw-w li{animation:none}
}