/* v0.4.4 — refined flat-dark + cyan accent, based on approved UI references */
:root{--msl-cyan:#14b8ec;--msl-cyan-soft:#71e7f7;--msl-ink:#0b1224;--msl-border:#44546b;--msl-line:rgba(175,198,229,.18)}
body{color:#e8eef9} .panel{--msl-line:rgba(175,198,229,.18)}
.panel h2{color:#eaf1fc} .panel h3{color:#e3eaf6}
/* Menu must overlay notice, panels and their descendants */
header{position:relative;z-index:500!important;isolation:isolate;overflow:visible!important}
.msl-display-settings{z-index:510!important}
.msl-appearance-flyout{z-index:520!important}
main{position:relative;z-index:1}
.msl-select-popup{z-index:2000!important}
/* v0.4.6d — unify notice and main-panel surface, border, and corners. */
.notice{background:#1a202b;border:1px solid #343e4e;border-radius:16px;box-shadow:0 6px 26px #0002}
body.glass-on .notice{
  background:rgba(22,32,47,.61)!important;
  border:1px solid rgba(223,236,252,.24)!important;
  border-radius:16px;
  box-shadow:0 10px 28px rgba(0,0,0,.14),inset 0 1px rgba(255,255,255,.10)!important;
  backdrop-filter:blur(18px) saturate(115%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(115%)!important;
}
/* Primary preset controls from supplied reference */
.game-actions{gap:8px}
.game-actions>.btn{border:0!important;border-radius:11px!important;min-height:42px;background:#191e32!important;color:#bec8da!important;box-shadow:none!important}
.game-actions>#addGame{background:#3d2d1b!important;color:#f4bc46!important}
.game-actions>#deleteGame{background:#2d1729!important;color:#e9a2b1!important}
.game-actions>.btn:hover{filter:brightness(1.23)}
/* Input and paired addition action must share height */
.sns-add-row #socialService,.sns-add-row #addSocial,.sns-add-row .msl-select-wrap,.sns-add-row .msl-select-trigger{height:48px!important;min-height:48px!important;box-sizing:border-box}
.sns-add-row .msl-select-wrap{flex:1 1 auto!important;min-width:0}
.sns-add-row #addSocial{flex:0 0 auto!important}
/* Social rows: transparent surfaces, input-matching stroke, 12px gap, 8px padding */
.social-list{gap:12px!important}
.social-item,.social-item:first-child,body.glass-on .social-item{border:1px solid #455365!important;border-radius:12px!important;padding:8px!important;background:transparent!important;box-shadow:none!important}
.social-item .social-drag,.social-item .social-drag:hover,.social-item .social-drag:focus-visible,body.glass-on .social-drag{background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important;flex-basis:29px;color:#a3b6d2}
.social-item .social-drag:hover{color:#64dcf8!important}
/* Dark flat selectable site tiles and cyan checkbox theme */
.check-grid{gap:9px}
.panel .check-label{display:flex;gap:12px;min-height:48px;align-items:center;border:0!important;border-radius:12px!important;padding:11px 12px!important;background:rgba(5,12,29,.78)!important;margin:0!important;cursor:pointer}
.panel .check-label:last-child:nth-child(odd){grid-column:1/-1}
.check-label input[type=checkbox],.description-options input[type=checkbox]{accent-color:var(--msl-cyan);width:20px;height:20px;flex-shrink:0}
.check-label:has(input:focus-visible){outline:2px solid var(--msl-cyan-soft)}
/* Cyan pill tabs */
.tabs{display:flex;gap:4px;flex-wrap:wrap;padding:6px;border:1px solid rgba(165,196,234,.17);background:rgba(4,10,22,.55);border-radius:17px;margin:7px 0 18px}
.tab{flex:1;min-width:85px;border:0;border-radius:12px;background:transparent;color:#a0afc7;padding:10px 14px;font-weight:650;transition:background 180ms,color 180ms,box-shadow 180ms}
.tab.active{background:#10aee9;color:#fff;border:0;box-shadow:0 0 0 1px #5ed7ff66,0 2px 10px #01aef766}
.tab:hover:not(.active){background:rgba(181,215,248,.08);color:#eef7ff}
.description-options{border:1px solid rgba(168,197,232,.15)!important;border-radius:15px!important;padding:16px!important;margin:16px 0!important}
.description-options>strong{color:#62d9f0!important}
.description-options .label-inline{display:inline-flex;vertical-align:middle;margin:9px 18px 9px 0;gap:8px;line-height:1.5}
/* Variable insertion chips */
.variable-tools{gap:8px;margin:13px 0 15px}
.variable-tools .btn{display:inline-flex;flex:none;border:1px solid rgba(165,193,232,.18)!important;border-radius:11px!important;min-height:33px;padding:6px 12px!important;background:#151d31!important;color:#c0cade!important;font-size:.82rem!important;font-weight:600;box-shadow:none!important;transition:background 180ms,color 180ms,border-color 180ms}
.variable-tools .btn:hover{background:#23334b!important;border-color:#4a8eb4!important;color:#f4fdff!important;filter:none!important}
.variable-tools .btn:focus-visible{outline:2px solid #43c9f5;outline-offset:2px}
/* Trash: action semantic colors */
.trash-restore{background:#07354d!important;color:#77dbf4!important;border:0!important}
.trash-purge{background:#391a2d!important;color:#f4a0b2!important;border:0!important}
.trash-empty{background:#2a1a2a!important;color:#efb5c3!important;border:0!important}
#trashList .disclosure{border:1px solid rgba(173,198,229,.12)!important;border-radius:14px!important;padding:13px!important;margin:10px 0!important}
/* Thin single separator between description guidance and next block */
#outputs>.field:has(+ .disclosure){border-bottom:0!important;margin-bottom:16px!important;padding-bottom:0!important}
/* Thumbnail gallery: 5 / 4 / 3 / 2 columns, fixed equal card rows */
.thumb-history-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-top:20px}
.thumb-history-header h3{margin:0}.thumb-history-header h3 span{color:#a4b2cd;font-size:.72em;font-weight:500;margin-left:6px}
.thumb-history-tools{display:flex;gap:8px;align-items:center}
.thumb-history-tools input{width:min(210px,45vw);height:39px;font-size:.79rem}
.thumb-history-tools select{width:115px;height:39px;font-size:.79rem}
.thumb-history-tools .msl-select-wrap{width:115px}
.thumb-history-tools .msl-select-trigger{min-height:39px}
.thumb-list{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:12px!important;align-items:stretch;margin-top:15px!important}
.thumb-tile{display:flex;flex-direction:column;min-width:0;min-height:245px;padding:8px;background:rgba(229,240,255,.025)!important;border:1px solid #455365!important;border-radius:12px!important;transition:border-color 180ms,box-shadow 180ms}
.thumb-tile.is-selected{border-color:#3a87ef!important;box-shadow:inset 0 0 0 1px rgba(58,135,239,.45)}
.thumb-tile>img{display:block;aspect-ratio:16/9;object-fit:cover;width:100%;border-radius:7px;background:#101626}
.thumb-tile p.thumb-filename{font-size:.72rem;font-weight:600;line-height:1.45;height:2.9em;min-height:2.9em;margin:9px 0 3px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere}
.thumb-tile p.thumb-meta{font-size:.69rem;margin:0 0 9px;min-height:1.5em}
.thumb-tile .thumb-use{margin-top:auto;min-height:35px;background:#1e2c40;border-color:#334861}
.thumb-tile.is-selected .thumb-use{background:#2466da!important;border-color:#2466da!important;color:white}
@media(max-width:600px){.thumb-history-tools{width:100%}.thumb-history-tools input{flex:1;min-width:0}}
/* Careful x-post spacing */
#resetXPost{display:inline-flex;margin-top:16px!important}
#resetXPost~.hint{margin-top:13px!important;line-height:1.65!important}

