/* ZackShare pop-up. Bottom sheet on phones, centred box on computers. */
html.zs-lock { overflow: hidden; }
.zs { position: fixed; inset: 0; z-index: 100000; background: rgba(20, 19, 17, .62); display: flex; align-items: flex-end; justify-content: center; opacity: 0; transition: opacity .18s; }
.zs.is-open { opacity: 1; }
.zs-box { width: 100%; max-width: 560px; max-height: 92vh; overflow-y: auto; -webkit-overflow-scrolling: touch; background: #efe9dc; color: #141311; border-top: 4px solid #141311; padding: 14px 16px calc(16px + env(safe-area-inset-bottom)); transform: translateY(24px); transition: transform .2s; font-family: "Source Serif 4", Georgia, serif; }
.zs.is-open .zs-box { transform: none; }
.zs-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 6px; }
.zs-title { margin: 0 !important; font: 400 .8rem/1.2 "Special Elite", "Courier New", monospace; letter-spacing: .12em; }
.zs-x { width: 40px; height: 40px; border: 2px solid #141311; background: transparent; font: 400 1.6rem/1 Georgia, serif; color: #141311; cursor: pointer; }
.zs-x:hover { background: #141311; color: #efe9dc; }
.zs-sec { margin-top: 12px; }
.zs-sec__h { margin: 0 0 8px !important; font: 400 .74rem/1.2 "Special Elite", "Courier New", monospace; letter-spacing: .12em; color: #a3271f; display: flex; justify-content: space-between; gap: 10px; }
.zs-sec__h span { color: #6f6a61; letter-spacing: .04em; text-align: right; }
.zs-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.zs-btn { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 2px 8px; border: 2px solid #141311; background: #f8f4ea; color: #141311; cursor: pointer; font: 400 .74rem/1.15 "Source Serif 4", Georgia, serif; text-align: center; min-height: 86px; transition: transform .1s, box-shadow .1s; }
.zs-btn:hover:not(:disabled), .zs-btn:focus-visible { transform: translate(-2px, -2px); box-shadow: 3px 3px 0 #a3271f; outline: none; }
.zs-btn:disabled { opacity: .45; cursor: progress; }
.zs-btn__l small { display: block; font-size: .64rem; color: #6f6a61; margin-top: 2px; }
.zs-ico { width: 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #141311; flex: 0 0 auto; }
.zs-ico svg { width: 22px; height: 22px; }
.zs-ico--wa, .zs-ico--was { background: #25d366; } .zs-ico--fb, .zs-ico--fbs { background: #1877f2; } .zs-ico--ms { background: linear-gradient(135deg, #0a7cff, #a033ff 70%, #ff5280); }
.zs-ico--x { background: #000; } .zs-ico--tg { background: #229ed9; } .zs-ico--in { background: #0a66c2; } .zs-ico--rd { background: #ff4500; }
.zs-ico--ig { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.zs-ico--sc { background: #fffc00; } .zs-ico--tt { background: #010101; box-shadow: inset -2px 0 0 #25f4ee, inset 2px 0 0 #fe2c55; }
.zs-ico--mail, .zs-ico--sms, .zs-ico--link, .zs-ico--more, .zs-ico--save { background: #2b2925; }
.zs-grid--img { grid-template-columns: repeat(3, 1fr); }
.zs-prev { display: flex; justify-content: center; align-items: center; background: #e3dac6; border: 2px dashed #6f6a61; min-height: 120px; margin-bottom: 10px; padding: 8px; }
.zs-prev img { max-height: 170px; max-width: 100%; box-shadow: 4px 4px 0 #141311; }
.zs-prev__wait { font: 400 .78rem/1.3 "Special Elite", "Courier New", monospace; color: #6f6a61; letter-spacing: .06em; }
.zs-help { margin-top: 14px; border: 2px solid #141311; background: #fff8e1; padding: 12px 14px; box-shadow: 4px 4px 0 #a3271f; }
.zs-help__t { margin: 0 0 6px !important; font: 700 1rem/1.3 "Playfair Display", Georgia, serif; }
.zs-help ol { margin: 0; padding-left: 20px; font-size: .92rem; line-height: 1.45; }
.zs-help__go { display: inline-block; margin-top: 10px; background: #a3271f; color: #efe9dc !important; padding: 9px 12px; font: 400 .8rem/1 "Special Elite", monospace; letter-spacing: .08em; text-decoration: none !important; }
.zs-fine { margin: 12px 0 0 !important; font-size: .74rem; color: #6f6a61; text-align: center; }
.zs-toast { position: fixed; left: 50%; bottom: calc(86px + env(safe-area-inset-bottom)); transform: translate(-50%, 20px); z-index: 100001; max-width: min(92vw, 460px); background: #141311; color: #efe9dc; padding: 12px 16px; font: 400 .9rem/1.4 "Source Serif 4", Georgia, serif; border-left: 4px solid #e0574c; opacity: 0; transition: opacity .25s, transform .25s; pointer-events: none; }
.zs-toast.is-on { opacity: 1; transform: translate(-50%, 0); }
@media (min-width: 640px) {
	.zs { align-items: center; padding: 24px; }
	.zs-box { border: 3px solid #141311; box-shadow: 10px 10px 0 #a3271f; padding: 18px 20px 18px; }
	.zs-grid { grid-template-columns: repeat(5, 1fr); }
	.zs-grid--img { grid-template-columns: repeat(6, 1fr); }
	.zs-toast { bottom: 28px; }
}
@media (prefers-reduced-motion: reduce) { .zs, .zs-box, .zs-btn, .zs-toast { transition: none; } }
.zk-share .zk-share__native { background: #141311; color: #efe9dc !important; }
.zk-share .zk-share__story { background: #a3271f; border-color: #a3271f; color: #efe9dc !important; }
.zk-share .zk-share__story:hover { background: #141311; border-color: #141311; }
@media (max-width: 639px) { .zs-toast { top: calc(12px + env(safe-area-inset-top)); bottom: auto; transform: translate(-50%, -20px); } .zs-toast.is-on { transform: translate(-50%, 0); } }
