/* OKLogic · FSG Events skin (v82). Black and white brand, one amber accent, light by default, flat surfaces, no glow.
   Scoped to html.fsg, so every other instance keeps its own look. Loaded by the pages a promoter instance uses. */
html.fsg{--acc:#D99A00;--accInk:#1A1200;--ok:#1E9E5A;--surface2:#F6F5F2}
html.fsg.light{--bg:#F6F5F2;--card:#FFFFFF;--ink:#141414;--ghost:rgba(20,20,20,.6);--line:rgba(20,20,20,.1);--red:#D93025;--gold:#B07A00;--em:#141414!important}
html.fsg:not(.light){--bg:#0F0F0F;--card:#171717;--ink:#FFFFFF;--ghost:rgba(255,255,255,.62);--line:rgba(255,255,255,.1);--red:#FF6B6B;--gold:#FFB800;--acc:#FFB800;--ok:#5BE39A;--surface2:#1F1F1F;--em:#FFFFFF!important}
html.fsg,html.fsg body{background:var(--bg)!important}
html.fsg body{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;color:var(--ink)}
html.fsg h1,html.fsg h2,html.fsg h3{letter-spacing:-.02em}
html.fsg .num,html.fsg .n,html.fsg .v,html.fsg .d{font-variant-numeric:tabular-nums lining-nums}
html.fsg .top h1{font-weight:700;font-size:22px;color:var(--ink)}
html.fsg .wordmark{text-shadow:none}
html.fsg .live{animation:none;box-shadow:none}

/* surfaces */
html.fsg{--lift:0 1px 2px rgba(16,32,40,.05),0 6px 16px rgba(16,32,40,.06)}   /* v105: a soft, tight lift under the surfaces (no halo, no glow) */
html.fsg .card,html.fsg .pn,html.fsg .tw,html.fsg .st,html.fsg .tile,html.fsg .panel,html.fsg #modal,html.fsg #aipanel,html.fsg #evdr,html.fsg .sugg{background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--lift);backdrop-filter:none}
html.fsg .card{padding:18px 20px}
html.fsg .card h2{font-size:15px;font-weight:700}
html.fsg .tile.bad,html.fsg .tile.warn{background:var(--card)}

/* buttons, chips, inputs */
html.fsg button{background:var(--ink);color:var(--bg);border-radius:8px;font-weight:600;font-size:13px;padding:9px 14px}
html.fsg button.ghostb{background:transparent;border:1px solid var(--line);color:var(--ink)}
html.fsg button.redb{background:transparent;border:1px solid color-mix(in srgb,var(--red) 45%,transparent);color:var(--red)}
html.fsg .bt{text-decoration:none;border-radius:8px;padding:8px 14px;font-weight:600;font-size:13px;color:var(--ink);border:1px solid var(--line);background:var(--card)}
html.fsg .bt:hover{border-color:var(--ghost)}
html.fsg .bt.pri{background:var(--ink);border-color:var(--ink);color:var(--bg)!important}
html.fsg .bt.sm{padding:5px 10px;font-size:12px}
html.fsg .bt.dng{color:var(--red);border-color:color-mix(in srgb,var(--red) 40%,transparent);background:transparent}
html.fsg .chip{background:transparent;border:1px solid var(--line);color:var(--ghost);font-weight:600;font-size:11.5px;padding:3px 9px}
html.fsg .chip.on{background:var(--acc);border-color:var(--acc);color:var(--accInk)}
html.fsg .chip.g{background:var(--surface2);border-color:transparent;color:var(--ghost)}
html.fsg .chip.w{background:transparent;border-color:var(--acc);color:var(--gold)}
html.fsg .chip.b{background:color-mix(in srgb,var(--red) 10%,transparent);border-color:color-mix(in srgb,var(--red) 35%,transparent);color:var(--red)}
html.fsg .tag,html.fsg .tag.mgr{border-color:var(--line);color:var(--ghost)}html.fsg .tag.mgr{color:var(--ink);border-color:var(--ink)}
html.fsg input,html.fsg textarea,html.fsg select,html.fsg .ff input,html.fsg .ff select,html.fsg .ff textarea,html.fsg table.tb input,html.fsg table.tb select,html.fsg .rv textarea{background:var(--card);border:1px solid var(--line);color:var(--ink);border-radius:8px;font-family:inherit}
html.fsg input:focus,html.fsg textarea:focus,html.fsg select:focus{outline:2px solid color-mix(in srgb,var(--ink) 25%,transparent);outline-offset:0;border-color:var(--ghost)}
html.fsg .langsw{border-color:var(--line);border-radius:7px}html.fsg .langsw b{color:var(--ghost)}html.fsg .langsw b.on{background:var(--ink);color:var(--bg)}
html.fsg .modesw b[data-m=blue]{display:none}
html.fsg .stoast{background:var(--ink);color:var(--bg)!important;border-radius:8px;font-weight:600}

/* sidebar and phone bar */
html.fsg #sidebar{background:var(--card);border-right:1px solid var(--line);box-shadow:none}
html.fsg #sidebar .sblogo{padding:4px 10px 18px;border-bottom:0;margin-bottom:6px}
html.fsg #sidebar .sblogo img{height:38px}
html.fsg #sidebar a.sbi{font-weight:500;color:var(--ghost);border-radius:8px;padding:8px 10px}
html.fsg #sidebar a.sbi:hover{background:var(--surface2);color:var(--ink)}
html.fsg #sidebar a.sbi.on{background:var(--surface2);color:var(--ink);font-weight:600}
html.fsg #sidebar .sbfoot{border-top:1px solid var(--line)}
html.fsg #sidebar .sbinst{color:var(--ghost)}
html.fsg #sidebar .sbpow{color:var(--ghost)}
html.fsg #sbBtn{background:var(--card);border-color:var(--line);box-shadow:none;border-radius:8px}
html.fsg #okTab{background:var(--card)!important;border-top:1px solid var(--line);box-shadow:none}
html.fsg #okTab a{color:var(--ghost);font-weight:500}html.fsg #okTab a.on{color:var(--ink);font-weight:600}
html.fsg #okTab .oslot{background:var(--ink)!important;box-shadow:0 0 0 5px var(--card)!important}
html.fsg #sbShade.open{background:rgba(0,0,0,.35)}

/* Marshal, v97: a sphere with a heartbeat (two quick beats, then a rest). The glow flashes WITH the beat instead of breathing on its own,
   and one band of light sweeps round the rim (an aurora), so it is nothing like the stock breathing orb. No inner swirl, no expanding waves. */
@keyframes okbeat{0%,36%,100%{transform:scale(1)}9%{transform:scale(1.12)}18%{transform:scale(1)}27%{transform:scale(1.06)}}
@keyframes okglow{0%,36%,100%{opacity:.38;transform:scale(1)}9%{opacity:1;transform:scale(1.22)}18%{opacity:.45;transform:scale(1.04)}27%{opacity:.8;transform:scale(1.12)}}
@keyframes oksweep{to{transform:rotate(360deg)}}
html.fsg #aiorb .core{background:radial-gradient(circle at 35% 30%,#fff 0%,color-mix(in srgb,var(--ink) 55%,#fff) 10%,var(--ink) 48%,var(--ink) 100%);box-shadow:inset -5px -7px 12px rgba(0,0,0,.35);animation:okbeat 2.8s ease-in-out infinite;transform-origin:50% 50%}
@media (prefers-reduced-motion:reduce){html.fsg #aiorb .core,html.fsg .orb .core{animation:none}}
html.fsg:not(.light) #aiorb .core{background:radial-gradient(circle at 35% 30%,#fff 0%,#fff 12%,#d9d9d9 50%,#8a8a8a 100%);box-shadow:inset -5px -7px 12px rgba(0,0,0,.25)}
html.fsg #aiorb .ring{border-color:var(--line);animation:none}html.fsg #aiorb .swirl{display:none}
html.fsg #aiorb .ring.r3{display:block;inset:-9px;border:0;opacity:.38;background:radial-gradient(circle,var(--em) 0%,color-mix(in srgb,var(--em) 55%,transparent) 46%,transparent 72%);filter:blur(6px);animation:okglow 2.8s ease-in-out infinite;transform-origin:50% 50%}
html.fsg #aiorb .ring.r2{display:block;inset:-4px;border:0;opacity:1;background:conic-gradient(from 0deg,transparent 0 52%,color-mix(in srgb,var(--em) 55%,#fff) 70%,#fff 78%,var(--em) 85%,transparent 96%);-webkit-mask:radial-gradient(circle,transparent 57%,#000 63%,#000 100%);mask:radial-gradient(circle,transparent 57%,#000 63%,#000 100%);filter:blur(1.2px);animation:oksweep 5.6s linear infinite}
@media (prefers-reduced-motion:reduce){html.fsg #aiorb .ring.r2,html.fsg #aiorb .ring.r3,html.fsg .orb .ring.r2,html.fsg .orb .ring.r3{animation:none}}
html.fsg #aiorb.thinking .ring:not(.r2):not(.r3){border-color:var(--acc);animation:oring 1.2s linear infinite;border-style:dashed}
html.fsg #aiorb .olabel{color:var(--ghost)}
html.fsg #aipanel{border-radius:14px;box-shadow:0 20px 50px rgba(0,0,0,.18)}
html.fsg #aipanel .chipq{border-color:var(--line);color:var(--ink);border-radius:8px}
html.fsg #aipanel .brief{background:var(--surface2);border-color:var(--line)}html.fsg #aipanel .brief .bh{color:var(--ink)}
html.fsg #aipanel .act{background:var(--surface2);border-color:var(--line)}html.fsg #aipanel .act .go{background:var(--ink);color:var(--bg)}html.fsg #aipanel .act .no{color:var(--ink);border-color:var(--line)}

/* tables and lists */
html.fsg table.tb th{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ghost);font-weight:600;padding:10px 12px}
html.fsg table.tb td{padding:9px 12px}
html.fsg table.tb tr.rw:hover td{background:var(--surface2)}
html.fsg table.tb tr.tot td{border-top:1px solid var(--line2,var(--line))}
html.fsg .st{padding:12px 14px}html.fsg .st .n{font-weight:700;font-size:21px}html.fsg .st.good .n{color:var(--ok)}html.fsg .st.warn .n{color:var(--gold)}
html.fsg .kv{font-size:13.5px}
html.fsg .bar{background:color-mix(in srgb,var(--ink) 8%,transparent)}html.fsg .bar i{background:var(--ink)}html.fsg .bar i.over{background:var(--red)}
html.fsg .ring .rf{stroke:var(--ink)}html.fsg .ring .rb{stroke:color-mix(in srgb,var(--ink) 8%,transparent)}
html.fsg .pace .sl{stroke:var(--ink);stroke-width:2.2}html.fsg .pace .sp{fill:var(--acc)}html.fsg .pace .tl{stroke:var(--ghost);stroke-opacity:.5}html.fsg .pace .td{stroke:var(--acc)}html.fsg .pace .tdl{fill:var(--gold)}
html.fsg .tabs{border-bottom:0;gap:4px;margin-top:14px}
html.fsg .tabs button{background:transparent;border:1px solid transparent;border-radius:8px;padding:7px 12px;color:var(--ghost);font-weight:500}
html.fsg .tabs button.on{background:var(--card);border-color:var(--line);color:var(--ink);font-weight:600}
html.fsg .tabs button .n{opacity:.8}
html.fsg .task .t input:focus{border-bottom-color:var(--ink)}
html.fsg .task .due.late{color:var(--red)}
html.fsg .stars b.on{color:var(--acc)}
html.fsg .rdone{background:var(--surface2);border-color:var(--line)}
html.fsg .rcpt a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line)}
html.fsg .sitepage{border-color:var(--line);color:var(--ink)}
html.fsg .ok{color:var(--ok)}html.fsg .warn{color:var(--gold)}html.fsg .bad{color:var(--red)}
html.fsg #evdr{box-shadow:-10px 0 40px rgba(0,0,0,.12);border-radius:0}
html.fsg #evdr h2{font-size:17px;font-weight:700}
html.fsg #evback{background:rgba(0,0,0,.35)}
html.fsg .ff label{color:var(--ghost);font-size:12.5px}
html.fsg .sver{color:var(--ghost);opacity:.7}
html.fsg .ev-meta{color:var(--ghost)}
html.fsg .ehead h2{font-weight:700;font-size:24px}
html.fsg .tbar .hint{color:var(--ghost)}
html.fsg .pk{color:var(--ink)}
html.fsg .cat .bar i{background:var(--ink)}
@media(max-width:700px){html.fsg .top h1{font-size:19px!important}}

/* the Marshal page */
html.fsg .orb{width:150px;height:150px;margin:10px 0 4px}
html.fsg .orb .core{inset:22px;background:radial-gradient(circle at 35% 30%,#fff 0%,color-mix(in srgb,var(--ink) 55%,#fff) 10%,var(--ink) 48%,var(--ink) 100%);box-shadow:inset -12px -16px 28px rgba(0,0,0,.35);animation:okbeat 2.8s ease-in-out infinite;transform-origin:50% 50%}
html.fsg:not(.light) .orb .core{background:radial-gradient(circle at 35% 30%,#fff 0%,#fff 12%,#d9d9d9 50%,#8a8a8a 100%);box-shadow:inset -12px -16px 28px rgba(0,0,0,.25)}
html.fsg .orb .ring{border-color:var(--line);animation:none}html.fsg .orb .swirl,html.fsg .orb .lat{display:none}
html.fsg .orb .ring.r3{display:block;inset:-20px;border:0;opacity:.38;background:radial-gradient(circle,var(--em) 0%,color-mix(in srgb,var(--em) 55%,transparent) 46%,transparent 72%);filter:blur(14px);animation:okglow 2.8s ease-in-out infinite;transform-origin:50% 50%}
html.fsg .orb .ring.r2{display:block;inset:-8px;border:0;opacity:1;background:conic-gradient(from 0deg,transparent 0 52%,color-mix(in srgb,var(--em) 55%,#fff) 70%,#fff 78%,var(--em) 85%,transparent 96%);-webkit-mask:radial-gradient(circle,transparent 60%,#000 65%,#000 100%);mask:radial-gradient(circle,transparent 60%,#000 65%,#000 100%);filter:blur(2px);animation:oksweep 5.6s linear infinite}
html.fsg .orb.thinking .ring:not(.r2):not(.r3){border-color:var(--acc);border-style:dashed;animation:ring 1.2s linear infinite}
html.fsg .asktitle{font-weight:700}
html.fsg .chipq{border-color:var(--line);color:var(--ink);border-radius:8px;background:var(--card)}html.fsg .chipq:hover{background:var(--surface2)}
html.fsg .askbox input{border-radius:10px}html.fsg .askbox button{border-radius:10px}
html.fsg .bubble{box-shadow:none;border-radius:12px;font-size:14.5px}html.fsg .bubble.brief{background:var(--surface2)}
html.fsg .ver{color:var(--ghost);opacity:.6}

/* the Futureself Group side (v87): the projects pages take the group's teal; the shows stay black and white */
html.fsg.fsgp{--emInk:#052A2A;--acc:#27D2D1;--accInk:#052A2A}
html.fsg.fsgp.light{--em:#27D2D1!important}
html.fsg.fsgp:not(.light){--em:#27D2D1!important}
html.fsg.fsgp button,html.fsg.fsgp .bt.pri{background:var(--em);color:var(--emInk)!important;border-color:var(--em)}
html.fsg.fsgp button.ghostb{background:transparent;color:var(--ink)}
html.fsg.fsgp .langsw b.on,html.fsg.fsgp .modesw b.on{background:var(--em);color:var(--emInk)}
html.fsg.fsgp #sidebar a.sbi.on{background:color-mix(in srgb,var(--em) 14%,transparent);color:var(--ink)}
html.fsg.fsgp #okTab .oslot{background:var(--em)!important}html.fsg.fsgp #okTab a.on{color:#15A3A2}
html.fsg.fsgp #aiorb .core{background:radial-gradient(circle at 35% 30%,#fff 0%,#9eeeed 12%,var(--em) 48%,#15A3A2 100%);box-shadow:inset -5px -7px 12px rgba(0,0,0,.2)}
html.fsg.fsgp .stoast{background:var(--em);color:var(--emInk)!important}
html.fsg.fsgp .top h1{color:var(--ink)}
html.fsg.fsgp #sidebar .sblogo img{height:96px}   /* v91: nearly twice the v89 size */
html.fsg.fsgp .tabs button{background:transparent;border-color:transparent;color:var(--ghost)!important}
html.fsg.fsgp .tabs button.on{background:var(--card);border-color:var(--em);color:var(--ink)!important}
html.fsg.fsgp .bt:not(.pri){background:var(--card);color:var(--ink)!important;border-color:var(--line)}html.fsg.fsgp .bt.dng{color:var(--red)!important}
html.fsg.fsgp .task .x,html.fsg.fsgp .lines button,html.fsg.fsgp .cty .x,html.fsg.fsgp .pdel,html.fsg.fsgp #evdr .x,html.fsg.fsgp .hd .back{background:transparent!important;color:var(--ghost)!important;border-color:transparent}
html.fsg.fsgp .chips2 span{color:var(--ghost)}html.fsg.fsgp .chips2 span.on{color:var(--ink)}
html.fsg.fsgp .pbar .chips2{width:auto}
html.fsg.fsgp .undobar{background:var(--ink);color:var(--bg)}html.fsg.fsgp .undobar button{background:var(--em);color:var(--emInk)!important}
html.fsg.fsgp .top .wordmark{overflow:visible;width:auto;max-width:none;flex:none}html.fsg.fsgp .top .wordmark img{height:48px!important;width:auto!important;max-width:none!important;object-fit:contain}

/* v90: the Futureself Group sidebar in the group teal (the community instance only) */
html.fsg.fsgp #sidebar{background:#27D2D1;border-right:0;box-shadow:none}
html.fsg.fsgp #sidebar .sblogo{border-bottom:0}html.fsg.fsgp #sidebar .sbco{color:#052A2A}
html.fsg.fsgp #sidebar a.sbi{color:#052A2A;opacity:.8;font-weight:600}
html.fsg.fsgp #sidebar a.sbi:hover{background:rgba(255,255,255,.4);color:#052A2A;opacity:1}
html.fsg.fsgp #sidebar a.sbi.on{background:#fff;color:#052A2A;opacity:1;box-shadow:0 2px 10px rgba(5,42,42,.14)}
html.fsg.fsgp #sidebar .sbfoot{border-top:1px solid rgba(5,42,42,.2)}
html.fsg.fsgp #sidebar .sbinst,html.fsg.fsgp #sidebar .sbset,html.fsg.fsgp #sidebar .sbpow,html.fsg.fsgp #sidebar .accsw .mut{color:#052A2A}
html.fsg.fsgp #sidebar .sbpow b{color:#052A2A!important}
html.fsg.fsgp #sidebar .langsw,html.fsg.fsgp #sidebar .modesw{border-color:rgba(5,42,42,.3);background:rgba(255,255,255,.4)}
html.fsg.fsgp #sidebar .langsw b,html.fsg.fsgp #sidebar .modesw b{color:#052A2A}
html.fsg.fsgp #sidebar .langsw b.on,html.fsg.fsgp #sidebar .modesw b.on{background:#052A2A;color:#27D2D1}
html.fsg.fsgp #sidebar .sbi.locked{opacity:.45}
/* v91: on the group instance the big Kolega orb is teal like the small one */
html.fsg.fsgp .orb .core{background:radial-gradient(circle at 35% 30%,#fff 0%,#9eeeed 12%,var(--em) 48%,#15A3A2 100%);box-shadow:inset -12px -16px 28px rgba(0,0,0,.2)}
html.fsg.fsgp:not(.light) .orb .core{background:radial-gradient(circle at 35% 30%,#fff 0%,#9eeeed 12%,var(--em) 48%,#15A3A2 100%)}
html.fsg.fsgp .orb .ring{border-color:color-mix(in srgb,var(--em) 45%,transparent)}

/* v106: the opening. The group mark assembles from its pieces (the top bar from the right, the curve and middle bar from the left, the base from below, the G last, growing into place),
   the wordmark rises under it, the whole holds a moment, then lifts away and the page is there. The pieces are cut from fsg-group.png
   (635×512 shown at half size), so no new asset. Every open of the app, once per tab on the admin pages. */
#oksplash{display:none;position:fixed;inset:0;z-index:1000;background:var(--bg);align-items:center;justify-content:center}
html.fsgsplash #oksplash{display:flex}
#oksplash .lg{display:flex;flex-direction:column;align-items:center;gap:22px;transform-origin:50% 50%}
#oksplash .mk{position:relative;width:151px;height:202px}
#oksplash .mk i,#oksplash .wm{display:block;background:url(/fsg-group.png) no-repeat;background-size:318px 256px;opacity:0;animation:okin3 .55s cubic-bezier(.2,.8,.2,1) forwards}
#oksplash .mk i{position:absolute}
#oksplash .mk i.p1{left:0;top:0;width:151px;height:50px;background-position:-87px 0;animation-name:okin1;animation-delay:.06s}
#oksplash .mk i.p2{left:0;top:55px;width:54px;height:43px;background-position:-87px -55px;animation-name:okin2;animation-delay:.2s}
#oksplash .mk i.p2b{left:54px;top:55px;width:97px;height:73px;background-position:-141px -55px;animation-name:okin2;animation-delay:.2s}
#oksplash .mk i.p3{left:0;top:98px;width:54px;height:55px;background-position:-87px -98px;animation-name:okin4;animation-delay:.5s;transform-origin:50% 50%}
#oksplash .mk i.p4{left:0;top:155px;width:54px;height:47px;background-position:-87px -155px;animation-name:okin3;animation-delay:.34s}
#oksplash .lg .wm{width:318px;height:37px;background-position:0 -219px;animation-delay:.66s}
@keyframes okin1{from{opacity:0;transform:translateX(38px)}to{opacity:1;transform:none}}
@keyframes okin2{from{opacity:0;transform:translateX(-38px)}to{opacity:1;transform:none}}
@keyframes okin3{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes okin4{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:none}}
#oksplash.out{transition:opacity .42s ease;opacity:0;pointer-events:none}
#oksplash.out .lg{transition:transform .42s ease;transform:scale(.93)}
@media (prefers-reduced-motion: reduce){#oksplash .mk i,#oksplash .wm{animation:none;opacity:1}#oksplash.out .lg{transform:none}}

/* v109: the hover layer (board-ui CSS) must win over the resting rules above that carry !important; the theme's own hover accent is the brand teal */
html.fsg{--hov:#15A3A2}
@media (hover:hover) and (pointer:fine){
html.fsg.fsgp .task .x:hover,html.fsg.fsgp .lines button:hover,html.fsg.fsgp .cty .x:hover,html.fsg.fsgp .pdel:hover,html.fsg.fsgp #evdr .x:hover,html.fsg.fsgp .hd .back:hover{color:var(--ink)!important}
html.fsg.fsgp .tabs button:not(.on):hover{color:var(--ink)!important}
}