.blocklyToolboxCategory{position:relative;border-radius:8px!important;transition:background-color .12s ease}
.blocklyToolboxCategory .categoryBubble{width:24px!important;height:24px!important;border:0!important;border-radius:0!important;background:transparent!important;color:var(--category-color);margin:1px auto 3px!important}
.categoryBubble svg{display:block;width:100%;height:100%}
.blocklyToolboxCategory.blocklyToolboxSelected{box-shadow:inset 4px 0 0 var(--category-color);background:#e8eef5!important}
.blocklyToolboxCategory.blocklyToolboxSelected .blocklyToolboxCategoryLabel{font-weight:750!important;color:#233d57!important}
html[data-theme="dark"] .blocklyToolboxCategory.blocklyToolboxSelected{background:#30435c!important}
html[data-theme="dark"] .blocklyToolboxCategory.blocklyToolboxSelected .blocklyToolboxCategoryLabel{color:#f0f5ff!important}
html[data-theme="dark"] .categoryBubble svg{filter:brightness(1.6)}
#operation-notice{display:flex;align-items:center;gap:12px;flex-shrink:0;padding:12px 18px;background:#fff4f1;color:#7d3227;border-top:1px solid #ecc4bd;border-left:4px solid #c1503e}
#operation-notice[hidden]{display:none}
.operation-copy{flex:1;min-width:0;overflow-wrap:anywhere}
.operation-copy strong{font-size:13px;line-height:1.5}
.operation-copy p{margin:4px 0 0;font-size:12px;line-height:1.6}
footer[data-operation-state="error"]>.dot{background:#ca453d}
footer[data-operation-state="working"]>.dot{background:#b58b24}
footer[data-operation-state="success"]>.dot{background:#289665}
html[data-theme="dark"] #operation-notice{background:#3c292c;color:#f5c6bc;border-color:#935f56}
@media(max-width:740px){#operation-notice{flex-wrap:wrap;padding:8px 12px}.operation-copy{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){.blocklyToolboxCategory{transition:none}}

/* Use the block colour as the category's visible identity in both themes. */
html .blocklyToolboxCategory,
html[data-theme="dark"] .blocklyToolboxCategory,
html .blocklyToolboxCategory.blocklyToolboxSelected,
html[data-theme="dark"] .blocklyToolboxCategory.blocklyToolboxSelected{background:var(--category-color)!important;border-radius:7px;margin:3px 4px;box-shadow:none;color:#fff!important}
html .blocklyToolboxCategory .categoryBubble,
html .blocklyToolboxCategory .blocklyToolboxCategoryLabel,
html[data-theme="dark"] .blocklyToolboxCategory .blocklyToolboxCategoryLabel{color:#fff!important}
html .blocklyToolboxCategory.blocklyToolboxSelected,
html[data-theme="dark"] .blocklyToolboxCategory.blocklyToolboxSelected{box-shadow:inset 4px 0 0 #fff,inset 0 0 0 2px #fff;outline:2px solid #24364b;outline-offset:0}
html[data-theme="dark"] .blocklyToolboxCategory.blocklyToolboxSelected{outline-color:#b9d5ff}

html body .blocklyToolboxCategory.blocklyToolboxSelected .blocklyToolboxCategoryLabel,
html[data-theme="dark"] body .blocklyToolboxCategory.blocklyToolboxSelected .blocklyToolboxCategoryLabel{color:#fff!important}
html[data-theme="dark"] .blocklyFlyoutLabelText{fill:#eaf2ff!important}

/* Compact category rows: icon followed by a single-line label. */
html body .blocklyToolboxCategory{height:36px!important;min-height:36px!important;padding:0 10px!important;display:flex;align-items:center}
html body .blocklyToolboxCategory .blocklyTreeRowContentContainer{display:flex;flex-direction:row!important;align-items:center;gap:8px;width:100%}
html body .blocklyToolboxCategory .categoryBubble{width:20px!important;height:20px!important;flex:0 0 20px;margin:0!important}
html body .blocklyToolboxCategory .blocklyToolboxCategoryLabel{margin:0!important;text-align:left!important;white-space:nowrap;font-size:12px!important;line-height:1.2}
@media(pointer:coarse){html body .blocklyToolboxCategory{height:42px!important;min-height:42px!important}}