@charset "UTF-8";
:root{--yellow:#ffca28;--ink:#191a1c;--muted:#85878b;--border:#37383a;--font:"Microsoft YaHei","PingFang SC",system-ui,sans-serif;--number:"Arial",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:#171819;color:#f4f3f0;font-family:var(--font);font-size:14px;line-height:1.6}button,input{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button,a,summary{touch-action:manipulation}a{color:inherit;text-decoration:none}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--yellow);outline-offset:5px}button{border:0}::selection{background:var(--yellow);color:#171819}.site-header{height:90px;max-width:1440px;padding:0 60px;margin:auto;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:13px;font-size:21px;font-weight:800;letter-spacing:2px;line-height:1.2}.brand svg{width:30px;height:36px;color:var(--yellow)}.brand-sub{display:block;font-size:9px;color:#96989b;letter-spacing:3px;font-weight:400;margin-top:7px}.header-meta{display:flex;gap:11px;align-items:center;font-size:11px;letter-spacing:1.5px;color:#c4c4c5}.status-dot{display:inline-block;flex-shrink:0;width:5px;height:5px;border-radius:50%;background:var(--yellow)}.header-line{height:12px;width:1px;background:#464648;margin:0 5px}.edition{color:#8e8e91}
main{max-width:1320px;margin:auto}.hero{position:relative;height:408px;background:#ffbb17 url("assets/rehan.jpg") center 35%/cover no-repeat;overflow:hidden;color:#171819;border-radius:3px}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#ffbd19 0%,#ffbd19f2 22%,#ffbd1980 40%,transparent 55%)}.hero:after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px #ffffff12}.hero-copy{position:relative;z-index:1;padding:39px 48px}.eyebrow{margin:0 0 18px;display:flex;align-items:center;gap:8px;font:700 10px var(--number);letter-spacing:2px}.eyebrow>span:first-child{height:7px;width:7px;background:#1d1e20}.hero-index{font:400 9px var(--font);letter-spacing:1px;opacity:.6;margin-left:14px}h1{font-size:45px;letter-spacing:-1.5px;line-height:1.3;margin:0 0 16px;font-weight:900}h1>span{position:relative}h1>span:after{content:"";position:absolute;bottom:-1px;left:0;width:100%;height:3px;background:#171819}.hero-description{font-size:12px;line-height:1.9;margin:0;color:#3b341d}.hero-link{display:inline-flex;align-items:center;gap:30px;font-weight:700;font-size:11px;margin-top:20px;border-bottom:1px solid #171819;padding-bottom:5px}.hero-link>span{font-size:19px;line-height:1}.character-label{position:absolute;bottom:60px;right:39px;display:flex;align-items:center;gap:11px}.character-label p{font-weight:800;font-size:18px;line-height:1.4;margin:0}.character-label small{font:700 8px var(--number);display:block;letter-spacing:1.5px;margin-top:4px}.character-line{height:36px;width:3px;background:#171819}.character-number{font:800 45px var(--number);margin-left:10px;opacity:.25}.hero-bottom{position:absolute;bottom:0;left:0;right:0;background:#191a1c0d;border-top:1px solid #17181926;height:36px;padding:0 48px;display:flex;align-items:center;justify-content:space-between;font:700 8px var(--number);letter-spacing:2px}.hero-bottom>span:last-child{font:10px var(--font);letter-spacing:1px}.hero-bottom>span:last-child>span{margin-left:12px}
.workspace{display:grid;grid-template-columns:1.08fr 1fr;gap:20px;margin-top:24px}.input-panel,.result-panel{border:1px solid var(--border);border-radius:4px;overflow:hidden;background:#202123}.input-panel{padding:28px 32px 24px}.section-top{display:flex;align-items:center;justify-content:space-between}.overline{font:700 9px var(--number);letter-spacing:2px;color:#999a9c;margin:0 0 6px}h2{font-size:20px;letter-spacing:.5px;line-height:1.5;margin:0;font-weight:650}.step-number{color:#46474a;font:300 31px var(--number);align-self:flex-start}.panel-description{font-size:11px;color:#8d8f92;margin:13px 0 24px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:19px 22px}.field label{font-size:12px;color:#d2d3d4;display:flex;align-items:center;gap:8px;margin-bottom:8px}.field-icon{font-family:var(--number);color:#96989a;font-size:16px;width:16px;line-height:1}.input-wrap{position:relative}.input-wrap input{height:49px;width:100%;padding:0 35px 0 15px;border:1px solid #404143;border-radius:3px;background:#191a1c;color:#f2f2f1;font:500 23px var(--number);font-variant-numeric:tabular-nums;outline:none;transition:border-color .15s,box-shadow .15s;appearance:textfield}.input-wrap input::-webkit-inner-spin-button,.input-wrap input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.input-wrap input:focus{border-color:var(--yellow);box-shadow:0 0 0 2px #ffca2815}.input-wrap input[aria-invalid=true]{border-color:#ff8b70}.input-wrap>span{position:absolute;right:15px;top:50%;transform:translateY(-50%);color:#77797c;font:14px var(--number);pointer-events:none}.field small{font-size:10px;color:#797b7e;display:block;margin-top:6px}.field-error{color:#ff9e86;font-size:11px;margin:3px 0 0}.field-error:empty{display:none}.form-actions{display:flex;gap:10px;margin-top:25px}.calculate-btn{display:flex;align-items:center;justify-content:center;gap:20px;height:47px;background:var(--yellow);color:#191919;border-radius:3px;font-size:13px;font-weight:750;flex:1;transition:background .15s,transform .15s}.calculate-btn:hover{background:#ffd65b}.calculate-btn:active{transform:translateY(1px)}.calculate-btn>span{font:22px var(--number)}.reset-btn{width:48px;border-radius:3px;background:transparent;border:1px solid #46474a;display:grid;place-items:center;color:#aaa}.reset-btn:hover{color:var(--yellow);border-color:var(--yellow)}.reset-btn svg{height:18px;width:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.form-note{font-size:10px;color:#797b7e;margin:13px 0 0;display:flex;gap:7px;align-items:center}.form-note>span{font-size:16px;line-height:1}
.result-panel{display:flex;flex-direction:column;background:linear-gradient(135deg,#2d2b24 0%,#242526 50%,#202123 100%)}.result-panel>.section-top{padding:28px 30px 0}.result-state{font-size:9px;letter-spacing:1px;color:#b4ad93;border:1px solid #ffca2833;padding:3px 8px;border-radius:2px}.result-state.pending{color:var(--yellow)}.result-body{padding:21px 30px 19px;transition:opacity .2s;flex:1}.result-body.is-stale{opacity:.5}.result-label{font-size:11px;color:#b0ada3;margin:0}.frequency{display:flex;align-items:baseline;gap:12px;margin-top:0;line-height:1.25}.frequency output{font:700 66px/1.2 var(--number);letter-spacing:-3px;color:var(--yellow);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;min-width:0}.frequency>span{font-size:11px;color:#97948a;white-space:nowrap}.tier-summary{display:flex;align-items:center;gap:11px;border-top:1px solid #ffffff0d;border-bottom:1px solid #ffffff0d;padding:15px 0;margin:12px 0 20px}.tier-emblem{width:35px;height:39px;display:grid;place-items:center;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:#ffca2819;color:var(--yellow);font:700 22px Georgia,serif}.tier-summary p{font-size:15px;margin:0 0 1px;font-weight:600}.tier-summary small{font-size:10px;color:#95948f}.tier-tag{margin-left:auto;font:700 9px var(--number);color:#b7a45c;letter-spacing:1px;white-space:nowrap}.progress-heading{display:flex;justify-content:space-between;gap:10px;font-size:10px;color:#c8c5bb;margin-bottom:11px}.progress-heading>span:last-child{font-size:9px;color:#9e9b90;text-align:right}.progress-track{height:5px;position:relative;background:#454339;border-radius:2px}.progress-track>span{display:block;height:100%;background:var(--yellow);border-radius:2px;transition:width .4s ease;max-width:100%}.progress-track>i{position:absolute;width:2px;top:-2px;height:9px;background:#242424}.progress-ticks{position:relative;height:22px;margin-top:7px;color:#89877e;font:9px var(--number)}.progress-ticks>span{position:absolute}.progress-ticks>span:nth-child(2){left:33.333%;transform:translateX(-50%)}.progress-ticks>span:nth-child(3){left:50%;transform:translateX(-50%)}.progress-ticks>span:last-child{right:0}.tick-unit{font:8px var(--font)}.result-note{font-size:9px;color:#7e7e78;margin:7px 0 0;min-height:15px}.result-footer{display:flex;align-items:center;gap:7px;border-top:1px solid #ffffff0b;background:#ffffff02;min-height:44px;padding:8px 30px;font-size:9px;color:#97968f}.result-footer .status-dot{width:4px;height:4px;background:#a39253}.result-footer button{margin-left:auto;padding:2px 0 2px 10px;background:transparent;color:#d2cbb3;white-space:nowrap;font-size:10px}.result-footer button:hover{color:var(--yellow)}.result-footer button>span{margin-left:8px;font-size:14px}
.tier-section{margin-top:31px}.tier-heading{display:flex;align-items:center;gap:20px;margin-bottom:17px}.tier-heading h2{font-size:16px}.tier-heading p{font-size:10px;color:#7e8082;margin:0}.tier-heading>span{margin-left:auto;font-size:9px;letter-spacing:1px;color:#6d6f72}.tier-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.tier-card{border:1px solid #333537;border-radius:3px;padding:18px 21px 16px;background:#1d1e20;transition:border-color .2s,background .2s}.tier-card>div:first-child{display:flex;align-items:center;justify-content:space-between}.tier-num{font:500 24px var(--number);color:#616367;letter-spacing:-1px}.current-marker{font-size:8px;color:var(--yellow);border:1px solid #ffca2833;background:#ffca280a;padding:2px 6px;visibility:hidden}.tier-card h3{font-size:13px;font-weight:500;margin:10px 0 4px;color:#b9babc}.tier-card p{font-size:11px;color:#8e9093;margin:0}.tier-card p>span{font-size:9px;color:#66686b;margin-left:4px;white-space:nowrap}.tier-card-line{height:2px;background:#323335;margin-top:18px}.tier-card-line>span{display:block;height:100%;background:#5e6062;width:25%}.tier-card:nth-child(2) .tier-card-line>span{width:50%}.tier-card:nth-child(3) .tier-card-line>span{width:75%}.tier-card:nth-child(4) .tier-card-line>span{width:100%}.tier-card.active{border-color:#a68a32;background:linear-gradient(135deg,#302c20,#23231f)}.tier-card.active .tier-num,.tier-card.active h3{color:var(--yellow)}.tier-card.active .current-marker{visibility:visible}.tier-card.active .tier-card-line>span{background:var(--yellow)}
.formula-details{border-top:1px solid #333436;border-bottom:1px solid #333436;margin-top:25px}.formula-details summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:18px 0;color:#a3a4a6;font-size:11px}.formula-details summary::-webkit-details-marker{display:none}.formula-details summary>span:first-child>span{font:italic 18px Georgia,serif;color:#9b8b52;margin-right:11px}.details-plus{font-size:18px;color:#8c8d8f;line-height:1}.formula-details[open] .details-plus{transform:rotate(45deg)}.formula-content{padding:0 0 21px;color:#929497;font-size:11px;line-height:1.9}.formula-content p{margin:9px 0}.formula-content code{display:block;background:#111213;padding:10px 14px;border:1px solid #303133;border-radius:3px;white-space:normal;overflow-wrap:anywhere;color:#d6c480;font:11px/1.9 Consolas,monospace}.site-footer{max-width:1320px;margin:24px auto 0;padding-bottom:28px;display:flex;align-items:center;gap:24px;color:#67696c;font-size:9px}.footer-brand{font:800 12px var(--number);letter-spacing:1px;color:#a2a2a0}.footer-brand>span{font-size:8px;font-weight:400;letter-spacing:1px;margin-left:6px;color:#727471}.site-footer p{margin:0}.site-footer p>span{margin:0 7px}.site-footer>a{margin-left:auto;color:#949596}.site-footer>a:hover{color:var(--yellow)}.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}
@media(min-width:1500px){.site-header{max-width:1440px}main,.site-footer{max-width:1320px}.hero{height:440px}.hero-copy{padding-top:45px}h1{font-size:50px}.hero-description{font-size:13px}.hero-link{margin-top:24px}.hero{background-position:center 36%}}
@media(max-width:1400px){.site-header{padding:0 44px}main,.site-footer{margin-left:44px;margin-right:44px}.hero{height:380px}.hero-copy{padding:32px 38px}h1{font-size:41px}.hero-description{font-size:11px}.hero-bottom{padding:0 38px}.input-panel{padding:26px}.result-panel>.section-top{padding:26px 26px 0}.result-body{padding:20px 26px 17px}.result-footer{padding-left:26px;padding-right:26px}}
@media(max-width:1000px){.site-header{padding:0 28px;height:78px}main,.site-footer{margin-left:28px;margin-right:28px}.hero{height:350px;background-position:58% center}.hero-copy{padding:32px}.hero:before{background:linear-gradient(90deg,#ffbd19 0%,#ffbd19ee 26%,#ffbd1966 49%,transparent 65%)}h1{font-size:37px}.character-label{right:23px;bottom:53px}.character-label p{font-size:15px}.character-number{font-size:35px}.workspace{gap:15px;grid-template-columns:1fr 1fr}.input-panel{padding:23px 22px}.fields{gap:17px 15px}.panel-description{font-size:10px}.result-panel>.section-top{padding:23px 22px 0}.result-body{padding:20px 22px 13px}.frequency output{font-size:58px}.tier-summary{gap:8px}.tier-summary p{font-size:13px}.tier-tag{font-size:8px}.result-footer{padding-left:22px;padding-right:22px}.tier-card{padding:16px}.tier-card p{font-size:10px}.tier-card p>span{margin-left:0}.tier-heading{gap:14px}.tier-grid{gap:10px}}
@media(max-width:760px){.site-header{height:74px;padding:0 20px}.brand{font-size:18px;gap:9px}.brand svg{width:24px}.brand-sub{font-size:8px;letter-spacing:2px}.header-meta{font-size:9px;letter-spacing:.5px}.header-line,.edition{display:none}main,.site-footer{margin-left:20px;margin-right:20px}.hero{height:355px;background-size:auto 100%;background-position:53% center}.hero:before{background:linear-gradient(90deg,#ffbd19 0%,#ffbd19f0 20%,#ffbd19a0 43%,#ffbd1922 73%)}.hero-copy{padding:30px 25px}.eyebrow{font-size:8px;letter-spacing:1.5px;gap:6px}.hero-index{display:none}h1{font-size:35px}.hero-description{font-size:10px;line-height:1.9;max-width:260px;color:#302912}.hero-link{font-size:10px;margin-top:21px}.hero-bottom{padding:0 25px;font-size:6px;letter-spacing:1px}.hero-bottom>span:last-child{font-size:8px}.character-label{right:16px;bottom:48px;gap:7px}.character-label p{font-size:12px}.character-label small{font-size:6px;letter-spacing:.5px}.character-line{height:26px;width:2px}.character-number{font-size:28px;margin-left:0}.workspace{grid-template-columns:1fr;gap:16px;margin-top:18px}.input-panel{padding:25px}.panel-description{font-size:11px;margin-top:12px}.fields{gap:19px 20px}.field label{font-size:12px}.input-wrap input{height:50px}.form-actions{margin-top:24px}.calculate-btn{height:48px}.result-panel>.section-top{padding:25px 25px 0}.result-body{padding:20px 25px}.frequency output{font-size:68px}.tier-summary p{font-size:15px}.tier-tag{font-size:9px}.tier-summary{margin-top:15px}.result-footer{padding:11px 25px}.tier-heading{flex-wrap:wrap;gap:4px 12px}.tier-heading h2{font-size:16px}.tier-heading p{font-size:9px}.tier-heading>span{display:none}.tier-section{margin-top:27px}.tier-grid{grid-template-columns:1fr 1fr;gap:12px}.tier-card{padding:16px 18px}.tier-card p{font-size:10px}.tier-card p>span{font-size:8px}.site-footer{flex-wrap:wrap;gap:10px 12px;margin-top:22px;padding-bottom:25px}.site-footer p{order:3;width:100%;font-size:8px}.site-footer>a{font-size:9px}}
@media(max-width:380px){main,.site-footer{margin-left:14px;margin-right:14px}.site-header{padding:0 14px}.header-meta{font-size:8px}.brand{font-size:16px}.hero-copy{padding-left:22px}h1{font-size:31px}.hero{height:340px}.input-panel{padding:22px}.fields{gap:18px 14px}.field small{font-size:9px}.panel-description{font-size:10px}.frequency output{font-size:59px}.tier-card{padding:14px}.current-marker{font-size:7px;padding:2px 4px}.progress-heading{font-size:9px}}
.character-label{background:#ffca28ec;padding:8px 12px;border-radius:2px}
@media(max-width:760px){.character-label{padding:6px 9px}.hero:before{background:linear-gradient(90deg,#ffbd19 0%,#ffbd19f5 27%,#ffbd1999 53%,#ffbd1922 75%)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}