.bn{border:1px solid rgb(var(--sun-rgb) / .3);background-color:var(--bg-2);background-image:linear-gradient(rgb(var(--ink-rgb) / .055) 1px, transparent 1px), linear-gradient(90deg, rgb(var(--ink-rgb) / .055) 1px, transparent 1px);background-size:46px 46px,46px 46px;border-radius:18px;flex-direction:column;gap:clamp(22px,3vw,38px);max-width:1000px;margin:clamp(26px,3.2vw,44px) auto 0;padding:clamp(22px,3.4vw,46px);display:flex;box-shadow:0 40px 80px -50px #000000b3}.bn__pair{grid-template-columns:1fr;align-items:center;gap:18px;display:grid}@media (min-width:760px){.bn__pair{grid-template-columns:1fr auto 1fr;gap:clamp(18px,3vw,44px)}}.bn__note{transform:rotate(var(--tilt,0deg));letter-spacing:-.005em;color:var(--note-ink);text-align:center;box-shadow:0 1px 1px rgb(var(--ink-rgb) / .07), 0 16px 30px -18px rgb(var(--ink-rgb) / .55);border-radius:3px;flex-direction:column;gap:2px;margin:0;padding:clamp(16px,1.9vw,24px);font-size:clamp(.95rem,1.15vw,1.1rem);font-weight:500;line-height:1.34;display:flex;position:relative}.bn__note:after{content:"";pointer-events:none;background:linear-gradient(160deg,#ffffff80,#fff0 42%);border-radius:3px;position:absolute;inset:0}.bn__note--a{background:var(--note-a)}.bn__note--b{background:var(--note-b)}.bn__and{background:linear-gradient(180deg, transparent, rgb(var(--ink-rgb) / .28), transparent);justify-self:center;width:1px;height:34px}@media (min-width:760px){.bn__and{background:linear-gradient(90deg, transparent, rgb(var(--ink-rgb) / .28), transparent);width:clamp(18px,3vw,44px);height:1px}}
