.size-tool-intro{display:grid;grid-template-columns:1.1fr .65fr;gap:70px;align-items:end;padding-top:62px;padding-bottom:62px}.size-tool-intro h1{max-width:780px;margin:15px 0 0;font-size:clamp(3.2rem,6.8vw,6.7rem);line-height:.95;letter-spacing:-.06em}.size-tool-intro h1 span,.size-explainer h2 span,.size-download h2 span{color:var(--accent)}.size-tool-intro>p{margin:0 0 7px;padding-top:22px;border-top:1px solid var(--border);color:var(--muted);font-size:.88rem;line-height:1.85}
.calculator-layout{display:grid;grid-template-columns:minmax(330px,.65fr) minmax(0,1.35fr);gap:14px;padding-bottom:104px}.calculator-controls,.calculator-result{min-width:0;border:1px solid var(--border);border-radius:8px;background:var(--card)}.calculator-controls{padding:23px}.calculator-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}.calculator-heading h2{margin:7px 0 0;font-size:1.25rem}.icon-command{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--border);border-radius:5px;color:var(--text);background:transparent;cursor:pointer;font-size:1.2rem}.icon-command:hover{border-color:var(--accent);color:var(--accent)}.input-grid{display:grid;grid-template-columns:1fr 1fr;gap:23px 14px}.input-grid label>span{display:flex;justify-content:space-between;gap:10px;margin-bottom:8px;color:var(--muted);font-size:.67rem;font-weight:750;text-transform:uppercase}.input-grid output{color:var(--text)}.input-grid input[type=range]{width:100%;accent-color:var(--accent)}.input-grid input[type=number]{width:100%;height:44px;padding:0 11px;color:var(--text);background:var(--bg-deep);border:1px solid var(--border);border-radius:5px;font:inherit}.input-grid input:focus{outline:2px solid rgba(255,113,11,.25);border-color:var(--accent)}.preset-devices{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:26px}.preset-devices button{min-height:44px;padding:7px;border:1px solid var(--border);border-radius:5px;color:var(--muted);background:transparent;cursor:pointer;font-size:.64rem;font-weight:750}.preset-devices button:hover,.preset-devices button.is-active{color:var(--text);border-color:var(--accent);background:rgba(255,113,11,.1)}.input-note{margin:20px 0 0;color:var(--muted);font-size:.65rem;line-height:1.7}
.calculator-result{overflow:hidden}.result-preview{position:relative;overflow:hidden;aspect-ratio:16/9;background:#080807}.result-preview:after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.08);pointer-events:none}.result-preview>img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.8) contrast(1.06)}.preview-caption{position:absolute;z-index:2;right:14px;bottom:12px;color:rgba(255,255,255,.7);font-size:.55rem}.size-crosshair{--preview-size:24px;position:absolute;z-index:2;top:50%;left:50%;width:var(--preview-size);height:var(--preview-size);transform:translate(-50%,-50%)}.size-crosshair i{position:absolute;top:50%;left:50%;background:var(--cyan);box-shadow:0 0 0 1px #111,0 0 4px rgba(0,231,240,.55);transform:translate(-50%,-50%)}.size-crosshair i:first-child{width:100%;height:2px}.size-crosshair i:last-child{width:2px;height:100%}.result-metrics{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.result-metrics article{min-width:0;padding:18px;border-right:1px solid var(--border)}.result-metrics article:last-child{border-right:0}.result-metrics span,.result-metrics strong{display:block}.result-metrics span{color:var(--muted);font-size:.61rem;text-transform:uppercase}.result-metrics strong{margin-top:8px;overflow:hidden;color:var(--accent-soft);font-size:1.15rem;font-variant-numeric:tabular-nums}.size-reading{display:flex;gap:13px;align-items:flex-start;padding:21px}.size-reading .status-dot{flex:0 0 auto;margin-top:7px}.size-reading strong{font-size:.85rem}.size-reading p{margin:4px 0 0;color:var(--muted);font-size:.7rem;line-height:1.65}
.size-explainer{display:grid;grid-template-columns:.72fr 1.28fr;gap:90px;padding-top:98px;padding-bottom:103px;border-top:1px solid var(--border)}.size-explainer h2,.size-download h2{margin:14px 0 0;font-size:clamp(2.35rem,4.8vw,4.6rem);line-height:1.02;letter-spacing:-.055em}.explanation-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;border:1px solid var(--border);background:var(--border)}.explanation-grid article{padding:25px 22px;background:var(--bg)}.explanation-grid .mono{color:var(--accent-soft)}.explanation-grid h3{margin:31px 0 10px;font-size:.92rem}.explanation-grid p{margin:0;color:var(--muted);font-size:.72rem;line-height:1.8}.size-download{display:grid;grid-template-columns:1fr 280px;gap:80px;align-items:center;padding-top:92px;padding-bottom:98px;border-top:1px solid var(--border)}.size-download p{max-width:620px;margin:24px 0;color:var(--muted);font-size:.84rem;line-height:1.85}.desktop-qr-card{display:flex;align-items:center;gap:17px;padding:17px;border:1px solid var(--border);border-radius:7px;background:#fff;color:#151513}.desktop-qr-card img{width:116px;height:116px}.desktop-qr-card strong,.desktop-qr-card span{display:block}.desktop-qr-card strong{font-size:.82rem}.desktop-qr-card span{margin-top:5px;color:#666;font-size:.66rem}.tool-faq{padding-top:96px}.mobile-download-bar{display:none}
@media(max-width:980px){.calculator-layout{grid-template-columns:1fr}.calculator-controls{order:2}.size-explainer{display:block}.explanation-grid{margin-top:42px}.size-download{grid-template-columns:1fr 245px;gap:35px}}
@media(max-width:760px){body{padding-bottom:72px}.size-tool-intro{display:block;padding-top:43px;padding-bottom:46px}.size-tool-intro h1{font-size:clamp(3rem,14vw,4.5rem)}.size-tool-intro>p{margin-top:35px}.calculator-layout{width:100%;padding-bottom:75px}.calculator-controls,.calculator-result{border-right:0;border-left:0;border-radius:0}.calculator-controls{padding:20px 17px}.input-grid{grid-template-columns:1fr}.preset-devices{grid-template-columns:1fr}.result-preview{aspect-ratio:4/3}.result-metrics{grid-template-columns:1fr 1fr}.result-metrics article:nth-child(2){border-right:0}.result-metrics article:nth-child(-n+2){border-bottom:1px solid var(--border)}.result-metrics strong{font-size:1rem}.size-explainer{padding-top:75px;padding-bottom:79px}.explanation-grid{grid-template-columns:1fr;margin-top:34px}.size-download{display:block;padding-top:75px;padding-bottom:78px}.desktop-qr-card{display:none}.tool-faq{padding-top:75px}.mobile-download-bar{position:fixed;z-index:20;right:0;bottom:0;left:0;display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:10px;min-height:64px;padding:8px 17px;color:var(--text);background:rgba(20,20,18,.97);border-top:1px solid var(--border);box-shadow:0 -10px 25px rgba(0,0,0,.22)}.mobile-download-bar img{border-radius:8px}.mobile-download-bar b,.mobile-download-bar small{display:block}.mobile-download-bar b{font-size:.72rem}.mobile-download-bar small{margin-top:1px;color:var(--muted);font-size:.6rem}.mobile-download-bar>strong{padding:8px 13px;border-radius:5px;color:#16130f;background:var(--accent);font-size:.7rem}}