.sample-selector{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:26px}.sample-selector>a{display:flex;gap:12px;align-items:center;border:1px solid var(--line);background:#fff;border-radius:12px;padding:17px 18px;min-width:0}.sample-selector>a>span{font-size:11px;color:#738764}.sample-selector strong{font-size:12px;font-weight:600;line-height:1.5}.sample-selector small{display:block;font-size:10px;font-weight:400;color:var(--muted);margin-top:5px}.sample-selector .icon{width:15px;height:15px;flex-shrink:0;margin-left:auto}.sample-selector>a.selected{background:var(--green);color:#fff;border-color:var(--green)}.sample-selector>a.selected>span,.sample-selector>a.selected small{color:#d9e8ce}.sample-showcase{margin:30px 0}.sample-showcase .sample-selector{margin-bottom:12px}.sample-journey-card{display:flex;justify-content:space-between;gap:25px;align-items:center;background:#f0f5e7;border:1px solid #dce7cd;border-radius:12px;padding:23px;margin:22px 0}.sample-journey-card h3{font-size:21px;letter-spacing:-.4px}.sample-journey-card p{font-size:12px;line-height:1.8;margin:10px 0;color:var(--muted)}.sample-journey-card small{font-size:10px;color:#688255}.sample-journey-card>.btn{flex-shrink:0}
.sample-lesson-description{font-size:13px;line-height:1.9;color:var(--muted);margin:-12px 0 25px}.sample-stepper{grid-template-columns:repeat(var(--sample-step-count),minmax(0,1fr))}.sample-complete-banner{display:flex;align-items:center;gap:12px;background:#e6efda;border:1px solid #cbdcb9;border-radius:12px;padding:16px 20px;font-size:12px;line-height:1.8;margin-bottom:25px}.sample-complete-banner>.icon{flex-shrink:0}.sample-complete-banner>.btn{margin-left:auto;flex-shrink:0}.sample-phrase-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;margin:20px 0}.sample-phrase-grid .phrase-card{margin:0}.sample-phrase-grid .phrase-card h3{font-size:17px;line-height:1.6}.sample-error-example{border-left:3px solid #cfad8d;background:#fbf3eb;padding:22px;border-radius:0 12px 12px 0;margin:24px 0}.sample-error-example p{font-size:13px;line-height:1.9;margin:9px 0}.sample-error-example del{color:#a17156}.sample-error-example .icon{width:16px;height:16px;margin:0 6px;vertical-align:middle}.sample-error-example small{font-size:10px;color:var(--muted)}
.sample-receipt{display:grid;grid-template-columns:1fr 1fr;border:1px dashed #c8d1bd;border-radius:12px;background:#fcfcf8;margin:24px 0}.sample-receipt>div{padding:21px}.sample-receipt>div+div{border-left:1px dashed #c8d1bd}.sample-receipt h3{font-size:15px;line-height:1.6}.sample-receipt p{font-size:12px;line-height:1.8;margin:12px 0}.sample-receipt p strong{float:right}.sample-receipt small{font-size:10px;color:var(--muted);line-height:1.8}.sample-receipt>div>strong{font-size:12px}.sample-listen-card{display:flex;align-items:center;gap:15px;padding:25px;background:#eaf0e2;border-radius:14px;margin-top:22px;flex-wrap:wrap}.sample-listen-symbol{width:45px;height:45px;display:grid;place-items:center;background:#d8e4c9;border-radius:12px;flex-shrink:0}.sample-listen-card>div{flex:1;min-width:180px}.sample-listen-card h3{font-size:17px;line-height:1.5}.sample-listen-card p{font-size:10px;line-height:1.8;color:var(--muted);margin:7px 0 0}.sample-quiz{margin:27px 0}.sample-quiz h3{font-size:16px;line-height:1.7}.sample-quiz>div{display:grid;gap:10px;margin-top:17px}.sample-choice{width:100%;text-align:left;border:1px solid #dce3d4;border-radius:9px;padding:14px 16px;font-size:12px;line-height:1.8;background:#fff}.sample-choice:hover{background:#f5f8f0}.sample-choice.chosen{background:#edf4e1;border-color:#8ca66e}.sample-quiz-result{display:flex;align-items:flex-start;gap:8px;font-size:12px;color:#9b6438;margin-top:16px;line-height:1.8}.sample-quiz-result.correct{color:var(--green)}.sample-quiz-result>.icon{flex-shrink:0;margin-top:2px}.sample-language-help{padding:17px 0;border-top:1px solid var(--line)}.sample-language-help p{font-size:12px;line-height:1.9;margin-top:12px;color:var(--muted)}.sample-topic-options,.sample-challenge{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}.sample-challenge>span{font-size:11px;color:var(--muted);align-self:center;margin-right:4px}
.sample-fluency-note{display:flex;align-items:center;gap:9px;background:var(--lavender);color:#6c5d7b;padding:16px;border-radius:10px;margin:20px 0;font-size:11px;line-height:1.9}.sample-fluency-note>.icon{flex-shrink:0}.sample-chat{border:1px solid var(--line);border-radius:14px;overflow:hidden;margin:23px 0;background:#fff}.sample-chat .chat-header{padding:18px}.sample-chat .chat-header h3{font-size:13px;line-height:1.5}.sample-chat .chat-header p{font-size:9px}.sample-chat .chat-header>.icon-btn{margin-left:auto}.sample-chat .chat-messages{min-height:220px;height:auto;max-height:450px;padding:20px}.sample-chat .chat-compose{padding:18px}.sample-chat .chat-compose form{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:9px;padding:6px 7px 6px 12px;background:#fff}.sample-chat input{border:0;background:transparent;flex:1;min-width:0;outline:none;font-size:12px;padding:8px 0;color:var(--ink)}.sample-chat .send-button{width:34px;height:34px;border-radius:8px;background:var(--green);color:#fff;display:grid;place-items:center;flex-shrink:0}.sample-chat .chat-compose>small{display:block;font-size:9px;margin-top:9px;color:var(--muted)}
.sample-turn-tip{background:#f7f2e9;border-left:3px solid #d0b283;border-radius:0 9px 9px 0;padding:17px 20px}.sample-turn-tip strong{font-size:11px}.sample-turn-tip p{font-size:13px;line-height:1.8;margin:9px 0}.sample-turn-tip small{font-size:10px;color:var(--muted);line-height:1.7}.sample-chat-summary{padding:24px;background:#edf3e5;border:1px solid #d8e4cb;border-radius:12px;margin:24px 0}.sample-chat-summary h3{font-size:20px;line-height:1.5}.sample-chat-summary ol{padding-left:20px;margin:15px 0}.sample-chat-summary li{font-size:13px;line-height:1.85;margin:9px 0}.sample-chat-summary .form-note{font-size:10px}
.sample-recorder{margin:23px 0}.sample-recorder #recording-output{max-width:100%;overflow-wrap:anywhere}.sample-recorder #recording-output audio{max-width:100%}.sample-speaking-prompt{font-size:12px;line-height:1.8;color:var(--muted);margin:24px 0}.sample-task-card{padding:25px;border:1px solid #dfe6d6;border-radius:14px;background:#f4f7ee;margin:24px 0}.sample-task-card .big-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#dfe9d1;margin-bottom:20px}.sample-task-card h3{font-size:21px;line-height:1.5}.sample-task-card p{font-size:12px;line-height:1.9;color:var(--muted);margin:16px 0}.sample-task-card .check-list{margin:20px 0;font-size:12px;line-height:1.9}.sample-completion-hint{font-size:10px;color:var(--muted);line-height:1.8;margin:12px 0 0}.sample-goals{padding:22px;margin-bottom:25px}.sample-goals h2{font-size:19px;line-height:1.4}.sample-goals ul{list-style:none;padding:0;margin:18px 0}.sample-goals li{display:flex;align-items:flex-start;gap:8px;font-size:12px;line-height:1.8;margin:12px 0}.sample-goals li>.icon{flex-shrink:0;width:15px;height:15px;margin-top:3px}.sample-rubric{padding:22px;border-radius:13px;background:var(--lavender);margin-top:24px}.sample-rubric h3{font-size:15px;line-height:1.7}.sample-rubric ol{padding-left:18px;margin:13px 0}.sample-rubric li{font-size:11px;line-height:1.9;margin:6px 0}.sample-rubric p{font-size:10px;line-height:1.8;color:#746582}
@media(max-width:1150px){.sample-selector>a{padding:14px 12px;gap:8px}.sample-selector strong{font-size:11px}.sample-selector small{font-size:9px}.sample-receipt{grid-template-columns:1fr}.sample-receipt>div+div{border-left:0;border-top:1px dashed #c8d1bd}.sample-phrase-grid{grid-template-columns:1fr}.sample-journey-card{align-items:flex-start;flex-direction:column;gap:16px}}
@media(max-width:700px){.sample-selector{grid-template-columns:1fr;gap:8px}.sample-selector>a{padding:12px 15px}.sample-selector strong{font-size:12px}.sample-selector small{display:inline;margin-left:10px;font-size:9px}.sample-stepper{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.sample-complete-banner{flex-wrap:wrap;font-size:11px;padding:15px}.sample-complete-banner>.btn{margin-left:0}.sample-listen-card{padding:20px}.sample-lesson-description{font-size:12px}.sample-task-card{padding:21px 18px}.sample-chat-summary{padding:21px 18px}.sample-chat-summary h3{font-size:18px}.sample-challenge .btn{font-size:10px;padding:9px 11px}.sample-goals{padding:21px}.sample-journey-card{padding:20px}.sample-receipt>div{padding:18px}}
