/* Shared "Install app" prompt — used by every layout (templates/shared/app-install.php + assets/js/app-install.js).
   Looks like a native install card: app icon, name, one-line pitch, Install button, dismiss ×.
   Every colour/font/radius comes from the tokens below; each layout block maps them onto that
   theme's OWN CSS variables where it has them, so a per-site accent override flows through too. */
.cms-ai{
  --ai-surface:#1c1c1f; --ai-border:rgba(255,255,255,.08); --ai-title:#fff; --ai-text:#a0a0a6;
  --ai-accent:#3b82f6; --ai-accent-text:#fff; --ai-radius:12px; --ai-btn-radius:8px; --ai-icon-radius:22%;
  --ai-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --ai-shadow:0 12px 32px rgba(0,0,0,.45),0 2px 6px rgba(0,0,0,.3);
}
.cms-ai.cms-ai--aniwatch{--ai-surface:#2b2d31;--ai-border:rgba(255,255,255,.08);--ai-title:#fff;--ai-text:#aaaaaa;--ai-accent:#ffdd95;--ai-accent-text:#111;--ai-radius:12px;--ai-btn-radius:30px;--ai-font:Poppins,Arial,sans-serif;}

/* ---- card ---- */
.cms-ai-card{position:fixed;right:20px;bottom:20px;z-index:10000;box-sizing:border-box;width:360px;max-width:calc(100vw - 24px);
  display:flex;align-items:center;gap:12px;padding:14px 14px 14px 14px;margin:0;
  background:var(--ai-surface);border:1px solid var(--ai-border);border-radius:var(--ai-radius);box-shadow:var(--ai-shadow);
  font-family:var(--ai-font);font-size:14px;line-height:1.35;color:var(--ai-text);text-align:left;
  opacity:0;transform:translateY(14px);transition:opacity .22s ease,transform .26s cubic-bezier(.2,.8,.2,1);}
.cms-ai-card[hidden]{display:none;}
.cms-ai-card.is-visible{opacity:1;transform:none;}
.cms-ai-card *{box-sizing:border-box;}
.cms-ai-icon{flex:0 0 48px;width:48px;height:48px;border-radius:var(--ai-icon-radius);object-fit:cover;display:block;background:rgba(255,255,255,.06);}
.cms-ai-body{flex:1 1 auto;min-width:0;padding-right:14px;}
.cms-ai-title{display:block;margin:0 0 2px;color:var(--ai-title);font-size:14.5px;font-weight:600;letter-spacing:.1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cms-ai-sub{display:block;margin:0;color:var(--ai-text);font-size:12.5px;font-weight:400;line-height:1.4;}
.cms-ai-host{display:block;margin-top:2px;color:var(--ai-text);opacity:.75;font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cms-ai-btn{flex:0 0 auto;appearance:none;-webkit-appearance:none;margin:0;border:0;cursor:pointer;
  background:var(--ai-accent);color:var(--ai-accent-text);border-radius:var(--ai-btn-radius);
  padding:8px 16px;font-family:inherit;font-size:13px;font-weight:600;line-height:1.2;letter-spacing:.2px;
  transition:filter .15s ease,box-shadow .15s ease;}
.cms-ai-btn:hover{filter:brightness(1.08);}
.cms-ai-btn:active{filter:brightness(.95);}
.cms-ai-close{position:absolute;top:6px;right:6px;appearance:none;-webkit-appearance:none;margin:0;padding:0;border:0;background:transparent;
  width:22px;height:22px;display:flex;align-items:center;justify-content:center;border-radius:50%;cursor:pointer;color:var(--ai-text);opacity:.7;transition:opacity .15s ease,background .15s ease;}
.cms-ai-close:hover{opacity:1;background:rgba(255,255,255,.08);}
.cms-ai-close svg{width:12px;height:12px;display:block;}
.cms-ai-btn:focus-visible,.cms-ai-close:focus-visible,.cms-ai-sheet button:focus-visible{outline:2px solid var(--ai-accent);outline-offset:2px;}
@media (max-width:575px){
  .cms-ai-card{left:10px;right:10px;width:auto;max-width:none;bottom:calc(10px + env(safe-area-inset-bottom,0px));padding:12px;gap:11px;}
  .cms-ai-icon{flex-basis:44px;width:44px;height:44px;}
  .cms-ai-host{display:none;}
}
@media (prefers-reduced-motion:reduce){.cms-ai-card,.cms-ai-overlay,.cms-ai-sheet{transition:none!important;}}

/* ---- iOS "Add to Home Screen" instructions sheet ---- */
.cms-ai-overlay{position:fixed;inset:0;z-index:100000;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.6);opacity:0;transition:opacity .2s ease;}
.cms-ai-overlay.is-visible{opacity:1;}
.cms-ai-sheet{box-sizing:border-box;width:100%;max-width:440px;margin:0;padding:20px 20px calc(22px + env(safe-area-inset-bottom,0px));
  background:var(--ai-surface);border:1px solid var(--ai-border);border-bottom:0;border-radius:var(--ai-radius) var(--ai-radius) 0 0;
  box-shadow:0 -10px 30px rgba(0,0,0,.45);font-family:var(--ai-font);color:var(--ai-text);text-align:left;
  transform:translateY(24px);transition:transform .26s cubic-bezier(.2,.8,.2,1);}
.cms-ai-overlay.is-visible .cms-ai-sheet{transform:none;}
.cms-ai-sheet:focus{outline:none;}
@media (min-width:576px){.cms-ai-overlay{align-items:center;}.cms-ai-sheet{border-bottom:1px solid var(--ai-border);border-radius:var(--ai-radius);padding-bottom:22px;}}
.cms-ai-sheet-head{display:flex;align-items:center;gap:12px;margin-bottom:16px;position:relative;padding-right:28px;}
.cms-ai-sheet-head .cms-ai-icon{flex-basis:44px;width:44px;height:44px;}
.cms-ai-sheet-head .cms-ai-close{top:50%;right:0;transform:translateY(-50%);width:28px;height:28px;}
.cms-ai-sheet-head .cms-ai-close svg{width:14px;height:14px;}
.cms-ai-sheet ol{list-style:none;margin:0 0 18px;padding:0;counter-reset:ai;}
.cms-ai-sheet li{counter-increment:ai;display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--ai-border);font-size:14px;line-height:1.45;color:var(--ai-text);}
.cms-ai-sheet li:first-child{border-top:0;}
.cms-ai-sheet li::before{content:counter(ai);flex:0 0 24px;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--ai-border);color:var(--ai-title);font-size:12px;font-weight:600;}
.cms-ai-sheet li strong{color:var(--ai-title);font-weight:600;}
.cms-ai-sheet li svg{width:18px;height:18px;vertical-align:-4px;margin:0 2px;color:var(--ai-title);}
.cms-ai-sheet .cms-ai-btn{display:block;width:100%;padding:11px 16px;font-size:14px;}
