:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;--color-danger: #ff0000;--color-white: #ffffff;--color-black: #000000;--color-background: #242424;--color-background-hover: #333333;--color-button-background: #1a1a1a;--color-input-background: #3B3B3B;--color-tag-background: #4e4e4e;--color-autocomplete-background: #444444;--color-autocomplete-item-hover-background: #555555;--color-sidebar-mobile-background: #181818;--color-sidebar-mobile-button-background: #3b3b3b;--color-ad-background: #3a3a3a;--color-text-primary: rgba(255, 255, 255, .87);--color-text-muted: #888888;--color-text-dark: #333333;--color-input-text: var(--color-white);--color-sidebar-mobile-text: var(--color-white);--color-autocomplete-item-text: #eeeeee;--color-link: #646cff;--color-link-hover: #535bf2;--color-border: #cccccc;--color-border-light: #eeeeee;--color-border-medium: #555555;--color-autocomplete-border: #222222;--color-button-border-hover: var(--color-link);--color-sidebar-mobile-button-border: var(--color-white);color:var(--color-text-primary);background-color:var(--color-background);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:var(--color-link);text-decoration:inherit}a:hover{color:var(--color-link-hover)}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--color-button-background);cursor:pointer;transition:border-color .25s}button:hover{border-color:var(--color-button-border-hover)}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{--color-background: #ffffff;--color-background-hover: #f9f9f9;--color-button-background: #f9f9f9;--color-input-background: #ffffff;--color-tag-background: #e0e0e0;--color-autocomplete-background: #ffffff;--color-autocomplete-item-hover-background: #f0f0f0;--color-sidebar-mobile-background: #f9f9f9;--color-sidebar-mobile-button-background: #e0e0e0;--color-ad-background: #f0f0f0;--color-text-primary: #213547;--color-input-text: var(--color-text-primary);--color-sidebar-mobile-text: var(--color-text-primary);--color-autocomplete-item-text: var(--color-text-primary);--color-link-hover: #747bff;--color-text-muted: #666666;--color-text-dark: #333333;--color-border: #dddddd;--color-border-light: #eeeeee;--color-border-medium: #cccccc;--color-autocomplete-border: #cccccc;--color-sidebar-mobile-button-border: #cccccc}}#root{max-width:100%;margin:0 auto;padding:2rem 2rem 120px;text-align:center}.main-container{display:flex;flex-direction:row;margin-top:2rem;text-align:left;gap:2rem}.sidebar{flex:0 0 200px;padding-right:2rem;border-right:1px solid var(--color-border);position:sticky;top:0;height:100vh;align-self:flex-start}.content-area{flex:1;min-width:0}.view-container{max-width:800px;margin:0 auto}.view-container-wide{max-width:90%;margin:0 auto}.menu-buttons{margin-top:55px;display:flex;flex-direction:column}.menu-buttons button{margin-bottom:1rem}.creation-form{width:100%}.form-field{margin-bottom:1rem}.form-field label{display:block;margin-bottom:.5rem}.form-field input,.form-field textarea{width:100%;max-width:100%;padding:.5rem;box-sizing:border-box}.form-field textarea[name=synopsis],.form-field textarea[name=description],.form-field textarea[name=content],.form-field textarea[name=summary]{min-height:150px;resize:vertical}.app-description{margin-bottom:2rem;padding:1.5rem;background-color:var(--color-background-hover);border:1px solid var(--color-border-medium);border-radius:8px;text-align:left}.app-description h3{margin-top:0}.home-actions{display:flex;gap:2rem}.action-box{border:1px solid var(--color-border);padding:1rem;border-radius:8px;flex:1}.work-list{list-style:none;padding:0;min-width:300px}.work-list li{display:flex;justify-content:space-between;align-items:center;padding:1rem;border:1px solid var(--color-border-light);border-radius:4px;margin-bottom:.5rem;cursor:pointer;transition:background-color .2s}.work-list li:hover{background-color:var(--color-background-hover)}.work-title{font-weight:700}.delete-button{background:none;border:none;padding:.5rem;color:var(--color-text-muted)}.delete-button:hover{color:var(--color-danger)}.list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.add-button{font-size:1.5rem;font-weight:700;cursor:pointer;border:1px solid var(--color-border);border-radius:8px;width:40px;height:30px;display:flex;justify-content:center;align-items:center;line-height:1}.year-group{margin-bottom:2rem}.month-group{margin-left:1rem;padding-left:1rem;border-left:2px solid var(--color-border-light)}.autocomplete-container{position:relative;width:100%}.suggestions-list{position:absolute;background-color:var(--color-autocomplete-background);border:1px solid var(--color-autocomplete-border);border-radius:4px;list-style:none;padding:0;margin:5px 0 0;width:100%;max-height:150px;overflow-y:auto;z-index:1000;box-shadow:0 4px 8px #0003}.suggestions-list li{padding:.75rem;cursor:pointer;color:var(--color-autocomplete-item-text)}.suggestions-list li:hover{background-color:var(--color-autocomplete-item-hover-background)}.autocomplete-input{background-color:var(--color-input-background);color:var(--color-input-text);border:1px solid var(--color-border-medium);padding:.5rem;box-sizing:border-box;width:100%}.sub-pre-input{background-color:var(--color-input-background);color:var(--color-input-text);border:1px solid var(--color-border-medium);padding:.5rem;box-sizing:border-box;width:50%}.autocomplete-input::placeholder{color:var(--color-border)}.related-items-list{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.5rem}.related-item-tag{display:flex;align-items:center;background-color:var(--color-tag-background);padding:.25rem .75rem;border-radius:12px;font-size:.9rem}.remove-item-button{background:none;border:none;color:var(--color-text-dark);cursor:pointer;margin-left:.5rem;font-weight:700}.add-relationship-form{display:flex;gap:.5rem;align-items:center;margin-top:1rem}.add-relationship-form input{flex:1}.add-relationship-form .autocomplete-container{flex:2}.add-relationship-form button{flex:0 0 auto}.hamburger-button{display:none;font-size:1.2rem;background:none;border:none;cursor:pointer;z-index:1100;position:absolute;left:1rem;top:1.5rem}@media (max-width: 768px){.App-header{position:fixed;top:0;left:0;width:100%;height:60px;background-color:var(--color-background);box-shadow:0 1px 3px #0000001a;z-index:1051;display:flex;align-items:center;padding:0 1rem;box-sizing:border-box}.App-header h1{font-size:1.2rem;margin:0;position:absolute;left:50%;transform:translate(-50%)}.App-header p{display:none}#root{padding:1rem 1rem 120px}.home-actions{flex-direction:column}.hamburger-button{display:block;position:static}.sidebar{display:none;position:fixed;left:0;top:0;width:250px;height:100%;background-color:var(--color-sidebar-mobile-background);z-index:1050;padding:2rem;border-right:1px solid var(--color-border);box-shadow:2px 0 5px #0000001a;transform:translate(-100%);transition:transform .3s ease-in-out;box-sizing:border-box}.sidebar.sidebar-open{display:block;transform:translate(0);background-color:var(--color-sidebar-mobile-background);color:var(--color-sidebar-mobile-text);overflow-y:auto;padding-bottom:120px}.sidebar.sidebar-open .menu-buttons button,.sidebar.sidebar-open .sidebar-actions button{color:var(--color-sidebar-mobile-text);background-color:var(--color-sidebar-mobile-button-background);border:1px solid var(--color-sidebar-mobile-button-border)}.main-container{flex-direction:column;gap:1rem;padding-top:60px}.content-area{padding-left:0}}.sidebar-actions{margin-top:2rem;padding-top:2rem;border-top:1px solid var(--color-border-light);display:flex;flex-direction:column;gap:1rem}.sidebar-actions button{width:100%}.ad-container{position:fixed;bottom:0;left:0;width:100%;height:90px;background-color:var(--color-ad-background);z-index:2000;display:flex;justify-content:center;align-items:center;border-top:1px solid var(--color-border)}.ad-container .adsbygoogle{height:100%;width:100%;max-height:90px}.body-no-scroll{overflow:hidden}@media (min-width: 769px){.form-field input,.form-field textarea,.autocomplete-container{min-width:450px}}
