/* BeeCore Skills public product page V1 — route scoped. */
html.skills-route #root { display:none !important; }
html.skills-route body { background:#fafafa; }
#skills-root { position:relative; z-index:10; min-height:100vh; background:#fafafa; color:#181818; font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
#skills-root * { box-sizing:border-box; }
#skills-root .sk-main { width:min(100%,1440px); margin:0 auto; padding:0; display:grid; grid-template-columns:180px minmax(0,1fr); column-gap:48px; overflow-x:clip; }
#skills-root .sk-sidebar { position:sticky; top:64px; align-self:start; width:180px; height:calc(100vh - 64px); padding:72px 0 48px; overflow-y:auto; overflow-x:hidden; background:#fafafa; }
#skills-root .sk-sb__title { padding:0 0 14px 14px; margin:0 0 20px; border-bottom:1px solid #eaeaea; color:#94a3b8; font-size:13px; font-weight:700; letter-spacing:.1em; line-height:18px; }
#skills-root .sk-sb__nav { display:flex; flex-direction:column; gap:2px; padding-left:14px; }
#skills-root .sk-sb__item { position:relative; display:flex; align-items:center; gap:10px; width:100%; min-height:42px; padding:10px 0; color:#64748b; text-decoration:none; font-size:14px; font-weight:500; line-height:17.5px; }
#skills-root .sk-sb__item:hover { color:#111827; }
#skills-root .sk-sb__item.is-active { color:#111827; }
#skills-root .sk-sb__item.is-active::before { content:""; position:absolute; z-index:0; left:-14px; right:0; top:0; bottom:0; border-left:2px solid #f5b800; border-radius:6px; background:#fef9e7; }
#skills-root .sk-sb__item > * { position:relative; z-index:1; }
#skills-root .sk-sb__item.is-active .sk-icon { color:#b45309; }
#skills-root .sk-icon { display:block; width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
#skills-root .sk-content { min-width:0; max-width:1180px; padding:72px 0 64px; }
#skills-root .sk-hero { padding-bottom:64px; border-bottom:1px solid #eaeaea; scroll-margin-top:84px; }
#skills-root .sk-eyebrow, #skills-root .sk-kicker { color:#8da0ba; font-size:12px; font-weight:700; letter-spacing:.11em; line-height:18px; }
#skills-root .sk-hero h1 { max-width:700px; margin:10px 0 14px; white-space:pre-line; color:#111827; font-size:46px; font-weight:750; letter-spacing:-.045em; line-height:1.08; }
#skills-root .sk-hero__desc { max-width:715px; margin:0; color:#64748b; font-size:16px; line-height:1.55; }
#skills-root .sk-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
#skills-root .sk-btn { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:9px 18px; border:1px solid #e5e7eb; border-radius:7px; color:#111827; background:#fff; font:600 13px/18px inherit; text-decoration:none; cursor:pointer; }
#skills-root .sk-btn--primary { border-color:#f5b800; background:#ffc800; }
#skills-root .sk-btn--primary:hover { background:#f5b800; }
#skills-root .sk-btn--secondary:hover { background:#fafafa; border-color:#d6dbe2; }
#skills-root .sk-benefits { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:52px; max-width:900px; }
#skills-root .sk-benefit { display:flex; align-items:flex-start; gap:12px; }
#skills-root .sk-benefit__icon { display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; flex:none; color:#9a6700; border-radius:8px; background:#fff9e8; }
#skills-root .sk-benefit h2 { margin:1px 0 4px; color:#111827; font-size:14px; font-weight:700; line-height:19px; }
#skills-root .sk-benefit p { margin:0; color:#64748b; font-size:12px; line-height:17px; }
#skills-root .sk-section { padding:62px 0; border-bottom:1px solid #eaeaea; scroll-margin-top:84px; }
#skills-root .sk-section__heading { margin-bottom:22px; }
#skills-root .sk-section__heading--inline { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; }
#skills-root .sk-section h2, #skills-root .sk-final h2 { margin:4px 0 4px; color:#111827; font-size:28px; letter-spacing:-.03em; line-height:1.18; font-weight:750; }
#skills-root .sk-section__heading p, #skills-root .sk-custom > p { max-width:710px; margin:0; color:#64748b; font-size:15px; line-height:1.5; }
#skills-root .sk-searchbox { display:flex; align-items:center; width:330px; height:38px; gap:9px; padding:0 11px; border:1px solid #e1e6ed; border-radius:7px; background:#fff; color:#64748b; }
#skills-root .sk-searchbox .sk-icon { width:16px; height:16px; }
#skills-root .sk-search { width:100%; min-width:0; outline:0; border:0; color:#111827; background:transparent; font:13px/18px inherit; }
#skills-root .sk-search::placeholder { color:#94a3b8; }
#skills-root .sk-filters { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
#skills-root .sk-filter { height:31px; padding:0 15px; border:1px solid #e1e6ed; border-radius:7px; color:#334155; background:#fff; font:500 12px/1 inherit; cursor:pointer; }
#skills-root .sk-filter:hover { border-color:#cad2dd; }
#skills-root .sk-filter.is-active { border-color:#f5b800; background:#ffc800; color:#111827; }
#skills-root .sk-catalog__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
#skills-root .sk-card { display:grid; grid-template-columns:48px minmax(0,1fr) 18px; gap:14px; align-items:start; min-height:136px; padding:14px 14px 13px; border:1px solid #e5e7eb; border-radius:8px; color:#111827; background:#fff; text-align:left; font:inherit; cursor:pointer; transition:border-color .13s ease,transform .13s ease; }
#skills-root .sk-card:hover, #skills-root .sk-card:focus-visible { border-color:#cbd5e1; outline:0; transform:translateY(-1px); }
#skills-root .sk-card__icon { display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; color:#334155; border-radius:8px; background:#f6f7f9; }
#skills-root .sk-card__icon .sk-icon { width:21px; height:21px; }
#skills-root .sk-card__body { min-width:0; display:block; }
#skills-root .sk-card__name { display:block; margin:1px 0 4px; font-size:14px; font-weight:700; line-height:18px; }
#skills-root .sk-card__desc { display:block; min-height:34px; color:#64748b; font-size:12px; line-height:17px; }
#skills-root .sk-card__meta, #skills-root .sk-drawer__meta { display:flex; flex-wrap:wrap; gap:7px; margin-top:9px; }
#skills-root .sk-tag, #skills-root .sk-status { display:inline-flex; align-items:center; min-height:22px; padding:3px 8px; border-radius:6px; font-size:11px; font-weight:500; line-height:14px; white-space:nowrap; }
#skills-root .sk-tag { color:#475569; background:#f2f4f7; }
#skills-root .sk-status.is-available { color:#047857; background:#ecfdf5; }
#skills-root .sk-status.is-soon { color:#64748b; background:#f3f4f6; }
#skills-root .sk-card__arrow { align-self:center; color:#475569; font-size:19px; font-weight:400; }
#skills-root .sk-empty { padding:36px 0 10px; text-align:center; color:#64748b; }
#skills-root .sk-empty p { margin:0 0 9px; }
#skills-root .sk-link-button, #skills-root .sk-text-action { padding:0; border:0; color:#475569; background:transparent; font:600 12px/18px inherit; cursor:pointer; }
#skills-root .sk-text-action:hover, #skills-root .sk-link-button:hover { color:#111827; }
#skills-root .sk-categories { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
#skills-root .sk-category-card { display:grid; grid-template-columns:40px minmax(0,1fr) 16px; align-items:center; gap:11px; min-height:97px; padding:12px; border:1px solid #e5e7eb; border-radius:8px; color:#111827; background:#fff; text-align:left; font:inherit; cursor:pointer; }
#skills-root .sk-category-card:hover { border-color:#cbd5e1; }
#skills-root .sk-category-card__icon { display:inline-flex; justify-content:center; align-items:center; width:38px; height:38px; color:#334155; border-radius:7px; background:#f6f7f9; }
#skills-root .sk-category-card__copy { min-width:0; }
#skills-root .sk-category-card strong { display:block; margin-bottom:3px; font-size:13px; line-height:17px; }
#skills-root .sk-category-card small { display:block; color:#64748b; font-size:11px; line-height:15px; }
#skills-root .sk-category-card__arrow { color:#475569; font-size:17px; }
#skills-root .sk-steps { display:flex; align-items:stretch; gap:11px; }
#skills-root .sk-step-wrap { display:flex; align-items:center; flex:1; gap:11px; min-width:0; }
#skills-root .sk-step { display:flex; align-items:flex-start; gap:12px; flex:1; min-height:94px; padding:14px; border:1px solid #e5e7eb; border-radius:8px; background:#fff; }
#skills-root .sk-step__number { display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; flex:none; border-radius:50%; color:#a16207; background:#fff6d7; font-size:12px; font-weight:700; }
#skills-root .sk-step h3 { margin:0 0 3px; font-size:13px; line-height:18px; }
#skills-root .sk-step p { margin:0; color:#64748b; font-size:11px; line-height:15px; }
#skills-root .sk-step__arrow { color:#64748b; font-size:18px; }
#skills-root .sk-custom { border-bottom:0; }
#skills-root .sk-custom__note { display:flex; align-items:center; gap:10px; width:max-content; max-width:100%; margin-top:19px; padding:12px 14px; border:1px solid #e5e7eb; border-radius:8px; background:#fff; }
#skills-root .sk-custom__note p { margin:0; color:#64748b; font-size:13px; line-height:18px; }
#skills-root .sk-final { display:flex; align-items:center; justify-content:space-between; gap:28px; padding:30px 32px; border:1px solid #f2df96; border-radius:9px; background:#fffbeb; }
#skills-root .sk-final h2 { font-size:26px; }
#skills-root .sk-final p { margin:0; color:#64748b; font-size:14px; line-height:20px; }
#skills-root .sk-final .sk-actions { margin:0; flex:none; }
#skills-root .sk-drawer { position:fixed; z-index:10050; inset:0; display:flex; justify-content:flex-end; background:rgba(15,23,42,.3); }
#skills-root + .sk-drawer, .sk-drawer { font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.sk-drawer-open { overflow:hidden; }
.sk-drawer__panel { position:relative; width:min(420px,100vw); height:100%; margin-left:auto; overflow:auto; padding:32px; border-left:1px solid #e5e7eb; background:#fff; color:#181818; box-shadow:-10px 0 30px rgba(15,23,42,.09); }
.sk-drawer__close { position:absolute; right:18px; top:15px; width:32px; height:32px; border:0; border-radius:6px; color:#475569; background:transparent; font-size:25px; cursor:pointer; }
.sk-drawer__close:hover { background:#f3f4f6; }
.sk-drawer__icon { display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; margin-bottom:14px; border-radius:8px; color:#334155; background:#f6f7f9; }
.sk-drawer__icon .sk-icon { display:block; width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.sk-drawer__meta { display:flex; flex-wrap:wrap; gap:7px; margin:0 0 16px; }
.sk-drawer .sk-tag, .sk-drawer .sk-status { display:inline-flex; align-items:center; min-height:22px; padding:3px 8px; border-radius:6px; font-size:11px; font-weight:500; line-height:14px; white-space:nowrap; }
.sk-drawer .sk-tag { color:#475569; background:#f2f4f7; }
.sk-drawer .sk-status.is-available { color:#047857; background:#ecfdf5; }
.sk-drawer .sk-status.is-soon { color:#64748b; background:#f3f4f6; }
.sk-drawer__panel h2 { margin:0 0 24px; font-size:28px; letter-spacing:-.03em; }
.sk-drawer__panel h3 { margin:19px 0 6px; font-size:13px; }
.sk-drawer__panel p,.sk-drawer__panel li { color:#64748b; font-size:14px; line-height:21px; }
.sk-drawer__panel p { margin:0; }
.sk-drawer__panel ul { margin:0; padding-left:19px; }
.sk-drawer__docs { margin-top:24px; }
@media (max-width:1199px) and (min-width:1025px) { #skills-root .sk-main { padding:0 32px; } }
@media (max-width:1024px) { #skills-root .sk-main { grid-template-columns:1fr; padding:0 32px; } #skills-root .sk-sidebar { position:relative; top:0; width:100%; height:auto; padding:24px 0 0; overflow:visible; } #skills-root .sk-sb__title { display:none; } #skills-root .sk-sb__nav { flex-direction:row; overflow:auto; padding:0 0 12px; } #skills-root .sk-sb__item { width:auto; min-height:36px; padding:8px 12px; white-space:nowrap; border-radius:6px; } #skills-root .sk-sb__item.is-active::before { left:0; border-left:0; border-bottom:2px solid #f5b800; } #skills-root .sk-content { max-width:none; padding-top:40px; } #skills-root .sk-catalog__grid { grid-template-columns:repeat(2,minmax(0,1fr)); } #skills-root .sk-categories { grid-template-columns:repeat(2,minmax(0,1fr)); } #skills-root .sk-steps { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); } #skills-root .sk-step-wrap { min-width:0; } #skills-root .sk-step__arrow { display:none; } }
@media (max-width:767px) { #skills-root .sk-main { padding:0 16px; } #skills-root .sk-content { padding:32px 0 42px; } #skills-root .sk-hero { padding-bottom:42px; } #skills-root .sk-hero h1 { font-size:36px; } #skills-root .sk-hero__desc { font-size:15px; } #skills-root .sk-benefits { grid-template-columns:1fr; gap:16px; margin-top:36px; } #skills-root .sk-section { padding:44px 0; } #skills-root .sk-section h2, #skills-root .sk-final h2 { font-size:25px; } #skills-root .sk-section__heading--inline { align-items:flex-start; flex-direction:column; } #skills-root .sk-searchbox { width:100%; margin-top:14px; } #skills-root .sk-catalog__grid, #skills-root .sk-categories, #skills-root .sk-steps { grid-template-columns:1fr; } #skills-root .sk-card { min-height:122px; } #skills-root .sk-step-wrap { width:100%; } #skills-root .sk-final { align-items:flex-start; flex-direction:column; padding:25px 20px; } #skills-root .sk-final .sk-actions { width:100%; } #skills-root .sk-final .sk-btn { flex:1; } .sk-drawer__panel { padding:27px 22px; } }
