/* v0.4.6cz | Consistent appearance controls and glass layout; all rules
   scoped to existing display components. No data schema or JS changes. */
/* Accent roles: active controls use contrast-safe fills; decorative UI uses
   the currently selected accent. Semantic destructive/reset colors stay separate. */
body[data-color-mode="light"] .msl-display-pane .helper,
body[data-color-mode="light"] .msl-display-pane .hint {color:#60758d!important}
body[data-color-mode="light"] .msl-nav-option.is-current span,
body[data-color-mode="light"] .msl-nav-option:hover span,
body[data-color-mode="light"] .msl-display-pane h3,
body[data-color-mode="light"] .description-options > strong,
body[data-color-mode="light"] .msl-select-option-mark,
body[data-color-mode="light"] .msl-heading-minor::before {color:var(--msl-accent)!important}
body[data-color-mode="light"] .msl-nav-option.is-current {
  color:var(--msl-accent-fill)!important;
  background:rgba(var(--msl-accent-rgb),.085)!important;
}
body[data-color-mode="light"] .description-options > strong,
body[data-color-mode="light"] .msl-nav-option.is-current span {color:var(--msl-accent-fill)!important}
/* Text buttons use active palette; the reset and dangerous actions retain semantic rose. */
body[data-color-mode="light"] #tabs .tab.active,
body[data-color-mode="light"] .btn.primary:not(#addGame),
body[data-color-mode="light"] header .version,
body[data-color-mode="light"] header .logo {
  background:var(--msl-accent-fill)!important;
  border-color:var(--msl-accent-fill)!important;
  color:#fff!important;
}
body[data-color-mode="light"] .msl-select-option.is-selected {
  background:rgba(var(--msl-accent-rgb),.10)!important;
  color:var(--msl-accent-fill)!important;
  box-shadow:inset 0 0 0 1px rgba(var(--msl-accent-rgb),.18)!important;
}
/* Force circular chip irrespective of grid/flex sizing and tame vertical tick glyph. */
.msl-accent-choice .msl-accent-swatch {
  display:grid!important;
  place-items:center!important;
  flex:0 0 32px!important;
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  min-height:32px!important;
  max-width:32px!important;
  max-height:32px!important;
  aspect-ratio:1/1!important;
  border-radius:50%!important;
  padding:0!important;
  line-height:1!important;
  box-sizing:border-box!important;
}
.msl-accent-choice[aria-pressed="true"] .msl-accent-swatch::after {
  content:""!important;
  display:block!important;
  width:13px!important;
  height:10px!important;
  background:#fff!important;
  -webkit-mask:var(--msl-check-glyph) center / contain no-repeat!important;
  mask:var(--msl-check-glyph) center / contain no-repeat!important;
  line-height:0!important;
  transform:none!important;
}
@media(max-width:460px){.msl-accent-choice .msl-accent-swatch{flex:0 0 32px!important}}
/* Glass ON/OFF should alter surfaces, not element box geometry.
   This neutralizes older glass-on rules that changed accordion padding and spacing. */
.panel .disclosure:not(.social-body),
body.glass-on .panel .disclosure:not(.social-body),
.panel .x-post-card,
body.glass-on .panel .x-post-card {
  margin:21px 0 0!important;
  padding:20px 0 9px!important;
  border:0!important;
  border-top:1px solid var(--msl-line)!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
/* Nested accordions keep existing tighter rhythm in both modes. */
.panel .disclosure:not(.social-body) .disclosure:not(.social-body),
body.glass-on .panel .disclosure:not(.social-body) .disclosure:not(.social-body){
  margin-top:18px!important;
  padding-top:17px!important;
}
/* Stable borders, unchanged thickness, no layout shifts from Glass UI. */
body.glass-on .panel, body:not(.glass-on) .panel{border-width:1px!important;border-style:solid!important}
/* Glass toggle: harmonious with the surrounding appearance panel in both modes. */
body .msl-display-pane .glass-toggle,
body.glass-on .msl-display-pane .glass-toggle{
  background:#263449!important;
  border:1px solid #4d607b!important;
  color:#d5e2f2!important;
  box-shadow:none!important;
  min-height:43px;
  transition:background-color .2s ease,border-color .2s ease,color .2s ease!important;
}
body .msl-display-pane .glass-toggle[aria-pressed="true"] {
  background:#29445a!important;
  border-color:#467795!important;
  color:#e6f7ff!important;
}
body[data-color-mode="light"] .msl-display-pane .glass-toggle,
body[data-color-mode="light"].glass-on .msl-display-pane .glass-toggle{
  background:#edf3f9!important;
  border-color:#c5d5e5!important;
  color:#36506e!important;
  box-shadow:none!important;
}
body[data-color-mode="light"] .msl-display-pane .glass-toggle[aria-pressed="true"],
body[data-color-mode="light"].glass-on .msl-display-pane .glass-toggle[aria-pressed="true"] {
  background:rgba(var(--msl-accent-rgb),.10)!important;
  border-color:rgba(var(--msl-accent-rgb),.35)!important;
  color:var(--msl-accent-fill)!important;
}
body .msl-display-pane .glass-toggle:hover:not(:disabled){filter:none!important;border-color:var(--msl-accent)!important}
/* Fresh, clean action surfaces on light UI (new and delete are distinct). */
body[data-color-mode="light"] .game-actions > #addGame,
body[data-color-mode="light"].glass-on .game-actions > #addGame {
  box-shadow:none!important;
}
body[data-color-mode="light"] .game-actions > #addGame:hover:not(:disabled){background:#d8edfb!important;border-color:#72b7e4!important;filter:none!important}
body[data-color-mode="light"] .game-actions > #deleteGame,
body[data-color-mode="light"].glass-on .game-actions > #deleteGame {
  border:1px solid #efc4d3!important;
  box-shadow:none!important;
}
body[data-color-mode="light"] .game-actions > #deleteGame:hover:not(:disabled){background:#ffe1eb!important;border-color:#e5a0b8!important;filter:none!important}


/* Specificity guard: generic .btn selectors must not erase the glass-toggle fill. */
body[data-color-mode="light"] button#glassToggle,
body[data-color-mode="light"].glass-on button#glassToggle {
  background:#e8f0f8!important;
  border:1px solid #c6d6e6!important;
  color:#37516e!important;
}
body[data-color-mode="light"] button#glassToggle[aria-pressed="true"],
body[data-color-mode="light"].glass-on button#glassToggle[aria-pressed="true"] {
  background:rgba(var(--msl-accent-rgb),.10)!important;
  border-color:rgba(var(--msl-accent-rgb),.35)!important;
  color:var(--msl-accent-fill)!important;
}
body[data-color-mode="light"] button#glassToggle:hover:not(:disabled){
  border-color:var(--msl-accent)!important;
  filter:none!important;
}


/* v0.4.6cz — match the notice banner to light-mode panels. */
body[data-color-mode="light"] .notice,
body[data-color-mode="light"][data-bg-theme] .notice {
  background:#ffffff!important;
  border:1px solid #dce4ee!important;
  color:#304862!important;
  box-shadow:0 6px 24px rgba(45,70,101,.08)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
body[data-color-mode="light"].glass-on .notice,
body[data-color-mode="light"].glass-on[data-bg-theme] .notice,
body[data-color-mode="light"].glass-on[data-bg-theme]:not([data-bg-theme="none"]) .notice {
  background:linear-gradient(135deg,rgba(255,255,255,.70),rgba(245,250,255,.57))!important;
  border:1px solid rgba(255,255,255,.82)!important;
  color:#304862!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 9px 26px rgba(43,73,112,.10)!important;
  backdrop-filter:blur(13px) saturate(125%)!important;
  -webkit-backdrop-filter:blur(13px) saturate(125%)!important;
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  body[data-color-mode="light"].glass-on .notice,
  body[data-color-mode="light"].glass-on[data-bg-theme] .notice {
    background:rgba(255,255,255,.83)!important;
  }
}


/* v0.4.6cz: subtle interactive feedback for rename / duplicate on light surfaces. */
body[data-color-mode="light"] .game-actions > #renameGame,
body[data-color-mode="light"] .game-actions > #duplicateGame {
  background:#f1f6fb!important;
  color:#465f7d!important;
  border:1px solid #c8d9e9!important;
  box-shadow:0 1px 2px rgba(39,65,94,.035)!important;
  transform:translateY(0);
  transition:background-color 170ms ease,border-color 170ms ease,color 170ms ease,box-shadow 170ms ease,transform 170ms ease!important;
}
body[data-color-mode="light"] .game-actions > #renameGame:hover:not(:disabled),
body[data-color-mode="light"] .game-actions > #duplicateGame:hover:not(:disabled) {
  background:#e3effb!important;
  color:#245985!important;
  border-color:#8bb9dc!important;
  box-shadow:0 4px 11px rgba(45,86,128,.10)!important;
  transform:translateY(-1px);
  filter:none!important;
}
body[data-color-mode="light"] .game-actions > #renameGame:focus-visible,
body[data-color-mode="light"] .game-actions > #duplicateGame:focus-visible {
  outline:2px solid #6baad4;
  outline-offset:2px;
  background:#e3effb!important;
}
body[data-color-mode="light"] .game-actions > #renameGame:active:not(:disabled),
body[data-color-mode="light"] .game-actions > #duplicateGame:active:not(:disabled) {
  background:#d8e8f6!important;
  box-shadow:0 1px 3px rgba(45,86,128,.07)!important;
  transform:translateY(0);
}
@media (prefers-reduced-motion:reduce){
  body[data-color-mode="light"] .game-actions > #renameGame,
  body[data-color-mode="light"] .game-actions > #duplicateGame {transition:none!important;transform:none!important;}
}

/* v0.4.6cz — airy light-mode accent palette; dark theme stays untouched. */
body[data-color-mode="light"][data-ui-accent="blue"]{
  --msl-accent:#139DDE;
  --msl-accent-hover:#087FB8;
  --msl-accent-rgb:19,157,222;
  --msl-accent-fill:#0879B6;
  --msl-accent-fill-hover:#076A9F;
  --msl-accent-fill-rgb:8,121,182;
}
body[data-color-mode="light"][data-ui-accent="pink"]{
  --msl-accent:#E6539A;
  --msl-accent-hover:#D33B84;
  --msl-accent-rgb:230,83,154;
  --msl-accent-fill:#B83373;
  --msl-accent-fill-hover:#A02B63;
  --msl-accent-fill-rgb:184,51,115;
}
/* The honey-only dark tick from earlier versions is intentionally overridden.
   All three selected chips use exactly the same crisp white check. */
body[data-color-mode="light"] .msl-accent-choice[aria-pressed="true"] .msl-accent-swatch::after,
body[data-color-mode="light"] .msl-accent-choice[data-accent-choice="blue"][aria-pressed="true"] .msl-accent-swatch::after,
body[data-color-mode="light"] .msl-accent-choice[data-accent-choice="honey"][aria-pressed="true"] .msl-accent-swatch::after,
body[data-color-mode="light"] .msl-accent-choice[data-accent-choice="pink"][aria-pressed="true"] .msl-accent-swatch::after {
  background:#FFFFFF!important;
  color:#FFFFFF!important;
}


/* v0.4.6cz — Vitamin Orange in light mode only.
   Orange highlight is lively; filled controls use accessible white-on-orange contrast.
   The honey swatch color is locked with the later swatch rule in this file. */
body[data-color-mode="light"][data-ui-accent="honey"]{
  --msl-accent:#F58B18;
  --msl-accent-hover:#E87308;
  --msl-accent-rgb:245,139,24;
  --msl-accent-fill:#C94E00;
  --msl-accent-fill-hover:#AD4000;
  --msl-accent-fill-rgb:201,78,0;
}


/* v0.4.6cz — Social link cards: harmonious light mode only */
body[data-color-mode="light"] .social-list .social-item,
body[data-color-mode="light"] .social-list .social-item:first-child,
body[data-color-mode="light"].glass-on .social-list .social-item {
  background:rgba(255,255,255,.88)!important;
  border:1px solid #d4e1ec!important;
  border-radius:12px!important;
  box-shadow:0 2px 8px rgba(54,85,119,.045)!important;
  transition:background-color 180ms ease,border-color 180ms ease,box-shadow 180ms ease!important;
}
body[data-color-mode="light"] .social-list .social-item:hover:not(.is-pointer-dragging),
body[data-color-mode="light"].glass-on .social-list .social-item:hover:not(.is-pointer-dragging){
  background:rgba(249,252,255,.96)!important;
  border-color:rgba(var(--msl-accent-rgb),.44)!important;
  box-shadow:0 5px 15px rgba(54,85,119,.09)!important;
}
body[data-color-mode="light"].glass-on .social-list .social-item,
body[data-color-mode="light"].glass-on .social-list .social-item:first-child{
  
  border-color:rgba(255,255,255,.82)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.76),0 3px 12px rgba(54,85,119,.06)!important;
  backdrop-filter:blur(10px) saturate(115%)!important;
  -webkit-backdrop-filter:blur(10px) saturate(115%)!important;
}
body[data-color-mode="light"].glass-on .social-list .social-item:hover:not(.is-pointer-dragging){
  
  border-color:rgba(var(--msl-accent-rgb),.35)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.88),0 5px 16px rgba(54,85,119,.10)!important;
}
/* Never hide drag/drop affordances under hover rules. */
body[data-color-mode="light"] .social-list .social-item.is-drag-destination,
body[data-color-mode="light"] .social-list .social-item.drag-target{
  border-color:var(--msl-accent)!important;
  box-shadow:0 0 0 2px rgba(var(--msl-accent-rgb),.20)!important;
}
body[data-color-mode="light"] .social-list .social-item.is-pointer-dragging{
  border-color:var(--msl-accent)!important;
  background:#edf3f9!important;
}
@media(prefers-reduced-motion:reduce){
  body[data-color-mode="light"] .social-list .social-item{transition:none!important}
}


/* v0.4.6cz — consistent hover feedback for all 4 game actions in light mode.
   No vertical hopping; each button keeps its own semantic palette. */
body[data-color-mode="light"] .game-actions > :is(#addGame,#renameGame,#duplicateGame,#deleteGame) {
  transform:none!important;
  box-shadow:0 1px 2px rgba(42,67,95,.045)!important;
  transition:background-color 180ms ease,border-color 180ms ease,color 180ms ease,
             box-shadow 180ms ease!important;
}
body[data-color-mode="light"] .game-actions > :is(#addGame,#renameGame,#duplicateGame,#deleteGame):hover:not(:disabled) {
  transform:none!important;
  box-shadow:0 4px 11px rgba(42,67,95,.13)!important;
  filter:none!important;
}
body[data-color-mode="light"] .game-actions > :is(#addGame,#renameGame,#duplicateGame,#deleteGame):active:not(:disabled) {
  transform:none!important;
  
}
body[data-color-mode="light"] .game-actions > :is(#addGame,#renameGame,#duplicateGame,#deleteGame):focus-visible {
  outline:2px solid var(--msl-accent,#149fe5);
  outline-offset:2px;
}
@media (prefers-reduced-motion:reduce) {
  body[data-color-mode="light"] .game-actions > :is(#addGame,#renameGame,#duplicateGame,#deleteGame) {
    transition:none!important;
  }
}


/* v0.4.6cz — match Backup reset to the light-mode Auto-generate reset action. */
body[data-color-mode="light"] #reset.btn.danger {
  background:#f7e9ef!important;
  background-image:none!important;
  color:#8a3458!important;
  border:1px solid #e7bfd0!important;
  box-shadow:none!important;
  filter:none!important;
  text-shadow:none!important;
  transition:background-color 180ms ease,color 180ms ease,border-color 180ms ease!important;
}
body[data-color-mode="light"] #reset.btn.danger:hover:not(:disabled) {
  background:#f2dfe8!important;
  color:#742849!important;
  border-color:#dfa9be!important;
  filter:none!important;
  box-shadow:none!important;
}
body[data-color-mode="light"] #reset.btn.danger:active:not(:disabled) {
  background:#ebd2df!important;
  color:#69213f!important;
  filter:none!important;
}


/* v0.4.6cz — neutral light UI typography, separators and white selects. */
body[data-color-mode="light"]{
  --msl-light-text:#30343B;
  --msl-light-muted:#717780;
  --msl-light-soft:#F5F6F8;
  color:#30343B;
}
body[data-color-mode="light"] :is(h1,h2,h3,.msl-heading-major,.msl-heading-minor,label,.field-head strong,summary){
  color:#30343B!important;
}
body[data-color-mode="light"] :is(.sub,.hint,.helper,.muted,.footer,.social-tip,.social-tip-text,.counter,.field .counter,.field .help-badge,.msl-flyout-head span,.msl-flyout-foot,.variable-caption,.thumb-meta,.platform-edit-intro,.empty){
  color:#717780!important;
}
body[data-color-mode="light"] :is(input:not([type=checkbox]):not([type=radio]),textarea){
  color:#30343B!important;
  border-color:#D9DDE3!important;
}
body[data-color-mode="light"] :is(input,textarea)::placeholder{
  color:#8C929A!important;
  opacity:1;
}
/* The native select stays the source of truth; custom trigger and popup share the same surface. */
body[data-color-mode="light"] select,
body[data-color-mode="light"] .msl-select-trigger,
body[data-color-mode="light"] .thumb-history-tools select,
body[data-color-mode="light"] .thumb-history-tools .msl-select-trigger,
body[data-color-mode="light"].glass-on .msl-select-trigger,
body[data-color-mode="light"].glass-on .thumb-history-tools .msl-select-trigger{
  background:#FFFFFF!important;
  color:#30343B!important;
  border-color:#D9DDE3!important;
  box-shadow:0 2px 8px rgba(36,40,48,.045)!important;
}
body[data-color-mode="light"] .msl-select-trigger:hover:not(:disabled){
  border-color:#B1B7C0!important;
  box-shadow:0 3px 10px rgba(36,40,48,.08)!important;
}
body[data-color-mode="light"] .msl-select-trigger:focus-visible,
body[data-color-mode="light"] .msl-select-wrap.is-open .msl-select-trigger{
  border-color:var(--msl-accent)!important;
  outline-offset:2px;
}
body[data-color-mode="light"] .msl-select-popup{
  background:#FFFFFF!important;
  color:#30343B!important;
  border-color:#D9DDE3!important;
  box-shadow:0 12px 28px rgba(36,40,48,.12)!important;
}
body[data-color-mode="light"] .msl-select-option{color:#30343B!important;}
body[data-color-mode="light"] .msl-select-option:is(:hover,.is-highlighted){background:#F2F3F5!important;}
body[data-color-mode="light"] .msl-select-option.is-selected{
  background:rgba(var(--msl-accent-rgb),.10)!important;
  color:#30343B!important;
}
body[data-color-mode="light"] .msl-select-chevron{color:var(--msl-light-muted)!important;}
/* Neutral borders on structural surfaces; do not override selection and semantic accent states. */
body[data-color-mode="light"] :is(.panel,.notice,.msl-appearance-flyout,.msl-flyout-nav,.msl-flyout-foot,.social-list .social-item,.disclosure,.thumb-tile,.check-label,.checkitem,.inline-note,.title-live-preview,.example-preview,.tabs,.msl-accent-choice:not([aria-pressed="true"]),.msl-mega-trigger){
  border-color:#D9DDE3!important;
}
body[data-color-mode="light"] :is(.sep,.panel .sep){border-color:#D9DDE3!important;}
body[data-color-mode="light"] .tabs{background:#F3F4F6!important;}
body[data-color-mode="light"] .msl-nav-option:not(.is-current){color:#5B616A!important;}
body[data-color-mode="light"] .msl-flyout-head strong{color:#30343B!important;}
body[data-color-mode="light"] .msl-accent-choice{}
/* Keep the link, warning, positive state and chosen-accent headings meaningful. */
body[data-color-mode="light"] .hint.warning,
body[data-color-mode="light"] .helper.warning{color:#986018!important;}
body[data-color-mode="light"] .invalid{color:#B1293C!important;}
body[data-color-mode="light"] .valid{color:#176D4B!important;}


/* v0.4.6cz — white form field surfaces in LIGHT mode only.
   Exclude checkbox/radio/buttons/file widgets; preserve accent and status colors. */
body[data-color-mode="light"] input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="hidden"]),
body[data-color-mode="light"] textarea,
body[data-color-mode="light"] select,
body[data-color-mode="light"] .msl-select-trigger,
body[data-color-mode="light"] .thumb-history-tools input:not([type="file"]),
body[data-color-mode="light"] .thumb-history-tools .msl-select-trigger,
body[data-color-mode="light"].glass-on input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="hidden"]),
body[data-color-mode="light"].glass-on textarea,
body[data-color-mode="light"].glass-on select,
body[data-color-mode="light"].glass-on .msl-select-trigger,
body[data-color-mode="light"] .new-game-dialog #newTitleFormat {
  background:#FFFFFF!important;
  background-color:#FFFFFF!important;
  color:#30343B!important;
  border-color:#D9DDE3!important;
  color-scheme:light;
}
body[data-color-mode="light"] :is(input,textarea,select)::placeholder{
  color:#8C929A!important;
  opacity:1;
}
body[data-color-mode="light"] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),textarea,select):hover:not(:disabled){
  border-color:#B9C0C9!important;
}
body[data-color-mode="light"] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),textarea,select):focus-visible{
  border-color:var(--msl-accent,#139DDE)!important;
}


/* v0.4.6cz: crisp translucent-white ambient light on light mode only.
   No layout, animation timing, settings or dark mode changes. */
body[data-color-mode="light"] .ambient-layer .ambient-orb{
  background:radial-gradient(circle at 30% 26%,
      rgba(255,255,255,.64) 0%,
      rgba(255,255,255,.37) 29%,
      rgba(255,255,255,.14) 62%,
      rgba(255,255,255,.29) 88%,
      rgba(255,255,255,.42) 100%)!important;
  border:1px solid rgba(255,255,255,.66)!important;
  box-shadow:inset 2px 3px 9px rgba(255,255,255,.44),
             inset -2px -3px 8px rgba(255,255,255,.12),
             0 2px 14px rgba(255,255,255,.22),
             0 1px 2px rgba(50,57,69,.055)!important;
}
body[data-color-mode="light"] .ambient-layer .ambient-lines{
  background:
    linear-gradient(90deg,transparent 15.9%,rgba(255,255,255,.57) 16%,transparent 16.1%),
    linear-gradient(90deg,transparent 43.9%,rgba(255,255,255,.46) 44%,transparent 44.1%),
    linear-gradient(90deg,transparent 72.9%,rgba(255,255,255,.52) 73%,transparent 73.1%),
    linear-gradient(90deg,transparent 90.9%,rgba(255,255,255,.38) 91%,transparent 91.1%)!important;
}
body[data-color-mode="light"] .ambient-layer .ambient-drop{
  background:linear-gradient(180deg,
    rgba(255,255,255,0),rgba(255,255,255,.38) 24%,
    rgba(255,255,255,.91) 66%,rgba(255,255,255,0))!important;
  box-shadow:0 0 7px rgba(255,255,255,.25)!important;
}



/* v0.4.6cz — neutral separator lines, light mode only.
   Keep existing separator geometry so Glass UI ON/OFF does not shift the layout. */
body[data-color-mode="light"] {
  --msl-line:#D9DDE3;
  --msl-light-line:#D9DDE3;
}
body[data-color-mode="light"] .panel{
  --msl-line:#D9DDE3;
}
body[data-color-mode="light"] :is(
  .sep,
  #outputs > .field,
  #outputs > .inline-note + .site-settings,
  .panel .disclosure:not(.social-body),
  .panel .x-post-card,
  .panel .classification-card,
  .panel .check-label,
  .panel .checkitem,
  .panel .inline-note,
  .panel .example-preview,
  .panel .title-live-preview,
  .social-item,
  .social-item:first-child,
  .thumb-history-header,
  .msl-flyout-foot,
  .msl-flyout-nav
) {
  border-color:#D9DDE3!important;
}
body[data-color-mode="light"].glass-on :is(
  .panel .disclosure:not(.social-body),
  .panel .x-post-card,
  .panel .classification-card,
  .panel .check-label,
  .panel .checkitem,
  .panel .inline-note,
  .panel .example-preview,
  .panel .title-live-preview,
  .social-item,
  .social-item:first-child,
  .msl-flyout-foot,
  .msl-flyout-nav
){
  border-color:#D9DDE3!important;
}
/* Preserve the accent drop marker while dragging SNS cards. */
body[data-color-mode="light"] .social-item.is-drag-destination {
  border-bottom-color:var(--msl-accent)!important;
}


/* v0.4.6cz — light-mode SNS cards and unfilled trash affordance. */
body[data-color-mode="light"] .social-list .social-item,
body[data-color-mode="light"] .social-list .social-item:first-child {
  background:rgba(255,255,255,.94)!important;
  border-color:#D9DDE3!important;
}
body[data-color-mode="light"] .social-list .social-item:hover:not(.is-pointer-dragging) {
  background:rgba(255,255,255,.98)!important;
}
body[data-color-mode="light"].glass-on .social-list .social-item,
body[data-color-mode="light"].glass-on .social-list .social-item:first-child {
  background:rgba(255,255,255,.66)!important;
  border-color:rgba(255,255,255,.81)!important;
}
body[data-color-mode="light"].glass-on .social-list .social-item:hover:not(.is-pointer-dragging) {
  background:rgba(255,255,255,.76)!important;
}
body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete],
body[data-color-mode="light"].glass-on .social-list .social-item .social-actions button[data-social-delete] {
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  color:#747B84!important;
  box-shadow:none!important;
  filter:none!important;
}
body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete]:hover:not(:disabled),
body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete]:active:not(:disabled),
body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete]:focus-visible,
body[data-color-mode="light"].glass-on .social-list .social-item .social-actions button[data-social-delete]:hover:not(:disabled),
body[data-color-mode="light"].glass-on .social-list .social-item .social-actions button[data-social-delete]:active:not(:disabled),
body[data-color-mode="light"].glass-on .social-list .social-item .social-actions button[data-social-delete]:focus-visible {
  background:transparent!important;
  border:0!important;
  color:var(--sp-color-danger-hover)!important;
  box-shadow:none!important;
  filter:none!important;
}
body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete]:focus-visible {
  outline:2px solid var(--msl-accent)!important;
  outline-offset:2px;
}
@media (prefers-reduced-motion:reduce) {
  body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete] {
    transition:none!important;
  }
}


/* v0.4.6cz — neutral SNS preview and copy control (light mode only). */
body[data-color-mode="light"] #socialPreview.social-preview,
body[data-color-mode="light"].glass-on #socialPreview.social-preview{
 background:#FFFFFF!important;
 border:1px solid #D9DDE3!important;
 color:#30343B!important;
 box-shadow:none!important;
}
body[data-color-mode="light"] #copySocialPreview,
body[data-color-mode="light"].glass-on #copySocialPreview{
 background:#FFFFFF!important;
 background-image:none!important;
 border:1px solid #D9DDE3!important;
 color:#454B55!important;
 box-shadow:0 1px 2px rgba(40,44,52,.035)!important;
 transform:none!important;
 transition:background-color 180ms ease,border-color 180ms ease,color 180ms ease,box-shadow 180ms ease!important;
}
body[data-color-mode="light"] #copySocialPreview:hover:not(:disabled),
body[data-color-mode="light"].glass-on #copySocialPreview:hover:not(:disabled){
 background:#FAFBFC!important;
 color:var(--sp-color-accent-fill,var(--sp-color-accent))!important;
 border-color:var(--msl-accent)!important;
 box-shadow:0 4px 11px rgba(45,55,69,.09)!important;
 filter:none!important;
}
body[data-color-mode="light"] #copySocialPreview:focus-visible{
 outline:2px solid var(--msl-accent)!important;
 outline-offset:2px;
}
/* SNS brand images originally contain baked-in colored square tiles.
   Swap to simple clear-background vector glyphs only inside SNS cards. */
.social-light-plain-icon{display:none!important;}
body[data-color-mode="light"] .social-list .social-brand-icon,
body[data-color-mode="light"] .social-list .social-brand-icon:hover{
 background:transparent!important;
 background-image:none!important;
 border:none!important;
 box-shadow:none!important;
}
body[data-color-mode="light"] .social-list .official-brand-icon img{display:none!important;}
body[data-color-mode="light"] .social-list .official-brand-icon .social-light-plain-icon{
 display:block!important;
 width:24px;
 height:24px;
 background:transparent!important;
}
/* Also remove the fallback SVG tile if a service lacks a bundled PNG. */
body[data-color-mode="light"] .social-list .social-brand-icon:not(.official-brand-icon) svg > rect:first-child{
 opacity:0;
}


/* v0.4.6cz — unified neutral light-mode typography. Keep semantic controls and accents intact. */
/* Heading and regular text, including details panels and dynamically created cards. */
body[data-color-mode="light"] :is(
  .panel h2,.panel h3,.panel h4,.msl-heading-major,.msl-heading-minor,
  .panel label,.panel .field-head strong,.panel details > summary,
  .panel .social-head strong,.panel .platform-site-title,
  .panel .thumb-gallery-layout .thumb-filename,
  .panel .title-live-preview #titlePreviewCurrent,
  .panel .classification-card strong,.panel .check-label,
  .panel .checkitem label,.panel .social-destinations label,
  .panel .inline-note,.panel .social-preview,
  .panel .thumb-file-current
) {color:#30343B!important;}
/* Special case: streaming-platform checkbox labels have a legacy blue override. */
body[data-color-mode="light"] .panel #platformChecks.check-grid > label.check-label,
body[data-color-mode="light"].glass-on .panel #platformChecks.check-grid > label.check-label {
  color:#30343B!important;
}
/* Smaller and explanatory text stays muted, never so pale that it disappears. */
body[data-color-mode="light"] :is(
  .hint:not(.warning):not(.invalid):not(.valid),
  .helper:not(.warning):not(.invalid):not(.valid),
  .muted,.sub,.footer,.social-tip,.social-tip-text,
  .platform-edit-intro,.field .counter,.field .help-badge,
  .variable-caption,.thumb-meta,.thumb-properties,
  .thumb-history-header #thumbCount,.thumb-file-picker .thumb-file-current,
  .panel .classification-card small,.panel .title-live-preview .counter,
  .panel .empty,.panel .social-preview-note
) {color:#717780!important;}
/* Explicit small-text selectors beat older, more specific per-feature dark-theme colors. */
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-meta,
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-properties,
body[data-color-mode="light"] .panel .thumb-history-header .thumb-history-heading h3.msl-heading-minor span#thumbCount,
body[data-color-mode="light"] .panel .social-tip,
body[data-color-mode="light"] .panel .platform-edit-intro {
  color:#717780!important;
}
/* Keep interaction affordances and established semantic feedback. */
body[data-color-mode="light"] .panel .hint.warning,
body[data-color-mode="light"] .panel .helper.warning {color:#986018!important;}
body[data-color-mode="light"] .panel .invalid {color:#B1293C!important;}
body[data-color-mode="light"] .panel .valid {color:#176D4B!important;}
body[data-color-mode="light"] .panel .tab.active,
body[data-color-mode="light"] .panel .btn.primary,
body[data-color-mode="light"] .panel .thumb-tile.is-selected .thumb-use {
  color:var(--msl-accent-text,#fff)!important;
}
/* Reduce animation for readers requesting it; no change to existing timings otherwise. */


/* v0.4.6cz — light-mode thumbnail UI polish.
   The layout and all thumbnail upload/search functions remain unchanged. */
body[data-color-mode="light"] .panel #thumbPreview {
  box-shadow:0 2px 8px rgba(34,42,52,.055)!important;
}
body[data-color-mode="light"] .panel #thumbPreview img,
body[data-color-mode="light"] .thumb-gallery-layout .thumb-image-wrap,
body[data-color-mode="light"] .thumb-gallery-layout .thumb-image-wrap > img {
  box-shadow:none!important;
  filter:none!important;
}
body[data-color-mode="light"] .thumb-gallery-layout .thumb-tile,
body[data-color-mode="light"].glass-on .thumb-gallery-layout .thumb-tile {
  box-shadow:0 2px 7px rgba(34,42,52,.055)!important;
}
body[data-color-mode="light"] .thumb-gallery-layout .thumb-tile:hover,
body[data-color-mode="light"].glass-on .thumb-gallery-layout .thumb-tile:hover {
  box-shadow:0 3px 9px rgba(34,42,52,.085)!important;
}
body[data-color-mode="light"] .thumb-gallery-layout .thumb-tile.is-selected,
body[data-color-mode="light"].glass-on .thumb-gallery-layout .thumb-tile.is-selected {
  box-shadow:inset 0 0 0 1px rgba(var(--msl-accent-rgb),.25),0 2px 7px rgba(34,42,52,.055)!important;
}
/* Upload row: consistent neutral text, no blue cast. */
body[data-color-mode="light"] .panel .thumb-file-picker .thumb-file-button {
  color:#30343B!important;
}
body[data-color-mode="light"] .panel .thumb-file-picker .thumb-file-current {
  color:#717780!important;
}
/* Gallery heading and count: body grey for the title, muted grey for the count. */
body[data-color-mode="light"] .panel .thumb-history-header .thumb-history-heading h3.msl-heading-minor {
  color:#30343B!important;
}
body[data-color-mode="light"] .panel .thumb-history-header .thumb-history-heading h3.msl-heading-minor #thumbCount {
  color:#717780!important;
}
/* Search field matches the nearby 'newest first' dropdown in light mode. */
body[data-color-mode="light"] .panel .thumb-history-tools #thumbSearch,
body[data-color-mode="light"].glass-on .panel .thumb-history-tools #thumbSearch {
  background:#FFFFFF!important;
  background-image:none!important;
  border:1px solid #D9DDE3!important;
  color:#30343B!important;
  box-shadow:none!important;
}
body[data-color-mode="light"] .panel .thumb-history-tools #thumbSearch::placeholder,
body[data-color-mode="light"].glass-on .panel .thumb-history-tools #thumbSearch::placeholder {
  color:#8C929A!important;
  opacity:1!important;
}
body[data-color-mode="light"] .panel .thumb-history-tools #thumbSearch:hover {
  border-color:#B9BEC6!important;
}
body[data-color-mode="light"] .panel .thumb-history-tools #thumbSearch:focus-visible {
  outline:2px solid var(--msl-accent)!important;
  outline-offset:2px;
}


/* v0.4.6cz — neutral thumbnail history cards in light mode only. */
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile,
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile.is-selected {
  background:#FFFFFF!important;
  border:1px solid #D9DDE3!important;
  color:#30343B!important;
  box-shadow:0 2px 7px rgba(34,42,52,.055)!important;
}
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile:hover {
  background:#FFFFFF!important;
  border-color:#B9BEC6!important;
  box-shadow:0 3px 9px rgba(34,42,52,.085)!important;
}
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile.is-selected {
  border-color:var(--msl-accent)!important;
  box-shadow:inset 0 0 0 1px rgba(var(--msl-accent-rgb),.25),0 2px 7px rgba(34,42,52,.055)!important;
}
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile.is-selected:hover {
  border-color:var(--msl-accent)!important;
  box-shadow:inset 0 0 0 1px rgba(var(--msl-accent-rgb),.25),0 3px 9px rgba(34,42,52,.085)!important;
}
body[data-color-mode="light"].glass-on .panel .thumb-gallery-layout .thumb-tile,
body[data-color-mode="light"].glass-on .panel .thumb-gallery-layout .thumb-tile.is-selected {
  background:rgba(255,255,255,.74)!important;
}
body[data-color-mode="light"].glass-on .panel .thumb-gallery-layout .thumb-tile:hover {
  background:rgba(255,255,255,.84)!important;
}
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-card-details .thumb-filename {
  color:#30343B!important;
  font-weight:650!important;
}
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-card-details .thumb-meta,
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-card-details .thumb-properties {
  color:#717780!important;
}
/* Unselected action remains neutral; the selected action retains accent + white text. */
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use {
  background:#F5F6F8!important;
  border:1px solid #D9DDE3!important;
  color:#30343B!important;
}
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use:hover {
  background:#EBEDF0!important;
  border-color:#BABFC7!important;
  color:#30343B!important;
}
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile.is-selected .thumb-actions .thumb-use {
  background:var(--msl-accent)!important;
  border-color:var(--msl-accent)!important;
  color:var(--msl-accent-text,#FFFFFF)!important;
}


/* A gentle warm-paper warning, rather than muddy orange / blue-grey.
   Warning text stays comfortably legible on its pale background. */
body[data-color-mode="light"] .panel .thumb-storage-warning,
body[data-color-mode="light"].glass-on .panel .thumb-storage-warning{
  background:#FFF9ED!important;
  border:1px solid #EADFCB!important;
  color:#5C5549!important;
  box-shadow:none!important;
}
body[data-color-mode="light"] .panel .thumb-storage-warning strong,
body[data-color-mode="light"].glass-on .panel .thumb-storage-warning strong{
  color:#655038!important;
}

/* Light thumbnail gallery: filenames remain dark, metadata neutral grey. */
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-card-details .thumb-filename,
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile p.thumb-filename {
  color:#30343B!important;
}
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-card-details :is(.thumb-meta,.thumb-properties),
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile p.thumb-meta {
  color:#717780!important;
}

/* Unselected 'Use' buttons match the neutral set, with a subtle hover.
   Selected buttons retain their high-contrast accent fill. */
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use:hover:not(:disabled){
  box-shadow:0 2px 7px rgba(34,42,52,.075)!important;
  transform:none!important;
}
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile.is-selected .thumb-actions .thumb-use:hover:not(:disabled){
  filter:brightness(.95)!important;
  box-shadow:0 2px 7px rgba(34,42,52,.075)!important;
  transform:none!important;
}

/* Shared quiet icon actions.
   Main copy, Niconico thank-you copy, Bottom Sheet preview copy, common-card copy,
   thumbnail delete, and the SNS card delete icon.
   40px is the hit target and 20px is the glyph. Placement stays with each card.
   Hover, press, and keyboard focus change the icon color only.
   SNS delete uses the existing danger rose on those states; the others use the accent fill. */
#outputs button[data-copy],
#outputs .nico-thanks #copyNicoThanks,
.social-list .social-item .social-actions button[data-social-delete],
.thumb-gallery-layout .thumb-actions .thumb-delete,
.sp-sheet .sp-sheet-panel button.sp-preview-copy,
.sp-sheet .sp-sheet-panel button.sp-common-copy{
  box-sizing:border-box!important;
  width:var(--sp-size-icon-button)!important;
  min-width:var(--sp-size-icon-button)!important;
  max-width:var(--sp-size-icon-button)!important;
  height:var(--sp-size-icon-button)!important;
  min-height:var(--sp-size-icon-button)!important;
  max-height:var(--sp-size-icon-button)!important;
  flex:0 0 var(--sp-size-icon-button)!important;
  padding:var(--sp-size-icon-pad)!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  border-radius:var(--sp-radius-10)!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  text-shadow:none!important;
  filter:none!important;
  transform:none!important;
  color:rgba(255,255,255,.72)!important;
  transition:color 180ms ease!important;
}
/* The 40px delete target replaced a 38px button that set the header height.
   The extra 2px sits in the existing 8px gap above the card body, so the
   body text and the reorder handle stay where they were. */
.social-list .social-item .social-actions button[data-social-delete]{
  margin-bottom:-2px!important;
}
#outputs button[data-copy] svg,
#outputs .nico-thanks #copyNicoThanks svg,
.social-list .social-item .social-actions button[data-social-delete] svg,
.thumb-gallery-layout .thumb-actions .thumb-delete svg,
.sp-sheet .sp-sheet-panel button.sp-preview-copy svg,
.sp-sheet .sp-sheet-panel button.sp-common-copy svg{
  display:block!important;
  width:var(--sp-size-icon)!important;
  height:var(--sp-size-icon)!important;
  min-width:var(--sp-size-icon)!important;
  min-height:var(--sp-size-icon)!important;
  flex:0 0 var(--sp-size-icon)!important;
  transform:none!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
#outputs button[data-copy]:is(:hover,:active,:focus-visible):not(:disabled),
#outputs .nico-thanks #copyNicoThanks:is(:hover,:active,:focus-visible):not(:disabled),
.thumb-gallery-layout .thumb-actions .thumb-delete:is(:hover,:active,:focus-visible):not(:disabled),
.sp-sheet .sp-sheet-panel button.sp-preview-copy:is(:hover,:active,:focus-visible):not(:disabled),
.sp-sheet .sp-sheet-panel button.sp-common-copy:is(:hover,:active,:focus-visible):not(:disabled){
  color:var(--sp-color-accent-fill,var(--sp-color-accent))!important;
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
  filter:none!important;
  transform:none!important;
}
.social-list .social-item .social-actions button[data-social-delete]:is(:hover,:active,:focus-visible):not(:disabled){
  color:var(--sp-color-danger-hover)!important;
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
  filter:none!important;
  transform:none!important;
}
#outputs button[data-copy]:focus-visible,
#outputs .nico-thanks #copyNicoThanks:focus-visible,
.social-list .social-item .social-actions button[data-social-delete]:focus-visible,
.thumb-gallery-layout .thumb-actions .thumb-delete:focus-visible,
.sp-sheet .sp-sheet-panel button.sp-preview-copy:focus-visible,
.sp-sheet .sp-sheet-panel button.sp-common-copy:focus-visible{
  outline:2px solid var(--msl-accent)!important;
  outline-offset:2px!important;
}
@media(prefers-reduced-motion:reduce){
  #outputs button[data-copy],
  #outputs .nico-thanks #copyNicoThanks,
  .social-list .social-item .social-actions button[data-social-delete],
  .thumb-gallery-layout .thumb-actions .thumb-delete,
  .sp-sheet .sp-sheet-panel button.sp-preview-copy,
  .sp-sheet .sp-sheet-panel button.sp-common-copy,
  #outputs button[data-copy] svg,
  #outputs .nico-thanks #copyNicoThanks svg,
  .social-list .social-item .social-actions button[data-social-delete] svg,
  .thumb-gallery-layout .thumb-actions .thumb-delete svg,
  .sp-sheet .sp-sheet-panel button.sp-preview-copy svg,
  .sp-sheet .sp-sheet-panel button.sp-common-copy svg{
    transition:none!important;
    transform:none!important;
  }
}


/* v0.4.6cz — use the same SNS card icons in light mode as in dark mode.
   Keep card/trash/button refinements; only cancel the light-only simplified icon swap. */
body[data-color-mode="light"] .social-list .official-brand-icon img{
  display:block!important;
}
body[data-color-mode="light"] .social-list .official-brand-icon .social-light-plain-icon{
  display:none!important;
}
body[data-color-mode="light"] .social-list .social-brand-icon:not(.official-brand-icon) svg > rect:first-child{
  opacity:1!important;
}


/* v0.4.6cz — lightweight controls inside expanded SNS cards (light mode only). */

/* Delete button: no square fill at rest, hover, keyboard focus or active,
   and keep the icon grey until hovered/focused. */
body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete],
body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete]:hover,
body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete]:focus-visible,
body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete]:active,
body[data-color-mode="light"].glass-on .social-list .social-item .social-actions button[data-social-delete],
body[data-color-mode="light"].glass-on .social-list .social-item .social-actions button[data-social-delete]:hover,
body[data-color-mode="light"].glass-on .social-list .social-item .social-actions button[data-social-delete]:focus-visible,
body[data-color-mode="light"].glass-on .social-list .social-item .social-actions button[data-social-delete]:active {
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
  filter:none!important;
}
body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete] {
  color:#747B84!important;
}
body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete]:hover:not(:disabled),
body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete]:active:not(:disabled),
body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete]:focus-visible,
body[data-color-mode="light"].glass-on .social-list .social-item .social-actions button[data-social-delete]:hover:not(:disabled),
body[data-color-mode="light"].glass-on .social-list .social-item .social-actions button[data-social-delete]:active:not(:disabled),
body[data-color-mode="light"].glass-on .social-list .social-item .social-actions button[data-social-delete]:focus-visible {
  color:var(--sp-color-danger-hover)!important;
}
body[data-color-mode="light"] .social-list .social-item .social-actions button[data-social-delete]:focus-visible{
  outline:2px solid var(--msl-accent)!important;
  outline-offset:2px;
}

/* Service destinations: keep the blue accent on the checkbox itself, not
   on a rounded blue-grey chip behind each checkbox + site name. */
body[data-color-mode="light"] .social-list .social-item .social-destinations label,
body[data-color-mode="light"].glass-on .social-list .social-item .social-destinations label,
body[data-color-mode="light"] .panel .social-destinations label,
body[data-color-mode="light"].glass-on .panel .social-destinations label {
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  color:#30343B!important;
  padding:3px 2px!important;
}
body[data-color-mode="light"] .social-list .social-item .social-destinations label:hover,
body[data-color-mode="light"] .social-list .social-item .social-destinations label:focus-within{
  background:transparent!important;
  box-shadow:none!important;
}


/* v0.4.6cz — light-mode neutral secondary-button design system.
   Match insert-variable chips, expand/collapse and analogous secondary actions.
   Preserve the deliberate accent/semantic button styles. */
body[data-color-mode="light"] :is(
  .variable-tools .btn,
  #toggleTrash,
  .social-bulk-btn,
  #importBtn,
  #openSite,
  #openXPost,
  #copyNicoThanks,
  #renameGame,
  #duplicateGame
){
  background:#FFFFFF!important;
  background-image:none!important;
  color:#30343B!important;
  border:1px solid #D9DDE3!important;
  box-shadow:0 1px 2px rgba(40,45,52,.04)!important;
  transform:none!important;
  filter:none!important;
  transition:background-color 180ms ease,border-color 180ms ease,
             color 180ms ease,box-shadow 180ms ease!important;
}
body[data-color-mode="light"] :is(
  .variable-tools .btn,
  #toggleTrash,
  .social-bulk-btn,
  #importBtn,
  #openSite,
  #openXPost,
  #copyNicoThanks,
  #renameGame,
  #duplicateGame
):hover:not(:disabled),
body[data-color-mode="light"] :is(
  .variable-tools .btn,
  #toggleTrash,
  .social-bulk-btn,
  #importBtn,
  #openSite,
  #openXPost,
  #copyNicoThanks,
  #renameGame,
  #duplicateGame
):focus-visible{
  background:#F5F6F8!important;
  border-color:#BFC5CD!important;
  color:#30343B!important;
  box-shadow:0 3px 9px rgba(40,45,52,.085)!important;
  transform:none!important;
  filter:none!important;
}
body[data-color-mode="light"] :is(
  .variable-tools .btn,
  #toggleTrash,
  .social-bulk-btn,
  #importBtn,
  #openSite,
  #openXPost,
  #copyNicoThanks,
  #renameGame,
  #duplicateGame
):active:not(:disabled){
  background:#ECEFF2!important;
  border-color:#BFC5CD!important;
  box-shadow:inset 0 1px 3px rgba(40,45,52,.09)!important;
  transform:none!important;
}
body[data-color-mode="light"] :is(
  .variable-tools .btn,
  #toggleTrash,
  .social-bulk-btn,
  #importBtn,
  #openSite,
  #openXPost,
  #copyNicoThanks,
  #renameGame,
  #duplicateGame
):focus-visible{
  outline:2px solid var(--msl-accent)!important;
  outline-offset:2px;
}
@media (prefers-reduced-motion:reduce) {
  body[data-color-mode="light"] :is(.variable-tools .btn,#toggleTrash,.social-bulk-btn,
    #importBtn,#openSite,#openXPost,#copyNicoThanks,#renameGame,#duplicateGame){
    transition:none!important;
  }
}


/* v0.4.6cz — consistent accent border for focused form fields in light mode.
   Avoid the browser's default black focus ring without layout shift. */
body[data-color-mode="light"] :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="color"]):not([type="range"]):not([type="hidden"]),
  textarea,
  select,
  .msl-select-trigger
):is(:focus,:focus-visible),
body[data-color-mode="light"] .msl-select-wrap.is-open > .msl-select-trigger {
  border-color:var(--msl-accent,#139DDE)!important;
  outline:none!important;
  box-shadow:0 0 0 1px var(--msl-accent,#139DDE),0 2px 8px rgba(36,40,48,.045)!important;
}
body[data-color-mode="light"] :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="color"]):not([type="range"]):not([type="hidden"]),
  textarea,
  select,
  .msl-select-trigger
):focus:not(:focus-visible) {
  border-color:var(--msl-accent,#139DDE)!important;
}


/* v0.4.6cz — consistent section headings, same geometry in both columns.
   Icons remain the original emoji; line boxes and spacing are fixed. */
main .layout .panel > h2.msl-heading-major {
  display:flex!important;
  align-items:center!important;
  min-height:32px!important;
  line-height:32px!important;
  padding:0!important;
  margin:0 0 16px!important;
  gap:9px!important;
}
@media(max-width:800px){
  main .layout .panel > h2.msl-heading-major {
    min-height:32px!important;
    line-height:32px!important;
    margin-bottom:16px!important;
  }
}
/* v0.4.6cz — light-mode streaming-platform checkboxes without colored label tiles.
   Retains the native selected checkbox and keyboard focus feedback. */
body[data-color-mode="light"] .panel #platformChecks.check-grid > label.check-label,
body[data-color-mode="light"].glass-on .panel #platformChecks.check-grid > label.check-label,
body[data-color-mode="light"] .panel #platformChecks.check-grid > label.check-label:hover,
body[data-color-mode="light"].glass-on .panel #platformChecks.check-grid > label.check-label:hover {
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
  color:#30343B!important;
  border-radius:0!important;
  padding:7px 3px!important;
  min-height:38px!important;
}
body[data-color-mode="light"] .panel #platformChecks.check-grid > label.check-label:focus-within {
  outline:2px solid var(--msl-accent)!important;
  outline-offset:1px;
  border-radius:5px!important;
}


/* v0.4.6cz — Light mode: icon-only delete / copy controls have no
   square background in any interaction state, including Glass UI. */
body[data-color-mode="light"] :is(
  .social-list .social-item .social-actions button[data-social-delete],
  #outputs button[data-copy],
  .thumb-gallery-layout .thumb-actions .thumb-delete,
  .sp-sheet .sp-sheet-panel button.sp-preview-copy,
  .sp-sheet .sp-sheet-panel button.sp-common-copy
),
body[data-color-mode="light"] :is(
  .social-list .social-item .social-actions button[data-social-delete],
  #outputs button[data-copy],
  .thumb-gallery-layout .thumb-actions .thumb-delete,
  .sp-sheet .sp-sheet-panel button.sp-preview-copy,
  .sp-sheet .sp-sheet-panel button.sp-common-copy
):is(:hover,:focus,:focus-visible,:active),
body[data-color-mode="light"].glass-on :is(
  .social-list .social-item .social-actions button[data-social-delete],
  #outputs button[data-copy],
  .thumb-gallery-layout .thumb-actions .thumb-delete,
  .sp-sheet .sp-sheet-panel button.sp-preview-copy,
  .sp-sheet .sp-sheet-panel button.sp-common-copy
),
body[data-color-mode="light"].glass-on :is(
  .social-list .social-item .social-actions button[data-social-delete],
  #outputs button[data-copy],
  .thumb-gallery-layout .thumb-actions .thumb-delete,
  .sp-sheet .sp-sheet-panel button.sp-preview-copy,
  .sp-sheet .sp-sheet-panel button.sp-common-copy
):is(:hover,:focus,:focus-visible,:active){
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  border-color:transparent!important;
  box-shadow:none!important;
  filter:none!important;
}
body[data-color-mode="light"] :is(
  #outputs button[data-copy],
  .thumb-gallery-layout .thumb-actions .thumb-delete,
  .sp-sheet .sp-sheet-panel button.sp-preview-copy,
  .sp-sheet .sp-sheet-panel button.sp-common-copy
){
  color:#747B84!important;
}
body[data-color-mode="light"] :is(
  #outputs button[data-copy],
  .thumb-gallery-layout .thumb-actions .thumb-delete,
  .sp-sheet .sp-sheet-panel button.sp-preview-copy,
  .sp-sheet .sp-sheet-panel button.sp-common-copy
):is(:hover,:focus-visible):not(:disabled){
  color:var(--sp-color-accent-fill,var(--sp-color-accent))!important;
}
body[data-color-mode="light"] :is(
  .social-list .social-item .social-actions button[data-social-delete],
  #outputs button[data-copy],
  .thumb-gallery-layout .thumb-actions .thumb-delete,
  .sp-sheet .sp-sheet-panel button.sp-preview-copy,
  .sp-sheet .sp-sheet-panel button.sp-common-copy
):focus-visible {
  outline:2px solid var(--msl-accent)!important;
  outline-offset:2px;
}
/* Light color for the Niconico thank-you copy. Size and chrome live in the shared icon rule.
   This stays more specific than the labeled-button group, which is left unchanged. */
body[data-color-mode="light"] #outputs .nico-thanks #copyNicoThanks{color:#747B84!important}
body[data-color-mode="light"] #outputs .nico-thanks #copyNicoThanks:is(:hover,:active,:focus-visible):not(:disabled){
  color:var(--sp-color-accent-fill,var(--sp-color-accent))!important;
}


/* v0.4.6cz — neutral light-mode thumbnail empty state / upload row.
   Removes the lingering blue tint from the preview placeholder and file-picker row. */
body[data-color-mode="light"] #thumbPreview,
body[data-color-mode="light"].glass-on #thumbPreview{
  background:rgba(255,255,255,.82)!important;
  border:1px solid #D9DDE3!important;
  color:#717780!important;
  box-shadow:none!important;
}
body[data-color-mode="light"] #thumbPreview img{
  box-shadow:none!important;
}
body[data-color-mode="light"] .thumb-file-picker,
body[data-color-mode="light"].glass-on .thumb-file-picker{
  background:rgba(255,255,255,.82)!important;
  border:1px solid #D9DDE3!important;
  box-shadow:none!important;
}
body[data-color-mode="light"] .thumb-file-picker .thumb-file-button,
body[data-color-mode="light"].glass-on .thumb-file-picker .thumb-file-button{
  background:#FFFDF9!important;
  color:#30343B!important;
  border:1px solid #D9DDE3!important;
  box-shadow:none!important;
}
body[data-color-mode="light"] .thumb-file-picker:hover .thumb-file-button,
body[data-color-mode="light"].glass-on .thumb-file-picker:hover .thumb-file-button{
  background:#F5F6F8!important;
  border-color:#BFC5CD!important;
  color:#30343B!important;
  box-shadow:0 3px 9px rgba(40,45,52,.085)!important;
}
body[data-color-mode="light"] .thumb-file-picker .thumb-file-current,
body[data-color-mode="light"].glass-on .thumb-file-picker .thumb-file-current{
  color:#717780!important;
}
body[data-color-mode="light"] #thumbInfo,
body[data-color-mode="light"] #thumbUploadStatus,
body[data-color-mode="light"] #thumbCheck{
  color:#717780!important;
}


/* v0.4.6cz — trash actions: clean, legible light-mode palette only. */
body[data-color-mode="light"] #trashList .trash-restore,
body[data-color-mode="light"].glass-on #trashList .trash-restore {
  background:#FFFFFF!important;
  color:#30343B!important;
  border:1px solid #D9DDE3!important;
  box-shadow:0 1px 2px rgba(40,45,52,.04)!important;
  filter:none!important;
  transform:none!important;
  transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease!important;
}
body[data-color-mode="light"] #trashList .trash-restore:hover:not(:disabled),
body[data-color-mode="light"] #trashList .trash-restore:focus-visible {
  background:#F5F6F8!important;
  color:#30343B!important;
  border-color:#BFC5CD!important;
  box-shadow:0 3px 9px rgba(40,45,52,.085)!important;
  filter:none!important;
}
body[data-color-mode="light"] #trashList .trash-purge,
body[data-color-mode="light"] #emptyTrash,
body[data-color-mode="light"].glass-on #trashList .trash-purge,
body[data-color-mode="light"].glass-on #emptyTrash {
  background:#FFF2F5!important;
  color:#9D3554!important;
  border:1px solid #EBC5D0!important;
  box-shadow:0 1px 2px rgba(88,45,58,.04)!important;
  filter:none!important;
  transform:none!important;
  transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease!important;
}
body[data-color-mode="light"] #trashList .trash-purge:hover:not(:disabled),
body[data-color-mode="light"] #trashList .trash-purge:focus-visible,
body[data-color-mode="light"] #emptyTrash:hover:not(:disabled),
body[data-color-mode="light"] #emptyTrash:focus-visible {
  background:#FCE5EB!important;
  color:#8C2847!important;
  border-color:#DDA5B7!important;
  box-shadow:0 3px 9px rgba(88,45,58,.09)!important;
  filter:none!important;
}
body[data-color-mode="light"] #trashList :is(.trash-restore,.trash-purge):active:not(:disabled),
body[data-color-mode="light"] #emptyTrash:active:not(:disabled) {
  box-shadow:inset 0 1px 3px rgba(40,45,52,.09)!important;
}
body[data-color-mode="light"] #trashList :is(.trash-restore,.trash-purge):focus-visible,
body[data-color-mode="light"] #emptyTrash:focus-visible {
  outline:2px solid var(--msl-accent)!important;
  outline-offset:2px;
}
@media (prefers-reduced-motion:reduce) {
  body[data-color-mode="light"] #trashList :is(.trash-restore,.trash-purge),
  body[data-color-mode="light"] #emptyTrash {transition:none!important;}
}


/* v0.4.6cz — batch UI adjustments requested 2026-11-09. */
/* Neutral secondary add button; match open/close and restore visual states. */
body[data-color-mode="light"] .sns-add-row #addSocial,
body[data-color-mode="light"].glass-on .sns-add-row #addSocial{
  background:#FFFFFF!important;
  background-image:none!important;
  color:#30343B!important;
  border:1px solid #D9DDE3!important;
  box-shadow:0 1px 2px rgba(40,45,52,.04)!important;
  filter:none!important;
  transform:none!important;
  transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease!important;
}
body[data-color-mode="light"] .sns-add-row #addSocial:hover:not(:disabled),
body[data-color-mode="light"].glass-on .sns-add-row #addSocial:hover:not(:disabled){
  background:#F5F6F8!important;
  border-color:#BFC5CD!important;
  color:#30343B!important;
  box-shadow:0 3px 9px rgba(40,45,52,.085)!important;
  filter:none!important;
}
body[data-color-mode="light"] .sns-add-row #addSocial:active:not(:disabled){
  background:#ECEFF2!important;
  box-shadow:inset 0 1px 3px rgba(40,45,52,.09)!important;
}
body[data-color-mode="light"] .sns-add-row #addSocial:focus-visible{
  outline:2px solid var(--msl-accent)!important;
  outline-offset:2px;
}
/* Same-row descriptive helper and live character counter for site fields. */
#outputs > .field .field-meta-row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:8px 16px;
  flex-wrap:wrap;
  margin:7px 1px 12px;
}
#outputs > .field .field-meta-row > .helper{
  flex:1 1 220px;
  min-width:0;
  margin:0!important;
  line-height:1.6;
}
#outputs > .field .field-meta-row > .field-counter-row{
  flex:0 0 auto;
  display:flex;
  justify-content:flex-end;
  align-items:baseline;
  margin:0!important;
  min-height:0;
  white-space:nowrap;
}
body[data-color-mode="light"] #outputs > .field .field-meta-row .counter{
  color:#717780!important;
}
/* Match visual breathing room above and below the per-platform information note. */
#outputs > .inline-note{
  padding-top:20px!important;
  padding-bottom:20px!important;
  line-height:1.65!important;
}
/* Very subtle accent on selected thumbnail tile: normal, hover, and glass-on. */
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile.is-selected,
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile.is-selected:hover{
  background:rgba(var(--msl-accent-rgb),.06)!important;
  border-color:var(--msl-accent)!important;
}
body[data-color-mode="light"].glass-on .panel .thumb-gallery-layout .thumb-tile.is-selected,
body[data-color-mode="light"].glass-on .panel .thumb-gallery-layout .thumb-tile.is-selected:hover{
  background:linear-gradient(0deg,rgba(var(--msl-accent-rgb),.06),rgba(var(--msl-accent-rgb),.06)),rgba(255,255,255,.74)!important;
  border-color:var(--msl-accent)!important;
}
@media(prefers-reduced-motion:reduce){
  body[data-color-mode="light"] .sns-add-row #addSocial{transition:none!important;}
}


/* v0.4.6cz: neutral header buttons for light mode, no blue-tinted surfaces.
   Respect the existing paired 13px rounding and frosted Glass UI toggle. */
body[data-color-mode="light"] header .msl-theme-shortcut,
body[data-color-mode="light"] header .msl-display-settings .msl-mega-trigger {
  color:#30343B;
  border-color:#D9DDE3!important;
}
body[data-color-mode="light"]:not(.glass-on) header .msl-theme-shortcut,
body[data-color-mode="light"]:not(.glass-on) header .msl-display-settings .msl-mega-trigger {
  background:rgba(255,255,255,.95)!important;
  border-color:#D9DDE3!important;
  box-shadow:0 2px 7px rgba(40,45,52,.055)!important;
}
body[data-color-mode="light"]:not(.glass-on) header .msl-theme-shortcut:hover,
body[data-color-mode="light"]:not(.glass-on) header .msl-display-settings .msl-mega-trigger:hover,
body[data-color-mode="light"]:not(.glass-on) header .msl-display-settings .msl-mega-trigger[aria-expanded="true"] {
  background:#F5F6F8!important;
  border-color:#BFC5CD!important;
  box-shadow:0 3px 9px rgba(40,45,52,.085)!important;
}
body[data-color-mode="light"].glass-on header .msl-theme-shortcut,
body[data-color-mode="light"].glass-on header .msl-display-settings .msl-mega-trigger {
  background:rgba(255,255,255,.72)!important;
  border-color:rgba(217,221,227,.92)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 2px 8px rgba(40,45,52,.055)!important;
}
body[data-color-mode="light"].glass-on header .msl-theme-shortcut:hover,
body[data-color-mode="light"].glass-on header .msl-display-settings .msl-mega-trigger:hover,
body[data-color-mode="light"].glass-on header .msl-display-settings .msl-mega-trigger[aria-expanded="true"] {
  background:rgba(255,255,255,.86)!important;
  border-color:#BFC5CD!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 3px 9px rgba(40,45,52,.075)!important;
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  body[data-color-mode="light"].glass-on header .msl-theme-shortcut,
  body[data-color-mode="light"].glass-on header .msl-display-settings .msl-mega-trigger {
    background:#FFFFFF!important;
  }
}


/* v0.4.6cz — requested light-mode visual refinements, dark unchanged. */
/* Accent brand fills: 90% opacity to gently admit the page background. */
body[data-color-mode="light"] header .logo,
body[data-color-mode="light"] header .version {
  background:rgba(var(--msl-accent-fill-rgb),.90)!important;
  border-color:rgba(var(--msl-accent-fill-rgb),.85)!important;
  color:#FFFFFF!important;
}
/* Neutral text rather than legacy blue-gray in header and information banner. */
body[data-color-mode="light"] header h1{color:#30343B!important;}
body[data-color-mode="light"] header .sub{color:#717780!important;}
body[data-color-mode="light"] .notice{color:#717780!important;}
body[data-color-mode="light"] .notice strong,
body[data-color-mode="light"] .notice b{color:#30343B!important;}
/* Accent picker: keep a gentle contextual tint during hover, never flash white. */
body[data-color-mode="light"] .msl-accent-choice{
  color:#30343B!important;
  background:rgba(255,255,255,.80)!important;
  border-color:#D9DDE3!important;
  filter:none!important;
  transition:background-color 170ms ease,border-color 170ms ease,box-shadow 170ms ease!important;
}
body[data-color-mode="light"] .msl-accent-choice:hover:not([aria-pressed="true"]){
  background:rgba(var(--msl-accent-rgb),.065)!important;
  border-color:rgba(var(--msl-accent-rgb),.45)!important;
  box-shadow:0 2px 8px rgba(40,45,52,.06)!important;
  filter:none!important;
}
body[data-color-mode="light"] .msl-accent-choice[aria-pressed="true"],
body[data-color-mode="light"] .msl-accent-choice[aria-pressed="true"]:hover{
  background:rgba(var(--msl-accent-rgb),.085)!important;
  border-color:rgba(var(--msl-accent-rgb),.68)!important;
  box-shadow:inset 0 0 0 1px rgba(var(--msl-accent-rgb),.12)!important;
  filter:none!important;
}
/* Selected colour check is white in all three palettes. */
body[data-color-mode="light"] .msl-accent-choice[aria-pressed="true"] .msl-accent-swatch::after{
  background:#FFFFFF!important;
}
/* Light-mode thumbnail choice buttons: neutral until selected, then standard accent fill. */
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use,
body[data-color-mode="light"].glass-on .panel .thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use{
  background:rgba(255,255,255,.92)!important;
  background-image:none!important;
  border:1px solid #D9DDE3!important;
  color:#30343B!important;
  box-shadow:0 1px 2px rgba(40,45,52,.04)!important;
  filter:none!important;
  transform:none!important;
  transition:background-color 180ms ease,border-color 180ms ease,box-shadow 180ms ease!important;
}
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use:hover:not(:disabled),
body[data-color-mode="light"].glass-on .panel .thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use:hover:not(:disabled){
  background:#F5F6F8!important;
  border-color:#BFC5CD!important;
  color:#30343B!important;
  box-shadow:0 3px 9px rgba(40,45,52,.085)!important;
  filter:none!important;
  transform:none!important;
}
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile.is-selected .thumb-actions .thumb-use,
body[data-color-mode="light"].glass-on .panel .thumb-gallery-layout .thumb-tile.is-selected .thumb-actions .thumb-use{
  background:var(--msl-accent-fill)!important;
  border:1px solid var(--msl-accent-fill)!important;
  color:#FFFFFF!important;
  box-shadow:none!important;
  filter:none!important;
}
body[data-color-mode="light"] .panel .thumb-gallery-layout .thumb-tile.is-selected .thumb-actions .thumb-use:hover,
body[data-color-mode="light"].glass-on .panel .thumb-gallery-layout .thumb-tile.is-selected .thumb-actions .thumb-use:hover{
  background:var(--msl-accent-fill-hover)!important;
  border-color:var(--msl-accent-fill-hover)!important;
  color:#FFFFFF!important;
  box-shadow:none!important;
  filter:none!important;
}
/* Generic-title preset button uses the same neutral secondary-button system. */
body[data-color-mode="light"] :is(#insertCustomExample,#newExampleTemplate){
  background:#FFFFFF!important;
  background-image:none!important;
  border:1px solid #D9DDE3!important;
  color:#30343B!important;
  box-shadow:0 1px 2px rgba(40,45,52,.04)!important;
  filter:none!important;
  transform:none!important;
  transition:background-color 180ms ease,border-color 180ms ease,box-shadow 180ms ease!important;
}
body[data-color-mode="light"] :is(#insertCustomExample,#newExampleTemplate):hover:not(:disabled){
  background:#F5F6F8!important;
  border-color:#BFC5CD!important;
  color:#30343B!important;
  box-shadow:0 3px 9px rgba(40,45,52,.085)!important;
  filter:none!important;
}
body[data-color-mode="light"] :is(#insertCustomExample,#newExampleTemplate):focus-visible{
  outline:2px solid var(--msl-accent)!important;
  outline-offset:2px;
}
/* Neutralize lingering blue-cast on ordinary, non-semantic text. */
body[data-color-mode="light"] :is(
  .panel p:not(.warning):not(.invalid):not(.valid):not(.thumb-filename):not(.thumb-selected-badge),
  .panel .social-identity > span:not(.social-brand-icon),
  .panel .thumb-card-details .thumb-filename,
  .msl-appearance-flyout .msl-flyout-head strong,
  .msl-appearance-flyout .msl-display-pane h3,
  .msl-appearance-flyout .appearance-label,
  .panel .social-preview,
  .panel #thumbPreview
){color:#30343B!important;}
body[data-color-mode="light"] :is(
  .panel p.hint:not(.warning):not(.invalid):not(.valid),
  .panel p.helper:not(.warning):not(.invalid):not(.valid),
  .panel .thumb-meta,.panel .thumb-properties,
  .msl-appearance-flyout .helper,
  .msl-appearance-flyout .msl-flyout-head span,
  .msl-appearance-flyout .msl-flyout-foot,
  .panel .field-meta-row .counter,
  .panel .field-meta-row .helper
){color:#717780!important;}
@media(prefers-reduced-motion:reduce){
  body[data-color-mode="light"] :is(.msl-accent-choice,#insertCustomExample,#newExampleTemplate,
  .thumb-gallery-layout .thumb-actions .thumb-use){transition:none!important;}
}


/* v0.4.6cz — final light-theme appearance trigger color lock. */
body[data-color-mode="light"] header .msl-display-settings #mslAppearanceTrigger,
body[data-color-mode="light"] header .msl-display-settings #mslAppearanceTrigger:not(:hover),
body[data-color-mode="light"] header .msl-display-settings #mslAppearanceTrigger[aria-expanded="false"] {
  color:#30343B!important;
  background:rgba(255,255,255,.95)!important;
  background-image:none!important;
  border:1px solid #D9DDE3!important;
  box-shadow:0 2px 7px rgba(40,45,52,.055)!important;
}
body[data-color-mode="light"] header .msl-display-settings #mslAppearanceTrigger:hover,
body[data-color-mode="light"] header .msl-display-settings #mslAppearanceTrigger[aria-expanded="true"] {
  color:#30343B!important;
  background:#F5F6F8!important;
  background-image:none!important;
  border-color:#BFC5CD!important;
  box-shadow:0 3px 9px rgba(40,45,52,.085)!important;
}
body[data-color-mode="light"].glass-on header .msl-display-settings #mslAppearanceTrigger,
body[data-color-mode="light"].glass-on header .msl-display-settings #mslAppearanceTrigger:not(:hover),
body[data-color-mode="light"].glass-on header .msl-display-settings #mslAppearanceTrigger[aria-expanded="false"] {
  color:#30343B!important;
  background:rgba(255,255,255,.72)!important;
  background-image:none!important;
  border:1px solid rgba(217,221,227,.92)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 2px 8px rgba(40,45,52,.055)!important;
}
body[data-color-mode="light"].glass-on header .msl-display-settings #mslAppearanceTrigger:hover,
body[data-color-mode="light"].glass-on header .msl-display-settings #mslAppearanceTrigger[aria-expanded="true"] {
  color:#30343B!important;
  background:rgba(255,255,255,.86)!important;
  background-image:none!important;
  border-color:#BFC5CD!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 3px 9px rgba(40,45,52,.075)!important;
}


/* v0.4.6cz — light-mode game-action buttons share #toggleTrash shadow/motion.
   Accent and destructive roles keep gentle semantic colors. */
body[data-color-mode="light"] .game-actions > :is(#addGame,#renameGame,#duplicateGame,#deleteGame),
body[data-color-mode="light"].glass-on .game-actions > :is(#addGame,#renameGame,#duplicateGame,#deleteGame){
  background:#FFFFFF!important;
  background-image:none!important;
  color:#30343B!important;
  border:1px solid #D9DDE3!important;
  box-shadow:0 1px 2px rgba(40,45,52,.04)!important;
  transform:none!important;
  filter:none!important;
  transition:background-color 180ms ease,border-color 180ms ease,color 180ms ease,box-shadow 180ms ease!important;
}
body[data-color-mode="light"] .game-actions > #addGame,
body[data-color-mode="light"].glass-on .game-actions > #addGame{
  background:rgba(var(--msl-accent-rgb),.065)!important;
  border-color:rgba(var(--msl-accent-rgb),.28)!important;
  color:var(--sp-color-accent-fill,var(--sp-color-accent))!important;
}
body[data-color-mode="light"] .game-actions > #deleteGame,
body[data-color-mode="light"].glass-on .game-actions > #deleteGame{
  background:#FFF4F6!important;
  border-color:#EDCED8!important;
  color:#A33C5C!important;
}
body[data-color-mode="light"] .game-actions > :is(#renameGame,#duplicateGame):hover:not(:disabled),
body[data-color-mode="light"].glass-on .game-actions > :is(#renameGame,#duplicateGame):hover:not(:disabled){
  background:#F5F6F8!important;
  border-color:#BFC5CD!important;
  color:#30343B!important;
  box-shadow:0 3px 9px rgba(40,45,52,.085)!important;
  transform:none!important;
  filter:none!important;
}
body[data-color-mode="light"] .game-actions > #addGame:hover:not(:disabled),
body[data-color-mode="light"].glass-on .game-actions > #addGame:hover:not(:disabled){
  background:rgba(var(--msl-accent-rgb),.11)!important;
  border-color:rgba(var(--msl-accent-rgb),.43)!important;
  color:var(--sp-color-accent-fill,var(--sp-color-accent))!important;
  box-shadow:0 3px 9px rgba(40,45,52,.085)!important;
  transform:none!important;
  filter:none!important;
}
body[data-color-mode="light"] .game-actions > #deleteGame:hover:not(:disabled),
body[data-color-mode="light"].glass-on .game-actions > #deleteGame:hover:not(:disabled){
  background:#FCEAF0!important;
  border-color:#E5B2C2!important;
  color:#922E4E!important;
  box-shadow:0 3px 9px rgba(40,45,52,.085)!important;
  transform:none!important;
  filter:none!important;
}
body[data-color-mode="light"] .game-actions > :is(#addGame,#renameGame,#duplicateGame,#deleteGame):active:not(:disabled){
  box-shadow:inset 0 1px 3px rgba(40,45,52,.09)!important;
  transform:none!important;
  filter:none!important;
}
body[data-color-mode="light"] .game-actions > :is(#addGame,#renameGame,#duplicateGame):active:not(:disabled){
  background:#ECEFF2!important;
}
body[data-color-mode="light"] .game-actions > #deleteGame:active:not(:disabled){
  background:#F8E0E8!important;
}
body[data-color-mode="light"] .game-actions > #addGame:active:not(:disabled){
  background:rgba(var(--msl-accent-rgb),.14)!important;
}
@media(prefers-reduced-motion:reduce){
  body[data-color-mode="light"] .game-actions > :is(#addGame,#renameGame,#duplicateGame,#deleteGame){transition:none!important;}
}


/* v0.4.6cz — no strong rectangular focus ring on light-mode platform labels.
   Native checkbox still indicates checked state; no layout dimensions change. */
body[data-color-mode="light"] .panel #platformChecks.check-grid > label.check-label:focus-within,
body[data-color-mode="light"].glass-on .panel #platformChecks.check-grid > label.check-label:focus-within,
body[data-color-mode="light"] .panel #platformChecks.check-grid > label.check-label:is(:hover,:active) {
  outline:none!important;
  outline-offset:0!important;
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
}


/* v0.4.6cz — Niconico thanks: consistent header, full-width field, shared metadata row. */
#outputs > .nico-thanks,
body.glass-on #outputs > .nico-thanks{
  margin:0 0 32px!important;
  padding:0 0 10px!important;
  border:0!important;
  border-bottom:1px solid var(--msl-line,#D9DDE3)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
#outputs > .nico-thanks .field-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  min-height:32px!important;
  margin:0 0 10px!important;
}
#outputs > .nico-thanks #nicoThanks{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  margin:0!important;
}
#outputs > .nico-thanks .field-meta-row{
  display:flex!important;
  align-items:baseline!important;
  justify-content:space-between!important;
  gap:8px 16px!important;
  flex-wrap:wrap!important;
  margin:7px 1px 12px!important;
}
#outputs > .nico-thanks .field-meta-row .helper{
  flex:1 1 220px!important;
  min-width:0!important;
  margin:0!important;
  line-height:1.6!important;
}
#outputs > .nico-thanks .field-meta-row .field-counter-row{
  flex:0 0 auto!important;
  display:flex!important;
  justify-content:flex-end!important;
  align-items:baseline!important;
  min-height:0!important;
  margin:0!important;
  white-space:nowrap!important;
}
body[data-color-mode="light"] #outputs > .nico-thanks .field-meta-row .counter{
  color:#717780!important;
}
#openXPost svg{display:block;flex:0 0 17px;vertical-align:middle}


/* v0.4.6cz — visually distinct 'Add new' button in light mode.
   Fresh mint contrasts with the rose delete action across all 3 accent themes.
   Same restrained shadow and 180ms feedback as the other game action buttons. */
body[data-color-mode="light"] .game-actions > #addGame,
body[data-color-mode="light"].glass-on .game-actions > #addGame {
  background:#EAF7F3!important;
  border:1px solid #C6E5DB!important;
  color:#176B5C!important;
  box-shadow:0 1px 2px rgba(40,45,52,.04)!important;
}
body[data-color-mode="light"] .game-actions > #addGame:hover:not(:disabled),
body[data-color-mode="light"].glass-on .game-actions > #addGame:hover:not(:disabled) {
  background:#DDF2EB!important;
  border-color:#9ED5C3!important;
  color:#125D50!important;
  box-shadow:0 3px 9px rgba(40,45,52,.085)!important;
}
body[data-color-mode="light"] .game-actions > #addGame:active:not(:disabled),
body[data-color-mode="light"].glass-on .game-actions > #addGame:active:not(:disabled){
  background:#D3ECE3!important;
  border-color:#9ED5C3!important;
  box-shadow:inset 0 1px 3px rgba(40,45,52,.09)!important;
}
/* Keep external-link glyph visually aligned with labels. */
#openSite svg, #openXPost svg {
  display:inline-block;
  vertical-align:middle;
  flex-shrink:0;
}


/* v0.4.6cz — even vertical spacing around per-site information notes.
   Keep border and section sizing stable in Glass ON/OFF. */
#outputs > .field:has(+ .inline-note){
  margin-bottom:0!important;
  padding-bottom:0!important;
}
#outputs > .inline-note{
  margin:0!important;
  padding:18px 2px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  line-height:1.65!important;
}
#outputs > .inline-note + .site-settings{
  margin-top:0!important;
  border-top:1px solid var(--msl-line,#D9DDE3)!important;
}


/* v0.4.6cz — Honey Orange swatch has one consistent hue regardless of selection.
   Keep the contrast-safe filled orange used by active tabs and white check marks. */
body[data-color-mode="light"] .msl-accent-choice[data-accent-choice="honey"] .msl-accent-swatch,
body[data-color-mode="light"] .msl-accent-choice[data-accent-choice="honey"]:hover .msl-accent-swatch,
body[data-color-mode="light"] .msl-accent-choice[data-accent-choice="honey"][aria-pressed="true"] .msl-accent-swatch,
body[data-color-mode="light"] .msl-accent-choice[data-accent-choice="honey"][aria-pressed="true"]:hover .msl-accent-swatch{
  background:#C94E00!important;
  background-image:none!important;
}


