/* Al-Andalus — the Alhambra brought to the portal. Layered after styles.css (which keeps the shared Arabesque
   style for other families); everything here is scoped to html[data-theme="andalus"].
   Elements: a khatam (8-point star) zellige tiling woven into the ground; two gilded rosette rings that turn
   slowly behind the page (theme-andalus.js); a multicolour zellige band under the header; station cards as
   mihrab arches holding a medallion; calendar days as tiles with a star, today set in a turning gold star;
   gilded double frames; a shimmering gold title over a star divider. Ivory stucco in light mode. */
html[data-theme="andalus"] {
  --an-green:#0b6e4f; --an-deep:#04261b; --an-gold:#d9b54a; --an-gold-2:#f1d888; --an-cobalt:#1f5f8b; --an-clay:#b5542d;
  --an-ink:var(--an-gold); --an-line:#d9b54a; --an-tile-alpha:.085; --an-frame:color-mix(in srgb,var(--an-gold) 42%,transparent);
  --an-tile:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.3'%3E%3Cpolygon points='48,26 54.44,32.44 63.56,32.44 63.56,41.56 70,48 63.56,54.44 63.56,63.56 54.44,63.56 48,70 41.56,63.56 32.44,63.56 32.44,54.44 26,48 32.44,41.56 32.44,32.44 41.56,32.44'/%3E%3Cpolygon points='0,-22 6.44,-15.56 15.56,-15.56 15.56,-6.44 22,0 15.56,6.44 15.56,15.56 6.44,15.56 0,22 -6.44,15.56 -15.56,15.56 -15.56,6.44 -22,0 -15.56,-6.44 -15.56,-15.56 -6.44,-15.56'/%3E%3Cpolygon points='96,-22 102.44,-15.56 111.56,-15.56 111.56,-6.44 118,0 111.56,6.44 111.56,15.56 102.44,15.56 96,22 89.56,15.56 80.44,15.56 80.44,6.44 74,0 80.44,-6.44 80.44,-15.56 89.56,-15.56'/%3E%3Cpolygon points='0,74 6.44,80.44 15.56,80.44 15.56,89.56 22,96 15.56,102.44 15.56,111.56 6.44,111.56 0,118 -6.44,111.56 -15.56,111.56 -15.56,102.44 -22,96 -15.56,89.56 -15.56,80.44 -6.44,80.44'/%3E%3Cpolygon points='96,74 102.44,80.44 111.56,80.44 111.56,89.56 118,96 111.56,102.44 111.56,111.56 102.44,111.56 96,118 89.56,111.56 80.44,111.56 80.44,102.44 74,96 80.44,89.56 80.44,80.44 89.56,80.44'/%3E%3Cpolygon points='48,35.9 49.94,43.3 56.56,39.44 52.7,46.06 60.1,48 52.7,49.94 56.56,56.56 49.94,52.7 48,60.1 46.06,52.7 39.44,56.56 43.3,49.94 35.9,48 43.3,46.06 39.44,39.44 46.06,43.3'/%3E%3Cline x1='48' y1='26' x2='48' y2='0'/%3E%3Cline x1='48' y1='70' x2='48' y2='96'/%3E%3Cline x1='26' y1='48' x2='0' y2='48'/%3E%3Cline x1='70' y1='48' x2='96' y2='48'/%3E%3C/g%3E%3C/svg%3E"); --an-star:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon points='50,0 64.65,14.64 85.36,14.64 85.36,35.35 100,50 85.36,64.65 85.36,85.36 64.65,85.36 50,100 35.35,85.36 14.64,85.36 14.64,64.65 0,50 14.64,35.35 14.64,14.64 35.35,14.64' fill='%23000'/%3E%3C/svg%3E"); --an-medal:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='none' stroke='%23000' stroke-width='3'%3E%3Cpolygon points='50,3 63.77,16.76 83.23,16.77 83.24,36.23 97,50 83.24,63.77 83.23,83.23 63.77,83.24 50,97 36.23,83.24 16.77,83.23 16.76,63.77 3,50 16.76,36.23 16.77,16.77 36.23,16.76'/%3E%3Ccircle cx='50' cy='50' r='22'/%3E%3Cpolygon points='56.12,35.22 58.66,41.34 64.78,43.88 62.25,50 64.78,56.12 58.66,58.66 56.12,64.78 50,62.25 43.88,64.78 41.34,58.66 35.22,56.12 37.75,50 35.22,43.88 41.34,41.34 43.88,35.22 50,37.75' fill='%23000'/%3E%3C/g%3E%3C/svg%3E"); --an-band:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='16' viewBox='0 0 48 16'%3E%3Crect width='48' height='16' fill='%23f3e9d2'/%3E%3Cpath d='M0 .75H48M0 15.25H48' stroke='%230b6e4f' stroke-width='1.5'/%3E%3Cpolygon points='6,2 7.76,3.76 10.24,3.76 10.24,6.24 12,8 10.24,9.76 10.24,12.24 7.76,12.24 6,14 4.24,12.24 1.76,12.24 1.76,9.76 0,8 1.76,6.24 1.76,3.76 4.24,3.76' fill='%230b6e4f'/%3E%3Cpolygon points='18,2 19.76,3.76 22.24,3.76 22.24,6.24 24,8 22.24,9.76 22.24,12.24 19.76,12.24 18,14 16.24,12.24 13.76,12.24 13.76,9.76 12,8 13.76,6.24 13.76,3.76 16.24,3.76' fill='%23d4af37'/%3E%3Cpolygon points='30,2 31.76,3.76 34.24,3.76 34.24,6.24 36,8 34.24,9.76 34.24,12.24 31.76,12.24 30,14 28.24,12.24 25.76,12.24 25.76,9.76 24,8 25.76,6.24 25.76,3.76 28.24,3.76' fill='%231f5f8b'/%3E%3Cpolygon points='42,2 43.76,3.76 46.24,3.76 46.24,6.24 48,8 46.24,9.76 46.24,12.24 43.76,12.24 42,14 40.24,12.24 37.76,12.24 37.76,9.76 36,8 37.76,6.24 37.76,3.76 40.24,3.76' fill='%23b5542d'/%3E%3C/svg%3E"); --an-divider:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 20'%3E%3Cpath d='M0 10H62M98 10H160' stroke='%23000' stroke-width='1.6'/%3E%3Ccircle cx='66' cy='10' r='2' /%3E%3Ccircle cx='94' cy='10' r='2'/%3E%3Cpolygon points='80,0 82.93,2.93 87.07,2.93 87.07,7.07 90,10 87.07,12.93 87.07,17.07 82.93,17.07 80,20 77.07,17.07 72.93,17.07 72.93,12.93 70,10 72.93,7.07 72.93,2.93 77.07,2.93'/%3E%3C/svg%3E");
  --bg:#03241a; --panel:#073123; --panel-2:#0b3d2c; --border:color-mix(in srgb,#d9b54a 30%,transparent);
  --text:#f6f1e3; --muted:#a9bfae; --input-bg:#021a12; --link:#f1d888;
  --accent:#0f8a5f; --accent-2:#d9b54a; --accent-3:#1f5f8b;
  --app-bg:radial-gradient(1200px 620px at 50% -120px,#0f6b4a66,transparent 70%),radial-gradient(900px 520px at 100% 30%,#d9b54a1f,transparent 62%),radial-gradient(800px 520px at 0% 85%,#1f5f8b26,transparent 64%),linear-gradient(180deg,#03241a,#021710 70%,#01110b);
}
html[data-theme="andalus"][data-mode="light"] {
  --an-ink:#8a6414; --an-line:#0b6e4f; --an-tile-alpha:.075; --an-frame:color-mix(in srgb,#b08a2c 48%,transparent);
  --bg:#f5eedd; --panel:#fffaf0; --panel-2:#f1e7d2; --border:color-mix(in srgb,#b08a2c 34%,transparent);
  --text:#102f24; --muted:#56685c; --input-bg:#fffdf8; --link:#0b6e4f;
  --accent:#0b6e4f; --accent-2:#b08a2c; --accent-3:#1f5f8b;
  --app-bg:radial-gradient(1100px 560px at 50% -120px,#0b6e4f1f,transparent 70%),radial-gradient(800px 480px at 100% 25%,#d9b54a29,transparent 62%),linear-gradient(180deg,#f8f2e4,#f1e8d4);
}
@keyframes an-turn { to { rotate:360deg; } }
@keyframes an-turn-back { to { rotate:-360deg; } }
@keyframes an-shimmer { 0% { background-position:180% 0; } 100% { background-position:-80% 0; } }
@keyframes an-rise { from { opacity:0; translate:0 16px; } }
@keyframes an-twinkle { 0%,100% { opacity:.55; scale:1; } 50% { opacity:1; scale:1.12; } }

/* ---------- Ground: the zellige tiling, fading toward the middle so content stays calm ---------- */
html[data-theme="andalus"][data-mode] body { background:var(--app-bg) fixed; color:var(--text); }
/* (On the rosette layer: a global rule hides every theme's body::before.) */
html[data-theme="andalus"] #an-rosettes::before {
  content:""; position:absolute; inset:0; pointer-events:none; background:var(--an-line); opacity:var(--an-tile-alpha);
  -webkit-mask:var(--an-tile) 0 0/96px 96px repeat,radial-gradient(ellipse 75% 70% at 50% 45%,transparent 35%,#000 100%);
  -webkit-mask-composite:source-in; mask:var(--an-tile) 0 0/96px 96px repeat,radial-gradient(ellipse 75% 70% at 50% 45%,transparent 35%,#000 100%);
  mask-composite:intersect;
}
html[data-theme="andalus"] #app-view, html[data-theme="andalus"] .topbar { position:relative; z-index:1; }
/* Rosette rings (built by theme-andalus.js): gilded, slow, behind everything. */
#an-rosettes { display:none; }
html[data-theme="andalus"] #an-rosettes { display:block; position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; color:var(--an-gold); }
html[data-theme="andalus"][data-mode="light"] #an-rosettes { color:#b08a2c; }
html[data-theme="andalus"] #an-rosettes svg { position:absolute; opacity:.16; }
html[data-theme="andalus"][data-mode="light"] #an-rosettes svg { opacity:.22; }
html[data-theme="andalus"] #an-rosettes .an-r1 { width:min(720px,80vw); right:max(-260px,-22vw); top:-220px; animation:an-turn 240s linear infinite; }
html[data-theme="andalus"] #an-rosettes .an-r2 { width:min(520px,70vw); left:-200px; bottom:-200px; animation:an-turn-back 300s linear infinite; }

/* ---------- Header: dark stucco bar with a zellige tile band beneath ---------- */
html[data-theme="andalus"][data-mode][data-style] .topbar {
  background:color-mix(in srgb,var(--an-deep) 92%,transparent) !important; border-bottom:0 !important;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:0 10px 30px -18px #000c !important;
}
html[data-theme="andalus"][data-mode="light"][data-style] .topbar { background:color-mix(in srgb,#0b4a35 94%,transparent) !important; }
html[data-theme="andalus"][data-mode] .topbar::after { content:""; position:absolute; left:0; right:0; top:100%; height:14px; background:var(--an-band) 0 0/42px 14px repeat-x; box-shadow:0 6px 14px -8px #0008; pointer-events:none; }
html[data-theme="andalus"][data-mode] .topbar .brand { font-family:"Amiri",Georgia,serif; font-weight:700; font-size:21px; color:#f1d888 !important; -webkit-text-fill-color:#f1d888; background:none; letter-spacing:.01em; }
html[data-theme="andalus"][data-mode] .topbar .brand::before { content:""; display:inline-block; width:18px; height:18px; margin-right:8px; vertical-align:-3px; background:#f1d888; -webkit-mask:var(--an-medal) center/contain no-repeat; mask:var(--an-medal) center/contain no-repeat; animation:an-turn 24s linear infinite; }
html[data-theme="andalus"][data-mode][data-style] .topbar :is(.btn,.chip,.crumb,.crumb-back,.crumb.current) {
  border-radius:999px !important; background:#ffffff10 !important; border:1px solid #f1d88838 !important; color:#f6f1e3 !important; box-shadow:none !important; font-family:"Amiri",Georgia,serif;
}
html[data-theme="andalus"][data-mode][data-style] .topbar :is(.btn,.crumb,.crumb-back):hover { background:#f1d88826 !important; border-color:#f1d888aa !important; }
html[data-theme="andalus"][data-mode][data-style] .topbar #logout-btn { background:linear-gradient(180deg,#f1d888,#c99a2e) !important; color:#1d1606 !important; border-color:transparent !important; }
html[data-theme="andalus"][data-mode] #content { padding-top:34px; }

/* ---------- Titles: shimmering gilt over a star divider ---------- */
html[data-theme="andalus"][data-mode] :is(h1,h2,h3,h4,.month-bar .title) { font-family:"Amiri","Marcellus",Georgia,serif; text-shadow:none; color:var(--text); letter-spacing:.01em; }
html[data-theme="andalus"][data-mode] .section-head h2 {
  font-size:clamp(34px,3.8vw,52px); font-weight:700; line-height:1.05; padding-bottom:22px; position:relative;
  background:linear-gradient(100deg,var(--an-ink) 0%,var(--an-ink) 40%,#fff6d0 50%,var(--an-ink) 60%,var(--an-ink) 100%) 0 0/260% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent;
  animation:an-shimmer 9s ease-in-out infinite;
}
html[data-theme="andalus"][data-mode="light"] .section-head h2 { background-image:linear-gradient(100deg,#0b4a35 0%,#0b4a35 40%,#c99a2e 50%,#0b4a35 60%,#0b4a35 100%); }
html[data-theme="andalus"][data-mode] .section-head h2::after {
  content:""; position:absolute; left:0; bottom:0; width:150px; height:18px; background:var(--an-gold);
  -webkit-mask:var(--an-divider) left center/contain no-repeat; mask:var(--an-divider) left center/contain no-repeat;
}
html[data-theme="andalus"][data-mode="light"] .section-head h2::after { background:#b08a2c; }
html[data-theme="andalus"][data-mode] .month-bar { flex-wrap:wrap; row-gap:10px; }
html[data-theme="andalus"][data-mode] .month-bar .title { color:var(--an-ink); font-weight:700; font-size:22px; -webkit-text-fill-color:currentColor; background:none; }

/* ---------- Surfaces: gilded double frame with stars at the corners ---------- */
html[data-theme="andalus"][data-mode][data-style] :is(.card,.stat,.modal,.login-card,.status-strip,.station-rail-left,.station-rail-right) {
  border-radius:18px !important; background:linear-gradient(160deg,color-mix(in srgb,var(--panel-2) 90%,transparent),color-mix(in srgb,var(--panel) 92%,transparent)) !important;
  border:1px solid var(--an-frame) !important;
  box-shadow:inset 0 0 0 4px color-mix(in srgb,var(--panel) 70%,transparent),inset 0 0 0 5px color-mix(in srgb,var(--an-gold) 18%,transparent),0 18px 40px -24px #000a !important;
  transform:none !important;
}
html[data-theme="andalus"][data-mode="light"][data-style] :is(.card,.stat,.modal,.login-card,.status-strip,.station-rail-left,.station-rail-right) { box-shadow:inset 0 0 0 4px #fffaf0,inset 0 0 0 5px #b08a2c2e,0 16px 34px -24px #4a3a1240 !important; }
html[data-theme="andalus"][data-mode] .card:not(.station-card)::before, html[data-theme="andalus"][data-mode] .card:not(.station-card)::after { display:none !important; }
html[data-theme="andalus"][data-mode][data-style] .card:not(.station-card):not(.add-card) {
  background-image:
    radial-gradient(circle at 10px 10px,var(--an-gold) 0 1.6px,transparent 2.4px),radial-gradient(circle at calc(100% - 10px) 10px,var(--an-gold) 0 1.6px,transparent 2.4px),
    radial-gradient(circle at 10px calc(100% - 10px),var(--an-gold) 0 1.6px,transparent 2.4px),radial-gradient(circle at calc(100% - 10px) calc(100% - 10px),var(--an-gold) 0 1.6px,transparent 2.4px),
    linear-gradient(160deg,color-mix(in srgb,var(--panel-2) 90%,transparent),color-mix(in srgb,var(--panel) 92%,transparent)) !important;
}
html[data-theme="andalus"][data-mode] :is(.stat .label,.cal .dow) { font-family:"Amiri",Georgia,serif; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); font-size:12px; }
html[data-theme="andalus"][data-mode] .stat .label::before { content:""; display:inline-block; width:9px; height:9px; margin-right:6px; vertical-align:0; background:var(--an-gold); -webkit-mask:var(--an-star) center/contain no-repeat; mask:var(--an-star) center/contain no-repeat; }
html[data-theme="andalus"][data-mode] .stat .value { font-family:"Amiri",Georgia,serif; font-weight:700; }

/* ---------- Station cards: a mihrab arch holding a turning medallion ---------- */
html[data-theme="andalus"][data-mode][data-style] .station-card {
  border-radius:200px 200px 22px 22px / 120px 120px 22px 22px !important; padding:58px 30px 26px !important; overflow:hidden;
  transition:translate .5s cubic-bezier(.2,1.2,.3,1),box-shadow .4s !important;
}
html[data-theme="andalus"][data-mode][data-style] .station-card:hover { translate:0 -6px; box-shadow:inset 0 0 0 4px color-mix(in srgb,var(--panel) 70%,transparent),inset 0 0 0 5px color-mix(in srgb,var(--an-gold) 45%,transparent),0 28px 50px -26px #000c !important; }
html[data-theme="andalus"][data-mode] .station-card::before {
  content:""; position:absolute; left:50%; top:-64px; width:150px; height:150px; margin-left:-75px; pointer-events:none; z-index:0;
  background:var(--an-gold); opacity:.16; -webkit-mask:var(--an-medal) center/contain no-repeat; mask:var(--an-medal) center/contain no-repeat;
  animation:an-turn 60s linear infinite; display:block !important;
}
html[data-theme="andalus"][data-mode] .station-card:hover::before { opacity:.32; animation-duration:16s; }
html[data-theme="andalus"][data-mode] .station-card > * { position:relative; z-index:1; }
html[data-theme="andalus"][data-mode] .station-card h3 { font-size:28px; color:var(--an-ink); }
html[data-theme="andalus"][data-mode] .station-card .sc-balance { border-radius:14px !important; border:1px solid var(--an-frame) !important; background:color-mix(in srgb,var(--bg) 45%,transparent) !important; }
html[data-theme="andalus"][data-mode][data-style] .add-card { background:transparent !important; border-style:dashed !important; box-shadow:none !important; }

/* ---------- Calendar: zellige tiles, each with a star; today set in a turning gold star ---------- */
html[data-theme="andalus"][data-mode][data-style] .cal .day:not(.empty) {
  border-radius:14px !important; position:relative; overflow:hidden; border:1px solid var(--an-frame) !important;
  background:color-mix(in srgb,var(--panel) 88%,transparent) !important; box-shadow:0 10px 22px -18px #000a !important; transform:none !important;
  transition:translate .45s cubic-bezier(.2,1.3,.3,1),border-color .25s,background-color .25s !important;
}
html[data-theme="andalus"][data-mode][data-style] .cal .day.empty { background:transparent !important; border:0 !important; box-shadow:none !important; }
html[data-theme="andalus"][data-mode] .cal .day:not(.empty)::after {
  content:""; position:absolute; right:-14px; bottom:-14px; width:54px; height:54px; pointer-events:none; background:var(--an-gold); opacity:.1;
  -webkit-mask:var(--an-medal) center/contain no-repeat; mask:var(--an-medal) center/contain no-repeat; transition:opacity .3s,rotate 1.2s cubic-bezier(.2,1,.3,1);
}
html[data-theme="andalus"][data-mode][data-style] .cal .day:not(.empty):hover { translate:0 -4px; border-color:var(--an-gold) !important; }
html[data-theme="andalus"][data-mode] .cal .day:not(.empty):hover::after { opacity:.3; rotate:135deg; }
html[data-theme="andalus"][data-mode] .cal .day .num { font-family:"Amiri",Georgia,serif; font-weight:700; font-size:17px; position:relative; }
html[data-theme="andalus"][data-mode][data-style] .cal .day.today { background:linear-gradient(160deg,#0f8a5f,#06432f) !important; border-color:var(--an-gold) !important; outline:0 !important; }
html[data-theme="andalus"][data-mode][data-style] .cal .day.today :is(.num,.mini,.mini *) { color:#fff8e0 !important; }
html[data-theme="andalus"][data-mode] .cal .day.today .num { color:#1d1606 !important; display:inline-grid; place-items:center; width:34px; height:34px; margin:-6px 0 0 -6px; z-index:0; }
html[data-theme="andalus"][data-mode] .cal .day.today .num::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(135deg,#f6e3a1,#c99a2e); -webkit-mask:var(--an-star) center/contain no-repeat; mask:var(--an-star) center/contain no-repeat; animation:an-turn 20s linear infinite; }
html[data-theme="andalus"][data-mode] .cal .day.today::after { opacity:.25; background:#f1d888; }

/* ---------- Page rail: tabs on a stucco column; the active page carries a gold star ---------- */
html[data-theme="andalus"][data-mode][data-style] .station-tabs-v .tab { border-radius:12px !important; box-shadow:none !important; border:0 !important; background:transparent !important; font-family:"Amiri",Georgia,serif; font-size:15.5px; transition:background-color .2s,translate .3s cubic-bezier(.2,1.3,.3,1) !important; }
html[data-theme="andalus"][data-mode][data-style] .station-tabs-v .tab:not(.active):hover { background:color-mix(in srgb,var(--an-gold) 12%,transparent) !important; translate:3px 0; }
html[data-theme="andalus"][data-mode][data-style] .station-tabs-v .tab.active { background:linear-gradient(90deg,#0f8a5f,#085a3d) !important; color:#fff8e0 !important; box-shadow:inset 0 0 0 1px #f1d88866 !important; position:relative; padding-right:30px !important; }
html[data-theme="andalus"][data-mode] .station-tabs-v .tab.active::after { content:""; position:absolute; right:10px; top:50%; width:12px; height:12px; margin-top:-6px; background:#f1d888; -webkit-mask:var(--an-star) center/contain no-repeat; mask:var(--an-star) center/contain no-repeat; animation:an-twinkle 3s ease-in-out infinite; }
html[data-theme="andalus"][data-mode] .station-tabs-v .station-submenu { border-left:1px solid var(--an-frame); margin-left:14px; }

/* ---------- Station pages: the arcade of Córdoba (theme-sitenav.js) ----------
   One horseshoe arch per section with red-and-cream voussoirs; the lit arch holds a turning gold star.
   The section's pages hang beneath as a strip of glazed tiles. Replaces the page sidebar. */
html.sn-on[data-theme="andalus"][data-mode] .station-rail-left { display:none !important; }
html.sn-on[data-theme="andalus"][data-mode] .station-layout { grid-template-columns:minmax(0,1fr) 230px !important; }
html.sn-on[data-theme="andalus"][data-mode] .station-layout:not(:has(.station-rail-right)) { grid-template-columns:minmax(0,1fr) !important; }
@media (max-width:980px) { html.sn-on[data-theme="andalus"][data-mode] .station-layout { grid-template-columns:minmax(0,1fr) !important; } }
html[data-theme="andalus"] .an-nav { margin:4px 0 24px; }
html[data-theme="andalus"] .an-arcade { display:flex; gap:10px; align-items:flex-end; padding:0 12px; overflow-x:auto; scrollbar-width:none; }
html[data-theme="andalus"] .an-arcade::-webkit-scrollbar { display:none; }
html[data-theme="andalus"] .an-arch {
  all:unset; box-sizing:border-box; position:relative; isolation:isolate; flex:1 1 0; min-width:92px; height:132px; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:2px; padding:0 16px 16px; text-align:center;
  transition:translate .45s cubic-bezier(.2,1.4,.3,1);
}
/* Voussoirs: alternating red brick and cream stone radiating from the springline. */
html[data-theme="andalus"] .an-arch::before {
  content:""; position:absolute; inset:0; z-index:-2; border-radius:50% 50% 3px 3px / 44% 44% 3px 3px;
  background:repeating-conic-gradient(from -90deg at 50% 46%,#a8432a 0 7.5deg,#f0e2c3 7.5deg 15deg);
  box-shadow:0 14px 26px -18px #000c; transition:filter .3s;
}
html[data-theme="andalus"] .an-arch::after {
  content:""; position:absolute; inset:11px 11px 0; z-index:-1; border-radius:50% 50% 0 0 / 40% 40% 0 0;
  background:linear-gradient(180deg,#05281c,#0a3a2a); box-shadow:inset 0 0 0 1px #f1d88840; transition:background .35s;
}
html[data-theme="andalus"][data-mode="light"] .an-arch::after { background:linear-gradient(180deg,#fffaf0,#f4ead6); box-shadow:inset 0 0 0 1px #b08a2c55; }
html[data-theme="andalus"] .an-arch:not(.on)::before { filter:saturate(.75) brightness(.92); }
html[data-theme="andalus"] .an-arch-name { font:700 17px/1.1 "Amiri",Georgia,serif; color:var(--text); white-space:nowrap; }
html[data-theme="andalus"] .an-arch small { font:12px/1 "Amiri",Georgia,serif; color:var(--muted); }
html[data-theme="andalus"] .an-arch:hover { translate:0 -4px; }
html[data-theme="andalus"] .an-arch:hover::before { filter:none; }
html[data-theme="andalus"] .an-arch:focus-visible { outline:2px solid var(--an-gold); outline-offset:3px; border-radius:50% 50% 3px 3px / 44% 44% 3px 3px; }
html[data-theme="andalus"] .an-arch.peek::after { background:linear-gradient(180deg,color-mix(in srgb,#d9b54a 26%,#05281c),#0a3a2a); }
html[data-theme="andalus"][data-mode="light"] .an-arch.peek::after { background:linear-gradient(180deg,#f6e7b8,#f4ead6); }
/* The lit arch: lamplight from the crown, a turning gold star. */
html[data-theme="andalus"] .an-arch.on { translate:0 -6px; }
html[data-theme="andalus"] .an-arch.on::before { box-shadow:0 0 0 2px #d9b54a,0 18px 34px -16px #0b6e4fcc; }
html[data-theme="andalus"] .an-arch.on::after { background:radial-gradient(70% 60% at 50% 18%,#f1d88855,transparent 70%),linear-gradient(180deg,#0f8a5f,#06432f); box-shadow:inset 0 0 0 1px #f1d888aa; }
html[data-theme="andalus"] .an-arch.on .an-arch-name { color:#fff8e0; }
html[data-theme="andalus"] .an-arch.on small { color:#f1d888; }
html[data-theme="andalus"] .an-arch.on .an-arch-name::before {
  content:""; display:block; width:22px; height:22px; margin:0 auto 8px; background:linear-gradient(135deg,#f6e3a1,#c99a2e);
  -webkit-mask:var(--an-star) center/contain no-repeat; mask:var(--an-star) center/contain no-repeat; animation:an-turn 18s linear infinite;
}
/* Tile strip beneath the arcade, edged with the zellige band. */
html[data-theme="andalus"] .an-strip {
  position:relative; display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:20px 16px 14px;
  border:1px solid var(--an-frame); border-radius:6px 6px 16px 16px; background:color-mix(in srgb,var(--panel) 90%,transparent);
  box-shadow:inset 0 0 0 4px color-mix(in srgb,var(--panel) 70%,transparent),0 18px 36px -26px #000a;
}
html[data-theme="andalus"] .an-strip::before { content:""; position:absolute; left:0; right:0; top:0; height:9px; border-radius:6px 6px 0 0; background:var(--an-band) 0 0/27px 9px repeat-x; }
html[data-theme="andalus"] .an-strip-h { font:700 12px/1 "Amiri",Georgia,serif; letter-spacing:.14em; text-transform:uppercase; color:var(--an-ink); margin-right:4px; }
html[data-theme="andalus"] .an-strip-h::after { content:""; display:inline-block; width:9px; height:9px; margin-left:8px; background:var(--an-gold); -webkit-mask:var(--an-star) center/contain no-repeat; mask:var(--an-star) center/contain no-repeat; }
html[data-theme="andalus"] .an-tile {
  all:unset; box-sizing:border-box; cursor:pointer; display:inline-flex; align-items:center; gap:7px; padding:8px 15px; border-radius:10px;
  font:700 15px/1.2 "Amiri",Georgia,serif; color:var(--text); border:1px solid var(--an-frame); background:color-mix(in srgb,var(--panel-2) 85%,transparent);
  transition:translate .35s cubic-bezier(.2,1.4,.3,1),border-color .2s,background-color .2s; animation:an-rise .45s cubic-bezier(.2,1,.3,1) calc(var(--d) * 30ms) backwards;
}
html[data-theme="andalus"] .an-tile i { font-style:normal; font-size:15px; }
html[data-theme="andalus"] .an-tile:hover { translate:0 -2px; border-color:var(--an-gold); }
html[data-theme="andalus"] .an-tile:focus-visible { outline:2px solid var(--an-gold); outline-offset:2px; }
html[data-theme="andalus"] .an-tile.on { background:linear-gradient(180deg,#139165,#07573b); color:#fff8e0; border-color:#f1d888; box-shadow:0 8px 18px -10px #0b6e4fcc; }
@media (max-width:700px) {
  /* Two tiers of three arches, like the Mezquita's double arcade, so every section fits a phone. */
  html[data-theme="andalus"] .an-arcade { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px 8px; padding:0 2px; overflow:visible; }
  html[data-theme="andalus"] .an-arch { min-width:0; height:86px; padding:0 6px 11px; }
  html[data-theme="andalus"] .an-arch::after { inset:8px 8px 0; }
  html[data-theme="andalus"] .an-arch-name { font-size:13px; }
  html[data-theme="andalus"] .an-arch small { display:none; }
  html[data-theme="andalus"] .an-arch.on .an-arch-name::before { width:16px; height:16px; margin-bottom:5px; }
  html[data-theme="andalus"] .an-tile { font-size:14px; padding:7px 11px; }
}

/* ---------- Controls ---------- */
html[data-theme="andalus"][data-mode][data-style] .btn { border-radius:999px !important; font-family:"Amiri",Georgia,serif; font-weight:700; letter-spacing:.02em; }
html[data-theme="andalus"][data-mode][data-style] #content .btn:not(.primary):not(.info):not(.danger) { background:color-mix(in srgb,var(--panel-2) 80%,transparent) !important; border:1px solid var(--an-frame) !important; color:var(--text) !important; box-shadow:none !important; }
html[data-theme="andalus"][data-mode][data-style] #content .btn:not(.primary):not(.info):not(.danger):hover { border-color:var(--an-gold) !important; }
html[data-theme="andalus"][data-mode][data-style] :is(.btn.primary,.btn.info) {
  position:relative; overflow:hidden; color:#fff8e0 !important; border:1px solid #f1d88899 !important;
  background:linear-gradient(180deg,#139165,#07573b) !important; box-shadow:inset 0 1px 0 #ffffff30,0 10px 22px -12px #0b6e4fcc !important;
}
html[data-theme="andalus"][data-mode][data-style] :is(.btn.primary,.btn.info)::after { content:""; position:absolute; inset:0; background:linear-gradient(105deg,transparent 35%,#fff3 50%,transparent 65%) -150% 0/250% 100% no-repeat; transition:background-position .8s; pointer-events:none; }
html[data-theme="andalus"][data-mode][data-style] :is(.btn.primary,.btn.info):hover::after { background-position:150% 0; }
html[data-theme="andalus"][data-mode][data-style] :is(.seg button.active,.tabs:not(.station-tabs-v) .tab.active) { background:linear-gradient(180deg,#139165,#07573b) !important; color:#fff8e0 !important; }
html[data-theme="andalus"][data-mode][data-style] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea) { border-radius:12px; border:1px solid var(--an-frame); background:var(--input-bg); color:var(--text); }
html[data-theme="andalus"][data-mode][data-style] :is(input,select,textarea):focus { outline:none; border-color:var(--an-gold); box-shadow:0 0 0 3px color-mix(in srgb,var(--an-gold) 28%,transparent); }
html[data-theme="andalus"][data-mode] :is(input[type="checkbox"],input[type="radio"]) { accent-color:var(--accent); }
html[data-theme="andalus"][data-mode] th { font-family:"Amiri",Georgia,serif; color:var(--an-ink); letter-spacing:.04em; }
html[data-theme="andalus"] ::selection { background:#d9b54a; color:#1d1606; }

/* ---------- Choreography ---------- */
html[data-theme="andalus"][data-mode] #content > * { animation:an-rise .8s cubic-bezier(.2,1,.3,1) backwards; }
html[data-theme="andalus"][data-mode] #content > :nth-child(2) { animation-delay:.07s; }
html[data-theme="andalus"][data-mode] #content > :nth-child(n+3) { animation-delay:.14s; }
html[data-theme="andalus"][data-mode] .station-grid > * { animation:an-rise .9s cubic-bezier(.2,1,.3,1) backwards; }
html[data-theme="andalus"][data-mode] .station-grid > :nth-child(2) { animation-delay:.1s; }
html[data-theme="andalus"][data-mode] .station-grid > :nth-child(n+3) { animation-delay:.2s; }

/* ---------- Gallery preview ---------- */
.theme-showcase[data-preset="andalus"] .theme-showcase-art { background:radial-gradient(circle at 70% 30%,#d9b54a33,transparent 60%),#03241a; }
.theme-showcase[data-preset="andalus"] .theme-showcase-orbit { border:0; border-radius:0; background:#d9b54a; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='none' stroke='%23000' stroke-width='3'%3E%3Cpolygon points='50,3 63.77,16.76 83.23,16.77 83.24,36.23 97,50 83.24,63.77 83.23,83.23 63.77,83.24 50,97 36.23,83.24 16.77,83.23 16.76,63.77 3,50 16.76,36.23 16.77,16.77 36.23,16.76'/%3E%3Ccircle cx='50' cy='50' r='22'/%3E%3Cpolygon points='56.12,35.22 58.66,41.34 64.78,43.88 62.25,50 64.78,56.12 58.66,58.66 56.12,64.78 50,62.25 43.88,64.78 41.34,58.66 35.22,56.12 37.75,50 35.22,43.88 41.34,41.34 43.88,35.22 50,37.75' fill='%23000'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='none' stroke='%23000' stroke-width='3'%3E%3Cpolygon points='50,3 63.77,16.76 83.23,16.77 83.24,36.23 97,50 83.24,63.77 83.23,83.23 63.77,83.24 50,97 36.23,83.24 16.77,83.23 16.76,63.77 3,50 16.76,36.23 16.77,16.77 36.23,16.76'/%3E%3Ccircle cx='50' cy='50' r='22'/%3E%3Cpolygon points='56.12,35.22 58.66,41.34 64.78,43.88 62.25,50 64.78,56.12 58.66,58.66 56.12,64.78 50,62.25 43.88,64.78 41.34,58.66 35.22,56.12 37.75,50 35.22,43.88 41.34,41.34 43.88,35.22 50,37.75' fill='%23000'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat; animation:an-turn 30s linear infinite; opacity:.9; }
.theme-showcase[data-preset="andalus"] .theme-showcase-pane { border-radius:90px 90px 14px 14px / 60px 60px 14px 14px; background:#073123; border:1px solid #d9b54a66; }
.theme-showcase[data-preset="andalus"] .theme-showcase-type { font-family:"Amiri",serif; font-weight:700; color:#f1d888; }
.theme-showcase[data-preset="andalus"] .theme-showcase-mini-button { background:linear-gradient(180deg,#139165,#07573b); border-radius:999px; }

/* ---------- Small screens + accessibility ---------- */
@media (max-width:700px) {
  html[data-theme="andalus"][data-mode][data-style] .station-card { padding:50px 22px 22px !important; border-radius:160px 160px 20px 20px / 90px 90px 20px 20px !important; }
  html[data-theme="andalus"][data-mode] .cal .day:not(.empty)::after { width:34px; height:34px; right:-10px; bottom:-10px; }
  html[data-theme="andalus"][data-mode] .cal .day.today .num { width:28px; height:28px; margin:-4px 0 0 -4px; }
}
@media (prefers-reduced-motion:reduce) {
  html[data-theme="andalus"] *, html[data-theme="andalus"] *::before, html[data-theme="andalus"] *::after { animation:none !important; }
  html[data-theme="andalus"] #an-rosettes svg { animation:none !important; }
}
