.stories-wrapper{width:100%;background:transparent;padding:1rem 0 0}.stories-container-new{margin:0 auto;padding:0 1rem}.stories-header-new{margin-bottom:.9rem}.stories-title-new{font-size:20px;font-weight:700;color:#1f2937;margin:0}.stories-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));grid-gap:1.5rem;gap:1.5rem;padding-bottom:1rem}.story-card-circular{cursor:pointer;position:relative;display:flex;flex-direction:column;align-items:center}.avatar-border{width:46px;height:46px;overflow:hidden;background:#ffe4b5;bottom:-2px;left:-2.5px;z-index:-2}.avatar-border,.avatar-dot{border-radius:50%;position:absolute}.avatar-dot{width:7px;height:7px;background:#ff4500;bottom:-4px;left:-4px;z-index:-1}.story-time-badge{position:absolute;top:-8px;left:12px;color:#fff;font-size:.75rem;font-weight:700;padding:.25rem .75rem;border-radius:12px;z-index:10;box-shadow:0 2px 8px rgba(0,0,0,.2)}.story-circle{position:relative;width:120px;height:120px;border-radius:50%;border:4px solid;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:1.5rem;transition:transform .2s ease}.story-icon-large{width:70px;height:70px;display:flex;align-items:center;justify-content:center;margin-bottom:0}.story-icon-large i{font-size:4rem}.story-avatar-wrapper{position:absolute;left:0;bottom:0}.avatar-circle{width:42px;height:42px;border-radius:50%;border:1px solid #e5e7eb;overflow:hidden;background:#fff;position:relative}.avatar-image{width:100%;height:100%;object-fit:cover}.avatar-placeholder-new{width:100%;height:100%;background:#f3f4f6;color:#1f2937;font-size:1.5rem}.avatar-placeholder-new,.story-count-circle{border-radius:50%;font-weight:700;display:flex;align-items:center;justify-content:center}.story-count-circle{position:absolute;top:13px;right:-5px;width:24px;height:24px;background:rgba(0,0,0,.75);color:#fff;font-size:.75rem;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.story-card-info{text-align:center;margin-top:1rem;max-width:150px}.story-card-title{font-size:1rem;font-weight:700;color:#1f2937;margin:0 0 .25rem}.story-card-subtitle{font-size:.8rem;color:#6b7280;margin:0;line-height:1.4}@media (max-width:968px){.stories-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1.25rem}.story-circle{width:140px;height:140px}.story-icon-large{width:70px;height:70px}.story-icon-large i{font-size:3.5rem}.story-card-info{max-width:140px}}@media (max-width:768px){.stories-grid{display:flex;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;gap:1rem;padding-top:.5rem;padding-bottom:0;scrollbar-width:none;-ms-overflow-style:none}.stories-grid::-webkit-scrollbar{display:none;width:0;height:0}.story-card-circular{flex-shrink:0}.story-circle{width:120px;height:120px;padding:1rem}.story-icon-large{width:50px;height:50px;margin-bottom:.75rem}.story-icon-large i{font-size:2.5rem}.avatar-circle{width:40px;height:40px}.story-card-info{max-width:120px;margin-top:.75rem}.story-card-title{font-size:.875rem}.story-card-subtitle{font-size:.7rem}.story-time-badge{font-size:.6875rem;padding:.2rem .6rem;top:-6px;left:8px}}@media (max-width:480px){.stories-title-new{font-size:18px}.story-circle{width:90px;height:90px;border-width:3px}.story-icon-large{width:36px;height:36px}.story-icon-large i{font-size:2.25rem}.avatar-circle{width:32px;height:32px}.story-card-info{max-width:110px}.story-card-title{font-size:.8125rem}.story-card-subtitle{font-size:.65rem}}.story-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.95);z-index:9999;display:flex;align-items:center;justify-content:center;padding:0}.story-modal-container{position:relative;width:100%;max-width:500px;height:90vh;max-height:900px;background:#1e293b;border-radius:16px;overflow:hidden}.story-modal-header{position:absolute;top:0;left:0;right:0;z-index:100;padding:1rem;background:linear-gradient(180deg,rgba(0,0,0,.7),transparent)}.progress-bars{display:flex;gap:4px;margin-bottom:1rem}.progress-bar{flex:1 1;height:3px;background:hsla(0,0%,100%,.3);border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:#fff;transition:width .05s linear}.story-tutor-header{display:flex;align-items:center;gap:.75rem}.tutor-avatar-small{width:40px;height:40px;border-radius:50%;overflow:hidden;border:2px solid #fff;flex-shrink:0}.avatar-img-small{width:100%;height:100%;object-fit:cover}.avatar-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#4f46e5;color:#fff;font-weight:700}.tutor-name-header{font-size:.9375rem;font-weight:600;color:#fff;margin:0}.story-time-header{font-size:.75rem;color:hsla(0,0%,100%,.8);margin:0}.close-btn{position:absolute;top:1rem;right:1rem;width:36px;height:36px;border-radius:50%;background:rgba(0,0,0,.5);border:none;color:#fff;font-size:1.25rem;cursor:pointer}.close-btn,.story-content{display:flex;align-items:center;justify-content:center}.story-content{width:100%;height:100%;overflow-y:hidden;padding:5rem 1.5rem 2rem}.nav-area{position:absolute;top:0;bottom:0;width:30%;cursor:pointer;z-index:5}.nav-area-left{left:0}.nav-area-right{right:0}.quiz-story-wrapper{width:100%;display:flex;flex-direction:column;gap:1.5rem;align-items:center}.quiz-header-badge-new{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:#a855f7;color:#fff;border-radius:9999px;font-size:1rem;font-weight:700;box-shadow:0 4px 12px rgba(168,85,247,.3)}.quiz-header-badge-new i{font-size:1.25rem}.quiz-card-white{width:100%;max-width:450px;background:#fff;border-radius:20px;padding:.9rem;box-shadow:0 10px 30px rgba(0,0,0,.2)}.quiz-question-section{display:flex;gap:.75rem;margin-bottom:1.5rem;align-items:flex-start}.quiz-q-label{flex-shrink:0;font-size:1.5rem;font-weight:800;color:#a855f7;line-height:1.4}.quiz-question-text{flex:1 1;font-size:1.25rem;font-weight:600;color:#1f2937;margin:0;line-height:1.5}.quiz-question-image{width:90%;margin:auto auto 1.5rem;border-radius:12px;overflow:hidden;border:3px solid #f3f4f6}.quiz-question-image img{width:100%;height:auto;max-height:260px;object-fit:cover;display:block}.quiz-options-grid{display:flex;flex-direction:column;gap:.4rem;margin-bottom:.5rem}.quiz-option-card{display:flex;align-items:center;gap:1rem;padding:.3rem .25rem;background:#f9fafb;border:2px solid #e5e7eb;border-radius:12px;color:#374151;font-size:1rem;font-weight:500;text-align:left;cursor:pointer;transition:all .2s ease;position:relative}.quiz-option-card:hover:not(:disabled){background:#f3f4f6;border-color:#a855f7;transform:translateX(4px)}.quiz-option-card:disabled{cursor:not-allowed}.option-badge{flex-shrink:0;width:36px;height:36px;border-radius:50%;background:#e5e7eb;color:#6b7280;font-weight:700;font-size:1rem;display:flex;align-items:center;justify-content:center;transition:all .2s}.quiz-option-card:hover:not(:disabled) .option-badge{background:#a855f7;color:#fff}.option-content{flex:1 1}.quiz-option-card.correct{background:#d1fae5;border-color:#10b981;color:#065f46}.quiz-option-card.correct .option-badge{background:#10b981;color:#fff}.quiz-option-card.wrong{background:#fee2e2;border-color:#ef4444;color:#991b1b}.quiz-option-card.wrong .option-badge{background:#ef4444;color:#fff}.result-check,.result-wrong{font-size:1.5rem;margin-left:auto}.result-check{color:#10b981}.result-wrong{color:#ef4444}.quiz-result-banner{display:flex;align-items:center;gap:1rem;padding:1.25rem;border-radius:12px;margin-top:.5rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);flex-direction:column;align-content:center;box-shadow:0 10px 30px rgba(0,0,0,.2)}.correct-banner{background:#d1fae5;border:2px solid #10b981}.wrong-banner{background:#fee2e2;border:2px solid #ef4444}.result-icon-circle{flex-shrink:0;width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem}.correct-banner .result-icon-circle{background:#10b981;color:#fff}.wrong-banner .result-icon-circle{background:#ef4444;color:#fff}.result-text{flex:1 1;text-align:center}.result-text h4{font-size:1.125rem;font-weight:700;margin:0 0 .25rem}.correct-banner .result-text h4{color:#065f46}.wrong-banner .result-text h4{color:#991b1b}.result-text p{font-size:.9375rem;margin:0}.correct-banner .result-text p{color:#047857}.wrong-banner .result-text p{color:#b91c1c}@media (max-width:768px){.quiz-card-white{padding:1.5rem}.quiz-question-text{font-size:1.125rem}.quiz-option-card{padding:.875rem 1rem;font-size:.9375rem}.option-badge{width:32px;height:32px;font-size:.875rem}.result-text h4{font-size:1rem}.result-text p{font-size:.875rem}}.dyk-story-container{width:100%;display:flex;flex-direction:column;gap:1.5rem}.dyk-header-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#f59e0b;color:#fff;border-radius:9999px;font-size:.875rem;font-weight:600;align-self:flex-start}.dyk-image-container{position:relative;width:100%;height:300px;border-radius:12px;overflow:hidden;background:#0f172a}.dyk-image{object-fit:cover}.dyk-content-box{background:#334155;border-radius:12px;padding:1.5rem}.dyk-title{font-size:1.5rem;font-weight:700;color:#fff;margin:0 0 1rem}.dyk-text{font-size:1.125rem;line-height:1.7;color:#e2e8f0;margin:0}.topic-link-story-container{width:100%;display:flex;flex-direction:column;gap:1.5rem;align-items:center}.topic-link-header-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#3b82f6;color:#fff;border-radius:9999px;font-size:.875rem;font-weight:600}.topic-link-content{width:100%;display:flex;flex-direction:column;align-items:center;gap:1.5rem}.topic-link-message{font-size:1.125rem;line-height:1.6;color:#e2e8f0;text-align:center;margin:0;padding:0 1rem}.topic-card-wrapper{perspective:1000px;width:100%;max-width:280px}.topic-card-rotated{position:relative;width:100%;aspect-ratio:4/3;transform:rotate(-3deg);border-radius:16px;overflow:hidden;box-shadow:0 20px 40px rgba(0,0,0,.4);border:4px solid #fff;background:#1e293b}.topic-card-image{width:100%;height:100%;object-fit:cover;display:block}.topic-card-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#334155,#1e293b)}.topic-card-placeholder i{font-size:4rem;color:#475569}.topic-info{text-align:center;max-width:280px;margin-bottom:1rem}.topic-name{font-size:1.25rem;font-weight:700;color:#fff;margin:0 0 .5rem;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.topic-category{font-size:.875rem;color:#94a3b8;margin:0;text-transform:uppercase;letter-spacing:.05em}.topic-cta-section{display:flex;flex-direction:column;align-items:center;gap:1rem;width:100%}.topic-cta-text{font-size:1rem;line-height:1.5;color:#cbd5e1;text-align:center;margin:0;padding:0 1rem;max-width:280px}.topic-view-btn{display:inline-flex;align-items:center;gap:.75rem;padding:1rem 2rem;background:#fff;color:#3b82f6;font-size:1rem;font-weight:700;border-radius:9999px;text-decoration:none;transition:all .2s;box-shadow:0 4px 12px rgba(59,130,246,.3)}.topic-view-btn:hover{background:#f1f5f9;transform:translateY(-2px);box-shadow:0 8px 20px rgba(59,130,246,.4)}.topic-link-error,.topic-link-loading{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:3rem 2rem;color:#94a3b8}.topic-link-error i,.topic-link-loading i{font-size:3rem}.topic-link-error{color:#ef4444}.thought-story-container{position:relative;width:100%;min-height:400px;display:flex;align-items:center;justify-content:center;background:#10b981;border-radius:12px;overflow:hidden}.thought-bg-image{position:absolute;inset:0}.bg-image{object-fit:cover}.thought-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.3),rgba(0,0,0,.7))}.thought-content-box{position:relative;z-index:10;padding:2rem;text-align:center}.thought-quote-icon{font-size:2.5rem;color:hsla(0,0%,100%,.8);margin-bottom:1rem}.thought-text{font-size:1.5rem;font-weight:600;line-height:1.5;color:#fff;margin:0}@media (max-width:768px){.story-modal-container{max-width:100%;height:100vh;max-height:100vh;border-radius:0}.story-content{padding:4rem 1rem 2rem}.quiz-question{font-size:1.125rem}.quiz-option-btn{padding:.875rem;font-size:.9375rem}.dyk-title{font-size:1.25rem}.dyk-text{font-size:1rem}.thought-text{font-size:1.25rem}}