.bug { width: min(480px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); margin: auto; padding: 20px 22px; overflow: auto; border: 0; color: var(--text); background: var(--stone); box-shadow: inset 2px 2px 0 var(--stone-up), inset -2px -2px 0 var(--deep), 0 0 0 2px var(--rim), 0 0 0 4px var(--deep); font-family: var(--body) }
.bug::backdrop { background: #070a12b8 }
.bug h2 { margin: 0 0 6px; font: 400 18px/27px var(--display); text-transform: uppercase; color: var(--gold) }
.bug p { margin: 0 0 4px; font-size: 15px; line-height: 1.45; color: var(--muted) }
.bug label { display: block; margin: 14px 0 6px; font: 400 14px/14px var(--small); text-transform: uppercase; color: var(--gold) }
.bug input, .bug textarea { display: block; width: 100%; min-height: 44px; padding: 10px 12px; border: 0; border-radius: 0; color: var(--text); background: #10161f; box-shadow: inset 2px 2px 0 var(--deep), 0 0 0 2px var(--rim); font: 400 16px/1.4 var(--body) }
.bug textarea { min-height: 128px; resize: vertical }
.bug input:focus, .bug textarea:focus { outline: 2px solid var(--gold); outline-offset: 1px }
.bug .bug-status { min-height: 22px; margin: 12px 0 0; color: var(--bad) }
.bug .bug-status.good { color: #b8f0c0 }
.bug-actions { display: flex; align-items: center; gap: 16px; margin-top: 10px }
.foot-end, .below-end { display: flex; align-items: center; gap: 20px }
.foot-bug { min-height: 40px; padding: 0; border: 0; color: var(--ice); background: none; font: inherit; text-transform: inherit; letter-spacing: inherit; cursor: pointer }
.foot-bug:hover, .foot-bug:focus-visible { color: var(--gold) }