/* ════════════════════════════════
   GLOBAL STANDARDS - WCAG 2.1 Compliant
   Base: 16px (maintained on all devices for readability)
   Min touch: 44px, Max-width: 1280px
   Responsive: fit all mobile devices, no horizontal scroll
   Minimum font size: 14px (0.875rem) for body text, 12px (0.75rem) for labels only
   ════════════════════════════════ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{font-size:16px;-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:hidden}
img,video,iframe{max-width:100%;height:auto;vertical-align:middle}

/* ════════════════════════════════
   LIGHT THEME (default)
   ════════════════════════════════ */
:root, [data-theme="light"] {
  --bg:#f4f7f6;--bg2:#eef3f1;
  --sf:#ffffff;--sfh:#f8fbfa;--sfm:#f0f4f3;
  --bd:#d8e0dd;--bdl:#e8eeec;
  --t1:#1a2e2a;--t2:#3d5550;--t3:#6b8580;--t4:#97aba6;
  --pr:#0d7c6e;--prd:#095e53;--prl:#e0f5f0;--prlr:#f0faf8;
  --acc:#d97706;--accl:#fef3c7;
  --ok:#16a34a;--okl:#dcfce7;
  --inf:#2563eb;--infl:#dbeafe;
  --err:#dc2626;--errl:#fee2e2;
  --pur:#7c3aed;--purl:#ede9fe;
  --pk:#db2777;--pkl:#fce7f3;
  --nav-bg:rgba(255,255,255,.88);
  --hero-g1:#095e53;--hero-g2:#0d7c6e;--hero-g3:#14b8a6;
  --hero-glow:rgba(255,255,255,.08);
  --card-hover-bd:rgba(13,124,110,.12);
  --logo-border:var(--bdl);--logo-bg:#fff;
  --toggle-bg:var(--sfm);--toggle-icon-show-sun:none;--toggle-icon-show-moon:block;
  --brand-logo-filter:none;
  color-scheme: light;
}

/* ════════════════════════════════
   DARK THEME
   ════════════════════════════════ */
[data-theme="dark"] {
  --bg:#0f1419;--bg2:#151c23;
  --sf:#1a2230;--sfh:#1e2738;--sfm:#1e2738;
  --bd:#2a3545;--bdl:#232e3c;
  --t1:#e2e8f0;--t2:#b0bec5;--t3:#78909c;--t4:#546e7a;
  --pr:#2dd4bf;--prd:#14b8a6;--prl:rgba(45,212,191,.1);--prlr:rgba(45,212,191,.05);
  --acc:#fbbf24;--accl:rgba(251,191,36,.1);
  --ok:#4ade80;--okl:rgba(74,222,128,.1);
  --inf:#60a5fa;--infl:rgba(96,165,250,.1);
  --err:#f87171;--errl:rgba(248,113,113,.1);
  --pur:#a78bfa;--purl:rgba(167,139,250,.1);
  --pk:#f472b6;--pkl:rgba(244,114,182,.1);
  --nav-bg:rgba(15,20,25,.9);
  --hero-g1:#0f2f2b;--hero-g2:#134e47;--hero-g3:#115e59;
  --hero-glow:rgba(45,212,191,.06);
  --card-hover-bd:rgba(45,212,191,.15);
  --logo-border:#2a3545;--logo-bg:#1a2230;
  --toggle-bg:#1e2738;--toggle-icon-show-sun:block;--toggle-icon-show-moon:none;
  --brand-logo-filter:brightness(1.1);
  color-scheme: dark;
}

html{scroll-behavior:smooth}
body{
  font-family:'Outfit','Noto Sans Lao',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  font-size:1rem;
  line-height:1.6;
  background:var(--bg);
  color:var(--t1);
  min-height:100vh;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  transition:background .35s ease,color .35s ease;
  /* Ensure minimum readable font size */
  font-size:clamp(16px,1rem,1rem);
}

body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse 80% 50% at 5% 0%,rgba(13,124,110,.04) 0%,transparent 50%),radial-gradient(ellipse 60% 40% at 95% 100%,rgba(217,119,6,.03) 0%,transparent 50%)}
[data-theme="dark"] body::before{background:radial-gradient(ellipse 80% 50% at 5% 0%,rgba(45,212,191,.03) 0%,transparent 50%),radial-gradient(ellipse 60% 40% at 95% 100%,rgba(251,191,36,.02) 0%,transparent 50%)}

::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--bd);border-radius:3px}

/* Smooth transitions for theme switching */
.card,.nav,.ticker,.search,.nav-btn,.avatar-btn,.app,.brand-card,.qa,.status,.tip,.evt,.chip,.cal-d,.bday,.footer{
  transition:background .3s ease,border-color .3s ease,color .3s ease,box-shadow .3s ease;
}

/* ═══ Ticker ═══ */
:root{--ticker-height:2.5rem;--nav-height:68px;--header-height:calc(var(--ticker-height) + var(--nav-height));--menu-top:var(--header-height)}
.ticker{position:fixed;top:0;left:0;right:0;z-index:101;background:var(--pr);color:rgba(255,255,255,.95);padding:.5rem 2rem;font-size:.875rem;font-weight:500;overflow:hidden;display:flex;align-items:center;gap:.75rem;letter-spacing:.01em;padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right));min-height:var(--ticker-height)}
[data-theme="dark"] .ticker{background:linear-gradient(90deg,#134e47,#115e59)}
.header-spacer{height:var(--header-height);flex-shrink:0;pointer-events:none}
.ticker-dot{width:7px;height:7px;border-radius:50%;background:#5eead4;flex-shrink:0;animation:blink 2s ease infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}
.ticker-scroll{display:flex;align-items:center;gap:0;animation:scroll 35s linear infinite;white-space:nowrap}
.ticker-scroll .ticker-msg{padding:0 .5rem}
.ticker-scroll .ticker-sep{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.7);flex-shrink:0;margin:0 1.25rem}
@keyframes scroll{0%{transform:translateX(0)}100%{transform:translateX(-100%)}}

/* ═══ Nav ═══ */
/* Touch targets: 44px minimum for mobile accessibility */
.nav{position:fixed;top:var(--ticker-height);left:0;right:0;z-index:100;background:var(--nav-bg);backdrop-filter:blur(20px) saturate(1.5);-webkit-backdrop-filter:blur(20px) saturate(1.5);border-bottom:1px solid var(--bdl);height:var(--nav-height);padding:0 max(2.5rem,env(safe-area-inset-right)) 0 max(2.5rem,env(safe-area-inset-left));display:flex;align-items:center;justify-content:space-between;gap:1.5rem;overflow:visible!important;min-width:0;width:100%;max-width:100vw;box-sizing:border-box}
.nav-left{display:flex;align-items:center;gap:1.5rem;flex-shrink:1;min-width:0}
.nav-brand{display:flex;align-items:center;gap:1rem;text-decoration:none;color:inherit;transition:opacity .2s;flex-shrink:0;padding:.25rem 0;min-width:0}
.nav-brand:hover{opacity:.85}
.mobile-nav-toggle{display:none;width:44px;height:44px;min-width:44px;min-height:44px;border-radius:10px;border:1.5px solid var(--bdl);background:var(--sf);align-items:center;justify-content:center;color:var(--t3);cursor:pointer;transition:all .2s;flex-shrink:0;margin-right:.75rem;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.mobile-nav-toggle:hover{background:var(--prlr);color:var(--pr);border-color:var(--card-hover-bd)}
.mobile-nav-toggle .nav-icon-line{transition:all .3s ease}
.mobile-nav-toggle.active .nav-icon-line-1{transform:translateY(6px) rotate(45deg)}
.mobile-nav-toggle.active .nav-icon-line-2{opacity:0}
.mobile-nav-toggle.active .nav-icon-line-3{transform:translateY(-6px) rotate(-45deg)}
.nav-logo{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,var(--pr),var(--prd));display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:1.125rem;letter-spacing:-.5px;box-shadow:0 2px 8px rgba(13,124,110,.25);flex-shrink:0}
[data-theme="dark"] .nav-logo{box-shadow:0 2px 12px rgba(45,212,191,.2)}
.nav-title{font-family:'Outfit',system-ui,sans-serif;font-size:1.375rem;font-weight:700;color:var(--pr);letter-spacing:-.4px;line-height:1.2;margin:0;min-width:0}
.nav-title-last{white-space:nowrap}
.nav-subtitle{font-size:.8125rem;color:var(--t4);text-transform:uppercase;letter-spacing:1.2px;font-weight:500;line-height:1.3;margin:0;margin-top:.125rem}
.nav-links{display:flex;gap:.5rem;align-items:center;flex-shrink:0}
.nav-link{padding:.625rem 1.125rem;border-radius:10px;font-size:.9375rem;font-weight:500;color:var(--t2);cursor:pointer;transition:all .2s ease;text-decoration:none;border:none;background:none;min-height:44px;display:flex;align-items:center;justify-content:center;white-space:nowrap;font-family:inherit;letter-spacing:-.1px;flex-shrink:0;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.nav-link:hover{color:var(--pr);background:var(--prlr);transform:translateY(-1px)}
.nav-link.active{color:var(--pr);background:var(--prl);font-weight:600;box-shadow:0 2px 4px rgba(13,124,110,.1)}
.nav-center{flex:1;max-width:380px;margin:0 1.5rem;min-width:0;flex-shrink:1}
.search{width:100%;display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem .75rem 1.25rem;background:var(--sfm);border:1.5px solid var(--bdl);border-radius:12px;transition:all .2s;min-height:44px;min-width:140px}
.search:focus-within{background:var(--sf);border-color:var(--pr);box-shadow:0 0 0 3px rgba(13,124,110,.1)}
[data-theme="dark"] .search:focus-within{box-shadow:0 0 0 3px rgba(45,212,191,.1)}
.search svg{color:var(--t4);flex-shrink:0;width:16px;height:16px;margin:0}
.search input{flex:1;border:none;background:none;outline:none;font-family:inherit;font-size:.9375rem;color:var(--t1);font-weight:400;padding:0;margin:0;min-width:0}
.search input::placeholder{color:var(--t4);font-weight:400}
.nav-right{display:flex!important;align-items:center;gap:.625rem;flex-shrink:0!important;z-index:101;visibility:visible!important;opacity:1!important;min-width:auto;overflow:visible}
.avatar-btn{flex-shrink:0!important;min-width:44px}
.nav-btn{width:44px;height:44px;border-radius:10px;border:1.5px solid var(--bdl);background:var(--sf);display:flex;align-items:center;justify-content:center;color:var(--t3);cursor:pointer;transition:all .2s;position:relative;flex-shrink:0;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.nav-btn:hover{background:var(--prlr);color:var(--pr);border-color:var(--card-hover-bd)}
.nav-btn:active{transform:scale(.95)}
.badge-dot{position:absolute;top:8px;right:8px;width:8px;height:8px;border-radius:50%;background:var(--err);border:2px solid var(--sf)}
.avatar-btn{width:44px;height:44px;min-width:44px;min-height:44px;border-radius:10px;background:linear-gradient(135deg,var(--pr),#14b8a6);color:#fff;font-weight:700;font-size:.875rem;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;box-shadow:0 2px 6px rgba(13,124,110,.2);text-decoration:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}

/* ═══ Theme Toggle ═══ */
.theme-toggle{
  width:44px;height:44px;min-width:44px;min-height:44px;border-radius:10px;
  border:1.5px solid var(--bdl);background:var(--sf);
  display:flex;align-items:center;justify-content:center;
  color:var(--t3);cursor:pointer;transition:all .2s;
  position:relative;overflow:hidden;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.theme-toggle:hover{background:var(--prlr);color:var(--pr);border-color:var(--card-hover-bd)}
.theme-toggle .sun{display:var(--toggle-icon-show-sun)}
.theme-toggle .moon{display:var(--toggle-icon-show-moon)}
.theme-toggle svg{transition:transform .4s ease}
.theme-toggle:active svg{transform:rotate(30deg) scale(.85)}

/* ═══ Language Switcher ═══ */
.lang-switch{position:relative;display:flex!important;visibility:visible!important;opacity:1!important;z-index:102;flex-shrink:0;overflow:visible}
.lang-btn{
  display:flex!important;align-items:center;gap:.5rem;
  height:44px;min-height:44px;min-width:44px;padding:0 .875rem;border-radius:10px;
  border:1.5px solid var(--bdl);background:var(--sf);
  color:var(--t2);cursor:pointer;transition:all .2s;
  font-family:inherit;font-size:.875rem;font-weight:500;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
  visibility:visible!important;opacity:1!important;flex-shrink:0;overflow:visible;
}
.lang-btn:hover{background:var(--prlr);color:var(--pr);border-color:var(--card-hover-bd)}
.lang-btn svg{flex-shrink:0;width:17px;height:17px}
.lang-code{font-weight:600;letter-spacing:.3px;font-size:.8125rem}
.lang-menu{
  position:absolute;top:calc(100% + 8px);right:0;
  min-width:140px;background:var(--sf);border:1px solid var(--bdl);
  border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.12);
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:all .2s ease;z-index:200;overflow:hidden;
}
[data-theme="dark"] .lang-menu{box-shadow:0 8px 24px rgba(0,0,0,.4)}
.lang-menu.show{opacity:1;visibility:visible;transform:translateY(0)}
.lang-option{
  display:flex;align-items:center;gap:.625rem;
  padding:.75rem 1rem;color:var(--t2);text-decoration:none;
  transition:all .15s;font-size:.9rem;
}
.lang-option:hover{background:var(--prlr);color:var(--pr)}
.lang-option.active{background:var(--prl);color:var(--pr);font-weight:600}
.lang-flag{font-size:1.125rem;line-height:1}

.mobile-toggle{display:none;width:44px;height:44px;min-width:44px;min-height:44px;border-radius:10px;border:1.5px solid var(--bdl);background:var(--sf);align-items:center;justify-content:center;color:var(--t3);cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}

/* ═══ Main Container ═══ */
/* Standard: max-width 1280px for optimal reading, 2rem padding */
.main{position:relative;z-index:1;max-width:1280px;margin:0 auto;padding:2rem 2rem 3rem;width:100%;box-sizing:border-box}
/* Prevent horizontal scroll globally */
body,html{max-width:100vw;overflow-x:hidden}

/* ═══ Hero ═══ */
.hero{background:linear-gradient(135deg,var(--hero-g1) 0%,var(--hero-g2) 50%,var(--hero-g3) 100%);border-radius:16px;padding:2.5rem 2.5rem;margin-bottom:2rem;color:#fff;position:relative;overflow:hidden;box-shadow:0 8px 30px rgba(13,124,110,.12);width:100%;box-sizing:border-box}
[data-theme="dark"] .hero{box-shadow:0 8px 30px rgba(0,0,0,.3),0 0 0 1px rgba(45,212,191,.08)}
.hero::before{content:'';position:absolute;top:-30%;right:-5%;width:500px;height:500px;background:radial-gradient(circle,var(--hero-glow) 0%,transparent 60%);pointer-events:none}
.hero::after{content:'';position:absolute;bottom:-50%;left:20%;width:400px;height:400px;background:radial-gradient(circle,rgba(255,255,255,.04) 0%,transparent 60%);pointer-events:none}
.hero-top{font-size:.8125rem;letter-spacing:1.5px;text-transform:uppercase;opacity:.85;font-weight:500;margin-bottom:.5rem}
.hero-weather{text-transform:none;letter-spacing:.5px;opacity:.9}
.hero h1{font-family:'Outfit',system-ui,sans-serif;font-size:clamp(1.75rem,3vw,2.25rem);font-weight:700;line-height:1.3;margin-bottom:.75rem}
.hero-desc{opacity:.9;font-size:1rem;max-width:550px;line-height:1.7;font-weight:400}
.hero-online-badge{display:inline-flex;align-items:center;gap:0.5rem;margin-top:1.25rem;padding:0.625rem 1rem;background:rgba(255,255,255,0.2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:10px;border:1px solid rgba(255,255,255,0.3);font-size:0.875rem;font-weight:600;color:#fff;transition:all 0.2s;box-shadow:0 2px 8px rgba(0,0,0,0.1)}
.hero-online-badge:hover{background:rgba(255,255,255,0.25);transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,0.15)}
.hero-online-label{opacity:0.9;letter-spacing:0.5px;font-weight:500}
.hero-online-number{font-size:1.125rem;font-weight:700;line-height:1;min-width:1.2em;text-align:center}
.hero-metrics{display:flex;gap:2.5rem;margin-top:1.5rem;flex-wrap:wrap}
.metric-val{font-size:1.75rem;font-weight:700;line-height:1;letter-spacing:-.5px}
.metric-label{font-size:.8125rem;text-transform:uppercase;letter-spacing:1px;opacity:.7;margin-top:.35rem;font-weight:500}

/* ═══ Announcements carousel (homepage) ═══ */
.ann-carousel-wrap{width:100%;overflow:hidden}
.ann-carousel{position:relative;border-radius:16px;overflow:hidden;background:var(--sf);border:1px solid var(--bdl);box-shadow:0 2px 12px rgba(0,0,0,.06)}
.ann-carousel-track{position:relative;width:100%}
.ann-carousel-slide{position:relative;width:100%;display:block}
.ann-carousel-slide[hidden]{display:none}
.ann-carousel-inner{position:relative;width:100%;aspect-ratio:16/9;max-height:340px;background:var(--bg2)}
.ann-carousel-inner img{width:100%;height:100%;object-fit:contain;display:block;background:var(--sfm)}
.ann-carousel-caption{position:absolute;bottom:0;left:0;right:0;padding:1rem 1.25rem;background:linear-gradient(transparent,rgba(0,0,0,.65));display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.ann-carousel-tag{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;padding:.25rem .5rem;border-radius:6px}
.ann-carousel-title{color:#fff;font-size:1rem;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.ann-carousel-btn{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;min-width:44px;min-height:44px;border-radius:50%;border:1.5px solid var(--bdl);background:var(--sf);color:var(--t2);cursor:pointer;font-size:1.5rem;line-height:1;display:flex;align-items:center;justify-content:center;transition:all .2s;z-index:2;-webkit-tap-highlight-color:transparent;touch-action:manipulation;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.ann-carousel-btn:hover{background:var(--prlr);color:var(--pr);border-color:var(--card-hover-bd)}
.ann-carousel-prev{left:.75rem}
.ann-carousel-next{right:.75rem}
.ann-carousel-dots{position:absolute;bottom:.5rem;left:50%;transform:translateX(-50%);display:flex;gap:.5rem;z-index:2}
.ann-carousel-dot{width:10px;height:10px;border-radius:50%;border:none;background:rgba(255,255,255,.5);cursor:pointer;padding:0;transition:all .2s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.ann-carousel-dot:hover{background:rgba(255,255,255,.8)}
.ann-carousel-dot.active{background:#fff;transform:scale(1.2)}
@media (max-width:600px){.ann-carousel-inner{max-height:220px}.ann-carousel-btn{width:38px;height:38px;min-width:38px;min-height:38px;font-size:1.25rem}}

/* ═══ Grid ═══ */
.grid{display:grid;gap:1.5rem;margin-bottom:1.5rem;width:100%;box-sizing:border-box}
.g-2-1{grid-template-columns:5fr 3fr}.g-3{grid-template-columns:repeat(3,1fr)}
/* Office & Need help: same card height */
.grid-equal-cards{align-items:stretch}
.grid-equal-cards .card-equal{display:flex;flex-direction:column;min-height:100%}
.grid-equal-cards .card-equal .need-help-apps{flex:1;display:flex;flex-direction:column;justify-content:flex-start}
.grid-equal-cards .card-equal .office-contact{flex:1}

/* ═══ Card ═══ */
.card{background:var(--sf);border:1px solid var(--bdl);border-radius:16px;padding:1.5rem;box-shadow:0 1px 3px rgba(0,0,0,.04);width:100%;box-sizing:border-box}
.card:hover{box-shadow:0 2px 12px rgba(0,0,0,.06);border-color:var(--bd)}
[data-theme="dark"] .card:hover{box-shadow:0 2px 16px rgba(0,0,0,.2)}
.card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.25rem}
.card-label{display:flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:var(--t3)}
/* Office & contact card */
.office-contact{font-size:.9375rem;color:var(--t2);line-height:1.6}
.office-row{margin:0 0 .75rem}
.office-row:last-child{margin-bottom:0}
.office-label{display:inline-block;font-weight:600;color:var(--t3);min-width:5rem;font-size:.875rem}
/* Word of the Day — before Need help */
.word-of-the-day-card .word-of-the-day-saying{font-size:1.0625rem;line-height:1.6;color:var(--t1);font-weight:500;margin:0 0 .5rem;font-style:italic}
.word-of-the-day-card .word-of-the-day-hint{font-size:.8125rem;color:var(--t3);margin:0;font-style:normal}
@media (max-width:600px){.word-of-the-day-card .word-of-the-day-saying{font-size:1rem}}

/* Need help? card — same tile layout as Core software */
.need-help-desc{font-size:.875rem;color:var(--t3);margin:-.5rem 0 1rem;line-height:1.5}
.card-label-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1rem}
.link{font-size:.875rem;font-weight:600;color:var(--pr);text-decoration:none;transition:color .2s}
.link:hover{color:var(--prd)}
.pill{font-size:.8125rem;padding:.3125rem .75rem;border-radius:20px;font-weight:600;letter-spacing:.3px;min-height:24px;display:inline-flex;align-items:center}

/* ═══ Activity Gallery ═══ */
.activity-gallery-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.25rem}
.activity-gallery-tab{background:var(--sf);border:2px solid var(--bdl);color:var(--t2);padding:.5rem 1rem;border-radius:8px;font-weight:600;font-size:.875rem;cursor:pointer;transition:all .2s}
.activity-gallery-tab:hover{background:var(--sfm);border-color:var(--pr);color:var(--pr)}
.activity-gallery-tab.active{background:var(--pr);border-color:var(--pr);color:#fff}
.activity-gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}
.activity-gallery-grid-home{grid-template-columns:repeat(3,1fr)}
.activity-gallery-card{position:relative;background:var(--sf);border-radius:12px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.06);border:1px solid var(--bdl);transition:transform .2s,box-shadow .2s}
.activity-gallery-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.1)}
.activity-card-share-btn{position:absolute;top:.5rem;right:.5rem;z-index:2;width:2rem;height:2rem;padding:0;border:none;border-radius:8px;background:rgba(255,255,255,.9);color:var(--t2);font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 4px rgba(0,0,0,.15);transition:background .2s,color .2s}
.activity-card-share-btn:hover{background:var(--sf);color:var(--pr);box-shadow:0 2px 8px rgba(0,0,0,.2)}
.activity-gallery-card-link{display:block;text-decoration:none;color:inherit;position:relative;padding-bottom:2rem}
.activity-gallery-card-img{width:100%;padding-top:56%;background-size:cover;background-position:center;background-color:var(--sfm)}
.activity-gallery-card-body{padding:1rem 1.25rem}
.activity-gallery-card-date{font-size:.8125rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--t3);margin-bottom:.35rem}
.activity-gallery-card-title{font-size:1.0625rem;font-weight:700;color:var(--t1);margin:0 0 .5rem;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.activity-gallery-card-excerpt{font-size:.875rem;color:var(--t2);line-height:1.5;margin:0 0 .75rem;display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.activity-gallery-card-cta{font-size:.875rem;font-weight:600;color:var(--pr);display:inline-block}
.activity-gallery-card-link:hover .activity-gallery-card-cta{text-decoration:underline}
.activity-gallery-card-tag{position:absolute;bottom:.75rem;left:1.25rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--t3);display:inline-flex;align-items:center;gap:.35rem}
.activity-gallery-card-tag::before{content:'';width:6px;height:6px;background:var(--pr);border-radius:50%}
@media (max-width:600px){.activity-gallery-grid,.activity-gallery-grid-home{grid-template-columns:1fr;gap:1rem}.activity-gallery-card-body{padding:1rem}}
@media (min-width:601px) and (max-width:900px){.activity-gallery-grid-home{grid-template-columns:repeat(2,1fr)}}

/* ═══ Announcements ═══ */
.ann{padding:1rem 0;border-bottom:1px solid var(--bdl);cursor:pointer;transition:all .2s}
.ann:last-child{border-bottom:none;padding-bottom:0}.ann:first-child{padding-top:0}
.ann:hover .ann-title{color:var(--pr)}
.ann-has-img{display:flex;gap:1rem;align-items:flex-start}
.ann-has-img .ann-img{flex-shrink:0;width:120px;height:72px;border-radius:8px;overflow:hidden;background:var(--sfm);border:1px solid var(--bdl)}
.ann-has-img .ann-img img{width:100%;height:100%;object-fit:cover;display:block}
.ann-has-img .ann-body{flex:1;min-width:0}
.ann-meta{display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem}
.ann-tag{font-size:.8125rem;padding:.25rem .625rem;border-radius:5px;font-weight:600;text-transform:uppercase;letter-spacing:.3px;min-height:24px;display:inline-flex;align-items:center}
.ann-date{font-size:.875rem;color:var(--t4);font-weight:500}
.ann-title{font-size:1rem;font-weight:600;margin-bottom:.35rem;transition:color .2s;color:var(--t1);line-height:1.4}
.ann-subject{font-size:.875rem;color:var(--t3);line-height:1.5;margin:0 0 .5rem;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ann-desc{font-size:.9rem;color:var(--t3);line-height:1.65;word-wrap:break-word;white-space:pre-wrap;white-space:break-spaces}
.ann-dashboard .ann-body{width:100%}
.ann-has-img{display:flex;gap:1rem;align-items:flex-start}
.ann-has-img .ann-img{flex-shrink:0;width:120px;height:72px;border-radius:8px;overflow:hidden;background:var(--sfm);border:1px solid var(--bdl)}
.ann-has-img .ann-img img{width:100%;height:100%;object-fit:cover;display:block}
.ann-has-img .ann-body{flex:1;min-width:0}
@media (max-width:480px){.ann-has-img .ann-img{width:80px;height:48px}}
.ann-full-list{background:var(--bg2);border:1px solid var(--bdl);border-radius:12px;padding:0 1.25rem;margin-top:1rem}
.ann-full-list .ann-full{border-bottom:1px solid var(--bdl)}
.ann-full-list .ann-full:last-child{border-bottom:none}

/* Single announcement (full details page) */
.ann-single-page{margin-bottom:2rem}
.ann-single{background:var(--sf);border:1px solid var(--bdl);border-radius:16px;padding:1.5rem 2rem;box-shadow:0 2px 12px rgba(0,0,0,.04)}
.ann-single-meta{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}
.ann-single-title{font-size:1.5rem;font-weight:700;color:var(--t1);line-height:1.35;margin:0 0 .5rem}
.ann-single-subject{font-size:1.0625rem;color:var(--t2);line-height:1.5;margin:0 0 1rem;font-weight:500}
.ann-single-img{margin:0 0 1.25rem;border-radius:12px;overflow:hidden;background:var(--sfm);max-width:100%}
.ann-single-img img{width:100%;height:auto;display:block;max-height:480px;object-fit:contain}
.ann-single-desc{font-size:1rem;color:var(--t2);line-height:1.7;white-space:pre-wrap;white-space:break-spaces}
@media (max-width:600px){.ann-single{padding:1rem 1.25rem}.ann-single-title{font-size:1.25rem}}

/* Announcement as link (homepage / list) */
.ann-block-link{display:block;text-decoration:none;color:inherit}
.ann-block-link:hover .ann-title{color:var(--pr)}
.ann-block-link:hover .ann-read-more{text-decoration:underline}
.ann-arrow{font-size:.85em;color:var(--t3);margin-left:.15rem}
.ann-read-more{font-size:.85rem;color:var(--pr);font-weight:500;margin-top:.5rem;display:inline-flex;align-items:center;gap:.25rem}
.ann-read-more:hover{text-decoration:underline}

/* Auto KB Announcements - Hot/New items from Knowledge Base */
.ann-kb-auto{background:linear-gradient(135deg, rgba(245,158,11,0.05), rgba(251,191,36,0.03));border-left:3px solid #f59e0b;padding-left:0.75rem;margin-left:-0.75rem;border-radius:0 8px 8px 0;position:relative}
.ann-kb-auto:hover{background:linear-gradient(135deg, rgba(245,158,11,0.08), rgba(251,191,36,0.05));transform:translateX(2px);box-shadow:0 2px 8px rgba(245,158,11,0.15)}
.ann-kb-auto .ann-title{display:flex;align-items:center;gap:0.5rem}
.ann-kb-hint{font-size:0.85rem;color:var(--t3);margin-top:0.5rem;opacity:0.8;font-style:italic;display:flex;align-items:center;gap:0.25rem}

/* ═══ Calendar ═══ */
.cal-header{display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:.75rem}
.cal-header span{font-weight:600;font-size:1rem;color:var(--t1)}
.cal-btn{background:none;border:none;color:var(--t3);cursor:pointer;padding:.5rem .625rem;border-radius:8px;font-size:1rem;transition:all .2s;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}
.cal-btn:hover{background:var(--prlr);color:var(--pr)}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:1rem}
.cal-dow{text-align:center;font-size:.8125rem;font-weight:600;color:var(--t4);text-transform:uppercase;padding:.5rem 0;letter-spacing:.3px}
.cal-d{text-align:center;padding:.625rem 0;border-radius:8px;font-size:.875rem;color:var(--t2);cursor:pointer;transition:all .15s;position:relative;font-weight:500;min-height:40px;display:flex;align-items:center;justify-content:center}
.cal-d:hover{background:var(--sfm);color:var(--t1)}
.cal-d.today{background:var(--pr);color:#fff;font-weight:700;box-shadow:0 2px 8px rgba(13,124,110,.3)}
[data-theme="dark"] .cal-d.today{box-shadow:0 2px 10px rgba(45,212,191,.25)}
.cal-d.event::after{content:'';position:absolute;bottom:4px;left:50%;transform:translateX(-50%);width:5px;height:5px;border-radius:50%;background:var(--pr)}
.cal-d.today.event::after{background:#fff}
.events{display:flex;flex-direction:column;gap:.5rem}
.evt{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border-radius:10px;background:var(--sfm);transition:background .2s;cursor:pointer;min-height:48px}
.evt:hover{background:var(--bg2)}
.evt-bar{width:4px;height:32px;border-radius:2px;flex-shrink:0}
.evt-title{font-size:.9rem;font-weight:600;color:var(--t1)}.evt-time{font-size:.8125rem;color:var(--t4);font-weight:500}
.cal-d.selected{background:var(--prlr);color:var(--pr);outline:2px solid var(--pr);outline-offset:2px}
.cal-d.today.selected{background:var(--pr);color:#fff;outline-color:#fff}
.cal-day-events-panel{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--bdl)}
.cal-day-events-head{font-size:.9375rem;font-weight:700;color:var(--t1);margin-bottom:.75rem}
.cal-day-events-list{display:flex;flex-direction:column;gap:.5rem}
.cal-day-events-empty{font-size:.875rem;color:var(--t3);padding:.5rem 0}

/* ═══ Brands ═══ */
.brands-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:.875rem}
.brand-card{display:flex;flex-direction:column;align-items:center;gap:.75rem;padding:1.25rem 1rem;border-radius:12px;background:var(--sfm);border:1.5px solid transparent;cursor:pointer;transition:all .2s;min-height:100px}
.brand-card:hover{background:var(--sf);border-color:var(--bd);box-shadow:0 4px 12px rgba(0,0,0,.06);transform:translateY(-2px)}
[data-theme="dark"] .brand-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.2)}
.brand-logo{width:56px;height:56px;border-radius:12px;object-fit:contain;padding:4px;background:var(--logo-bg);border:1px solid var(--logo-border);filter:var(--brand-logo-filter)}
.brand-name{font-size:.8125rem;font-weight:500;color:var(--t2);text-align:center;line-height:1.4}

/* ═══ Apps ═══ */
.apps{display:grid;grid-template-columns:repeat(6,1fr);gap:.875rem;width:100%;box-sizing:border-box}
.app{display:flex;flex-direction:column;align-items:center;gap:.625rem;padding:1.25rem .75rem;border-radius:12px;background:var(--sfm);border:1.5px solid transparent;cursor:pointer;transition:all .2s;text-decoration:none;color:var(--t1);min-height:90px;width:100%;box-sizing:border-box}
.app:hover{background:var(--sf);border-color:var(--bd);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.06)}
[data-theme="dark"] .app:hover{box-shadow:0 4px 16px rgba(0,0,0,.2)}
.app-ico{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.25rem}
.app span{font-size:.8125rem;font-weight:500;text-align:center;color:var(--t2);line-height:1.3}
.app-coming-soon{opacity:.7;cursor:default}
.app-coming-soon:hover{transform:none;box-shadow:none}
.app-coming-soon .app-ico{filter:grayscale(40%)}
.coming-soon-badge{display:inline-block;background:#fef3c7;color:#b45309;padding:.25rem .5rem;border-radius:4px;font-size:.75rem;font-weight:600;margin-left:.25rem;vertical-align:middle;min-height:20px;display:inline-flex;align-items:center}

/* ═══ Cyber ═══ */
.cyber-full-details{word-wrap:break-word;background:var(--bg2);border-radius:10px;padding:1.5rem;margin-top:0;max-height:420px;overflow-y:auto;border:1px solid var(--bdl);font-size:.9375rem;line-height:1.7;color:var(--t2)}
.cyber-full-details p{margin:0 0 1em}
.cyber-full-details p:last-child{margin-bottom:0}
.cyber-full-details p.cyber-heading{font-weight:600;color:var(--t1);margin-top:1.25em;margin-bottom:.5em;font-size:1.0625rem}
.cyber-full-details p.cyber-heading:first-child{margin-top:0}
.cyber-full-details .cyber-list{margin:.625em 0 1.125em;padding-left:1.5em}
.cyber-full-details .cyber-list li{margin-bottom:.5em}
.cyber-full-details strong{color:var(--t1);font-weight:600}

/* Full-document Cybersecurity page: easy to read, clear indentation */
.cyber-doc-page{max-width:760px;margin:0 auto;padding:2rem 1.5rem 3rem}
.cyber-doc-back{margin-bottom:1.5rem;font-size:.9375rem}
.cyber-doc-back a{color:var(--pr);text-decoration:none}
.cyber-doc-back a:hover{text-decoration:underline}
.cyber-doc-title{font-size:1.75rem;font-weight:700;color:var(--t1);margin:0 0 1rem;line-height:1.35}
.cyber-doc-summary{font-size:1.0625rem;color:var(--t2);line-height:1.7;margin:0 0 1.75rem;padding:0}
/* Document body: padded box, generous spacing and indentation */
.cyber-document{word-wrap:break-word;font-size:1.0625rem;line-height:1.8;color:var(--t2);background:var(--bg2);border:1px solid var(--bdl);border-radius:14px;padding:2rem 2.5rem;margin:0}
.cyber-document p{margin:0 0 1.25em;padding-left:0;text-indent:0}
.cyber-document p:last-child{margin-bottom:0}
/* Section headings: stand out, extra space below */
.cyber-document p.cyber-heading{font-weight:600;color:var(--t1);margin-top:1.75em;margin-bottom:1em;font-size:1.1875rem;padding-left:0}
.cyber-document p.cyber-heading:first-child{margin-top:0}
/* Bullet lists: clear indent and spacing */
.cyber-document .cyber-list{margin:0.75em 0 1.5em 1.5rem;padding-left:2rem;list-style:disc}
.cyber-document .cyber-list li{margin-bottom:0.75em;padding-left:0.5em;line-height:1.7}
.cyber-document .cyber-list ul{margin:0.625em 0 0.625em 1.5rem;padding-left:1.5rem;list-style:circle}
.cyber-document strong{color:var(--t1);font-weight:600}

/* Full calendar page */
.cal-full-page{max-width:1200px;margin:0 auto;padding:1.5rem 1rem 3rem}
.cal-full-back{margin-bottom:1rem;font-size:.9375rem}
.cal-full-back a{color:var(--pr);text-decoration:none}
.cal-full-back a:hover{text-decoration:underline}

/* View Switcher */
.cal-view-switcher{display:flex;gap:.5rem;margin-bottom:1.5rem;flex-wrap:wrap}
.cal-view-btn{display:inline-flex;align-items:center;justify-content:center;padding:.625rem 1.25rem;border-radius:10px;background:var(--sf);border:2px solid var(--bdl);color:var(--t2);text-decoration:none;font-weight:600;font-size:.9375rem;transition:all .2s;min-width:80px}
.cal-view-btn:hover{background:var(--sfh);border-color:var(--pr);color:var(--pr)}
.cal-view-btn.active{background:var(--pr);border-color:var(--pr);color:#fff}

/* Header Bar */
.cal-header-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;flex-wrap:wrap;gap:1rem}
.cal-header-nav{display:flex;align-items:center;gap:1rem;flex:1;min-width:0}
.cal-nav-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:var(--sf);border:2px solid var(--bdl);color:var(--t2);text-decoration:none;font-size:1.5rem;font-weight:700;transition:all .2s;flex-shrink:0}
.cal-nav-btn:hover{background:var(--pr);border-color:var(--pr);color:#fff}
.cal-header-title{font-size:1.5rem;font-weight:700;color:var(--t1);flex:1;text-align:center;min-width:0}
.cal-today-btn{padding:.625rem 1.25rem;border-radius:10px;background:var(--sf);border:2px solid var(--bdl);color:var(--pr);text-decoration:none;font-weight:600;font-size:.9375rem;transition:all .2s;white-space:nowrap}
.cal-today-btn:hover{background:var(--pr);border-color:var(--pr);color:#fff}

/* Empty State */
.cal-empty{padding:3rem 1rem;text-align:center;color:var(--t3);font-size:1rem}

/* Day View */
.cal-day-view{max-width:700px;margin:0 auto}
.cal-day-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid var(--bdl)}
.cal-day-date{font-size:1.5rem;font-weight:700;color:var(--t1)}
.cal-day-count{font-size:.9375rem;color:var(--t3)}
.cal-day-events{display:flex;flex-direction:column;gap:.75rem}

/* Week View */
.cal-week-view{overflow-x:auto;-webkit-overflow-scrolling:touch}
.cal-week-grid{display:grid;grid-template-columns:repeat(7,minmax(140px,1fr));gap:1rem;min-width:980px}
.cal-week-day{display:flex;flex-direction:column;border:2px solid var(--bdl);border-radius:12px;background:var(--sf);padding:.75rem;min-height:400px}
.cal-week-day.is-today{border-color:var(--pr);background:var(--prl);box-shadow:0 2px 8px rgba(13,124,110,.15)}
.cal-week-day-header{margin-bottom:.75rem;padding-bottom:.75rem;border-bottom:1px solid var(--bdl)}
.cal-week-dow{font-size:.8125rem;font-weight:600;color:var(--t4);text-transform:uppercase;margin-bottom:.25rem}
.cal-week-date{font-size:1.25rem;font-weight:700;color:var(--t1)}
.cal-week-day.is-today .cal-week-date{color:var(--pr)}
.cal-week-events{flex:1;display:flex;flex-direction:column;gap:.5rem;min-height:0}
.cal-week-event{padding:.5rem;border-radius:8px;background:var(--bg2);border-left:3px solid var(--pr);font-size:.8125rem}
.cal-week-event-time{font-weight:600;color:var(--pr);margin-bottom:.25rem;font-size:.75rem}
.cal-week-event-title{color:var(--t1);line-height:1.4}

/* Month View */
.cal-month-view{}
.cal-month-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:2rem;background:var(--sf);padding:.5rem;border-radius:12px}
.cal-month-dow{text-align:center;font-size:.8125rem;font-weight:600;color:var(--t4);text-transform:uppercase;padding:.75rem .5rem;letter-spacing:.3px}
.cal-month-day{min-height:100px;padding:.75rem .5rem;border-radius:8px;background:var(--bg);display:flex;flex-direction:column;cursor:pointer;transition:all .15s;position:relative;text-decoration:none;color:inherit}
.cal-month-day:hover{background:var(--sfm);transform:scale(1.02);box-shadow:0 2px 8px rgba(0,0,0,.1)}
.cal-month-day.is-today{background:var(--pr);color:#fff;box-shadow:0 2px 8px rgba(13,124,110,.3)}
.cal-month-day.is-today .cal-month-day-num{color:#fff;font-weight:700}
.cal-month-day.has-events{border-left:3px solid var(--pr)}
.cal-month-day-num{font-size:1rem;font-weight:500;color:var(--t1);margin-bottom:.5rem}
.cal-month-day-events{display:flex;flex-wrap:wrap;gap:3px;align-items:center;flex:1;min-height:0}
.cal-month-event-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.cal-month-event-more{font-size:.7rem;color:var(--t3);font-weight:600;margin-left:auto}
.cal-month-list-header{margin-top:2rem;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:2px solid var(--bdl)}
.cal-month-list{margin-top:0;display:flex;flex-direction:column;gap:1.5rem}
.cal-month-list-day{margin-bottom:1rem}
.cal-month-list-date{font-size:1.125rem;font-weight:600;color:var(--t1);margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px solid var(--bdl)}
.cal-month-list-date a:hover{color:var(--pr);text-decoration:underline}
.cal-month-list-events{display:flex;flex-direction:column;gap:.625rem}

/* Event Cards (shared) */
.cal-event-card{display:flex;align-items:stretch;gap:1rem;padding:.875rem 1rem;border-radius:10px;background:var(--bg2);border:1px solid var(--bdl);transition:all .2s}
.cal-event-card:hover{background:var(--sf);box-shadow:0 2px 8px rgba(0,0,0,.08)}
.cal-event-bar{width:4px;border-radius:2px;flex-shrink:0}
.cal-event-content{flex:1;min-width:0}
.cal-event-title{font-weight:500;color:var(--t1);font-size:1rem;margin-bottom:.25rem}
.cal-event-time{font-size:.875rem;color:var(--t3)}

/* Legacy styles (for backward compatibility) */
.cal-full-title{font-size:1.75rem;font-weight:700;color:var(--t1);margin:0 0 .625rem;line-height:1.35}
.cal-full-desc{color:var(--t2);font-size:1rem;margin:0 0 1.5rem;line-height:1.6}
.cal-full-filter{margin-bottom:1.25rem}
.cal-full-month{margin-bottom:2rem}
.cal-full-month-title{font-size:1.25rem;font-weight:600;color:var(--t1);margin:0 0 1rem;padding-bottom:.5rem;border-bottom:1px solid var(--bdl)}
.cal-full-list{display:flex;flex-direction:column;gap:.625rem}
.cal-full-evt{display:flex;align-items:stretch;gap:1rem;padding:.875rem 1rem;border-radius:10px;background:var(--bg2);border:1px solid var(--bdl)}
.cal-full-evt.is-past{opacity:.75}
.cal-full-evt-bar{width:4px;border-radius:2px;flex-shrink:0}
.cal-full-evt-body{flex:1;min-width:0}
.cal-full-evt-title{font-weight:500;color:var(--t1);font-size:1rem}
.cal-full-evt-time{font-size:.875rem;color:var(--t3);margin-top:.25rem}
.cal-past-label{font-style:italic;color:var(--t4)}
.cal-full-empty{color:var(--t3);font-style:italic;font-size:.9375rem}

/* ── Inbox page ─────────────────────────────────────────────────────────────── */
/* Use wider, standard content width similar to BNT pages */
.inbox-page{max-width:1120px;margin:0 auto;padding:1.5rem 1rem 3rem;min-height:60vh}
.inbox-back{margin-bottom:1.25rem;font-size:.9375rem}
.inbox-back a{color:var(--pr);text-decoration:none;font-weight:500}
.inbox-back a:hover{text-decoration:underline}
/* Head */
.inbox-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.25rem}
.inbox-head-left{min-width:0}
.inbox-title{font-size:1.75rem;font-weight:800;color:var(--t1);margin:0 0 .375rem;line-height:1.2;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.inbox-unread-badge{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 6px;border-radius:99px;background:var(--pr);color:#fff;font-size:.75rem;font-weight:700}
.inbox-desc{color:var(--t2);font-size:.9375rem;margin:0;line-height:1.5}
.inbox-mark-all-btn{flex-shrink:0;padding:.5rem 1rem;border:1.5px solid var(--pr);border-radius:10px;background:transparent;color:var(--pr);font-weight:600;font-size:.875rem;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s}
.inbox-mark-all-btn:hover{background:var(--pr);color:#fff}
/* Quick links */
.inbox-quick-links{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.25rem}
.inbox-ql{display:inline-flex;align-items:center;gap:.375rem;padding:.45rem .875rem;border-radius:10px;background:var(--sfm);border:1px solid var(--bdl);color:var(--t2);text-decoration:none;font-size:.875rem;font-weight:500;transition:background .15s,border-color .15s,color .15s}
.inbox-ql:hover{background:var(--prlr,#e6f4f2);border-color:var(--pr);color:var(--pr)}
.inbox-ql-icon{font-size:1rem}
/* Filter chips */
.inbox-chips{display:flex;gap:.375rem;flex-wrap:wrap;margin-bottom:1.25rem}
.inbox-chip{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .875rem;border-radius:99px;border:1.5px solid var(--bdl);background:var(--sf);color:var(--t2);font-size:.875rem;font-weight:500;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.inbox-chip:hover{border-color:var(--pr);color:var(--pr)}
.inbox-chip.active{background:var(--pr);border-color:var(--pr);color:#fff}
.inbox-chip-count{font-size:.75rem;font-weight:700;opacity:.8}
.inbox-chip.active .inbox-chip-count{opacity:1}
.inbox-chip-count-unread{background:var(--err,#dc2626);color:#fff;border-radius:99px;padding:0 5px;min-width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;font-size:.7rem}
.inbox-chip.active .inbox-chip-count-unread{background:rgba(255,255,255,.3);color:#fff}
/* Group header */
.inbox-group{margin-bottom:1.5rem}
.inbox-group-header{font-size:.75rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--t3);margin-bottom:.5rem;padding:0 .25rem}
/* List & Items */
.inbox-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.375rem}
.inbox-item{display:flex;align-items:flex-start;gap:.75rem;padding:.875rem 1rem .875rem .875rem;border-radius:12px;background:var(--sf);border:1px solid var(--bdl);transition:background .15s,border-color .15s,box-shadow .15s;position:relative}
.inbox-item:hover{background:var(--sfh,#f7faf9);border-color:var(--bd,#c8d8d4);box-shadow:0 2px 8px rgba(0,0,0,.06)}
.inbox-item-unread{background:rgba(13,124,110,.05);border-left:3px solid var(--pr)}
.inbox-item-unread:hover{background:rgba(13,124,110,.09)}
/* Unread dot */
.inbox-item-dot{width:8px;height:8px;border-radius:50%;background:transparent;flex-shrink:0;margin-top:.5rem}
.inbox-item-dot-new{background:var(--pr)}
/* Type icon bubble */
.inbox-item-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.125rem;flex-shrink:0;background:var(--sfm)}
.inbox-item-icon.inbox-badge-bnt{background:rgba(13,124,110,.12)}
.inbox-item-icon.inbox-badge-ann{background:rgba(59,130,246,.12)}
.inbox-item-icon.inbox-badge-act{background:rgba(245,158,11,.12)}
.inbox-item-icon.inbox-badge-tu {background:rgba(168,85,247,.12)}
/* Body */
.inbox-item-body{flex:1;min-width:0;text-decoration:none;color:inherit}
.inbox-item-row1{display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem;margin-bottom:.25rem;flex-wrap:wrap}
.inbox-item-title{font-weight:600;color:var(--t1);font-size:.9375rem;line-height:1.4;flex:1;min-width:0}
.inbox-item-unread .inbox-item-title{font-weight:700}
.inbox-item-msg{font-size:.875rem;color:var(--t2);line-height:1.4;margin-bottom:.25rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.inbox-item-meta{display:flex;align-items:center;gap:.5rem}
.inbox-item-time{font-size:.75rem;color:var(--t3)}
/* Type badge pill */
.inbox-badge{display:inline-flex;align-items:center;padding:.2rem .55rem;border-radius:99px;font-size:.7rem;font-weight:700;white-space:nowrap;flex-shrink:0}
.inbox-badge-bnt{background:rgba(13,124,110,.12);color:#0d7c6e}
.inbox-badge-ann{background:rgba(59,130,246,.12);color:#2563eb}
.inbox-badge-act{background:rgba(245,158,11,.12);color:#b45309}
.inbox-badge-tu    {background:rgba(168,85,247,.12);color:#7c3aed}
.inbox-badge-cyber {background:rgba(220,38,38,.1);color:#dc2626}
.inbox-badge-kb    {background:rgba(6,182,212,.1);color:#0891b2}
.inbox-badge-survey{background:rgba(139,92,246,.1);color:#7c3aed}
/* Icon bubble overrides for new types */
.inbox-item-icon.inbox-badge-cyber {background:rgba(220,38,38,.1)}
.inbox-item-icon.inbox-badge-kb    {background:rgba(6,182,212,.1)}
.inbox-item-icon.inbox-badge-survey{background:rgba(139,92,246,.1)}
/* Check button (BNT inbox_ items) */
.inbox-item-check{width:32px;height:32px;border-radius:8px;border:1.5px solid var(--bdl);background:var(--sf);color:var(--pr);cursor:pointer;font-size:1rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s,color .15s,border-color .15s;margin-top:.125rem}
.inbox-item-check:hover{background:var(--pr);color:#fff;border-color:var(--pr)}
/* Dismiss button (scope-based: cyber / kb / survey) */
.inbox-item-dismiss{width:32px;height:32px;border-radius:8px;border:1.5px solid var(--bdl);background:var(--sf);color:var(--t3);cursor:pointer;font-size:1.125rem;font-weight:400;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s,color .15s,border-color .15s;margin-top:.125rem}
.inbox-item-dismiss:hover{background:var(--sfm);color:var(--t1);border-color:var(--bd,#c8d8d4)}
/* Empty state */
.inbox-empty{text-align:center;padding:3.5rem 1.5rem}
.inbox-empty-icon{font-size:3rem;margin-bottom:.75rem;line-height:1}
.inbox-empty-title{font-size:1.125rem;font-weight:700;color:var(--t1);margin-bottom:.375rem}
.inbox-empty-sub{font-size:.9375rem;color:var(--t2);margin-bottom:1.25rem}
.inbox-empty-cta{display:inline-flex;padding:.55rem 1.25rem;border-radius:10px;background:var(--pr);color:#fff;text-decoration:none;font-weight:600;font-size:.9375rem}
.inbox-empty-cta:hover{background:var(--prd,#0a6458)}
/* All-caught-up banner */
.inbox-caught-up{display:flex;align-items:center;gap:.5rem;padding:.6rem 1rem;background:rgba(13,124,110,.07);border:1px solid rgba(13,124,110,.18);border-radius:10px;color:var(--pr);font-size:.9rem;font-weight:600;margin-bottom:1rem}
@media(max-width:640px){
.inbox-head{flex-direction:column;gap:.75rem}
.inbox-title{font-size:1.4rem}
.inbox-mark-all-btn{width:100%;text-align:center;justify-content:center}
.inbox-item{padding:.75rem .875rem .75rem .75rem}
.inbox-item-icon{width:32px;height:32px;font-size:1rem}
}
@media(max-width:420px){
.inbox-page{padding:1rem .75rem 1.5rem}
.inbox-item-row1{flex-direction:column}
.inbox-badge{align-self:flex-start}
}

/* Responsive */
@media (max-width:768px){
  .cal-full-page{padding:1rem .75rem 2rem}
  .cal-header-bar{flex-direction:column;align-items:stretch}
  .cal-header-nav{gap:.5rem}
  .cal-header-title{font-size:1.25rem;text-align:left}
  .cal-nav-btn{width:36px;height:36px;font-size:1.25rem}
  .cal-today-btn{width:100%;text-align:center}
  .cal-view-switcher{gap:.375rem}
  .cal-view-btn{padding:.5rem 1rem;font-size:.875rem;min-width:70px;flex:1}
  .cal-week-grid{grid-template-columns:repeat(7,minmax(100px,1fr));gap:.5rem;min-width:700px}
  .cal-week-day{min-height:300px;padding:.5rem}
  .cal-month-grid{gap:2px;padding:.25rem}
  .cal-month-day{min-height:80px;padding:.5rem .375rem}
  .cal-month-day-num{font-size:.875rem}
  .cal-day-header{flex-direction:column;align-items:flex-start;gap:.5rem}
  .cal-day-date{font-size:1.25rem}
}
@media (max-width:480px){
  .cal-week-grid{min-width:600px}
  .cal-week-day{min-height:250px}
  .cal-month-day{min-height:70px;padding:.375rem .25rem}
  .cal-month-day-num{font-size:.8125rem}
  .cal-month-event-dot{width:5px;height:5px}
}

.tip{display:flex;gap:.875rem;padding:1rem;border-radius:10px;background:var(--sfm);margin-bottom:.75rem;border-left:4px solid var(--pr);transition:background .2s;cursor:pointer}
.tip:last-child{margin-bottom:0}.tip:hover{background:var(--bg2)}
.tip-ico{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1.125rem}
.tip-title{font-size:.9375rem;font-weight:600;margin-bottom:.2rem;color:var(--t1);line-height:1.4}
.tip-desc{font-size:.875rem;color:var(--t3);line-height:1.6}

/* ═══ Status ═══ */
.status-list{display:flex;flex-direction:column;gap:.5rem}
.status{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border-radius:10px;background:var(--sfm)}
.dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.dot-g{background:var(--ok);box-shadow:0 0 6px rgba(22,163,74,.3);animation:glow 3s ease infinite}
.dot-a{background:var(--acc);box-shadow:0 0 6px rgba(217,119,6,.3)}
@keyframes glow{0%,100%{opacity:1}50%{opacity:.5}}
.status-name{flex:1;font-size:.9rem;font-weight:500;color:var(--t1)}.status-lbl{font-size:.8125rem;color:var(--t4);font-weight:500}

/* UptimeRobot monitors — compact grid */
.status-summary{display:flex;align-items:center;gap:.625rem;padding:.75rem 1rem;border-radius:10px;margin-bottom:.875rem;font-weight:600;font-size:.9rem}
.status-summary.all-up{background:var(--okl);color:var(--ok)}
.status-summary.has-down{background:var(--errl);color:var(--err)}
.status-summary.has-issues{background:var(--accl);color:var(--acc)}
.status-summary-icon{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8125rem;font-weight:700}
.status-summary.all-up .status-summary-icon{background:var(--ok);color:#fff}
.status-summary.has-down .status-summary-icon{background:var(--err);color:#fff}
.status-summary.has-issues .status-summary-icon{background:var(--acc);color:#fff}
.status-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}
.status-item{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;border-radius:8px;background:var(--sfm);transition:background .15s;cursor:default;min-height:40px}
.status-item:hover{background:var(--bg2)}
.status-item-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.status-item.status-up .status-item-dot{background:var(--ok);box-shadow:0 0 5px rgba(22,163,74,.5)}
.status-item.status-down .status-item-dot{background:var(--err);box-shadow:0 0 5px rgba(220,38,38,.5);animation:pulse 1.5s ease infinite}
.status-item.status-other .status-item-dot{background:var(--acc)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.status-item-name{flex:1;font-size:.8125rem;font-weight:500;color:var(--t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.status-item.status-down .status-item-name{color:var(--err)}
@media(max-width:600px){.status-grid{grid-template-columns:1fr}}

/* ═══ Quick Actions ═══ */
.qa-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.625rem}
.qa{display:flex;align-items:center;gap:.75rem;padding:.875rem 1rem;border-radius:10px;background:var(--sfm);border:1.5px solid transparent;cursor:pointer;transition:all .2s;min-height:52px}
.qa:hover{background:var(--sf);border-color:var(--bd);box-shadow:0 1px 4px rgba(0,0,0,.04)}
.qa-ico{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}
.qa-text{font-size:.875rem;font-weight:500;color:var(--t2)}

/* ═══ Birthdays (legacy) ═══ */
.bday{display:flex;align-items:center;gap:.75rem;padding:.625rem 0}
.bday+.bday{border-top:1px solid var(--bdl)}
.bday-av{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.8125rem;color:#fff;flex-shrink:0}
.bday-name{font-size:.9rem;font-weight:600;color:var(--t1)}
.bday-role{font-size:.8125rem;color:var(--t4)}
.bday-date{font-size:.8125rem;color:var(--t4);margin-left:auto;white-space:nowrap}

/* ═══ Celebrations Section ═══ */
.celebrations-section{margin-bottom:1.5rem;margin-top:.5rem}
.celebrations-header{margin-bottom:1.25rem;text-align:center;padding:0 .5rem}
.celebrations-title{font-size:1.25rem;font-weight:700;color:var(--t1);margin-bottom:.25rem}
.celebrations-subtitle{font-size:.875rem;color:var(--t3)}
.celebrations-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem}
.celebration-card{background:var(--sf);border:1px solid var(--bdl);border-radius:16px;overflow:hidden}
.celebration-card-header{display:flex;align-items:center;gap:1rem;padding:1.25rem 1.5rem;background:var(--sfm);border-bottom:1px solid var(--bdl)}
.celebration-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex-shrink:0}
.birthday-card .celebration-icon{background:linear-gradient(135deg,#fbbf24,#f59e0b)}
.anniversary-card .celebration-icon{background:linear-gradient(135deg,#34d399,#10b981)}
.celebration-card-header h3{font-size:1rem;font-weight:600;color:var(--t1);margin-bottom:.125rem}
.celebration-count{font-size:.8rem;color:var(--t3)}
.celebration-list{max-height:280px;overflow-y:auto}
.celebration-item{display:flex;align-items:center;gap:.875rem;padding:1rem 1.5rem;border-bottom:1px solid var(--bdl);transition:background .15s}
.celebration-item:last-child{border-bottom:none}
.celebration-item:hover{background:var(--sfm)}
.celebration-item.is-today{background:linear-gradient(90deg,rgba(251,191,36,.08),transparent)}
.celebration-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.875rem;color:#fff;flex-shrink:0}
.celebration-info{flex:1;min-width:0}
.celebration-name{font-size:.9rem;font-weight:600;color:var(--t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.celebration-company{display:inline-flex;padding:.1875rem .5rem;margin-left:.375rem;background:var(--sfm);border-radius:4px;font-size:.75rem;font-weight:600;color:var(--t3);vertical-align:middle;min-height:20px;align-items:center}
.celebration-dept{font-size:.8rem;color:var(--t3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:.125rem}
.celebration-date{text-align:right;flex-shrink:0}
.celebration-date-text{font-size:.85rem;color:var(--t3);font-weight:500}
.celebration-years{display:block;font-size:.9rem;font-weight:700;color:var(--ok);margin-bottom:.25rem}
.celebration-badge{display:inline-block;padding:.3125rem .75rem;border-radius:20px;font-size:.8125rem;font-weight:600;min-height:24px;display:inline-flex;align-items:center}
.celebration-badge.today{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#92400e}
.celebration-badge.soon{background:var(--infl);color:var(--inf)}
.celebration-empty{padding:2.5rem 1.5rem;text-align:center;color:var(--t3)}
.celebration-empty span{font-size:2.5rem;display:block;margin-bottom:.75rem;opacity:.5}
.celebration-empty p{font-size:.9rem}
@media(max-width:900px){.celebrations-grid{grid-template-columns:1fr}}
@media(max-width:480px){.celebration-item{padding:.875rem 1rem}.celebration-avatar{width:36px;height:36px;font-size:.8rem}}

/* ═══ Chips ═══ */
.chips{display:flex;gap:.625rem;flex-wrap:wrap}
.chip{display:flex;align-items:center;gap:.5rem;padding:.625rem 1rem;border-radius:10px;background:var(--sfm);border:1.5px solid transparent;font-size:.875rem;font-weight:500;color:var(--t2);cursor:pointer;transition:all .2s;min-height:44px}
.chip:hover{background:var(--sf);border-color:var(--bd);color:var(--pr)}

/* ═══ Policies Grid (legacy) ═══ */
.policies-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.policy-item{display:flex;align-items:center;gap:.75rem;padding:1rem 1.25rem;border-radius:12px;background:var(--sfm);border:1.5px solid transparent;text-decoration:none;transition:all .2s;min-height:60px}
.policy-item:hover{background:var(--sf);border-color:var(--bd);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.06)}
.policy-icon{width:40px;height:40px;border-radius:10px;background:var(--accl);display:flex;align-items:center;justify-content:center;font-size:1.25rem;flex-shrink:0}
.policy-label{font-size:.9rem;font-weight:500;color:var(--t1);line-height:1.4}
@media(max-width:1100px){.policies-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:768px){.policies-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.policies-grid{grid-template-columns:1fr}.policy-item{padding:.875rem 1rem}.policy-icon{width:36px;height:36px;font-size:1.125rem}}

/* ═══ Resources Grid (new unified) ═══ */
.resources-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.resource-card{display:flex;align-items:center;gap:1rem;padding:1.25rem;border-radius:14px;background:var(--sfm);border:1.5px solid transparent;text-decoration:none;transition:all .2s}
.resource-card:hover{background:var(--sf);border-color:var(--bd);transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.08)}
.resource-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex-shrink:0}
.resource-text{flex:1;min-width:0}
.resource-title{display:block;font-size:.95rem;font-weight:600;color:var(--t1);margin-bottom:.25rem}
.resource-desc{display:block;font-size:.8rem;color:var(--t3);line-height:1.4}
.card-link{font-size:.85rem;font-weight:500;color:var(--pr);text-decoration:none;transition:color .2s}
.card-link:hover{color:var(--pk);text-decoration:underline}
@media(max-width:600px){.resources-grid{grid-template-columns:1fr}.resource-card{padding:1rem}.resource-icon{width:42px;height:42px;font-size:1.25rem}}

/* ═══ Team Updates ═══ */
.team-updates-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.team-update{display:flex;gap:1rem;padding:1.125rem;border-radius:12px;background:var(--sfm);border-left:4px solid var(--pk);transition:transform .2s,box-shadow .2s}
.team-update:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.08)}
.team-update-hire{border-left-color:#10b981}
.team-update-promo{border-left-color:#f59e0b}
.team-update-role{border-left-color:#6366f1}
.team-update-avatar{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1rem;color:#fff;flex-shrink:0;background:linear-gradient(135deg,var(--pr),#14b8a6)}
.team-update-hire .team-update-avatar{background:linear-gradient(135deg,#10b981,#34d399)}
.team-update-promo .team-update-avatar{background:linear-gradient(135deg,#f59e0b,#fbbf24)}
.team-update-role .team-update-avatar{background:linear-gradient(135deg,#6366f1,#818cf8)}
.team-update-body{flex:1;min-width:0}
.team-update-type{margin-bottom:.35rem}
.team-update-badge{display:inline-block;padding:.25rem .625rem;border-radius:4px;font-size:.8125rem;font-weight:600;text-transform:uppercase;letter-spacing:.3px;min-height:24px}
.team-update-hire .team-update-badge{background:#d1fae5;color:#059669}
.team-update-promo .team-update-badge{background:#fef3c7;color:#b45309}
.team-update-role .team-update-badge{background:#e0e7ff;color:#4f46e5}
.team-update-name{font-size:.9375rem;font-weight:600;color:var(--t1);line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team-update-position{font-size:.875rem;color:var(--t2);line-height:1.5;margin-top:.2rem}
.team-update-prev{font-size:.8125rem;color:var(--t4);margin-top:.25rem;font-style:italic}
.team-update-date{font-size:.8125rem;color:var(--t4);margin-top:.35rem}
@media(max-width:1100px){.team-updates-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.team-updates-grid{grid-template-columns:1fr}}

/* ═══ Footer ═══ */
.footer{text-align:center;padding:2rem 1.5rem;font-size:.875rem;color:var(--t4);border-top:1px solid var(--bdl);margin-top:1rem;line-height:1.6}
.footer a{color:var(--pr);text-decoration:none;font-weight:500}.footer a:hover{text-decoration:underline}
.footer-online-info{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:1rem;flex-wrap:wrap}
.footer-online-badge{display:inline-flex;align-items:center;gap:0.5rem;padding:0.5rem 0.875rem;background:var(--bgl);border:1px solid var(--bdl);border-radius:8px;font-size:0.8rem;font-weight:600;color:var(--t2)}
.footer-online-label{opacity:0.8;letter-spacing:0.3px;font-weight:500}
.footer-online-number{font-size:1rem;font-weight:700;line-height:1;min-width:1.2em;text-align:center;color:var(--pr)}
.footer-ip-info{font-size:0.8rem;color:var(--t3);font-weight:500}
.footer-ip-info strong{color:var(--t2);font-weight:600;font-family:monospace;letter-spacing:0.5px}

/* ═══ Back to top (floating arrow) ═══ */
.back-to-top{
  position:fixed;
  bottom:max(1.5rem,env(safe-area-inset-bottom));
  left:max(1.5rem,env(safe-area-inset-left));
  z-index:90;
  width:48px;
  height:48px;
  border-radius:50%;
  background:var(--pr);
  color:#fff;
  border:2px solid var(--prd);
  box-shadow:0 4px 14px rgba(13,124,110,.35);
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  visibility:hidden;
  transform:translateY(12px);
  transition:opacity .25s ease,visibility .25s ease,transform .25s ease,background .2s,box-shadow .2s;
  text-decoration:none;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
.back-to-top:hover{background:var(--prd);box-shadow:0 6px 18px rgba(13,124,110,.4);color:#fff}
.back-to-top.visible{opacity:1;visibility:visible;transform:translateY(0)}
[data-theme="dark"] .back-to-top{background:var(--pr);border-color:var(--prd);box-shadow:0 4px 14px rgba(45,212,191,.25)}
[data-theme="dark"] .back-to-top:hover{background:var(--prd);box-shadow:0 6px 18px rgba(45,212,191,.3)}

/* ═══ Animations ═══ */
@keyframes fadeUp{from{opacity:.85;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.anim{animation:fadeUp .2s ease-out both}
.d1{animation-delay:.01s}.d2{animation-delay:.02s}.d3{animation-delay:.03s}.d4{animation-delay:.04s}.d5{animation-delay:.05s}.d6{animation-delay:.06s}

/* Respect user preference for reduced motion */
@media (prefers-reduced-motion: reduce) {
  .anim, .ticker-scroll, .ticker-dot, .dot-g {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ═══ Responsive ═══ */
/* Tablet & small desktop (≤1400px) — hamburger + overlay so EN, theme, AD (Admin) always visible without zoom */
@media(max-width:1400px){
  .g-3{grid-template-columns:repeat(2,1fr)}
  .g-2-1{grid-template-columns:1fr}
  .apps{grid-template-columns:repeat(4,1fr)}
  .brands-grid{grid-template-columns:repeat(4,1fr)}
  .nav-center{max-width:280px;margin:0 0.75rem}
  .nav-left{flex-shrink:1;min-width:0}
  .nav-brand{flex-shrink:1;min-width:0;max-width:calc(100vw - 200px)}
  .nav-title{overflow:visible;white-space:normal;word-break:break-word;line-height:1.2}
  .mobile-nav-toggle{display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
  .nav{overflow:visible!important;width:100%!important;box-sizing:border-box!important;justify-content:space-between!important;padding:0 max(1.25rem,env(safe-area-inset-right)) 0 max(1.25rem,env(safe-area-inset-left))!important}
  .nav-right{display:flex!important;align-items:center!important;gap:.5rem!important;flex-shrink:0!important;z-index:101!important;visibility:visible!important;opacity:1!important;overflow:visible!important;min-width:auto!important;width:auto!important;position:relative!important;margin-left:auto!important}
  .lang-switch{display:flex!important;visibility:visible!important;opacity:1!important;flex-shrink:0!important;overflow:visible!important;position:relative!important;z-index:102!important;width:auto!important;height:auto!important}
  .lang-btn{display:flex!important;visibility:visible!important;opacity:1!important;min-width:44px!important;min-height:44px!important;flex-shrink:0!important;overflow:visible!important;width:auto!important;height:44px!important;background:var(--sf)!important;border:1.5px solid var(--bdl)!important;color:var(--t2)!important}
  .nav-links{
    display:flex;position:fixed;top:var(--menu-top,var(--nav-height,68px));left:0;right:0;bottom:auto;background:var(--sf);border-bottom:1px solid var(--bdl);
    flex-direction:column;padding:1rem 1.25rem;max-height:0;overflow:hidden;opacity:0;visibility:hidden;
    transition:max-height .35s ease,height .35s ease,opacity .25s ease,visibility .25s ease,top .2s ease;z-index:9998;
    box-shadow:0 8px 24px rgba(0,0,0,.12);gap:.5rem;-webkit-overflow-scrolling:touch;
    padding-left:max(1.25rem,env(safe-area-inset-left));padding-right:max(1.25rem,env(safe-area-inset-right));
    -webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  }
  .nav-links.mobile-open{max-height:none;height:calc(100vh - var(--menu-top,var(--nav-height,68px)));opacity:1;visibility:visible;overflow-y:auto;overflow-x:hidden;padding:1rem 1.25rem;padding-left:max(1.25rem,env(safe-area-inset-left));padding-right:max(1.25rem,env(safe-area-inset-right));bottom:0;display:flex!important;flex-direction:column;top:var(--menu-top,var(--nav-height,68px));gap:.5rem}
  .nav-link{width:100%!important;justify-content:flex-start;padding:.875rem 1.125rem;border-radius:10px;min-height:48px;font-size:.9375rem;box-sizing:border-box;flex-shrink:0;display:flex!important;align-items:center;visibility:visible!important;opacity:1!important}
  .mobile-toggle{display:flex;align-items:center;justify-content:center}
}

/* iPad and tablet / small laptop (769px - 1400px) — hamburger so nav-right (AD, theme, lang) stays visible */
@media(min-width:769px) and (max-width:1400px){
  .nav{overflow:visible!important;justify-content:space-between!important;padding:0 1.25rem!important;width:100%!important;box-sizing:border-box!important;max-width:100vw!important;gap:.75rem!important}
  .nav-right{display:flex!important;align-items:center!important;gap:.5rem!important;flex-shrink:0!important;z-index:101!important;visibility:visible!important;opacity:1!important;min-width:auto!important;overflow:visible!important;position:relative!important;max-width:none!important;width:auto!important;height:auto!important;margin-left:auto!important}
  .lang-switch{display:flex!important;visibility:visible!important;opacity:1!important;position:relative!important;z-index:102!important;flex-shrink:0!important;overflow:visible!important;min-width:auto!important;width:auto!important;height:auto!important}
  .lang-btn{display:flex!important;visibility:visible!important;opacity:1!important;min-width:44px!important;min-height:44px!important;padding:0 .75rem!important;flex-shrink:0!important;overflow:visible!important;width:auto!important;height:44px!important;background:var(--sf)!important;border:1.5px solid var(--bdl)!important;color:var(--t2)!important;cursor:pointer!important}
  .lang-code{display:inline!important;visibility:visible!important;opacity:1!important}
  .nav-left{display:flex!important;align-items:center!important;gap:.75rem!important;flex:1!important;min-width:0!important;max-width:none!important;flex-shrink:1!important}
  .nav-brand{flex-shrink:1!important;min-width:0!important;max-width:180px!important;gap:.625rem!important}
  .nav-title{font-size:1rem!important;letter-spacing:-.25px!important;overflow:visible!important;white-space:normal!important;word-break:break-word!important;line-height:1.2!important;max-width:100%!important}
  .nav-subtitle{font-size:.65rem!important;display:none!important}
  .nav-logo{width:36px!important;height:36px!important;font-size:.95rem!important;flex-shrink:0!important}
  .nav-center .search{min-width:160px}
  .nav-links{display:flex!important;position:fixed!important;top:var(--menu-top,var(--nav-height,68px))!important;left:0!important;right:0!important;bottom:auto!important;background:var(--sf)!important;border-bottom:1px solid var(--bdl)!important;flex-direction:column!important;padding:1rem 1.25rem!important;max-height:0!important;overflow:hidden!important;opacity:0!important;visibility:hidden!important;transition:max-height .35s ease,height .35s ease,opacity .25s ease,visibility .25s ease,top .2s ease!important;z-index:9998!important;box-shadow:0 8px 24px rgba(0,0,0,.12)!important;gap:.5rem!important;-webkit-overflow-scrolling:touch!important;padding-left:max(1.25rem,env(safe-area-inset-left))!important;padding-right:max(1.25rem,env(safe-area-inset-right))!important;overscroll-behavior:contain!important}
  .nav-links.mobile-open{max-height:none!important;height:calc(100vh - var(--menu-top,var(--nav-height,68px)))!important;opacity:1!important;visibility:visible!important;overflow-y:auto!important;overflow-x:hidden!important;padding:1rem 1.25rem!important;padding-left:max(1.25rem,env(safe-area-inset-left))!important;padding-right:max(1.25rem,env(safe-area-inset-right))!important;bottom:0!important;display:flex!important;flex-direction:column!important;top:var(--menu-top,var(--nav-height,68px))!important;gap:.5rem!important}
  .nav-link{width:100%!important;justify-content:flex-start!important;padding:.875rem 1.125rem!important;border-radius:10px!important;min-height:48px!important;font-size:.9375rem!important;box-sizing:border-box!important;flex-shrink:0!important;display:flex!important;align-items:center!important;visibility:visible!important;opacity:1!important}
  .mobile-nav-toggle{display:flex!important;align-items:center!important;justify-content:center!important;-webkit-tap-highlight-color:transparent!important;touch-action:manipulation!important}
}

/* Tablet portrait */
@media(max-width:768px){
  html{font-size:16px}
  .nav{padding:0 1rem;height:64px;gap:.75rem;padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right));overflow:visible}
  .nav-left{gap:.75rem;flex:1;min-width:0}
  .nav-brand{gap:.625rem;flex:1;min-width:0;max-width:none}
  .nav-title{font-size:1.15rem;letter-spacing:-.3px;overflow:visible;white-space:normal;word-break:break-word;line-height:1.2}
  .nav-subtitle{font-size:.7rem;letter-spacing:1px}
  .nav-logo{width:40px;height:40px;font-size:1rem;flex-shrink:0}
  .nav-center{display:none;min-width:0}
  .mobile-toggle{display:flex!important;align-items:center;justify-content:center}
  .mobile-nav-toggle{display:flex!important;align-items:center;justify-content:center;margin-right:.5rem}
  .nav-links{top:var(--menu-top,64px);left:0;right:0;padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right))}
  .nav-links.mobile-open{max-height:none;height:calc(100vh - var(--menu-top,var(--nav-height,64px)));overflow-y:auto;overflow-x:hidden;padding:1rem;padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right));bottom:0;display:flex!important;flex-direction:column;top:var(--menu-top,var(--nav-height,64px));gap:.5rem}
  .nav-link{width:100%!important;justify-content:flex-start;padding:.875rem 1rem;border-radius:10px;min-height:48px;font-size:.9375rem;flex-shrink:0;display:flex!important;align-items:center;visibility:visible!important;opacity:1!important}
  .lang-code{display:none}
  .lang-btn{padding:0 .625rem;min-height:44px;min-width:44px;display:flex!important;visibility:visible!important;opacity:1!important}
  .nav-right{display:flex!important;align-items:center;gap:.5rem;flex-shrink:0;z-index:101;visibility:visible!important;opacity:1!important}
  .lang-switch{display:flex!important;visibility:visible!important;opacity:1!important}
  .main{padding:1.25rem 1rem 2rem;padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right))}
  .hero{padding:1.75rem 1.5rem;border-radius:14px}
  .hero h1{font-size:1.5rem}
  .hero-desc{font-size:.9375rem}
  .hero-metrics{gap:1.5rem}
  .g-3{grid-template-columns:1fr}
  .apps{grid-template-columns:repeat(3,1fr)}
  .brands-grid{grid-template-columns:repeat(3,1fr)}
  .qa-grid{grid-template-columns:1fr}
  .card{padding:1.25rem;border-radius:14px}
  .mobile-search{display:block!important;margin-bottom:1rem;padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right))}
}

/* Mobile — small phones (e.g. 320px–480px) */
@media(max-width:480px){
  html{font-size:16px}
  .main{padding:1rem .75rem 1.5rem;padding-left:max(.75rem,env(safe-area-inset-left));padding-right:max(.75rem,env(safe-area-inset-right))}
  .hero{padding:1.5rem 1.25rem;margin-bottom:1.5rem}
  .hero h1{font-size:1.375rem}
  .hero-metrics{flex-direction:column;gap:1rem}
  .metric-val{font-size:1.5rem}
  .apps{grid-template-columns:repeat(2,1fr);gap:.625rem}
  .brands-grid{grid-template-columns:repeat(2,1fr);gap:.625rem}
  .chips{gap:.5rem}
  .chip{font-size:.875rem;padding:.5rem .875rem}
  .card{padding:1rem;border-radius:12px}
  .card-head{margin-bottom:1rem}
  .grid{gap:1rem;margin-bottom:1rem}
  .nav{height:auto;min-height:60px;padding:.75rem .875rem;gap:.5rem;padding-left:max(.875rem,env(safe-area-inset-left));padding-right:max(.875rem,env(safe-area-inset-right));flex-wrap:nowrap;overflow:visible}
  .nav-left{gap:.5rem;flex:1;min-width:0;max-width:calc(100% - 120px)}
  .nav-brand{gap:.5rem;flex:1;min-width:0;max-width:100%}
  .nav-title{font-size:1rem;letter-spacing:-.2px;overflow:visible;white-space:normal;word-break:break-word;line-height:1.2;max-width:100%}
  .nav-subtitle{font-size:.7rem;letter-spacing:.8px;display:none}
  .nav-logo{width:36px;height:36px;font-size:.9rem;flex-shrink:0}
  .nav-links{top:var(--menu-top,var(--nav-height,60px));left:0;right:0;padding:.75rem .875rem;gap:.375rem;padding-left:max(.875rem,env(safe-area-inset-left));padding-right:max(.875rem,env(safe-area-inset-right));position:fixed}
  .nav-links.mobile-open{max-height:none;height:calc(100vh - var(--menu-top,var(--nav-height,60px)));overflow-y:auto;overflow-x:hidden;padding:.875rem;padding-left:max(.875rem,env(safe-area-inset-left));padding-right:max(.875rem,env(safe-area-inset-right));position:fixed;top:var(--menu-top,var(--nav-height,60px));bottom:0;-webkit-overflow-scrolling:touch;display:flex!important;flex-direction:column;gap:.5rem}
  .nav-link{padding:.75rem 1rem;font-size:.9rem;min-height:48px;flex-shrink:0;display:flex!important;align-items:center;width:100%!important;visibility:visible!important;opacity:1!important}
  .nav-btn,.theme-toggle,.avatar-btn,.mobile-toggle,.lang-btn,.mobile-nav-toggle,.inbox-btn{width:44px;height:44px;min-width:44px;min-height:44px;display:flex!important;align-items:center;justify-content:center;visibility:visible!important;opacity:1!important}
  .nav-right{display:flex!important;align-items:center;gap:.375rem;flex-shrink:0;z-index:101;visibility:visible!important;opacity:1!important}
  .nav-btn svg,.theme-toggle svg,.mobile-toggle svg,.mobile-nav-toggle svg,.lang-btn svg,.inbox-btn svg{width:16px;height:16px}
  .lang-btn{padding:0 .5rem;display:flex!important;visibility:visible!important;opacity:1!important;min-width:44px;min-height:44px}
  .lang-switch{display:flex!important;visibility:visible!important;opacity:1!important;position:relative}
}

/* Very small screens (e.g. 320px) — keep touch targets and readability */
@media(max-width:360px){
  .nav{padding:.75rem .625rem;padding-left:max(.625rem,env(safe-area-inset-left));padding-right:max(.625rem,env(safe-area-inset-right));gap:.375rem;height:auto;min-height:60px}
  .nav-left{gap:.375rem;flex:1;min-width:0;max-width:calc(100% - 110px)}
  .nav-brand{gap:.375rem;flex:1;min-width:0;max-width:100%}
  .nav-title{font-size:.9375rem;overflow:visible;white-space:normal;word-break:break-word;line-height:1.2;max-width:100%}
  .nav-subtitle{display:none}
  .nav-logo{width:34px;height:34px;font-size:.85rem;flex-shrink:0}
  .nav-links{top:var(--menu-top,var(--nav-height,60px))}
  .nav-links.mobile-open{max-height:none;height:calc(100vh - var(--menu-top,var(--nav-height,60px)));overflow-y:auto;overflow-x:hidden;padding:.75rem .625rem;padding-left:max(.625rem,env(safe-area-inset-left));padding-right:max(.625rem,env(safe-area-inset-right));top:var(--menu-top,var(--nav-height,60px));bottom:0;display:flex!important;flex-direction:column;gap:.5rem}
  .nav-link{padding:.75rem .875rem;font-size:.875rem;min-height:48px;flex-shrink:0;display:flex!important;align-items:center;width:100%!important;visibility:visible!important;opacity:1!important}
  .main{padding-left:max(.625rem,env(safe-area-inset-left));padding-right:max(.625rem,env(safe-area-inset-right))}
  .ticker{padding-left:max(.5rem,env(safe-area-inset-left));padding-right:max(.5rem,env(safe-area-inset-right))}
}

/* Page wrappers: ensure they fit on mobile and use safe areas */
.apps-page,.survey-page,.policy-page,.directory-page,.search-page,.search-results-page,.kb-page,.staff-auth-page{width:100%;max-width:100%;box-sizing:border-box}
.apps-page,.survey-page,.policy-page,.directory-page,.search-page,.search-results-page,.kb-page,.staff-auth-page{padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right))}
@media(max-width:600px){
  .apps-page,.survey-page,.policy-page,.directory-page,.search-page,.search-results-page,.kb-page,.staff-auth-page{padding-left:max(.75rem,env(safe-area-inset-left));padding-right:max(.75rem,env(safe-area-inset-right))}
}
@media(max-width:480px){
  .apps-page,.survey-page,.policy-page,.directory-page,.search-page,.search-results-page,.kb-page,.staff-auth-page{padding-left:max(.75rem,env(safe-area-inset-left));padding-right:max(.75rem,env(safe-area-inset-right))}
}

/* Responsive tables: scroll horizontally on small screens when needed */
.table-responsive{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-responsive table{min-width:min-content}

.mobile-search{display:none}