:root{font-family:PingFang SC,Microsoft YaHei,Helvetica Neue,Roboto,Droid Sans Fallback,WenQuanYi Micro Hei,sans-serif;color:#1d2a2b;background:#f4f0e7;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at 18% 4%,#fff8dc 0,transparent 32%),radial-gradient(circle at 88% 12%,#d9eee8 0,transparent 30%),#f4f0e7}.app-shell{width:min(1120px,calc(100% - 32px));margin:auto;padding:48px 0 32px}header{text-align:center}h1{font-size:clamp(34px,5vw,64px);letter-spacing:-.06em;line-height:1.05;margin:14px 0 12px}h1 em{color:#db5c3b;font-style:normal}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.22em;color:#39786f}.lead{font-size:17px;color:#65706e;margin:0}.case-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:36px 0 14px}.case-tabs button{border:1px solid #d7d2c7;background:#fffa;border-radius:18px;padding:15px 8px;font-size:18px;font-weight:800;color:#596260;cursor:pointer;transition:.25s}.case-tabs button:hover{transform:translateY(-2px)}.case-tabs button.active{color:#fff;background:#213d3a;border-color:#213d3a;box-shadow:0 12px 28px #173c3524}.case-tabs small{display:block;font-size:12px;margin-top:5px;opacity:.7}.stage{background:#fffdf8;border:1px solid #e4ded1;border-radius:34px;padding:30px 36px 26px;box-shadow:0 24px 60px #3e493d14}.formula{display:flex;justify-content:center;align-items:center;gap:15px;font-size:34px;font-weight:800}.formula span{padding:5px 12px;border-radius:12px}.formula .positive{color:#247a70;background:#e3f3ef}.formula .negative{color:#d55235;background:#fbe6df}.formula strong{font-size:44px}.model-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin:24px auto 50px;max-width:800px}.model-row>div{display:flex;align-items:center;justify-content:center;gap:8px;border-radius:14px;padding:11px;background:#f3f1eb;color:#69706d;font-size:14px}.model-row .flip-on{background:#fff0cc;color:#775519}.dot{width:9px;height:9px;border-radius:50%}.step-dot{background:#d85c3b}.move-dot{background:#287d72}.flip-symbol{font-size:20px}.number-line-wrap{padding:30px 16px 34px}.number-line{height:112px;position:relative;margin:0 18px}.axis{position:absolute;left:0;right:0;top:68px;height:3px;background:#344542}.axis:before,.axis:after{content:"";position:absolute;top:-5px;border:6px solid transparent}.axis:before{left:-10px;border-right-color:#344542}.axis:after{right:-10px;border-left-color:#344542}.tick{position:absolute;top:60px;transform:translate(-50%);text-align:center}.tick i{display:block;width:2px;height:17px;background:#344542;margin:auto}.tick span{display:block;font-size:12px;margin-top:7px;color:#737a76}.jump{position:absolute;height:34px;border:3px solid #dd6a48;border-bottom:0;border-radius:50% 50% 0 0;opacity:0;transform:scaleX(.2);transition:.45s ease;transform-origin:center bottom}.jump.shown{opacity:1;transform:scaleX(1)}.jump:after{content:"";position:absolute;bottom:-5px;border:6px solid transparent}.jump.right:after{right:-5px;border-left-color:#dd6a48}.jump.left:after{left:-5px;border-right-color:#dd6a48}.jump span{position:absolute;left:50%;top:-18px;transform:translate(-50%);font-size:11px;color:#b0472d;font-weight:800}.traveler{position:absolute;top:54px;transform:translate(-50%);width:30px;height:30px;border-radius:50%;background:#1f756b;border:5px solid #fff;box-shadow:0 4px 14px #1f756b55;transition:left .55s cubic-bezier(.2,.8,.2,1);z-index:4}.traveler span{position:absolute;top:32px;left:50%;transform:translate(-50%);background:#1f756b;color:#fff;padding:2px 7px;border-radius:8px;font-size:11px}.controls{display:flex;justify-content:center;gap:10px;margin-top:12px}.controls button{height:46px;border-radius:14px;border:0;font-weight:800;cursor:pointer}.controls button:disabled{opacity:.45;cursor:default}.reset{width:46px;background:#eeeae1;font-size:20px}.play{min-width:142px;background:#db5c3b;color:#fff;font-size:15px}.next{padding:0 20px;background:#dcece8;color:#246b62}.progress{display:flex;justify-content:center;gap:7px;margin-top:16px}.progress span{width:32px;height:4px;background:#dedbd3;border-radius:4px}.progress span.done{background:#db5c3b}.insight{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:28px;max-width:750px;margin:18px auto 0}.insight>div:not(.operator){background:#fff9;border:1px solid #e1dbcf;border-radius:22px;padding:18px;text-align:center}.insight p{font-size:12px;color:#7b817e;margin:8px 0 4px}.insight strong{font-size:15px}.mini-axis{font-size:38px;color:#db5c3b}.mini-axis.actual{color:#25766d}.operator{font-size:34px;color:#a98433}footer{display:flex;justify-content:center;gap:16px;align-items:center;margin-top:22px;color:#5c6764}footer strong{font-size:20px;color:#263e3a}.spotlight{max-width:900px;margin:10vh auto;padding:40px;color:#1d2a2b}.spotlight h1{margin-top:18px}.spotlight p{font-size:20px;color:#66716e}.spotlight-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}.spotlight-grid div{background:#fff;border-radius:20px;padding:28px;font-weight:700}@media (max-width:720px){.app-shell{width:min(100% - 18px,1120px);padding-top:28px}.case-tabs{grid-template-columns:repeat(2,1fr)}.stage{padding:24px 12px}.model-row{grid-template-columns:1fr;margin:20px 0 26px;gap:7px}.number-line-wrap{overflow-x:auto;padding-left:0;padding-right:0}.number-line{min-width:650px}.insight{gap:8px}.insight .operator{font-size:24px}.insight>div:not(.operator){padding:12px 6px}.controls{flex-wrap:wrap}footer{flex-direction:column;gap:4px}.spotlight-grid{grid-template-columns:1fr}}