.demo-cert-selector,.demo-section-nav,.demo-card,.demo-section{font-family:Sora,system-ui,sans-serif}.demo-cert-selector button,.demo-section-nav button,.demo-card button,.demo-cert-selector select,.demo-card select,.demo-card input,.demo-card textarea{font-family:inherit}.demo-cert-selector{display:flex;justify-content:center;gap:4px;margin-bottom:12px}.demo-cert-btn{padding:8px 16px;border-radius:8px;font-size:13px;font-weight:600;color:#fff6;background:transparent;border:1px solid transparent;cursor:pointer;transition:all .15s}.demo-cert-btn:hover{color:#fffc}.demo-cert-btn-active{color:#fff;background:#ffffff14;border-color:#ffffff26}.demo-section-nav{display:flex;justify-content:center;gap:4px;position:sticky;top:64px;z-index:40;padding:8px 12px;margin-bottom:8px;background:#0f1117bf;backdrop-filter:blur(12px);border-radius:12px;max-width:480px;margin-left:auto;margin-right:auto}.demo-section-nav-item{padding:6px 16px;border-radius:8px;font-size:13px;font-weight:500;color:#ffffff73;background:transparent;border:none;cursor:pointer;font-family:inherit;transition:color .15s,background .15s}.demo-section-nav-item:hover{color:#fffc}.demo-section-nav-active{color:#fff;background:#ffffff1a;font-weight:600}.demo-section{padding-top:32px;padding-bottom:16px;scroll-margin-top:120px}.demo-card{max-width:640px;margin:0 auto;background:#f8f9fb;border-radius:16px;border:1px solid #e2e6ed;box-shadow:0 4px 24px #0000001f}.demo-card-body{padding:28px 32px}.demo-header{display:flex;align-items:center;justify-content:space-between;padding:12px 24px;border-bottom:1px solid #e2e6ed;background:#fff;border-radius:16px 16px 0 0}.demo-header-badge{font-size:12px;font-weight:600;color:#8494a7;text-transform:uppercase;letter-spacing:.04em}.demo-header-counter{font-size:13px;font-weight:600;color:#8494a7}.demo-progress-track{height:3px;background:#e2e6ed}.demo-progress-fill{height:100%;background:#1a2030;transition:width .4s cubic-bezier(.16,1,.3,1)}.demo-passage{font-size:17px;line-height:1.75;color:#1a2030;font-family:"Source Serif 4",Georgia,serif}.demo-gap-trigger{display:inline-flex;align-items:center;gap:4px;padding:1px 4px;margin:0 2px;border:none;border-bottom:2px solid #8494a7;background:transparent;cursor:pointer;font-family:inherit;font-size:15px;color:#1a2030;min-width:110px;text-align:center;position:relative;vertical-align:baseline;transition:border-color .15s}.demo-gap-trigger:hover{border-bottom-color:#1a2030}.demo-gap-trigger:focus{outline:2px solid #38b2ac;outline-offset:2px;border-radius:2px}.demo-gap-num{font-size:11px;font-weight:800;color:#8494a7;min-width:18px;flex-shrink:0}.demo-gap-text{font-weight:500;color:#1a2030}.demo-gap-placeholder{color:#8494a7;font-weight:400}.demo-gap-correct{border-bottom-color:#0e8a84;background:#e6f5f4;border-radius:2px}.demo-gap-correct .demo-gap-text{color:#0e8a84}.demo-gap-wrong{border-bottom-color:#c53030;background:#fef2f2;border-radius:2px}.demo-gap-wrong .demo-gap-text{color:#c53030}.demo-gap-dropdown{position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%);z-index:50;min-width:200px;background:#fff;border:1px solid #e2e6ed;border-radius:8px;box-shadow:0 8px 24px #0000001f;padding:4px;animation:demo-dropdown-in .15s ease-out}@keyframes demo-dropdown-in{0%{opacity:0;transform:translate(-50%) translateY(-4px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.demo-gap-option{display:flex;align-items:center;gap:10px;width:100%;padding:10px 14px;border:none;border-radius:6px;background:transparent;cursor:pointer;font:inherit;font-size:14px;color:#1a2030;text-align:left;transition:background .1s}.demo-gap-option:hover{background:#f0f2f5}.demo-gap-option-selected{background:#edf0f4}.demo-gap-option-letter{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;border:1.5px solid #8494a7;font-size:12px;font-weight:700;color:#8494a7;flex-shrink:0;transition:all .15s}.demo-gap-option-selected .demo-gap-option-letter{border-color:#1a2030;background:#1a2030;color:#fff}.demo-mcq{display:flex;flex-direction:column;gap:8px}.demo-mcq-option{display:flex;align-items:flex-start;gap:12px;width:100%;padding:14px 18px;border-radius:4px;border:1px solid #e2e6ed;background:#fff;cursor:pointer;font:inherit;font-size:15px;color:#1a2030;text-align:left;transition:all .15s}.demo-mcq-option:hover{border-color:#c4cdd8;background:#f8f9fb}.demo-mcq-option-selected{border-color:#1a203033;background:#edf0f4}.demo-mcq-option-correct{border-color:#c6e7e5;background:#f0faf9}.demo-mcq-option-wrong{border-color:#fecaca;background:#fef8f8}.demo-mcq-letter{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;border:1.5px solid #8494a7;font-size:13px;font-weight:700;color:#8494a7;flex-shrink:0;transition:all .15s}.demo-mcq-option-selected .demo-mcq-letter{border-color:#1a2030;background:#1a2030;color:#fff}.demo-mcq-option-correct .demo-mcq-letter{border-color:#0e8a84;background:#0e8a84;color:#fff}.demo-mcq-option-wrong .demo-mcq-letter{border-color:#c53030;background:#c53030;color:#fff}.demo-mcq-text{padding-top:3px}.demo-mcq-icon{margin-left:auto;flex-shrink:0;font-weight:700}.demo-nav{display:flex;align-items:center;justify-content:center;padding:16px 24px;border-top:1px solid #e2e6ed;background:#fff;border-radius:0 0 16px 16px}.demo-submit-btn{padding:12px 40px;border-radius:10px;background:#1a2030;color:#fff;font-size:15px;font-weight:600;border:none;cursor:pointer;transition:background .15s;font-family:inherit}.demo-submit-btn:hover{background:#2d3748}.demo-submit-btn:disabled{background:#edf0f4;color:#c4cdd8;cursor:not-allowed}.demo-score{text-align:center;padding:24px}.demo-score-circle{position:relative;width:120px;height:120px;margin:0 auto 16px}.demo-score-circle svg{transform:rotate(-90deg)}.demo-score-track{stroke:#e2e6ed}.demo-score-fill{transition:stroke-dashoffset .8s ease-out}.demo-score-value{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.demo-score-number{font-size:28px;font-weight:700;color:#1a2030;font-variant-numeric:tabular-nums}.demo-score-label{font-size:11px;color:#8494a7;font-weight:500}.demo-feedback{display:flex;flex-direction:column;gap:8px;margin-top:16px;padding:0 32px 24px}.demo-feedback-item{padding:14px;border-radius:8px;border:1px solid}.demo-feedback-correct{border-color:#c6e7e5;background:#f0faf9}.demo-feedback-wrong{border-color:#fecaca;background:#fef8f8}.demo-feedback-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.demo-feedback-badge{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:2px 8px;border-radius:4px}.demo-badge-ok{background:#e6f5f4;color:#0e8a84}.demo-badge-fail{background:#fef2f2;color:#c53030}.demo-feedback-gap{font-size:12px;color:#8494a7}.demo-feedback-answer{font-size:12px;color:#1a2030;font-weight:500}.demo-feedback-explain{font-size:13px;color:#4a5568;line-height:1.6}.demo-scaffold-phase{padding:20px 24px;border-radius:12px;margin:0 32px 16px}.demo-phase1{border:1px solid #fbd38d;background:ivory}.demo-phase2{border:1px solid #90cdf4;background:#ebf8ff}.demo-phase-header{display:flex;align-items:center;gap:8px;margin-bottom:12px}.demo-phase-dot{width:8px;height:8px;border-radius:50%}.demo-phase-dot-active{background:#d69e2e}.demo-phase-dot-inactive{background:#e2e6ed}.demo-phase-dot-blue{background:#3182ce}.demo-phase-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.demo-phase1 .demo-phase-label{color:#b7791f}.demo-phase2 .demo-phase-label{color:#2b6cb0}.demo-phase-text{font-size:14px;color:#2d3748;line-height:1.6;margin-bottom:10px}.demo-evidence{padding:8px 12px;border-radius:6px;font-size:12px;font-weight:500;line-height:1.5}.demo-evidence-zone{background:#fefcbf;color:#975a16}.demo-evidence-precise{background:#fed7aa;color:#9c4221}.demo-strategy{padding:12px 14px;border-radius:8px;background:#f0fff4;border:1px solid #c6f6d5;margin-top:10px}.demo-strategy-label{font-size:11px;font-weight:700;color:#276749;margin-bottom:4px}.demo-strategy-text{font-size:13px;color:#2d3748;line-height:1.6}.demo-retry-btn{display:inline-flex;align-items:center;gap:4px;margin-top:12px;padding:8px 16px;border-radius:6px;background:#edf0f4;border:none;color:#1a2030;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;transition:background .15s}.demo-retry-btn:hover{background:#dde2e8}.demo-writing-scores{display:flex;flex-direction:column;gap:12px;padding:0 32px 24px}.demo-writing-score-row{display:flex;align-items:center;gap:12px}.demo-writing-score-label{font-size:13px;color:#4a5568;min-width:160px;flex-shrink:0}.demo-writing-score-bar{flex:1;height:8px;background:#e2e6ed;border-radius:4px;overflow:hidden}.demo-writing-score-fill{height:100%;background:#0e8a84;border-radius:4px;transition:width .6s ease-out}.demo-writing-score-value{font-size:14px;font-weight:700;color:#1a2030;min-width:32px;text-align:right}.demo-audio-bar{display:flex;align-items:center;gap:12px;padding:14px 20px;background:#fff;border:1px solid #e2e6ed;border-radius:10px;margin:0 32px 16px}.demo-audio-play{width:36px;height:36px;border-radius:50%;background:#edf0f4;display:flex;align-items:center;justify-content:center;flex-shrink:0}.demo-audio-play svg{width:16px;height:16px;fill:#8494a7}.demo-audio-track{flex:1;height:4px;background:#e2e6ed;border-radius:2px;position:relative}.demo-audio-progress{height:100%;width:0%;background:#8494a7;border-radius:2px}.demo-audio-time{font-size:12px;color:#8494a7;font-variant-numeric:tabular-nums;font-weight:500;white-space:nowrap}.demo-note{text-align:center;font-size:13px;color:#8494a7;max-width:480px;margin:0 auto;line-height:1.5}.demo-cta{text-align:center;padding:28px 24px;background:#1a2030;margin:0 32px 24px;border-radius:12px}.demo-cta-title{font-size:17px;font-weight:700;color:#fff;margin-bottom:6px}.demo-cta-desc{font-size:13px;color:#ffffff80;max-width:360px;margin:0 auto 16px;line-height:1.5}.demo-cta-btn{display:inline-block;padding:12px 32px;border-radius:8px;background:linear-gradient(135deg,#0e8a84,#38b2ac);color:#fff;font-size:14px;font-weight:700;text-decoration:none;transition:transform .15s,box-shadow .15s}.demo-cta-btn:hover{transform:translateY(-1px);box-shadow:0 4px 20px #0e8a844d}.demo-listening-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f8f9fbd9;backdrop-filter:blur(2px);border-radius:0 0 16px 16px;z-index:10}.demo-listening-badge{padding:10px 20px;border-radius:8px;background:#1a2030;color:#fff;font-size:13px;font-weight:600}@media(max-width:640px){.demo-section-nav{max-width:100%;border-radius:8px;padding:6px 8px}.demo-section-nav-item{padding:5px 10px;font-size:12px}.demo-cert-selector{gap:2px}.demo-cert-btn{padding:6px 10px;font-size:12px}.demo-gap-dropdown{min-width:160px}}@media(max-width:540px){.demo-card-body{padding:20px 16px}.demo-feedback{padding:0 16px 16px}.demo-scaffold-phase{margin:0 16px 12px}.demo-writing-scores{padding:0 16px 16px}.demo-writing-score-row{flex-wrap:wrap;gap:4px}.demo-writing-score-label{min-width:unset;width:100%;font-size:12px}.demo-writing-score-bar{flex:1;min-width:80px}.demo-audio-bar{margin:0 16px 12px}.demo-cta{margin:0 16px 16px}.demo-passage{font-size:15px}.demo-header{padding:10px 16px}.demo-gap-dropdown{min-width:140px;left:0;transform:none}}
