/* Web approximation of smoky notification glass; no Apple framework or bitmap.
   Light lives behind translucent surfaces. The three meteors use transform/opacity
   only, with long quiet intervals. Keep data surfaces more opaque than game tiles. */
:root {
  --bg: #06080e;
  --panel: #141820;
  --panel2: #1b202a;
  --border: #d7e3f329;
  --text: #f1f3f8;
  --muted: #b0b6c2;
  --accent: #c2ddff;
  --glass-fill: #10141b75;
  --glass-edge: #b9dcff63;
  --glass-light: 143, 190, 244;
}
body { background: var(--bg); isolation: isolate; }
#app { position: relative; z-index: 1; }
.space-scene {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
  z-index: 0;
  background:
    radial-gradient(ellipse at 79% 21%, #42649b24, transparent 46%),
    radial-gradient(ellipse at 25% 85%, #558a9221, transparent 43%),
    radial-gradient(ellipse at 56% 99%, #97695b10, transparent 42%),
    #06080e;
}
.space-stars {
  position: absolute;
  inset: 0;
  opacity: .58;
  background:
    radial-gradient(circle at 12% 9%, #edf4ffb3 .7px, transparent 1.2px),
    radial-gradient(circle at 33% 23%, #b7d7ff8c .65px, transparent 1.3px),
    radial-gradient(circle at 62% 7%, #eaf3ffb3 1px, transparent 1.5px),
    radial-gradient(circle at 90% 38%, #dbeaff9e .8px, transparent 1.4px),
    radial-gradient(circle at 26% 71%, #eaf3ff87 .65px, transparent 1.2px),
    radial-gradient(circle at 74% 84%, #ffefd987 .75px, transparent 1.25px);
  background-size: 383px 397px;
}
.space-stars.distant {
  opacity: .24;
  background-size: 547px 601px;
  transform: translate(81px, 54px);
}
.space-halo {
  position: absolute;
  width: 830px;
  height: 830px;
  top: -150px;
  right: -340px;
  border-radius: 50%;
  border: 1px solid #a9ceff05;
  border-left-color: #aed9ff4f;
  border-top-color: #bbdcff14;
  background: radial-gradient(circle at 20% 42%, #2762a312, transparent 58%);
  box-shadow: -17px 0 50px #5e9beb16, inset 18px 0 42px #7ab2ff16;
  transform: rotate(20deg);
  opacity: .65;
}
.space-halo::before {
  content: '';
  position: absolute;
  inset: -45px;
  border-radius: inherit;
  border: 1px solid #d4e7ff04;
  border-left-color: #acd4ff12;
}
.space-halo::after {
  content: '';
  position: absolute;
  width: 65px;
  height: 3px;
  left: 8px;
  top: 235px;
  border-radius: 50%;
  background: #cae4ff;
  filter: blur(8px);
  transform: rotate(-50deg);
  opacity: .4;
}
.space-meteor {
  position: absolute;
  top: 10%;
  left: 77%;
  width: 145px;
  height: 1px;
  opacity: 0;
  background: linear-gradient(90deg, #edf7ff, #acd7ff80 12%, #89bdff22 50%, transparent);
  box-shadow: 0 0 5px #a9d8ff4a;
  transform: rotate(-35deg);
  animation: meteor-flight 27s linear infinite;
}
.space-meteor::before {
  content: '';
  position: absolute;
  left: 0;
  top: -1px;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #e7f4ff;
  box-shadow: 0 0 8px #badfff80;
}
.space-meteor.second { top: 47%; left: 97%; width: 110px; animation-duration: 34s; animation-delay: -13s; }
.space-meteor.third { top: 22%; left: 49%; width: 95px; animation-duration: 41s; animation-delay: -29s; }
@keyframes meteor-flight {
  0% { opacity: 0; transform: translate(0, 0) rotate(-35deg); }
  1% { opacity: .65; }
  4.5% { opacity: 0; transform: translate(-410px, 287px) rotate(-35deg); }
  4.6%, 100% { opacity: 0; transform: translate(0, 0) rotate(-35deg); }
}

/* Neutral navigation lets the brand blue remain a small, clear signal. */
.content-shell { background: transparent; }
.sidebar { background: #0a0d13e8; border-color: #d7e3f316; }
.topbar { background: #080b11bf; border-color: #d7e3f316; -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
.nav-item { color: #adb4c1; }
.nav-item:hover { background: #e5efff08; color: #f0f4fa; }
.nav-item.active { background: linear-gradient(115deg, #cce2ff15, #cce2ff08); color: #edf4ff; }
.nav-item.active::before { background: #b0d7ff; box-shadow: 0 0 9px #78b3ff70; }
.demo-card { border-color: #d9e6ff22; }
.page-footer { border-color: #dce8ff18; color: #9ca5b5; }
.eyebrow, .module-caption, .game-kind { color: #b3bece; }
.home-greeting { color: #b1b8c5; }
.account-switch select { background: #10131b9e; color: #e1e7f1; border-color: #d7e3f326; }
.demo-label { border-color: #d7e3f32e; color: #b9c7d9; }
.app-shell[data-page='home'] main::before { display: none; }

/* The fine white rim and two blue specular spots reproduce the reference's
   glass edge without a uniformly bright neon outline around every card. */
.panel, .crew-identity, .leave-reserve, .base-action, .base-action.salary-entry,
.salary-summary, .leave-summary, .office-lounge {
  position: relative;
  border: 1px solid var(--glass-edge);
  border-top-color: #dceeff80;
  border-bottom-color: #8ab8f44f;
  background:
    radial-gradient(ellipse at 0% 0%, rgba(var(--glass-light), .095), transparent 56%),
    linear-gradient(140deg, #f3f7ff0d, #f3f7ff02 42%, #c0d8ff05),
    var(--glass-fill);
  -webkit-backdrop-filter: blur(24px) saturate(115%);
  backdrop-filter: blur(24px) saturate(115%);
  box-shadow:
    inset 0 1px 0 #f4f9ff12,
    inset 0 -1px 0 #aed5ff09,
    0 0 0 1px #7da9ed0b,
    0 0 18px #84b9f91c,
    0 18px 38px #0103073d;
}
.panel::after, .crew-identity::after, .leave-reserve::after, .base-action::after,
.salary-summary::after, .leave-summary::after, .office-lounge::after {
  content: '';
  position: absolute;
  inset: 0;
  width: auto;
  height: auto;
  border: 0;
  border-radius: inherit;
  padding: 1px;
  transform: none;
  pointer-events: none;
  z-index: 1;
  background:
    radial-gradient(ellipse 190px 105px at 0% 0%, #edf9ffeb, #a3d0ff7c 40%, transparent 75%),
    radial-gradient(ellipse 150px 110px at 100% 100%, #abd8ffbd, #88bbff42 44%, transparent 77%),
    linear-gradient(135deg, #d7ebff42, transparent 28% 68%, #bad8ff30);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
}
.crew-identity { --glass-light: 198, 187, 172; --glass-fill: #14161b78; }
.crew-identity::before { opacity: .12; }
.leave-reserve { --glass-light: 141, 185, 235; --glass-fill: #10172278; }
.edge-glow { opacity: .55; animation-duration: 23s; }
.leave-reserve .edge-glow { animation-delay: -9s; }
.crew-identity:hover .edge-glow, .leave-reserve:hover .edge-glow { opacity: .7; }
.base-action.leave-entry {
  --glass-light: 165, 216, 204;
  --glass-fill: #101c1c72;
  background: radial-gradient(ellipse at 0% 0%, rgba(var(--glass-light), .095), transparent 56%), linear-gradient(140deg, #f3f7ff0d, #f3f7ff02 42%, #c0d8ff05), var(--glass-fill);
}
.base-action.salary-entry { --glass-light: 217, 192, 155; --glass-fill: #1a171477; }
.base-action.leave-entry .entry-code, .base-action.leave-entry .entry-symbol { color: #bae4d8; }
.base-action.salary-entry .entry-code, .base-action.salary-entry .entry-symbol { color: #e3ceb0; }
.base-action:hover, .base-action.salary-entry:hover {
  background: linear-gradient(140deg, #e9f2ff14, #d5e5ff06), var(--glass-fill);
  border-color: #cce7ff90;
  box-shadow: inset 0 1px #ffffff20, 0 0 24px #98c6ff15, 0 16px 32px #0005;
}
.identity-details, .reserve-caption { border-color: #e0e9f51c; }
.identity-copy > p, .identity-job > span, .identity-details dt { color: #aeb7c5; }
.identity-team { color: #d5cabb; }
.identity-title { background: #e7efff07; border-color: #e6f0ff29; }
.entry-copy small, .salary-entry .entry-copy small { color: #afb8c6; }
.reserve-facts p, .reserve-number > span { color: #b0bccb; }
.gauge-track { stroke: #d6e8ff13; }
.gauge-value { stroke: #bbddff; filter: drop-shadow(0 0 4px #91c7ff48); }
.gauge-ticks { stroke: #91aec7; opacity: .55; }

/* Softer primary buttons: keep their action clear, remove broad pale-blue slabs. */
.btn.primary {
  color: #eff6ff;
  border-color: #c5e2ff69;
  background: linear-gradient(125deg, #9fcaff30, #79afff16);
  box-shadow: inset 0 1px #e3f2ff28, 0 0 12px #87b9ff09;
}
.btn.primary:hover {
  background: linear-gradient(125deg, #b9deff45, #8bbdff28);
  border-color: #d9edffa1;
  box-shadow: inset 0 1px #f4faff36, 0 0 18px #87b9ff18;
}
.btn.secondary, .btn:not(.text):not(.primary):not(.danger) { border-color: #d3e4fa35; }
.btn.text { color: #c5ddfa; }
.btn:not(.primary):not(.danger):hover { background-color: #d4e4ff0b; }
.btn:focus-visible, button:focus-visible, a:focus-visible { outline-color: #d3e9ff; }
.icon-button, input, select, textarea { border-color: #d9e6f52b; }
input, select, textarea { background-color: #080d17a3; color: #eaf0f9; }
input:focus, select:focus, textarea:focus { border-color: #c5e5ffa1; }
.badge.neutral { background: #d5e5ff05; border-color: #d2dfed32; color: #c5cdd8; }
.badge.green { background: #84c9b810; border-color: #a4dcc43d; color: #bfe0d1; }

/* Game cover materials carry a little color, cards stay almost neutral. */
.board-tile { transition: border-color .25s, box-shadow .25s; }
.board-tile:hover {
  border-color: #d2e9ffa1;
  box-shadow: inset 0 1px #f1f8ff21, 0 0 25px #98c6ff13, 0 18px 38px #0103073d;
}
.board-tile-content > p { font-size: 12px; color: #b3bac8; }
.board-player-count { color: #aab4c3; }
.board-tile-top > span { color: #c1cbd9; }
.board-poster {
  background: radial-gradient(ellipse at 55% 65%, rgba(var(--cover-light), .14), transparent 76%), #080d1557;
  border-color: #e2eaf52a;
  box-shadow: inset 0 1px #f5f9ff05;
}
.board-poster > .board-cover-tag { background: #070b1375; border-color: #edf4ff24; color: #ced6e2; }
.draw-tile { --cover-light: 213, 182, 135; --glass-light: 183, 177, 168; }
.code-tile { --cover-light: 111, 181, 162; --glass-light: 149, 194, 180; }
.mystery-tile { --cover-light: 196, 150, 106; --glass-light: 181, 161, 137; }
.spy-tile { --cover-light: 159, 141, 210; --glass-light: 173, 170, 202; }
.blocks-tile { --cover-light: 123, 178, 224; --glass-light: 153, 186, 216; }
.bricks-tile { --cover-light: 187, 137, 158; --glass-light: 191, 174, 180; }
.draw-tile .board-tile-top > span { color: #dfcdb0; }
.code-tile .board-tile-top > span { color: #b5d8c9; }
.mystery-tile .board-tile-top > span { color: #dcc3a6; }
.spy-tile .board-tile-top > span { color: #ccc0e5; }
.bricks-tile .board-tile-top > span { color: #dfc3d0; }
.mini-word-grid > span { background: linear-gradient(135deg, #b8d6c91c, #1b302d5c); border-color: #cce8db3c; color: #dfebe5; }
.case-poster { background: linear-gradient(135deg, #c3a77d21, #28221b78); border-color: #e8d3b34f; color: #dacbb6; }
.board-poster .drawing-art { filter: drop-shadow(0 9px 12px #0005); }
.game-category-tabs { background: #10141a80; border-color: #dae4f528; }
.game-category-tabs > button { color: #b1bbc9; }
.game-category-tabs > button > span { color: #929eae; }
.game-category-tabs > button.selected { background: linear-gradient(130deg, #deedff1c, #bccde70a); box-shadow: inset 0 1px #eaf3ff18; }
.game-kind-filters button, .game-kind-filters button:hover { background: #12172266; border-color: #d1e0f326; color: #b7c3d3; }
.game-kind-filters button.selected { background: #d5e8ff12; border-color: #d4e9ff69; color: #e2efff; }
.office-lounge { --glass-fill: #11161d80; border-radius: 20px; }
.office-floor { background: #0a0d1454; }
.lounge-copy p { color: #b3bac8; }
.game-card { --glass-fill: #10161c80; }
.game-card::before { display: none; }

/* Tables and forms need stable readable fills even with light in the backdrop. */
.salary-summary, .leave-summary, .monthly-leave-panel, .panel:has(.data-table), .settings-grid .panel, .calendar-panel { --glass-fill: #11151cba; }
.monthly-stats { background: #dcecff06; }
.monthly-stats > div + div, .monthly-header, .monthly-chart-note { border-color: #dbe7fa1e; }
.leave-chart-row.is-highest { background: #b0d6ff0a; }
.leave-chart-row:hover { background: #d2e6ff0b; }
.leave-chart-track { background-color: #dce9ff0a; }
.mobile-leave-card, .mobile-salary-card { background: #14192299; border-color: #d4e6ff36; }
.modal {
  border: 1px solid #c4e1ff87;
  background: linear-gradient(140deg, #cce4ff0c, #cce4ff02 50%), #0d111ae8;
  -webkit-backdrop-filter: blur(28px);
  backdrop-filter: blur(28px);
  box-shadow: inset 0 1px #e5f3ff36, 0 0 25px #8dbcf414, 0 24px 90px #0009;
}
.modal::backdrop { background: #02040b75; -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); }
.modal-head { background: #151c280f; border-color: #d5e5fb25; }
.modal-actions { background: #0d131c87; border-color: #d5e5fb25; }
.modal-head > p, .helper-text { color: #aeb9ca; }
.board-room .board-form { background: #c9ddff06; border-color: #d2e2ff2b; }
.board-local-note { color: #9da9ba; }
.brick-gallery > article { background: #d0e1ff05; border-color: #d8e8ff36; }
.brick-thumbnail { background: radial-gradient(ellipse at 50% 70%, #8ab7d80c, transparent 75%), #0c101833; }
.board-room-intro > p { color: #aeb9ca; }
.code-clue { background: linear-gradient(130deg, #b4d8c811, #97bfb305); border-color: #c4e4d941; }
.code-clue > span, .code-clue > small { color: #b6c7c0; }
.code-clue > strong { color: #e2efe8; }
.code-clue b { background: #b9d8cc16; border-color: #d0e7db35; }
.code-word { background: linear-gradient(135deg, #eef2f909, #eef2f903); border-color: #d4deed30; color: #e1e5ec; }
.code-word > small { color: #b4bdcb; }
.code-word.target { background: linear-gradient(135deg, #9edbc126, #7eb6a10f); border-color: #a9d8c26e; }
.code-word.trap { background: linear-gradient(135deg, #dc9caf26, #b9869710); border-color: #ddafbd6e; }
.code-word.neutral { background: #e1d9c015; border-color: #dcd6c844; }
.code-word:enabled:hover { border-color: #e5f2ff83; }
.mystery-puzzle { background: radial-gradient(ellipse at 0 0, #d4b59016, transparent 75%), #16130f35; border-color: #e1cdb34f; }
.mystery-puzzle > span { color: #d4c0a7; }
.spy-score > span, .spy-seats > div, .blocks-leaderboard > article { background: #e1edff05; border-color: #d2e3fb2a; }
.arcade-hero { background: radial-gradient(ellipse at 0 0, #a4d8e215, transparent 75%), #d0e2ff04; }
.form-person, .leave-estimate { background: #cce0ff07; border-color: #d3e7ff38; }
.data-table th { background: #070c1570; color: #b2bfce; }
.data-table tbody tr:hover { background: #d8eaff07; }

@media (max-width: 760px) {
  .space-halo { width: 670px; height: 670px; top: 25px; right: -400px; opacity: .5; }
  .space-stars { background-size: 383px 477px; opacity: .45; }
  .space-stars.distant { display: none; }
  .space-meteor { top: 16%; left: 104%; width: 105px; animation-duration: 32s; }
  .space-meteor.second, .space-meteor.third { display: none; }
  .panel, .crew-identity, .leave-reserve, .base-action, .base-action.salary-entry,
  .salary-summary, .leave-summary, .office-lounge { -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
  .topbar { background: #080b11e8; }
  .sidebar { background: #0b0e16f5; }
}
@media (hover: none) {
  .board-tile:hover { border-color: var(--glass-edge); box-shadow: inset 0 1px #f4f9ff12, 0 18px 38px #0103073d; }
  .crew-identity:hover .edge-glow, .leave-reserve:hover .edge-glow { opacity: .55; }
}
@media (prefers-reduced-motion: reduce) {
  .space-meteor { display: none; animation: none; }
  .edge-glow { animation: none; opacity: .3; }
  .board-tile, .base-action, .btn { transition: none; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .panel, .crew-identity, .leave-reserve, .base-action, .base-action.leave-entry, .base-action.salary-entry,
  .salary-summary, .leave-summary, .office-lounge, .modal { background: #171c26; }
}
@media (prefers-reduced-transparency: reduce) {
  .panel, .crew-identity, .leave-reserve, .base-action, .base-action.leave-entry, .base-action.salary-entry,
  .salary-summary, .leave-summary, .office-lounge, .modal, .sidebar, .topbar {
    background: #171c26;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .space-halo { display: none; }
}
@media print {
  .space-scene, .panel::after, .crew-identity::after, .leave-reserve::after,
  .base-action::after, .salary-summary::after, .leave-summary::after, .office-lounge::after { display: none; }
  body, .content-shell, .modal, .modal-head, .modal-actions, .panel,
  .salary-summary, .leave-summary { background: white; color: #111; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
}

/* Remote work keeps the established neutral glass surface and adds a mint signal. */
.time-report-tabs{display:inline-flex;width:auto;margin:0 0 19px;max-width:100%}
.time-report-tabs>button{min-height:44px;padding-inline:22px}
.leave-color-wfh{background:linear-gradient(90deg,#75b9aa,#acd8c8)}
.monthly-wfh-panel .leave-chart-row.is-highest{background:#9bd8c10a}
.monthly-wfh-panel .leave-chart-person small{color:#91b7ac}
.monthly-wfh-panel .leave-chart-row.is-selected{border-color:#99d3bf;box-shadow:inset 3px 0 #99d3bf}
.wfh-limit-tag{font-size:11px;white-space:nowrap;color:#afd1c4;padding:7px 11px;border:1px solid #b5d7cc26;border-radius:7px;background:#b1dbc208}
.wfh-pending-caption{color:#dfc69b;font-size:11px;line-height:1.8}
.wfh-allowance{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;padding:24px 28px;margin-bottom:24px}
.wfh-allowance h2{font-size:19px;margin-top:4px;font-weight:550}
.wfh-allowance>div>p{font-size:12px;line-height:1.9;margin-top:6px}
.wfh-quota-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;grid-column:1/-1;padding-top:14px;border-top:1px solid #d7e8df1c}
.wfh-quota-grid>div{min-width:0}
.wfh-quota-grid>div>span{font-size:11px;color:#a2b2ad;display:block}
.wfh-quota-grid strong{display:block;font:28px ui-monospace,monospace;margin-top:8px;color:#e4eee9}
.wfh-quota-grid strong>small{display:block;font:11px -apple-system,BlinkMacSystemFont,sans-serif;color:#9db5ab;margin-top:9px;line-height:1.7}
.wfh-allowance .wfh-quota-note{grid-column:1/-1;font-size:10px;line-height:1.9;color:#91a49e}
.wfh-review-panel{margin-bottom:24px}
.wfh-review-list{padding:0 25px 12px}
.wfh-review-list>article{display:grid;grid-template-columns:160px minmax(0,1fr) auto;align-items:center;gap:20px;padding:18px 0;border-top:1px solid #d5e3df1a}
.wfh-request-copy{min-width:0}
.wfh-request-copy strong{font-size:13px;font-weight:500;line-height:1.9}
.wfh-request-copy p{font-size:12px;line-height:1.9;margin:4px 0;overflow-wrap:anywhere;white-space:pre-wrap}
.wfh-request-copy small{font-size:10px;color:#d6bd98;line-height:1.9;overflow-wrap:anywhere}
.wfh-month-estimates{width:100%;display:grid;gap:11px}
.wfh-month-estimate{border-top:1px solid #cadbd51a;padding-top:12px;min-width:0}
.wfh-month-estimate>span{display:block;font-size:11px;color:#9db8ac}
.wfh-month-estimate>strong{display:block;font:12px -apple-system,BlinkMacSystemFont,sans-serif!important;line-height:1.9;margin-top:5px;color:#d6e9df}
.wfh-month-estimate>small{display:block;font-size:11px;line-height:1.9;margin-top:4px;color:#9ab9ac}
.wfh-month-estimate.over-limit>small{color:#e5c297}
.wfh-exception-box{padding:16px 19px;border:1px solid #d3b99340;background:#bb926a0b;border-radius:11px;margin:0 0 23px}
.wfh-exception-box .checkbox-field{font-size:12px}
.wfh-exception-box .checkbox-field small{display:block;font-size:11px;color:#b7ad9d;margin-top:4px}
.wfh-exception-box .field{margin-top:16px;margin-bottom:12px}
.wfh-exception-box .helper-text{margin-bottom:0}
.wfh-detail-callout{padding:13px 16px;border:1px solid #d9b78536;border-radius:9px;background:#bda17409;color:#e4cba6;font-size:12px;line-height:1.9;margin-bottom:19px}
.work-plan-copy{white-space:pre-wrap;overflow-wrap:anywhere}
.wfh-detail-actions{flex-wrap:wrap}
.time-status-filter{flex-wrap:wrap}
.time-status-filter>button{min-height:40px}
@media(max-width:760px){
 .wfh-allowance{grid-template-columns:minmax(0,1fr);padding:22px 20px;gap:17px}
 .wfh-allowance h2{font-size:18px}
 .wfh-allowance>div>p{font-size:11px}
 .wfh-quota-grid{gap:13px}
 .wfh-quota-grid strong{font-size:26px}
 .wfh-quota-grid strong>small{font-size:10px}
 .wfh-review-list{padding-inline:20px}
 .wfh-review-list>article{grid-template-columns:minmax(0,1fr) auto;gap:13px}
 .wfh-request-copy{grid-column:1/-1;grid-row:2}
 .wfh-review-list>article>.btn{grid-column:2;grid-row:1;min-height:44px}
 .time-report-tabs{display:flex;width:100%}
 .time-report-tabs>button{flex:1;padding-inline:10px;font-size:12px}
 .time-status-filter{width:100%;justify-content:flex-start}
 .time-status-filter>button{padding:7px 9px;min-height:44px;font-size:11px}
 .wfh-exception-box{padding:15px}
 .wfh-detail-actions>.btn{flex:1;min-height:44px}
 .monthly-wfh-panel .leave-chart-value strong{font-size:15px}
 .monthly-wfh-panel .leave-chart-value strong small{font-size:9px}
}
@media(max-width:360px){
 .wfh-quota-grid{gap:8px}
 .wfh-quota-grid strong{font-size:23px}
 .wfh-quota-grid strong>small{font-size:9px}
 .monthly-wfh-panel .leave-chart-value strong small{display:block;line-height:1.3}
 .time-status-filter>button{font-size:10px;padding-inline:7px}
}