/* Flat monochrome controls. Backgrounds and page composition stay in v28. */
.work .filters{display:flex;flex-wrap:wrap;gap:8px;width:auto;max-width:none;padding:0;background:none;border:0;border-radius:0;box-shadow:none;overflow:visible}
.work .filter{
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  min-width:0;min-height:44px;margin:0;padding:11px 17px;
  color:#d7d7dc;background:#292b33;border:1px solid transparent;border-radius:999px;
  font-size:12px;font-weight:500;line-height:1.2;letter-spacing:0;white-space:nowrap;
  transform:none;box-shadow:none;
  transition:background-color .2s ease,color .2s ease;
}
.work .filter span{position:static;inset:auto;display:inline;margin:0 0 0 6px;font-family:Manrope,sans-serif;font-size:9px;font-weight:500;line-height:1;opacity:.65;letter-spacing:0;transform:translateY(-1px)}
.work .filter:before,.work .filter:after{display:none}
.work .filter.active,.work .filter[aria-pressed=true]{color:#191a20;background:#f6f6f2;border-color:transparent;box-shadow:none;font-weight:600;transform:none}
.work .filter.active span{color:inherit;opacity:.65}
.work .filter:focus-visible{outline:2px solid #f3f3ee;outline-offset:4px}
.pill,.pill-white{border-radius:999px;background:#f6f6f2;color:#191a20;border:1px solid transparent;box-shadow:none;transition:background-color .2s ease,color .2s ease,transform .2s ease}
.pill-outline{color:#f2f2f2;background:#292c37;border-color:transparent;box-shadow:none}
.deck-nav{border-radius:50%;color:#191a20;background:#f6f6f2;border:0;box-shadow:none;transition:background-color .2s ease,transform .2s ease}
#work-grid.work-deck .card-play,#work-grid.work-deck .card-open:hover .card-play,#work-grid.work-deck .is-selected .card-play{border-radius:50%;color:#191a20;background:#f6f6f2;border:0;box-shadow:none}
.header-contact.round-link{display:inline-flex;align-items:center;justify-content:center;gap:15px;width:auto;min-width:124px;min-height:44px;padding:0 21px;border-radius:999px;color:#f6f6f2;background:#292c37;border:0;box-shadow:none;transform:none;font-size:12px;font-weight:600}
.button-dot{width:4px;height:4px;display:inline-block;border-radius:50%;background:currentColor;flex:none}
.menu-toggle{flex-direction:row;gap:10px;width:82px;height:42px;min-height:42px;border-radius:999px;color:#191a20;background:#f6f6f2;border:0;box-shadow:none;flex-shrink:0}
.menu-toggle .menu-label,.menu-toggle .menu-dots{display:inline-block;width:auto;height:auto;margin:0;background:none;transform:none;line-height:1}
.menu-toggle .menu-label{font-size:12px;font-weight:600}
.menu-toggle .menu-dots{font-family:Arial,sans-serif;font-size:17px;letter-spacing:-2px;padding-right:2px}
.menu-toggle[aria-expanded=true] span.menu-label,.menu-toggle[aria-expanded=true] span.menu-dots{transform:none}
.menu-toggle[aria-expanded=true] .menu-label{font-size:0}
.menu-toggle[aria-expanded=true] .menu-label:after{content:'关闭';font-size:12px}
.menu-toggle[aria-expanded=true] .menu-dots{font-size:0}
.menu-toggle[aria-expanded=true] .menu-dots:after{content:'×';font-size:20px;letter-spacing:0}
.dialog-close{border-radius:50%;color:#191a20;background:#f6f6f2;border:0;box-shadow:none}
@media(hover:hover){
  .work .filter:hover{background:#3a3d46;color:#fff;border-color:transparent;box-shadow:none;transform:none}
  .work .filter.active:hover{background:#dededb;color:#191a20;border-color:transparent;box-shadow:none;transform:none}
  .pill:hover,.pill-white:hover{color:#191a20;background:#dededb;box-shadow:none;transform:translateY(-2px)}
  .pill-outline:hover,.header-contact.round-link:hover{color:#fff;background:#3a3d48;border-color:transparent;box-shadow:none;transform:none}
  .deck-nav:hover{background:#dededb;border-color:transparent;transform:translateY(-1px)}
  #work-grid.work-deck .card-open:hover .card-play{background:#dededb}
}
@media(max-width:767px){
  .site-header{gap:12px}
  .work .filters{gap:6px;padding:0;max-width:none;border-radius:0}
  .work .filter{min-height:44px;padding:10px 11px;font-size:12px;border-radius:999px}
  .work .filter span{margin-left:4px;font-size:8px}
  .deck-nav{width:44px;height:44px;border-radius:50%}
}
@media(max-width:359px){
  .work .filters{gap:4px}
  .work .filter{min-width:44px;min-height:44px;padding:10px 6px;font-size:11px}
  .work .filter span{margin-left:3px;font-size:8px}
  .menu-toggle{width:76px;gap:8px}
}
