/* Share menu styles for pages that don't load the site stylesheet (the launch countdown).
   These rules are a copy of the share-menu and toast rules in /assets/css/site.css: if you restyle the share menu there, copy the change here. */
.share-modal, .toast { --accent: #d4af37; --ease: cubic-bezier(.2, .8, .2, 1); --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; --shadow-lg: 0 24px 60px rgba(0, 0, 0, .22); }
.share-modal, .share-modal * { box-sizing: border-box; }
.share-modal { text-align: left; font-family: var(--font-body); }
.share-modal button, .share-modal a { letter-spacing: 0; text-transform: none; box-shadow: none; text-decoration: none; cursor: pointer; }
.share-box h3 { color: #111; font-family: var(--font-body); font-weight: 800; }
.ig-panel button { box-shadow: none; }
@keyframes rise{ from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
.toast{ position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 140%); background: #111; color: #fff; padding: 12px 20px; border-radius: 999px; font-weight: 600; font-size: .92rem; z-index: 100; transition: transform .35s var(--ease); box-shadow: var(--shadow-lg); }
.toast.show{ transform: translate(-50%, 0); }
.share-modal{ position: fixed; inset: 0; z-index: 200; background: rgba(0,0,0,.72); display: none; align-items: center; justify-content: center; padding: 16px; }
.share-modal.open{ display: flex; animation: rise .3s var(--ease); }
.share-box{ position: relative; width: 100%; max-width: 420px; max-height: calc(100vh - 32px); overflow-y: auto; background: #fff; color: #111; border-radius: 22px; padding: 22px 20px 18px; box-shadow: var(--shadow-lg); }
.share-box h3{ font-size: 1.4rem; margin: 0 0 12px; text-align: center; }
.share-x{ position: absolute; top: 10px; right: 12px; width: 38px; height: 38px; border-radius: 50%; border: 0; background: #f2ece6; font-size: 1.5rem; line-height: 1; cursor: pointer; color: #111; }
.share-prev{ background: #0d0d0d; border-radius: 14px; aspect-ratio: 1080 / 1350; max-height: 42vh; margin: 0 auto 14px; display: grid; place-items: center; overflow: hidden; }
.share-prev img{ width: 100%; height: 100%; object-fit: contain; }
.share-prev img:not([src]){ visibility: hidden; }
.share-native{ width: 100%; margin-bottom: 12px; }
.share-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.share-grid a, .share-grid button{ display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 4px; border-radius: 12px; border: 1.5px solid #eadfd4; background: #fff; color: #111; font: 700 .78rem/1.1 var(--font-body); cursor: pointer; text-decoration: none !important; transition: border-color .2s, background .2s; }
.share-grid a:hover, .share-grid button:hover{ border-color: var(--accent); background: #fff5ec; }
.share-grid span{ font-size: 1.25rem; line-height: 1; font-weight: 900; }
.share-grid a:not([href]){ opacity: .5; pointer-events: none; }
.share-box .fine{ text-align: center; }
.share-story{ width: 100%; margin: -2px 0 12px; color: #fff; background: linear-gradient(45deg, #f58529 0%, #dd2a7b 45%, #8134af 75%, #515bd4 100%); }
.share-story .ig-dot{ width: 20px; height: 20px; border-radius: 6px; border: 2.5px solid #fff; position: relative; }
.share-story .ig-dot::after{ content: ""; position: absolute; inset: 3.5px; border-radius: 50%; border: 2.5px solid #fff; }
.share-apps{ grid-template-columns: repeat(3, 1fr); }
.share-apps .ico{ font-size: 1.3rem; line-height: 1; font-weight: 900; }
.share-apps .app-ig{ color: #fff; border: 0; background: linear-gradient(45deg, #f58529, #dd2a7b 50%, #8134af 80%, #515bd4); }
.share-apps .app-snap{ color: #111; border: 0; background: #fffc00; }
.share-apps .app-tt{ color: #fff; border: 0; background: #111; box-shadow: inset 2px 0 0 #25f4ee, inset -2px 0 0 #fe2c55; }
.share-apps .app-ig:hover, .share-apps .app-snap:hover, .share-apps .app-tt:hover{ filter: brightness(1.08); border: 0; }
.share-apps .app-ig:hover{ background: linear-gradient(45deg, #f58529, #dd2a7b 50%, #8134af 80%, #515bd4); }
.share-apps .app-snap:hover{ background: #fffc00; }
.share-apps .app-tt:hover{ background: #111; }
