:root{font-family:PingFang SC,Microsoft YaHei,Helvetica Neue,Roboto,Droid Sans Fallback,WenQuanYi Micro Hei,sans-serif;color:#19332f;background:#f5f0e7;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 8% 12%,rgba(255,209,123,.34),transparent 28%),radial-gradient(circle at 92% 6%,rgba(112,197,177,.3),transparent 30%),#f5f0e7}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.app-shell{width:min(1100px,calc(100% - 32px));margin:0 auto;padding:48px 0 40px}.hero{text-align:center;max-width:850px;margin:0 auto 28px}.eyebrow{display:inline-block;color:#287568;font-size:12px;font-weight:850;letter-spacing:.2em;text-transform:uppercase}.hero h1{margin:14px 0 10px;font-size:clamp(35px,5.6vw,68px);line-height:1.03;letter-spacing:-.065em}.hero h1 em{color:#dc5b3f;font-style:normal}.hero p{margin:0;color:#687470;font-size:17px}.experiment{overflow:hidden;padding:28px 34px 26px;border:1px solid #e2dacb;border-radius:36px;background:#fffdf8ed;box-shadow:0 26px 70px #2a40371c}.formula-stage{min-height:126px;display:grid;place-items:center;text-align:center}.starting-formula{display:flex;align-items:center;gap:14px;color:#75817d;font-weight:750}.starting-formula strong{display:grid;width:62px;height:62px;place-items:center;border-radius:50%;color:#fff;background:#24776b;font-size:34px;box-shadow:0 10px 26px #24776b42}.formula-line{display:flex;align-items:center;justify-content:center;gap:clamp(8px,1.7vw,20px);max-width:100%;font-size:clamp(19px,3vw,32px);font-weight:800}.power-expression{white-space:nowrap;color:#263e39}sup{margin-left:2px;font-size:.56em;vertical-align:super}.factor-chain{display:flex;align-items:center;gap:7px;overflow:hidden}.factor{white-space:nowrap;color:#b14933}.times,.equals{color:#a59e91;font-weight:500}.formula-line strong,.summary-power strong{font-size:1.28em}.is-positive{color:#167b6c}.is-negative{color:#d6553a}.number-line-stage{max-width:820px;margin:0 auto 18px;padding:8px 28px 14px;border-radius:28px;background:#f8f5ee}.number-line-rule{display:flex;align-items:center;justify-content:center;gap:7px;color:#7b817d;font-size:12px;font-weight:760}.number-line-rule strong{padding:5px 11px;border-radius:999px;color:#755f2b;background:#fff0bb;font-size:13px}.number-line-axis{position:relative;height:112px;margin:0 auto}.axis-base{position:absolute;top:68px;left:8%;right:8%;height:3px;border-radius:999px;background:#52635f}.axis-base:before,.axis-base:after{content:"";position:absolute;top:-5px;border:6px solid transparent}.axis-base:before{left:-11px;border-right-color:#52635f}.axis-base:after{right:-11px;border-left-color:#52635f}.axis-tick{position:absolute;top:60px;z-index:2;display:grid;justify-items:center;transform:translate(-50%);color:#6e7774;transition:color .35s ease,transform .35s ease}.axis-tick i{width:3px;height:18px;border-radius:3px;background:currentColor}.axis-tick strong{display:grid;min-width:42px;height:34px;margin-top:5px;place-items:center;border-radius:11px;font-size:18px;transition:background-color .35s ease,box-shadow .35s ease}.axis-tick--negative{left:18%}.axis-tick--zero{left:50%}.axis-tick--positive{left:82%}.axis-tick--negative.is-active{color:#cf5036}.axis-tick--positive.is-active{color:#14786a}.axis-tick.is-active{transform:translate(-50%) translateY(-2px)}.axis-tick--negative.is-active strong{background:#f8ded7;box-shadow:0 7px 16px #cf503629}.axis-tick--positive.is-active strong{background:#dcefe9;box-shadow:0 7px 16px #14786a29}.axis-tick.is-origin{color:#253e39}.axis-tick.is-origin i{width:7px;height:24px;margin-top:-3px;border-radius:7px}.direction-vector{position:absolute;z-index:4;top:45px;left:50%;width:32%;height:7px;transform-origin:left center;border-radius:999px;color:#177b6d;background:currentColor;box-shadow:0 5px 14px #1e5b5133;transition:transform .62s cubic-bezier(.22,.78,.2,1),color .35s ease}.direction-vector:before{content:"";position:absolute;left:-8px;top:50%;width:15px;height:15px;transform:translateY(-50%);border:4px solid #fffdf8;border-radius:50%;background:#263f3a;box-shadow:0 3px 9px #263f3a38}.direction-vector:after{content:"";position:absolute;right:-5px;top:50%;transform:translateY(-50%);border-top:12px solid transparent;border-bottom:12px solid transparent;border-left:17px solid currentColor}.direction-vector span{position:absolute;left:50%;bottom:13px;width:10px;height:10px;transform:translate(-50%);border-radius:50%;background:currentColor;opacity:.18}.direction-vector--right{transform:rotate(0);color:#177b6d}.direction-vector--left{transform:rotate(-180deg);color:#d6553a}.direction-readout{display:flex;align-items:baseline;justify-content:center;gap:11px;min-height:31px}.direction-readout span{color:#7a817e;font-size:12px;font-weight:720}.direction-readout strong{color:#177b6d;font-size:22px;letter-spacing:.02em}.is-pointing-left .direction-readout strong{color:#d6553a}.controls{display:flex;justify-content:center;gap:10px}.controls button,.exponent-form button{min-height:46px;border:0;border-radius:14px;font-weight:820;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,opacity .2s ease}.controls button:hover:not(:disabled),.exponent-form button:hover{transform:translateY(-2px)}.controls button:focus-visible,.sequence button:focus-visible,.exponent-form input:focus-visible,.exponent-form button:focus-visible{outline:3px solid #efb44b;outline-offset:3px}.controls button:disabled{opacity:.56;cursor:default}.icon-button{width:46px;color:#53635f;background:#eee9df;font-size:20px}.play-button{min-width:142px;padding:0 18px;color:#fff;background:#263f3a;box-shadow:0 10px 22px #263f3a2e}.step-button{padding:0 20px;color:#a53f2a;background:#f8ded6}.sequence{display:grid;grid-template-columns:78px 1fr;gap:10px;max-width:750px;margin:26px auto 0}.sequence-labels{display:grid;grid-template-rows:1fr 1fr;gap:1px;color:#7a827e;font-size:12px;font-weight:760;text-align:right}.sequence-labels span{display:flex;align-items:center;justify-content:flex-end}.sequence-items{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}.sequence button{display:grid;grid-template-rows:1fr 1fr;min-height:72px;padding:0;overflow:hidden;border:1px solid #ded8cd;border-radius:14px;color:#5d6864;background:#f8f5ee;cursor:pointer;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.sequence button:hover{transform:translateY(-2px)}.sequence button.is-current{border-color:#d7a845;box-shadow:0 0 0 3px #e7b3462e}.sequence button span,.sequence button strong{display:grid;place-items:center}.sequence button span{border-bottom:1px solid #e1dbd0;font-size:13px}.sequence button strong{font-size:18px}.pair-summary{width:100%}.summary-power{display:flex;align-items:center;justify-content:center;gap:15px;font-size:clamp(27px,4vw,42px);font-weight:860}.pair-equation{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:16px}.pair-block,.single-block{padding:9px 12px;border:2px solid #e9a94a;border-radius:13px;color:#ad4a32;background:#fff7df;font-weight:820}.pair-block{display:flex;align-items:center;gap:7px}.pair-block b{color:#a59678}.pair-block i{padding-left:9px;border-left:1px solid #e0c797;color:#1c7769;font-style:normal}.pair-count{color:#296b61;font-weight:850}.pair-plus{color:#7b827f;font-size:13px}.pair-summary p{margin:11px 0 0;color:#6e7975;font-size:14px}.explore{display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center;margin-top:22px;padding:25px 30px;border:1px solid #ded7cb;border-radius:26px;background:#fffdf8bd}.explore h2{margin:5px 0 0;font-size:clamp(22px,3.5vw,34px);letter-spacing:-.035em}.exponent-form{position:relative;display:grid;grid-template-columns:auto 118px auto auto;gap:8px;align-items:center}.exponent-form label{color:#69736f;font-size:13px;font-weight:760}.exponent-form input{width:118px;height:46px;padding:0 12px;border:1px solid #cfc7ba;border-radius:13px;color:#213d38;background:#fff;font-size:18px;font-weight:830}.exponent-form input[aria-invalid=true]{border-color:#d3543b}.exponent-form button{padding:0 17px;color:#fff;background:#24776b}.exponent-form .shortcut{color:#24776b;background:#dcefe9}.form-error{position:absolute;top:48px;left:49px;margin:4px 0 0;color:#bc432d;font-size:12px}.pattern-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}.pattern-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:22px 26px;border-radius:22px}.pattern-card span{font-size:13px;font-weight:850;letter-spacing:.08em}.pattern-card div,.pattern-card strong{font-size:clamp(24px,3vw,34px)}.pattern-card div{text-align:center;font-weight:820}.pattern-card--even{color:#176f63;background:#dceee9}.pattern-card--odd{color:#b44731;background:#f7e0d9}.notation-note{margin:18px auto 0;color:#6b7571;font-size:13px;text-align:center}.notation-note strong{color:#394b47}.spotlight-shell{width:min(900px,calc(100% - 36px));margin:10vh auto;padding:44px;text-align:center}.spotlight-shell h1{margin:14px 0 8px;font-size:clamp(48px,9vw,86px);letter-spacing:-.06em}.spotlight-shell p{color:#64716d;font-size:20px}.spotlight-pattern{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:44px}.spotlight-pattern span{display:grid;min-width:170px;height:78px;padding:0 22px;place-items:center;border-radius:22px;color:#fff;background:#24776b;font-size:25px;font-weight:900}.spotlight-pattern span:nth-of-type(odd){background:#d9583d}.spotlight-pattern i{padding:7px 13px;border-radius:999px;color:#755f2b;background:#fff0bb;font-weight:820;font-style:normal}@media (max-width: 760px){.app-shell{width:min(100% - 18px,1100px);padding-top:28px}.hero{margin-bottom:20px}.hero p{font-size:15px}.experiment{padding:22px 12px;border-radius:27px}.formula-stage{min-height:142px}.formula-line{flex-wrap:wrap}.factor-chain{order:5;flex-basis:100%;justify-content:center;font-size:17px}.number-line-stage{padding-right:10px;padding-left:10px}.axis-tick--negative{left:14%}.axis-tick--positive{left:86%}.direction-vector{width:36%}.controls{flex-wrap:wrap}.sequence{grid-template-columns:1fr}.sequence-labels{display:none}.sequence-items{gap:4px}.sequence button{min-height:66px}.pair-equation{flex-wrap:wrap}.pair-summary p{padding:0 8px}.explore{grid-template-columns:1fr;padding:22px 18px 29px}.exponent-form{grid-template-columns:auto 1fr auto}.exponent-form input{width:100%}.exponent-form .shortcut{grid-column:2 / 4}.form-error{top:102px;left:50px}.pattern-cards{grid-template-columns:1fr}.spotlight-pattern{flex-direction:column;gap:8px}.spotlight-pattern span{min-width:160px;height:62px;font-size:20px}}@media (max-width: 410px){.step-button{flex-basis:calc(100% - 56px)}.direction-readout{flex-direction:column;align-items:center;gap:2px}.pair-block{font-size:14px}.pattern-card{padding:19px;gap:8px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}