/* ===== v1.35: first-screen cleanup + deep-material accordion ===== */

/* [0] input view MUST fully hide the result panel (beats #resultPanel{display:flex!important}) */
body.app-view-input #resultPanel{display:none!important}

/* [1] empty pre-cast result panel: keep only the hint message */
#resultPanel.is-empty > *:not(#emptyState){display:none!important}
#resultPanel.is-empty{padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;overflow:visible!important;margin-bottom:0!important;min-height:0!important}
#resultPanel.is-empty #emptyState{display:block!important;margin:0!important;border-radius:20px;padding:32px 18px;background:rgba(255,255,255,.6);border:1px dashed rgba(131,104,208,.3);color:var(--muted);font-weight:700;font-size:14px}
body.dark-mode #resultPanel.is-empty #emptyState{background:rgba(29,23,52,.5);border-color:rgba(187,171,255,.22)}

/* [2] yongsin label hint */
.categoryField label.catLabel{display:flex!important;align-items:baseline;justify-content:space-between;gap:8px}
.categoryField .catHint{font-size:11px;font-weight:700;color:var(--accent-deep);opacity:.82;letter-spacing:0}

/* [3] deep-material accordion: header chevron + expand motion */
.textTabs.yaoActionTabs .btn{
  text-align:left!important;justify-content:flex-start!important;
  padding-left:18px!important;padding-right:46px!important;
  position:relative;border-radius:16px!important;
}
.textTabs.yaoActionTabs .btn::after{
  content:"";position:absolute;right:20px;top:50%;
  width:9px;height:9px;
  border-right:2.4px solid currentColor;border-bottom:2.4px solid currentColor;
  transform:translateY(-70%) rotate(45deg);
  transition:transform .34s cubic-bezier(.34,1.15,.4,1);
  opacity:.92;pointer-events:none;
}
.textTabs.yaoActionTabs .btn.active::after{transform:translateY(-30%) rotate(225deg)}

/* panel container tone */
#yaoPanel.yaoPanel,#yilinPanel.yaoPanel{
  border:1px solid rgba(131,104,208,.16)!important;border-radius:18px!important;
  background:rgba(255,255,255,.62)!important;
  box-shadow:0 10px 26px rgba(101,77,166,.07)!important;padding:14px!important;
}
body.dark-mode #yaoPanel.yaoPanel,body.dark-mode #yilinPanel.yaoPanel{background:rgba(18,14,34,.92)!important}

/* expand motion: panel slide+fade, inner cards staggered */
@keyframes v135PanelIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.yaoPanel.show{animation:v135PanelIn .34s cubic-bezier(.22,.61,.36,1)}
@keyframes v135CardIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.yaoPanel.show .yaoGrid>*{animation:v135CardIn .42s cubic-bezier(.22,.61,.36,1) both}
.yaoPanel.show .yaoGrid>*:nth-child(1){animation-delay:.04s}
.yaoPanel.show .yaoGrid>*:nth-child(2){animation-delay:.10s}
.yaoPanel.show .yaoGrid>*:nth-child(3){animation-delay:.16s}
.yaoPanel.show .yaoGrid>*:nth-child(4){animation-delay:.22s}
.yaoPanel.show .yaoGrid>*:nth-child(5){animation-delay:.28s}
.yaoPanel.show .yaoGrid>*:nth-child(n+6){animation-delay:.34s}
@media(prefers-reduced-motion:reduce){.yaoPanel.show,.yaoPanel.show .yaoGrid>*{animation:none!important}}

.yaoPanel .yaoCard,.yaoPanel .yilinCard{border-radius:14px!important}