:root{--ios-blue:#007aff;--ios-green:#34c759;--ios-bg:#f2f2f7;--ios-card:#fff;--ios-text:#1c1c1e;--ios-border:#d1d1d6;--ios-fill:#f7f7f9}*{box-sizing:border-box}html{background:var(--ios-bg);min-height:100%}body{background:radial-gradient(circle at 50% -10%, #ffffffeb, transparent 42rem), var(--ios-bg);min-height:100vh;color:var(--ios-text);-webkit-font-smoothing:antialiased;margin:0;font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,SF Pro Text,Helvetica Neue,Hiragino Sans,sans-serif}button,input,select{font:inherit}button,label,select{-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app-shell{width:min(100% - 48px,1000px);margin:0 auto;padding:58px 0 72px}.page-header{text-align:center}.page-header h1{letter-spacing:-.035em;margin:0;font-size:clamp(38px,5vw,56px);font-weight:700;line-height:1.1}.segment-control{background:#ffffffc7;border:1px solid #3c3c432e;border-radius:18px;grid-template-columns:repeat(3,1fr);width:min(100%,720px);min-height:64px;margin:38px auto 42px;padding:3px;display:grid;overflow:hidden;box-shadow:0 3px 12px #00000014}.segment-control label{min-width:0;min-height:56px;color:var(--ios-text);cursor:pointer;border-radius:15px;place-items:center;font-size:clamp(15px,2.2vw,22px);font-weight:500;transition:color .18s,background-color .18s,box-shadow .18s,transform .12s;display:grid;position:relative}.segment-control label+label:before{content:"";background:#3c3c4329;width:1px;height:60%;position:absolute;left:-1px}.segment-control label.selected{z-index:1;background:linear-gradient(180deg, #1688ff, var(--ios-blue));color:#fff;box-shadow:0 2px 7px #007aff52}.segment-control label.selected:before,.segment-control label.selected+label:before{opacity:0}.segment-control label:active{transform:scale(.985)}.segment-control input{opacity:0;width:1px;height:1px;position:absolute}.segment-control label:has(input:focus-visible){outline-offset:2px;outline:3px solid #007aff59}.calculator-card{background:var(--ios-card);border:1px solid #3c3c4321;border-radius:26px;overflow:hidden;box-shadow:0 14px 42px #00000017,0 2px 8px #0000000a}.product-list{display:grid}.product-row{border-bottom:1px solid #3c3c4329;grid-template-columns:repeat(3,minmax(0,1fr));gap:56px;padding:44px 64px;transition:background-color .18s;display:grid}.product-row.best-row{background:linear-gradient(90deg,#34c75911,#34c7591c,#34c75911)}.field{gap:12px;min-width:0;display:grid}.field-label{color:var(--ios-text);letter-spacing:-.015em;font-size:18px;font-weight:500}.value-input,.result-box{border:1px solid var(--ios-border);width:100%;min-height:74px;color:var(--ios-text);font-variant-numeric:tabular-nums;background:#fafafcdb;border-radius:15px;transition:border-color .15s,box-shadow .15s,background-color .15s,transform .15s}.value-input{appearance:textfield;outline:none;padding:12px 18px;font-size:clamp(25px,3.1vw,36px);font-weight:500}.value-input::-webkit-inner-spin-button{appearance:none;margin:0}.value-input::-webkit-outer-spin-button{appearance:none;margin:0}.value-input::placeholder{color:#c7c7cc}.value-input:focus{border-color:var(--ios-blue);background:#fff;box-shadow:0 0 0 3px #007aff2e}.result-box{color:#aeaeb2;white-space:nowrap;justify-content:space-between;align-items:center;gap:10px;padding:12px 16px 12px 18px;font-size:clamp(24px,3vw,34px);font-weight:500;display:flex}.result-box.has-value{color:var(--ios-text)}.best-badge{background:var(--ios-green);color:#fff;border-radius:999px;flex:none;padding:7px 12px;font-size:15px;font-weight:700;line-height:1}.settings-panel{background:var(--ios-fill);border:1px solid #3c3c4324;border-radius:14px;justify-content:space-between;align-items:center;margin:22px 64px 0;padding:16px 18px;animation:.18s ease-out reveal;display:flex}.settings-panel label{font-size:17px;font-weight:600}.settings-panel select{min-width:108px;min-height:44px;color:var(--ios-blue);background-color:#fff;border:0;border-radius:11px;padding:0 38px 0 14px;font-size:17px;font-weight:600}.button-row{justify-content:flex-end;gap:20px;padding:30px 64px 32px;display:flex}.action-button{border:1px solid var(--ios-border);min-width:150px;min-height:56px;color:var(--ios-blue);cursor:pointer;background:#fff;border-radius:14px;padding:0 24px;font-size:19px;font-weight:600;transition:background-color .15s,border-color .15s,transform .1s,box-shadow .15s}.action-button:hover{background:#f8f8fa;border-color:#b8b8bd}.action-button:active{transform:scale(.975)}.action-button:focus-visible{outline-offset:2px;outline:3px solid #007aff4d}@keyframes reveal{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@media (width<=760px){.app-shell{width:min(100% - 32px,620px);padding:34px 0 48px}.page-header h1{font-size:36px}.segment-control{border-radius:14px;min-height:52px;margin:26px auto 28px}.segment-control label{border-radius:11px;min-height:44px;font-size:14px}.calculator-card{border-radius:22px}.product-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px;padding:28px 20px}.result-field{grid-column:1/-1}.field{gap:8px}.field-label{font-size:14px}.value-input,.result-box{border-radius:13px;min-height:60px}.value-input{padding:10px 14px;font-size:26px}.result-box{padding:10px 13px 10px 14px;font-size:25px}.best-badge{padding:6px 10px;font-size:13px}.settings-panel{margin:18px 20px 0}.button-row{gap:12px;padding:22px 20px 24px}.action-button{flex:1 1 0;min-width:0;min-height:50px;font-size:17px}}@media (width<=380px){.app-shell{width:min(100% - 24px,620px)}.page-header h1{font-size:31px}.segment-control label{font-size:12px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
