/* v0.4.1 Ambient Home visual layer — passive, no network dependencies. */
.ambient-layer{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;contain:paint;isolation:isolate}
body>header,body>main,body>.footer{position:relative;z-index:1}
.ambient-layer .ambient-glow{position:absolute;inset:-25%;opacity:0;will-change:transform,opacity;transition:opacity 650ms ease;filter:blur(48px);transform:translate3d(0,0,0)}
.ambient-glow--a{background:radial-gradient(ellipse 34% 37% at 27% 32%,rgba(110,212,252,.29),transparent 80%);animation:msl-ambient-a 48s ease-in-out infinite alternate}
.ambient-glow--b{background:radial-gradient(ellipse 32% 39% at 72% 63%,rgba(233,133,230,.23),transparent 80%);animation:msl-ambient-b 56s ease-in-out infinite alternate}
body[data-bg-theme="honey"] .ambient-glow--a{background:radial-gradient(ellipse 36% 36% at 28% 33%,rgba(255,196,110,.25),transparent 80%)}
body[data-bg-theme="pink"] .ambient-glow--a{background:radial-gradient(ellipse 36% 36% at 28% 33%,rgba(255,158,205,.22),transparent 80%)}
body[data-bg-theme="blue"] .ambient-glow--b{background:radial-gradient(ellipse 34% 38% at 74% 62%,rgba(113,144,255,.21),transparent 80%)}
.ambient-layer .ambient-orb{position:absolute;width:var(--orb-size);height:var(--orb-size);left:var(--orb-x);top:var(--orb-y);border-radius:50%;opacity:0;pointer-events:none;transform:translate3d(0,0,0);will-change:transform;transition:opacity 650ms ease;background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.13) 0%,rgba(190,225,255,.05) 42%,rgba(255,255,255,.01) 67%,rgba(199,231,255,.11) 96%,rgba(255,255,255,.07) 100%);border:1px solid rgba(201,236,255,.16);box-shadow:inset 1px 1px 5px rgba(255,255,255,.05),0 0 17px rgba(118,178,240,.04);animation:msl-orb-float var(--orb-duration) ease-in-out infinite alternate;animation-delay:var(--orb-delay)}
.ambient-layer .ambient-lines{position:absolute;inset:0;opacity:0;background:linear-gradient(90deg,transparent 15.9%,rgba(203,232,255,.13) 16%,transparent 16.1%),linear-gradient(90deg,transparent 43.9%,rgba(203,232,255,.09) 44%,transparent 44.1%),linear-gradient(90deg,transparent 72.9%,rgba(203,232,255,.10) 73%,transparent 73.1%),linear-gradient(90deg,transparent 90.9%,rgba(203,232,255,.06) 91%,transparent 91.1%);transition:opacity 650ms ease}
.ambient-layer .ambient-drop{position:absolute;top:-30vh;left:var(--drop-x);width:1px;height:var(--drop-h);border-radius:999px;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(191,227,255,.32) 30%,rgba(221,242,255,.65) 70%,transparent);opacity:0;animation:msl-drop var(--drop-duration) linear forwards;will-change:transform,opacity}
body[data-ambient="home"] .ambient-glow,body[data-ambient="orbs"] .ambient-glow{opacity:.72}
body[data-ambient="home"] .ambient-orb,body[data-ambient="orbs"] .ambient-orb{opacity:.45}
body[data-ambient="home"] .ambient-lines,body[data-ambient="lines"] .ambient-lines{opacity:.42}
body[data-ambient="lines"] .ambient-glow{opacity:.18}
body[data-bg-theme="none"] .ambient-glow{opacity:.12}
@keyframes msl-ambient-a{0%{transform:translate3d(-5%,-5%,0) scale(.95)}50%{transform:translate3d(6%,3%,0) scale(1.06)}100%{transform:translate3d(0%,9%,0) scale(.98)}}
@keyframes msl-ambient-b{0%{transform:translate3d(5%,2%,0) scale(.98)}50%{transform:translate3d(-5%,-5%,0) scale(1.07)}100%{transform:translate3d(2%,6%,0) scale(.96)}}
@keyframes msl-orb-float{0%{transform:translate3d(-14px,12px,0) rotate(-7deg)}50%{transform:translate3d(17px,-14px,0) rotate(5deg)}100%{transform:translate3d(-5px,-29px,0) rotate(-3deg)}}
@keyframes msl-drop{0%{transform:translate3d(0,0,0);opacity:0}9%{opacity:.64}78%{opacity:.35}100%{transform:translate3d(0,155vh,0);opacity:0}}
.ambient-select{min-width:153px;max-width:185px}
body[data-ambient="off"] .ambient-layer{display:none}
@media(prefers-reduced-motion:reduce){.ambient-layer{display:none!important}.ambient-layer *{animation:none!important;transition:none!important}}


/* v0.4.2: quiet clear-glass surfaces, line-led accordion, and floated controls */
body.glass-on .panel {
  background:rgba(22,32,47,.61)!important;
  border-color:rgba(223,236,252,.24)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.14),inset 0 1px rgba(255,255,255,.10)!important;
  backdrop-filter:blur(18px) saturate(115%);-webkit-backdrop-filter:blur(18px) saturate(115%);
}
body.glass-on .disclosure,body.glass-on .x-post-card {
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
body.glass-on .panel .disclosure:not(.social-body),body.glass-on .x-post-card{
  padding:14px 0 6px!important;
  margin:14px 0 0!important;
  border-top:1px solid rgba(215,233,251,.20)!important;
}
body.glass-on .social-item{
  background:rgba(188,217,244,.095)!important;
  border-color:rgba(232,243,255,.25)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.09),0 6px 18px rgba(0,0,0,.12)!important;
}
body.glass-on .social-item::before,body.glass-on .thumb-tile::before{opacity:.25;pointer-events:none}
body.glass-on .social-actions .btn:not(.primary),body.glass-on .social-drag{
  background:rgba(225,238,250,.11)!important;
  border-color:rgba(245,250,255,.27)!important;
}
/* Do not obscure readable editing controls. */
body.glass-on input:not([type=checkbox]):not([type=radio]),body.glass-on textarea{
  background:rgba(10,17,29,.93);border-color:#4b5a70;
}
.msl-display-settings{position:static;margin-left:auto;z-index:16}
.msl-mega-trigger{min-height:39px;border-radius:999px;background:rgba(213,230,251,.10);border-color:rgba(241,248,255,.27);white-space:nowrap;transition:background 180ms ease,border-color 180ms ease}
.msl-mega-trigger:hover,.msl-mega-trigger[aria-expanded=true]{background:rgba(225,239,255,.17);border-color:rgba(248,250,255,.42)}
.msl-appearance-flyout{position:absolute;top:calc(100% + 11px);right:22px;width:min(510px,calc(100vw - 30px));padding:15px;background:rgba(17,25,39,.79);backdrop-filter:blur(19px) saturate(115%);-webkit-backdrop-filter:blur(19px) saturate(115%);border:1px solid rgba(230,243,255,.24);border-radius:16px;box-shadow:0 20px 45px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.13);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-7px) scale(.986);filter:blur(3px);transform-origin:top right;transition:opacity 260ms ease,transform 260ms cubic-bezier(.22,1,.36,1),filter 260ms ease,visibility 260ms}
.msl-display-settings.is-open .msl-appearance-flyout{opacity:1;visibility:visible;pointer-events:auto;transform:none;filter:none}
.msl-flyout-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.msl-flyout-head strong{color:#f5f6f9}.msl-flyout-head span,.msl-flyout-foot{font-size:.76rem;color:#b3c2d5}
.msl-flyout-grid{display:grid;grid-template-columns:minmax(122px,0.7fr) minmax(0,1.3fr);gap:13px}
.msl-flyout-nav{display:flex;flex-direction:column;gap:5px;border-right:1px solid rgba(233,241,255,.13);padding-right:9px}
.msl-nav-option{background:transparent;border:0;border-radius:9px;color:#cdd9e6;text-align:left;padding:10px 9px;display:flex;align-items:center;justify-content:space-between;gap:7px;font-size:.87rem;transition:background 180ms ease,color 180ms ease}
.msl-nav-option:hover,.msl-nav-option.is-current{background:rgba(234,245,255,.13);color:#fff}
.msl-nav-option.is-current span{color:#f7c66a}
.msl-flyout-content.appearance-controls{display:block;min-width:0;margin:0}
.msl-display-pane{display:none}.msl-display-pane.is-current{display:block}.msl-display-pane h3{font-size:.92rem;margin:4px 0 6px}.msl-display-pane .helper{margin-bottom:10px}
.msl-display-pane label{display:block;margin:10px 0 5px}
.msl-display-pane .appearance-select{width:100%;max-width:none;min-width:0}
.msl-display-pane .glass-toggle{width:100%;min-width:0;border-radius:12px}
.msl-flyout-foot{border-top:1px solid rgba(255,255,255,.1);margin:13px 0 0;padding-top:10px}
/* Preserve native selects as the data source; show a fully controllable visual listbox. */
.msl-select-wrap{position:relative;width:100%;min-width:0}
.msl-select-native{position:absolute!important;top:0!important;left:0!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;z-index:-1!important;padding:0!important;margin:0!important}
.msl-select-trigger{width:100%;min-height:43px;display:flex;align-items:center;justify-content:space-between;gap:9px;text-align:left;background:rgba(12,20,33,.91);border:1px solid #51627a;color:#fff;border-radius:10px;padding:9px 11px;font-size:inherit;line-height:1.35;cursor:pointer}
.msl-select-trigger:hover{border-color:rgba(225,238,252,.52)}
.msl-select-trigger:focus-visible{outline:2px solid #f6be50;outline-offset:2px}
.msl-select-trigger:disabled{cursor:not-allowed;opacity:.45}
.msl-select-chevron{flex-shrink:0;font-size:.72rem;color:#d0deec;transition:transform 180ms}
.msl-select-wrap.is-open .msl-select-chevron{transform:rotate(180deg)}
.msl-select-popup{position:fixed;z-index:1000;max-height:min(330px,47vh);overflow-y:auto;overscroll-behavior:contain;padding:5px;background:rgba(22,32,49,.85);border:1px solid rgba(237,245,255,.30);border-radius:12px;box-shadow:0 15px 36px rgba(0,0,0,.40),inset 0 1px rgba(255,255,255,.13);backdrop-filter:blur(16px) saturate(115%);-webkit-backdrop-filter:blur(16px) saturate(115%);opacity:0;transform:translateY(-3px);transition:opacity 180ms ease,transform 180ms cubic-bezier(.22,1,.36,1);pointer-events:none}
.msl-select-popup.is-visible{opacity:1;transform:none;pointer-events:auto}
.msl-select-option{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;min-height:37px;padding:8px 10px;border:0;background:transparent;color:#f2f5fc;border-radius:8px;cursor:pointer;font-size:.9rem}
.msl-select-option:hover,.msl-select-option.is-highlighted{background:rgba(238,245,255,.15)}
.msl-select-option.is-selected{background:rgba(var(--msl-accent-rgb),.18)!important;color:#fff!important;box-shadow:inset 0 0 0 1px rgba(var(--msl-accent-rgb),.32)}
.msl-select-option:disabled{opacity:.35;cursor:not-allowed}
.msl-select-option-mark{color:var(--msl-accent)!important;font-size:.85rem;font-weight:700}
.msl-select-popup::-webkit-scrollbar{width:7px}.msl-select-popup::-webkit-scrollbar-thumb{background:#6b7896;border-radius:10px}
@media(max-width:620px){header{position:relative}.msl-display-settings{position:static;margin-left:0;width:100%}.msl-mega-trigger{width:100%}.msl-appearance-flyout{left:22px;right:22px;width:auto;top:calc(100% - 4px)}.msl-flyout-grid{grid-template-columns:1fr}.msl-flyout-nav{flex-direction:row;flex-wrap:wrap;border-right:0;border-bottom:1px solid rgba(233,241,255,.13);padding:0 0 8px}.msl-nav-option{flex:1 1 auto}.msl-nav-option span{display:none}}
@media(prefers-reduced-motion:reduce){.msl-appearance-flyout,.msl-select-popup,.msl-select-chevron,.msl-nav-option{transition:none!important;filter:none!important}}

/* v0.4.3 — line-based sections, quiet surfaces and consistent form sizing */
.panel .disclosure,.panel .x-post-card,.panel .title-live-preview,.panel .classification-card,.panel .check-label,.panel .checkitem,.panel .inline-note,.panel .example-preview{
  background:transparent!important;box-shadow:none!important;border-radius:0!important;
}
.panel .disclosure,.panel .x-post-card{border:0!important;border-top:1px solid var(--msl-line)!important;padding:20px 0 9px!important;margin:21px 0 0!important}
.panel .disclosure .disclosure{margin-top:18px!important;padding-top:17px!important}
.panel .classification-card,.panel .check-label,.panel .checkitem,.panel .inline-note,.panel .example-preview{border:0!important;border-bottom:1px solid var(--msl-line)!important;padding:12px 2px!important;margin:0!important}
.panel .title-live-preview{border:0!important;border-top:1px solid var(--msl-line)!important;border-bottom:1px solid var(--msl-line)!important;padding:14px 2px!important}
body.glass-on .panel .disclosure,body.glass-on .panel .x-post-card{background:transparent!important;border:0!important;border-top:1px solid var(--msl-line)!important;box-shadow:none!important;backdrop-filter:none!important}
body.glass-on .panel .title-live-preview,body.glass-on .panel .classification-card,body.glass-on .panel .check-label,body.glass-on .panel .checkitem{background:transparent!important;box-shadow:none!important}
/* Social links remain discrete drag targets but do not look like stacked cards. */
.social-list{gap:0!important;margin:14px 0!important}
.social-item{display:flex!important;align-items:stretch;gap:9px;background:transparent!important;border:0!important;border-bottom:1px solid var(--msl-line)!important;border-radius:0!important;box-shadow:none!important;padding:13px 0!important;transition:background 180ms ease,opacity 180ms ease}
.social-item:first-child{border-top:1px solid var(--msl-line)!important}
body.glass-on .social-item,body.glass-on .social-item:hover{background:transparent!important;box-shadow:none!important;border-color:var(--msl-line)!important}
.social-item:hover{background:rgba(224,236,252,.035)!important}
.social-item .social-content{flex:1;min-width:0}
.social-item .social-head{gap:10px}
.social-item .social-drag{flex:0 0 32px;align-self:center;display:flex;align-items:center;justify-content:center;min-height:44px;padding:0;color:#b6c5d9;background:transparent!important;border:0!important;border-radius:9px;font-size:22px;line-height:1;cursor:grab}
.social-item .social-drag:hover,.social-item .social-drag:focus-visible{color:#ffda8c;background:rgba(239,243,250,.085)!important;outline-offset:2px}
.social-item.is-pointer-dragging,body.glass-on .social-item.is-pointer-dragging{background:rgba(47,64,85,.94)!important;border-radius:10px!important;box-shadow:0 14px 32px #0006!important}
.social-item.is-drag-destination{border-bottom-color:#f5bb4b!important;box-shadow:0 2px #f5bb4b!important}
.social-item .social-actions .btn{min-height:36px}
.sns-add-row{align-items:stretch!important;flex-wrap:nowrap!important;gap:10px}
.sns-add-row #socialService,.sns-add-row #addSocial{height:48px!important;min-height:48px!important;box-sizing:border-box;border-radius:12px;align-self:stretch}
.sns-add-row #socialService{flex:1 1 auto;min-width:0}
.sns-add-row #addSocial{flex:0 0 auto;padding:0 16px!important;white-space:nowrap}
.x-post-card .row{margin-top:15px!important;margin-bottom:0!important}
#resetXPost{margin-top:15px!important;min-height:36px}
#resetXPost + .hint{margin-top:12px!important;line-height:1.65!important}
.x-post-card .hint{line-height:1.65}
#thumbUploadStatus{min-height:1.4em;margin:8px 0 12px}
@media(max-width:550px){.social-item .social-drag{flex-basis:28px}.social-head{flex-wrap:wrap}.social-actions{margin-left:auto}}
@media(prefers-reduced-motion:reduce){.social-item{transition:none!important}}

