.xj-embed{--xj-bg:var(--main-bg-color,#fff);--xj-ink:var(--main-color,#253a48);--xj-muted:var(--muted-color,#72828e);--xj-line:var(--border-color,#e2e9ed);--xj-accent:var(--theme-color,#0c8d83);--xj-soft:var(--muted-bg-color,#f2f7f7);color:var(--xj-ink);font-size:14px;line-height:1.7;font-family:inherit;width:100%;min-width:0;margin:24px 0;isolation:isolate;container-type:inline-size}
.xj-embed[data-xj-theme=light]{--xj-bg:#fff;--xj-ink:#253a48;--xj-muted:#72828e;--xj-line:#e2e9ed;--xj-soft:#f2f7f7;color-scheme:light}
.xj-embed[data-xj-theme=dark],.dark-theme .xj-embed[data-xj-theme=auto],.dark-mode .xj-embed[data-xj-theme=auto],[data-theme=dark] .xj-embed[data-xj-theme=auto]{--xj-bg:var(--main-bg-color,#20252d);--xj-ink:var(--main-color,#e3e8ee);--xj-muted:var(--muted-color,#a3b0bf);--xj-line:var(--border-color,#39424d);--xj-soft:var(--muted-bg-color,#29323b);color-scheme:dark}
.xj-embed[data-xj-theme=dark]{--xj-bg:#20252d;--xj-ink:#e3e8ee;--xj-muted:#a3b0bf;--xj-line:#39424d;--xj-soft:#29323b}
.xj-embed *,.xj-embed *::before,.xj-embed *::after{box-sizing:border-box}.xj-embed [hidden]{display:none!important}
.xj-embed :is(h2,h3,p,ol,ul){color:inherit;letter-spacing:normal}.xj-embed :is(button,input,select){font-family:inherit;font-size:inherit;text-transform:none;letter-spacing:normal}.xj-embed button{cursor:pointer}.xj-embed button:disabled{opacity:.45;cursor:default}.xj-embed :is(button,a,input,select,summary):focus-visible{outline:2px solid var(--xj-accent);outline-offset:3px}.xj-embed img{max-width:100%;border:0;box-shadow:none}
.xj-embed .xj-embed-section{background:var(--xj-bg);border:1px solid var(--xj-line);border-radius:var(--main-radius,14px);padding:32px;margin:0 0 24px;box-shadow:0 5px 20px #132e4205;min-width:0;overflow-wrap:anywhere}.xj-embed>div:last-child .xj-embed-section{margin-bottom:0}
.xj-embed .xj-embed-heading{margin-bottom:24px}.xj-embed .xj-embed-heading small{display:block;font-size:10px;font-weight:600;letter-spacing:1.8px;color:var(--xj-accent)}.xj-embed .xj-embed-heading h2{font-size:28px;font-weight:700;line-height:1.45;margin:8px 0 10px;border:0;padding:0;background:none}.xj-embed .xj-embed-heading p{margin:0;font-size:13px;color:var(--xj-muted);white-space:pre-line;line-height:1.9}
.xj-embed .xj-embed-directions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0 0 24px}.xj-embed .xj-embed-directions button{display:flex;align-items:center;gap:17px;background:var(--xj-soft);color:var(--xj-ink);padding:22px;text-align:left;border:1px solid var(--xj-line);border-radius:12px;box-shadow:none;line-height:1.5}.xj-embed .xj-embed-directions button[aria-pressed=true]{border-color:var(--xj-accent);box-shadow:inset 0 0 0 1px var(--xj-accent)}.xj-embed .xj-embed-direction-icon{width:48px;height:48px;flex:0 0 48px;border-radius:12px;background:var(--xj-bg);color:var(--xj-accent);display:grid;place-items:center;font:600 20px ui-monospace,Consolas,monospace}.xj-embed .xj-embed-directions small{font-size:9px;letter-spacing:1.4px;color:var(--xj-accent)}.xj-embed .xj-embed-directions strong{display:block;font-size:22px;margin:3px 0}.xj-embed .xj-embed-directions em{font-style:normal;font-size:12px;color:var(--xj-muted)}.xj-embed .xj-embed-directions b{margin-left:auto;font-size:23px;color:var(--xj-accent)}
.xj-embed .xj-embed-toolbar,.xj-embed .xj-embed-filter-row{display:flex;justify-content:space-between;gap:14px;align-items:center;margin:0 0 14px;flex-wrap:wrap}.xj-embed .xj-embed-track-tabs,.xj-embed .xj-embed-category-tabs{display:flex;flex-wrap:wrap;gap:7px}.xj-embed .xj-embed-track-tabs button,.xj-embed .xj-embed-category-tabs button{background:transparent;color:var(--xj-muted);border:1px solid transparent;border-radius:99px;padding:7px 14px;line-height:1.6;font-size:12px;box-shadow:none;white-space:nowrap}.xj-embed .xj-embed-track-tabs button[aria-pressed=true]{background:var(--xj-accent);color:#fff}.xj-embed .xj-embed-category-tabs button[aria-pressed=true]{background:var(--xj-soft);border-color:var(--xj-line);color:var(--xj-accent)}.xj-embed .xj-embed-search{display:flex;gap:8px;align-items:center;margin:0;border:1px solid var(--xj-line);border-radius:8px;padding:7px 11px;font-size:12px;color:var(--xj-muted)}.xj-embed .xj-embed-search input{margin:0;padding:0;width:170px;max-width:100%;min-width:0;height:auto;background:transparent;color:var(--xj-ink);border:0;border-radius:0;box-shadow:none;line-height:1.8}.xj-embed .xj-embed-filter-row select{background:var(--xj-bg);color:var(--xj-muted);border:1px solid var(--xj-line);border-radius:7px;padding:6px 10px;font-size:12px;max-width:140px;height:auto;margin:0}.xj-embed .xj-embed-hint{font-size:11px;color:var(--xj-muted);margin:0 0 18px}
.xj-embed .xj-embed-course-grid{display:grid;grid-template-columns:repeat(var(--xj-course-cols,4),minmax(0,1fr));gap:17px}.xj-embed .xj-embed-course{min-width:0;overflow:hidden;border:1px solid var(--xj-line);border-radius:11px;background:var(--xj-bg);display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s}.xj-embed .xj-embed-course:hover{transform:translateY(-3px);box-shadow:0 8px 20px #16334612}.xj-embed .xj-embed-cover{display:block;width:100%;padding:0;border:0;border-radius:0;position:relative;aspect-ratio:1.6;background:var(--xj-soft);overflow:hidden;box-shadow:none}.xj-embed .xj-embed-cover img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;margin:0}.xj-embed .xj-embed-cover-arrow{position:absolute;right:10px;bottom:10px;background:#fffffff0;color:#167369;border-radius:50%;width:27px;height:27px;display:grid;place-items:center}.xj-embed .xj-embed-course-body{padding:15px;flex:1;display:flex;flex-direction:column}.xj-embed .xj-embed-course-meta,.xj-embed .xj-embed-course-foot{display:flex;justify-content:space-between;gap:7px;align-items:center;color:var(--xj-muted);font-size:10px;flex-wrap:wrap}.xj-embed .xj-embed-track{padding:3px 7px;border-radius:4px;background:var(--xj-soft);color:var(--xj-accent);font-size:10px}.xj-embed .xj-embed-course h3{font-size:14px;font-weight:600;line-height:1.6;margin:10px 0 7px;padding:0;border:0}.xj-embed .xj-embed-course h3 button{padding:0;border:0;background:none;color:var(--xj-ink);font:inherit;text-align:left;box-shadow:none}.xj-embed .xj-embed-course p{font-size:11px;color:var(--xj-muted);margin:0 0 16px;line-height:1.8;flex:1}.xj-embed .xj-embed-course-foot{border-top:1px solid var(--xj-line);padding-top:11px;margin-top:auto}.xj-embed .xj-embed-course-foot :is(button,a){color:var(--xj-accent);text-decoration:none;font-size:11px;padding:0;border:0;background:none;box-shadow:none}.xj-embed .xj-embed-pending{color:var(--xj-muted)}
.xj-embed .xj-embed-pagination{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:20px;flex-wrap:wrap}.xj-embed .xj-embed-count,.xj-embed .xj-embed-muted,.xj-embed .xj-embed-footnote{font-size:11px;color:var(--xj-muted)}.xj-embed .xj-embed-button{display:inline-flex;gap:6px;justify-content:center;align-items:center;background:var(--xj-soft);color:var(--xj-accent);border:1px solid var(--xj-line);border-radius:7px;padding:7px 13px;font-size:12px;line-height:1.8;text-decoration:none;box-shadow:none}.xj-embed .xj-embed-button[aria-pressed=true]{background:var(--xj-accent);color:#fff;border-color:var(--xj-accent)}
.xj-embed .xj-embed-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:0;margin:0;list-style:none}.xj-embed .xj-embed-steps li{padding:18px;background:var(--xj-soft);border:1px solid var(--xj-line);border-radius:10px;margin:0;list-style:none}.xj-embed .xj-embed-steps li::marker{content:''}.xj-embed .xj-embed-steps b{display:block;font:24px/1.4 ui-monospace,Consolas,monospace;color:var(--xj-accent);margin-bottom:12px}.xj-embed .xj-embed-steps strong{font-size:14px}.xj-embed .xj-embed-steps p{margin:7px 0 0;color:var(--xj-muted);font-size:12px}.xj-embed .xj-embed-advanced{margin-top:20px;border-top:1px solid var(--xj-line);padding-top:16px}.xj-embed .xj-embed-advanced summary{cursor:pointer;color:var(--xj-accent);font-size:13px}.xj-embed .xj-embed-advanced>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px}.xj-embed .xj-embed-advanced article{border:1px solid var(--xj-line);padding:16px;border-radius:9px}.xj-embed .xj-embed-advanced article span{display:block;color:var(--xj-muted);font-size:11px}.xj-embed .xj-embed-advanced article p{font-size:12px;color:var(--xj-muted);margin:8px 0 12px}
.xj-embed .xj-embed-gallery-guide{display:flex;justify-content:space-between;gap:10px;padding:13px 16px;border-radius:9px;background:var(--xj-soft);border:1px solid var(--xj-line);color:var(--xj-accent);font-size:11px;margin-bottom:20px}.xj-embed .xj-embed-project-grid{display:grid;grid-template-columns:repeat(var(--xj-gallery-cols,3),minmax(0,1fr));gap:20px}.xj-embed .xj-embed-project{position:relative;border:1px solid var(--xj-line);border-radius:12px;color:var(--xj-ink);background:var(--xj-bg);padding:0;overflow:hidden;text-align:left;box-shadow:none;line-height:1.7;min-width:0}.xj-embed .xj-embed-project-title{display:block;padding:18px 40px 18px 18px;position:relative}.xj-embed .xj-embed-project-title small{display:block;font-size:10px;color:var(--xj-muted);margin-bottom:3px}.xj-embed .xj-embed-project-title strong{display:block;font-size:13px}.xj-embed .xj-embed-project-title b{position:absolute;right:18px;top:23px;font:11px ui-monospace,monospace;color:var(--xj-muted)}.xj-embed .xj-embed-project-image{display:block;height:var(--xj-preview-height,480px);overflow:hidden;background:var(--xj-soft);position:relative}.xj-embed .xj-embed-project-image img{display:block;width:100%;height:auto;max-width:none;margin:0;border:0;object-fit:contain}.xj-embed .xj-embed-fade{position:absolute;bottom:0;left:0;right:0;padding:54px 8px 15px;text-align:center;background:linear-gradient(transparent,var(--xj-bg));color:var(--xj-muted);font-size:10px}.xj-embed .xj-embed-project-link{display:block;text-align:right;font-size:11px;color:var(--xj-accent);padding:13px 18px}.xj-embed .xj-embed-footnote{margin:17px 0 0;white-space:pre-line}
.xj-embed .xj-embed-loading,.xj-embed .xj-embed-error,.xj-embed .xj-embed-empty{padding:30px;text-align:center;border:1px dashed var(--xj-line);border-radius:12px;color:var(--xj-muted);background:var(--xj-bg);grid-column:1/-1}.xj-embed .xj-embed-empty button{display:block;margin:15px auto 0}.xj-embed .xj-embed-error{color:var(--xj-ink)}.xj-embed .xj-embed-error p{font-size:12px;color:var(--xj-muted)}
.xj-embed .xj-embed-dialog{position:fixed;inset:0;margin:auto;width:min(800px,calc(100vw - 28px));max-width:none;max-height:90vh;max-height:90dvh;height:auto;overflow:auto;padding:0;border:1px solid var(--xj-line);border-radius:14px;background:var(--xj-bg);color:var(--xj-ink);box-shadow:0 25px 100px #0006;z-index:2147483000;font-family:inherit;font-size:14px;line-height:1.7}.xj-embed .xj-embed-dialog::backdrop{background:#06121bd9}.xj-embed .xj-embed-dialog:not([open]){display:none}.xj-embed .xj-embed-dialog-head{position:sticky;top:0;background:var(--xj-bg);padding:14px 20px;border-bottom:1px solid var(--xj-line);display:flex;align-items:center;gap:20px;justify-content:space-between;z-index:2}.xj-embed .xj-embed-dialog-head strong{font-size:14px}.xj-embed .xj-embed-dialog-head button{flex-shrink:0}.xj-embed .xj-embed-detail-body{padding:26px}.xj-embed .xj-embed-detail-body h2{font-size:24px;margin:14px 0 10px}.xj-embed .xj-embed-detail-body h3{font-size:16px;margin:24px 0 10px}.xj-embed .xj-embed-detail-body p{white-space:pre-line;color:var(--xj-muted);font-size:13px}.xj-embed .xj-embed-detail-body :is(ol,ul){padding-left:24px;font-size:13px;line-height:2}.xj-embed .xj-embed-detail-body li{margin:4px 0;padding:2px 0}.xj-embed .xj-embed-actions{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}
.xj-embed .xj-embed-lightbox[open]{height:90vh;height:90dvh;display:flex;flex-direction:column;overflow:hidden;width:min(1080px,calc(100vw - 24px))}.xj-embed .xj-embed-reader-tools{display:flex;gap:8px;padding:10px 18px;flex-wrap:wrap}.xj-embed .xj-embed-reader{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;text-align:center;background:var(--xj-soft)}.xj-embed .xj-embed-reader img{display:block;width:100%;height:auto;max-width:none;margin:0 auto}.xj-embed .xj-embed-reader[data-mode=fit] img{width:100%;height:100%;object-fit:contain}.xj-embed .xj-embed-reader[data-mode=actual] img{width:auto;height:auto;max-width:none;margin:0}.xj-embed .xj-embed-reader-foot{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;gap:10px;font-size:11px;color:var(--xj-muted)}

.xj-embed .xj-embed-projects[data-xj-gallery-theme=dark]{--xj-bg:#20252d;--xj-ink:#e3e8ee;--xj-muted:#a3b0bf;--xj-line:#39424d;--xj-soft:#29323b;color:var(--xj-ink)}
.xj-embed .xj-embed-project-grid{gap:var(--xj-gallery-gap,20px);align-items:start}
.xj-embed .xj-embed-project-grid[data-layout=spotlight] [data-xj-size=wide]{grid-column:span 2}
.xj-embed .xj-embed-project-grid:not([data-layout=chat]) .xj-embed-project-image{height:auto;aspect-ratio:16/10}
.xj-embed .xj-embed-project-grid:not([data-layout=chat]) .xj-embed-project-image[data-xj-ratio=square]{aspect-ratio:1}
.xj-embed .xj-embed-project-grid:not([data-layout=chat]) .xj-embed-project-image[data-xj-ratio=portrait]{aspect-ratio:3/4}
.xj-embed .xj-embed-project-grid:not([data-layout=chat]) .xj-embed-project-image img{height:100%;object-fit:contain}
.xj-embed .xj-embed-project-grid:not([data-layout=chat]) .xj-embed-project-image[data-xj-fit=cover] img{object-fit:cover}
.xj-embed .xj-embed-project-image[data-xj-position=top] img{object-position:top}
.xj-embed .xj-embed-project-image[data-xj-position=bottom] img{object-position:bottom}
.xj-embed .xj-embed-project-grid:not([data-layout=chat]) .xj-embed-project-image[data-xj-ratio=auto],.xj-embed .xj-embed-project-grid[data-layout=masonry] .xj-embed-project-image{aspect-ratio:auto}
.xj-embed .xj-embed-project-grid:not([data-layout=chat]) .xj-embed-project-image[data-xj-ratio=auto] img,.xj-embed .xj-embed-project-grid[data-layout=masonry] .xj-embed-project-image img{height:auto}
.xj-embed .xj-embed-project-grid[data-layout=masonry]{display:block;column-count:var(--xj-gallery-cols,3);column-gap:var(--xj-gallery-gap,20px)}
.xj-embed .xj-embed-project-grid[data-layout=masonry] .xj-embed-project{width:100%;break-inside:avoid;display:inline-block;margin-bottom:var(--xj-gallery-gap,20px)}
@container(max-width:950px){.xj-embed .xj-embed-course-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.xj-embed .xj-embed-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.xj-embed .xj-embed-advanced>div{grid-template-columns:repeat(2,minmax(0,1fr))}.xj-embed .xj-embed-section{padding:25px}.xj-embed .xj-embed-directions button{padding:17px;gap:10px}.xj-embed .xj-embed-directions em{font-size:11px}}
@container(max-width:620px){.xj-embed .xj-embed-section{padding:20px 16px;margin-bottom:16px}.xj-embed .xj-embed-heading h2{font-size:23px}.xj-embed .xj-embed-heading p{font-size:12px}.xj-embed .xj-embed-directions{grid-template-columns:1fr;gap:10px}.xj-embed .xj-embed-directions strong{font-size:19px}.xj-embed .xj-embed-toolbar{display:block}.xj-embed .xj-embed-track-tabs{margin-bottom:14px;gap:5px}.xj-embed .xj-embed-track-tabs button{padding:6px 10px;font-size:11px}.xj-embed .xj-embed-search input{width:100%}.xj-embed .xj-embed-steps,.xj-embed .xj-embed-advanced>div,.xj-embed .xj-embed-project-grid{grid-template-columns:1fr}.xj-embed .xj-embed-steps li{display:flex;gap:15px}.xj-embed .xj-embed-steps b{margin:0}.xj-embed .xj-embed-course-grid{grid-template-columns:1fr}.xj-embed .xj-embed-course h3{font-size:16px}.xj-embed .xj-embed-course-body{padding:18px}.xj-embed .xj-embed-gallery-guide{display:block}.xj-embed .xj-embed-gallery-guide span{display:block}.xj-embed .xj-embed-project-image{height:min(var(--xj-preview-height),460px)}}
@media(max-width:620px){.xj-embed .xj-embed-reader-foot{padding:10px;gap:5px}.xj-embed .xj-embed-reader-foot .xj-embed-button{font-size:11px;padding:5px 8px}.xj-embed .xj-embed-dialog-head{padding:10px 14px;gap:10px}.xj-embed .xj-embed-dialog-head strong{font-size:12px}.xj-embed .xj-embed-detail-body{padding:20px}.xj-embed .xj-embed-reader-tools{padding:8px 10px;gap:6px}.xj-embed .xj-embed-reader-tools button{padding:5px 8px;font-size:11px}}
@media(prefers-reduced-motion:reduce){.xj-embed .xj-embed-course{transition:none}.xj-embed .xj-embed-course:hover{transform:none}}
.xj-embed .xj-embed-search>span{white-space:nowrap;flex-shrink:0}

@container(max-width:620px){.xj-embed .xj-embed-project-grid[data-layout=spotlight] [data-xj-size=wide]{grid-column:auto}.xj-embed .xj-embed-project-grid[data-layout=masonry]{column-count:1}}