/* The original muted green, used for the site rather than the app symbols. */
body.keyset,body.brand-keyset{
  --ground:#F2F5F2;
  --white:#FCFDFC;
  --line:#D4DDD5;
  --accent:#426357;
  --accent-hover:#304D41;
  --sage-surface:#E7EDE8;
  --sage-border:#BDCCC1;
}
.keyset ::selection,.brand-keyset ::selection{background:#CBDCCD}
.keyset .button:hover,.brand-keyset .button:hover{background:var(--accent-hover)}
.keyset .button.secondary,.brand-keyset .button.secondary{color:var(--accent);border-color:var(--sage-border)}
.keyset .button.secondary:hover,.brand-keyset .button.secondary:hover{background:var(--sage-surface)}
.keyset .text-link,.brand-keyset .text-link{color:var(--accent)}
.keyset .site-nav>a:not(.button):hover{color:var(--accent)}

/* A hint of sage on selection; black glyphs and gray names stay neutral. */
.keyset .demo-key{background:#B7C3BA}
.keyset .demo-key-face{background:#F9FBF9;border-color:#C6D0C8}
.keyset .demo-key[aria-pressed=true] .demo-key-face{background:var(--sage-surface);border-color:#AABEB1}
.keyset .app-choice:hover{background:var(--sage-surface)}
.keyset .app-choice[aria-pressed=true]{background:var(--white);border-color:var(--sage-border)}
.keyset .keypad{background:#DCE4DD;box-shadow:0 10px 0 #B6C2B9,0 13px 0 #A4B2A8,0 36px 38px -16px #3E584F24,inset 0 1px 0 #F9FBF9}
.keyset .preview-picture{background:#E7EDE8}
.keyset .files-demo{background:#F9FBF9;border-color:var(--line)}

/* Carry the same accent into app pages and the brand review. */
.keyset.product-page .product-nav{background:#F2F5F2F2}
.keyset .product-photo{background:var(--sage-surface)}
.keyset .product-screen>div{border-color:var(--line)}
.keyset .bundle-offer .button{border-color:var(--sage-border)}
.brand-keyset .context-sample{background:var(--sage-surface)}
.brand-keyset .mini-dock{background:#DCE4DD;border-color:var(--sage-border)}
.brand-keyset .awake-states button[aria-pressed=true]{border-color:var(--accent);background:var(--white);box-shadow:0 2px 0 #BDCBBF}
.brand-keyset .awake-states button:hover{background:#F1F5F1}
.brand-keyset .concept-toggle a[aria-current=page]{background:var(--accent)}