/* Direct item navigation, organized around one persistent library browser. */
.component-detail-actions{display:flex;align-items:center;align-self:flex-start;gap:10px;flex-wrap:wrap;flex-shrink:0;margin-top:6px}
.detail-heading .component-detail-actions .badge{align-self:center;margin-top:0}
.component-favorite{flex-shrink:0}
.component-favorite[aria-pressed=true]{color:var(--klic-semantic-color-accent);background:var(--klic-ui-selected)}
.component-favorite[aria-pressed=true] svg{fill:var(--klic-ui-selected)}
.library-favorites-view{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:3px;margin:0 1px 8px;border-radius:8px;background:var(--klic-ui-soft)}
.library-favorites-view[hidden]{display:none}
.library-favorites-view button{display:flex;align-items:center;justify-content:center;gap:5px;min-width:0;padding:6px 3px;min-height:30px;border-radius:6px;color:var(--klic-semantic-color-muted);font:500 12px var(--klic-ui-font)}
.library-favorites-view button[aria-pressed=true]{background:var(--klic-semantic-color-panel);color:var(--klic-semantic-color-text);box-shadow:0 1px 3px #12243b0d}
.library-favorites-view svg{width:13px;height:13px}.library-favorites-view [data-library-favorites-count]{font:10px var(--klic-ui-mono)}
.library-item-row{display:flex;align-items:center;min-width:0;gap:2px}.library-item-row>.library-item{flex:1;min-width:0}.library-item-row>.library-favorite{display:grid;place-items:center;flex:0 0 24px;width:24px;min-height:26px;border-radius:5px;color:var(--klic-semantic-color-muted);opacity:0;transition:opacity .12s,background .12s}
.library-item-row:hover>.library-favorite,.library-item-row:focus-within>.library-favorite,.library-favorite[aria-pressed=true]{opacity:1}
.library-favorite:hover{background:var(--klic-ui-soft)}.library-favorite svg{width:14px;height:14px}.library-favorite[aria-pressed=true]{color:var(--klic-semantic-color-accent)}.library-favorite[aria-pressed=true] svg{fill:var(--klic-ui-selected)}
.library-hover-preview{position:fixed;inset:auto;margin:0;width:340px;max-width:calc(100vw - 24px);padding:8px;border:1px solid var(--klic-semantic-color-border);border-radius:10px;background:var(--klic-semantic-color-panel);color:var(--klic-semantic-color-text);box-shadow:0 6px 24px #132c461c;z-index:1600;overflow:hidden}
.library-hover-preview[hidden]{display:none!important}
.library-hover-image{position:relative;aspect-ratio:3/2;overflow:hidden;border:1px solid var(--klic-semantic-color-border);border-radius:5px;background:var(--klic-ui-soft)}
.library-hover-image iframe{display:block;width:1200px;height:800px;max-width:none;border:0;transform:scale(var(--library-hover-scale,.268));transform-origin:top left;pointer-events:none}
.library-hover-caption{padding:12px 4px 5px}.library-hover-caption p{margin:0 0 5px;font:11px/1.5 var(--klic-ui-font);color:var(--klic-semantic-color-muted)}.library-hover-caption strong{display:block;font:600 13px/1.5 var(--klic-ui-font)}
@media(hover:none){.library-item-row>.library-favorite{opacity:1}}
@media(prefers-reduced-motion:reduce){.library-item-row>.library-favorite{transition:none}}
:root:not([data-compact=true]){--klic-ui-sidebar:256px}
.sidebar{display:flex;flex-direction:column;overflow:hidden;padding:0 12px;background:var(--klic-semantic-color-surface-soft,var(--klic-ui-soft,#f5f7fb));height:calc(100dvh / var(--klic-ui-scale,1))}
.sidebar .brand{flex-shrink:0;min-height:58px;height:auto;margin:0;padding:12px 10px 8px}.sidebar .brand strong{font-size:25px}.sidebar .brand-symbol{width:26px;height:26px}.sidebar .brand-caption{font-size:8px!important;letter-spacing:1px;padding-left:12px}.sidebar .version-select{flex-shrink:0;min-height:30px;height:auto;margin:0 2px 10px;padding:6px 9px;font-size:11px;border-radius:8px}.sidebar-content{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.library-browser{display:flex;flex-direction:column;flex:1;min-height:150px}.library-tabs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3px;padding:3px;background:var(--klic-ui-soft,#f3f5f8);border:1px solid var(--klic-semantic-color-border,#dce3ee);border-radius:9px;flex-shrink:0;margin:0 1px 9px}.library-tabs button{display:block;width:100%;min-width:0;min-height:32px;padding:6px 4px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--klic-semantic-color-muted,#667387);font:500 calc(12.5px * var(--klic-text-scale,1))/1.4 var(--klic-ui-font,inherit);cursor:pointer;white-space:normal}.library-tabs button[aria-selected=true]{background:var(--klic-semantic-color-panel,#fff);color:var(--klic-semantic-color-text,#172b49);border-color:var(--klic-semantic-color-border,#dce3ee);box-shadow:0 1px 3px #12243b0d}.library-tabs button:focus-visible,.library-browser :is(a,summary,button,input,select):focus-visible{outline:2px solid var(--klic-semantic-color-accent,#245fc2);outline-offset:2px}.library-navigation{display:flex;flex-direction:column;flex:1;min-height:0}.library-controls{flex-shrink:0}.library-scope{display:flex;align-items:center;position:relative;width:100%;min-width:0;min-height:33px;border:1px solid var(--klic-semantic-color-border,#dce3ee);border-radius:8px;background:var(--klic-semantic-color-panel,#fff);margin:0 0 7px}.library-scope>svg{position:absolute;left:11px;width:15px;height:15px;color:var(--klic-semantic-color-muted,#667387);pointer-events:none}.library-scope>svg:last-child{left:auto;right:10px;width:13px;height:13px}.library-scope select{appearance:none;-webkit-appearance:none;border:0;background:transparent;color:var(--klic-semantic-color-text,#172b49);border-radius:8px;font:500 calc(12.5px * var(--klic-text-scale,1))/1.4 var(--klic-ui-font,inherit);min-height:33px;width:100%;min-width:0;max-width:100%;padding:6px 29px 6px 33px;cursor:pointer}.library-scope select option{color:var(--klic-semantic-color-text,#172b49);background:var(--klic-semantic-color-panel,#fff)}.library-search{display:flex;align-items:center;gap:7px;min-width:0;border:1px solid transparent;border-radius:7px;background:var(--klic-ui-soft,#f3f5f8);padding:6px 9px;min-height:31px;margin:0 1px}.library-search:focus-within{background:var(--klic-semantic-color-panel,#fff);border-color:var(--klic-semantic-color-accent,#245fc2)}.library-search svg{width:14px;height:14px;flex-shrink:0;color:var(--klic-semantic-color-muted,#667387)}.library-search input{font:calc(12px * var(--klic-text-scale,1))/1.5 var(--klic-ui-font,inherit);padding:0;border:0;outline:0!important;background:transparent;width:100%;min-width:0;color:var(--klic-semantic-color-text,#172b49)}.library-search input::placeholder{color:var(--klic-semantic-color-muted,#667387)}.library-search kbd{font:11px var(--klic-ui-mono,monospace);color:var(--klic-semantic-color-muted,#667387)}.library-category-heading{display:flex;align-items:center;gap:7px;min-height:35px;padding:6px 7px 4px;font-size:calc(12px * var(--klic-text-scale,1));color:var(--klic-semantic-color-muted,#667387)}.library-category-heading>span:first-child{margin-right:auto}.library-category-heading #library-search-count{font-size:calc(11px * var(--klic-text-scale,1));color:var(--klic-semantic-color-accent,#245fc2)}.library-fold{display:grid;place-items:center;border:0;background:transparent;color:var(--klic-semantic-color-muted,#667387);width:25px;height:25px;border-radius:5px;cursor:pointer}.library-fold:hover{background:var(--klic-ui-soft,#f3f5f8)}.library-fold:disabled{opacity:.35;cursor:default}.library-fold svg{width:15px;height:15px}
.library-tree-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:none;-ms-overflow-style:none;padding:0 1px 8px 0;scroll-padding-block:12px}.library-tree-scroll::-webkit-scrollbar{display:none;width:0;height:0}.library-group{margin:0 0 2px;border:0}.library-group>summary{display:flex;align-items:center;gap:7px;list-style:none;cursor:pointer;min-height:32px;border-radius:6px;padding:6px 7px;color:var(--klic-semantic-color-text,#172b49);font:500 calc(12.5px * var(--klic-text-scale,1))/1.4 var(--klic-ui-font,inherit)}.library-group>summary::-webkit-details-marker{display:none}.library-group>summary:before{content:'+';width:13px;flex-shrink:0;font:400 16px/1.25 var(--klic-ui-mono,monospace);text-align:center;color:var(--klic-semantic-color-muted,#667387)}.library-group[open]>summary{background:var(--klic-ui-soft,#f3f5f8)}.library-group[open]>summary:before{content:'−'}.library-group-name{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.library-group-count{flex-shrink:0;font:400 calc(11px * var(--klic-text-scale,1))/1.8 var(--klic-ui-mono,monospace);color:var(--klic-semantic-color-muted,#667387);padding-left:4px}.library-items{position:relative;border-left:0;margin:2px 0 6px 18px;padding:0 0 0 6px}.library-item{display:flex;align-items:center;min-height:31px;width:100%;min-width:0;padding:5px 8px;margin:1px 0;border:1px solid transparent;border-radius:6px;color:var(--klic-semantic-color-muted,#667387);font-size:calc(12.5px * var(--klic-text-scale,1));line-height:1.4;text-decoration:none;transition:background .12s,color .12s}.library-item:hover{background:var(--klic-ui-soft,#f3f5f8);color:var(--klic-semantic-color-text,#172b49)}.library-item-name{display:block;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%}.library-item.selected{background:var(--klic-ui-selected,#eaf0ff);color:var(--klic-semantic-color-accent,#245fc2);border-color:color-mix(in srgb,var(--klic-semantic-color-accent,#245fc2) 10%,transparent);font-weight:600}.library-tree-footer{border-top:1px solid var(--klic-semantic-color-border,#dce3ee);margin:7px 7px 0;padding-top:5px}.library-overview{display:flex;align-items:center;gap:8px;color:var(--klic-semantic-color-muted,#667387);font-size:calc(11px * var(--klic-text-scale,1));min-height:28px;padding:5px 2px}.library-overview svg{width:13px;height:13px}.library-overview>span{margin-left:auto;font-family:var(--klic-ui-mono)}.library-overview:hover{color:var(--klic-semantic-color-accent,#245fc2)}.library-empty,.library-loading{padding:15px 10px;font-size:calc(12px * var(--klic-text-scale,1));color:var(--klic-semantic-color-muted,#667387);line-height:1.7}.library-empty button{display:inline-block;margin-top:9px;background:transparent;border:0;color:var(--klic-semantic-color-accent,#245fc2);font:inherit;text-decoration:underline;cursor:pointer}
.sidebar-utilities{flex-shrink:0;border-top:1px solid var(--klic-semantic-color-border,#dce3ee);padding:8px 2px 3px;margin-top:7px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2px 4px}.sidebar-utilities .nav-item{min-height:35px;padding:7px 8px;gap:7px;margin:0;font-size:calc(11px * var(--klic-text-scale,1));line-height:1.5}.sidebar-utilities .nav-item svg{width:14px;height:14px;flex-shrink:0}.sidebar-utilities .nav-count{font-size:9px;margin-left:auto}.sidebar-resources{flex-shrink:0;margin:1px 2px 0;border-top:1px solid var(--klic-semantic-color-border,#dce3ee);padding:2px 0}.sidebar-resources>summary{font-size:calc(11px * var(--klic-text-scale,1));color:var(--klic-semantic-color-muted,#667387);padding:9px 8px;cursor:pointer}.sidebar-resources .nav-item{font-size:calc(11px * var(--klic-text-scale,1));min-height:31px;padding:6px 8px;margin:0;gap:8px}.sidebar-resources .nav-item svg{width:13px;height:13px}.sidebar .sidebar-footer{flex-shrink:0;min-height:30px;padding:6px 10px;margin:0;font-size:8px;letter-spacing:.06em;border:0}.sidebar-footer a{margin-left:auto;color:var(--klic-semantic-color-muted,#667387);font-size:9px;letter-spacing:0}.sidebar-content #font-nav:not([hidden]){min-height:0;flex:1;overflow:auto;padding:0 4px}.library-browser[data-auxiliary=true]{flex:0 0 auto;min-height:0}.library-browser[data-auxiliary=true] .library-navigation{display:none}.sidebar .nav-item,.library-item{border-radius:var(--klic-custom-radius,6px)}
:root[data-menu=solid] .library-item.selected{background:var(--klic-semantic-color-accent,#245fc2);color:var(--klic-semantic-color-on-accent,#fff)}:root[data-menu=outline] .library-item.selected{background:transparent;border-color:var(--klic-semantic-color-accent,#245fc2)}
:root[data-custom-density=compact] .library-item{padding-block:5px;min-height:30px}:root[data-custom-density=compact] .library-group>summary{padding-block:6px;min-height:32px}:root[data-custom-density=relaxed] .library-item{padding-block:10px;min-height:42px}
:root[data-compact=true] .sidebar{width:min(330px,calc(100vw / var(--klic-ui-scale,1) - 26px));max-width:100%;height:calc(100dvh / var(--klic-ui-scale,1));padding:0 12px}
:root[data-compact=true] .sidebar .brand{padding-top:17px}
@media(max-height:650px){.sidebar .version-select{display:none}.sidebar .brand{min-height:52px;padding-block:10px}.library-browser{min-height:100px}.sidebar .sidebar-footer{display:none}.sidebar-utilities .nav-item{padding-block:5px;min-height:29px}.library-tabs{margin-bottom:8px}}
@media(prefers-reduced-motion:reduce){.library-item{transition:none}}
@media(forced-colors:active){.library-item.selected{border:1px solid Highlight}.library-tabs button[aria-selected=true]{border:1px solid Highlight}}
/* CSS zoom reduces the logical height. Reserve usable room for the item list. */
.sidebar{container-type:size}
@container (max-height:700px){
 .sidebar .version-select{display:none}
 .sidebar .brand{min-height:49px;padding-block:10px}
 .sidebar-utilities{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding-block:6px}
 .sidebar .sidebar-utilities .nav-item{justify-content:center;padding:8px;min-height:34px}
 .sidebar-utilities .utility-label{display:none}
 .sidebar-utilities .nav-item svg{width:16px;height:16px}
 .sidebar .sidebar-footer{display:none}
 .library-browser{min-height:0}
}
@container (max-height:420px){
 .sidebar-content{display:block;overflow-y:auto}
 .library-browser{height:380px;min-height:380px}
}