/* NOUTMARKET_BUTTON_MOTION_V7 */
/* Shared, composited, low-motion-first controls. Site + Knowledge Centre. */
:root{--nm-motion-ease:cubic-bezier(.2,.8,.2,1);--nm-motion-ring:0 0 0 4px rgba(37,99,235,.16)}
body.nm-v7 :is(button,.btn,a[role="button"],.nm-card-foot a){
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  transition:transform .2s var(--nm-motion-ease),box-shadow .22s var(--nm-motion-ease),
   border-color .2s ease,background-color .2s ease,color .2s ease,filter .2s ease;
}
/* Lift only recognisable push buttons, not positioned image/gallery controls. */
@media(hover:hover) and (pointer:fine){
  body.nm-v7 :is(.btn,.nm-searchbox button,.nm-category-chips button,
   .nm-pages button,.nm-like,.nm-comment-submit,.nm-comment-actions button,
   .nm-reply-context button,.nm-emoji-bar button,.mobile-quick-nav .mq-item,
   .messenger-btn,.nm-card-foot a):not(:disabled):not([aria-disabled="true"]):hover{
    transform:translateY(-2px);
    filter:brightness(1.035);
    box-shadow:0 9px 22px rgba(20,70,140,.15),0 2px 5px rgba(15,23,42,.06);
  }
}
body.nm-v7 :is(.btn,.nm-searchbox button,.nm-category-chips button,
 .nm-pages button,.nm-like,.nm-comment-submit,.nm-comment-actions button,
 .nm-reply-context button,.nm-emoji-bar button,.mobile-quick-nav .mq-item,
 .messenger-btn,.nm-card-foot a):not(:disabled):not([aria-disabled="true"]):active{
  transform:translateY(1px) scale(.975);
  filter:brightness(.96);
  box-shadow:inset 0 2px 6px rgba(15,23,42,.10),0 2px 4px rgba(15,23,42,.05);
  transition-duration:.085s;
}
body.nm-v7 :is(button,.btn,a[role="button"],.nm-card-foot a):focus-visible{
 outline:3px solid #60a5fa;outline-offset:3px;box-shadow:var(--nm-motion-ring);
}
body.nm-v7 :is(button,.btn)[disabled],body.nm-v7 :is(button,.btn)[aria-disabled="true"]{
 cursor:not-allowed;opacity:.56;filter:none;transform:none;box-shadow:none;
}
/* Main storefront calls-to-action: colour shift, soft glow, no layout reflow. */
body.nm-v7 .btn:not(.secondary):not(.ghost):not(.danger){
 background-size:160% 160%;background-position:0% 45%;
 border-radius:14px;box-shadow:0 9px 23px rgba(37,99,235,.19);
}
@media(hover:hover) and (pointer:fine){
 body.nm-v7 .btn:not(.secondary):not(.ghost):not(.danger):hover{
  background-position:100% 55%;box-shadow:0 12px 30px rgba(37,99,235,.3),0 0 0 1px rgba(37,99,235,.13);
 }
 body.nm-v7 .btn.secondary:hover{border-color:#9ec4f8;background:#f3f8ff;color:#164e9b}
}
/* Blog: primary submit becomes a reassuring, recognizable CTA. */
body.nm-v7 .nm-comment-submit{
 min-height:46px;border-radius:13px;border:1px solid #1d5cd0;
 background:linear-gradient(120deg,#2563eb,#1f74ec 52%,#0d94cb);
 background-size:170% 170%;color:#fff;font-weight:800;
 box-shadow:0 7px 20px rgba(37,99,235,.16);
}
@media(hover:hover) and (pointer:fine){
 body.nm-v7 .nm-comment-submit:hover{
  background-position:100% 55%;color:white;
  box-shadow:0 12px 28px rgba(37,99,235,.25),0 0 0 1px rgba(37,99,235,.14);
 }
}
/* Like: visually different from submit, warm accent. */
body.nm-v7 .nm-like{min-height:44px;border-radius:13px;background:#fff4f6;
 color:#b82951;border:1px solid #fac0d0;box-shadow:0 4px 11px rgba(196,32,77,.06)}
@media(hover:hover) and (pointer:fine){
 body.nm-v7 .nm-like:hover{background:#ffe4eb;color:#a41945;border-color:#eb88a5;
  box-shadow:0 9px 20px rgba(196,32,77,.15)}
}
/* Stars: hover preview and keyboard behavior remain entirely in v5 JS. */
body.nm-v7 .nm-engagement .nm-stars button{border-radius:9px;
 transition:transform .16s var(--nm-motion-ease),color .12s ease,filter .16s ease}
@media(hover:hover) and (pointer:fine){
 body.nm-v7 .nm-engagement .nm-stars button:hover{transform:translateY(-2px) scale(1.15) rotate(-3deg);filter:drop-shadow(0 2px 3px rgba(231,160,31,.2))}
}
body.nm-v7 .nm-engagement .nm-stars button:active{transform:scale(.92)}
/* Discrete discussion tools, modern soft buttons, emoji playful but accessible. */
body.nm-v7 :is(.nm-comment-actions button,.nm-reply-context button){
 min-height:38px;padding:8px 12px;background:#fff;border:1px solid #d0dcf0;
 border-radius:11px;color:#28518c;font-weight:680}
@media(hover:hover) and (pointer:fine){
 body.nm-v7 :is(.nm-comment-actions button,.nm-reply-context button):hover{
  background:#eaf2ff;border-color:#89b5ee;color:#153f88}
}
body.nm-v7 .nm-emoji-bar button{min-width:44px;min-height:44px;border-radius:12px;
 border-color:#d7e2f2;background:#fff;box-shadow:0 3px 7px rgba(20,55,96,.05)}
@media(hover:hover) and (pointer:fine){
 body.nm-v7 .nm-emoji-bar button:hover{background:#eaf2ff;border-color:#93b9ec;
  transform:translateY(-2px) scale(1.08) rotate(-3deg)}
}
/* Search/category/pagination, and card CTA. */
body.nm-v7 :is(.nm-searchbox button,.nm-category-chips button,.nm-pages button){
 border-radius:12px;border:1px solid #c5d7f0;background:#f8fbff;
 color:#2156a3;box-shadow:0 3px 8px rgba(27,79,142,.05)}
@media(hover:hover) and (pointer:fine){
 body.nm-v7 :is(.nm-searchbox button,.nm-category-chips button,.nm-pages button):hover{
  background:#e9f2ff;border-color:#93baf0;color:#174da7}
}
body.nm-v7 .nm-category-chips button.active,
body.nm-v7 .nm-pages button[aria-current]{background:linear-gradient(125deg,#2363e4,#0e8ccf);
 border-color:#1c67da;color:#fff}
body.nm-v7 .nm-card-foot a{display:inline-flex;align-items:center;min-height:38px;
 padding:8px 11px;border:1px solid #d0e1f8;border-radius:11px;
 background:linear-gradient(135deg,#f4f8ff,#ecf5ff);color:#1253a5;text-decoration:none;
 font-weight:800;box-shadow:0 3px 8px rgba(12,65,137,.06)}
@media(hover:hover) and (pointer:fine){
 body.nm-v7 .nm-card-foot a:hover{color:#094b99;background:#e6f1ff;border-color:#8bbcf3;text-decoration:none}
 body.nm-v7 .nm-result-card:hover{border-color:#b8d4f4;box-shadow:0 9px 23px rgba(27,65,111,.11)}
}
/* Input states: cohesive with buttons and proper mobile tap dimensions. */
body.nm-v7 :is(.nm-comment-form input,.nm-comment-form textarea,.nm-searchbox input,
 .nm-filters select){transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}
body.nm-v7 :is(.nm-comment-form input,.nm-comment-form textarea,.nm-searchbox input,
 .nm-filters select):focus-visible{outline:0;border-color:#70aaf0;box-shadow:0 0 0 4px rgba(37,99,235,.12)}
@media(max-width:590px){
 body.nm-v7 :is(.nm-comment-submit,.nm-like){min-height:46px}
 body.nm-v7 .nm-card-foot a{min-height:44px}
 body.nm-v7 .nm-engagement :is(.nm-comment-actions button,.nm-emoji-bar button){min-height:44px}
}
/* Hover does not stick on phones. Tap feedback remains. */
@media(hover:none){
 body.nm-v7 :is(.btn,.nm-comment-submit,.nm-like,.nm-comment-actions button,
 .nm-emoji-bar button,.nm-category-chips button,.nm-pages button,.nm-card-foot a):hover{
  transform:none;filter:none}
}
/* Respect OS preference, including article effects and root site's older rules. */
@media(prefers-reduced-motion:reduce){
 body.nm-v7 :is(button,.btn,a[role="button"],.nm-card-foot a,
 .nm-comment-form input,.nm-comment-form textarea,.nm-filters select){
  animation:none!important;transition:none!important;transform:none!important}
}
