.page{background-color:#f3f3f3;min-height:100vh}.page__content{box-sizing:border-box;flex-direction:column;max-width:1360px;min-height:100vh;margin:0 auto;padding:32px 0 0;display:flex}@media screen and (width<=767px){.page__content{padding:18px 16px 0}}.modal{z-index:20;opacity:0;pointer-events:none;background:#00000080;justify-content:center;align-items:center;padding:20px;transition:opacity .2s;display:flex;position:fixed;inset:0}.modal_is-opened{opacity:1;pointer-events:auto}.modal__content{box-sizing:border-box;background:#fff;border-radius:20px;width:496px;min-height:436px;max-height:calc(100dvh - 40px);padding:28px;position:relative;overflow-y:auto}.modal__title{margin:0 0 28px;font-size:20px;font-weight:700;line-height:24px}.modal__close{color:#000;cursor:pointer;background:0 0;border:0;width:24px;height:24px;padding:0;font-size:32px;line-height:20px;position:absolute;top:18px;right:20px}.modal__close:hover{opacity:.7}.modal__form{flex-direction:column;display:flex}.modal-form__label{flex-direction:column;gap:8px;margin-bottom:24px;font-size:16px;line-height:20px;display:flex}.modal-form__input{height:24px;font:inherit;border:0;border-bottom:1px solid #0009;border-radius:0;outline:0;padding:0}.modal-form__input:focus{border-bottom-color:#00a3ff}.modal-form__fieldset{border:0;flex-direction:column;gap:8px;margin:0 0 28px;padding:0;display:flex}.modal-form__legend{margin-bottom:8px;font-size:16px;line-height:20px}.modal-form__radio-label{align-items:center;gap:8px;font-size:16px;line-height:20px;display:flex}.modal-form__radio-label input{accent-color:#00a3ff;width:16px;height:16px;margin:0}.modal-form__error{color:#c00;margin:0 0 20px;font-size:14px;line-height:18px}.modal__submit{color:#fff;min-width:124px;min-height:36px;font:inherit;cursor:pointer;background:#000;border:0;border-radius:4px;align-self:flex-start;padding:8px 16px;font-size:16px;line-height:20px}.modal__submit:hover{opacity:.7}@media screen and (width<=767px){.modal{align-items:flex-end;padding:0}.modal__content{border-radius:16px 16px 0 0;width:100%;min-height:455px;max-height:100dvh;padding:32px 16px}.modal__title{margin-bottom:36px}.modal__close{top:16px;right:18px}.modal__submit{align-self:stretch;min-height:44px}}.modal-form__switch{color:#666;font:inherit;cursor:pointer;background:0 0;border:0;align-self:flex-start;margin-bottom:12px;padding:0}.delete-confirmation{z-index:30;opacity:0;pointer-events:none;background:#00000080;justify-content:center;align-items:center;padding:20px;transition:opacity .2s;display:flex;position:fixed;inset:0}.delete-confirmation_is-opened{opacity:1;pointer-events:auto}.delete-confirmation__content{background:#fff;border-radius:20px;width:496px;min-height:220px;padding:40px 28px 28px;position:relative}.delete-confirmation__close{color:#000;cursor:pointer;background:0 0;border:0;width:24px;height:24px;padding:0;font-size:32px;line-height:20px;position:absolute;top:18px;right:20px}.delete-confirmation__title{margin:0;font-size:20px;line-height:24px}.delete-confirmation__error{color:#c00;margin:20px 0 0;font-size:14px;line-height:18px}.delete-confirmation__actions{gap:12px;margin-top:40px;display:flex}.delete-confirmation__confirm,.delete-confirmation__cancel{min-width:100px;min-height:36px;font:inherit;cursor:pointer;border-radius:4px;padding:8px 16px;font-size:16px;line-height:20px}.delete-confirmation__confirm{color:#fff;background:#000;border:0}.delete-confirmation__cancel{color:#000;background:#fff;border:1px solid #0009}.delete-confirmation__confirm:hover,.delete-confirmation__cancel:hover,.delete-confirmation__close:hover{opacity:.7}@media screen and (width<=767px){.delete-confirmation{align-items:flex-end;padding:0}.delete-confirmation__content{border-radius:16px 16px 0 0;width:100%;min-height:220px;padding:40px 16px 28px}.delete-confirmation__actions{margin-top:32px}}.footer{color:#000;justify-content:space-between;align-items:center;margin-top:48px;padding-bottom:20px;font-size:16px;line-height:20px;display:flex}.footer__text{margin:0}@media screen and (width<=767px){.footer{margin-top:48px}}.avatar{color:#222;background:#ddd;border-radius:50%;justify-content:center;align-items:center;font-weight:700;display:inline-flex}.toggle-switch{cursor:pointer;width:56px;height:28px;display:block;position:relative}.toggle-switch__input{opacity:0;width:1px;height:1px;position:absolute}.toggle-switch__track{background:#fff;border:2px solid #7e7e7e;border-radius:20px;justify-content:space-around;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.toggle-switch__unit{z-index:1;color:#00000080;text-align:center;width:50%;font-size:14px;font-weight:700;line-height:24px;position:relative}.toggle-switch__unit_fahrenheit{color:#fff}.toggle-switch__thumb{background:#000;border-radius:20px;width:50%;transition:transform .2s;position:absolute;top:0;bottom:0;left:0}.toggle-switch_celsius .toggle-switch__thumb{transform:translate(100%)}.toggle-switch_celsius .toggle-switch__unit_fahrenheit{color:#00000080}.toggle-switch_celsius .toggle-switch__unit_celsius{color:#fff}.toggle-switch:hover{opacity:.8}.header{z-index:10;position:relative}.header__content{align-items:center;height:40px;display:flex;position:relative}.header__logo{z-index:2;color:#000;width:89px;font-size:32px;font-weight:900;line-height:40px;text-decoration:none;position:relative}.header__logo:hover,.header__profile-link:hover{opacity:.7}.header__date{margin:0;font-size:20px;font-weight:700;line-height:24px}.header__date_desktop{margin-left:24px}.header__actions{align-items:center;gap:24px;margin-left:auto;display:flex}.header__profile-link{color:#000;align-items:center;gap:12px;text-decoration:none;display:flex}.header__add-clothes,.header__mobile-add-clothes{color:#000;font:inherit;cursor:pointer;background:0 0;border:0;padding:0;font-size:20px;line-height:24px}.header__add-clothes:hover,.header__mobile-add-clothes:hover{opacity:.7}.header__user-name{margin:0;font-size:20px;line-height:24px}.header__avatar{object-fit:cover;border-radius:50%;width:40px;height:40px}.header__menu-button,.header__mobile-menu,.header__date_mobile{display:none}@media screen and (width<=767px){.header{height:100px}.header__content{height:44px}.header__actions,.header__date_desktop{display:none}.header__menu-button{z-index:3;cursor:pointer;background:0 0;border:0;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;margin-left:auto;padding:0 11px;display:flex;position:relative}.header__menu-button span{background:#000;border-radius:1px;width:22px;height:2px;transition:transform .2s,opacity .2s;display:block}.header__menu-button_opened span:first-child{transform:translateY(7px)rotate(45deg)}.header__menu-button_opened span:nth-child(2){opacity:0}.header__menu-button_opened span:nth-child(3){transform:translateY(-7px)rotate(-45deg)}.header__mobile-menu{box-sizing:border-box;opacity:0;pointer-events:none;background:#fff;border-radius:10px;min-height:244px;padding:60px 67px 22px;transition:opacity .2s,transform .2s;display:block;position:absolute;top:0;left:0;right:0;transform:translateY(-8px);box-shadow:0 2px 8px #0000001a}.header__mobile-menu_opened{opacity:1;pointer-events:auto;transform:translateY(0)}.header__mobile-user{color:#000;justify-content:center;align-items:center;gap:12px;text-decoration:none;display:flex}.header__mobile-user-name{margin:0;font-size:20px;line-height:25px}.header__mobile-avatar{object-fit:cover;border-radius:50%;width:40px;height:40px}.header__mobile-add-clothes{margin:24px auto 0;display:block}.header__mobile-menu .toggle-switch{margin:24px auto 0}.header__date_mobile{margin-top:32px;display:block}}.item-modal{z-index:20;opacity:0;pointer-events:none;background:#00000080;justify-content:center;align-items:center;padding:20px;transition:opacity .2s;display:flex;position:fixed;inset:0}.item-modal_is-opened{opacity:1;pointer-events:auto}.item-modal__content{background:#fff;border-radius:20px;width:670px;position:relative;overflow:hidden}.item-modal__close{z-index:1;color:#000;cursor:pointer;background:0 0;border:0;width:24px;height:24px;padding:0;font-size:32px;line-height:20px;position:absolute;top:18px;right:20px}.item-modal__close:hover{opacity:.7}.item-modal__image{object-fit:cover;background:#e9e9e9;width:100%;height:480px;display:block}.item-modal__details{flex-direction:column;padding:20px;display:flex}.item-modal__title,.item-modal__weather{margin:0;font-size:20px;line-height:24px}.item-modal__weather{margin-top:16px}.item-modal__delete{color:#ff4d00;font:inherit;cursor:pointer;background:0 0;border:0;align-self:flex-end;margin-top:24px;padding:0;font-size:20px;line-height:24px}.item-modal__delete:hover{opacity:.7}@media screen and (width<=767px){.item-modal{align-items:center;padding:16px}.item-modal__content{border-radius:16px;width:100%}.item-modal__close{top:16px;right:18px}.item-modal__image{aspect-ratio:1;height:auto}.item-modal__details{padding:20px}}.main{flex:1;margin-top:28px}.clothing-section{margin-top:36px}.clothing-section__title{margin:0;font-size:20px;font-weight:700;line-height:25px}.clothing-items{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin:34px 0 0;padding:0;list-style:none;display:grid}@media screen and (width<=767px){.main{margin-top:16px}.clothing-section{margin-top:32px}.clothing-section__title{white-space:normal;font-size:18px;line-height:25px}.clothing-items{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 15px;margin-top:20px}}.item-card{aspect-ratio:1;background:#e9e9e9;border:1px solid #0000004d;border-radius:20px;position:relative;overflow:hidden}.item-card__image-button{cursor:pointer;background:0 0;border:0;width:100%;height:100%;padding:0;position:absolute;inset:0}.item-card__image-button:hover{opacity:.9}.item-card__image{object-fit:cover;width:100%;height:100%;display:block}.item-card__title{color:#0009;white-space:nowrap;background:#fff;border-radius:4px;padding:2px 12px;font-size:16px;font-weight:700;line-height:20px;position:absolute;top:15px;left:50%;transform:translate(-50%)}.item-card__like{z-index:1;color:#000;cursor:pointer;background:#fff;border:0;border-radius:50%;width:28px;height:28px;padding:0;font-size:22px;line-height:28px;position:absolute;top:12px;right:12px}.item-card__like:hover{opacity:.7}@media screen and (width<=767px){.item-card{border-radius:12px}.item-card__title{font-size:16px;top:7px}.item-card__like{width:24px;height:24px;font-size:18px;line-height:24px;top:8px;right:8px}}.weather-card{background-color:#00a3ff;border-radius:12px;height:80px;position:relative;overflow:hidden}.weather-card__image{width:100%;height:100%;position:absolute;inset:0}.weather-card__temperature{color:#fff;margin:0;font-size:36px;font-weight:700;line-height:40px;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.side-bar{align-items:flex-start;gap:20px;display:flex}.side-bar__avatar{object-fit:cover;border-radius:50%;width:56px;height:56px}.side-bar__name{margin:0;font-size:24px;font-weight:700;line-height:30px}.side-bar__links{flex-direction:column;gap:8px;margin-top:12px;display:flex}.side-bar__link{color:#0009;width:fit-content;font:inherit;cursor:pointer;background:0 0;border:0;padding:0;font-size:20px;line-height:25px}.side-bar__link:hover{opacity:.7}@media screen and (width<=767px){.side-bar__content{min-width:0}.side-bar__name{font-size:24px}}.clothes-section__header{align-items:center;gap:12px;display:flex}.clothes-section__title{margin:0;font-size:20px;font-weight:700;line-height:25px}.clothes-section__add-button{color:#0009;font:inherit;cursor:pointer;background:0 0;border:0;padding:0;font-size:20px;line-height:25px}.clothes-section__add-button:hover{opacity:.7}.clothes-section__items{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:16px 0 0;padding:0;list-style:none;display:grid}@media screen and (width<=767px){.clothes-section{margin-top:40px}.clothes-section__items{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 15px;margin-top:16px}}.profile{border-top:1px solid #0003;grid-template-columns:272px minmax(0,1fr);gap:40px;margin-top:48px;padding-top:20px;display:grid}@media screen and (width<=767px){.profile{margin-top:2px;padding-top:20px;display:block}}html{-webkit-text-size-adjust:100%;line-height:1.15}body{margin:0}main{display:block}h1{margin:.67em 0;font-size:2em}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace;font-size:1em}a{background-color:#0000}abbr[title]{border-bottom:none;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:100%;line-height:1.15}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner{border-style:none;padding:0}[type=button]::-moz-focus-inner{border-style:none;padding:0}[type=reset]::-moz-focus-inner{border-style:none;padding:0}[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring{outline:1px dotted buttontext}[type=button]:-moz-focusring{outline:1px dotted buttontext}[type=reset]:-moz-focusring{outline:1px dotted buttontext}[type=submit]:-moz-focusring{outline:1px dotted buttontext}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;white-space:normal;max-width:100%;padding:0;display:table}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button{height:auto}[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template,[hidden]{display:none}:root{--main-font:Arial, Helvetica, sans-serif;color:#000;font-synthesis:none;text-rendering:optimizelegibility;background:#f3f3f3;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100%;margin:0}body{min-height:100vh}button,input{font-family:inherit}
