.assignments-container{background:var(--surface-color);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--border-color);border-top:1px solid var(--glass-border-top);border-radius:var(--radius-lg);box-shadow:var(--shadow-ambient);width:100%;max-width:80rem;height:92vh;display:flex;flex-direction:column;margin:0 auto;font-size:var(--font-size-base)}#root{padding:1.5rem}.login-screen-container{text-align:center;background:var(--surface-color);padding:var(--space-lg);border-radius:var(--radius-lg);border:1px solid var(--border-color);border-top:1px solid var(--glass-border-top);box-shadow:var(--shadow-interactive);margin:auto;max-width:400px}.login-screen-container h1{font-size:1.875rem;font-weight:700;margin-bottom:.5rem}.login-screen-container p{color:var(--text-color-secondary);margin-bottom:1.5rem}.assignments-react-header{display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-md);height:var(--header-height);border-bottom:1px solid var(--border-color);flex-shrink:0}.assignments-react-header .header-title{display:flex;align-items:center;gap:.75rem}.assignments-react-header .header-title span{font-size:1.25rem;font-weight:700}.assignments-react-header .header-actions{display:flex;align-items:center;gap:1rem}.assignments-react-header .account-info{text-align:right}.assignments-react-header .account-info .display-name{font-size:.875rem;font-weight:600}.assignments-react-header .account-info .email{font-size:.75rem;color:var(--text-color-secondary)}.view-as-dropdown-container{position:relative}.view-as-trigger{display:flex;align-items:center;gap:.5rem;font-size:.875rem;background:var(--surface-color-inset);color:var(--text-color);padding:.6rem .75rem;border-radius:8px;border:1px solid var(--border-color);transition:background-color .2s}.view-as-trigger:hover{background:var(--surface-color)}.view-as-trigger .label{color:var(--text-color-secondary)}.view-as-trigger .value{font-weight:600}.view-as-trigger svg{width:.75rem;height:.75rem}.view-as-dropdown{position:absolute;right:0;margin-top:.5rem;width:16rem;background:var(--surface-color);border:1px solid var(--border-color);border-radius:8px;box-shadow:var(--shadow-interactive);z-index:10;padding:.25rem;max-height:20rem;overflow-y:auto}.view-as-dropdown ul{list-style:none}.view-as-dropdown li button{width:100%;text-align:left;padding:.5rem 1rem;font-size:.875rem;border-radius:6px}.view-as-dropdown li button:hover{background:var(--surface-color-hover)}.view-as-dropdown .separator{margin:.25rem 0;border-top:1px solid var(--border-color)}.view-as-dropdown .class-header{padding:.5rem 1rem .25rem;font-size:.75rem;font-weight:600;color:var(--text-color-secondary);text-transform:uppercase}.view-as-dropdown .no-students{padding:.5rem 1rem;font-size:.75rem;color:var(--text-color-secondary);font-style:italic}.file-browser-main{padding:1rem 1.5rem;flex-grow:1;overflow-y:auto}.file-browser-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-wrap:wrap;gap:.5rem}.file-browser-header-actions{display:flex;align-items:center;gap:.5rem}.file-browser-header h2{font-size:1.25rem;font-weight:600}.assignments-breadcrumbs{display:flex;align-items:center;font-size:.9rem;color:var(--text-color-secondary);flex-wrap:wrap}.assignments-breadcrumbs button{background:none;border:none;color:inherit;cursor:pointer;font-size:inherit}.assignments-breadcrumbs button:hover{text-decoration:underline}.assignments-breadcrumbs .separator{margin:0 .5rem}.assignments-breadcrumbs .current{font-weight:500;color:var(--text-color)}.assignments-view-toggle{display:flex;align-items:center;gap:4px;background:var(--surface-color-inset);padding:4px;border-radius:8px}.assignments-view-toggle button{background:transparent;border:none;padding:.5rem;border-radius:6px;color:var(--text-color-secondary);cursor:pointer;display:flex}.assignments-view-toggle button.active{background:var(--primary-color);color:var(--white)}.file-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--space-md);padding-bottom:var(--space-lg)}.file-grid-item{position:relative;aspect-ratio:4 / 3;background:var(--surface-color-inset);border-radius:var(--radius-md);border:1px solid var(--border-color);transition:all .2s ease;display:flex}.file-grid-item:hover{background:var(--surface-color-hover);transform:translateY(-2px);box-shadow:var(--shadow-interactive);border-color:#ffffff1a}.file-grid-item>button,.file-grid-item>div{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:.75rem;background:none;border:none;color:inherit;font:inherit;border-radius:12px}.file-grid-item>button{cursor:pointer}.file-grid-item>div{cursor:default}.file-grid-item .item-name{font-size:.8rem;margin-top:.75rem;color:var(--text-color);word-break:break-word;line-height:1.3;max-height:2.6em;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;text-overflow:ellipsis}.file-grid-item .item-icon{width:40px;height:40px}.file-grid-item .item-icon svg{width:100%;height:100%}.file-grid-item .thumbnail{width:100%;height:100%;max-height:60%;object-fit:cover;border-radius:8px}.file-grid-item .assignment-action{position:absolute;top:.5rem;right:.5rem}.file-list{display:flex;flex-direction:column;gap:.5rem}.file-list-item{display:flex;align-items:center;gap:1rem;padding:.75rem;border-radius:8px;transition:background-color .2s}.file-list-item:hover{background:var(--surface-color-hover)}.file-list-item .item-icon{width:24px;height:24px;flex-shrink:0}.file-list-item .item-icon svg{width:100%;height:100%}.file-list-item .item-name-button{flex-grow:1;background:none;border:none;color:inherit;font:inherit;cursor:pointer;text-align:left;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-list-item .item-name-button:hover{text-decoration:underline}.file-list-item>div:last-child{flex-shrink:0}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:50}.modal-content-react{background:var(--surface-color);border:1px solid var(--border-color);border-radius:12px;box-shadow:var(--shadow-interactive);width:100%;max-width:28rem;margin:1rem}.modal-content-react form .modal-body{padding:1.5rem}.modal-content-react form h2{font-size:1.125rem;font-weight:600;margin-bottom:1rem}.modal-content-react form label{font-size:.875rem;font-weight:500;color:var(--text-color-secondary)}.modal-content-react form input[type=text]{width:100%;background:var(--surface-color-inset);border:1px solid var(--border-color);border-radius:8px;padding:.5rem .75rem;font-size:.875rem;margin-top:.25rem}.modal-content-react form input[type=text]:focus{outline:none;box-shadow:0 0 0 2px var(--primary-color)}.modal-content-react .modal-footer{background:var(--surface-color-inset);padding:.75rem 1.5rem;display:flex;justify-content:flex-end;align-items:center;gap:.75rem;border-bottom-left-radius:12px;border-bottom-right-radius:12px}.video-review-modal-container{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172acc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:50;display:flex;flex-direction:column;padding:1rem}.video-review-modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;flex-shrink:0}.video-review-modal-header h2{font-size:1.25rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:1rem}.video-review-modal-header button,.image-review-modal-header button{background:transparent;border:none;cursor:pointer;padding:.5rem;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;color:var(--text-color-secondary);transition:background-color .2s,color .2s}.video-review-modal-header button:hover,.image-review-modal-header button:hover{background-color:var(--surface-color-hover);color:var(--text-color)}.video-review-modal-header button svg,.image-review-modal-header button svg{width:24px;height:24px}.video-review-modal-grid{flex-grow:1;display:flex;gap:1.5rem;min-height:0}.video-player-container{background:#000;display:flex;align-items:center;justify-content:center;position:relative;border-radius:8px;overflow:hidden;flex-grow:1;min-width:0}.video-player-container video{width:100%;height:100%;object-fit:contain}.video-play-pause-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;background-color:#00000080;border:2px solid white;border-radius:50%;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s;z-index:10}.video-play-pause-btn svg{width:32px;height:32px}.video-player-container:hover .video-play-pause-btn,.video-play-pause-btn:not(.is-playing){opacity:1}.video-controls{position:absolute;bottom:0;left:0;right:0;padding:1rem;background:linear-gradient(to top,rgba(0,0,0,.7),transparent);display:flex;flex-direction:column}.progress-bar-container{width:100%;height:8px;background:#fff3;border-radius:4px;cursor:pointer;position:relative}.progress-bar{height:100%;background:var(--primary-color);border-radius:4px}.comment-marker-button{position:absolute;top:50%;transform:translateY(-50%);width:16px;height:16px;padding:0;background:transparent;border:none;cursor:pointer;z-index:5}.comment-marker{width:10px;height:10px;background:var(--pending-color);border-radius:50%;border:1px solid var(--surface-color-inset);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transition:transform .2s}.comment-marker-button:hover .comment-marker{transform:translate(-50%,-50%) scale(1.5)}.video-controls-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:.5rem}.video-time-display{display:flex;gap:.5rem;font-size:.8rem;color:var(--white)}.video-quality-selector{position:relative;font-size:.8rem;color:#ccc;cursor:help;background-color:#0000004d;padding:.2rem .5rem;border-radius:4px}.video-quality-selector .quality-tooltip{display:none;position:absolute;bottom:100%;right:0;background:#000c;color:#fff;padding:.5rem;border-radius:4px;font-size:.75rem;white-space:nowrap;margin-bottom:5px;pointer-events:none}.video-quality-selector:hover .quality-tooltip{display:block}.image-review-modal-container{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172acc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:50;display:flex;flex-direction:column;padding:1rem 2rem 2rem}.image-review-modal-container main{flex-direction:column}.image-review-modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;flex-shrink:0}.image-review-modal-header h2{color:var(--text-color);font-size:1.25rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:1rem}.image-review-modal-body{padding:1rem;display:flex;align-items:center;justify-content:center;flex-grow:1;min-height:0;overflow:hidden}.image-review-modal-body img{max-width:100%;max-height:100%;object-fit:contain;border-radius:8px;will-change:transform}.image-zoom-controls{flex-shrink:0;display:flex;align-items:center;justify-content:center;gap:.75rem;padding:1rem 0 0;margin-top:auto}.image-zoom-controls .btn-icon{background:var(--surface-color);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--border-color);border-radius:50%;width:40px;height:40px}.image-zoom-controls .btn-icon:hover{background:var(--surface-color-hover)}.image-zoom-controls .btn-icon svg{width:20px;height:20px}.zoom-display{font-size:.9rem;font-weight:500;color:var(--text-color);background:var(--surface-color-inset);padding:.5rem 1rem;border-radius:8px;min-width:70px;text-align:center}.comments-pane{background:var(--surface-color);display:flex;flex-direction:column;overflow:hidden;border-radius:12px;border:1px solid var(--border-color);flex-shrink:0;width:320px}.comments-pane h3{font-size:1.125rem;font-weight:600;padding:1rem;border-bottom:1px solid var(--border-color)}.comments-list{flex-grow:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:1rem}.comment-item-header{display:flex;justify-content:space-between;align-items:center;font-size:.8rem}.comment-item-author{font-weight:600;color:var(--text-color)}.comment-item-timestamp{background:none;border:none;color:var(--accent-color-text);cursor:pointer;font-family:monospace}.comment-item-timestamp:hover{text-decoration:underline}.comment-item-text{font-size:.9rem;color:var(--text-color-secondary);white-space:pre-wrap;word-break:break-word;margin-top:.25rem}.comment-form{padding:1rem;border-top:1px solid var(--border-color)}.comment-form textarea{width:100%;background:var(--surface-color-inset);border:1px solid var(--border-color);border-radius:8px;padding:.5rem .75rem;font-size:.9rem;margin-bottom:.5rem}.comment-form textarea:focus{outline:none;box-shadow:0 0 0 2px var(--primary-color)}.btn-primary{background-color:var(--primary-color);color:#fff;padding:.5rem 1rem;border-radius:8px;font-weight:600;font-size:.875rem;border:none;cursor:pointer;transition:background-color .2s}.btn-primary:hover{background-color:#0044a8}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background-color:var(--surface-color-hover);color:var(--text-color);padding:.5rem 1rem;border-radius:8px;font-weight:600;font-size:.875rem;border:1px solid var(--border-color);cursor:pointer;transition:background-color .2s}.btn-secondary:hover{background-color:#475569}.spreadsheet-table{border-collapse:separate;border-spacing:0;table-layout:fixed;width:max-content}.spreadsheet-table th,.spreadsheet-table td{padding:0 8px!important;border-bottom:1px solid var(--border-color);border-right:1px solid var(--border-color);height:37px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box;vertical-align:middle}.spreadsheet-table th{background:var(--surface-color);font-weight:600;text-align:left;position:sticky;top:0;z-index:20;-webkit-user-select:none;user-select:none;padding:0!important}.spreadsheet-table th .header-content{display:flex;align-items:center;justify-content:space-between;width:100%;height:100%;padding:0 8px;box-sizing:border-box}.spreadsheet-table .resizer{position:absolute;right:-6px;top:0;height:100%;width:12px;background:transparent;cursor:col-resize;-webkit-user-select:none;user-select:none;touch-action:none;z-index:50}.spreadsheet-table .resizer:after{content:"";position:absolute;right:5px;top:0;bottom:0;width:2px;background:transparent;transition:background .15s}.spreadsheet-table .resizer:hover:after,.spreadsheet-table .resizer.isResizing:after{background:var(--primary-color, #3b82f6);width:3px}.spreadsheet-table .sticky-col{position:sticky;z-index:10;background:var(--surface-color)}.spreadsheet-table .sticky-col.selected{background:var(--primary-color);color:#fff}.spreadsheet-table th:first-child,.spreadsheet-table td:first-child{left:0;z-index:30}.spreadsheet-table td:first-child{z-index:11}.spreadsheet-selection-checkbox{cursor:pointer}.spreadsheet-table th input[type=checkbox]{display:block;margin:0 auto}.dropdown-menu-container{position:relative!important;display:inline-block!important;overflow:visible!important}.dropdown-menu{position:absolute!important;top:100%!important;right:0!important;z-index:9999!important;background:var(--surface-color);border:1px solid var(--border-color);box-shadow:0 10px 40px #00000080;min-width:250px}.spreadsheet-table th[data-col-id=name],.spreadsheet-table td[data-col-id=name]{padding-left:0!important}.spreadsheet-table th:first-child{background:var(--surface-color)!important}.spreadsheet-table tr[data-depth="1"]{background-color:#ffffff04!important;font-style:italic;color:var(--text-color-secondary)!important}.spreadsheet-table tr[data-depth="1"] td{border-bottom:1px dashed var(--border-color)!important}.spreadsheet-table tr[data-depth="1"] td[data-col-id=name] div:before{content:"↪ Component: ";font-size:.8rem;font-weight:400;opacity:.6;margin-right:.25rem}@keyframes shake{0%{transform:translate(1px,1px) rotate(0)}10%{transform:translate(-1px,-2px) rotate(-1deg)}20%{transform:translate(-3px) rotate(1deg)}30%{transform:translate(3px,2px) rotate(0)}40%{transform:translate(1px,-1px) rotate(1deg)}50%{transform:translate(-1px,2px) rotate(-1deg)}60%{transform:translate(-3px,1px) rotate(0)}70%{transform:translate(3px,1px) rotate(-1deg)}80%{transform:translate(-1px,-1px) rotate(1deg)}90%{transform:translate(1px,2px) rotate(0)}to{transform:translate(1px,-2px) rotate(-1deg)}}.toggle-switch{position:relative;display:inline-block;width:40px;height:24px;margin:10px}.toggle-switch .toggle-input{display:none}.toggle-switch .toggle-label{position:absolute;top:0;left:0;width:40px;height:24px;background-color:var(--primary-color);border-radius:34px;cursor:pointer;transition:background-color .3s}.toggle-switch .toggle-label:before{content:"";position:absolute;width:20px;height:20px;border-radius:50%;top:2px;left:2px;background-color:#fff;box-shadow:0 2px 5px #0000004d;transition:transform .3s}.toggle-switch .toggle-input:checked+.toggle-label{background-color:#4caf50}.toggle-switch .toggle-input:checked+.toggle-label:before{transform:translate(16px)}.toggle-switch.light .toggle-label{background-color:#bebebe}.toggle-switch.light .toggle-input:checked+.toggle-label{background-color:#9b9b9b}.toggle-switch.light .toggle-input:checked+.toggle-label:before{transform:translate(16px)}.toggle-switch.dark .toggle-label{background-color:#4b4b4b}.toggle-switch.dark .toggle-input:checked+.toggle-label{background-color:#717171}.toggle-switch.dark .toggle-input:checked+.toggle-label:before{transform:translate(16px)}.shaking{animation:shake .5s linear infinite!important;cursor:grab!important;border:2px dashed var(--primary-color)!important;transform-origin:center!important;box-sizing:border-box}.shaking:active{cursor:grabbing}.inventory-item.dragging{opacity:.5;background:var(--surface-color-hover)}.inventory-item.drag-over{border-top:2px solid var(--primary-color)}