/*
 * zine-specific styles that layer on top of the Duckquill theme
 * (duckquill.css + icons.css provide the base design).
 */

.center {
  text-align: center;
}

/* Post prev/next navigation spacing (duckquill's #post-nav has no margins) */
#post-nav:has(a) {
  margin-block: 2rem 1rem;
}

/* Tag chips as plain (non-linked) spans; duckquill only styles <a> chips */
.tags li .tag {
  display: inline-block;
  box-shadow: var(--edge-highlight);
  border-radius: 999px;
  background-color: var(--fg-muted-1);
  padding: 0.375rem 0.75rem;
  color: var(--fg-muted-5);
  font-size: var(--font-size-small);
  line-height: 1;
  white-space: nowrap;
}

/* Social icons in the footer (SVG masks, adapted from duckquill's config) */
#external-links .icon-github {
  --icon: url("data:image/svg+xml,%3Csvg role='img' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle%3EGitHub%3C/title%3E%3Cpath d='M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.805 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.295-1.552 3.3-1.23 3.3-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'/%3E%3C/svg%3E");
}

#external-links .icon-mastodon {
  --icon: url("data:image/svg+xml,%3Csvg role='img' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle%3EMastodon%3C/title%3E%3Cpath d='M23.268 5.313c-.35-2.578-2.617-4.61-5.304-5.004C17.51.242 15.792 0 11.813 0h-.03c-3.98 0-4.835.524-5.288.609C3.882.974 3.084 1.784.682 2.267c-1.561 1.76-2.274 5.097-2.575 6.782-.302 1.677-.01 3.416.058 4.733.067 1.312.282 2.611.66 3.86.378 1.248.957 2.394 1.706 3.408 1.54 2.095 4.47 2.575 7.347 2.367 2.736-.21 5.204-1.348 6.797-2.664.79-.66 1.606-1.376 2.35-2.14.743-.763 1.31-1.644 1.71-2.664.404-1.036.534-2.173.39-3.26-.144-1.087-.53-2.122-1.15-3.094zM19.64 13.63h-2.46V8.94c0-1.26-.534-1.9-1.6-1.9-.926 0-1.39.597-1.6 1.186v2.44h-2.45V8.23c0-1.19-.404-1.78-1.21-1.78-.81 0-1.21.59-1.21 1.78v4.69H5.82V8c0-1.19.297-2.12.89-2.89.606-.77 1.404-1.157 2.394-1.157 1.146 0 2.02.44 2.63 1.32l.71 1.51.71-1.51c.61-.88 1.484-1.32 2.63-1.32.99 0 1.788.387 2.394 1.157.593.77.89 1.7.89 2.89v5.63z'/%3E%3C/svg%3E");
}

#external-links .icon-instagram {
  --icon: url("data:image/svg+xml,%3Csvg role='img' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle%3EInstagram%3C/title%3E%3Cpath d='M7.0301.084c-1.2768.0602-2.1487.264-2.911.5634-.7888.3075-1.4575.72-2.1228 1.3877-.6652.6677-1.0743 1.3368-1.3802 2.127-.2954.7638-.4956 1.6365-.552 2.914-.0564 1.2775-.0689 1.6882-.0626 4.947.0062 3.2586.0206 3.6671.0825 4.9473.061 1.2765.264 2.1482.5635 2.9107.308.7889.72 1.4573 1.388 2.1228.6655 1.3365 1.0743 2.1285 1.38.7632.295 1.6361.4961 2.9134.556 1.2773.056 1.6884.069 4.9462.067 3.2578-.0062 3.668-.0207 4.9478-.0814 1.28-.0607 2.147-.2652 2.9098-.5633.7889-.3086 1.4578-.72 2.1228-1.3881.665-.6682 1.0745-1.3378 1.3795-2.1284.2957-.7632 4966-1.636.556-2.9124.056-1.2809.0692-1.6898.063-4.948-.0063-3.2583-.021-3.6668-.0817-4.9465-.0607-1.2797-.264-2.1487-.5633-2.9117-.3084-.7889-.72-1.4568-1.3876-2.1228C21.2982 1.33 20.628.9208 19.8378.6165 19.074.321 18.2017.1197 16.9244.0645 15.6471.0093 15.236-.005 11.977.0014 8.718.0768 8.31.0215 7.0301.0839m.1402 21.6932c-1.17-.0509-1.8053-.2453-2.2287-.408-.5606-.216-.96-.4771-1.3819-.895-.4217-.4178-.6811-.8186-.9-1.1378-.1644-.2234-.3642-1.0542-.4171-2.228-.0595-1.2645-.072-1.6442-.079-4.848-.007-3.2037.0053-3.583.0607-4.848.05-1.169.2456-1.805.408-2.2282.216-.5613.4762-.96.895-1.3816.4188-.4217.8184-.6814 1.3783-.9003.423-.1651.0575-.3642-1.0577.3617-2.2262.4174-1.2656.0595-1.6448.072-4.8493.079-3.2045.0057-3.5825-.006-4.848-.0608M16.953 5.5864A1.44 1.44 0 1 0 18.39 4.144a1.44 1.44 0 0 0-1.437 1.4424M5.8385 12.012c.0067 3.4032 2.7706 6.1557 6.173 6.1493 3.4026-.0065 6.157-2.7701 6.1506-6.1733-.0065-3.4032-2.771-6.1565-6.174-6.1498-3.403.0067-6.156 2.771-6.1496 6.1738M8 12.0077a4 4 0 1 1 4.008 3.9921A3.9996 3.9996 0 0 1 8 12.0077'/%3E%3C/svg%3E");
}

#external-links .icon-twitter {
  --icon: url("data:image/svg+xml,%3Csvg role='img' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle%3ETwitter%3C/title%3E%3Cpath d='M21.543 7.104c.015.211.015.423.015.636 0 6.507-4.954 14.01-14.01 14.01v-.003A13.94 13.94 0 0 1 0 19.539a9.88 9.88 0 0 0 7.287-2.041 4.93 4.93 0 0 1-4.6-3.42 4.916 4.916 0 0 0 2.223-.084A4.926 4.926 0 0 1 .96 9.167v-.062a4.887 4.887 0 0 0 2.235.616A4.928 4.928 0 0 1 1.67 3.148 13.98 13.98 0 0 0 11.82 8.292a4.929 4.929 0 0 1 8.39-4.49 9.868 9.868 0 0 0 3.128-1.196 4.941 4.941 0 0 1-2.165 2.724A9.828 9.828 0 0 0 24 4.555a10.019 10.019 0 0 1-2.457 2.549z'/%3E%3C/svg%3E");
}

/* Footer widgets (badge wall, carbon badge, townsquare) */
.footer-widgets {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  width: 100%;
}

.footer-buttons {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin: 20px 0;
}

.footer-buttons img {
  border: none;
  display: block;
}

/* Applause button on posts */
#applause {
  margin: 2rem 0;
  text-align: center;
}

#applause applause-button {
  display: inline-block;
  width: 72px;
  height: 72px;
  vertical-align: middle;
}

#applause applause-button .style-root {
  width: 72px;
  height: 72px;
}

#applause applause-button .shockwave {
  width: 60px;
  height: 60px;
}

/* GitHub subscribe button */
.github-subscribe-btn {
  display: inline-block;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-weight: 600;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  padding: 10px 20px;
  font-size: 16px;
  border-radius: 8px;
  background: #0969da;
  color: #ffffff;
  border: 1px solid rgba(27, 31, 36, 0.15);
  box-shadow: none;
  transition: background .15s ease, transform .15s ease;
}

/* Devlog archive year labels */
span.date {
  display: block;
  color: var(--fg-muted-4);
  font-size: var(--font-size-small);
}

a.title h3 {
  margin: 0.25rem 0 1rem;
}