kbd[data-ui] {
  display: inline; box-sizing: border-box;
  font: inherit; font-size: .84em; font-weight: 600; line-height: 1.3; letter-spacing: -0.005em;
  padding: .3em .72em; margin: 0 .06em;
  border: 1px solid transparent; border-radius: 8px;
  white-space: nowrap; cursor: default;
  -webkit-user-select: text; user-select: text;
}
kbd[data-ui][data-icon]::before {
  content: ""; display: inline-block; width: 1.12em; height: 1.12em; margin: 0 .42em 0 -.08em; vertical-align: -.2em;
  background-color: currentColor;
  -webkit-mask: var(--hc-ui-ic) center / contain no-repeat;
  mask: var(--hc-ui-ic) center / contain no-repeat;
}
kbd[data-ui="web"] { background: #fff; border-color: rgba(167, 108, 78, .24); color: #2a1f17; box-shadow: 0 1px 2px rgba(90, 55, 30, .06) }
kbd[data-ui="web-primary"] { background: linear-gradient(180deg, #BF825C, #A76C4E); color: #FEF7E3; box-shadow: 0 1px 0 rgba(255, 255, 255, .25) inset, 0 4px 12px -5px rgba(120, 70, 40, .5) }
kbd[data-ui="web-danger"] { background: rgba(239, 68, 68, .08); border-color: rgba(239, 68, 68, .4); color: #dc2626 }
kbd[data-ui="web-menu"] { background: rgba(255, 255, 255, .8); border-color: rgba(167, 108, 78, .14); color: #2a1f17; font-weight: 500; border-radius: 10px; box-shadow: 0 1px 0 #fff inset, 0 8px 18px -12px rgba(90, 55, 30, .4) }
kbd[data-ui="web-menu"][data-icon]::before { background-color: #5a473a }
kbd[data-ui="app"] { background: rgba(191, 130, 92, .1); border-color: rgba(191, 130, 92, .32); color: #A76C4E; border-radius: 10px }
kbd[data-ui="app-primary"] { background: #BF825C; color: #000; font-weight: 700; border-radius: 10px }
kbd[data-ui="app-tile"] { background: #fff; border-color: rgba(167, 108, 78, .16); color: #2a1f17; border-radius: 12px; box-shadow: 0 6px 16px -10px rgba(90, 55, 30, .35) }
kbd[data-ui="app-tile"][data-icon]::before { background-color: #BF825C }
kbd[data-ui="app-dark"] { background: linear-gradient(rgba(220, 175, 134, .12), rgba(220, 175, 134, .12)), #000; border-color: rgba(220, 175, 134, .35); color: #DCAF86; border-radius: 10px }
kbd[data-ui="app-dark-primary"] { background: #DCAF86; color: #000; font-weight: 700; border-radius: 10px }
kbd[data-ui="app-dark-danger"] { background: #2c2c2e; color: #ff453a; font-weight: 500; border-radius: 10px }
kbd[data-ui="app-round"] { display: inline-block; font-size: 0; width: 28px; height: 28px; padding: 0; margin: 0 2px; border-radius: 50%; background: #161616; color: rgba(255, 255, 255, .62); vertical-align: middle; position: relative; top: -1px }
kbd[data-ui="app-round"][data-icon]::before { width: 14px; height: 14px; margin: 6px; vertical-align: top }
kbd[data-icon="plus"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") }
kbd[data-icon="check"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") }
kbd[data-icon="copy"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='12' height='12' rx='2'/%3E%3Cpath d='M5 15h-.5A1.5 1.5 0 0 1 3 13.5v-9A1.5 1.5 0 0 1 4.5 3h9A1.5 1.5 0 0 1 15 4.5V5'/%3E%3C/svg%3E") }
kbd[data-icon="logout"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4H6.5A2.5 2.5 0 0 0 4 6.5v11A2.5 2.5 0 0 0 6.5 20H14'/%3E%3Cpath d='M10 12h11M17.5 8.5L21 12l-3.5 3.5'/%3E%3C/svg%3E") }
kbd[data-icon="rotate"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8'/%3E%3Cpath d='M21 3v5h-5'/%3E%3C/svg%3E") }
kbd[data-icon="qr"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8V5a2 2 0 0 1 2-2h3M16 3h3a2 2 0 0 1 2 2v3M21 16v3a2 2 0 0 1-2 2h-3M8 21H5a2 2 0 0 1-2-2v-3'/%3E%3Cpath stroke-width='1.8' d='M8 8h3v3H8zM13 8h3v3h-3zM8 13h3v3H8zM13 13h1.5M16 13v1.5M13 16h3'/%3E%3C/svg%3E") }
kbd[data-icon="freigabe"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Cpath d='M9 12a3 3 0 0 1 3-3M15 12a3 3 0 0 1-3 3'/%3E%3Ccircle cx='12' cy='12' r='1.2' fill='black' stroke='none'/%3E%3C/svg%3E") }
kbd[data-icon="mobile"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='2.5' width='12' height='19' rx='3'/%3E%3Cpath d='M10.5 18h3'/%3E%3C/svg%3E") }
kbd[data-icon="bolt"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13.5 2L4.5 13.5H11L10 22l9.5-12H13z' fill='black' stroke='none'/%3E%3C/svg%3E") }
kbd[data-icon="finanzen"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='13' rx='2'/%3E%3Cpath d='M16 12h2M3 10h18'/%3E%3C/svg%3E") }
kbd[data-icon="calendar"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 9h18M8 3v4M16 3v4'/%3E%3C/svg%3E") }
kbd[data-icon="receipt"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h12v18l-3-2-3 2-3-2-3 2z'/%3E%3Cpath d='M9 8h6M9 12h6M9 16h3'/%3E%3C/svg%3E") }
kbd[data-icon="download"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3v5h5'/%3E%3Cpath d='M12 11v6M9.5 14.5L12 17l2.5-2.5'/%3E%3C/svg%3E") }
kbd[data-icon="send"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21.5 2.5L10.5 13.5'/%3E%3Cpath d='M21.5 2.5l-7 19-4-8-8-4z'/%3E%3C/svg%3E") }
kbd[data-icon="euro"] { --hc-ui-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.5 6.5a6.5 6.5 0 1 0 0 11'/%3E%3Cpath d='M5 10.5h8.5M5 13.5h8.5'/%3E%3C/svg%3E") }