@import"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0";.admin-page{padding:0}.admin-tabs{display:flex;gap:0;background:#fff;box-shadow:0 1px 3px #0000000a}.admin-tab{margin-top:1rem;padding:1.2rem 2.5rem;background:transparent;border:none;font-size:1.05rem;font-weight:500;color:#555;cursor:pointer;transition:all .3s ease;border-bottom:3px solid transparent;position:relative}.admin-tab:hover{color:#111;background:#f5f5f5}.admin-tab.active{color:#111;border-bottom-color:#111}.admin-tab.active:after{content:"";position:absolute;bottom:-3px;left:0;right:0;height:3px;background:#111}.admin-page>.admin-container,.admin-page>div>.admin-container{margin-top:0;border-radius:0}.admin-container{margin:0 auto;background:#fff;border-radius:8px;padding-top:16px}.admin-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:1rem;justify-content:flex-end}.admin-header h2{margin:0;font-size:1.8rem;color:#111}.btn-primary{background:#111;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000040}.btn-secondary{background:#f8f8f8;color:#444;border:none;padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-secondary:hover{background:#e0e0e0}.btn-tertiary{background:transparent;border:1px dashed #cfcfcf;color:#444;padding:.4rem 1rem;border-radius:4px;font-size:.85rem;cursor:pointer;transition:all .2s ease}.btn-tertiary:hover{border-color:#111;color:#111}.btn-edit{background:#f8f8f8;color:#222;border:none;padding:.5rem 1rem;border-radius:6px;font-size:.9rem;cursor:pointer;transition:all .2s ease}.btn-edit:hover{background:#eaeaea;transform:translateY(-1px)}.btn-delete{background:#f8f8f8;color:#222;border:none;padding:.5rem 1rem;border-radius:6px;font-size:.9rem;cursor:pointer;transition:all .2s ease}.btn-delete:hover{background:#eaeaea;transform:translateY(-1px)}.admin-works-list{display:flex;flex-direction:column;gap:1rem}.admin-work-item{display:grid;grid-template-columns:150px 1fr auto;gap:1.5rem;padding:1rem;background:#fff;border-radius:6px;transition:all .3s ease;border:1px solid #eeeeee;cursor:grab;-webkit-user-select:none;user-select:none}.admin-work-item:hover{background:#fafafa;box-shadow:0 6px 18px #0000000f}.admin-work-item.admin-work-item-dragging{opacity:.65;cursor:grabbing;box-shadow:0 10px 30px #00000014}.admin-work-item.admin-work-item-dragover{border-color:#111;background:#f8f8f8}.admin-list-hint{display:inline-flex;align-items:center;gap:.35rem;font-size:.85rem;color:#777;margin-bottom:1rem}.admin-list-hint .material-symbols-outlined{font-size:1rem;line-height:1}.admin-work-image{width:150px;height:100px;border-radius:4px;overflow:hidden;background:#e0e0e0;display:flex;align-items:center;justify-content:center}.admin-work-image img{width:100%;height:100%;object-fit:cover}.work-video-thumbnail{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#333;color:#fff;font-size:2rem}.admin-work-info{display:flex;flex-direction:column;gap:.5rem}.admin-work-info h3{margin:0;font-size:1.2rem;color:#111}.admin-work-info .work-description{margin:0;color:#666;font-size:.9rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.admin-work-info .work-meta{display:flex;gap:1rem;font-size:.85rem}.admin-work-info .work-meta .work-category{opacity:1;transform:translateY(0);transition:all .4s ease}.admin-work-actions{display:flex;flex-direction:column;gap:.5rem;justify-content:center}.admin-form{display:flex;flex-direction:column;gap:1.5rem}.admin-form-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1.5fr);gap:2rem;align-items:flex-start}.form-column{display:flex;flex-direction:column;gap:1.25rem}.form-column-basic{border-right:1px solid #f0f0f0;padding-right:1.5rem}.form-column-media{padding-left:.5rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-weight:600;color:#222;font-size:.95rem}.form-group input[type=text],.form-group textarea,.form-group select{padding:.75rem;border:1px solid #dddddd;border-radius:2px;font-size:1rem;font-family:inherit;transition:all .3s ease;background:#fff;color:#111}.form-group input[type=text]:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:#111;box-shadow:0 0 0 1px #00000059}.form-group input[type=file]{padding:.5rem;border:1px dashed #dddddd;border-radius:2px;cursor:pointer;background:#fff;color:#555;width:100%}.form-hint{font-size:.85rem;color:#999;margin:0}.media-preview-list{display:flex;flex-direction:column;gap:1rem}.cover-preview{margin-top:.75rem;border-radius:6px;border:1px solid #e5e5e5;background:#fff;padding:.75rem .9rem .9rem}.cover-preview-title{font-size:.85rem;color:#555;margin-bottom:.5rem;letter-spacing:.02em}.cover-preview-image{width:50%;aspect-ratio:16 / 9;border-radius:4px;overflow:hidden;background:#f3f3f3;border:1px solid #e5e5e5}.cover-preview-image img{width:100%;height:100%;object-fit:cover;display:block}.cover-input-row{display:flex;gap:1.25rem;align-items:flex-start}.cover-input-left{flex:1;display:flex;flex-direction:column;gap:.5rem}@media (max-width: 768px){.cover-input-row{flex-direction:column}}.card-size-inline{width:100%;display:flex;flex-direction:column;gap:.4rem}.card-size-inline label{font-size:.9rem;color:#555}.card-size-select-wrapper{position:relative;display:inline-flex;align-items:center;width:100%}.card-size-select{width:100%;padding:.35rem;border:1px solid #dddddd;background:#fff;font-size:.9rem;color:#111;appearance:none;-webkit-appearance:none;-moz-appearance:none}.card-size-select-icon{position:absolute;right:8px;pointer-events:none;font-size:18px;color:#555}@media (max-width: 1024px){.admin-form-layout{grid-template-columns:1fr}.form-column-basic{border-right:none;border-bottom:1px solid #f0f0f0;padding-right:0;padding-bottom:1.5rem;margin-bottom:.5rem}.form-column-media{padding-left:0}}.content-module-item{display:flex;flex-direction:column;gap:.75rem;padding:1rem;background:#fff;border:1px solid #e5e5e5;border-radius:6px;transition:all .2s ease;cursor:grab;-webkit-user-select:none;user-select:none}.content-module-item:hover{border-color:#111;box-shadow:0 2px 8px #0000000a}.content-module-item:active{cursor:grabbing}.content-module-item-dragging{opacity:.5;transform:scale(.98);box-shadow:0 4px 16px #0000001a}.content-module-item-dragover{border-color:#111;background:#fafafa}.content-module-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.content-module-order{font-size:.75rem;font-weight:600;color:#999;min-width:32px}.content-module-type-badge{display:inline-flex;align-items:center;padding:.2rem .5rem;background:#111;color:#fff;border-radius:3px;font-size:.7rem;font-weight:500;margin-left:auto}.content-module-body{display:flex;flex-direction:row;align-items:flex-start;gap:.75rem}.content-module-media-wrapper{display:flex;flex-direction:column;gap:.5rem;flex-shrink:0}.content-module-media{width:120px;height:80px;border-radius:4px;overflow:hidden;background:#f5f5f5;position:relative;flex-shrink:0}.content-module-media img,.content-module-media video{width:100%;height:100%;object-fit:cover}.content-module-media video{background:#000}.content-module-url{width:120px}.url-display{display:flex;align-items:center;gap:.25rem;padding:.375rem .5rem;background:#fafafa;border:1px solid #e5e5e5;border-radius:4px;cursor:pointer;transition:all .2s ease;font-size:.75rem}.url-display:hover{background:#f5f5f5;border-color:#111}.url-text{flex:1;color:#666;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.url-edit-icon{font-size:.875rem;color:#999;flex-shrink:0}.url-edit-group{width:100%}.url-edit-input{width:100%;padding:.375rem .5rem;border:1px solid #111111;border-radius:4px;font-size:.75rem;background:#fff;color:#111;font-family:inherit}.url-edit-input:focus{outline:none;box-shadow:0 0 0 2px #0000000d}.media-preview-placeholder{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f5f5f5;color:#999;gap:.5rem;cursor:pointer;transition:all .2s ease;border:1px dashed #e0e0e0}.media-preview-placeholder:hover{background:#f0f0f0;border-color:#111}.media-preview-placeholder .material-symbols-outlined{font-size:2rem;color:#ccc}.media-preview-placeholder p{margin:0;font-size:.75rem;text-align:center;padding:0 .5rem;word-break:break-all;color:#999}.content-module-media-input{width:100%;display:flex;flex-direction:column;gap:.75rem;padding:.75rem;background:#fafafa;border:1px solid #e5e5e5;border-radius:4px}.media-edit-btn{position:absolute;top:.5rem;right:.5rem;width:28px;height:28px;padding:0;border:none;background:#0009;color:#fff;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;opacity:0}.content-module-media:hover .media-edit-btn{opacity:1}.media-edit-btn:hover{background:#000c}.media-edit-btn .material-symbols-outlined{font-size:1rem}.cover-badge{position:absolute;top:.5rem;right:.5rem;background:#111;color:#fff;padding:.25rem .75rem;border-radius:12px;font-size:.75rem;font-weight:600}.content-module-footer{display:flex;align-items:center;padding-top:.5rem}.control-btn{border:none;width:36px;height:36px;background:#fff;cursor:pointer;font-size:1rem;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.control-btn:hover:not(:disabled){color:#111;transform:translateY(-1px)}.control-btn:disabled{opacity:.3;cursor:not-allowed}.control-btn-cover{border-color:#111;color:#111}.control-btn-cover:hover{background:#111;color:#fff}.control-btn-remove{font-family:Material Symbols Outlined;color:#666;font-size:1.25rem;width:28px;height:28px;padding:0;border-radius:4px}.control-btn-remove:hover{background:#f0f0f0;color:#111}.module-width-select{flex:1;padding:.5rem 2rem .5rem .75rem;border:1px solid #e5e5e5;border-radius:4px;font-size:.85rem;background:#fff;color:#111;cursor:pointer;transition:all .2s ease;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23666' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center}.module-width-select:hover{border-color:#111}.module-width-select:focus{outline:none;border-color:#111;box-shadow:0 0 0 2px #0000000d}.admin-preview-section{margin-top:2rem;padding:1.5rem;background:var(--color-surface, #ffffff);border:1px solid var(--color-border, #e5e5e5);border-radius:var(--radius-md, 8px)}.admin-preview-section h3{margin:0 0 1rem;font-size:1rem;font-weight:500;color:var(--color-text, #111111)}.admin-preview-gallery{max-width:100%}.admin-preview-gallery .work-content-gallery{gap:1rem}.admin-preview-gallery .content-media-item{height:300px;background:var(--color-bg, #f5f5f5)}.admin-preview-gallery .content-text-module{min-height:auto;font-size:.9rem;text-align:left;justify-content:flex-start;align-items:flex-start}.admin-preview-gallery .content-media-item-text{height:auto!important;min-height:auto!important;overflow:visible}.text-module-preview{width:100%;padding:.5rem}.text-module-input{width:100%;padding:.75rem;border:1px solid #e5e5e5;border-radius:4px;font-size:.9rem;font-family:inherit;resize:vertical;min-height:100px;background:#fff;color:#111;transition:all .2s ease}.text-module-input:focus{outline:none;border-color:#111;box-shadow:0 0 0 2px #0000000d}.text-module-input::placeholder{color:#999}.admin-preview-gallery .content-media-row{gap:1rem}.admin-preview-gallery .content-media-row .content-media-item-left,.admin-preview-gallery .content-media-row .content-media-item-right{width:calc(50% - .5rem)!important}@media (max-width: 768px){.admin-preview-gallery .content-media-item{height:200px}.admin-preview-gallery .content-media-row{flex-direction:column;gap:1rem}.admin-preview-gallery .content-media-row .content-media-item-left,.admin-preview-gallery .content-media-row .content-media-item-right{width:100%!important}}.media-preview-width{display:flex;align-items:center;gap:.5rem;margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--color-border, #e5e5e5);width:100%}.media-preview-width label{font-size:.85rem;color:var(--color-text-muted, #777777);white-space:nowrap}.media-width-select{flex:1;padding:.5rem;border:1px solid var(--color-border, #e5e5e5);border-radius:var(--radius-sm, 4px);font-size:.9rem;background:var(--color-surface, #ffffff);color:var(--color-text, #111111);cursor:pointer;transition:border-color var(--transition-fast, .2s ease)}.media-width-select:hover{border-color:var(--color-text, #111111)}.media-width-select:focus{outline:none;border-color:var(--color-text, #111111)}.submit-button{background:#111;color:#fff;border:none;padding:1rem 2rem;border-radius:8px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .3s ease;margin-top:1rem}.submit-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #00000040}.submit-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.message{padding:1rem;border-radius:8px;margin-bottom:1rem;font-weight:500}.message-success{background:#f5f5f5;color:#111;border:1px solid #e0e0e0}.message-error{background:#fafafa;color:#111;border:1px solid #e0e0e0}.loading{text-align:center;padding:3rem;color:#777;font-size:1.1rem}.empty{text-align:center;padding:3rem;color:#777}.empty p{font-size:1.2rem;margin-bottom:1.5rem}@media (max-width: 768px){.admin-page{padding:1rem}.admin-header{flex-direction:column;gap:1rem;align-items:stretch}.admin-work-item{grid-template-columns:1fr;gap:1rem}.admin-work-image{width:100%;height:200px}.admin-work-actions{flex-direction:row}.media-preview-item{grid-template-columns:1fr;gap:1rem}.media-preview-content{width:100%;height:200px}.media-preview-controls,.media-preview-order{justify-content:center}}.banner-item .admin-work-image{height:150px}.banner-preview{position:relative}.banner-inactive-badge{position:absolute;top:10px;right:10px;background:#111;color:#fff;padding:.3rem .8rem;border-radius:4px;font-size:.85rem;font-weight:600}.banner-preview-large{width:100%;aspect-ratio:3 / 1;overflow:hidden;border-radius:4px;border:1px solid #e0e0e0;background:#fafafa}.banner-preview-large img{width:100%;height:100%;object-fit:cover}.banner-media-input{gap:.75rem}.banner-media-input-body{display:flex;flex-direction:column;gap:.45rem}.banner-media-input .banner-preview-large,.media-input-mode-switch.secondary{margin-top:.25rem}.banner-file-input input[type=file]{width:100%}.banner-file-preview{margin-top:.75rem;border:1px solid #e5e5e5;border-radius:4px;padding:.75rem;display:flex;flex-direction:column;gap:.6rem;background:#fff}.banner-file-preview img,.banner-file-preview video{width:100%;border-radius:4px;object-fit:cover;max-height:280px}.banner-file-meta{display:flex;justify-content:space-between;align-items:center;font-size:.9rem;color:#555}.checkbox-label{display:flex;align-items:center;gap:.5rem;cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox-label input[type=checkbox]{width:auto;margin:0;cursor:pointer}.checkbox-label span{font-weight:500}.radio-group{display:flex;gap:1.5rem}.radio-label{display:flex;align-items:center;gap:.5rem;cursor:pointer;padding:.8rem 1.2rem;border:2px solid #e0e0e0;border-radius:8px;transition:all .3s ease;background:#fff}.radio-label:hover{border-color:#667eea;background:#667eea0d}.radio-label input[type=radio]{width:auto;margin:0;cursor:pointer}.radio-label input[type=radio]:checked+span{font-weight:600;color:#667eea}.radio-label:has(input:checked){border-color:#667eea;background:#667eea1a}.radio-label span{font-size:1rem}.video-preview iframe,.video-preview video{width:100%;height:300px;border-radius:8px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.media-input-unified{border-radius:10px;border:1px solid #e5e5e5;background:#fafafa;padding:1rem 1.1rem;display:flex;flex-direction:column;gap:.9rem}.media-input-mode-switch{display:inline-flex;padding:3px;border-radius:999px;background:#fff;border:1px solid #e5e5e5;gap:3px;align-self:flex-start}.media-input-mode-btn{border:none;background:transparent;padding:.35rem .9rem;font-size:.9rem;color:#777;border-radius:999px;cursor:pointer;transition:all .2s ease}.media-input-mode-btn:hover{background:#f3f3f3;color:#111}.media-input-mode-btn.active{background:#111;color:#fff}.media-input-file input[type=file]{width:100%}.url-input-group{width:50%;display:flex;gap:.5rem}.url-type-select{width:80px;padding:.6rem;border:1px solid #dddddd;border-radius:6px;font-size:.9rem;background:#fff;cursor:pointer}.url-input{flex:1;padding:.6rem 1rem;border:1px solid #dddddd;border-radius:6px;font-size:.9rem}.url-input:focus{outline:none;border-color:#111;box-shadow:0 0 0 1px #00000040}.btn-add-url{padding:.6rem 1.1rem;background:#111;color:#fff;border:none;border-radius:6px;font-weight:500;cursor:pointer;transition:all .2s ease;white-space:nowrap}.btn-add-url:hover{background:#000;transform:translateY(-1px)}.btn-add-url:active{transform:translateY(0)}.url-badge{font-family:Material Symbols Outlined;position:absolute;top:2px;left:2px;color:#ffffffbd;font-size:1rem;font-weight:400}@media (max-width: 768px){.admin-tab{padding:1rem 1.5rem;font-size:.95rem}.form-row{grid-template-columns:1fr}.media-input-tabs{grid-template-columns:1fr;gap:1rem}.media-input-divider{display:none}.url-type-select{width:100%}}.work-detail{display:flex;flex-direction:column}.back-button{background:#fff;border:1px solid #ddd;padding:.6rem 1.2rem;border-radius:8px;cursor:pointer;font-size:1rem;transition:all .3s ease;white-space:nowrap}.back-button:hover{background:#f0f0f0;border-color:#667eea;color:#667eea}.nav-cover{flex:1;max-width:200px;height:60px;overflow:hidden;border-radius:8px;background:#f0f0f0;display:flex;align-items:center;justify-content:center}.nav-cover img,.nav-cover video{width:100%;height:100%;object-fit:cover}.work-detail-content{display:flex;gap:2rem;margin:0 auto;width:100%;flex-direction:column}.work-detail-gallery{min-width:0}.work-content-gallery{display:flex;flex-direction:column;gap:1rem}.content-media-row{display:flex;gap:1rem;width:100%}.content-media-item{width:100%;height:60vh;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--color-bg, #f5f5f5)}.content-media-item-text{height:auto!important;min-height:auto!important;overflow:visible}.content-media-item-full{width:100%!important}.content-media-item-left{width:50%!important;margin-right:0!important;margin-left:0!important}.content-media-item-right{width:50%!important;margin-left:auto!important;margin-right:0!important}.content-media-item-text.content-media-item-left .content-text-module,.content-media-item-text.content-media-item-right .content-text-module{width:100%}.content-media-row .content-media-item-left,.content-media-row .content-media-item-right{width:calc(50% - .5rem)!important}.content-media-item img{width:100%;height:100%;object-fit:cover;display:block}.content-media-item video{width:100%;height:100%;object-fit:cover;display:block}.content-text-module{width:100%;padding:2rem 0;display:flex;align-items:flex-start;justify-content:flex-start;text-align:left;font-size:1.5rem;line-height:1.2;color:var(--color-text, #111111);white-space:pre-wrap;word-wrap:break-word;background:var(--color-surface, #ffffff);height:auto;min-height:auto}.no-media{background:#fff;padding:3rem;border-radius:12px;text-align:center;color:#999;font-size:1.1rem}.work-detail-info{margin-top:2rem;height:fit-content}.work-info-card h1{font-size:2rem;font-weight:500;margin-bottom:var(--spacing-1);color:var(--color-text, #111111);line-height:1.3}.work-detail-description{font-size:1rem;color:var(--color-text-muted, #777777);line-height:1.6;margin-bottom:2rem}.work-detail-meta{display:flex;flex-direction:column;gap:1.5rem}.meta-item{display:flex;flex-direction:column;gap:.5rem}.meta-label{font-size:.85rem;color:var(--color-text-soft, #999999);text-transform:uppercase;letter-spacing:.5px}.work-category{display:inline-block;background:var(--color-text, #111111);color:var(--color-surface, #ffffff);padding:.4rem .8rem;border-radius:var(--radius-sm, 4px);font-size:.9rem;font-weight:500;opacity:1!important;width:fit-content;transform:translateY(0)!important}.loading,.error{display:flex;align-items:center;justify-content:center;min-height:50vh;font-size:1.2rem;color:#666}.error{color:#d32f2f}@media (max-width: 1024px){.work-detail-content{flex-direction:column;gap:2rem}.work-detail-gallery{flex:1}.work-detail-info{position:static;max-height:none;min-width:auto}.nav-cover{max-width:150px;height:50px}}@media (max-width: 768px){.work-detail{padding:0}.nav-cover{max-width:100px;height:40px}.work-detail-content{padding:1rem;gap:1.5rem}.work-info-card h1{font-size:1.5rem}.content-media-item{height:50vh}.content-media-row{flex-direction:column;gap:1rem}.content-media-row .content-media-item-left,.content-media-row .content-media-item-right{width:100%!important}}.app{min-height:100vh;display:flex;flex-direction:column}.header{background:#fff;position:sticky;top:0;z-index:100}.header-container{max-width:1700px;margin:0 auto;padding:.5rem 0rem;display:flex;justify-content:space-between;align-items:center}.header-logo{display:flex;align-items:center;gap:1rem;cursor:pointer;color:#353535}.header-logo img{height:26px;width:auto}.header-title{font-size:1.5rem;font-weight:700;color:#111;white-space:nowrap}.header-nav{display:flex;gap:.5rem}.nav-button{padding:.6rem;background:transparent;color:#666;border:none;border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .3s ease}.nav-button:hover{color:#000}.main{max-width:1700px;margin:0 auto;flex:1;width:100%;padding-bottom:2rem}.loading,.empty{text-align:center;padding:4rem 2rem;color:#666;font-size:1.1rem}.empty-button{margin-top:1.5rem;padding:.8rem 2rem;background:#111;color:#fff;border:none;border-radius:8px;font-size:1rem;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.empty-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000002e}.works-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:2rem}.work-card{grid-column:span 4;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease;cursor:pointer}.work-card:hover{transform:translateY(-5px)}.work-card-large{grid-column:span 8}.work-card-large .work-image{height:700px}.work-image{width:100%;height:300px;overflow:hidden}.work-image img{width:100%;height:100%;object-fit:cover}.work-video{width:100%;height:300px;overflow:hidden}.work-video video{width:100%;height:100%;object-fit:contain}.work-video-thumbnail{width:100%;height:100%;background:#333;display:flex;align-items:center;justify-content:center;color:#fff;font-size:3rem}.work-content{padding:1rem 0}.work-content h3{font-size:1rem;margin-bottom:.2rem;color:#333}.work-description{color:#838383;margin-bottom:1rem;line-height:1.2}.work-meta{display:flex;justify-content:space-between;align-items:center;font-size:.9rem}.work-category{background:#cecece;color:#3d3d3d;padding:.3rem;line-height:1;border-radius:5px;font-size:.85rem;opacity:0;transform:translateY(20px);transition:all .4s ease}.work-card:hover .work-category{opacity:1;transform:translateY(0)}.work-date{color:#999}@media (max-width: 1024px){.work-card{grid-column:span 6}.work-card-large{grid-column:span 12}}@media (max-width: 768px){.header-container{padding:.5rem}.header-logo img{height:32px}.header-title{font-size:1.2rem}.header-nav{gap:.25rem}.nav-button{padding:.5rem 1rem;font-size:.9rem}.main{padding:2rem 1rem}.works-grid{grid-template-columns:repeat(12,1fr);gap:1.5rem}.work-card,.work-card-large{grid-column:span 12}.work-card-large .work-image{height:300px}.work-card-large .work-content h3{font-size:1.2rem}.work-card-large .work-description{font-size:1rem}}@media (max-width: 480px){.header-container{flex-direction:column;gap:1rem;align-items:flex-start}.header-nav{width:100%;justify-content:flex-start}.nav-button{flex:1;text-align:center}}.footer{margin-top:8rem;border-top:1px solid #e5e5e5;padding:1.2rem 1rem 1.6rem;background:#000}.footer-inner{max-width:1700px;margin:0 auto;display:flex;flex-direction:column;justify-content:space-between;color:#999;height:500px;align-items:flex-start}.footer-body{width:100%;display:grid;grid-template-columns:1fr 1fr;align-items:flex-start;gap:.5rem;color:#777;font-size:1.2rem;font-weight:500}.footer-body .title-text{grid-column:1;font-size:1.2rem;font-weight:500;color:#aaa}.footer-body .text-text{grid-column:2;font-size:1.2rem;font-weight:300;line-height:1.2;text-align:justify}.footer-logo{margin-top:2rem;grid-column:1 / 3;height:auto;cursor:pointer;color:#fff;filter:brightness(0) invert(.8)}@media (max-width: 768px){.footer{padding:1rem 1rem 1.4rem}.footer-inner{font-size:.8rem}}.banner-container{position:relative;width:100%;height:800px;margin-bottom:40px;overflow:hidden}.banner-slider{width:100%;height:100%;position:relative}.banner-slide{width:100%;height:100%;background-size:cover;background-position:center;background-repeat:no-repeat;display:flex;align-items:center;justify-content:center;position:absolute;top:0;left:0;transition:opacity .5s ease-in-out;cursor:pointer}.banner-slide:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0}.banner-slide.active{opacity:1;z-index:1}.banner-content{position:absolute;left:40px;bottom:20px;z-index:2;text-align:left;color:#fff;max-width:600px}.banner-title{font-size:1.3rem;font-weight:600;margin-bottom:4px;text-shadow:2px 2px 4px rgba(0,0,0,.5);animation:fadeInUp .8s ease-out}.banner-description{font-size:1rem;font-weight:300;line-height:1;text-shadow:1px 1px 3px rgba(0,0,0,.5);animation:fadeInUp .8s ease-out .2s both}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.banner-indicators{position:absolute;bottom:20px;right:40px;display:flex;gap:10px;z-index:3}.banner-indicators .indicator{width:12px;height:12px;border-radius:50%;border:2px solid white;background:#ffffff4d;cursor:pointer;transition:all .3s ease;padding:0}.banner-indicators .indicator:hover{background:#fff9;transform:scale(1.2)}.banner-indicators .indicator.active{background:#fff;width:30px;border-radius:6px}.banner-control{display:none}@media (max-width: 768px){.banner-container{height:250px}.banner-content{left:20px;bottom:20px;max-width:calc(100% - 140px)}.banner-indicators{right:20px;bottom:20px}.banner-title{font-size:1.8rem}.banner-description{font-size:1rem}}:root{--color-bg: #f5f5f5;--color-surface: #ffffff;--color-border: #e5e5e5;--color-border-subtle: #f0f0f0;--color-text: #111111;--color-text-muted: #777777;--color-text-soft: #999999;--color-accent: #111111;--radius-sm: 4px;--radius-md: 8px;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .06);--shadow-md: 0 4px 12px rgba(0, 0, 0, .12);--transition-fast: .2s ease;--transition-normal: .3s ease}*{margin:0;padding:0;box-sizing:border-box}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)}#root{min-height:100vh}.material-symbols-outlined{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24;font-size:20px;vertical-align:middle;line-height:1}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast)}.icon-button:hover{background:#f3f3f3;border-color:var(--color-text);transform:translateY(-1px)}.icon-button:disabled{opacity:.4;cursor:default;transform:none}