/* Adapt the installed account skins without changing their form contracts. */
@scope (.otosystem .o-module-content :is(.member-skin,.communication-skin)) {
  :scope {
    --member-neutral-50:var(--h-surface);
    --member-neutral-100:var(--h-surface);
    --member-neutral-200:var(--h-line);
    --member-neutral-300:var(--h-line);
    --member-neutral-400:var(--h-text);
    --member-neutral-500:var(--h-text);
    --member-neutral-600:var(--h-text);
    --member-neutral-fill:var(--h-text);
    --member-neutral-700:var(--h-ink);
    --member-neutral-800:var(--h-ink);
    --member-neutral-900:var(--h-ink);
    color:var(--h-ink);font-family:var(--h-font);color-scheme:light;min-width:0;
  }
  :scope, :scope *, :scope *::before, :scope *::after {box-sizing:border-box;border-width:0;border-style:solid;border-color:currentColor}
  :scope :where(h1,h2,h3,p,figure) {margin:0;text-decoration:none}
  :scope :where(a) {color:inherit;text-decoration:none}
  :scope :where(button,input,select,textarea) {font:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}
  :scope :where(button,input[type="submit"],nav a) {min-height:44px}
  :scope nav {flex-wrap:wrap}
  :scope nav a {display:inline-flex;align-items:center;min-width:44px;min-height:44px}
  :scope :is(a,span).w-9.h-9 {min-width:44px;min-height:44px}
  :scope div:has(> a.w-9.h-9) {flex-wrap:wrap}
  :scope :where(input,textarea)::placeholder {color:var(--h-text);opacity:1}
  :scope :where(input[type="checkbox"],input[type="radio"]) {accent-color:var(--h-accent-ink)}
  :scope :where(table) {max-width:100%}
  :scope :where(td,dd) {overflow-wrap:anywhere}
}
.otosystem[data-theme="dark"] .o-module-content :is(.member-skin,.communication-skin) {
  --member-neutral-200:var(--h-ink);
  --member-neutral-300:var(--h-text);
  --member-neutral-700:var(--h-line);
  --member-neutral-800:var(--h-card);
  --member-neutral-900:var(--h-surface);
  --member-neutral-fill:var(--h-card);
  color-scheme:dark;
}
/* These skins also contain inline styles for fields generated by Rhymix. */
.otosystem[data-theme] .o-module-content :is(.member-skin,.communication-skin) :is(a,button,input,select,textarea):focus-visible {
  outline:3px solid var(--h-accent-ink);outline-offset:3px;box-shadow:none;
}
.otosystem .o-module-content :is(.member-skin,.communication-skin) .member-form-input :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),textarea,select) {
  background:var(--h-card);color:var(--h-ink);border-color:var(--h-line);
}
.otosystem .o-module-content :is(.member-skin,.communication-skin) .member-form-input :is(input,textarea,select):focus-visible {
  outline:3px solid var(--h-accent-ink);outline-offset:3px;border-color:var(--h-accent-ink);box-shadow:none;
}
.otosystem .o-module-content :is(.member-skin,.communication-skin) .signature-editor {
  background:var(--h-card);color:var(--h-ink);border-color:var(--h-line);
}
/* A filled action uses the layout accent; destructive actions retain red. */
.otosystem[data-theme] .o-module-content :is(.member-skin,.communication-skin) :is(.text-red-500,.text-red-600) {
  color:light-dark(#b91c1c,#f87171);
}
.otosystem[data-theme] .o-module-content :is(.member-skin,.communication-skin) :is(a,button,input[type="submit"],span,strong)[class~="text-white"]:is(.bg-primary-500,.bg-primary-600,.bg-primary-700,.bg-gradient-to-br.from-primary-400,.bg-amber-500,.bg-amber-600,.bg-blue-600,.bg-emerald-600,.bg-green-600,.bg-violet-600) {
  background:var(--h-accent);color:var(--h-on-accent);
}
.otosystem[data-theme] .o-module-content :is(.member-skin,.communication-skin) :is(a,button,input[type="submit"])[class~="text-white"]:is(.bg-primary-500,.bg-primary-600,.bg-primary-700,.bg-gradient-to-br.from-primary-400,.bg-amber-500,.bg-amber-600,.bg-blue-600,.bg-emerald-600,.bg-green-600,.bg-violet-600):hover {
  background:color-mix(in srgb,var(--h-accent) 88%,var(--h-ink));
}
@media (max-width:640px) {
  .otosystem .o-module-content .communication-skin #fo_friend_list :is(th,td) {padding-inline:8px}
  .otosystem .o-module-content .communication-skin #fo_friend_list th {white-space:nowrap}
}
