.szyumxhg-shell { display: grid; gap: 16px; width: 100%; max-width: 44rem; margin-block: 16px; padding: 16px; box-sizing: border-box; border: 1px solid var(--color-accent); border-radius: 8px; background: var(--color-base-200); color: var(--color-base-content); }
.szyumxhg { display: grid; gap: 16px; min-width: 0; }
.szyumxhg-pair, .szyumxhg-field { display: grid; gap: .5rem; min-width: 0; }
.szyumxhg-pair { gap: 16px; }
@media (min-width: 40rem) { .szyumxhg-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.szyumxhg-label { font-weight: 600; }
.szyumxhg-input { width: 100%; min-width: 0; box-sizing: border-box; padding: .75rem; border: 1px solid var(--color-accent); border-radius: 8px; background: var(--color-base-100); color: inherit; font: inherit; }
.szyumxhg-input:focus-visible, .szyumxhg-consent input:focus-visible, .szyumxhg-submit:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 3px; }
.szyumxhg-input:is(textarea) { resize: vertical; }
.szyumxhg-consent { display: flex; align-items: flex-start; gap: .75rem; }
.szyumxhg-consent input { margin-block-start: .3em; accent-color: var(--color-accent); }
.szyumxhg-shell a { color: inherit; text-decoration: underline; }
.szyumxhg-submit { justify-self: start; padding: .75rem 1.5rem; border: 1px solid var(--color-accent); border-radius: 8px; background: var(--color-accent); color: var(--color-accent-content); font: inherit; font-weight: 700; cursor: pointer; }
.szyumxhg-status { display: none; gap: 1rem; padding: clamp(1rem, 4vw, 2rem); border: 2px solid var(--color-success); border-radius: 8px; background: var(--color-base-100); color: var(--color-base-content); scroll-margin-block-start: 6rem; overflow-wrap: anywhere; }
.szyumxhg-status:target { display: grid; }
.szyumxhg-ok:target ~ form { display: none; }
.szyumxhg-title, .szyumxhg-status p { margin: 0; color: inherit; }
.szyumxhg-title { font-size: clamp(1.25rem, 3vw, 1.75rem); line-height: 1.25; font-weight: 700; }
.szyumxhg-status p { font-size: 1rem; line-height: 1.6; }
.szyumxhg-icon { width: 3rem; height: 3rem; padding: .625rem; box-sizing: border-box; border-radius: 50%; background: var(--color-success); color: var(--color-success-content); }
.szyumxhg-error { border-color: var(--color-error); }
.szyumxhg-error .szyumxhg-icon { background: var(--color-error); color: var(--color-error-content); }
.szyumxhg-status a { justify-self: start; font-weight: 600; text-underline-offset: .2em; }
.szyumxhg-status:focus-visible, .szyumxhg-status a:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 4px; }
.szyumxhg-hint { margin: 0; font-size: .9em; }
