/* Settings keep controls visible; optional explanations open only on request. */
#modal-root .settings-dialog #settings-panel{min-width:0}
#modal-root .settings-dialog .settings-group{margin:0 0 20px;min-width:0}
#modal-root .settings-dialog .settings-group-heading{position:relative;min-width:0}
#modal-root .settings-dialog .settings-group-heading h3{display:flex;align-items:center;min-height:44px;margin:0;color:var(--gold);font:600 var(--t-footnote)/var(--lh-footnote) var(--ff-ui)}
#modal-root .settings-dialog .settings-group-heading.has-help h3{padding-right:48px}
#modal-root .settings-dialog .settings-group-body{min-width:0;padding:0 12px;border:1px solid var(--line);border-radius:12px}
#modal-root .settings-dialog .settings-item{position:relative;min-width:0;border-bottom:1px solid var(--line)}
#modal-root .settings-dialog .settings-item:last-child{border-bottom:0}
#modal-root .settings-dialog .settings-control-row{display:flex;align-items:center;gap:12px;min-width:0;min-height:60px;padding:8px 0}
#modal-root .settings-dialog .settings-item.has-help>.settings-control-row{padding-right:44px}
#modal-root .settings-dialog .settings-item-label{flex:1 1 auto;min-width:0;font:500 var(--t-footnote)/var(--lh-footnote) var(--ff-ui);overflow-wrap:break-word}
#modal-root .settings-dialog .settings-item-label small{display:block;margin-top:4px;color:var(--muted);font-size:var(--t-caption);line-height:var(--lh-caption)}
#modal-root .settings-dialog .settings-value{display:flex;align-items:center;justify-content:flex-end;flex:0 0 auto;min-width:0;max-width:55%}
#modal-root .settings-dialog .settings-value .switch{min-width:76px;min-height:44px;margin:0;padding:8px 12px;white-space:nowrap;font:600 var(--t-footnote)/var(--lh-footnote) var(--ff-ui)}
#modal-root .settings-dialog .settings-value .switch[aria-checked=false]{background:var(--surface);color:var(--muted);border-color:var(--line)}
#modal-root .settings-dialog .settings-value select{width:auto;min-width:0;max-width:140px;min-height:44px;padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);font:500 var(--t-footnote)/var(--lh-footnote) var(--ff-ui)}
#modal-root .settings-dialog .settings-value-text{min-width:76px;text-align:center;font:600 var(--t-footnote)/var(--lh-footnote) var(--ff-ui);font-variant-numeric:tabular-nums}

/* The native disclosure provides touch/keyboard activation and expanded state.
   Its summary stays beside the control; its text occupies a full-width row. */
#modal-root .settings-dialog .settings-help{margin:0;min-width:0}
#modal-root .settings-dialog .settings-help>summary{position:absolute;top:8px;right:0;display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;list-style:none;cursor:pointer;border:0;border-radius:8px;background:transparent;color:var(--muted);touch-action:manipulation}
#modal-root .settings-dialog .settings-group-heading>.settings-help>summary{top:0}
#modal-root .settings-dialog .settings-help>summary::-webkit-details-marker{display:none}
#modal-root .settings-dialog .settings-help>summary::marker{content:""}
#modal-root .settings-dialog .settings-help>summary svg{display:block;width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
#modal-root .settings-dialog .settings-help[open]>summary{color:var(--gold);background:#d5b57512}
#modal-root .settings-dialog .settings-help>summary:focus-visible{outline:2px solid var(--gold);outline-offset:0}
#modal-root .settings-dialog .settings-help:not([open])>.settings-help-copy{display:none}
#modal-root .settings-dialog .settings-help-copy{margin:0 0 12px;padding:12px;border:1px solid var(--line);border-left:2px solid var(--gold);border-radius:8px;background:var(--bg);overflow-wrap:break-word}
#modal-root .settings-dialog .settings-help-copy p{margin:0;color:var(--muted);font:400 var(--t-footnote)/var(--lh-footnote) var(--ff-ui)}
#modal-root .settings-dialog .settings-help-copy p+p{margin-top:10px}

#modal-root .settings-dialog .settings-link{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-width:0;min-height:48px;margin:0;padding:12px 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;text-align:start;color:var(--text);font:500 var(--t-footnote)/var(--lh-footnote) var(--ff-ui)}
#modal-root .settings-dialog .settings-link>span:first-child{min-width:0;overflow-wrap:break-word}
#modal-root .settings-dialog .settings-link:last-child,#modal-root .settings-dialog .settings-control-row>.settings-link{border-bottom:0}
#modal-root .settings-dialog .settings-control-row>.settings-link{min-height:44px;padding:0}
#modal-root .settings-dialog .settings-action-arrow{display:flex;align-items:center;flex:0 0 20px;color:var(--muted)}
#modal-root .settings-dialog .settings-action-arrow .ui-icon{width:20px;height:20px;flex-basis:20px}
#modal-root .settings-dialog .settings-link.settings-danger{color:#efb397}
#modal-root .settings-dialog .settings-save-status{margin:0;padding:12px 0;border-bottom:1px solid var(--line);color:var(--muted);font:500 var(--t-caption)/var(--lh-caption) var(--ff-ui)}
#modal-root .settings-dialog .service-links{display:flex;flex-wrap:wrap;gap:0 14px;margin:0;padding:8px 0;border:0}
#modal-root .settings-dialog .service-links a{display:flex;align-items:center;min-height:44px;max-width:100%;font:400 var(--t-caption)/var(--lh-caption) var(--ff-ui);overflow-wrap:break-word}
#modal-root .settings-dialog .settings-admin{display:none}
#modal-root .settings-dialog .settings-admin:has(button){display:block}
#modal-root .settings-dialog .settings-admin .settings-group-body{display:flex;flex-direction:column;gap:8px;padding:12px}
#modal-root .settings-dialog #stars-admin-entry:empty{display:none}
#modal-root .settings-dialog #stars-admin-entry>.button{width:100%;margin:0}
#modal-root .settings-dialog .settings-version{margin:0;text-align:center}

@media(max-width:380px){
 #modal-root .settings-dialog .settings-group-body{padding-inline:10px}
 #modal-root .settings-dialog .settings-control-row{gap:8px}
 #modal-root .settings-dialog .settings-value .switch{min-width:68px;padding-inline:8px}
 #modal-root .settings-dialog .settings-value-text{min-width:68px}
}