.lss-kb-frontend {
--kb-accent: #0258bb;
--kb-accent-dark: #082c86;
--kb-border: #d5dde2;
--kb-surface: #fff;
color: #17242b;
font-size: 100%;
margin-inline: auto;
max-width: 1400px;
width: 100%;
} .lss-kb-frontend__navigation li > div { min-width: 0; }
.lss-kb-frontend__navigation .lss-kb-frontend__term-link { min-width: 0; }
.lss-kb-frontend__article-count {
align-items: center;
background: #e8f1ff;
border: 1px solid #a9c6ea;
border-radius: 999px;
color: #174f91;
display: inline-flex;
flex: 0 0 auto;
font-size: .75rem;
font-weight: 750;
height: 25px;
justify-content: center;
line-height: 1;
min-width: 31px;
padding: 0 8px;
}
.lss-kb-frontend__navigation-heading {
align-items: center;
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-bottom: .83em;
}
.lss-kb-frontend__navigation-heading h2 { margin: 0; }
.lss-kb-frontend__navigation nav {
opacity: 1;
transition: opacity .12s ease;
}
.lss-kb-frontend__navigation.is-translating nav {
opacity: 0;
pointer-events: none;
}
.lss-kb-frontend__article-count--total {
font-size: .8rem;
height: 28px;
padding-inline: 11px;
}
.lss-kb-frontend__article-count--total[hidden] { display: none; }
.lss-kb-frontend__term-overview > h1 { margin-bottom: 24px; }
.lss-kb-frontend__term-grid { gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lss-kb-frontend .lss-kb-frontend__term-card {
align-content: start;
background: #fff;
border: 1px solid #cbd8e6;
border-radius: 14px;
box-shadow: 0 3px 12px rgba(18, 52, 77, .07);
color: #17242b;
cursor: pointer;
display: grid;
gap: 9px;
min-height: 190px !important;
padding: 18px !important;
position: relative;
transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.lss-kb-frontend .lss-kb-frontend__term-card::before {
background: #1f62c9;
border-radius: 14px 0 0 14px;
bottom: 0;
content: "";
left: 0;
position: absolute;
top: 0;
width: 4px;
}
.lss-kb-frontend .lss-kb-frontend__term-card:hover {
background: #fff;
border-color: #1f62c9;
box-shadow: 0 8px 22px rgba(20, 67, 117, .13);
color: #17242b;
transform: translateY(-2px);
}
.lss-kb-frontend__term-card-head { align-items: center; display: flex; justify-content: space-between; }
.lss-kb-frontend__content-card-header {
align-items: center;
display: flex;
gap: 9px;
min-width: 0;
width: 100%;
}
.lss-kb-frontend__content-card-header .lss-kb-frontend__content-type { flex: 0 0 auto; }
.lss-kb-frontend__content-card-header .lss-kb-frontend__article-count { margin-left: auto; }
.lss-kb-frontend__card-path {
align-items: baseline;
color: #536972;
display: flex;
flex: 1 1 auto;
flex-wrap: wrap;
font-size: .76rem;
gap: 2px 4px;
line-height: 1.35;
max-height: 2.7em;
min-width: 0;
overflow: hidden;
text-align: left;
}
.lss-kb-frontend .lss-kb-frontend__card-path-link {
background: transparent;
border: 0;
color: #365d70;
font-size: inherit;
min-height: auto;
padding: 0;
text-align: left;
}
.lss-kb-frontend .lss-kb-frontend__card-path-link:hover { background: transparent; color: #1f62c9; text-decoration: underline; }
.lss-kb-frontend__content-type {
background: #1f62c9;
border-radius: 999px;
color: #fff;
display: inline-flex;
font-size: .72rem !important;
font-weight: 750;
justify-self: start;
letter-spacing: .025em;
line-height: 1;
opacity: 1 !important;
padding: 6px 11px;
}
.lss-kb-frontend__term-card > strong { font-size: 1.08rem; line-height: 1.3; }
.lss-kb-frontend__term-description {
color: #526875;
display: -webkit-box;
font-size: .9rem !important;
line-height: 1.45;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.lss-kb-frontend__term-action { color: #0f5fbd; font-size: .86rem !important; font-weight: 700; margin-top: auto; opacity: 1 !important; }
.lss-kb-frontend__display-card {
background: linear-gradient(145deg, #fff 0%, #f8fbff 100%);
border-color: #cbd8e6;
border-radius: 14px;
box-shadow: 0 3px 12px rgba(18, 52, 77, .06);
grid-template-columns: 1fr;
min-height: 190px;
padding: 17px 18px 18px 20px;
position: relative;
transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.lss-kb-frontend__display-card::before { background: #1f62c9; border-radius: 14px 0 0 14px; bottom: 0; content: ""; left: 0; position: absolute; top: 0; width: 4px; }
.lss-kb-frontend__display-card:hover { border-color: #91b3da; box-shadow: 0 8px 22px rgba(20, 67, 117, .12); transform: translateY(-2px); }
.lss-kb-frontend__display-card .lss-kb-frontend__favorite-path,
.lss-kb-frontend__display-card .lss-kb-frontend__content-type,
.lss-kb-frontend__display-card h3,
.lss-kb-frontend__display-card-description,
.lss-kb-frontend__display-card .lss-kb-frontend__favorite-actions { grid-column: 1; }
.lss-kb-frontend__display-card .lss-kb-frontend__favorite-path { color: #607482; font-size: .76rem; }
.lss-kb-frontend__display-card h3 { color: #122d42; font-size: 1.15rem; line-height: 1.3; }
.lss-kb-frontend__display-card-description {
color: #526875;
display: -webkit-box;
font-size: .9rem;
line-height: 1.45;
margin: 0;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.lss-kb-frontend__display-card .lss-kb-frontend__favorite-open,
.lss-kb-frontend__favorite-card--compact .lss-kb-frontend__favorite-open {
border-radius: 7px;
font-size: .86rem;
min-height: 34px;
padding: 5px 13px;
}
.lss-kb-frontend__favorite-card--compact { border-left: 4px solid #1f62c9; position: relative; }
.lss-kb-frontend__overview-back { margin-bottom: 14px; min-height: 38px !important; padding: 6px 14px !important; }
.lss-kb-frontend__overview-path {
align-items: center;
color: #536972;
display: flex;
flex-wrap: wrap;
font-size: .84rem;
gap: 5px;
margin: -4px 0 6px;
}
.lss-kb-frontend .lss-kb-frontend__overview-path-link {
background: transparent;
border: 0;
color: #365d70;
min-height: auto;
padding: 2px 0;
}
.lss-kb-frontend .lss-kb-frontend__overview-path-link:not(:disabled):hover { background: transparent; color: #1f62c9; text-decoration: underline; }
.lss-kb-frontend .lss-kb-frontend__overview-path-link:disabled { color: #536972; cursor: default; opacity: 1; }
@media (max-width: 760px) {
.lss-kb-frontend__term-grid { grid-template-columns: 1fr; }
.lss-kb-frontend .lss-kb-frontend__term-card { min-height: 175px !important; }
}
.lss-kb-frontend__simple-explanation{margin:1.5rem 0;padding:1.15rem 1.25rem;border:1px solid #b9d4f5;border-left:5px solid #1f62c9;border-radius:14px;background:#f1f7ff}.lss-kb-frontend__simple-explanation h2{margin-top:0;color:#154f9f}.lss-kb-frontend__simple-explanation p{font-size:1rem;line-height:1.55}.lss-kb-frontend__simple-explanation strong{color:#154f9f}
.lss-kb-frontend *, .lss-kb-frontend *::before, .lss-kb-frontend *::after { box-sizing: border-box; }
.lss-kb-frontend .screen-reader-text { border:0; clip:rect(1px,1px,1px,1px); clip-path:inset(50%); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; word-wrap:normal !important; }
.lss-kb-frontend__header { background: #f2f7f8; border: 1px solid var(--kb-border); border-radius: 12px; margin: 0 auto 24px; padding: clamp(18px, 3vw, 32px); width: 100%; }
.lss-kb-frontend__account { align-items: center; display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin: 0 0 22px; text-align: center; }
.lss-kb-frontend__account button { background: var(--kb-accent); color: #fff; flex: 0 1 220px; width: 220px; }
.lss-kb-frontend__account .lss-kb-frontend__account-home { flex: 0 0 46px; font-size: 1.5rem; padding-inline: 8px; width: 46px; }
.lss-kb-frontend__account-home,
.lss-kb-frontend__home { font-size: 0 !important; }
.lss-kb-frontend__account-home::before,
.lss-kb-frontend__home::before { content: "\2302"; font-size: 1.55rem; line-height: 1; }
.lss-kb-frontend__heart { display: inline-block; font-size: 1.45em; line-height: .7; transform: translateY(1px); }
.lss-kb-frontend__search { align-items: end; display: grid; gap: 12px 16px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 3fr) minmax(0, 3fr) minmax(0, 1fr) minmax(0, 1fr); margin: 0 auto; width: 100%; }
.lss-kb-frontend__skill-label { grid-column: 2 / 4; grid-row: 1; }
.lss-kb-frontend__search > select { appearance: none; background-color: #fff; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8'%3E%3Cpath fill='%23082c86' d='M1.2.7 7 6.5 12.8.7 14 1.9l-7 7-7-7z'/%3E%3C/svg%3E"); background-position: right 13px center; background-repeat: no-repeat; background-size: 12px 7px; padding-right: 38px; width: 100%; }
.lss-kb-frontend__search > #lss-kb-frontend-skill { grid-column: 2 / 4; grid-row: 1; }
.lss-kb-frontend__topic-label { grid-column: 4 / 6; grid-row: 1; }
.lss-kb-frontend__search > #lss-kb-frontend-topic { grid-column: 4 / 6; grid-row: 1; }
.lss-kb-frontend__query-label { grid-column: 3 / 5; grid-row: 2; }
.lss-kb-frontend__query-control { border: 1px solid #74838b; border-radius: 6px; display: flex; grid-column: 3 / 5; grid-row: 2; min-width: 0; overflow: hidden; }
.lss-kb-frontend__search input { flex: 1; min-width: 0; }
.lss-kb-frontend button, .lss-kb-frontend input, .lss-kb-frontend select { border: 1px solid #74838b; border-radius: 6px; font: inherit; min-height: 42px; padding: 8px 12px; }
.lss-kb-frontend__query-control input { border: 0; border-radius: 0; }
.lss-kb-frontend__query-control button { border: 0; border-left: 1px solid #74838b; border-radius: 0; }
.lss-kb-frontend button { background: var(--kb-accent); color: #fff; cursor: pointer; }
.lss-kb-frontend button:hover { background: var(--kb-accent-dark); color: #fff; }
.lss-kb-frontend button:focus-visible, .lss-kb-frontend input:focus-visible, .lss-kb-frontend select:focus-visible, .lss-kb-frontend a:focus-visible { outline: 3px solid #f0a500; outline-offset: 3px; }
.lss-kb-frontend__layout { display: grid; gap: 24px; grid-template-columns: minmax(230px, 310px) minmax(0, 1fr); }
.lss-kb-frontend__navigation { border-right: 1px solid var(--kb-border); padding-right: 18px; }
.lss-kb-frontend__navigation ul { list-style: none; margin: 0; padding-left: 16px; }
.lss-kb-frontend__navigation > nav > ul { padding-left: 0; }
.lss-kb-frontend__navigation li > div { align-items: center; display: flex; gap: 7px; margin: 4px 0; }
.lss-kb-frontend__navigation img { border-radius: 50%; height: 34px; object-fit: contain; width: 34px; }
.lss-kb-frontend .lss-kb-frontend__toggle { min-height: 32px; padding: 2px; width: 32px; }
.lss-kb-frontend .lss-kb-frontend__term-link {
background: transparent;
border: 0;
color: #17242b;
font-size: 1rem;
font-weight: 500;
min-height: 32px;
padding: 3px 2px;
text-align: left;
}
.lss-kb-frontend .lss-kb-frontend__term-link:hover {
background: transparent;
color: var(--kb-accent);
text-decoration: underline;
}
.lss-kb-frontend__article-link { background: transparent !important; border: 0 !important; color: #174f61 !important; display: grid; gap: 3px; min-height: auto !important; padding: 7px !important; text-align: left; width: 100%; }
.lss-kb-frontend__article-link:hover strong { text-decoration: underline; }
.lss-kb-frontend__article-link span, .lss-kb-frontend__article-link small { color: #425a65; }
.lss-kb-frontend__article-link .lss-kb-frontend__article-path {
color: #365d70;
display: block;
font-size: .78rem;
font-weight: 600;
line-height: 1.3;
margin-bottom: 2px;
order: -1;
}
.lss-kb-frontend__main { min-width: 0; }
.lss-kb-frontend__main,
.lss-kb-frontend__main:focus,
.lss-kb-frontend__main:focus-visible,
.lss-kb-frontend__article,
.lss-kb-frontend__article:focus,
.lss-kb-frontend__article:focus-visible {
border-color: transparent !important;
box-shadow: none !important;
outline: 0 !important;
}
.lss-kb-frontend__status:not(:empty), .lss-kb-frontend__notice { background: #f2f7f8; border-left: 4px solid var(--kb-accent); padding: 12px; }
.lss-kb-frontend__cards { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lss-kb-frontend__results { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.lss-kb-frontend__cards > button, .lss-kb-frontend__results > button { border: 1px solid var(--kb-border) !important; border-radius: 9px !important; padding: 14px !important; }
.lss-kb-frontend__suggestions { margin-bottom: 28px; }
.lss-kb-frontend__article { max-width: 900px; }
.lss-kb-frontend__article > .lss-kb-frontend__favorite { float: right; margin-top: -54px; }
.lss-kb-frontend__article > section { border-top: 1px solid var(--kb-border); margin-top: 22px; padding-top: 12px; }
.lss-kb-frontend__article img { height: auto; max-width: 100%; }
.lss-kb-frontend__article section > a { display: block; margin: 8px 0; }
.lss-kb-frontend__breadcrumbs, .lss-kb-frontend__meta { color: #536972; }
.lss-kb-frontend__favorite { margin: 8px 0 16px; }
.lss-kb-frontend__favorite-controls { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 18px; }
.lss-kb-frontend__favorite-controls input { flex: 1 1 260px; }
.lss-kb-frontend__favorite-list { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.lss-kb-frontend__favorite-card { border: 1px solid var(--kb-border); border-radius: 10px; display: grid; gap: 12px; grid-template-columns: 54px minmax(0, 1fr); padding: 15px; }
.lss-kb-frontend__favorite-card > img { border-radius: 50%; height: 54px; object-fit: contain; width: 54px; }
.lss-kb-frontend__favorite-card h3 { margin-top: 0; }
.lss-kb-frontend__favorite-card small { display: block; margin-bottom: 10px; }
.lss-kb-frontend__favorite-card div > div { display: flex; flex-wrap: wrap; gap: 7px; }
.lss-kb-frontend__unavailable { color: #8a2424; font-weight: 700; }
.lss-kb-frontend__article--structured {
font-size: 16.5px;
line-height: 1.5;
max-width: none;
width: 100%;
}
.lss-kb-frontend__article--structured > h1 {
font-size: clamp(2rem, 3.3vw, 2.8rem);
line-height: 1.12;
margin: 18px 0 8px;
}
.lss-kb-frontend__article--structured h2 {
font-size: clamp(1.35rem, 2vw, 1.7rem);
line-height: 1.2;
margin: 0 0 12px;
}
.lss-kb-frontend__article-toolbar {
align-items: center;
display: flex;
flex-wrap: wrap;
gap: 10px 18px;
justify-content: space-between;
}
.lss-kb-frontend__article-toolbar .lss-kb-frontend__breadcrumbs {
align-items: center;
display: flex;
flex: 1 1 100%;
flex-wrap: wrap;
gap: 5px;
margin: 0;
font-size: .84rem;
}
.lss-kb-frontend__breadcrumb-link {
background: transparent !important;
border: 0 !important;
color: #365d70 !important;
min-height: auto !important;
padding: 2px 0 !important;
}
.lss-kb-frontend__breadcrumb-link:hover { color: var(--kb-accent) !important; text-decoration: underline; }
.lss-kb-frontend__article-actions {
align-items: center;
display: flex;
flex-wrap: wrap;
gap: 8px;
flex: 1 1 100%;
}
.lss-kb-frontend__article-actions .lss-kb-frontend__favorite,
.lss-kb-frontend__article-actions .lss-kb-frontend__share {
margin: 0;
}
.lss-kb-frontend__home {
align-items: center;
background: var(--kb-accent);
border: 1px solid var(--kb-accent);
border-radius: 6px;
color: #fff;
display: inline-flex;
font-size: 1.55rem;
height: 42px;
justify-content: center;
line-height: 1;
text-decoration: none;
width: 44px;
}
.lss-kb-frontend__home:hover {
background: var(--kb-accent-dark);
color: #fff;
}
.lss-kb-frontend__article--structured > section {
border-top: 1px solid var(--kb-border);
margin-top: 22px;
padding-top: 18px;
}
.lss-kb-frontend__reading-time {
background: #eaf2ff;
border-radius: 9px;
color: #274767;
display: inline-block;
font-size: .95rem;
margin: 16px 0 0;
padding: 7px 12px;
}
.lss-kb-frontend__article-grid {
display: grid;
gap: 18px;
grid-template-columns: repeat(2, minmax(0, 1fr));
margin-top: 22px;
}
.lss-kb-frontend__article-grid .lss-kb-frontend__box {
--box-accent: #52789a;
--box-bg: #f4f8fb;
background: var(--box-bg);
border: 1px solid color-mix(in srgb, var(--box-accent) 28%, #d5dde2);
border-top: 4px solid var(--box-accent);
border-radius: 14px;
margin: 0;
padding: 20px;
}
.lss-kb-frontend__box h2 {
align-items: center;
display: flex;
gap: 10px;
}
.lss-kb-frontend__box h2::before {
align-items: center;
background: color-mix(in srgb, var(--box-accent) 15%, #fff);
border-radius: 50%;
color: var(--box-accent);
content: "•";
display: inline-flex;
flex: 0 0 36px;
font-size: 1.1rem;
height: 36px;
justify-content: center;
}
.lss-kb-frontend__box--goals { --box-accent: #2368a2; --box-bg: #f0f7fd; }
.lss-kb-frontend__box--goals h2::before { content: "◎"; }
.lss-kb-frontend__box--competency { --box-accent: #6d54a3; --box-bg: #f6f2fb; }
.lss-kb-frontend__box--competency h2::before { content: "◆"; }
.lss-kb-frontend__box--tips { --box-accent: #287d62; --box-bg: #eff9f5; }
.lss-kb-frontend__box--tips h2::before { content: "✓"; }
.lss-kb-frontend__box--notes { --box-accent: #b06b22; --box-bg: #fff7ed; }
.lss-kb-frontend__box--notes h2::before { content: "i"; font-family: Georgia, serif; font-style: italic; font-weight: 700; }
.lss-kb-frontend__box--mnemonic { --box-accent: #b13f68; --box-bg: #fff2f6; }
.lss-kb-frontend__box--mnemonic h2::before { content: "★"; }
.lss-kb-frontend__box--sources { --box-accent: #536b78; --box-bg: #f3f6f7; }
.lss-kb-frontend__box--sources h2::before { content: "↗"; }
.lss-kb-frontend__box--goals h2::before { content: "\25CE"; }
.lss-kb-frontend__box--competency h2::before { content: "\25C6"; }
.lss-kb-frontend__box--tips h2::before { content: "\2713"; }
.lss-kb-frontend__box--mnemonic h2::before { content: "\2605"; }
.lss-kb-frontend__box--sources h2::before { content: "\2197"; }
.lss-kb-frontend__article--structured ul {
margin: 0;
padding-left: 1.25em;
}
.lss-kb-frontend__article--structured li + li {
margin-top: 6px;
}
.lss-kb-frontend__related-grid {
display: grid;
gap: 12px;
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.lss-kb-frontend__related-grid > button {
background: #fff !important;
border: 1px solid var(--kb-border) !important;
border-radius: 12px !important;
color: #174f61 !important;
padding: 15px !important;
}
.lss-kb-frontend__term-overview > h1 { font-size: clamp(2rem, 4vw, 3rem); }
.lss-kb-frontend__eyebrow { color: #527080; font-size: .85rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.lss-kb-frontend__term-grid {
display: grid;
gap: 12px;
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}
.lss-kb-frontend__term-card {
align-content: center;
display: grid;
gap: 5px;
min-height: 105px !important;
text-align: left;
}
.lss-kb-frontend__term-card span { font-size: .85rem; opacity: .85; } .lss-kb-frontend__article-grid .lss-kb-frontend__box {
background: var(--box-bg);
border: 1px solid #d8dee3;
border-radius: 18px;
box-shadow: 0 2px 7px rgba(18, 39, 54, .08);
font-size: 15px;
line-height: 1.42;
overflow: hidden;
padding: 0;
}
.lss-kb-frontend__article-grid .lss-kb-frontend__box h2 {
align-items: center;
background: var(--box-accent);
color: #fff;
display: flex;
font-size: clamp(1.25rem, 2vw, 1.55rem);
gap: 13px;
margin: 0;
min-height: 68px;
padding: 12px 20px;
}
.lss-kb-frontend__article-grid .lss-kb-frontend__box h2::before {
background-color: transparent;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
border: 0;
border-radius: 0;
content: "";
display: block;
flex: 0 0 46px;
height: 46px;
}
.lss-kb-frontend__article-grid .lss-kb-frontend__box > div { padding: 17px 21px 20px; }
.lss-kb-frontend__article-grid .lss-kb-frontend__box p,
.lss-kb-frontend__article-grid .lss-kb-frontend__box ul,
.lss-kb-frontend__article-grid .lss-kb-frontend__box ol {
line-height: 1.42;
margin-block: 0;
}
.lss-kb-frontend__article-grid .lss-kb-frontend__box p + p,
.lss-kb-frontend__article-grid .lss-kb-frontend__box p + ul,
.lss-kb-frontend__article-grid .lss-kb-frontend__box ul + p,
.lss-kb-frontend__article-grid .lss-kb-frontend__box li + li { margin-top: .42em; }
.lss-kb-frontend__article-grid .lss-kb-frontend__box--checklist ul {
list-style: none;
padding-left: 0;
}
.lss-kb-frontend__article-grid .lss-kb-frontend__box--checklist li {
min-height: 1.35em;
padding-left: 1.85em;
position: relative;
}
.lss-kb-frontend__article-grid .lss-kb-frontend__box--checklist li::before {
align-items: center;
background: var(--box-accent);
border-radius: 3px;
color: #fff;
content: "\2713";
display: inline-flex;
font-size: .72em;
font-weight: 800;
height: 1.25em;
justify-content: center;
left: 0;
line-height: 1;
position: absolute;
top: .12em;
width: 1.25em;
}
.lss-kb-frontend__practice-examples .lss-kb-frontend__combined-content + .lss-kb-frontend__combined-content {
margin-top: 1.25em;
}
.lss-kb-frontend__box--goals { --box-accent: #2867c9; --box-bg: #e8f0fd; }
.lss-kb-frontend__box--competency { --box-accent: #ef6c2d; --box-bg: #fce3d7; }
.lss-kb-frontend__box--tips { --box-accent: #1da51a; --box-bg: #ebf8e9; }
.lss-kb-frontend__box--notes { --box-accent: #7434a8; --box-bg: #f0e4f8; }
.lss-kb-frontend__box--mnemonic { --box-accent: #e50909; --box-bg: #fde2e2; }
.lss-kb-frontend__box--sources { --box-accent: #112f4a; --box-bg: #e6eaed; }
.lss-kb-frontend__box--goals h2::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='22' cy='26' r='16'/%3E%3Ccircle cx='22' cy='26' r='9'/%3E%3Ccircle cx='22' cy='26' r='2' fill='white'/%3E%3Cpath d='M22 26 39 9M34 8h7v7M41 8l-7 7'/%3E%3C/svg%3E");
}
.lss-kb-frontend__article-grid .lss-kb-frontend__box--competency h2::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 7h14v6a5 5 0 1 0 6 0V7h14v14h-6a5 5 0 1 0 0 6h6v14H27v-6a5 5 0 1 0-6 0v6H7V27h6a5 5 0 1 0 0-6H7V7Z'/%3E%3C/svg%3E");
content: "";
}
.lss-kb-frontend__box--tips h2::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 30c-3-2.5-5-6-5-10a13 13 0 1 1 26 0c0 4-2 7.5-5 10-2 1.6-2.5 3-2.5 5h-11c0-2-.5-3.4-2.5-5Z'/%3E%3Cpath d='M19 39h10M21 43h6M24 2v4M7 8l3 3M41 8l-3 3M3 21h4M41 21h4'/%3E%3Ccircle cx='24' cy='20' r='3'/%3E%3C/svg%3E");
}
.lss-kb-frontend__box--notes h2::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='20' fill='white'/%3E%3Cpath d='M22 20h5v16h-5zM22 11h5v5h-5z' fill='%237434a8'/%3E%3C/svg%3E");
}
.lss-kb-frontend__box--mnemonic h2::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 12h24v27H9zM15 7h24v27h-6M27 8l10 10M31 8h6v6'/%3E%3Cpath d='m25 22 4-4 5 5-4 4-5-5Zm1 4-7 7'/%3E%3C/svg%3E");
}
.lss-kb-frontend__box--sources h2::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8h14c4 0 7 3 7 7v26c0-4-3-7-7-7H5V8Zm38 0H29c-2 0-3 .5-3 2v31c0-4 3-7 7-7h10V8Z'/%3E%3Cpath d='M10 15h9M10 21h9M33 15h5M33 21h5'/%3E%3C/svg%3E");
}
.lss-kb-frontend__favorites-title {
font-size: clamp(1.65rem, 3vw, 2.15rem);
line-height: 1.15;
margin-bottom: 18px;
}
.lss-kb-frontend__favorite-controls {
border: 1px solid #526875;
border-radius: 10px;
padding: 12px;
}
.lss-kb-frontend__favorite-controls input,
.lss-kb-frontend__favorite-controls select { border-color: #405764; }
.lss-kb-frontend__favorite-card--compact {
align-content: start;
display: grid;
gap: 8px;
grid-template-columns: 1fr;
padding: 16px;
}
.lss-kb-frontend__favorite-card--compact h3 {
font-size: 1.12rem;
line-height: 1.25;
margin: 0;
}
.lss-kb-frontend__display-card { min-height: 150px; }
.lss-kb-frontend__display-card .lss-kb-frontend__favorite-actions { margin-top: auto; }
.lss-kb-frontend__prose > div,
.lss-kb-frontend__prose > div p,
.lss-kb-frontend__prose > div li {
hyphens: auto;
overflow-wrap: break-word;
text-align: justify;
text-align-last: left;
}
.lss-kb-frontend__favorite-path {
color: #536972;
font-size: .8rem;
line-height: 1.3;
margin: 0;
}
.lss-kb-frontend__navigation-article {
align-items: baseline;
display: flex;
font-size: .94rem;
gap: 8px;
padding: 5px 7px !important;
}
.lss-kb-frontend__navigation-article::before {
color: var(--kb-accent);
content: "\2022";
font-size: 1.2em;
font-weight: 700;
line-height: 1;
}
.lss-kb-frontend__navigation li.is-locked > div .lss-kb-frontend__term-link::after {
content: "\1F512";
font-size: .8em;
margin-left: 8px;
}
.lss-kb-frontend__navigation li.is-locked > div .lss-kb-frontend__toggle {
opacity: .7;
}
.lss-kb-frontend__plan-denied {
background: #f4f7fb;
border: 1px solid #b8c8dc;
border-left: 4px solid #1f62c9;
border-radius: 8px;
color: #17242d;
font-size: 1.05rem;
font-weight: 600;
margin: 8px 0;
padding: 18px 20px;
}
.lss-kb-frontend__favorite-actions {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: 4px;
}
.lss-kb-frontend__favorite-actions button {
flex: 0 1 auto;
min-height: 36px;
padding: 6px 13px;
}
.lss-kb-frontend__favorite-remove {
background: #fff !important;
border-color: #9b2c2c !important;
color: #8a2424 !important;
}
.lss-kb-frontend__favorite-remove:hover {
background: #8a2424 !important;
color: #fff !important;
}
.lss-kb-frontend__article-grid--guidance { margin-top: 30px; }
.lss-kb-frontend__article-grid .lss-kb-frontend__box h2 {
font-size: clamp(1.05rem, 1.55vw, 1.35rem);
white-space: nowrap;
}
.lss-kb-frontend__article-grid .lss-kb-frontend__box--goals { --box-accent: #1f62c9; --box-bg: #e8f0fd; }
.lss-kb-frontend__article-grid .lss-kb-frontend__box--competency { --box-accent: #e97132; --box-bg: #fadfd2; }
.lss-kb-frontend__article-grid .lss-kb-frontend__box--tips { --box-accent: #209d17; --box-bg: #effbec; }
.lss-kb-frontend__article-grid .lss-kb-frontend__box--notes { --box-accent: #7030a0; --box-bg: #eee1f7; }
.lss-kb-frontend__article-grid .lss-kb-frontend__box--mnemonic { --box-accent: #e00000; --box-bg: #ffe1e1; }
.lss-kb-frontend__article-grid .lss-kb-frontend__box--sources { --box-accent: #0e2841; --box-bg: #e2e2e2; }
@media (max-width: 760px) {
.lss-kb-frontend__cards { grid-template-columns: 1fr; }
.lss-kb-frontend__search, .lss-kb-frontend__layout { grid-template-columns: 1fr; }
.lss-kb-frontend__skill-label, .lss-kb-frontend__topic-label, .lss-kb-frontend__search > select, .lss-kb-frontend__search > #lss-kb-frontend-skill, .lss-kb-frontend__search > #lss-kb-frontend-topic, .lss-kb-frontend__query-label, .lss-kb-frontend__query-control { grid-column: 1; grid-row: auto; }
.lss-kb-frontend__account { align-items: stretch; flex-direction: column; }
.lss-kb-frontend__account button { flex: 0 0 auto; width: 100%; }
.lss-kb-frontend__account .lss-kb-frontend__account-home { width: 100%; }
.lss-kb-frontend__navigation { border-bottom: 1px solid var(--kb-border); border-right: 0; max-height: 45vh; overflow: auto; padding: 0 0 16px; }
.lss-kb-frontend__article > .lss-kb-frontend__favorite { float: none; margin-top: 8px; }
.lss-kb-frontend__article--structured { font-size: 16px; }
.lss-kb-frontend__article--structured > h1 { font-size: clamp(2rem, 10vw, 2.7rem); }
.lss-kb-frontend__article-grid { grid-template-columns: 1fr; }
.lss-kb-frontend__related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lss-kb-frontend__article-toolbar { align-items: flex-start; }
.lss-kb-frontend__article-actions { width: 100%; }
.lss-kb-frontend__article-actions button { flex: 1 1 auto; }
.lss-kb-frontend__article-grid .lss-kb-frontend__box h2 { white-space: normal; }
} .lss-kb-frontend__term-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lss-kb-frontend__results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lss-kb-frontend__favorite-card--compact.lss-kb-frontend__display-card {
grid-template-columns: 1fr;
min-height: 190px;
padding: 17px 18px 18px 20px;
}
@media (max-width: 760px) {
.lss-kb-frontend__term-grid { grid-template-columns: 1fr; }
.lss-kb-frontend__results { grid-template-columns: 1fr; }
} .lss-kb-lesson-teaser {
align-items: center;
background: linear-gradient(135deg, #f4f8ff 0%, #e9f1fd 100%);
border: 1px solid #aac1e2;
border-left: 5px solid #1f62c9;
border-radius: 12px;
display: grid;
gap: 22px;
grid-template-columns: minmax(0, 1fr) auto;
margin: 26px 0 30px;
padding: 22px 24px;
}
.lss-kb-lesson-teaser h2 { color: #102a43; font-size: clamp(1.35rem, 2vw, 1.7rem); margin: 2px 0 7px; }
.lss-kb-lesson-teaser p { margin: 0; }
.lss-kb-lesson-teaser__eyebrow { color: #1f62c9; font-size: .76rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.lss-kb-lesson-teaser__actions { align-items: flex-end; display: flex; flex-direction: column; gap: 8px; max-width: 360px; }
.lss-kb-lesson-teaser__open,
.lss-kb-lesson-teaser__upgrade {
background: #0b61c9;
border: 1px solid #0b61c9;
border-radius: 7px;
color: #fff !important;
cursor: pointer;
display: inline-flex;
font-weight: 700;
justify-content: center;
padding: 10px 16px;
text-decoration: none !important;
}
.lss-kb-lesson-teaser__open:hover, .lss-kb-lesson-teaser__upgrade:hover { background: #084f9f; }
.lss-kb-lesson-teaser__message { color: #334e68; font-weight: 650; }
.lss-kb-lesson-teaser.is-locked { background: #f7f8fa; border-color: #bdc7d2; border-left-color: #64748b; }
.lss-kb-lesson-teaser.is-preparing { background: #fafbfc; border-color: #c8d1dc; border-left-color: #8291a3; }
.lss-kb-modal-open { overflow: hidden; }
.lss-kb-lesson-modal {
align-items: center;
background: rgba(7, 22, 40, .68);
display: flex;
inset: 0;
justify-content: center;
padding: 24px;
position: fixed;
z-index: 100000;
}
.lss-kb-lesson-modal__dialog {
display: flex;
flex-direction: column;
background: #fff;
border-radius: 14px;
box-shadow: 0 24px 70px rgba(0, 20, 50, .32);
max-height: calc(100vh - 48px);
max-width: 1120px;
overflow: hidden;
width: 100%;
}
.lss-kb-lesson-modal__dialog > header {
align-items: center;
background: #0e4f9f;
color: #fff;
display: flex;
gap: 18px;
justify-content: space-between;
padding: 18px 24px;
}
.lss-kb-lesson-modal__brand { align-items: center; display: flex; gap: 16px; min-width: 0; }
.lss-kb-lesson-modal__brand > div { min-width: 0; overflow-wrap: anywhere; }
.lss-kb-lesson-modal__logo { align-items: center; background: #fff; border-radius: 8px; display: flex; flex: 0 0 auto; min-height: 52px; padding: 7px 10px; }
.lss-kb-lesson-modal__logo img { display: block; height: auto; max-height: 42px; max-width: 185px; width: auto; }
.lss-kb-lesson-modal__dialog > header h2 { color: #fff; font-size: clamp(1.35rem, 2.4vw, 2rem); line-height: 1.18; margin: 2px 0 0; }
.lss-kb-lesson-modal__eyebrow { color: #d9eaff; font-size: .72rem; font-weight: 800; letter-spacing: .12em; margin: 0; }
.lss-kb-lesson-modal__dialog > header .lss-kb-lesson-modal__description { color: #fff; font-size: 1rem; line-height: 1.45; margin: 8px 0 0; overflow-wrap: anywhere; }
.lss-kb-lesson-modal__header-actions { align-items: center; display: flex; flex: 0 0 auto; gap: 10px; }
.lss-kb-lesson-modal__print, .lss-kb-lesson-modal__close {
background: #fff;
border: 1px solid rgba(255,255,255,.8);
border-radius: 7px;
color: #0e4f9f;
cursor: pointer;
font-weight: 750;
min-height: 40px;
padding: 7px 14px;
}
.lss-kb-lesson-modal__close { font-size: 1.7rem; line-height: 1; padding: 4px 12px 7px; }
.lss-kb-lesson-modal__body { flex: 1; min-height: 0; overflow: auto; padding: 24px; }
.lss-kb-lesson-modal__meta { display: grid; gap: 10px; grid-template-columns: repeat(5, minmax(0, 1fr)); margin-bottom: 18px; }
.lss-kb-lesson-modal__meta > div,
.lss-kb-lesson-modal__card {
background: #f7faff;
border: 1px solid #cbd9eb;
border-radius: 9px;
padding: 14px 16px;
}
.lss-kb-lesson-modal__meta span { color: #52697f; display: block; font-size: .72rem; font-weight: 800; letter-spacing: .05em; margin-bottom: 4px; text-transform: uppercase; }
.lss-kb-lesson-modal__meta strong { color: #15293d; display: block; line-height: 1.3; }
.lss-kb-lesson-modal__section { margin-top: 24px; }
.lss-kb-lesson-modal__section > h3, .lss-kb-lesson-modal__card h3 { color: #12395f; font-size: 1.15rem; margin: 0 0 10px; }
.lss-kb-lesson-modal__objective { background: #eaf2fd; border-left: 4px solid #1f62c9; }
.lss-kb-lesson-modal__competencies { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lss-kb-lesson-modal__card p, .lss-kb-lesson-modal__card ul { margin: 0; }
.lss-kb-lesson-modal__card ul { padding-left: 20px; }
.lss-kb-lesson-modal__table-wrap { border: 1px solid #bdcce0; border-radius: 9px; overflow-x: auto; }
.lss-kb-lesson-modal table { border-collapse: collapse; min-width: 820px; width: 100%; }
.lss-kb-lesson-modal th { background: #135cae; color: #fff; font-size: .82rem; padding: 11px 12px; text-align: left; }
.lss-kb-lesson-modal td { border-top: 1px solid #d6e0ec; line-height: 1.4; padding: 11px 12px; vertical-align: top; }
.lss-kb-lesson-modal tbody tr:nth-child(even) { background: #f7faff; }
.lss-kb-lesson-modal td:first-child, .lss-kb-lesson-modal td:nth-child(2) { font-weight: 700; white-space: nowrap; }
.lss-kb-lesson-modal__bottom { display: grid; gap: 12px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 24px; }
.lss-kb-lesson-modal__curriculum { background: #edf7ee; border-left: 4px solid #209d17; color: #254d27; margin: 20px 0 0; padding: 12px 14px; }
.lss-kb-lesson-modal__footer { color: #607080; font-size: .78rem; margin-top: 20px; text-align: center; }
@media (max-width: 760px) {
.lss-kb-lesson-teaser { align-items: stretch; grid-template-columns: 1fr; padding: 18px; }
.lss-kb-lesson-teaser__actions { align-items: stretch; max-width: none; }
.lss-kb-lesson-modal { align-items: stretch; padding: 0; }
.lss-kb-lesson-modal__dialog { border-radius: 0; height: 100vh; max-height: 100vh; max-width: none; }
.lss-kb-lesson-modal__dialog > header { align-items: flex-start; flex-wrap: wrap; padding: 14px 16px; }
.lss-kb-lesson-modal__brand { align-items: flex-start; flex-basis: 100%; flex-direction: column; gap: 9px; }
.lss-kb-lesson-modal__logo { min-height: 42px; padding: 5px 8px; }
.lss-kb-lesson-modal__logo img { max-height: 32px; max-width: 150px; }
.lss-kb-lesson-modal__header-actions { gap: 6px; margin-left: auto; }
.lss-kb-lesson-modal__print { padding-inline: 10px; }
.lss-kb-lesson-modal__body { padding: 16px; }
.lss-kb-lesson-modal__meta, .lss-kb-lesson-modal__competencies, .lss-kb-lesson-modal__bottom { grid-template-columns: 1fr; }
}
@media print {
@page { size: A4 portrait; margin: 14mm; }
body.lss-kb-print-lesson > *:not(.lss-kb-lesson-modal) { display: none !important; }
body.lss-kb-print-lesson { background: #fff !important; overflow: visible !important; }
body.lss-kb-print-lesson .lss-kb-lesson-modal { background: #fff; display: block; inset: auto; padding: 0; position: static; }
body.lss-kb-print-lesson .lss-kb-lesson-modal__dialog { display: block; border-radius: 0; box-shadow: none; max-height: none; max-width: none; overflow: visible; width: 100%; }
body.lss-kb-print-lesson .lss-kb-lesson-modal__dialog > header { background: #0e4f9f !important; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
body.lss-kb-print-lesson .lss-kb-lesson-modal__logo { min-height: 11mm; padding: 1.5mm 2.5mm; }
body.lss-kb-print-lesson .lss-kb-lesson-modal__logo img { max-height: 9mm; max-width: 45mm; }
body.lss-kb-print-lesson .lss-kb-lesson-modal__header-actions { display: none !important; }
body.lss-kb-print-lesson .lss-kb-lesson-modal__body { max-height: none; overflow: visible; padding: 18px 0 0; }
body.lss-kb-print-lesson .lss-kb-lesson-modal__meta { grid-template-columns: repeat(3, 1fr); }
body.lss-kb-print-lesson .lss-kb-lesson-modal__competencies { grid-template-columns: repeat(2, 1fr); }
body.lss-kb-print-lesson .lss-kb-lesson-modal__bottom { grid-template-columns: repeat(2, 1fr); }
body.lss-kb-print-lesson .lss-kb-lesson-modal__table-wrap { overflow: visible; }
body.lss-kb-print-lesson .lss-kb-lesson-modal table { font-size: 8.5pt; min-width: 0; table-layout: fixed; width: 100%; }
body.lss-kb-print-lesson .lss-kb-lesson-modal th,
body.lss-kb-print-lesson .lss-kb-lesson-modal td { hyphens: auto; overflow-wrap: anywhere; padding: 7px 8px; white-space: normal; }
body.lss-kb-print-lesson .lss-kb-lesson-modal th:nth-child(1) { width: 9%; }
body.lss-kb-print-lesson .lss-kb-lesson-modal th:nth-child(2) { width: 13%; }
body.lss-kb-print-lesson .lss-kb-lesson-modal th:nth-child(3) { width: 34%; }
body.lss-kb-print-lesson .lss-kb-lesson-modal th:nth-child(4) { width: 18%; }
body.lss-kb-print-lesson .lss-kb-lesson-modal th:nth-child(5) { width: 26%; }
body.lss-kb-print-lesson .lss-kb-lesson-modal__card,
body.lss-kb-print-lesson .lss-kb-lesson-modal__meta > div,
body.lss-kb-print-lesson tr { break-inside: avoid; page-break-inside: avoid; }
body.lss-kb-print-lesson .lss-kb-lesson-modal th { background: #135cae !important; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}
.lss-kb-frontend__loading-skeleton{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:8px 0 20px}.lss-kb-frontend__loading-skeleton span{display:block;min-height:132px;border:1px solid #d8e2ee;border-radius:12px;background:linear-gradient(100deg,#f4f7fb 20%,#e7eef7 40%,#f4f7fb 60%);background-size:200% 100%;animation:lss-kb-loading 1.15s ease-in-out infinite}@keyframes lss-kb-loading{0%{background-position:100% 0}100%{background-position:-100% 0}}@media(max-width:782px){.lss-kb-frontend__loading-skeleton{grid-template-columns:1fr}.lss-kb-frontend__loading-skeleton span:nth-child(n+2){display:none}}@media(prefers-reduced-motion:reduce){.lss-kb-frontend__loading-skeleton span{animation:none}}