.feature-center { padding: 20px; min-width: 0; }
.feature-center [hidden] { display: none !important; }
.vpn-device-grants { grid-column: 1 / -1; border: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.vpn-device-grants legend { padding: 10px 0; font-weight: 600; }
.vpn-account-manager .vpn-header, .vpn-account-manager .vpn-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 14px 0; }
.vpn-account-manager .vpn-header > button { margin-left: auto; }
.vpn-account-manager .vpn-actions > label { flex-direction: row; align-items: center; }
.vpn-account-manager .vpn-table-wrap { max-width: 100%; overflow: auto; margin: 14px 0; }
.vpn-account-manager .vpn-table-wrap table { min-width: 640px; }
.vpn-account-manager .vpn-table-wrap th { position: static; }
.vpn-account-manager .vpn-table-wrap button + button { margin-left: 8px; }
.vpn-account-manager .vpn-account-form h3 { margin-bottom: 14px; }
.vpn-account-manager .vpn-account-job { padding: 10px 0; overflow-wrap: anywhere; }
.vpn-account-manager .vpn-notice { color: #176248; }
.vpn-account-manager .vpn-share-reason { display: block; color: var(--muted); }
.vpn-share-dialog { width: 430px; max-width: calc(100vw - 32px); max-height: calc(100dvh - 32px); box-sizing: border-box; overflow: auto; border: 1px solid #d7dfe3; border-radius: 8px; padding: 20px; background: #fff; color: #182830; }
.vpn-share-dialog::backdrop { background: rgb(0 0 0 / 45%); }
.vpn-share-dialog .vpn-header { margin-top: 0; }
.vpn-share-dialog .vpn-header h3 { margin: 0; font-size: 18px; }
.vpn-share-dialog .vpn-share-label { overflow-wrap: anywhere; margin: 8px 0; }
.vpn-share-image { display: block; width: 320px; max-width: 100%; height: auto; aspect-ratio: 1; margin: 12px auto; image-rendering: pixelated; }
.vpn-share-dialog dl { display: grid; grid-template-columns: 76px minmax(0,1fr); gap: 6px 10px; font-size: 14px; }
.vpn-share-dialog dt { color: var(--muted); }
.vpn-share-dialog dd { margin: 0; overflow-wrap: anywhere; }
.vpn-share-dialog .vpn-share-save { color: #176248; }
.vpn-share-entry { display: grid; gap: 6px; margin-top: 12px; }
.vpn-share-entry select { width: 100%; min-width: 0; box-sizing: border-box; }
.vpn-client-dialog { width: 680px; }
.vpn-client-content { width: 100%; min-width: 0; box-sizing: border-box; margin-top: 12px; resize: vertical; font: 13px/1.5 monospace; }
.vpn-account-manager .vpn-user-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.vpn-account-manager .vpn-user-actions button { margin: 0; }
.vpn-account-manager .vpn-user-actions button + button { margin-left: 0; }
.feature-center h2 { margin: 0 0 16px; font-size: 20px; }
.feature-center h3 { margin: 18px 0 12px; font-size: 15px; }
.feature-center label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--muted); }
.feature-center input, .feature-center select, .feature-center textarea { max-width: 100%; }
.feature-center input[type=checkbox] { width: 18px; min-height: 18px; align-self: flex-start; }
.feature-center button { margin: 4px 6px 4px 0; }
.feature-center pre { max-height: 440px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; }
.feature-center table { width: 100%; }
.feature-center td { max-width: 460px; overflow-wrap: anywhere; }
.feature-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; padding: 16px; margin: 14px 0; background: #f8fafc; border: 1px solid var(--line); border-radius: 10px; }
.feature-form h3, .feature-checks { grid-column: 1 / -1; }
.feature-checks { display: flex; flex-wrap: wrap; gap: 14px; padding: 8px 0; }
.feature-checks label { flex-direction: row; align-items: center; }
.feature-center .feature-notice { border-left: 3px solid var(--brand); padding: 10px 14px; background: #f0f7ff; margin-bottom: 16px; }
@media(max-width:680px) { .feature-center { padding: 12px; } .feature-form { grid-template-columns: minmax(0,1fr); } }
@media(max-width:680px) { .vpn-device-grants { grid-template-columns: minmax(0,1fr); } }
