.own-field { border: 0; margin: 0; padding: 0; min-inline-size: 0; display: grid; gap: var(--own-field-gap, 6px); }
.own-field legend { padding: 0; margin-block-end: var(--own-field-gap, 6px); }
.own-parts { display: flex; gap: var(--own-field-gap, 8px); min-inline-size: 0; }
.own-part { display: grid; gap: 4px; min-inline-size: 0; align-content: start; }
.own-part > span { font-size: 0.85em; color: var(--own-field-hint, inherit); }
.own-day { flex: 0 0 4.5em; } .own-year { flex: 0 0 6em; } .own-month { flex: 1 1 0; }
.own-country { flex: 0 0 8.5em; } .own-number { flex: 1 1 0; }
/* 'hidden' wins over a site's own label display rule (site-basic's join form has one). */
.own-field [hidden] { display: none !important; }
.own-boxed .own-number > span { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.own-phonebox { display: flex; align-items: center; min-inline-size: 0; background: var(--own-field-bg, Field); color: var(--own-field-text, FieldText); border: var(--own-field-border, 1px solid currentColor); border-radius: var(--own-field-radius, 6px); }
.own-phonebox:focus-within { outline: 2px solid var(--own-field-focus, Highlight); outline-offset: 1px; }
.own-phonebox:has(input[aria-invalid='true']) { border-color: var(--own-field-error, #b42318); }
.own-phonebox .own-cc { display: inline-flex; align-items: center; gap: 6px; flex: none; align-self: stretch; inline-size: auto !important; min-block-size: 44px; padding-block: 0; padding-inline: 12px 4px; margin: 0 !important; background: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; color: inherit; font: inherit; cursor: pointer; }
.own-phonebox .own-cc:focus-visible { outline: none; }
.own-phonebox .own-cc svg { inline-size: 10px; block-size: 14px; opacity: 0.6; }
.own-phonebox .own-dial { flex: none; padding-inline-start: 6px; color: var(--own-field-hint, inherit); white-space: nowrap; font-size: max(16px, var(--own-field-font-size, 1em)); }
.own-phonebox input, .own-phonebox input:focus-visible { flex: 1 1 auto; min-inline-size: 0 !important; inline-size: 100% !important; margin: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: inherit; outline: none !important; box-shadow: none !important; padding-inline-start: 6px; }
.own-flag { inline-size: 21px; block-size: 14px; flex: none; border-radius: 2px; object-fit: cover; box-shadow: 0 0 0 1px rgb(0 0 0 / 0.1); }
.own-flag[hidden] { display: none; }
.own-cc-list { position: fixed; inset: auto; margin: 0; padding: 0; inline-size: 320px; max-inline-size: calc(100vw - 16px); max-block-size: 420px; border: 1px solid var(--own-pop-line, rgb(0 0 0 / 0.12)); border-radius: var(--own-pop-radius, 10px); background: var(--own-pop-bg, Canvas); color: var(--own-pop-text, CanvasText); box-shadow: 0 12px 32px rgb(0 0 0 / 0.18); overflow: hidden; font: inherit; }
.own-cc-list[open] { display: flex; }
.own-cc-list::backdrop { background: transparent; }
.own-cc-pane { display: flex; flex-direction: column; min-block-size: 0; inline-size: 100%; }
.own-cc-find { flex: none; inline-size: 100%; box-sizing: border-box; margin: 0; padding: 12px 14px; border: 0; border-block-end: 1px solid var(--own-pop-line, rgb(0 0 0 / 0.12)); border-radius: 0; background: transparent; color: inherit; font: inherit; font-size: max(16px, 1em); outline: none; }
.own-cc-list .own-cc-find:focus-visible { outline: none; border-block-end-color: var(--own-field-focus, Highlight); }
.own-cc-list ul { flex: 1 1 auto; min-block-size: 0; margin: 0; padding: 4px 0; list-style: none; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.own-cc-list li { display: flex; align-items: center; gap: 10px; min-block-size: 40px; padding-inline: 14px; cursor: pointer; }
.own-cc-list li[hidden] { display: none; }
.own-cc-list li:hover, .own-cc-list li[aria-selected="true"] { background: var(--own-pop-active, rgb(0 0 0 / 0.06)); }
.own-cc-none { margin: 0; padding: 14px; color: var(--own-field-hint, inherit); }
.own-cc-list.own-sheet { inset-inline: 0; inset-block: auto 0; inline-size: 100%; max-inline-size: 100%; block-size: 85dvh; max-block-size: 85dvh; border-radius: 14px 14px 0 0; }
.own-cc-list.own-sheet::backdrop { background: rgb(0 0 0 / 0.35); }
.own-cc-list.own-sheet li { min-block-size: 48px; }
.own-field input, .own-field select { inline-size: 100%; min-inline-size: 0; max-inline-size: 100%; box-sizing: border-box; font-size: max(16px, var(--own-field-font-size, 1em)); }
:where(.own-field) :where(input, select) { background: var(--own-field-bg, Field); color: var(--own-field-text, FieldText); border: var(--own-field-border, 1px solid currentColor); border-radius: var(--own-field-radius, 6px); padding: var(--own-field-padding, 10px 12px); }
.own-error { font-size: 0.9em; color: var(--own-field-error, #b42318); }
.own-hint { display: block; font-size: 0.9em; line-height: 1.4; color: var(--own-field-hint, inherit); }
.own-hint[hidden] { display: none; }
.own-hint button { font: inherit; color: inherit; background: none; border: 0; padding: 0; text-decoration: underline; cursor: pointer; }