.opt-dialog [hidden], .opt-hint[hidden] { display:none!important }
.opt-trigger { height:30px;padding:0 9px;font-size:12px;color:var(--accent-ink);background:var(--accent-soft);border-color:var(--accent-track);flex:none }
.opt-trigger .icon { width:14px;height:14px }
.field-header:has(.opt-trigger) { gap:6px }
.opt-trigger:disabled { opacity:.6 }
.opt-hint { font-size:11px;color:var(--muted);margin-top:8px }
.opt-applied { font-size:11px;color:var(--positive);display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0;flex:none }
.opt-applied:empty { display:none }
.opt-applied button { font-size:11px;text-decoration:underline;min-height:30px }
.opt-dialog { width:min(920px,calc(100vw - 48px));max-width:920px;max-height:calc(100dvh - 48px);padding:0;overflow:hidden }
.opt-dialog[open] { display:flex;flex-direction:column }
.opt-dialog>.dialog-heading { padding:24px 28px 8px;margin:0;flex:none }
.opt-dialog>.dialog-heading h2 { display:flex;align-items:center;gap:9px }
.opt-dialog>.dialog-heading h2 .icon { color:var(--accent) }
.opt-subtitle { padding:0 28px 20px;margin:0;border-bottom:1px solid var(--border);font-size:13px;color:var(--muted);flex:none }
.opt-body { display:grid;grid-template-columns:37% 63%;overflow:auto;min-height:0;flex:1 }
.opt-input { padding:24px;background:var(--ground);border-right:1px solid var(--border);min-width:0 }
.opt-heading { display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:13px;font-weight:500;margin-bottom:12px }
.opt-heading span { font-size:11px;font-weight:400;color:var(--muted) }
.opt-original { white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.85;font-size:13px;max-height:152px;overflow:auto;color:var(--muted);margin-bottom:28px }
.opt-input textarea { width:100%;height:124px;min-height:100px;background:var(--surface);font-size:13px;line-height:1.8;resize:vertical }
.opt-input .hint { font-size:12px;line-height:1.8;margin:8px 0 16px;color:var(--muted) }
.opt-directions { display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px }
.opt-directions .text-btn { font-size:12px;color:var(--accent-ink);min-height:30px }
.opt-start { width:100%;min-height:40px }
.opt-cancel { width:100%;justify-content:center;margin-top:4px;min-height:36px }
.opt-output { padding:24px;display:flex;flex-direction:column;min-width:0 }
.opt-output h3 { font-size:14px;font-weight:500 }
.opt-result { display:flex;flex-direction:column;flex:1 }
.opt-result>label { margin-bottom:10px }
.opt-result textarea { width:100%;min-height:230px;flex:1;resize:vertical;border:1px solid var(--control);border-radius:6px;padding:14px;font-size:14px;line-height:1.9;background:var(--surface) }
.opt-result textarea:focus { border-color:var(--accent) }
.opt-count { display:flex;justify-content:space-between;gap:8px;font-size:11px;color:var(--muted);margin:8px 0 20px }
.opt-changes { font-size:12px;color:var(--muted);line-height:1.8;border-top:1px solid var(--border);padding-top:14px }
.opt-changes p { margin-bottom:7px }
.opt-changes ul { padding-left:16px;margin:0;color:var(--text);overflow-wrap:anywhere }
.opt-changes li+li { margin-top:5px }
.opt-empty { flex:1;display:flex;align-items:center;justify-content:center;text-align:center;min-height:340px }
.opt-empty .icon { width:28px;height:28px;color:var(--muted);margin:0 auto 18px }
.opt-empty h3 { font-size:16px;margin-bottom:10px }
.opt-empty p { font-size:13px;line-height:1.9;color:var(--muted) }
.opt-foot { display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 24px;border-top:1px solid var(--border);background:var(--surface);flex:none }
.opt-foot>span { font-size:12px;color:var(--muted) }
.opt-foot .dialog-actions { margin:0 }
.opt-foot .btn { min-height:40px }
.opt-warning { padding:10px 12px;background:var(--accent-soft);color:var(--accent-ink);font-size:12px;border-radius:6px;margin-bottom:12px }
.opt-loading { padding:24px 0 }
.opt-skeleton { height:10px;background:var(--raised);border-radius:4px;margin-bottom:18px;animation:opt-pulse 1s ease-in-out infinite }
.opt-loading p { font-size:13px;color:var(--muted);margin-top:24px;line-height:1.8 }
.opt-dialog :focus-visible { outline:2px solid var(--accent);outline-offset:2px }
.opt-dialog .error-inline { font-size:12px;line-height:1.8;margin:0 0 14px }
.admin-tabs:has([data-action=invite-tab-optimizer]) { flex-wrap:wrap }
.opt-admin form { margin-top:24px }
.opt-admin .form-field+.form-field { margin-top:22px }
.opt-admin .dialog-actions { justify-content:flex-start }
.opt-admin .opt-policy { padding:14px 16px;background:var(--ground);margin:22px 0 16px;border-radius:6px;font-size:12px;line-height:1.8;color:var(--muted) }
.opt-dialog .btn:disabled { background:var(--raised);color:var(--muted);border-color:var(--border) }
@keyframes opt-pulse { 50% { opacity:.4 } }
@media(max-width:1100px) and (min-width:960px) {
  .opt-trigger { padding:0 6px;font-size:11px;gap:4px }
  .field-header:has(.opt-trigger) { align-items:flex-start }
  .field-header:has(.opt-trigger) label { max-width:84px }
}
@media(max-width:700px) {
  .opt-dialog { width:100%;max-width:100%;height:100dvh;max-height:100dvh;margin:0;border-radius:0 }
  .opt-dialog>.dialog-heading { padding:16px 16px 8px }
  .opt-dialog>.dialog-heading h2 { font-size:18px }
  .opt-dialog>.dialog-heading .icon-btn { min-width:44px;min-height:44px }
  .opt-subtitle { padding:0 16px 16px }
  .opt-body { display:block }
  .opt-input,.opt-output { padding:20px 16px }
  .opt-input { border-right:0;border-bottom:1px solid var(--border) }
  .opt-original { max-height:116px;margin-bottom:22px;font-size:14px }
  .opt-input textarea { font-size:16px }
  .opt-output { min-height:390px }
  .opt-result textarea { min-height:280px;flex:auto;font-size:16px }
  .opt-foot { padding:12px 16px max(12px,env(safe-area-inset-bottom));flex-wrap:wrap;gap:8px }
  .opt-foot>span { width:100%;text-align:center;font-size:11px }
  .opt-foot .dialog-actions { width:100% }
  .opt-foot .btn { flex:1;height:44px }
  .opt-start,.opt-directions .text-btn,.opt-admin form .btn { min-height:44px }
  .opt-trigger { min-height:36px;font-size:12px }
  .opt-heading { font-size:14px }
  .opt-empty { min-height:260px }
}
@media(prefers-reduced-motion:reduce) { .opt-dialog *, .opt-skeleton { animation:none!important;transition:none!important } }