/* v0.4.5 — UI themes, 18px checkboxes, polished thumbnail manager */
:root,body[data-ui-accent="blue"]{--msl-accent:#12B7F0;--msl-accent-text:#fff;--msl-accent-rgb:18,183,240;--msl-accent-hover:#45caf5}
body[data-ui-accent="honey"]{--msl-accent:#F5BA49;--msl-accent-text:#1d2230;--msl-accent-rgb:245,186,73;--msl-accent-hover:#ffcc67}
body[data-ui-accent="pink"]{--msl-accent:#F278B5;--msl-accent-text:#201727;--msl-accent-rgb:242,120,181;--msl-accent-hover:#ff9bcc}
/* Accent applies to high-priority operations and selection, not danger/recovery semantics. */
.btn.primary,.tab.active,.thumb-tile.is-selected .thumb-use{background:var(--msl-accent)!important;border-color:var(--msl-accent)!important;color:var(--msl-accent-text)!important}
.tab.active{box-shadow:0 0 0 1px rgba(var(--msl-accent-rgb),.42),0 2px 12px rgba(var(--msl-accent-rgb),.32)!important}
.thumb-tile.is-selected{border-color:var(--msl-accent)!important;box-shadow:inset 0 0 0 1px rgba(var(--msl-accent-rgb),.35)!important}
.thumb-selected-badge{background:var(--msl-accent)!important;color:var(--msl-accent-text)!important}
.description-options>strong{color:var(--msl-accent)!important}
.variable-tools .btn:focus-visible,.check-label:has(input:focus-visible){outline-color:var(--msl-accent)!important}
/* Color-independent native checkbox replacement: always 18px, white tick except high-luminance themes */
input[type="checkbox"]{appearance:none!important;-webkit-appearance:none!important;width:18px!important;height:18px!important;min-width:18px;min-height:18px;box-sizing:border-box!important;border:1px solid #758296!important;border-radius:4px!important;background:#303846!important;display:inline-grid!important;place-content:center!important;vertical-align:middle!important;padding:0!important;margin:0!important;cursor:pointer;flex:0 0 18px!important;box-shadow:none!important;position:relative}
input[type="checkbox"]:checked{border-color:var(--msl-accent)!important;background:var(--msl-accent)!important}
input[type="checkbox"]:checked::after{content:"";display:block;width:11px;height:8px;transform:translateY(-1px);background:#fff;clip-path:polygon(0 45%,13% 30%,39% 65%,85% 0,100% 14%,40% 100%)}
input[type="checkbox"]:focus-visible{outline:2px solid var(--msl-accent)!important;outline-offset:3px!important}
.check-label input[type="checkbox"],.description-options input[type="checkbox"]{width:18px!important;height:18px!important}
.checkitem{align-items:center!important}
.checkitem input{margin:0!important}
.msl-accent-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:14px 0 10px}
.msl-accent-choice{display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center;min-height:96px;padding:11px 5px;border:1px solid rgba(180,207,242,.24);border-radius:12px;background:rgba(21,35,54,.52);color:#e0eaf5;font-size:.77rem;white-space:nowrap;cursor:pointer}
.msl-accent-choice[aria-pressed="true"]{border-color:var(--msl-accent);box-shadow:inset 0 0 0 1px rgba(var(--msl-accent-rgb),.38);background:rgba(var(--msl-accent-rgb),.09)}
.msl-accent-swatch{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--swatch)}
.msl-accent-choice[aria-pressed="true"] .msl-accent-swatch:after{content:"✓";color:#fff;font-size:18px;font-weight:800}
.msl-accent-choice[data-accent-choice="honey"][aria-pressed="true"] .msl-accent-swatch:after,.msl-accent-choice[data-accent-choice="pink"][aria-pressed="true"] .msl-accent-swatch:after{color:#202435}
.msl-accent-choice:hover{filter:brightness(1.13)}
@media(max-width:460px){.msl-accent-options{grid-template-columns:1fr}.msl-accent-choice{flex-direction:row;min-height:56px}}
/* Gallery: five stable columns, real thumbnails, fixed text zones and footer, no thumbnail shrink */
.thumb-history-header{padding-bottom:12px;border-bottom:1px solid rgba(180,202,231,.18);margin-top:24px}
.thumb-history-heading h3{font-size:1.05rem;color:#f1f6ff}
.thumb-history-heading .hint{margin:3px 0 0}
.thumb-history-tools input,.thumb-history-tools select,.thumb-history-tools .msl-select-trigger{background:#111b2c!important;border:1px solid #40536e!important;border-radius:10px!important}
.thumb-tile,body.glass-on .thumb-tile{min-height:250px;padding:8px!important;position:relative;background:rgba(26,39,61,.42)!important;border:1px solid rgba(164,192,229,.29)!important;border-radius:12px!important;box-shadow:none!important;overflow:hidden;display:flex!important;flex-direction:column!important}
.thumb-tile.is-selected,body.glass-on .thumb-tile.is-selected{border-color:var(--msl-accent)!important;box-shadow:inset 0 0 0 1px rgba(var(--msl-accent-rgb),.35)!important}
.thumb-image-wrap{position:relative;aspect-ratio:16/9;width:100%;flex:none;border-radius:8px;overflow:hidden;background:#1a2a40}
.thumb-image-wrap>img{display:block;width:100%!important;height:100%!important;aspect-ratio:16/9!important;object-fit:cover;border-radius:0!important}
.thumb-selected-badge{position:absolute;left:5px;top:5px;border-radius:6px;padding:4px 6px;font-size:.64rem;font-weight:700;line-height:1}
.thumb-image-size{position:absolute;right:5px;bottom:5px;color:#f8fbff;background:rgba(1,8,20,.70);padding:2px 5px;border-radius:4px;font-size:.57rem}
.thumb-tile p.thumb-filename{min-height:2.9em;height:2.9em;margin:9px 0 3px;font-weight:650;line-height:1.45;font-size:.72rem}
.thumb-tile p.thumb-meta{color:#a7bed7;min-height:2.9em;height:2.9em;font-size:.68rem;line-height:1.45;overflow:hidden;margin:0 0 8px}
.thumb-actions{display:flex;gap:5px;margin-top:auto;align-items:center;min-height:36px}
.thumb-actions .thumb-use{flex:1 1 auto;width:auto!important;margin:0!important;min-height:36px;background:transparent!important;border:1px solid rgba(134,168,215,.28)!important;border-radius:9px!important;font-size:.75rem;padding:7px 3px}
.thumb-tile.is-selected .thumb-actions .thumb-use{background:var(--msl-accent)!important;border-color:var(--msl-accent)!important;color:var(--msl-accent-text)!important}
.thumb-storage-warning{background:rgba(128,87,19,.16);border:1px solid rgba(224,164,51,.32);border-radius:12px;padding:12px 14px!important;color:#e9cd8e!important;line-height:1.65!important;margin:12px 0 4px}
@media(max-width:1160px){.thumb-list{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@media(max-width:920px){.thumb-list{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:600px){.thumb-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:370px){.thumb-list{grid-template-columns:minmax(0,1fr)!important}}


/* v0.4.6 — thumbnail card redesign based on the larger reference layout */
.thumb-gallery-layout{container:msl-thumbs / inline-size;width:100%;min-width:0}
.thumb-gallery-layout .thumb-list{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:14px!important;align-items:stretch;margin-top:17px!important}
.thumb-gallery-layout .thumb-tile,
body.glass-on .thumb-gallery-layout .thumb-tile{
  display:flex!important;flex-direction:column!important;min-width:0;min-height:0!important;
  padding:9px!important;border-radius:13px!important;
  background:rgba(23,35,55,.56)!important;
  border:1px solid rgba(152,181,220,.30)!important;
  box-shadow:none!important;overflow:hidden;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.thumb-gallery-layout .thumb-tile:hover{border-color:rgba(172,205,246,.52)!important;background:rgba(29,45,70,.64)!important}
.thumb-gallery-layout .thumb-tile.is-selected,
body.glass-on .thumb-gallery-layout .thumb-tile.is-selected{
  border:1px solid var(--msl-accent)!important;
  box-shadow:inset 0 0 0 1px rgba(var(--msl-accent-rgb),.34)!important;
  background:rgba(25,39,62,.70)!important;
}
.thumb-gallery-layout .thumb-image-wrap{position:relative;aspect-ratio:16/9;flex:none;width:100%;border-radius:8px;overflow:hidden;background:#26384f}
.thumb-gallery-layout .thumb-image-wrap>img{width:100%!important;height:100%!important;object-fit:cover!important;display:block}
.thumb-gallery-layout .thumb-selected-badge{top:7px;left:7px;border-radius:7px;line-height:1.2;white-space:nowrap}
.thumb-gallery-layout .thumb-card-details{display:flex;flex-direction:column;gap:3px;min-height:96px;padding:11px 2px 7px;min-width:0}
.thumb-gallery-layout .thumb-filename{margin:0!important;height:2.9em!important;min-height:2.9em!important;line-height:1.45!important;font-size:.74rem!important;font-weight:650;overflow-wrap:anywhere;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;color:#eef4ff}
.thumb-gallery-layout .thumb-meta{height:auto!important;min-height:0!important;margin:0!important;font-size:.70rem!important;line-height:1.5!important;color:#a9bfdd!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.thumb-gallery-layout .thumb-properties{margin:0!important;font-size:.67rem;line-height:1.45;color:#859dbd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.thumb-gallery-layout .thumb-actions{display:flex!important;align-items:center!important;gap:8px!important;min-height:38px;margin-top:auto!important;padding-top:8px}
.thumb-gallery-layout .thumb-actions .thumb-use{flex:1 1 auto;width:auto!important;min-width:0!important;height:36px!important;min-height:36px!important;padding:6px 4px!important;border:1px solid rgba(129,163,209,.25)!important;background:rgba(36,53,76,.36)!important;border-radius:9px!important;font-weight:600!important;font-size:.74rem!important;color:#eaf2fd!important;box-shadow:none!important}
.thumb-gallery-layout .thumb-actions .thumb-use:hover{background:rgba(51,76,106,.55)!important;border-color:rgba(154,191,238,.55)!important}
.thumb-gallery-layout .thumb-actions .thumb-use:not(:disabled){background:#293445!important;border-color:var(--sp-color-border-slate)!important;color:#fff!important;border-radius:9px!important}
.thumb-gallery-layout .thumb-actions .thumb-use:not(:disabled):hover{filter:brightness(1.13);background:#293445!important;border-color:var(--sp-color-border-slate)!important}
.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)!important;cursor:default}
.thumb-gallery-layout .thumb-tile.is-selected .thumb-actions .thumb-use:not(:disabled):hover{background:var(--msl-accent)!important;border-color:var(--msl-accent)!important;filter:none}
@container msl-thumbs (max-width:1120px){.thumb-gallery-layout .thumb-list{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@container msl-thumbs (max-width:820px){.thumb-gallery-layout .thumb-list{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@container msl-thumbs (max-width:610px){.thumb-gallery-layout .thumb-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@container msl-thumbs (max-width:350px){.thumb-gallery-layout .thumb-list{grid-template-columns:minmax(0,1fr)!important}}
@media (prefers-reduced-motion:reduce){.thumb-gallery-layout .thumb-tile{transition:none!important}}


/* v0.4.6e: space between native file-select button and filename */
#thumbFile::file-selector-button { margin-right: 8px; }

/* v0.4.6f — visual consistency: thumbnail controls and theme-aware SNS sorting */
/* All ordinary thumbnail actions use the same quiet button variant as Save selected image. */
#downloadThumb:not(:disabled),
.thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use,
body.glass-on .thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use {
  background:#293445!important;
  color:#fff!important;
  
  box-shadow:none!important;
  background-image:none!important;
  filter:none!important;
  border-radius:9px!important;
}
#downloadThumb:not(:disabled):hover,
.thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use:hover {
  background:#354459!important;
  border-color:#8296ad!important;
  filter:none!important;
}
/* The selected item stays highlighted with the current accent. */
.thumb-gallery-layout .thumb-tile.is-selected .thumb-actions .thumb-use,
body.glass-on .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)!important;
}
/* Reorder grabber and drag indicators take the selected blue / honey / pink accent. */
.social-item .social-drag,
body.glass-on .social-item .social-drag {
  color:var(--msl-accent)!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.social-item .social-drag:hover,
.social-item .social-drag:focus-visible,
body.glass-on .social-item .social-drag:hover {
  color:var(--msl-accent-hover)!important;
  background:transparent!important;
}
.social-item .social-drag:focus-visible{outline:2px solid var(--msl-accent)!important;outline-offset:2px}
.social-item.is-pointer-dragging,
body.glass-on .social-item.is-pointer-dragging {
  outline:2px solid var(--msl-accent)!important;
  border-color:var(--msl-accent)!important;
  box-shadow:0 0 0 2px rgba(var(--msl-accent-rgb),.20),0 20px 45px rgba(0,0,0,.35)!important;
}
.social-item.is-drag-destination,
body.glass-on .social-item.is-drag-destination,
.social-item.drag-target,
body.glass-on .social-item.drag-target {
  border-color:var(--msl-accent)!important;
  border-bottom-color:var(--msl-accent)!important;
  box-shadow:0 0 0 2px rgba(var(--msl-accent-rgb),.26)!important;
}
.social-item.dragging{border-color:var(--msl-accent)!important}


/* v0.4.6g: site-specific tabs, restrained segmented control in all three accents */
#tabs.tabs{
 display:flex; flex-wrap:wrap; align-items:stretch; gap:5px;
 padding:5px; border:1px solid rgba(166,192,226,.20);
 border-radius:15px; background:rgba(6,12,25,.72);
 box-shadow:inset 0 1px 1px rgba(0,0,0,.22);
}
#tabs .tab{
 flex:1 1 90px; min-height:40px; border:1px solid transparent!important;
 border-radius:10px!important; background:transparent!important;
 color:#aab7cb!important; font-weight:650;
 box-shadow:none!important; transition:background 180ms ease,color 180ms ease,box-shadow 180ms ease;
}
#tabs .tab:hover:not(.active){background:rgba(190,212,239,.085)!important;color:#eef5ff!important}
#tabs .tab.active{
 background:var(--msl-accent)!important;
 border-color:var(--msl-accent)!important;
 color:var(--msl-accent-text)!important;
 box-shadow:0 0 0 1px rgba(var(--msl-accent-rgb),.34),0 2px 11px rgba(var(--msl-accent-rgb),.24)!important;
}
#tabs .tab:focus-visible{outline:2px solid var(--msl-accent)!important;outline-offset:3px}
@media(max-width:550px){#tabs .tab{flex-basis:calc(50% - 5px)}}


/* v0.4.6h — Reset button matches the subdued wine-red preset Delete variant. */
#reset.btn.danger {
  background:#2d1729!important;
  background-image:none!important;
  border:0!important;
  border-radius:11px!important;
  color:#e9a2b1!important;
  min-height:42px;
  padding:9px 16px!important;
  box-shadow:none!important;
  text-shadow:none!important;
  transition:filter 180ms ease, background-color 180ms ease!important;
}
#reset.btn.danger:hover:not(:disabled){filter:brightness(1.22)!important;}
#reset.btn.danger:focus-visible{outline:2px solid var(--msl-accent,#14b8ec);outline-offset:3px;}

/* v0.4.6l: one shared default/hover treatment for Save Image and Use Image.
   Selected thumbnail remains governed by the active theme. */
#downloadThumb:not(:disabled),
.thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use,
body.glass-on .thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use {
  background: #293445 !important;
  background-image: none !important;
  color: #fff !important;
  border: 1px solid var(--sp-color-border-slate) !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  filter: none !important;
  transition: background-color 180ms ease, border-color 180ms ease !important;
}
#downloadThumb:not(:disabled):hover,
.thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use:hover,
body.glass-on .thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use:hover {
  background: #354459 !important;
  border-color: #8296ad !important;
  box-shadow: none !important;
  filter: none !important;
}
#downloadThumb:not(:disabled):active,
.thumb-gallery-layout .thumb-tile:not(.is-selected) .thumb-actions .thumb-use:active {
  background: #243142 !important;
  border-color: #8296ad !important;
}
#downloadThumb:focus-visible,
.thumb-gallery-layout .thumb-actions .thumb-use:focus-visible {
  outline: 2px solid var(--msl-accent) !important;
  outline-offset: 3px;
}


/* v0.4.6m — three-theme consistency: white text/ticks on accent fills,
   and accent-colored trash icons. The in-use badge fill is set later. */
:root, body[data-ui-accent="blue"],body[data-ui-accent="honey"],body[data-ui-accent="pink"]{
  --msl-accent-text:#ffffff;
}
/* Shared accent-filled controls always use white lettering and checkmarks. */
.btn.primary,
#tabs .tab.active,
.thumb-gallery-layout .thumb-tile.is-selected .thumb-actions .thumb-use,
body.glass-on .thumb-gallery-layout .thumb-tile.is-selected .thumb-actions .thumb-use{
  color:#ffffff!important;
}
/* Selected swatch and checked checkboxes use white marks for all themes. */
.msl-accent-choice[aria-pressed="true"] .msl-accent-swatch::after,
.msl-accent-choice[data-accent-choice="honey"][aria-pressed="true"] .msl-accent-swatch::after,
.msl-accent-choice[data-accent-choice="pink"][aria-pressed="true"] .msl-accent-swatch::after{
  color:#ffffff!important;
}
input[type="checkbox"]:checked::after{background:#ffffff!important}
/* v0.4.6n: SNS expand/collapse control follows the selected UI accent. */
.social-item details.social-body > summary,
body.glass-on .social-item details.social-body > summary {
  color: var(--msl-accent, #12B7F0) !important;
  transition: color 180ms ease !important;
}
.social-item details.social-body > summary:hover,
.social-item details.social-body > summary:focus-visible {
  color: var(--msl-accent-hover, #45caf5) !important;
}
.social-item details.social-body > summary:focus-visible {
  outline: 2px solid var(--msl-accent, #12B7F0);
  outline-offset: 3px;
  border-radius: 3px;
}


/* v0.4.6o: Match the file picker button to the selected dropdown option surface. */
#thumbFile::file-selector-button {
  background: rgba(var(--msl-accent-rgb), .18) !important;
  border: 1px solid rgba(var(--msl-accent-rgb), .32) !important;
  color: #fff !important;
  border-radius: 8px !important;
  padding: 7px 12px !important;
  margin-right: 8px !important;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 180ms ease, border-color 180ms ease;
}
#thumbFile:hover::file-selector-button {
  background: rgba(var(--msl-accent-rgb), .27) !important;
  border-color: rgba(var(--msl-accent-rgb), .55) !important;
}
#thumbFile:focus-visible::file-selector-button {
  outline: 2px solid var(--msl-accent);
  outline-offset: 2px;
}


/* v0.4.6p: Show the selected gallery image in the upload row.
   The actual native file input is still present for local file selection. */
.thumb-file-picker{
  position:relative;display:flex;align-items:center;gap:8px;
  min-height:52px;padding:8px 11px;border:1px solid #455365;
  border-radius:10px;background:rgba(10,17,29,.93);min-width:0;
}
.thumb-file-picker #thumbFile{
  position:absolute!important;inset:0!important;width:100%!important;
  height:100%!important;opacity:0!important;cursor:pointer!important;
  padding:0!important;margin:0!important;z-index:1!important;
}
.thumb-file-picker:focus-within{outline:2px solid var(--msl-accent,#12b7f0);outline-offset:2px}
.thumb-file-picker .thumb-file-button{
  flex:none;display:inline-flex;align-items:center;justify-content:center;
  min-height:35px;padding:6px 11px;border-radius:8px;
  background:rgba(var(--msl-accent-rgb,18,183,240),.18);
  border:1px solid rgba(var(--msl-accent-rgb,18,183,240),.48);
  color:#fff;font-weight:650;pointer-events:none;
  transition:background 180ms ease,border-color 180ms ease;
}
.thumb-file-picker:hover .thumb-file-button{
  background:rgba(var(--msl-accent-rgb,18,183,240),.27);
  border-color:var(--msl-accent,#12b7f0);
}
.thumb-file-picker .thumb-file-current{
  flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;color:#dce6f3;font-size:.92rem;pointer-events:none;
}


/* v0.4.6q — SNS legacy notes and preview rhythm */
/* This nested disclosure follows the SNS list: avoid double separators. */
#socialLinkList + details.disclosure,
body.glass-on #socialLinkList + details.disclosure {
  border-top:0!important;
  margin-top:16px!important;
  padding-top:0!important;
}
/* One separator after the drag instructions, before the destination preview. */
#socialLinkList + details.disclosure + p.social-tip {
  border-top:0!important;
  border-bottom:1px solid var(--msl-line,rgba(175,198,229,.18));
  margin:16px 0 14px!important;
  padding:0 0 17px!important;
  line-height:1.65;
}
#socialPreview {
  line-height:1.8!important;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}


/* v0.4.6s — accessible solid accent colors, while keeping luminous accent outlines/icons.
   Contrast of white text against solid fills: blue >= 4.8, honey >= 5.1, pink >= 5.5. */
:root, body[data-ui-accent="blue"] {
  --msl-accent-fill:#0B78AD;
  --msl-accent-fill-hover:#086C9C;
  --msl-accent-fill-rgb:11,120,173;
}
body[data-ui-accent="honey"] {
  --msl-accent-fill:#9A6110;
  --msl-accent-fill-hover:#86530D;
  --msl-accent-fill-rgb:154,97,16;
}
body[data-ui-accent="pink"] {
  --msl-accent-fill:#B73675;
  --msl-accent-fill-hover:#A52B67;
  --msl-accent-fill-rgb:183,54,117;
}
/* Solid surface is deeper for legible white text; decorative lines keep brighter theme color. */
.btn.primary,
#tabs .tab.active,
.thumb-gallery-layout .thumb-tile.is-selected .thumb-actions .thumb-use,
body.glass-on .thumb-gallery-layout .thumb-tile.is-selected .thumb-actions .thumb-use,
.thumb-tile.is-selected .thumb-actions .thumb-use,
body.glass-on .thumb-tile.is-selected .thumb-actions .thumb-use {
  background:var(--msl-accent-fill)!important;
  border-color:var(--msl-accent-fill)!important;
  color:#FFFFFF!important;
}
.btn.primary:hover:not(:disabled),
#tabs .tab.active:hover,
.thumb-gallery-layout .thumb-tile.is-selected .thumb-actions .thumb-use:hover,
body.glass-on .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;
}
input[type="checkbox"]:checked {background:var(--msl-accent-fill)!important;border-color:var(--msl-accent)!important}
input[type="checkbox"]:checked::after {background:#FFFFFF!important}
.thumb-gallery-layout .thumb-selected-badge,
body.glass-on .thumb-gallery-layout .thumb-selected-badge {
  background:var(--msl-accent-fill)!important;
  color:#FFFFFF!important;
}
/* Header branding adopts selected accent, keeping the same logo and version-badge geometry. */
header .logo{
  background:var(--msl-accent-fill)!important;
  color:#FFFFFF!important;
  border:1px solid rgba(var(--msl-accent-rgb),.38);
  box-shadow:0 2px 12px rgba(var(--msl-accent-rgb),.16);
}
header .version{
  background:var(--msl-accent-fill)!important;
  border-color:var(--msl-accent-fill)!important;
  color:#FFFFFF!important;
}
/* Selected theme color swatch should preview the actual solid color used on text buttons. */
.msl-accent-choice[data-accent-choice="blue"] .msl-accent-swatch{background:#0B78AD!important}
.msl-accent-choice[data-accent-choice="honey"] .msl-accent-swatch{background:#9A6110!important}
.msl-accent-choice[data-accent-choice="pink"] .msl-accent-swatch{background:#B73675!important}


/* v0.4.6t — site-specific reset label and relaxed vertical rhythm. */
#platformEdits textarea[id$="-extra"] {
  display:block;
  margin-bottom:16px!important;
  line-height:1.65;
}
#platformEdits button[data-reset-overrides] {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:9px 16px!important;
  margin:0 0 12px!important;
  border:0!important;
  border-radius:11px!important;
  background:#2d1729!important;
  background-image:none!important;
  color:#e9a2b1!important;
  box-shadow:none!important;
  font-weight:650;
  transition:background-color 180ms ease,color 180ms ease;
}
#platformEdits button[data-reset-overrides]:hover:not(:disabled) {
  background:var(--sp-color-reset-hover-bg)!important;
  color:var(--sp-color-reset-hover-text)!important;
  filter:none!important;
}
#platformEdits button[data-reset-overrides]:focus-visible {
  outline:2px solid var(--msl-accent,#12b7f0);
  outline-offset:3px;
}
#platformEdits button[data-reset-overrides] + .helper {
  margin:0 0 8px!important;
  line-height:1.75!important;
}


/* v0.4.6v — consistent vertical rhythm for per-site reset controls. */
#platformEdits .disclosure textarea[id$="-extra"] {
  display:block;
  width:100%;
  margin:0 0 16px!important;
  line-height:1.65;
}
#platformEdits .disclosure button[data-reset-overrides] {
  display:inline-flex;
  align-items:center;
  min-height:42px;
  margin:0 0 14px!important;
  padding:9px 16px!important;
  border:none!important;
  border-radius:11px!important;
  background:#2d1729!important;
  color:#e9a2b1!important;
  box-shadow:none!important;
}
#platformEdits .disclosure button[data-reset-overrides] + p.helper {
  display:block;
  margin:0 0 12px!important;
  line-height:1.7!important;
}
#platformEdits .disclosure button[data-reset-overrides]:hover:not(:disabled) {
  background:var(--sp-color-reset-hover-bg)!important;
  color:var(--sp-color-reset-hover-text)!important;
  filter:none!important;
}

/* v0.4.6y — unified hierarchy: emoji section titles, accent-bar subsection labels */
.msl-heading-major{
  display:flex;align-items:center;gap:9px;
  color:#edf3fc;line-height:1.45;
}
.msl-heading-minor{
  display:inline-flex!important;align-items:center;gap:8px;
  max-width:100%;line-height:1.5;
}
.msl-heading-minor::before{
  content:"";display:inline-block;flex:none;
  width:4px;height:1.15em;border-radius:2px;
  background:var(--msl-accent,#12b7f0);
}
.field-head .msl-heading-minor{margin:0;font-size:.94rem;}
.config-field .msl-heading-minor{margin-bottom:7px;}
.msl-select-chevron{font-size:.94rem!important;line-height:1!important;}
.msl-select-option-mark{font-size:1.08rem!important;line-height:1!important;min-width:16px;text-align:center;}


/* v0.4.6aa: Use the chosen accent for ALL interactive disclosure headings.
   Includes SNS management, free text, title template, site-specific settings,
   Twitch moderation and any dynamically inserted details/summary. */
.panel details > summary,
body.glass-on .panel details > summary {
  color:var(--msl-accent,#12B7F0)!important;
  transition:color 180ms ease!important;
}
.panel details > summary:hover,
body.glass-on .panel details > summary:hover {
  color:var(--msl-accent-hover,#45caf5)!important;
}
.panel details > summary:focus-visible {
  outline:2px solid var(--msl-accent,#12B7F0);
  outline-offset:3px;
  border-radius:3px;
}

/* v0.4.6ab — UI refinement memos 1–4 */
/* Small consistent heading in the thumbnail gallery, with count kept adjacent. */
.thumb-history-header .thumb-history-heading h3.msl-heading-minor{
  display:inline-flex!important;align-items:center;gap:8px;
  font-size:.94rem!important;line-height:1.5!important;
  font-weight:700;margin:0!important;color:#eaf0f9;
}
.thumb-history-header .thumb-history-heading h3.msl-heading-minor span#thumbCount{
  font-size:.79rem!important;color:#aabbd0;font-weight:500;margin-left:2px;
}
/* The size of the search input matches the adjacent sort selector. */
.thumb-history-tools #thumbSearch,
body.glass-on .thumb-history-tools #thumbSearch{
  font-size:14px!important;font-weight:500!important;
  color:#f0f4fa!important;line-height:1.4!important;
}
.thumb-history-tools #thumbSearch::placeholder,
body.glass-on .thumb-history-tools #thumbSearch::placeholder{
  font-size:14px!important;font-weight:500!important;
  color:#aabbd0!important;opacity:1!important;
}
.thumb-history-tools #thumbSearch:focus-visible{
  outline:2px solid var(--msl-accent,#12b7f0)!important;outline-offset:2px;
}
/* Same bar sizing for the remaining preset labels and inline preview title. */
.panel label.msl-heading-minor,
.panel .title-live-preview .msl-heading-minor{gap:8px;}

/* v0.4.6ad — one quiet section boundary: no rule below thumbnail heading. */
.thumb-history-header,
body.glass-on .thumb-history-header{
  border-bottom:0!important;
  padding-bottom:0!important;
  margin-bottom:15px!important;
}
.thumb-gallery-layout .thumb-list{margin-top:0!important;}
/* Between site-specific note and accordion, keep a single rule (accordion top). */
#outputs > .inline-note{
  border-bottom:0!important;
  padding-bottom:8px!important;
}
#outputs > .inline-note + .site-settings{
  margin-top:14px!important;
  border-top:1px solid var(--msl-line,rgba(175,198,229,.18))!important;
}

/* v0.4.6ah: persistent SNS accordion display controls */
.social-bulk-actions{display:flex;justify-content:flex-end;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0 8px}
.social-bulk-btn{appearance:none;background:transparent;border:1px solid rgba(168,192,222,.28);border-radius:9px;color:#cbd9e9;padding:6px 11px;font-size:.82rem;line-height:1.4;font-weight:600;transition:color 180ms ease,border-color 180ms ease,background 180ms ease}
.social-bulk-btn:not(:disabled):hover{color:var(--msl-accent,#12b7f0);border-color:rgba(var(--msl-accent-rgb,18,183,240),.62);background:rgba(var(--msl-accent-rgb,18,183,240),.08)}
.social-bulk-btn:focus-visible{outline:2px solid var(--msl-accent,#12b7f0);outline-offset:3px}
.social-bulk-btn:disabled{opacity:.38;cursor:default}

/* v0.4.6ai: calmer per-site heading rhythm. Scoped to game preset platform editor only. */
#platformEdits .platform-site-title{
  font-size:18px!important;
  font-weight:700;
  line-height:1.4!important;
  gap:9px!important;
  padding:10px 0!important;
  margin:0 0 7px!important;
}
#platformEdits .platform-site-title > span:last-child{
  font-size:inherit!important;
  font-weight:700;
  line-height:inherit!important;
}
#platformEdits .platform-site-title .social-brand-icon{
  width:22px!important;height:22px!important;flex:0 0 22px!important;
}
#platformEdits .platform-site-title + .msl-heading-minor{
  margin-top:4px!important;
}


/* v0.4.6aj: Align Twitch classification label and supporting text. */
.twitch-guides .classification-card:has([data-classification]){
 display:grid!important;
 grid-template-columns:18px minmax(0,1fr);
 column-gap:10px;
 row-gap:3px;
 align-items:start;
 line-height:1.5;
}
.twitch-guides .classification-card [data-classification]{
 grid-column:1;grid-row:1;
 margin:2px 0 0!important;
}
.twitch-guides .classification-card .classification-title{
 grid-column:2;grid-row:1;
 min-width:0;font-weight:650;
}
.twitch-guides .classification-card small{
 grid-column:2;grid-row:2;
 margin:0!important;
 display:block;
 line-height:1.55;
}

/* v0.4.6ak: breathing room and consistent accent bars in Twitch moderation. */
.panel details.twitch-guides[open] > summary{
  display:list-item;
  margin-bottom:14px!important;
  line-height:1.55;
}
.twitch-guides .twitch-guide-subheading{
  display:inline-flex!important;
  align-items:center;
  margin:0 0 10px!important;
  font-size:1rem;
  line-height:1.5;
  color:#eaf0f9;
}
.twitch-guides .twitch-guide-subheading:not(:first-of-type){margin-top:4px!important}
.twitch-guides .twitch-guide-subheading + .helper{
  margin-top:0!important;
  margin-bottom:13px!important;
  line-height:1.65;
}

/* v0.4.6al — Twitch 配信の種類: 18px checkbox + 10px label gap */
.twitch-guides .classification-card:has(#twitchRerun),
.twitch-guides .classification-card:has(#twitchBranded){
  display:flex!important;
  align-items:center!important;
  column-gap:10px!important;
  line-height:1.5!important;
}
.twitch-guides .classification-card #twitchRerun,
.twitch-guides .classification-card #twitchBranded{
  margin:0!important;
  flex:0 0 18px!important;
}

/* v0.4.6am — site-level action stays with its service heading, not below fields */
.platform-edit-intro{
  color:#adbed2; font-size:.86rem; line-height:1.75;
  margin:10px 0 18px; padding:0;
}
#platformEdits .platform-site-toolbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; flex-wrap:wrap; padding:7px 0 9px;
}
#platformEdits .platform-site-toolbar .platform-site-title{
  flex:1 1 135px; min-width:0;
  padding:0!important; margin:0!important; line-height:1.4!important;
}
#platformEdits .platform-site-toolbar button[data-reset-overrides]{
  flex:0 0 auto; min-height:34px!important;
  padding:7px 11px!important; margin:0!important;
  font-size:.8rem; line-height:1.35;
  border:0!important; border-radius:10px!important;
  background:#2d1729!important; color:#e9a2b1!important;
  box-shadow:none!important;
}
#platformEdits .platform-site-toolbar button[data-reset-overrides]:hover:not(:disabled){
  background:var(--sp-color-reset-hover-bg)!important;color:var(--sp-color-reset-hover-text)!important;
}
#platformEdits .platform-site-toolbar + .msl-heading-minor{
  margin-top:8px!important;
}
#platformEdits .disclosure textarea[id$="-extra"]{
  margin-bottom:0!important;
}
@media(max-width:450px){
  #platformEdits .platform-site-toolbar{align-items:flex-start;}
  #platformEdits .platform-site-toolbar button[data-reset-overrides]{
    font-size:.76rem;
  }
}


/* v0.4.6an — checkbox checkmark optical centering */
input[type="checkbox"]:checked::after{
  transform: translateY(1px) !important;
}


/* v0.4.6ao — shared check shape for checkbox and custom select */
:root{--msl-check-glyph:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 11 8%22%3E%3Cpath fill=%22black%22 d=%22M0 3.6 1.43 2.4 4.29 5.2 9.35 0 11 1.12 4.4 8Z%22/%3E%3C/svg%3E")}
input[type="checkbox"]:checked::after, .msl-select-option-mark{--webkit-mask-image:var(--msl-check-glyph)!important;mask-image:var(--msl-check-glyph)!important;-webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important;-webkit-mask-position:center!important;mask-position:center!important;-webkit-mask-size:contain!important;mask-size:contain!important;clip-path:none!important;background-image:none!important;flex-shrink:0!important;}
input[type="checkbox"]:checked::after{width:11px!important;height:8px!important;background-color:#fff!important;transform:translateY(1px)!important;}
.msl-select-option-mark{display:inline-block!important;width:14px!important;height:11px!important;min-width:14px!important;flex:0 0 14px!important;background-color:var(--msl-accent)!important;color:transparent!important;font-size:0!important;line-height:0!important;transform:none!important;}

/* v0.4.6ap: right-aligned live counters below all site-specific input fields */
#outputs > .field .field-counter-row{
  display:flex;justify-content:flex-end;align-items:center;
  min-height:20px;margin:5px 1px 0;
}
#outputs > .field .field-counter-row .counter{
  font-size:.8rem;line-height:1.5;color:#aebfd2;
  font-variant-numeric:tabular-nums;white-space:nowrap;
}
#outputs > .field .field-counter-row .counter.invalid{color:#ff9696!important}

/* v0.4.6aq: Nico message counter follows the same bottom-right placement. */
#outputs .nico-thanks .field-counter-row{display:flex;align-items:center;justify-content:flex-end;min-height:20px;margin:5px 1px 0;}
#outputs .nico-thanks .field-counter-row .counter{font-size:.8rem;line-height:1.5;color:#aebfd2;font-variant-numeric:tabular-nums;}
/* v0.4.6ar — right-align metadata for the currently selected thumbnail */
#thumbInfo {
  width:100%;
  text-align:right;
  overflow-wrap:anywhere;
  line-height:1.6;
}

/* v0.4.6as — shared offline reset icon / subdued wine-red destructive-style visual */
#reset, #resetXPost, #platformEdits button[data-reset-overrides]{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  gap:6px!important;
}
#resetXPost{
  background:#2d1729!important;color:#e9a2b1!important;
  border:0!important;border-radius:11px!important;
  padding:9px 14px!important;box-shadow:none!important;
  transition:background-color 180ms ease,color 180ms ease!important;
}
#resetXPost:hover:not(:disabled){background:var(--sp-color-reset-hover-bg)!important;color:var(--sp-color-reset-hover-text)!important;filter:none!important;}
#resetXPost:focus-visible{outline:2px solid var(--msl-accent,#12b7f0);outline-offset:3px;}
.msl-reset-icon{display:block;flex:none;width:18px;height:18px;pointer-events:none;}
#reset .msl-reset-icon, #resetXPost .msl-reset-icon,
#platformEdits button[data-reset-overrides] .msl-reset-icon{color:inherit;}


/* v0.4.6at — custom select glyphs: fixed ratio, consistent optical weight */
.msl-select-trigger .msl-select-chevron {
  display:inline-flex!important;
  align-items:center!important;justify-content:center!important;
  width:20px!important;height:20px!important;
  min-width:20px!important;flex:0 0 20px!important;
  line-height:1!important;color:#dbe7f5;
  transform-origin:center;
}
.msl-select-chevron svg {
  display:block;width:18px!important;height:18px!important;
  flex:none;overflow:visible;
}
.msl-select-option-mark {
  width:15px!important;height:11px!important;
  min-width:15px!important;flex:0 0 15px!important;
  vertical-align:middle;
}


/* v0.4.6av — モーダル内はブラウザ標準selectを使用（選択肢の背面隠れを防止） */
.new-game-dialog #newTitleFormat{display:block!important;position:static!important;width:100%!important;height:auto!important;min-height:44px!important;opacity:1!important;pointer-events:auto!important;z-index:auto!important;padding:10px 38px 10px 12px!important;margin:0!important;cursor:pointer;appearance:auto!important;-webkit-appearance:menulist!important;color:#f4f7fb!important;background-color:#0f151e!important;border:1px solid #51627a!important;border-radius:10px!important}
.new-game-dialog #newTitleFormat:focus-visible{outline:2px solid var(--msl-accent,#f5bb4b);outline-offset:2px}

/* v0.4.6aw: group description toggles without adding a nested panel */
.description-options .desc-checkbox-group{display:flex;flex-direction:column;gap:10px;margin:15px 0 18px;}
.description-options .desc-checkbox-row{display:flex;flex-wrap:wrap;align-items:center;column-gap:24px;row-gap:10px;}
.description-options .desc-checkbox-row .label-inline{display:inline-flex;margin:0!important;gap:9px;align-items:center;line-height:1.5;max-width:100%;}
.description-options .desc-episode-label{display:flex;margin:0 0 8px!important;align-items:center;}