/* First-party shared 2ip UI. Bootstrap owns mechanics; FA7 owns glyphs.
 * Specialized results and portable packages keep their own layout contracts. */
html { background: var(--twoip-surface-container); }
body {
  color: var(--twoip-on-surface);
  background: var(--twoip-surface-container);
  font-family: "2ip", Roboto, sans-serif;
  font-size: var(--twoip-type-body);
  line-height: 1.45;
}
body :is(h1,.h1) { font-size: var(--twoip-type-headline); line-height: 1.2; }
body :is(h2,.h2) { font-size: 26px; line-height: 1.25; }
body :is(h3,.h3) { font-size: 22px; line-height: 1.3; }
body :is(h4,.h4,.module-title) { font-size: var(--twoip-type-title); line-height: 1.3; }
body :is(h1,h2,h3,h4,h5,h6) { font-family: "2ip", Roboto, sans-serif; }
body :is(.text-muted,.twoip-help-block) { color: var(--twoip-on-surface-variant); }
body :is(a,button,input,textarea,select,[tabindex]):focus-visible {
  outline: 2px solid var(--twoip-control-focus, var(--twoip-primary));
  outline-offset: 3px;
}
body a { transition: color .15s ease, background-color .15s ease; }
body ::selection { color: var(--twoip-on-primary-container); background: var(--twoip-primary-container); }
body .t3-content, body .t3-sl-helper-wrap {
  background: var(--twoip-surface);
  border: 0;
  border-radius: var(--twoip-radius-medium);
  box-shadow: none;
}
body .t3-navhelper { color: var(--twoip-on-surface-variant); background: var(--twoip-surface-container); }
body .breadcrumb { font-size: var(--twoip-type-label); }
@media (prefers-reduced-motion: reduce) {
  body *:not(:where(.twoip-chevron,.twoip-accordion-icon,.twoip-disclosure-arrow)), body *:not(:where(.twoip-chevron,.twoip-accordion-icon,.twoip-disclosure-arrow))::before, body *:not(:where(.twoip-chevron,.twoip-accordion-icon,.twoip-disclosure-arrow))::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* One inline primitive: neutral default ink, semantic lines, synchronized states. */
.twoip-inline-link {
  --twoip-inline-border-style: solid;
  --twoip-inline-border: var(--twoip-link-border);
  --twoip-inline-pressed: var(--twoip-link-pressed);
  color: var(--twoip-link-text); text-decoration: none;
  border: 0; border-bottom: 1px var(--twoip-inline-border-style) var(--twoip-inline-border);
  padding-bottom: 1px; cursor: pointer; box-decoration-break: clone; font: inherit;
  transition: color .15s ease, border-color .15s ease;
}
.twoip-inline-link--action {
  --twoip-inline-border-style: dotted;
  --twoip-inline-border: var(--twoip-link-action-border);
  --twoip-inline-pressed: var(--twoip-link-action-pressed);
}
.twoip-inline-link:is(:hover,:focus-visible,:active,:visited) { text-decoration: none; }
.twoip-inline-link:visited { color: var(--twoip-link-text); }
.twoip-inline-link:is(:hover,:focus-visible) { color: var(--twoip-inline-hover); border-bottom-color: var(--twoip-inline-hover); }
.twoip-inline-link:active { color: var(--twoip-inline-pressed); border-bottom-color: var(--twoip-inline-pressed); }
.twoip-inline-link:focus-visible { outline: 2px solid var(--twoip-link-focus); outline-offset: 3px; }
.twoip-inline-link.twoip-inline-link--with-label { border-bottom: 0; }
.twoip-inline-link--with-label .twoip-inline-label:has(.twoip-inline-label) { border-bottom: 0; }
.twoip-inline-link--with-label .twoip-inline-label:not(:has(.twoip-inline-label)) { text-decoration: none; color: inherit; border-bottom: 1px var(--twoip-inline-border-style) var(--twoip-inline-border); padding-bottom: 1px; box-decoration-break: clone; }
.twoip-inline-link--with-label:is(:hover,:focus-visible) .twoip-inline-label:not(:has(.twoip-inline-label)) { border-bottom-color: var(--twoip-inline-hover); }
.twoip-inline-link--with-label:active .twoip-inline-label:not(:has(.twoip-inline-label)) { border-bottom-color: var(--twoip-inline-pressed); }
.twoip-inline-link > .twoip-panel-title { color: inherit; }
.twoip-inline-link :is(.twoip-icon,.twoip-disclosure-arrow) { display: inline-block; border: 0; color: currentColor; text-decoration: none; }
/* Ordinary link glyphs share every foreground state with their text. Disclosure/state/action icons are separate. */
body .twoip-inline-link:not(.twoip-disclosure-control):not(.twoip-sort-control) > .twoip-icon:not([data-twoip-status]):not(.twoip-disclosure-arrow) { color: currentColor; }
/* Ordinary service data/action links: text only; leaf-label underline. */
body .twoip-service-navigation-link { display: inline-flex; align-items: center; gap: 4px; max-inline-size: 100%; min-inline-size: 0; vertical-align: middle; }
body .twoip-service-navigation-link > .twoip-inline-label { min-inline-size: 0; overflow-wrap: anywhere; }
/* Same FA7 slot for vertical state glyphs; component families own their scale. */
body :is(.twoip-chevron,.twoip-disclosure-arrow) {
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 var(--twoip-chevron-size, 12px);
  width: var(--twoip-chevron-size, 12px); height: var(--twoip-chevron-size, 12px);
  font-size: var(--twoip-chevron-size, 12px); line-height: 1;
  position: static; margin: 0; padding: 0; color: inherit;
}
body .twoip-accordion-icon { --twoip-chevron-size: 16px; }
body :is(.twoip-form-select-trigger,.twoip-select-control) { --twoip-chevron-size: var(--twoip-select-icon-size); }
/* Lightweight content disclosure, distinct from accordion/nav/form buttons. */
body .twoip-disclosure-control { display: inline-flex; align-items: center; gap: 8px; min-block-size: 44px; max-inline-size: 100%; padding: 6px 0; margin: 0; border: 0; color: var(--twoip-on-surface); background: transparent; box-shadow: none; font-family: inherit; font-size: var(--twoip-type-body); line-height: 22px; text-align: start; cursor: pointer; list-style: none; }
body .twoip-disclosure-control .twoip-disclosure-arrow { --twoip-chevron-size: 16px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 16px; inline-size: 16px; block-size: 16px; margin: 0; position: static; font-size: 16px; line-height: 1; color: currentColor; }
.twoip-disclosure-control::-webkit-details-marker { display: none; }
body .twoip-disclosure-control:is(:hover,:focus-visible) { background: transparent; box-shadow: none; color: var(--twoip-inline-hover); }
body .twoip-disclosure-control:active { background: transparent; color: var(--twoip-link-action-pressed); }
body .twoip-disclosure-control:focus-visible { outline: 2px solid var(--twoip-link-focus); outline-offset: 3px; }


/* Shell and navigation retain their established columns and disclosure mechanics. */
body .t3-wrapper { background: var(--twoip-surface-container); }
body .t3-header {
  background: var(--twoip-surface);
  box-shadow: none;
  border-bottom: 1px solid var(--twoip-outline-variant);
  padding: 8px 0;
}
body .twoip-header-row { padding-bottom: 0; align-items: center; }
@media (min-width: 1100px) {
  body .twoip-header-row { display: grid; grid-template-columns: var(--twoip-header-logo-width) minmax(0, 1fr) auto; column-gap: 16px; padding-inline: 12px; }
  body .twoip-header-row > .twoip-current-grid { width: auto; min-width: 0; }
}
body .adsbygoogle { max-width: 100%; }
body .t3-header .header-ad-slot { --twoip-header-ad-height:90px; inline-size:100%; max-inline-size:728px; block-size:var(--twoip-header-ad-height); min-block-size:var(--twoip-header-ad-height); max-block-size:var(--twoip-header-ad-height); margin-inline:auto; display:grid; place-items:center; line-height:0; overflow:hidden; }
body .t3-header .twoip-header-ad-creative { inline-size:100%; block-size:100%; min-inline-size:0; max-block-size:100%; display:grid; place-items:center; contain:size layout paint; isolation:isolate; overflow:hidden; }
body .t3-header .twoip-header-ad-creative :is(img,video,iframe,ins) { max-inline-size:100%!important; max-block-size:var(--twoip-header-ad-height)!important; min-inline-size:0!important; min-block-size:0!important; }
body .t3-header .twoip-header-ad-creative :is(img,video) { object-fit:contain; }
@media(max-width:767px){ body .t3-header .header-ad-slot { --twoip-header-ad-height:160px; } }
body .t3-header .header-ad-slot .adsbygoogle[data-ad-status="unfilled"] { display: none !important; }

body .t3-header .logo a { display: inline-flex; vertical-align: top; align-items: center; gap: 8px; color: var(--twoip-primary); text-decoration: none; }
/* Reserve the three utility slots even while their module markup is being parsed. */
body .t3-header .header-utilities { --twoip-header-language-size: 76px; --twoip-header-theme-size: 52px; --twoip-header-account-size: 44px; --twoip-header-account-slot: 44px; display: grid; grid-template-columns: var(--twoip-header-language-size) var(--twoip-header-theme-size) var(--twoip-header-account-slot); align-items: center; justify-content: end; gap: 12px; top: 0; }
body .t3-header .header-utilities > .languageswitcherload { grid-column: 1; grid-row: 1; }
body .t3-header .header-utilities > .twoip-theme-switcher { grid-column: 2; grid-row: 1; }
body .t3-header .header-utilities > :is(.account-lg,.account-mob) { grid-column: 3; grid-row: 1; }
body .t3-header .twoip-language-toggle { inline-size: var(--twoip-header-language-size); }
body .t3-header .twoip-theme-toggle { inline-size: var(--twoip-header-theme-size); }
body .t3-header .header-utilities .account a { inline-size: var(--twoip-header-account-size); }
/* Native language links use the same source as the previous inline selector. */
body .twoip-selector-toggle {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 44px; padding: 8px 10px; border: 0; border-radius: var(--twoip-radius-small);
  color: var(--twoip-primary); background: transparent; font: inherit; font-size: 14px;
}
body .twoip-selector-toggle::after { display: none; }
body .twoip-selector-list {
    margin-top: 6px !important;
    padding: 4px;
    max-width: calc(100vw - 24px);
    max-height: min(60vh, 360px);
    min-width: 240px;
    background: var(--twoip-surface);
    border-color: var(--twoip-outline-variant);
    border-radius: var(--twoip-radius-medium);
    box-shadow: var(--twoip-elevation-2);
}
body .twoip-selector .dropdown-menu:not(.show) { display: none; }
body .twoip-selector-list:not(.twoip-city-popup--searchable) {
    overflow-y: auto;
}
body .twoip-selector-list .dropdown-item { color: var(--twoip-on-surface); min-height: 48px; padding: 10px 12px; gap: 10px; border-radius: var(--twoip-radius-small); display: flex; align-items: center; white-space: normal; word-break: normal; text-decoration: none; }
body .twoip-selector-list .twoip-icon { color: currentColor; font-size: 18px; margin: 0; position: static; }
body .twoip-selector-item-icon { width: 18px; flex: 0 0 18px; text-align: center; }
body .twoip-selector-check { width: 18px; flex: 0 0 18px; }
body .twoip-selector-name { flex: 1 1 auto; min-width: 0; }
body .twoip-selector-code { flex: 0 0 auto; font-size: 13px; color: var(--twoip-on-surface-variant); }
body .twoip-selector-list .dropdown-item:is(:hover,:focus,.active,.is-active,[aria-selected="true"]) { color: var(--twoip-on-primary-container); background: var(--twoip-primary-container); }
body .t3-page-content--home { margin-top: 0; }
body .t3-mainnav .t3-navbar { top: 16px; width: auto; left: 9px; right: 9px; margin: 0; }
body .t3-mainnav .t3-navbar .sidebar-nav > li > a:not(.menu_banner),
body .t3-off-canvas .sidebar-nav > li > a:not(.menu_banner) {
  font-family: "2ip"; font-size: 16px; line-height: 22px; min-height: 44px; padding: 8px 10px;
  color: var(--twoip-on-surface); border-radius: var(--twoip-radius-small); box-shadow: none;
}
body :is(.t3-mainnav .t3-navbar,.t3-off-canvas) .sidebar-nav a:not(.menu_banner) { display: flex; align-items: center; gap: 6px; text-decoration: none; }
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav .twoip-menu-label { min-width: 0; flex: 1 1 auto; word-break: normal; overflow-wrap: normal; white-space: normal; }
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav .hang { margin-inline-start: auto; flex: 0 0 12px; width: 12px; height: 12px; display: inline-flex; align-items: center; justify-content: center; padding: 0; font-size: 12px; line-height: 1; }
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav .hang::before { position: static; content: var(--fa, "\f078"); font-size: inherit; padding: 0; }

body .t3-mainnav .t3-navbar .sidebar-nav > li.active > a:not(.menu_banner),
body .t3-mainnav .t3-navbar .sidebar-nav > li.open > a,
body .t3-off-canvas .sidebar-nav > li.active > a,
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav > li:is(.active,.open) > a.menu-head {
  color: var(--twoip-on-primary); background: var(--twoip-hero-start); box-shadow: none; font-weight: 500;
}
body .t3-mainnav .t3-navbar .sidebar-nav .open { background: transparent; }
/* Icons describe existing top-level route roles; nested links remain compact text. */
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav > [class*="twoip-menu-role-"] > a::before {
  font-family: "Font Awesome 7 Free"; font-weight: 900; font-size: 18px;
  width: var(--twoip-navigation-icon-slot); flex: 0 0 var(--twoip-navigation-icon-slot); text-align: center; color: currentColor;
}
body .twoip-menu-role-home > a::before { content: "\f015"; }
body .twoip-menu-role-services > a::before { content: "\f00a"; }
body .twoip-menu-role-api > a::before { content: "\f121"; }
body .twoip-menu-role-blog > a::before { content: "\f15c"; }
body .twoip-menu-role-site > a::before { content: "\f108"; }
body .twoip-menu-role-agreements > a::before { content: "\f3ed"; }

body .t3-mainnav .t3-navbar .sidebar-nav li:not(.active):not(.open) > a:not(.menu_banner):hover,
body .t3-off-canvas .sidebar-nav li:not(.active):not(.open) > a:hover {
  color: var(--twoip-on-primary-container); background: var(--twoip-surface-container-high); box-shadow: none;
}
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav .twoip-submenu {
  position: static; float: none; min-width: 0; width: auto; margin: 3px 0 5px 4px;
  background: transparent; border: 0; border-left: 1px solid var(--twoip-outline-variant);
  border-radius: 0; box-shadow: none; padding: 0 0 0 2px;
}
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav .twoip-submenu li > a {
  color: var(--twoip-on-surface); font-size: 14px; line-height: 19px; white-space: normal; border-radius: var(--twoip-radius-small); padding: 6px;
}
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav .twoip-submenu li.active > a {
  background: var(--twoip-primary-container); color: var(--twoip-on-primary-container);
}
body .t3-off-canvas { scrollbar-gutter: stable; background: var(--twoip-surface); border-radius: 0 var(--twoip-radius-large) var(--twoip-radius-large) 0; }
body .twoip-mobile-menu-trigger { display: none; }
body .off-canvas-toggle { display: grid; place-items: center; width: 44px; height: 44px; font-size: 20px; line-height: 1; color: var(--twoip-primary); border-radius: var(--twoip-radius-full); }
body :is(.account-mob,.account-lg) .account .twoip-icon {
  box-sizing: border-box; background: transparent; color: var(--twoip-primary); box-shadow: none;
  border-radius: var(--twoip-radius-small);
}
@media (max-width: 1099px) {
  body .twoip-mobile-menu-trigger { display: block; }
  body .t3-header { padding-top: 6px; }
  body .twoip-header-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 8px; padding-left: 44px; padding-right: 4px; }
  body .t3-header .logo {
    position: relative;
    grid-column: 1;
    grid-row: 1;
    width: auto;
    padding: 0;
    margin: 0;
    text-align: center;
    align-self: center;
  }
  body .t3-header .logo a { position: static; gap: 4px; max-width: 100%; }
  /* Share the logo row center; the logo footprint and header height stay stable. */
  body .t3-header .logo .off-canvas-toggle { position: absolute; left: -44px; top: 50%; transform: translateY(-50%); padding: 0; }
  body .off-canvas-toggle:is(:hover,:focus-visible) { background: var(--twoip-primary-container); color: var(--twoip-on-primary-container); }
  body .t3-header .header-utilities { gap: 4px; grid-column: 2; grid-row: 1; width: auto; padding: 0; }
  body .t3-header .header-ad-column { grid-column: 1 / -1; grid-row: 2; width: calc(100% + 44px); margin-left: -44px; padding: 0; }
  body .t3-header .top-banner { margin-bottom: 0; }
  body .account-mob .account { width: 44px; height: 44px; margin-top: 0; background: transparent; transform: none; }
  body .account-mob .account a { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; margin: 0; top: 0; font-size: 20px; }
  body .account-mob .account a span { display: none; }
}


/* Compact header owns its visual glyph scale independently of text/control fonts. */
@media (max-width: 767px) {
  body .twoip-header-row {
    --twoip-mobile-header-icon-size: 24px;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    align-items: center;
    gap: 4px;
    padding-inline: 0 4px;
  }
  body .t3-header .logo {
    display: contents;
  }
  body .twoip-mobile-menu-trigger {
    grid-column: 1;
    grid-row: 1;
  }
  body .t3-header .logo-image {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    padding-inline-start: 4px;
    text-align: left;
  }
  body .t3-header .logo .off-canvas-toggle {
    position: static;
    inset: auto;
    transform: none;
  }
  body .t3-header .header-utilities {
    --twoip-header-language-size: 66px;
    --twoip-header-theme-size: 44px;
    --twoip-header-account-slot: 49px;
    grid-column: 3;
  }
  body .t3-header .account-mob.twoip-header-account-divider {
    display: flex;
    align-items: center;
    height: 28px;
    padding-inline-start: 4px;
  }
  body .t3-header .header-ad-column {
    width: 100%;
    margin-inline: 0;
  }
  body .t3-header .header-ad-column > .row {
    margin-inline: 0;
  }
  body .t3-header :is(.twoip-language-toggle,.twoip-theme-toggle) {
    gap: 4px;
    padding-inline: 0;
  }
  body .t3-header :is(.off-canvas-toggle,.twoip-selector-toggle) > .twoip-icon:not(.twoip-disclosure-arrow) {
    display: inline-grid;
    place-items: center;
    width: var(--twoip-mobile-header-icon-size);
    height: var(--twoip-mobile-header-icon-size);
    font-size: var(--twoip-mobile-header-icon-size);
    line-height: 1;
  }
  body .t3-header .account-mob .account {
    --twoip-account-icon-size: var(--twoip-mobile-header-icon-size);
    --twoip-account-icon-gap: 0px;
    --twoip-account-icon-position: static;
    display: flex;
    align-items: center;
  }
  body .t3-header .account-mob .account a {
    font-size: var(--twoip-mobile-header-icon-size);
    line-height: 1;
  }
}

body .twoip-header-account-divider {
  border-inline-start: 1px solid var(--twoip-outline-variant);
}
@media (min-width: 768px) and (max-width: 1099px) {
  body .account-mob.twoip-header-account-divider {
    border-inline-start: 0;
  }
}
body .account-lg { padding-left: 8px; }
body .account-lg .account { position: static; background: transparent; width: fit-content; height: auto; margin: 0; transform: none; }
body .account-lg .account .twoip-icon { display: flex; align-items: center; justify-content: center; gap: 8px; height: 44px; text-decoration: none; padding: 8px 12px; margin: 0; top: 0; font-size: 18px; }
body .account-lg .account span { color: inherit; font-family: "2ip"; font-size: 14px; line-height: 20px; margin: 0; }
/* Header control surfaces share states; their labels are not inline links. */
body .t3-header .header-utilities :is(.twoip-language-toggle,.twoip-theme-toggle,.account a) {
  min-width: 44px; min-height: 44px; border: 0; border-radius: var(--twoip-radius-small);
  color: var(--twoip-primary); background: transparent; text-decoration: none;
  transition: color .15s ease, background-color .15s ease;
}
body .t3-header .header-utilities :is(.twoip-language-toggle,.twoip-theme-toggle,.account a):is(:hover,:focus-visible) {
  color: var(--twoip-on-primary-container); background: var(--twoip-primary-container);
}
body .t3-header .header-utilities :is(.twoip-language-toggle,.twoip-theme-toggle,.account a):active,
body .t3-header .header-utilities .twoip-selector-toggle[aria-expanded="true"] {
  color: var(--twoip-on-primary-container); background: var(--twoip-surface-container-high);
}
body .t3-header .header-utilities :is(.twoip-language-toggle,.twoip-theme-toggle,.account a) :is(span,i) { color: inherit; text-decoration: none; border: 0; }


/* Desktop utilities share one scale; mobile retains its compact geometry. */
@media (min-width: 1100px) {
  body .t3-header .header-utilities { --twoip-header-language-size: 104px; --twoip-header-theme-size: 68px; --twoip-header-account-size: 104px; --twoip-header-account-slot: 129px; gap: 16px; }
  body .t3-header .header-utilities :is(.twoip-language-toggle,.twoip-theme-toggle,.account a) {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: 48px; height: 48px; padding: 8px 12px; gap: 8px; font-size: 16px; line-height: 20px;
  }
  body .t3-header .header-utilities .twoip-icon,
  body .t3-header .header-utilities .account .twoip-icon { font-size: 20px; position: static; margin: 0; }
  body .t3-header .header-utilities .account a span { font-size: 16px; line-height: 20px; }
  body .t3-header .header-utilities .account-lg { display: flex; align-items: center; align-self: center; }
}

/* Theme state comes from the pre-styles root preference, never a late glyph swap. */
body .t3-header [data-theme-mode-icon] { display: inline-flex; align-items: center; justify-content: center; width: 1em; height: 1em; flex: 0 0 1em; line-height: 1; position: static; margin: 0; }
:root[data-theme-preference="light"] [data-theme-mode-icon]::before { content: "\f185"; }
:root[data-theme-preference="dark"] [data-theme-mode-icon]::before { content: "\f186"; }
:root[data-theme-preference="auto"] [data-theme-mode-icon]::before { content: "\f042"; }

/* IP hero: primary data above compact, readable secondary information. */
body .ipblock .showip_mod {
  font-family: "2ip"; color: var(--twoip-on-primary); background: var(--twoip-primary);
  border: 1px solid var(--twoip-primary); border-radius: var(--twoip-radius-large); overflow: hidden;
}
body .ipblock .showip_mod .ipblockgradient { background: linear-gradient(110deg, var(--twoip-hero-start), var(--twoip-hero-end)); box-shadow: none; padding: 24px 0 0; }
body .ipblock .showip_mod .iptitle { font-size: 18px; color: var(--twoip-on-primary); }
body .ipblock .showip_mod .ip:not(.ipv6) {
  color: var(--twoip-on-primary); font-family: "2ip-roboto", Roboto, sans-serif;
  font-size: clamp(36px, 4.5vw, 52px); line-height: 1.25; margin-bottom: 24px;
  font-variant-numeric: tabular-nums; font-weight: 700; letter-spacing: -.025em;
  display: flex; align-items: center; justify-content: center; gap: 4px;
}
body .ipblock .showip_mod .ip.ipv6 { color: var(--twoip-on-primary); }
body .ipblock .showip_mod .ip.ipv6 .ipv6addr { color: var(--twoip-on-primary); overflow-wrap: anywhere; }
body .ipblock .showip_mod .ip :is(.copy-clipboard,.copy-clipboard-v6) {
  display: inline-grid;
  place-items: center;
  position: static;
  vertical-align: middle;
  width: 40px;
  height: 40px;
  padding: 0;
  margin-left: 4px;
  border: 0;
  border-radius: var(--twoip-radius-full);
  font-size: 18px;
  line-height: 1;
  color: var(--twoip-button-on-primary);
  background: var(--twoip-primary);
  cursor: pointer;
  transition: background-color .15s ease, box-shadow .15s ease;
}
body .ipblock .showip_mod .ip :is(.copy-clipboard,.copy-clipboard-v6):hover {
  color: var(--twoip-on-primary-container);
  background: var(--twoip-copy-hover);
}
body .ipblock .showip_mod .ip :is(.copy-clipboard,.copy-clipboard-v6):active {
  box-shadow: inset 0 0 0 3px color-mix(in srgb, var(--twoip-scrim) 18%, transparent);
}
body .ipblock .showip_mod .ip :is(.copy-clipboard,.copy-clipboard-v6).is-copied {
  color: var(--twoip-on-success);
  background: var(--twoip-copy-success);
}
body .ipblock .showip_mod .ipblockgradient > .row:has(> :is(.ipblockgrid,.s-ipblockgrid)) { background: var(--twoip-hero-data); padding-block: 1px; }
body .ipblock .showip_mod :is(.ipblockgrid,.s-ipblockgrid) { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: repeat(var(--twoip-info-rows, 2), 1fr); grid-auto-rows: 1fr; gap: 1px; padding: 0; margin: 12px; width: calc(100% - 24px); background: var(--twoip-hero-divider); --twoip-info-value-font-size: 14px; --twoip-info-line-height: 1.45; --twoip-info-value-block-size: calc(2 * var(--twoip-info-value-font-size) * var(--twoip-info-line-height) + 2px); }
body .ipblock .showip_mod :is(.ipblockgrid,.s-ipblockgrid) > div { display: grid; grid-template-columns: 32px minmax(0, 1fr); align-content: center; width: auto; min-width: 0; min-height: 76px; padding: 9px 12px 9px 10px; border: 0; background: var(--twoip-hero-data); }
body .ipblock .showip_mod .s-ipblockgrid { --twoip-info-rows: 1; }
body .ipblock .showip_mod :is(.ipblockgrid,.s-ipblockgrid) > div {
  text-align: left;
}
/* Reserve the previous label + two-line async slot independently of the natural text composition.
   The inert label measurement wraps at the same width; it is never announced or painted. */
body .ipblock .showip_mod .twoip-info-reserve { grid-column: 2; grid-row: 1; visibility: hidden; font-size: 13px; overflow-wrap: anywhere; }
body .ipblock .showip_mod .twoip-info-reserve::before { content: attr(data-label); display: block; }
body .ipblock .showip_mod .twoip-info-reserve::after { content: ""; display: block; block-size: var(--twoip-info-value-block-size); }
body .ipblock .showip_mod .twoip-info-content { grid-column: 1 / -1; grid-row: 1; align-self: start; display: grid; grid-template-columns: 32px minmax(0, 1fr); align-items: center; }
body .ipblock .showip_mod .twoip-info-text { min-width: 0; }
body .ipblock .showip_mod .twoip-info-icon { display: grid; place-items: center; inline-size: 32px; block-size: 22px; color: var(--twoip-primary); font-size: 22px; line-height: 1; }
body .ipblock .showip_mod .twoip-info-icon::before { content: var(--twoip-info-glyph); font-family: var(--twoip-info-icon-family); font-weight: var(--twoip-info-icon-weight); line-height: 1; }
body .ipblock .showip_mod :is(.ipblockgrid,.s-ipblockgrid) :is(.name,.result) { margin-left: 0; }
body .ipblock .showip_mod :is(.ipblockgrid,.s-ipblockgrid) .name { color: var(--twoip-on-surface-variant); font-size: 13px; }
body .ipblock .showip_mod :is(.ipblockgrid,.s-ipblockgrid) .result { color: var(--twoip-on-surface); font-size: var(--twoip-info-value-font-size); line-height: var(--twoip-info-line-height); font-weight: 600; max-block-size: var(--twoip-info-value-block-size); display: block; }
body .ipblock .showip_mod :is(.cli,.iphistory) { display: inline-flex; align-items: center; gap: 4px; color: var(--twoip-on-primary); --twoip-link-text: var(--twoip-on-primary); --twoip-link-border: var(--twoip-on-primary); --twoip-link-action-border: var(--twoip-link-action-on-primary); --twoip-inline-hover: var(--twoip-inline-hover-on-primary); --twoip-link-action-pressed: var(--twoip-link-action-on-primary-pressed); --twoip-link-pressed: var(--twoip-link-action-on-primary-pressed); --twoip-link-focus: var(--twoip-on-primary); }
body .ipblock .showip_mod :is(.cli,.iphistory) .twoip-icon { font-size: 16px; top: 0; margin: 0; display: inline-flex; align-items: center; justify-content: center; width: 1.25em; height: 1em; flex: 0 0 1.25em; line-height: 1; }
body .ipblock .showip_mod :is(.cli,.iphistory) button {
  background: transparent; border: 0;
  padding: 4px 8px; min-height: 40px; font: inherit; display: inline-flex; align-items: center; gap: 6px; text-decoration: none !important;
}
body .ipblock .showip_mod :is(.cli,.iphistory,.ip) button:focus-visible { outline-color: var(--twoip-on-primary); }
@media (max-width: 767px) { body .ipblock .showip_mod :is(.ipblockgrid,.s-ipblockgrid) { grid-template-columns: repeat(2, minmax(0, 1fr)); --twoip-info-rows: 4; }
body .ipblock .showip_mod .s-ipblockgrid { --twoip-info-rows: 2; }
  /* Reserve the touch target at the mobile breakpoint before pointer initialization. */
  body .ipblock .showip_mod :is(.cli,.iphistory) button { min-height: 44px; }
}
@media (max-width: 480px) {
  body .ipblock .showip_mod .ip:not(.ipv6) { font-size: clamp(28px, 9vw, 36px); }
  body .ipblock .showip_mod .ip :is(.copy-clipboard,.copy-clipboard-v6) { width: 44px; height: 44px; }
  body .ipblock .showip_mod .iphistory { position: relative; top: 0; }
}

/* Hero CLI follows the shared desktop layout boundary; no hidden layout slot. */
@media (max-width: 1099px) { body .ipblock .showip_mod .cli { display: none; } }

/* Ordinary labeled buttons: four semantic palettes, one geometry/state model.
   Legacy names are adapters; explicit product roles take precedence. */
body .btn {
  --twoip-button-accent: var(--twoip-primary);
  --twoip-button-container: var(--twoip-primary-container);
  --twoip-button-on-accent: var(--twoip-button-on-primary);
  --twoip-button-on-container: var(--twoip-on-primary-container);
  --twoip-button-fill: transparent;
  --twoip-button-ink: var(--twoip-button-accent);
  --twoip-button-border: var(--twoip-button-accent);
  --twoip-button-focus: var(--twoip-button-accent);
  --twoip-control-focus: var(--twoip-button-accent);
}
body .btn.btn:not(.control-el):not(.input-password-toggle):not(.twoip-icon-action):where(:not(.dropdown-toggle,.twoip-button--icon)) {
  min-height: 44px;
  padding: 8px 16px;
  border: 1px solid var(--twoip-button-border);
  border-radius: var(--twoip-radius-medium);
  outline-offset: 3px;
  background: var(--twoip-button-fill);
  color: var(--twoip-button-ink);
  box-shadow: none;
  text-transform: none;
  font-family: "2ip";
  font-size: 15px;
  font-weight: normal;
  line-height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--twoip-button-gap, 6px);
  white-space: var(--twoip-button-white-space, normal);
  word-break: normal;
  overflow-wrap: normal;
  text-decoration: none;
  transition: background-color .15s ease, box-shadow .15s ease;
}
body .btn.btn:is(.btn-success,.twoip-button--save,[data-twoip-button-role="save"]) {
  --twoip-button-gap: var(--twoip-service-option-row-gap, 8px);
  --twoip-button-accent: var(--twoip-success);
  --twoip-button-container: var(--twoip-success-container);
  --twoip-button-on-accent: var(--twoip-on-success);
  --twoip-button-on-container: var(--twoip-success);
}
body .btn.btn:is(.btn-danger,.btn-delete,.twoip-button--destructive-outlined,[data-twoip-button-role="delete"]) {
  --twoip-button-accent: var(--twoip-error);
  --twoip-button-container: var(--twoip-error-container);
  --twoip-button-on-accent: var(--twoip-on-error);
  --twoip-button-on-container: var(--twoip-error);
}
body .btn.btn:is(.btn-warning,.twoip-button--warning,[data-twoip-button-role="warning"]) {
  --twoip-button-accent: var(--twoip-warning);
  --twoip-button-container: var(--twoip-warning-container);
  --twoip-button-on-accent: var(--twoip-on-warning);
  --twoip-button-on-container: var(--twoip-warning);
}
/* Explicit ordinary intent overrides legacy color classes (including logout). */
body .btn.btn[data-twoip-button-role="action"] {
  --twoip-button-accent: var(--twoip-primary);
  --twoip-button-container: var(--twoip-primary-container);
  --twoip-button-on-accent: var(--twoip-button-on-primary);
  --twoip-button-on-container: var(--twoip-on-primary-container);
}
body .btn.btn:not(.control-el):not(.input-password-toggle):not(.twoip-icon-action):where(:not(.dropdown-toggle,.twoip-button--icon)):not(:disabled):not(.disabled):is(:hover,:focus-visible) {
  --twoip-button-fill: var(--twoip-button-container);
  --twoip-button-ink: var(--twoip-button-on-container);
  background: var(--twoip-button-fill);
  color: var(--twoip-button-ink);
  border-color: var(--twoip-button-border);
  box-shadow: var(--twoip-elevation-1);
}
body .btn.btn:not(.control-el):not(.input-password-toggle):not(.twoip-icon-action):where(:not(.dropdown-toggle,.twoip-button--icon)):not(:disabled):not(.disabled):active {
  --twoip-button-fill: var(--twoip-button-accent);
  --twoip-button-ink: var(--twoip-button-on-accent);
  background: var(--twoip-button-fill);
  color: var(--twoip-button-ink);
  border-color: var(--twoip-button-border);
  box-shadow: inset 0 0 0 1px var(--twoip-button-border);
}
body .btn.btn:not(.control-el):not(.input-password-toggle):not(.twoip-icon-action):where(:not(.dropdown-toggle,.twoip-button--icon)):focus-visible {
  outline: 2px solid var(--twoip-button-focus);
  outline-offset: 3px;
}
body .btn.btn:is(:disabled,.disabled),
body fieldset:disabled .btn.btn {
  opacity: .5;
  box-shadow: none;
  cursor: default;
}
body .btn.btn .twoip-icon {
  width: 18px;
  font-size: 18px;
  flex-shrink: 0;
  line-height: 1;
  position: static;
  margin-inline-end: 0;
  vertical-align: middle;
  color: inherit;
}
body .btn.btn.twoip-button--icon {
  width: 44px;
  height: 44px;
  padding: 0;
  border-radius: var(--twoip-radius-full);
}
/* Stored CMS label markup must not restore link decoration inside controls. */
body .btn.btn :is(span,a,i,.twoip-inline-label) {
  color: inherit !important;
  text-decoration: none !important;
  border-bottom: 0 !important;
}
body .btn.btn.twoip-inline-link {
  border-bottom: 1px solid var(--twoip-button-border);
  color: var(--twoip-button-ink) !important;
}

/* Standalone delete actions and outlined buttons share the same error roles. */
.twoip-destructive-control {
  --twoip-control-ink: var(--twoip-error); --twoip-control-focus: var(--twoip-error); --twoip-destructive-fill: transparent;
  color: var(--twoip-error); border-color: var(--twoip-error); background-color: var(--twoip-destructive-fill);
  text-decoration: none; transition: background-color .15s ease, box-shadow .15s ease;
}
.twoip-destructive-control .twoip-icon { color: currentColor; }
.twoip-destructive-control:is(a,button,[role="button"],.twoip-icon):not(:disabled):not(.disabled):is(:hover,:focus-visible,:active) { --twoip-destructive-fill: var(--twoip-error-container); }
.twoip-destructive-control:focus-visible { outline: 2px solid var(--twoip-error); outline-offset: 3px; }
.twoip-destructive-control:not(.btn):not(.twoip-destructive-control--icon):active { box-shadow: inset 0 0 0 100px color-mix(in srgb, var(--twoip-scrim) 12%, transparent); }
/* Icon actions keep their existing box; only the state surface is visible. */
.twoip-destructive-control--icon { border-color: transparent; border-radius: var(--twoip-radius-full); }
body .btn.btn.twoip-destructive-control--icon { --twoip-button-fill: transparent; --twoip-button-border: transparent; }
body .btn.btn.twoip-destructive-control--icon:not(:disabled):not(.disabled):is(:hover,:focus-visible,:active) { --twoip-button-fill: var(--twoip-error-container); box-shadow: none; }
.twoip-destructive-control--icon:active { box-shadow: none; }

/* Form selectors reuse the header menu family around an outlined native-value proxy. */
body .twoip-form-selector { min-width: 0; width: 100%; }
body .input-group > .twoip-form-selector { flex: 1 1 0; width: auto; }
body .twoip-form-group > .input-group:has(> .twoip-form-selector),
body .twoip-form-group > .input-group:has(> .input-group-text):not(:has(input[type="file"])) {
  display: flex;
  flex-wrap: nowrap;
}
/* Prefix slot shares the control metric; table-cell alignment is not a flex contract. */
body .twoip-form-group > .input-group:not(:has(input[type="file"])) > .input-group-text {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: auto;
  height: var(--twoip-control-height);
  padding-block: 0;
}
body .twoip-form-select-trigger {
  display: flex;
  width: 100%;
  justify-content: space-between;
  text-align: start;
  cursor: pointer;
}
body .twoip-form-select-trigger .twoip-icon {
  color: currentColor;
  margin: 0;
  position: static;
}

body .twoip-form-selector .twoip-selector-list { min-width: 0; }
body .twoip-form-selector .twoip-selector-list .twoip-selector-name { overflow-wrap: anywhere; }
body .twoip-form-selector .twoip-selector-toggle:disabled { cursor: not-allowed; }

body .twoip-form-group .twoip-radio label,
body .twoip-form-group .twoip-checkbox label { white-space: normal; color: var(--twoip-on-surface); }
body .twoip-checkbox input[type=checkbox] {
  appearance: auto; opacity: 1; position: static; width: 18px; height: 18px;
  margin: 0 6px 0 0; z-index: auto; overflow: visible; pointer-events: auto; vertical-align: middle;
  accent-color: var(--twoip-primary); cursor: pointer;
}
body .twoip-checkbox .checkbox-material,
body .twoip-radio label :is(.circle,.check) { display: none; }

body .twoip-radio.radio-denied input[type=radio] { accent-color: var(--twoip-error); }
body .twoip-checkbox input:disabled, body .twoip-radio input:disabled { cursor: not-allowed; }
body .twoip-checkbox label:has(input:disabled), body .twoip-radio label:has(input:disabled) { color: var(--twoip-on-surface-variant); }
@media (pointer: coarse) {
  body :is(.t3-off-canvas .sidebar-nav > li > a,.ipblock .showip_mod .cli button,.ipblock .showip_mod .iphistory button) { min-width: 44px; min-height: 44px; }
  body .twoip-checkbox label { min-height: 40px; display: inline-flex; align-items: center; }
}


/* Shared grouping and dense data presentation. */
body :is(.twoip-panel:not(.twoip-accordion-item),.card) {
  background: var(--twoip-surface);
  color: var(--twoip-on-surface);
  border: 0;
  border-radius: var(--twoip-radius-medium);
  box-shadow: none;
}
body :is(.twoip-panel:not(.twoip-accordion-item),.card) :is(.twoip-panel:not(.twoip-accordion-item),.card) {
  background: var(--twoip-surface-container);
}
/* Category, route and Bootstrap pane tabs share one surface/geometry contract. */
body :is(.twoip-tabs,.t3-isotope-menu .module-ct > .row) { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(140px,100%),1fr)); grid-auto-rows: 1fr; gap: 10px; border: 0; padding: 0; list-style: none; }
/* Tabs never add a second bottom margin to the canonical content gap. */
body .twoip-tabs {
  margin-block-end: 0;
}
/* Following content remains in normal flow with one shared section gap. */
:root { --twoip-tabs-content-gap: 16px; }
body .twoip-tabs + :is(.table-responsive,.twoip-service-table-scroll,.tab-content,table,.twoip-statistics-chart,.twoip-data-panel) {
  margin-block-start: var(--twoip-tabs-content-gap);
}
/* Native server sorting and DataTables share header control/indicator geometry. */
body .twoip-sort-control,
body .dt-bootstrap5 table.dataTable thead th .dt-column-header {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  max-width: 100%;
}
body .twoip-sort-control > .twoip-icon,
body .dt-bootstrap5 table.dataTable thead th .dt-column-order {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  margin: 0;
  color: var(--twoip-primary);
  opacity: .55;
  font-size: 16px;
  line-height: 1;
}
body .twoip-sort-control > .twoip-icon.active,
body .dt-bootstrap5 table.dataTable thead th:is(.dt-ordering-asc,.dt-ordering-desc) .dt-column-order {
  opacity: 1;
}
body .twoip-data-panel[aria-busy="true"] .table-responsive {
  opacity: .6;
}
body .twoip-sort-control > .twoip-inline-label { min-width: 0; }
/* Radio choices share the tab surface without claiming tab/panel semantics. */
body .twoip-tabs--choice {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-width: 0;
  margin-block-start: var(--twoip-tabs-content-gap);
}
body .twoip-help-block--info,
body .twoip-form-group .twoip-help-block.twoip-help-block--info {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}
body .twoip-help-block--info > .twoip-icon { position: static; margin: 0; font-size: 20px; color: var(--twoip-primary); }
body .twoip-help-content { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
body :is(.twoip-tabs,.t3-isotope-menu .module-ct > .row) > button { border-radius: var(--twoip-radius-category); }
body :is(.twoip-tabs,.t3-isotope-menu .module-ct > .row) > .nav-item { width: auto; min-width: 0; margin: 0; padding: 0; }
body :is(.twoip-tabs,.t3-isotope-menu .module-ct > .row) :is(.twoip-tab,.t3-isotope-menu button > span) {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  height: 100%;
  min-height: var(--twoip-tab-min-height, 52px);
  padding: var(--twoip-tab-padding-block, 10px) 8px;
  margin: 0;
  border: 0;
  border-radius: var(--twoip-radius-category);
  font-family: "2ip";
  font-size: var(--twoip-tab-font-size, var(--twoip-type-body));
  line-height: 1.3;
  font-weight: 400;
  color: var(--twoip-on-surface-variant);
  background: var(--twoip-surface-container-high);
  background-image: none;
  box-shadow: none;
  text-decoration: none;
  white-space: normal;
  overflow-wrap: anywhere;
  transition: background-color .15s ease;
}
body :is(.twoip-tabs,.t3-isotope-menu .module-ct > .row) :is(.twoip-tab,.t3-isotope-menu button > span):is(.active,[aria-selected="true"]),
body :is(.twoip-tabs,.t3-isotope-menu .module-ct > .row) .is-checked > :is(.twoip-tab,.t3-isotope-menu button > span) { color: var(--twoip-primary); background: var(--twoip-primary-container); font-weight: 600; }
body :is(.twoip-tabs,.t3-isotope-menu .module-ct > .row) :is(.twoip-tab,.t3-isotope-menu button > span):hover { background: var(--twoip-primary-container); }
body :is(.twoip-tabs,.t3-isotope-menu .module-ct > .row) :is(.twoip-tab,.t3-isotope-menu button > span):active { background: var(--twoip-primary-container); }
body :is(.twoip-tabs,.t3-isotope-menu .module-ct > .row) :is(.twoip-tab,.t3-isotope-menu button > span):focus-visible { outline: 2px solid var(--twoip-primary); outline-offset: 3px; }
body :is(.twoip-tabs,.t3-isotope-menu .module-ct > .row) :is(.twoip-tab,.t3-isotope-menu button > span) .twoip-icon {
  color: currentColor;
  position: static;
  margin: 0;
  font-size: 16px;
  line-height: 1;
  flex-shrink: 0;
}
body :is(.twoip-tabs,.t3-isotope-menu .module-ct > .row) :is(.twoip-tab,.t3-isotope-menu button > span):is(.disabled,[aria-disabled="true"]), body :is(.twoip-tabs,.t3-isotope-menu .module-ct > .row) .disabled > :is(.twoip-tab,.t3-isotope-menu button > span) { opacity: .5; pointer-events: none; }

body :is(.twoip-tabs,.t3-isotope-menu .module-ct > .row) input:checked + .twoip-tab {
  color: var(--twoip-primary);
  background: var(--twoip-primary-container);
  font-weight: 600;
}
body .twoip-tabs--choice input:disabled + .twoip-tab {
  opacity: .5;
  cursor: default;
}
body .twoip-tabs--choice input:focus-visible + .twoip-tab {
  outline: 2px solid var(--twoip-primary);
  outline-offset: 3px;
}
body .twoip-tabs--choice .twoip-tab {
  cursor: pointer;
}

body .tagspopular ul > li > a, body .twoip-label { border-radius: var(--twoip-radius-small); }
body .t3-mainbody .t3-content table.table,
body .modal table.table {
  --bs-table-color: var(--twoip-on-surface); --bs-table-bg: transparent;
  --bs-table-striped-bg: var(--twoip-surface-container-high); --bs-table-hover-bg: var(--twoip-surface-container-high);
  --bs-table-striped-color: var(--twoip-on-surface); --bs-table-hover-color: var(--twoip-on-surface);
  --bs-table-active-bg: var(--twoip-primary-container); --bs-table-active-color: var(--twoip-on-primary-container);
  --bs-table-border-color: var(--twoip-outline-variant);
  font-size: 15px;
}
body .t3-mainbody .t3-content table.table :is(th,td),
body .modal table.table :is(th,td) { padding: 8px 10px; border-color: var(--twoip-outline-variant); vertical-align: middle; }
/* First-party data cells share one left axis, including vendor numeric and
   Bootstrap alignment utilities (!important). Layout/permission matrices opt out. */
body :is(.t3-content,.modal) table:not([role="presentation"]):not(.twoip-table-permission-matrix) :is(th,td) {
  text-align: left !important;
  padding-inline: 10px;
}
body :is(.t3-content,.modal) table.dataTable.dtr-inline.collapsed :is(th.twoip-table-disclosure-column,td.dtr-control) {
  padding-inline-start: 30px;
}
/* Ordinary words wrap at natural boundaries; responsive strategy owns fit. */
body :is(.t3-content,.modal) table.table :is(th,td) {
  word-break: normal;
  overflow-wrap: normal;
}
body .dt-bootstrap5 table.dataTable {
  table-layout: auto;
}
body .dt-bootstrap5 table.dataTable .dt-column-title {
  min-width: 0;
  word-break: normal;
  overflow-wrap: normal;
}
/* A primary entity column retains enough space for ordinary names. */
body .dt-bootstrap5 table.dataTable .twoip-table-entity {
  min-width: 10rem;
}
body .twoip-table-comparison .twoip-table-number,
body .dt-bootstrap5 table.dataTable td.dt-type-numeric {
  white-space: nowrap;
}
/* Keep the available table width stable when responsive rows change height. */
body .modal-body:has(.dt-container) {
  scrollbar-gutter: stable;
}
/* Utilities reflow by their container, including narrow desktop modals. */
body .dt-bootstrap5 > .dt-layout-row:not(.dt-layout-table) {
  gap: 8px 0;
}
body .dt-bootstrap5 > .dt-layout-row:not(.dt-layout-table) > .dt-layout-cell {
  flex: 1 1 auto;
  min-width: min(100%, 18rem);
  max-width: 100%;
}
body .dt-bootstrap5 .dt-length {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
body .dt-bootstrap5 .dt-length label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
body .dt-bootstrap5 .dt-search {
  min-width: 0;
}
body .dt-bootstrap5 .dt-search input {
  max-width: 100%;
}
body .t3-mainbody .t3-content table.table > thead > tr > th,
body .modal table.table > thead > tr > th {
  color: var(--twoip-on-surface-variant); background: var(--twoip-surface-container);
  border-bottom: 1px solid var(--twoip-outline-variant); font-size: 15px; font-family: '2ip-bold'; font-weight: normal;
}
body :is(.t3-content,.modal) table.table > tbody > tr:hover > * { --bs-table-bg-state: var(--twoip-surface-container-high); }
body :is(.t3-content,.modal) table.table > tbody > tr:is(.selected,.table-active) > * { --bs-table-bg-state: var(--twoip-primary-container); background: var(--twoip-primary-container); color: var(--twoip-on-primary-container); }
body :is(.t3-content,.modal) :is(.dt-info,.twoip-table-info) { color: var(--twoip-on-surface-variant); font-size: 14px; }
/* Joomla, custom/AJAX and DataTables pagers share one control family. */
body :is(.t3-mainbody .t3-content,.modal) .pagination {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end;
  gap: var(--twoip-pagination-gap); float: none; margin: 0; padding: 0; list-style: none;
}
body :is(.t3-mainbody .t3-content,.modal) .pagination::before,
body :is(.t3-mainbody .t3-content,.modal) .pagination::after { display: none; }
body :is(.t3-mainbody .t3-content,.modal) .pagination > li { flex: 0 0 auto; display: block; }
body :is(.t3-mainbody .t3-content,.modal) .pagination > li > :is(a,span,button,.page-link) {
  display: flex; align-items: center; justify-content: center; float: none;
  width: var(--twoip-pagination-size); min-width: var(--twoip-pagination-size);
  height: var(--twoip-pagination-size); min-height: var(--twoip-pagination-size);
  padding: 0; margin: 0; top: 0; border: 0; border-radius: var(--twoip-pagination-radius);
  line-height: 1; font-size: 15px; color: var(--twoip-pagination-foreground);
  background: transparent; box-shadow: none; text-decoration: none;
  transition: color .15s ease, background-color .15s ease;
}
/* Center the shared icon slot, independent of glyph width or account typography. */
body :is(.t3-mainbody .t3-content,.modal) .pagination .twoip-icon {
  display: flex; align-items: center; justify-content: center;
  width: 1em; height: 1em; flex: 0 0 auto;
  padding: 0; margin: 0; position: static; line-height: 1;
}
body :is(.t3-mainbody .t3-content,.modal) .pagination > li.active > :is(a,span,button,.page-link),
body :is(.t3-mainbody .t3-content,.modal) .pagination [aria-current="page"] {
  color: var(--twoip-pagination-active-foreground); background: var(--twoip-pagination-active);
}
body :is(.t3-mainbody .t3-content,.modal) .pagination > li:not(.disabled) > :is(a,button,.page-link):hover { background: var(--twoip-pagination-hover); color: var(--twoip-pagination-active-foreground); }
body :is(.t3-mainbody .t3-content,.modal) .pagination > li:not(.disabled) > :is(a,button,.page-link):active { background: var(--twoip-pagination-active); }
body :is(.t3-mainbody .t3-content,.modal) .pagination > li.disabled > :is(a,span,button,.page-link) { color: var(--twoip-pagination-disabled); opacity: .5; pointer-events: none; background: transparent; }
body .t3-content .twoip-table-footer { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 12px; }
body .t3-content .twoip-table-footer > :first-child { flex: 1 1 auto; width: auto; }
body .t3-content .twoip-table-footer > :last-child { flex: 0 0 auto; width: auto; max-width: 100%; }
body .t3-content .twoip-table-footer.row { margin-inline: 0; }
body .t3-content .twoip-table-footer.row > * { padding-inline: 0; }
body .t3-content .twoip-table-paging { float: none !important; margin-inline-start: auto; }
@media (max-width: 767px) {
  body .t3-content .twoip-table-footer > :last-child { flex: 1 1 100%; }
  body :is(.t3-mainbody .t3-content,.modal) .pagination:not(.dt-paging .pagination) > li:not(.active):not(:nth-child(-n+2)):not(:nth-last-child(-n+2)) { display: none; }
}
body .dt-container :is(.dt-info,.dt-length,.dt-search) { color: var(--twoip-on-surface-variant); font-size: 14px; }
body .t3-sl-helper .t3-sl-helper-wrap { border-radius: var(--twoip-radius-medium); box-shadow: none; }
body .t3-mainbody .t3-content .nav:not(.twoip-tabs) .twoip-icon { color: var(--twoip-primary); }

/* Dialogs and feedback share surfaces, states and color roles. */
body .modal .modal-content {
  color: var(--twoip-on-surface); background: var(--twoip-surface);
  border: 0; border-radius: var(--twoip-radius-large); box-shadow: var(--twoip-elevation-2);
}
body .modal .modal-header { padding: 16px 20px; border-bottom: 1px solid var(--twoip-outline-variant); }
body .modal .modal-title { font-size: 22px; line-height: 1.3; }
body .modal .modal-body { padding: 16px 20px; }
body .modal .modal-footer { display: flex; align-items: center; padding: 12px 20px 16px; border-color: var(--twoip-outline-variant); gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
body .modal .modal-footer form { margin: 0; }
body .modal .modal-footer .btn { margin: 0; }
body :is(.tooltip-inner,.popover) { border-radius: var(--twoip-radius-small); font-size: 14px; }
body .tooltip-inner { background: var(--twoip-on-surface); color: var(--twoip-surface); padding: 6px 10px; }
body .popover { background: var(--twoip-surface); border-color: var(--twoip-outline-variant); box-shadow: var(--twoip-elevation-2); }
body .popover-header { background: var(--twoip-surface-container); }
body .alert {
  --twoip-status-ink: var(--twoip-on-primary-container); --twoip-status-fill: var(--twoip-primary-container);
  color: var(--twoip-status-ink); background: var(--twoip-status-fill); border: 1px solid var(--twoip-outline-variant);
  border-radius: var(--twoip-radius-medium); box-shadow: none;
}
body .alert.alert-success { --twoip-status-ink: var(--twoip-success); --twoip-status-fill: var(--twoip-success-container); }
body .alert.alert-warning { --twoip-status-ink: var(--twoip-warning); --twoip-status-fill: var(--twoip-warning-container); }
body .alert.alert-danger { --twoip-status-ink: var(--twoip-error); --twoip-status-fill: var(--twoip-error-container); }
body .alert .twoip-icon { color: inherit; }
body .alert .twoip-inline-link { --twoip-link-text: var(--twoip-status-ink); --twoip-link-border: var(--twoip-status-ink); }
body .alert :is(a:not(.twoip-inline-link),.alert-link:not(.twoip-inline-link),.copy-clipboard-alert:not(.twoip-icon-action) .twoip-icon) { color: inherit; }
body #system-message-container joomla-alert {
  --jui-alert-border-radius: 12px; --jui-alert-button-color-dark: var(--twoip-on-surface-variant);
  color: var(--twoip-on-primary-container); background: var(--twoip-primary-container);
  border-color: var(--twoip-outline-variant); border-left-color: var(--twoip-primary); box-shadow: none;
  font-family: "2ip";
}
body #system-message-container joomla-alert[type=success] { color: var(--twoip-success); background: var(--twoip-success-container); border-left-color: var(--twoip-success); }
body #system-message-container joomla-alert[type=warning] { color: var(--twoip-warning); background: var(--twoip-warning-container); border-left-color: var(--twoip-warning); }
body #system-message-container joomla-alert[type=danger] { color: var(--twoip-error); background: var(--twoip-error-container); border-left-color: var(--twoip-error); }
body #system-message-container joomla-alert .alert-heading { color: inherit; }
body #system-message-container joomla-alert .joomla-alert--close { border-radius: var(--twoip-radius-full); color: inherit; }
body .progress { border-radius: var(--twoip-radius-full); background: var(--twoip-surface-container-high); box-shadow: none; }
body .progress-bar { background-color: var(--twoip-primary); box-shadow: none; }
body .progress-bar-success { background-color: var(--twoip-success); }
body .progress-bar-danger { background-color: var(--twoip-error); }
body a.totop > .twoip-icon { display: flex; align-items: center; justify-content: center; width: 1em; height: 1em; font-size: inherit; line-height: 1; margin: 0; color: currentColor; }
body a.totop { width: 55px; height: 55px; border: 1px solid var(--twoip-outline-variant); border-radius: var(--twoip-radius-medium); background: var(--twoip-surface); color: var(--twoip-primary); box-shadow: var(--twoip-elevation-1); transition: background-color .15s ease, box-shadow .15s ease; }
@media (max-width: 480px) {
  body .modal .modal-body, body .modal .modal-header { padding: 14px 16px; }
  body .modal .modal-footer { padding: 10px 16px 14px; }
}

/* Gauge typography remains owned by the shared speedometer component. */
body #t3-mainnav .sidebar-nav .hang::before { color: var(--twoip-on-surface-variant); }
body #t3-mainnav .sidebar-nav > li:is(.active,.open) > a .hang::before { color: inherit; }
/* Dark shared consumers stay readable without altering specialized workflows. */
:root[data-theme="dark"] body :is(.t3-off-canvas-body,.modal-content,.dropdown-menu,.twoip-panel:not(.twoip-accordion-item),.twoip-well,.input-group > .input-group-text) {
  background-color: var(--twoip-surface);
  color: var(--twoip-on-surface);
  border-color: var(--twoip-outline-variant);
}
:root[data-theme="dark"] body :is(.table,.table-responsive,.twoip-panel-heading:not(.twoip-inline-link):not(.twoip-accordion-trigger),.twoip-panel-footer,.modal-header,.modal-footer) {
  color: var(--twoip-on-surface);
  border-color: var(--twoip-outline-variant);
}
:root[data-theme="dark"] body .table { --bs-table-color: var(--twoip-on-surface); --bs-table-bg: var(--twoip-surface); --bs-table-striped-bg: var(--twoip-surface-container-high); --bs-table-striped-color: var(--twoip-on-surface); --bs-table-hover-color: var(--twoip-on-surface); --bs-table-hover-bg: var(--twoip-surface-container-high); }


/* Integrated groups; desktop service lists use a separate, readable flyout. */
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav .twoip-submenu li { min-width: 0; background: transparent; }
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav .twoip-submenu li > a { padding: 6px; background: transparent; color: var(--twoip-on-surface); }
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav .twoip-submenu li > a:is(:hover,:focus-visible),
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav .twoip-submenu li:is(.open,.active) > a { background: var(--twoip-primary-container); color: var(--twoip-on-primary-container); }
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav .twoip-submenu { list-style: none; display: none; }
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav .open > .twoip-submenu { display: block; }
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav > li > .twoip-submenu > li > a { min-height: var(--twoip-navigation-group-height); padding: 6px; line-height: 19px; font-size: 14px; gap: 6px; border-radius: var(--twoip-radius-small); align-items: center; }
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav [hidden] { display: none !important; }
/* A drawer avoids compressing technical navigation into the narrow desktop column. */
@media (min-width: 992px) and (max-width: 1099px) {
  body #t3-mainnav { display: none; }
  body .t3-header .mobile-top-menu { display: block !important; }
  body .t3-header .account-lg { display: none !important; }
  body .t3-header .account-mob { display: block !important; }
  body .twoip-content-column { margin-left: 0; width: 100%; }
}

@media (min-width: 1100px) {
  body #t3-mainnav .twoip-sidebar-column { width: var(--twoip-sidebar-width); }
  body #t3-mainnav .t3-navbar { width: var(--twoip-sidebar-width); right: auto; }
  body .twoip-content-column { margin-left: calc(var(--twoip-sidebar-width) + var(--twoip-shell-gap)); width: calc(100% - var(--twoip-sidebar-width) - var(--twoip-shell-gap)); }
  body #t3-mainnav .sidebar-nav > li > .twoip-submenu { position: relative; }
  body #t3-mainnav .sidebar-nav > li.open > .twoip-submenu { display: grid; grid-auto-rows: 1fr; }
  body #t3-mainnav .sidebar-nav > li > .twoip-submenu > li > a { height: 100%; }
  body #t3-mainnav .sidebar-nav > li > .twoip-submenu > li > a > .hang::before { content: "\f054"; font-size: 12px; color: var(--twoip-on-surface-variant); }
  body #t3-mainnav .sidebar-nav > li > .twoip-submenu > li > a:is(:hover,:focus-visible,[aria-expanded="true"]) > .hang::before { color: inherit; }
  body #t3-mainnav .sidebar-nav > li > .twoip-submenu > li > .twoip-submenu {
    position: absolute; inset-inline-start: calc(100% + 12px); top: var(--twoip-flyout-offset, 0px);
    width: var(--twoip-sidebar-width);
    height: auto; max-height: var(--twoip-flyout-max-height, none); overflow-y: var(--twoip-flyout-overflow, visible); margin: 0; padding: 8px;
    background: var(--twoip-surface-container-low); border: 1px solid var(--twoip-outline-variant);
    border-radius: var(--twoip-radius-medium); box-shadow: var(--twoip-elevation-2); z-index: 1050;
  }
  body #t3-mainnav .sidebar-nav > li > .twoip-submenu > li > .twoip-submenu a {
    min-height: 44px; padding: 8px 6px;
  }
}
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav > li { margin-bottom: 2px; }
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav .twoip-menu-label { hyphens: none; text-wrap: balance; }
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav .twoip-submenu { border-left-color: color-mix(in srgb, var(--twoip-outline-variant) 65%, transparent); }

body .ipblock .showip_mod .s-ipblockgrid > .twoip-hidden-xs { display: grid !important; }

@media (max-width: 359px) { body .ipblock .showip_mod :is(.ipblockgrid,.s-ipblockgrid) { grid-template-columns: minmax(0, 1fr); --twoip-info-rows: 8; } body .ipblock .showip_mod .s-ipblockgrid { --twoip-info-rows: 4; } }

body a.totop:is(:hover,:focus-visible) { background: var(--twoip-primary-container); color: var(--twoip-primary); border-color: var(--twoip-primary); box-shadow: var(--twoip-elevation-1); }
body a.totop:active { background: color-mix(in srgb, var(--twoip-primary-container) 75%, var(--twoip-primary)); color: var(--twoip-primary); box-shadow: var(--twoip-elevation-1); }

/* Export and destructive history actions share the existing button geometry. */
body .item-page_cabinet .row:has(> .export):has(> .history) { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 12px; margin-inline: 0; }
body .item-page_cabinet .row:has(> .export):has(> .history) > :is(.export,.history) { width: auto; padding: 0; display: flex; align-items: center; }
@media (max-width: 767px) { body .item-page_cabinet .row:has(> .export):has(> .history) > :is(.export,.history) { flex: 1 1 100%; } body .item-page_cabinet :is(.export,.history) .btn { width: 100%; } }

body :is(.t3-mainbody .t3-content,.modal) .dt-container .dt-layout-row:has(.dt-paging) { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-inline: 0; }
body :is(.t3-mainbody .t3-content,.modal) .dt-container .dt-layout-row:has(.dt-paging) > .dt-layout-cell { padding-inline: 0; }
body :is(.t3-mainbody .t3-content,.modal) .dt-container .dt-layout-row:has(.dt-paging) > .dt-layout-start { width: auto; flex: 1 1 auto; }
body :is(.t3-mainbody .t3-content,.modal) .dt-container .dt-layout-row:has(.dt-paging) > .dt-layout-end { width: auto; flex: 0 0 auto; max-width: 100%; }
@media (max-width: 767px) {
  body :is(.t3-mainbody .t3-content,.modal) .dt-container .dt-layout-row:has(.dt-paging) { margin-inline: 0; }
  body :is(.t3-mainbody .t3-content,.modal) .dt-container .dt-layout-row:has(.dt-paging) > :is(.dt-layout-start,.dt-layout-end) { flex: 1 1 100%; width: 100%; padding-inline: 0; }
  body :is(.t3-mainbody .t3-content,.modal) .dt-paging { width: 100%; }
}

/* All material bodies fill their allocated content column; component internals keep their own scale. */
body .t3-content :is(.article-content,.article-intro,.category-desc) {
  inline-size: 100%; max-inline-size: none; min-inline-size: 0; margin-inline: 0;
}
/* Article media stays responsive; technical overflow stays local. */
body .item-page_blog .article-content :is(img,video,iframe,svg) { max-width: 100%; }
body .item-page_blog .article-content pre { max-width: 100%; overflow-x: auto; white-space: pre; }
body .item-page_blog .article-content :is(p,li,td,a) { overflow-wrap: break-word; }
body .item-page_blog .article-content table { max-width: 100%; }

/* Keep scrolling inside dialog content; avoid a second shell scrollbar. */
body .modal:has(> .modal-dialog-centered.modal-dialog-scrollable) { overflow-y: hidden; }
/* Ordinary Bootstrap dialogs use viewport centering and bounded body scrolling. */
body .modal-dialog-centered.modal-dialog-scrollable {
  min-height: calc(100% - var(--bs-modal-margin) * 2);
  height: calc(100% - var(--bs-modal-margin) * 2);
  margin-inline: auto;
}
body .modal-dialog-centered.modal-dialog-scrollable .modal-content { width: 100%; height: auto; max-height: 100%; }
body .modal-dialog-centered.modal-dialog-scrollable .modal-body { overflow-y: auto; }
@media (max-width: 575px) {
  body .modal-dialog-centered.modal-dialog-scrollable { width: calc(100% - var(--bs-modal-margin) * 2); }
}

/* Existing Raty owner: one geometry for SSR, AJAX and radio-derived summaries. */
body .rating { display: inline-flex; align-items: center; vertical-align: middle; flex-wrap: nowrap; flex-shrink: 0; gap: var(--twoip-rating-star-gap); font-size: var(--twoip-rating-star-size); line-height: 1; white-space: nowrap; }
body .rating > .twoip-icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 var(--twoip-rating-star-size); width: var(--twoip-rating-star-size); height: var(--twoip-rating-star-size); font-size: var(--twoip-rating-star-size); line-height: 1; margin: 0; padding: 0; position: static; transform: none; box-sizing: border-box; }
/* Explicit provider summary exception: retain pre-standardization 160%/130% geometry. */
body .twoip-rating--summary { font-size: var(--twoip-rating-summary-font-size); line-height: 1.6; }
body .twoip-rating--summary > .rating { font-size: inherit; line-height: inherit; align-items: normal; vertical-align: baseline; gap: 0; }
body .twoip-rating--summary > .rating > .twoip-icon { display: inline-block; flex: 0 0 auto; width: var(--fa-width, 1em); height: auto; font-size: var(--twoip-rating-summary-star-size); line-height: 1; margin-right: var(--twoip-rating-summary-star-spacing); }
/* Filled/half and empty keep their existing semantic gold tokens. */
.rating :is(.star-on,.star-half), .rating :is(.star-on,.star-half)::before { color: var(--twoip-rating-filled); }
.rating :is(.star,.star-off), .rating :is(.star,.star-off)::before { color: var(--twoip-rating-outline); }
.rating :focus-visible { outline-color: var(--twoip-warning); }

/* Compact labelled filters reuse selector geometry without becoming action buttons. */
body .twoip-select-control {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding-block: 9px;
  padding-inline-start: var(--twoip-control-padding-inline);
  padding-inline-end: var(--twoip-select-trailing-inset);
  gap: var(--twoip-select-icon-gap);
  font-size: var(--twoip-type-body);
  color: var(--twoip-on-surface);
  background: var(--twoip-surface);
  border: 1px solid var(--twoip-outline);
  border-radius: var(--twoip-radius-small);
  cursor: pointer;
  max-width: 100%;
  min-width: 0;
  text-align: start;
}
body .twoip-select-control > :not(.twoip-disclosure-arrow) {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body .twoip-select-control .twoip-icon {color:currentColor;font-size:16px;position:static;margin:0;flex:none}
body .twoip-select-control:is(:hover,:active) {background:var(--twoip-primary-container);color:var(--twoip-on-primary-container)}
body .twoip-select-control:focus-visible {outline:2px solid var(--twoip-primary);outline-offset:3px}
body .twoip-selector-label {color:var(--twoip-on-surface-variant);flex:none}
body .twoip-filter-group {display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
body .twoip-filter-row {align-items:center;row-gap:12px}
body .text-end .twoip-filter-group {justify-content:flex-end}
body .twoip-selector-list .dropdown-item {border:0;text-decoration:none;background-image:none}
@media(max-width:767px) {body .text-end .twoip-filter-group {justify-content:flex-start}}

/* Icon actions share a native hit area, independently of glyph shape or label buttons. */
body .twoip-icon-action {
  --twoip-icon-action-ink: var(--twoip-primary);
  --twoip-icon-action-container: var(--twoip-primary-container);
  --twoip-icon-action-on-container: var(--twoip-on-primary-container);
}
body .twoip-icon-action,
body .btn.btn.twoip-icon-action {
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 44px; box-sizing: border-box; width: 44px; height: 44px; min-width: 44px; min-height: 44px;
  padding: 0; margin: 0; border: 0; border-radius: var(--twoip-radius-full);
  background: transparent; color: var(--twoip-icon-action-ink); text-decoration: none;
  line-height: 1; vertical-align: middle; cursor: pointer;
  transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
}
body .twoip-icon-action.twoip-destructive-control {
  --twoip-icon-action-ink: var(--twoip-error); --twoip-icon-action-container: var(--twoip-error-container);
  --twoip-icon-action-on-container: var(--twoip-error);
}
body .twoip-icon-action--warning {
  --twoip-icon-action-ink: var(--twoip-warning); --twoip-icon-action-container: var(--twoip-warning-container);
  --twoip-icon-action-on-container: var(--twoip-on-warning-container);
}
body .twoip-icon-action--success {
  --twoip-icon-action-ink: var(--twoip-success); --twoip-icon-action-container: var(--twoip-success-container);
  --twoip-icon-action-on-container: var(--twoip-success);
}
body .twoip-icon-action > .twoip-icon {
  display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px;
  position: static; margin: 0; padding: 0; color: currentColor; font-size: 20px; line-height: 1; transform: none;
}
body .twoip-icon-action:not(:disabled):not(.disabled):not([aria-disabled="true"]):not(.not-allowed):is(:hover,:focus-visible,:active) {
  background: var(--twoip-icon-action-container); color: var(--twoip-icon-action-on-container);
}
body .twoip-icon-action:focus-visible { outline: 2px solid var(--twoip-icon-action-ink); outline-offset: 2px; }
body .twoip-icon-action:not(:disabled):not(.disabled):not([aria-disabled="true"]):active { box-shadow: inset 0 0 0 2px var(--twoip-icon-action-ink); }
body .twoip-icon-action:is(:disabled,.disabled,[aria-disabled="true"]) { opacity: .38; cursor: default; box-shadow: none; }
body .t3-mainbody .t3-content table.table :is(th,td).twoip-action-cell,
body .modal table.table :is(th,td).twoip-action-cell { vertical-align: middle; }
body .t3-mainbody .t3-content table.table tbody td.twoip-action-cell,
body .modal table.table tbody td.twoip-action-cell { padding-block: 0; }

body .twoip-icon-action.active { background: var(--twoip-icon-action-container); color: var(--twoip-icon-action-on-container); }

/* Ordinary account icons reuse shared geometry and states; semantic variants stay authoritative. */
body .account :is(h2 > .twoip-icon,.account-info-icon) { color: var(--twoip-account-primary); position: static; }
body .account .twoip-icon-action:not(.twoip-destructive-control):not(.twoip-icon-action--warning):not(.twoip-icon-action--success) { --twoip-icon-action-ink: var(--twoip-account-primary); }
body .item-page_speedtest :is(.fa-circle-info,.fa-circle-question):not(.twoip-icon-action .twoip-icon):not(.alert .twoip-icon) { color: var(--twoip-account-primary); display: inline-flex; align-items: center; justify-content: center; line-height: 1; }

/* Shared navigation/utility geometry; component surfaces have separate owners. */
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav :is(a.twoip-sidebar-link,a.twoip-navigation-link) {
  display: flex; align-items: center; min-height: 44px; margin-top: 12px; padding: 8px 10px;
  font-family: "2ip"; font-size: 16px; line-height: 22px;
  text-decoration: none; box-shadow: none;
}
/* Tonal surfaces belong to utility links and inline header pills, never main sidebar navigation. */
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav a.twoip-sidebar-link,
body #t3-mainnav.twoip-navigation--inline .sidebar-nav a.twoip-navigation-link {
  color: var(--twoip-on-surface-variant); background: var(--twoip-surface-container-low);
  border: 0; border-radius: var(--twoip-radius-medium);
  transition: color .15s ease, background-color .15s ease;
}
body #t3-mainnav.twoip-navigation--inline .sidebar-nav a.twoip-navigation-link:is(:hover,:focus-visible) {
  color: var(--twoip-on-primary-container); background: var(--twoip-primary-container);
}
body #t3-mainnav.twoip-navigation--inline .sidebar-nav a.twoip-navigation-link:active { background: var(--twoip-surface-container-high); }
body :is(#t3-mainnav,#t3-off-canvas) :is(.twoip-sidebar-link,.twoip-navigation-link) .twoip-menu-label { display: flex; align-items: center; gap: 8px; }
body :is(#t3-mainnav,#t3-off-canvas) :is(.twoip-sidebar-link,.twoip-navigation-link) .twoip-icon {
  display: grid; place-items: center; flex: 0 0 18px; width: 18px; height: 18px;
  font-size: 18px; line-height: 1; color: currentColor; margin: 0; position: static;
}
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav a.twoip-sidebar-link:is(:hover,:focus-visible),
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav > li:is(.active,.current) > .twoip-sidebar-link,
body :is(#t3-mainnav,#t3-off-canvas) .twoip-sidebar-utilities > li:is(.active,.current) > .twoip-sidebar-link {
  color: var(--twoip-on-primary-container); background: var(--twoip-primary-container);
}
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav a.twoip-sidebar-link:active { background: var(--twoip-surface-container-high); }
body :is(#t3-mainnav,#t3-off-canvas) .twoip-sidebar-link:focus-visible,
body #t3-mainnav.twoip-navigation--inline .twoip-navigation-link:focus-visible { outline: 2px solid var(--twoip-primary); outline-offset: 3px; }

/* Native switch primitive: checked means enabled/success, not a primary action. */
body .twoip-switch-label { display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 0; font: inherit; color: var(--twoip-on-surface); cursor: pointer; }
body input.twoip-switch[type="checkbox"] {
  appearance: none; position: relative; flex: 0 0 44px; width: 44px; height: 44px;
  margin: 0; padding: 0; border: 0; border-radius: var(--twoip-radius-small);
  background: transparent; box-shadow: none; cursor: pointer; vertical-align: middle;
}
body input.twoip-switch::before { content: ""; position: absolute; width: 40px; height: 24px; left: 2px; top: 10px; box-sizing: border-box; border: 1px solid var(--twoip-outline); border-radius: 24px; background: var(--twoip-surface-container-high); }
body input.twoip-switch::after { content: ""; position: absolute; width: 16px; height: 16px; left: 6px; top: 14px; border-radius: 50%; background: var(--twoip-on-surface-variant); transition: left .15s ease, background-color .15s ease, box-shadow .15s ease; }
body input.twoip-switch:checked::before { background: var(--twoip-success-container); border-color: var(--twoip-success); }
body input.twoip-switch:checked::after { left: 22px; background: var(--twoip-success); }
body input.twoip-switch:not(:disabled):is(:hover,:focus-visible)::after { box-shadow: 0 0 0 6px color-mix(in srgb, var(--twoip-on-surface-variant) 16%, transparent); }
body input.twoip-switch:checked:not(:disabled):is(:hover,:focus-visible)::after { box-shadow: 0 0 0 6px color-mix(in srgb, var(--twoip-success) 16%, transparent); }
body input.twoip-switch:not(:disabled):active::after { box-shadow: 0 0 0 7px color-mix(in srgb, var(--twoip-on-surface-variant) 24%, transparent); }
body input.twoip-switch:checked:not(:disabled):active::after { box-shadow: 0 0 0 7px color-mix(in srgb, var(--twoip-success) 24%, transparent); }
body input.twoip-switch:focus-visible { outline: 2px solid var(--twoip-outline); outline-offset: 2px; }
body input.twoip-switch:checked:focus-visible { outline-color: var(--twoip-success); }
body input.twoip-switch:disabled { cursor: default; opacity: 1; }
body .twoip-switch-label:has(.twoip-switch:disabled) { cursor: default; }
@media (prefers-reduced-motion: reduce) { body input.twoip-switch::after { transition: none; } }

/* Opt-in bounded metadata; prose never opts in. */
/* Compact values opt in at owned render boundaries; prose retains normal wrapping. */
.twoip-truncate {
  display: inline-block;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
}
.twoip-compact-content { min-width: 0; max-width: 100%; }
.twoip-compact-content:has(> .twoip-icon) { display: flex; align-items: baseline; }
.twoip-compact-content > .twoip-icon { flex-shrink: 0; }
.twoip-compact-content > .twoip-truncate { min-width: 0; }
.twoip-compact-link { min-width: 0; max-width: 100%; }
.twoip-compact-link:not(.twoip-truncate) { display: inline-flex; }
.twoip-compact-link > .twoip-inline-label { min-width: 0; }
.twoip-compact-cell > .twoip-truncate { max-width: var(--twoip-compact-cell-max, 24rem); }
.twoip-compact-table:not(.dataTable):not(.twoip-table-comparison) {
  table-layout: fixed;
  width: 100%;
}
.twoip-compact-table:not(.dataTable):not(.twoip-table-comparison) .twoip-compact-cell > .twoip-truncate {
  max-width: 100%;
}
.twoip-truncate--mobile { white-space: normal; overflow: visible; text-overflow: clip; }
@media (max-width: 767.98px) {
  .twoip-truncate--mobile { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .twoip-compact-cell > .twoip-truncate { max-width: min(var(--twoip-compact-cell-max, 24rem), 44vw); }
}
.twoip-truncate-tooltip { --bs-tooltip-max-width: min(350px, calc(100vw - 24px)); }
.twoip-truncate-tooltip .tooltip-inner { overflow-wrap: anywhere; }

/* Native monitoring image geometry; source selection belongs to theme.js. */
body .twoip-themed-graph {
  display: block;
}
body .twoip-themed-graph img {
  display: block;
  width: 100%;
  height: auto;
}


/* Compact supplementary actions share one accessible, wrapping presentation. */
body .twoip-form-support {
  padding: 12px;
  border: 1px solid var(--twoip-outline-variant);
  border-radius: var(--twoip-radius-small);
  background: var(--twoip-surface-container-low);
}
.twoip-compact-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-block: 8px;
}
body .twoip-compact-action {
  min-width: 44px;
  min-height: 44px;
  padding: 6px 10px;
  border: 1px solid var(--twoip-outline);
  border-radius: var(--twoip-radius-small);
  background: transparent;
  color: var(--twoip-on-surface-variant);
  font: inherit;
  cursor: pointer;
}
body .twoip-compact-action:is(:hover,[aria-pressed="true"]) {
  background: var(--twoip-primary-container);
  border-color: var(--twoip-primary);
  color: var(--twoip-on-primary-container);
}
body .twoip-compact-action:focus-visible {
  outline: 2px solid var(--twoip-primary);
  outline-offset: 2px;
}
body .twoip-compact-action:disabled {
  opacity: .5;
  cursor: not-allowed;
}

/* Result status ink is independent of action/button presentation. */
body .twoip-icon[data-twoip-status="success"] {
  --twoip-status-color: var(--twoip-success);
  color: var(--twoip-status-color);
}
body .twoip-icon[data-twoip-status="error"] {
  --twoip-status-color: var(--twoip-error);
  color: var(--twoip-status-color);
}
body .twoip-icon[data-twoip-status="info"] {
  --twoip-status-color: var(--twoip-primary);
  color: var(--twoip-status-color);
}

.twoip-result-surface,
.twoip-loading-surface {
  background-color: var(--twoip-surface);
}
.twoip-result-divider {
  border-right: 1px solid var(--twoip-outline-variant);
}
.twoip-result-error {
  background-color: var(--twoip-error-container);
}

/* Desktop navigation is a compact group with fixed internal icon slots. */
body #t3-mainnav .sidebar-nav { column-gap: var(--twoip-navigation-desktop-gap); }
body #t3-mainnav .sidebar-nav > li > a.twoip-sidebar-link,
body #t3-mainnav .twoip-sidebar-utilities > li > a.twoip-sidebar-link { margin: 0; gap: var(--twoip-navigation-item-gap); padding: 8px var(--twoip-navigation-inline-padding); }
body #t3-mainnav .sidebar-nav > [class*="twoip-menu-role-"] > a::before { display: grid; place-items: center; height: var(--twoip-navigation-icon-slot); line-height: 1; }

:root { --twoip-navigation-item-gap: 8px; --twoip-navigation-inline-padding: 10px; --twoip-navigation-icon-slot: 20px; }

/* Resilient header variant: shared chrome, no ad/module/runtime dependency. */
body .twoip-resilient-header .twoip-header-row {
  padding-block: 0;
}
.twoip-resilient-header__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--twoip-navigation-item-gap);
  min-width: 0;
}
.twoip-resilient-header__nav .sidebar-nav {
  display: flex;
  align-items: center;
  gap: var(--twoip-navigation-item-gap) var(--twoip-navigation-desktop-gap);
  list-style: none;
  padding: 0;
  margin: 0;
}
.twoip-resilient-header__drawer .sidebar-nav {
  list-style: none;
  padding: 0;
  margin: 0;
}
.twoip-resilient-header .twoip-mobile-menu-trigger {
  display: none;
}
.twoip-resilient-header__drawer {
  display: flex;
  flex-direction: column;
  gap: var(--twoip-navigation-item-gap);
}
body .twoip-resilient-header [data-theme-mode-icon]::before {
  display: grid;
  place-items: center;
  width: 1em;
  height: 1em;
  line-height: 1;
}
@media (max-width: 1099px) {
body .twoip-resilient-header .twoip-header-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 4px;
    padding: 0 4px 0 0;
  }
.twoip-resilient-header__nav {
    display: none;
  }
body .twoip-resilient-header .twoip-error__logo { grid-column: 1; }
body .twoip-resilient-header .header-utilities { grid-column: 2; }
}

/* Inline navigation must not inherit the desktop sidebar width. */
body #t3-mainnav.twoip-navigation--inline .t3-navbar { width: auto; max-width: 100%; display: flex; align-items: center; }
body #t3-mainnav.twoip-navigation--inline .sidebar-nav { flex-wrap: wrap; justify-content: center; }
body #t3-mainnav.twoip-navigation--inline .sidebar-nav > li { display: flex; align-items: center; }
/* Desktop composition omits the Site group; the mobile drawer retains its destinations. */
body #t3-mainnav .sidebar-nav > li.twoip-menu-role-site { display: none; }

.twoip-language-fallback { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--twoip-navigation-item-gap); padding: 8px; }
.twoip-language-fallback a { display: inline-flex; align-items: center; min-height: 44px; }

/* Native radio item: one first-line slot, text slot and shared group geometry. */
:root { --twoip-radio-size: 18px; --twoip-radio-gap: 6px; --twoip-radio-target: 44px; --twoip-radio-group-gap: 12px 24px; }
body .twoip-radio { display: inline-flex; align-items: center; gap: var(--twoip-radio-gap); margin: 0; max-inline-size: 100%; }
body .twoip-radio > label { white-space: normal; display: inline-flex; align-items: flex-start; gap: var(--twoip-radio-gap); box-sizing: border-box; min-block-size: var(--twoip-radio-target); min-inline-size: var(--twoip-radio-target); max-inline-size: 100%; padding-block: max(0px, calc((var(--twoip-radio-target) - 1lh) / 2)); padding-inline: 0; margin: 0; position: static; text-align: start; cursor: pointer; }
body .twoip-radio .twoip-radio-control { display: flex; align-items: center; justify-content: center; flex: 0 0 var(--twoip-radio-size); inline-size: var(--twoip-radio-size); block-size: 1lh; position: static; }
body .twoip-radio .twoip-radio-text { display: block; flex: 1 1 auto; min-inline-size: 0; position: static; white-space: normal; word-break: normal; overflow-wrap: normal; }
body .twoip-radio input[type=radio] { appearance: auto; opacity: 1; position: static; flex: 0 0 var(--twoip-radio-size); inline-size: var(--twoip-radio-size); block-size: var(--twoip-radio-size); margin: 0; accent-color: var(--twoip-primary); cursor: pointer; pointer-events: auto; }
body .twoip-radio input[type=radio]:disabled, body .twoip-radio > label:has(input:disabled) { cursor: not-allowed; }
body .twoip-radio-group { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: flex-start; gap: var(--twoip-radio-group-gap); min-inline-size: 0; padding: 0; border: 0; }
body .twoip-radio-group--center { justify-content: center; }
body .twoip-radio-group--vertical { flex-direction: column; }
body .twoip-radio-group--grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(9rem,100%),1fr)); gap: 8px 16px; }
body .twoip-radio-group > .twoip-current-grid { flex: 0 1 auto; width: auto; padding: 0; margin: 0; min-inline-size: 0; }
body .twoip-radio-group > .twoip-current-grid > .twoip-form-group { margin: 0; padding: 0; }
body .twoip-radio-group > legend { flex-basis: 100%; }

body .twoip-radio-group .twoip-radio { margin: 0; padding: 0; min-block-size: 0; }

/* Compact diagnostic result list; Status.php owns tones, ResultList.php owns localized captions. */
body .twoip-result-list { display: grid; grid-template-columns: minmax(0,1fr); gap: 0 24px; margin-block: 16px; }
body .twoip-result-row { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,.75fr); align-items: center; gap: 12px; min-block-size: 64px; padding: 8px 16px; border: 0; border-block-end: 1px solid var(--twoip-outline-variant); border-radius: 0; background: transparent; box-shadow: none; font-size: var(--twoip-type-body); line-height: 1.4; }
body .twoip-result-name { min-inline-size: 0; color: var(--twoip-on-surface); overflow-wrap: anywhere; }
body .twoip-result-meta { display: flex; align-items: center; gap: 4px; color: var(--twoip-on-surface-variant); font-size: 85%; }
body .twoip-result-meta .flag { inline-size: 20px; block-size: auto; flex-shrink: 0; }
body .twoip-result-status { display: grid; grid-template-columns: 20px minmax(0,1fr); align-items: center; gap: 8px; min-inline-size: 0; color: var(--twoip-status-text); font-size: var(--twoip-type-label); }
body .twoip-result-status > :first-child { min-inline-size: 0; overflow-wrap: anywhere; }
body .twoip-result-status-icon { display: inline-flex; align-items: center; justify-content: center; inline-size: 20px; block-size: 20px; flex: 0 0 20px; color: var(--twoip-on-surface-variant); vertical-align: middle; }
body .twoip-result-status-icon .twoip-icon { display: inline-flex; align-items: center; justify-content: center; position: static; margin: 0; inline-size: 20px; block-size: 20px; font-size: 18px; line-height: 1; }
body .twoip-icon[data-twoip-status=warning] { color: var(--twoip-warning); }
@media (min-width: 992px) { body .twoip-result-list { grid-template-columns: repeat(2,minmax(0,1fr)); } }

body .twoip-result-heading { display: flex; align-items: center; gap: 4px; min-inline-size: 0; }
body :is(.twoip-result-name-text,.twoip-result-meta-text) { min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body .twoip-result-heading > [data-bs-toggle=tooltip] { display: inline-flex; align-items: center; flex-shrink: 0; }

/* GLOBAL SEMANTIC COLOR RULE: text is neutral; only status icons carry a tone. */
body .twoip-status { display: inline-flex; align-items: flex-start; gap: 8px; max-inline-size: 100%; color: var(--twoip-status-text); }
body .twoip-status-text { min-inline-size: 0; color: var(--twoip-status-text); }
body table:has([data-twoip-compact-status]):not(.dataTable):not(.twoip-table-comparison) { table-layout: fixed; inline-size: 100%; }
/* Compact status columns clip only captions; full content/summaries keep normal wrapping. */
body .twoip-status--compact { align-items: center; min-inline-size: 0; inline-size: 100%; }
body [data-twoip-compact-status]:not(:where(.alert *,.twoip-execution-summary *,.twoip-help-block *,.twoip-service-raw *,pre *,code *)) { min-width: 0; min-inline-size: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 1 1 auto; }
body [data-twoip-compact-status]:focus-visible { outline: 2px solid var(--twoip-link-focus); outline-offset: 2px; }
body .twoip-status-icon { display: inline-flex; align-items: center; justify-content: center; inline-size: 20px; block-size: 20px; flex: 0 0 20px; margin: 0; position: static; font-size: 18px; line-height: 1; }

body .twoip-icon[data-twoip-status=neutral] { color: var(--twoip-status-muted); }

/* Final execution surfaces: completion is green regardless of finding. */
body .alert.twoip-execution-summary[data-execution-state=completed] { --twoip-status-ink: var(--twoip-success); --twoip-status-fill: var(--twoip-success-container); }
body .alert.twoip-execution-summary[data-execution-state=error] { --twoip-status-ink: var(--twoip-error); --twoip-status-fill: var(--twoip-error-container); }
body .alert.twoip-execution-summary[data-execution-state=partial] { --twoip-status-ink: var(--twoip-warning); --twoip-status-fill: var(--twoip-warning-container); }
body .alert.twoip-execution-summary[data-execution-state=pending] { --twoip-status-ink: var(--twoip-on-primary-container); --twoip-status-fill: var(--twoip-primary-container); }
/* Port-check final cards deliberately reflect availability, not execution completion. */
body .alert.twoip-execution-summary.twoip-port-result[data-port-state=open] { --twoip-status-fill: var(--twoip-success-container); }
body .alert.twoip-execution-summary.twoip-port-result[data-port-state=closed] { --twoip-status-fill: var(--twoip-error-container); }
body .alert.twoip-execution-summary.twoip-port-result { --twoip-status-ink: var(--twoip-status-text); color: var(--twoip-status-text); }
body .twoip-port-result > .twoip-status { display: flex; align-items: center; justify-content: center; gap: var(--twoip-space-2, 8px); inline-size: fit-content; margin-inline: auto; }
/* Email primary final palette is binary; diagnostics retain raw SMTP uncertainty. */
body .alert.twoip-execution-summary.twoip-email-result { --twoip-status-ink: var(--twoip-status-text); color: var(--twoip-status-text); }
body .alert.twoip-execution-summary.twoip-email-result[data-email-state=rejected] { --twoip-status-fill: var(--twoip-error-container); }
body .twoip-email-result > .twoip-status { align-items: center; justify-content: center; }

/* One secondary-utility family, separate from ordinary menu/group density. */
:root { --twoip-sidebar-utility-gap: 12px; }
body :is(#t3-mainnav,#t3-off-canvas) .twoip-sidebar-utilities { display: grid; gap: var(--twoip-sidebar-utility-gap); list-style: none; padding: 0; margin: var(--twoip-sidebar-utility-gap) 0 0; }
body :is(#t3-mainnav,#t3-off-canvas) .twoip-sidebar-utilities > li { margin: 0; padding: 0; }
body :is(#t3-mainnav,#t3-off-canvas) .twoip-sidebar-utilities > li > a.twoip-sidebar-link { margin: 0; }

/* Informational promotion reuses utility geometry; its palette stays separate. */
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav a.twoip-sidebar-promo {
  --twoip-sidebar-promo-icon-size: calc(var(--twoip-navigation-icon-slot) + var(--twoip-sidebar-utility-gap));
  --twoip-sidebar-promo-hover: color-mix(in srgb, var(--twoip-on-primary-container) 8%, var(--twoip-primary-container));
  --twoip-sidebar-promo-pressed: color-mix(in srgb, var(--twoip-on-primary-container) 12%, var(--twoip-primary-container));
  color: var(--twoip-on-primary-container); background: var(--twoip-primary-container);
  margin-block-start: var(--twoip-sidebar-utility-gap); font-weight: 500; transition: none;
}
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav a.twoip-sidebar-promo:is(:hover,:focus-visible) { background: var(--twoip-sidebar-promo-hover); color: var(--twoip-on-primary-container); }
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav a.twoip-sidebar-promo:active { background: var(--twoip-sidebar-promo-pressed); }
body :is(#t3-mainnav,#t3-off-canvas) .twoip-sidebar-promo .twoip-menu-label { flex: 1; min-width: 0; }
body :is(#t3-mainnav,#t3-off-canvas) .twoip-sidebar-promo__icon {
  display: grid; place-items: center; flex: 0 0 var(--twoip-sidebar-promo-icon-size);
  width: var(--twoip-sidebar-promo-icon-size); height: var(--twoip-sidebar-promo-icon-size);
  border-radius: var(--twoip-radius-small);
  background: color-mix(in srgb, var(--twoip-primary) 12%, var(--twoip-primary-container));
}
body :is(#t3-mainnav,#t3-off-canvas) .twoip-sidebar-promo__text { flex: 1; min-width: 0; }

/* Shared header hierarchy: accent glyph/indicator, neutral ordinary label. */
body .t3-header .header-utilities :is(.twoip-language-toggle,.twoip-theme-toggle,.account a) > span:not(.twoip-icon) { color: var(--twoip-on-surface); }
body .t3-header .header-utilities :is(.twoip-language-toggle,.twoip-theme-toggle,.account a) .twoip-icon,
body .t3-header .header-utilities .account a.twoip-icon::before { color: var(--twoip-primary); }
body :is(#t3-mainnav,#t3-off-canvas) .sidebar-nav a.twoip-navigation-link { margin: 0; gap: var(--twoip-navigation-item-gap); padding: 8px var(--twoip-navigation-inline-padding); }
@media (max-width: 1099px) {
  body .t3-header .header-utilities .account a { padding: 0; }
}
@media (min-width: 768px) and (max-width: 1099px) {
  body .t3-header .header-utilities .account a { font-size: calc(var(--twoip-type-body) * 1.2); }
}

/* Narrow desktop chrome needs viewport space before the standard 1200px container step. */
@media (min-width: 1100px) and (max-width: 1199px) {
  body .t3-header > .container { width: calc(100% - 2 * var(--twoip-header-edge-inset)); max-width: none; }
  body .t3-header .twoip-header-row, body .t3-header .header-utilities { padding-inline: 0; }
}

@media (min-width: 1100px) {
  body .t3-header .logo { width: auto; padding: 0; margin: 0; text-align: left; }
  body .t3-header .header-ad-column { width: auto; padding-inline: 0; }
  body .t3-header .header-utilities { width: auto; grid-column: 3; }
}

/* Contextual result actions are compact; plain URLs keep their own text-link contract. */
.twoip-service-contextual-value { display: inline-flex; flex-wrap: nowrap; align-items: center; gap: 8px; white-space: nowrap; max-inline-size: 100%; min-inline-size: 0; }
.twoip-service-contextual-text { flex: 0 1 auto; min-inline-size: 0; white-space: normal; overflow-wrap: anywhere; }
.twoip-service-contextual-action { display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; white-space: nowrap; }
body .twoip-service-whois-link { display: inline-flex; align-items: center; gap: 4px; min-block-size: 0; font-size: var(--twoip-type-label); font-weight: 400; line-height: 20px; white-space: nowrap; position: relative; }

/* Invisible click extension does not turn scalar information rows into button-height rows. */
.twoip-service-whois-link::after { content: ""; position: absolute; inset-inline: 0; block-size: 44px; inset-block-start: calc(50% - 22px); }

.twoip-status + .twoip-service-contextual-action { margin-inline-start: 8px; }

/* Hidden sizing never owns underline or separates the visible label from its icon. */
.twoip-disclosure-control:has(> .twoip-disclosure-sizer) { display: inline-grid; }
.twoip-disclosure-sizer { grid-area: 1 / 1; display: inline-flex; align-items: center; gap: 8px; visibility: hidden; pointer-events: none; }
.twoip-disclosure-sizing-text { display: inline-grid; }
.twoip-disclosure-sizing-text > span { grid-area: 1 / 1; }
.twoip-disclosure-sizing-icon { inline-size: 16px; flex: 0 0 16px; }
.twoip-disclosure-visible { grid-area: 1 / 1; justify-self: start; display: inline-flex; align-items: center; gap: 8px; min-inline-size: 0; }
.twoip-disclosure-visible-label { flex: 0 1 auto; inline-size: fit-content; max-inline-size: 100%; }

/* Compact checkbox option collections: hit areas remain 44px, wrappers add no legacy margins. */
.twoip-checkbox-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--twoip-service-option-row-gap) var(--twoip-service-field-gap); }
.twoip-checkbox-grid > * { min-inline-size: 0; }
body .twoip-service-options .twoip-checkbox { margin: 0; padding: 0; }
.twoip-service-options { display: grid; gap: var(--twoip-service-option-row-gap); }
body .twoip-service-options > p { margin: 0; }
@media (min-width: 768px) { .twoip-checkbox-grid { grid-template-columns: repeat(4,minmax(0,1fr)); } }
@media (max-width: 360px) { .twoip-checkbox-grid { grid-template-columns: minmax(0,1fr); } }

/* Findings with optional contextual actions remain ResultList, never individual cards. */
body .twoip-result-list--linear { grid-template-columns: minmax(0,1fr); }
body .twoip-result-row--compact { min-block-size: 0; padding-block: var(--twoip-service-result-row-padding); }
body .twoip-result-row--actions { grid-template-columns: minmax(0,1fr) minmax(0,2fr); }
.twoip-result-outcome { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 16px; min-inline-size: 0; }
.twoip-result-outcome > .twoip-result-status { justify-self: start; inline-size: fit-content; max-inline-size: 100%; }
.twoip-result-actions { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: var(--twoip-type-label); }
.twoip-result-actions > .twoip-inline-link { display: inline-flex; align-items: center; gap: 4px; }
.twoip-result-actions .twoip-icon:not(.twoip-status-icon) { font-size: var(--twoip-contextual-icon-size); margin: 0; position: static; color: currentColor; }
@media (max-width: 767px) { body .twoip-result-row--actions { grid-template-columns: minmax(0,1fr); gap: 4px; } }

body .twoip-radio-group--atomic .twoip-radio > label { white-space:nowrap;align-items:center; }
body .twoip-radio-group--atomic .twoip-radio-text { white-space:nowrap; }

/* Results metadata is one table header, independent of field hints and pagination. */
body .twoip-results-header { margin:0; padding:0 0 var(--twoip-service-option-row-gap); border:0; background:none; }
body .twoip-results-header .twoip-results-meta { text-align:start; margin:0; padding:0; font-size:var(--twoip-type-label); font-weight:400; line-height:1.4; color:var(--twoip-on-surface-variant); border:0; background:none; }
body :is(.twoip-scope-switch,[data-twoip-single-panel-tabs],.twoip-search-form) ~ .twoip-data-panel:has(> .twoip-results-header),
body :is(.twoip-scope-switch,[data-twoip-single-panel-tabs]) + .twoip-results-header { margin-block-start:var(--twoip-service-form-control-gap); }
body .twoip-results-ad { margin-block-start:var(--twoip-service-form-section-gap); }

/* Structured help panels own their inset; generic text hints must not reset it. */
body .twoip-help-block--info { --twoip-help-padding:var(--twoip-service-results-row-padding,12px); }
body .twoip-form-group .twoip-help-block.twoip-help-block--options { grid-template-columns:minmax(0,1fr); gap:var(--twoip-service-option-row-gap); }
body .twoip-help-heading { display:flex; align-items:center; gap:var(--twoip-service-option-row-gap); min-width:0; }
body .twoip-help-heading > .twoip-icon { display:inline-flex; align-items:center; justify-content:center; flex:0 0 20px; width:20px; height:20px; margin:0; font-size:20px; line-height:1; color:var(--twoip-primary); }
body .twoip-help-block--options > .twoip-compact-actions { margin:0; }
body .twoip-compact-actions--equal > .twoip-compact-action { box-sizing:border-box; height:var(--twoip-control-height); text-decoration:none; }
body .twoip-compact-actions--equal > .twoip-compact-action:not(.twoip-compact-action--wide) { width:calc(var(--twoip-control-height) + var(--twoip-control-padding-inline)); flex:none; }
@media (min-width:1280px) {
 body .twoip-compact-actions--balanced { display:grid; grid-template-columns:repeat(var(--twoip-option-columns),minmax(44px,1fr)); }
 body .twoip-compact-actions--equal.twoip-compact-actions--balanced > .twoip-compact-action { width:100%; }
}
