*{padding:0;margin:0;box-sizing:border-box;font-family:Roboto}a{text-decoration:none}li{list-style:none}::-webkit-scrollbar{width:0}input,button{background:transparent;border:none;outline:none}.container{width:100%;max-width:1160px;margin:0 auto;padding:0 15px}@font-face{font-family:Roboto;src:url(/assets/Roboto-Medium-BJbjO3wX.ttf),url(/assets/Roboto-Regular-ia0dPpEo.ttf);font-style:normal}@media (max-width:1200px){.note__list{display:flex;flex-wrap:wrap}}.main-header{display:flex;align-items:center;justify-content:space-between;padding:30px 15px}.main-header h2{font-weight:400;font-size:22px;line-height:127%;color:#323232}.main-header button span{font-weight:500;font-size:14px;line-height:143%;letter-spacing:.01em;text-align:center;color:#6750a4}.main-header button{display:flex;gap:12px;align-items:center;justify-content:center;border-radius:16px;width:120px;height:56px;box-shadow:0 1px 3px #0000004d,0 4px 8px 3px #0000000d;background:#f3edf7}.note__list{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px}.note__list article{padding:16px;box-shadow:0 1px 3px 1px #00000026,0 1px 2px #0000004d;background:#f3edf7;border-radius:16px}.note__list-item-header{display:flex;flex-direction:column}.note__list-item-header.between{flex-direction:row;justify-content:space-between}.note__list article h3{font-family:Roboto;font-weight:500;font-size:16px;line-height:150%;letter-spacing:.01em;color:#1c1b1f}.note__list article span{font-family:Roboto;font-weight:400;font-size:14px;line-height:143%;letter-spacing:.02em;color:#cac4d0}.note__list article p{font-family:Roboto;font-weight:400;font-size:14px;line-height:143%;letter-spacing:.02em;color:#49454f;margin-top:16px}.btns__group{display:flex;align-items:center;justify-content:end;margin-top:16px}.btns__group button{padding:12px;cursor:pointer;display:flex;align-items:center;gap:13px}.btns__group button span{font-weight:500;font-size:14px;line-height:143%;letter-spacing:.01em;text-transform:uppercase;text-align:center;color:#6750a4}.btns__group button.remove span{color:#cf1b1b}.note__list.between{display:flex;flex-direction:column;gap:30px}.header{position:sticky;top:0}.nav{padding:18px 22px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 1px 3px #0000004d,0 4px 4px #00000040;background:#f3edf7;height:64px}.nav h1{font-weight:400;font-size:22px;line-height:127%;text-align:center;color:#1c1b1f;font-family:Roboto;margin-left:auto;margin-right:auto}.nav input{width:90%;color:#000;font-size:16px;font-family:Roboto}.nav input::placeholder{color:#9d9d9d}.modal{position:fixed;top:0;left:0;width:100%;height:100vh;background:#00000059;align-items:center;justify-content:center;transition:.5s;display:none}.modal.show{display:flex;z-index:100}.modal__view{padding:24px;border-radius:24px;background:#f3edf7;width:100%;max-width:312px;transform:scaleY(0);transform-origin:top;transition:.5s}.modal__view.show{transform:scaleY(1)}.modal__view h3{font-family:Roboto;font-weight:400;font-size:24px;line-height:133%;color:#1c1b1f}.modal__view label{border-radius:4px 4px 0 0;width:264px;height:56px;background:#e7e0ec;display:flex;flex-direction:column;padding:8px 16px;margin-top:16px}.modal__view label span{font-weight:400;font-size:12px;line-height:133%;letter-spacing:.03em;color:#6750a4}.modal__view label input{font-weight:400;font-size:16px;line-height:150%;letter-spacing:.03em;color:#49454f}.modal__view label input::placeholder{color:#49454f}.modal__btns{display:flex;align-items:center;justify-content:end;margin-top:24px;gap:8px}.modal__btns button{padding:10px 12px;cursor:pointer;display:block}.modal__btns button span{font-weight:500;font-size:14px;letter-spacing:.01em;text-transform:uppercase;text-align:center;color:#6750a4}.modal__btns button:nth-of-type(1) span{color:#cf1b1b}.note__list-btn{width:56px;height:56px;box-shadow:0 1px 3px #0000004d,0 4px 8px 3px #00000026;display:flex;justify-content:center;align-items:center;border-radius:25%;background:#f3edf7;cursor:pointer;position:fixed;bottom:30px;right:30px}
