/* StreamPico v0.4.6da — progressive disclosure, bottom workspace */
.sp-template-launch{margin:10px 0 0;width:100%;min-height:42px}
.sp-template-overlay{position:fixed;inset:0;z-index:2300;display:none;justify-content:flex-end;backdrop-filter:blur(3px)}
.sp-template-overlay.is-open{display:flex}
.sp-template-drawer{width:min(680px,100vw);height:100%;overflow-y:auto;padding:18px;background:#182232;border-left:1px solid #536276;box-shadow:-16px 0 40px #0004}
.sp-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;position:sticky;top:-18px;background:inherit;padding:15px 0;z-index:1}
.sp-drawer-head h2{margin:0}.sp-drawer-head p{margin:3px 0 0}
.sp-template-drawer>.panel{padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important}
.sp-template-drawer>.panel>h2{display:none}
.sp-sheet{position:fixed;z-index:1800;bottom:0;left:0;right:0;pointer-events:none;display:flex;flex-direction:column;align-items:center}
.sp-sheet-bar{pointer-events:auto;width:min(1200px,calc(100% - 24px));border:1px solid #596679;border-radius:15px 15px 0 0;padding:8px 12px;display:flex;align-items:center;gap:8px;box-shadow:0 -7px 28px #0002}
.sp-sheet-tab{flex:1;min-width:0;border:0;border-radius:9px;background:transparent;color:#cbd5e5;padding:9px 6px;font-size:.87rem;font-weight:650;cursor:pointer}
.sp-sheet-tab[aria-selected=true]{background:var(--msl-accent-fill,#0B78AD);color:white}
.sp-sheet-toggle{flex:none}
.sp-sheet-panel{pointer-events:auto;width:min(1200px,calc(100% - 24px));max-height:min(56vh,570px);overflow:auto;border:1px solid #596679;border-bottom:0;border-radius:15px 15px 0 0;padding:18px;box-shadow:0 -16px 36px #0004;display:none}
.sp-sheet.is-open .sp-sheet-bar{border-radius:0}
.sp-sheet-panel h3{margin:0 0 12px}.sp-sheet-value{white-space:pre-wrap;overflow-wrap:anywhere;background:rgba(124,152,183,.09);border:1px solid #536276;border-radius:9px;padding:12px;line-height:1.6}
.sp-sheet-x .x-post-card{margin:0!important;padding:0!important;border:0!important;background:transparent!important}
.sp-sheet-x .x-post-card h3{display:none}
.sp-site-note{font-size:.79rem;color:#9eacbb;margin:8px 0 0}
.sp-template-drawer .platform-edit-intro{max-width:65ch}
.sp-template-drawer #platformEdits>.disclosure{border-top:1px solid #576174;padding:16px 0}
.sp-template-drawer #platformEdits>.disclosure label{margin-top:13px}
.sp-template-drawer #platformEdits>.disclosure label::after{content:'　• 保存済みテンプレート';font-size:.72rem;font-weight:400;opacity:.7}
body{padding-bottom:64px}
body[data-color-mode=light] .sp-template-drawer,body[data-color-mode=light] .sp-sheet-bar,body[data-color-mode=light] .sp-sheet-panel{background:#fff;color:#30343b;border-color:#d9dde3}
body[data-color-mode=light] .sp-sheet-tab{}body[data-color-mode=light] .sp-sheet-tab[aria-selected=true]{color:#fff}
body[data-color-mode=light] .sp-sheet-value{border-color:#d9dde3}
body[data-color-mode=light] .sp-drawer-head{background:#fff}
@media(max-width:600px){.sp-sheet-panel{max-height:72vh;padding:12px}.sp-sheet-bar{width:100%;padding:7px 5px}.sp-sheet-panel{width:100%}.sp-sheet-tab{font-size:.78rem;padding:8px 3px}.sp-template-drawer{padding:12px}}
@media(prefers-reduced-motion:reduce){.sp-sheet *, .sp-template-overlay *{scroll-behavior:auto}}

/* v0.4.6dh — polished motion and index-glass bottom workspace */
.sp-template-overlay{display:flex!important;visibility:hidden;opacity:0;pointer-events:none;transition:opacity 340ms ease,visibility 340ms;background:rgba(13,20,35,.43)}
.sp-template-overlay.is-open{visibility:visible;opacity:1;pointer-events:auto}
.sp-template-drawer{width:min(720px,100vw);padding:0!important;overflow-y:auto;overscroll-behavior:contain;transform:translate3d(100%,0,0);transition:transform 340ms cubic-bezier(.4,0,.2,1);scrollbar-gutter:stable;background:#182232;box-sizing:border-box}
.sp-template-overlay.is-open .sp-template-drawer{transform:translate3d(0,0,0);transition-duration:420ms;transition-timing-function:cubic-bezier(.22,1,.36,1)}
.sp-drawer-inner{padding:24px clamp(24px,3vw,36px) 38px;min-width:0}
.sp-drawer-head{top:0;margin:0 0 14px!important;padding:15px 0 13px!important;z-index:4;border-bottom:1px solid rgba(160,179,204,.22)}
.sp-template-drawer .panel,.sp-template-drawer .panel *{max-width:100%;box-sizing:border-box}
.sp-template-drawer .panel{min-width:0}
.sp-template-drawer .panel textarea,.sp-template-drawer .panel input,.sp-template-drawer .panel select{min-width:0}
.sp-template-drawer .sp-site-note{line-height:1.75;margin-bottom:15px}
.sp-sheet{--sp-h:55dvh;bottom:0;isolation:isolate;overflow:visible}
.sp-sheet-panel{display:block!important;height:0;min-height:0;max-height:none!important;overflow:hidden;opacity:0;visibility:hidden;pointer-events:none;box-sizing:border-box;padding:0 22px!important;border-bottom:0!important;border-radius:15px 15px 0 0;transform:translateY(12px);transition:height 420ms cubic-bezier(.22,1,.36,1),opacity 280ms ease,transform 420ms cubic-bezier(.22,1,.36,1),visibility 420ms;will-change:height,opacity,transform;box-shadow:0 -14px 34px #0002}
.sp-sheet.is-open .sp-sheet-panel{display:block;height:clamp(260px,var(--sp-h),720px);opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.sp-sheet-panel-inner{height:100%;display:flex;flex-direction:column;min-height:0}
.sp-sheet-drag-handle{height:26px;min-height:26px;display:grid;place-items:center;cursor:grab;touch-action:none;user-select:none}
.sp-sheet-drag-handle:active{cursor:grabbing}
.sp-sheet-drag-handle:after{content:"";display:block;width:52px;height:5px;border-radius:999px;background:rgba(var(--msl-accent-rgb),.48);box-shadow:0 1px 2px #0002}
.sp-sheet-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 2px 20px;scrollbar-gutter:stable}
.sp-sheet-bar{order:0;position:relative;gap:9px;padding:9px 13px 7px;min-height:64px;border-radius:17px 17px 0 0!important;border-bottom:0!important;backdrop-filter:blur(21px) saturate(145%);-webkit-backdrop-filter:blur(21px) saturate(145%);box-shadow:0 -8px 24px #0002,inset 0 1px rgba(255,255,255,.32);overflow:visible}
.sp-sheet-bar:before{content:"";position:absolute;inset:0 0 auto;height:1px;pointer-events:none}
.sp-sheet-tab{min-height:45px;position:relative;border:1px solid rgba(var(--msl-accent-rgb),.27)!important;border-radius:12px 12px 7px 7px!important;color:inherit!important;background:linear-gradient(155deg,rgba(255,255,255,.22),rgba(var(--msl-accent-rgb),.08))!important;box-shadow:inset 0 1px rgba(255,255,255,.30),0 2px 8px #0001!important;transition:background 260ms ease,border-color 260ms ease,transform 260ms cubic-bezier(.22,1,.36,1),box-shadow 260ms ease!important;cursor:pointer}
.sp-sheet-tab:hover{transform:translateY(-2px);background:rgba(var(--msl-accent-rgb),.18)!important}
.sp-sheet-tab[aria-selected=true]{color:#fff!important;background:linear-gradient(135deg,rgba(var(--msl-accent-fill-rgb),.92),rgba(var(--msl-accent-fill-rgb),.76))!important;border-color:rgba(var(--msl-accent-rgb),.7)!important;transform:translateY(-3px);}
.sp-sheet-tab:focus-visible,.sp-sheet-drag-handle:focus-visible{outline:2px solid var(--msl-accent);outline-offset:2px}
.sp-sheet-content{animation:sp-content-in 230ms cubic-bezier(.22,1,.36,1) both}
@keyframes sp-content-in{from{opacity:.12;transform:translateY(8px)}to{opacity:1;transform:none}}
.sp-sheet-panel .sp-preview-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:18px 0 9px}
.sp-preview-heading strong{font-size:.93rem}
.sp-preview-copy{display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.sp-preview-copy svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sp-sheet-panel .sp-sheet-value{margin:0;white-space:pre-wrap}
.sp-preview-chips{display:flex;gap:7px;flex-wrap:wrap;margin:8px 0 16px}
.sp-preview-chips span{padding:5px 10px;border-radius:999px;background:rgba(var(--msl-accent-rgb),.10);border:1px solid rgba(var(--msl-accent-rgb),.20);font-size:.78rem}
.sp-sheet-x .x-post-card{max-width:100%}
.sp-sheet-x .x-post-card textarea{min-height:150px}
.sp-sheet-x .x-post-card .row{flex-wrap:wrap}
.sp-sheet .sp-site-note{line-height:1.7}
body[data-color-mode=light] .sp-template-drawer{background:#fff!important}
body[data-color-mode=light] .sp-sheet-panel{border-color:#d9dde3}
body[data-color-mode=light] .sp-sheet-bar{background:linear-gradient(118deg,rgba(var(--msl-accent-rgb),.18),rgba(255,255,255,.84) 47%,rgba(var(--msl-accent-rgb),.10))!important;border-color:rgba(var(--msl-accent-rgb),.34)!important;color:#30343b}
body[data-color-mode=light] .sp-sheet-tab{background:linear-gradient(160deg,rgba(255,255,255,.88),rgba(var(--msl-accent-rgb),.065))!important}
body[data-color-mode=light] .sp-sheet-tab[aria-selected=true]{color:#fff!important;background:linear-gradient(135deg,var(--msl-accent-fill),rgba(var(--msl-accent-fill-rgb),.86))!important}
@media(max-width:600px){.sp-drawer-inner{padding:18px 20px 30px}.sp-sheet{--sp-h:65dvh}.sp-sheet-panel{padding:0 14px!important}.sp-sheet-bar{gap:7px;padding:8px 9px}.sp-sheet-tab{font-size:.78rem}}
@media(prefers-reduced-motion:reduce){.sp-template-overlay,.sp-template-drawer,.sp-sheet-panel,.sp-sheet-tab,.sp-preview-copy{transition:none!important}.sp-sheet-content{animation:none!important}}


/* v0.4.6dh — full-width compact milk-glass workspace, 28dvh + 160px and horizontal information architecture. */
.sp-sheet{--sp-h:28dvh;--sp-side-pad:clamp(14px,2vw,32px);width:100%;max-width:100vw}
.sp-sheet-panel,.sp-sheet-bar{width:100%!important;max-width:none!important;box-sizing:border-box}
.sp-sheet-panel{border-radius:24px 24px 0 0!important;padding:0 var(--sp-side-pad)!important;background:rgba(28,38,54,.88)!important;backdrop-filter:blur(22px) saturate(135%);-webkit-backdrop-filter:blur(22px) saturate(135%);border-color:rgba(189,205,228,.36)!important;box-shadow:0 -13px 35px rgba(0,0,0,.20),inset 0 1px rgba(255,255,255,.18)!important}
.sp-sheet.is-open .sp-sheet-panel{height:clamp(390px,calc(28dvh + 160px),580px)!important}
.sp-sheet-drag-handle{height:16px;min-height:16px}
.sp-sheet-drag-handle:after{width:54px;height:4px}
.sp-sheet-scroll{overflow:hidden!important;padding:0 0 12px!important;scrollbar-gutter:auto!important}
.sp-sheet-content{height:100%;min-height:0;display:flex;flex-direction:column}
.sp-sheet-content>h3{font-size:.98rem!important;line-height:1.25;margin:0 0 2px!important}
.sp-sheet-content>.hint{font-size:.72rem;line-height:1.3;margin:0 0 4px!important}
.sp-sheet-bar{min-height:55px!important;padding:7px var(--sp-side-pad) 7px!important;border-radius:0!important;gap:10px;background:linear-gradient(110deg,rgba(var(--msl-accent-rgb),.12),rgba(255,255,255,.18) 48%,rgba(var(--msl-accent-rgb),.13))!important}
.sp-sheet-tab{min-height:40px!important;font-weight:680}
.sp-sheet-tab[aria-selected=true]{color:inherit!important;background:linear-gradient(135deg,rgba(var(--msl-accent-rgb),.32),rgba(var(--msl-accent-rgb),.18))!important;box-shadow:inset 0 1px rgba(255,255,255,.37),0 3px 11px rgba(0,0,0,.09)!important;transform:translateY(-1px)}
.sp-preview-meta{flex:none}
.sp-preview-chips{margin:1px 0 6px!important;gap:6px}
.sp-preview-chips span{padding:2px 8px;font-size:.7rem;line-height:1.5}
#sp-preview{flex:1;display:flex;flex-direction:column;min-height:0}
.sp-preview-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1.7fr) minmax(0,3.4fr) minmax(0,1.6fr) minmax(0,1.5fr);gap:10px;flex:1;min-height:0}
.sp-preview-cell{display:flex;flex-direction:column;min-width:0;min-height:0;border:1px solid rgba(150,174,194,.23);border-radius:12px;background:rgba(255,255,255,.035);padding:8px;overflow:hidden}
.sp-sheet-panel .sp-preview-heading{margin:0 0 5px!important;min-height:24px;gap:5px}
.sp-preview-heading strong{font-size:clamp(.72rem,.85vw,.86rem);line-height:1.2}
.sp-sheet-panel .sp-sheet-value{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:8px!important;border-radius:8px;font-size:clamp(.72rem,.87vw,.87rem);line-height:1.5;scrollbar-width:thin;white-space:pre-wrap;overflow-wrap:anywhere}
.sp-thumb-frame{flex:1;min-height:0;display:grid;place-items:center;overflow:hidden;border-radius:9px;}
.sp-thumb-frame img{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain;aspect-ratio:16/9}
.sp-no-thumb{font-size:.75rem;text-align:center;opacity:.75;padding:6px}
.sp-sheet-x .x-post-card{width:100%;height:100%;min-height:0;max-width:none;display:grid;grid-template-columns:minmax(320px,2.3fr) minmax(0,3.6fr) minmax(260px,2.7fr);gap:10px;overflow:hidden}
.sp-sheet-x .sp-social-section{display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden;padding:8px 10px;border:1px solid rgba(150,174,194,.23);border-radius:12px;background:rgba(255,255,255,.035)}
.sp-sheet-x .sp-social-section h4{font-size:.82rem;line-height:1.25;margin:0 0 6px}
.sp-social-settings-content{font-size:.77rem;margin-bottom:5px}
.sp-social-label{opacity:.75;display:block;font-size:.7rem}
.sp-social-context{font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sp-sheet-x .sp-social-settings label,.sp-sheet-x .sp-social-editor label{font-size:.72rem;margin:0 0 4px!important}
.sp-sheet-x .sp-social-editor>label{display:none}
.sp-sheet-x .sp-social-section .helper,.sp-sheet-x .sp-social-section .hint{font-size:.68rem;line-height:1.25;margin:4px 0!important}
.sp-sheet-x .sp-social-section input{width:100%;min-width:0;padding:7px 8px;font-size:.75rem}
.sp-sheet-x .sp-social-editor textarea{flex:1;min-height:0!important;height:auto!important;resize:none;font-size:.82rem;line-height:1.42;padding:9px 10px}
.sp-sheet-x .sp-social-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;align-items:stretch}
.sp-sheet-x .sp-social-buttons .btn{display:flex;min-width:0;width:100%;min-height:44px;align-items:center;justify-content:center;gap:4px;padding:6px 4px;font-size:clamp(.62rem,.75vw,.77rem);font-weight:650;white-space:normal;line-height:1.25;text-align:center}
.sp-sheet-x .sp-social-buttons #resetXPost{order:0}
.sp-sheet-x .sp-social-buttons #copyXPost{order:1}
.sp-sheet-x .sp-social-buttons #openXPost{order:2}
.sp-sheet-x .sp-social-buttons .btn svg{flex:none;width:15px;height:15px}
.sp-sheet-x .sp-social-controls>.hint{margin-top:10px!important;opacity:.78}
body[data-color-mode=light] .sp-sheet-panel{border-color:rgba(var(--msl-accent-rgb),.16)!important;color:#30343b}
body[data-color-mode=light] .sp-sheet-bar{}
body[data-color-mode=light] .sp-sheet-tab{background:rgba(255,255,255,.48)!important;}
body[data-color-mode=light] .sp-sheet-tab[aria-selected=true]{border-color:rgba(var(--msl-accent-rgb),.36)!important}
body[data-color-mode=light] .sp-preview-cell,body[data-color-mode=light] .sp-sheet-x .sp-social-section{background:rgba(255,255,255,.38);}
body[data-color-mode=light] .sp-sheet-value{color:#293442}
@media(max-width:1250px){.sp-preview-grid{gap:6px}.sp-preview-cell{padding:6px}.sp-sheet-x .x-post-card{grid-template-columns:minmax(280px,2.05fr) minmax(0,3.05fr) minmax(240px,2.45fr);gap:7px}.sp-social-section{padding:6px!important}}
@media(max-width:1000px){.sp-sheet{--sp-h:46dvh}.sp-sheet.is-open .sp-sheet-panel{height:clamp(490px,calc(46dvh + 160px),680px)!important}.sp-sheet-scroll{overflow-y:auto!important}.sp-preview-grid{grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:minmax(145px,1fr)}.sp-cell-thumbnail,.sp-cell-title,.sp-cell-description{grid-column:span 2}.sp-cell-tags,.sp-cell-category{grid-column:span 3}.sp-sheet-x .x-post-card{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}.sp-social-controls{grid-column:1/-1}.sp-sheet-x .sp-social-buttons .btn{font-size:.8rem}}
@media(max-width:620px){.sp-sheet{--sp-h:65dvh}.sp-sheet.is-open .sp-sheet-panel{height:clamp(550px,calc(65dvh + 160px),840px)!important}.sp-sheet-content>.hint{font-size:.69rem}.sp-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(145px,auto)}.sp-preview-cell{grid-column:span 1!important}.sp-cell-description{grid-column:span 2!important}.sp-sheet-x .x-post-card{display:flex;flex-direction:column;overflow:visible}.sp-sheet-x .sp-social-editor{min-height:210px}.sp-sheet-x .sp-social-section{flex:none}.sp-sheet-x .sp-social-buttons{grid-template-columns:repeat(3,minmax(0,1fr))}.sp-sheet-x .sp-social-buttons .btn{font-size:.67rem}.sp-sheet-panel{padding:0 12px!important}.sp-sheet-bar{padding:7px 12px!important}}


/* v0.4.6dh — SNS actions: three stacked equal-size buttons in the right section. */
.sp-sheet-x .sp-social-controls .sp-social-buttons{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:repeat(3,minmax(44px,1fr));
  gap:9px!important;
  flex:0 0 auto;
  width:100%;
}
.sp-sheet-x .sp-social-controls .sp-social-buttons .btn{
  width:100%!important;
  min-height:44px!important;
  height:44px;
  font-size:clamp(.76rem,.86vw,.9rem)!important;
  padding:8px 12px!important;
  white-space:normal;
}
@media(max-width:620px){
  .sp-sheet-x .sp-social-controls .sp-social-buttons{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .sp-sheet-x .sp-social-controls .sp-social-buttons .btn{
    font-size:.82rem!important;
  }
}


/* v0.4.6dh: one-row preview header; chips aligned to the right of title and hint. */
.sp-preview-topline{display:flex;align-items:center;justify-content:space-between;gap:16px;flex:none;min-width:0;margin-bottom:10px}
.sp-preview-intro{flex:1 1 auto;min-width:0}
.sp-preview-intro h3{font-size:.98rem;line-height:1.25;margin:0 0 3px!important}
.sp-preview-intro .hint{font-size:.72rem;line-height:1.3;margin:0!important}
.sp-preview-topline .sp-preview-chips{display:flex;align-items:center;justify-content:flex-end;flex-wrap:nowrap;gap:7px;margin:0!important;flex:0 1 auto;min-width:0;max-width:55%}
.sp-preview-topline .sp-preview-chips span{white-space:nowrap;flex:none;font-size:.72rem;line-height:1.5;padding:4px 9px}
.sp-preview-topline .sp-preview-chips span:first-child{min-width:0;max-width:min(36vw,360px);overflow:hidden;text-overflow:ellipsis}
@media(max-width:850px){.sp-preview-topline{gap:9px;align-items:flex-start}.sp-preview-topline .sp-preview-chips{max-width:58%;overflow-x:auto;scrollbar-width:thin;padding-bottom:3px}.sp-preview-topline .sp-preview-chips span:first-child{max-width:180px}}
@media(max-width:620px){.sp-preview-topline{flex-wrap:wrap;gap:6px}.sp-preview-topline .sp-preview-chips{max-width:100%;width:100%;justify-content:flex-start}.sp-preview-topline .sp-preview-chips span:first-child{max-width:200px}}

/* v0.4.6dh — selected thumbnail over a dimmed, softly blurred copy of itself. */
.sp-thumb-frame{position:relative;isolation:isolate;display:grid;place-items:center;background:#141b26;overflow:hidden}
.sp-thumb-frame .sp-thumb-ambient{position:absolute;inset:-18px;z-index:0;overflow:hidden;pointer-events:none}
.sp-thumb-frame .sp-thumb-ambient img{display:block;width:100%;height:100%;max-width:none;max-height:none;aspect-ratio:auto;object-fit:cover;filter:blur(16px) brightness(.38) saturate(.84);transform:scale(1.12)}
.sp-thumb-frame .sp-thumb-selected{position:relative;z-index:1;display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;aspect-ratio:auto;filter:drop-shadow(0 3px 10px rgba(0,0,0,.33))}
.sp-thumb-frame .sp-no-thumb{position:relative;z-index:1}

/* v0.4.6dj — rebalance SNS columns for a comfortable broadcast URL field.
   Keep the action area compact and reserve the remaining width for editable copy. */
@media (min-width:1001px){
  .sp-sheet-x .x-post-card{
    grid-template-columns:clamp(340px,23vw,450px) minmax(0,1fr) clamp(250px,15vw,290px)!important;
    gap:12px;
  }
  .sp-sheet-x .sp-social-settings input{width:100%;box-sizing:border-box}
  .sp-sheet-x .sp-social-controls .sp-social-buttons .btn{font-size:clamp(.74rem,.77vw,.88rem)!important}
}

/* v0.4.6dj — same heading baseline and identical content-card top/bottom for both tabs. */
.sp-sheet-content{min-height:0}
.sp-sheet-content .sp-preview-topline{
  flex:0 0 56px;
  height:56px;
  min-height:56px;
  box-sizing:border-box;
  margin:0!important;
  padding:0 0 10px;
  align-items:center;
}
.sp-sheet-content .sp-preview-intro h3{margin:0 0 3px!important;line-height:1.25}
.sp-sheet-content .sp-preview-intro .hint{margin:0!important;line-height:1.3}
.sp-sheet-x #sp-x-home{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;border:0!important;margin:0!important;padding:0!important}
.sp-sheet-x #sp-x-home::before,.sp-sheet-x #sp-x-home::after{display:none!important}
.sp-sheet-x #sp-x-home>.x-post-card{
  flex:1 1 auto;
  height:auto!important;
  min-height:0;
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  box-shadow:none!important;
  margin:0!important;
  padding:0!important;
}
.sp-sheet-x .sp-social-section{height:100%;min-height:0;box-sizing:border-box}
@media(max-width:1000px){.sp-sheet-x .sp-social-section{height:auto;min-height:130px}}
@media(max-width:620px){.sp-sheet-content .sp-preview-topline{height:auto;min-height:56px;flex-basis:auto;padding-bottom:10px}}

/* v0.4.6dk — typography, streamlined header, light frosted-glass refinement. */
/* Both tabs retain the same 56px header and card start position. */
.sp-sheet-content .sp-preview-topline{gap:18px}
.sp-preview-intro--compact{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.sp-sheet-content .sp-preview-intro h3{font-size:1.03rem!important;line-height:1.35;font-weight:760;margin:0!important;white-space:nowrap}
.sp-sheet-content .sp-preview-intro .hint{font-size:.77rem!important;line-height:1.4!important;margin:0!important}
.sp-sheet-content .sp-preview-topline .sp-preview-chips{gap:8px;max-width:52%;flex-shrink:0}
.sp-sheet-content .sp-preview-topline .sp-preview-chips span{font-size:.875rem!important;line-height:1.25!important;padding:6px 11px!important;font-weight:650}
.sp-sheet-content .sp-preview-topline .sp-preview-chips span:first-child{max-width:min(32vw,340px)}
.sp-sheet-panel .sp-preview-heading strong{font-size:clamp(.86rem,.92vw,.98rem)!important;line-height:1.3}
.sp-sheet-panel .sp-sheet-value{font-size:clamp(.83rem,.87vw,.95rem)!important;line-height:1.55!important}
.sp-sheet-x .sp-social-section h4{font-size:.94rem!important;line-height:1.35;margin-bottom:9px!important}
.sp-sheet-x .sp-social-label,.sp-sheet-x .sp-social-settings label,.sp-sheet-x .sp-social-editor label{font-size:.82rem!important;line-height:1.4}
.sp-sheet-x .sp-social-settings-content{font-size:.86rem;line-height:1.45}
.sp-sheet-x .sp-social-section .helper,.sp-sheet-x .sp-social-section .hint{font-size:.78rem!important;line-height:1.4!important;margin:6px 0!important}
.sp-sheet-x .sp-social-section input{font-size:.86rem!important}
.sp-sheet-x .sp-social-editor textarea{font-size:.90rem!important;line-height:1.6!important}
.sp-sheet-x .sp-social-controls .sp-social-buttons{grid-template-rows:repeat(3,44px)!important;align-content:start!important;align-items:start!important;gap:9px!important;margin-top:0!important}
.sp-sheet-x .sp-social-controls .sp-social-buttons .btn{height:44px!important;min-height:44px!important;max-height:44px!important;margin:0!important;align-self:start!important}
/* Lower edge of the sheet is a faint light reflection, not a hard white rule. */
.sp-sheet-bar{border-top:1px solid rgba(205,224,242,.16)!important;box-shadow:0 -8px 25px rgba(0,0,0,.10),inset 0 1px rgba(255,255,255,.08)!important}
.sp-sheet-bar:before{height:2px!important;inset:0 3% auto!important;background:linear-gradient(90deg,transparent,rgba(221,235,253,.19) 24%,rgba(255,255,255,.25) 50%,rgba(221,235,253,.19) 76%,transparent)!important;filter:blur(1.2px)}
/* Light retains dark mode's layered depth but uses milky translucent surfaces. */
body[data-color-mode=light] .sp-sheet-panel{background:linear-gradient(118deg,rgba(255,255,255,.78),rgba(255,248,249,.72) 55%,rgba(255,255,255,.77))!important;backdrop-filter:blur(24px) saturate(145%);-webkit-backdrop-filter:blur(24px) saturate(145%);border-color:rgba(255,255,255,.78)!important;box-shadow:0 -13px 36px rgba(97,68,85,.11),inset 0 1px rgba(255,255,255,.85)!important}
body[data-color-mode=light] .sp-sheet-bar{background:linear-gradient(110deg,rgba(var(--msl-accent-rgb),.105),rgba(255,255,255,.43) 47%,rgba(var(--msl-accent-rgb),.095))!important;backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border-top:1px solid rgba(255,255,255,.48)!important;box-shadow:0 -8px 26px rgba(97,68,85,.09),inset 0 1px rgba(255,255,255,.40)!important}
body[data-color-mode=light] .sp-sheet-bar:before{background:linear-gradient(90deg,transparent,rgba(255,255,255,.42) 22%,rgba(255,255,255,.58) 50%,rgba(255,255,255,.42) 78%,transparent)!important;opacity:.65;filter:blur(1.7px)}
body[data-color-mode=light] .sp-sheet-tab{background:linear-gradient(145deg,rgba(255,255,255,.40),rgba(var(--msl-accent-rgb),.035))!important;color:#47515d!important;border:1px solid rgba(255,255,255,.75)!important;box-shadow:inset 0 1px rgba(255,255,255,.68),0 3px 9px rgba(67,48,64,.045)!important;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px)}
body[data-color-mode=light] .sp-sheet-tab[aria-selected=true]{background:linear-gradient(120deg,rgba(var(--msl-accent-rgb),.20),rgba(255,255,255,.39) 74%)!important;border-color:rgba(var(--msl-accent-rgb),.32)!important;color:#38414b!important;box-shadow:inset 0 1px rgba(255,255,255,.74),0 4px 12px rgba(var(--msl-accent-rgb),.09)!important}
body[data-color-mode=light] .sp-sheet-tab:hover{background:rgba(var(--msl-accent-rgb),.13)!important}
body[data-color-mode=light] .sp-preview-cell,body[data-color-mode=light] .sp-sheet-x .sp-social-section{background:linear-gradient(148deg,rgba(255,255,255,.48),rgba(255,255,255,.32))!important;border-color:rgba(140,150,168,.18)!important;box-shadow:inset 0 1px rgba(255,255,255,.60),0 3px 12px rgba(70,65,82,.025)}
body[data-color-mode=light] .sp-sheet-value{background:rgba(251,252,255,.48)!important;border-color:rgba(148,164,185,.20)!important;color:#293442!important}
body[data-color-mode=light] .sp-thumb-frame{background:#f4ede8}
body[data-color-mode=light] .sp-thumb-frame .sp-thumb-ambient img{filter:blur(18px) brightness(1.27) saturate(.70)!important}
body[data-color-mode=light] .sp-thumb-frame .sp-thumb-ambient:after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.60);pointer-events:none}
body[data-color-mode=light] .sp-thumb-frame .sp-thumb-selected{filter:drop-shadow(0 4px 10px rgba(69,47,38,.16))}
/* On smaller desktop windows, avoid squeezing chips into the title. */
@media(max-width:1400px){.sp-preview-intro--compact{display:block}.sp-sheet-content .sp-preview-intro h3{margin-bottom:2px!important}.sp-sheet-content .sp-preview-topline .sp-preview-chips{max-width:49%}}
@media(max-width:850px){.sp-sheet-content .sp-preview-topline{gap:7px}.sp-sheet-content .sp-preview-topline .sp-preview-chips{max-width:54%;overflow:auto}.sp-sheet-content .sp-preview-topline .sp-preview-chips span{font-size:.78rem!important;padding:5px 8px!important}}
@media(max-width:620px){.sp-sheet-content .sp-preview-topline{height:auto;min-height:56px;flex-basis:auto;flex-wrap:wrap;align-items:flex-start}.sp-sheet-content .sp-preview-topline .sp-preview-chips{max-width:100%;width:100%;justify-content:flex-start;flex-wrap:wrap}.sp-sheet-content .sp-preview-intro .hint{font-size:.72rem!important}}


/* v0.4.6do — prominent sheet headings with vertically centered inline help. */
.sp-sheet-content .sp-preview-topline{align-items:center!important}
.sp-sheet-content .sp-preview-intro--compact{display:flex!important;align-items:center!important;align-content:center;flex-wrap:wrap;column-gap:14px;row-gap:3px}
.sp-sheet-content .sp-preview-intro h3{font-size:1.35rem!important;line-height:1.3!important;font-weight:780!important;margin:0!important;flex-shrink:0}
.sp-sheet-content .sp-preview-intro .hint{font-size:.86rem!important;line-height:1.45!important;margin:0!important;align-self:center}
@media(max-width:620px){.sp-sheet-content .sp-preview-intro--compact{align-items:flex-start!important;row-gap:4px}.sp-sheet-content .sp-preview-intro h3{font-size:1.2rem!important}.sp-sheet-content .sp-preview-intro .hint{font-size:.75rem!important}}


/* v0.4.6do — SNS operation buttons: deterministic top-aligned vertical stack. */
.sp-sheet-x .sp-social-controls .sp-social-buttons {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: stretch !important;
  gap: 12px !important;
  width: 100% !important;
  height: auto !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
.sp-sheet-x .sp-social-controls .sp-social-buttons > .btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  box-sizing: border-box !important;
  flex: 0 0 46px !important;
  width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;
  max-height: 46px !important;
  margin: 0 !important;
  padding: 8px 12px !important;
  transform: none !important;
}
.sp-sheet-x .sp-social-controls .sp-social-buttons > #resetXPost { order: 0 !important; }
.sp-sheet-x .sp-social-controls .sp-social-buttons > #copyXPost { order: 1 !important; }
.sp-sheet-x .sp-social-controls .sp-social-buttons > #openXPost { order: 2 !important; }


/* v0.4.6dv Layout B (comparison): thumbnail and title stacked in left column;
   broad description, tags and category adjacent. All data and copy controls retained. */
@media (min-width:1001px){
  .sp-preview-grid.sp-preview-grid--layout-b{
    grid-template-columns:minmax(0,24fr) minmax(0,44fr) minmax(0,16fr) minmax(0,16fr);
    grid-template-rows:minmax(0,1fr);
    align-items:stretch;
  }
  .sp-preview-grid--layout-b .sp-preview-media-stack{
    display:grid;grid-template-columns:minmax(0,1fr);
    grid-template-rows:minmax(0,1fr) minmax(72px, .31fr);
    gap:10px;min-height:0;min-width:0;
  }
  .sp-preview-grid--layout-b .sp-preview-media-stack>.sp-preview-cell{min-height:0}
  .sp-preview-grid--layout-b .sp-cell-thumbnail .sp-thumb-frame{min-height:0}
  .sp-preview-grid--layout-b .sp-cell-title .sp-sheet-value{overflow:auto}
}
/* preserve natural 01-05 order for tablets and phones */
@media (max-width:1000px){
  .sp-preview-grid--layout-b .sp-preview-media-stack{display:contents}
}

/* v0.4.6dv Layout C trial: image left, title/description in central stack, tags/category right. */
@media (min-width:1001px){
 .sp-preview-grid.sp-preview-grid--layout-c{
   grid-template-columns:minmax(0,24fr) minmax(0,44fr) minmax(0,16fr) minmax(0,16fr);
   grid-template-rows:minmax(0,1fr);
   align-items:stretch;
 }
 .sp-preview-grid--layout-c>.sp-cell-thumbnail{min-height:0}
 .sp-preview-grid--layout-c .sp-preview-text-stack{
   display:flex; flex-direction:column; gap:10px; min-width:0; min-height:0;
 }
 .sp-preview-grid--layout-c .sp-preview-text-stack>.sp-cell-title{
   flex:0 0 auto; min-height:92px; max-height:none;
 }
 .sp-preview-grid--layout-c .sp-cell-title .sp-sheet-value{
   overflow:visible!important; flex:none; min-height:0;
   white-space:pre-wrap; overflow-wrap:anywhere;
 }
 .sp-preview-grid--layout-c .sp-preview-text-stack>.sp-cell-description{
   flex:1 1 auto; min-height:0;
 }
 .sp-preview-grid--layout-c .sp-cell-thumbnail .sp-thumb-frame{min-height:0}
}
/* Tablet and mobile: retain natural 01,02,03,04,05 order and original responsive grid. */
@media (max-width:1000px){
 .sp-preview-grid--layout-c .sp-preview-text-stack{display:contents}
}

/* StreamPico v0.4.6dv — Bottom Sheet finishing */
.sp-sheet{--sp-sheet-line:rgba(var(--msl-accent-rgb),.65)}
.sp-sheet-bar{position:relative!important;isolation:isolate}
.sp-sheet-panel{position:relative!important}
.sp-sheet-bar{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px!important}
.sp-sheet-tab{min-width:0;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}
.sp-sheet-content[hidden]{display:none!important}
.sp-sheet-common{overflow-y:auto}
.sp-common-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:4px 0 18px}
.sp-common-item{position:relative;border:1px solid rgba(var(--msl-accent-rgb),.19);background:rgba(130,130,150,.05);border-radius:12px;padding:14px 16px;min-width:0}
.sp-common-label{font-size:.82rem;opacity:.72;margin-bottom:8px;font-weight:650}
.sp-common-value{font-size:.93rem;line-height:1.6;overflow-wrap:anywhere;white-space:pre-wrap}
.sp-sheet-tab:focus-visible{outline:2px solid rgba(var(--msl-accent-rgb),.8);outline-offset:2px}
.sp-common-note{grid-column:1/-1;font-size:.8rem;opacity:.75;line-height:1.6;margin:4px 0}
@media(max-width:700px){.sp-common-grid{grid-template-columns:1fr}.sp-sheet-bar{gap:2px!important}.sp-sheet-tab{font-size:clamp(10px,2.8vw,14px)!important;padding-inline:3px!important}}
@media(prefers-reduced-motion:reduce){.sp-sheet-panel,.sp-sheet-tab{transition:none!important}}

/* v0.4.6dv — thumbnail management integrated into "今回の配信".
   All original thumbnail element IDs and event listeners remain unchanged. */
.sp-stream-thumbnail{
  margin-top:24px;
  padding-top:22px;
  border-top:1px solid var(--msl-line,rgba(175,198,229,.18));
  min-width:0;
}
.sp-stream-thumbnail .sp-thumb-section-title{
  margin:0 0 9px;
  display:flex;
  align-items:center;
  gap:8px;
  font-size:1.04rem;
  line-height:1.4;
  font-weight:750;
}
.sp-stream-thumbnail .thumb-preview{
  max-width:100%;
  aspect-ratio:16/9;
}
.sp-stream-thumbnail #thumbInfo{min-height:1.4em}
.sp-stream-thumbnail .row:has(#downloadThumb){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-space-2)}
.sp-stream-thumbnail .row:has(#downloadThumb)>.btn{min-width:0;width:100%;font-size:clamp(.74rem,.8vw,.87rem);padding:9px 5px}
.sp-thumb-history-disclosure{margin:21px 0 0;min-width:0}
.sp-thumb-history-disclosure>summary{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px 14px;min-height:49px;border-radius:12px;
  background:rgba(var(--msl-accent-rgb,18,183,240),.075);
  border:1px solid rgba(var(--msl-accent-rgb,18,183,240),.25);
  color:var(--msl-accent,#12b7f0);
  cursor:pointer;font-size:.89rem;font-weight:700;
  list-style:none;
}
.sp-thumb-history-disclosure>summary::-webkit-details-marker{display:none}
.sp-thumb-history-disclosure>summary:hover{background:rgba(var(--msl-accent-rgb,18,183,240),.12)}
.sp-thumb-history-disclosure>summary:focus-visible{outline:2px solid var(--msl-accent);outline-offset:3px}
.sp-thumb-history-chevron{font-size:1.25rem;line-height:1;transition:transform .2s ease;transform:rotate(0deg)}
.sp-thumb-history-disclosure[open] .sp-thumb-history-chevron{transform:rotate(180deg)}
.sp-thumb-history-body{padding-top:12px;min-width:0}
.sp-stream-thumbnail .thumb-history-header{align-items:flex-start;gap:10px;margin-top:0!important}
.sp-stream-thumbnail .thumb-history-heading{width:100%}
.sp-stream-thumbnail .thumb-history-tools{display:grid;grid-template-columns:minmax(0,1fr) minmax(115px,.6fr);width:100%;gap:8px}
.sp-stream-thumbnail .thumb-history-tools #thumbSearch,
.sp-stream-thumbnail .thumb-history-tools .msl-select-wrap,
.sp-stream-thumbnail .thumb-history-tools #thumbSort{width:100%;min-width:0;max-width:none}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-list{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-tile{padding:7px!important}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-actions .thumb-use{font-size:.71rem!important}
.sp-stream-thumbnail .thumb-storage-warning{margin-top:19px!important}
body[data-color-mode="light"] .sp-thumb-history-disclosure>summary{
  background:rgba(var(--msl-accent-rgb,18,183,240),.055);
  border-color:rgba(var(--msl-accent-rgb,18,183,240),.30);
  color:var(--msl-accent-fill,#0879b6)!important;
}
body[data-color-mode="light"] .sp-thumb-history-disclosure>summary:hover{background:rgba(var(--msl-accent-rgb,18,183,240),.105)}
@media(max-width:420px){
  .sp-stream-thumbnail .thumb-history-tools{grid-template-columns:1fr}
  .sp-stream-thumbnail .thumb-gallery-layout .thumb-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:355px){
  .sp-stream-thumbnail .thumb-gallery-layout .thumb-list{grid-template-columns:1fr!important}
}
@media(prefers-reduced-motion:reduce){.sp-thumb-history-chevron{transition:none}}


/* v0.4.6dv — common arrow geometry and compact stream workspace. */
.sp-thumb-history-disclosure>summary{min-height:49px;display:flex;align-items:center!important;justify-content:space-between;gap:12px;line-height:1.35;padding:11px 13px}
.sp-thumb-history-label{display:inline-flex;align-items:center;gap:8px;min-width:0;line-height:1.35}
.sp-thumb-history-emoji{display:inline-flex;justify-content:center;align-items:center;flex:0 0 22px;width:22px;height:22px;font-size:20px;line-height:1;vertical-align:middle}
.sp-thumb-history-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;transform:none!important;transition:transform .2s ease;transform-origin:center}
.sp-thumb-history-chevron svg{display:block;width:18px!important;height:18px!important;flex:none;overflow:visible}
.sp-thumb-history-disclosure[open] .sp-thumb-history-chevron{transform:rotate(180deg)!important}
/* Image preview and upload remain always visible; compress only surrounding copy/whitespace. */
.sp-stream-thumbnail{margin-top:17px!important;padding-top:17px!important}
.sp-stream-thumbnail .sp-thumb-section-title{margin-bottom:6px}
.sp-stream-thumbnail .sp-thumb-short-hint{margin:3px 0 11px!important;line-height:1.5}
.sp-stream-thumbnail .sp-thumb-hint-extra{display:none}
.sp-stream-thumbnail #thumbUploadStatus{margin:5px 0 7px;min-height:1.2em;font-size:.74rem;line-height:1.45}
.sp-stream-thumbnail #thumbCheck{margin:7px 0!important;line-height:1.45;font-size:.74rem}
.sp-stream-thumbnail .sp-thumb-history-disclosure{margin-top:15px!important}
.sp-thumb-storage-details{margin:12px 0 0}
.sp-thumb-storage-details>summary{cursor:pointer;display:list-item;padding:7px 2px;color:inherit;font-size:.78rem;line-height:1.45;opacity:.86}
.sp-thumb-storage-details>summary:hover{color:var(--msl-accent)!important;opacity:1}
.sp-thumb-storage-details>summary:focus-visible{outline:2px solid var(--msl-accent);outline-offset:3px}
.sp-thumb-storage-details .thumb-storage-warning{margin:7px 0 0!important}
body[data-color-mode="light"] .sp-thumb-storage-details>summary{color:#616b78!important}
@media(prefers-reduced-motion:reduce){.sp-thumb-history-chevron{transition:none!important}}


/* v0.4.6dw — Unified heading type scale, alignment and geometry.
   UI-only: no changes to presets, thumbnail storage or application logic. */
:root {
  --sp-heading-section: 16px;
  --sp-heading-line-height: 1.45;
  --sp-heading-weight: 700;
  --sp-heading-icon: 18px;
}
/* Both top-level columns share exactly the same heading rhythm. */
.layout > div > .panel > h2.msl-heading-major,
.layout > .panel > h2.msl-heading-major,
.layout .panel > h2.msl-heading-major {
  display:flex!important;
  align-items:center!important;
  min-height:26px;
  margin:0 0 var(--sp-space-4)!important;
  padding:0!important;
  font-size:16px!important;
  font-weight:700!important;
  line-height:26px!important;
}
/* Small headings and input-section titles: unified at 16px.
   Keep helper copy and actual form value text at their existing sizes. */
.panel .msl-heading-minor,
.panel .sp-stream-thumbnail .sp-thumb-section-title,
.panel .sp-stream-thumbnail .thumb-history-heading h3.msl-heading-minor,
.panel .sp-thumb-history-disclosure > summary,
.panel .sp-thumb-storage-details > summary {
  font-size:var(--sp-heading-section)!important;
  font-weight:var(--sp-heading-weight)!important;
  line-height:var(--sp-heading-line-height)!important;
}
.panel .msl-heading-minor {align-items:center!important;}
.panel label.msl-heading-minor {display:inline-flex!important;min-height:23px;}
.panel .sp-stream-thumbnail .sp-thumb-section-title {
  min-height:26px;
  display:flex!important;
  align-items:center!important;
  margin:0 0 8px!important;
}
.panel .sp-thumb-history-disclosure > summary {
  display:flex!important;
  align-items:center!important;
  min-height:49px;
  padding:11px 13px;
}
.sp-thumb-history-label {display:inline-flex!important;align-items:center!important;gap:9px!important;}
.sp-thumb-history-emoji {
  flex:0 0 18px!important;
  width:18px!important;
  height:20px!important;
  font-size:17px!important;
  line-height:1!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.sp-thumb-history-chevron {align-self:center!important;}
/* Standardize heading emoji appearance without changing their content. */
.panel h2.msl-heading-major,
.panel .sp-thumb-section-title {gap:9px!important;}
.panel .sp-thumb-storage-details > summary {padding:8px 2px!important;}
@media (max-width:800px) {
  .layout .panel > h2.msl-heading-major {min-height:26px;}
}


/* v0.4.6dx — readable supporting descriptions across the main workspace.
   Scope to the main panels; preserve compact Bottom Sheet typography. */
.layout .panel p.hint,
.layout .panel p.helper,
.layout .panel .social-tip,
.layout .panel .social-tip-text {
  font-size:14px!important;
  line-height:1.65!important;
  letter-spacing:0;
}
/* The introductory explanations on both columns share the same rhythm. */
.layout .panel > h2.msl-heading-major + p.hint,
.layout .panel > h2.msl-heading-major + p.helper,
.layout .panel .description-options > p.hint {
  font-size:14px!important;
  line-height:1.7!important;
  margin-top:6px!important;
  margin-bottom:16px!important;
}
/* Respect restrained explanatory hierarchy in both light and dark themes. */
body[data-color-mode="light"] .layout .panel p.hint,
body[data-color-mode="light"] .layout .panel p.helper {
  color:#616b78!important;
}


/* v0.4.6dy — StreamPico unified type scale.
   20px panel headings / 16px subheadings and body / 14px helper and warnings.
   Preserve compact toolbars, counters and Bottom Sheet density. */
:root{
  --sp-type-heading:20px;
  --sp-type-subheading:16px;
  --sp-type-body:16px;
  --sp-type-caption:14px;
  --sp-type-meta:12px;
  --sp-type-leading:1.6;
}
/* Major panel sections share equal height and spacing across both columns. */
.layout .panel > h2.msl-heading-major{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  font-size:var(--sp-type-heading)!important;
  line-height:1.4!important;
  font-weight:750!important;
  min-height:32px!important;
  margin:0 0 16px!important;
  padding:0!important;
}
/* In-panel headings, input labels and disclosure group headings. */
.layout .panel .msl-heading-minor,
.layout .panel .sp-thumb-section-title,
.layout .panel .sp-thumb-history-disclosure > summary,
.layout .panel .sp-thumb-storage-details > summary,
.layout .panel .description-options > strong,
.layout .panel details.disclosure > summary,
.layout .panel .twitch-guide-subheading{
  font-size:var(--sp-type-subheading)!important;
  font-weight:700!important;
  line-height:1.5!important;
}
/* Main readable text. Form inputs are already 15px in the existing design;
   normalize them to 16px, while avoiding dense utility buttons and counters. */
.layout .panel input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.layout .panel textarea,
.layout .panel select,
.layout .panel .msl-select-trigger{
  font-size:var(--sp-type-body)!important;
  line-height:1.55!important;
  font-weight:400;
}
/* Standalone body paragraphs (not helper, status, warning or metadata). */
.layout .panel p:not(.hint):not(.helper):not(.muted):not(.social-tip):not(.social-tip-text):not(.warning):not(.platform-edit-intro):not(.thumb-filename):not(.thumb-meta):not(.thumb-properties):not(.thumb-storage-warning):not(.field-counter-row){
  font-size:var(--sp-type-body);
  line-height:var(--sp-type-leading);
  font-weight:400;
}
/* Secondary information is deliberately smaller, with generous line height. */
.layout .panel p.hint,
.layout .panel p.helper,
.layout .panel .social-tip,
.layout .panel .social-tip-text,
.layout .panel .platform-edit-intro,
.layout .panel .inline-note,
.layout .panel .thumb-storage-warning{
  font-size:var(--sp-type-caption)!important;
  line-height:1.65!important;
  font-weight:400;
}
/* Warnings remain readable rather than shrinking below helper copy.
   Semantic styling differentiates importance from ordinary descriptions. */
.layout .panel .warning,
.layout .panel .thumb-storage-warning,
.layout .panel p.hint.warning,
.layout .panel p.helper.warning{
  font-size:var(--sp-type-caption)!important;
  line-height:1.65!important;
}
.layout .panel .thumb-storage-warning{
  font-weight:400!important;
}
.layout .panel .thumb-storage-warning strong{font-weight:700!important;}
/* Counter and compact metadata stay quiet. */
.layout .panel .counter,
.layout .panel .field-counter-row,
.layout .panel .thumb-meta,
.layout .panel .thumb-properties{
  font-size:var(--sp-type-meta)!important;
}
/* Preserve icon-to-text optical alignment. */
.layout .panel > h2.msl-heading-major,
.layout .panel .sp-thumb-section-title{
  vertical-align:middle;
}
body[data-color-mode="light"] .layout .panel .warning:not(.thumb-storage-warning){
  color:#9a521a!important;
}
@media(max-width:650px){
  .layout .panel > h2.msl-heading-major{font-size:19px!important;min-height:30px!important;}
}


/* v0.4.6dz — consistent rhythm for the unified type scale.
   Base unit: 4px. Scoped to main panels, avoiding Bottom Sheet/editor interactions. */
:root{
  --sp-space-1:4px;
  --sp-space-2:8px;
  --sp-space-3:12px;
  --sp-space-4:16px;
  --sp-space-6:24px;
  --sp-space-8:32px;
}
/* Identical panel internal padding ensures a common left/right baseline. */
.layout .panel{padding:24px!important;}
.layout .panel>h2.msl-heading-major{
  margin:0 0 var(--sp-space-4)!important;
  min-height:32px!important;
}
/* Intro paragraph immediately follows the panel heading. */
.layout .panel>h2.msl-heading-major+p.hint{
  margin:0 0 var(--sp-space-6)!important;
}
/* Labels: 16px above when starting next field, 8px below. */
.layout .panel>label.msl-heading-minor,
.layout .panel .field>label.msl-heading-minor,
.layout .panel .config-field>label.msl-heading-minor{
  margin:var(--sp-space-4) 0 var(--sp-space-2)!important;
}
/* Help text belongs to its label, not the next field. */
.layout .panel label.msl-heading-minor+p.helper,
.layout .panel label.msl-heading-minor+p.hint{
  margin:0 0 var(--sp-space-2)!important;
}
/* One compact field rhythm; retain the controls' native heights. */
.layout .panel>input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.layout .panel>textarea,
.layout .panel>select,
.layout .panel> .msl-select-wrap{
  margin-bottom:var(--sp-space-2);
}
.layout .panel>input+p.hint,
.layout .panel>textarea+p.hint,
.layout .panel>.msl-select-wrap+p.hint{
  margin:var(--sp-space-2) 0 var(--sp-space-4)!important;
}
/* Mid-level sections within the current-stream panel. */
.layout .panel .sp-stream-thumbnail{
  margin-top:var(--sp-space-6)!important;
  padding-top:var(--sp-space-6)!important;
}
.layout .panel .sp-thumb-section-title{
  margin:0 0 var(--sp-space-3)!important;
}
.layout .panel .sp-thumb-history-disclosure{
  margin-top:var(--sp-space-6)!important;
}
.layout .panel .sp-thumb-history-body{padding-top:var(--sp-space-4)!important;}
/* Groups of checkboxes and primary actions use the same 8px inter-item gap. */
.layout .panel .game-actions,
.layout .panel .check-grid{gap:var(--sp-space-2)!important;}
.layout .panel .game-actions{margin-top:var(--sp-space-3)!important;}
.layout .panel .field-head{margin-bottom:var(--sp-space-2)!important;}
/* Keep section separation visible without creating lengthy blank runs. */
.layout .panel>.sep{margin:var(--sp-space-6) 0!important;}
.layout .panel>.disclosure:not(.social-body){margin-top:var(--sp-space-6)!important;}
/* Spacing follows typography rather than shrinking small screens aggressively. */
@media(max-width:800px){
  .layout .panel{padding:16px!important;}
  .layout .panel>h2.msl-heading-major+p.hint{margin-bottom:var(--sp-space-4)!important;}
}


/* v0.4.6ea — unify thumbnail metadata and bottom-sheet typography.
   Text styles only; existing tabs, actions, persistence and picture IDs retained. */
/* The selected image file name and dimensions are informational metadata. */
.sp-stream-thumbnail #thumbInfo,
.sp-stream-thumbnail #thumbUploadStatus,
.sp-stream-thumbnail #thumbCheck,
.sp-stream-thumbnail .thumb-file-current,
.sp-stream-thumbnail .sp-thumb-short-hint,
.sp-stream-thumbnail .thumb-storage-warning{
  font-size:12px!important;
  line-height:1.55!important;
  font-weight:400!important;
}
.sp-stream-thumbnail #thumbInfo {margin:7px 0 12px!important;}
.sp-stream-thumbnail #thumbUploadStatus{margin:6px 0 9px!important;}
/* Count is metadata associated with a 16px subheading, not a second heading. */
.sp-stream-thumbnail .thumb-history-heading #thumbCount,
.sp-stream-thumbnail .thumb-history-heading h3.msl-heading-minor #thumbCount,
body[data-color-mode="light"] .sp-stream-thumbnail .thumb-history-heading h3.msl-heading-minor #thumbCount {
  font-size:14px!important;
  font-weight:400!important;
  line-height:1.5!important;
  color:inherit;
  opacity:.72;
}
/* Bottom sheet follows the same scale as the main page. */
.sp-sheet{--sp-sheet-heading:20px;--sp-sheet-subheading:16px;--sp-sheet-body:16px;--sp-sheet-description:14px;--sp-sheet-meta:12px}
.sp-sheet-content .sp-preview-intro h3{
  font-size:var(--sp-sheet-heading)!important;
  line-height:1.4!important;
  font-weight:750!important;
  white-space:normal!important;
}
.sp-sheet-content .sp-preview-intro .hint,
.sp-sheet-content>.hint,
.sp-sheet-x .sp-social-section .helper,
.sp-sheet-x .sp-social-section .hint,
.sp-sheet-x .sp-social-controls>.hint,
.sp-sheet .sp-site-note,
.sp-sheet .sp-common-note{
  font-size:var(--sp-sheet-description)!important;
  line-height:1.6!important;
  font-weight:400!important;
}
.sp-sheet-panel .sp-preview-heading strong,
.sp-sheet-x .sp-social-section h4,
.sp-sheet-x .sp-social-settings label,
.sp-sheet-x .sp-social-editor label,
.sp-sheet .sp-common-label{
  font-size:var(--sp-sheet-subheading)!important;
  line-height:1.45!important;
  font-weight:700!important;
}
.sp-sheet-panel .sp-sheet-value,
.sp-sheet-x .sp-social-editor textarea,
.sp-sheet-x .sp-social-section input,
.sp-sheet-x .sp-social-settings-content,
.sp-sheet .sp-common-value{
  font-size:var(--sp-sheet-body)!important;
  line-height:1.6!important;
  font-weight:400!important;
}
.sp-sheet .sp-common-label{opacity:1}
.sp-sheet .sp-social-label,
.sp-sheet .sp-preview-chips span,
.sp-sheet .sp-common-copy{
  font-size:var(--sp-sheet-meta)!important;
  line-height:1.4!important;
}
/* Make card headings and copy affordances coexist without overlap. */
.sp-sheet-panel .sp-preview-heading{min-height:32px!important;margin-bottom:7px!important}
.sp-sheet .sp-preview-cell,.sp-sheet .sp-social-section{min-width:0}
/* Allow content to scroll when 16px text wraps, especially on mobile/tablet. */
.sp-sheet .sp-sheet-scroll{overflow-y:auto!important;overscroll-behavior:contain}
.sp-sheet .sp-sheet-value{overflow:auto!important;min-height:0}
.sp-sheet-x .sp-social-section{overflow-y:auto!important}
.sp-sheet .sp-social-context{white-space:normal;overflow-wrap:anywhere}
@media(max-width:1000px){
 .sp-sheet-x .sp-social-editor textarea{min-height:150px!important;}
}
@media(max-width:620px){
 .sp-sheet-content .sp-preview-intro h3{font-size:20px!important}
 .sp-sheet-content .sp-preview-intro .hint{font-size:14px!important}
 .sp-sheet .sp-sheet-content .sp-preview-topline{height:auto!important}
 .sp-sheet .sp-sheet-content .sp-preview-topline .sp-preview-chips{overflow-x:auto}
 .sp-sheet .sp-preview-cell{min-height:0}
 .sp-sheet .sp-common-item{padding:12px 68px 12px 14px}
}


/* v0.4.6eb — match the seven main panel headings to the Bottom Sheet title.
   Sheet reference: 1.35rem / 780 / 1.3 (small screen: 1.2rem). */
.layout .panel > h2.msl-heading-major,
.layout .panel > .row > h2,
.layout .panel > h2:not(.msl-heading-minor) {
  font-size:1.35rem!important;
  font-weight:780!important;
  line-height:1.3!important;
  min-height:30px!important;
  margin:0 0 16px!important;
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
}
/* The trash title shares its row with the collapse button. */
.layout .panel > .row > h2 { margin:0!important; }
@media(max-width:620px){
 .layout .panel > h2.msl-heading-major,
 .layout .panel > .row > h2,
 .layout .panel > h2:not(.msl-heading-minor) {font-size:1.2rem!important;}
}


/* v0.4.6ec — uniform large headings: 24px label / 20px emoji.
   Separate emoji box aligns visual centers; unrelated UI remains unchanged. */
.layout .panel > h2.msl-heading-major:has(.sp-major-emoji),
.layout .panel > .row > h2:has(.sp-major-emoji),
.sp-sheet-content .sp-preview-intro h3:has(.sp-major-emoji){
  display:flex!important;
  align-items:center!important;
  column-gap:10px!important;
  font-size:24px!important;
  font-weight:780!important;
  line-height:1.35!important;
  min-height:34px!important;
}
.layout .panel > h2.msl-heading-major:has(.sp-major-emoji){margin-bottom:16px!important;}
.layout .panel > .row > h2:has(.sp-major-emoji){margin:0!important;}
.sp-major-emoji{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 24px!important;
  width:24px!important;
  height:28px!important;
  font-size:20px!important;
  line-height:1!important;
  font-weight:400!important;
  text-align:center;
  vertical-align:middle;
  transform:translateY(-1px);
}
.sp-major-text{display:inline-block;min-width:0;line-height:1.35;font-weight:inherit;}
@media(max-width:620px){
 .layout .panel > h2.msl-heading-major:has(.sp-major-emoji),
 .layout .panel > .row > h2:has(.sp-major-emoji),
 .sp-sheet-content .sp-preview-intro h3:has(.sp-major-emoji){font-size:22px!important;min-height:32px!important;}
}


/* v0.4.6ed — streamline thumbnail selection: upload first, preview second. */
.sp-stream-thumbnail .thumb-file-picker{margin-top:12px!important}
.sp-stream-thumbnail #thumbUploadStatus,
.sp-stream-thumbnail #thumbCheck{
  font-size:12px!important;line-height:1.5!important;
  letter-spacing:-.015em!important;
  white-space:nowrap!important;
  overflow:hidden;
  text-overflow:ellipsis;
}
.sp-stream-thumbnail #thumbUploadStatus{margin:6px 0 12px!important;min-height:18px!important}
.sp-stream-thumbnail #thumbInfo{
  margin:6px 0 12px!important;
  font-size:12px!important;
  line-height:1.5!important;
  text-align:center!important;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.sp-stream-thumbnail #thumbCheck{margin:8px 0 0!important;min-height:18px!important}
.sp-stream-thumbnail .row:has(#downloadThumb){margin-top:var(--sp-space-1)!important}
.sp-stream-thumbnail .sp-thumb-section-title{margin-bottom:5px!important}
.sp-stream-thumbnail .sp-thumb-short-hint{margin:4px 0 10px!important}
@media(max-width:350px){
 .sp-stream-thumbnail #thumbUploadStatus,
 .sp-stream-thumbnail #thumbCheck {white-space:normal!important;overflow-wrap:anywhere}
}



/* v0.4.6ef — compact thumbnail uploader layout.
   Removes duplicate subsection heading/copy and rebuilds the upload area
   into a compact icon + format note row, matching the requested wireframe. */
.sp-stream-thumbnail{
  margin-top:18px!important;
  padding-top:18px!important;
}
.sp-stream-thumbnail .sp-thumb-section-title,
.sp-stream-thumbnail .sp-thumb-short-hint,
.sp-stream-thumbnail .sp-thumb-hint-extra,
.sp-stream-thumbnail .thumb-file-current,
#thumbFileCurrent{
  display:none!important;
}
.sp-thumb-upload-top{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 10px;
  min-width:0;
}
.sp-stream-thumbnail .thumb-file-picker.thumb-file-picker--icon{
  position:relative;
  flex:0 0 34px;
  width:34px;
  height:34px;
  min-height:34px;
  padding:0!important;
  border-radius:6px;
  background:transparent;
  border:1px solid rgba(var(--msl-accent-rgb,18,183,240),.55);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.sp-stream-thumbnail .thumb-file-picker.thumb-file-picker--icon:hover{
  border-color:var(--msl-accent,#12b7f0);
  background:rgba(var(--msl-accent-rgb,18,183,240),.08);
}
.sp-stream-thumbnail .thumb-file-picker.thumb-file-picker--icon:focus-within{
  outline:2px solid var(--msl-accent,#12b7f0);
  outline-offset:2px;
}
.sp-stream-thumbnail .thumb-file-picker.thumb-file-picker--icon .thumb-file-button{display:none!important;}
.sp-stream-thumbnail .thumb-file-icon{
  position:relative;
  z-index:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  color:#ffffff;
  font-size:22px;
  line-height:1;
  font-weight:700;
  pointer-events:none;
}
.sp-stream-thumbnail #thumbUploadStatus{
  flex:1 1 auto;
  min-width:0;
  margin:0!important;
  font-size:12px!important;
  line-height:1.5!important;
  color:var(--msl-text-soft,#b8c6d7);
}
.sp-stream-thumbnail #thumbPreview,
.sp-stream-thumbnail .thumb-preview{
  margin:0!important;
}
.sp-stream-thumbnail #thumbInfo{
  margin:8px 0 12px!important;
  font-size:12px!important;
  line-height:1.45!important;
  text-align:center;
}
.sp-stream-thumbnail #thumbCheck{
  margin:var(--sp-space-2) 0 0!important;
  font-size:12px!important;
  line-height:1.5!important;
}
body[data-color-mode="light"] .sp-stream-thumbnail .thumb-file-picker.thumb-file-picker--icon{
  background:#fff!important;
  border-color:rgba(var(--msl-accent-rgb,18,183,240),.34)!important;
}
body[data-color-mode="light"] .sp-stream-thumbnail .thumb-file-picker.thumb-file-picker--icon:hover{
  background:rgba(var(--msl-accent-rgb,18,183,240),.06)!important;
  border-color:rgba(var(--msl-accent-rgb,18,183,240),.56)!important;
}
body[data-color-mode="light"] .sp-stream-thumbnail .thumb-file-icon{
  color:var(--msl-accent-fill,#0d7fb3)!important;
}
body[data-color-mode="light"] .sp-stream-thumbnail #thumbUploadStatus,
body[data-color-mode="light"] .sp-stream-thumbnail #thumbInfo,
body[data-color-mode="light"] .sp-stream-thumbnail #thumbCheck{
  color:#687382!important;
}
@media (max-width:480px){
  .sp-thumb-upload-top{align-items:flex-start;}
  .sp-stream-thumbnail #thumbUploadStatus{padding-top:1px;}
}


/* v0.4.6ef — major headings: 22px text / 18px emoji, optically centered. */
.layout .panel > h2.msl-heading-major:has(.sp-major-emoji),
.layout .panel > .row > h2:has(.sp-major-emoji),
.sp-sheet-content .sp-preview-intro h3:has(.sp-major-emoji){
  font-size:22px!important;
  font-weight:780!important;
  line-height:1.35!important;
  min-height:32px!important;
  display:flex!important;
  align-items:center!important;
  column-gap:9px!important;
}
.sp-major-emoji{
  flex:0 0 22px!important;
  width:22px!important;
  height:28px!important;
  font-size:18px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:1!important;
  transform:none!important;
}
.sp-major-text{line-height:1.35!important;}
@media(max-width:620px){
  .layout .panel > h2.msl-heading-major:has(.sp-major-emoji),
  .layout .panel > .row > h2:has(.sp-major-emoji),
  .sp-sheet-content .sp-preview-intro h3:has(.sp-major-emoji){font-size:22px!important;}
}


/* v0.4.6eg — thumbnail upload discoverability and aligned search/filter controls */
.sp-stream-thumbnail .sp-thumb-upload-top{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  margin:0 0 10px!important;
  min-width:0;
}
.sp-stream-thumbnail .thumb-file-picker.thumb-file-picker--icon{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  flex:0 0 auto!important;
  width:auto!important;
  height:42px!important;
  min-height:42px!important;
  max-width:52%!important;
  padding:0 10px!important;
  border-radius:9px!important;
  box-sizing:border-box!important;
  white-space:nowrap!important;
  cursor:pointer!important;
}
.sp-stream-thumbnail .thumb-file-picker.thumb-file-picker--icon #thumbFile{
  position:absolute!important;inset:0!important;
  width:100%!important;height:100%!important;
  opacity:0!important;z-index:2!important;cursor:pointer!important;
}
.sp-stream-thumbnail .thumb-file-icon{
  flex:0 0 18px!important;width:18px!important;height:18px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  font-size:inherit!important;line-height:1!important;
}
.sp-stream-thumbnail .thumb-file-icon svg{
  display:block;width:18px;height:18px;flex:none;
}
.sp-stream-thumbnail .sp-thumb-upload-name{
  display:inline-block;pointer-events:none;
  font-size:12px;font-weight:700;line-height:1.35;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:#eaf1fc;
}
.sp-stream-thumbnail #thumbUploadStatus{
  flex:1 1 0!important;min-width:0!important;
  display:flex!important;align-items:center!important;
  min-height:42px!important;
  margin:0!important;padding:0!important;
  font-size:12px!important;line-height:1.45!important;
  overflow-wrap:normal!important;word-break:normal!important;
}
/* Long filenames wrap naturally from the left, aligned with thumbnail width. */
.sp-stream-thumbnail #thumbInfo,
body[data-color-mode="light"] .sp-stream-thumbnail #thumbInfo{
  width:100%!important;
  max-width:100%!important;
  text-align:left!important;
  font-size:12px!important;
  line-height:1.45!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  white-space:normal!important;
}
/* All thumbnail history search/select controls use identical 44px outer boxes. */
.sp-stream-thumbnail .thumb-history-tools{
  display:grid!important;
  grid-template-columns:minmax(0,1.65fr) minmax(112px,1fr)!important;
  align-items:stretch!important;
  gap:var(--sp-space-2)!important;
}
.sp-stream-thumbnail .thumb-history-tools #thumbSearch,
.sp-stream-thumbnail .thumb-history-tools .msl-select-wrap,
.sp-stream-thumbnail .thumb-history-tools .msl-select-trigger,
.sp-stream-thumbnail .thumb-history-tools #thumbSort{
  height:44px!important;
  min-height:44px!important;
  max-height:44px!important;
  box-sizing:border-box!important;
  margin:0!important;
  border-radius:var(--sp-radius-10)!important;
  line-height:1.35!important;
}
.sp-stream-thumbnail .thumb-history-tools #thumbSearch{
  display:block!important;
  padding:0 var(--sp-space-3)!important;
}
.sp-stream-thumbnail .thumb-history-tools .msl-select-trigger{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  padding:0 var(--sp-space-3)!important;
  width:100%!important;
}
.sp-stream-thumbnail .thumb-history-tools .msl-select-chevron{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  flex:0 0 20px!important;height:20px!important;
}
body[data-color-mode="light"] .sp-stream-thumbnail .sp-thumb-upload-name{
  color:#30343b!important;
}
@media(max-width:370px){
  .sp-stream-thumbnail .thumb-file-picker.thumb-file-picker--icon{padding-inline:8px!important;gap:4px!important;}
  .sp-stream-thumbnail .sp-thumb-upload-name{font-size:11px;}
  .sp-stream-thumbnail .thumb-history-tools{grid-template-columns:1fr!important;}
}


/* v0.4.6eh — upload CTA embedded within the 16:9 preview; responsive states. */
.sp-stream-thumbnail .sp-thumb-preview-wrap{position:relative;isolation:isolate;aspect-ratio:16/9;width:100%;border-radius:11px;overflow:hidden;}
.sp-stream-thumbnail .sp-thumb-preview-wrap #thumbPreview{width:100%;height:100%;aspect-ratio:auto!important;margin:0!important;}
.sp-stream-thumbnail .sp-thumb-preview-wrap #thumbPreview img{display:block;width:100%;height:100%;object-fit:contain;}
.sp-stream-thumbnail .sp-thumb-upload-overlay{position:absolute;z-index:3;inset:0;margin:0!important;padding:0!important;cursor:pointer;display:flex!important;justify-content:center;align-items:center;color:inherit;border-radius:inherit;}
.sp-stream-thumbnail .sp-thumb-file-input{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;overflow:hidden!important;padding:0!important;inset:auto!important;top:0!important;left:0!important;pointer-events:none!important;}
.sp-stream-thumbnail .sp-thumb-overlay-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:9px;padding:11px 15px;max-width:calc(100% - 20px);min-height:44px;border:1px solid rgba(var(--msl-accent-rgb,18,183,240),.50);background:rgba(11,24,39,.84);color:#fff;font-weight:700;font-size:14px;line-height:1.35;box-shadow:0 5px 18px rgba(0,0,0,.17);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);pointer-events:none;}
.sp-stream-thumbnail .sp-thumb-overlay-cta svg{width:19px;height:19px;flex:none;}
.sp-stream-thumbnail .sp-thumb-upload-overlay:hover .sp-thumb-overlay-cta{background:rgba(19,42,60,.96);border-color:var(--msl-accent);}
.sp-stream-thumbnail .sp-thumb-upload-overlay:focus-within{outline:3px solid var(--msl-accent);outline-offset:-3px;}
.sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) .sp-thumb-upload-overlay{inset:10px 10px auto auto;width:auto;height:auto;border-radius:9px;}
.sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) .sp-thumb-overlay-cta{min-height:34px;padding:6px 10px;font-size:12px;font-weight:650;border-radius:8px;border-color:rgba(255,255,255,.35);box-shadow:0 3px 10px rgba(0,0,0,.22);}
.sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) .sp-thumb-overlay-cta svg{width:16px;height:16px;}
.sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) #thumbPreview{cursor:zoom-in;}
.sp-stream-thumbnail .sp-thumb-upload-notice{font-size:12px!important;line-height:1.55!important;margin:8px 0 9px!important;min-height:0!important;}
body[data-color-mode="light"] .sp-stream-thumbnail .sp-thumb-preview-wrap:not(:has(#thumbPreview img)) .sp-thumb-overlay-cta{background:rgba(255,255,255,.92);color:#24354d;border-color:rgba(var(--msl-accent-rgb),.42);}
body[data-color-mode="light"] .sp-stream-thumbnail .sp-thumb-preview-wrap:not(:has(#thumbPreview img)) .sp-thumb-upload-overlay:hover .sp-thumb-overlay-cta{background:#fff;}
@media(max-width:390px){.sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) .sp-thumb-overlay-cta{padding:6px 8px;}.sp-stream-thumbnail .sp-thumb-overlay-cta{gap:6px;}}
@media(prefers-reduced-motion:reduce){.sp-stream-thumbnail .sp-thumb-overlay-cta{transition:none!important;}}
/* Accessible large-image viewer. */
.sp-thumb-lightbox{border:0;padding:20px;max-width:min(1100px,96vw);max-height:94vh;background:#131b29;color:#f5f7fb;border-radius:14px;box-shadow:0 20px 65px #0009;}
.sp-thumb-lightbox::backdrop{background:rgba(2,9,17,.81);backdrop-filter:blur(6px);}
.sp-thumb-lightbox img{display:block;max-width:100%;max-height:calc(90vh - 92px);object-fit:contain;margin:auto;}
.sp-thumb-lightbox-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;}
.sp-thumb-lightbox-head strong{font-size:16px;}
.sp-thumb-lightbox-head button{border-radius:9px;border:1px solid var(--sp-color-border-slate);background:#293445;color:#fff;padding:7px 12px;min-height:38px;cursor:pointer;}


/* v0.4.6ei — typography, checkbox labels, thumbnail empty states and spacing. */
/* Keep major heading icons 18px, adjust labels from 22 to 20px only on the main workspace. */
.layout .panel > h2.msl-heading-major:has(.sp-major-emoji),
.layout .panel > .row > h2:has(.sp-major-emoji){
 font-size:20px!important;
 min-height:29px!important;
 line-height:1.4!important;
}
.layout .panel > h2.msl-heading-major .sp-major-emoji,
.layout .panel > .row > h2 .sp-major-emoji{
 font-size:18px!important;width:24px!important;flex-basis:24px!important;
 height:24px!important;transform:none!important;
}
/* Main checkbox labels remain readable at 16px; supporting copy stays separate. */
.layout .panel label.check-label,
.layout .panel label.label-inline,
.layout .panel .classification-card:has(input[type="checkbox"]),
.layout .panel .checkitem label,
.layout .panel .desc-checkbox-row label,
.layout .panel .description-options .label-inline{
 font-size:var(--sp-type-body)!important;line-height:1.5!important;font-weight:400!important;
}
.layout .panel label.check-label{align-items:center!important;gap:10px!important;min-height:48px!important;}
.layout .panel label.check-label input[type="checkbox"]{
 flex-shrink:0!important;align-self:center!important;
}
/* Caption below intro should flow directly into the first form label. */
.layout > div:first-child > .panel:first-child > h2.msl-heading-major + p.hint{
 margin-top:5px!important;margin-bottom:7px!important;line-height:1.6!important;
}
.layout > div:first-child > .panel:first-child > h2.msl-heading-major + p.hint + label[for="game"]{
 margin-top:6px!important;
}
/* Long upload call-to-action wording never breaks inside the button. */
.sp-stream-thumbnail .sp-thumb-overlay-cta{
 white-space:nowrap!important;max-width:calc(100% - 12px)!important;
 padding-inline:12px!important;gap:6px!important;
}
.sp-stream-thumbnail .sp-thumb-overlay-text{
 display:inline-block;white-space:nowrap!important;
 overflow:hidden;text-overflow:ellipsis;
 font-size:clamp(11px,3vw,14px)!important;line-height:1.35!important;
}
.sp-stream-thumbnail .sp-thumb-overlay-cta svg{flex:0 0 18px!important;}
.sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) .sp-thumb-overlay-cta{
 max-width:calc(100% - 20px)!important;
}
/* Empty file details should take no height or margin after last-image deletion. */
.sp-stream-thumbnail #thumbInfo:empty,
.sp-stream-thumbnail #thumbInfo[hidden]{display:none!important;margin:0!important;padding:0!important;min-height:0!important;}
/* Improve the neutral/default custom select: avoid label/arrow crowding. */
.msl-select-trigger{min-width:0!important;gap:10px!important;align-items:center!important;}
.msl-select-trigger .msl-select-chevron{margin-left:auto!important;align-self:center!important;}
.msl-select-wrap{min-width:0!important;}
/* Keep responsive arrow/label consistent on light UI as well. */
body[data-color-mode="light"] .layout .panel label.check-label{color:#30343b!important;}
@media(max-width:420px){
 .sp-stream-thumbnail .sp-thumb-overlay-cta{padding:8px 9px!important;gap:5px!important;}
 .sp-stream-thumbnail .sp-thumb-overlay-text{font-size:12px!important;}
}


/* v0.4.6ej — thumbnail empty state is a full-surface, buttonless upload target. */
.sp-stream-thumbnail .sp-thumb-preview-wrap:not(:has(#thumbPreview img)) .thumb-preview{
  border:1px solid rgba(140,156,174,.32)!important;
  background:rgba(140,156,174,.035)!important;
  box-shadow:none!important;
}
.sp-stream-thumbnail .sp-thumb-preview-wrap:not(:has(#thumbPreview img)) .sp-thumb-upload-overlay{
  inset:0!important;
  width:100%!important;
  height:100%!important;
  border-radius:11px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  transition:background .16s ease;
}
.sp-stream-thumbnail .sp-thumb-preview-wrap:not(:has(#thumbPreview img)) .sp-thumb-upload-overlay:hover{
  background:rgba(var(--msl-accent-rgb,18,183,240),.055)!important;
}
.sp-stream-thumbnail .sp-thumb-preview-wrap:not(:has(#thumbPreview img)) .sp-thumb-overlay-cta{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  min-height:0!important;
  max-width:calc(100% - 36px)!important;
  padding:var(--sp-space-3)!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  color:inherit!important;
  white-space:normal!important;
}
.sp-stream-thumbnail .sp-thumb-preview-wrap:not(:has(#thumbPreview img)) .sp-thumb-overlay-cta svg{
  width:27px!important;height:27px!important;flex:0 0 27px!important;
  color:var(--msl-accent,#129adb)!important;
}
.sp-stream-thumbnail .sp-thumb-preview-wrap:not(:has(#thumbPreview img)) .sp-thumb-overlay-text{
  font-size:14px!important;
  font-weight:700!important;
  line-height:1.4!important;
  overflow:visible!important;
  white-space:nowrap!important;
}
.sp-stream-thumbnail .sp-thumb-overlay-helper{display:none!important;}
.sp-stream-thumbnail .sp-thumb-preview-wrap:not(:has(#thumbPreview img)) .sp-thumb-overlay-helper{
  display:block!important;
  font-size:12px!important;
  line-height:1.4!important;
  font-weight:400!important;
  opacity:.7;
  white-space:nowrap!important;
}
body[data-color-mode="light"] .sp-stream-thumbnail .sp-thumb-preview-wrap:not(:has(#thumbPreview img)) .thumb-preview{
  background:rgba(255,255,255,.68)!important;
  border-color:rgba(65,82,100,.19)!important;
}
body[data-color-mode="light"] .sp-stream-thumbnail .sp-thumb-preview-wrap:not(:has(#thumbPreview img)) .sp-thumb-overlay-cta{
  background:transparent!important;
  color:#232d39!important;
}
body[data-color-mode="light"] .sp-stream-thumbnail .sp-thumb-preview-wrap:not(:has(#thumbPreview img)) .sp-thumb-upload-overlay:hover .sp-thumb-overlay-cta{
  background:transparent!important;
}


/* v0.4.6ek — consistent separator rhythm & compact thumbnail controls.
   Applies to main workspace only; sheet/overlay structural dividers are untouched. */
.layout .panel{--sp-divider-gap:20px;}
/* Section rules: equal 20px above and below the actual border. */
.layout .panel .disclosure:not(.sp-thumb-storage-details),
.layout .panel .x-post-card{
  margin-top:var(--sp-divider-gap)!important;
  padding-top:var(--sp-divider-gap)!important;
}
.layout .panel>.sep,
.layout .panel hr.sep,
.layout .panel .twitch-guide .sep{
  margin-top:var(--sp-divider-gap)!important;
  margin-bottom:var(--sp-divider-gap)!important;
}
.layout .panel .sp-stream-thumbnail{
  margin-top:var(--sp-divider-gap)!important;
  padding-top:var(--sp-divider-gap)!important;
}
/* Keep compact rows with inline rules equally spaced above/below. */
.layout .panel .check-label,
.layout .panel .classification-card,
.layout .panel .checkitem{
  padding-top:12px!important;
  padding-bottom:12px!important;
}
/* Selected image: true top-right position, compact translucent badge, no truncation. */
.sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) .sp-thumb-upload-overlay{
  inset:8px 8px auto auto!important;
  top:8px!important;
  right:8px!important;
  bottom:auto!important;
  left:auto!important;
  width:max-content!important;
  max-width:calc(100% - 16px)!important;
  height:auto!important;
  border-radius:7px!important;
  outline:0!important;
  box-shadow:none!important;
}
.sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) .sp-thumb-overlay-cta{
  gap:5px!important;
  padding:5px 8px!important;
  min-height:28px!important;
  width:max-content!important;
  max-width:100%!important;
  background:rgba(12,18,28,.68)!important;
  border:1px solid rgba(255,255,255,.24)!important;
  border-radius:7px!important;
  box-shadow:none!important;
  white-space:nowrap!important;
}
.sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) .sp-thumb-overlay-text{
  display:inline-block!important;
  font-size:11px!important;
  font-weight:600!important;
  line-height:1.3!important;
  overflow:visible!important;
  white-space:nowrap!important;
  text-overflow:clip!important;
}
.sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) .sp-thumb-overlay-cta svg{
  width:14px!important;
  height:14px!important;
  flex:0 0 14px!important;
}
.sp-stream-thumbnail .sp-thumb-upload-overlay:focus-within,
.sp-stream-thumbnail .sp-thumb-upload-overlay:active,
.sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) .sp-thumb-upload-overlay:focus-within,
.sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) .sp-thumb-upload-overlay:active{
  outline:none!important;
  outline-offset:0!important;
  box-shadow:none!important;
}
/* Light mode: retain readable dark badge regardless of thumbnail artwork. */
body[data-color-mode="light"] .sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) .sp-thumb-overlay-cta{
  color:#fff!important;
  background:rgba(12,18,28,.68)!important;
}
/* Consecutive photo captions: 4px interline gap, no phantom empty paragraph. */
.sp-stream-thumbnail #thumbUploadStatus{
  margin:6px 0 0!important;
  padding:0!important;
  min-height:0!important;
  line-height:1.45!important;
}
.sp-stream-thumbnail #thumbInfo:not([hidden]):not(:empty){
  margin:4px 0 10px!important;
  padding:0!important;
  min-height:0!important;
  line-height:1.45!important;
}
.sp-stream-thumbnail #thumbInfo:empty,
.sp-stream-thumbnail #thumbInfo[hidden]{display:none!important;margin:0!important;min-height:0!important;}
/* History always visible: remove former accordion, keep its underlying list unchanged. */
.sp-stream-thumbnail .sp-thumb-history-always{
  display:block!important;
  min-width:0;
  margin:var(--sp-divider-gap) 0 0!important;
  padding:var(--sp-divider-gap) 0 0!important;
  border-top:1px solid var(--msl-line,rgba(175,198,229,.18));
}
.sp-stream-thumbnail .sp-thumb-history-always .sp-thumb-history-body{
  display:block!important;
  padding:0!important;
}
.sp-stream-thumbnail .sp-thumb-history-always .thumb-history-header{margin:0!important;}
/* Reduce history-section text by about 2px; keep inputs usable and readable. */
.sp-stream-thumbnail .sp-thumb-history-always .thumb-history-heading h3.msl-heading-minor{
  font-size:14px!important;
  line-height:1.45!important;
}
.sp-stream-thumbnail .sp-thumb-history-always .thumb-history-tools :is(input,select,.msl-select-trigger){
  font-size:12px!important;
}
.sp-stream-thumbnail .sp-thumb-history-always .thumb-card-details .thumb-filename{
  font-size:11px!important;
  line-height:1.4!important;
}
.sp-stream-thumbnail .sp-thumb-history-always .thumb-card-details :is(.thumb-meta,.thumb-properties){
  font-size:10px!important;
  line-height:1.4!important;
}
.sp-stream-thumbnail .sp-thumb-history-always .thumb-actions .btn{
  font-size:11px!important;
}
/* Caution notice is not a main section divider. */
.sp-stream-thumbnail .sp-thumb-storage-details{margin-top:12px!important;}
@media(max-width:390px){
  .sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) .sp-thumb-overlay-cta{padding:4px 6px!important;}
  .sp-stream-thumbnail .sp-thumb-preview-wrap:has(#thumbPreview img) .sp-thumb-overlay-text{font-size:10px!important;}
}


/* v0.4.6el — breathing room below history filters; storage notice always shown. */
.sp-stream-thumbnail .sp-thumb-history-always .thumb-gallery-layout{
  margin-top:var(--sp-space-3)!important;
  padding-top:0!important;
}
.sp-stream-thumbnail .sp-thumb-history-always .thumb-gallery-layout .thumb-list{
  margin:0 0 var(--sp-space-3)!important;
}
.sp-stream-thumbnail .sp-thumb-storage-note{
  display:block;
  margin:var(--sp-space-3) 0 0!important;
  padding:0!important;
}
.sp-stream-thumbnail .sp-thumb-storage-note .thumb-storage-warning{
  margin:0!important;
  padding:12px 14px!important;
  font-size:12px!important;
  line-height:1.7!important;
}

/* v0.4.6en | Uniform 44px action height across main app sections.
   Width, label size, and typography stay component-dependent.
   Tiny icon-only controls, preview corner badges and section tabs keep their own geometry. */
:root { --sp-action-height:44px; }
.layout .panel button.btn:not(.thumb-delete):not(.msl-nico-copy-icon):not([data-social-delete]),
.layout .panel .game-actions > button,
.layout .panel .social-bulk-btn,
.sp-sheet-panel button.btn:not(.msl-nico-copy-icon),
.sp-sheet-panel #resetXPost {
  height:var(--sp-size-button)!important;
  min-height:var(--sp-size-button)!important;
  max-height:var(--sp-size-button)!important;
  box-sizing:border-box!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:1.3!important;
  padding-top:0!important;
  padding-bottom:0!important;
}
/* Long labels wrap inside the 44px minimum instead of running into the next button. */
.layout .panel .game-actions > .btn{
  min-width:0!important;
  white-space:normal!important;
  overflow-wrap:anywhere;
  height:auto!important;
  max-height:none!important;
}
/* Keep the SNS add-button aligned with its adjacent 44px select. */
.layout .panel .sns-add-row #socialService,
.layout .panel .sns-add-row .msl-select-wrap,
.layout .panel .sns-add-row .msl-select-trigger{
  height:var(--sp-size-button)!important;
  min-height:var(--sp-size-button)!important;
  max-height:var(--sp-size-button)!important;
  box-sizing:border-box!important;
}
/* Preserve content-based width for the trash, copy, reset and SNS controls. */
.layout .panel :is(#toggleTrash,#copySocialPreview,#reset,#addSocial),
.layout .panel .social-bulk-btn{
  width:auto;
  padding-left:14px!important;
  padding-right:14px!important;
}
/* Thumbnail action buttons fill the two existing equal-width grid tracks. */
.sp-stream-thumbnail .row:has(#downloadThumb) > .btn{
  width:100%!important;
  min-width:0!important;
}
/* Icon-only thumbnail delete remains a compact, square control. */
.sp-stream-thumbnail .thumb-actions .thumb-delete{
  flex:0 0 auto;
}


/* v0.4.6en — dedicated Settings dialog, preserving existing form IDs/data. */
.sp-settings-open{margin-left:auto;min-height:44px;height:44px;padding:0 16px;white-space:nowrap}
.sp-settings-dialog{width:min(900px,calc(100vw - 28px));max-width:900px;max-height:min(90vh,1000px);padding:0;border:1px solid #53647a;border-radius:18px;color:var(--msl-text,#edf3fa);background:#172334;box-shadow:0 22px 75px #0008;overflow:hidden}
.sp-settings-dialog::backdrop{background:rgba(3,8,16,.73);backdrop-filter:blur(4px)}
.sp-settings-shell{display:flex;flex-direction:column;max-height:min(90vh,1000px);min-height:0}
.sp-settings-head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--sp-space-4);padding:20px 22px 14px;border-bottom:1px solid #ffffff20;flex-shrink:0}
.sp-settings-head h2{margin:0;color:inherit;font-size:22px;font-weight:780;line-height:1.35}
.sp-settings-head p{font-size:13px;color:#b2bdcd;margin:6px 0 0;line-height:1.5}
.sp-settings-close{flex:none;min-height:44px;height:44px}
.sp-settings-tabs{display:flex;gap:var(--sp-space-2);flex-wrap:wrap;padding:12px 22px;border-bottom:1px solid #ffffff20;flex-shrink:0}
.sp-settings-tab{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:0 15px;background:#243248;border:1px solid #4a5c71;color:#dce9f7;border-radius:var(--sp-radius-10);font:inherit;font-weight:650;cursor:pointer}
.sp-settings-tab.is-active{background:rgba(var(--msl-accent-rgb,18,183,240),.18);border-color:var(--msl-accent,#12b7f0);color:#fff}
.sp-settings-tab:focus-visible,.sp-settings-open:focus-visible{outline:2px solid var(--msl-accent,#12b7f0);outline-offset:2px}
.sp-settings-content{overflow-y:auto;min-height:0;flex:1;padding:20px 22px 4px;overscroll-behavior:contain}
.sp-settings-pane[hidden]{display:none!important}
.sp-settings-pane>.panel{margin:0 0 var(--sp-space-4);padding:20px;background:rgba(14,24,39,.48);border:1px solid #455467;border-radius:14px;box-shadow:none}
.sp-settings-pane>.panel>h2,.sp-settings-pane>.panel>.row>h2{font-size:20px!important;color:inherit;font-weight:760;display:flex;align-items:center;gap:10px;line-height:1.4}
.sp-settings-pane .sp-major-emoji{font-size:18px;line-height:1;display:inline-flex;align-items:center;justify-content:center;width:22px;height:25px;flex:none}
.sp-settings-pane .row:has(#export)>.btn{min-width:0}
.sp-settings-pane #trashList,.sp-settings-pane #platformEdits{min-width:0}
.sp-settings-game-help{font-size:14px;margin:0 0 var(--sp-space-3);color:#c1cad9}
.sp-settings-open-template{min-height:44px;height:44px;margin-bottom:18px}
.sp-settings-footer{padding:12px 22px;border-top:1px solid #ffffff20;display:flex;gap:var(--sp-space-3);justify-content:space-between;align-items:center;flex-shrink:0}
.sp-settings-footer>span{font-size:12px;color:#aab8c9}
.sp-settings-footer-close{height:44px;min-height:44px;padding:0 22px}
.sp-common-edit-profile{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:0 15px;margin:12px 0 5px;border-radius:var(--sp-radius-10);border:1px solid rgba(var(--msl-accent-rgb,18,183,240),.55);background:rgba(var(--msl-accent-rgb,18,183,240),.12);color:inherit;font-weight:700;cursor:pointer}
body[data-color-mode="light"] .sp-settings-dialog{background:#f8fafd;color:#283344;border-color:#cbd8e6}
body[data-color-mode="light"] .sp-settings-head,body[data-color-mode="light"] .sp-settings-tabs,body[data-color-mode="light"] .sp-settings-footer{border-color:#dce4ed}
body[data-color-mode="light"] .sp-settings-head p,body[data-color-mode="light"] .sp-settings-footer>span,body[data-color-mode="light"] .sp-settings-game-help{color:#5a687a}
body[data-color-mode="light"] .sp-settings-pane>.panel{background:#fff;border-color:#d5e0eb}
body[data-color-mode="light"] .sp-settings-tab{background:#fff;color:#273448;border-color:#cbd7e4}
body[data-color-mode="light"] .sp-settings-tab.is-active{color:#064e72;background:rgba(var(--msl-accent-rgb,18,183,240),.12);border-color:var(--msl-accent,#0d8bbf)}
@media(max-width:650px){.sp-settings-dialog{width:calc(100vw - 14px);max-height:94vh}.sp-settings-shell{max-height:94vh}.sp-settings-head,.sp-settings-tabs,.sp-settings-content,.sp-settings-footer{padding-left:14px;padding-right:14px}.sp-settings-pane>.panel{padding:15px}.sp-settings-tab{font-size:13px;padding:0 10px}.sp-settings-open{margin-left:0}}


/* v0.4.6eq — Description display settings: same accent-bar minor-heading tone as "今回のひとこと". */
#platformEdits .description-options > strong.sp-desc-preview-heading,
.description-options > strong.sp-desc-preview-heading{
  display:inline-flex!important;
  align-items:center!important;
  gap:var(--sp-space-2)!important;
  color:inherit!important;
  font-size:var(--sp-type-subheading)!important;
  font-weight:var(--sp-heading-weight)!important;
  line-height:1.5!important;
  margin:0 0 var(--sp-space-2)!important;
  padding:0!important;
}
.description-options > strong.sp-desc-preview-heading::before{
  content:"";
  display:inline-block!important;
  flex:none!important;
  width:4px!important;
  height:1.15em!important;
  border-radius:2px!important;
  background:var(--msl-accent,#12b7f0)!important;
}
body[data-color-mode="light"] .description-options > strong.sp-desc-preview-heading{
  color:#323b49!important;
}


/* v0.4.6eq: header action grouping. Settings dialog itself is deliberately unchanged. */
header #mslThemeShortcut{margin-left:auto!important;flex:0 0 auto}
header #spSettingsOpen{
  margin:0!important;padding:0!important;display:inline-flex!important;align-items:center!important;
  justify-content:center!important;flex:0 0 44px!important;width:44px!important;
  min-width:44px!important;height:44px!important;min-height:44px!important;
  border-radius:13px!important;color:inherit!important;font-size:0!important;
  background:#263449!important;border:1px solid #52647e!important;
  box-shadow:0 2px 8px rgba(0,0,0,.10)!important;
}
header #spSettingsOpen svg{display:block;flex:none;width:20px;height:20px}
header #spSettingsOpen:hover{background:#31425a!important;border-color:#7387a5!important}
header #spSettingsOpen:focus-visible{outline:2px solid var(--msl-accent,#12b7f0)!important;outline-offset:3px}
header #mslDisplaySettings{margin-left:0!important}
body[data-color-mode="light"]:not(.glass-on) header #spSettingsOpen{
  color:#30343B!important;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 #spSettingsOpen:hover{
  background:#F5F6F8!important;border-color:#BFC5CD!important
}
body.glass-on header #spSettingsOpen{
  background:rgba(205,225,246,.14)!important;border-color:rgba(224,236,255,.30)!important;
  backdrop-filter:blur(12px) saturate(125%);-webkit-backdrop-filter:blur(12px) saturate(125%);
}
body[data-color-mode="light"].glass-on header #spSettingsOpen{
  color:#30343B!important;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
}
@media(max-width:620px){header #mslThemeShortcut{margin-left:auto!important}header #mslDisplaySettings{width:auto!important;flex:1 1 155px}}
/* v0.4.6eq: compact Bottom Sheet ONLY, do not alter Settings dialog. */
.sp-sheet .sp-sheet-content.sp-sheet-common{overflow:hidden!important;min-height:0!important}
.sp-sheet .sp-sheet-common .sp-preview-topline{
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  flex-wrap:wrap;gap:8px 14px;margin-bottom:11px!important;flex:0 0 auto
}
.sp-sheet .sp-sheet-common .sp-preview-intro{min-width:0;flex:1 1 420px}
.sp-sheet .sp-sheet-common .sp-common-edit-profile{
  flex:0 0 auto;margin:0!important;min-height:38px!important;height:38px!important;
  padding:0 13px!important;font-size:13px!important;white-space:nowrap
}
.sp-sheet .sp-sheet-common .sp-common-grid{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px 12px!important;padding:0 0 8px!important;align-content:start!important;
  overflow:hidden!important;min-height:0!important
}
.sp-sheet .sp-sheet-common .sp-common-item{
  min-width:0!important;min-height:68px!important;border-radius:11px!important;
  padding:10px 48px 9px 13px!important;display:flex;flex-direction:column;
  justify-content:center;gap:3px!important
}
.sp-sheet .sp-sheet-common .sp-common-item--full{grid-column:1/-1!important;min-height:61px!important}
.sp-sheet .sp-sheet-common .sp-common-label{
  font-size:12px!important;font-weight:700!important;line-height:1.3!important;
  margin:0!important;color:inherit!important;opacity:.8!important
}
.sp-sheet .sp-sheet-common .sp-common-value{
  font-size:15px!important;line-height:1.3!important;white-space:nowrap!important;
  overflow:hidden!important;text-overflow:ellipsis!important;overflow-wrap:normal!important;
  min-height:0!important
}
.sp-sheet .sp-sheet-common .sp-common-note{grid-column:1/-1!important;margin:0!important;font-size:11px!important;line-height:1.3!important}
@media(max-width:650px){
 .sp-sheet .sp-sheet-common .sp-common-grid{gap:7px!important}
 .sp-sheet .sp-sheet-common .sp-common-item{min-height:60px!important}
 .sp-sheet .sp-sheet-common .sp-common-value{font-size:13px!important}
 .sp-sheet .sp-sheet-common .sp-common-edit-profile{height:34px!important;min-height:34px!important}
}


/* v0.4.6eq — header controls use one visual variant in both color modes.
   Only header actions are modified; settings dialog panels are untouched. */
body[data-color-mode="light"]:not(.glass-on) header #spSettingsOpen{
  color:#30343b!important;
  background:#edf3f9!important;
  border:1px solid #cbd9e9!important;
  box-shadow:0 2px 8px rgba(39,65,101,.06)!important;
}
body[data-color-mode="light"]:not(.glass-on) header #spSettingsOpen:hover{
  background:#e3edf7!important;border-color:#aebfd3!important;
}
body[data-color-mode="light"].glass-on header #spSettingsOpen{
  color:#30343b!important;
  background:rgba(255,255,255,.55)!important;
  border-color:rgba(177,198,222,.66)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 4px 14px rgba(41,70,104,.09)!important;
}
body[data-color-mode="light"].glass-on header #spSettingsOpen:hover{
  background:rgba(255,255,255,.76)!important;border-color:rgba(151,178,209,.76)!important;
}
/* Center the white check glyph inside its 18px control instead of baseline shifting.
   Keep checkbox dimensions, accent fill and keyboard focus styling unchanged. */
input[type="checkbox"]{
  display:inline-grid!important;
  place-items:center!important;
  place-content:center!important;
  line-height:0!important;
  padding:0!important;
}
input[type="checkbox"]:checked::after{
  content:""!important;
  display:block!important;
  width:11px!important;height:8px!important;
  margin:0!important;
  transform:none!important;
  position:static!important;
  justify-self:center!important;
  align-self:center!important;
  background-color:#fff!important;
}


/* v0.4.6es — single header button variant, compact common sheet, one dialog close. */
header{column-gap:15px;row-gap:12px;}
header > div:has(> h1){min-width:0;flex:0 1 auto;max-width:100%;}
header .sub{overflow-wrap:anywhere;}
header #mslThemeShortcut{margin-left:auto!important;}
header #mslThemeShortcut,header #spSettingsOpen,header #mslAppearanceTrigger{
  height:44px!important;min-height:44px!important;max-height:44px!important;
  border-radius:13px!important;box-sizing:border-box!important;
  background:#263449!important;border:1px solid #52647e!important;
  color:#edf3fa!important;box-shadow:0 2px 8px rgba(0,0,0,.10)!important;
  vertical-align:middle;flex-shrink:0;align-items:center;justify-content:center;
}
header #mslThemeShortcut,header #spSettingsOpen{width:44px!important;min-width:44px!important;flex-basis:44px!important;padding:0!important;}
header #mslAppearanceTrigger{width:auto!important;padding:0 15px!important;display:inline-flex!important;gap:7px!important;}
header #mslThemeShortcut{display:inline-grid!important;place-items:center!important;}
header #spSettingsOpen{display:inline-flex!important;}
header #spSettingsOpen .sp-settings-gear{font-size:25px!important;line-height:1!important;font-weight:400!important;display:block;transform:none!important;font-family:Arial,"Segoe UI Symbol",sans-serif;}
header #spSettingsOpen:hover,header #mslThemeShortcut:hover,header #mslAppearanceTrigger:hover{background:#31425a!important;border-color:#7387a5!important;}
header #spSettingsOpen:focus-visible,header #mslThemeShortcut:focus-visible,header #mslAppearanceTrigger:focus-visible{outline:2px solid var(--msl-accent,#12b7f0)!important;outline-offset:2px!important;}
header .msl-display-settings{margin-left:0!important;flex:0 0 auto!important;}
/* Use the existing header flex gap only between unrelated elements; action controls at 8px. */
header #mslThemeShortcut{margin-right:-7px!important;}
header #spSettingsOpen{margin-right:-7px!important;}
body[data-color-mode="light"] header #mslThemeShortcut,
body[data-color-mode="light"] header #spSettingsOpen,
body[data-color-mode="light"] header #mslAppearanceTrigger{
  background:#edf3f9!important;border-color:#cbd9e9!important;color:var(--sp-color-text-slate)!important;
  box-shadow:0 2px 8px rgba(39,65,101,.06)!important;
}
body[data-color-mode="light"] header #mslThemeShortcut:hover,
body[data-color-mode="light"] header #spSettingsOpen:hover,
body[data-color-mode="light"] header #mslAppearanceTrigger:hover{background:#e0ecf5!important;border-color:#9cb5cd!important;}
body.glass-on header #mslThemeShortcut,body.glass-on header #spSettingsOpen,body.glass-on header #mslAppearanceTrigger{
 background:rgba(205,225,246,.14)!important;border-color:rgba(224,236,255,.30)!important;
}
body[data-color-mode="light"].glass-on header #mslThemeShortcut,
body[data-color-mode="light"].glass-on header #spSettingsOpen,
body[data-color-mode="light"].glass-on header #mslAppearanceTrigger{
 background:rgba(255,255,255,.66)!important;border-color:rgba(177,198,222,.66)!important;color:var(--sp-color-text-slate)!important;
}
/* Main page-style icon-only copy actions on the right edge of compact cards. */
.sp-sheet .sp-sheet-common .sp-common-grid{
  width:min(100%,535px)!important;max-width:535px!important;
  margin-left:0!important;margin-right:auto!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  overflow:visible!important;
}
@media(max-width:650px){
 .sp-sheet .sp-sheet-common .sp-common-grid{width:100%!important;max-width:none!important;}
 header #mslThemeShortcut{margin-left:auto!important;}
 header .msl-display-settings{margin-left:0!important;flex:0 0 auto!important;}
 header #mslAppearanceTrigger{width:auto!important;}
}


/* v0.4.6es: accent-aware, six-item thumbnail pagination */
.sp-stream-thumbnail .sp-thumb-pagination{
 display:flex;justify-content:center;align-items:center;gap:5px;
 flex-wrap:wrap;margin:13px 0 2px;padding:0;min-width:0;
}
.sp-stream-thumbnail .sp-thumb-pagination[hidden]{display:none!important}
.sp-thumb-pagination button{
 display:inline-flex;align-items:center;justify-content:center;
 width:34px;height:34px;min-height:34px;padding:0;
 border:1px solid rgba(var(--msl-accent-rgb,18,183,240),.22);
 border-radius:9px;background:rgba(var(--msl-accent-rgb,18,183,240),.045);
 color:inherit;font-size:13px;font-weight:650;line-height:1;
 box-shadow:none;transition:background .16s,border-color .16s;
}
.sp-thumb-pagination button:hover:not(:disabled){background:rgba(var(--msl-accent-rgb,18,183,240),.13);border-color:rgba(var(--msl-accent-rgb,18,183,240),.55)}
.sp-thumb-pagination button.is-active{
 background:var(--msl-accent,#12b7f0)!important;
 border-color:var(--msl-accent,#12b7f0)!important;
 color:var(--sp-color-pagination-active-text, var(--msl-accent-text,#fff))!important;
 box-shadow:0 2px 9px rgba(var(--msl-accent-rgb,18,183,240),.18);
}
/* The luminous accent stays the ground. Ink is set on the button, not :root,
   so a later theme can replace it. Fill chips do not use this token. */
body[data-color-mode="dark"][data-ui-accent="blue"] .sp-thumb-pagination button.is-active,
body[data-color-mode="light"][data-ui-accent="blue"] .sp-thumb-pagination button.is-active{
 --sp-color-pagination-active-text:#10141c;
}
body[data-color-mode="dark"][data-ui-accent="honey"] .sp-thumb-pagination button.is-active,
body[data-color-mode="light"][data-ui-accent="honey"] .sp-thumb-pagination button.is-active{
 --sp-color-pagination-active-text:#1d2230;
}
body[data-color-mode="dark"][data-ui-accent="pink"] .sp-thumb-pagination button.is-active,
body[data-color-mode="light"][data-ui-accent="pink"] .sp-thumb-pagination button.is-active{
 --sp-color-pagination-active-text:#201727;
}
.sp-thumb-pagination button:focus-visible{outline:2px solid var(--msl-accent,#12b7f0);outline-offset:2px}
.sp-thumb-pagination button:disabled{opacity:.32;cursor:not-allowed}
.sp-thumb-pagination .sp-page-ellipsis,.sp-thumb-pagination .sp-page-summary{font-size:11px;color:inherit;opacity:.62;white-space:nowrap}
.sp-thumb-pagination .sp-page-summary{margin-left:4px;font-variant-numeric:tabular-nums}
body[data-color-mode="light"] .sp-thumb-pagination button:not(.is-active){background:rgba(255,255,255,.74);border-color:#d4dce6;color:#536174}
body[data-color-mode="light"] .sp-thumb-pagination button:not(.is-active):hover:not(:disabled){background:rgba(var(--msl-accent-rgb,18,183,240),.08);border-color:rgba(var(--msl-accent-rgb,18,183,240),.45)}
@media(max-width:390px){.sp-stream-thumbnail .sp-thumb-pagination{gap:4px}.sp-thumb-pagination button{width:30px;height:32px;min-height:32px}}
@media(prefers-reduced-motion:reduce){.sp-thumb-pagination button{transition:none}}


/* v0.4.6et — compact 2×2 thumbnail pages and stable pagination rhythm. */
.sp-stream-thumbnail .thumb-gallery-layout .thumb-list{
 display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
 gap:var(--sp-space-2)!important;align-items:stretch!important;margin:10px 0 0!important;
}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-list.sp-paged-grid{
 /* Reserve two rows even when the final page contains only 1–2 cards. */
 grid-template-rows:repeat(2,224px)!important;
 min-height:456px!important;
}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-tile,
body.glass-on .sp-stream-thumbnail .thumb-gallery-layout .thumb-tile{
 padding:7px!important;min-height:0!important;height:224px!important;
}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-image-wrap{
 margin:0!important;
}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-card-details{
 min-height:0!important;padding:6px 1px 3px!important;gap:2px!important;
}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-tile p.thumb-filename{
 margin:0!important;line-height:1.3!important;
 height:2.6em!important;min-height:2.6em!important;
 font-size:11px!important;
 -webkit-line-clamp:2!important;
}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-tile p.thumb-meta{
 height:auto!important;min-height:0!important;margin:0!important;
 line-height:1.3!important;font-size:10px!important;
}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-tile p.thumb-properties{
 margin:0!important;line-height:1.3!important;font-size:10px!important;
}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-actions{
 min-height:36px!important;padding-top:2px!important;gap:5px!important;
 margin-top:auto!important;
}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-actions .thumb-use{
 height:36px!important;min-height:36px!important;
}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-selected-badge{
 font-size:12px!important;padding:4px 6px!important;
}
@keyframes sp-thumb-page-in{
 from{opacity:.25;transform:translateX(6px)}
 to{opacity:1;transform:translateX(0)}
}
.sp-stream-thumbnail .thumb-list.sp-page-enter>.thumb-tile{
 animation:sp-thumb-page-in 180ms ease-out both;
}
@media(prefers-reduced-motion:reduce){
 .sp-stream-thumbnail .thumb-list.sp-page-enter>.thumb-tile{animation:none!important;}
}
@media(max-width:370px){
 .sp-stream-thumbnail .thumb-gallery-layout .thumb-list{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}


/* v0.4.6ev | Console-like interactions: smooth stagger, no layout jumps.
   Theme colors follow existing --msl-accent tokens; all motion is decorative. */
:root{
  --sp-motion-appear: 420ms;
  --sp-motion-stagger: 85ms;
  --sp-motion-ease: cubic-bezier(.22,1,.36,1);
}
/* CSS grid reserves exactly two rows on all paginated pages: never animate size. */
.sp-stream-thumbnail .thumb-list.sp-page-enter > .thumb-tile{
  animation-name:sp-console-card-arrive!important;
  animation-duration:var(--sp-motion-appear)!important;
  animation-timing-function:var(--sp-motion-ease)!important;
  animation-fill-mode:both!important;
  animation-delay:0ms!important;
  will-change:opacity,transform;
}
.sp-stream-thumbnail .thumb-list.sp-page-enter > .thumb-tile:nth-child(2){animation-delay:85ms!important}
.sp-stream-thumbnail .thumb-list.sp-page-enter > .thumb-tile:nth-child(3){animation-delay:170ms!important}
.sp-stream-thumbnail .thumb-list.sp-page-enter > .thumb-tile:nth-child(4){animation-delay:255ms!important}
@keyframes sp-console-card-arrive{
  0%{opacity:0;transform:translate3d(0,8px,0)}
  100%{opacity:1;transform:translate3d(0,0,0)}
}
/* Subtle, directional hover motion; no scaling/clipping/collision with adjacent cards. */
.sp-stream-thumbnail .thumb-gallery-layout .thumb-tile,
body.glass-on .sp-stream-thumbnail .thumb-gallery-layout .thumb-tile{
  transition:background-color 200ms ease,border-color 200ms ease,box-shadow 220ms ease,transform 220ms var(--sp-motion-ease)!important;
}
@media (hover:hover) and (pointer:fine){
  .sp-stream-thumbnail .thumb-gallery-layout .thumb-tile:hover{
    transform:translate3d(0,-2px,0);
    box-shadow:0 7px 17px rgba(0,0,0,.15)!important;
  }
  .sp-stream-thumbnail .thumb-gallery-layout .thumb-tile.is-selected:hover{
    box-shadow:inset 0 0 0 1px rgba(var(--msl-accent-rgb,18,183,240),.35),0 7px 17px rgba(0,0,0,.15)!important;
  }
}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-actions .thumb-use{
  transition:transform 120ms ease,background-color 180ms ease,border-color 180ms ease,color 180ms ease!important;
}
.sp-stream-thumbnail .thumb-gallery-layout .thumb-actions button:active:not(:disabled){transform:scale(.97)}
.sp-stream-thumbnail .thumb-list > .thumb-tile.sp-thumb-selected-flash{
  animation:sp-console-selected 240ms var(--sp-motion-ease) both;
}
@keyframes sp-console-selected{
  0%{filter:brightness(1.12)}
  100%{filter:brightness(1)}
}
.sp-thumb-pagination button{
  transition:background-color 220ms ease,border-color 220ms ease,color 220ms ease,box-shadow 220ms ease,transform 120ms ease!important;
}
.sp-thumb-pagination button:active:not(:disabled){transform:scale(.94)}
/* Never intercept pointer input while the card is animating. */
@media(prefers-reduced-motion:reduce){
  .sp-stream-thumbnail .thumb-list.sp-page-enter > .thumb-tile,
  .sp-stream-thumbnail .thumb-list > .thumb-tile.sp-thumb-selected-flash{
    animation:none!important;will-change:auto!important;
  }
  .sp-stream-thumbnail .thumb-gallery-layout .thumb-tile,
  .sp-stream-thumbnail .thumb-gallery-layout .thumb-actions .btn,
  .sp-thumb-pagination button{transition:none!important;transform:none!important}
}


/* v0.4.6ev — platform selection is located directly above site-specific editing.
   Move the original #platformChecks, do not duplicate inputs or change stored state. */
.layout .sp-platform-selection{margin-bottom:var(--sp-space-4)!important;}
.layout .sp-platform-selection #platformChecks{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:var(--sp-space-2)!important;
}
.layout .sp-platform-selection #platformChecks>.check-label{
  min-width:0;
  display:flex;
  align-items:center;
}
.layout .sp-platform-selection>.hint{
  margin:10px 0 0!important;
  line-height:1.55;
}
/* v0.4.6ez — PC: all five platforms in a single row. */
.layout .sp-platform-selection #platformChecks > .check-label{
  white-space:nowrap;
  gap:8px;
}
.layout .sp-platform-selection #platformChecks > .check-label input[type="checkbox"]{
  flex:0 0 auto;
}
/* The main two-column workspace switches to one column at 800px. */
@media (max-width:800px){
  .layout .sp-platform-selection #platformChecks{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media (max-width:520px){
  .layout .sp-platform-selection #platformChecks{grid-template-columns:repeat(2,minmax(0,1fr));}
}


/* Preview headings keep a 40px row so the shared copy icon stays in the heading. */
.sp-sheet .sp-sheet-panel .sp-preview-heading{min-height:40px!important;}

/* v0.4.6fa — override legacy odd-last-item rule that expands TwitCasting
   across all columns. Apply only to the platform selector. */
.layout .sp-platform-selection #platformChecks > label.check-label:last-child:nth-child(odd){
  grid-column:auto!important;
}
/* All five platforms share an equal-width cell on desktop. */
@media (min-width:801px){
  .layout .sp-platform-selection #platformChecks{
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
  }
}