:root{--background: #ededed;--darkBackground: #e2e2e2;--border: #d0d0d0;--primary: #284664;--border-radius: 10px;--pill-border-radius: 20px}body{margin:0;padding:1em;width:100vw;height:100vh;background:var(--background)}*{box-sizing:border-box;font-family:sans-serif}h1,h2,h3,h4,h5,h6{margin:0;padding:0}p{margin:0;font-size:.83em}hr{margin:0;border-color:var(--border);border-style:solid}.main{width:100%;max-width:1500px}.content{display:flex;height:100%;width:100%}.content>*{flex:1 1 0}.grid-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(500px,1fr));grid-auto-rows:375px}.grid-list.watch-later{grid-auto-rows:245px}.card{padding:.75em;border:2px dashed var(--border);background:#fff;position:relative}.card.watch-later .image{flex:0 0 auto}.card.watch-later .image img{object-fit:contain}.card:before{content:"";position:absolute;background:var(--darkBackground);width:100%;height:100%;z-index:-1;top:7px;left:7px}.image{overflow:hidden;flex:0 0 250px;border-radius:var(--border-radius)}.image .img{position:relative;display:flex;align-items:center;justify-content:center}.image .img .position{position:absolute;left:0;top:0;padding:.5em .7em;background:var(--primary);z-index:2;color:#fff;font-weight:900;font-size:larger;border-bottom-right-radius:var(--border-radius)}.image img{height:100%;width:100%;object-fit:cover;z-index:1;position:relative}.image .status{background:orange;color:#fff;font-weight:700;text-align:center;padding:.5em}.times-watched{border-radius:var(--pill-border-radius);background:var(--primary);padding:.5em .75em;font-weight:700;font-size:13px;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.genre{border-radius:var(--pill-border-radius);border:2px solid var(--primary);padding:.5em .75em;font-weight:700;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.review{border-color:var(--border);border-style:solid;border-radius:var(--border-radius)}.review legend{font-size:13px;font-weight:700}input:not([type=range]),select:not([type=range]),textarea:not([type=range]){outline:none;border:2px solid var(--border);border-radius:var(--border-radius);padding:.75em}input::placeholder{color:gray}button,.button{border-radius:var(--border-radius);border:none;cursor:pointer;outline:none;display:flex;align-items:center;justify-content:center;gap:.5em;padding:.5em 1em;background:var(--primary);color:#fff;font-family:inherit;font-weight:700}button[icon-button],.button[icon-button]{border-radius:50%;min-width:40px;height:40px;padding:0}button:hover,.button:hover{background:#485869}button:active,.button:active{background:#60666b}.icon-button{width:40px;height:40px;background:none!important;border:none;outline:none;position:relative;padding:0}.icon-button svg{z-index:2}.icon-button:hover:before{content:"";position:absolute;width:40px;height:40px;z-index:0;background:var(--background);border-radius:50%}.icon-button:active:before{background:var(--darkBackground)}.row{display:flex;flex-direction:row}.column{display:flex;flex-direction:column}.gap-2{gap:2em}.gap-15{gap:1.5em}.gap-1{gap:1em}.gap-075{gap:.75em}.gap-05{gap:.5em}.gap-025{gap:.25em}.spacer{flex-grow:1}.flex-0-0-auto{flex:0 0 auto}.align-center{align-items:center}.align-self-stretch{align-self:stretch}.overflow-hidden{overflow:hidden}.drop-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#2846648c;z-index:1000;display:flex;align-items:center;justify-content:center;color:#fff;font-size:2em;font-weight:700;pointer-events:none;border:6px dashed rgba(255,255,255,.7)}.spinner-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#fff9;z-index:1001;display:flex;align-items:center;justify-content:center}.spinner{width:52px;height:52px;border:5px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .75s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.text-ellipsis{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.grid-list.posts{grid-auto-rows:520px}.card.post{display:flex;flex-direction:column}.margin-1{margin:1em}.total-count{align-self:center;border-radius:var(--pill-border-radius);background:var(--primary);padding:.5em .75em;font-weight:700;font-size:13px;color:#fff;white-space:nowrap}.img-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--darkBackground);color:gray;font-weight:700}.item-dialog{width:min(900px,95vw);max-height:90vh;padding:1.25em;border:2px dashed var(--border);border-radius:var(--border-radius);background:#fff}.item-dialog::backdrop{background:#2846648c}.item-dialog button:disabled{opacity:.5;cursor:default}button.secondary{background:#fff;color:var(--primary);border:2px solid var(--primary)}button.secondary:hover{background:var(--background)}.dialog-hint{color:gray;font-size:13px}.dialog-error{color:#b22222;font-weight:700;font-size:13px}.dialog-loading{justify-content:center;padding:2em}.tmdb-attribution{color:gray;font-size:12px}.search-results{max-height:55vh;overflow-y:auto}button.search-result{justify-content:flex-start;flex:0 0 auto;text-align:left;padding:.5em;border:2px solid var(--border);background:#fff;color:inherit;font-weight:400}button.search-result:hover{background:var(--background)}button.search-result img,button.search-result .search-result-placeholder{flex:0 0 auto;width:46px;height:69px;object-fit:cover;border-radius:6px;background:var(--darkBackground)}.item-form{display:flex;flex-wrap:wrap;gap:1.5em}.item-form .poster-column{flex:1 1 300px;min-width:0}.item-form .fields-column{flex:1 1 320px;min-width:0}.poster-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));grid-auto-rows:max-content;align-content:start;gap:.5em;max-height:55vh;overflow-y:auto;padding:2px}button.poster-option{position:relative;aspect-ratio:2 / 3;padding:0;overflow:hidden;border:3px solid transparent;background:var(--darkBackground)}button.poster-option:hover{background:var(--darkBackground);border-color:var(--border)}button.poster-option[aria-pressed=true]{border-color:var(--primary)}button.poster-option img{display:block;width:100%;height:100%;object-fit:cover}button.poster-option .poster-label{position:absolute;left:0;top:0;padding:.25em .5em;background:var(--primary);color:#fff;font-size:12px;border-bottom-right-radius:var(--border-radius)}.field{display:flex;flex-direction:column;gap:.25em;font-size:13px;font-weight:700}.field textarea{resize:vertical;font-family:inherit}.checkbox-field{display:flex;align-items:center;gap:.5em;font-size:13px;font-weight:700}button.color-swatch{width:28px;height:28px;padding:0;border-radius:50%;border:2px solid white;outline:2px solid transparent}button.color-swatch[aria-pressed=true]{outline-color:var(--primary)}.genre-options{flex-wrap:wrap}button.genre-toggle{background:#fff;color:inherit}button.genre-toggle:hover{background:var(--background)}button.genre-toggle[aria-pressed=true]{background:var(--primary);color:#fff}
