:root{color-scheme:light;--bg:#f7f9fc;--card:#fff;--ink:#172139;--muted:#7e8798;--line:#e7ebf1;--blue:#586cf5}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px "Segoe UI",Arial,sans-serif}header{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 max(calc((100vw - 1000px)/2),5vw);background:var(--card);border-bottom:1px solid var(--line)}a{color:inherit;text-decoration:none}nav{display:flex;gap:30px;color:var(--muted)}button,select{font:inherit;cursor:pointer}.brand{font-weight:700;font-size:20px;color:var(--ink)}header button{margin-right:14px;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:9px;padding:8px 11px}.online{color:#36b782}main{max-width:1000px;padding:0 22px;margin:auto}.intro{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:center;padding:55px 0 28px}.intro small,#how small{color:var(--blue);font-weight:700}.intro h1{font-size:50px;line-height:1.2;margin:14px 0}.intro em,#how em{font-style:normal;color:var(--blue)}.intro p{line-height:1.9;color:var(--muted);max-width:400px}.intro b{color:#4b9c78;font-size:13px}.ad{height:90px;border:1px dashed #d6dce7;border-radius:9px;background:#f0f2f6;display:grid;place-items:center;color:#9aa3b1;font-size:11px;position:relative}.ad small{position:absolute;top:6px;right:8px}.tabs{display:flex;gap:8px;padding:6px;background:#edf0f6;border-radius:11px;margin-bottom:14px}.tabs button{flex:1;border:0;background:transparent;color:var(--muted);padding:12px;border-radius:8px}.tabs .selected{background:var(--card);color:var(--blue);font-weight:700;box-shadow:0 2px 8px #26345610}#tools{max-width:660px;margin:0 auto 35px}.card{background:var(--card);padding:25px;border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 45px #28375c0d}.card h2{margin:0 0 4px;font-size:19px}.card>p{color:var(--muted);font-size:12px;margin:0 0 17px}.drop{height:170px;border:1px dashed #cbd3e1;border-radius:10px;background:#fafbfe;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;color:var(--blue);font-size:25px;cursor:pointer}.drop strong{font-size:14px;color:var(--ink)}.drop small{font-size:10px;color:#9aa3b1}.drop input{max-width:220px;font-size:11px;color:var(--muted)}.setting{display:flex;align-items:center;justify-content:space-between;margin:20px 0 8px}.setting label{font-size:13px}.setting b{color:var(--blue)}input[type=range]{width:100%;accent-color:var(--blue)}select{padding:8px;border:1px solid var(--line);border-radius:7px;background:var(--card);color:var(--ink)}.primary{width:100%;border:0;border-radius:9px;background:var(--blue);color:white;padding:13px;font-weight:700;margin-top:13px}.primary:disabled{opacity:.5}.note{text-align:center;color:var(--muted);font-size:10px;margin:12px 0 0!important}.banner{max-width:660px;margin:30px auto 50px}.metrics{display:flex;justify-content:space-around;text-align:center;color:var(--muted);font-size:11px;border:1px solid var(--line);border-radius:9px;padding:13px}.metrics div{display:grid;gap:5px}.metrics strong{font:600 19px Arial;color:var(--ink)}#status{text-align:center;color:var(--muted);font-size:12px;margin-top:15px}.dial{height:160px;width:160px;border:9px solid #e4e8f5;border-top-color:var(--blue);border-radius:50%;margin:16px auto;display:flex;align-items:center;justify-content:center;flex-direction:column}.dial strong{font:600 40px Arial}.dial small{color:var(--muted)}#results{margin-bottom:35px}.row{display:grid;grid-template-columns:55px 1fr auto auto;gap:12px;align-items:center;border:1px solid var(--line);padding:10px;border-radius:9px;margin:9px 0}.row img{width:55px;height:48px;object-fit:cover;border-radius:6px}.sizes{font-size:10px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap}#how{text-align:center;padding:30px 0 65px;color:var(--muted)}#how h2{color:var(--ink);font-size:28px}footer{border-top:1px solid var(--line);padding:22px max(calc((100vw - 1000px)/2),5vw);display:flex;justify-content:space-between;color:var(--muted)}body.dark{color-scheme:dark;--bg:#121a28;--card:#1c2535;--ink:#edf1fb;--muted:#a1acc0;--line:#303a4c;--blue:#8290ff}body.dark .drop,body.dark .ad{background:#172131;border-color:#3a4559}body.dark .tabs{background:#202b3c}@media(max-width:620px){header{padding:0 14px}nav{display:none}.intro{grid-template-columns:1fr;gap:20px;padding-top:35px}.intro h1{font-size:43px}.ad{height:70px}main{padding:0 14px}.card{padding:20px 15px}.metrics{padding:10px 2px}.metrics div{font-size:9px}.row{grid-template-columns:42px 1fr auto;gap:8px}.row img{width:42px;height:40px}.sizes{font-size:9px}}