body {margin:0;padding:0;overflow:hidden;height:100vh}html {overflow:hidden}.lesson-viewer {display:grid;grid-template-columns:380px 1fr;grid-template-rows:70px 1fr;height:100vh;width:100vw;overflow:hidden;position:fixed;top:0;left:0}header.content-header {position:static !important;left:auto !important;top:auto !important;transform:none !important}.content-header {grid-column:2;grid-row:1;width:auto;padding:16px 32px;background:rgba(31, 35, 66, 0.95);border-bottom:1px solid rgba(117, 106, 246, 0.2);display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:100;backdrop-filter:blur(10px)}.lesson-title-section {flex:1;min-width:0}.current-lesson-title {font-size:20px;font-weight:700;color:#fff;margin:0;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.current-chapter-name {font-size:12px;color:#8A96B3;text-transform:uppercase;letter-spacing:0.5px;margin-top:2px}.header-actions {display:flex;align-items:center;gap:12px;flex-shrink:0}.toggle-btn {display:flex;align-items:center;gap:8px;padding:10px 16px;background:rgba(117, 106, 246, 0.1);border:1px solid rgba(117, 106, 246, 0.2);border-radius:8px;color:#C2CEED;cursor:pointer;transition:all 0.3s ease;font-size:14px;font-weight:500}.toggle-btn:hover {background:rgba(117, 106, 246, 0.2);border-color:rgba(117, 106, 246, 0.4)}.toggle-btn.active {background:rgba(117, 106, 246, 0.25);border-color:#756AF6}.toggle-icon {width:16px;height:16px;flex-shrink:0}.toggle-label {color:#C2CEED;font-weight:600}.toggle-status {padding:2px 8px;border-radius:4px;font-size:11px;font-weight:700;text-transform:uppercase}.toggle-btn.active .toggle-status {background:rgba(46, 213, 115, 0.2);color:#2ed573}.toggle-btn:not(.active) .toggle-status {background:rgba(255, 107, 107, 0.2);color:#ff6b6b}.download-files-btn {display:flex;align-items:center;gap:8px;padding:10px 16px;background:rgba(46, 213, 115, 0.15);border:1px solid rgba(46, 213, 115, 0.3);border-radius:8px;color:#2ed573;cursor:pointer;transition:all 0.3s ease;font-size:14px;font-weight:600}.download-files-btn:hover {background:rgba(46, 213, 115, 0.25);border-color:rgba(46, 213, 115, 0.5);transform:translateY(-1px)}.download-files-btn:active {transform:translateY(0)}.download-icon {width:16px;height:16px;flex-shrink:0}.show-notes-btn {display:flex;align-items:center;gap:8px;padding:10px 16px;background:rgba(117, 106, 246, 0.15);border:1px solid rgba(117, 106, 246, 0.3);border-radius:8px;color:#756AF6;cursor:pointer;transition:all 0.3s ease;font-size:14px;font-weight:600}.show-notes-btn:hover {background:rgba(117, 106, 246, 0.25);border-color:rgba(117, 106, 246, 0.5);transform:translateY(-1px)}.show-notes-btn:active {transform:translateY(0)}.show-notes-btn .notes-icon {width:16px;height:16px;flex-shrink:0}.read-lesson-btn {display:flex;align-items:center;gap:8px;padding:10px 16px;background:rgba(117, 106, 246, 0.15);border:1px solid rgba(117, 106, 246, 0.3);border-radius:8px;color:#756AF6;cursor:pointer;transition:all 0.3s ease;font-size:14px;font-weight:600}.read-lesson-btn:hover {background:rgba(117, 106, 246, 0.25);border-color:rgba(117, 106, 246, 0.5);transform:translateY(-1px)}.read-lesson-btn:active {transform:translateY(0)}.read-lesson-btn .read-icon {width:16px;height:16px;flex-shrink:0}.get-video-access-btn {display:flex;align-items:center;gap:8px;padding:10px 16px;background:linear-gradient(135deg, #756AF6 0%, #9B8AFB 100%);border:none;border-radius:8px;color:#fff;cursor:pointer;transition:all 0.3s ease;font-size:14px;font-weight:600}.get-video-access-btn:hover {transform:translateY(-1px);box-shadow:0 4px 15px rgba(117, 106, 246, 0.4)}.get-video-access-btn:active {transform:translateY(0)}.get-video-access-btn .play-icon {width:16px;height:16px;flex-shrink:0}.upgrade-modal-overlay {position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(13, 17, 48, 0.9);backdrop-filter:blur(8px);z-index:10000;display:flex;align-items:center;justify-content:center;padding:20px}.upgrade-modal {background:linear-gradient(135deg, #1A1F4A 0%, #0D1130 100%);border:1px solid rgba(117, 106, 246, 0.3);border-radius:20px;width:100%;max-width:480px;padding:40px;text-align:center;position:relative;box-shadow:0 20px 60px rgba(0, 0, 0, 0.5)}.close-upgrade-btn {position:absolute;top:16px;right:16px;background:rgba(255, 255, 255, 0.1);border:none;border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.3s ease;color:#C2CEED}.close-upgrade-btn:hover {background:rgba(255, 255, 255, 0.2);color:#fff}.close-upgrade-btn svg {width:18px;height:18px}.upgrade-icon {margin-bottom:24px}.upgrade-icon svg {width:64px;height:64px}.upgrade-title {font-size:24px;font-weight:700;color:#fff;margin-bottom:12px}.upgrade-message {font-size:16px;color:#B4B9D1;line-height:1.6;margin-bottom:24px}.upgrade-benefits {list-style:none;padding:0;margin:0 0 32px 0;text-align:left}.upgrade-benefits li {display:flex;align-items:center;gap:12px;padding:10px 0;color:#C2CEED;font-size:15px;border-bottom:1px solid rgba(117, 106, 246, 0.1)}.upgrade-benefits li:last-child {border-bottom:none}.upgrade-benefits li svg {width:16px;height:16px;flex-shrink:0}.upgrade-actions {display:flex;justify-content:center}.upgrade-pro-btn {display:inline-flex;align-items:center;gap:10px;padding:14px 32px;background:linear-gradient(135deg, #756AF6 0%, #9B8AFB 100%);border:none;border-radius:10px;color:#fff;font-size:16px;font-weight:600;text-decoration:none;cursor:pointer;transition:all 0.3s ease}.upgrade-pro-btn:hover {transform:translateY(-2px);box-shadow:0 8px 25px rgba(117, 106, 246, 0.4)}.upgrade-pro-btn svg {width:20px;height:20px}@media (max-width:480px) {.upgrade-modal {padding:28px 24px}.upgrade-title {font-size:20px}.upgrade-message {font-size:15px}}.sidebar-navigation {position:sticky;bottom:0;display:flex;flex-wrap:wrap;gap:12px;padding:16px 24px;background:rgba(31, 35, 66, 0.95);border-top:1px solid rgba(117, 106, 246, 0.2);backdrop-filter:blur(10px);z-index:10;margin-top:auto}.nav-arrow-btn {flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;background:rgba(117, 106, 246, 0.1);border:1px solid rgba(117, 106, 246, 0.2);border-radius:8px;color:#C2CEED;cursor:pointer;transition:all 0.3s ease;font-size:14px;font-weight:600}.nav-arrow-btn:hover:not(:disabled) {background:rgba(117, 106, 246, 0.2);border-color:rgba(117, 106, 246, 0.4);transform:translateY(-2px)}.nav-arrow-btn:disabled {opacity:0.3;cursor:not-allowed}.nav-arrow-btn svg {width:18px;height:18px;flex-shrink:0}.nav-arrow-btn span {color:#C2CEED}.mark-complete-btn {width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;background:linear-gradient(135deg, rgba(46, 213, 115, 0.15) 0%, rgba(46, 213, 115, 0.1) 100%);border:1px solid rgba(46, 213, 115, 0.3);border-radius:8px;color:#2ed573;cursor:pointer;transition:all 0.3s ease;font-size:14px;font-weight:600}.mark-complete-btn:hover:not(:disabled) {background:linear-gradient(135deg, rgba(46, 213, 115, 0.25) 0%, rgba(46, 213, 115, 0.15) 100%);border-color:rgba(46, 213, 115, 0.5);transform:translateY(-2px)}.mark-complete-btn:disabled {opacity:0.5;cursor:not-allowed}.mark-complete-btn svg {width:18px;height:18px;flex-shrink:0}.mark-complete-btn span {color:#2ed573}.certificate-btn {width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;background:linear-gradient(135deg, rgba(117, 106, 246, 0.2) 0%, rgba(204, 125, 218, 0.15) 100%);border:1px solid rgba(117, 106, 246, 0.4);border-radius:8px;color:#756AF6;cursor:pointer;transition:all 0.3s ease;font-size:14px;font-weight:600;text-decoration:none}.certificate-btn:hover {background:linear-gradient(135deg, rgba(117, 106, 246, 0.3) 0%, rgba(204, 125, 218, 0.2) 100%);border-color:rgba(117, 106, 246, 0.6);transform:translateY(-2px);box-shadow:0 8px 24px rgba(117, 106, 246, 0.3);color:#9b91ff}.certificate-btn svg {width:18px;height:18px;flex-shrink:0}.certificate-btn span {color:inherit}.curriculum-sidebar {grid-column:1;grid-row:1 / 3;background:rgba(13, 17, 48, 0.95);border-right:1px solid rgba(117, 106, 246, 0.2);display:flex;flex-direction:column;overflow-y:hidden}.lesson-content {grid-column:2;grid-row:2;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;background:linear-gradient(135deg, #0D1130 0%, #1A1F4A 100%);position:relative}.video-section {width:100%;flex:1;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, #0D1130 0%, #1A1F4A 100%);position:relative;min-height:0}.written-content-section {width:100%;flex:1;display:flex;flex-direction:column;background:linear-gradient(135deg, #0D1130 0%, #1A1F4A 100%);position:relative;overflow-y:auto}.written-content-wrapper {position:relative;flex-shrink:0}.written-content-container {max-width:1090px;width:100%;margin:0 auto;padding:40px 32px 80px}.written-content-section .written-content-article, .written-content-section .written-content-article p, .written-content-section .written-content-article li, .written-content-section .written-content-article td, .written-content-modal-body .written-content-article, .written-content-modal-body .written-content-article p, .written-content-modal-body .written-content-article li, .written-content-modal-body .written-content-article td {color:#F1F1F1;font-weight:450;line-height:1.8}.written-content-section .written-content-article h2, .written-content-section .written-content-article h3, .written-content-section .written-content-article h4, .written-content-modal-body .written-content-article h2, .written-content-modal-body .written-content-article h3, .written-content-modal-body .written-content-article h4 {color:#FFFFFF;font-weight:600}.written-content-section .written-content-article h2, .written-content-modal-body .written-content-article h2 {font-size:30px;padding-top:5px;line-height:1.4;margin-bottom:16px}.written-content-section .written-content-article h3, .written-content-modal-body .written-content-article h3 {padding-top:30px;font-size:24px;line-height:1.4;margin-bottom:12px}.written-content-section .written-content-article p, .written-content-modal-body .written-content-article p {padding-bottom:5px;padding-top:5px;font-size:17px;line-height:1.8}.written-content-section .written-content-article strong, .written-content-section .written-content-article b, .written-content-modal-body .written-content-article strong, .written-content-modal-body .written-content-article b {color:#FFFFFF;font-weight:600}.written-content-section .written-content-article em, .written-content-section .written-content-article i, .written-content-modal-body .written-content-article em, .written-content-modal-body .written-content-article i {color:#F8F8F8;font-style:italic}.written-content-section .written-content-article a, .written-content-modal-body .written-content-article a {font-size:18px;text-decoration:underline;color:#88A4FF;font-weight:500;transition:color 0.2s ease}.written-content-section .written-content-article a:hover, .written-content-modal-body .written-content-article a:hover {color:#FFFFFF}.written-content-section .written-content-article img, .written-content-modal-body .written-content-article img {padding:20px;max-width:100%;height:auto}.written-content-section .written-content-article p:has(> img), .written-content-modal-body .written-content-article p:has(> img) {justify-items:center;display:grid}.written-content-section .written-content-article pre, .written-content-modal-body .written-content-article pre {position:relative;border-radius:20px}.written-content-section .written-content-article pre code, .written-content-modal-body .written-content-article pre code {z-index:9000;position:relative;font-size:16px;border-radius:20px;padding:1.5em;display:block;background:#1a1733;color:#F1F1F1;overflow-x:auto}.written-content-section .written-content-article code:not(pre code), .written-content-modal-body .written-content-article code:not(pre code) {background:rgba(117, 106, 246, 0.2);color:#FFFFFF;padding:4px 8px;border-radius:6px;font-size:0.9em;font-weight:500;font-family:'Consolas', 'Monaco', 'Courier New', monospace;border:1px solid rgba(117, 106, 246, 0.3)}.written-content-section .written-content-article blockquote, .written-content-modal-body .written-content-article blockquote {font-size:1.4em;width:60%;margin:50px auto;font-family:Open Sans;font-style:italic;color:#F1F1F1;font-weight:500;padding:1.2em 30px 1.2em 75px;border-left:8px solid #ce84ca;line-height:1.7;position:relative;background:#221F41;border-radius:20px}.written-content-section .written-content-article blockquote::before, .written-content-modal-body .written-content-article blockquote::before {font-family:Arial;content:"\201C";color:#ce84ca;font-size:4em;position:absolute;left:10px;top:-10px}.written-content-section .written-content-article ul, .written-content-modal-body .written-content-article ul {list-style-type:none;padding-left:1.5em;margin:1em 0;color:#F1F1F1}.written-content-section .written-content-article ul li, .written-content-modal-body .written-content-article ul li {position:relative;padding:0.5em 0;line-height:1.8;margin-bottom:0.5em;font-weight:450}.written-content-section .written-content-article ul li:before, .written-content-modal-body .written-content-article ul li:before {content:"";position:absolute;left:-1.5em;top:0.8em;width:8px;height:8px;border-radius:50%;background:linear-gradient(87.03deg, #756AF6 16.38%, #CC7DDA 62.94%, #F6BE85 97.64%)}.written-content-section .written-content-article ol, .written-content-modal-body .written-content-article ol {counter-reset:item;padding-left:1.5em;margin:1em 0;color:#F1F1F1}.written-content-section .written-content-article ol li, .written-content-modal-body .written-content-article ol li {position:relative;padding:0.5em 0 0.5em 0.5em;line-height:1.8;margin-bottom:0.5em;counter-increment:item;list-style-type:none;font-weight:450}.written-content-section .written-content-article ol li:before, .written-content-modal-body .written-content-article ol li:before {content:counter(item) ".";position:absolute;left:-1.5em;top:0.5em;line-height:1.6;font-weight:600;color:#fff;background:linear-gradient(87.03deg, #756AF6 16.38%, #CC7DDA 62.94%, #F6BE85 97.64%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.written-content-section .written-content-article table, .written-content-modal-body .written-content-article table {width:100%;margin:2rem 0;border-collapse:separate;border-spacing:0;border-radius:8px;overflow:hidden;background:#221F41;box-shadow:0 4px 6px rgba(0, 0, 0, 0.1)}.written-content-section .written-content-article table th, .written-content-modal-body .written-content-article table th {background:#2A2750;color:white;font-weight:600;text-align:left;padding:1rem;border-bottom:2px solid #756AF6}.written-content-section .written-content-article table td, .written-content-modal-body .written-content-article table td {padding:1rem;border-bottom:1px solid rgba(194, 206, 237, 0.15);color:#F1F1F1;font-weight:450;transition:background-color 0.2s ease}.written-content-section .written-content-article table tr:last-child td, .written-content-modal-body .written-content-article table tr:last-child td {border-bottom:none}.written-content-section .written-content-article table tr:hover td, .written-content-modal-body .written-content-article table tr:hover td {background-color:rgba(117, 106, 246, 0.1)}.written-content-fade {display:none;position:absolute;bottom:0;left:0;right:0;height:250px;background:linear-gradient(to bottom, transparent 0%, rgba(13, 17, 48, 0.5) 30%, rgba(13, 17, 48, 0.85) 60%, #0D1130 100%);pointer-events:none;z-index:5}.written-content-section.content-limited .written-content-wrapper {max-height:45vh;overflow:hidden}.written-content-section.content-limited .written-content-fade {display:block}.written-content-section.content-limited-half .written-content-wrapper {position:relative}.written-content-section.content-limited-half .written-content-article {max-height:60vh;overflow:hidden}.written-content-section.content-limited-half .written-content-fade {display:block}.video-access-banner {margin-bottom:32px;padding:24px 28px;background:linear-gradient(135deg, rgba(117, 106, 246, 0.18) 0%, rgba(204, 125, 218, 0.12) 50%, rgba(246, 190, 133, 0.08) 100%);border:2px solid rgba(117, 106, 246, 0.4);border-radius:16px;box-shadow:0 8px 32px rgba(117, 106, 246, 0.2), 0 0 0 1px rgba(117, 106, 246, 0.1) inset}.video-access-banner-content {display:flex;align-items:center;gap:20px}.video-access-icon {flex-shrink:0;width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, #756AF6 0%, #CC7DDA 100%);border-radius:14px;box-shadow:0 4px 16px rgba(117, 106, 246, 0.4)}.video-access-icon svg {width:26px;height:26px;stroke:#fff;fill:rgba(255, 255, 255, 0.1)}.video-access-text {flex:1}.video-access-message {margin:0 0 8px;font-size:17px;color:#fff;font-weight:600;line-height:1.5}.video-access-message strong {color:#fff;background:linear-gradient(90deg, #756AF6, #CC7DDA);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.video-access-cta {margin:0;font-size:15px;color:#C2CEED;line-height:1.5}.video-access-cta a {display:inline-flex;align-items:center;gap:4px;color:#fff;font-weight:700;text-decoration:none;padding:2px 0;background:linear-gradient(90deg, #756AF6, #CC7DDA);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;border-bottom:2px solid #756AF6;transition:all 0.2s ease}.video-access-cta a:hover {border-bottom-color:#CC7DDA}@media (max-width:480px) {.video-access-banner {padding:20px}.video-access-banner-content {flex-direction:column;align-items:flex-start;gap:16px}.video-access-icon {width:48px;height:48px}.video-access-icon svg {width:22px;height:22px}.video-access-message {font-size:16px}}.video-thumbnail-overlay {margin-bottom:32px;border-radius:16px;overflow:hidden;position:relative}.video-thumbnail-container {position:relative;width:100%;padding-bottom:56.25%;background:linear-gradient(135deg, #1A1F4A 0%, #0D1130 100%)}.video-thumbnail-image {position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.video-thumbnail-blur {position:absolute;top:0;left:0;width:100%;height:100%;backdrop-filter:blur(8px);background:rgba(13, 17, 48, 0.6)}.video-thumbnail-content {position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px}.video-thumbnail-padlock {width:80px;height:80px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, rgba(117, 106, 246, 0.25) 0%, rgba(204, 125, 218, 0.15) 100%);border:3px solid rgba(117, 106, 246, 0.5);border-radius:50%;margin-bottom:20px;box-shadow:0 8px 32px rgba(117, 106, 246, 0.3)}.video-thumbnail-padlock svg {width:36px;height:36px;stroke:#fff;stroke-width:2;filter:drop-shadow(0 2px 4px rgba(0, 0, 0, 0.5))}.video-thumbnail-message {margin:0 0 12px;font-size:18px;color:#fff;font-weight:600;line-height:1.5;max-width:480px;text-shadow:0 2px 8px rgba(0, 0, 0, 0.7), 0 1px 3px rgba(0, 0, 0, 0.5)}.video-thumbnail-cta {margin:0;font-size:15px;color:#fff;line-height:1.5;text-shadow:0 2px 8px rgba(0, 0, 0, 0.7), 0 1px 3px rgba(0, 0, 0, 0.5)}.video-thumbnail-cta a {display:inline-flex;align-items:center;gap:4px;color:#CC7DDA;font-weight:700;text-decoration:none;padding:2px 0;border-bottom:2px solid #756AF6;transition:all 0.2s ease}.video-thumbnail-cta a:hover {color:#d9a0e8;border-bottom-color:#CC7DDA}@media (max-width:768px) {.video-thumbnail-padlock {width:64px;height:64px}.video-thumbnail-padlock svg {width:28px;height:28px}.video-thumbnail-message {font-size:16px}.video-thumbnail-cta {font-size:14px}}@media (max-width:480px) {.video-thumbnail-overlay {margin-bottom:24px}.video-thumbnail-content {padding:16px}.video-thumbnail-padlock {width:56px;height:56px;margin-bottom:16px}.video-thumbnail-padlock svg {width:24px;height:24px}.video-thumbnail-message {font-size:15px}.video-thumbnail-cta {font-size:13px}}.written-content-cta {display:none;position:relative;z-index:10;text-align:center;padding:24px 24px 40px;flex-shrink:0}.cta-anonymous, .cta-anonymous-pro, .cta-authenticated {max-width:600px;margin:0 auto;padding:28px 36px;background:rgba(31, 35, 66, 0.95);border:1px solid rgba(117, 106, 246, 0.3);border-radius:20px;backdrop-filter:blur(10px);box-shadow:0 20px 60px rgba(0, 0, 0, 0.4)}.written-content-cta h3 {font-size:24px;color:#fff;margin-bottom:8px;font-weight:700;background:linear-gradient(135deg, #fff 0%, #C2CEED 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.written-content-cta p {color:#B4B9D1;margin-bottom:0;font-size:15px;line-height:1.5;padding:0}.cta-buttons {display:flex;gap:16px;justify-content:center;flex-wrap:wrap}.cta-btn {display:inline-flex;align-items:center;gap:10px;padding:16px 32px;border-radius:60px;font-size:16px;font-weight:700;text-decoration:none;transition:all 0.3s ease;border:none;cursor:pointer}.cta-btn-primary {background:linear-gradient(87.03deg, #756AF6 16.38%, #CC7DDA 62.94%, #F6BE85 97.64%);color:#fff;box-shadow:0 4px 20px rgba(117, 106, 246, 0.4)}.cta-btn-primary:hover {transform:translateY(-2px);box-shadow:0 8px 30px rgba(117, 106, 246, 0.5)}.cta-btn-secondary {background:rgba(117, 106, 246, 0.15);color:#E8EEFF;border:2px solid rgba(117, 106, 246, 0.4)}.cta-btn-secondary:hover {background:rgba(117, 106, 246, 0.25);border-color:rgba(117, 106, 246, 0.6);transform:translateY(-2px)}.cta-btn svg {flex-shrink:0}.cta-anonymous::before, .cta-authenticated::before {content:"";display:block;width:64px;height:64px;margin:0 auto 24px;background:linear-gradient(135deg, rgba(117, 106, 246, 0.2), rgba(204, 125, 218, 0.2));border-radius:50%;border:2px solid rgba(117, 106, 246, 0.3)}.cta-anonymous::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='%23756AF6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'%3E%3C/path%3E%3Ccircle cx='8.5' cy='7' r='4'%3E%3C/circle%3E%3Cline x1='20' y1='8' x2='20' y2='14'%3E%3C/line%3E%3Cline x1='23' y1='11' x2='17' y2='11'%3E%3C/line%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:28px}.cta-authenticated::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='%23756AF6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2'%3E%3C/polygon%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:28px}.cta-anonymous-pro::before {content:"";display:block;width:64px;height:64px;margin:0 auto 24px;background:linear-gradient(135deg, rgba(117, 106, 246, 0.2), rgba(204, 125, 218, 0.2));border-radius:50%;border:2px solid rgba(117, 106, 246, 0.3);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='%23756AF6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2'%3E%3C/polygon%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:28px}.cta-anonymous-pro .cta-buttons {margin-top:24px}.cta-anonymous-pro .cta-signin-section {margin-top:24px}.cta-signup-form {display:flex;flex-direction:column;gap:10px;margin:16px 0 12px}.cta-form-row {display:flex;gap:12px}.cta-form-row .cta-signup-input {flex:1;min-width:0}.cta-signup-input {padding:12px 16px;background:rgba(255, 255, 255, 0.08);border:1px solid rgba(117, 106, 246, 0.3);border-radius:8px;color:#fff;font-size:15px;transition:all 0.3s ease}.cta-signup-input::placeholder {color:rgba(255, 255, 255, 0.5)}.cta-signup-input:focus {outline:none;background:rgba(255, 255, 255, 0.12);border-color:rgba(117, 106, 246, 0.6);box-shadow:0 0 0 3px rgba(117, 106, 246, 0.15)}.cta-signup-input.cta-input-error {border-color:#ff6b6b;background:rgba(255, 107, 107, 0.1)}.cta-field-error {color:#ff6b6b;font-size:13px;margin-top:4px;text-align:left}.cta-signup-btn {width:100%;margin-top:4px}.cta-disclaimer {font-size:13px !important;color:rgba(255, 255, 255, 0.5);line-height:1.5;margin:0;padding:0 !important}.cta-signin-section {margin-top:16px;padding-top:16px;border-top:1px solid rgba(117, 106, 246, 0.2);display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}.cta-signin-text {font-size:14px;color:rgba(255, 255, 255, 0.6);margin:0;padding:0 !important}.cta-signin-btn {padding:8px 20px;font-size:14px}.cta-pro-upsell {margin-top:12px;padding-top:12px;border-top:1px solid rgba(117, 106, 246, 0.15)}.cta-pro-upsell p {font-size:14px !important;color:rgba(255, 255, 255, 0.6);margin:0;padding:0 !important}.cta-pro-upsell a {color:#88A4FF;text-decoration:none;font-weight:600}.cta-pro-upsell a:hover {text-decoration:underline}@media (max-width:480px) {.cta-form-row {flex-direction:column}.cta-signup-input {font-size:16px}}.video-section.fullscreen-mode {position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:9999;align-items:center;justify-content:center;background:#000}.video-section.fullscreen-mode .video-wrapper {width:100%;height:100%;display:flex;align-items:center;justify-content:center}.video-section.fullscreen-mode .video-container {width:100%;height:100%;max-width:100%;aspect-ratio:unset;display:flex;align-items:center;justify-content:center}.video-section.fullscreen-mode mux-player {width:100%;height:100%;max-height:100vh}.video-wrapper {width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:relative;background:rgba(31, 35, 66, 0.95)}.video-container {position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:rgba(31, 35, 66, 0.95)}.video-container mux-player {max-width:100%;max-height:100%;width:auto;height:auto;aspect-ratio:16 / 9}@media (min-aspect-ratio:16/9) {.video-container mux-player {height:100%;width:auto;background:transparent !important;--media-background-color:transparent}}@media (max-aspect-ratio:16/9) {.video-container mux-player {width:100%;height:auto}}.auth-overlay {position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;min-height:100%;background:linear-gradient(135deg, #0D1130 0%, #1A1F4A 100%);display:flex;align-items:center;justify-content:center;padding:40px 20px;box-sizing:border-box;z-index:100;overflow-y:auto}.auth-overlay-content {max-width:480px;width:100%;background:rgba(31, 35, 66, 0.95);border-radius:20px;padding:40px;box-shadow:0 20px 60px rgba(0, 0, 0, 0.4);border:1px solid rgba(117, 106, 246, 0.3);box-sizing:border-box;margin:auto;flex-shrink:0}.auth-overlay-title {font-size:28px;font-weight:700;color:#fff;margin:0 0 32px 0;text-align:center;line-height:1.3}.auth-section {margin-bottom:24px;width:100%}.auth-section:last-of-type {margin-bottom:0}.auth-section-label {font-size:14px;font-weight:600;color:#C2CEED;margin:0 0 12px 0;text-align:center;display:block}.auth-signin-btn, .auth-signup-btn {width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:14px 24px;background:linear-gradient(87.03deg, #756AF6 16.38%, #CC7DDA 62.94%, #F6BE85 97.64%);border:none;border-radius:10px;color:#fff;font-size:16px;font-weight:600;text-decoration:none;cursor:pointer;transition:all 0.3s ease;box-sizing:border-box;font-family:'Montserrat', sans-serif}.auth-signin-btn:hover, .auth-signup-btn:hover {opacity:0.9;transform:translateY(-2px);color:#fff}.auth-signin-btn svg, .auth-signup-btn svg {flex-shrink:0}.auth-divider {display:flex;align-items:center;text-align:center;margin:24px 0;width:100%}.auth-divider::before, .auth-divider::after {content:'';flex:1;border-bottom:1px solid rgba(117, 106, 246, 0.2)}.auth-divider span {padding:0 16px;color:#8E94B8;font-size:14px;font-weight:500}.auth-signup-form {display:flex;flex-direction:column;gap:12px;width:100%}.auth-form-row {display:flex;gap:12px;width:100%}.auth-form-group {flex:1;min-width:0}.auth-form-group input {width:100%;background:rgba(255, 255, 255, 0.05);border:1px solid rgba(117, 106, 246, 0.3);border-radius:10px;color:#fff;padding:0 16px;height:48px;font-size:15px;box-sizing:border-box;font-family:'Montserrat', sans-serif}.auth-form-group input:focus {outline:none;border:1px solid rgba(117, 106, 246, 0.6);box-shadow:0 0 0 2px rgba(117, 106, 246, 0.1)}.auth-form-group input::placeholder {color:#8E94B8}@media (max-width:1024px) {.auth-overlay {padding:16px}}@media (max-width:768px) {.auth-overlay {position:fixed;width:100vw;height:100vh;left:0;top:0;right:auto;bottom:auto;padding:24px 16px;z-index:2000}.auth-overlay-content {padding:32px 24px;max-width:100%;margin:0 auto}.auth-overlay-title {font-size:22px;margin-bottom:24px}.auth-form-row {flex-direction:column;gap:12px}.auth-signin-btn, .auth-signup-btn {font-size:15px;padding:12px 20px}}@media (max-width:480px) {.auth-overlay {position:fixed;width:100vw;height:100vh;padding:20px 12px}.auth-overlay-content {padding:28px 20px;border-radius:16px}.auth-overlay-title {font-size:20px;margin-bottom:20px}.auth-section {margin-bottom:20px}.auth-section-label {font-size:13px;margin-bottom:10px}.auth-form-group input {height:44px;font-size:14px;padding:0 14px}.auth-signin-btn, .auth-signup-btn {font-size:14px;padding:11px 18px}.auth-divider {margin:20px 0}}@media (max-width:360px) {.auth-overlay {position:fixed;width:100vw;height:100vh;padding:16px 8px}.auth-overlay-content {padding:24px 16px}.auth-overlay-title {font-size:18px;margin-bottom:16px}.auth-section {margin-bottom:16px}.auth-form-group input {height:42px;font-size:14px}}.lesson-notes-overlay {position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0, 0, 0, 0.85);backdrop-filter:blur(5px);z-index:9999;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity 0.3s ease, visibility 0.3s ease}.lesson-notes-overlay.active {opacity:1;visibility:visible}.lesson-notes-modal {background:linear-gradient(135deg, #1A1F4A 0%, #0D1130 100%);border:1px solid rgba(117, 106, 246, 0.3);border-radius:12px;width:90%;max-width:900px;max-height:85vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0, 0, 0, 0.5);transform:scale(0.95);transition:transform 0.3s ease}.lesson-notes-overlay.active .lesson-notes-modal {transform:scale(1)}.lesson-notes-modal-header {display:flex;align-items:center;justify-content:space-between;padding:20px 28px;background:rgba(31, 35, 66, 0.8);border-bottom:1px solid rgba(117, 106, 246, 0.2);border-radius:12px 12px 0 0;flex-shrink:0}.lesson-notes-modal-title {display:flex;align-items:center;gap:12px;font-size:18px;font-weight:700;color:#fff}.lesson-notes-modal-title .notes-icon {width:22px;height:22px;color:#756AF6;flex-shrink:0}.close-notes-btn {width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:rgba(255, 107, 107, 0.15);border:1px solid rgba(255, 107, 107, 0.3);border-radius:8px;color:#ff6b6b;cursor:pointer;transition:all 0.2s ease;flex-shrink:0}.close-notes-btn:hover {background:rgba(255, 107, 107, 0.25);border-color:rgba(255, 107, 107, 0.5);transform:scale(1.05)}.close-notes-btn svg {width:18px;height:18px}.lesson-notes-modal-content {padding:28px 32px 32px 32px;overflow-y:auto;color:#C2CEED;line-height:1.7;font-size:15px;flex:1}.lesson-notes-modal-content h1, .lesson-notes-modal-content h2, .lesson-notes-modal-content h3, .lesson-notes-modal-content h4, .lesson-notes-modal-content h5, .lesson-notes-modal-content h6 {color:#fff;margin-top:24px;margin-bottom:12px;font-weight:700}.lesson-notes-modal-content h1 {font-size:28px}.lesson-notes-modal-content h2 {font-size:24px}.lesson-notes-modal-content h3 {font-size:20px}.lesson-notes-modal-content h4 {font-size:18px}.lesson-notes-modal-content p {margin-bottom:16px}.lesson-notes-modal-content a {color:#756AF6;text-decoration:none;transition:color 0.2s ease}.lesson-notes-modal-content a:hover {color:#9b91ff;text-decoration:underline}.lesson-notes-modal-content ul, .lesson-notes-modal-content ol {margin-left:24px;margin-bottom:16px}.lesson-notes-modal-content li {margin-bottom:8px}.lesson-notes-modal-content code {background:rgba(117, 106, 246, 0.15);padding:2px 6px;border-radius:4px;font-family:'Courier New', monospace;font-size:14px;color:#9b91ff}.lesson-notes-modal-content pre {background:rgba(13, 17, 48, 0.8);padding:16px;border-radius:8px;overflow-x:auto;margin-bottom:16px;border:1px solid rgba(117, 106, 246, 0.2)}.lesson-notes-modal-content pre code {background:none;padding:0;color:#C2CEED}.lesson-notes-modal-content blockquote {border-left:4px solid #756AF6;padding-left:16px;margin-left:0;margin-bottom:16px;color:#8A96B3;font-style:italic}.lesson-notes-modal-content img {max-width:100%;height:auto;border-radius:8px;margin:16px 0}.lesson-notes-modal-content table {width:100%;border-collapse:collapse;margin-bottom:16px}.lesson-notes-modal-content th, .lesson-notes-modal-content td {padding:12px;border:1px solid rgba(117, 106, 246, 0.2);text-align:left}.lesson-notes-modal-content th {background:rgba(117, 106, 246, 0.15);font-weight:600;color:#fff}.lesson-notes-modal-content hr {border:none;border-top:1px solid rgba(117, 106, 246, 0.2);margin:24px 0}.written-content-overlay {position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0, 0, 0, 0.85);backdrop-filter:blur(5px);z-index:9999;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity 0.3s ease, visibility 0.3s ease}.written-content-overlay.active {opacity:1;visibility:visible}.written-content-modal {background:linear-gradient(135deg, #1A1F4A 0%, #0D1130 100%);border:1px solid rgba(117, 106, 246, 0.3);border-radius:12px;width:90%;max-width:1000px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0, 0, 0, 0.5);transform:scale(0.95);transition:transform 0.3s ease}.written-content-overlay.active .written-content-modal {transform:scale(1)}.written-content-modal-header {display:flex;align-items:center;justify-content:space-between;padding:20px 28px;background:rgba(31, 35, 66, 0.8);border-bottom:1px solid rgba(117, 106, 246, 0.2);border-radius:12px 12px 0 0;flex-shrink:0}.written-content-modal-title {display:flex;align-items:center;gap:12px;font-size:18px;font-weight:700;color:#fff}.written-content-modal-title .read-icon {width:22px;height:22px;color:#756AF6;flex-shrink:0}.close-written-content-btn {width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:rgba(255, 107, 107, 0.15);border:1px solid rgba(255, 107, 107, 0.3);border-radius:8px;color:#ff6b6b;cursor:pointer;transition:all 0.2s ease;flex-shrink:0}.close-written-content-btn:hover {background:rgba(255, 107, 107, 0.25);border-color:rgba(255, 107, 107, 0.5);transform:scale(1.05)}.close-written-content-btn svg {width:18px;height:18px}.written-content-modal-body {padding:28px 32px 32px 32px;overflow-y:auto;flex:1}.written-content-loading {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:60px 20px;color:#C2CEED;font-size:15px}.written-content-loading .loading-spinner {width:40px;height:40px;border:3px solid rgba(117, 106, 246, 0.2);border-top-color:#756AF6;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin {to {transform:rotate(360deg)}}.written-content-error {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:60px 20px;color:#ff6b6b;font-size:15px;text-align:center}.written-content-error svg {width:48px;height:48px;opacity:0.7}.written-content-article {color:#C2CEED;line-height:1.8;font-size:16px}.written-content-article h1, .written-content-article h2, .written-content-article h3, .written-content-article h4, .written-content-article h5, .written-content-article h6 {color:#fff;margin-top:32px;margin-bottom:16px;font-weight:700;line-height:1.3}.written-content-article h1 {font-size:32px}.written-content-article h2 {font-size:26px}.written-content-article h3 {font-size:22px}.written-content-article h4 {font-size:18px}.written-content-article h1:first-child, .written-content-article h2:first-child, .written-content-article h3:first-child {margin-top:0}.written-content-article p {margin-bottom:18px}.written-content-article a {color:#756AF6;text-decoration:none;transition:color 0.2s ease}.written-content-article a:hover {color:#9b91ff;text-decoration:underline}.written-content-article ul, .written-content-article ol {margin-left:24px;margin-bottom:18px}.written-content-article li {margin-bottom:10px}.written-content-article code {background:rgba(117, 106, 246, 0.15);padding:3px 8px;border-radius:4px;font-family:'Courier New', monospace;font-size:14px;color:#9b91ff}.written-content-article pre {background:rgba(13, 17, 48, 0.8);padding:20px;border-radius:8px;overflow-x:auto;margin-bottom:18px;border:1px solid rgba(117, 106, 246, 0.2)}.written-content-article pre code {background:none;padding:0;color:#C2CEED;font-size:14px;line-height:1.6}.written-content-article blockquote {border-left:4px solid #756AF6;padding-left:20px;margin-left:0;margin-bottom:18px;color:#8A96B3;font-style:italic}.written-content-article img {max-width:100%;height:auto;border-radius:8px;margin:20px 0;box-shadow:0 4px 20px rgba(0, 0, 0, 0.3)}.written-content-article table {width:100%;border-collapse:collapse;margin-bottom:18px}.written-content-article th, .written-content-article td {padding:12px 16px;border:1px solid rgba(117, 106, 246, 0.2);text-align:left}.written-content-article th {background:rgba(117, 106, 246, 0.15);font-weight:600;color:#fff}.written-content-article hr {border:none;border-top:1px solid rgba(117, 106, 246, 0.2);margin:32px 0}.sidebar-header {padding:24px;background:rgba(31, 35, 66, 0.95);border-bottom:1px solid rgba(117, 106, 246, 0.2);flex-shrink:0}.back-to-courses-btn {display:inline-flex;align-items:center;gap:8px;padding:8px 12px;margin-bottom:16px;background:rgba(117, 106, 246, 0.1);border:1px solid rgba(117, 106, 246, 0.2);border-radius:8px;color:#C2CEED;text-decoration:none;font-size:13px;font-weight:600;cursor:pointer;transition:all 0.3s ease}.back-to-courses-btn:hover {background:rgba(117, 106, 246, 0.2);border-color:rgba(117, 106, 246, 0.4);color:#fff;transform:translateX(-2px)}.back-to-courses-btn svg {width:16px;height:16px;flex-shrink:0}.course-title {font-size:18px;font-weight:700;color:#fff;margin-bottom:8px;line-height:1.3}.course-meta {font-size:13px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px}.course-meta-item {display:flex;align-items:center;gap:6px;padding:6px 12px;background:rgba(117, 106, 246, 0.1);border:1px solid rgba(117, 106, 246, 0.2);border-radius:6px;color:#C2CEED;font-size:12px;font-weight:500;transition:all 0.2s ease}.course-meta-item svg {width:14px;height:14px;flex-shrink:0;opacity:0.8}.course-progress-section {margin-top:20px;padding-top:20px;border-top:1px solid rgba(117, 106, 246, 0.2)}.progress-header {display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.progress-label {font-size:12px;font-weight:600;color:#8A96B3;text-transform:uppercase;letter-spacing:0.5px}.progress-percentage {font-size:14px;font-weight:700;color:#756AF6}.progress-bar-container {width:100%;height:8px;background:rgba(117, 106, 246, 0.1);border-radius:4px;overflow:hidden;margin-bottom:12px}.progress-bar-fill {height:100%;background:linear-gradient(90deg, #756AF6 0%, #9b91ff 100%);border-radius:4px;transition:width 0.5s ease;width:0%}.progress-stats {display:flex;justify-content:space-between;align-items:center;gap:12px}.progress-stat {font-size:12px;color:#8A96B3;font-weight:500}.progress-stat:first-child {color:#C2CEED}.github-code-btn {display:flex;align-items:center;gap:8px;padding:10px 16px;background:rgba(117, 106, 246, 0.15);border:1px solid rgba(117, 106, 246, 0.3);border-radius:8px;color:#C2CEED;cursor:pointer;transition:all 0.3s ease;font-size:14px;font-weight:600;text-decoration:none}.github-code-btn:hover {background:rgba(117, 106, 246, 0.25);border-color:rgba(117, 106, 246, 0.5);transform:translateY(-1px);color:#C2CEED}.github-code-btn:active {transform:translateY(0)}.github-code-btn .github-icon {width:16px;height:16px;flex-shrink:0}.curriculum-content {padding:20px;overflow-y:auto;flex:1}.curriculum-chapter {margin-bottom:10px;background:linear-gradient(135deg, rgba(31, 35, 66, 0.4) 0%, rgba(31, 35, 66, 0.2) 100%);border-radius:12px;border:1px solid rgba(117, 106, 246, 0.15);overflow:hidden;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1)}.curriculum-chapter:hover {border-color:rgba(117, 106, 246, 0.3);box-shadow:0 8px 24px rgba(117, 106, 246, 0.15)}.chapter-header {display:flex;align-items:center;justify-content:space-between;padding:16px 18px;background:linear-gradient(135deg, rgba(117, 106, 246, 0.12) 0%, rgba(117, 106, 246, 0.06) 100%);cursor:pointer;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);user-select:none;position:relative}.chapter-header::before {content:'';position:absolute;left:0;top:0;height:100%;width:4px;background:linear-gradient(180deg, #756AF6 0%, #CC7DDA 100%);opacity:0;transition:opacity 0.3s ease}.chapter-header:hover::before {opacity:1}.chapter-header:hover {background:linear-gradient(135deg, rgba(117, 106, 246, 0.18) 0%, rgba(117, 106, 246, 0.1) 100%);padding-left:22px}.chapter-header-content {display:flex;align-items:center;gap:12px;flex:1}.chapter-title {font-size:15px;font-weight:700;color:#fff;letter-spacing:0.3px;text-shadow:0 2px 8px rgba(0, 0, 0, 0.3)}.chapter-toggle {width:20px;height:20px;transition:transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);flex-shrink:0;color:#756AF6;filter:drop-shadow(0 2px 4px rgba(117, 106, 246, 0.4))}.curriculum-chapter.collapsed .chapter-toggle {transform:rotate(-90deg)}.chapter-lessons {padding:8px;display:flex;flex-direction:column;gap:4px;background:rgba(13, 17, 48, 0.3);max-height:3000px;opacity:1;overflow:hidden;transition:max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1), padding 0.4s cubic-bezier(0.4, 0, 0.2, 1)}.curriculum-chapter.collapsed .chapter-lessons {max-height:0;opacity:0;padding-top:0;padding-bottom:0}.lesson-item {display:flex;align-items:center;gap:10px;padding:12px 14px;cursor:pointer;border-radius:10px;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);text-decoration:none;color:#9BA5C9;position:relative;background:rgba(31, 35, 66, 0.2);border:1px solid transparent}.lesson-item::before {content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);height:60%;width:3px;background:linear-gradient(180deg, #756AF6 0%, #CC7DDA 100%);border-radius:0 2px 2px 0;opacity:0;transition:all 0.3s ease}.lesson-item:hover {background:linear-gradient(135deg, rgba(117, 106, 246, 0.15) 0%, rgba(117, 106, 246, 0.08) 100%);color:#E8EEFF;border-color:rgba(117, 106, 246, 0.3);transform:translateX(4px);box-shadow:0 4px 12px rgba(117, 106, 246, 0.2)}.lesson-item:hover::before {opacity:1}.lesson-item.active {background:linear-gradient(135deg, rgba(117, 106, 246, 0.25) 0%, rgba(204, 125, 218, 0.15) 100%);color:#fff;border-color:rgba(117, 106, 246, 0.5);font-weight:600;box-shadow:0 6px 16px rgba(117, 106, 246, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1)}.lesson-item.active::before {opacity:1;height:80%;width:4px}.lesson-name {flex:1;font-size:13px;line-height:1.5;color:inherit;font-weight:500}.lesson-item.active .lesson-name {font-weight:700}.lesson-duration {font-size:11px;color:#6B7390;background:rgba(117, 106, 246, 0.1);padding:4px 8px;border-radius:6px;font-weight:600;letter-spacing:0.3px}.lesson-item:hover .lesson-duration {background:rgba(117, 106, 246, 0.15);color:#9BA5C9}.lesson-item.active .lesson-duration {background:rgba(255, 255, 255, 0.15);color:#E8EEFF}.lesson-type-badge {font-size:10px;padding:4px 10px;border-radius:12px;background:linear-gradient(135deg, rgba(117, 106, 246, 0.2) 0%, rgba(117, 106, 246, 0.15) 100%);color:#9b91ff;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;border:1px solid rgba(117, 106, 246, 0.3)}.free-preview-badge {font-size:10px;padding:4px 10px;border-radius:12px;background:linear-gradient(135deg, rgba(46, 213, 115, 0.2) 0%, rgba(46, 213, 115, 0.15) 100%);color:#5df5a6;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;border:1px solid rgba(46, 213, 115, 0.3)}.read-free-badge {display:inline-flex;align-items:center;gap:4px;font-size:10px;padding:4px 10px;border-radius:12px;background:linear-gradient(135deg, rgba(246, 190, 133, 0.25) 0%, rgba(246, 190, 133, 0.15) 100%);color:#f6be85;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;border:1px solid rgba(246, 190, 133, 0.4)}.read-free-badge svg {flex-shrink:0}.video-text-badge {display:inline-flex;align-items:center;gap:4px;font-size:10px;padding:4px 10px;border-radius:12px;background:linear-gradient(135deg, rgba(117, 106, 246, 0.25) 0%, rgba(117, 106, 246, 0.15) 100%);color:#a9a1f8;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;border:1px solid rgba(117, 106, 246, 0.4)}.video-text-badge svg {flex-shrink:0}.lesson-completed-icon {width:18px;height:18px;flex-shrink:0;color:#2ed573;filter:drop-shadow(0 2px 4px rgba(46, 213, 115, 0.4));animation:checkmark-pop 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55)}@keyframes checkmark-pop {0% {transform:scale(0);opacity:0}50% {transform:scale(1.2)}100% {transform:scale(1);opacity:1}}.chapter-completed-icon {width:20px;height:20px;flex-shrink:0;color:#2ed573;filter:drop-shadow(0 2px 6px rgba(46, 213, 115, 0.5))}.curriculum-content::-webkit-scrollbar {width:8px}.curriculum-content::-webkit-scrollbar-track {background:rgba(13, 17, 48, 0.4);border-radius:4px;margin:8px 0}.curriculum-content::-webkit-scrollbar-thumb {background:linear-gradient(180deg, #756AF6 0%, #CC7DDA 100%);border-radius:4px;border:2px solid rgba(13, 17, 48, 0.4);transition:all 0.3s ease}.curriculum-content::-webkit-scrollbar-thumb:hover {background:linear-gradient(180deg, #8A7EFF 0%, #D68FE8 100%);border-color:rgba(13, 17, 48, 0.6)}.curriculum-sidebar::-webkit-scrollbar {width:8px}.curriculum-sidebar::-webkit-scrollbar-track {background:rgba(13, 17, 48, 0.4);border-radius:4px}.curriculum-sidebar::-webkit-scrollbar-thumb {background:linear-gradient(180deg, #756AF6 0%, #CC7DDA 100%);border-radius:4px;border:2px solid rgba(13, 17, 48, 0.4)}.curriculum-sidebar::-webkit-scrollbar-thumb:hover {background:linear-gradient(180deg, #8A7EFF 0%, #D68FE8 100%)}.mobile-curriculum-toggle {display:none;position:fixed;bottom:20px;right:20px;width:60px;height:60px;background:linear-gradient(135deg, #756AF6, #CC7DDA);border:none;border-radius:50%;box-shadow:0 4px 20px rgba(117, 106, 246, 0.4);cursor:pointer;z-index:1001;transition:all 0.3s ease;align-items:center;justify-content:center;color:white}.mobile-curriculum-toggle:hover {transform:scale(1.1)}.mobile-curriculum-toggle svg {width:24px;height:24px}.curriculum-backdrop {display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.7);z-index:999;opacity:0;transition:opacity 0.3s ease;pointer-events:none}.curriculum-backdrop.active {display:block;opacity:1;pointer-events:auto}.mux-loading, .mux-error {position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;color:#C2CEED;background:rgba(13, 17, 48, 0.95);text-align:center;padding:32px}.mux-error {color:#ff6b6b}.video-end-overlay {position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(13, 17, 48, 0.95);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;z-index:200}.video-end-content {max-width:480px;width:100%;background:rgba(31, 35, 66, 0.95);border-radius:20px;padding:40px;box-shadow:0 20px 60px rgba(0, 0, 0, 0.4);border:1px solid rgba(117, 106, 246, 0.3);text-align:center}.video-end-content h3 {font-size:24px;font-weight:700;color:#fff;margin:0 0 8px 0}.next-lesson-name {font-size:16px;color:#F5F7FF;margin:0 0 32px 0;line-height:1.5}.video-end-continue-btn {width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:14px 24px;background:linear-gradient(135deg, rgba(46, 213, 115, 0.15) 0%, rgba(46, 213, 115, 0.1) 100%);border:1px solid rgba(46, 213, 115, 0.3);border-radius:10px;color:#2ed573;cursor:pointer;transition:all 0.3s ease;font-size:16px;font-weight:600}.video-end-continue-btn:hover {background:linear-gradient(135deg, rgba(46, 213, 115, 0.25) 0%, rgba(46, 213, 115, 0.15) 100%);border-color:rgba(46, 213, 115, 0.5);transform:translateY(-2px)}.video-end-continue-btn svg {width:18px;height:18px;flex-shrink:0}.video-end-actions {display:flex;flex-direction:column;gap:12px}.video-end-rewatch-btn {width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:14px 24px;background:transparent;border:1px solid rgba(255, 255, 255, 0.2);border-radius:10px;color:#C2CEED;cursor:pointer;transition:all 0.3s ease;font-size:15px;font-weight:500}.video-end-rewatch-btn:hover {background:rgba(255, 255, 255, 0.05);border-color:rgba(255, 255, 255, 0.3);color:#fff}.video-end-rewatch-btn svg {width:18px;height:18px;flex-shrink:0}.restore-fullscreen-overlay {position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:150;pointer-events:none}.restore-fullscreen-btn {display:flex;align-items:center;gap:10px;padding:14px 24px;background:rgba(13, 17, 48, 0.9);backdrop-filter:blur(10px);border:1px solid rgba(117, 106, 246, 0.4);border-radius:12px;color:#fff;cursor:pointer;transition:all 0.3s ease;font-size:15px;font-weight:600;pointer-events:auto;animation:restoreFullscreenPulse 2s ease-in-out infinite}.restore-fullscreen-btn:hover {background:rgba(117, 106, 246, 0.3);border-color:rgba(117, 106, 246, 0.6);transform:scale(1.05)}.restore-fullscreen-btn svg {width:20px;height:20px;flex-shrink:0}@keyframes restoreFullscreenPulse {0%, 100% {box-shadow:0 0 0 0 rgba(117, 106, 246, 0.4)}50% {box-shadow:0 0 20px 5px rgba(117, 106, 246, 0.2)}}@media (max-width:1024px) {.lesson-viewer {grid-template-columns:1fr;grid-template-rows:auto 1fr}.curriculum-sidebar {position:fixed;left:0;top:0;height:100vh;width:380px;z-index:1000;transform:translateX(-100%);transition:transform 0.3s ease;grid-column:unset;grid-row:unset;pointer-events:auto}.curriculum-sidebar.mobile-open {transform:translateX(0);pointer-events:auto}.content-header {grid-column:1;grid-row:1;padding:25px 20px 12px 20px;flex-wrap:wrap;height:auto;gap:12px;align-items:center;align-content:flex-start}.lesson-title-section {flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}.mobile-curriculum-toggle {display:flex;align-self:center}.video-container:has(.mux-auth-required) ~ * .mobile-curriculum-toggle, .video-container:has(.mux-upgrade-required) ~ * .mobile-curriculum-toggle, .take-course-layout:has(.mux-auth-required) .mobile-curriculum-toggle, .take-course-layout:has(.mux-upgrade-required) .mobile-curriculum-toggle {display:none}.current-lesson-title {font-size:15px;line-height:1.4}.current-chapter-name {font-size:11px}.header-actions {width:100%;justify-content:center;flex-wrap:wrap;gap:8px;padding:12px 0 0 0;border-top:1px solid rgba(117, 106, 246, 0.2);margin-top:4px}.lesson-content {grid-column:1;grid-row:2;display:flex;flex-direction:column}.video-section {width:100vw;flex-shrink:0}.current-lesson-title {font-size:16px}.toggle-btn {padding:8px 12px;font-size:13px;gap:6px}.toggle-icon {width:14px;height:14px}.sidebar-navigation {padding:12px 16px;gap:8px}.nav-arrow-btn {padding:10px 12px;font-size:13px}.nav-arrow-btn svg {width:16px;height:16px}.mark-complete-btn {padding:10px 12px;font-size:13px}.mark-complete-btn svg {width:16px;height:16px}.certificate-btn {padding:10px 12px;font-size:13px}.certificate-btn svg {width:16px;height:16px}}@media (max-width:768px) {.curriculum-sidebar {width:90%;max-width:320px}.current-lesson-title {font-size:14px}.current-chapter-name {font-size:11px}.toggle-btn {padding:6px 10px;font-size:12px;gap:4px}.toggle-icon {width:16px;height:16px}.toggle-status {font-size:10px;padding:2px 6px}.mobile-curriculum-toggle {width:50px;height:50px;bottom:16px;right:16px}.sidebar-navigation {padding:10px 12px;gap:6px}.nav-arrow-btn {padding:8px 10px;font-size:12px}.nav-arrow-btn svg {width:14px;height:14px}.nav-arrow-btn span {display:none}.mark-complete-btn {padding:8px 10px;font-size:11px}.mark-complete-btn svg {width:14px;height:14px}.certificate-btn {padding:8px 10px;font-size:11px}.certificate-btn svg {width:14px;height:14px}}.course-completion-overlay {position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0, 0, 0, 0.85);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;box-sizing:border-box}.course-completion-modal {background:linear-gradient(135deg, #1f2342 0%, #2a2d5a 100%);border-radius:24px;max-width:560px;width:100%;box-shadow:0 20px 60px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.1);animation:modalSlideIn 0.3s ease-out}@keyframes modalSlideIn {from {opacity:0;transform:translateY(-20px) scale(0.95)}to {opacity:1;transform:translateY(0) scale(1)}}.course-completion-content {padding:48px 40px;text-align:center}.completion-icon {width:80px;height:80px;margin:0 auto 24px auto;background:linear-gradient(135deg, #756AF6 0%, #9b91ff 100%);border-radius:50%;display:flex;align-items:center;justify-content:center;animation:iconPulse 1.5s ease-in-out infinite}@keyframes iconPulse {0%, 100% {transform:scale(1);box-shadow:0 0 0 0 rgba(117, 106, 246, 0.7)}50% {transform:scale(1.05);box-shadow:0 0 0 15px rgba(117, 106, 246, 0)}}.completion-icon svg {width:48px;height:48px;stroke-width:3;color:#fff}.course-completion-content h2 {font-size:32px;font-weight:700;color:#fff;margin:0 0 16px 0}.completion-message {font-size:18px;color:#C2C6E8;margin:0 0 12px 0;line-height:1.5}.completion-message strong {color:#fff;font-weight:600}.completion-submessage {font-size:15px;color:#8E94B8;margin:0 0 32px 0;line-height:1.6}.completion-actions {display:flex;gap:12px;flex-direction:column}.completion-actions .btn-primary, .completion-actions .btn-secondary {padding:14px 24px;border-radius:12px;font-size:16px;font-weight:600;border:none;cursor:pointer;transition:all 0.2s ease;display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}.completion-actions .btn-primary {background:linear-gradient(135deg, #756AF6 0%, #9b91ff 100%);color:#fff}.completion-actions .btn-primary:hover {background:linear-gradient(135deg, #8978f7 0%, #afa6ff 100%);transform:translateY(-2px);box-shadow:0 8px 24px rgba(117, 106, 246, 0.4)}.completion-actions .btn-primary svg {width:20px;height:20px;stroke-width:2}.completion-actions .btn-secondary {background:rgba(255, 255, 255, 0.1);color:#C2C6E8;border:1px solid rgba(255, 255, 255, 0.15)}.completion-actions .btn-secondary:hover {background:rgba(255, 255, 255, 0.15);color:#fff;border-color:rgba(255, 255, 255, 0.25)}@media (max-width:768px) {.course-completion-modal {max-width:100%;border-radius:20px}.course-completion-content {padding:36px 28px}.course-completion-content h2 {font-size:26px}.completion-message {font-size:16px}.completion-submessage {font-size:14px}}@media (max-width:480px) {.course-completion-overlay {padding:16px}.course-completion-content {padding:32px 24px}.completion-icon {width:64px;height:64px;margin-bottom:20px}.completion-icon svg {width:36px;height:36px}.course-completion-content h2 {font-size:22px;margin-bottom:12px}.completion-message {font-size:15px}.completion-submessage {font-size:13px;margin-bottom:24px}.completion-actions .btn-primary, .completion-actions .btn-secondary {padding:12px 20px;font-size:14px}}.congratulations-overlay {position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(13, 17, 48, 0.95);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:10000;padding:20px;animation:fadeIn 0.3s ease}.congratulations-modal {background:linear-gradient(135deg, rgba(31, 35, 66, 0.98) 0%, rgba(26, 31, 74, 0.98) 100%);border-radius:24px;max-width:540px;width:100%;padding:48px 40px;position:relative;border:1px solid rgba(117, 106, 246, 0.2);box-shadow:0 24px 64px rgba(0, 0, 0, 0.5);animation:slideUp 0.4s ease;text-align:center}@keyframes fadeIn {from {opacity:0}to {opacity:1}}@keyframes slideUp {from {transform:translateY(40px);opacity:0}to {transform:translateY(0);opacity:1}}.close-congrats-btn {position:absolute;top:20px;right:20px;width:36px;height:36px;background:rgba(255, 255, 255, 0.05);border:1px solid rgba(255, 255, 255, 0.1);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.2s ease;padding:0}.close-congrats-btn:hover {background:rgba(255, 255, 255, 0.1);border-color:rgba(255, 255, 255, 0.2)}.close-congrats-btn svg {width:18px;height:18px;color:#C2C6E8}.congrats-icon {width:100px;height:100px;margin:0 auto 24px;animation:celebrationPulse 2s ease-in-out infinite}@keyframes celebrationPulse {0%, 100% {transform:scale(1)}50% {transform:scale(1.1)}}.congrats-icon svg {width:100%;height:100%}.congrats-title {font-size:36px;font-weight:700;color:#fff;margin:0 0 16px 0;background:linear-gradient(135deg, #fff 0%, #C2C6E8 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.congrats-message {font-size:18px;color:#C2C6E8;margin:0 0 32px 0;line-height:1.6}.congrats-message strong {color:#fff;font-weight:600}.congrats-actions {margin-bottom:32px}.congrats-certificate-btn {width:100%;padding:16px 28px;background:linear-gradient(135deg, #756AF6 0%, #9b91ff 100%);color:#fff;border:none;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;transition:all 0.3s ease;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 8px 24px rgba(117, 106, 246, 0.3)}.congrats-certificate-btn:hover {background:linear-gradient(135deg, #8978f7 0%, #afa6ff 100%);transform:translateY(-2px);box-shadow:0 12px 32px rgba(117, 106, 246, 0.5)}.congrats-certificate-btn svg {width:20px;height:20px;stroke-width:2}.congrats-share {padding-top:24px;border-top:1px solid rgba(255, 255, 255, 0.1)}.congrats-share-label {font-size:14px;color:#8E94B8;margin:0 0 16px 0;font-weight:500}.congrats-share-buttons {display:flex;gap:12px;justify-content:center}.congrats-share-btn {width:48px;height:48px;background:rgba(255, 255, 255, 0.05);border:1px solid rgba(255, 255, 255, 0.1);border-radius:12px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.2s ease;padding:0}.congrats-share-btn svg {width:20px;height:20px}.congrats-share-btn.linkedin {color:#0077B5}.congrats-share-btn.linkedin:hover {background:rgba(0, 119, 181, 0.15);border-color:rgba(0, 119, 181, 0.3);transform:translateY(-2px)}.congrats-share-btn.twitter {color:#1DA1F2}.congrats-share-btn.twitter:hover {background:rgba(29, 161, 242, 0.15);border-color:rgba(29, 161, 242, 0.3);transform:translateY(-2px)}.congrats-share-btn.facebook {color:#1877F2}.congrats-share-btn.facebook:hover {background:rgba(24, 119, 242, 0.15);border-color:rgba(24, 119, 242, 0.3);transform:translateY(-2px)}@media (max-width:768px) {.congratulations-modal {max-width:100%;padding:40px 32px;border-radius:20px}.congrats-icon {width:80px;height:80px;margin-bottom:20px}.congrats-title {font-size:28px}.congrats-message {font-size:16px}.congrats-certificate-btn {padding:14px 24px;font-size:15px}}@media (max-width:480px) {.congratulations-overlay {padding:16px;width:auto;right:0;bottom:0}.congratulations-modal {padding:36px 24px}.congrats-icon {width:70px;height:70px;margin-bottom:16px}.congrats-title {font-size:24px;margin-bottom:12px}.congrats-message {font-size:15px;margin-bottom:24px}.congrats-certificate-btn {padding:12px 20px;font-size:14px}.congrats-share-label {font-size:13px;margin-bottom:12px}.congrats-share-btn {width:44px;height:44px}.congrats-share-btn svg {width:18px;height:18px}}.trial-banner {position:fixed;top:70px;left:380px;right:0;background:linear-gradient(135deg, #2D1F5E 0%, #4A2C7A 50%, #5E3D8C 100%);border-top:3px solid #9B6DFF;border-bottom:3px solid #9B6DFF;padding:14px 24px;z-index:99;box-shadow:0 4px 24px rgba(155, 109, 255, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.1);transition:transform 0.3s ease, padding 0.3s ease}.trial-banner.collapsed {transform:translateY(-100%);padding:0}.trial-banner.collapsed .trial-banner-content {opacity:0;visibility:hidden}.trial-banner.collapsed .trial-banner-toggle {position:fixed;top:70px;right:20px;transform:rotate(180deg);opacity:1;visibility:visible;background:linear-gradient(135deg, #4A2C7A 0%, #5E3D8C 100%);border:2px solid #9B6DFF;border-radius:0 0 8px 8px;padding:6px 12px;box-shadow:0 4px 12px rgba(155, 109, 255, 0.3)}.trial-banner-toggle {background:rgba(255, 255, 255, 0.1);border:1px solid rgba(255, 255, 255, 0.2);border-radius:6px;padding:6px 10px;cursor:pointer;color:white;display:flex;align-items:center;justify-content:center;transition:all 0.2s ease;flex-shrink:0}.trial-banner-toggle:hover {background:rgba(255, 255, 255, 0.2);border-color:rgba(255, 255, 255, 0.3)}.trial-banner-toggle svg {width:18px;height:18px;transition:transform 0.3s ease}.trial-banner-content {display:flex;align-items:center;justify-content:space-between;max-width:1200px;margin:0 auto;gap:16px}.trial-banner-info {display:flex;align-items:center;gap:12px}.trial-banner .trial-icon {width:28px;height:28px;color:#FFD700;flex-shrink:0;filter:drop-shadow(0 0 4px rgba(255, 215, 0, 0.5))}.trial-banner-text {display:flex;flex-direction:row;align-items:center;gap:12px}.trial-label {font-size:13px;font-weight:700;color:#1a1a2e;background:linear-gradient(135deg, #FFD700 0%, #FFC107 100%);padding:5px 12px;border-radius:4px;text-transform:uppercase;letter-spacing:0.5px;box-shadow:0 2px 8px rgba(255, 215, 0, 0.4)}.trial-time {font-size:15px;color:#fff;font-weight:600;text-shadow:0 1px 2px rgba(0, 0, 0, 0.3)}.trial-upgrade-btn {display:inline-flex;align-items:center;gap:8px;padding:12px 24px;background:linear-gradient(135deg, #FFD700 0%, #FFA500 100%);color:#1a1a2e;border-radius:6px;font-size:14px;font-weight:700;text-decoration:none;transition:all 0.3s ease;flex-shrink:0;box-shadow:0 4px 12px rgba(255, 165, 0, 0.4)}.trial-upgrade-btn:hover {transform:translateY(-2px);box-shadow:0 6px 20px rgba(255, 165, 0, 0.6);background:linear-gradient(135deg, #FFE55C 0%, #FFB347 100%);color:#1a1a2e}.trial-upgrade-btn svg {width:16px;height:16px}.trial-limit-overlay {position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(15, 17, 35, 0.98);display:flex;align-items:center;justify-content:center;z-index:100;padding:20px;box-sizing:border-box;animation:trialFadeIn 0.3s ease-out}@keyframes trialFadeIn {from {opacity:0}to {opacity:1}}.trial-limit-content {background:linear-gradient(135deg, #1f2342 0%, #2a2d5a 100%);border-radius:24px;padding:48px 40px;max-width:480px;width:100%;text-align:center;box-shadow:0 20px 60px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.1);animation:trialSlideIn 0.3s ease-out}@keyframes trialSlideIn {from {opacity:0;transform:translateY(-20px) scale(0.95)}to {opacity:1;transform:translateY(0) scale(1)}}.trial-limit-icon {margin-bottom:24px}.trial-limit-icon svg {width:80px;height:80px}.trial-limit-title {font-size:28px;font-weight:700;color:#fff;margin:0 0 12px 0}.trial-limit-message {font-size:16px;color:#C2CEED;margin:0 0 32px 0;line-height:1.6}.trial-limit-benefits {background:rgba(117, 106, 246, 0.1);border-radius:12px;padding:20px 24px;margin-bottom:32px;text-align:left}.trial-limit-benefits h4 {font-size:14px;font-weight:600;color:#C2CEED;margin:0 0 16px 0}.trial-limit-benefits ul {list-style:none;padding:0;margin:0}.trial-limit-benefits li {display:flex;align-items:center;gap:12px;font-size:14px;color:#fff;margin-bottom:10px}.trial-limit-benefits li:last-child {margin-bottom:0}.trial-limit-benefits li svg {width:16px;height:16px;flex-shrink:0}.trial-limit-actions {display:flex;justify-content:center}.trial-upgrade-btn-large {display:inline-flex;align-items:center;gap:10px;padding:14px 32px;background:linear-gradient(135deg, #756AF6 0%, #5B4FD9 100%);color:#fff;border-radius:10px;font-size:16px;font-weight:600;text-decoration:none;transition:all 0.3s ease}.trial-upgrade-btn-large:hover {transform:translateY(-2px);box-shadow:0 8px 24px rgba(117, 106, 246, 0.4)}.trial-upgrade-btn-large svg {width:20px;height:20px}@media (max-width:768px) {.trial-banner {left:0;top:0;position:relative}.trial-banner-content {flex-direction:column;gap:12px;text-align:center}.trial-banner-info {justify-content:center}.trial-limit-content {padding:32px 24px}.trial-limit-title {font-size:24px}.trial-limit-message {font-size:14px}}.trial-activate-modal {position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(15, 17, 35, 0.95);display:flex;align-items:center;justify-content:center;z-index:10001;backdrop-filter:blur(8px)}.trial-activate-content {background:linear-gradient(135deg, #1a1d3d 0%, #252954 100%);border:1px solid rgba(117, 106, 246, 0.3);border-radius:16px;padding:40px;max-width:480px;width:90%;text-align:center;position:relative;box-shadow:0 20px 60px rgba(0, 0, 0, 0.5)}.trial-activate-close {position:absolute;top:16px;right:16px;background:none;border:none;color:#8A96B3;font-size:28px;cursor:pointer;padding:4px 8px;line-height:1;transition:color 0.2s ease}.trial-activate-close:hover {color:#fff}.trial-activate-icon {margin-bottom:24px}.trial-activate-icon svg {width:80px;height:80px}.trial-activate-title {font-size:28px;font-weight:700;color:#fff;margin:0 0 12px 0}.trial-activate-message {font-size:16px;color:#C2CEED;margin:0 0 24px 0;line-height:1.5}.trial-activate-benefits {background:rgba(46, 213, 115, 0.1);border:1px solid rgba(46, 213, 115, 0.2);border-radius:12px;padding:20px;margin-bottom:24px;text-align:left}.trial-activate-benefits p {font-size:14px;color:#2ed573;font-weight:600;margin:0 0 12px 0}.trial-activate-benefits ul {list-style:none;margin:0;padding:0}.trial-activate-benefits li {display:flex;align-items:center;gap:10px;font-size:14px;color:#fff;margin-bottom:8px}.trial-activate-benefits li:last-child {margin-bottom:0}.trial-activate-benefits li svg {width:16px;height:16px;flex-shrink:0}.trial-activate-actions {display:flex;gap:12px;justify-content:center;margin-bottom:16px}.trial-activate-cancel {padding:14px 28px;background:rgba(138, 150, 179, 0.15);border:1px solid rgba(138, 150, 179, 0.3);border-radius:8px;color:#C2CEED;font-size:15px;font-weight:600;cursor:pointer;transition:all 0.2s ease}.trial-activate-cancel:hover {background:rgba(138, 150, 179, 0.25);border-color:rgba(138, 150, 179, 0.5)}.trial-activate-confirm {padding:14px 28px;background:linear-gradient(135deg, #2ed573 0%, #26ab5f 100%);border:none;border-radius:8px;color:#fff;font-size:15px;font-weight:700;cursor:pointer;transition:all 0.2s ease;display:inline-flex;align-items:center;gap:8px}.trial-activate-confirm:hover:not(:disabled) {transform:translateY(-2px);box-shadow:0 6px 20px rgba(46, 213, 115, 0.4)}.trial-activate-confirm:disabled {opacity:0.7;cursor:not-allowed}.trial-activate-confirm .btn-loading {display:inline-flex;align-items:center;gap:8px}.trial-activate-confirm .spinner {width:18px;height:18px;animation:spin 1s linear infinite}@keyframes spin {from {transform:rotate(0deg)}to {transform:rotate(360deg)}}.trial-activate-note {font-size:12px;color:#8A96B3;margin:0}button.trial-upgrade-btn {border:none;cursor:pointer}button.trial-upgrade-btn-large {border:none;cursor:pointer}.trial-contact-btn-large {display:inline-flex;align-items:center;gap:10px;padding:14px 32px;background:linear-gradient(135deg, #4a5568 0%, #2d3748 100%);color:#fff;border-radius:10px;font-size:16px;font-weight:600;text-decoration:none;transition:all 0.3s ease;border:none;cursor:pointer}.trial-contact-btn-large:hover {transform:translateY(-2px);box-shadow:0 8px 24px rgba(74, 85, 104, 0.4);color:#fff}.trial-contact-btn-large svg {width:20px;height:20px}.trial-limit-custom-message {color:rgba(255, 255, 255, 0.8);font-size:15px;line-height:1.6;margin-bottom:24px;text-align:center}.chapter-trial-badge {font-size:10px;font-weight:700;color:#1a1a2e;background:linear-gradient(135deg, #FFD700 0%, #FFC107 100%);padding:2px 8px;border-radius:4px;text-transform:uppercase;letter-spacing:0.5px;margin-left:8px;flex-shrink:0}.chapter-locked-icon {width:16px;height:16px;color:#8A96B3;margin-left:8px;flex-shrink:0}.lesson-item.trial-locked {opacity:0.6}.lesson-item.trial-locked .lesson-name {color:#8A96B3}.lesson-locked-icon {width:14px;height:14px;color:#FFD700;flex-shrink:0;margin-right:4px}.trial-access-indicator {position:absolute;top:16px;left:16px;background:linear-gradient(135deg, rgba(255, 215, 0, 0.2) 0%, rgba(255, 193, 7, 0.2) 100%);border:1px solid rgba(255, 215, 0, 0.4);border-radius:6px;padding:8px 14px;display:flex;align-items:center;gap:8px;z-index:10}.trial-access-indicator svg {width:16px;height:16px;color:#FFD700}.trial-access-indicator span {font-size:12px;font-weight:600;color:#FFD700}