:root{--color-primary: #3b82f6;--color-primary-hover: #2563eb;--color-primary-light: #eff6ff;--color-secondary: #10b981;--color-secondary-hover: #059669;--color-success: #22c55e;--color-warning: #f59e0b;--color-error: #ef4444;--color-info: #3b82f6;--color-bg: #ffffff;--color-bg-subtle: #f8fafc;--color-bg-muted: #f1f5f9;--color-text: #0f172a;--color-text-muted: #64748b;--color-text-subtle: #94a3b8;--color-border: #e2e8f0;--color-border-strong: #cbd5e1;--color-status-pending: #f59e0b;--color-status-approved: #22c55e;--color-status-revision: #ef4444;--color-status-active: #3b82f6;--font-sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;--font-heading: var(--font-sans);--font-mono: 'JetBrains Mono', 'Fira Code', monospace;--text-xs: 0.75rem;--text-sm: 0.875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--space-1: 0.25rem;--space-2: 0.5rem;--space-3: 0.75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--radius-sm: 0.25rem;--radius-md: 0.375rem;--radius-lg: 0.5rem;--radius-xl: 0.75rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--transition-fast: 150ms ease;--transition-base: 200ms ease;--transition-slow: 300ms ease;--z-dropdown: 100;--z-modal: 200;--z-toast: 300}@media(prefers-color-scheme: dark){:root.dark-mode{--color-bg: #0f172a;--color-bg-subtle: #1e293b;--color-bg-muted: #334155;--color-text: #f8fafc;--color-text-muted: #94a3b8;--color-border: #334155}}*,*::before,*::after{box-sizing:border-box}html{font-family:var(--font-sans);line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4}body{margin:0;font-family:var(--font-sans);font-size:var(--text-base);line-height:1.5;color:var(--color-text);background-color:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6,p{margin:0}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:600;line-height:1.25;color:var(--color-text)}h1{font-size:var(--text-3xl)}h2{font-size:var(--text-2xl)}h3{font-size:var(--text-xl)}h4{font-size:var(--text-lg)}a{color:var(--color-primary);text-decoration:none}a:hover{color:var(--color-primary-hover)}img,video{max-width:100%;height:auto;display:block}button,input,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button{cursor:pointer;background:none;border:none;padding:0}ul,ol{list-style:none;margin:0;padding:0}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.text-muted{color:var(--color-text-muted)}.text-subtle{color:var(--color-text-subtle)}.text-primary{color:var(--color-primary)}.text-success{color:var(--color-success)}.text-warning{color:var(--color-warning)}.text-error{color:var(--color-error)}.font-normal{font-weight:400}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);font-family:var(--font-sans);font-size:var(--text-sm);font-weight:500;line-height:1.5;text-decoration:none;border-radius:var(--radius-lg);border:1px solid rgba(0,0,0,0);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;position:relative;overflow:hidden}.btn:active:not(:disabled){transform:scale(0.98)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--loading{color:rgba(0,0,0,0) !important;pointer-events:none}.btn--loading::after{content:"";position:absolute;width:1rem;height:1rem;border:2px solid currentColor;border-right-color:rgba(0,0,0,0);border-radius:50%;animation:btn-spin .6s linear infinite}.btn--loading.btn--primary::after,.btn--loading.btn--secondary::after,.btn--loading.btn--danger::after,.btn--loading.btn--success::after{border-color:#fff;border-right-color:rgba(0,0,0,0)}.btn--loading.btn--outline::after,.btn--loading.btn--ghost::after{border-color:var(--color-text-muted);border-right-color:rgba(0,0,0,0)}@keyframes btn-spin{to{transform:rotate(360deg)}}.btn--sm{padding:var(--space-1) var(--space-3);font-size:var(--text-xs)}.btn--lg{padding:var(--space-3) var(--space-6);font-size:var(--text-base)}.btn--primary{background-color:var(--color-primary);color:#fff}.btn--primary:hover:not(:disabled){background-color:var(--color-primary-hover)}.btn--primary:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.btn--secondary{background-color:var(--color-secondary);color:#fff}.btn--secondary:hover:not(:disabled){background-color:var(--color-secondary-hover)}.btn--outline{background-color:rgba(0,0,0,0);border-color:var(--color-border-strong);color:var(--color-text)}.btn--outline:hover:not(:disabled){background-color:var(--color-bg-subtle);border-color:var(--color-text-muted)}.btn--ghost{background-color:rgba(0,0,0,0);color:var(--color-text-muted)}.btn--ghost:hover:not(:disabled){background-color:var(--color-bg-muted);color:var(--color-text)}.btn--danger{background-color:var(--color-error);color:#fff}.btn--danger:hover:not(:disabled){background-color:#dc2626}.btn--success{background-color:var(--color-success);color:#fff}.btn--success:hover:not(:disabled){background-color:#16a34a}.btn--icon{padding:var(--space-2)}.btn--icon svg{width:1.25rem;height:1.25rem}.btn--block{width:100%}.btn svg{width:1rem;height:1rem;flex-shrink:0}.card{background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;transition:box-shadow var(--transition-base)}.card--elevated{box-shadow:var(--shadow-sm)}.card--elevated:hover{box-shadow:var(--shadow-md)}.card--interactive{cursor:pointer}.card--interactive:hover{border-color:var(--color-border-strong)}.card__header{padding:var(--space-4) var(--space-6);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between}.card__title{font-size:var(--text-lg);font-weight:600;color:var(--color-text)}.card__body{padding:var(--space-6)}.card__footer{padding:var(--space-4) var(--space-6);border-top:1px solid var(--color-border);background-color:var(--color-bg-subtle);display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3)}.project-card{background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;transition:all var(--transition-base)}.project-card:hover{border-color:var(--color-border-strong);box-shadow:var(--shadow-md)}.project-card__thumbnail{aspect-ratio:16/9;background-color:var(--color-bg-muted);overflow:hidden}.project-card__thumbnail img{width:100%;height:100%;object-fit:cover}.project-card__body{padding:var(--space-4)}.project-card__title{font-size:var(--text-base);font-weight:600;color:var(--color-text);margin-bottom:var(--space-1)}.project-card__meta{font-size:var(--text-sm);color:var(--color-text-muted)}.project-card__footer{padding:var(--space-3) var(--space-4);border-top:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between}.status-badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);font-size:var(--text-xs);font-weight:500;border-radius:var(--radius-full);text-transform:capitalize}.status-badge::before{content:"";width:6px;height:6px;border-radius:50%;background-color:currentColor}.status-badge--pending{background-color:#fef3c7;color:#b45309}.status-badge--active,.status-badge--in_progress{background-color:var(--color-primary-light);color:var(--color-primary)}.status-badge--approved,.status-badge--completed{background-color:#dcfce7;color:#15803d}.status-badge--revision_requested,.status-badge--rejected{background-color:#fee2e2;color:#b91c1c}.status-badge--on_hold{background-color:var(--color-bg-muted);color:var(--color-text-muted)}.status-badge--sm{padding:2px var(--space-2);font-size:.625rem}.status-badge--sm::before{width:4px;height:4px}.status-badge--lg{padding:var(--space-2) var(--space-3);font-size:var(--text-sm)}.status-badge--lg::before{width:8px;height:8px}.video-player{position:relative;background-color:#000;border-radius:var(--radius-lg);overflow:hidden}.video-player__container{position:relative;width:100%;aspect-ratio:16/9}.video-player__video{width:100%;height:100%;object-fit:contain}.video-player__overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background-color:rgba(0,0,0,.3);transition:opacity var(--transition-base)}.video-player__overlay--hidden{opacity:0;pointer-events:none}.video-player__play-button{width:80px;height:80px;display:flex;align-items:center;justify-content:center;background-color:var(--color-primary);border-radius:50%;color:#fff;transition:transform var(--transition-fast)}.video-player__play-button:hover{transform:scale(1.1)}.video-player__play-button svg{width:32px;height:32px;margin-left:4px}.video-player__controls{position:absolute;bottom:0;left:0;right:0;padding:var(--space-3) var(--space-4);background:linear-gradient(transparent, rgba(0, 0, 0, 0.8))}.video-player__timeline{position:relative;height:4px;background-color:hsla(0,0%,100%,.3);border-radius:var(--radius-full);cursor:pointer;margin-bottom:var(--space-3)}.video-player__timeline:hover{height:6px}.video-player__progress{position:absolute;top:0;left:0;height:100%;background-color:var(--color-primary);border-radius:var(--radius-full);pointer-events:none}.video-player__buffered{position:absolute;top:0;left:0;height:100%;background-color:hsla(0,0%,100%,.2);border-radius:var(--radius-full);pointer-events:none}.video-player__marker{position:absolute;top:50%;width:12px;height:12px;margin-top:-6px;margin-left:-6px;background-color:#fbbf24;border:2px solid #fff;border-radius:50%;cursor:pointer;transition:transform var(--transition-fast);z-index:10}.video-player__marker:hover{transform:scale(1.3)}.video-player__marker--active{background-color:var(--color-primary)}.video-player__actions{display:flex;align-items:center;gap:var(--space-4)}.video-player__btn{color:#fff;opacity:.9;transition:opacity var(--transition-fast)}.video-player__btn:hover{opacity:1}.video-player__btn svg{width:24px;height:24px}.video-player__time{font-size:var(--text-sm);color:#fff;font-variant-numeric:tabular-nums}.video-player__spacer{flex:1}.video-player__volume{display:flex;align-items:center;gap:var(--space-2)}.video-player__volume input[type=range]{width:80px;height:4px;background:hsla(0,0%,100%,.3);border-radius:var(--radius-full);appearance:none}.video-player__volume input[type=range]::-webkit-slider-thumb{appearance:none;width:12px;height:12px;background:#fff;border-radius:50%;cursor:pointer}.video-player--fullscreen{border-radius:0}.video-player--fullscreen .video-player__container{aspect-ratio:auto;height:100vh}.video-comment-overlay{position:absolute;top:var(--space-4);right:var(--space-4);width:320px;max-height:60%;overflow-y:auto;background-color:rgba(0,0,0,.85);border-radius:var(--radius-lg);padding:var(--space-4)}.video-comment-overlay__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-3);padding-bottom:var(--space-3);border-bottom:1px solid hsla(0,0%,100%,.1)}.video-comment-overlay__title{color:#fff;font-weight:600}.video-comment-overlay__close{color:hsla(0,0%,100%,.6)}.video-comment-overlay__close:hover{color:#fff}.comment{display:flex;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-lg);transition:background-color var(--transition-fast),box-shadow var(--transition-fast)}.comment:hover{background-color:var(--color-bg-subtle)}.comment--highlighted{background-color:var(--color-primary-light);border-left:3px solid var(--color-primary)}.comment--new{animation:comment-flash 3s ease-out}@keyframes comment-flash{0%{background-color:rgba(99,102,241,.2);box-shadow:0 0 0 2px rgba(99,102,241,.4)}50%{background-color:rgba(99,102,241,.1);box-shadow:0 0 0 1px rgba(99,102,241,.2)}100%{background-color:rgba(0,0,0,0);box-shadow:none}}.comment__avatar{flex-shrink:0;width:32px;height:32px;border-radius:50%;background-color:var(--color-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:var(--text-xs);font-weight:600}.comment__content{flex:1;min-width:0}.comment__header{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-1)}.comment__author{font-size:var(--text-sm);font-weight:600;color:var(--color-text)}.comment__timestamp{font-size:var(--text-xs);color:var(--color-primary);font-weight:500;cursor:pointer;padding:2px var(--space-2);background-color:var(--color-primary-light);border-radius:var(--radius-sm)}.comment__timestamp:hover{background-color:var(--color-primary);color:#fff}.comment__time{font-size:var(--text-xs);color:var(--color-text-subtle)}.comment__body{font-size:var(--text-sm);color:var(--color-text);line-height:1.5}.comment__actions{display:flex;gap:var(--space-2);margin-top:var(--space-2)}.comment-form{display:flex;gap:var(--space-3);padding:var(--space-4);background-color:var(--color-bg-subtle);border-radius:var(--radius-lg);border:1px solid var(--color-border)}.comment-form__avatar{flex-shrink:0;width:32px;height:32px;border-radius:50%;background-color:var(--color-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:var(--text-xs);font-weight:600}.comment-form__input-wrapper{flex:1}.comment-form__timestamp-badge{display:inline-flex;align-items:center;gap:var(--space-1);font-size:var(--text-xs);color:var(--color-primary);margin-bottom:var(--space-2)}.comment-form__timestamp-badge svg{width:12px;height:12px}.comment-form__input{width:100%;padding:var(--space-2) var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-sm);resize:none;min-height:80px}.comment-form__input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.comment-form__actions{display:flex;justify-content:flex-end;gap:var(--space-2);margin-top:var(--space-3)}.comment-list{display:flex;flex-direction:column;gap:var(--space-1)}.comment-list__empty{text-align:center;padding:var(--space-8);color:var(--color-text-muted)}.comment-list__empty svg{width:48px;height:48px;margin:0 auto var(--space-3);opacity:.5}.approval-card{background-color:var(--color-bg);border:2px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden}.approval-card--pending{border-color:var(--color-status-pending)}.approval-card--approved{border-color:var(--color-success);background-color:#f0fdf4}.approval-card--revision{border-color:var(--color-error);background-color:#fef2f2}.approval-card__header{padding:var(--space-4) var(--space-6);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-border)}.approval-card__title{font-size:var(--text-lg);font-weight:600}.approval-card__body{padding:var(--space-6)}.approval-card__message{font-size:var(--text-sm);color:var(--color-text-muted);margin-bottom:var(--space-4)}.approval-card__actions{display:flex;gap:var(--space-3)}.approval-card__footer{padding:var(--space-4) var(--space-6);background-color:var(--color-bg-subtle);border-top:1px solid var(--color-border)}.approval-card__audit{font-size:var(--text-sm);color:var(--color-text-muted);display:flex;align-items:center;gap:var(--space-2)}.approval-card__audit svg{width:16px;height:16px;color:var(--color-success)}.approval-btn{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-6);border-radius:var(--radius-xl);border:2px solid var(--color-border);background-color:var(--color-bg);cursor:pointer;transition:all var(--transition-fast);flex:1}.approval-btn:hover{border-color:var(--color-border-strong);background-color:var(--color-bg-subtle)}.approval-btn--approve:hover{border-color:var(--color-success);background-color:#f0fdf4}.approval-btn--approve .approval-btn__icon{color:var(--color-success)}.approval-btn--revision:hover{border-color:var(--color-warning);background-color:#fffbeb}.approval-btn--revision .approval-btn__icon{color:var(--color-warning)}.approval-btn__icon{width:48px;height:48px}.approval-btn__icon svg{width:100%;height:100%}.approval-btn__label{font-size:var(--text-base);font-weight:600;color:var(--color-text)}.approval-btn__hint{font-size:var(--text-sm);color:var(--color-text-muted)}.revision-form{margin-top:var(--space-4)}.revision-form__label{display:block;font-size:var(--text-sm);font-weight:500;color:var(--color-text);margin-bottom:var(--space-2)}.revision-form__textarea{width:100%;min-height:120px;padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-lg);font-size:var(--text-sm);resize:vertical}.revision-form__textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.revision-form__textarea::placeholder{color:var(--color-text-subtle)}.revision-form__actions{display:flex;justify-content:flex-end;gap:var(--space-3);margin-top:var(--space-4)}.version-picker{display:flex;align-items:center;gap:var(--space-2)}.version-picker__label{font-size:var(--text-sm);color:var(--color-text-muted)}.version-picker__list{display:flex;gap:var(--space-1)}.version-tab{padding:var(--space-2) var(--space-3);font-size:var(--text-sm);font-weight:500;color:var(--color-text-muted);background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast)}.version-tab:hover{border-color:var(--color-border-strong);color:var(--color-text)}.version-tab--active{background-color:var(--color-primary);border-color:var(--color-primary);color:#fff}.version-tab--active:hover{background-color:var(--color-primary-hover);border-color:var(--color-primary-hover);color:#fff}.version-tab--approved{position:relative}.version-tab--approved::after{content:"";position:absolute;top:-2px;right:-2px;width:8px;height:8px;background-color:var(--color-success);border-radius:50%;border:2px solid var(--color-bg)}.version-compare{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.version-compare__side{border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}.version-compare__header{padding:var(--space-3) var(--space-4);background-color:var(--color-bg-subtle);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between}.version-compare__label{font-size:var(--text-sm);font-weight:600}.version-compare__video{aspect-ratio:16/9;background-color:#000}.version-compare__video video{width:100%;height:100%;object-fit:contain}.version-history__item{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-lg);transition:background-color var(--transition-fast)}.version-history__item:hover{background-color:var(--color-bg-subtle)}.version-history__item--current{background-color:var(--color-primary-light)}.version-history__number{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background-color:var(--color-bg-muted);border-radius:50%;font-size:var(--text-sm);font-weight:600;color:var(--color-text-muted);flex-shrink:0}.version-history__content{flex:1;min-width:0}.version-history__title{font-size:var(--text-sm);font-weight:500;color:var(--color-text)}.version-history__meta{font-size:var(--text-xs);color:var(--color-text-muted);margin-top:var(--space-1)}.version-history__actions{display:flex;gap:var(--space-2)}