.course-page{--pageMargin:max(20px,(100vw - 1240px)/2);padding-block:32px 48px;overflow-x:clip}.course-page .uni-container{max-width:1240px}.course-page__grid{--sb:357px;grid-template-columns:minmax(0,1fr)var(--sb);grid-template-areas:"breadcrumb sidebar""content sidebar";align-items:start;gap:24px;display:grid}.course-breadcrumb{grid-area:breadcrumb;align-self:start}.course-page__content{z-index:1;grid-area:content;min-width:0;position:relative}.course-page__aside{z-index:2;grid-area:sidebar;position:sticky;top:24px}.course-breadcrumb{justify-content:flex-start;margin-bottom:16px;display:flex}.course-breadcrumb ol{background:var(--color-date-bg);color:var(--color-body);border-radius:9999px;flex-wrap:wrap;align-items:center;gap:8px;margin:0;padding:8px 18px;font-size:13px;list-style:none;display:inline-flex}.course-breadcrumb li{align-items:center;gap:8px;display:flex}.course-breadcrumb li+li:before{content:"╱";color:var(--color-muted)}.course-breadcrumb a{color:var(--color-body);text-decoration:none;transition:color .18s ease-out}.course-breadcrumb a:hover{color:var(--color-primary)}.course-breadcrumb [aria-current=page]{color:var(--color-primary);font-weight:700}.course-hero{justify-content:flex-start;align-items:center;margin-bottom:0;padding:40px 48px 76px;display:flex;position:relative}.course-hero:before{content:"";z-index:-1;top:0;bottom:0;right:calc(-1*var(--pageMargin));left:calc(-1*(var(--sb) + 24px) - var(--pageMargin));background:repeating-radial-gradient(circle at 0% 50%,#ffffff0d 0px,#0000000a 2px,transparent 2px,transparent 30px),var(--color-primary);position:absolute}.course-hero__inner{text-align:right;width:100%;max-width:760px;position:relative}.course-hero__title{color:#fff;margin:0 0 14px;font-size:30px;font-weight:800;line-height:1.5}.course-hero__desc{color:#ffffffeb;text-align:right;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:15px;line-height:2;display:-webkit-box;overflow:hidden}.course-facts{z-index:2;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:-38px;margin-bottom:28px;display:grid;position:relative}.course-facts__card{background:var(--color-surface);border:1px solid var(--color-line);border-radius:14px;align-items:center;gap:12px;padding:16px;transition:border-color .18s ease-out,box-shadow .18s ease-out;display:flex}.course-facts__card:hover{border-color:var(--color-primary);box-shadow:0 8px 24px #003ca126}.course-facts__icon{background:var(--color-nav-bg);width:44px;height:44px;color:var(--color-primary);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;font-size:18px;display:flex}.course-facts__text{flex-direction:column;gap:4px;min-width:0;display:flex}.course-facts__label{color:var(--color-muted);font-size:12px}.course-facts__value{color:var(--color-ink);font-size:14px;font-weight:800}.course-desc,.course-teachers{background:var(--color-surface);border:1px solid var(--color-line);border-radius:16px;padding:28px}.course-teachers{margin-top:24px}.course-desc__title,.course-teachers__title{color:var(--color-ink);margin:0 0 16px;padding-inline-start:14px;font-size:18px;font-weight:800;position:relative}.course-desc__title:before,.course-teachers__title:before{content:"";inset-inline-start:0;background:var(--color-primary);border-radius:4px;width:4px;height:18px;position:absolute;top:4px}.course-desc__body{color:var(--color-body);font-size:14px;line-height:2.1}.course-teachers__grid{grid-template-columns:repeat(2,1fr);gap:20px;display:grid}.course-teacher{text-align:right;background:var(--color-nav-bg);border:1px solid var(--color-line);border-radius:14px;flex-direction:row;align-items:flex-start;gap:16px;padding:20px;transition:border-color .18s ease-out,box-shadow .18s ease-out;display:flex}.course-teacher:hover{border-color:var(--color-primary);box-shadow:0 8px 24px #003ca114}.course-teacher__avatar{border:2px solid var(--color-primary);background:var(--color-line);width:80px;height:80px;color:var(--color-muted);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex;overflow:hidden}.course-teacher__avatar img{object-fit:cover;width:100%;height:100%}.course-teacher__avatar i{font-size:30px}.course-teacher__text{flex-direction:column;flex:1;align-items:flex-start;gap:6px;min-width:0;display:flex}.course-teacher__name{color:var(--color-ink);margin:0;font-size:15px;font-weight:800}.course-teacher__bio{color:var(--color-body);text-align:justify;-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:0;font-size:12px;line-height:1.9;display:-webkit-box;overflow:hidden}.course-sidebar{background:var(--color-surface);border:1px solid var(--color-line);border-radius:16px;padding-bottom:20px;overflow:hidden;box-shadow:0 8px 30px #1018280f}.course-sidebar__media{aspect-ratio:4/3;background:var(--color-nav-bg);margin:0;overflow:hidden}.course-sidebar__media img{object-fit:cover;width:100%;height:100%;display:block}.course-sidebar__title{color:var(--color-primary);text-align:center;margin:20px 20px 12px;font-size:18px;font-weight:800;line-height:1.6}.course-sidebar__price{border:1px solid var(--color-line);background:var(--color-nav-bg);text-align:center;border-radius:12px;flex-direction:column;align-items:center;gap:6px;margin:0 20px 18px;padding:14px 12px;display:flex}.course-sidebar__old{color:var(--color-muted);font-size:14px;text-decoration:line-through}.course-sidebar__now{color:var(--color-ink);font-size:20px;font-weight:800}.course-sidebar__btn{background:var(--color-primary);color:#fff;cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;width:calc(100% - 40px);height:46px;margin-inline:20px;font-family:inherit;font-size:15px;font-weight:700;transition:background-color .18s ease-out;display:inline-flex}.course-sidebar__btn:hover{background:var(--color-primary-hover)}.course-sidebar__btn.is-disabled{background:var(--color-muted);cursor:not-allowed}.course-sidebar__btn.is-disabled:hover{background:var(--color-muted)}@media (width<=1024px){.course-page{--pageMargin:20px}.course-page__grid{flex-direction:column;display:flex}.course-breadcrumb{order:1}.course-page__aside{order:2;position:static}.course-page__content{order:3}.course-hero:before{left:calc(-1*var(--pageMargin));right:calc(-1*var(--pageMargin))}.course-facts{grid-template-columns:repeat(2,1fr);margin-top:-32px}.course-facts__card{text-align:center;flex-direction:column;align-items:center;gap:10px;padding:20px 16px}.course-facts__text{align-items:center}}@media (width<=640px){.course-hero{padding:28px 20px 64px}.course-hero__title{font-size:23px}.course-facts{grid-template-columns:repeat(2,1fr);margin-top:-28px}.course-facts__card{padding:16px 12px}.course-teachers__grid{grid-template-columns:1fr}}.enroll-modal[hidden]{display:none}.enroll-modal{z-index:1001;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.enroll-modal__overlay{backdrop-filter:blur(2px);background:#10182880;position:absolute;inset:0}.enroll-modal__dialog{background:var(--color-surface);border-radius:18px;width:100%;max-width:520px;max-height:92vh;padding:24px;position:relative;overflow:hidden auto;box-shadow:0 24px 70px #10182840}.enroll-modal__close{top:16px;z-index:2;background:var(--color-nav-bg);width:36px;height:36px;color:var(--color-body);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:15px;display:flex;position:absolute;inset-inline-end:16px}.enroll-modal__close:hover{background:var(--color-hover-bg);color:var(--color-ink)}.enroll-step[hidden]{display:none}.enroll-step{flex-direction:column;gap:16px;display:flex}.enroll-title{color:var(--color-ink);margin:0;font-size:19px;font-weight:800;line-height:1.6}.enroll-step__title{color:var(--color-ink);margin:0;font-size:17px;font-weight:800}.enroll-meta{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.enroll-meta__item{background:var(--color-nav-bg);border-radius:12px;flex-direction:column;gap:4px;padding:12px;display:flex}.enroll-meta__item span{color:var(--color-muted);font-size:11px}.enroll-meta__item strong{color:var(--color-ink);font-size:13px;font-weight:800}.enroll-capacity{flex-direction:column;gap:8px;display:flex}.enroll-capacity__bar{background:var(--color-nav-bg);border-radius:9999px;height:8px;overflow:hidden}.enroll-capacity__bar span{background:linear-gradient(90deg,var(--color-primary),var(--color-primary-hover));border-radius:9999px;height:100%;display:block}.enroll-capacity__text{color:var(--color-muted);font-size:12px}.enroll-notes{background:#fff4e5;border:1px solid #f5d9b0;border-radius:12px;padding:14px 16px}.enroll-notes__title{color:#b26a00;align-items:center;gap:8px;margin-bottom:8px;font-size:13px;font-weight:800;display:flex}.enroll-notes ul{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.enroll-notes li{color:#8a5200;padding-inline-start:14px;font-size:12.5px;line-height:1.9;position:relative}.enroll-notes li:before{content:"";inset-inline-start:0;background:#b26a00;border-radius:50%;width:5px;height:5px;position:absolute;top:9px}.enroll-loading{color:var(--color-muted);justify-content:center;align-items:center;gap:10px;padding:8px 0;font-size:13px;display:flex}.enroll-loading[hidden]{display:none}.enroll-methods{flex-direction:column;gap:12px;display:flex}.enroll-methods[hidden]{display:none}.enroll-method{border:1px solid var(--color-line);cursor:pointer;border-radius:14px;flex-direction:column;gap:6px;padding:16px;transition:border-color .18s ease-out,box-shadow .18s ease-out;display:flex;position:relative}.enroll-method:hover{border-color:var(--color-primary);box-shadow:0 8px 24px #003ca114}.enroll-method>i{color:var(--color-primary);font-size:22px}.enroll-method strong{color:var(--color-ink);font-size:15px;font-weight:800}.enroll-method p{color:var(--color-body);margin:0;font-size:12.5px}.enroll-method__badge{top:12px;color:#6b7280;background:#e5e7eb;border-radius:9999px;align-items:center;height:20px;padding-inline:8px;font-size:11px;font-weight:700;display:inline-flex;position:absolute;inset-inline-start:12px}.enroll-method.is-disabled{opacity:.55;cursor:not-allowed;pointer-events:none}.enroll-card{background:var(--color-nav-bg);border:1px solid var(--color-line);border-radius:14px;flex-direction:column;gap:12px;padding:16px;display:flex}.enroll-card__line{justify-content:space-between;align-items:center;gap:10px;font-size:13px;display:flex}.enroll-card__line>span{color:var(--color-muted)}.enroll-card__line strong{color:var(--color-ink);font-weight:700}.enroll-card__line--copy{background:var(--color-surface);border:1px solid var(--color-line);border-radius:10px;padding:10px 12px}.enroll-copy{background:var(--color-primary);color:#fff;cursor:pointer;border:none;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;font-size:14px;display:inline-flex}.enroll-copy:hover{background:var(--color-primary-hover)}.enroll-card__amt{color:var(--color-body);text-align:center;border-top:1px dashed var(--color-line);padding-top:4px;font-size:14px}.enroll-card__amt strong{color:var(--color-primary);font-size:16px}.enroll-upload{border:2px dashed var(--color-primary);text-align:center;background:#eaf1ff;border-radius:14px;flex-direction:column;gap:10px;padding:16px;display:flex}.enroll-upload.is-error{background:#fdecec;border-color:#c0392b}.enroll-upload__box{cursor:pointer;color:var(--color-body);flex-direction:column;align-items:center;gap:8px;font-size:13px;display:flex}.enroll-upload__box i{color:var(--color-primary);font-size:30px}.enroll-upload__box strong{color:var(--color-primary)}.enroll-upload__preview{flex-wrap:wrap;gap:8px;margin-top:4px;display:flex}.enroll-upload__preview[hidden]{display:none}.enroll-upload__preview img{object-fit:cover;border:1px solid var(--color-line);border-radius:10px;width:72px;height:72px}.enroll-submit{background:var(--color-primary);color:#fff;cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;width:100%;height:48px;font-family:inherit;font-size:15px;font-weight:700;display:inline-flex}.enroll-submit:hover{background:var(--color-primary-hover)}.enroll-submit:disabled{opacity:.6;cursor:not-allowed}.enroll-back{width:fit-content;color:var(--color-muted);cursor:pointer;background:0 0;border:none;margin-inline:auto;font-family:inherit;font-size:13px;font-weight:600}.enroll-back:hover{color:var(--color-primary)}.enroll-success{text-align:center;flex-direction:column;align-items:center;gap:14px;padding:8px 0;display:flex}.enroll-success__icon{color:#fff;background:linear-gradient(135deg,#1b7f3b,#16a34a);border-radius:50%;justify-content:center;align-items:center;width:76px;height:76px;font-size:38px;display:flex;box-shadow:0 10px 26px #16a34a40}.enroll-success__title{color:var(--color-ink);margin:0;font-size:18px;font-weight:800}.enroll-success__text{color:var(--color-body);max-width:360px;margin:0;font-size:13.5px;line-height:2}.enroll-success__meta{background:var(--color-nav-bg);border:1px solid var(--color-line);border-radius:12px;flex-direction:column;gap:8px;width:100%;padding:12px 14px;display:flex}.enroll-success__meta span{color:var(--color-body);align-items:center;gap:8px;font-size:12.5px;display:flex}.enroll-success__meta i{color:var(--color-primary)}.enroll-success__meta strong{color:var(--color-ink)}.enroll-reupload{border-top:1px dashed var(--color-line);width:100%;padding-top:14px}.enroll-reupload__toggle{color:var(--color-primary);cursor:pointer;background:0 0;border:none;font-family:inherit;font-size:13px;font-weight:700;text-decoration:underline}.enroll-reupload__toggle:hover{color:var(--color-primary-hover)}.enroll-reupload__panel{flex-direction:column;gap:12px;margin-top:12px;display:flex}.enroll-reupload__panel[hidden]{display:none}.enroll-upload__hint{color:var(--color-muted);font-size:11px}@media (width<=640px){.enroll-modal__dialog{padding:20px 16px}.enroll-meta{grid-template-columns:1fr}.enroll-card__line{flex-wrap:wrap}}