Shortcodes: add home blocks and global custom CSS setting

2026-03-05 17:09:01 +00:00
parent 93e829bd19
commit af6bb638ac
7 changed files with 273 additions and 227 deletions
--- a/modules/admin/AdminController.php
+++ b/modules/admin/AdminController.php
@@ -341,6 +341,7 @@ class AdminController
            'seo_robots_index' => Settings::get('seo_robots_index', '1'),
            'seo_robots_follow' => Settings::get('seo_robots_follow', '1'),
            'seo_og_image' => Settings::get('seo_og_image', ''),
+            'site_custom_css' => Settings::get('site_custom_css', ''),
            'redirects' => $redirects,
            'permission_definitions' => Permissions::definitions(),
            'permission_matrix' => Permissions::matrix(),
@@ -363,6 +364,20 @@ class AdminController
                'source' => 'Releases plugin',
                'enabled' => Plugins::isEnabled('releases'),
            ],
+            [
+                'tag' => '[latest-releases]',
+                'description' => 'Home-friendly alias of releases grid.',
+                'example' => '[latest-releases limit="8"]',
+                'source' => 'Releases plugin',
+                'enabled' => Plugins::isEnabled('releases'),
+            ],
+            [
+                'tag' => '[new-artists]',
+                'description' => 'Outputs the latest active artists grid.',
+                'example' => '[new-artists limit="6"]',
+                'source' => 'Artists plugin',
+                'enabled' => Plugins::isEnabled('artists'),
+            ],
            [
                'tag' => '[sale-chart]',
                'description' => 'Outputs a best-sellers chart.',
@@ -370,6 +385,20 @@ class AdminController
                'source' => 'Store plugin',
                'enabled' => Plugins::isEnabled('store'),
            ],
+            [
+                'tag' => '[top-sellers]',
+                'description' => 'Alias for sale chart block.',
+                'example' => '[top-sellers type="tracks" window="weekly" limit="10"]',
+                'source' => 'Store plugin',
+                'enabled' => Plugins::isEnabled('store'),
+            ],
+            [
+                'tag' => '[hero]',
+                'description' => 'Home hero block with CTA buttons.',
+                'example' => '[hero title="Latest Drops" subtitle="Fresh releases weekly" cta_text="Browse Releases" cta_url="/releases"]',
+                'source' => 'Pages module',
+                'enabled' => true,
+            ],
            [
                'tag' => '[login-link]',
                'description' => 'Renders an account login link.',
@@ -469,7 +498,11 @@ class AdminController

        $allowedTags = [
            'releases',
+            'latest-releases',
+            'new-artists',
            'sale-chart',
+            'top-sellers',
+            'hero',
            'login-link',
            'account-link',
            'cart-link',
@@ -506,11 +539,25 @@ class AdminController
            . '.ac-shortcode-release-meta{padding:10px;display:grid;gap:4px;}'
            . '.ac-shortcode-release-title{font-size:18px;line-height:1.2;font-weight:600;}'
            . '.ac-shortcode-release-artist,.ac-shortcode-release-date{color:#9aa0b2;font-size:12px;}'
+            . '.ac-shortcode-artists-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;}'
+            . '.ac-shortcode-artist-card{text-decoration:none;color:inherit;border:1px solid rgba(255,255,255,.1);background:rgba(15,18,24,.6);border-radius:14px;overflow:hidden;display:grid;}'
+            . '.ac-shortcode-artist-avatar{aspect-ratio:1/1;background:rgba(255,255,255,.03);display:grid;place-items:center;overflow:hidden;}'
+            . '.ac-shortcode-artist-avatar img{width:100%;height:100%;object-fit:cover;display:block;}'
+            . '.ac-shortcode-artist-meta{padding:10px;display:grid;gap:4px;}'
+            . '.ac-shortcode-artist-name{font-size:18px;line-height:1.2;font-weight:600;}'
+            . '.ac-shortcode-artist-country{color:#9aa0b2;font-size:12px;}'
            . '.ac-shortcode-sale-list{list-style:none;margin:0;padding:0;display:grid;gap:8px;}'
            . '.ac-shortcode-sale-item{border:1px solid rgba(255,255,255,0.1);background:rgba(15,18,24,0.6);border-radius:10px;padding:10px 12px;display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;}'
            . '.ac-shortcode-sale-rank{font-family:"IBM Plex Mono",monospace;font-size:11px;color:#9aa0b2;letter-spacing:.15em;}'
            . '.ac-shortcode-sale-title{font-size:14px;line-height:1.3;}'
            . '.ac-shortcode-sale-meta{font-size:12px;color:#9aa0b2;white-space:nowrap;}'
+            . '.ac-shortcode-hero{border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:18px;background:linear-gradient(135deg,rgba(255,255,255,.05),rgba(255,255,255,.01));display:grid;gap:10px;}'
+            . '.ac-shortcode-hero-eyebrow{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:#9aa0b2;font-family:"IBM Plex Mono",monospace;}'
+            . '.ac-shortcode-hero-title{font-size:32px;line-height:1.05;font-weight:700;}'
+            . '.ac-shortcode-hero-subtitle{font-size:15px;color:#d1d7e7;max-width:72ch;}'
+            . '.ac-shortcode-hero-actions{display:flex;gap:8px;flex-wrap:wrap;}'
+            . '.ac-shortcode-hero-btn{display:inline-flex;align-items:center;justify-content:center;height:38px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.05);color:#f5f7ff;text-decoration:none;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-family:"IBM Plex Mono",monospace;}'
+            . '.ac-shortcode-hero-btn.primary{border-color:rgba(57,244,179,.6);background:rgba(57,244,179,.16);color:#9ff8d8;}'
            . '.ac-shortcode-link{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.15);background:rgba(15,18,24,.6);color:#f5f7ff;text-decoration:none;font-size:13px;letter-spacing:.08em;text-transform:uppercase;}'
            . '.ac-shortcode-link:hover{border-color:rgba(57,244,179,.6);color:#9ff8d8;}'
            . '.ac-shortcode-newsletter-form{display:grid;gap:10px;border:1px solid rgba(255,255,255,.15);border-radius:14px;background:rgba(15,18,24,.6);padding:14px;}'
@@ -587,6 +634,7 @@ class AdminController
        $seoRobotsIndex = isset($_POST['seo_robots_index']) ? '1' : '0';
        $seoRobotsFollow = isset($_POST['seo_robots_follow']) ? '1' : '0';
        $seoOgImage = trim((string)($_POST['seo_og_image'] ?? ''));
+        $siteCustomCss = trim((string)($_POST['site_custom_css'] ?? ''));

        Settings::set('footer_text', $footer);
        $footerLinks = $this->parseFooterLinks($footerLinksJson);
@@ -629,10 +677,11 @@ class AdminController
        Settings::set('seo_robots_index', $seoRobotsIndex);
        Settings::set('seo_robots_follow', $seoRobotsFollow);
        Settings::set('seo_og_image', $seoOgImage);
+        Settings::set('site_custom_css', $siteCustomCss);
        Audit::log('settings.save', [
            'updated_keys' => [
                'footer_text', 'footer_links_json', 'site_header_*', 'fontawesome_*',
-                'site_maintenance_*', 'smtp_*', 'mailchimp_*', 'seo_*',
+                'site_maintenance_*', 'smtp_*', 'mailchimp_*', 'seo_*', 'site_custom_css',
            ],
        ]);
        return new Response('', 302, ['Location' => '/admin/settings']);
--- a/modules/admin/views/settings.php
+++ b/modules/admin/views/settings.php
@@ -21,6 +21,7 @@ ob_start();
      <button type="button" class="settings-tab" data-tab="smtp" role="tab" aria-selected="false">SMTP</button>
      <button type="button" class="settings-tab" data-tab="mailchimp" role="tab" aria-selected="false">Mailchimp</button>
      <button type="button" class="settings-tab" data-tab="seo" role="tab" aria-selected="false">SEO</button>
+      <button type="button" class="settings-tab" data-tab="custom_css" role="tab" aria-selected="false">Custom CSS</button>
      <button type="button" class="settings-tab" data-tab="redirects" role="tab" aria-selected="false">Redirects</button>
      <button type="button" class="settings-tab" data-tab="permissions" role="tab" aria-selected="false">Permissions</button>
      <button type="button" class="settings-tab" data-tab="audit" role="tab" aria-selected="false">Audit Log</button>
@@ -236,6 +237,17 @@ ob_start();
      </div>
    </div>

+    <div class="settings-panel" data-panel="custom_css" role="tabpanel" hidden>
+      <div class="admin-card" style="padding:16px;">
+        <div class="badge" style="opacity:0.7;">Custom CSS</div>
+        <div style="margin-top:12px; display:grid; gap:12px;">
+          <label class="label">Site-wide Custom CSS</label>
+          <textarea class="input" name="site_custom_css" rows="14" style="resize:vertical; font-family:'IBM Plex Mono', monospace;" placeholder=".my-custom-class { color: #22f2a5; }"><?= htmlspecialchars($site_custom_css ?? '', ENT_QUOTES, 'UTF-8') ?></textarea>
+          <div style="font-size:12px; color:var(--muted);">Applied on all frontend pages after theme styles.</div>
+        </div>
+      </div>
+    </div>
+
    <div class="settings-panel" data-panel="redirects" role="tabpanel" hidden>
      <div class="admin-card" style="padding:16px; display:grid; gap:12px;">
        <div class="badge" style="opacity:0.7;">Redirects Manager</div>
--- a/modules/pages/module.php
+++ b/modules/pages/module.php
@@ -2,10 +2,37 @@
 declare(strict_types=1);

 use Core\Http\Router;
+use Core\Services\Shortcodes;
 use Modules\Pages\PagesController;

 require_once __DIR__ . '/PagesController.php';

+Shortcodes::register('hero', static function (array $attrs = []): string {
+    $eyebrow = trim((string)($attrs['eyebrow'] ?? 'Catalog Focus'));
+    $title = trim((string)($attrs['title'] ?? 'Latest Drops'));
+    $subtitle = trim((string)($attrs['subtitle'] ?? 'Discover fresh releases, artists, and top-selling tracks.'));
+    $ctaText = trim((string)($attrs['cta_text'] ?? 'Browse Releases'));
+    $ctaUrl = trim((string)($attrs['cta_url'] ?? '/releases'));
+    $secondaryText = trim((string)($attrs['secondary_text'] ?? 'Meet the Roster'));
+    $secondaryUrl = trim((string)($attrs['secondary_url'] ?? '/artists'));
+
+    $html = '<section class="ac-shortcode-hero">';
+    if ($eyebrow !== '') {
+        $html .= '<div class="ac-shortcode-hero-eyebrow">' . htmlspecialchars($eyebrow, ENT_QUOTES, 'UTF-8') . '</div>';
+    }
+    $html .= '<h2 class="ac-shortcode-hero-title">' . htmlspecialchars($title, ENT_QUOTES, 'UTF-8') . '</h2>';
+    if ($subtitle !== '') {
+        $html .= '<p class="ac-shortcode-hero-subtitle">' . htmlspecialchars($subtitle, ENT_QUOTES, 'UTF-8') . '</p>';
+    }
+    $html .= '<div class="ac-shortcode-hero-actions">'
+        . '<a class="ac-shortcode-hero-btn primary" href="' . htmlspecialchars($ctaUrl, ENT_QUOTES, 'UTF-8') . '">' . htmlspecialchars($ctaText, ENT_QUOTES, 'UTF-8') . '</a>';
+    if ($secondaryText !== '' && $secondaryUrl !== '') {
+        $html .= '<a class="ac-shortcode-hero-btn" href="' . htmlspecialchars($secondaryUrl, ENT_QUOTES, 'UTF-8') . '">' . htmlspecialchars($secondaryText, ENT_QUOTES, 'UTF-8') . '</a>';
+    }
+    $html .= '</div></section>';
+    return $html;
+});
+
 return function (Router $router): void {
    $controller = new PagesController();
    $router->get('/page', [$controller, 'show']);
--- a/plugins/artists/plugin.php
+++ b/plugins/artists/plugin.php
@@ -2,10 +2,60 @@
 declare(strict_types=1);

 use Core\Http\Router;
+use Core\Services\Database;
+use Core\Services\Shortcodes;
 use Plugins\Artists\ArtistsController;

 require_once __DIR__ . '/ArtistsController.php';

+Shortcodes::register('new-artists', static function (array $attrs = []): string {
+    $limit = max(1, min(20, (int)($attrs['limit'] ?? 6)));
+    $db = Database::get();
+    if (!($db instanceof \PDO)) {
+        return '';
+    }
+
+    try {
+        $stmt = $db->prepare("
+            SELECT name, slug, country, avatar_url
+            FROM ac_artists
+            WHERE is_active = 1
+            ORDER BY created_at DESC, id DESC
+            LIMIT :limit
+        ");
+        $stmt->bindValue(':limit', $limit, \PDO::PARAM_INT);
+        $stmt->execute();
+        $rows = $stmt->fetchAll(\PDO::FETCH_ASSOC) ?: [];
+    } catch (\Throwable $e) {
+        return '';
+    }
+
+    if (!$rows) {
+        return '<div class="ac-shortcode-empty">No artists available yet.</div>';
+    }
+
+    $cards = '';
+    foreach ($rows as $row) {
+        $name = htmlspecialchars((string)($row['name'] ?? ''), ENT_QUOTES, 'UTF-8');
+        $slug = rawurlencode((string)($row['slug'] ?? ''));
+        $country = htmlspecialchars(trim((string)($row['country'] ?? '')), ENT_QUOTES, 'UTF-8');
+        $avatar = trim((string)($row['avatar_url'] ?? ''));
+        $avatarHtml = $avatar !== ''
+            ? '<img src="' . htmlspecialchars($avatar, ENT_QUOTES, 'UTF-8') . '" alt="" loading="lazy">'
+            : '<div class="ac-shortcode-cover-fallback">AC</div>';
+
+        $cards .= '<a class="ac-shortcode-artist-card" href="/artist?slug=' . $slug . '">'
+            . '<div class="ac-shortcode-artist-avatar">' . $avatarHtml . '</div>'
+            . '<div class="ac-shortcode-artist-meta">'
+            . '<div class="ac-shortcode-artist-name">' . $name . '</div>'
+            . ($country !== '' ? '<div class="ac-shortcode-artist-country">' . $country . '</div>' : '')
+            . '</div>'
+            . '</a>';
+    }
+
+    return '<section class="ac-shortcode-artists"><div class="ac-shortcode-artists-grid">' . $cards . '</div></section>';
+});
+
 return function (Router $router): void {
    $controller = new ArtistsController();
    $router->get('/artists', [$controller, 'index']);
--- a/plugins/releases/plugin.php
+++ b/plugins/releases/plugin.php
@@ -78,6 +78,10 @@ Shortcodes::register('releases', static function (array $attrs = []): string {
    return '<section class="ac-shortcode-releases"><div class="ac-shortcode-release-grid">' . $cards . '</div></section>';
 });

+Shortcodes::register('latest-releases', static function (array $attrs = []): string {
+    return Shortcodes::render('[releases limit="' . max(1, min(20, (int)($attrs['limit'] ?? 8))) . '"]');
+});
+
 return function (Router $router): void {
    $controller = new ReleasesController();
    $router->get('/releases', [$controller, 'index']);
--- a/plugins/store/plugin.php
+++ b/plugins/store/plugin.php
@@ -39,18 +39,9 @@ Shortcodes::register('sale-chart', static function (array $attrs = []): string {
    }

    $rows = [];
-    try {
-        $latestPaid = (string)($db->query("SELECT MAX(updated_at) FROM ac_store_orders WHERE status = 'paid'")->fetchColumn() ?? '');
-        $latestCache = (string)($db->query("SELECT MAX(updated_at) FROM ac_store_sales_chart_cache")->fetchColumn() ?? '');
-        if ($latestPaid !== '' && ($latestCache === '' || strcmp($latestPaid, $latestCache) > 0)) {
-            (new StoreController())->rebuildSalesChartCache();
-        }
-    } catch (\Throwable $e) {
-    }
-
    try {
        $stmt = $db->prepare("
-            SELECT item_key, item_label AS title, units, revenue
+            SELECT item_label AS title, units, revenue
            FROM ac_store_sales_chart_cache
            WHERE chart_scope = :scope
              AND chart_window = :window
@@ -66,16 +57,19 @@ Shortcodes::register('sale-chart', static function (array $attrs = []): string {
        $rows = [];
    }

-    if (!$rows && $scope === 'tracks') {
+    if (!$rows) {
        try {
+            $controller = new StoreController();
+            $controller->rebuildSalesChartCache();
            $stmt = $db->prepare("
-                SELECT item_key, item_label AS title, units, revenue
+                SELECT item_label AS title, units, revenue
                FROM ac_store_sales_chart_cache
-                WHERE chart_scope = 'releases'
+                WHERE chart_scope = :scope
                  AND chart_window = :window
                ORDER BY rank_no ASC
                LIMIT :limit
            ");
+            $stmt->bindValue(':scope', $scope, \PDO::PARAM_STR);
            $stmt->bindValue(':window', $window, \PDO::PARAM_STR);
            $stmt->bindValue(':limit', $limit, \PDO::PARAM_INT);
            $stmt->execute();
@@ -89,98 +83,33 @@ Shortcodes::register('sale-chart', static function (array $attrs = []): string {
        return '<div class="ac-shortcode-empty">No sales yet.</div>';
    }

-    $releaseIds = [];
-    $trackIds = [];
-    foreach ($rows as $row) {
-        $itemKey = trim((string)($row['item_key'] ?? ''));
-        if (preg_match('/^release:(\d+)$/', $itemKey, $m)) {
-            $releaseIds[] = (int)$m[1];
-        } elseif (preg_match('/^track:(\d+)$/', $itemKey, $m)) {
-            $trackIds[] = (int)$m[1];
-        }
-    }
-    $releaseIds = array_values(array_unique(array_filter($releaseIds)));
-    $trackIds = array_values(array_unique(array_filter($trackIds)));
-
-    $releaseMap = [];
-    if ($releaseIds) {
-        try {
-            $in = implode(',', array_fill(0, count($releaseIds), '?'));
-            $stmt = $db->prepare("
-                SELECT id, title, slug, cover_url, COALESCE(artist_name, '') AS artist_name
-                FROM ac_releases
-                WHERE id IN ({$in})
-            ");
-            foreach ($releaseIds as $i => $rid) {
-                $stmt->bindValue($i + 1, $rid, \PDO::PARAM_INT);
-            }
-            $stmt->execute();
-            $rels = $stmt->fetchAll(\PDO::FETCH_ASSOC) ?: [];
-            foreach ($rels as $rel) {
-                $releaseMap['release:' . (int)$rel['id']] = $rel;
-            }
-        } catch (\Throwable $e) {
-        }
-    }
-
-    if ($trackIds) {
-        try {
-            $in = implode(',', array_fill(0, count($trackIds), '?'));
-            $stmt = $db->prepare("
-                SELECT t.id AS track_id, r.id, r.title, r.slug, r.cover_url, COALESCE(r.artist_name, '') AS artist_name
-                FROM ac_release_tracks t
-                JOIN ac_releases r ON r.id = t.release_id
-                WHERE t.id IN ({$in})
-            ");
-            foreach ($trackIds as $i => $tid) {
-                $stmt->bindValue($i + 1, $tid, \PDO::PARAM_INT);
-            }
-            $stmt->execute();
-            $rels = $stmt->fetchAll(\PDO::FETCH_ASSOC) ?: [];
-            foreach ($rels as $rel) {
-                $releaseMap['track:' . (int)$rel['track_id']] = $rel;
-            }
-        } catch (\Throwable $e) {
-        }
+    $currency = strtoupper(trim((string)Settings::get('store_currency', 'GBP')));
+    if (!preg_match('/^[A-Z]{3}$/', $currency)) {
+        $currency = 'GBP';
    }

    $list = '';
    $position = 1;
    foreach ($rows as $row) {
-        $itemKey = trim((string)($row['item_key'] ?? ''));
-        $rel = $releaseMap[$itemKey] ?? null;
-
-        $titleRaw = $rel ? (string)($rel['title'] ?? '') : (string)($row['title'] ?? '');
-        $artistRaw = $rel ? trim((string)($rel['artist_name'] ?? '')) : '';
-        $slugRaw = $rel ? trim((string)($rel['slug'] ?? '')) : '';
-        $coverRaw = $rel ? trim((string)($rel['cover_url'] ?? '')) : '';
-
-        $title = htmlspecialchars($titleRaw !== '' ? $titleRaw : ((string)($row['title'] ?? 'Release')), ENT_QUOTES, 'UTF-8');
-        $artist = htmlspecialchars($artistRaw, ENT_QUOTES, 'UTF-8');
-        $href = $slugRaw !== '' ? '/release?slug=' . rawurlencode($slugRaw) : '#';
-
-        $thumbHtml = $coverRaw !== ''
-            ? '<img src="' . htmlspecialchars($coverRaw, ENT_QUOTES, 'UTF-8') . '" alt="" loading="lazy">'
-            : '<div class="ac-shortcode-cover-fallback">AC</div>';
-
-        $copy = '<span class="ac-shortcode-sale-copy">'
+        $title = htmlspecialchars((string)($row['title'] ?? ''), ENT_QUOTES, 'UTF-8');
+        $units = (int)($row['units'] ?? 0);
+        $revenue = number_format((float)($row['revenue'] ?? 0), 2);
+        $list .= '<li class="ac-shortcode-sale-item">'
+            . '<span class="ac-shortcode-sale-rank">#' . $position . '</span>'
            . '<span class="ac-shortcode-sale-title">' . $title . '</span>'
-            . ($artist !== '' ? '<span class="ac-shortcode-sale-artist">' . $artist . '</span>' : '')
-            . '</span>'
-            . '<span class="ac-shortcode-sale-rank">' . $position . '</span>';
-
-        $content = '<span class="ac-shortcode-sale-thumb">' . $thumbHtml . '</span>' . $copy;
-
-        if ($href !== '#') {
-            $content = '<a class="ac-shortcode-sale-link" href="' . htmlspecialchars($href, ENT_QUOTES, 'UTF-8') . '">' . $content . '</a>';
-        }
-
-        $list .= '<li class="ac-shortcode-sale-item">' . $content . '</li>';
+            . '<span class="ac-shortcode-sale-meta">' . $units . ' sold - ' . htmlspecialchars($currency, ENT_QUOTES, 'UTF-8') . ' ' . $revenue . '</span>'
+            . '</li>';
        $position++;
    }

-    $heading = htmlspecialchars((string)($attrs['title'] ?? 'Top Sellers'), ENT_QUOTES, 'UTF-8');
-    return '<section class="ac-shortcode-sale-chart"><header class="ac-shortcode-sale-head"><h3>' . $heading . '</h3></header><ol class="ac-shortcode-sale-list">' . $list . '</ol></section>';
+    return '<section class="ac-shortcode-sale-chart"><ol class="ac-shortcode-sale-list">' . $list . '</ol></section>';
+});
+
+Shortcodes::register('top-sellers', static function (array $attrs = []): string {
+    $type = trim((string)($attrs['type'] ?? 'tracks'));
+    $window = trim((string)($attrs['window'] ?? 'latest'));
+    $limit = max(1, min(50, (int)($attrs['limit'] ?? 10)));
+    return Shortcodes::render('[sale-chart type="' . $type . '" window="' . $window . '" limit="' . $limit . '"]');
 });

 Shortcodes::register('login-link', static function (array $attrs = []): string {
--- a/views/site/layout.php
+++ b/views/site/layout.php
@@ -13,6 +13,7 @@ $seoDefaultDescription = trim(Settings::get('seo_meta_description', ''));
 $seoRobotsIndex = Settings::get('seo_robots_index', '1') === '1' ? 'index' : 'noindex';
 $seoRobotsFollow = Settings::get('seo_robots_follow', '1') === '1' ? 'follow' : 'nofollow';
 $seoOgImage = trim(Settings::get('seo_og_image', ''));
+$siteCustomCss = (string)Settings::get('site_custom_css', '');
 $pageTitleValue = trim((string)($pageTitle ?? $siteTitleSetting));
 $metaTitle = $pageTitleValue;
 if ($seoTitleSuffix !== '' && stripos($pageTitleValue, $seoTitleSuffix) === false) {
@@ -330,148 +331,134 @@ if (session_status() === PHP_SESSION_ACTIVE && isset($_SESSION['ac_site_notice']
      color: var(--muted);
      font-size: 12px;
    }
-    .ac-shortcode-sale-chart {
+    .ac-shortcode-artists-grid {
      display: grid;
+      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
      gap: 12px;
    }
-    .ac-shortcode-sale-head h3 {
-      margin: 0;
+    .ac-shortcode-artist-card {
+      text-decoration: none;
+      color: inherit;
+      border: 1px solid rgba(255,255,255,0.1);
+      background: rgba(15,18,24,0.6);
+      border-radius: 14px;
+      overflow: hidden;
+      display: grid;
+      min-height: 100%;
+    }
+    .ac-shortcode-artist-avatar {
+      aspect-ratio: 1 / 1;
+      background: rgba(255,255,255,0.03);
+      display: grid;
+      place-items: center;
+      overflow: hidden;
+    }
+    .ac-shortcode-artist-avatar img {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+      display: block;
+    }
+    .ac-shortcode-artist-meta {
+      padding: 10px;
+      display: grid;
+      gap: 4px;
+    }
+    .ac-shortcode-artist-name {
+      font-size: 18px;
+      line-height: 1.2;
+      font-weight: 600;
+    }
+    .ac-shortcode-artist-country {
+      color: var(--muted);
      font-size: 12px;
-      letter-spacing: 0.2em;
+    }
+    .ac-shortcode-hero {
+      border: 1px solid rgba(255,255,255,0.14);
+      border-radius: 18px;
+      padding: 18px;
+      background: linear-gradient(135deg, rgba(255,255,255,0.05), rgba(255,255,255,0.01));
+      display: grid;
+      gap: 10px;
+    }
+    .ac-shortcode-hero-eyebrow {
+      font-size: 10px;
+      letter-spacing: 0.24em;
      text-transform: uppercase;
      color: var(--muted);
      font-family: 'IBM Plex Mono', monospace;
-      font-weight: 600;
+    }
+    .ac-shortcode-hero-title {
+      font-size: clamp(30px, 5vw, 54px);
+      line-height: 1.05;
+      font-weight: 700;
+      margin: 0;
+    }
+    .ac-shortcode-hero-subtitle {
+      font-size: 15px;
+      color: #d1d7e7;
+      max-width: 72ch;
+      margin: 0;
+    }
+    .ac-shortcode-hero-actions {
+      display: flex;
+      gap: 8px;
+      flex-wrap: wrap;
+      margin-top: 4px;
+    }
+    .ac-shortcode-hero-btn {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      height: 38px;
+      padding: 0 14px;
+      border-radius: 999px;
+      border: 1px solid rgba(255,255,255,0.16);
+      background: rgba(255,255,255,0.05);
+      color: #f5f7ff;
+      text-decoration: none;
+      font-size: 11px;
+      letter-spacing: 0.16em;
+      text-transform: uppercase;
+      font-family: 'IBM Plex Mono', monospace;
+    }
+    .ac-shortcode-hero-btn.primary {
+      border-color: rgba(57,244,179,0.6);
+      background: rgba(57,244,179,0.16);
+      color: #9ff8d8;
    }
    .ac-shortcode-sale-list {
      list-style: none;
      margin: 0;
      padding: 0;
      display: grid;
-      gap: 10px;
+      gap: 8px;
    }
    .ac-shortcode-sale-item {
      border: 1px solid rgba(255,255,255,0.1);
-      background: linear-gradient(180deg, rgba(15,18,24,0.78), rgba(12,14,20,0.72));
-      border-radius: 12px;
-      padding: 8px;
-      transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
-    }
-    .ac-shortcode-sale-item:hover {
-      border-color: rgba(255,255,255,0.18);
-      box-shadow: 0 10px 24px rgba(0,0,0,0.24);
-      transform: translateY(-1px);
-    }
-    .ac-shortcode-sale-link {
-      display: grid;
-      grid-template-columns: auto 56px minmax(0, 1fr);
-      gap: 12px;
-      align-items: center;
-      color: inherit;
-      text-decoration: none;
-    }
-    .ac-shortcode-sale-link:hover .ac-shortcode-sale-title {
-      color: #ffffff;
-    }
-    .ac-shortcode-sale-link > .ac-shortcode-sale-rank {
-      order: 0;
-      justify-self: start;
-      min-width: 26px;
-      text-align: left;
-      margin-left: 2px;
-      position: relative;
-      padding-right: 18px;
-      margin-right: 6px;
-    }
-    .ac-shortcode-sale-link > .ac-shortcode-sale-rank::before {
-      content: '';
-      position: absolute;
-      right: 0;
-      top: 50%;
-      transform: translateY(-50%);
-      width: 1px;
-      height: 34px;
-      background: linear-gradient(180deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.45) 50%, rgba(255,255,255,0.18) 100%);
-      box-shadow: 0 0 12px rgba(255,255,255,0.08);
-      border-radius: 1px;
-    }
-    .ac-shortcode-sale-link > .ac-shortcode-sale-rank::after {
-      right: 10px;
-    }
-    .ac-shortcode-sale-link > .ac-shortcode-sale-thumb {
-      order: 1;
-    }
-    .ac-shortcode-sale-link > .ac-shortcode-sale-copy {
-      order: 2;
-    }
-
-    .ac-shortcode-sale-thumb {
-      width: 56px;
-      height: 56px;
+      background: rgba(15,18,24,0.6);
      border-radius: 10px;
-      overflow: hidden;
-      background: rgba(255,255,255,0.04);
+      padding: 10px 12px;
      display: grid;
-      place-items: center;
-    }
-    .ac-shortcode-sale-thumb img {
-      width: 100%;
-      height: 100%;
-      object-fit: cover;
-      display: block;
-    }
-    .ac-shortcode-sale-copy {
-      display: grid;
-      gap: 2px;
-      min-width: 0;
+      grid-template-columns: auto 1fr auto;
+      gap: 10px;
+      align-items: center;
    }
    .ac-shortcode-sale-rank {
      font-family: 'IBM Plex Mono', monospace;
-      font-size: 28px;
-      line-height: 1;
-      font-weight: 700;
-      letter-spacing: -0.02em;
-      min-width: 34px;
-      text-align: right;
-      position: relative;
-      display: inline-block;
-      background: linear-gradient(180deg, rgba(245,247,255,0.95) 0%, rgba(169,178,196,0.72) 100%);
-      -webkit-background-clip: text;
-      background-clip: text;
-      -webkit-text-fill-color: transparent;
-      text-shadow: 0 10px 22px rgba(0,0,0,0.40);
-      transition: transform .2s ease, filter .2s ease;
-    }
-    .ac-shortcode-sale-rank::after {
-      content: '.';
-      color: var(--accent);
-      position: absolute;
-      right: -7px;
-      bottom: -1px;
-      font-size: 16px;
-      font-weight: 700;
-      line-height: 1;
-      text-shadow: none;
-      -webkit-text-fill-color: initial;
-      background: none;
-    }
-    .ac-shortcode-sale-link:hover .ac-shortcode-sale-rank {
-      transform: translateY(-1px) scale(1.03);
-      filter: brightness(1.08);
+      font-size: 11px;
+      color: var(--muted);
+      letter-spacing: 0.15em;
    }
    .ac-shortcode-sale-title {
-      font-size: 16px;
-      line-height: 1.25;
-      font-weight: 700;
+      font-size: 14px;
+      line-height: 1.3;
    }
-
-    .ac-shortcode-sale-artist {
+    .ac-shortcode-sale-meta {
      font-size: 12px;
      color: var(--muted);
-      line-height: 1.25;
-      letter-spacing: 0.02em;
+      white-space: nowrap;
    }
-    
    @media (max-width: 900px) {
      .shell {
        padding: 12px 14px 18px;
@@ -540,6 +527,9 @@ if (session_status() === PHP_SESSION_ACTIVE && isset($_SESSION['ac_site_notice']
        padding-top: 2px;
      }
    }
+<?php if (trim($siteCustomCss) !== ''): ?>
+<?= str_replace('</style', '</ style', $siteCustomCss) . "\n" ?>
+<?php endif; ?>
  </style>
 </head>
 <body>
@@ -558,20 +548,5 @@ if (session_status() === PHP_SESSION_ACTIVE && isset($_SESSION['ac_site_notice']
    <?= $content ?? '' ?>
  </main>
  <?php require __DIR__ . '/../partials/footer.php'; ?>
-
-<script data-ac-csrf>
-(function() {
-  const token = '<?= htmlspecialchars(Core\Services\Csrf::token(), ENT_QUOTES, 'UTF-8') ?>';
-  document.querySelectorAll('form[method="post"], form[method="POST"]').forEach((form) => {
-    if (form.querySelector('input[name="csrf_token"]')) return;
-    const input = document.createElement('input');
-    input.type = 'hidden';
-    input.name = 'csrf_token';
-    input.value = token;
-    form.appendChild(input);
-  });
-})();
-</script>
-
 </body>
 </html>