/* Sekcja „Bibliografia i wytyczne” na stronie głównej (MCQP_Bibliography::home_block, 0.49.39). Kolory z motywu (--mcq-*). */
.bbh { --bh-card: var(--mcq-card, #2c2f34); --bh-bg: var(--mcq-bg, #202329); --bh-line: var(--mcq-border, #45505e); --bh-strong: var(--mcq-strong, #fff); --bh-soft: var(--mcq-soft, #b6b6c3); --bh-muted: var(--mcq-muted, #68788b); --bh-amber: var(--mcq-primary, #f0a500); --bh-on-amber: var(--mcq-on-primary, #1b1608); }
.bbh-wrap { position: relative; display: grid; grid-template-columns: minmax(240px, .75fr) minmax(0, 2fr); gap: 28px; align-items: start; padding: 34px; border: 1px solid var(--bh-line); border-radius: 26px; background: radial-gradient(70% 90% at 0% 0%, rgba(79, 184, 255, .12), transparent 60%), radial-gradient(60% 80% at 100% 100%, rgba(240, 165, 0, .10), transparent 60%), var(--bh-card); overflow: hidden; }
.bbh-wrap::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px); background-size: 20px 20px; pointer-events: none; }
.bbh-head, .bbh-rows { position: relative; z-index: 1; min-width: 0; }
.bbh-ico { display: grid; place-items: center; width: 68px; height: 68px; margin-bottom: 16px; border-radius: 20px; background: var(--bh-amber); color: var(--bh-on-amber); box-shadow: 0 14px 34px -12px rgba(240, 165, 0, .6); }
.bbh-ico svg { width: 42px; height: 42px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; overflow: visible; }
.bbh .bbh-tilt { transform-box: fill-box; transform-origin: 50% 100%; animation: bbh-tilt 3.2s ease-in-out infinite; }
.bbh .bbh-line { stroke-dasharray: 10; animation: bbh-line 3.2s ease-in-out infinite; }
@keyframes bbh-tilt { 0%, 100% { transform: rotate(0); } 40%, 60% { transform: rotate(-9deg); } }
@keyframes bbh-line { 0%, 30% { stroke-dashoffset: 10; } 60%, 100% { stroke-dashoffset: 0; } }
.bbh .bbh-head h2 { margin: 0 0 8px; color: var(--bh-strong); font-size: 1.6rem; text-align: left; }
.bbh-head p { margin: 0 0 18px; color: var(--bh-soft); line-height: 1.6; }
.bbh-all { display: inline-flex; gap: 6px; align-items: center; }
.bbh-rows { display: grid; gap: 18px; }
.bbh-row h3 { margin: 0 0 10px; color: var(--bh-muted); font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.bbh-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.bbh-cards li { display: flex; opacity: 0; animation: bbh-in .5s cubic-bezier(.2, .8, .3, 1) both; animation-delay: calc(var(--i) * 70ms + .1s); }
@keyframes bbh-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.bbh-cards a { position: relative; display: grid; align-content: start; gap: 6px; width: 100%; box-sizing: border-box; padding: 14px; border: 1px solid var(--bh-line); border-radius: 16px; background: var(--bh-bg); color: var(--bh-soft); text-decoration: none; overflow: hidden; transition: transform .25s cubic-bezier(.2, .8, .3, 1), border-color .25s ease; }
.bbh-cards a::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--bb-c, var(--bh-amber)); transform: scaleY(.3); transform-origin: 50% 0; transition: transform .3s ease; }
.bbh-cards a:hover { transform: translateY(-3px); border-color: var(--bb-c, var(--bh-amber)); }
.bbh-cards a:hover::before, .bbh-cards .is-mine a::before { transform: scaleY(1); }
.bbh-cards .is-mine a { border-color: var(--bb-c, var(--bh-amber)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--bb-c, #f0a500) 25%, transparent); }
.bbh-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.bbh-top strong { color: var(--bh-strong); font-size: 1.05rem; }
.bbh-top strong.is-long { font-size: .86rem; }
.bbh-top em { padding: 2px 7px; border-radius: 999px; background: var(--bb-c, var(--bh-amber)); color: #141a2b; font-size: .66rem; font-style: normal; font-weight: 800; }
.bbh .mcq-flag.bbh-flag { display: inline-block; width: 20px; height: 14px; border-radius: 3px; overflow: hidden; box-shadow: 0 0 0 1px rgba(255, 255, 255, .18); flex: none; }
.bbh .mcq-flag.bbh-flag svg { display: block; width: 100%; height: 100%; }
.bbh-body { font-size: .76rem; line-height: 1.35; color: var(--bh-muted); }
.bbh-st { display: inline-flex; align-items: center; gap: 6px; font-size: .7rem; font-weight: 700; color: var(--bh-soft); }
.bbh-st i { position: relative; width: 7px; height: 7px; border-radius: 50%; background: var(--bh-muted); }
.bbh-st--progress { color: var(--bh-amber); }
.bbh-st--progress i { background: var(--bh-amber); }
.bbh-st--progress i::after { content: ""; position: absolute; inset: -3px; border-radius: 50%; border: 2px solid var(--bh-amber); animation: bbh-ping 1.8s ease-out infinite; }
.bbh-st--done { color: #63e39f; }
.bbh-st--done i { background: #63e39f; }
@keyframes bbh-ping { from { opacity: .9; transform: scale(.6); } to { opacity: 0; transform: scale(1.7); } }
@media (max-width: 960px) {
	.bbh-wrap { grid-template-columns: 1fr; padding: 26px 20px; }
}
@media (max-width: 560px) {
	.bbh-cards { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; scrollbar-width: none; }
	.bbh-cards::-webkit-scrollbar { display: none; }
	.bbh-cards li { flex: 0 0 150px; scroll-snap-align: start; }
}
@media (prefers-reduced-motion: reduce) {
	.bbh *, .bbh-cards li { animation: none !important; opacity: 1; }
}
