:root{--Green-200: hsl(173, 61%, 77%);--Green-400: hsl(172, 67%, 45%);--Green-750: hsl(183, 79%, 24%);--Green-800: hsl(183, 85%, 21%);--Green-900: hsl(183, 100%, 15%);--Orange-400: hsl(13, 70%, 60%);--Grey-50: hsl(189, 47%, 97%);--Grey-200: hsl(185, 41%, 84%);--Grey-300: hsl(184, 19%, 68%);--Grey-400: hsl(184, 14%, 56%);--Grey-500: hsl(186, 14%, 43%);--Grey-550: hsl(180, 18%, 40%);--Grey-600: hsl(180, 25%, 32%);--White: hsl(0, 100%, 100%);--Black: hsl(0, 0%, 0%)}*{margin:0;padding:0;box-sizing:border-box;font-family:space mono,sans-serif;font-weight:700;line-height:24px}body{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;background-color:var(--Grey-200)}.splitter{margin-block:3.125rem;text-align:center}.main-cont{width:23.4375rem;padding:2rem 1.5rem;border-radius:1.5625rem 1.5625rem 0 0;background-color:var(--White);box-shadow:0 32px 43px #4fa6af33}.content-cont{width:20.4375rem;display:flex;flex-direction:column;align-items:center;gap:2rem}label{color:var(--Grey-500)}.bill-cont{width:19.4375rem;display:flex;flex-direction:column;gap:2rem}.bill-cont>*{display:flex;flex-direction:column;gap:.5rem}.cash,.people{width:100%;height:3rem;padding:.5rem 1rem;border:.125rem solid transparent;outline:none;border-radius:.3125rem;background-color:var(--Grey-50);font-size:1.5rem;line-height:2.25rem;text-align:right}.cash::placeholder,.people::placeholder{color:var(--Grey-300)}.cash:focus,.people:focus{border-color:var(--Green-400)}.bill-amount,.people-input{position:relative}.bill-amount:before{content:"";position:absolute;background-image:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='11'%20height='17'%3e%3cpath%20fill='%239EBBBD'%20d='M6.016%2016.328v-1.464c1.232-.08%202.22-.444%202.964-1.092.744-.648%201.116-1.508%201.116-2.58v-.144c0-.992-.348-1.772-1.044-2.34-.696-.568-1.708-.932-3.036-1.092V4.184c.56.144%201.012.4%201.356.768.344.368.516.816.516%201.344v.288h1.824v-.432c0-.448-.088-.876-.264-1.284a3.783%203.783%200%2000-.744-1.116A4.251%204.251%200%20007.54%202.9a5.324%205.324%200%2000-1.524-.492V.872H4.288V2.36a5.532%205.532%200%2000-1.416.324c-.448.168-.84.392-1.176.672-.336.28-.604.616-.804%201.008-.2.392-.3.844-.3%201.356v.144c0%20.96.316%201.708.948%202.244.632.536%201.548.884%202.748%201.044v3.912c-.704-.16-1.248-.472-1.632-.936-.384-.464-.576-1.08-.576-1.848v-.288H.256v.576c0%20.464.08.924.24%201.38.16.456.404.88.732%201.272.328.392.744.728%201.248%201.008s1.108.476%201.812.588v1.512h1.728zM4.288%207.424c-.688-.128-1.164-.332-1.428-.612-.264-.28-.396-.644-.396-1.092%200-.464.176-.832.528-1.104.352-.272.784-.448%201.296-.528v3.336zm1.728%205.712V9.344c.768.128%201.328.328%201.68.6.352.272.528.688.528%201.248%200%20.544-.196.984-.588%201.32-.392.336-.932.544-1.62.624z'/%3e%3c/svg%3e");left:1rem;top:.9375rem;width:.615rem;height:.9663rem}.people-input:before{content:"";position:absolute;background-image:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='13'%20height='16'%3e%3cpath%20fill='%239EBBBD'%20d='M9.573%207.729c.406%200%20.784.07%201.126.209.342.14.639.33.881.569.232.227.438.503.614.82a5.1%205.1%200%2001.407.949c.097.312.178.654.242%201.016.062.359.105.699.126%201.011.02.307.031.624.031.945%200%20.836-.259%201.512-.768%202.01-.504.492-1.17.742-1.98.742H2.748c-.81%200-1.477-.25-1.98-.742C.259%2014.76%200%2014.084%200%2013.248c0-.322.01-.64.032-.945.02-.312.063-.652.126-1.01.063-.363.144-.705.242-1.017.1-.323.238-.643.407-.948.176-.318.382-.594.613-.821.243-.238.54-.43.882-.57.342-.138.72-.208%201.125-.208.16%200%20.313.067.61.265.183.123.397.264.636.421.204.134.48.259.822.372.333.11.671.167%201.005.167a3.19%203.19%200%20001.006-.167c.341-.113.618-.238.822-.372l.636-.42c.296-.2.45-.266.61-.266zM6.598%200C7.63%200%208.522.38%209.252%201.129s1.1%201.666%201.1%202.724c0%201.06-.37%201.976-1.1%202.725-.73.75-1.623%201.13-2.654%201.13-1.03%200-1.924-.38-2.653-1.13-.73-.749-1.1-1.666-1.1-2.725%200-1.058.37-1.975%201.1-2.724C4.675.379%205.567%200%206.598%200z'/%3e%3c/svg%3e");left:1rem;top:1rem;width:.8125rem;height:1rem}.tip-opt-cont{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.tip-btn{width:9.1875rem;height:3rem;padding:.5rem 1rem;background-color:var(--Green-900);color:var(--White);font-size:1.5rem;line-height:2.25rem;border-radius:.3125rem;display:flex;align-items:center;justify-content:center;cursor:pointer}.tip-btn:hover{background-color:var(--Green-200);border:none}.active-tip{background-color:var(--Green-400);border:none}.custom{width:9.1875rem;height:3rem;background-color:var(--Grey-50);font-size:1.5rem;line-height:2.25rem;padding:.5rem;text-align:center;color:var(--Grey-550);border:.125rem solid transparent;border-radius:5px;outline:none}input::-webkit-inner-spin-button{-webkit-appearance:none}.custom:focus{border-color:var(--Green-400)}.custom:focus::placeholder{color:transparent}.label-wrapper{display:flex;justify-content:space-between}.error-msg{color:var(--Orange-400)}.input-error{border-color:var(--Orange-400)!important}.result-container{width:100%;padding:1.5rem;border-radius:.9375rem;background-color:var(--Green-900)}.result-content{display:flex;flex-direction:column;gap:2rem}.results-datails{display:flex;flex-direction:column;gap:1.5rem}.tip-amout-row,.total-amount-row{display:flex;justify-content:space-between}.tip-amout,.total{line-height:1.5rem;color:var(--White)}.person{font-size:.8125rem;line-height:1.1875rem;color:var(--Grey-400)}output{font-size:2rem;color:var(--Green-400)}.reset{height:3rem;border-radius:.3125rem;background-color:var(--Green-750);border:none;font-size:1.25rem;line-height:1.875rem;color:var(--Green-800);padding:.5rem 2rem;text-transform:uppercase;cursor:pointer}.reset:hover{background-color:var(--Green-200);border:none}.active{background-color:var(--Green-400);border:none}@media(min-width:47.5rem){.main-cont{width:38rem;padding:3rem 5rem;border-radius:1.5625rem}.content-cont{width:28.5625rem;gap:2.5rem}.bill-cont{width:28.5625rem;gap:1.5rem}.tip-opt-cont{grid-template-columns:repeat(3,1fr);gap:16px}.result-container{padding:1.5rem 2rem;display:flex;justify-content:center}.result-content{width:22.625rem;gap:1rem}.tip-amout-row,.total-amount-row{align-items:center}.results-datails{gap:.5rem}output{font-size:3rem;line-height:4.4375rem}}@media(min-width:87.5rem){.main-cont{width:57.5rem;padding:2rem;justify-content:center}.content-cont{width:52.5rem;height:26.0625rem;gap:3rem;flex-direction:row}.bill-cont{width:23.6875rem;gap:2.5rem}.tip-btn,.custom{width:115px}.result-container{padding:2rem}.result-content{gap:8rem}.results-datails{gap:1.5rem}}.attribution-list{display:flex;margin-block-start:.625rem;font-size:clamp(.69rem,.75vw + .5rem,.88rem);color:var(--white);list-style:none;gap:1.25rem}.attribution-list li:before{margin-left:-2.5rem}.attribution-list a{color:var(--Green-400);text-decoration:none}