.sb-container{max-width:700px;margin:0 auto;padding:1.5rem 1rem 3rem;display:flex;flex-direction:column;gap:1.5rem}.sb-header{display:flex;align-items:center;justify-content:space-between;gap:1rem}.sb-title{font-size:1.1rem;font-weight:700;color:var(--text-main);margin:0}.sb-topic-badge{font-size:.8rem;color:var(--text-muted);background:var(--bg-surface-2);border-radius:999px;padding:.25rem .75rem;border:1px solid var(--border-subtle);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px}.sb-reset-btn{background:none;border:1px solid var(--border-subtle);border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-muted);flex-shrink:0;transition:background .15s,color .15s,transform .2s}.sb-reset-btn:hover{background:var(--bg-surface-2);color:var(--text-main);transform:rotate(-30deg)}.sb-reset-btn:active{transform:rotate(-90deg)}.sb-progress-track{height:4px;background:var(--border-subtle);border-radius:2px;overflow:hidden}.sb-progress-fill{height:100%;background:var(--accent-warm);border-radius:2px;transition:width .4s ease}.sb-drop-zone-label{font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin-bottom:.5rem}.sb-drop-zone{min-height:130px;border:1.5px solid var(--border-subtle);border-radius:var(--radius-lg, 16px);padding:.75rem;display:flex;flex-wrap:wrap;gap:.5rem;align-content:flex-start;transition:border-color .2s,background .2s,box-shadow .2s;background:var(--bg-card, #fff);box-shadow:0 4px 12px #00000005}.sb-drop-zone.sb-has-chunks{border-color:var(--accent-warm);border-style:solid}.sb-drop-zone.sb-correct{border-color:var(--color-success, #22c55e);background:var(--color-success-bg, rgba(34, 197, 94, .08));border-style:solid}.sb-drop-zone.sb-incorrect{border-color:var(--color-error, #ef4444);background:#ef44440f;border-style:solid;animation:sb-shake .4s ease}@keyframes sb-shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.sb-chunk{display:inline-flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.75rem 1.25rem .75rem 1.5rem;border-radius:999px;border:1.5px solid var(--border-subtle);background:var(--bg-card, #fff);color:var(--text-main);font-size:1.2rem;font-weight:500;cursor:pointer;transition:background .15s,border-color .15s,color .15s,transform .12s,box-shadow .12s;-webkit-user-select:none;user-select:none;white-space:nowrap;font-family:var(--font-serif-body, inherit)}.sb-chunk:hover{background:var(--bg-surface-2);border-color:var(--accent-warm);transform:translateY(-2px);box-shadow:0 4px 12px #00000014}.sb-chunk:active{transform:translateY(0);box-shadow:none}.sb-chunk.placed{background:var(--accent-warm);border-color:var(--accent-warm);color:#fff}.sb-chunk.placed:hover{background:var(--accent-warm-dark, #7a3a10);border-color:var(--accent-warm-dark, #7a3a10);transform:translateY(-2px)}.sb-chunk.correct{background:var(--color-success, #22c55e);border-color:var(--color-success, #22c55e);color:#fff;cursor:default;animation:sb-pop .25s ease}.sb-chunk.incorrect{background:var(--color-error, #ef4444);border-color:var(--color-error, #ef4444);color:#fff;cursor:default}@keyframes sb-pop{0%{transform:scale(.9)}60%{transform:scale(1.08)}to{transform:scale(1)}}.sb-available-label{font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin-bottom:.5rem}.sb-available-chunks{display:flex;flex-wrap:wrap;gap:.5rem;min-height:48px}.sb-feedback{text-align:center;font-size:1rem;font-weight:700;padding:.5rem 0;min-height:1.6rem;transition:opacity .2s}.sb-feedback.correct{color:var(--color-success, #22c55e)}.sb-feedback.incorrect{color:var(--color-error, #ef4444)}.sb-translation-row{display:inline-flex;align-items:center;gap:.75rem;padding:.5rem 1.2rem;background:var(--bg-card, #fff);border:1.5px solid var(--border-subtle);border-radius:999px;box-shadow:0 4px 12px #00000005;font-size:1.05rem;color:var(--text-main);width:fit-content;margin:.5rem 0;align-self:flex-start;font-weight:500}.sb-translation-toggle{background:none;border:none;cursor:pointer;color:var(--text-muted);padding:0;display:flex;align-items:center;gap:.4rem;font-size:.9rem;text-decoration:none;transition:color .15s;font-weight:600}.sb-translation-toggle:hover{color:var(--accent-warm)}.sb-translation-text{transition:opacity .2s}.sb-translation-text.hidden{opacity:0;pointer-events:none;-webkit-user-select:none;user-select:none}.sb-next-btn{width:100%;padding:.85rem;font-size:1rem;font-weight:700;border-radius:var(--radius-md, 12px);background:var(--color-success, #22c55e);color:#fff;border:none;cursor:pointer;transition:background .15s,transform .12s;animation:sb-pop .3s ease}.sb-next-btn:hover{background:#16a34a;transform:translateY(-1px)}.sb-next-btn:active{transform:translateY(0)}.sb-status-bar{display:flex;justify-content:space-between;border-top:1px solid var(--border-subtle);padding-top:.75rem;font-size:.8rem;color:var(--text-muted)}.sb-status-bar strong{color:var(--text-main)}.sb-summary{text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.25rem;padding:2rem 1rem}.sb-summary-score{font-size:3.5rem;font-weight:800;color:var(--accent-warm);line-height:1}.sb-summary-label{font-size:1rem;color:var(--text-muted)}.sb-summary-title{font-size:1.5rem;font-weight:700;color:var(--text-main)}.sb-summary-actions{display:flex;flex-direction:column;gap:.75rem;width:100%;max-width:320px}.sb-key-badge{display:inline-flex;align-items:center;justify-content:center;font-size:1.05rem;opacity:.7;margin-right:9px;border:1px solid var(--border-subtle);padding:.075rem .375rem;border-radius:6px;background:var(--bg-secondary, var(--bg-surface-2, #f5f5f5));font-weight:700;color:var(--text-muted)}@media(max-width:768px){.sb-key-badge{display:none!important}}.sb-chunk-audio-btn{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;color:currentColor;opacity:.45;transition:opacity .15s,background-color .15s,transform .1s;cursor:pointer;flex-shrink:0}.sb-chunk-audio-btn:hover{opacity:.95;background-color:#00000014;transform:scale(1.1)}.sb-chunk.placed .sb-chunk-audio-btn:hover,.sb-chunk.correct .sb-chunk-audio-btn:hover,.sb-chunk.incorrect .sb-chunk-audio-btn:hover{background-color:#ffffff2e}.sb-sentence-audio-btn:hover{color:var(--accent-warm)!important;background-color:var(--bg-surface-2)!important;transform:scale(1.05)}.sb-sentence-audio-btn:active{transform:scale(.95)}.sb-copy-btn:hover{background-color:var(--bg-surface-2, #f3f4f6)!important;color:var(--text-main)!important;border-color:var(--accent-warm)!important}.sb-copy-btn:active{transform:scale(.95)}#sbTranscriptBody::-webkit-scrollbar{width:6px}#sbTranscriptBody::-webkit-scrollbar-track{background:transparent}#sbTranscriptBody::-webkit-scrollbar-thumb{background:var(--border-subtle, #e5e7eb);border-radius:3px}#sbTranscriptBody::-webkit-scrollbar-thumb:hover{background:var(--text-muted, #9ca3af)}