/* Hidden on desktop — this is a phone-only convenience bar. */
.tc-mob-bottomnav{ display:none; }
@media (max-width:768px){
  .tc-mob-bottomnav{
    display:flex;
    position:fixed; left:0; right:0; bottom:0;
    z-index:600;               /* above page content, below modals (1000) & menu overlay (999) */
    gap:10px;
    padding:8px 14px calc(8px + env(safe-area-inset-bottom,0px));
    background:rgba(10,10,18,0.97);
    backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
    border-top:1px solid rgba(40,30,70,0.7);
    box-shadow:0 -6px 24px rgba(0,0,0,0.35);
    box-sizing:border-box;
  }
  /* Home page: no point showing Back/Dashboard there. */
  .tc-mob-bottomnav.tc-bn-hide{ display:none; }
  /* When the slide-in menu is open, get the bar out of the way. */
  body.sidebar-open .tc-mob-bottomnav{ display:none; }
  .tc-bn-btn{
    flex:1; display:flex; align-items:center; justify-content:center; gap:8px;
    height:46px; border:1px solid #252539; border-radius:12px;
    background:rgba(124,92,252,0.08); color:#e2e8f0;
    font-family:'Rubik',sans-serif; font-size:14px; font-weight:700;
    cursor:pointer; -webkit-tap-highlight-color:transparent;
    transition:transform .08s ease, opacity .15s ease;
  }
  .tc-bn-btn:active{ transform:scale(0.97); }
  .tc-bn-btn:disabled{ opacity:.4; pointer-events:none; }
  .tc-bn-home{ background:linear-gradient(135deg,#7c5cfc,#6d4aff); border-color:transparent; color:#fff; }
  /* Only reserve bottom space while the bar is actually showing (not on dashboard). */
  body:has(#tcMobBottomNav:not(.tc-bn-hide)) .main{
    padding-bottom:calc(74px + env(safe-area-inset-bottom,0px)) !important;
  }
}


/* ===== Announcement marquee banner (landing + dashboard) ===== */
.ann-banner-wrap{ display:none; }
.ann-banner-wrap.show{ display:block; animation:annPop .5s cubic-bezier(.16,1,.3,1) both; }
@keyframes annPop{ 0%{opacity:0;transform:translateY(-16px) scaleY(.5)} 55%{opacity:1;transform:translateY(3px) scaleY(1.06)} 100%{opacity:1;transform:translateY(0) scaleY(1)} }
.ann-banner{
  position:relative; display:flex; align-items:stretch; width:100%; overflow:hidden;
  background:linear-gradient(90deg,rgba(124,92,252,0.22),rgba(34,211,238,0.16),rgba(236,72,153,0.16),rgba(124,92,252,0.22));
  background-size:300% 100%; animation:annShimmer 10s linear infinite;
  border-top:1px solid rgba(124,92,252,0.45); border-bottom:1px solid rgba(124,92,252,0.45);
  box-shadow:0 6px 26px rgba(124,92,252,0.22), inset 0 0 26px rgba(124,92,252,0.10);
}
@keyframes annShimmer{ 0%{background-position:0% 0} 100%{background-position:300% 0} }
/* diagonal light sweep that travels across the whole banner */
.ann-banner::before{
  content:""; position:absolute; top:0; bottom:0; left:0; width:38%; pointer-events:none; z-index:3;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,0.16),transparent);
  filter:blur(2px); animation:annSweep 4.5s ease-in-out infinite;
}
@keyframes annSweep{ 0%{transform:translateX(-120%)} 55%,100%{transform:translateX(380%)} }
/* sticky attention badge on the left (does NOT scroll) */
.ann-badge{
  position:relative; z-index:4; flex-shrink:0; display:flex; align-items:center; gap:7px;
  padding:0 14px 0 16px; font-family:'JetBrains Mono',monospace; font-weight:800; font-size:11px;
  letter-spacing:.18em; color:#fff; text-transform:uppercase;
  background:linear-gradient(135deg,#7c5cfc,#22d3ee); clip-path:polygon(0 0,100% 0,calc(100% - 12px) 100%,0 100%);
  box-shadow:0 0 18px rgba(124,92,252,0.6); animation:annBadgeGlow 2s ease-in-out infinite;
}
@keyframes annBadgeGlow{ 0%,100%{box-shadow:0 0 14px rgba(124,92,252,0.5)} 50%{box-shadow:0 0 24px rgba(34,211,238,0.8)} }
.ann-badge .ann-badge-ic{ font-size:14px; display:inline-block; animation:annBell 2.2s ease-in-out infinite; transform-origin:50% 10%; }
@keyframes annBell{ 0%,84%,100%{transform:rotate(0)} 88%{transform:rotate(16deg)} 92%{transform:rotate(-13deg)} 96%{transform:rotate(8deg)} }
.ann-banner .ann-vp{ position:relative; z-index:2; flex:1; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent); mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent); }
.ann-track{ display:inline-flex; align-items:center; white-space:nowrap; will-change:transform; animation:annScroll 30s linear infinite; padding:9px 0; }
.ann-banner:hover .ann-track{ animation-play-state:paused; }
@keyframes annScroll{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
.ann-group{ display:inline-flex; align-items:center; }
.ann-item{ display:inline-flex; align-items:center; gap:9px; padding:0 28px; font-size:13.5px; color:#efe9ff; letter-spacing:.01em; }
.ann-item .ann-ic{ font-size:14px; }
.ann-item b{ font-weight:800; text-shadow:0 0 12px currentColor; }
.ann-item .ann-msg{ color:#cfc9ee; }
.ann-item .ann-dot{ width:8px; height:8px; border-radius:50%; box-shadow:0 0 10px currentColor,0 0 4px currentColor; flex-shrink:0; animation:annPulse 1.6s ease-in-out infinite; }
@keyframes annPulse{ 0%,100%{transform:scale(.7);opacity:.65} 50%{transform:scale(1.15);opacity:1} }
.ann-sep{ color:rgba(167,139,250,0.7); font-size:10px; padding:0 4px; animation:annSpin 6s linear infinite; display:inline-block; }
@keyframes annSpin{ to{transform:rotate(360deg)} }
.ann-close{ position:relative; z-index:4; flex-shrink:0; align-self:center; background:rgba(0,0,0,0.28); border:1px solid rgba(255,255,255,0.16); color:#cfc9ee; width:24px; height:24px; line-height:1; border-radius:50%; cursor:pointer; font-size:15px; margin:0 12px; transition:all .15s; display:flex; align-items:center; justify-content:center; }
.ann-close:hover{ background:rgba(239,68,68,0.9); color:#fff; border-color:transparent; transform:scale(1.1) rotate(90deg); }
@media(max-width:768px){ .ann-item{ font-size:12.5px; padding:0 20px; } .ann-badge .ann-badge-tx{ display:none; } .ann-badge{ padding:0 10px 0 12px; } }
@media(prefers-reduced-motion:reduce){ .ann-track{ animation-duration:60s; } .ann-banner-wrap.show,.ann-banner,.ann-banner::before,.ann-badge,.ann-badge-ic,.ann-dot,.ann-sep{ animation:none; } }

/* ===== Multi-dashboard workspace switcher (sidebar) ===== */
.ws-switcher{ margin:0 0 10px; padding:10px 12px; background:linear-gradient(180deg,rgba(124,92,252,.10),rgba(124,92,252,.04)); border:1px solid rgba(124,92,252,.28); border-radius:12px; box-shadow:0 1px 0 rgba(255,255,255,.05) inset; }
.ws-label{ font-size:10px; color:#b0a8d8; font-weight:700; text-transform:uppercase; letter-spacing:.12em; margin-bottom:7px; display:flex; align-items:center; gap:5px; }
.ws-row{ display:flex; align-items:center; gap:6px; }
.ws-select{ flex:1; min-width:0; background:#14141f; color:#efe9ff; border:1px solid rgba(124,92,252,.4); border-radius:8px; padding:7px 9px; font-size:13px; font-weight:600; outline:none; cursor:pointer; }
.ws-select:focus{ border-color:#7c5cfc; box-shadow:0 0 0 3px rgba(124,92,252,.2); }
.ws-btn{ flex-shrink:0; width:30px; height:32px; display:flex; align-items:center; justify-content:center; background:linear-gradient(180deg,#1d1d2d,#131320); color:#c9c4ec; border:1px solid rgba(255,255,255,.1); border-radius:8px; cursor:pointer; font-size:14px; line-height:1; transition:transform .12s ease, border-color .12s ease, background .12s ease; }
.ws-btn:hover{ border-color:rgba(124,92,252,.55); color:#fff; transform:translateY(-1px); }
.ws-btn.ws-del:hover{ background:rgba(239,68,68,.85); border-color:transparent; }
.ws-btn.ws-btn-locked{ color:#fcd34d; border-color:rgba(245,158,11,.45); background:linear-gradient(180deg,rgba(245,158,11,.16),rgba(245,158,11,.05)); }
.ws-btn.ws-btn-off{ opacity:.42; cursor:not-allowed; }
.ws-count{ margin-left:auto; font-size:9.5px; font-weight:800; letter-spacing:.06em; color:#9d95c8; background:rgba(124,92,252,.16); border:1px solid rgba(124,92,252,.32); padding:1px 7px; border-radius:6px; }
.ws-count.ws-count-full{ color:#fcd34d; background:rgba(245,158,11,.14); border-color:rgba(245,158,11,.38); }

/* ===== Dashboard PIN lock modal ===== */
.tcpin-overlay{ position:fixed; inset:0; z-index:100000; background:rgba(6,6,12,.82); backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px); display:flex; align-items:center; justify-content:center; padding:20px; animation:tcpinFade .16s ease; }
@keyframes tcpinFade{ from{opacity:0} to{opacity:1} }
.tcpin-card{ width:100%; max-width:352px; background:linear-gradient(180deg,#16162a,#0d0d18); border:1px solid rgba(124,92,252,.34); border-radius:20px; padding:26px 24px 20px; text-align:center; box-shadow:0 26px 70px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04) inset; animation:tcpinPop .2s cubic-bezier(.22,1,.36,1); }
@keyframes tcpinPop{ from{opacity:0;transform:translateY(14px) scale(.96)} to{opacity:1;transform:none} }
.tcpin-ic{ font-size:34px; line-height:1; margin-bottom:10px; filter:drop-shadow(0 4px 12px rgba(124,92,252,.45)); }
.tcpin-title{ font-size:18px; font-weight:900; color:#fff; letter-spacing:.01em; }
.tcpin-sub{ font-size:12.5px; color:#8f96b8; line-height:1.55; margin:7px 0 18px; }
.tcpin-boxes{ display:flex; gap:10px; justify-content:center; }
.tcpin-box{ width:52px; height:60px; text-align:center; font-size:26px; font-weight:900; color:#efe9ff; background:#0a0a14; border:1.5px solid rgba(124,92,252,.34); border-radius:13px; outline:none; caret-color:#7c5cfc; transition:border-color .14s, box-shadow .14s, transform .14s; font-family:'JetBrains Mono',monospace; }
.tcpin-box:focus{ border-color:#7c5cfc; box-shadow:0 0 0 4px rgba(124,92,252,.2); transform:translateY(-1px); }
.tcpin-err{ min-height:17px; font-size:12px; font-weight:700; color:#f87171; margin-top:11px; }
.tcpin-actions{ display:flex; gap:9px; margin-top:6px; }
.tcpin-btn{ flex:1; padding:11px 14px; border-radius:11px; font-size:13.5px; font-weight:800; cursor:pointer; font-family:inherit; border:1px solid transparent; transition:filter .14s, transform .14s; }
.tcpin-btn:hover{ filter:brightness(1.1); transform:translateY(-1px); }
.tcpin-cancel{ background:#15152400; color:#a9b0cc; border-color:rgba(255,255,255,.14); }
.tcpin-ok{ background:linear-gradient(135deg,#8b6bff,#7C5CFC); color:#fff; box-shadow:0 7px 20px rgba(124,92,252,.4); }
.tcpin-foot{ font-size:10.5px; color:#5f667f; margin-top:13px; font-style:italic; }
.tcpin-shake{ animation:tcpinShake .34s cubic-bezier(.36,.07,.19,.97); }
@keyframes tcpinShake{ 10%,90%{transform:translateX(-2px)} 20%,80%{transform:translateX(4px)} 30%,50%,70%{transform:translateX(-7px)} 40%,60%{transform:translateX(7px)} }
@media(max-width:420px){ .tcpin-box{ width:46px; height:54px; font-size:23px; } }