code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.navbar{background-color:#fff;box-shadow:0 2px 4px #0000001a}.navbar-brand{color:#333;font-size:1.25rem}.navbar-nav a{color:#666;transition:color .3s ease}.navbar-nav a:hover{color:#007bff}.btn-primary{background-color:#333;border:none;border-radius:4px;color:#fff;cursor:pointer;font-weight:500;padding:.5rem 1rem;transition:background-color .3s ease}.btn-primary:hover{background-color:#555}.main-content{max-width:1200px;padding:4rem 2rem;text-align:center}.book-icon{align-items:center;border:3px solid #333;border-radius:8px;display:flex;height:80px;justify-content:center;margin:0 auto 2rem;position:relative;width:80px}.book-icon:after{background-color:#333;content:"";height:60%;position:absolute;width:2px}.welcome-title{color:#333;font-size:2.5rem;font-weight:700;margin-bottom:1rem}.subtitle{color:#666;font-size:1.5rem;margin-bottom:1rem}.description{color:#333;font-size:1.25rem;font-weight:600;margin-bottom:4rem}.learning-modules{grid-gap:3rem;gap:3rem;margin-top:4rem}.start-learning-btn{background-color:#f8f9fa;border:2px solid #ddd;border-radius:6px;color:#333;cursor:pointer;font-weight:500;gap:.5rem;padding:.75rem 1.5rem;transition:all .3s ease}.start-learning-btn:hover{background-color:#007bff;border-color:#007bff;color:#fff}.start-learning-btn:after{content:"→";font-weight:700}.motivation-text{color:#666;font-size:1.1rem;font-style:italic;margin-top:3rem}.motivation-text:after{content:"✨";margin-left:.5rem}@media (max-width:768px){.navbar{padding:1rem}.navbar,.navbar-nav{flex-direction:column;gap:1rem}.navbar-nav{text-align:center}.main-content{padding:2rem 1rem}.welcome-title{font-size:2rem}.subtitle{font-size:1.25rem}.learning-modules{gap:2rem;grid-template-columns:1fr;margin-top:2rem}.learning-card{padding:1.5rem}}@media (max-width:480px){.welcome-title{font-size:1.75rem}.description,.subtitle{font-size:1.1rem}}.writing-page-content{background:#0000!important;margin:0 auto;max-width:1200px;padding:1rem}.page-header{background:#0000!important;margin-bottom:2rem}.page-header h1{color:#333;font-size:2.5rem;font-weight:700;margin:0}.cards-grid{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(3,1fr);margin-bottom:3rem}.card{background-color:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;cursor:pointer;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease}.card:hover{box-shadow:0 8px 20px #00000026;transform:translateY(-4px)}.card-image{background-color:#e8f0f7;height:200px;position:relative;width:100%}.card-content{padding:1.5rem}.card-title{align-items:center;color:#333;display:flex;font-size:1.25rem;font-weight:600;gap:.5rem;margin:0 0 .5rem}.special-icon{font-size:1rem}.card-description{color:#666;font-size:.9rem;line-height:1.4;margin:0 0 1rem}.special-card{border:2px solid #007bff;position:relative}.special-card:before{background-color:#007bff;border-radius:4px;color:#fff;content:"推荐";font-size:.75rem;padding:4px 8px;position:absolute;right:12px;top:12px;z-index:1}.navbar-nav a.active{color:#007bff;font-weight:600}.navbar-brand{color:inherit}@media (max-width:768px){.writing-page-content{padding:1rem}.page-header h1{font-size:2rem}.cards-grid{gap:1.5rem;grid-template-columns:repeat(2,1fr)}.card-image{height:150px}.card-content{padding:1rem}}@media (max-width:480px){.cards-grid{gap:1rem;grid-template-columns:1fr}.page-header h1{font-size:1.75rem}}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#fefcf8,#f9f7f3);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0;min-height:100vh}.landing-page{background:#0000;min-height:100vh;overflow-x:hidden;position:relative}.bg-decoration{height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:0}.decoration-circle{animation:float 6s ease-in-out infinite;background:#9d89710d;border-radius:50%;position:absolute}.decoration-1{animation-delay:0s;height:12rem;right:10%;top:10%;width:12rem}.decoration-2{animation-delay:2s;background:#8a9ba80d;bottom:20%;height:8rem;left:5%;width:8rem}.decoration-triangle{animation:float 8s ease-in-out infinite;border-bottom:5rem solid #9d89710d;border-left:3rem solid #0000;border-right:3rem solid #0000;height:0;position:absolute;width:0}.decoration-3{animation-delay:4s;right:20%;top:60%}@keyframes float{0%,to{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-1rem) rotate(5deg)}}.main-content{background:#0000;gap:0;margin:0 auto;min-height:70vh;padding:1rem 0;position:relative;z-index:1}.hero-section,.main-content{align-items:center;display:flex;flex-direction:column}.hero-section{align-self:center;gap:2rem;padding:4rem 0;text-align:center;width:100%}.hero-icon-container{margin-bottom:1rem}.hero-icon,.hero-icon-container{display:flex;justify-content:center}.hero-icon{align-items:center;height:8rem;position:relative;width:8rem}.book-layers{height:100%;position:relative;width:100%}.book-layer{border-radius:.75rem;height:100%;position:absolute;width:100%}.layer-1{background:#b5651d;transform:translateZ(0) rotateY(-5deg)}.layer-2{background:#f0e4c8;height:95%;left:2.5%;top:2.5%;transform:translateX(-.25rem) translateY(.25rem) rotateY(-3deg);width:95%}.layer-3{background:#e6f2ff;height:90%;left:5%;top:5%;transform:translateX(-.5rem) translateY(.5rem) rotateY(-1deg);width:90%}.sparkle{animation:sparkle 2s ease-in-out infinite;color:gold;font-size:1.25rem;position:absolute}.sparkle-1{animation-delay:0s;right:.5rem;top:-.5rem}.sparkle-2{animation-delay:.7s;bottom:.5rem;left:-.5rem}.sparkle-3{animation-delay:1.4s;left:-1rem;top:1rem}@keyframes sparkle{0%,to{opacity:0;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}.hero-text{max-width:800px;text-align:center}.main-title{line-height:1.2;margin:0 0 2rem}.title-line-1,.title-line-2,.title-line-3{animation:slideInUp 1s ease-out forwards;display:block;opacity:0;transform:translateY(2rem)}.title-line-1{animation-delay:.1s;color:#6b7280;font-size:2.5rem;font-weight:300}.title-line-2{animation-delay:.3s;color:#cd7f32;font-size:3rem;font-weight:700}.title-line-3{animation-delay:.5s;color:#374151;font-size:2.25rem;font-weight:600}@keyframes slideInUp{to{opacity:1;transform:translateY(0)}}.subtitle-container{display:flex;gap:1.5rem;justify-content:center;margin-bottom:1.5rem}.credential-badge{align-items:center;background:#ffffffe6;border-radius:2rem;box-shadow:0 .25rem 1rem #9d89711a;color:#374151;display:flex;font-weight:600;gap:.5rem;padding:.75rem 1.25rem}.badge-icon{font-size:1.25rem}.hero-description{color:#6b7280;font-size:1.125rem;line-height:1.6;margin:0}.highlight-text{color:#9d8971;font-weight:600}.cards-wrapper{margin:0 auto;padding:0;width:100%}.cards-section{align-self:center;display:flex;flex-direction:column;gap:2rem;margin:0 auto;max-width:1400px;width:100%}.learning-modules{grid-gap:5rem;display:grid;gap:5rem;grid-template-columns:1fr 1fr}.learning-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border:2px solid #b5c4d126;border-radius:1.5rem;box-shadow:0 .5rem 2rem #b5c4d114;cursor:pointer;min-width:0;overflow:hidden;padding:5rem;position:relative;transition:all .4s cubic-bezier(.4,0,.2,1)}.learning-card:before{background:#b5c4d1;content:"";height:.25rem;left:0;position:absolute;right:0;top:0;transition:all .3s ease}.learning-card:hover{border-color:#b5c4d140;box-shadow:0 1.5rem 3rem #b5c4d126;transform:translateY(-.5rem) scale(1.02)}.card-header{align-items:center}.card-icon{background:#ffffffe6;border-radius:1rem;box-shadow:0 .25rem .5rem #b5c4d11a;font-size:2rem;padding:.75rem}.task1-icon,.task2-icon{background:#f7f9fb}.card-category{background:#fffc;border-radius:1rem;color:#6b7280;font-size:1.875rem;font-weight:600;padding:.375rem .75rem}.learning-card h3{color:#1f2937;font-size:2rem;font-weight:700;margin:0 0 .75rem}.learning-card p{color:#6b7280;font-size:1.25rem;line-height:1.6;margin:0 0 1.25rem}.card-features{display:flex;gap:.5rem;margin-bottom:1.5rem}.feature-tag{background:#b5c4d11f;border-radius:1rem;color:#8a9ba8;font-size:.85rem;font-weight:500;padding:.375rem .75rem}.start-learning-btn{align-items:center;background:linear-gradient(45deg,#8a9ba8,#b5c4d1);border:2px solid #0000;border-radius:2rem;box-shadow:0 .5rem 1rem #8a9ba840;color:#fff;display:inline-flex;font-size:1.5rem;font-weight:600;gap:1.5rem;overflow:hidden;padding:1.25rem 2.5rem;position:relative;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1)}.start-learning-btn:before{background:linear-gradient(90deg,#0000,#fff3,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s;width:100%}.start-learning-btn:hover:before{left:100%}.start-learning-btn:hover{border-color:#f5f0e8;box-shadow:0 .75rem 1.5rem #f5f0e8cc;transform:translateY(-.125rem)}.btn-arrow{transition:transform .3s ease}.start-learning-btn:hover .btn-arrow{transform:translateX(.25rem)}.motivation-section{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fff9;border-radius:1.5rem;margin:0 auto;max-width:600px;padding:2rem;text-align:center}.motivation-icon{animation:bounce 2s infinite;color:#b5c4d1;font-size:2rem;margin-bottom:1rem}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-.5rem)}60%{transform:translateY(-.25rem)}}.motivation-text{color:#4b5563;font-size:1.125rem;line-height:1.6;margin:0}.motivation-highlight{color:#b5651d;font-weight:600}@media (max-width:1024px){.learning-modules{gap:1.5rem;grid-template-columns:1fr}}@media (max-width:768px){.main-content{padding:0 1em}.cards-section,.hero-section{max-width:100%}.title-line-1{font-size:1.75rem}.title-line-2{font-size:2.25rem}.title-line-3{font-size:1.75rem}.subtitle-container{align-items:center;flex-direction:column;gap:1rem}.learning-card{padding:1.5rem}.hero-icon{height:6rem;width:6rem}}@media (max-width:480px){.title-line-1{font-size:1.5rem}.title-line-2{font-size:2rem}.title-line-3{font-size:1.5rem}.hero-description{font-size:1rem}.decoration-1,.decoration-2{display:none}}.auth-page{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;justify-content:center;min-height:100vh;padding:2rem}.auth-container{background:#fff;border-radius:1rem;box-shadow:0 2rem 4rem #00000026;max-width:28rem;padding:2.5rem;width:100%}.auth-header{margin-bottom:2rem;text-align:center}.auth-header h1{color:#1a202c;font-size:2rem;font-weight:700;margin-bottom:.5rem}.auth-header p{color:#718096;font-size:.95rem}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-size:.9rem}.form-group input{border:.125rem solid #e2e8f0}.error-message{align-items:center;background-color:#fff5f5;border:.0625rem solid #fc8181;border-radius:.5rem;color:#c53030;display:flex;font-size:.9rem;gap:.5rem;margin-bottom:1rem;padding:.75rem 1rem}.error-icon{font-size:1.1rem}.submit-btn{margin-top:1rem;padding:.875rem;transition:transform .2s,box-shadow .2s}.submit-btn:hover:not(:disabled){box-shadow:0 .625rem 1.25rem #667eea4d}.submit-btn:active:not(:disabled){transform:translateY(0)}.loading-spinner{display:inline-block}.auth-switch{border-top:.0625rem solid #e2e8f0;margin-top:1.5rem;padding-top:1.5rem;text-align:center}.auth-switch p{color:#718096;font-size:.9rem}.switch-btn{background:none;border:none;color:#667eea;cursor:pointer;font-weight:600;margin-left:.5rem;padding:0;transition:color .2s}.switch-btn:hover{color:#764ba2;text-decoration:underline}.forgot-password-link{margin-bottom:-.5rem;margin-top:.75rem;text-align:right}.link-btn{background:none;border:none;color:#667eea;cursor:pointer;font-size:.9rem;padding:0;text-decoration:none;transition:color .2s}.link-btn:hover{color:#764ba2;text-decoration:underline}.forgot-password-form{width:100%}.admin-whitelist-page{background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;padding:2rem}.admin-container{background:#fff;border-radius:1rem;box-shadow:0 1rem 3rem #0003;margin:0 auto;max-width:1400px;padding:2.5rem}.admin-container h1{color:#1a202c;font-size:2rem;margin-bottom:.5rem}.subtitle{color:#718096;font-size:1.1rem;margin-bottom:2.5rem}.add-email-section{background:linear-gradient(135deg,#f7fafc,#edf2f7);border:.125rem solid #e2e8f0;border-radius:.75rem;margin-bottom:2.5rem;padding:2rem}.add-email-section h2{color:#2d3748;font-size:1.35rem;margin-bottom:1.5rem}.form-row{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:1fr 1fr;margin-bottom:1.5rem}.form-group{display:flex;flex-direction:column}.form-group label{color:#2d3748;font-size:.95rem;font-weight:600;margin-bottom:.5rem}.form-group input{border:.125rem solid #cbd5e0;border-radius:.5rem;box-sizing:border-box;font-size:1rem;padding:.75rem 1rem;transition:all .2s;width:100%}.form-group input:focus{border-color:#667eea;box-shadow:0 0 0 .1875rem #667eea1a;outline:none}.submit-btn{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:.5rem;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:.875rem 2rem;transition:all .2s;width:100%}.submit-btn:hover:not(:disabled){box-shadow:0 .5rem 1rem #667eea4d;transform:translateY(-.125rem)}.submit-btn:disabled{cursor:not-allowed;opacity:.6}.email-list-section{margin-top:2.5rem}.section-header{margin-bottom:1.5rem}.section-header h2{color:#2d3748;font-size:1.35rem}.refresh-btn{background:#edf2f7;color:#2d3748;font-size:.9rem;padding:.625rem 1.25rem}.refresh-btn:hover:not(:disabled){background:#e2e8f0}.table-wrapper{border:.0625rem solid #e2e8f0;border-radius:.75rem;overflow-x:auto}.email-table{background:#fff;border-collapse:collapse;width:100%}.email-table th{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:.9rem;font-weight:600;letter-spacing:.05em;padding:1rem;text-align:left;text-transform:uppercase}.email-table td{border-bottom:.0625rem solid #e2e8f0;font-size:.95rem;padding:1rem}.email-table tbody tr:hover{background-color:#f7fafc}.email-table tbody tr:last-child td{border-bottom:none}.email-cell{color:#667eea;font-family:Monaco,Menlo,Courier New,monospace;font-weight:600}.note-cell{color:#718096;max-width:15rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status{border-radius:1rem;display:inline-block;font-size:.875rem;font-weight:600;padding:.375rem .875rem}.status.active{background-color:#c6f6d5;color:#22543d}.status.inactive{background-color:#fed7d7;color:#742a2a}.delete-btn{background-color:#e53e3e;font-size:.875rem;padding:.5rem 1rem}.delete-btn:hover:not(:disabled){background-color:#c53030;box-shadow:0 .25rem .5rem #e53e3e4d}.empty,.loading{color:#718096;font-size:1.1rem;padding:3rem;text-align:center}.empty p{margin:.5rem 0}.instructions{background:linear-gradient(135deg,#edf2f7,#e2e8f0);border-left:.25rem solid #667eea;border-radius:.75rem;margin-top:2.5rem;padding:2rem}.instructions h3{color:#2d3748;font-size:1.25rem;margin-bottom:1rem}.instructions ul{list-style:none;padding:0}.instructions li{color:#4a5568;font-size:1rem;line-height:1.6;padding:.75rem 0}.instructions strong{color:#2d3748;font-weight:600}@media (max-width:1024px){.form-row{grid-template-columns:1fr}}@media (max-width:768px){.admin-whitelist-page{padding:1rem}.admin-container{padding:1.5rem}.admin-container h1{font-size:1.5rem}.table-wrapper{font-size:.875rem}.email-table td,.email-table th{padding:.75rem .5rem}.section-header{align-items:flex-start;flex-direction:column;gap:1rem}.refresh-btn{width:100%}}.delete-topic-btn-standalone{background:#0000;border:none;border-radius:.125rem;color:#ef4444;cursor:pointer;font-size:.75rem;opacity:0;padding:.125rem;transition:opacity .2s}.topic-btn:hover .delete-topic-btn-standalone{opacity:1}.delete-topic-btn-standalone:hover{background:#fee2e2}.map-page{background:linear-gradient(135deg,#fff8e1,#fffbf0);min-height:100vh}.map-container{background-color:initial;min-height:100vh}.map-header{align-items:baseline;background-color:initial;display:flex;justify-content:space-between;padding:1.5rem 2rem 1rem}.map-title{color:#1f2937;font-size:2rem;font-weight:700;margin:0}.map-subtitle{color:#6b7280}.map-search-filter-bar{align-items:center;background-color:#fef7ed;border:.0625rem solid #fed7aa;border-radius:.75rem;box-shadow:0 .0625rem .125rem #0000000d;display:flex;gap:1rem;justify-content:space-between;margin:0 2rem 1.5rem;padding:1rem 2rem}.map-search-section{flex:1 1;max-width:25rem}.map-search-input-wrapper{align-items:center;display:flex;position:relative}.map-search-icon{color:#9ca3af;height:1rem;left:.75rem;position:absolute;top:50%;transform:translateY(-50%);width:1rem}.map-search-input{background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.375rem;font-size:.875rem;padding:.75rem .75rem .75rem 2.5rem;transition:border-color .2s ease,box-shadow .2s ease;width:100%}.map-search-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .1875rem #3b82f61a;outline:none}.map-filter-buttons{align-items:center;display:flex;gap:.75rem}.map-no-results{color:#6b7280;font-size:.875rem;padding:2rem 1rem;text-align:center}.map-status-filters{display:flex;gap:.375rem}.map-status-btn{align-items:center;background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.375rem;cursor:pointer;display:flex;font-size:.875rem;height:2rem;justify-content:center;transition:all .2s ease;width:2rem}.map-status-btn:hover{background-color:#f9fafb}.map-status-btn.active{background-color:#f3f4f6;border-color:#374151;transform:scale(1.1)}.map-main-content{align-items:flex-start;display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;gap:1.5rem;min-height:calc(100vh - 12rem);padding:1rem 2rem 2rem;width:100%}.map-left-sidebar{align-self:flex-start!important;background-color:#fef7ed;border:.0625rem solid #fed7aa;border-radius:.75rem;box-sizing:border-box;flex:0 0 160px!important;max-width:160px!important;min-width:160px!important;overflow:hidden;padding:1rem;position:relative!important;transition:all .3s ease;width:160px!important}.map-left-sidebar.collapsed{flex:0 0 80px!important;max-width:80px!important;min-width:80px!important;padding:1rem .5rem;width:80px!important}.map-left-sidebar.collapsed .map-task-item{justify-content:center;padding:.625rem .25rem}.map-left-sidebar.collapsed .map-task-label{display:none}.map-navigation-section{width:100%}.map-sidebar-header{align-items:center;border-bottom:.0625rem solid #fed7aa;display:flex;justify-content:space-between;margin-bottom:1rem;padding-bottom:.75rem}.map-sidebar-title{color:#92400e;font-size:1rem;font-weight:600;margin:0}.map-toggle-sidebar-btn{align-items:center;background-color:#f59e0b;border:none;border-radius:.25rem;color:#fff;cursor:pointer;display:flex;font-size:.875rem;height:1.75rem;justify-content:center;transition:all .2s ease;width:1.75rem}.map-toggle-sidebar-btn:hover{background-color:#d97706}.map-task-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem;margin-right:.5rem;max-height:calc(100vh - 300px);overflow-y:auto;padding-right:0;width:100%}.map-task-list::-webkit-scrollbar{width:.25rem}.map-task-list::-webkit-scrollbar-track{background:#fef3c7;border-radius:.125rem}.map-task-list::-webkit-scrollbar-thumb{background:#fbbf24;border-radius:.125rem}.map-task-item{align-items:center;background-color:#fff;border:.0625rem solid #fde68a;border-radius:.375rem;color:#92400e;cursor:pointer;display:flex;font-size:.875rem;gap:.5rem;overflow:visable;padding:.15rem .5rem;transition:all .2s ease}.map-task-item:hover{background-color:#fffbeb;border-color:#fbbf24}.map-task-item.selected{background-color:#fee2e2;border-color:#ef4444;box-shadow:0 .125rem .25rem #ef444433}.map-status-dot{flex-shrink:0;font-size:.75rem;line-height:1}.map-task-code{flex-shrink:0;font-size:.875rem;font-weight:600;white-space:nowrap}.map-task-label{font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.map-recent-practice{border-top:.0625rem solid #fed7aa;padding-top:1rem}.map-recent-title{color:#92400e;font-size:.9375rem;font-weight:600;margin-bottom:.75rem}.map-recent-list{display:flex;flex-direction:column;gap:.375rem}.map-recent-item{align-items:center;background-color:#fff;border:.0625rem solid #fde68a;border-radius:.375rem;display:flex;margin-bottom:.25rem;padding:.375rem .5rem;transition:all .2s ease}.map-recent-item:hover{background-color:#fffbeb;border-color:#fbbf24}.map-recent-dot{color:#d97706;font-weight:700;margin-right:.5rem}.map-recent-topic{color:#92400e;font-size:.8125rem;font-weight:500}.map-task-edit-group{align-items:center;display:flex;flex:1 1;gap:.25rem;min-width:0}.map-task-edit-input{background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.25rem;flex:1 1;font-size:.8125rem;min-width:0;padding:.25rem .375rem}.map-task-edit-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .125rem #3b82f61a;outline:none}.map-task-actions,.map-task-edit-buttons{display:flex;flex-shrink:0;gap:.125rem}.map-task-actions{flex-direction:column;margin-left:auto}.map-task-action-btn,.map-task-delete-btn{align-items:center;border:none;border-radius:.25rem;cursor:pointer;display:flex;flex-shrink:0;font-size:.625rem;height:1.25rem;justify-content:center;transition:all .2s ease;width:1.25rem}.map-task-action-btn{background-color:#3b82f6;color:#fff}.map-task-action-btn:hover:not(:disabled){background-color:#2563eb}.map-task-action-btn:disabled{background-color:#9ca3af;cursor:not-allowed;opacity:.5}.map-task-delete-btn{background-color:#ef4444;color:#fff}.map-task-delete-btn:hover{background-color:#dc2626}.map-add-task-btn{align-items:center;background-color:#10b981;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;font-size:.8125rem;font-weight:500;gap:.25rem;justify-content:center;margin-top:.5rem;padding:.5rem;transition:all .2s ease;width:100%}.map-add-task-btn:hover{background-color:#059669;transform:translateY(-.0625rem)}.map-middle-question-area{background-color:#fff;border-radius:.75rem;flex:0 0 550px;height:calc(100vh - 6rem);max-height:calc(100vh - 6rem);max-width:550px;min-width:550px;overflow-y:auto;padding:1.5rem;transition:all .3s ease;width:550px}.map-left-sidebar.collapsed~.map-middle-question-area{flex:0 0 600px;max-width:600px;min-width:600px;width:600px}.map-question-display{background:#fff;border-radius:.5rem;margin-bottom:1rem;padding:1.5rem}.map-question-header{margin-bottom:1.5rem}.map-question-title{color:#1f2937;font-size:1.05rem;font-weight:600;line-height:1.5;margin-bottom:1rem}.map-question-title.map-editable-text{display:block;margin:0 -1.5rem;padding:1rem 1.5rem}.map-question-meta{color:#6b7280;display:flex;font-size:.875rem;gap:1rem}.map-practice-info{color:#6b7280}.map-question-image-section{background-color:#fff;border:2px dashed #d1d5db;border-radius:.5rem;flex:1 1;margin-top:1.5rem;min-height:500px;overflow:hidden}.map-right-writing-area{background-color:#fff;border-radius:.75rem;display:flex;flex:1 1;flex-direction:column;height:calc(100vh - 6rem);max-height:calc(100vh - 6rem);min-width:0;overflow-y:auto;padding:0 1.5rem 1.5rem}.map-writing-workspace{display:flex;flex:1 1;flex-direction:column;padding-top:0}.map-writing-header{align-items:center;border-bottom:1px solid #e5e7eb;display:flex;gap:.5rem;justify-content:flex-end;margin-bottom:.5rem;margin-top:.5rem;padding-bottom:0;padding-top:0}.map-topic-breadcrumb{border-bottom:.0625rem solid #e5e7eb;justify-content:space-between;margin-bottom:0;padding-bottom:1rem}.map-breadcrumb-left,.map-topic-breadcrumb{align-items:center;display:flex}.map-breadcrumb-item{color:#6b7280;font-size:.875rem}.map-breadcrumb-item.active{color:#1f2937;font-weight:500}.map-breadcrumb-separator{color:#9ca3af;margin:0 .5rem}.map-welcome-content{color:#9ca3af}.map-welcome-content,.map-welcome-stats{align-items:center;display:flex;height:100%;justify-content:center}.map-quick-stats{display:flex;gap:2rem;justify-content:center}.map-stat-item{text-align:center}.map-stat-number{color:#3b82f6;display:block;font-size:2rem;font-weight:700;margin-bottom:.25rem}.map-stat-label{color:#6b7280;font-size:.875rem}.map-no-content{align-items:center;color:#9ca3af;display:flex;height:100%;justify-content:center}.map-clock-indicator{cursor:pointer;pointer-events:auto;position:relative;z-index:10}.map-tab-navigation{border-bottom:2px solid #e5e7eb;display:flex;margin-bottom:.5rem}.map-tab-btn{background:none;border:none;border-bottom:2px solid #0000;cursor:pointer;font-size:1rem;font-weight:600;padding:.75rem 1rem;transition:all .2s ease}.map-tab-btn:hover{background-color:#f8f9fa}.map-tab-btn.active{border-bottom-color:#3b82f6;color:#3b82f6;font-weight:700}.map-tab-content{min-height:20rem}.map-brainstorm-tab{padding:0}.map-brainstorm-input{border:1px solid #d1d5db;border-radius:.375rem;font-family:inherit;font-size:1rem;margin-bottom:.5rem;min-height:380px;padding:1rem;resize:vertical;width:100%}.map-brainstorm-stats{display:flex;justify-content:flex-end;margin-bottom:.5rem}.map-character-count{background-color:#f3f4f6;border-radius:.25rem;color:#6b7280;padding:.25rem .5rem}.map-prompt-questions{margin-top:1rem}.map-prompt-questions p{color:#374151;font-weight:600;margin-bottom:.5rem}.map-question-tags{display:flex;flex-wrap:wrap;gap:.5rem}.map-question-tag{background-color:initial;border:1px solid #d1d5db;border-radius:.25rem;color:#374151;font-size:.875rem;font-weight:500;padding:.25rem .5rem}.map-sample-tab,.map-task1-tab{padding:0}.map-sample-content-input,.map-task1-content-input{border:1px solid #d1d5db;border-radius:.375rem;box-sizing:border-box;font-family:inherit;font-size:1rem;line-height:1.5;min-height:50px;padding:1rem;resize:vertical;width:100%}.map-sample-content-input:focus,.map-task1-content-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .125rem #3b82f61a;outline:none}.map-sample-content-input[readonly]{background-color:#f9fafb;cursor:default}.map-sample-footer,.map-task1-footer{align-items:center;display:flex;font-size:.875rem;justify-content:flex-end;margin:.5rem 0}.map-add-card-section{border-bottom:.0625rem solid #e5e7eb;margin-bottom:1.5rem;padding-bottom:1rem}.map-add-card-btn{align-items:center;background-color:#10b981;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;font-size:.875rem;font-weight:500;gap:.5rem;padding:.75rem 1rem;transition:all .2s ease}.map-add-card-btn:hover{background-color:#059669;transform:translateY(-.0625rem)}.map-editable-text{word-wrap:break-word;border-radius:.25rem;cursor:pointer;padding:.125rem .25rem;transition:all .2s ease;white-space:pre-wrap}.map-editable-text:hover{background-color:#f3f4f6;color:#3b82f6}.map-delete-card-btn{align-items:center;background-color:#ef4444;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;height:2rem;justify-content:center;margin-left:.5rem;transition:all .2s ease;width:2rem}.map-delete-card-btn:hover{background-color:#dc2626;transform:scale(1.05)}.map-edit-input-group{align-items:center;display:flex;flex:1 1;gap:.5rem;max-width:none!important;min-width:0;width:100%!important}.map-edit-input{background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.25rem;flex:1 1;font-size:.875rem;min-width:0;min-width:200px;padding:.375rem .5rem;width:100%}.map-edit-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .125rem #3b82f61a;outline:none}.map-card-question-input{flex:1 1!important;font-size:.8rem!important;font-weight:600!important;line-height:1.4;max-width:none!important;min-height:2.5rem;min-width:400px!important;padding:.5rem .75rem!important;resize:vertical;width:100%!important}.map-edit-buttons{display:flex;gap:.25rem}.map-cancel-btn,.map-save-btn{align-items:center;border:none;border-radius:.25rem;cursor:pointer;display:flex;height:1.5rem;justify-content:center;transition:all .2s ease;width:1.5rem}.map-save-btn{background-color:#10b981;color:#fff}.map-save-btn:hover{background-color:#059669}.map-cancel-btn{background-color:#6b7280;color:#fff}.map-cancel-btn:hover{background-color:#4b5563}.map-image-display{align-items:center;background-color:#fff;display:flex;height:500px;justify-content:center;position:relative;width:100%}.map-image{cursor:pointer;max-height:100%;max-width:100%;object-fit:contain;transition:opacity .2s ease}.map-image:hover{opacity:.9}.map-image-controls{bottom:1rem;display:flex;gap:.5rem;position:absolute;right:1rem}.map-change-image-btn,.map-delete-image-btn{align-items:center;border:none;border-radius:.375rem;cursor:pointer;display:flex;font-size:.875rem;font-weight:500;gap:.25rem;padding:.5rem .75rem;transition:all .2s ease}.map-change-image-btn{background-color:#3b82f6;color:#fff}.map-change-image-btn:hover{background-color:#2563eb}.map-delete-image-btn{background-color:#ef4444;color:#fff}.map-delete-image-btn:hover{background-color:#dc2626}.map-image-placeholder{align-items:center;display:flex;justify-content:center;min-height:500px;padding:2rem}.map-add-image-btn{align-items:center;background-color:#10b981;border:none;border-radius:.5rem;color:#fff;cursor:pointer;display:flex;font-size:1rem;font-weight:500;gap:.5rem;padding:1rem 1.5rem;transition:all .2s ease}.map-add-image-btn:hover{background-color:#059669;transform:scale(1.05)}.map-no-image-text{color:#9ca3af;font-size:1rem}.map-image-upload-panel{max-width:500px;width:100%}.map-upload-mode-tabs{display:flex;gap:.5rem;margin-bottom:1rem}.map-mode-tab{background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;cursor:pointer;flex:1 1;font-weight:500;padding:.75rem;transition:all .2s ease}.map-mode-tab.active{background-color:#3b82f6;border-color:#3b82f6;color:#fff}.map-file-upload-group,.map-url-input-group{display:flex;flex-direction:column;gap:.75rem}.map-image-url-input{border:1px solid #d1d5db;border-radius:.375rem;font-size:.875rem;padding:.75rem;width:100%}.map-upload-buttons{display:flex;gap:.5rem}.map-file-input{display:none}.map-file-label{background-color:#3b82f6;border-radius:.375rem;color:#fff;cursor:pointer;display:block;font-weight:500;padding:.75rem 1rem;text-align:center;transition:all .2s ease}.map-file-label:hover{background-color:#2563eb}.map-image-modal{align-items:center;background-color:#000000f2;bottom:0;cursor:zoom-out;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}.map-modal-content{cursor:default;max-height:90vh;max-width:90vw;position:relative}.map-close-modal{align-items:center;background-color:#ffffff1a;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;height:2.5rem;justify-content:center;position:absolute;right:0;top:-3rem;transition:all .2s ease;width:2.5rem}.map-close-modal:hover{background-color:#fff3}.map-modal-image{max-height:90vh;max-width:90vw;object-fit:contain;transform-origin:center;transition:transform .2s ease}.map-zoom-controls{align-items:center;background-color:#ffffff1a;border-radius:.5rem;bottom:-3rem;display:flex;gap:1rem;left:50%;padding:.5rem 1rem;position:absolute;transform:translateX(-50%)}.map-zoom-controls button{background-color:#fff3;border:none;border-radius:.25rem;color:#fff;cursor:pointer;font-size:1.25rem;height:2rem;transition:all .2s ease;width:2rem}.map-zoom-controls button:hover{background-color:#ffffff4d}.map-zoom-controls span{color:#fff;font-weight:500;min-width:3rem;text-align:center}@media (max-width:768px){.map-main-content{flex-direction:column;gap:1rem}.map-left-sidebar{flex:none;max-width:none;min-width:auto;position:relative;top:0;width:100%}.map-search-filter-bar{align-items:stretch;flex-direction:column;gap:1rem}.map-filter-buttons{flex-wrap:wrap;justify-content:center}.map-tab-btn{font-size:.875rem;padding:.5rem .75rem}}.map-timer-btn{align-items:center;background:linear-gradient(135deg,#fbbf24,#f59e0b);border:none;border-radius:1.5rem;box-shadow:0 .125rem .5rem #fbbf244d;color:#fff;cursor:pointer;display:flex;font-size:.875rem;font-weight:600;gap:.375rem;padding:.625rem 1.25rem;transition:all .3s ease;white-space:nowrap}.map-timer-btn:hover{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 .25rem .75rem #fbbf2466;transform:translateY(-.125rem)}.map-timer-btn.timer-overtime{animation:pulse-glow 2s ease-in-out infinite;background:linear-gradient(135deg,#f87171,#ef4444)}.map-timer-btn.timer-overtime:hover{background:linear-gradient(135deg,#ef4444,#dc2626)}.flowchart-page{background:linear-gradient(135deg,#fff8e1,#fffbf0);min-height:100vh}.flowchart-container{background-color:initial;min-height:100vh}.flowchart-header{align-items:baseline;background-color:initial;display:flex;justify-content:space-between;padding:1.5rem 2rem 1rem}.flowchart-title{color:#1f2937;font-size:2rem;font-weight:700;margin:0}.flowchart-subtitle{color:#6b7280}.flowchart-search-filter-bar{align-items:center;background-color:#fef7ed;border:.0625rem solid #fed7aa;border-radius:.75rem;box-shadow:0 .0625rem .125rem #0000000d;display:flex;gap:1rem;justify-content:space-between;margin:0 2rem 1.5rem;padding:1rem 2rem}.flowchart-search-section{flex:1 1;max-width:25rem}.flowchart-search-input-wrapper{align-items:center;display:flex;position:relative}.flowchart-search-icon{color:#9ca3af;height:1rem;left:.75rem;position:absolute;top:50%;transform:translateY(-50%);width:1rem}.flowchart-search-input{background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.375rem;font-size:.875rem;padding:.75rem .75rem .75rem 2.5rem;transition:border-color .2s ease,box-shadow .2s ease;width:100%}.flowchart-search-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .1875rem #3b82f61a;outline:none}.flowchart-filter-buttons{align-items:center;display:flex;gap:.75rem}.flowchart-status-filters{display:flex;gap:.375rem}.flowchart-status-btn{align-items:center;background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.375rem;cursor:pointer;display:flex;font-size:.875rem;height:2rem;justify-content:center;transition:all .2s ease;width:2rem}.flowchart-status-btn:hover{background-color:#f9fafb}.flowchart-status-btn.active{background-color:#f3f4f6;border-color:#374151;transform:scale(1.1)}.flowchart-main-content{align-items:flex-start;display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;gap:1.5rem;min-height:calc(100vh - 12rem);padding:1rem 2rem 2rem;width:100%}.flowchart-left-sidebar{align-self:flex-start!important;background-color:#fef7ed;border:.0625rem solid #fed7aa;border-radius:.75rem;box-sizing:border-box;flex:0 0 160px!important;max-width:160px!important;min-width:160px!important;overflow:hidden;padding:1rem;position:relative!important;transition:all .3s ease;width:160px!important}.flowchart-left-sidebar.collapsed{flex:0 0 80px!important;max-width:80px!important;min-width:80px!important;padding:1rem .5rem;width:80px!important}.flowchart-left-sidebar.collapsed .flowchart-task-item{justify-content:center;padding:.625rem .25rem}.flowchart-left-sidebar.collapsed .flowchart-task-label{display:none}.flowchart-navigation-section{width:100%}.flowchart-sidebar-header{align-items:center;border-bottom:.0625rem solid #fed7aa;display:flex;justify-content:space-between;margin-bottom:1rem;padding-bottom:.75rem}.flowchart-sidebar-title{color:#92400e;font-size:1rem;font-weight:600;margin:0}.flowchart-toggle-sidebar-btn{align-items:center;background-color:#f59e0b;border:none;border-radius:.25rem;color:#fff;cursor:pointer;display:flex;font-size:.875rem;height:1.75rem;justify-content:center;transition:all .2s ease;width:1.75rem}.flowchart-toggle-sidebar-btn:hover{background-color:#d97706}.flowchart-task-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem;margin-right:.5rem;max-height:calc(100vh - 300px);overflow-y:auto;padding-right:0;width:100%}.flowchart-task-list::-webkit-scrollbar{width:.25rem}.flowchart-task-list::-webkit-scrollbar-track{background:#fef3c7;border-radius:.125rem}.flowchart-task-list::-webkit-scrollbar-thumb{background:#fbbf24;border-radius:.125rem}.flowchart-task-item{align-items:center;background-color:#fff;border:.0625rem solid #fde68a;border-radius:.375rem;color:#92400e;cursor:pointer;display:flex;font-size:.875rem;gap:.5rem;overflow:visable;padding:.15rem .5rem;transition:all .2s ease}.flowchart-task-item:hover{background-color:#fffbeb;border-color:#fbbf24}.flowchart-task-item.selected{background-color:#fee2e2;border-color:#ef4444;box-shadow:0 .125rem .25rem #ef444433}.flowchart-status-dot{flex-shrink:0;font-size:.75rem;line-height:1}.flowchart-task-code{flex-shrink:0;font-size:.875rem;font-weight:600;white-space:nowrap}.flowchart-task-label{font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.flowchart-recent-practice{border-top:.0625rem solid #fed7aa;padding-top:1rem}.flowchart-recent-title{color:#92400e;font-size:.9375rem;font-weight:600;margin-bottom:.75rem}.flowchart-recent-list{display:flex;flex-direction:column;gap:.375rem}.flowchart-recent-item{align-items:center;background-color:#fff;border:.0625rem solid #fde68a;border-radius:.375rem;display:flex;margin-bottom:.25rem;padding:.375rem .5rem;transition:all .2s ease}.flowchart-recent-item:hover{background-color:#fffbeb;border-color:#fbbf24}.flowchart-recent-dot{color:#d97706;font-weight:700;margin-right:.5rem}.flowchart-recent-topic{color:#92400e;font-size:.8125rem;font-weight:500}.flowchart-task-edit-group{align-items:center;display:flex;flex:1 1;gap:.25rem;min-width:0}.flowchart-task-edit-input{background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.25rem;flex:1 1;font-size:.8125rem;min-width:0;padding:.25rem .375rem}.flowchart-task-edit-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .125rem #3b82f61a;outline:none}.flowchart-task-actions,.flowchart-task-edit-buttons{display:flex;flex-shrink:0;gap:.125rem}.flowchart-task-actions{flex-direction:column;margin-left:auto}.flowchart-task-action-btn,.flowchart-task-delete-btn{align-items:center;border:none;border-radius:.25rem;cursor:pointer;display:flex;flex-shrink:0;font-size:.625rem;height:1.25rem;justify-content:center;transition:all .2s ease;width:1.25rem}.flowchart-task-action-btn{background-color:#3b82f6;color:#fff}.flowchart-task-action-btn:hover:not(:disabled){background-color:#2563eb}.flowchart-task-action-btn:disabled{background-color:#9ca3af;cursor:not-allowed;opacity:.5}.flowchart-task-delete-btn{background-color:#ef4444;color:#fff}.flowchart-task-delete-btn:hover{background-color:#dc2626}.flowchart-add-task-btn{align-items:center;background-color:#10b981;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;font-size:.8125rem;font-weight:500;gap:.25rem;justify-content:center;margin-top:.5rem;padding:.5rem;transition:all .2s ease;width:100%}.flowchart-add-task-btn:hover{background-color:#059669;transform:translateY(-.0625rem)}.flowchart-middle-question-area{background-color:#fff;border-radius:.75rem;flex:0 0 550px;height:calc(100vh - 6rem);max-height:calc(100vh - 6rem);max-width:550px;min-width:550px;overflow-y:auto;padding:1.5rem;transition:all .3s ease;width:550px}.flowchart-left-sidebar.collapsed~.flowchart-middle-question-area{flex:0 0 600px;max-width:600px;min-width:600px;width:600px}.flowchart-question-display{background:#fff;border-radius:.5rem;margin-bottom:1rem;padding:1.5rem}.flowchart-question-header{margin-bottom:1.5rem}.flowchart-question-title{color:#1f2937;font-size:1.05rem;font-weight:600;line-height:1.5;margin-bottom:1rem}.flowchart-question-title.flowchart-editable-text{display:block;margin:0 -1.5rem;padding:1rem 1.5rem}.flowchart-question-meta{color:#6b7280;display:flex;font-size:.875rem;gap:1rem}.flowchart-practice-info{color:#6b7280}.flowchart-question-image-section{background-color:#fff;border:2px dashed #d1d5db;border-radius:.5rem;flex:1 1;margin-top:1.5rem;min-height:500px;overflow:hidden}.flowchart-right-writing-area{background-color:#fff;border-radius:.75rem;display:flex;flex:1 1;flex-direction:column;height:calc(100vh - 6rem);max-height:calc(100vh - 6rem);min-width:0;overflow-y:auto;padding:0 1.5rem 1.5rem}.flowchart-writing-workspace{display:flex;flex:1 1;flex-direction:column;padding-top:0}.flowchart-writing-header{align-items:center;border-bottom:1px solid #e5e7eb;display:flex;gap:.5rem;justify-content:flex-end;margin-bottom:.5rem;margin-top:.5rem;padding-bottom:0;padding-top:0}.flowchart-topic-breadcrumb{border-bottom:.0625rem solid #e5e7eb;justify-content:space-between;margin-bottom:0;padding-bottom:1rem}.flowchart-breadcrumb-left,.flowchart-topic-breadcrumb{align-items:center;display:flex}.flowchart-breadcrumb-item{color:#6b7280;font-size:.875rem}.flowchart-breadcrumb-item.active{color:#1f2937;font-weight:500}.flowchart-breadcrumb-separator{color:#9ca3af;margin:0 .5rem}.flowchart-welcome-content{color:#9ca3af}.flowchart-welcome-content,.flowchart-welcome-stats{align-items:center;display:flex;height:100%;justify-content:center}.flowchart-quick-stats{display:flex;gap:2rem;justify-content:center}.flowchart-stat-item{text-align:center}.flowchart-stat-number{color:#3b82f6;display:block;font-size:2rem;font-weight:700;margin-bottom:.25rem}.flowchart-stat-label{color:#6b7280;font-size:.875rem}.flowchart-no-content{align-items:center;color:#9ca3af;display:flex;height:100%;justify-content:center}.flowchart-clock-indicator{cursor:pointer;pointer-events:auto;position:relative;z-index:10}.flowchart-tab-navigation{border-bottom:2px solid #e5e7eb;display:flex;margin-bottom:.5rem}.flowchart-tab-btn{background:none;border:none;border-bottom:2px solid #0000;cursor:pointer;font-size:1rem;font-weight:600;padding:.75rem 1rem;transition:all .2s ease}.flowchart-tab-btn:hover{background-color:#f8f9fa}.flowchart-tab-btn.active{border-bottom-color:#3b82f6;color:#3b82f6;font-weight:700}.flowchart-tab-content{min-height:20rem}.flowchart-brainstorm-tab{padding:0}.flowchart-brainstorm-input{border:1px solid #d1d5db;border-radius:.375rem;font-family:inherit;font-size:1rem;margin-bottom:.5rem;min-height:380px;padding:1rem;resize:vertical;width:100%}.flowchart-brainstorm-stats{display:flex;justify-content:flex-end;margin-bottom:.5rem}.flowchart-character-count{background-color:#f3f4f6;border-radius:.25rem;color:#6b7280;padding:.25rem .5rem}.flowchart-prompt-questions{margin-top:1rem}.flowchart-prompt-questions p{color:#374151;font-weight:600;margin-bottom:.5rem}.flowchart-question-tags{display:flex;flex-wrap:wrap;gap:.5rem}.flowchart-question-tag{background-color:initial;border:1px solid #d1d5db;border-radius:.25rem;color:#374151;font-size:.875rem;font-weight:500;padding:.25rem .5rem}.flowchart-sample-tab,.flowchart-task1-tab{padding:0}.flowchart-sample-content-input,.flowchart-task1-content-input{border:1px solid #d1d5db;border-radius:.375rem;box-sizing:border-box;font-family:inherit;font-size:1rem;line-height:1.5;min-height:50px;padding:1rem;resize:vertical;width:100%}.flowchart-sample-content-input:focus,.flowchart-task1-content-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .125rem #3b82f61a;outline:none}.flowchart-sample-content-input[readonly]{background-color:#f9fafb;cursor:default}.flowchart-sample-footer,.flowchart-task1-footer{align-items:center;display:flex;font-size:.875rem;justify-content:flex-end;margin:.5rem 0}.flowchart-add-card-section{border-bottom:.0625rem solid #e5e7eb;margin-bottom:1.5rem;padding-bottom:1rem}.flowchart-add-card-btn{align-items:center;background-color:#10b981;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;font-size:.875rem;font-weight:500;gap:.5rem;padding:.75rem 1rem;transition:all .2s ease}.flowchart-add-card-btn:hover{background-color:#059669;transform:translateY(-.0625rem)}.flowchart-editable-text{word-wrap:break-word;border-radius:.25rem;cursor:pointer;padding:.125rem .25rem;transition:all .2s ease;white-space:pre-wrap}.flowchart-editable-text:hover{background-color:#f3f4f6;color:#3b82f6}.flowchart-delete-card-btn{align-items:center;background-color:#ef4444;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;height:2rem;justify-content:center;margin-left:.5rem;transition:all .2s ease;width:2rem}.flowchart-delete-card-btn:hover{background-color:#dc2626;transform:scale(1.05)}.flowchart-edit-input-group{align-items:center;display:flex;flex:1 1;gap:.5rem;max-width:none!important;min-width:0;width:100%!important}.flowchart-edit-input{background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.25rem;flex:1 1;font-size:.875rem;min-width:0;min-width:200px;padding:.375rem .5rem;width:100%}.flowchart-edit-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .125rem #3b82f61a;outline:none}.flowchart-card-question-input{flex:1 1!important;font-size:.8rem!important;font-weight:600!important;line-height:1.4;max-width:none!important;min-height:2.5rem;min-width:400px!important;padding:.5rem .75rem!important;resize:vertical;width:100%!important}.flowchart-edit-buttons{display:flex;gap:.25rem}.flowchart-cancel-btn,.flowchart-save-btn{align-items:center;border:none;border-radius:.25rem;cursor:pointer;display:flex;height:1.5rem;justify-content:center;transition:all .2s ease;width:1.5rem}.flowchart-save-btn{background-color:#10b981;color:#fff}.flowchart-save-btn:hover{background-color:#059669}.flowchart-cancel-btn{background-color:#6b7280;color:#fff}.flowchart-cancel-btn:hover{background-color:#4b5563}.flowchart-image-display{align-items:center;background-color:#fff;display:flex;height:500px;justify-content:center;position:relative;width:100%}.flowchart-image{cursor:pointer;max-height:100%;max-width:100%;object-fit:contain;transition:opacity .2s ease}.flowchart-image:hover{opacity:.9}.flowchart-image-controls{bottom:1rem;display:flex;gap:.5rem;position:absolute;right:1rem}.flowchart-change-image-btn,.flowchart-delete-image-btn{align-items:center;border:none;border-radius:.375rem;cursor:pointer;display:flex;font-size:.875rem;font-weight:500;gap:.25rem;padding:.5rem .75rem;transition:all .2s ease}.flowchart-change-image-btn{background-color:#3b82f6;color:#fff}.flowchart-change-image-btn:hover{background-color:#2563eb}.flowchart-delete-image-btn{background-color:#ef4444;color:#fff}.flowchart-delete-image-btn:hover{background-color:#dc2626}.flowchart-image-placeholder{align-items:center;display:flex;justify-content:center;min-height:500px;padding:2rem}.flowchart-add-image-btn{align-items:center;background-color:#10b981;border:none;border-radius:.5rem;color:#fff;cursor:pointer;display:flex;font-size:1rem;font-weight:500;gap:.5rem;padding:1rem 1.5rem;transition:all .2s ease}.flowchart-add-image-btn:hover{background-color:#059669;transform:scale(1.05)}.flowchart-no-image-text{color:#9ca3af;font-size:1rem}.flowchart-image-upload-panel{max-width:500px;width:100%}.flowchart-upload-mode-tabs{display:flex;gap:.5rem;margin-bottom:1rem}.flowchart-mode-tab{background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;cursor:pointer;flex:1 1;font-weight:500;padding:.75rem;transition:all .2s ease}.flowchart-mode-tab.active{background-color:#3b82f6;border-color:#3b82f6;color:#fff}.flowchart-file-upload-group,.flowchart-url-input-group{display:flex;flex-direction:column;gap:.75rem}.flowchart-image-url-input{border:1px solid #d1d5db;border-radius:.375rem;font-size:.875rem;padding:.75rem;width:100%}.flowchart-upload-buttons{display:flex;gap:.5rem}.flowchart-file-input{display:none}.flowchart-file-label{background-color:#3b82f6;border-radius:.375rem;color:#fff;cursor:pointer;display:block;font-weight:500;padding:.75rem 1rem;text-align:center;transition:all .2s ease}.flowchart-file-label:hover{background-color:#2563eb}.flowchart-image-modal{align-items:center;background-color:#000000f2;bottom:0;cursor:zoom-out;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}.flowchart-modal-content{cursor:default;max-height:90vh;max-width:90vw;position:relative}.flowchart-close-modal{align-items:center;background-color:#ffffff1a;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;height:2.5rem;justify-content:center;position:absolute;right:0;top:-3rem;transition:all .2s ease;width:2.5rem}.flowchart-close-modal:hover{background-color:#fff3}.flowchart-modal-image{max-height:90vh;max-width:90vw;object-fit:contain;transform-origin:center;transition:transform .2s ease}.flowchart-zoom-controls{align-items:center;background-color:#ffffff1a;border-radius:.5rem;bottom:-3rem;display:flex;gap:1rem;left:50%;padding:.5rem 1rem;position:absolute;transform:translateX(-50%)}.flowchart-zoom-controls button{background-color:#fff3;border:none;border-radius:.25rem;color:#fff;cursor:pointer;font-size:1.25rem;height:2rem;transition:all .2s ease;width:2rem}.flowchart-zoom-controls button:hover{background-color:#ffffff4d}.flowchart-zoom-controls span{color:#fff;font-weight:500;min-width:3rem;text-align:center}@media (max-width:768px){.flowchart-main-content{flex-direction:column;gap:1rem}.flowchart-left-sidebar{flex:none;max-width:none;min-width:auto;position:relative;top:0;width:100%}.flowchart-search-filter-bar{align-items:stretch;flex-direction:column;gap:1rem}.flowchart-no-results{color:#6b7280;font-size:.875rem;padding:2rem 1rem;text-align:center}.flowchart-no-results p{margin:0}.flowchart-filter-buttons{flex-wrap:wrap;justify-content:center}.flowchart-tab-btn{font-size:.875rem;padding:.5rem .75rem}}.flowchart-timer-btn{align-items:center;background:linear-gradient(135deg,#fbbf24,#f59e0b);border:none;border-radius:1.5rem;box-shadow:0 .125rem .5rem #fbbf244d;color:#fff;cursor:pointer;display:flex;font-size:.875rem;font-weight:600;gap:.375rem;padding:.625rem 1.25rem;transition:all .3s ease;white-space:nowrap}.flowchart-timer-btn:hover{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 .25rem .75rem #fbbf2466;transform:translateY(-.125rem)}.flowchart-timer-btn.timer-overtime{animation:pulse-glow 2s ease-in-out infinite;background:linear-gradient(135deg,#f87171,#ef4444)}.flowchart-timer-btn.timer-overtime:hover{background:linear-gradient(135deg,#ef4444,#dc2626)}.chart-page{background:linear-gradient(135deg,#fff8e1,#fffbf0);min-height:100vh}.chart-container{background-color:initial;min-height:100vh}.chart-header{align-items:baseline;background-color:initial;display:flex;justify-content:space-between;padding:1.5rem 2rem 1rem}.chart-title{color:#1f2937;font-size:2rem;font-weight:700;margin:0}.chart-subtitle{color:#6b7280}.chart-search-filter-bar{align-items:center;background-color:#fef7ed;border:.0625rem solid #fed7aa;border-radius:.75rem;box-shadow:0 .0625rem .125rem #0000000d;display:flex;gap:1rem;justify-content:space-between;margin:0 2rem 1.5rem;padding:1rem 2rem}.chart-search-section{flex:1 1;max-width:25rem}.chart-search-input-wrapper{align-items:center;display:flex;position:relative}.chart-search-icon{color:#9ca3af;height:1rem;left:.75rem;position:absolute;top:50%;transform:translateY(-50%);width:1rem}.chart-search-input{background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.375rem;font-size:.875rem;padding:.75rem .75rem .75rem 2.5rem;transition:border-color .2s ease,box-shadow .2s ease;width:100%}.chart-search-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .1875rem #3b82f61a;outline:none}.chart-filter-buttons{align-items:center;display:flex;gap:.75rem}.chart-no-results{color:#6b7280;font-size:.875rem;padding:2rem 1rem;text-align:center}.chart-no-results p{margin:0}.chart-status-filters{display:flex;gap:.375rem}.chart-status-btn{align-items:center;background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.375rem;cursor:pointer;display:flex;font-size:.875rem;height:2rem;justify-content:center;transition:all .2s ease;width:2rem}.chart-status-btn:hover{background-color:#f9fafb}.chart-status-btn.active{background-color:#f3f4f6;border-color:#374151;transform:scale(1.1)}.chart-main-content{align-items:flex-start;display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;gap:1.5rem;min-height:calc(100vh - 12rem);padding:1rem 2rem 2rem;width:100%}.chart-left-sidebar{align-self:flex-start!important;background-color:#fef7ed;border:.0625rem solid #fed7aa;border-radius:.75rem;box-sizing:border-box;flex:0 0 160px!important;max-width:160px!important;min-width:160px!important;overflow:hidden;padding:1rem;position:relative!important;transition:all .3s ease;width:160px!important}.chart-left-sidebar.collapsed{flex:0 0 80px!important;max-width:80px!important;min-width:80px!important;padding:1rem .5rem;width:80px!important}.chart-left-sidebar.collapsed .chart-task-item{justify-content:center;padding:.625rem .25rem}.chart-left-sidebar.collapsed .chart-task-label{display:none}.chart-navigation-section{width:100%}.chart-sidebar-header{align-items:center;border-bottom:.0625rem solid #fed7aa;display:flex;justify-content:space-between;margin-bottom:1rem;padding-bottom:.75rem}.chart-sidebar-title{color:#92400e;font-size:1rem;font-weight:600;margin:0}.chart-toggle-sidebar-btn{align-items:center;background-color:#f59e0b;border:none;border-radius:.25rem;color:#fff;cursor:pointer;display:flex;font-size:.875rem;height:1.75rem;justify-content:center;transition:all .2s ease;width:1.75rem}.chart-toggle-sidebar-btn:hover{background-color:#d97706}.chart-task-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem;margin-right:.5rem;max-height:calc(100vh - 300px);overflow-y:auto;padding-right:0;width:100%}.chart-task-list::-webkit-scrollbar{width:.25rem}.chart-task-list::-webkit-scrollbar-track{background:#fef3c7;border-radius:.125rem}.chart-task-list::-webkit-scrollbar-thumb{background:#fbbf24;border-radius:.125rem}.chart-task-item{align-items:center;background-color:#fff;border:.0625rem solid #fde68a;border-radius:.375rem;color:#92400e;cursor:pointer;display:flex;font-size:.875rem;gap:.5rem;overflow:visable;padding:.15rem .5rem;transition:all .2s ease}.chart-task-item:hover{background-color:#fffbeb;border-color:#fbbf24}.chart-task-item.selected{background-color:#fee2e2;border-color:#ef4444;box-shadow:0 .125rem .25rem #ef444433}.chart-status-dot{flex-shrink:0;font-size:.75rem;line-height:1}.chart-task-code{flex-shrink:0;font-size:.875rem;font-weight:600;white-space:nowrap}.chart-task-label{font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chart-recent-practice{border-top:.0625rem solid #fed7aa;padding-top:1rem}.chart-recent-title{color:#92400e;font-size:.9375rem;font-weight:600;margin-bottom:.75rem}.chart-recent-list{display:flex;flex-direction:column;gap:.375rem}.chart-recent-item{align-items:center;background-color:#fff;border:.0625rem solid #fde68a;border-radius:.375rem;display:flex;margin-bottom:.25rem;padding:.375rem .5rem;transition:all .2s ease}.chart-recent-item:hover{background-color:#fffbeb;border-color:#fbbf24}.chart-recent-dot{color:#d97706;font-weight:700;margin-right:.5rem}.chart-recent-topic{color:#92400e;font-size:.8125rem;font-weight:500}.chart-task-edit-group{align-items:center;display:flex;flex:1 1;gap:.25rem;min-width:0}.chart-task-edit-input{background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.25rem;flex:1 1;font-size:.8125rem;min-width:0;padding:.25rem .375rem}.chart-task-edit-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .125rem #3b82f61a;outline:none}.chart-task-actions,.chart-task-edit-buttons{display:flex;flex-shrink:0;gap:.125rem}.chart-task-actions{flex-direction:column;margin-left:auto}.chart-task-action-btn,.chart-task-delete-btn{align-items:center;border:none;border-radius:.25rem;cursor:pointer;display:flex;flex-shrink:0;font-size:.625rem;height:1.25rem;justify-content:center;transition:all .2s ease;width:1.25rem}.chart-task-action-btn{background-color:#3b82f6;color:#fff}.chart-task-action-btn:hover:not(:disabled){background-color:#2563eb}.chart-task-action-btn:disabled{background-color:#9ca3af;cursor:not-allowed;opacity:.5}.chart-task-delete-btn{background-color:#ef4444;color:#fff}.chart-task-delete-btn:hover{background-color:#dc2626}.chart-add-task-btn{align-items:center;background-color:#10b981;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;font-size:.8125rem;font-weight:500;gap:.25rem;justify-content:center;margin-top:.5rem;padding:.5rem;transition:all .2s ease;width:100%}.chart-add-task-btn:hover{background-color:#059669;transform:translateY(-.0625rem)}.chart-middle-question-area{background-color:#fff;border-radius:.75rem;flex:0 0 550px;height:calc(100vh - 6rem);max-height:calc(100vh - 6rem);max-width:550px;min-width:550px;overflow-y:auto;padding:1.5rem;transition:all .3s ease;width:550px}.chart-left-sidebar.collapsed~.chart-middle-question-area{flex:0 0 600px;max-width:600px;min-width:600px;width:600px}.chart-question-display{background:#fff;border-radius:.5rem;margin-bottom:1rem;padding:1.5rem}.chart-question-header{margin-bottom:1.5rem}.chart-question-title{color:#1f2937;font-size:1.05rem;font-weight:600;line-height:1.5;margin-bottom:1rem}.chart-question-title.chart-editable-text{display:block;margin:0 -1.5rem;padding:1rem 1.5rem}.chart-question-meta{color:#6b7280;display:flex;font-size:.875rem;gap:1rem}.chart-practice-info{color:#6b7280}.chart-question-image-section{background-color:#fff;border:2px dashed #d1d5db;border-radius:.5rem;flex:1 1;margin-top:1.5rem;min-height:500px;overflow:hidden}.chart-right-writing-area{background-color:#fff;border-radius:.75rem;display:flex;flex:1 1;flex-direction:column;height:calc(100vh - 6rem);max-height:calc(100vh - 6rem);min-width:0;overflow-y:auto;padding:0 1.5rem 1.5rem}.chart-writing-workspace{display:flex;flex:1 1;flex-direction:column;padding-top:0}.chart-writing-header{align-items:center;border-bottom:1px solid #e5e7eb;display:flex;gap:.5rem;justify-content:flex-end;margin-bottom:.5rem;margin-top:.5rem;padding-bottom:0;padding-top:0}.chart-topic-breadcrumb{border-bottom:.0625rem solid #e5e7eb;justify-content:space-between;margin-bottom:0;padding-bottom:1rem}.chart-breadcrumb-left,.chart-topic-breadcrumb{align-items:center;display:flex}.chart-breadcrumb-item{color:#6b7280;font-size:.875rem}.chart-breadcrumb-item.active{color:#1f2937;font-weight:500}.chart-breadcrumb-separator{color:#9ca3af;margin:0 .5rem}.chart-welcome-content{color:#9ca3af}.chart-welcome-content,.chart-welcome-stats{align-items:center;display:flex;height:100%;justify-content:center}.chart-quick-stats{display:flex;gap:2rem;justify-content:center}.chart-stat-item{text-align:center}.chart-stat-number{color:#3b82f6;display:block;font-size:2rem;font-weight:700;margin-bottom:.25rem}.chart-stat-label{color:#6b7280;font-size:.875rem}.chart-no-content{align-items:center;color:#9ca3af;display:flex;height:100%;justify-content:center}.chart-clock-indicator{cursor:pointer;pointer-events:auto;position:relative;z-index:10}.chart-tab-navigation{border-bottom:2px solid #e5e7eb;display:flex;margin-bottom:.5rem}.chart-tab-btn{background:none;border:none;border-bottom:2px solid #0000;cursor:pointer;font-size:1rem;font-weight:600;padding:.75rem 1rem;transition:all .2s ease}.chart-tab-btn:hover{background-color:#f8f9fa}.chart-tab-btn.active{border-bottom-color:#3b82f6;color:#3b82f6;font-weight:700}.chart-tab-content{min-height:20rem}.chart-brainstorm-tab{padding:0}.chart-brainstorm-input{border:1px solid #d1d5db;border-radius:.375rem;font-family:inherit;font-size:1rem;margin-bottom:.5rem;min-height:380px;padding:1rem;resize:vertical;width:100%}.chart-brainstorm-stats{display:flex;justify-content:flex-end;margin-bottom:.5rem}.chart-character-count{background-color:#f3f4f6;border-radius:.25rem;color:#6b7280;padding:.25rem .5rem}.chart-prompt-questions{margin-top:1rem}.chart-prompt-questions p{color:#374151;font-weight:600;margin-bottom:.5rem}.chart-question-tags{display:flex;flex-wrap:wrap;gap:.5rem}.chart-question-tag{background-color:initial;border:1px solid #d1d5db;border-radius:.25rem;color:#374151;font-size:.875rem;font-weight:500;padding:.25rem .5rem}.chart-sample-tab,.chart-task1-tab{padding:0}.chart-sample-content-input,.chart-task1-content-input{border:1px solid #d1d5db;border-radius:.375rem;box-sizing:border-box;font-family:inherit;font-size:1rem;line-height:1.5;min-height:50px;padding:1rem;resize:vertical;width:100%}.chart-sample-content-input:focus,.chart-task1-content-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .125rem #3b82f61a;outline:none}.chart-sample-content-input[readonly]{background-color:#f9fafb;cursor:default}.chart-sample-footer,.chart-task1-footer{align-items:center;display:flex;font-size:.875rem;justify-content:flex-end;margin:.5rem 0}.chart-add-card-section{border-bottom:.0625rem solid #e5e7eb;margin-bottom:1.5rem;padding-bottom:1rem}.chart-add-card-btn{align-items:center;background-color:#10b981;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;font-size:.875rem;font-weight:500;gap:.5rem;padding:.75rem 1rem;transition:all .2s ease}.chart-add-card-btn:hover{background-color:#059669;transform:translateY(-.0625rem)}.chart-editable-text{word-wrap:break-word;border-radius:.25rem;cursor:pointer;padding:.125rem .25rem;transition:all .2s ease;white-space:pre-wrap}.chart-editable-text:hover{background-color:#f3f4f6;color:#3b82f6}.chart-delete-card-btn{align-items:center;background-color:#ef4444;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;height:2rem;justify-content:center;margin-left:.5rem;transition:all .2s ease;width:2rem}.chart-delete-card-btn:hover{background-color:#dc2626;transform:scale(1.05)}.chart-edit-input-group{align-items:center;display:flex;flex:1 1;gap:.5rem;max-width:none!important;min-width:0;width:100%!important}.chart-edit-input{background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.25rem;flex:1 1;font-size:.875rem;min-width:0;min-width:200px;padding:.375rem .5rem;width:100%}.chart-edit-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .125rem #3b82f61a;outline:none}.chart-card-question-input{flex:1 1!important;font-size:.8rem!important;font-weight:600!important;line-height:1.4;max-width:none!important;min-height:2.5rem;min-width:400px!important;padding:.5rem .75rem!important;resize:vertical;width:100%!important}.chart-edit-buttons{display:flex;gap:.25rem}.chart-cancel-btn,.chart-save-btn{align-items:center;border:none;border-radius:.25rem;cursor:pointer;display:flex;height:1.5rem;justify-content:center;transition:all .2s ease;width:1.5rem}.chart-save-btn{background-color:#10b981;color:#fff}.chart-save-btn:hover{background-color:#059669}.chart-cancel-btn{background-color:#6b7280;color:#fff}.chart-cancel-btn:hover{background-color:#4b5563}.chart-image-display{align-items:center;background-color:#fff;display:flex;height:500px;justify-content:center;position:relative;width:100%}.chart-image{cursor:pointer;max-height:100%;max-width:100%;object-fit:contain;transition:opacity .2s ease}.chart-image:hover{opacity:.9}.chart-image-controls{bottom:1rem;display:flex;gap:.5rem;position:absolute;right:1rem}.chart-change-image-btn,.chart-delete-image-btn{align-items:center;border:none;border-radius:.375rem;cursor:pointer;display:flex;font-size:.875rem;font-weight:500;gap:.25rem;padding:.5rem .75rem;transition:all .2s ease}.chart-change-image-btn{background-color:#3b82f6;color:#fff}.chart-change-image-btn:hover{background-color:#2563eb}.chart-delete-image-btn{background-color:#ef4444;color:#fff}.chart-delete-image-btn:hover{background-color:#dc2626}.chart-image-placeholder{align-items:center;display:flex;justify-content:center;min-height:500px;padding:2rem}.chart-add-image-btn{align-items:center;background-color:#10b981;border:none;border-radius:.5rem;color:#fff;cursor:pointer;display:flex;font-size:1rem;font-weight:500;gap:.5rem;padding:1rem 1.5rem;transition:all .2s ease}.chart-add-image-btn:hover{background-color:#059669;transform:scale(1.05)}.chart-no-image-text{color:#9ca3af;font-size:1rem}.chart-image-upload-panel{max-width:500px;width:100%}.chart-upload-mode-tabs{display:flex;gap:.5rem;margin-bottom:1rem}.chart-mode-tab{background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;cursor:pointer;flex:1 1;font-weight:500;padding:.75rem;transition:all .2s ease}.chart-mode-tab.active{background-color:#3b82f6;border-color:#3b82f6;color:#fff}.chart-file-upload-group,.chart-url-input-group{display:flex;flex-direction:column;gap:.75rem}.chart-image-url-input{border:1px solid #d1d5db;border-radius:.375rem;font-size:.875rem;padding:.75rem;width:100%}.chart-upload-buttons{display:flex;gap:.5rem}.chart-file-input{display:none}.chart-file-label{background-color:#3b82f6;border-radius:.375rem;color:#fff;cursor:pointer;display:block;font-weight:500;padding:.75rem 1rem;text-align:center;transition:all .2s ease}.chart-file-label:hover{background-color:#2563eb}.chart-image-modal{align-items:center;background-color:#000000f2;bottom:0;cursor:zoom-out;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}.chart-modal-content{cursor:default;max-height:90vh;max-width:90vw;position:relative}.chart-close-modal{align-items:center;background-color:#ffffff1a;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;height:2.5rem;justify-content:center;position:absolute;right:0;top:-3rem;transition:all .2s ease;width:2.5rem}.chart-close-modal:hover{background-color:#fff3}.chart-modal-image{max-height:90vh;max-width:90vw;object-fit:contain;transform-origin:center;transition:transform .2s ease}.chart-zoom-controls{align-items:center;background-color:#ffffff1a;border-radius:.5rem;bottom:-3rem;display:flex;gap:1rem;left:50%;padding:.5rem 1rem;position:absolute;transform:translateX(-50%)}.chart-zoom-controls button{background-color:#fff3;border:none;border-radius:.25rem;color:#fff;cursor:pointer;font-size:1.25rem;height:2rem;transition:all .2s ease;width:2rem}.chart-zoom-controls button:hover{background-color:#ffffff4d}.chart-zoom-controls span{color:#fff;font-weight:500;min-width:3rem;text-align:center}@media (max-width:768px){.chart-main-content{flex-direction:column;gap:1rem}.chart-left-sidebar{flex:none;max-width:none;min-width:auto;position:relative;top:0;width:100%}.chart-search-filter-bar{align-items:stretch;flex-direction:column;gap:1rem}.chart-filter-buttons{flex-wrap:wrap;justify-content:center}.chart-tab-btn{font-size:.875rem;padding:.5rem .75rem}}.chart-timer-btn{align-items:center;background:linear-gradient(135deg,#fbbf24,#f59e0b);border:none;border-radius:1.5rem;box-shadow:0 .125rem .5rem #fbbf244d;color:#fff;cursor:pointer;display:flex;font-size:.875rem;font-weight:600;gap:.375rem;padding:.625rem 1.25rem;transition:all .3s ease;white-space:nowrap}.chart-timer-btn:hover{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 .25rem .75rem #fbbf2466;transform:translateY(-.125rem)}.chart-timer-btn.timer-overtime{animation:pulse-glow 2s ease-in-out infinite;background:linear-gradient(135deg,#f87171,#ef4444)}.chart-timer-btn.timer-overtime:hover{background:linear-gradient(135deg,#ef4444,#dc2626)}@keyframes pulse-glow{0%,to{box-shadow:0 .125rem .5rem #ef444466}50%{box-shadow:0 .25rem 1rem #ef444499}}.comparison-page{background:linear-gradient(135deg,#fff8e1,#fffbf0);min-height:100vh;padding:0}.comparison-container{margin:0 auto;padding:1.5rem 2rem}.comparison-header{margin-bottom:1rem}.comparison-title{color:#1f2937;font-size:2rem;font-weight:700;margin-bottom:.5rem}.comparison-subtitle{color:#6b7280}.controls-panel{background:#fff;border:1px solid #fed7aa;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;margin-bottom:1.5rem;padding:1rem}.controls-row{align-items:center;display:flex;flex-wrap:wrap;gap:1rem}.search-container{flex:1 1;min-width:16rem;position:relative}.search-input{border:1px solid #d1d5db;border-radius:.5rem;outline:none;padding:.5rem .5rem .5rem 2.5rem;transition:all .2s;width:40rem}.search-input:focus{box-shadow:0 0 0 3px #3b82f61a}.control-btn{align-items:center;background:#f3f4f6;border:none;border-radius:.5rem;color:#374151;cursor:pointer;display:flex;gap:.5rem;padding:.5rem 1rem;transition:all .2s}.control-btn:hover{background:#e5e7eb}.control-btn.active{background:#dbeafe;color:#1d4ed8}.control-btn.review-btn{background:#dcfce7;color:#166534}.control-btn.review-btn:hover{background:#bbf7d0}.control-btn.weak-active{background:#fee2e2;color:#dc2626}.btn-icon{height:1rem;width:1rem}.review-panel{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:.5rem;margin-top:1rem;padding:1rem}.review-controls{justify-content:space-between}.review-controls,.review-info{align-items:center;display:flex}.review-info{gap:1rem}.review-progress{color:#166534;font-weight:500}.timer-container{align-items:center;display:flex;gap:.5rem}.timer-icon{color:#166534;height:1rem;width:1rem}.timer{color:#166534;font-family:monospace;font-size:1.125rem}.timer-warning{color:#dc2626}.review-buttons{display:flex;gap:.5rem}.review-btn-small{border:none;border-radius:.25rem;cursor:pointer;font-size:.875rem;padding:.25rem .75rem;transition:all .2s}.review-btn-small.blue{background:#3b82f6;color:#fff}.review-btn-small.blue:hover{background:#2563eb}.review-btn-small.green{background:#10b981;color:#fff}.review-btn-small.green:hover{background:#059669}.review-btn-small.gray{background:#6b7280;color:#fff}.review-btn-small.gray:hover{background:#4b5563}.content-layout{display:flex;gap:1rem}.sidebar{background:linear-gradient(135deg,#fff8e1,#fffbf0);border:1px solid #fed7aa;border-left:4px solid #ff8a65;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;min-width:12rem;padding:1rem;width:16.666667%}.sidebar-content{margin-bottom:1rem}.sidebar-title{align-items:center;color:#1f2937;display:flex;font-size:1rem;gap:.25rem;margin-bottom:.75rem}.topic-item{margin-bottom:0}.topic-btn{background:#0000;border:none;border-left:3px solid #0000;border-radius:.25rem;cursor:pointer;font-size:.875rem;padding:0;text-align:left;transition:all .2s;width:100%}.topic-btn:hover{background:#fff7ed}.topic-btn.active{background:#fed7aa;border-left-color:#f97316;box-shadow:0 1px 3px #0000001a}.topic-title-input{background:#0000;border:none;color:#1f2937;flex:1 1;font-size:.9rem;font-weight:500;line-height:1.2;margin-right:.25rem;outline:none}.topic-arrow{color:#6b7280;flex-shrink:0;height:.75rem;width:.75rem}.topic-count{color:#6b7280;font-size:.75rem;margin-top:.25rem}.topic-divider{background:linear-gradient(90deg,#0000,#fed7aa,#0000);height:1px;margin:.5rem 0}.drag-over{background-color:#f0f0f0;border:2px dashed #ccc}.comparison-add-topic-btn{align-items:center;background:#0000;border:2px dashed #f97316;border-radius:.25rem;color:#ea580c;cursor:pointer;display:flex;font-size:1rem;gap:.25rem;justify-content:center;margin-top:.75rem;padding:.5rem;transition:all .2s;width:100%}.comparison-add-topic-btn:hover{background:#fff7ed}.add-icon{height:.75rem;width:.75rem}.topic-actions{align-items:center;display:flex;gap:.25rem}.delete-topic-btn{background:#0000;border:none;border-radius:.125rem;color:#ef4444;cursor:pointer;font-size:.75rem;opacity:0;padding:.125rem;transition:opacity .2s}.topic-btn:hover .delete-topic-btn{opacity:1}.delete-topic-btn:hover{background:#fee2e2}.weak-stats{align-items:center;background:#fef2f2;border:1px solid #fecaca;border-radius:.25rem;display:flex;flex-direction:column;gap:.3rem;height:100px;justify-content:center;padding:.5rem;text-align:center}.weak-title{color:#991b1b;font-size:1rem;font-weight:500;margin:0}.weak-count{color:#dc2626;font-size:1rem;margin:0}.weak-toggle-btn{background:#fee2e2;border:none;border-radius:.25rem;color:#991b1b;cursor:pointer;font-size:.75rem;margin:0;padding:.125rem .5rem;transition:all .2s}.weak-toggle-btn:hover{background:#fecaca}.sidebar-header-horizontal{align-items:center;border-bottom:1px solid #e9ecef;display:flex;justify-content:space-between;margin-bottom:20px;padding-bottom:15px}.compact-toggle-btn{background:#fff;border:1px solid #dee2e6;border-radius:4px;color:#6c757d;cursor:pointer;font-size:11px;min-width:40px;padding:4px 8px;transition:all .2s ease}.compact-toggle-btn:hover:not(:disabled){background:#f8f9fa;color:#495057}.compact-toggle-btn.active{background:#007bff;border-color:#007bff;color:#fff}.compact-toggle-btn:disabled{cursor:not-allowed;opacity:.5}.main-content{background:#fff;border:1px solid #fed7aa;border-radius:.5rem;box-shadow:0 1px 3px #0000001a;flex:1 1;overflow:hidden;padding:1rem}.table-container{overflow-x:auto;padding:.25rem}.comparison-table{border-collapse:collapse;table-layout:fixed;width:100%}.table-header{border-bottom:2px solid #fed7aa}.table-header th{color:#1f2937;font-weight:600;padding:.5rem 1.25rem;text-align:left}.col-chinese{background:#fff7ed;width:24%}.col-english{background:#eff6ff;width:72%}.col-actions{background:#f9fafb;text-align:center;width:6%}.topic-separator{padding:.5rem 0}.topic-separator-content{align-items:center;display:flex;gap:.75rem}.topic-line{border-radius:9999px;flex:1 1;height:.25rem}.topic-label{border-radius:9999px;color:#374151;font-size:.875rem;font-weight:500;padding:.125rem .5rem}.add-entry-btn{background:#0000;border:none;border-radius:.25rem;color:#ea580c;cursor:pointer;padding:.25rem;transition:all .2s}.add-entry-btn:hover{background:#fff7ed}.add-entry-icon{height:1rem;width:1rem}.entry-row{border-bottom:1px solid #f3f4f6;transition:all .3s}.entry-row:hover{background:#f9fafb}.entry-row.highlighted{background:#fef3c7;box-shadow:0 4px 6px #0000001a;transform:scale(1.02)}.entry-row.review-active{background:#eff6ff;box-shadow:0 0 0 2px #60a5fa}.entry-row.weak-entry{background:#fef2f2;border-left:4px solid #fca5a5}.chinese-cell{border-right:1px solid #e5e7eb;max-width:25%!important;min-width:25%!important;padding:.75rem 1rem;vertical-align:top;width:25%!important}.chinese-input{border:1px solid #d1d5db;border-radius:.25rem;box-sizing:border-box;font-size:.875rem;max-width:100%;outline:none;overflow-wrap:break-word;padding:.5rem;resize:none;transition:all .2s;width:100%}.chinese-input:focus{border-color:#f97316;box-shadow:0 0 0 3px #f973161a}.english-cell{border-right:1px solid #e5e7eb;padding:.001rem 1rem;vertical-align:top}.english-content,.example-content{margin:.5rem 0}.english-input-group,.example-input-group{align-items:flex-start;display:flex;gap:.5rem}.english-input{border:1px solid #d1d5db;border-radius:.25rem;flex:1 1;font-size:.875rem;outline:none;padding:.5rem;resize:none;transition:all .2s}.english-input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.example-label{color:#6b7280;font-size:.75rem;margin-right:.25rem;margin-top:.5rem}.example-input{background:#f0fdf4;border:1px solid #10b981;border-radius:.25rem;flex:1 1;font-size:.875rem;outline:none;padding:.5rem;resize:none;transition:all .2s}.example-input:focus{border-color:#059669;box-shadow:0 0 0 3px #10b9811a}.delete-btn{background:#0000;border:none;border-radius:.25rem;color:#ef4444;cursor:pointer;font-size:.75rem;padding:.25rem;transition:all .2s}.delete-btn:hover{background:#fef2f2}.hidden-placeholder{align-items:center;background:#f3f4f6;border:2px dashed #d1d5db;border-radius:.25rem;display:flex;height:3rem;justify-content:center}.hidden-placeholder span{color:#6b7280;font-size:.75rem}.actions-cell{padding:.5rem .25rem;vertical-align:top}.actions-group{grid-gap:.25rem;align-items:center;display:grid;gap:.25rem;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}.action-btn{align-items:center;background:#0000;border:none;border-radius:.25rem;cursor:pointer;display:flex;height:1.75rem;justify-content:center;padding:.25rem;transition:all .2s;width:1.75rem}.action-btn:hover{background:#f3f4f6}.action-btn.weak-active{background:#fee2e2}.action-btn.weak-active:hover{background:#fecaca}.action-icon{height:.9rem;width:.9rem}.action-icon.blue{color:#3b82f6}.action-icon.gray{color:#9ca3af}.emoji{font-size:1rem}.emoji.red{color:#dc2626}.emoji.gray{color:#9ca3af}.example-btn{color:#10b981;font-size:.75rem;font-weight:600}.example-btn:hover{background:#f0fdf4}.empty-topic{color:#6b7280;font-size:.875rem;padding:1rem;text-align:center}.empty-state{padding:3rem;text-align:center}.empty-icon{color:#9ca3af;font-size:1.125rem;margin-bottom:.5rem}.empty-text{color:#6b7280;margin:0}.empty-hint{color:#9ca3af;font-size:.875rem;margin:.25rem 0 0}@media (max-width:768px){.content-layout{flex-direction:column}.sidebar{min-width:auto;width:100%}.controls-row{align-items:stretch;flex-direction:column}.search-container{min-width:auto}}.chinese-display{border-radius:.5rem;color:#2c3e50;font-size:.95rem;min-height:3rem;padding:.75rem}.chinese-display,.english-display{align-items:center;background-color:#f8f9fa;display:flex;line-height:1.4}.english-display{border-left:.25rem solid #3498db;border-radius:.375rem;color:#34495e;font-size:1rem;min-height:2.5rem;padding:.5rem .75rem}.topic-title-display{color:#2c3e50;flex:1 1;font-weight:600;padding:.25rem 0;text-align:left}.admin-btn{opacity:.8;transition:opacity .2s ease}.admin-btn:hover{opacity:1;transform:scale(1.05)}.admin-toggle{border:none;border-radius:.5rem;box-shadow:0 .125rem .25rem #0000001a;cursor:pointer;font-size:.875rem;font-weight:500;padding:.5rem 1rem;position:fixed;right:1rem;top:1rem;transition:all .2s ease;z-index:9999}.admin-toggle:hover{box-shadow:0 .25rem .5rem #00000026;transform:translateY(-.125rem)}.control-btn.dictation-btn{background:#f3e8ff;color:#7c3aed}.control-btn.dictation-btn:hover{background:#e9d5ff}.control-btn.reset-btn{background:#fef3c7;color:#d97706}.control-btn.reset-btn:hover{background:#fde68a}.control-btn.exit-btn{background:#f0fdf4;color:#16a34a}.control-btn.exit-btn:hover{background:#dcfce7}.dictation-progress{align-items:center;background:#f8fafc;border-radius:.5rem;color:#475569;display:flex;font-size:.875rem;font-weight:500;padding:.5rem 1rem}.dictation-panel{background:#fefce8;border:1px solid #fde047;border-radius:.5rem;margin-top:1rem;padding:1rem}.dictation-tips{justify-content:space-between}.dictation-tips,.tips-content{align-items:center;display:flex}.tips-content{gap:.5rem}.tip-icon{font-size:1.25rem}.tip-text{color:#854d0e;font-size:.875rem}.tip-text kbd{background:#fed7aa;border:1px solid #fb923c;border-radius:.25rem;color:#9a3412;font-size:.75rem;font-weight:600;padding:.125rem .25rem}.dictation-stats{color:#a16207;font-size:.875rem;font-weight:500}.dictation-container{margin:.5rem 0}.dictation-input-group{align-items:flex-start;display:flex;gap:.5rem;margin-bottom:.5rem}.dictation-input{background:#faf5ff;border:2px solid #a855f7;border-radius:.5rem;flex:1 1;font-family:inherit;font-size:1rem;line-height:1.4;outline:none;padding:.75rem;resize:none;transition:all .2s}.dictation-input:focus{background:#fff;border-color:#7c3aed;box-shadow:0 0 0 3px #a855f71a}.dictation-input::placeholder{color:#a78bfa;font-style:italic}.dictation-buttons{display:flex;flex-direction:column;gap:.25rem}.dictation-btn{align-items:center;border:none;border-radius:.25rem;cursor:pointer;display:flex;font-size:.875rem;height:2rem;justify-content:center;min-width:2rem;padding:.5rem;transition:all .2s}.dictation-btn.submit{background:#10b981;color:#fff}.dictation-btn.submit:hover{background:#059669;transform:scale(1.05)}.dictation-result{background:#f8fafc;border-left:4px solid #6366f1;border-radius:.5rem;margin-top:.75rem;padding:.75rem}.comparison-result{display:flex;flex-direction:column;gap:.5rem}.comparison-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:.5rem;padding-bottom:.5rem}.matched-answer{background:#f1f5f9;border-left:3px solid #3b82f6;border-radius:.25rem;color:#475569;font-size:.875rem;font-weight:500;padding:.25rem .5rem}.comparison-words{display:flex;flex-wrap:wrap;gap:.25rem;line-height:1.6}.comparison-word{border-radius:.25rem;font-size:.9rem;font-weight:500;padding:.125rem .25rem;transition:all .2s}.comparison-word.correct{background:#dcfce7;border:1px solid #bbf7d0;color:#166534}.comparison-word.incorrect{background:#fee2e2;border:1px solid #fecaca;color:#991b1b;cursor:help;position:relative}.comparison-word.incorrect:hover{background:#fecaca}.comparison-word.missing{background:#f1f5f9;border:2px dashed #cbd5e1;color:#475569}.comparison-word.extra{background:#fef3c7;border:1px solid #fde68a;color:#92400e}.missing-word{font-style:italic;text-decoration:underline}.accuracy-score{align-self:flex-end;background:#eff6ff;border:1px solid #bfdbfe;border-radius:.25rem;color:#1e40af;font-size:.875rem;font-weight:600;padding:.25rem .5rem}.dictation-hint{background:#e0f2fe;border-radius:.25rem;color:#0369a1;font-size:.75rem;font-style:italic;margin-top:.5rem;padding:.5rem;text-align:center}.search-input:disabled{background:#f3f4f6;color:#9ca3af;cursor:not-allowed}@media (max-width:768px){.dictation-tips{align-items:flex-start;flex-direction:column;gap:.5rem}.comparison-words{font-size:.875rem}.dictation-input{font-size:.9rem}.dictation-progress{font-size:.75rem;padding:.375rem .75rem}}*{box-sizing:border-box;margin:0;padding:0}body{background-color:#fafafa;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.6}.viewpoint-training-container{margin:0 auto;padding:2rem 1rem}.top-navigation{align-items:center;background-color:#fff;box-shadow:0 .125rem .25rem #0000001a;display:flex;justify-content:space-between;padding:1rem 2rem;position:-webkit-sticky;position:sticky;top:0;z-index:100}.site-title h1{color:#333;font-size:2rem;font-weight:600}.main-nav{align-items:center;display:flex;gap:1.5rem}.nav-link{border-radius:.375rem;color:#666;font-weight:500;padding:.5rem 1rem;text-decoration:none;transition:all .2s ease}.nav-link:hover{background-color:#f5f5f5;color:#333}.nav-link.active{background-color:#eff6ff;color:#2563eb}.admin-button{background-color:#1f2937;border:none;border-radius:.375rem;color:#fff;cursor:pointer;font-weight:500;padding:.5rem 1rem;transition:background-color .2s ease}.admin-button:hover{background-color:#374151}.page-header{background-color:#fafafa;padding:1.5rem 2rem 1rem}.page-header h2{color:#1f2937;font-size:1.75rem;font-weight:700}.search-filter-bar{align-items:center;background-color:#fef7ed;border:.0625rem solid #fed7aa;border-radius:.75rem;box-shadow:0 .0625rem .125rem #0000000d;display:flex;gap:1rem;justify-content:space-between;margin:0 0 1.5rem;padding:1rem 2rem}.search-section{flex:1 1;max-width:25rem}.search-input-wrapper{align-items:center;display:flex;position:relative}.search-icon{color:#9ca3af;height:1rem;left:.75rem;position:absolute;top:50%;transform:translateY(-50%);width:1rem}.search-input{background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.375rem;font-size:.875rem;padding:.75rem .75rem .75rem 2.5rem;transition:border-color .2s ease,box-shadow .2s ease;width:100%}.search-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .1875rem #3b82f61a;outline:none}.filter-buttons{align-items:center;display:flex;gap:.75rem}.filter-btn{background-color:#fff;border:.0625rem solid #fed7aa;border-radius:.375rem;color:#92400e;cursor:pointer;font-size:.875rem;font-weight:500;padding:.5rem 1rem;transition:all .2s ease}.filter-btn:hover{background-color:#fefbf7;border-color:#fdba74}.filter-btn.random-mode.active{background-color:#3b82f6;border-color:#3b82f6;color:#fff}.filter-btn.review-mode.active{background-color:#10b981;border-color:#10b981;color:#fff}.status-filters{display:flex;gap:.375rem}.no-results{color:#6b7280;font-size:.875rem;padding:3rem 1rem;text-align:center}.no-results p{font-size:1rem;margin:0}.status-btn{align-items:center;background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.375rem;cursor:pointer;display:flex;font-size:.875rem;height:2rem;justify-content:center;transition:all .2s ease;width:2rem}.status-btn:hover{background-color:#f9fafb}.status-btn.active{background-color:#f3f4f6;border-color:#374151;transform:scale(1.1)}.viewpoint-main-content{align-items:flex-start;display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;gap:1.5rem;min-height:calc(100vh - 12rem);padding:1rem 2rem 2rem;width:100%}.left-sidebar{align-self:flex-start!important;background-color:#fef7ed;border:.0625rem solid #fed7aa;border-radius:.75rem;box-sizing:border-box;flex:0 0 288px!important;margin-top:0!important;max-width:288px!important;min-width:288px!important;padding:1.5rem;position:relative!important;top:0!important;width:288px!important}.navigation-section{width:100%}.sidebar-title{border-bottom:.0625rem solid #fed7aa;color:#92400e;font-size:1.125rem;font-weight:600;margin-bottom:1rem;padding-bottom:.5rem}.topic-tree{margin-bottom:1.5rem}.topic-item{margin-bottom:.5rem}.topic-header:hover{background-color:#fefbf7;border-color:#fdba74}.topic-icon{font-size:1rem;margin-right:.5rem}.topic-name{color:#92400e;flex:1 1;font-size:.875rem;font-weight:500}.expand-icon{color:#d97706;font-size:.75rem;transition:transform .2s ease}.expand-icon.expanded{transform:rotate(90deg)}.subtopic-list{border-left:.125rem solid #fed7aa;margin-left:1rem;margin-top:.5rem;padding-left:.75rem}.subtopic-item.selected{background-color:#fef3c7;border-color:#f59e0b;box-shadow:0 .125rem .25rem #f59e0b33}.subtopic-name{color:#92400e;font-size:.8125rem;font-weight:500}.status-counts{display:flex;gap:.25rem}.count{font-size:.75rem;font-weight:500}.count.red{color:#dc2626}.count.yellow{color:#d97706}.count.green{color:#059669}.recent-practice{border-top:.0625rem solid #fed7aa;padding-top:1rem}.recent-title{color:#92400e;font-size:.9375rem;font-weight:600;margin-bottom:.75rem}.recent-list{display:flex;flex-direction:column;gap:.375rem}.recent-item{align-items:center;background-color:#fff;border:.0625rem solid #fde68a;border-radius:.375rem;display:flex;margin-bottom:.25rem;padding:.375rem .5rem;transition:all .2s ease}.recent-item:hover{background-color:#fffbeb;border-color:#fbbf24}.recent-dot{color:#d97706;font-weight:700;margin-right:.5rem}.recent-topic{color:#92400e;font-size:.8125rem;font-weight:500}.main-workspace{background-color:#fff;border-radius:.75rem;box-shadow:0 .0625rem .1875rem #0000000d;flex:1 1;min-height:600px;min-width:0;padding:1.5rem}.topic-breadcrumb{align-items:center;border-bottom:.0625rem solid #e5e7eb;display:flex;margin-bottom:1.5rem;padding-bottom:1rem}.breadcrumb-item{color:#6b7280;font-size:.875rem}.breadcrumb-item.active{color:#1f2937;font-weight:500}.breadcrumb-separator{color:#9ca3af;margin:0 .5rem}.welcome-content{align-items:center;display:flex;height:25rem;justify-content:center}.welcome-message{max-width:32rem;text-align:center}.welcome-message h3{color:#1f2937;font-size:1.5rem;font-weight:600;margin-bottom:1rem}.welcome-message p{color:#6b7280;line-height:1.6;margin-bottom:2rem}.quick-stats{display:flex;gap:2rem;justify-content:center}.stat-item{text-align:center}.stat-number{color:#3b82f6;display:block;font-size:2rem;font-weight:700;margin-bottom:.25rem}.stat-label{color:#6b7280;font-size:.875rem}.card-placeholder{background-color:#f9fafb;border:.125rem dashed #d1d5db;border-radius:.75rem;padding:2rem}.card-placeholder,.no-cards{color:#6b7280;text-align:center}.no-cards{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:15rem}.training-card{background:#fff;border-radius:.75rem;box-shadow:0 .125rem .25rem #0000001a;margin-bottom:1.5rem;padding:1.5rem}.card-header{align-items:flex-start;display:flex;gap:1rem;justify-content:space-between;margin-bottom:1rem}.card-question h3{word-wrap:break-word;flex:1 1;font-size:1.25rem;font-weight:600;margin-bottom:.5rem;min-width:0;white-space:pre-wrap}.card-meta{align-items:center;color:#6b7280;display:flex;font-size:.875rem;gap:1rem}.clock-indicator{cursor:pointer;pointer-events:auto;position:relative;z-index:10}.tab-navigation{border-bottom:2px solid #e5e7eb;display:flex;margin-bottom:.5rem}.tab-btn{background:none;border:none;border-bottom:2px solid #0000;cursor:pointer;font-size:1rem;font-weight:600;padding:.75rem 1rem;transition:all .2s ease}.tab-btn:hover{background-color:#f8f9fa}.tab-btn.active{border-bottom-color:#3b82f6;color:#3b82f6;font-weight:700}.tab-content{min-height:20rem}.brainstorm-tab{padding:0}.brainstorm-input{border:1px solid #d1d5db;border-radius:.375rem;font-family:inherit;font-size:1rem;margin-bottom:.5rem;min-height:250px;padding:1rem;resize:vertical;width:100%}.prompt-questions{margin-top:1rem}.prompt-questions p{color:#374151;font-weight:600;margin-bottom:.5rem}.question-tags{display:flex;flex-wrap:wrap;gap:.5rem}.question-tag{background-color:initial;border:1px solid #d1d5db;border-radius:.25rem;color:#374151;font-size:.875rem;font-weight:500;padding:.25rem .5rem}.proscons-tab{padding:0}.proscons-columns{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:1fr 1fr}.cons-column h4,.pros-column h4{font-size:1.125rem;font-weight:600;margin-bottom:.5rem}.peel-tab{padding:0}.peel-paragraph{background-color:#fafafa;border:1px solid #d1d5db;border-radius:.5rem;padding:1rem}.peel-paragraph,.peel-section{margin-bottom:1rem}.peel-section:last-child{margin-bottom:0}.peel-label{color:#374151;display:block;font-size:.9375rem;font-weight:500;margin-bottom:.25rem}.peel-input{border:1px solid #d1d5db;border-radius:.25rem;font-size:.9375rem;line-height:1.5;padding:.75rem;resize:vertical;width:100%}.peel-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .125rem #3b82f61a;outline:none}.peel-content-input{border:1px solid #d1d5db;border-radius:.375rem;box-sizing:border-box;font-size:1rem;line-height:1.5;min-height:400px;min-height:300px;padding:.5rem;resize:vertical;width:100%}.peel-footer{align-items:center;display:flex;font-size:.875rem;justify-content:space-between;margin:.5rem 0}.character-count{background-color:#f3f4f6;border-radius:.25rem;color:#6b7280;padding:.25rem .5rem}.add-peel-btn{background-color:#d8b4fe;border:none;border-radius:.375rem;color:#581c87;cursor:pointer;font-size:.875rem;padding:.5rem 1rem;transition:background-color .2s}.add-peel-btn:hover{background-color:#c084fc;color:#fff}@media (max-width:768px){.main-content{flex-direction:column;gap:1rem}.left-sidebar{flex:none;max-width:none;min-width:auto;position:relative;top:0;width:100%}.search-filter-bar{align-items:stretch;flex-direction:column;gap:1rem}.filter-buttons{flex-wrap:wrap;justify-content:center}.proscons-columns{gap:1rem;grid-template-columns:1fr}.tab-btn{font-size:.875rem;padding:.5rem .75rem}}.admin-controls{display:flex;justify-content:flex-end;margin-top:1rem}.edit-mode-btn{background-color:#3b82f6;border:none;border-radius:.375rem;color:#fff;cursor:pointer;font-size:.875rem;font-weight:500;padding:.5rem 1rem;transition:all .2s ease}.edit-mode-btn:hover{background-color:#2563eb}.edit-mode-btn.active{background-color:#dc2626}.edit-mode-btn.active:hover{background-color:#b91c1c}.sidebar-header{border-bottom:.0625rem solid #fed7aa;justify-content:space-between;margin-bottom:1rem;padding-bottom:.5rem}.add-topic-btn,.sidebar-header{align-items:center;display:flex}.add-topic-btn{background-color:#10b981;border:none;border-radius:.375rem;color:#fff;cursor:pointer;height:2rem;justify-content:center;transition:all .2s ease;width:2rem}.add-topic-btn:hover{background-color:#059669;transform:scale(1.05)}.topic-header{background-color:#fff;border:.0625rem solid #fed7aa;border-radius:.5rem;cursor:pointer;justify-content:space-between;padding:.75rem;transition:all .2s ease}.topic-content,.topic-header{align-items:center;display:flex}.topic-content{flex:1 1;min-width:0}.admin-buttons{display:flex;gap:.25rem;margin-left:.5rem}.cancel-btn,.delete-btn,.edit-btn,.save-btn{align-items:center;border:none;border-radius:.25rem;cursor:pointer;display:flex;height:1.5rem;justify-content:center;transition:all .2s ease;width:1.5rem}.edit-btn{background-color:#3b82f6;color:#fff}.edit-btn:hover{background-color:#2563eb}.delete-btn{background-color:#ef4444;color:#fff}.delete-btn:hover{background-color:#dc2626}.save-btn{background-color:#10b981;color:#fff}.save-btn:hover{background-color:#059669}.cancel-btn{background-color:#6b7280;color:#fff}.cancel-btn:hover{background-color:#4b5563}.edit-input-group{align-items:center;display:flex;flex:1 1;gap:.5rem;max-width:none!important;min-width:0;width:100%!important}.edit-input{background-color:#fff;border:.0625rem solid #d1d5db;border-radius:.25rem;flex:1 1;font-size:.875rem;min-width:0;min-width:200px;padding:.375rem .5rem;width:100%}.edit-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .125rem #3b82f61a;outline:none}.card-question-input{flex:1 1!important;font-size:.8rem!important;font-weight:600!important;line-height:1.4;max-width:none!important;min-height:2.5rem;min-width:400px!important;padding:.5rem .75rem!important;resize:vertical;width:100%!important}.edit-buttons{display:flex;gap:.25rem}.subtopic-item{background-color:#fff;border:.0625rem solid #fde68a;border-radius:.375rem;cursor:pointer;margin-bottom:.25rem;padding:.5rem .75rem;transition:all .2s ease}.subtopic-content,.subtopic-item{align-items:center;display:flex;justify-content:space-between}.subtopic-content{flex:1 1;min-width:0}.add-subtopic-btn{align-items:center;background-color:#f3f4f6;border:.0625rem dashed #9ca3af;border-radius:.375rem;color:#374151;cursor:pointer;display:flex;font-size:.8125rem;font-weight:500;gap:.25rem;justify-content:center;margin-top:.5rem;padding:.5rem;transition:all .2s ease;width:100%}.add-subtopic-btn:hover{background-color:#e5e7eb;border-color:#6b7280}.topic-item .topic-header:hover{background-color:#fefbf7;border-color:#fdba74}.subtopic-item:hover{background-color:#fffbeb;border-color:#fbbf24}.admin-buttons,.topic-content{pointer-events:auto}.subtopic-item.editing .subtopic-content,.topic-item.editing .topic-content{pointer-events:none}.add-card-section{border-bottom:.0625rem solid #e5e7eb;margin-bottom:1.5rem;padding-bottom:1rem}.add-card-btn{align-items:center;background-color:#10b981;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;font-size:.875rem;font-weight:500;gap:.5rem;padding:.75rem 1rem;transition:all .2s ease}.add-card-btn:hover{background-color:#059669;transform:translateY(-.0625rem)}.editable-text{word-wrap:break-word;border-radius:.25rem;cursor:pointer;margin:-.125rem -.25rem;padding:.125rem .25rem;transition:all .2s ease;white-space:pre-wrap}.editable-text:hover{background-color:#f3f4f6;color:#3b82f6}.delete-card-btn{align-items:center;background-color:#ef4444;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;height:2rem;justify-content:center;margin-left:.5rem;transition:all .2s ease;width:2rem}.delete-card-btn:hover{background-color:#dc2626;transform:scale(1.05)}.card-controls{align-items:center;display:flex;gap:.5rem}.proscons-header{align-items:center;display:flex;justify-content:center;margin-bottom:1rem}.proscons-header h4{font-size:1.125rem;font-weight:600;margin:0}.add-proscon-btn{align-items:center;background-color:#10b981;border:none;border-radius:.375rem;color:#fff;cursor:pointer;display:flex;height:2rem;justify-content:center;transition:all .2s ease;width:2rem}.add-proscon-btn:hover{background-color:#059669;transform:scale(1.05)}.proscon-content{align-items:flex-start;display:flex;gap:.5rem;justify-content:space-between;width:100%}.proscon-content span{flex:1 1;min-width:0}.editable-proscon-text{word-wrap:break-word;border-radius:.25rem;cursor:pointer;display:block;margin:-.125rem -.25rem;padding:.125rem .25rem;transition:all .2s ease;white-space:pre-wrap}.editable-proscon-text:hover{background-color:#3b82f61a;color:#3b82f6}.proscon-admin-buttons{display:flex;flex-shrink:0;gap:.25rem;margin-left:.5rem}.proscon-edit-group{display:flex;flex-direction:column;gap:.5rem;width:100%}.proscon-edit-input{border:.0625rem solid #d1d5db;border-radius:.25rem;font-family:inherit;font-size:.9375rem;line-height:1.5;min-height:2.5rem;padding:.5rem;resize:vertical;width:100%}.proscon-edit-input:focus{border-color:#3b82f6;box-shadow:0 0 0 .125rem #3b82f61a;outline:none}.proscon-edit-buttons{align-self:flex-end;display:flex;gap:.25rem}.argument-item{border-radius:.375rem;font-size:.9375rem;line-height:1.5;margin-bottom:.5rem;padding:.75rem;position:relative}.argument-item.pro{background-color:#dcfce7;border-left:4px solid #22c55e}.argument-item.con{background-color:#fee2e2;border-left:4px solid #ef4444}.cons-list,.pros-list{min-height:3rem}@media (max-width:768px){.proscon-content{align-items:stretch;flex-direction:column;gap:.75rem}.proscon-admin-buttons{align-self:flex-end;margin-left:0}.proscons-header{align-items:stretch;flex-direction:column;gap:.5rem}.add-proscon-btn{align-self:flex-end}}.writing-guide-content{background-color:#f8f9fa;margin:0 auto;max-width:1200px;min-height:100vh;padding:2rem}.guide-page-header{margin-bottom:2rem}.guide-page-header h1{color:#333;font-size:2rem;font-weight:600;margin-bottom:.5rem}.guide-page-subtitle{color:#666;font-size:1rem}.editor-container{background:#fff;border-radius:12px;box-shadow:0 2px 8px #00000014;overflow:hidden}.editor-toolbar{background:#f8f9fa;border-bottom:1px solid #e9ecef;flex-wrap:wrap;gap:.5rem;padding:1rem}.editor-toolbar,.toolbar-btn{align-items:center;display:flex}.toolbar-btn{background:#fff;border:1px solid #ddd;border-radius:4px;cursor:pointer;font-size:14px;min-height:32px;padding:6px 12px;transition:all .2s;white-space:nowrap}.toolbar-btn:hover{background:#e9ecef}.toolbar-btn:active{background:#007bff;border-color:#007bff;color:#fff}.toolbar-divider{background:#ddd;height:20px;margin:0 .25rem;width:1px}.editor-toolbar select{background:#fff;border:1px solid #ddd;border-radius:4px;cursor:pointer;font-size:14px;min-height:32px;padding:6px 12px}.editor-toolbar select:focus{border-color:#007bff;box-shadow:0 0 0 2px #007bff40;outline:none}.editor-main{min-height:600px;position:relative}.editor-content{word-wrap:break-word;color:#333;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;font-size:16px;line-height:1.8;min-height:600px;outline:none;overflow-wrap:break-word;padding:2rem}.editor-content:focus{background-color:#fefefe}.editor-content:empty:before{color:#999;content:attr(data-placeholder);font-style:italic;pointer-events:none}.editor-content h1{border-bottom:2px solid #e9ecef;color:#333;font-size:2rem;font-weight:600;margin:1.5rem 0 1rem;padding-bottom:.5rem}.editor-content h2{color:#333;font-size:1.5rem;font-weight:600;margin:1.2rem 0 .8rem}.editor-content h3{color:#333;font-size:1.25rem;font-weight:600;margin:1rem 0 .6rem}.editor-content p{margin:.8rem 0}.editor-content ol,.editor-content ul{margin:1rem 0;padding-left:2rem}.editor-content li{margin:.4rem 0}.editor-content blockquote{background:#f8f9fa;border-left:4px solid #007bff;font-style:italic;margin:1rem 0;padding:1rem}.editor-content code{background:#f1f3f4;border-radius:3px;font-family:Courier New,monospace;font-size:.9em;padding:2px 4px}.editor-content pre{background:#f8f9fa;border-radius:4px;margin:1rem 0;overflow-x:auto;padding:1rem}.editor-content pre code{background:none;padding:0}.inserted-image{border-radius:4px;box-shadow:0 2px 8px #0000001a;cursor:pointer;display:block;height:auto;margin:1rem 0;max-width:100%;transition:transform .2s}.inserted-image:hover{transform:scale(1.02)}.word-counter{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#fffffff2;border:1px solid #e9ecef;border-radius:4px;bottom:10px;color:#666;font-weight:500;right:15px}.toolbar-btn[title]:hover:after,.word-counter{font-size:12px;padding:4px 8px;position:absolute}.toolbar-btn[title]:hover:after{background:#333;border-radius:4px;bottom:100%;color:#fff;content:attr(title);left:50%;margin-bottom:5px;transform:translateX(-50%);white-space:nowrap;z-index:1000}@media (max-width:768px){.writing-guide-content{padding:1rem}.editor-toolbar{gap:.25rem;padding:.75rem}.editor-toolbar select,.toolbar-btn{font-size:12px;min-height:28px;padding:4px 8px}.editor-content{font-size:14px;padding:1rem}.guide-page-header h1{font-size:1.5rem}.word-counter{font-size:11px;padding:3px 6px}}@media (max-width:480px){.writing-guide-content{padding:.5rem}.editor-toolbar{gap:.2rem;padding:.5rem}.toolbar-btn{font-size:11px;min-height:24px;padding:3px 6px}.editor-content{padding:.75rem}.guide-page-header{margin-bottom:1rem}.guide-page-header h1{font-size:1.25rem}}@media print{.editor-toolbar,.word-counter{display:none}.editor-container{border:1px solid #ddd;box-shadow:none}.editor-content{padding:1rem}.writing-guide-content{background:#fff;padding:0}}.editor-content ::selection{background:#007bff33}.editor-content:focus{box-shadow:inset 0 0 0 2px #007bff1a}.editor-loading{align-items:center;color:#666;display:flex;height:200px;justify-content:center}.editor-error{background:#f8d7da;border:1px solid #f5c6cb;border-radius:4px;color:#721c24;margin:1rem 0;padding:1rem}.editor-section{border-bottom:2px solid #e9ecef}.editor-section:last-child{border-bottom:none}.global-section{background:#fff}.personal-section{background:#f8f9fa;border-top:3px solid #007bff}.section-header{align-items:center;background:#f8f9fa;border-bottom:1px solid #e9ecef;display:flex;justify-content:space-between;padding:1rem 2rem}.personal-header{background:#e7f3ff;border-bottom:1px solid #b3d9ff}.section-title{align-items:center;color:#333;display:flex;font-size:1rem;font-weight:600;gap:.5rem;margin:0}.editor-content[contenteditable=false]{background-color:#f8f9fa!important;cursor:default!important;-webkit-user-select:text;user-select:text}.editor-content[contenteditable=false]:focus{background-color:#f8f9fa!important;box-shadow:none}.word-counter{display:none!important}@media (max-width:768px){.section-header{padding:.75rem 1rem}.section-title{font-size:.9rem}.editor-content{min-height:300px!important}}@media (max-width:480px){.section-header{padding:.5rem .75rem}.section-title{font-size:.85rem}.editor-content{min-height:250px!important;padding:1rem!important}}.global-backup-wrapper{display:inline-block;position:relative}.global-backup-trigger{align-items:center;background:linear-gradient(135deg,#10b981,#059669);border:none;border-radius:.5rem;color:#fff;cursor:pointer;display:flex;font-size:.875rem;font-weight:500;gap:.25rem;padding:.5rem 1rem;transition:all .2s ease;white-space:nowrap}.global-backup-trigger:hover{background:linear-gradient(135deg,#059669,#047857);box-shadow:0 4px 8px #10b9814d;transform:translateY(-1px)}.global-backup-trigger:active{transform:translateY(0)}.global-backup-overlay{background:#0000;bottom:0;left:0;position:fixed;right:0;top:0;z-index:999}.global-backup-menu{animation:slideDown .2s ease;background:#fff;border-radius:.75rem;box-shadow:0 10px 25px #00000026;min-width:200px;overflow:hidden;position:absolute;right:0;top:calc(100% + .5rem);z-index:1000}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.backup-menu-header{align-items:center;background:linear-gradient(135deg,#f0fdf4,#dcfce7);border-bottom:1px solid #d1fae5;color:#065f46;display:flex;font-size:.875rem;font-weight:600;justify-content:space-between;padding:.75rem 1rem}.current-page-label{background:#10b981;border-radius:.25rem;color:#fff;font-size:.75rem;padding:.2rem .5rem}.backup-menu-item{align-items:center;background:#fff;border:none;border-bottom:1px solid #f3f4f6;color:#374151;cursor:pointer;display:flex;font-size:.875rem;gap:.75rem;padding:.75rem 1rem;text-align:left;transition:all .2s ease;width:100%}.backup-menu-item:last-child{border-bottom:none}.backup-menu-item:hover{background:#f9fafb;color:#10b981}.backup-menu-item:active{background:#f3f4f6}.menu-icon{font-size:1.25rem;min-width:1.5rem;text-align:center}@media (prefers-color-scheme:dark){.global-backup-menu{background:#1f2937;box-shadow:0 10px 25px #00000080}.backup-menu-header{background:linear-gradient(135deg,#064e3b,#047857);border-bottom:1px solid #065f46;color:#d1fae5}.backup-menu-item{background:#1f2937;border-bottom:1px solid #374151;color:#d1d5db}.backup-menu-item:hover{background:#374151;color:#10b981}.backup-menu-item:active{background:#4b5563}}@media (max-width:768px){.global-backup-trigger{font-size:.8rem;padding:.4rem .8rem}.global-backup-menu{min-width:180px}.backup-menu-item{font-size:.8rem;padding:.6rem .8rem}}.navbar{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;box-shadow:0 .125rem 2rem #9d89711a;display:flex;justify-content:space-between;padding:1rem 2rem;position:-webkit-sticky;position:sticky;top:0;z-index:1000}.navbar-brand{color:#cd7f32;font-size:1.5rem;font-weight:700;text-decoration:none;transition:all .3s ease}.navbar-brand:hover{color:#8a9ba8;transform:scale(1.05)}.navbar-nav{display:flex;gap:2rem;left:50%;list-style:none;margin:0;padding:0;position:absolute;transform:translateX(-50%)}.navbar-nav a{color:#4b5563;font-weight:500;padding:.5rem 0;position:relative;text-decoration:none;transition:all .3s ease}.navbar-nav a:after{background:#8a9ba8;bottom:0;content:"";height:.125rem;left:0;position:absolute;transition:width .3s ease;width:0}.navbar-nav a:hover{color:#8a9ba8}.navbar-nav a:hover:after{width:100%}.navbar-placeholder{width:10rem}@media (max-width:768px){.navbar{padding:1rem}.navbar,.navbar-nav{flex-direction:column;gap:1rem}.navbar-nav{text-align:center}}.navbar-user{align-items:center;display:flex;margin-left:auto}.user-menu{gap:1rem}.admin-badge{background:linear-gradient(135deg,gold,#ffed4e);border-radius:1rem;box-shadow:0 .125rem .375rem #ffd7004d;color:#1a202c;font-size:.85rem;font-weight:600;padding:.375rem .75rem;white-space:nowrap}.user-email{color:#4a5568;max-width:12.5rem;overflow:hidden;text-overflow:ellipsis}.logout-btn,.user-email{font-size:.9rem;white-space:nowrap}.logout-btn{background-color:#e53e3e;border:none;border-radius:.375rem;color:#fff;cursor:pointer;font-weight:500;padding:.5rem 1rem;transition:background-color .2s}.logout-btn:hover{background-color:#c53030}.login-btn{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:.375rem;color:#fff;font-weight:500;padding:.5rem 1.25rem;text-decoration:none;transition:transform .2s,box-shadow .2s;white-space:nowrap}.login-btn:hover{box-shadow:0 .375rem .75rem #667eea4d;transform:translateY(-.0625rem)}@media (max-width:768px){.user-menu{gap:.5rem}.user-email{display:none}.admin-badge{font-size:.75rem;padding:.25rem .5rem}.login-btn,.logout-btn{font-size:.85rem;padding:.375rem .75rem}}@media (max-width:480px){.admin-badge{display:none}}.admin-link{background:#ffd7001a;border-radius:.375rem;color:gold!important;font-weight:600;padding:.5rem 1rem!important;transition:all .2s}.admin-link:hover{background:#ffd70033;color:#ffed4e!important;transform:translateY(-.0625rem)}.user-menu{align-items:center;display:flex;gap:.75rem}@media (max-width:768px){.user-menu{gap:.5rem}.user-email{display:none}}@media (max-width:480px){.user-menu{gap:.4rem}.admin-badge{display:none}}