.navbar{position:fixed;top:0;left:0;right:0;height:4rem;background-color:var(--color-background);border-bottom:.0625rem solid var(--color-border);z-index:1000}.navbar-container{max-width:120rem;margin:0 auto;padding:0 1rem;height:100%;display:flex;align-items:center;justify-content:space-between}.navbar-logo{font-family:"Noto Serif SC",Songti SC,SimSun,serif;font-size:1.75rem;font-weight:700;color:var(--color-primary);text-decoration:none;letter-spacing:.05em}.navbar-menu{display:none}.navbar-link{margin-left:2rem;font-size:1rem;color:var(--color-text);text-decoration:none;transition:color .3s}.navbar-link:hover{color:var(--color-primary)}.navbar-toggle{display:none;flex-direction:column;background:none;border:none;cursor:pointer;padding:.5rem;gap:.25rem}.navbar-toggle span{width:1.5rem;height:.125rem;background-color:var(--color-text);transition:all .3s}@media (max-width: 768px){.navbar-menu{position:fixed;top:4rem;left:0;right:0;background-color:var(--color-background);border-bottom:.0625rem solid var(--color-border);flex-direction:column;padding:1rem;transform:translateY(-100%);opacity:0;visibility:hidden;transition:all .3s}.navbar-menu.active{transform:translateY(0);opacity:1;visibility:visible;display:flex}.navbar-link{margin:.5rem 0;margin-left:0;padding:.75rem}.navbar-toggle{display:flex}.navbar-toggle.active span:nth-child(1){transform:rotate(45deg) translate(.3125rem,.3125rem)}.navbar-toggle.active span:nth-child(2){opacity:0}.navbar-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(.3125rem,-.3125rem)}}@media (min-width: 769px){.navbar-menu{display:flex;align-items:center}}.home{min-height:100vh}.hero-banner{width:100%;height:40vh;margin-top:4rem;overflow:hidden}.hero-image{width:100%;height:100%;object-fit:cover}.categories-section{padding:4rem 0}.section-title{font-size:2rem;margin-bottom:2rem;text-align:center}.categories-grid{display:flex;width:auto;max-width:120rem;margin:0 auto;padding:0 1rem}.categories-grid_column:first-child{padding-left:0}.categories-grid_column{padding-left:1.5rem;background-clip:padding-box}.category-card{border:.0625rem solid var(--color-border);border-radius:.5rem;overflow:hidden;transition:transform .3s,box-shadow .3s;display:flex;flex-direction:column;background-color:var(--color-background);width:100%;margin-bottom:1.5rem;break-inside:avoid}.category-card:hover{transform:translateY(-.25rem);box-shadow:0 .5rem 1rem #0000001a}.category-image{width:100%;height:auto;object-fit:contain;background-color:#f5f5f5;display:block}.category-placeholder{width:100%;aspect-ratio:1;background-color:var(--color-border);display:flex;align-items:center;justify-content:center;color:var(--color-text-light)}.category-name{padding:1rem;font-size:1.25rem;text-align:center;min-height:3rem;display:flex;align-items:center;justify-content:center}.loading{text-align:center;padding:4rem;font-size:1.25rem}.works-list{padding-top:4rem;min-height:100vh}.works-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:4rem;padding:0;flex-wrap:wrap;gap:1.5rem}.category-select{padding:.5rem 2rem .5rem .75rem;font-size:.9375rem;border:none;border-bottom:.0625rem solid transparent;background-color:transparent;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath fill='%23666' d='M5 8L0 3h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center;color:var(--color-text);cursor:pointer;min-height:2.75rem;transition:border-color .3s;appearance:none;-webkit-appearance:none;-moz-appearance:none}.category-select:hover{border-bottom-color:var(--color-border)}.category-select:focus{outline:none;border-bottom-color:var(--color-primary)}.category-select option{background-color:var(--color-background);color:var(--color-text)}.sort-select{padding:.5rem 2rem .5rem .75rem;font-size:.9375rem;border:none;border-bottom:.0625rem solid transparent;background-color:transparent;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath fill='%23666' d='M5 8L0 3h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center;color:var(--color-text);cursor:pointer;min-height:2.75rem;transition:border-color .3s;appearance:none;-webkit-appearance:none;-moz-appearance:none}.sort-select:hover{border-bottom-color:var(--color-border)}.sort-select:focus{outline:none;border-bottom-color:var(--color-primary)}.sort-select option{background-color:var(--color-background);color:var(--color-text)}.works-grid{display:flex;width:auto}.works-grid_column{padding-left:1.5rem;background-clip:padding-box}.works-grid_column:first-child{padding-left:0}.work-card{border:.0625rem solid var(--color-border);border-radius:.5rem;overflow:hidden;transition:transform .3s,box-shadow .3s;display:flex;flex-direction:column;background-color:var(--color-background);width:100%;margin-bottom:1.5rem;break-inside:avoid}.work-card:hover{transform:translateY(-.25rem);box-shadow:0 .5rem 1rem #0000001a}.work-thumbnail{width:100%;height:auto;object-fit:contain;background-color:#f5f5f5;display:block}.work-title{padding:1rem;font-size:1.25rem;text-align:center;min-height:3rem;display:flex;align-items:center;justify-content:center}.empty-state{text-align:center;padding:4rem;font-size:1.25rem;color:var(--color-text-light)}.error{text-align:center;padding:4rem;font-size:1.25rem;color:#c33}@media (max-width: 768px){.works-toolbar{flex-direction:column;align-items:flex-start;gap:1rem;margin-bottom:3rem}.category-select,.sort-select{width:100%;max-width:100%}}@media (max-width: 500px){.works-toolbar{margin-bottom:2.5rem}.category-select,.sort-select{font-size:.875rem;padding:.5rem 1.75rem .5rem .625rem}}.work-detail{padding-top:4rem;min-height:100vh}.back-link{display:inline-block;margin-bottom:2rem;color:var(--color-primary);font-size:1rem;text-decoration:underline}.work-content{display:grid;grid-template-columns:1fr;gap:2rem;margin-bottom:4rem}.work-image-container{position:relative;cursor:pointer}.work-image{width:100%;max-height:80vh;object-fit:contain;border-radius:.5rem}.image-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000000e6;display:flex;align-items:center;justify-content:center;z-index:2000;cursor:pointer}.expanded-image{max-width:90vw;max-height:90vh;object-fit:contain}.work-info{padding:1rem}.work-title{font-size:2rem;margin-bottom:1rem}.work-description{font-size:1rem;line-height:1.8;margin-bottom:1.5rem;color:var(--color-text-light)}.work-meta{display:flex;flex-direction:column;gap:1rem}.meta-item{display:flex;align-items:flex-start;gap:.5rem}.meta-label{font-weight:700;min-width:5rem}.meta-value{color:var(--color-primary)}.tags-list{display:flex;flex-wrap:wrap;gap:.5rem}.tag{padding:.25rem .75rem;background-color:#f0f0f0;border-radius:1rem;font-size:.875rem}.related-works{margin-top:4rem;padding-top:2rem;border-top:.0625rem solid var(--color-border)}.related-works-grid{display:flex;width:auto;margin-top:1.5rem}.related-works-grid_column{padding-left:1.5rem;background-clip:padding-box}.related-works-grid_column:first-child{padding-left:0}.related-work-card{border:.0625rem solid var(--color-border);border-radius:.5rem;overflow:hidden;transition:transform .3s,box-shadow .3s;display:flex;flex-direction:column;background-color:var(--color-background);width:100%;margin-bottom:1.5rem;break-inside:avoid}.related-work-card:hover{transform:translateY(-.25rem);box-shadow:0 .5rem 1rem #0000001a}.related-work-thumbnail{width:100%;height:auto;object-fit:contain;background-color:#f5f5f5;display:block}.related-work-title{padding:1rem;font-size:1rem;text-align:center}@media (min-width: 769px){.work-content{grid-template-columns:2fr 1fr}}.about{padding-top:4rem;min-height:100vh}.about-content{max-width:60rem;margin:0 auto;padding:2rem 1rem;line-height:1.8;font-size:1rem}.admin-login{min-height:100vh;display:flex;align-items:center;justify-content:center;background-color:#f5f5f5}.login-container{width:100%;max-width:25rem;padding:2rem;background-color:var(--color-background);border-radius:.5rem;box-shadow:0 .25rem .5rem #0000001a}.login-title{font-size:1.75rem;margin-bottom:2rem;text-align:center}.login-form{display:flex;flex-direction:column;gap:1.5rem}.form-input{padding:.75rem;font-size:1rem;border:.0625rem solid var(--color-border);border-radius:.25rem;min-height:2.75rem}.form-input:focus{outline:none;border-color:var(--color-primary)}.login-button{padding:.75rem;font-size:1rem;background-color:var(--color-primary);color:#fff;border:none;border-radius:.25rem;cursor:pointer;min-height:2.75rem;transition:background-color .3s}.login-button:hover{background-color:#222}.login-button:active{transform:scale(.98)}.upload-form{max-width:50rem;margin:0 auto;background-color:var(--color-background);padding:2rem;border-radius:.5rem;box-shadow:0 .125rem .25rem #0000001a}.form-title{font-size:1.75rem;margin-bottom:2rem}.form{display:flex;flex-direction:column;gap:1.5rem}.upload-area{margin-bottom:1.5rem}.drop-zone{border:.125rem dashed var(--color-border);border-radius:.5rem;padding:2rem;text-align:center;cursor:pointer;transition:border-color .3s,background-color .3s;min-height:5rem;display:flex;align-items:center;justify-content:center}.drop-zone:hover{border-color:var(--color-primary);background-color:#f9f9f9}.drop-zone-content{display:flex;flex-direction:column;align-items:center;gap:1rem}.drop-zone-text{font-size:1rem;color:var(--color-text-light)}.file-input{display:none}.file-label{padding:.75rem 1.5rem;background-color:var(--color-primary);color:#fff;border-radius:.25rem;cursor:pointer;font-size:1rem;min-height:2.75rem;display:inline-flex;align-items:center;justify-content:center;transition:background-color .3s}.file-label:hover{background-color:#222}.preview-container{position:relative;width:100%;max-height:30rem;overflow:hidden;border-radius:.5rem}.preview-image{width:100%;height:auto;max-height:30rem;object-fit:contain}.remove-preview{position:absolute;top:.5rem;right:.5rem;padding:.5rem 1rem;background-color:#000000b3;color:#fff;border:none;border-radius:.25rem;cursor:pointer;font-size:.875rem;min-height:2.75rem}.progress-bar{margin-top:1rem;height:1.5rem;background-color:#e0e0e0;border-radius:.75rem;overflow:hidden;position:relative}.progress-fill{height:100%;background-color:var(--color-primary);transition:width .3s}.progress-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.875rem;font-weight:700;color:var(--color-text)}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-label{font-size:1rem;font-weight:500}.required{color:#c33}.form-input,.form-textarea,.form-select{padding:.75rem;font-size:1rem;border:.0625rem solid var(--color-border);border-radius:.25rem;font-family:inherit;min-height:2.75rem}.form-textarea{resize:vertical;min-height:6rem}.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--color-primary)}.error-message{padding:.75rem;background-color:#fee;color:#c33;border-radius:.25rem;font-size:.875rem}.success-message{padding:.75rem;background-color:#efe;color:#3c3;border-radius:.25rem;font-size:.875rem}.submit-button{padding:.75rem 1.5rem;font-size:1rem;background-color:var(--color-primary);color:#fff;border:none;border-radius:.25rem;cursor:pointer;min-height:2.75rem;transition:background-color .3s}.submit-button:hover:not(:disabled){background-color:#222}.submit-button:disabled{opacity:.6;cursor:not-allowed}@media (max-width: 768px){.upload-form{padding:1rem}.drop-zone{padding:1.5rem;min-height:5rem}.file-label{width:100%;padding:1rem}}.works-management{max-width:80rem;margin:0 auto}.management-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.management-title{font-size:1.75rem}.filter-controls{display:flex;gap:1rem}.filter-select{padding:.75rem 1rem;font-size:1rem;border:.0625rem solid var(--color-border);border-radius:.25rem;background-color:var(--color-background);cursor:pointer;min-height:2.75rem}.works-list{display:flex;flex-direction:column;gap:1.5rem}.work-item{display:flex;gap:1.5rem;padding:1.5rem;background-color:var(--color-background);border:.0625rem solid var(--color-border);border-radius:.5rem;align-items:center}.work-item-thumbnail{width:8rem;height:8rem;object-fit:cover;border-radius:.25rem;flex-shrink:0}.work-item-info{flex:1;display:flex;flex-direction:column;gap:.5rem}.work-item-title{font-size:1.25rem;margin:0}.work-item-category,.work-item-date{font-size:.875rem;color:var(--color-text-light);margin:0}.work-item-actions{display:flex;gap:1rem;flex-shrink:0}.action-button{padding:.75rem 1.5rem;font-size:1rem;border:none;border-radius:.25rem;cursor:pointer;min-height:2.75rem;min-width:5rem;transition:background-color .3s}.edit-button{background-color:var(--color-primary);color:#fff}.edit-button:hover{background-color:#222}.delete-button{background-color:#c33;color:#fff}.delete-button:hover{background-color:#a22}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000;padding:1rem}.modal-content{background-color:var(--color-background);border-radius:.5rem;padding:2rem;max-width:30rem;width:100%;max-height:90vh;overflow-y:auto}.modal-title{font-size:1.5rem;margin-bottom:1.5rem}.edit-form{display:flex;flex-direction:column;gap:1.5rem}.modal-actions{display:flex;gap:1rem;justify-content:flex-end;margin-top:1rem}.cancel-button,.save-button{padding:.75rem 1.5rem;font-size:1rem;border:none;border-radius:.25rem;cursor:pointer;min-height:2.75rem;min-width:5rem;transition:background-color .3s}.cancel-button{background-color:#e0e0e0;color:var(--color-text)}.cancel-button:hover{background-color:#d0d0d0}.save-button{background-color:var(--color-primary);color:#fff}.save-button:hover{background-color:#222}.form-checkbox-group{margin-bottom:1rem}.form-checkbox-label{display:flex;align-items:center;gap:.5rem;cursor:pointer;font-size:1rem}.form-checkbox{width:1.25rem;height:1.25rem;cursor:pointer}.form-checkbox-label span{-webkit-user-select:none;user-select:none}.cover-selectors{margin-bottom:2rem;padding:1.5rem;background-color:var(--color-background);border:.0625rem solid var(--color-border);border-radius:.5rem}.cover-selectors-title{font-size:1.25rem;margin-bottom:1rem}.cover-selectors-grid{display:flex;flex-wrap:wrap;gap:1rem}.cover-selector-button{padding:.75rem 1.5rem;font-size:1rem;border:.0625rem solid var(--color-primary);border-radius:.25rem;background-color:transparent;color:var(--color-primary);cursor:pointer;min-height:2.75rem;transition:all .3s}.cover-selector-button:hover{background-color:var(--color-primary);color:#fff}.cover-selector-modal{max-width:60rem;max-height:90vh}.cover-selector-works-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(12rem,1fr));gap:1.5rem;margin-bottom:1.5rem;max-height:60vh;overflow-y:auto;padding:.5rem}.cover-selector-work-item{cursor:pointer;border:.125rem solid transparent;border-radius:.5rem;padding:.75rem;transition:all .3s;background-color:var(--color-background)}.cover-selector-work-item:hover{border-color:var(--color-primary);transform:translateY(-.25rem);box-shadow:0 .25rem .5rem #0000001a}.cover-selector-work-image{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:.25rem;margin-bottom:.75rem}.cover-selector-work-info{display:flex;flex-direction:column;gap:.25rem}.cover-selector-work-title{font-size:.875rem;font-weight:600;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cover-selector-work-category,.cover-selector-work-date{font-size:.75rem;color:var(--color-text-light);margin:0}.no-works-message{text-align:center;padding:2rem;color:var(--color-text-light)}@media (max-width: 768px){.work-item{flex-direction:column;align-items:flex-start}.work-item-thumbnail{width:100%;height:auto;aspect-ratio:4/3}.work-item-actions{width:100%;justify-content:flex-end}.action-button{flex:1}.cover-selectors-grid{flex-direction:column}.cover-selector-button{width:100%}.cover-selector-works-grid{grid-template-columns:repeat(auto-fill,minmax(8rem,1fr));gap:1rem}}.category-management{padding:2rem 0}.management-header{margin-bottom:2rem}.management-title{font-size:1.5rem;font-weight:700;margin:0}.error-message{background-color:#fee;color:#c33;padding:1rem;border-radius:.5rem;margin-bottom:1rem}.success-message{background-color:#efe;color:#3c3;padding:1rem;border-radius:.5rem;margin-bottom:1rem}.create-category-section{margin-bottom:3rem;padding:1.5rem;background-color:#f9f9f9;border-radius:.5rem}.section-title{font-size:1.25rem;font-weight:700;margin-bottom:1rem}.create-category-form{display:flex;gap:1rem;align-items:center}.category-input{flex:1;padding:.75rem;border:.0625rem solid #ddd;border-radius:.25rem;font-size:1rem}.category-input:focus{outline:none;border-color:var(--color-primary)}.create-button{padding:.75rem 1.5rem;background-color:var(--color-primary);color:#fff;border:none;border-radius:.25rem;font-size:1rem;cursor:pointer;transition:background-color .3s}.create-button:hover{background-color:var(--color-primary-dark)}.categories-list-section{padding:1.5rem;background-color:#f9f9f9;border-radius:.5rem}.categories-list{display:flex;flex-direction:column;gap:1rem}.category-item{display:flex;justify-content:space-between;align-items:center;padding:1rem;background-color:#fff;border:.0625rem solid #ddd;border-radius:.5rem}.category-info{display:flex;align-items:center;gap:1rem}.category-name{font-size:1.125rem;font-weight:500}.category-badge{padding:.25rem .75rem;background-color:#e0e0e0;color:#666;border-radius:1rem;font-size:.875rem}.category-actions{display:flex;gap:.5rem}.action-button{padding:.5rem 1rem;border:none;border-radius:.25rem;font-size:.875rem;cursor:pointer;transition:all .3s}.edit-button{background-color:#4a90e2;color:#fff}.edit-button:hover{background-color:#357abd}.delete-button{background-color:#e74c3c;color:#fff}.delete-button:hover{background-color:#c0392b}.edit-category-form{display:flex;gap:1rem;align-items:center;width:100%}.edit-actions{display:flex;gap:.5rem}.save-button{padding:.5rem 1rem;background-color:#27ae60;color:#fff;border:none;border-radius:.25rem;font-size:.875rem;cursor:pointer}.save-button:hover{background-color:#229954}.cancel-button{padding:.5rem 1rem;background-color:#95a5a6;color:#fff;border:none;border-radius:.25rem;font-size:.875rem;cursor:pointer}.cancel-button:hover{background-color:#7f8c8d}@media (max-width: 768px){.create-category-form{flex-direction:column;align-items:stretch}.category-item{flex-direction:column;align-items:stretch;gap:1rem}.category-actions{justify-content:flex-end}.edit-category-form{flex-direction:column;align-items:stretch}.edit-actions{justify-content:flex-end}}.admin-dashboard{min-height:100vh;background-color:#f5f5f5}.admin-header{background-color:var(--color-background);border-bottom:.0625rem solid var(--color-border);padding:1.5rem 0}.admin-header .container{display:flex;justify-content:space-between;align-items:center;position:relative}.admin-home-link{font-size:.875rem;color:var(--color-text);text-decoration:none;transition:color .3s}.admin-home-link:hover{color:var(--color-primary)}.admin-title{font-size:1.75rem;position:absolute;left:50%;transform:translate(-50%)}.logout-button{padding:.5rem 1rem;font-size:.875rem;background-color:transparent;color:var(--color-text-light);border:.0625rem solid var(--color-border);border-radius:.25rem;cursor:pointer;min-height:2rem;transition:all .3s}.logout-button:hover{color:var(--color-text);border-color:var(--color-text)}.admin-nav{background-color:var(--color-background);border-bottom:.0625rem solid var(--color-border)}.admin-nav .container{display:flex;gap:0}.nav-button{padding:1rem 2rem;font-size:1rem;background:none;border:none;border-bottom:.1875rem solid transparent;cursor:pointer;color:var(--color-text);transition:all .3s;min-height:2.75rem}.nav-button:hover{background-color:#f5f5f5}.nav-button.active{border-bottom-color:var(--color-primary);color:var(--color-primary);font-weight:700}.admin-content{padding:2rem 0}:root{font-size:16px;--color-primary: #333;--color-secondary: #666;--color-background: #fff;--color-border: #e0e0e0;--color-text: #333;--color-text-light: #666}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--color-text);background-color:var(--color-background);line-height:1.6}@media (max-width: 768px){html{font-size:16px}}@media (min-width: 769px){html{font-size:16px}}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer;border:none;background:none}input,textarea,select{font-family:inherit;font-size:1rem}img{max-width:100%;height:auto;display:block}.container{width:100%;max-width:120rem;margin:0 auto;padding:0 1rem}.sr-only{position:absolute;width:.0625rem;height:.0625rem;padding:0;margin:-.0625rem;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}
