/* kofi-modal: Ko-fi tip panel dialog. Follows the active theme (--card / --text / --muted), with fallbacks for pages
   that do not load app.css. Ko-fi's panel itself is always light, so it sits in a rounded inset. */
#kofi-dialog { --km-bg: var(--card, #1c2430); --km-fg: var(--text, #e8edf3); --km-muted: var(--muted, #9aa7b6);
  position: fixed; inset: 0; margin: auto; width: min(460px, calc(100% - 24px)); max-height: 90vh; max-height: 90dvh;
  padding: 16px 14px 12px; border-radius: 18px; border: 1px solid rgba(255,255,255,.1);
  background: var(--km-bg); color: var(--km-fg); box-shadow: 0 18px 50px rgba(0,0,0,.45);
  overflow-y: auto; overscroll-behavior: contain; box-sizing: border-box; }
html[data-scheme="light"] #kofi-dialog { --km-bg: var(--card, #ffffff); --km-fg: var(--text, #1c2430); --km-muted: var(--muted, #5b6675); border-color: rgba(0,0,0,.08); box-shadow: 0 18px 50px rgba(0,0,0,.2); }
#kofi-dialog[open] { display: flex; flex-direction: column; }
#kofi-dialog::backdrop { background: rgba(0,0,0,.5); }
#kofi-dialog * { box-sizing: border-box; }
#kofi-dialog h2 { margin: 2px 44px 4px 4px; font-size: 18px; line-height: 1.25; color: var(--km-fg); }
#kofi-dialog .kofi-sub { margin: 0 4px 10px; font-size: 13px; color: var(--km-muted); }
#kofi-dialog .kofi-x { position: absolute; top: 10px; right: 10px; width: 30px; height: 30px; display: grid; place-items: center;
  border-radius: 50%; border: 1px solid color-mix(in srgb, var(--km-fg) 20%, transparent); background: color-mix(in srgb, var(--km-fg) 6%, transparent); color: var(--km-fg); cursor: pointer; padding: 0; }
#kofi-dialog .kofi-x:hover, #kofi-dialog .kofi-x:focus-visible { background: color-mix(in srgb, var(--km-fg) 14%, transparent); }
#kofi-dialog .kofi-frame-wrap { position: relative; flex: 1 1 auto; min-height: 240px; border-radius: 14px; overflow: hidden;
  background: color-mix(in srgb, var(--km-fg) 5%, var(--km-bg)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--km-fg) 12%, transparent); padding: 6px; }
#kofi-dialog iframe { display: block; width: 100%; height: 584px; /* 26.10.13.12: Ko-fi panel ends at 560px ("Powered by Ko-fi", same in One time and Monthly, 340-420px wide) + 24px; was 712 */ max-height: calc(90dvh - 150px); border: 0; border-radius: 10px; background: transparent; opacity: 0; transition: opacity .25s; }
#kofi-dialog .kofi-frame-wrap.loaded iframe { opacity: 1; }
#kofi-dialog .kofi-loading { position: absolute; inset: 0; display: grid; place-items: center; margin: 0; font-size: 13px; color: var(--km-muted); }
#kofi-dialog .kofi-frame-wrap.loaded .kofi-loading { display: none; }
#kofi-dialog .kofi-foot { margin: 10px 4px 0; font-size: 12.5px; text-align: center; color: var(--km-muted); }
#kofi-dialog .kofi-foot a { color: var(--accent, #5aa9ff); font-weight: 600; }
html[data-scheme="light"] #kofi-dialog .kofi-foot a { color: var(--accent, #1a5fb4); }
#kofi-dialog .kofi-nw { white-space: nowrap; }