/* YF Settings layout repair v7 — scoped overrides to prevent global header/workspace CSS leaking into the dialog */
@font-face{
  font-family:"YF Noto Myanmar";
  src:url("vendor/fonts/noto-sans-myanmar-myanmar-400-normal.woff2") format("woff2");
  font-style:normal;font-weight:400;font-display:swap;
}
@font-face{
  font-family:"YF Noto Myanmar";
  src:url("vendor/fonts/noto-sans-myanmar-latin-400-normal.woff2") format("woff2");
  font-style:normal;font-weight:400;font-display:swap;
}
#settings-dialog.studio-settings{
  box-sizing:border-box;
  width:min(1000px,calc(100vw - 40px))!important;
  height:min(780px,calc(100dvh - 40px))!important;
  max-height:calc(100dvh - 40px)!important;
  padding:0!important;
  overflow:hidden!important;
  border-radius:18px!important;
}
#settings-dialog .settings-shell{
  display:grid!important;
  grid-template-columns:248px minmax(0,1fr)!important;
  width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;
}
#settings-dialog .settings-sidebar{
  min-width:0;min-height:0;max-height:none!important;
  padding:0 14px 18px!important;
  overflow-y:auto!important;overflow-x:hidden!important;
}
#settings-dialog .settings-side-head{
  height:64px!important;min-height:64px!important;
  margin:0 -14px 14px!important;padding:0 16px!important;
  display:flex!important;flex-direction:row!important;align-items:center!important;
  gap:12px!important;white-space:nowrap;
}
#settings-dialog .settings-side-head button{
  flex:0 0 36px;width:36px!important;height:36px!important;min-height:36px!important;
  padding:0!important;display:grid;place-items:center;line-height:1;
}
#settings-dialog .settings-nav-group{display:block!important;margin:18px 0 22px!important;min-width:0}
#settings-dialog .settings-nav-group>small{
  display:block!important;padding:0 9px 8px!important;
  font-family:"YF Noto Myanmar","Studio Inter",sans-serif;
  font-size:10px;line-height:1.7;letter-spacing:.04em;white-space:normal;
}
#settings-dialog .settings-nav{
  display:flex!important;align-items:center!important;justify-content:flex-start!important;
  width:100%!important;max-width:100%;min-width:0!important;min-height:44px!important;
  height:auto!important;margin:3px 0!important;padding:9px 11px!important;
  gap:10px!important;white-space:normal!important;text-align:left!important;
  overflow-wrap:anywhere;line-height:1.55;
  font-family:"YF Noto Myanmar","Studio Inter",sans-serif!important;font-size:12px!important;
}
#settings-dialog .settings-nav span{flex:0 0 18px;width:18px!important}
#settings-dialog .settings-main{min-width:0!important;min-height:0!important;overflow:hidden!important}
#settings-dialog .settings-titlebar{
  /* Reset the site's global html header rules; this is a modal titlebar, not the page header. */
  position:relative!important;inset:auto!important;
  display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;
  gap:16px!important;width:100%!important;min-width:0!important;min-height:92px!important;height:auto!important;
  margin:0!important;padding:20px 26px!important;box-sizing:border-box!important;
  background:var(--yf-bg)!important;border:0!important;border-bottom:1px solid var(--yf-line)!important;
  box-shadow:none!important;
}
#settings-dialog .settings-titlebar>div{min-width:0;flex:1}
#settings-dialog .settings-titlebar h2{
  margin:0!important;font-family:"YF Noto Myanmar","Studio Inter",sans-serif!important;
  font-size:21px!important;line-height:1.5!important;overflow-wrap:anywhere;
}
#settings-dialog .settings-titlebar p{
  margin:4px 0 0!important;font-family:"YF Noto Myanmar","Studio Inter",sans-serif!important;
  font-size:12px!important;line-height:1.6!important;
}
#settings-dialog .settings-titlebar #settings-close{
  position:static!important;inset:auto!important;transform:none!important;
  display:grid!important;place-items:center!important;flex:0 0 38px!important;
  width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;
  margin:0 0 0 auto!important;padding:0!important;border-radius:10px!important;
  font-size:18px!important;line-height:1!important;
}
#settings-dialog .settings-content{
  box-sizing:border-box!important;min-width:0!important;min-height:0!important;
  width:100%!important;flex:1 1 auto!important;overflow-x:hidden!important;overflow-y:auto!important;
  padding:22px 26px!important;scrollbar-gutter:stable;
}
#settings-dialog .settings-panel{display:none!important;width:100%;min-width:0}
#settings-dialog .settings-panel.active{display:block!important}
#settings-dialog .settings-card{
  box-sizing:border-box!important;width:100%!important;max-width:760px!important;
  min-width:0!important;margin:0 auto!important;padding:22px 24px!important;
  overflow:visible!important;
}
#settings-dialog .settings-card h3{
  margin:0 0 16px!important;font-family:"YF Noto Myanmar","Studio Inter",sans-serif!important;
  font-size:18px!important;line-height:1.55!important;
}
#settings-dialog .settings-row{
  box-sizing:border-box!important;width:100%!important;min-width:0!important;
  display:grid!important;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr)!important;
  align-items:center!important;gap:18px!important;padding:16px 0!important;
  border-top:1px solid var(--yf-line)!important;
}
#settings-dialog .settings-row:first-of-type{border-top:0!important}
#settings-dialog .settings-row>div:first-child{min-width:0!important;max-width:100%!important}
#settings-dialog .settings-row b{
  font-family:"YF Noto Myanmar","Studio Inter",sans-serif!important;
  font-size:12px!important;line-height:1.7!important;overflow-wrap:anywhere;
}
#settings-dialog .settings-row p,#settings-dialog .settings-row small{
  font-family:"YF Noto Myanmar","Studio Inter",sans-serif!important;
  font-size:11px!important;line-height:1.75!important;overflow-wrap:anywhere;
}
#settings-dialog .settings-row>.settings-field,
#settings-dialog .settings-row>.avatar-actions,
#settings-dialog .settings-row>button,
#settings-dialog .settings-row>select,
#settings-dialog .settings-row>input{
  box-sizing:border-box!important;min-width:0!important;max-width:100%!important;
  width:100%!important;justify-self:stretch!important;
}
#settings-dialog .settings-field{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:8px!important;width:100%!important}
#settings-dialog .settings-field input,
#settings-dialog .settings-field select,
#settings-dialog .settings-row>select,
#settings-dialog .settings-row input:not([type=color]){
  box-sizing:border-box!important;width:100%!important;max-width:100%!important;min-width:0!important;
  min-height:42px!important;padding:9px 12px!important;font-size:12px!important;
}
#settings-dialog .settings-field small{display:block;width:100%;text-align:left}
#settings-dialog .settings-row>button{
  width:auto!important;min-width:0!important;max-width:260px!important;
  justify-self:end!important;white-space:normal!important;line-height:1.55!important;
  padding:9px 13px!important;font-family:"YF Noto Myanmar","Studio Inter",sans-serif!important;
}
#settings-dialog .avatar-actions{
  display:grid!important;grid-template-columns:54px minmax(0,1fr) minmax(0,1fr)!important;
  align-items:center!important;justify-content:stretch!important;gap:8px!important;
}
#settings-dialog .avatar-actions button{
  box-sizing:border-box!important;width:100%!important;min-width:0!important;max-width:none!important;
  min-height:40px!important;padding:7px 8px!important;white-space:normal!important;
  line-height:1.45!important;font-size:11px!important;
}
#settings-dialog .settings-avatar{width:54px!important;height:54px!important;flex:0 0 54px!important}
#settings-dialog .theme-options{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;width:100%!important;min-width:0!important;
}
#settings-dialog .theme-options button{
  width:100%!important;min-width:0!important;min-height:88px!important;
  padding:8px 5px!important;white-space:normal!important;line-height:1.45!important;
}
#settings-dialog .settings-controls{grid-template-columns:repeat(2,minmax(0,1fr))!important;min-width:0}
#settings-dialog .settings-controls label{min-width:0;font-family:"YF Noto Myanmar","Studio Inter",sans-serif!important}
#settings-dialog .settings-controls select,
#settings-dialog .settings-controls input:not([type=checkbox]){box-sizing:border-box;width:100%;min-width:0}
#settings-dialog .settings-switch{min-width:0;gap:14px}
#settings-dialog .settings-switch span{min-width:0}
#settings-dialog .settings-switch b,#settings-dialog .settings-switch small{
  font-family:"YF Noto Myanmar","Studio Inter",sans-serif!important;line-height:1.7!important;overflow-wrap:anywhere;
}
#settings-dialog .settings-bottom{
  box-sizing:border-box!important;display:flex!important;flex-direction:row!important;
  align-items:center!important;justify-content:space-between!important;gap:14px!important;
  width:100%!important;min-width:0!important;padding:12px 26px!important;
}
#settings-dialog .settings-bottom span{
  min-width:0;flex:1;font-family:"YF Noto Myanmar","Studio Inter",sans-serif!important;
  font-size:10px!important;line-height:1.6!important;overflow-wrap:anywhere;
}
#settings-dialog .settings-bottom button{
  flex:0 0 auto;max-width:48%;white-space:normal!important;line-height:1.5!important;
  font-family:"YF Noto Myanmar","Studio Inter",sans-serif!important;font-size:11px!important;
}
@media(max-width:760px){
  #settings-dialog.studio-settings{width:calc(100vw - 16px)!important;height:calc(100dvh - 16px)!important;max-height:calc(100dvh - 16px)!important}
  #settings-dialog .settings-shell{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto minmax(0,1fr)!important}
  #settings-dialog .settings-sidebar{max-height:34vh!important;padding:0 10px 8px!important;border-right:0!important;border-bottom:1px solid var(--yf-line)!important;overflow-y:auto!important}
  #settings-dialog .settings-side-head{height:46px!important;min-height:46px!important;margin:0 -10px 4px!important;padding:0 12px!important}
  #settings-dialog .settings-nav-group{display:flex!important;align-items:center!important;gap:5px!important;overflow-x:auto!important;margin:7px 0 2px!important;padding-bottom:2px}
  #settings-dialog .settings-nav-group>small{display:none!important}
  #settings-dialog .settings-nav{flex:0 0 auto!important;width:auto!important;max-width:220px!important;min-height:38px!important;padding:7px 10px!important;font-size:11px!important}
  #settings-dialog .settings-nav span{display:none!important}
  #settings-dialog .settings-titlebar{min-height:76px!important;padding:13px 15px!important}
  #settings-dialog .settings-titlebar h2{font-size:18px!important}
  #settings-dialog .settings-content{padding:12px!important}
  #settings-dialog .settings-card{padding:15px!important}
  #settings-dialog .settings-row{grid-template-columns:minmax(0,1fr)!important;gap:9px!important;align-items:start!important}
  #settings-dialog .settings-row>button{width:100%!important;max-width:none!important;justify-self:stretch!important}
  #settings-dialog .avatar-actions{grid-template-columns:48px minmax(0,1fr) minmax(0,1fr)!important}
  #settings-dialog .settings-avatar{width:48px!important;height:48px!important}
  #settings-dialog .settings-controls{grid-template-columns:minmax(0,1fr)!important}
  #settings-dialog .settings-bottom{padding:10px 12px!important;flex-wrap:wrap!important}
  #settings-dialog .settings-bottom button{max-width:100%;white-space:normal}
}
@media(max-width:420px){
  #settings-dialog .settings-nav{font-size:10px!important;padding:6px 8px!important}
  #settings-dialog .settings-card{padding:12px!important}
  #settings-dialog .avatar-actions{grid-template-columns:44px minmax(0,1fr)!important}
  #settings-dialog .avatar-actions button:last-of-type{grid-column:2}
}

/* Keep help destinations wired to their existing dialogs, but remove the duplicate public-page card strip. */
html .footer-hub{display:none!important}
/* Use the supplied Settings gear illustration in the header control. */
html .header-icon#settings-open{
  width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important;
  padding:3px!important;display:grid!important;place-items:center!important;overflow:hidden!important;
  border-radius:12px!important;
}
html .header-icon#settings-open img{
  display:block;width:34px;height:34px;object-fit:contain;pointer-events:none;
}
@media(max-width:720px){
 html .header-icon#settings-open{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;padding:2px!important}
 html .header-icon#settings-open img{width:32px;height:32px}
}
