:root{--text-color: #141414;--text-2-color: #414141;--frame-color: #C4C4C4;--placeholder-color: #acacac;--bg-color: #ffffff;--primary-color: #52A423;--primary-mute-color: #9DE175;--field-bg-color: #F7F7F7;--error-text-color: #FF4A4A;--error-color: #FF1414;--error-outline-color: #FF141488;--link-color: #2563FF;--link-hover-color: #1E40AF;--button-outline-color: #00000088;--field-outline-color: #52A42388;font-size:14px}*:focus{outline:.25rem solid var(--field-outline-color)}button:hover{cursor:pointer}button:disabled{background-color:var(--primary-mute-color);color:var(--placeholder-color);cursor:not-allowed}body{min-height:100dvh;margin:0;display:flex;align-items:stretch;justify-content:center;font-family:Inter,sans-serif;color:var(--text-2-color)}div.center{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem}#root{flex-grow:1;display:flex;flex-direction:column;align-items:stretch}header{align-self:stretch;border-bottom:1px solid var(--frame-color);height:5rem;display:flex;justify-content:center;align-items:center;position:sticky;top:0;z-index:1000;background-color:var(--bg-color)}header>nav{width:100%;max-width:500px;display:grid;grid-template-columns:1fr 1fr 1fr;margin:0 2rem;align-items:center}header button.user{justify-self:end;grid-column:3;width:3rem;height:3rem;border-radius:50%;text-align:center;padding:0;font-size:1.5rem;font-weight:500;outline:none}header .main-title{grid-column:2;text-wrap:nowrap;margin:0 .5rem}header .menu{background-color:var(--bg-color);border:1px solid var(--frame-color);padding:1.5rem;border-radius:.5rem;display:flex;flex-direction:column;gap:.5rem;box-shadow:2px 2px 4px #0004;z-index:1000}header img{width:48px;height:48px}main{flex-grow:1;display:flex;justify-content:center}.content{flex-grow:1;max-width:500px;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:1rem;padding:2rem}.content.center{align-items:center}.content.top{justify-content:start}.content.tight{padding-top:1rem}a{color:var(--link-color);border-radius:.25rem}a:hover{color:var(--link-hover-color)}a.inline{margin-left:.25rem}h1{align-self:stretch;font-size:2rem;color:var(--primary-color);text-align:center;letter-spacing:-.07em;font-weight:600;margin:0;padding:0}h1 img{height:4rem;vertical-align:middle;margin-bottom:.25rem;margin-right:.25rem}a.main-title{font-size:2rem;color:var(--primary-color);letter-spacing:-.07em;font-weight:600;text-decoration:none;text-align:center}h2{font-size:1.5rem;color:var(--text-2-color);letter-spacing:-.05em;font-weight:600;margin:0;padding:0}h3{font-size:1.25rem;color:var(--text-2-color);letter-spacing:-.04em;font-weight:400;margin:0;padding:0}.frame{align-self:stretch;border-radius:8px;border:1px solid var(--frame-color);background-color:var(--bg-color);padding:1.5rem;display:flex;flex-direction:column;align-items:stretch;gap:1rem}form{display:flex;flex-direction:column;gap:1rem}.field{display:flex;flex-direction:column;gap:.25rem}.field label{font-size:1rem;font-weight:400;color:var(--text-color)}.field input{font-size:1rem;border:1px solid var(--frame-color);border-radius:.25rem;background-color:var(--field-bg-color);padding:.5rem .75rem;font-family:Inter,sans-serif}.field input::placeholder{color:var(--placeholder-color)}.field select{font-size:1rem;border:1px solid var(--frame-color);border-radius:.25rem;background-color:var(--field-bg-color);padding:.5rem .75rem;font-family:Inter,sans-serif}.password-field input{padding-right:2.25rem}.password-field button{border:none;background:none;position:absolute;padding:0;right:.5rem;bottom:calc((.75rem + 2px)/2 + 1px);color:var(--placeholder-color);width:1.25rem;height:1.25rem}div.anchor{position:relative;display:flex;flex-direction:column}.password-show-icon{width:1.25rem;height:1.25rem}.no-focus:focus{outline:none}p{margin:0;padding:0}.error{color:var(--error-color)}.field-errors{margin:0;padding:0;list-style-type:none;color:var(--error-text-color);font-size:.875rem}button{background-color:var(--primary-color);border:none;border-radius:.25rem;padding:.75rem 1.25rem;color:#fff;font-size:1rem;font-weight:800;font-family:Inter,sans-serif}button.inverted{background-color:var(--field-bg-color);color:var(--text-2-color);border:1px solid var(--primary-color);font-weight:600}button:focus{outline:.25rem solid var(--button-outline-color)}.line{height:1px;width:60%;margin:0 auto;background-color:var(--frame-color)}.filter-bar{width:100%;position:relative}.filter-bar input{padding-right:2.25rem}.filter-clear-icon{width:1.25rem;height:1.25rem}.no-results{display:flex;flex-direction:column;align-items:center;gap:1rem;text-align:center;margin-top:2rem}.cards{display:grid;grid-template-columns:1fr 1fr;gap:1rem}button.filter-clear{width:1.25rem;height:1.25rem;border:none;background:none;color:var(--placeholder-color);position:absolute;padding:0;right:.5rem;bottom:calc((.75rem + 2px)/2 + 1px)}button.card{--color-light: color-mix(in srgb, var(--card-color), #ffffff 30%);--color-dark: color-mix(in srgb, var(--card-color), #000000 30%);width:100%;position:relative;box-sizing:border-box;overflow:hidden;padding:0;aspect-ratio:1.586;border-radius:4.413%/7%;background-color:transparent;box-shadow:-1px 0 1.5px color-mix(in srgb,var(--color-light),transparent 50%),0 1px .5px color-mix(in srgb,var(--color-dark),transparent 50%),1px 0 .5px color-mix(in srgb,var(--color-dark),transparent 50%),0 -1px 1.5px color-mix(in srgb,var(--color-light),transparent 50%),0 1px 6px #0000004d}.card:before{content:"";position:absolute;box-sizing:border-box;border-radius:inherit;top:0;left:0;width:100%;height:100%;z-index:1;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);background-color:color-mix(in srgb,var(--color-light),transparent 75%)}.card:after{content:"";position:absolute;box-sizing:border-box;inset:2.5%;background-image:var(--card-img-url);background-size:cover;background-position:center;clip-path:inset(5% 5% 20% 5% round 4.413% / 9%);z-index:3}.card img{content:var(--card-img-url);position:absolute;inset:2.5%;width:95%;height:95%;object-fit:cover;filter:brightness(.95);aspect-ratio:1.586;border-radius:4.413%/7%}.card .strip{border-radius:4.413%/9%;box-sizing:border-box;position:absolute;inset:7.25% 7.25% 21.5%;z-index:5;box-shadow:inset 0 0 2px #0000004d}.card span{width:100%;font-size:1.25rem;position:absolute;margin-block:auto;bottom:2px;left:0;text-align:center;color:#fff;font-weight:600;text-shadow:0 0 3px black;z-index:4}.detail-top-bar{display:flex;width:100%;gap:1rem;align-items:start}.detail-top-bar .field{flex-grow:1}.edit-button{display:flex;align-items:center;justify-content:center;width:2.625rem;height:2.625rem;padding:0}.edit-button-icon{width:1.5rem;height:1.5rem}.color-preview{--color-light: color-mix(in srgb, var(--card-color), #ffffff 30%);--color-dark: color-mix(in srgb, var(--card-color), #000000 30%);width:100%;background-color:var(--card-color);height:3.5rem;display:flex;align-items:center;justify-content:end;padding:.5rem;border-radius:.5rem;box-sizing:border-box;position:relative;overflow:hidden;box-shadow:-1px 0 1.5px color-mix(in srgb,var(--color-light),transparent 50%),0 1px .5px color-mix(in srgb,var(--color-dark),transparent 50%),1px 0 .5px color-mix(in srgb,var(--color-dark),transparent 50%),0 -1px 1.5px color-mix(in srgb,var(--color-light),transparent 50%),1px 2px 4px #0003;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background-color:color-mix(in srgb,var(--color-light),transparent 75%)}.edit-color-icon{width:1.25rem;height:1.25rem}.dialog{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;z-index:1001}.color-picker{background-color:var(--bg-color);z-index:1000}.dialog .overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#000a}.dialog .content{z-index:1001}.code{display:flex;flex-direction:row;justify-content:center;align-items:center;position:relative;min-height:3rem}.code-dialog{display:flex;justify-content:center}.image-section{align-self:center;aspect-ratio:1.586;width:100%;display:flex;align-items:center;justify-content:center;min-height:0}.image-container{border:1px solid var(--frame-color);border-radius:4.413%/7%;overflow:hidden;background-color:var(--field-bg-color);display:flex;align-items:center;justify-content:center;box-sizing:border-box;position:relative;aspect-ratio:1.586;width:100%}.container.no-image{border:1px dashed var(--placeholder-color)}.image-container img{aspect-ratio:1.586;width:100%;object-fit:cover}span.label{position:absolute;top:0;left:0;padding:.25rem .5rem;border-radius:0 0 .5rem;background-color:#fffc;color:var(--text-color)}.float{position:absolute;top:.5rem;right:.5rem;display:flex;gap:.5rem}span.css-13vpke-MuiSlider-root{color:var(--primary-color)}.over-shadow{box-shadow:2px 4px 4px #0004}.edit-buttons{display:flex;flex-direction:row;gap:1rem}.edit-buttons button{flex-grow:1;flex-basis:0}.cropper{position:relative;width:100%;height:100%}button.rotate{position:absolute;z-index:20;top:.5rem;right:.5rem}div.react-colorful{width:100%;height:70px}div.react-colorful__saturation{border-radius:3px 3px 0 0;border-bottom:0}div.react-colorful__hue{height:30px;border-radius:0 0 3px 3px}div.react-colorful__saturation-pointer{border-radius:3px}div.react-colorful__hue-pointer{border-radius:2px}.sliders span.MuiSlider-root{padding-top:.5rem;padding-bottom:.5rem}
