[data-css-theme] [data-zone=learner] :is([data-section=lessons],[data-section=programs],[data-section=albums]){background:var(--learner-color-page)}[data-css-theme] [data-zone=learner] :is([data-section=lessons],[data-section=programs],[data-section=albums]) .hc-course-shell{gap:var(--learner-space-6)}[data-css-theme] [data-zone=learner] :is([data-section=lessons],[data-section=programs],[data-section=albums]) .hc-course-sidebar{background:var(--learner-color-surface);border:1px solid var(--learner-color-border-soft);border-radius:var(--learner-radius-lg);box-shadow:var(--learner-shadow-sm)}[data-css-theme] [data-zone=learner] :is([data-section=lessons],[data-section=programs],[data-section=albums]) .hc-course-item{border-radius:var(--learner-radius-sm);transition:background var(--learner-duration-fast) var(--learner-ease-out)}[data-css-theme] [data-zone=learner] :is([data-section=lessons],[data-section=programs],[data-section=albums]) .hc-course-item:hover{background:var(--learner-color-surface-soft)}[data-css-theme] [data-zone=learner] :is([data-section=lessons],[data-section=programs],[data-section=albums]) .hc-course-item--active{background:var(--learner-color-brand-soft);color:var(--learner-color-brand-strong)}[data-css-theme] [data-zone=learner] [data-section=lessons] .hc-lesson,[data-css-theme] [data-zone=learner] [data-section=lessons] .hc-lesson__card{background:var(--learner-color-surface);border-radius:var(--learner-radius-lg);border:1px solid var(--learner-color-border-soft);box-shadow:var(--learner-shadow-sm)}[data-css-theme] [data-zone=learner] [data-section=albums] .hc-album-card,[data-css-theme] [data-zone=learner] [data-section=albums] .lhphuc-voca-album-card{border-radius:var(--learner-radius-md)}[data-css-theme] [data-zone=learner] .hc-lesson,[data-css-theme] [data-zone=learner] .hc-lesson__card{background:var(--learner-color-surface);border:1px solid var(--learner-color-border-soft);border-radius:var(--learner-radius-lg);box-shadow:var(--learner-shadow-sm);padding:var(--learner-space-6);margin-bottom:var(--learner-space-5)}[data-css-theme] [data-zone=learner] .hc-lessons{display:flex;flex-direction:column;gap:var(--learner-space-4)}[data-css-theme] [data-zone=learner] .hc-lesson__header{display:flex;align-items:center;justify-content:space-between;gap:var(--learner-space-3);padding-bottom:var(--learner-space-4);border-bottom:1px solid var(--learner-color-border-soft);margin-bottom:var(--learner-space-4)}[data-css-theme] [data-zone=learner] .hc-lesson__title{color:var(--learner-color-text-strong);font-size:var(--learner-text-xl);font-weight:700;letter-spacing:-.01em}[data-css-theme] [data-zone=learner] .hc-lesson__subtitle{color:var(--learner-color-text-muted);font-size:var(--learner-text-sm);font-weight:500}[data-css-theme] [data-zone=learner] .hc-lesson__tag{background:var(--learner-color-brand-soft);color:var(--learner-color-brand-strong);border-radius:var(--learner-radius-pill);padding:2px 10px;font-size:var(--learner-text-xs);font-weight:700}[data-css-theme] [data-zone=learner] .hc-lesson__time{color:var(--learner-color-text-muted);font-size:var(--learner-text-xs);font-variant-numeric:tabular-nums}[data-css-theme] [data-zone=learner] .hc-lesson__sentences{display:flex;flex-direction:column;gap:var(--learner-space-3)}[data-css-theme] [data-zone=learner] .hc-lesson__sentence-num{background:var(--learner-color-surface-soft);color:var(--learner-color-text-muted);border-radius:var(--learner-radius-pill);padding:2px var(--learner-space-2);font-size:var(--learner-text-xs);flex-shrink:0}[data-css-theme] [data-zone=learner] .hc-lesson__sentence-en{color:var(--learner-color-text);font-size:var(--learner-text-base);line-height:1.6}[data-css-theme] [data-zone=learner] .hc-lesson__sentence-vi{color:var(--learner-color-text-muted);font-size:var(--learner-text-sm);line-height:1.55}[data-css-theme] [data-zone=learner] .hc-lesson__sentence-play{background:var(--learner-color-brand-soft);color:var(--learner-color-brand-strong);border:0;border-radius:50%;width:32px;height:32px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background var(--learner-duration-fast) var(--learner-ease-out)}[data-css-theme] [data-zone=learner] .hc-lesson__sentence-play:hover{background:var(--learner-color-brand-border)}[data-css-theme] [data-zone=learner] .hc-lesson__translate-toggle{display:inline-flex;align-items:center;gap:var(--learner-space-2);padding:6px 12px;border-radius:var(--learner-radius-pill);background:var(--learner-color-surface-soft);color:var(--learner-color-text-muted);border:1px solid var(--learner-color-border-soft);font-size:var(--learner-text-xs);font-weight:600;cursor:pointer}[data-css-theme] [data-zone=learner] .hc-lesson__translate-toggle.is-active,[data-css-theme] [data-zone=learner] .hc-lesson__translate-toggle[data-active=true]{background:var(--learner-color-brand);color:var(--learner-color-text-inverse);border-color:var(--learner-color-brand)}[data-css-theme] [data-zone=learner] .hc-lesson__footer{margin-top:var(--learner-space-5);padding-top:var(--learner-space-5);border-top:1px solid var(--learner-color-border-soft);display:flex;flex-wrap:wrap;gap:var(--learner-space-3);align-items:center;justify-content:space-between}[data-css-theme] [data-zone=learner] .hc-lesson__btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--learner-space-2);padding:10px 18px;border-radius:var(--learner-radius-pill);font-family:var(--learner-font-body);font-size:var(--learner-text-sm);font-weight:600;border:1px solid var(--learner-color-border);background:var(--learner-color-surface);color:var(--learner-color-text);cursor:pointer;transition:all var(--learner-duration-fast) var(--learner-ease-out)}[data-css-theme] [data-zone=learner] .hc-lesson__btn:hover{background:var(--learner-color-surface-soft);border-color:var(--learner-color-border-strong)}[data-css-theme] [data-zone=learner] .hc-lesson__btn--complete{background:var(--learner-color-brand);color:var(--learner-color-text-inverse);border-color:var(--learner-color-brand)}[data-css-theme] [data-zone=learner] .hc-lesson__btn--complete:hover{background:var(--learner-color-brand-strong);border-color:var(--learner-color-brand-strong)}[data-css-theme] [data-zone=learner] .hc-lesson__btn--close{background:transparent;color:var(--learner-color-text-muted);border-color:transparent}[data-css-theme] [data-zone=learner] .hc-lesson__btn--close:hover{background:var(--learner-color-surface-soft);color:var(--learner-color-text)}[data-css-theme] [data-zone=learner] .hc-lesson__play-btn{background:var(--learner-color-brand);color:var(--learner-color-text-inverse);border:0;border-radius:50%;width:48px;height:48px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--learner-shadow-md);transition:transform var(--learner-duration-fast) var(--learner-ease-out),box-shadow var(--learner-duration-fast) var(--learner-ease-out)}[data-css-theme] [data-zone=learner] .hc-lesson__play-btn:hover{transform:scale(1.05);box-shadow:var(--learner-shadow-lg)}[data-css-theme] [data-zone=learner] .hc-course-card__stat{color:var(--learner-color-text-muted);font-size:var(--learner-text-xs);font-weight:600}[data-css-theme] [data-zone=learner] .hc-course-card__progress-foot{margin-top:var(--learner-space-3);padding-top:var(--learner-space-3);border-top:1px solid var(--learner-color-border-soft);display:flex;align-items:center;justify-content:space-between;gap:var(--learner-space-2)}[data-css-theme] [data-zone=learner] .hc-lesson__sentence{background:#fff;border:1px solid #e6e8ec;border-radius:14px;gap:var(--learner-space-4);padding:var(--learner-space-4) 18px}[data-css-theme] [data-zone=learner] .hc-lesson__sentence:hover{border-color:#cbd5e1;background:#fafbfc}[data-css-theme] [data-zone=learner] .hc-lesson__sentence.is-active{background:#eff6ff;border-color:#3b82f6;box-shadow:0 0 0 1px #3b82f6}[data-css-theme] [data-zone=learner] .hc-lesson__sentence-num{width:30px;height:30px;padding:0;border-radius:8px;background:#eef1f5;color:#64748b;font-size:var(--learner-text-sm);font-weight:700;display:inline-flex;align-items:center;justify-content:center}[data-css-theme] [data-zone=learner] .hc-lesson__sentence.is-active .hc-lesson__sentence-num{background:#3b82f6;color:#fff}[data-css-theme] [data-zone=learner] .hc-lesson__sentence-en{display:block;font-weight:700;color:#0f172a}[data-css-theme] [data-zone=learner] .hc-lesson__sentence-vi{display:block;margin-top:3px;margin-left:0;color:#64748b}[data-css-theme] [data-zone=learner] .hc-lesson__sentence-play{width:28px;height:28px;background:transparent;color:#94a3b8;border-radius:6px}[data-css-theme] [data-zone=learner] .hc-lesson__sentence-play:hover{background:#eff6ff;color:#3b82f6}[data-css-theme] [data-zone=learner] .hc-lesson__play-btn{background:#fff;color:#3b82f6;border:1px solid var(--learner-color-border-soft,#e2e8f0);box-shadow:none}[data-css-theme] [data-zone=learner] .hc-lesson__play-btn:hover{border-color:#3b82f6;transform:scale(1.04);box-shadow:0 2px 8px rgba(59,130,246,.18)}[data-css-theme] [data-zone=learner] [data-section=vocabulary]{background:var(--learner-color-page)}[data-css-theme] [data-zone=learner] [data-section=vocabulary] .lhp-vt-card,[data-css-theme] [data-zone=learner] [data-section=vocabulary] .lhphuc-voca-card{background:var(--learner-color-surface);border-radius:var(--learner-radius-md);border:1px solid var(--learner-color-border-soft);box-shadow:var(--learner-shadow-sm);transition:box-shadow var(--learner-duration-base) var(--learner-ease-out)}[data-css-theme] [data-zone=learner] [data-section=vocabulary] .lhp-vt-card:hover,[data-css-theme] [data-zone=learner] [data-section=vocabulary] .lhphuc-voca-card:hover{box-shadow:var(--learner-shadow-md)}[data-css-theme] [data-zone=learner] [data-section=vocabulary] .lhphuc-voca-headword,[data-css-theme] [data-zone=learner] [data-section=vocabulary] .lhphuc-voca-word{color:var(--learner-color-text-strong);font-weight:700}[data-css-theme] [data-zone=learner] [data-section=vocabulary] .lhphuc-voca-meaning{color:var(--learner-color-text-muted)}[data-css-theme] [data-zone=learner] [data-section=vocabulary] .lhp-vt-pill,[data-css-theme] [data-zone=learner] [data-section=vocabulary] .lhphuc-voca-pill{background:var(--learner-color-surface-soft);color:var(--learner-color-text-muted);border-radius:var(--learner-radius-pill);border:1px solid var(--learner-color-border-soft)}[data-css-theme] [data-zone=learner] [data-section=vocabulary] .lhphuc-voca-btn-primary{background:var(--learner-color-brand);color:var(--learner-color-text-inverse);border-radius:var(--learner-radius-pill)}[data-css-theme] [data-zone=learner] .lhp-vt-page{background:var(--learner-color-page);color:var(--learner-color-text)}[data-css-theme] [data-zone=learner] .lhp-vt-page-head{background:var(--learner-color-surface);border:1px solid var(--learner-color-border-soft);border-radius:var(--learner-radius-lg);padding:var(--learner-space-5) var(--learner-space-6);box-shadow:var(--learner-shadow-xs);margin-bottom:var(--learner-space-5)}[data-css-theme] [data-zone=learner] .lhp-vt-breadcrumb{color:var(--learner-color-text-muted);font-size:var(--learner-text-sm);font-weight:600}[data-css-theme] [data-zone=learner] .lhp-vt-breadcrumb a{color:var(--learner-color-brand)}[data-css-theme] [data-zone=learner] .lhp-vt-backbanner{background:var(--learner-color-brand-soft);border-radius:var(--learner-radius-md);padding:var(--learner-space-3) var(--learner-space-4);color:var(--learner-color-brand-strong);border:1px solid var(--learner-color-brand-border)}[data-css-theme] [data-zone=learner] .lhp-vt-layer1-notice{background:var(--learner-color-info-soft);border-radius:var(--learner-radius-md);padding:var(--learner-space-4);border:1px solid var(--learner-color-border-soft)}[data-css-theme] [data-zone=learner] .lhp-vt-layer1-notice__track{display:flex;gap:var(--learner-space-3)}[data-css-theme] [data-zone=learner] .lhp-vt-layer1-notice__item{background:var(--learner-color-surface);border-radius:var(--learner-radius-md);padding:var(--learner-space-3)}[data-css-theme] [data-zone=learner] .lhp-vt-book-card{box-shadow:var(--learner-shadow-sm);transition:box-shadow var(--learner-duration-base) var(--learner-ease-out),transform var(--learner-duration-base) var(--learner-ease-out),border-color var(--learner-duration-base) var(--learner-ease-out)}[data-css-theme] [data-zone=learner] .lhp-vt-book-card:hover{box-shadow:var(--learner-shadow-md);transform:translateY(-1px)}[data-css-theme] [data-zone=learner] .lhp-vt-book-card__title{color:var(--learner-color-text-strong);font-weight:700;font-size:var(--learner-text-md)}[data-css-theme] [data-zone=learner] .lhp-vt-book-card__meta{color:var(--learner-color-text-muted);font-size:var(--learner-text-sm)}[data-css-theme] [data-zone=learner] .lhp-vt-tests-list{gap:var(--learner-space-3)}[data-css-theme] [data-zone=learner] .lhp-vt-test-row{background:var(--learner-color-surface);border:1px solid var(--learner-color-border-soft);border-radius:var(--learner-radius-lg);box-shadow:var(--learner-shadow-xs);transition:box-shadow var(--learner-duration-base) var(--learner-ease-out),transform var(--learner-duration-base) var(--learner-ease-out),border-color var(--learner-duration-base) var(--learner-ease-out)}[data-css-theme] [data-zone=learner] .lhp-vt-test-row:hover{box-shadow:var(--learner-shadow-md);transform:translateY(-1px);border-color:var(--learner-color-border)}[data-css-theme] [data-zone=learner] .lhp-vt-test-row__body{flex:1;min-width:0}[data-css-theme] [data-zone=learner] .lhp-vt-test-row__status{font-size:var(--learner-text-xs);font-weight:600}[data-css-theme] [data-zone=learner] .lhp-vt-test-row__status--done{color:var(--learner-color-success)}[data-css-theme] [data-zone=learner] .lhp-vt-test-row__status--pending{color:var(--learner-color-warning)}[data-css-theme] [data-zone=learner] .lhp-vt-test-row__arrow{color:var(--learner-color-text-muted)}[data-css-theme] [data-zone=learner] .lhp-vt-albums-grid{gap:var(--learner-space-5)}[data-css-theme] [data-zone=learner] .lhp-vt-album-card{box-shadow:var(--learner-shadow-sm);transition:box-shadow var(--learner-duration-base) var(--learner-ease-out),transform var(--learner-duration-base) var(--learner-ease-out)}[data-css-theme] [data-zone=learner] .lhp-vt-album-card:hover{box-shadow:var(--learner-shadow-md);transform:translateY(-1px)}[data-css-theme] [data-zone=learner] .lhp-vt-album-card__title{color:var(--learner-color-text-strong);font-weight:700}[data-css-theme] [data-zone=learner] .lhp-vt-album-card__fsrs{background:var(--learner-color-surface-soft);border-radius:var(--learner-radius-sm);padding:var(--learner-space-2) var(--learner-space-3);color:var(--learner-color-text-muted);font-size:var(--learner-text-xs)}[data-css-theme] [data-zone=learner] .lhp-vt-filters{background:transparent;border:0;border-radius:0;box-shadow:none;padding:0;align-items:center;margin-bottom:var(--learner-space-5)}[data-css-theme] [data-zone=learner] .lhp-vt-filters__selects{width:auto;flex:1 1 auto;align-items:center}[data-css-theme] [data-zone=learner] .lhp-vt-filters__selects select{padding:6px var(--learner-space-3);border:1px solid var(--learner-color-border);border-radius:var(--learner-radius-sm);background:var(--learner-color-surface);color:var(--learner-color-text);font-size:var(--learner-text-sm)}[data-css-theme] [data-zone=learner] .lhp-vt-filters__search{flex:1}[data-css-theme] [data-zone=learner] .lhp-vt-filters__search input{width:100%;padding:var(--learner-space-2) 14px;border:1px solid var(--learner-color-border);border-radius:var(--learner-radius-sm);background:var(--learner-color-surface);color:var(--learner-color-text)}[data-css-theme] [data-zone=learner] .lhp-vt-filters__search input:focus{outline:none;border-color:var(--learner-color-brand);box-shadow:0 0 0 3px var(--learner-color-brand-soft)}[data-css-theme] [data-zone=learner] .lhp-vt-sel{background:var(--learner-color-brand-soft);color:var(--learner-color-brand-strong);border-radius:var(--learner-radius-pill);padding:2px 10px;font-size:var(--learner-text-xs);font-weight:700}[data-css-theme] [data-zone=learner] .lhp-vt-membership__meta{background:var(--learner-color-warning-soft);border:1px solid var(--learner-color-warning);border-radius:var(--learner-radius-md);padding:var(--learner-space-3) var(--learner-space-4);color:var(--learner-color-warning);font-weight:600}[data-css-theme] [data-zone=learner] .lhp-vt-lock{color:var(--learner-color-warning)}[data-css-theme] [data-zone=learner] .lhphuc-voca-word-card{background:var(--learner-color-surface);border:1px solid var(--learner-color-border-soft);border-radius:var(--learner-radius-lg);padding:var(--learner-space-6);box-shadow:var(--learner-shadow-sm)}[data-css-theme] [data-zone=learner] .lhphuc-voca-headword,[data-css-theme] [data-zone=learner] .lhphuc-voca-word{color:var(--learner-color-text-strong);font-weight:700;font-size:var(--learner-text-2xl)}[data-css-theme] [data-zone=learner] .lhphuc-voca-ipa{color:var(--learner-color-text-muted);font-style:italic;font-family:var(--learner-font-body)}[data-css-theme] [data-zone=learner] .lhphuc-voca-meaning,[data-css-theme] [data-zone=learner] .lhphuc-voca-vi{color:var(--learner-color-text);font-size:var(--learner-text-md)}[data-css-theme] [data-zone=learner] .lhphuc-voca-en,[data-css-theme] [data-zone=learner] .lhphuc-voca-en-meaning{color:var(--learner-color-text-muted);font-size:var(--learner-text-sm)}[data-css-theme] [data-zone=learner] .lhphuc-voca-pos{background:var(--learner-color-brand-soft);color:var(--learner-color-brand-strong);border-radius:var(--learner-radius-pill);padding:2px var(--learner-space-2);font-size:var(--learner-text-xs);font-weight:600}[data-css-theme] [data-zone=learner] .lhphuc-voca-collocations{margin-top:var(--learner-space-5)}[data-css-theme] [data-zone=learner] .lhphuc-voca-collocation,[data-css-theme] [data-zone=learner] .lhphuc-voca-collocation-item{background:var(--learner-color-surface-soft);border-radius:var(--learner-radius-sm);padding:var(--learner-space-3) var(--learner-space-4);margin-bottom:var(--learner-space-2)}[data-css-theme] [data-zone=learner] .lhphuc-voca-collocation__text{color:var(--learner-color-text);font-weight:600}[data-css-theme] [data-zone=learner] .lhphuc-voca-collocation__translation{color:var(--learner-color-text-muted);font-size:var(--learner-text-sm)}[data-css-theme] [data-zone=learner] .lhphuc-voca-collocation__example{color:var(--learner-color-text-muted);font-size:var(--learner-text-sm);font-style:italic;margin-top:var(--learner-space-1)}[data-css-theme] [data-zone=learner] .lhphuc-voca__review-stat{background:var(--learner-color-surface);border:1px solid var(--learner-color-border-soft);border-radius:var(--learner-radius-md);padding:var(--learner-space-3)}[data-css-theme] [data-zone=learner] .lhphuc-voca__review-meta{color:var(--learner-color-text-muted);font-size:var(--learner-text-sm)}[data-css-theme] [data-zone=learner] .lhphuc-voca__review-status--due{color:var(--learner-color-warning);font-weight:600}[data-css-theme] [data-zone=learner] .lhphuc-voca__review-status--learning{color:var(--learner-color-info);font-weight:600}[data-css-theme] [data-zone=learner] .lhphuc-voca__review-status--mastered{color:var(--learner-color-success);font-weight:600}[data-css-theme] [data-zone=learner] .lhphuc-voca__review-rate{color:var(--learner-color-text-strong);font-weight:700;font-variant-numeric:tabular-nums}[data-css-theme] [data-zone=learner] .lhphuc-voca__review-source{color:var(--learner-color-text-muted);font-size:var(--learner-text-xs)}[data-css-theme] [data-zone=learner] .lhphuc-voca__review-quick{background:var(--learner-color-brand-soft);color:var(--learner-color-brand-strong);border-radius:var(--learner-radius-sm);padding:var(--learner-space-1) var(--learner-space-2);font-size:var(--learner-text-xs);font-weight:600}[data-css-theme] [data-zone=learner] .lhphuc-voca__muted{color:var(--learner-color-text-muted)}[data-zone=learner] .hapio-lhp-vocab{width:100%;max-width:1200px;margin:0 auto;padding:var(--learner-space-2) var(--learner-space-6) var(--learner-space-8);color:var(--learner-color-text);font-family:var(--learner-font-body)}[data-zone=learner] .hapio-lhp-pagehead h1{margin:0;font-size:var(--learner-text-2xl);font-weight:700;letter-spacing:-.01em;color:var(--learner-color-text-strong)}[data-zone=learner] .hapio-lhp-pagehead p{margin:6px 0 0;font-size:var(--learner-text-base);color:var(--learner-color-text-muted)}[data-zone=learner] .hapio-lhp-vocab__toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--learner-space-3);margin:var(--learner-space-5) 0}[data-zone=learner] .hapio-lhp-vocab__search{position:relative;flex:1;min-width:230px}[data-zone=learner] .hapio-lhp-vocab__search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--learner-color-text-subtle)}[data-zone=learner] .hapio-lhp-vocab__search input{width:100%;height:42px;padding:0 14px 0 39px;border:1px solid var(--learner-color-border);border-radius:var(--learner-radius-md);background:var(--learner-color-surface);color:var(--learner-color-text);font:inherit;font-size:var(--learner-text-base);box-shadow:var(--learner-shadow-xs)}[data-zone=learner] .hapio-lhp-vocab__search input::-moz-placeholder{color:var(--learner-color-text-subtle)}[data-zone=learner] .hapio-lhp-vocab__search input::placeholder{color:var(--learner-color-text-subtle)}[data-zone=learner] .hapio-lhp-vocab__search input:focus{outline:none;border-color:var(--learner-color-brand);box-shadow:0 0 0 3px var(--learner-color-brand-soft)}[data-zone=learner] .hapio-lhp-vocab__select{position:relative}[data-zone=learner] .hapio-lhp-vocab__select select{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:42px;padding:0 36px 0 var(--learner-space-4);border:1px solid var(--learner-color-border);border-radius:var(--learner-radius-md);background:var(--learner-color-surface);color:var(--learner-color-text);font:inherit;font-size:var(--learner-text-base);font-weight:600;cursor:pointer;box-shadow:var(--learner-shadow-xs)}[data-zone=learner] .hapio-lhp-vocab__select select:focus{outline:none;border-color:var(--learner-color-brand);box-shadow:0 0 0 3px var(--learner-color-brand-soft)}[data-zone=learner] .hapio-lhp-vocab__select-caret{position:absolute;right:13px;top:50%;transform:translateY(-50%);width:13px;height:13px;color:var(--learner-color-text-subtle);pointer-events:none}[data-zone=learner] .hapio-lhp-meta{display:flex;flex-wrap:wrap;gap:6px var(--learner-space-4);font-size:var(--learner-text-sm);font-weight:500;color:var(--learner-color-text-muted)}[data-zone=learner] .hapio-lhp-meta__item{display:inline-flex;align-items:center;gap:5px}[data-zone=learner] .hapio-lhp-meta__item svg{width:13px;height:13px;flex:0 0 auto;color:var(--learner-color-text-subtle)}[data-zone=learner] .hapio-lhp-meta__item b{color:var(--learner-color-text);font-weight:700;font-variant-numeric:tabular-nums}[data-zone=learner] .hapio-lhp-tag{display:inline-block;font-size:var(--learner-text-xs);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--learner-color-text-muted);border:1px solid var(--learner-color-border);background:var(--learner-color-surface);padding:3px 10px;border-radius:var(--learner-radius-pill);white-space:nowrap}[data-zone=learner] .hapio-lhp-prog{margin-top:auto;padding-top:var(--learner-space-3)}[data-zone=learner] .hapio-lhp-prog__row{display:flex;justify-content:space-between;align-items:baseline;font-size:var(--learner-text-sm);font-weight:600;color:var(--learner-color-text-muted);margin-bottom:var(--learner-space-2)}[data-zone=learner] .hapio-lhp-prog__learned{color:var(--learner-color-text);font-weight:700}[data-zone=learner] .hapio-lhp-prog__pct{font-weight:700;font-size:var(--learner-text-sm);font-variant-numeric:tabular-nums;color:var(--learner-color-text-subtle)}[data-zone=learner] .hapio-lhp-prog__pct.is-learning{color:var(--learner-color-learning-strong)}[data-zone=learner] .hapio-lhp-prog__pct.is-done{color:var(--learner-color-success-strong)}[data-zone=learner] .hapio-lhp-bar{height:6px;border-radius:var(--learner-radius-pill);background:var(--learner-color-border-soft);overflow:hidden}[data-zone=learner] .hapio-lhp-bar__fill{display:block;height:100%;border-radius:inherit;background:var(--learner-color-border-strong);transition:width .6s var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-bar__fill.is-learning{background:var(--learner-color-learning)}[data-zone=learner] .hapio-lhp-bar__fill.is-done{background:var(--learner-color-success)}[data-zone=learner] .hapio-lhp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--learner-space-4)}[data-zone=learner] .hapio-lhp-card{position:relative;display:flex;flex-direction:column;min-height:186px;padding:18px 19px;background:var(--learner-color-surface);border:1px solid var(--learner-color-border);border-radius:var(--learner-radius-lg);box-shadow:var(--learner-shadow-xs);cursor:pointer;text-decoration:none;transition:transform .24s var(--learner-ease-out),box-shadow .24s var(--learner-ease-out),border-color .24s}[data-zone=learner] .hapio-lhp-card:hover{transform:translateY(-3px);box-shadow:var(--learner-shadow-md);border-color:var(--learner-color-border-strong)}[data-zone=learner] .hapio-lhp-card:focus-visible{outline:none;border-color:var(--learner-color-brand);box-shadow:0 0 0 3px var(--learner-color-brand-soft)}[data-zone=learner] .hapio-lhp-card__head{display:flex;align-items:center;gap:10px;margin-bottom:var(--learner-space-3)}[data-zone=learner] .hapio-lhp-card__chev{margin-left:auto;width:26px;height:26px;display:grid;place-items:center;border-radius:50%;color:var(--learner-color-text-subtle);transition:transform .22s var(--learner-ease-out),color .2s}[data-zone=learner] .hapio-lhp-card__chev svg{width:17px;height:17px}[data-zone=learner] .hapio-lhp-card:hover .hapio-lhp-card__chev{color:var(--learner-color-brand);transform:translateX(2px)}[data-zone=learner] .hapio-lhp-card__title{margin:0 0 6px;font-size:var(--learner-text-md);font-weight:700;line-height:1.32;color:var(--learner-color-text-strong)}[data-zone=learner] .hapio-lhp-card__desc{margin:0 0 var(--learner-space-3);min-height:39px;font-size:var(--learner-text-sm);line-height:1.5;color:var(--learner-color-text-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}[data-zone=learner] .hapio-lhp-album__head{display:flex;align-items:flex-start;gap:10px;margin-bottom:var(--learner-space-2)}[data-zone=learner] .hapio-lhp-album__title{font-size:var(--learner-text-md);font-weight:700;line-height:1.2;color:var(--learner-color-text-strong)}[data-zone=learner] .hapio-lhp-fav{margin-left:auto;width:32px;height:32px;display:grid;place-items:center;flex:0 0 auto;border:1px solid var(--learner-color-border);border-radius:50%;background:var(--learner-color-surface);color:var(--learner-color-text-subtle);cursor:pointer;transition:all .18s}[data-zone=learner] .hapio-lhp-fav svg{width:17px;height:17px}[data-zone=learner] .hapio-lhp-fav.is-on,[data-zone=learner] .hapio-lhp-fav:hover{color:var(--learner-color-danger);border-color:var(--learner-color-danger)}[data-zone=learner] .hapio-lhp-fav.is-on{background:var(--learner-color-danger-soft)}[data-zone=learner] .hapio-lhp-astate{display:flex;align-items:center;gap:var(--learner-space-2);margin-bottom:var(--learner-space-1);font-size:var(--learner-text-sm);font-weight:700;color:var(--learner-color-learning-strong)}[data-zone=learner] .hapio-lhp-astate .dot{width:7px;height:7px;flex:0 0 auto;border-radius:50%;background:var(--learner-color-learning)}[data-zone=learner] .hapio-lhp-astate.is-done{color:var(--learner-color-success-strong)}[data-zone=learner] .hapio-lhp-astate.is-done .dot{background:var(--learner-color-success)}[data-zone=learner] .hapio-lhp-astate.is-new{color:var(--learner-color-text-subtle)}[data-zone=learner] .hapio-lhp-astate.is-new .dot{background:var(--learner-color-border-strong)}[data-zone=learner] .hapio-lhp-afsrs{font-size:var(--learner-text-sm);font-weight:500;color:var(--learner-color-text-muted)}[data-zone=learner] .hapio-lhp-afsrs b{color:var(--learner-color-text);font-weight:700;font-variant-numeric:tabular-nums}[data-zone=learner] .hapio-lhp-vols{display:flex;flex-direction:column;gap:var(--learner-space-3)}[data-zone=learner] .hapio-lhp-vol{display:flex;align-items:center;gap:var(--learner-space-4);padding:var(--learner-space-4) 22px;background:var(--learner-color-surface);border:1px solid var(--learner-color-border);border-radius:var(--learner-radius-lg);box-shadow:var(--learner-shadow-xs);cursor:pointer;text-decoration:none;transition:transform .22s var(--learner-ease-out),box-shadow .22s var(--learner-ease-out),border-color .22s}[data-zone=learner] .hapio-lhp-vol:hover{transform:translateY(-2px);box-shadow:var(--learner-shadow-md);border-color:var(--learner-color-border-strong)}[data-zone=learner] .hapio-lhp-vol:focus-visible{outline:none;border-color:var(--learner-color-brand);box-shadow:0 0 0 3px var(--learner-color-brand-soft)}[data-zone=learner] .hapio-lhp-vol__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--learner-space-2)}[data-zone=learner] .hapio-lhp-vol__title{font-size:var(--learner-text-md);font-weight:700;color:var(--learner-color-text-strong)}[data-zone=learner] .hapio-lhp-vol__end{display:flex;align-items:center;gap:22px;flex:0 0 auto}[data-zone=learner] .hapio-lhp-vol__bar{display:flex;flex-direction:column;gap:var(--learner-space-2);width:172px}[data-zone=learner] .hapio-lhp-vol__bar .hapio-lhp-prog__row{margin-bottom:0}[data-zone=learner] .hapio-lhp-vol__chev{display:grid;place-items:center;color:var(--learner-color-text-subtle);transition:transform .22s var(--learner-ease-out),color .2s}[data-zone=learner] .hapio-lhp-vol__chev svg{width:18px;height:18px}[data-zone=learner] .hapio-lhp-vol:hover .hapio-lhp-vol__chev{color:var(--learner-color-brand);transform:translateX(2px)}[data-zone=learner] .hapio-lhp-num{width:52px;height:52px;flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border-radius:var(--learner-radius-md);background:var(--learner-color-surface-soft);border:1px solid var(--learner-color-border)}[data-zone=learner] .hapio-lhp-num__label{font-size:9px;font-weight:700;letter-spacing:.12em;line-height:1;color:var(--learner-color-text-subtle)}[data-zone=learner] .hapio-lhp-num__n{font-size:var(--learner-text-xl);font-weight:700;line-height:1;color:var(--learner-color-text-strong);font-variant-numeric:tabular-nums}[data-zone=learner] .hapio-lhp-num.is-lg{width:58px;height:58px}[data-zone=learner] .hapio-lhp-num.is-lg .hapio-lhp-num__n{font-size:var(--learner-text-xl)}[data-zone=learner] .hapio-lhp-ctx{margin-bottom:var(--learner-space-5);padding:var(--learner-space-5) var(--learner-space-6);background:var(--learner-color-surface);border:1px solid var(--learner-color-border);border-radius:var(--learner-radius-xl);box-shadow:var(--learner-shadow-sm)}[data-zone=learner] .hapio-lhp-ctx__crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:var(--learner-space-2);margin-bottom:var(--learner-space-3);font-size:var(--learner-text-xs);font-weight:600;color:var(--learner-color-text-subtle)}[data-zone=learner] .hapio-lhp-ctx__crumbs a{color:var(--learner-color-text-muted);text-decoration:none}[data-zone=learner] .hapio-lhp-ctx__crumbs a:hover{color:var(--learner-color-brand-strong)}[data-zone=learner] .hapio-lhp-ctx__crumbs .sep{color:var(--learner-color-border-strong);font-weight:400}[data-zone=learner] .hapio-lhp-ctx__crumbs .cur{color:var(--learner-color-brand-strong);font-weight:700}[data-zone=learner] .hapio-lhp-ctx__main{display:flex;align-items:center;gap:18px}[data-zone=learner] .hapio-lhp-ctx__txt{flex:1;min-width:0}[data-zone=learner] .hapio-lhp-ctx__txt h1{margin:0 0 var(--learner-space-2);font-size:var(--learner-text-xl);font-weight:700;letter-spacing:-.01em;color:var(--learner-color-text-strong)}[data-zone=learner] .hapio-lhp-ctx__sum{flex:0 0 auto;display:flex;align-items:center;gap:14px;padding-left:22px;border-left:1px solid var(--learner-color-border-soft)}[data-zone=learner] .hapio-lhp-ctx__sum-label{font-size:var(--learner-text-xs);font-weight:600;color:var(--learner-color-text-muted)}[data-zone=learner] .hapio-lhp-ring{position:relative;width:54px;height:54px;display:grid;place-items:center;border-radius:50%;background:conic-gradient(var(--ring-color,var(--learner-color-border-strong)) calc(var(--ring-pct, 0) * 3.6deg),var(--learner-color-border-soft) 0)}[data-zone=learner] .hapio-lhp-ring__inner{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:var(--learner-color-surface);font-size:var(--learner-text-sm);font-weight:700;color:var(--ring-ink,var(--learner-color-text-subtle))}[data-zone=learner] .hapio-lhp-more{display:inline-flex;align-items:center;justify-content:center;height:42px;padding:0 22px;border:1px solid var(--learner-color-border);border-radius:var(--learner-radius-md);background:var(--learner-color-surface);color:var(--learner-color-text);font:inherit;font-weight:600;cursor:pointer;transition:border-color .18s,background .18s}[data-zone=learner] .hapio-lhp-more:hover{border-color:var(--learner-color-brand-border);background:var(--learner-color-brand-soft)}[data-zone=learner] .hapio-lhp-more:disabled{opacity:.55;cursor:default}[data-zone=learner] .hapio-lhp-morewrap{display:flex;justify-content:center;margin-top:var(--learner-space-4)}[data-zone=learner] .hapio-lhp-empty{padding:var(--learner-space-7);text-align:center;color:var(--learner-color-text-muted);font-size:var(--learner-text-base);line-height:1.55}[data-zone=learner] .hapio-lhp-empty__title{margin-bottom:6px;font-size:var(--learner-text-md);font-weight:700;color:var(--learner-color-text-strong)}[data-zone=learner] .hapio-lhp-cta{margin-top:auto;display:inline-flex;align-items:center;justify-content:center;gap:var(--learner-space-2);height:40px;padding:0 var(--learner-space-4);border:0;border-radius:var(--learner-radius-md);background:var(--learner-color-brand);color:var(--learner-color-text-inverse);font:inherit;font-size:var(--learner-text-sm);font-weight:700;text-decoration:none;cursor:pointer;transition:background .18s,transform .18s var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-cta svg{width:15px;height:15px;flex:0 0 auto}[data-zone=learner] .hapio-lhp-cta:hover{background:var(--learner-color-brand-strong);transform:translateY(-1px)}[data-zone=learner] .hapio-lhp-byline{display:flex;align-items:center;gap:var(--learner-space-2);min-width:0}[data-zone=learner] .hapio-lhp-byline__av{width:30px;height:30px;flex:0 0 auto;display:grid;place-items:center;border-radius:50%;overflow:hidden;background:var(--learner-color-brand-soft);color:var(--learner-color-brand-strong);font-size:var(--learner-text-xs);font-weight:700}[data-zone=learner] .hapio-lhp-byline__av img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;display:block}[data-zone=learner] .hapio-lhp-byline__who{display:flex;flex-direction:column;min-width:0;line-height:1.25}[data-zone=learner] .hapio-lhp-byline__label{font-size:var(--learner-text-xs);color:var(--learner-color-text-subtle)}[data-zone=learner] .hapio-lhp-byline__name{font-size:var(--learner-text-sm);font-weight:700;color:var(--learner-color-text);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[data-zone=learner] .hapio-lhp-fav:disabled{opacity:.5;cursor:default}[data-zone=learner] .hapio-lhp-favcard{background:var(--learner-color-surface);border:1px solid var(--learner-color-border);border-radius:var(--learner-radius-lg);overflow:hidden;cursor:pointer;transition:border-color var(--learner-duration-base) var(--learner-ease-out),box-shadow var(--learner-duration-base) var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-favcard:hover{border-color:var(--learner-color-border-strong);box-shadow:var(--learner-shadow-sm)}[data-zone=learner] .hapio-lhp-favcard__band{display:flex;align-items:center;gap:var(--learner-space-2);padding:10px 14px 10px var(--learner-space-4);background:var(--learner-color-surface-soft)}[data-zone=learner] .hapio-lhp-favcard__av{position:relative;flex:0 0 auto;width:38px;height:38px}[data-zone=learner] .hapio-lhp-favcard__av img,[data-zone=learner] .hapio-lhp-favcard__avtext{width:38px;height:38px;border-radius:50%;-o-object-fit:cover;object-fit:cover;display:grid;place-items:center}[data-zone=learner] .hapio-lhp-favcard__avtext{background:var(--learner-color-brand-soft);color:var(--learner-color-brand-strong);font-size:var(--learner-text-base);font-weight:700}[data-zone=learner] .hapio-lhp-favcard__flame{position:absolute;right:-3px;bottom:-3px;width:19px;height:19px;border-radius:50%;display:grid;place-items:center;background:var(--learner-color-learning);color:var(--learner-color-text-inverse);border:2px solid var(--learner-color-surface-soft)}[data-zone=learner] .hapio-lhp-favcard__flame svg{width:11px;height:11px}[data-zone=learner] .hapio-lhp-favcard__ic{flex:0 0 auto;width:38px;height:38px;border-radius:11px;display:grid;place-items:center}[data-zone=learner] .hapio-lhp-favcard__ic svg{width:19px;height:19px}[data-zone=learner] .hapio-lhp-favcard__ic.is-exam{background:var(--learner-color-info-soft);color:var(--learner-color-info)}[data-zone=learner] .hapio-lhp-favcard__ic.is-own{background:var(--learner-color-brand-soft);color:var(--learner-color-brand-strong)}[data-zone=learner] .hapio-lhp-favcard__who{min-width:0;line-height:1.05}[data-zone=learner] .hapio-lhp-favcard__label{display:block;font-size:var(--learner-text-xs);color:var(--learner-color-text-subtle);margin-bottom:2px}[data-zone=learner] .hapio-lhp-favcard__name{display:flex;align-items:center;gap:5px;flex-wrap:wrap;min-width:0}[data-zone=learner] .hapio-lhp-favcard__nametext{font-size:var(--learner-text-base);font-weight:700;color:var(--learner-color-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}[data-zone=learner] .hapio-lhp-favcard__tick{width:15px;height:15px;flex:0 0 auto;color:var(--learner-color-info)}[data-zone=learner] .hapio-lhp-favcard__cc{display:inline-flex;align-items:center;gap:var(--learner-space-1);height:19px;padding:0 var(--learner-space-2) 0 6px;border-radius:var(--learner-radius-pill);font-size:var(--learner-text-xs);font-weight:700;background:var(--learner-color-warning-soft);color:var(--learner-color-warning)}[data-zone=learner] .hapio-lhp-favcard__cc svg{width:12px;height:12px}[data-zone=learner] .hapio-lhp-favcard__solo{font-size:var(--learner-text-sm);font-weight:700;color:var(--learner-color-text-muted)}[data-zone=learner] .hapio-lhp-favcard__heart{margin-left:auto;flex:0 0 auto;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--learner-color-surface);color:var(--learner-color-danger);border:1px solid var(--learner-color-border-soft);cursor:pointer;transition:background var(--learner-duration-fast)}[data-zone=learner] .hapio-lhp-favcard__heart svg{width:16px;height:16px}[data-zone=learner] .hapio-lhp-favcard__heart:hover{background:var(--learner-color-danger-soft)}[data-zone=learner] .hapio-lhp-favcard__heart:disabled{opacity:.5;cursor:default}[data-zone=learner] .hapio-lhp-favcard__body{padding:var(--learner-space-3) var(--learner-space-4) var(--learner-space-4)}[data-zone=learner] .hapio-lhp-favcard__title{font-size:var(--learner-text-md);font-weight:700;color:var(--learner-color-text-strong);margin:0 0 var(--learner-space-3)}[data-zone=learner] .hapio-lhp-favcard__pill{display:inline-flex;align-items:center;gap:6px;padding:3px var(--learner-space-3);border-radius:var(--learner-radius-pill);font-size:var(--learner-text-xs);font-weight:600;background:var(--learner-color-surface-soft);color:var(--learner-color-text-muted)}[data-zone=learner] .hapio-lhp-favcard__pill .dot{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.6}[data-zone=learner] .hapio-lhp-favcard__pill.is-learn{background:var(--learner-color-learning-soft);color:var(--learner-color-learning-strong)}[data-zone=learner] .hapio-lhp-favcard__pill.is-done{background:var(--learner-color-success-soft);color:var(--learner-color-success-strong)}[data-zone=learner] .hapio-lhp-favcard__count{font-size:var(--learner-text-sm);color:var(--learner-color-text-muted);margin:10px 0}[data-zone=learner] .hapio-lhp-favcard__count b{color:var(--learner-color-text);font-weight:700}[data-zone=learner] .hapio-lhp-favcard__progrow{display:flex;align-items:center;gap:10px}[data-zone=learner] .hapio-lhp-favcard__bar{flex:1;height:6px;border-radius:var(--learner-radius-pill);background:var(--learner-color-surface-soft);overflow:hidden}[data-zone=learner] .hapio-lhp-favcard__bar>i{display:block;height:100%;border-radius:var(--learner-radius-pill);background:var(--learner-color-learning)}[data-zone=learner] .hapio-lhp-favcard__bar>i.is-done{background:var(--learner-color-success)}[data-zone=learner] .hapio-lhp-favcard__pct{flex:0 0 auto;font-size:var(--learner-text-sm);font-weight:700;color:var(--learner-color-text)}@media (max-width:720px){[data-zone=learner] .hapio-lhp-grid{grid-template-columns:1fr}[data-zone=learner] .hapio-lhp-vol{flex-wrap:wrap;gap:var(--learner-space-3) 14px;padding:14px var(--learner-space-4)}[data-zone=learner] .hapio-lhp-vol__end{width:100%;justify-content:space-between;gap:var(--learner-space-3)}[data-zone=learner] .hapio-lhp-vol__bar{flex:1;width:auto}[data-zone=learner] .hapio-lhp-ctx__main{flex-wrap:wrap}[data-zone=learner] .hapio-lhp-ctx__sum{padding-left:0;border-left:0;width:100%;justify-content:space-between}[data-zone=learner] .hapio-lhp-vocab__search{flex-basis:100%}[data-zone=learner] .hapio-lhp-vocab__select{flex:1 1 0;min-width:0}[data-zone=learner] .hapio-lhp-vocab__select select{width:100%}}[data-zone=learner] .hapio-lhp-vill{display:block;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;background:var(--learner-color-brand-soft)}[data-zone=learner] .hapio-lhp-grid--list{grid-template-columns:1fr;gap:var(--learner-space-4);max-width:820px}[data-zone=learner] .hapio-lhp-vcard{padding:0;overflow:hidden}[data-zone=learner] .hapio-lhp-vcard .hapio-lhp-vbody{display:flex;flex-direction:column;padding:16px 18px 18px;gap:4px;flex:1;min-width:0}[data-zone=learner] .hapio-lhp-vcard .hapio-lhp-vbody .hapio-lhp-album__title{margin-bottom:6px}[data-zone=learner] .hapio-lhp-vtag{display:inline-block;font-size:var(--learner-text-xs);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--learner-ink);background:var(--learner-color-surface);border:1px solid var(--learner-color-border);padding:3px 10px;border-radius:var(--learner-radius-pill);white-space:nowrap;box-shadow:var(--learner-shadow-xs)}[data-zone=learner] .hapio-lhp-vgo{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 13px;border-radius:var(--learner-radius-pill);background:var(--learner-color-brand);color:var(--learner-color-on-accent);font-size:var(--learner-text-sm);font-weight:700;box-shadow:var(--learner-shadow-md)}[data-zone=learner] .hapio-lhp-vcard--cover{display:flex;flex-direction:column}[data-zone=learner] .hapio-lhp-vcard--cover .hapio-lhp-vcover{position:relative;height:128px;overflow:hidden}[data-zone=learner] .hapio-lhp-vcard--cover .hapio-lhp-vill{transition:transform .6s var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-vcard--cover:hover .hapio-lhp-vill{transform:scale(1.07)}[data-zone=learner] .hapio-lhp-vcard--cover .hapio-lhp-vtag{position:absolute;left:12px;bottom:12px;z-index:2}[data-zone=learner] .hapio-lhp-vcard--cover .hapio-lhp-fav{position:absolute;top:12px;right:12px;z-index:3;background:color-mix(in srgb,var(--learner-color-surface) 88%,transparent);backdrop-filter:blur(6px);box-shadow:var(--learner-shadow-xs)}[data-zone=learner] .hapio-lhp-vcard--cover .hapio-lhp-vgo{position:absolute;right:12px;bottom:12px;z-index:2;transform:translateY(150%);opacity:0;transition:transform .3s var(--learner-ease-out),opacity .3s}[data-zone=learner] .hapio-lhp-vcard--cover:hover .hapio-lhp-vgo{transform:none;opacity:1}[data-zone=learner] .hapio-lhp-vcard--cover.is-spotlight .hapio-lhp-vgo{display:none}[data-zone=learner] .hapio-lhp-vspot{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;background:color-mix(in srgb,var(--learner-color-brand) 60%,transparent);opacity:0;transition:opacity .26s var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-vcard--cover.is-spotlight:hover .hapio-lhp-vspot{opacity:1}[data-zone=learner] .hapio-lhp-vspot__play{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--learner-color-surface);color:var(--learner-color-brand);box-shadow:var(--learner-shadow-md);transform:scale(.7);transition:transform .3s var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-vspot__play svg{width:22px;height:22px;margin-left:3px}[data-zone=learner] .hapio-lhp-vcard--cover.is-spotlight:hover .hapio-lhp-vspot__play{transform:none}[data-zone=learner] .hapio-lhp-vspot__txt{color:var(--learner-color-on-accent);font-weight:700;font-size:var(--learner-text-base);transform:translateY(6px);opacity:0;transition:transform .3s var(--learner-ease-out) .04s,opacity .3s .04s}[data-zone=learner] .hapio-lhp-vcard--cover.is-spotlight:hover .hapio-lhp-vspot__txt{transform:none;opacity:1}[data-zone=learner] .hapio-lhp-vcard--thumb{flex-direction:row;align-items:center;gap:0;padding:14px}[data-zone=learner] .hapio-lhp-vcard--thumb .hapio-lhp-vthumb{position:relative;flex:0 0 auto;width:92px;height:92px;align-self:stretch;min-height:92px;border-radius:var(--learner-radius-md);overflow:hidden;border:1px solid var(--learner-color-border-soft);transition:box-shadow .24s var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-vcard--thumb .hapio-lhp-vill{transition:transform .6s var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-vcard--thumb:hover .hapio-lhp-vill{transform:scale(1.09)}[data-zone=learner] .hapio-lhp-vcard--thumb:hover .hapio-lhp-vthumb{box-shadow:0 0 0 3px var(--learner-color-brand-soft),0 0 0 4px var(--learner-color-brand-border)}[data-zone=learner] .hapio-lhp-vthumb__badge{position:absolute;left:6px;bottom:6px;font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--learner-color-on-accent);background:color-mix(in srgb,var(--learner-ink) 55%,transparent);backdrop-filter:blur(3px);padding:2px 7px;border-radius:var(--learner-radius-pill)}[data-zone=learner] .hapio-lhp-vcard--thumb .hapio-lhp-vbody{padding:0 0 0 14px;gap:3px}[data-zone=learner] .hapio-lhp-vcard--thumb .hapio-lhp-vbody .hapio-lhp-album__title{margin-bottom:0}[data-zone=learner] .hapio-lhp-vgo--inline{flex:0 0 auto;align-self:center;margin-left:8px;display:grid;place-items:center;width:22px;height:auto;padding:0;background:transparent;box-shadow:none;color:var(--learner-color-text-subtle);transform:translateX(-4px);opacity:0;transition:transform .28s var(--learner-ease-out),opacity .28s,color .2s}[data-zone=learner] .hapio-lhp-vcard--thumb:hover .hapio-lhp-vgo--inline{transform:none;opacity:1;color:var(--learner-color-brand)}[data-zone=learner] .hapio-lhp-vcard--poster{position:relative;height:250px}[data-zone=learner] .hapio-lhp-vcard--poster>.hapio-lhp-vill{position:absolute;inset:0;transition:transform .6s var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-vcard--poster:hover>.hapio-lhp-vill{transform:scale(1.08)}[data-zone=learner] .hapio-lhp-vtag--tl{position:absolute;left:12px;top:12px;z-index:3}[data-zone=learner] .hapio-lhp-vcard--poster .hapio-lhp-fav{position:absolute;top:12px;right:12px;z-index:3;background:color-mix(in srgb,var(--learner-color-surface) 85%,transparent);backdrop-filter:blur(6px);box-shadow:var(--learner-shadow-xs)}[data-zone=learner] .hapio-lhp-vpanel{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:14px 16px 15px;background:color-mix(in srgb,var(--learner-color-surface) 88%,transparent);backdrop-filter:blur(12px) saturate(1.1);border-top:1px solid var(--learner-color-border-soft)}[data-zone=learner] .hapio-lhp-vpanel .hapio-lhp-album__title{margin-bottom:8px}[data-zone=learner] .hapio-lhp-vreveal{max-height:0;opacity:0;overflow:hidden;transition:max-height .34s var(--learner-ease-out),opacity .34s}[data-zone=learner] .hapio-lhp-vcard--poster:hover .hapio-lhp-vreveal{max-height:92px;opacity:1}[data-zone=learner] .hapio-lhp-vcta{display:inline-flex;align-items:center;gap:6px;margin-top:10px;height:34px;padding:0 14px;border-radius:var(--learner-radius-md);background:var(--learner-color-brand);color:var(--learner-color-on-accent);font-size:var(--learner-text-sm);font-weight:700}[data-zone=learner] .hapio-lhp-vcard--ring{padding:24px 18px 20px;align-items:center;text-align:center}[data-zone=learner] .hapio-lhp-vcard--ring .hapio-lhp-fav{position:absolute;top:14px;right:14px;z-index:2}[data-zone=learner] .hapio-lhp-vring{position:relative;width:96px;height:96px;margin-bottom:14px}[data-zone=learner] .hapio-lhp-vring__svg{position:absolute;inset:0;transform:rotate(-90deg)}[data-zone=learner] .hapio-lhp-vring__trk{fill:none;stroke:var(--learner-color-border-soft);stroke-width:5}[data-zone=learner] .hapio-lhp-vring__prg{fill:none;stroke-width:5;stroke-linecap:round;stroke:var(--learner-color-border-strong);stroke-dasharray:var(--c);stroke-dashoffset:var(--c);transition:stroke-dashoffset .95s var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-vring__prg.is-learning{stroke:var(--learner-color-learning)}[data-zone=learner] .hapio-lhp-vring__prg.is-done{stroke:var(--learner-color-success)}[data-zone=learner] .hapio-lhp-vcard--ring:hover .hapio-lhp-vring__prg{stroke-dashoffset:var(--off)}[data-zone=learner] .hapio-lhp-vring__ava{position:absolute;inset:9px;border-radius:50%;overflow:hidden;border:3px solid var(--learner-color-surface)}[data-zone=learner] .hapio-lhp-vring__ava .hapio-lhp-vill{transition:transform .6s var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-vcard--ring:hover .hapio-lhp-vring__ava .hapio-lhp-vill{transform:scale(1.08)}[data-zone=learner] .hapio-lhp-vcard--ring .hapio-lhp-album__title{margin-bottom:8px}[data-zone=learner] .hapio-lhp-vcard--ring .hapio-lhp-astate{justify-content:center;margin-bottom:8px}[data-zone=learner] .hapio-lhp-vstat{font-size:var(--learner-text-sm);color:var(--learner-color-text-muted)}[data-zone=learner] .hapio-lhp-vstat b{color:var(--learner-color-text);font-weight:700;font-variant-numeric:tabular-nums}[data-zone=learner] .hapio-lhp-vcard--imm{position:relative;height:322px;border:0}[data-zone=learner] .hapio-lhp-vcard--imm>.hapio-lhp-vill{position:absolute;inset:0;transition:transform .6s var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-vcard--imm:hover>.hapio-lhp-vill{transform:scale(1.06)}[data-zone=learner] .hapio-lhp-vimm__scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(to top,color-mix(in srgb,var(--learner-ink) 86%,transparent) 0,color-mix(in srgb,var(--learner-ink) 45%,transparent) 30%,transparent 58%)}[data-zone=learner] .hapio-lhp-vimm__deck{position:absolute;top:16px;left:16px;z-index:3;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--learner-color-brand);color:var(--learner-color-on-accent);box-shadow:var(--learner-shadow-md);transition:transform .26s var(--learner-ease-out),background .2s}[data-zone=learner] .hapio-lhp-vimm__deck svg{width:25px;height:25px}[data-zone=learner] .hapio-lhp-vcard--imm:hover .hapio-lhp-vimm__deck{transform:scale(1.09);background:var(--learner-color-brand-strong)}[data-zone=learner] .hapio-lhp-fav.hapio-lhp-vimm__fav{position:absolute;top:20px;right:20px;z-index:3;width:38px;height:38px;background:color-mix(in srgb,var(--learner-ink) 32%,transparent);backdrop-filter:blur(4px);border:1.5px solid color-mix(in srgb,var(--learner-color-on-accent) 55%,transparent);color:var(--learner-color-on-accent)}[data-zone=learner] .hapio-lhp-fav.hapio-lhp-vimm__fav.is-on{color:var(--learner-color-danger);border-color:color-mix(in srgb,var(--learner-color-on-accent) 70%,transparent);background:color-mix(in srgb,var(--learner-ink) 40%,transparent)}[data-zone=learner] .hapio-lhp-vimm__foot{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:18px 20px 22px}[data-zone=learner] .hapio-lhp-vimm__chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:11px}[data-zone=learner] .hapio-lhp-vimm__chip{font-size:12px;font-weight:700;color:var(--learner-ink);background:var(--learner-color-surface);padding:5px 13px;border-radius:var(--learner-radius-pill)}[data-zone=learner] .hapio-lhp-vimm__title{margin:0 0 12px;font-size:20px;font-weight:700;line-height:1.22;color:var(--learner-color-on-accent);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}[data-zone=learner] .hapio-lhp-vimm__by{display:flex;align-items:center;flex-wrap:wrap;gap:7px;font-size:13px;font-weight:500;color:color-mix(in srgb,var(--learner-color-on-accent) 82%,transparent)}[data-zone=learner] .hapio-lhp-vimm__logo{width:22px;height:22px;flex:0 0 auto;display:grid;place-items:center;border-radius:6px;background:var(--learner-color-brand);font-size:12px}[data-zone=learner] .hapio-lhp-vimm__logo,[data-zone=learner] .hapio-lhp-vimm__logotext{color:var(--learner-color-on-accent);font-weight:700}[data-zone=learner] .hapio-lhp-vimm__sep{opacity:.55}[data-zone=learner] .hapio-lhp-vimm__dot{width:7px;height:7px;flex:0 0 auto;border-radius:50%;background:var(--learner-color-learning)}[data-zone=learner] .hapio-lhp-vimm__dot.is-done{background:var(--learner-color-success)}[data-zone=learner] .hapio-lhp-vimm__dot.is-new{background:color-mix(in srgb,var(--learner-color-on-accent) 60%,transparent)}[data-zone=learner] .hapio-lhp-vimm__bar{position:absolute;left:0;right:0;bottom:0;z-index:4;height:3px;background:color-mix(in srgb,var(--learner-color-on-accent) 25%,transparent)}[data-zone=learner] .hapio-lhp-vimm__bar>i{display:block;height:100%;background:var(--learner-color-on-accent);transition:width .6s var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-vimm__bar>i.is-learning{background:var(--learner-color-learning)}[data-zone=learner] .hapio-lhp-vimm__bar>i.is-done{background:var(--learner-color-success)}[data-zone=learner] .hapio-lhp-vcard--list{flex-direction:row;align-items:stretch;gap:22px;padding:22px 24px}[data-zone=learner] .hapio-lhp-vlist__main{flex:1;min-width:0;display:flex;flex-direction:column}[data-zone=learner] .hapio-lhp-vlist__chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:13px}[data-zone=learner] .hapio-lhp-vlist__chip{font-size:12.5px;font-weight:600;color:var(--learner-color-text);background:var(--learner-color-surface-soft);padding:6px 14px;border-radius:var(--learner-radius-pill)}[data-zone=learner] .hapio-lhp-vlist__title{margin:0 0 14px;font-size:22px;font-weight:700;line-height:1.24;color:var(--learner-color-text-strong);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}[data-zone=learner] .hapio-lhp-vlist__by{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--learner-color-text-muted);margin-bottom:18px}[data-zone=learner] .hapio-lhp-vlist__by b{color:var(--learner-color-text);font-weight:700}[data-zone=learner] .hapio-lhp-vlist__logo{width:24px;height:24px;flex:0 0 auto;display:grid;place-items:center;border-radius:7px;background:var(--learner-color-brand);color:var(--learner-color-on-accent);font-size:12px;font-weight:700}[data-zone=learner] .hapio-lhp-vlist__foot{margin-top:auto;display:flex;align-items:center;gap:16px;font-size:13.5px;color:var(--learner-color-text-muted)}[data-zone=learner] .hapio-lhp-vlist__foot .hapio-lhp-astate{margin-bottom:0}[data-zone=learner] .hapio-lhp-vlist__stat{display:inline-flex;align-items:center;gap:6px;font-weight:600}[data-zone=learner] .hapio-lhp-vlist__stat b{color:var(--learner-color-text);font-weight:700;font-variant-numeric:tabular-nums}[data-zone=learner] .hapio-lhp-vlist__spacer{flex:1}[data-zone=learner] .hapio-lhp-vlist__prog{font-weight:700;color:var(--learner-color-text);font-variant-numeric:tabular-nums}[data-zone=learner] .hapio-lhp-vlist__thumb{position:relative;flex:0 0 auto;width:176px;align-self:stretch;border-radius:var(--learner-radius-md);overflow:hidden;border:1px solid var(--learner-color-border-soft)}[data-zone=learner] .hapio-lhp-vlist__thumb .hapio-lhp-vill{transition:transform .6s var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-vcard--list:hover .hapio-lhp-vlist__thumb .hapio-lhp-vill{transform:scale(1.06)}[data-zone=learner] .hapio-lhp-vlist__badge{position:absolute;top:12px;right:12px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--learner-ink) 30%,transparent);backdrop-filter:blur(4px);border:1.5px solid color-mix(in srgb,var(--learner-color-on-accent) 50%,transparent);color:var(--learner-color-on-accent)}[data-zone=learner] .hapio-lhp-vlist__badge svg{width:16px;height:16px}@media (max-width:620px){[data-zone=learner] .hapio-lhp-vcard--list{flex-direction:column-reverse}[data-zone=learner] .hapio-lhp-vlist__thumb{width:100%;height:170px;align-self:auto}[data-zone=learner] .hapio-lhp-vlist__foot{flex-wrap:wrap;gap:10px 14px}}[data-zone=learner] .hapio-lhp-grid.hapio-lhp-vgrid--default,[data-zone=learner] .hapio-lhp-grid.hapio-lhp-vgrid--monogram{grid-template-columns:repeat(auto-fill,minmax(268px,1fr))}[data-zone=learner] .hapio-lhp-mono{min-height:148px;gap:14px}[data-zone=learner] .hapio-lhp-mono .hapio-lhp-prog{margin-top:auto}[data-zone=learner] .hapio-lhp-mono__head{display:flex;align-items:flex-start;gap:14px}[data-zone=learner] .hapio-lhp-mono__titlewrap{display:flex;flex-direction:column;gap:5px;min-width:0}[data-zone=learner] .hapio-lhp-mono__titlewrap .hapio-lhp-album__title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}[data-zone=learner] .hapio-lhp-mono__titlewrap .hapio-lhp-astate{margin-bottom:0}[data-zone=learner] .hapio-lhp-mono__tile{flex:0 0 auto;width:52px;height:52px;display:grid;place-items:center;border-radius:var(--learner-radius-md);font-size:19px;font-weight:700;letter-spacing:.01em;background:var(--learner-color-brand-soft);color:var(--learner-color-brand-strong);-webkit-user-select:none;-moz-user-select:none;user-select:none}[data-zone=learner] .hapio-lhp-mono__tile[data-accent="1"]{background:var(--learner-mono-1-soft);color:var(--learner-mono-1-ink)}[data-zone=learner] .hapio-lhp-mono__tile[data-accent="2"]{background:var(--learner-mono-2-soft);color:var(--learner-mono-2-ink)}[data-zone=learner] .hapio-lhp-mono__tile[data-accent="3"]{background:var(--learner-mono-3-soft);color:var(--learner-mono-3-ink)}[data-zone=learner] .hapio-lhp-mono__tile[data-accent="4"]{background:var(--learner-mono-4-soft);color:var(--learner-mono-4-ink)}[data-zone=learner] .hapio-lhp-mono__tile[data-accent="5"]{background:var(--learner-mono-5-soft);color:var(--learner-mono-5-ink)}[data-zone=learner] .hapio-lhp-mono__tile[data-accent="6"]{background:var(--learner-mono-6-soft);color:var(--learner-mono-6-ink)}[data-zone=learner] .hapio-lhp-mono__tile[data-accent="7"]{background:var(--learner-mono-7-soft);color:var(--learner-mono-7-ink)}[data-zone=learner] .hapio-lhp-mono__tile[data-accent="8"]{background:var(--learner-mono-8-soft);color:var(--learner-mono-8-ink)}[data-zone=learner] .hapio-lhp-mono--row{flex-direction:row;align-items:center;min-height:0;gap:16px;padding:14px 16px}[data-zone=learner] .hapio-lhp-mono--row .hapio-lhp-mono__titlewrap{flex:1}[data-zone=learner] .hapio-lhp-mono--row .hapio-lhp-mono__side{flex:0 0 auto;width:190px}[data-zone=learner] .hapio-lhp-mono--row .hapio-lhp-mono__side .hapio-lhp-prog{margin-top:0}[data-zone=learner] .hapio-lhp-mono--row .hapio-lhp-fav{margin-left:0}@media (max-width:560px){[data-zone=learner] .hapio-lhp-mono--row{flex-wrap:wrap}[data-zone=learner] .hapio-lhp-mono--row .hapio-lhp-mono__side{width:100%;order:3}}[data-zone=learner] .hapio-lhp-gridpick{display:inline-flex;align-items:center;gap:8px;padding:4px 6px 4px 14px;border:1px solid var(--learner-color-brand-border);background:var(--learner-color-brand-soft);border-radius:var(--learner-radius-pill);margin-left:auto}[data-zone=learner] .hapio-lhp-gridpick__lab{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--learner-color-brand-strong);white-space:nowrap}[data-zone=learner] .hapio-lhp-gridpick__sel select{height:34px;font-size:var(--learner-text-sm)}[data-zone=learner] .hapio-lhp-gridpick__btn{height:34px;padding:0 14px;border:0;border-radius:var(--learner-radius-md);background:var(--learner-color-brand);color:var(--learner-color-on-accent);font:inherit;font-size:var(--learner-text-sm);font-weight:700;cursor:pointer;transition:background .18s var(--learner-ease-out)}[data-zone=learner] .hapio-lhp-gridpick__btn:hover:not(:disabled){background:var(--learner-color-brand-strong)}[data-zone=learner] .hapio-lhp-gridpick__btn:disabled{background:var(--learner-color-border-strong);cursor:default}[data-zone=learner] .hapio-lhp-gridpick__flash{font-size:var(--learner-text-sm);font-weight:600;color:var(--learner-color-brand-strong)}@media (max-width:720px){[data-zone=learner] .hapio-lhp-gridpick{flex-wrap:wrap;margin-left:0}}@keyframes hapio-lhp-skel-pulse{0%,to{opacity:1}50%{opacity:.5}}[data-zone=learner] .hapio-lhp-skel{background:var(--learner-color-border-soft);border-radius:6px;animation:hapio-lhp-skel-pulse 1.25s var(--learner-ease-out) infinite}[data-zone=learner] .hapio-lhp-skel--pill{border-radius:var(--learner-radius-pill)}@media (prefers-reduced-motion:reduce){[data-zone=learner] .hapio-lhp-skel{animation:none}}