/* nci/hub-template: hub-skin.css, the shared skin every module hub loads LAST (after its own styles).
   Source of truth for the look (Victor, 3 Nov 2026: "a single unified template ... only content will change").
   Values copied from bdaib-hub computed styles (kluxy theme) plus the thin-film rim and glint; needs /img/film.svg
   and kit/hub-circuit.js. Edit here, then sync into each hub (MIGRATION.md stage 1). */
/* BDAIB skin port (3 Nov 2026, Victor: "apply the BDAIB Hub UI aesthetics ... content intact, just a better skin").
   Same finish as bdaib-hub: the act bar becomes a thin-film rim (img/film.svg, faint at rest, bright on hover or open)
   and one film glint crosses the card per hover after a 250 ms dwell. The act colour survives as a soft corner wash,
   so Acts I to III still read at a glance next to their pills. Static at rest; the glint moves by transform only. */
.wk{isolation:isolate}
.wk::after,.wk[data-act]::after{content:"";position:absolute;left:0;right:0;top:0;bottom:0;width:auto;border-radius:inherit;padding:1.5px;z-index:3;pointer-events:none;
  background:url(/img/film.svg) 0 0/260px 260px;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  opacity:.45;transition:opacity .35s var(--ease)}
.wk:hover::after,.wk[data-open="true"]::after{opacity:.95}
.wk__bar::after{content:"";position:absolute;pointer-events:none;z-index:3;top:-30%;bottom:-30%;left:0;width:30%;
  background:url(/img/film.svg) 0 0/520px 520px;
  -webkit-mask:linear-gradient(100deg,transparent 0%,#000 45%,#000 55%,transparent 100%);
  mask:linear-gradient(100deg,transparent 0%,#000 45%,#000 55%,transparent 100%);
  mix-blend-mode:screen;opacity:.3;transform:translateX(-130%) skewX(-14deg)}
.wk:hover .wk__bar::after{transform:translateX(420%) skewX(-14deg);transition:transform 1.15s cubic-bezier(.3,.7,.2,1) .25s}
[data-theme="bridge"] .wk::after,[data-theme="bridge"] .wk[data-act]::after{opacity:.5}
[data-theme="bridge"] .wk:hover::after,[data-theme="bridge"] .wk[data-open="true"]::after{opacity:.9}
[data-theme="bridge"] .wk__bar::after{mix-blend-mode:multiply;opacity:.16}
@media (prefers-reduced-motion:reduce){.wk__bar::after{display:none}}
/* EXACT BDAIB match (3 Nov 2026, Victor: "LOCHF must look EXACTLY the same as BDAIB"). Values copied from
   bdaib-hub.pages.dev computed styles at 1920 (kluxy theme): page background, glow layer, card surface, sheen,
   shadow, border, blur, tag pills, top bar and Moodle pill. Content untouched; act colours no longer tint cards. */
[data-theme="kluxy"] body{background:
  radial-gradient(ellipse at 82% 40%,#0a1a4a 0%,transparent 50%),
  radial-gradient(ellipse at 22% 90%,#06123a 0%,transparent 60%),
  linear-gradient(125deg,#000208 0%,#010616 48%,#030c2a 100%) fixed}
[data-theme="kluxy"] body::before{opacity:.45;background:
  radial-gradient(760px 520px at 0% 0%,rgba(47,140,255,.30),transparent 68%),
  radial-gradient(720px 500px at 30% -6%,rgba(79,240,255,.16),transparent 68%),
  radial-gradient(820px 600px at 52% 108%,rgba(31,79,220,.34),transparent 68%),
  radial-gradient(740px 540px at 90% -4%,rgba(111,155,255,.24),transparent 66%),
  radial-gradient(900px 660px at 104% 104%,rgba(20,56,153,.40),transparent 68%)}
[data-theme="kluxy"] .wk,[data-theme="kluxy"] .wk[data-act]{background-color:rgba(100,148,255,.12);
  background-image:linear-gradient(rgba(255,255,255,.055),rgba(255,255,255,.01) 60%);
  border-color:rgba(160,200,255,.26);
  box-shadow:0 1px 2px 0 rgba(0,4,24,.3),0 10px 22px -10px rgba(0,4,24,.6),0 30px 64px -22px rgba(0,4,24,.8),inset 0 1px 0 0 rgba(255,255,255,.09),inset 0 0 24px 0 rgba(120,170,255,.035);
  backdrop-filter:blur(30px) saturate(1.5);-webkit-backdrop-filter:blur(30px) saturate(1.5)}
[data-theme="kluxy"] .wk:hover{background-color:rgba(120,165,255,.18)}
[data-theme="kluxy"] .wk__tags span,[data-theme="kluxy"] .wk__tags .actpill{background:transparent!important;color:rgb(127,155,200)!important;
  border:1px solid rgba(150,190,255,.2)!important;font:600 9.5px/9.5px ui-monospace,SFMono-Regular,"JetBrains Mono",Menlo,monospace!important;
  letter-spacing:.76px!important;padding:4px 8px!important;border-radius:6px!important}
[data-theme="kluxy"] .wk__tags .actpill i{background:rgb(127,155,200)!important;box-shadow:none!important}
html[data-theme="kluxy"]:not([data-auth="out"]) .topbar{background-color:rgba(1,5,20,.78)}
[data-theme="kluxy"] .moodlelink{background:rgba(74,143,255,.1)!important;border-color:rgba(74,143,255,.5)!important;color:#e3ecff!important}
[data-theme="kluxy"] .acthead b{color:var(--ink-4)}
/* Background, byte-identical to bdaib-hub (3 Nov 2026, Victor: "the background is not the same (not blurred equally)").
   Copied verbatim from bdaib-hub/kit/hub-kit.css (.circuitbg block) and bdaib-hub/index.html (kluxy overrides):
   the animated circuit canvas blurred 4px at .38, and the static circuit layer at .6 blurred 1.8px. */
.circuitbg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.circuitbg canvas{position:absolute;inset:0;width:100%;height:100%;filter:blur(4px)}
[data-theme="kluxy"] .circuitbg{opacity:.62}
[data-theme="bridge"] .circuitbg{opacity:.9}
@media (prefers-reduced-motion:reduce){.circuitbg #hub-circuit{display:none}}
.circuitbg::after{content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 46% 78% at 50% 56%,rgba(2,8,30,.56),rgba(2,8,30,.22) 58%,transparent 84%)}
[data-theme="bridge"] .circuitbg::after{
  background:radial-gradient(ellipse 46% 78% at 50% 56%,rgba(247,249,253,.62),rgba(247,249,253,.24) 58%,transparent 84%)}
html[data-theme="kluxy"] body::after{opacity:.6;filter:blur(1.8px)}
[data-theme="kluxy"] .circuitbg{opacity:.38}
/* bdaib-hub sets the card tint through the variable (the kit's finished-week rule re-applies var(--surface)),
   and has its own finished-week border; both copied verbatim from bdaib-hub/index.html. */
[data-theme="kluxy"] .wk{--surface:rgba(100,148,255,.12)}
html[data-theme="kluxy"] .wk[data-done="true"]:not(:hover){border-color:rgba(160,200,255,.26)}

/* Royal background (3 Nov 2026, Victor: "a tiny bit of texture and flair while keeping the background almost as dark
   as is, but moving in the direction of royal dark blue instead of going towards black"). From the BDAIB deck cover:
   a deep royal base, soft blurred violet light, faint diagonal beams and a whisper of grain. All static layers. */
[data-theme="kluxy"] body{background:
  radial-gradient(ellipse at 82% 40%,#0d2266 0%,transparent 52%),
  radial-gradient(ellipse at 22% 90%,#09184c 0%,transparent 60%),
  linear-gradient(125deg,#020824 0%,#040e3a 48%,#08174c 100%) fixed}
[data-theme="kluxy"] body::before{opacity:.48;background:
  radial-gradient(760px 520px at 0% 0%,rgba(47,140,255,.30),transparent 68%),
  radial-gradient(620px 480px at 24% 34%,rgba(124,86,230,.24),transparent 70%),
  radial-gradient(720px 500px at 30% -6%,rgba(79,240,255,.14),transparent 68%),
  radial-gradient(680px 520px at 78% 70%,rgba(150,92,210,.19),transparent 70%),
  radial-gradient(820px 600px at 52% 108%,rgba(31,79,220,.34),transparent 68%),
  radial-gradient(740px 540px at 90% -4%,rgba(111,155,255,.24),transparent 66%),
  radial-gradient(900px 660px at 104% 104%,rgba(20,56,153,.40),transparent 68%)}
html[data-theme="kluxy"]::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    linear-gradient(118deg,transparent 28%,rgba(120,165,255,.055) 36%,transparent 45%),
    linear-gradient(118deg,transparent 56%,rgba(150,120,255,.045) 63%,transparent 71%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .55 0'/></filter><rect width='180' height='180' filter='url(%23n)' opacity='.06'/></svg>")}

/* "This week" spotlight (kit/hub-now.js): the current week's card, under the hero, in gold. 3 Nov 2026. */
.nowspot{position:relative;z-index:2;margin:30px auto 6px;width:100%;animation:nowRise .6s cubic-bezier(.2,.8,.2,1.08) both}
.nowspot__k{display:flex;align-items:center;gap:12px;margin:0 4px 12px}
.nowspot__pill{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 12px;border-radius:999px;
  background:#E3C878;color:#1c1300;font:700 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em;text-transform:uppercase;
  box-shadow:0 0 22px rgba(227,200,120,.45)}
.nowspot__pill i{width:6px;height:6px;border-radius:50%;background:#1c1300;animation:nowBeat 1.8s ease-in-out infinite}
.nowspot__lbl{font:700 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.22em;text-transform:uppercase;color:#E3C878;
  text-shadow:0 0 24px rgba(227,200,120,.45)}
.nowspot .wk.nowspot__card{cursor:pointer;
  box-shadow:0 0 0 1px rgba(227,200,120,.55),0 0 34px -6px rgba(227,200,120,.30),0 30px 64px -22px rgba(0,4,24,.8)!important}
.nowspot .wk.nowspot__card::after{opacity:.8}
.nowspot .wk.nowspot__card .wk__num{box-shadow:0 0 0 2px rgba(227,200,120,.8),0 0 22px rgba(227,200,120,.4)}
.nowspot .wk.nowspot__card:hover{transform:translateY(-2px)}
.wk.nowpulse{animation:nowPulse 1.6s ease-out}
@keyframes nowRise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes nowBeat{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes nowPulse{0%{box-shadow:0 0 0 0 rgba(227,200,120,.75)}40%{box-shadow:0 0 0 10px rgba(227,200,120,.18)}100%{box-shadow:0 0 0 0 rgba(227,200,120,0)}}
[data-theme="bridge"] .nowspot__pill{background:#a9761f;color:#fff}[data-theme="bridge"] .nowspot__pill i{background:#fff}
[data-theme="bridge"] .nowspot__lbl{color:#a9761f;text-shadow:none}
[data-theme="bridge"] .nowspot .wk.nowspot__card{box-shadow:0 0 0 1px rgba(169,118,31,.55),0 14px 34px -14px rgba(10,16,69,.3)!important}
@media (prefers-reduced-motion:reduce){.nowspot,.nowspot__pill i,.wk.nowpulse{animation:none}}

/* Minimal week cards (3 Nov 2026, Victor: "remove as much verbosity as possible ... text down to absolute minimum").
   Same as bdaib-hub, which shows none of these: no boilerplate frontier box, no hours/capabilities rows, no
   outcome-leaf list, and no pane whose text is empty. Content stays in each module's data. */
.wk .frontier,.wk .metarow,.wk .leaves{display:none}
.wk .pane:has(> p:empty){display:none}
.wk .panes:not(:has(.pane > p:not(:empty))){display:none}
